/* ==========================================================
   MERITZA CLASSES DESIGN SYSTEM
   Version: 3.0
   ========================================================== */

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

:root{

    /* Brand */
    --mc-primary:#0A1946;
    --mc-primary-dark:#081634;

    --mc-gold:#D4AF37;
    --mc-gold-dark:#B89222;

    /* Status */
    --mc-success:#2E7D32;
    --mc-warning:#F9A825;
    --mc-danger:#C62828;
    --mc-info:#1565C0;

    /* Background */
    --mc-bg:#FAFBFD;
    --mc-bg-alt:#F4F7FB;
    --mc-white:#FFFFFF;

    /* Text */
    --mc-text:#1F2937;
    --mc-text-light:#6B7280;

    /* Border */
    --mc-border:#E5E7EB;

    /* Radius */
    --mc-radius-sm:8px;
    --mc-radius:12px;
    --mc-radius-lg:18px;
    --mc-radius-xl:24px;

    /* Shadow */
    --mc-shadow-sm:0 2px 8px rgba(0,0,0,.05);
    --mc-shadow:0 8px 25px rgba(0,0,0,.08);
    --mc-shadow-lg:0 18px 45px rgba(0,0,0,.12);

    /* Animation */
    --mc-transition:.30s ease;
    /* Premium Aurora */

--mc-bg-main:#F2F5FA;

/* Stronger Aurora */
--mc-glow-navy: rgba(10,25,70,.18);
--mc-glow-gold: rgba(212,175,55,.20);
--mc-glow-sky: rgba(56,189,248,.16);
--mc-dot: rgba(10,25,70,.12);

}


/* ==========================================================
   GLOBAL
========================================================== */

html{

    scroll-behavior:smooth;

}

body{

    position:relative;

    background:var(--mc-bg-main);

    color:var(--mc-text);

    font-family:'Poppins',sans-serif;

    overflow-x:hidden;

}
/* ==========================================================
   GLOBAL WEBSITE BACKGROUND
========================================================== */

body::before{

    content:"";

    position:fixed;

    inset:0;

    pointer-events:none;

    z-index:-2;

 background:

/* Navy - Top Left */
radial-gradient(
    circle at 12% 12%,
    rgba(10,25,70,.18),
    transparent 38%
),

/* Gold - Top Right */
radial-gradient(
    circle at 88% 10%,
    rgba(212,175,55,.20),
    transparent 36%
),

/* Sky - Bottom Left */
radial-gradient(
    circle at 15% 85%,
    rgba(56,189,248,.16),
    transparent 38%
),

/* Gold + Navy Blend - Bottom Right */
radial-gradient(
    circle at 85% 88%,
    rgba(212,175,55,.18),
    transparent 42%
),

/* Soft White Highlight */
radial-gradient(
    circle at 50% 45%,
    rgba(255,255,255,.30),
    transparent 60%
),

var(--mc-bg-main);

}
body::after{

    content:"";

    position:fixed;

    inset:0;

    pointer-events:none;

    z-index:-1;

    opacity:.28;

    background-image:

        radial-gradient(

            var(--mc-dot) 1px,

            transparent 1px

        );

    background-size:32px 32px;

}
    mask-image:

        radial-gradient(

            ellipse at center,

            rgba(0,0,0,.95),

            rgba(0,0,0,.60)

        );

}

/* ==========================================================
   SECTION SPACING
========================================================== */

.mc-section{

    padding:100px 0;

}

.mc-section-sm{

    padding:60px 0;

}


/* ==========================================================
   CARDS
========================================================== */

.mc-card{

    background:#fff;

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

    border-radius:var(--mc-radius-xl);

    box-shadow:var(--mc-shadow-sm);

    transition:var(--mc-transition);

}

.mc-card:hover{

    transform:translateY(-5px);

    box-shadow:var(--mc-shadow);

}


/* ==========================================================
   BUTTONS
========================================================== */

