/* ====================================
ROOT VARIABLES
==================================== */

:root{

    --bg:#f6f4fb;

    --white:#ffffff;

    --text:#111111;

    --text-light:#666666;

    --purple:#7b2cbf;

    --indigo:#5a5df0;

    --cyan:#44c7cf;

    --teal:#157a74;

    --orange:#ff8a00;

    --border:#ebe7f5;

    --gradient:
    linear-gradient(
        135deg,
        #7b2cbf,
        #5a5df0,
        #44c7cf
    );

    --shadow:
    0 20px 60px rgba(123,44,191,.08);

    --radius:28px;

}


/* ====================================
RESET
==================================== */

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{

    font-family:
    'Plus Jakarta Sans',
    sans-serif;

    background:var(--bg);

    color:var(--text);

    overflow-x:hidden;

}

img{
    max-width:100%;
    display:block;
}

a{
    text-decoration:none;
}

button{
    border:none;
    cursor:pointer;
    font-family:inherit;
}

.container{

    width:min(1200px,92%);

    margin:auto;

}


/* ====================================
FLOATING BLOBS
==================================== */

.blob{

    position:fixed;

    border-radius:50%;

    filter:blur(100px);

    opacity:.12;

    z-index:-1;

    pointer-events:none;

}

.blob-1{

    width:320px;
    height:320px;

    background:#7b2cbf;

    top:-100px;
    left:-100px;

}

.blob-2{

    width:260px;
    height:260px;

    background:#44c7cf;

    bottom:-80px;
    right:-80px;

}


/* ====================================
GRADIENT TEXT
==================================== */

.gradient-text {

    display: inline-block;

    background: linear-gradient(
        135deg,
        #7b2cbf,
        #5a5df0,
        #44c7cf
    );

    background-size: 200% 200%;

    -webkit-background-clip: text;
    background-clip: text;

    -webkit-text-fill-color: transparent;
    color: transparent;

}

/* ====================================
SECTION HEADING
==================================== */
/* ====================================
SECTION HEADING
==================================== */

.section-heading{

    text-align:center;

    max-width:850px;

    margin:0 auto 70px;

}

/* ONLY THE SMALL WHITE PILL */

.section-heading > span{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:10px 22px;

    border-radius:999px;

    background:#ffffff;

    border:1px solid var(--border);

    color:var(--purple);

    font-size:.85rem;

    font-weight:700;

    letter-spacing:2px;

    text-transform:uppercase;

    margin-bottom:22px;

    -webkit-text-fill-color:var(--purple);

}

/* BIG HEADING */

.section-heading h2{

    font-size:clamp(2.5rem,5vw,4.8rem);

    line-height:1.05;

    font-weight:800;

    margin-bottom:20px;

    letter-spacing:-2px;

    color:var(--text);

}

/* GRADIENT WORD INSIDE H2 */

.section-heading h2 .gradient-text{

    background:var(--gradient);

    background-clip:text;

    -webkit-background-clip:text;

    -webkit-text-fill-color:transparent;

    color:transparent;

    display:inline;

}

.section-heading p{

    color:var(--text-light);

    line-height:1.9;

    font-size:1.05rem;

}

/* ====================================
NAVBAR
==================================== */

.mandamus-navbar{

    position:fixed;

    top:20px;

    left:50%;

    transform:
    translateX(-50%);

    width:min(1280px,95%);

    z-index:9999;

}

.navbar-container{

    display:flex;

    justify-content:space-between;

    align-items:center;

    padding:16px 28px;

    background:
    rgba(255,255,255,.75);

    backdrop-filter:
    blur(20px);

    border:
    1px solid rgba(255,255,255,.3);

    border-radius:22px;

    box-shadow:
    var(--shadow);

}

.logo{

    display:flex;

    align-items:center;

    gap:12px;

}

.logo img{

    width:52px;
    height:52px;

    object-fit:contain;

}

.logo h3{

    color:var(--text);

    font-size:1.1rem;

}

.logo span{

    font-size:.7rem;

    color:var(--purple);

    letter-spacing:2px;

}

.nav-links{

    display:flex;

    list-style:none;

    gap:35px;

}

.nav-links a{

    color:#333;

    font-weight:600;

    transition:.3s;

}

.nav-links a:hover{

    color:var(--purple);

}

