/* ==========================================================================
   ACADEMY 2.0 — MASTER BRAND SHELL (UNIFIED CANONICAL STYLESHEET)
   Generated from index.html (Master Source of Truth)
   Synchronized automatically across ALL pages.
   ========================================================================== */

/* --- 1. CORE SHELL TOKENS & RESET --- */
:root {
    --c-dark: #09080e;
    --c-navy: #03045e;
    --c-blue: #185adb;
    --c-lime: #b8fb3c;
    --font-main: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
    --font-head: 'Bricolage Grotesque', sans-serif;
    --font-mono: 'Space Mono', 'Fira Code', monospace;
}

.content-container {
    width: 100%;
    max-width: 1380px;
    margin: 0 auto;
    padding: 0 32px;
    box-sizing: border-box;
}

@media (max-width: 768px) {
    .content-container {
        padding: 0 16px !important;
    }
}

/* --- 2. TOP URGENCY STRIP --- */
/* Top Urgency Strip (Elite Luxury Centered Announcement Dock - Apple / Stripe Style) */
    .top-urgency-bar {
        background: #09080e;
        border-bottom: 1px solid rgba(255, 255, 255, 0.08);
        position: relative;
        z-index: 101;
        padding: 0;
        height: 42px;
        display: flex;
        align-items: center;
        justify-content: center;
        overflow: hidden;
    }
    .top-urgency-bar::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 1px;
        background: linear-gradient(90deg, transparent 0%, transparent 25%, rgba(56, 189, 248, 0.6) 45%, rgba(163, 230, 53, 0.65) 55%, transparent 75%, transparent 100%);
        box-shadow: 0 0 6px rgba(56, 189, 248, 0.25);
        z-index: 10;
    }
    .top-urgency-inner {
        width: 100%;
        max-width: 1440px;
        margin: 0 auto;
        padding: 0 16px;
        display: flex;
        align-items: center;
        justify-content: center;
        height: 100%;
        box-sizing: border-box;
    }

    /* Unified Centered Luxury Glass Capsule (Desktop / Laptop) */
    .urgency-luxury-pill {
        display: inline-flex;
        align-items: center;
        gap: 12px;
        background: rgba(255, 255, 255, 0.04);
        border: 1px solid rgba(255, 255, 255, 0.12);
        padding: 4px 14px 4px 10px;
        border-radius: 9999px;
        box-shadow: 0 4px 18px rgba(0, 0, 0, 0.4);
        cursor: pointer;
        transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
        backdrop-filter: blur(12px);
        -webkit-backdrop-filter: blur(12px);
        text-decoration: none;
    }
    .urgency-luxury-pill:hover {
        background: rgba(255, 255, 255, 0.07);
        border-color: rgba(255, 255, 255, 0.22);
        transform: translateY(-1px);
        box-shadow: 0 6px 24px rgba(24, 90, 219, 0.25), 0 0 0 1px rgba(255, 255, 255, 0.15);
    }
    .urgency-luxury-pill:hover .urgency-pill-cta i {
        transform: translateX(2px);
    }

    .urgency-pill-live-tag {
        background: rgba(34, 197, 94, 0.14);
        border: 1px solid rgba(34, 197, 94, 0.35);
        color: #4ade80;
        font-size: 10px;
        font-weight: 800;
        padding: 2.5px 8.5px;
        border-radius: 999px;
        display: inline-flex;
        align-items: center;
        gap: 5px;
        letter-spacing: 0.4px;
        white-space: nowrap;
    }
    .live-dot {
        width: 5.5px;
        height: 5.5px;
        border-radius: 50%;
        background: #22c55e;
        box-shadow: 0 0 6px #22c55e;
        animation: pulseLiveDotGreen 1.8s infinite;
    }
    @keyframes pulseLiveDotGreen {
        0%, 100% { opacity: 1; transform: scale(1); }
        50% { opacity: 0.55; transform: scale(1.25); }
    }
    .urgency-pill-seats {
        color: #fbbf24;
        font-weight: 700;
        font-size: 11px;
        display: inline-flex;
        align-items: center;
        gap: 4px;
        white-space: nowrap;
    }
    .urgency-pill-seats i {
        font-size: 9.5px;
        color: #f59e0b;
    }
    .urgency-pill-dot {
        color: rgba(255, 255, 255, 0.22);
        font-size: 12px;
    }
    .urgency-pill-trust {
        display: flex;
        align-items: center;
        gap: 6px;
        font-size: 11px;
        font-weight: 700;
        color: #f1f5f9;
        white-space: nowrap;
    }
    .trust-shield-icon {
        color: #f59e0b;
        font-size: 11px;
    }
    .trust-divider {
        color: rgba(255, 255, 255, 0.2);
        margin: 0 1px;
    }
    .trust-gst-text {
        color: #94a3b8;
        font-weight: 600;
    }
    .gstin-num {
        color: #ffffff;
        font-family: 'Space Mono', monospace;
        font-size: 10.5px;
        letter-spacing: 0.3px;
        font-weight: 700;
    }
    .trust-check-icon {
        color: #38bdf8;
        font-size: 10.5px;
        margin-left: 2px;
    }
    .urgency-pill-cta {
        display: inline-flex;
        align-items: center;
        gap: 5px;
        background: linear-gradient(135deg, #185adb 0%, #2563eb 100%);
        color: #ffffff;
        border: none;
        font-size: 10px;
        font-weight: 800;
        padding: 3.5px 12px;
        border-radius: 9999px;
        text-transform: uppercase;
        letter-spacing: 0.4px;
        cursor: pointer;
        box-shadow: 0 2px 8px rgba(24, 90, 219, 0.45);
        transition: all 0.2s ease;
        white-space: nowrap;
    }
    .urgency-pill-cta:hover {
        background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);
        box-shadow: 0 3px 10px rgba(24, 90, 219, 0.6);
    }
    .urgency-pill-cta i {
        font-size: 9px;
        transition: transform 0.2s ease;
    }

    /* Responsive Visibility */
    .desktop-only-urgency { display: inline-flex !important; }
    .mobile-only-urgency { display: none !important; }

    @media (max-width: 640px) {
        .top-urgency-bar {
            height: 38px !important;
            box-sizing: border-box;
        }
        .top-urgency-inner {
            display: flex !important;
            align-items: center !important;
            justify-content: center !important;
            padding: 0 !important;
        }
        .desktop-only-urgency {
            display: none !important;
        }
        .mobile-only-urgency {
            display: inline-flex !important;
        }
        .urgency-luxury-pill-mobile {
            position: relative;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: rgba(255, 255, 255, 0.05);
            border: 1px solid rgba(255, 255, 255, 0.12);
            height: 32px;
            padding: 0 12px;
            border-radius: 9999px;
            cursor: pointer;
            box-shadow: 0 2px 10px rgba(0, 0, 0, 0.35);
            overflow: hidden;
            max-width: 96%;
            text-decoration: none;
            backdrop-filter: blur(12px);
            -webkit-backdrop-filter: blur(12px);
        }
        .mob-pill-slide {
            display: inline-flex;
            align-items: center;
            gap: 7px;
            font-size: 10.5px;
            white-space: nowrap;
            transition: opacity 0.45s cubic-bezier(0.16, 1, 0.3, 1), transform 0.45s cubic-bezier(0.16, 1, 0.3, 1);
        }
        .mob-pill-slide:not(.is-active) {
            position: absolute;
            opacity: 0;
            transform: translateY(12px);
            pointer-events: none;
        }
        .mob-pill-slide.is-active {
            opacity: 1;
            transform: translateY(0);
            pointer-events: auto;
        }
        .mob-pill-batch {
            color: #ffffff;
            font-weight: 800;
            font-size: 11px;
            letter-spacing: 0.2px;
        }
        .mob-pill-seats {
            color: #fbbf24;
            font-weight: 700;
            font-size: 10.5px;
            display: inline-flex;
            align-items: center;
            gap: 3.5px;
        }
        .mob-pill-seats i {
            color: #f59e0b;
            font-size: 9.5px;
        }
        .mob-pill-cta {
            background: #185adb;
            color: #ffffff;
            padding: 2.5px 8px;
            border-radius: 999px;
            font-size: 9.5px;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: 0.2px;
            box-shadow: 0 1px 6px rgba(24, 90, 219, 0.4);
        }
        .mob-slide-trust {
            gap: 6px;
        }
        .mob-slide-trust .trust-shield-icon {
            color: #f59e0b;
            font-size: 11px;
        }
        .mob-trust-msme {
            color: #ffffff;
            font-weight: 700;
        }
        .mob-trust-gst {
            color: rgba(255, 255, 255, 0.85);
            font-size: 10px;
        }
    }