.mc-btn-primary{

    background:var(--mc-gold);

    color:#fff;

    border:none;

font-size: 13px;
height: 34px;
padding: 0 14px;
border-radius: 8px;

    transition:var(--mc-transition);

}

.mc-btn-primary:hover{

    background:var(--mc-gold-dark);

    transform:translateY(-2px);

}

.mc-btn-outline{

    background:#fff;

    color:var(--mc-primary);

    border:2px solid var(--mc-primary);

font-size: 13px;
height: 34px;
padding: 0 14px;
border-radius: 8px;

    transition:var(--mc-transition);

}

.mc-btn-outline:hover{

    background:var(--mc-primary);

    color:#fff;

}


/* ==========================================================
   INSTITUTE COLORS
========================================================== */

.mc-iit{

    border-top:5px solid #0A4D9B;

}

.mc-aiims{

    border-top:5px solid #8B1E2D;

}

.mc-iim{

    border-top:5px solid #0F7B3E;

}

.mc-nit{

    border-top:5px solid #E67E22;

}

.mc-iiser{

    border-top:5px solid #6F42C1;

}

.mc-iiit{

    border-top:5px solid #008B8B;

}

.mc-other{

    border-top:5px solid #5F6B7A;

}


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

.mc-navbar{

    position: sticky;
    top: 0;
    z-index: 1100;

    min-height: 54px;

    display: flex;
    align-items: center;

    padding: 0;

    background: rgba(10,25,70,.92);

    backdrop-filter: blur(12px);

    border-bottom: 1px solid rgba(255,255,255,.06);

    box-shadow: 0 6px 20px rgba(0,0,0,.10);

}

.mc-navbar .container-fluid{

    min-height:54px;

    display:flex;

    align-items:center;

}

.brand-logo{

    height:36px;

    width:auto;

    transition:.35s;

}
.mc-navbar .navbar-brand{

    width:220px;
    margin:0;
    padding-left:20px;

}
.mc-navbar .nav-link{

    position: relative;

    color: #fff !important;

    font-size: 13.5px;
font-weight: 600;
padding:.25rem .25rem;
letter-spacing: .2px;

    transition: .3s;

}

.mc-navbar .nav-link:hover{

    color:var(--mc-gold) !important;

}

.mc-navbar .nav-link::after{

    content:"";

    position:absolute;

    left:0;

    bottom:0;

    width:0;

    height:2px;

    background:var(--mc-gold);

    transition:.3s;

}

.mc-navbar .nav-link:hover::after{

    width:100%;

}

.btn-gold{

    background:linear-gradient(
        135deg,
        #D4AF37,
        #F6D76A
    );

    color:#0A1946;

    font-weight:700;

    border:none;

    padding:9px 18px;
border-radius:10px;
font-size:13px;

    box-shadow:0 12px 30px rgba(212,175,55,.28);

    transition:.35s;

}

.btn-gold:hover{

    color:#081634;

    transform:translateY(-3px);

    box-shadow:0 18px 40px rgba(212,175,55,.42);

}
/* ==========================================================
   SECTION TITLES
========================================================== */

.mc-section-title{

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

    font-weight:800;

    color:var(--mc-primary);

    text-align:center;

    margin-bottom:16px;

    line-height:1.2;

}

.mc-section-subtitle{

    max-width:760px;

    margin:0 auto 55px;

    text-align:center;

    color:var(--mc-text-light);

    font-size:1.08rem;

    line-height:1.75;

}



/* ==========================================================
   COMMON IMAGE STYLES
========================================================== */

img{

    max-width:100%;

    height:auto;

}


/* ==========================================================
   COMMON LINKS
========================================================== */

a{

    text-decoration:none;

    transition:.3s;

}

a:hover{

    text-decoration:none;

}


/* ==========================================================
   UTILITIES
========================================================== */

.shadow-hover{

    transition:.3s;

}

.shadow-hover:hover{

    transform:translateY(-5px);

    box-shadow:var(--mc-shadow);

}