.enroll-btn{

    padding:14px 24px;

    background:var(--gradient);

    color:white;

    border-radius:999px;

    font-weight:700;

    transition:.35s;

}

.enroll-btn:hover{

    transform:
    translateY(-3px);

}

.mobile-toggle{

    display:none;

    font-size:1.4rem;

    cursor:pointer;

}

.mobile-menu{

    position:fixed;

    top:0;
    right:-100%;

    width:300px;

    height:100vh;

    background:white;

    padding:40px 30px;

    z-index:10000;

    display:flex;

    flex-direction:column;

    gap:20px;

    transition:.4s ease;

    box-shadow:
    -20px 0 50px rgba(0,0,0,.08);

}

.mobile-menu.active{

    right:0;

}

.mobile-menu a{

    color:#222;

    font-weight:600;

    padding:12px 0;

}

.close-menu{

    background:none;

    font-size:1.4rem;

    align-self:flex-end;

}


/* ====================================
HERO SECTION
==================================== */

.mandamus-hero{

    min-height:100vh;

    display:flex;

    align-items:center;

    padding:
    170px 0 120px;

}

.hero-grid{

    display:grid;

    grid-template-columns:
    1.1fr .9fr;

    gap:80px;

    align-items:center;

}

.hero-badge{

    display:inline-flex;

    align-items:center;

    gap:10px;

    padding:12px 22px;

    border-radius:999px;

    background:white;

    border:
    1px solid var(--border);

    font-weight:700;

    margin-bottom:24px;

}

.hero-title{

    font-size:
    clamp(3.8rem,8vw,6.5rem);

    line-height:.95;

    font-weight:900;

    letter-spacing:-3px;

    margin-bottom:24px;

}

.hero-description{

    font-size:1.1rem;

    line-height:2;

    color:var(--text-light);

    max-width:650px;

}

.hero-buttons{

    display:flex;

    gap:16px;

    margin-top:35px;

    flex-wrap:wrap;

}

.primary-btn{

    padding:16px 30px;

    border-radius:999px;

    background:var(--gradient);

    color:white;

    font-weight:700;

    transition:.35s;

}

.primary-btn:hover{

    transform:
    translateY(-4px);

}

.secondary-btn{

    padding:16px 30px;

    border-radius:999px;

    background:white;

    color:#111;

    font-weight:700;

    border:
    1px solid var(--border);

    transition:.35s;

}

.secondary-btn:hover{

    transform:
    translateY(-4px);

}


/* ====================================
HERO STATS
==================================== */

.hero-stats{

    display:flex;

    gap:20px;

    margin-top:50px;

    flex-wrap:wrap;

}

.stat-card{

    background:white;

    padding:22px;

    border-radius:22px;

    min-width:140px;

    box-shadow:var(--shadow);

}

.stat-card h3{

    font-size:2rem;

    color:var(--purple);

}

.stat-card p{

    color:var(--text-light);

    margin-top:6px;

}


/* ====================================
LEGAL ORBIT
==================================== */

.hero-visual{

    display:flex;

    justify-content:center;

}

.legal-orbit{

    position:relative;

    width:500px;

    height:500px;

}

.orbit-circle{

    position:absolute;

    border-radius:50%;

    border:
    1px dashed
    rgba(123,44,191,.2);

}

.circle-1{

    inset:40px;

}

.circle-2{

    inset:90px;

}

.center-card{

    position:absolute;

    top:50%;
    left:50%;

    transform:
    translate(-50%,-50%);

    width:240px;

    background:white;

    border-radius:30px;

    padding:35px;

    text-align:center;

    box-shadow:var(--shadow);

}

.center-card h2{

    font-size:2rem;

    margin-bottom:10px;

}

.center-card span{

    color:var(--purple);

    font-weight:700;

}

.center-card p{

    margin-top:10px;

    color:var(--text-light);

}

.hero-icon{

    position:absolute;

    width:80px;
    height:80px;

    border-radius:50%;

    background:white;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:1.7rem;

    box-shadow:var(--shadow);

    animation:
    floatIcon 4s ease-in-out infinite;

}

.scale{
    top:10%;
    left:45%;
}

.gavel{
    top:45%;
    left:0;
}

.book{
    right:0;
    top:45%;
}