/* --- 3. MASTER BRAND HEADER --- */
/* Master Brand Header (Sticky Navigation) */
    .marketian-header {
        position: sticky;
        top: 0;
        z-index: 1000;
        background: rgba(255, 255, 255, 0.96);
        backdrop-filter: blur(12px);
        -webkit-backdrop-filter: blur(12px);
        border-bottom: 1px solid #f1f5f9;
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.03);
        padding: 13px 0;
        transition: padding 0.25s ease, box-shadow 0.25s ease, background 0.25s ease, border-color 0.25s ease;
    }
    .marketian-header.is-scrolled {
        background: rgba(255, 255, 255, 0.98);
        box-shadow: 0 4px 22px rgba(0, 0, 0, 0.08);
        border-bottom: 1.5px solid rgba(9, 8, 14, 0.1);
        padding: 10px 0;
    }
    .marketian-header .content-container {
        max-width: 1380px !important;
        padding: 0 32px !important;
    }
    .header-inner {
        display: flex;
        justify-content: space-between;
        align-items: center;
        width: 100%;
    }

    /* Master Academy 2.0 Brand Logo */
    .brand-academy-logo {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        text-decoration: none !important;
        line-height: 1 !important;
        cursor: pointer !important;
        transition: transform 0.2s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.2s ease !important;
        user-select: none !important;
        flex-shrink: 0 !important;
        margin-right: 28px;
    }
    .brand-academy-logo:hover {
        transform: translateY(-1px);
        opacity: 0.94;
    }
    .brand-logo-img {
        height: 42px;
        width: auto;
        max-width: 185px;
        object-fit: contain;
        display: block;
    }
    .brand-academy-wordmark {
        display: inline-flex;
        align-items: baseline;
        gap: 4px;
        line-height: 1;
    }
    .brand-academy-title {
        font-family: 'Plus Jakarta Sans', var(--font-main), sans-serif;
        font-size: 26.5px;
        font-weight: 900;
        color: #0c1222;
        letter-spacing: -0.7px;
        line-height: 1;
        -webkit-text-stroke: 0.45px #0c1222;
    }
    .brand-academy-ver {
        font-family: 'Plus Jakarta Sans', var(--font-main), sans-serif;
        font-size: 27px;
        font-weight: 900;
        background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 45%, #ec4899 90%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        letter-spacing: -0.4px;
        line-height: 1;
        -webkit-text-stroke: 0.45px #6366f1;
    }
    .brand-academy-sub {
        font-family: 'Plus Jakarta Sans', var(--font-main), sans-serif;
        font-size: 7.8px;
        font-weight: 700;
        color: #64748b;
        letter-spacing: 0.15px;
        margin-top: 3px;
        display: inline-flex;
        align-items: center;
        gap: 2.5px;
        white-space: nowrap;
        line-height: 1;
        max-width: 100%;
    }
    .brand-unit-name {
        color: #185adb;
        font-weight: 800;
    }
    .brand-sparkle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        color: #ea580c;
        font-size: 7.5px;
        line-height: 1;
        margin-left: 1.5px;
    }

    /* Desktop Navigation Links (Option A: High-Converting EdTech) */
    .nav-links {
        display: flex;
        align-items: center;
        gap: clamp(12px, 1.4vw, 22px);
        margin: 0 auto;
    }
    .nav-link {
        font-family: var(--font-main);
        font-size: 14px;
        font-weight: 700;
        color: #1e293b;
        text-decoration: none;
        transition: color 0.2s ease;
        display: inline-flex;
        align-items: center;
        white-space: nowrap;
        position: relative;
    }
    .nav-link:hover {
        color: #185adb;
    }
    .nav-link-earning {
        color: #059669 !important;
        font-weight: 800;
        gap: 5px;
    }
    .nav-link-earning i {
        font-size: 12.5px;
        color: #059669;
    }
    .nav-link-earning:hover {
        color: #047857 !important;
    }
    .nav-pill-quiz {
        font-family: var(--font-main);
        background: #fed836;
        color: #09080e !important;
        font-size: 13.5px;
        font-weight: 900;
        padding: 6.5px 15px;
        border-radius: 8px;
        text-decoration: none;
        display: inline-flex;
        align-items: center;
        gap: 6px;
        box-shadow: 0 2px 8px rgba(254, 216, 54, 0.4);
        transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
        white-space: nowrap;
    }
    .nav-pill-quiz:hover {
        transform: translateY(-2px);
        box-shadow: 0 4px 14px rgba(254, 216, 54, 0.6);
        background: #fee054;
    }

    /* Header Right Actions (Phone + REGISTER NOW + Mobile Toggle) */
    .header-actions {
        display: flex;
        align-items: center;
        gap: 20px;
        margin-left: 36px;
        flex-shrink: 0;
    }
    .header-phone-link {
        font-family: var(--font-main);
        color: #09080e;
        text-decoration: none;
        font-size: 14.5px;
        font-weight: 800;
        display: inline-flex;
        align-items: center;
        gap: 7px;
        white-space: nowrap;
        transition: color 0.2s ease;
    }
    .header-phone-link i {
        color: #185adb;
        font-size: 13.5px;
    }
    .header-phone-link:hover {
        color: #185adb;
    }
    .btn-register-now {
        font-family: var(--font-main);
        background: #185adb;
        color: #ffffff;
        font-size: 13.5px;
        font-weight: 900;
        letter-spacing: 0.5px;
        padding: 10px 22px;
        border-radius: 8px;
        border: none;
        cursor: pointer;
        text-transform: uppercase;
        box-shadow: 0 4px 14px rgba(24, 90, 219, 0.35);
        transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
        white-space: nowrap;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }
    .btn-register-now:hover {
        background: #144ebd !important;
        color: #ffffff !important;
        transform: translateY(-2px);
        box-shadow: 0 6px 18px rgba(24, 90, 219, 0.45);
    }
    .btn-register-now:active {
        transform: translateY(0px);
    }

    /* ==========================================================================
       ISLAND BUTTON ARCHITECTURE (BUTTON-IN-BUTTON WITH SPRING PHYSICS)
       ========================================================================== */
    .btn-marketian-blue {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        background: linear-gradient(180deg, #1d68ff 0%, #134ec4 100%);
        color: #ffffff;
        font-size: 15px;
        font-weight: 800;
        padding: 13px 24px 13px 28px;
        border-radius: 9999px;
        border: 1px solid rgba(255, 255, 255, 0.2);
        text-decoration: none;
        cursor: pointer;
        box-shadow: 0 8px 20px -4px rgba(24, 90, 219, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.3);
        transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
        position: relative;
    }
    .btn-marketian-blue:hover {
        background: linear-gradient(180deg, #1d68ff 0%, #134ec4 100%);
        transform: translateY(-2px);
        box-shadow: 0 12px 28px -4px rgba(24, 90, 219, 0.55), inset 0 1px 0 rgba(255, 255, 255, 0.35);
    }
    .btn-marketian-blue:active {
        transform: translateY(0px) scale(0.98);
    }

    /* Nested Trailing Icon Circle */
    .btn-arrow-circle {
        width: 26px;
        height: 26px;
        border-radius: 50%;
        background: rgba(255, 255, 255, 0.22);
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 12px;
        transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
        margin-left: 2px;
    }
    .btn-marketian-blue:hover .btn-arrow-circle {
        transform: translateX(4px);
        background: rgba(255, 255, 255, 0.35);
    }

    .btn-marketian-white {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        background: #ffffff;
        color: #09080e;
        font-size: 15px;
        font-weight: 800;
        padding: 12px 26px;
        border-radius: 9999px;
        border: 2px solid #09080e;
        box-shadow: 3px 3px 0px #09080e;
        text-decoration: none;
        cursor: pointer;
        transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
    }
    .btn-marketian-white:hover {
        transform: translate(-1px, -1px);
        box-shadow: 4px 4px 0px #09080e;
        background: #f8fafc;
    }
    .btn-marketian-white:active {
        transform: translate(0px, 0px);
        box-shadow: 2px 2px 0px #09080e;
    }

    .btn-marketian-lime {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        background: #b8fb3c;
        color: #09080e;
        font-size: 15px;
        font-weight: 900;
        padding: 13px 26px;
        border-radius: 9999px;
        border: 2px solid #09080e;
        box-shadow: 3px 3px 0px #09080e;
        text-decoration: none;
        cursor: pointer;
        transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
        position: relative;
    }
    .btn-marketian-lime:hover {
        transform: translate(-2px, -2px);
        box-shadow: 5px 5px 0px #09080e;
        background: #c6ff33;
    }
    .btn-marketian-lime:active {
        transform: translate(0px, 0px);
        box-shadow: 2px 2px 0px #09080e;
    }
    .btn-arrow-circle-dark {
        width: 26px;
        height: 26px;
        border-radius: 50%;
        background: rgba(9, 8, 14, 0.12);
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 12px;
        transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    }
    .btn-marketian-lime:hover .btn-arrow-circle-dark {
        transform: translateX(4px);
    }

    .mobile-nav-toggle {
        display: none;
        background: none;
        border: 1px solid var(--c-border);
        width: 44px;
        height: 44px;
        border-radius: 10px;
        font-size: 20px;
        color: var(--c-dark);
        align-items: center;
        justify-content: center;
        cursor: pointer;
    }

    @media (max-width: 900px) {
        .hide-mobile { display: none !important; }
        .nav-links { display: none !important; }
        .marketian-header .content-container { padding: 0 16px !important; }
        .brand-academy-logo { margin-right: 0 !important; }
        .brand-logo-img { height: 31px !important; max-width: 140px !important; }
        .header-actions { margin-left: auto !important; gap: 8px !important; }
        .mobile-nav-toggle { display: inline-flex !important; width: 38px !important; height: 38px !important; font-size: 18px !important; }
        .header-phone-link { display: none !important; }
        .btn-register-now { padding: 7px 13px !important; font-size: 11.5px !important; }
    }
    @media (max-width: 520px) {
        .header-actions { gap: 6px !important; }
        .btn-register-now {
            padding: 6.5px 10px !important;
            font-size: 11px !important;
            letter-spacing: 0.2px !important;
        }
        .mobile-nav-toggle {
            width: 36px !important;
            height: 36px !important;
            font-size: 16px !important;
            flex-shrink: 0 !important;
        }
    }

/* --- 4. HEADER USER PROFILE PILL & FLOATING DROPDOWN --- */
/* Header User Profile Pill (Logged In) */
    .header-user-pill {
        position: relative;
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: #ffffff;
        border: 1.5px solid #cbd5e1;
        border-radius: 999px;
        padding: 4.5px 12px 4.5px 5.5px;
        cursor: pointer;
        transition: all 0.22s cubic-bezier(0.16, 1, 0.3, 1);
        box-shadow: 0 2px 7px rgba(15, 23, 42, 0.06);
        user-select: none;
    }
    .header-user-pill:hover {
        border-color: #94a3b8;
        background: #f8fafc;
        box-shadow: 0 4px 12px rgba(15, 23, 42, 0.1);
        transform: translateY(-1px);
    }
    .user-avatar-mini {
        width: 27px;
        height: 27px;
        border-radius: 50%;
        background: linear-gradient(135deg, #185adb 0%, #6366f1 100%);
        color: #ffffff;
        font-weight: 800;
        font-size: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        text-transform: uppercase;
        box-shadow: 0 2px 6px rgba(24, 90, 219, 0.3);
        flex-shrink: 0;
    }
    .user-meta-mini {
        display: flex;
        align-items: center;
        gap: 5px;
    }
    .user-name-mini {
        font-family: var(--font-main);
        font-size: 12.5px;
        font-weight: 800;
        color: #0f172a;
        max-width: 85px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .user-status-dot {
        width: 6.5px;
        height: 6.5px;
        border-radius: 50%;
        background: #10b981;
        box-shadow: 0 0 0 2px #d1fae5;
        flex-shrink: 0;
    }
    .user-chevron-mini {
        font-size: 10.5px;
        color: #64748b;
        transition: transform 0.2s ease;
    }
    .header-user-pill.is-active .user-chevron-mini {
        transform: rotate(180deg);
    }

    /* Floating User Dropdown Menu */
    .user-dropdown-menu {
        position: absolute;
        top: calc(100% + 9px);
        right: 0;
        width: 245px;
        background: #ffffff;
        border: 1px solid #e2e8f0;
        border-radius: 16px;
        box-shadow: 0 16px 36px -8px rgba(15, 23, 42, 0.22), 0 0 0 1px rgba(0, 0, 0, 0.04);
        padding: 13px;
        display: none;
        flex-direction: column;
        gap: 9px;
        z-index: 1050;
        animation: userDropFade 0.2s cubic-bezier(0.16, 1, 0.3, 1) forwards;
    }
    @keyframes userDropFade {
        from { opacity: 0; transform: translateY(-6px) scale(0.97); }
        to { opacity: 1; transform: translateY(0) scale(1); }
    }
    .user-drop-header {
        display: flex;
        align-items: center;
        gap: 10px;
        padding-bottom: 9px;
        border-bottom: 1px solid #f1f5f9;
    }
    .user-drop-avatar {
        width: 35px;
        height: 35px;
        border-radius: 50%;
        background: linear-gradient(135deg, #185adb 0%, #6366f1 100%);
        color: #ffffff;
        font-weight: 800;
        font-size: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
    }
    .user-drop-info {
        overflow: hidden;
    }
    .user-drop-info strong {
        display: block;
        font-size: 13px;
        font-weight: 800;
        color: #0f172a;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .user-drop-info span {
        display: block;
        font-size: 11px;
        color: #64748b;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .user-drop-status-badge {
        background: #f0fdf4;
        border: 1px solid #bbf7d0;
        color: #15803d;
        font-size: 10.5px;
        font-weight: 700;
        padding: 4px 8px;
        border-radius: 6px;
        display: flex;
        align-items: center;
        gap: 5px;
    }
    .user-drop-action-btn {
        background: #eff6ff;
        border: 1px solid #bfdbfe;
        color: #1d4ed8;
        font-size: 12px;
        font-weight: 800;
        padding: 8px 12px;
        border-radius: 8px;
        cursor: pointer;
        text-align: left;
        display: flex;
        align-items: center;
        gap: 7px;
        transition: background 0.15s;
    }
    .user-drop-action-btn:hover {
        background: #dbeafe;
    }
    .user-drop-logout-btn {
        background: #fff1f2;
        border: 1px solid #fecdd3;
        color: #be123c;
        font-size: 12px;
        font-weight: 800;
        padding: 8px 12px;
        border-radius: 8px;
        cursor: pointer;
        text-align: left;
        display: flex;
        align-items: center;
        gap: 7px;
        transition: background 0.15s;
    }
    .user-drop-logout-btn:hover {
        background: #ffe4e6;
    }

    /* Mobile Drawer Learner Account Card */
    .drawer-auth-card {
        background: linear-gradient(135deg, rgba(24, 90, 219, 0.05) 0%, rgba(99, 102, 241, 0.05) 100%);
        border: 1px solid rgba(24, 90, 219, 0.16);
        border-radius: 14px;
        padding: 12px 14px;
        margin-bottom: 14px;
    }
    .drawer-auth-logged-out {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
    }
    .drawer-auth-text strong {
        display: block;
        font-size: 13px;
        font-weight: 800;
        color: #0f172a;
    }
    .drawer-auth-text span {
        font-size: 11px;
        color: #64748b;
    }
    .drawer-auth-btn-login {
        background: #185adb;
        color: #ffffff;
        font-size: 12px;
        font-weight: 800;
        padding: 7px 13px;
        border-radius: 8px;
        border: none;
        cursor: pointer;
        display: inline-flex;
        align-items: center;
        gap: 5px;
        white-space: nowrap;
        box-shadow: 0 3px 8px rgba(24, 90, 219, 0.3);
    }
    .drawer-auth-logged-in {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
    }
    .drawer-user-left {
        display: flex;
        align-items: center;
        gap: 9px;
        overflow: hidden;
    }
    .drawer-user-meta strong {
        display: block;
        font-size: 13px;
        font-weight: 800;
        color: #0f172a;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .drawer-user-meta span {
        display: block;
        font-size: 10.5px;
        color: #16a34a;
        font-weight: 700;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .drawer-logout-mini {
        background: transparent;
        border: 1px solid #cbd5e1;
        color: #64748b;
        font-size: 11px;
        font-weight: 700;
        padding: 5px 9px;
        border-radius: 6px;
        cursor: pointer;
    }

/* --- 5. MOBILE DRAWER --- */
/* Mobile Drawer (Luxury Executive Slide-Over) */
    .mobile-drawer {
        position: fixed;
        top: 0;
        right: 0;
        width: min(348px, 88vw);
        height: 100dvh;
        max-height: 100dvh;
        background: #ffffff;
        z-index: 1000;
        box-shadow: -14px 0 45px rgba(9, 8, 14, 0.25);
        border-top-left-radius: 26px;
        border-bottom-left-radius: 26px;
        border-left: 1px solid rgba(226, 232, 240, 0.9);
        padding: 0;
        display: flex;
        flex-direction: column;
        overflow: hidden;
        transform: translateX(105%);
        transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.35s;
        visibility: hidden;
    }
    .mobile-drawer.open {
        transform: translateX(0);
        visibility: visible;
    }
    .mobile-drawer-backdrop {
        position: fixed;
        inset: 0;
        background: rgba(9, 8, 14, 0.65);
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
        z-index: 999;
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.3s ease;
    }
    .mobile-drawer-backdrop.open {
        opacity: 1;
        pointer-events: auto;
    }

    /* Top Rainbow Accent Strip */
    .drawer-accent-strip {
        height: 3.5px;
        background: linear-gradient(90deg, #185adb 0%, #3b82f6 45%, #ea580c 80%, #f59e0b 100%);
        width: 100%;
        flex-shrink: 0;
    }

    /* Drawer Header */
    .drawer-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 14px 18px 12px 18px;
        border-bottom: 1px solid #f1f5f9;
        flex-shrink: 0;
        background: #ffffff;
    }
    .drawer-brand-logo-link {
        display: inline-flex;
        align-items: center;
        text-decoration: none;
    }
    .drawer-brand-logo-img {
        height: 38px;
        width: auto;
        max-width: 165px;
        object-fit: contain;
        display: block;
    }
    .drawer-brand-block {
        display: flex;
        flex-direction: column;
    }
    .drawer-wordmark-row {
        display: flex;
        align-items: baseline;
        gap: 4px;
        line-height: 1.1;
    }
    .drawer-wordmark-row .brand-academy-title {
        font-size: 22px !important;
        font-weight: 900 !important;
        -webkit-text-stroke: 0.42px #0c1222 !important;
    }
    .drawer-wordmark-row .brand-academy-ver {
        font-size: 22.5px !important;
        font-weight: 900 !important;
        -webkit-text-stroke: 0.42px #6366f1 !important;
    }
    .drawer-brand-tagline {
        font-size: 7.6px;
        font-weight: 700;
        color: #64748b;
        text-transform: uppercase;
        letter-spacing: 0.25px;
        margin-top: 2px;
        display: flex;
        align-items: center;
        gap: 2px;
    }
    .drawer-brand-sparkle {
        color: #ea580c;
        font-size: 8.5px;
    }
    .drawer-close-btn {
        width: 34px;
        height: 34px;
        border-radius: 50%;
        background: #f1f5f9;
        border: 1px solid #e2e8f0;
        color: #475569;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        font-size: 14px;
        transition: all 0.2s ease;
    }
    .drawer-close-btn:active {
        transform: scale(0.92);
        background: #e2e8f0;
        color: #0f172a;
    }

    /* Scrollable Content Body */
    .drawer-scroll-body {
        flex: 1;
        overflow-y: auto;
        overflow-x: hidden;
        padding: 12px 16px 20px 16px;
        display: flex;
        flex-direction: column;
        gap: 9px;
        -webkit-overflow-scrolling: touch;
    }
    .drawer-scroll-body::-webkit-scrollbar {
        width: 4px;
    }
    .drawer-scroll-body::-webkit-scrollbar-thumb {
        background: #cbd5e1;
        border-radius: 4px;
    }

    /* Executive Trust Bento Capsule */
    .drawer-trust-capsule {
        background: linear-gradient(145deg, #ffffff 0%, #f8fafc 100%);
        border: 1px solid #e2e8f0;
        border-radius: 12px;
        padding: 8px 11px;
        box-shadow: 0 2px 6px rgba(0,0,0,0.02);
        display: flex;
        flex-direction: column;
        gap: 5px;
    }
    .drawer-trust-top {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
    .drawer-trust-badge {
        display: flex;
        align-items: center;
        gap: 5px;
        font-size: 10.5px;
        font-weight: 800;
        color: #0f172a;
    }
    .drawer-trust-badge i {
        color: #d97706;
        font-size: 11.5px;
    }
    .drawer-verified-chip {
        font-size: 8.5px;
        font-weight: 800;
        color: #059669;
        background: #ecfdf5;
        border: 1px solid #a7f3d0;
        padding: 1.5px 5px;
        border-radius: 999px;
        letter-spacing: 0.3px;
        display: flex;
        align-items: center;
        gap: 3px;
    }
    .drawer-gstin-box {
        display: flex;
        align-items: center;
        justify-content: space-between;
        background: #ffffff;
        border: 1px solid #e2e8f0;
        border-radius: 7px;
        padding: 3px 7px;
    }
    .drawer-gstin-label {
        font-size: 8.5px;
        font-weight: 800;
        color: #64748b;
        letter-spacing: 0.5px;
    }
    .drawer-gstin-code {
        font-family: 'Space Mono', monospace;
        font-size: 9.5px;
        font-weight: 700;
        color: #1e293b;
        letter-spacing: 0.3px;
    }

    /* Navigation List */
    .drawer-nav-list {
        display: flex;
        flex-direction: column;
        gap: 3px;
    }
    .drawer-nav-item {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 7px 9px;
        border-radius: 11px;
        text-decoration: none;
        transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
        background: transparent;
        border: 1px solid transparent;
    }
    .drawer-nav-item:active {
        background: #f8fafc;
        border-color: #f1f5f9;
        transform: scale(0.985);
    }
    .drawer-item-left {
        display: flex;
        align-items: center;
        gap: 10px;
    }
    .drawer-item-icon {
        width: 32px;
        height: 32px;
        border-radius: 9px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 13px;
        flex-shrink: 0;
    }
    .icon-blue { background: #eff6ff; color: #2563eb; border: 1px solid #dbeafe; }
    .icon-green { background: #ecfdf5; color: #059669; border: 1px solid #d1fae5; }
    .icon-purple { background: #f5f3ff; color: #7c3aed; border: 1px solid #ede9fe; }
    .icon-pink { background: #fdf2f8; color: #db2777; border: 1px solid #fce7f3; }
    .icon-indigo { background: #eef2ff; color: #4f46e5; border: 1px solid #e0e7ff; }
    .icon-slate { background: #f8fafc; color: #64748b; border: 1px solid #e2e8f0; }
    .icon-call { background: #f0fdf4; color: #16a34a; border: 1px solid #dcfce7; }

    .drawer-item-meta {
        display: flex;
        flex-direction: column;
        gap: 1px;
    }
    .drawer-item-title-row {
        display: flex;
        align-items: center;
        gap: 5px;
    }
    .drawer-item-title {
        font-size: 13px;
        font-weight: 700;
        color: #0f172a;
        line-height: 1.2;
    }
    .drawer-item-sub {
        font-size: 10px;
        color: #64748b;
        font-weight: 500;
        line-height: 1.1;
    }
    .drawer-item-arrow {
        font-size: 10.5px;
        color: #94a3b8;
        transition: transform 0.2s ease;
    }
    .drawer-badge-pill {
        font-size: 8px;
        font-weight: 800;
        padding: 1px 4.5px;
        border-radius: 999px;
        letter-spacing: 0.3px;
    }
    .pill-hot {
        background: #ecfdf5;
        color: #059669;
        border: 1px solid #a7f3d0;
    }
    .pill-ai {
        background: #fdf2f8;
        color: #db2777;
        border: 1px solid #fbcfe8;
    }

    /* Standout 10s Course Quiz Bento Banner */
    .drawer-quiz-banner {
        background: linear-gradient(135deg, #fef08a 0%, #fde047 50%, #facc15 100%);
        border: 1px solid #eab308;
        border-radius: 13px;
        padding: 9px 12px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        text-decoration: none;
        box-shadow: 0 3px 12px rgba(250, 204, 21, 0.28);
        transition: transform 0.2s cubic-bezier(0.16, 1, 0.3, 1);
        margin: 3px 0;
    }
    .drawer-quiz-banner:active {
        transform: scale(0.98);
    }
    .drawer-quiz-left {
        display: flex;
        flex-direction: column;
        gap: 1.5px;
    }
    .drawer-quiz-badge {
        font-size: 9px;
        font-weight: 900;
        color: #854d0e;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        display: flex;
        align-items: center;
        gap: 3px;
    }
    .drawer-quiz-title {
        font-size: 13px;
        font-weight: 900;
        color: #09080e;
        letter-spacing: -0.2px;
    }
    .drawer-quiz-sub {
        font-size: 9.5px;
        font-weight: 600;
        color: #713f12;
    }
    .drawer-quiz-arrow {
        width: 26px;
        height: 26px;
        border-radius: 50%;
        background: #09080e;
        color: #ffffff;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 10.5px;
        flex-shrink: 0;
    }

    /* Call Hotline Row */
    .drawer-call-item {
        background: #f0fdf4;
        border: 1px solid #bbf7d0;
    }
    .drawer-live-call-pill {
        font-size: 8.5px;
        font-weight: 800;
        color: #15803d;
        background: #dcfce7;
        padding: 2px 6px;
        border-radius: 999px;
        display: flex;
        align-items: center;
        gap: 3.5px;
    }
    .call-pulse-dot {
        width: 5.5px;
        height: 5.5px;
        border-radius: 50%;
        background: #16a34a;
        box-shadow: 0 0 5px rgba(22, 163, 74, 0.8);
    }

    /* Fixed Footer Dock inside Drawer */
    .drawer-footer-dock {
        padding: 12px 16px 14px 16px;
        background: #ffffff;
        border-top: 1px solid #f1f5f9;
        flex-shrink: 0;
        display: flex;
        flex-direction: column;
        gap: 8px;
    }
    .drawer-urgency-row {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 5px;
        font-size: 10px;
        color: #0f172a;
        font-weight: 700;
    }
    .drawer-urgency-dot {
        width: 6px;
        height: 6px;
        border-radius: 50%;
        background: #e4234b;
        box-shadow: 0 0 6px rgba(228, 35, 75, 0.7);
    }
    .drawer-btn-register {
        width: 100%;
        padding: 11px 16px;
        background: linear-gradient(135deg, #185adb 0%, #2563eb 50%, #1d4ed8 100%);
        border: none;
        border-radius: 11px;
        color: #ffffff;
        font-size: 13px;
        font-weight: 800;
        letter-spacing: 0.4px;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 9px;
        cursor: pointer;
        box-shadow: 0 5px 16px rgba(37, 99, 235, 0.35);
        transition: transform 0.2s ease, box-shadow 0.2s ease;
    }
    .drawer-btn-register:active {
        transform: scale(0.98);
    }
    .drawer-btn-arrow {
        width: 20px;
        height: 20px;
        border-radius: 50%;
        background: rgba(255, 255, 255, 0.22);
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 10px;
    }
    .drawer-brand-legal {
        text-align: center;
        font-size: 9.5px;
        font-weight: 700;
        color: #64748b;
        display: flex;
        flex-direction: column;
        gap: 3px;
    }
    .drawer-security-tags {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 7px;
        font-size: 8.5px;
        color: #94a3b8;
        font-weight: 600;
    }

    /* Floating Buttercream Scotch-Taped Sticky Note (Marketian Signature Overlapping Card) */
    .sticky-note-marketian {
        background: linear-gradient(135deg, #fff3a1 0%, #fee56c 100%);
        color: #452203;
        padding: 16px 22px;
        border-radius: 6px;
        box-shadow: 6px 6px 0px #09080e, 0 16px 32px -8px rgba(0,0,0,0.25);
        transform: rotate(-1.5deg);
        position: relative;
        font-family: var(--font-hand);
        font-size: 19px;
        line-height: 1.32;
        font-weight: 700;
        border: 2px solid #09080e;
        text-align: center;
        transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    }
    .sticky-note-marketian::before {
        content: '';
        position: absolute;
        top: -13px;
        left: 50%;
        transform: translateX(-50%);
        width: 68px;
        height: 24px;
        background: rgba(255, 255, 255, 0.58);
        backdrop-filter: blur(4px);
        -webkit-backdrop-filter: blur(4px);
        border: 1px solid rgba(255, 255, 255, 0.75);
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15), inset 0 0 0 1px rgba(255, 255, 255, 0.4);
        border-radius: 2px;
        z-index: 2;
    }

    /* Tactile Cards (Double-Bezel Neo-Brutalist Border & Shadow) */
    .tactile-card {
        background: #ffffff;
        border: 2.5px solid #09080e;
        box-shadow: 4px 4px 0px #09080e;
        border-radius: 20px;
        transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.25s cubic-bezier(0.16, 1, 0.3, 1);
    }
    .tactile-card:hover {
        transform: translate(-2px, -2px);
        box-shadow: 6px 6px 0px #09080e;
    }

/* --- 6. MASTER BRAND FOOTER --- */
/* Master Brand Footer (Awwwards-Tier Luxury Tech Finish) */
    .site-footer {
        background: #ffffff;
        border-top: 2px solid #09080e;
        padding: 44px 0 32px;
        position: relative;
        z-index: 10;
    }
    .footer-inner {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        gap: 36px;
        padding-bottom: 26px;
        border-bottom: 1px solid #e2e8f0;
    }
    .footer-brand-col {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
        max-width: 620px;
    }
    .footer-brand-title {
        font-size: 15.5px;
        font-weight: 800;
        color: #09080e;
        letter-spacing: -0.01em;
    }
    .footer-trust-strip {
        display: flex;
        align-items: center;
        gap: 10px;
        flex-wrap: wrap;
    }
    .footer-badge-msme {
        display: inline-flex;
        align-items: center;
        gap: 6.5px;
        background: #ffffff;
        color: #09080e;
        border: 1.5px solid #09080e;
        box-shadow: 2px 2px 0px #09080e;
        padding: 4px 12px;
        border-radius: 9999px;
        font-size: 12px;
        font-weight: 800;
        letter-spacing: 0.15px;
        white-space: nowrap;
    }
    .footer-badge-msme i {
        color: #d97706;
        font-size: 12.5px;
    }
    .footer-badge-gstin {
        display: inline-flex;
        align-items: center;
        gap: 6.5px;
        background: #f8fafc;
        border: 1.5px solid #09080e;
        box-shadow: 2px 2px 0px #09080e;
        padding: 4px 12px;
        border-radius: 8px;
        color: #09080e;
        font-size: 12px;
        font-weight: 700;
        white-space: nowrap;
    }
    .footer-badge-gstin i {
        color: #185adb;
        font-size: 12px;
    }
    .gstin-mono {
        font-family: var(--font-mono);
        letter-spacing: 0.4px;
        font-weight: 800;
    }
    .footer-meta-line {
        font-size: 13px;
        color: #64748b;
        font-weight: 600;
        display: flex;
        align-items: center;
        gap: 8px;
    }
    .meta-dot {
        color: #cbd5e1;
    }
    .footer-links-col {
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        gap: 16px;
    }
    .footer-nav-links {
        display: flex;
        align-items: center;
        gap: 20px;
        flex-wrap: wrap;
    }
    .footer-nav-links a {
        color: #475569;
        text-decoration: none;
        font-size: 13.5px;
        font-weight: 700;
        white-space: nowrap;
        transition: color 0.2s ease;
    }
    .footer-nav-links a:hover {
        color: #185adb;
    }
    .footer-social-row {
        display: flex;
        align-items: center;
        gap: 10px;
    }
    .footer-social-btn {
        width: 36px;
        height: 36px;
        border-radius: 10px;
        background: #ffffff;
        border: 1.5px solid #09080e;
        box-shadow: 2px 2px 0px #09080e;
        color: #09080e;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 15px;
        text-decoration: none;
        transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
    }
    .footer-social-btn:hover {
        transform: translate(-1.5px, -1.5px);
        box-shadow: 3.5px 3.5px 0px #09080e;
        background: #f1f5f9;
        color: #185adb;
    }
    .footer-bottom-row {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding-top: 20px;
        font-size: 12.5px;
        color: #64748b;
        font-weight: 600;
        flex-wrap: wrap;
        gap: 14px;
        border-top: 1px solid #e2e8f0;
    }
    .footer-copy-cluster {
        display: inline-flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 7px;
        font-size: 12.5px;
        color: #64748b;
        font-weight: 600;
        line-height: 1.5;
    }
    .footer-copy-main-line {
        display: inline-flex;
        align-items: center;
        gap: 7px;
    }
    .footer-copy-rights-line {
        display: inline-flex;
        align-items: center;
    }
    .footer-copy-cluster strong {
        color: #09080e;
        font-weight: 800;
    }
    .footer-copy-sep {
        color: #cbd5e1;
        font-size: 8px;
        user-select: none;
    }
    .footer-copy-unit {
        color: #64748b;
        font-weight: 500;
    }
    .footer-copy-rights {
        color: #64748b;
        font-weight: 500;
    }
    .footer-copyright {
        margin: 0;
        font-size: 12.5px;
        color: #64748b;
        font-weight: 600;
    }
    .footer-security-badge,
    .footer-guarantee {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        background: #f8fafc;
        border: 1px solid #e2e8f0;
        padding: 5px 13px;
        border-radius: 9999px;
        font-size: 11.5px;
        font-weight: 750;
        color: #334155;
        box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
        transition: all 0.2s ease;
        white-space: nowrap;
    }
    .footer-security-badge:hover,
    .footer-guarantee:hover {
        background: #ffffff;
        border-color: #cbd5e1;
        box-shadow: 0 2px 6px rgba(15, 23, 42, 0.08);
    }
    .footer-sec-dot {
        width: 6px;
        height: 6px;
        border-radius: 50%;
        background: #10b981;
        box-shadow: 0 0 6px #10b981;
        flex-shrink: 0;
    }
    .footer-security-badge i,
    .footer-guarantee i {
        color: #10b981;
        font-size: 12px;
    }
    .footer-sec-divider {
        color: #cbd5e1;
        font-size: 8px;
    }
    .footer-sec-partner {
        color: #185adb;
        font-weight: 800;
    }

/* --- 7. FOOTER RESPONSIVE OVERRIDES (EXACT INDEX.HTML RULES) --- */
@media (max-width: 768px) {
    .site-footer {
        padding: 36px 0 24px !important;
    }
    .footer-inner {
        flex-direction: column !important;
        align-items: center !important;
        text-align: center !important;
        gap: 22px !important;
        padding-bottom: 22px !important;
    }
    .footer-brand-col {
        align-items: center !important;
        text-align: center !important;
        max-width: 100% !important;
        gap: 12px !important;
    }
    .footer-brand-title {
        text-align: center !important;
        font-size: 14.5px !important;
    }
    .footer-trust-strip {
        justify-content: center !important;
        width: 100% !important;
        gap: 8px !important;
    }
    .footer-badge-msme,
    .footer-badge-gstin {
        font-size: 11px !important;
        padding: 4px 10px !important;
    }
    .footer-meta-line {
        justify-content: center !important;
        font-size: 12px !important;
    }
    .footer-links-col {
        align-items: center !important;
        text-align: center !important;
        width: 100% !important;
        gap: 16px !important;
    }
    .footer-nav-links {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 8px !important;
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
        scrollbar-width: none !important;
    }
    .footer-nav-links::-webkit-scrollbar {
        display: none !important;
    }
    .footer-nav-links a {
        font-size: 11.5px !important;
        font-weight: 700 !important;
        white-space: nowrap !important;
        padding: 3px 2px !important;
        color: #475569 !important;
        flex-shrink: 0 !important;
        letter-spacing: -0.01em !important;
        text-decoration: none !important;
    }
    .footer-nav-links a:hover,
    .footer-nav-links a.active {
        color: #185adb !important;
    }
    .footer-nav-links a:not(:last-child)::after {
        content: "•";
        margin-left: 8px;
        color: #94a3b8;
        opacity: 0.6;
        font-size: 10px;
        pointer-events: none;
    }
    .footer-social-row {
        justify-content: center !important;
        margin-top: 2px !important;
    }
    .footer-bottom-row {
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 12px !important;
        padding-top: 20px !important;
        text-align: center !important;
    }
    .footer-copy-cluster {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        text-align: center !important;
        gap: 4px !important;
        width: 100% !important;
        line-height: 1.4 !important;
    }
    .footer-copy-main-line {
        display: inline-flex !important;
        flex-wrap: wrap !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 6px !important;
        font-size: 12px !important;
    }
    .footer-copy-brand {
        display: inline !important;
        font-size: 12.5px !important;
        color: #0f172a !important;
        font-weight: 700 !important;
    }
    .footer-copy-sep {
        display: inline !important;
        color: #cbd5e1 !important;
        font-size: 8px !important;
    }
    .footer-copy-sep-desktop,
    .footer-copy-main-line .footer-copy-sep,
    .footer-copy-cluster .footer-copy-sep-desktop {
        display: none !important;
    }
    .footer-copy-unit {
        display: inline !important;
        font-size: 11.5px !important;
        color: #64748b !important;
        font-weight: 500 !important;
    }
    .footer-copy-rights-line {
        display: block !important;
    }
    .footer-copy-rights {
        display: inline !important;
        font-size: 11px !important;
        color: #94a3b8 !important;
        font-weight: 500 !important;
    }
    .footer-security-badge {
        font-size: 11px !important;
        padding: 5px 12px !important;
    }
}

@media (max-width: 380px) {
    .footer-nav-links {
        gap: 5px !important;
    }
    .footer-nav-links a {
        font-size: 10.5px !important;
    }
    .footer-nav-links a:not(:last-child)::after {
        margin-left: 5px;
    }
    .footer-copy-cluster {
        gap: 4px !important;
    }
    .footer-copy-unit,
    .footer-copy-rights {
        font-size: 10.5px !important;
    }
}

/* --- 8. REFERENCE AUTH MODAL & GLOBAL MODALS --- */
/* ==========================================================================
       ULTRA-PREMIUM EXECUTIVE ENROLLMENT MODAL (Neo-Brutalist Luxury Hybrid)
       ========================================================================== */
    .premium-enroll-modal {
        background: #ffffff;
        border: 2px solid #09080e;
        box-shadow: 6px 6px 0px #09080e, 0 24px 48px -12px rgba(9, 8, 14, 0.35);
        border-radius: 22px;
        width: 100%;
        max-width: 440px;
        padding: 24px 24px 20px;
        position: relative;
        overflow: hidden;
        box-sizing: border-box;
        animation: modalScaleIn 0.28s cubic-bezier(0.16, 1, 0.3, 1) forwards;
        max-height: 92vh;
        overflow-y: auto;
    }

    @keyframes modalScaleIn {
        from {
            opacity: 0;
            transform: scale(0.95) translateY(10px);
        }
        to {
            opacity: 1;
            transform: scale(1) translateY(0);
        }
    }

    /* Top Accent Line */
    .modal-accent-bar {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 4px;
        background: linear-gradient(90deg, #185adb 0%, #7c3aed 50%, #10b981 100%);
    }

    /* Close Button */
    .modal-close-btn {
        position: absolute;
        top: 14px;
        right: 14px;
        width: 32px;
        height: 32px;
        border-radius: 50%;
        background: #f8fafc;
        border: 1.5px solid #e2e8f0;
        color: #64748b;
        font-size: 14px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
        z-index: 2;
    }
    .modal-close-btn:hover {
        background: #09080e;
        color: #ffffff;
        border-color: #09080e;
        transform: rotate(90deg) scale(1.05);
    }

    /* Header Block */
    .modal-header-block {
        text-align: center;
        margin-top: 2px;
        margin-bottom: 14px;
    }
    .modal-badge-row {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        margin-bottom: 8px;
    }
    .live-batch-badge {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        background: #eff6ff;
        color: #185adb;
        border: 1px solid #bfdbfe;
        font-size: 11px;
        font-weight: 800;
        letter-spacing: 0.04em;
        padding: 4px 10px;
        border-radius: 9999px;
    }
    .live-dot-pulse {
        width: 7px;
        height: 7px;
        border-radius: 50%;
        background: #ef4444;
        box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.7);
        animation: livePulse 1.8s infinite;
    }
    @keyframes livePulse {
        0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.7); }
        70% { transform: scale(1); box-shadow: 0 0 0 5px rgba(239, 68, 68, 0); }
        100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(239, 68, 68, 0); }
    }
    .savings-pill-badge {
        background: #fef08a;
        color: #854d0e;
        border: 1px solid #fde047;
        font-size: 10.5px;
        font-weight: 900;
        padding: 3px 8px;
        border-radius: 9999px;
    }
    .modal-course-title {
        font-size: 21px;
        font-weight: 900;
        color: #09080e;
        line-height: 1.2;
        margin: 0 0 4px;
        letter-spacing: -0.02em;
    }
    .modal-sub-brand {
        font-size: 12px;
        font-weight: 700;
        color: #64748b;
    }

    /* Pricing Bento Strip */
    .modal-pricing-bento {
        background: #f8fafc;
        border: 1.5px solid #e2e8f0;
        border-radius: 14px;
        padding: 10px 14px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 15px;
    }
    .price-left {
        display: flex;
        flex-direction: column;
        gap: 2px;
    }
    .price-label {
        font-size: 9px;
        font-weight: 800;
        color: #64748b;
        letter-spacing: 0.06em;
    }
    .price-figures {
        display: flex;
        align-items: baseline;
        gap: 6px;
    }
    .price-current {
        font-size: 24px;
        font-weight: 900;
        color: #185adb;
        line-height: 1;
        letter-spacing: -0.02em;
    }
    .price-original {
        font-size: 13.5px;
        color: #94a3b8;
        text-decoration: line-through;
        font-weight: 600;
    }
    .price-right {
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        gap: 3px;
    }
    .discount-badge {
        background: #ecfdf5;
        color: #059669;
        border: 1px solid #a7f3d0;
        font-size: 11px;
        font-weight: 800;
        padding: 3px 8px;
        border-radius: 9999px;
    }
    .seats-alert {
        font-size: 10px;
        font-weight: 800;
        color: #b45309;
        display: flex;
        align-items: center;
        gap: 3px;
    }

    /* Form Layout */
    .modal-form {
        display: flex;
        flex-direction: column;
        gap: 12px;
    }
    .form-group-item {
        display: flex;
        flex-direction: column;
        gap: 5px;
    }
    .form-field-label {
        font-size: 11px;
        font-weight: 800;
        color: #1e293b;
        letter-spacing: 0.02em;
    }
    .req-star {
        color: #ef4444;
        font-weight: 900;
    }
    .label-with-micro-badge {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
    .whatsapp-micro-chip {
        font-size: 10px;
        font-weight: 700;
        color: #059669;
        background: #ecfdf5;
        padding: 1px 6px;
        border-radius: 4px;
        display: inline-flex;
        align-items: center;
        gap: 4px;
    }

    /* Input Container Box */
    .input-container-box {
        display: flex;
        align-items: center;
        background: #ffffff;
        border: 1.5px solid #cbd5e1;
        border-radius: 11px;
        padding: 0 12px;
        transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
        height: 44px;
        box-sizing: border-box;
    }
    .input-container-box:focus-within {
        border-color: #185adb;
        box-shadow: 0 0 0 3px rgba(24, 90, 219, 0.12);
        background: #fafcfe;
    }
    .input-icon-left {
        color: #94a3b8;
        font-size: 13px;
        margin-right: 10px;
        display: flex;
        align-items: center;
        flex-shrink: 0;
    }
    .country-prefix-pill {
        display: inline-flex;
        align-items: center;
        gap: 5px;
        background: #f1f5f9;
        border: 1px solid #e2e8f0;
        padding: 4px 7px;
        border-radius: 6px;
        margin-right: 8px;
        font-size: 12px;
        font-weight: 700;
        color: #334155;
        flex-shrink: 0;
    }
    .modal-input-field {
        width: 100%;
        border: none;
        outline: none;
        background: transparent;
        font-size: 13.5px;
        font-weight: 600;
        color: #09080e;
        font-family: inherit;
        padding: 0;
    }
    .modal-input-field::placeholder {
        color: #94a3b8;
        font-weight: 500;
    }
    .input-container-box.has-error {
        border-color: #ef4444 !important;
        background: #fef2f2 !important;
        box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.15) !important;
    }
    .input-container-box.is-valid {
        border-color: #10b981 !important;
        background: #f0fdf4 !important;
    }
    .form-field-error {
        display: flex;
        align-items: center;
        gap: 5px;
        color: #ef4444;
        font-size: 11px;
        font-weight: 700;
        margin-top: 5px;
        line-height: 1.2;
    }
    @keyframes shakeBox {
        0%, 100% { transform: translateX(0); }
        20%, 60% { transform: translateX(-5px); }
        40%, 80% { transform: translateX(5px); }
    }
    .shake-animate {
        animation: shakeBox 0.32s ease-in-out;
    }

    /* Submit CTA Button */
    .modal-submit-btn {
        width: 100%;
        background: #185adb;
        border: 2px solid #09080e;
        box-shadow: 3.5px 3.5px 0px #09080e;
        border-radius: 12px;
        padding: 11px 16px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        cursor: pointer;
        transition: all 0.22s cubic-bezier(0.16, 1, 0.3, 1);
        margin-top: 4px;
        text-align: left;
        user-select: none;
    }
    .modal-submit-btn:hover {
        background: #1e40af;
        transform: translateY(-2px);
        box-shadow: 5px 5px 0px #09080e;
    }
    .modal-submit-btn:active {
        transform: translateY(1px);
        box-shadow: 2px 2px 0px #09080e;
    }
    .btn-text-group {
        display: flex;
        flex-direction: column;
        gap: 1px;
    }
    .btn-main-title {
        color: #ffffff;
        font-size: 15px;
        font-weight: 900;
        letter-spacing: -0.01em;
        line-height: 1.2;
    }
    .btn-sub-note {
        color: #93c5fd;
        font-size: 10.5px;
        font-weight: 700;
    }
    .btn-icon-bubble {
        width: 32px;
        height: 32px;
        border-radius: 50%;
        background: rgba(255, 255, 255, 0.2);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #ffffff;
        font-size: 12.5px;
        flex-shrink: 0;
        transition: transform 0.2s ease;
    }
    .modal-submit-btn:hover .btn-icon-bubble {
        transform: translateX(3px);
        background: rgba(255, 255, 255, 0.3);
    }

    /* Accepted Payments Bar */
    .accepted-payments-bar {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
        margin-top: 1px;
    }
    .pm-lbl {
        font-size: 10px;
        font-weight: 800;
        color: #64748b;
        letter-spacing: 0.02em;
    }
    .pm-chip {
        font-size: 9.5px;
        font-weight: 700;
        color: #334155;
        background: #f8fafc;
        border: 1px solid #e2e8f0;
        padding: 2px 7px;
        border-radius: 5px;
        display: inline-flex;
        align-items: center;
        gap: 3.5px;
    }

    /* Trust & Security Dock */
    .modal-trust-dock {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        background: #f8fafc;
        border: 1px solid #e2e8f0;
        padding: 7px 10px;
        border-radius: 8px;
        margin-top: 2px;
        font-size: 10px;
        color: #475569;
        font-weight: 700;
    }
    .trust-pill-item {
        display: flex;
        align-items: center;
        gap: 4px;
        white-space: nowrap;
    }
    .text-green { color: #16a34a; }
    .text-blue { color: #2563eb; }
    .text-amber { color: #d97706; }
    .trust-sep {
        color: #cbd5e1;
    }

    /* Responsive adjustments */
    @media (max-width: 480px) {
        .premium-enroll-modal {
            padding: 20px 16px 16px;
            max-width: 95%;
            border-radius: 18px;
        }
        .modal-course-title {
            font-size: 18.5px;
        }
        .price-current {
            font-size: 22px;
        }
        .btn-main-title {
            font-size: 14px;
        }
        .modal-trust-dock {
            font-size: 9px;
            gap: 5px;
            padding: 6px 8px;
        }
        .modal-trust-dock strong {
            font-size: 8.5px;
        }
    }
    @media (max-width: 360px) {
        .premium-enroll-modal {
            padding: 18px 12px 14px;
        }
        .modal-trust-dock {
            font-size: 8px;
            gap: 4px;
            padding: 5px 6px;
        }
        .modal-trust-dock strong {
            font-size: 7.5px;
        }
        .pm-chip {
            font-size: 8.5px;
            padding: 2px 5px;
        }
        .whatsapp-micro-chip {
            font-size: 9px;
        }
    }

    /* ==========================================================================
       AUTHENTICATION & LOGIN SYSTEM (PREMIUM APPLE / LINEAR TIER)
       ========================================================================== */
    /* Header Sign In Button (Deprecated / Hidden - Unified into Register Now) */
    .btn-header-signin {
        display: none !important;
    }

    /* Header User Profile Pill (Logged In) */
    .header-user-pill {
        position: relative;
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: #ffffff;
        border: 1.5px solid #cbd5e1;
        border-radius: 999px;
        padding: 4.5px 12px 4.5px 5.5px;
        cursor: pointer;
        transition: all 0.22s cubic-bezier(0.16, 1, 0.3, 1);
        box-shadow: 0 2px 7px rgba(15, 23, 42, 0.06);
        user-select: none;
    }
    .header-user-pill:hover {
        border-color: #94a3b8;
        background: #f8fafc;
        box-shadow: 0 4px 12px rgba(15, 23, 42, 0.1);
        transform: translateY(-1px);
    }
    .user-avatar-mini {
        width: 27px;
        height: 27px;
        border-radius: 50%;
        background: linear-gradient(135deg, #185adb 0%, #6366f1 100%);
        color: #ffffff;
        font-weight: 800;
        font-size: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        text-transform: uppercase;
        box-shadow: 0 2px 6px rgba(24, 90, 219, 0.3);
        flex-shrink: 0;
    }
    .user-meta-mini {
        display: flex;
        align-items: center;
        gap: 5px;
    }
    .user-name-mini {
        font-family: var(--font-main);
        font-size: 12.5px;
        font-weight: 800;
        color: #0f172a;
        max-width: 85px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .user-status-dot {
        width: 6.5px;
        height: 6.5px;
        border-radius: 50%;
        background: #10b981;
        box-shadow: 0 0 0 2px #d1fae5;
        flex-shrink: 0;
    }
    .user-chevron-mini {
        font-size: 10.5px;
        color: #64748b;
        transition: transform 0.2s ease;
    }
    .header-user-pill.is-active .user-chevron-mini {
        transform: rotate(180deg);
    }

    /* Floating User Dropdown Menu */
    .user-dropdown-menu {
        position: absolute;
        top: calc(100% + 9px);
        right: 0;
        width: 245px;
        background: #ffffff;
        border: 1px solid #e2e8f0;
        border-radius: 16px;
        box-shadow: 0 16px 36px -8px rgba(15, 23, 42, 0.22), 0 0 0 1px rgba(0, 0, 0, 0.04);
        padding: 13px;
        display: none;
        flex-direction: column;
        gap: 9px;
        z-index: 1050;
        animation: userDropFade 0.2s cubic-bezier(0.16, 1, 0.3, 1) forwards;
    }
    @keyframes userDropFade {
        from { opacity: 0; transform: translateY(-6px) scale(0.97); }
        to { opacity: 1; transform: translateY(0) scale(1); }
    }
    .user-drop-header {
        display: flex;
        align-items: center;
        gap: 10px;
        padding-bottom: 9px;
        border-bottom: 1px solid #f1f5f9;
    }
    .user-drop-avatar {
        width: 35px;
        height: 35px;
        border-radius: 50%;
        background: linear-gradient(135deg, #185adb 0%, #6366f1 100%);
        color: #ffffff;
        font-weight: 800;
        font-size: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
    }
    .user-drop-info {
        overflow: hidden;
    }
    .user-drop-info strong {
        display: block;
        font-size: 13px;
        font-weight: 800;
        color: #0f172a;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .user-drop-info span {
        display: block;
        font-size: 11px;
        color: #64748b;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .user-drop-status-badge {
        background: #f0fdf4;
        border: 1px solid #bbf7d0;
        color: #15803d;
        font-size: 10.5px;
        font-weight: 700;
        padding: 4px 8px;
        border-radius: 6px;
        display: flex;
        align-items: center;
        gap: 5px;
    }
    .user-drop-action-btn {
        background: #eff6ff;
        border: 1px solid #bfdbfe;
        color: #1d4ed8;
        font-size: 12px;
        font-weight: 800;
        padding: 8px 12px;
        border-radius: 8px;
        cursor: pointer;
        text-align: left;
        display: flex;
        align-items: center;
        gap: 7px;
        transition: background 0.15s;
    }
    .user-drop-action-btn:hover {
        background: #dbeafe;
    }
    .user-drop-logout-btn {
        background: #fff1f2;
        border: 1px solid #fecdd3;
        color: #be123c;
        font-size: 12px;
        font-weight: 800;
        padding: 8px 12px;
        border-radius: 8px;
        cursor: pointer;
        text-align: left;
        display: flex;
        align-items: center;
        gap: 7px;
        transition: background 0.15s;
    }
    .user-drop-logout-btn:hover {
        background: #ffe4e6;
    }

    /* Mobile Drawer Learner Account Card */
    .drawer-auth-card {
        background: linear-gradient(135deg, rgba(24, 90, 219, 0.05) 0%, rgba(99, 102, 241, 0.05) 100%);
        border: 1px solid rgba(24, 90, 219, 0.16);
        border-radius: 14px;
        padding: 12px 14px;
        margin-bottom: 14px;
    }
    .drawer-auth-logged-out {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
    }
    .drawer-auth-text strong {
        display: block;
        font-size: 13px;
        font-weight: 800;
        color: #0f172a;
    }
    .drawer-auth-text span {
        font-size: 11px;
        color: #64748b;
    }
    .drawer-auth-btn-login {
        background: #185adb;
        color: #ffffff;
        font-size: 12px;
        font-weight: 800;
        padding: 7px 13px;
        border-radius: 8px;
        border: none;
        cursor: pointer;
        display: inline-flex;
        align-items: center;
        gap: 5px;
        white-space: nowrap;
        box-shadow: 0 3px 8px rgba(24, 90, 219, 0.3);
    }
    .drawer-auth-logged-in {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
    }
    .drawer-user-left {
        display: flex;
        align-items: center;
        gap: 9px;
        overflow: hidden;
    }
    .drawer-user-meta strong {
        display: block;
        font-size: 13px;
        font-weight: 800;
        color: #0f172a;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .drawer-user-meta span {
        display: block;
        font-size: 10.5px;
        color: #16a34a;
        font-weight: 700;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .drawer-logout-mini {
        background: transparent;
        border: 1px solid #cbd5e1;
        color: #64748b;
        font-size: 11px;
        font-weight: 700;
        padding: 5px 9px;
        border-radius: 6px;
        cursor: pointer;
    }

    /* ==========================================================================
       AUTH / LOGIN MODAL DIALOGS
       ========================================================================== */
    .auth-modal-overlay {
        position: fixed;
        inset: 0;
        background: rgba(9, 8, 14, 0.72);
        backdrop-filter: blur(12px);
        -webkit-backdrop-filter: blur(12px);
        z-index: 99999;
        display: none;
        align-items: center;
        justify-content: center;
        padding: 16px;
        box-sizing: border-box;
    }
    #authLoginModal.active, .auth-modal-overlay.active {
        display: flex !important;
        animation: authFadeInBackdrop 0.25s ease forwards;
    }
    @keyframes authFadeInBackdrop {
        from { opacity: 0; }
        to { opacity: 1; }
    }
    .auth-modal-card {
        background: #ffffff;
        border-radius: 28px;
        border: 1.5px solid rgba(226, 232, 240, 0.9);
        box-shadow: 
            0 25px 65px -12px rgba(15, 23, 42, 0.28),
            0 0 0 1px rgba(15, 23, 42, 0.04);
        padding: 30px 28px 24px;
        max-width: 410px;
        width: 100%;
        position: relative;
        box-sizing: border-box;
        text-align: left;
        max-height: calc(100vh - 36px);
        overflow-y: auto;
        scrollbar-width: none;
        animation: authCardPopIn 0.3s cubic-bezier(0.16, 1, 0.3, 1) forwards;
    }
    .auth-modal-card::-webkit-scrollbar {
        display: none;
    }
    @keyframes authCardPopIn {
        from { opacity: 0; transform: scale(0.95) translateY(10px); }
        to { opacity: 1; transform: scale(1) translateY(0); }
    }
    .auth-modal-close {
        position: absolute;
        top: 16px;
        right: 16px;
        width: 34px;
        height: 34px;
        border-radius: 50%;
        background: #f8fafc;
        border: 1px solid #e2e8f0;
        color: #64748b;
        font-size: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        transition: all 0.2s ease;
        padding: 0;
        z-index: 10;
    }
    .auth-modal-close:hover {
        background: #fee2e2;
        border-color: #fca5a5;
        color: #ef4444;
        transform: rotate(90deg);
    }
    .auth-modal-logo-wrap {
        text-align: center;
        margin-bottom: 22px;
        padding-bottom: 14px;
        border-bottom: 1px solid #f1f5f9;
    }
    .auth-modal-logo-img {
        max-width: 195px;
        width: 100%;
        height: auto;
        display: block;
        margin: 0 auto;
    }
    .btn-modal-google {
        width: 100%;
        height: 50px;
        background: #ffffff;
        border: 1.5px solid #e2e8f0;
        border-radius: 14px;
        font-family: inherit;
        font-size: 15px;
        font-weight: 700;
        color: #09080e;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 12px;
        cursor: pointer;
        transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
        box-shadow: 0 2px 6px rgba(15, 23, 42, 0.04);
        box-sizing: border-box;
    }
    .btn-modal-google:hover {
        background: #fafbfd;
        border-color: #cbd5e1;
        box-shadow: 0 6px 18px rgba(15, 23, 42, 0.08);
        transform: translateY(-1px);
    }
    .btn-modal-google:active {
        transform: translateY(1px);
    }
    .google-icon-svg {
        width: 22px;
        height: 22px;
        flex-shrink: 0;
    }
    .auth-modal-divider {
        display: flex;
        align-items: center;
        margin: 20px 0;
        color: #94a3b8;
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.8px;
    }
    .auth-modal-divider::before,
    .auth-modal-divider::after {
        content: '';
        flex: 1;
        height: 1px;
        background: #e2e8f0;
    }
    .auth-modal-divider span {
        padding: 0 12px;
    }
    .auth-modal-fields {
        display: flex;
        flex-direction: column;
        gap: 14px;
    }
    .auth-modal-field {
        display: flex;
        flex-direction: column;
        gap: 6px;
    }
    .auth-modal-label {
        font-size: 12px;
        font-weight: 700;
        color: #334155;
        letter-spacing: 0.2px;
    }
    .auth-modal-input-shell {
        position: relative;
        display: flex;
        align-items: center;
        width: 100%;
        box-sizing: border-box;
    }
    .auth-modal-input-shell .auth-input-icon {
        position: absolute;
        left: 14px;
        color: #94a3b8;
        font-size: 14px;
        pointer-events: none;
        transition: color 0.2s ease;
    }
    .auth-modal-input {
        width: 100%;
        height: 46px;
        padding: 0 42px 0 42px;
        border-radius: 14px;
        border: 1.5px solid #e2e8f0;
        font-family: inherit;
        font-size: 14px;
        color: #09080e;
        background: #ffffff;
        outline: none;
        transition: all 0.2s ease;
        box-sizing: border-box;
    }
    .auth-modal-input:focus {
        border-color: #185adb;
        box-shadow: 0 0 0 3.5px rgba(24, 90, 219, 0.12);
    }
    .auth-modal-input.has-error {
        border-color: #ef4444 !important;
        box-shadow: 0 0 0 3.5px rgba(239, 68, 68, 0.28) !important;
    }
    .auth-modal-input:focus ~ .auth-input-icon {
        color: #185adb;
    }
    .auth-toggle-pwd {
        position: absolute;
        right: 12px;
        background: transparent;
        border: none;
        color: #94a3b8;
        font-size: 14px;
        cursor: pointer;
        padding: 6px 8px;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: color 0.2s ease;
    }
    .auth-toggle-pwd:hover {
        color: #09080e;
    }
    .auth-modal-meta-row {
        display: flex;
        align-items: center;
        justify-content: space-between;
        font-size: 12.5px;
        margin-top: -2px;
    }
    .auth-remember-label {
        display: flex;
        align-items: center;
        gap: 7px;
        color: #64748b;
        cursor: pointer;
        font-weight: 600;
        user-select: none;
    }
    .auth-remember-label input[type="checkbox"] {
        accent-color: #185adb;
        width: 15px;
        height: 15px;
        cursor: pointer;
    }
    .auth-forgot-link {
        color: #185adb;
        text-decoration: none;
        font-weight: 700;
        transition: color 0.2s ease;
    }
    .auth-forgot-link:hover {
        color: #1142a4;
        text-decoration: underline;
    }
    .btn-modal-auth-submit {
        width: 100%;
        height: 50px;
        background: linear-gradient(135deg, #185adb 0%, #1040a3 100%);
        border: none;
        border-radius: 14px;
        font-family: inherit;
        font-size: 15px;
        font-weight: 800;
        letter-spacing: 0.3px;
        color: #ffffff;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 9px;
        transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
        box-shadow: 0 6px 20px rgba(24, 90, 219, 0.35);
        margin-top: 4px;
        box-sizing: border-box;
    }
    .btn-modal-auth-submit:hover {
        background: linear-gradient(135deg, #1f64ed 0%, #1246b3 100%);
        box-shadow: 0 8px 25px rgba(24, 90, 219, 0.45);
        transform: translateY(-1px);
    }
    .btn-modal-auth-submit:active {
        transform: translateY(1px);
    }
    .auth-modal-trust-strip {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 7px;
        font-size: 11.5px;
        font-weight: 600;
        color: #64748b;
        margin-top: 16px;
        padding-top: 13px;
        border-top: 1px dashed #e2e8f0;
    }
    .auth-modal-trust-strip i {
        color: #10b981;
        font-size: 13px;
    }
    .auth-modal-profile-box {
        background: #f8fafc;
        border: 1.5px solid #e2e8f0;
        border-radius: 16px;
        padding: 16px;
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 8px;
        margin-bottom: 16px;
    }
    .auth-profile-avatar {
        width: 48px;
        height: 48px;
        border-radius: 50%;
        background: #eff6ff;
        color: #185adb;
        border: 2px solid #bfdbfe;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 20px;
        font-weight: 800;
    }
    .auth-profile-name {
        font-size: 16px;
        font-weight: 800;
        color: #09080e;
    }
    .auth-profile-email {
        font-size: 13px;
        color: #64748b;
        margin-top: -4px;
    }
    .btn-modal-logout {
        width: 100%;
        height: 44px;
        background: #fee2e2;
        color: #b91c1c;
        border: 1.5px solid #fca5a5;
        border-radius: 12px;
        font-size: 13.5px;
        font-weight: 800;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        transition: all 0.18s ease;
        box-sizing: border-box;
    }
    .btn-modal-logout:hover {
        background: #fecaca;
    }


    /* Google Account Picker Modal */
    #authGooglePickerModal {
        position: fixed;
        inset: 0;
        background: rgba(9, 12, 22, 0.65);
        backdrop-filter: blur(8px);
        z-index: 10050;
        display: none;
        align-items: center;
        justify-content: center;
        padding: 16px;
        box-sizing: border-box;
    }
    .google-picker-card {
        background: #ffffff;
        border-radius: 20px;
        max-width: 380px;
        width: 100%;
        padding: 24px;
        box-shadow: 0 24px 60px rgba(15, 23, 42, 0.3);
        position: relative;
        animation: authModalPop 0.22s ease-out;
    }
    .google-picker-header {
        text-align: center;
        margin-bottom: 18px;
    }
    .google-picker-header h4 {
        font-size: 17px;
        font-weight: 800;
        color: #1e293b;
        margin: 8px 0 4px;
    }
    .google-picker-header p {
        font-size: 12px;
        color: #64748b;
        margin: 0;
    }
    .google-account-list {
        display: flex;
        flex-direction: column;
        gap: 8px;
        margin-bottom: 16px;
    }
    .google-acc-item {
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 10px 12px;
        border: 1px solid #e2e8f0;
        border-radius: 12px;
        background: #ffffff;
        cursor: pointer;
        transition: all 0.18s;
    }
    .google-acc-item:hover {
        background: #f8fafc;
        border-color: #cbd5e1;
        transform: translateY(-1px);
    }
    .google-acc-avatar {
        width: 36px;
        height: 36px;
        border-radius: 50%;
        background: #e0e7ff;
        color: #3730a3;
        font-weight: 800;
        font-size: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
    }
    .google-acc-info {
        text-align: left;
        overflow: hidden;
    }
    .google-acc-name {
        font-size: 13px;
        font-weight: 700;
        color: #0f172a;
        display: block;
    }
    .google-acc-email {
        font-size: 11px;
        color: #64748b;
        display: block;
    }
    .google-custom-acc-input {
        margin-top: 8px;
        display: none;
        flex-direction: column;
        gap: 8px;
    }
    .google-custom-acc-input input {
        height: 38px;
        padding: 0 10px;
        border: 1.5px solid #cbd5e1;
        border-radius: 8px;
        font-size: 12.5px;
        outline: none;
    }
    .google-custom-acc-input input:focus {
        border-color: #4285F4;
    }



    /* Toast Notification (Sleek Bottom Pill) */
    #authToast {
        position: fixed;
        bottom: 24px;
        top: auto;
        left: 50%;
        transform: translateX(-50%) translateY(24px);
        background: rgba(15, 23, 42, 0.94);
        backdrop-filter: blur(14px);
        -webkit-backdrop-filter: blur(14px);
        color: #ffffff;
        padding: 9px 18px;
        border-radius: 9999px;
        font-size: 13px;
        font-weight: 600;
        box-shadow: 0 12px 30px rgba(0, 0, 0, 0.35), 0 0 0 1px rgba(255, 255, 255, 0.14);
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        z-index: 100095;
        opacity: 0;
        pointer-events: none;
        transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.24s ease;
        white-space: nowrap;
        max-width: calc(100vw - 32px);
        box-sizing: border-box;
    }
    #authToast.is-shown {
        transform: translateX(-50%) translateY(0);
        opacity: 1;
        pointer-events: auto;
    }
    #authToast i {
        font-size: 14px;
        color: #10b981;
        flex-shrink: 0;
    }
    #authToast span, #authToast #authToastText {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        font-size: 13px;
        line-height: 1.2;
    }
    @media (max-width: 640px) {
        #authToast {
            bottom: calc(18px + env(safe-area-inset-bottom, 0px));
            padding: 8px 16px;
            font-size: 12.5px;
            max-width: calc(100vw - 28px);
        }
        #authToast i {
            font-size: 13px;
        }
        #authToast span, #authToast #authToastText {
            font-size: 12.5px;
        }
    }

    /* Mobile Responsive Optimizations */
    @media (max-width: 520px) {
        .auth-modal-body {
            padding: 22px 18px 16px;
        }
        .auth-title {
            font-size: 20px;
        }
        .auth-otp-input {
            width: 42px;
            height: 46px;
            font-size: 19px;
        }
        .header-actions {
            gap: 6px !important;
        }
        .btn-register-now {
            padding: 6.5px 10px !important;
            font-size: 11px !important;
            letter-spacing: 0.2px !important;
        }
        .mobile-nav-toggle {
            width: 36px !important;
            height: 36px !important;
            font-size: 16px !important;
            flex-shrink: 0 !important;
        }
        .btn-header-signin span {
            display: none !important;
        }
        .btn-header-signin {
            padding: 0 !important;
            width: 32px !important;
            height: 32px !important;
            border-radius: 50% !important;
            display: inline-flex;
            align-items: center !important;
            justify-content: center !important;
            font-size: 13px !important;
            flex-shrink: 0 !important;
        }
        .header-user-pill {
            padding: 0 !important;
            background: transparent !important;
            border: none !important;
            box-shadow: none !important;
            flex-shrink: 0 !important;
        }
        .header-user-pill .user-name-mini,
        .header-user-pill .user-status-dot,
        .header-user-pill .user-chevron-mini {
            display: none !important;
        }
        .user-avatar-mini {
            width: 31px !important;
            height: 31px !important;
            font-size: 13px !important;
        }
    }