.rounded-xl{

    border-radius:24px;

}

.text-gold{

    color:var(--mc-gold);

}

.bg-primary-dark{

    background:var(--mc-primary);

    color:#fff;

}
/* ==========================================================
   FINAL RESPONSIVE OPTIMIZATION
========================================================== */

/* ===============================
   Large Tablets
================================= */

@media (max-width:991px){

    .mc-section{

        padding:80px 0;

    }

    .mc-section-sm{

        padding:50px 0;

    }

}


/* ===============================
   Mobile Devices
================================= */

@media (max-width:768px){

    /* Section Spacing */

    .mc-section{

        padding:70px 0;

    }

    .mc-section-sm{

        padding:45px 0;

    }

    /* Section Heading */

    .mc-section-title{

        font-size:1.8rem;

        margin-bottom:12px;

    }

    .mc-section-subtitle{

        font-size:.95rem;

        margin-bottom:40px;

        padding:0 12px;

    }

    /* Feature Cards */

    .mc-feature-card{

        padding:22px;

        border-radius:20px;

    }

    .mc-feature-icon{

        width:60px;

        height:60px;

        margin-bottom:18px;

        font-size:1.5rem;

    }

    .mc-feature-card h5{

        font-size:1rem;

    }

    .mc-feature-card p{

        font-size:.88rem;

        line-height:1.6;

    }

    /* Statistics */

    .stats-container{

        margin-bottom:30px;

    }

    .mc-stats-card{

        border-radius:18px;

    }

}


/* ===============================
   Small Phones
================================= */

@media (max-width:576px){

    .mc-section{

        padding:60px 0;

    }

    .mc-section-title{

        font-size:1.55rem;

    }

    .mc-section-subtitle{

        font-size:.9rem;

    }

    .mc-feature-card{

        padding:18px;

    }

    .mc-feature-icon{

        width:54px;

        height:54px;

        font-size:1.3rem;

    }

}


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

img{

    max-width:100%;

    height:auto;

    display:block;

}


/* ==========================================================
   SMOOTH TRANSITIONS
========================================================== */

button,
.btn,
.card,
.mc-card,
.mc-feature-card{

    transition:

transform .3s ease,

box-shadow .3s ease,

background-color .3s ease,

color .3s ease,

border-color .3s ease;

}


/* ==========================================================
   SELECTION
========================================================== */

::selection{

    background:var(--mc-gold);

    color:#fff;

}


/* ==========================================================
   SCROLLBAR
========================================================== */

::-webkit-scrollbar{

    width:8px;

}

::-webkit-scrollbar-track{

    background:#edf2f7;

}

::-webkit-scrollbar-thumb{

    background:var(--mc-gold);

    border-radius:10px;

}

::-webkit-scrollbar-thumb:hover{

    background:var(--mc-gold-dark);

}
/* ==========================================================
   EXTRA OPTIMIZATION FOR SHORT MOBILE SCREENS
   (OnePlus Nord CE5)
========================================================== */

@media (max-width:768px) and (max-height:850px){

    .hero-section{

        min-height:580px;

        padding:65px 18px 75px;

    }

    .hero-title{

        font-size:1.75rem;

        line-height:1.1;

        margin-bottom:8px;

    }

    .hero-highlight{

        font-size:.95rem;

        margin:8px 0 12px;

    }

    .hero-description{

        max-width:300px;

        font-size:.86rem;

        line-height:1.5;

        margin-bottom:16px;

    }

    .hero-buttons{

        gap:10px;

    }

    .hero-buttons .btn{

        max-width:300px;

        padding:11px 18px;

        font-size:.90rem;

    }

    .stats-container{

        margin-top:-30px;

    }

}
/* ==========================================================
   PUBLIC FOOTER CTA
========================================================== */

.mc-footer-cta{

    padding-top:2.5rem;

    padding-bottom:2.5rem;

}