.law{
    left:45%;
    bottom:10%;
}

@keyframes floatIcon{

    0%,100%{
        transform:
        translateY(0);
    }

    50%{
        transform:
        translateY(-12px);
    }

}


/* ====================================
MOBILE
==================================== */

@media(max-width:992px){

    .nav-links,
    .enroll-btn{
        display:none;
    }

    .mobile-toggle{
        display:block;
    }

    .hero-grid{
        grid-template-columns:1fr;
    }

    .hero-visual{
        margin-top:50px;
    }

}

@media(max-width:768px){

    .hero-title{
        font-size:3.2rem;
        letter-spacing:-1px;
    }

    .legal-orbit{
        width:340px;
        height:340px;
    }

    .center-card{
        width:200px;
        padding:24px;
    }

    .hero-icon{
        width:60px;
        height:60px;
        font-size:1.2rem;
    }

    .hero-stats{
        flex-direction:column;
    }

}




/* ====================================
ABOUT SECTION
==================================== */

.about-mandamus{

    padding:140px 0;

}

.about-card{

    background:
    rgba(255,255,255,.7);

    backdrop-filter:
    blur(20px);

    border:
    1px solid rgba(255,255,255,.5);

    border-radius:36px;

    padding:50px;

    display:grid;

    grid-template-columns:
    1fr 1fr;

    gap:50px;

    box-shadow:var(--shadow);

}

.about-left h3{

    font-size:
    clamp(2rem,4vw,3rem);

    line-height:1.2;

    margin-bottom:20px;

}

.about-left p{

    line-height:2;

    color:var(--text-light);

}

.about-right{

    display:flex;

    flex-wrap:wrap;

    gap:18px;

    align-content:flex-start;

}

.feature-chip{

    background:white;

    padding:16px 20px;

    border-radius:18px;

    border:
    1px solid var(--border);

    display:flex;

    align-items:center;

    gap:12px;

    font-weight:600;

    transition:.35s;

    box-shadow:
    0 10px 25px rgba(0,0,0,.04);

}

.feature-chip:hover{

    transform:
    translateY(-5px);

    box-shadow:
    0 20px 40px rgba(123,44,191,.12);

}

.feature-chip i{

    color:var(--purple);

}


/* ====================================
EXAMS SECTION
==================================== */

.exams-section{

    padding:140px 0;

}

.exam-grid{

    display:grid;

    grid-template-columns:
    repeat(2,1fr);

    gap:30px;

}

.exam-card{

    background:white;

    border-radius:32px;

    padding:32px;

    position:relative;

    overflow:hidden;

    box-shadow:var(--shadow);

    transition:.4s ease;

}

.exam-card:hover{

    transform:
    translateY(-10px);

    box-shadow:
    0 35px 70px rgba(123,44,191,.15);

}

.exam-card::before{

    content:"";

    position:absolute;

    top:0;
    left:0;

    width:100%;
    height:5px;

}

.clat-card::before{
    background:#7b2cbf;
}

.pg-card::before{
    background:#42c6c6;
}

.ailet-card::before{
    background:#5a5df0;
}

.mhcet-card::before{
    background:#ff8a00;
}

.lsat-card::before{
    background:#e64980;
}

.exam-top{

    display:flex;

    align-items:flex-start;

    gap:18px;

    margin-bottom:25px;

}

.exam-icon{

    width:72px;
    height:72px;

    border-radius:22px;

    display:flex;

    align-items:center;

    justify-content:center;

    color:white;

    font-size:1.6rem;

    flex-shrink:0;

}

.purple{
    background:#7b2cbf;
}

.teal{
    background:#42c6c6;
}

.blue{
    background:#5a5df0;
}

.orange{
    background:#ff8a00;
}

.pink{
    background:#e64980;
}

.exam-tag{

    display:inline-block;

    background:#f3f0ff;

    color:var(--purple);

    padding:8px 14px;

    border-radius:999px;

    font-size:.8rem;

    font-weight:700;

    margin-bottom:12px;

}

.exam-card h3{

    font-size:2rem;

    margin-bottom:5px;

}

.exam-subtitle{

    color:var(--text-light);

}

.exam-description{

    line-height:1.9;

    color:var(--text-light);

    margin-bottom:25px;

}

.exam-highlights{

    display:grid;

    grid-template-columns:
    repeat(2,1fr);

    gap:14px;

    margin-bottom:25px;

}

.highlight{

    background:#faf8ff;

    padding:15px;

    border-radius:16px;

    font-size:.95rem;

}

.highlight strong{

    display:block;

    margin-bottom:4px;

    color:var(--purple);

}


/* ====================================
EXAM INFO
==================================== */

.exam-info{

    display:flex;

    flex-direction:column;

    gap:12px;

    margin-bottom:25px;

}

.info-item{

    display:flex;

    align-items:center;

    gap:12px;

}

.info-item i{

    color:var(--purple);

    width:20px;

}

.college-chips,
.subjects-list,
.career-path{

    display:flex;

    flex-wrap:wrap;

    gap:10px;

    margin-bottom:25px;

}

.college-chips span,
.subjects-list span,
.career-path span{

    padding:10px 14px;

    border-radius:999px;

    background:#f6f4fb;

    font-size:.85rem;

    font-weight:600;

}

.learn-btn{

    width:100%;

    padding:16px;

    border-radius:18px;

    background:var(--gradient);

    color:white;

    font-weight:700;

    transition:.35s;

}

.learn-btn:hover{

    transform:
    translateY(-3px);

}


/* ====================================
GLOW COLLEGE CARD
==================================== */

.glow-college{

    display:flex;

    align-items:center;

    gap:15px;

    background:
    linear-gradient(
        135deg,
        rgba(123,44,191,.08),
        rgba(68,199,207,.08)
    );

    padding:20px;

    border-radius:20px;

    margin-bottom:25px;

}

.glow-college i{

    font-size:2rem;

    color:var(--purple);

}

.glow-college h4{

    margin-bottom:5px;

}

.glow-college p{

    color:var(--text-light);

}


/* ====================================
LSAT COUNTER
==================================== */

.counter-card{

    text-align:center;

    background:
    linear-gradient(
        135deg,
        #7b2cbf,
        #44c7cf
    );

    color:white;

    padding:28px;

    border-radius:24px;

    margin-bottom:25px;

}

.counter-card h2{

    font-size:3.5rem;

    font-weight:900;

}

.counter-card p{

    opacity:.9;

}


/* ====================================
RESPONSIVE
==================================== */

@media(max-width:1100px){

    .exam-grid{
        grid-template-columns:1fr;
    }

    .about-card{
        grid-template-columns:1fr;
    }

}

@media(max-width:768px){

    .about-card{
        padding:30px;
    }

    .exam-card{
        padding:24px;
    }

    .exam-card h3{
        font-size:1.6rem;
    }

    .exam-highlights{
        grid-template-columns:1fr;
    }

    .exam-top{
        flex-direction:column;
    }

}




/* ====================================
SYLLABUS SECTION
==================================== */

.syllabus-section{
    padding:140px 0;
}

.syllabus-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:25px;
}

.syllabus-card{
    background:white;
    border-radius:30px;
    padding:35px;
    box-shadow:var(--shadow);
    transition:.4s;
    position:relative;
    overflow:hidden;
}

.syllabus-card:hover{
    transform:translateY(-10px);
    box-shadow:0 30px 70px rgba(123,44,191,.15);
}

.syllabus-card::before{
    content:'';
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:5px;
}