.mc-footer-cta-box{

    background:#ffffff;

    border:1px solid rgba(10,25,70,.08);

    border-radius:28px;

    padding:42px 28px;

    box-shadow:
        0 18px 50px rgba(10,25,70,.08);

}

.mc-footer-badge{

    display:inline-block;

 padding:6px 16px;

    border-radius:999px;

    background:rgba(212,175,55,.12);

    color:#0A1946;

    font-size:.78rem;

    font-weight:700;

    letter-spacing:.08em;

    text-transform:uppercase;

}

.mc-footer-cta-box h2{

    color:#0A1946;

    font-size:1.55rem;

    font-weight:800;

    line-height:1.15;

    letter-spacing:-0.015em;

    max-width:760px;

    margin:0 auto 16px;

}

.mc-footer-cta-box p{

    max-width:560px;

    margin:0 auto 22px;

    color:#64748B;

    font-size:.95rem;

    line-height:1.6;

}

.mc-footer-cta-box .btn{

    background:#D4AF37;

    border:none;

    color:#0A1946;

    font-weight:700;

 border-radius:12px;

padding:10px 26px;

    transition:.3s ease;

}

.mc-footer-cta-box .btn:hover{

    background:#c69c1f;

    transform:translateY(-2px);

    box-shadow:
        0 12px 28px rgba(212,175,55,.28);

}

/* Mobile */

@media (max-width:768px){

.mc-footer-cta{

    padding-top:3rem;

    padding-bottom:3rem;

}

.mc-footer-cta-box{

    padding:35px 24px;

    border-radius:22px;

}

.mc-footer-cta-box h2{

    font-size:1.75rem;

}

.mc-footer-cta-box p{

    font-size:1rem;

}

}
/* ==========================================
   PUBLIC FOOTER
========================================== */

footer .footer-links{

    margin:0;

    padding:0;

    line-height:1.35;

}

footer .footer-links li{

    margin-bottom:3px;

}

footer .footer-links a{

    color:rgba(255,255,255,.70);

    text-decoration:none;

    transition:

        color .25s ease,

        padding-left .25s ease;

}

footer .footer-links a:hover{

    color:#D4AF37;

    padding-left:6px;

}

footer h6{

    color:#ffffff;

    font-size:.92rem;

    font-weight:700;

    margin-bottom:10px;

    letter-spacing:.03em;

}

footer p{

    font-size:.88rem;

    line-height:1.55;

    margin-bottom:.6rem;

}
.footer-contact-link{
    display:inline-flex;
    align-items:center;
    text-decoration:none;
    color:rgba(255,255,255,.75);
    transition:.3s;
    margin-bottom:12px;
}

.footer-contact-link:hover{
    color:#fff;
}

.footer-link-icon{
    font-size:.72rem;
    margin-left:6px;
    color:#D4AF37;
    transition:.3s;
}

.footer-contact-link:hover .footer-link-icon{
    transform:translate(2px,-2px);
}
/* ==========================================
   FOOTER SOCIAL
========================================== */

.footer-social{

    display:flex;

    gap:8px;

    align-items:center;

    margin-top:8px;

}
.footer-social a{

    width:34px;
    height:34px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

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

    color:#ffffff;

    text-decoration:none;

    transition:

        background-color .3s ease,

        color .3s ease,

        transform .3s ease;

}

.footer-social a:hover{

    background:#D4AF37;

    color:#0A1946;

    transform:translateY(-3px);

}

.footer-social i{
    font-size:.9rem;
}
/* ==========================================================
   FOOTER BOTTOM
========================================================== */

.footer-divider{

    margin:.8rem 0 .6rem;

}

.footer-bottom{

    display:flex;

    flex-direction:column;

    gap:.25rem;

    margin-bottom:0;

    padding-bottom:0;

}

.footer-policy-links{

    display:flex;

    justify-content:center;

    align-items:center;

    flex-wrap:wrap;

    gap:12px;

}

.footer-policy-links a{

    color:rgba(255,255,255,.70);

    text-decoration:none;

    font-size:.82rem;

    transition:color .25s ease;

}