.english::before{ background:#7b2cbf; }
.gk::before{ background:#5a5df0; }
.legal::before{ background:#44c7cf; }
.logical::before{ background:#ff8a00; }
.maths::before{ background:#e64980; }

.syllabus-icon{
    width:75px;
    height:75px;
    border-radius:22px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:var(--gradient);
    color:white;
    font-size:1.7rem;
    margin-bottom:20px;
}

.syllabus-card h3{
    font-size:1.6rem;
    margin-bottom:12px;
}

.marks{
    display:inline-block;
    padding:8px 16px;
    border-radius:999px;
    background:#f3f0ff;
    color:var(--purple);
    font-weight:700;
    margin-bottom:20px;
}

.syllabus-card ul{
    list-style:none;
}

.syllabus-card li{
    padding:10px 0;
    color:var(--text-light);
    border-bottom:1px solid rgba(0,0,0,.05);
}

/* ====================================
COMPARISON SECTION
==================================== */

.comparison-section{
    padding:140px 0;
}

.comparison-grid{
    display:grid;
    grid-template-columns:repeat(5,1fr);
    gap:20px;
}

.comparison-card{
    background:white;
    border-radius:28px;
    padding:30px;
    text-align:center;
    box-shadow:var(--shadow);
    transition:.35s;
}

.comparison-card:hover{
    transform:translateY(-8px);
}

.comparison-card h3{
    font-size:1.5rem;
    margin-bottom:25px;
    color:var(--purple);
}

.compare-item{
    padding:14px;
    background:#faf8ff;
    border-radius:16px;
    margin-bottom:12px;
    font-size:.95rem;
}

/* ====================================
COLLEGES SECTION
==================================== */

.colleges-section{
    padding:140px 0;
}

.college-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:25px;
}

.college-card{
    background:white;
    padding:35px;
    border-radius:30px;
    text-align:center;
    box-shadow:var(--shadow);
    transition:.4s;
}

.college-card:hover{
    transform:translateY(-10px);
    box-shadow:0 30px 70px rgba(123,44,191,.15);
}

.college-logo{
    width:90px;
    height:90px;
    border-radius:50%;
    background:var(--gradient);
    color:white;
    display:flex;
    align-items:center;
    justify-content:center;
    margin:auto;
    margin-bottom:25px;
    font-weight:800;
}

.college-card h3{
    margin-bottom:12px;
}

.college-card p{
    color:var(--text-light);
    line-height:1.8;
}

/* ====================================
TIMELINE
==================================== */

.timeline-section{
    padding:140px 0;
}

.timeline{
    max-width:900px;
    margin:auto;
    position:relative;
}

.timeline::before{
    content:'';
    position:absolute;
    left:50%;
    top:0;
    width:4px;
    height:100%;
    transform:translateX(-50%);
    background:var(--gradient);
}

.timeline-item{
    width:50%;
    padding:20px 40px;
    position:relative;
}

.timeline-item:nth-child(odd){
    left:0;
    text-align:right;
}

.timeline-item:nth-child(even){
    left:50%;
}

.timeline-icon{
    width:65px;
    height:65px;
    border-radius:50%;
    background:var(--gradient);
    color:white;
    display:flex;
    align-items:center;
    justify-content:center;
    position:absolute;
    top:30px;
    right:-32px;
    z-index:2;
}

.timeline-item:nth-child(even) .timeline-icon{
    left:-32px;
}

.timeline-content{
    background:white;
    padding:28px;
    border-radius:24px;
    box-shadow:var(--shadow);
}

.timeline-content h3{
    margin-bottom:12px;
}

.timeline-content p{
    color:var(--text-light);
    line-height:1.8;
}

/* ====================================
CTA SECTION
==================================== */

.cta-section{
    padding:140px 0;
}

.cta-card{
    position:relative;
    overflow:hidden;
    padding:90px 50px;
    border-radius:40px;
    background:var(--gradient);
    text-align:center;
    color:white;
}

.cta-glow{
    position:absolute;
    width:300px;
    height:300px;
    border-radius:50%;
    background:white;
    opacity:.08;
    top:-80px;
    right:-50px;
    filter:blur(20px);
}

.cta-tag{
    display:inline-block;
    padding:10px 18px;
    border-radius:999px;
    background:rgba(255,255,255,.15);
    margin-bottom:20px;
}

.cta-card h2{
    font-size:clamp(3rem,6vw,5rem);
    line-height:1.1;
    margin-bottom:20px;
}

.cta-card p{
    max-width:700px;
    margin:auto;
    line-height:2;
    opacity:.95;
}

.cta-buttons{
    display:flex;
    justify-content:center;
    gap:20px;
    margin-top:35px;
}




.gradient-text {

    background:
    linear-gradient(
        135deg,
        #ff79c6,
        #7b2cbf,
        #44c7cf
    );

    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;

    filter:
    drop-shadow(
        0 8px 20px rgba(255,255,255,.15)
    );

}


.cta-card h2 {

    font-size:
        clamp(3rem, 7vw, 6rem);

    line-height: .95;

    letter-spacing: -3px;

    max-width: 900px;

    margin: 0 auto 25px;

    color: white;

}

.gradient-text {

    background:
    linear-gradient(
        135deg,
        #ff5db1,
        #8a4dff,
        #44c7cf
    );

    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;

}

/* ====================================
ENQUIRY MODAL
==================================== */

.enquiry-modal{
    position:fixed;
    inset:0;
    background:rgba(0,0,0,.45);
    display:none;
    align-items:center;
    justify-content:center;
    z-index:10000;
}

.enquiry-modal.active{
    display:flex;
}

.modal-box{
    background:white;
    width:min(500px,92%);
    padding:40px;
    border-radius:30px;
    position:relative;
}

.close-modal{
    position:absolute;
    top:20px;
    right:20px;
    background:none;
    font-size:1.2rem;
}

.enquiry-form{
    display:flex;
    flex-direction:column;
    gap:16px;
    margin-top:25px;
}

.enquiry-form input,
.enquiry-form select{
    padding:16px;
    border:1px solid var(--border);
    border-radius:16px;
    outline:none;
    font-family:inherit;
}

/* ====================================
WHATSAPP BUTTON
==================================== */

.whatsapp-btn{
    position:fixed;
    right:25px;
    bottom:25px;
    width:65px;
    height:65px;
    border-radius:50%;
    background:#25d366;
    color:white;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:1.8rem;
    z-index:999;
    box-shadow:0 15px 40px rgba(37,211,102,.35);
}

/* ====================================
FOOTER
==================================== */

.footer{
    background:white;
    padding:90px 0 40px;
}

.footer-grid{
    display:grid;
    grid-template-columns:2fr 1fr 1fr 1fr;
    gap:40px;
}

.footer-col h3,
.footer-col h4{
    margin-bottom:20px;
}

.footer-col p{
    color:var(--text-light);
    line-height:1.8;
}

.footer-col a{
    display:block;
    margin-bottom:12px;
    color:var(--text-light);
}

.social-icons{
    display:flex;
    gap:12px;
}

.social-icons a{
    width:45px;
    height:45px;
    border-radius:50%;
    background:#f6f4fb;
    display:flex;
    align-items:center;
    justify-content:center;
}

.footer-bottom{
    margin-top:50px;
    padding-top:25px;
    border-top:1px solid rgba(0,0,0,.05);
    text-align:center;
    color:var(--text-light);
}

/* ====================================
RESPONSIVE
==================================== */

@media(max-width:1100px){

    .syllabus-grid,
    .college-grid{
        grid-template-columns:repeat(2,1fr);
    }

    .comparison-grid{
        grid-template-columns:repeat(2,1fr);
    }

    .footer-grid{
        grid-template-columns:repeat(2,1fr);
    }

}

@media(max-width:768px){

    .syllabus-grid,
    .comparison-grid,
    .college-grid{
        grid-template-columns:1fr;
    }

    .timeline::before{
        left:30px;
    }

    .timeline-item{
        width:100%;
        left:0 !important;
        padding-left:90px;
        padding-right:0;
        text-align:left !important;
    }

    .timeline-icon{
        left:0 !important;
        right:auto;
    }

    .cta-card{
        padding:60px 25px;
    }

    .cta-buttons{
        flex-direction:column;
    }

    .footer-grid{
        grid-template-columns:1fr;
        text-align:center;
    }

    .social-icons{
        justify-content:center;
    }

}





.enquiry-modal{
    position:fixed;
    inset:0;

    background:rgba(0,0,0,.5);

    display:none;

    align-items:center;
    justify-content:center;

    z-index:10000;
}

.enquiry-modal.active{
    display:flex;
}

.modal-box{

    width:min(500px,92%);

    background:white;

    padding:40px;

    border-radius:30px;

    position:relative;

    animation:modalUp .3s ease;
}

@keyframes modalUp{

    from{
        transform:translateY(30px);
        opacity:0;
    }

    to{
        transform:translateY(0);
        opacity:1;
    }

}

.close-modal{

    position:absolute;

    top:20px;
    right:20px;

    background:none;

    border:none;

    font-size:1.2rem;

    cursor:pointer;
}

.enquiry-form{

    display:flex;

    flex-direction:column;

    gap:16px;

    margin-top:25px;
}

.enquiry-form input,
.enquiry-form select{

    padding:16px;

    border:1px solid #ddd;

    border-radius:14px;

    outline:none;

    font-family:inherit;
}