.footer-policy-links a:hover{

    color:#D4AF37;

}

.footer-copyright{

    text-align:center;

    color:rgba(255,255,255,.65);
    margin:0;

    padding:0;
}

.footer-copyright p{

    margin:0;

    font-weight:600;

    line-height:1.5;

}

.footer-copyright small{

    color:rgba(255,255,255,.50);

}

@media (max-width:768px){

.footer-policy-links{

    gap:12px;

}

.footer-policy-links a{

    font-size:.82rem;

}

}
/* ==========================================================
   PREMIUM FOOTER
========================================================== */

.footer-premium{

    position:relative;

    overflow:hidden;

    background:
        radial-gradient(
            circle at top left,
            rgba(212,175,55,.10),
            transparent 28%
        ),

        radial-gradient(
            circle at top right,
            rgba(56,189,248,.08),
            transparent 32%
        ),

        linear-gradient(
            135deg,
            #0A1946 0%,
            #102B6A 45%,
            #07122F 100%
        );

    border-top:1px solid rgba(212,175,55,.25);

}

/* Soft Aurora Glow */

.footer-premium::before{
border-top:1px solid rgba(212,175,55,.35);
    content:"";

    position:absolute;

    inset:0;

    pointer-events:none;

    background:

        radial-gradient(
            circle at 15% 10%,
            rgba(212,175,55,.08),
            transparent 35%
        ),

        radial-gradient(
            circle at 85% 15%,
            rgba(56,189,248,.06),
            transparent 35%
        ),

        radial-gradient(
            circle at 50% 100%,
            rgba(255,255,255,.03),
            transparent 45%
        );

}

/* Keep footer content above the glow */

.footer-premium .container-fluid{

    position:relative;

    z-index:2;

    padding-top:18px;
    padding-bottom:10px;

}
/* ===========================================
   MOBILE HOMEPAGE OPTIMIZATION
=========================================== */

@media (max-width: 767.98px) {

    /* -----------------------------
       WHY CHOOSE MERITZA
    ------------------------------*/

    .mc-feature-card{
        padding:18px 10px !important;
        min-height:auto;
    }

    .mc-feature-card p{
        display:none;
    }

    .mc-feature-card h5{
        font-size:.95rem;
        margin-bottom:0;
        line-height:1.35;
    }

    .mc-feature-icon{
        margin-bottom:12px;
    }

    .mc-feature-icon i{
        font-size:26px;
    }



/* ===========================================
   MOBILE - STATS & TESTIMONIALS
=========================================== */

@media (max-width:767.98px){

    /* Hide descriptions in Statistics */

    .mc-stats-card p{

        display:none;
    }

    .mc-stats-card h2{

        font-size:1.5rem;
    }

    .mc-stats-card h6{

        font-size:.9rem;
        margin-bottom:0;
    }

    /* Testimonials should remain fully visible */

    .card-premium p{

        display:block;
    }

}


/* Decorative glow */

.faq-answer-card::before{

    content:"";

    display:block;

    width:70px;

    height:5px;

    border-radius:20px;

    background:var(--gold);

    margin-bottom:22px;

}

/* ===========================
   Mobile
=========================== */

@media(max-width:767.98px){

    .faq-chip-container{

        gap:10px;

    }

    .faq-chip{

    width:100%;

    min-height:54px;

        text-align:center;

        padding:14px 18px;

        font-size:.92rem;

    }

    .faq-answer-card{

        padding:24px;

        border-radius:18px;

    }

    .faq-answer-card h4{

        font-size:1.2rem;

    }

}
/* =====================================================
   Badges
===================================================== */

.badge-premium{

    background:rgba(212,175,55,.14);

    color:var(--navy);

}
/* ========================================
   SEARCH MENTORS GRID
======================================== */

.mentor-grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:24px;
    margin-top:24px;
}

@media (max-width:991px){
    .mentor-grid{
        grid-template-columns:1fr;
    }
}