/* =========================================================
   GLOBAL RESET & VARIABLES
   ========================================================= */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    background: #000;
    color: #fff;
    font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    line-height: 1.6;
}

:root {
    --gold: #d4af37;
    --gold-soft: rgba(212, 175, 55, 0.65);
    --dark: #000000;
    --card-bg: #0f0f0f;
    --border-gold: rgba(212, 175, 55, 0.28);
    --radius: 14px;
}

/* =========================================================
   TOP NAV
   ========================================================= */
.top-nav {
    width: 100%;
    border-bottom: 1px solid rgba(255,255,255,0.06);
    position: sticky;
    top: 0;
    z-index: 999;
    background: rgba(0,0,0,0.85);
    backdrop-filter: blur(12px);
}

.top-nav-inner {
    max-width: 1300px;
    margin: auto;
    padding: 14px 20px;

    display: flex;
    align-items: center;
    justify-content: space-between;
}

.logo-img {
    height: 60px;
}

.nav-links {
    display: flex;
    gap: 25px;
}

.nav-link {
    color: #fff;
    text-decoration: none;
    font-weight: 500;
    font-size: 15px;
    opacity: 0.75;
    transition: 0.2s;
}

.nav-link:hover {
    opacity: 1;
    color: var(--gold);
}

.nav-cta-btn {
    background: var(--gold);
    padding: 10px 22px;
    border-radius: 999px;
    color: #000;
    font-weight: 700;
    text-decoration: none;
    transition: 0.2s;
}

.nav-cta-btn:hover {
    transform: translateY(-2px);
    background: #c19a32;
}

/* =========================================================
   REUSABLE CLASSES
   ========================================================= */
.eyebrow {
    font-size: 14px;
    opacity: 0.75;
    letter-spacing: 1px;
    text-transform: uppercase;
    margin-bottom: 10px;
    color: var(--gold);
}

.section-title {
    font-size: 34px;
    color: var(--gold);
    margin-bottom: 14px;
    line-height: 1.25;
    text-shadow: 0 0 14px rgba(212,175,55,0.28);
}

.section-subtitle {
    max-width: 700px;
    margin: 0 auto;
    opacity: 0.75;
    font-size: 17px;
}

.center {
    text-align: center;
}

.btn {
    display: inline-block;
    padding: 12px 28px;
    border-radius: 999px;
    text-decoration: none;
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
    transition: 0.25s ease;
}

.btn-primary {
    background: var(--gold);
    color: #000;
}

.btn-primary:hover {
    background: #c19a32;
    transform: translateY(-3px);
}

.btn-ghost {
    border: 1px solid var(--gold);
    color: var(--gold);
}

.btn-ghost:hover {
    background: var(--gold);
    color: #000;
    transform: translateY(-3px);
}

.btn-large {
    padding: 16px 40px;
    font-size: 20px;
}

/* =========================================================
   HERO SECTION
   ========================================================= */
.hero-section {
    padding: 100px 20px 70px;
    width: 100%;
    max-width: 1200px; /* more natural size */
    margin: 0 auto;
}


.hero-inner {
    display: flex;
    gap: 50px;
    align-items: center;
}

.hero-copy {
    flex: 1;
}

.hero-title {
    font-size: 48px;
    font-weight: 800;
    margin-bottom: 15px;
}

.hero-subtitle {
    opacity: 0.8;
    margin-bottom: 30px;
    max-width: 600px;
}

.hero-cta-row {
    display: flex;
    gap: 16px;
    margin-bottom: 25px;
}

.trust-pill {
    display: inline-block;
    padding: 6px 14px;
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 999px;
    font-size: 13px;
    opacity: 0.75;
    margin-right: 8px;
}

.hero-video-block {
    flex: 1;
}

.hero-video-card {
    position: relative; /* anchor for overlay */
    padding: 0 !important; /* removes extra spacing */
    border-radius: 18px;
    background: var(--card-bg);
    box-shadow: 0 0 40px rgba(212,175,55,0.25);
    overflow: hidden; /* IMPORTANT: keeps overlay clipped to video */
}
.video-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;   /* match video width */
    height: 100%;  /* match video height */
    display: flex;
    justify-content: center;
    align-items: center;
    background: rgba(0,0,0,0.35);
    backdrop-filter: blur(2px);
    cursor: pointer;
    z-index: 10;
    transition: opacity 0.35s ease;
}

.hero-video-label {
    font-size: 14px;
    margin-bottom: 8px;
    opacity: 0.85;
    display: flex;
    align-items: center;
    gap: 6px;
}

.label-dot {
    width: 8px;
    height: 8px;
    background: var(--gold);
    border-radius: 50%;
}

.hero-video {
    width: 100%;
    border-radius: 12px;
}

.hero-video-caption {
    margin-top: 10px;
    opacity: 0.7;
    font-size: 14px;
}

/* =========================================================
   PROOF SECTION
   ========================================================= */
.proof-section {
    padding: 90px 20px;
    max-width: 1300px;
    margin: auto;
}

.proof-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 35px;
    align-items: start;
}


.proof-card {
    background: var(--card-bg);
    border: 1px solid var(--border-gold);
    padding: 30px;
    border-radius: var(--radius);
    box-shadow: 0 0 22px rgba(212,175,55,0.12);
    width: 100%;
}


/* =========================================================
   INFINITE SLIDER SYSTEM
   ========================================================= */

.identity-slider-section, 
.telegram-slider-section {
    margin-top: 20px;
}

.scroll-wrapper {
    width: 100%;
    overflow: hidden;
    position: relative;
    margin: 20px 0;
    height: 120px;  /* controls slider height */
}


.scroll-row {
    display: flex;
    gap: 20px;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    white-space: nowrap;
}

/* FORCE ALL SLIDER IMAGES TO BE PERFECT 1:1 SQUARES */
.identity-img,
.proof-img {
    width: 120px;      /* set the square size */
    height: 120px;     /* SAME VALUE = 1:1 */
    object-fit: cover;
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,0.10);
    box-shadow: 0 0 8px rgba(0,0,0,0.35);
}


.scroll-right-to-left {
    animation-name: sliderRightToLeft;
    animation-duration: 35s;
}

@keyframes sliderRightToLeft {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

.scroll-left-to-right {
    animation-name: sliderLeftToRight;
    animation-duration: 35s;
}

@keyframes sliderLeftToRight {
    0% { transform: translateX(-50%); }
    100% { transform: translateX(0); }
}

.fade-left::before,
.fade-right::after {
    content: "";
    position: absolute;
    top: 0;
    width: 120px;
    height: 100%;
    z-index: 10;
    pointer-events: none;
}

.fade-left::before {
    left: 0;
    background: linear-gradient(to right, #000 0%, transparent 100%);
}

.fade-right::after {
    right: 0;
    background: linear-gradient(to left, #000 0%, transparent 100%);
}

@media (max-width: 768px) {
    .identity-img,
    .proof-img {
        height: 130px;
        min-width: 180px;
    }
}

.proof-list li {
    margin-bottom: 10px;
    font-size: 15px;
}

.telegram-icon {
    width: 40px;
    margin-right: 8px;
}

/* =========================================================
   STORY SECTION
   ========================================================= */
.story-section {
    padding: 90px 20px;
    max-width: 1100px;
    margin: auto;
}

.story-text p {
    margin-bottom: 18px;
    opacity: 0.85;
}

/* =========================================================
   OFFER SECTION
   ========================================================= */
.offer-section {
    padding: 90px 20px;
    max-width: 1300px;
    margin: auto;
}

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

.offer-card {
    background: var(--card-bg);
    padding: 28px;
    border-radius: var(--radius);
    border: 1px solid var(--border-gold);
    box-shadow: 0 0 16px rgba(212,175,55,0.12);
}

.offer-title {
    font-size: 20px;
    color: var(--gold);
    margin-bottom: 12px;
}

.offer-bullets li {
    margin-bottom: 10px;
    opacity: 0.8;
}

.offer-note {
    margin-top: 12px;
    opacity: 0.7;
}

.offer-cta-row {
    text-align: center;
    margin-top: 40px;
}

/* =========================================================
   MENTORS SECTION
   ========================================================= */
.mentors-section {
    padding: 90px 20px;
    max-width: 1300px;
    margin: auto;
}

.mentors-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* Always 3 columns */
    gap: 35px;
    max-width: 1300px;
    margin: 40px auto 0 auto;
}


.mentor-card {
    background: var(--card-bg);
    padding: 22px;
    border: 1px solid var(--border-gold);
    max-width: 300px;          /* prevents giant cards */
    margin: auto;
    border-radius: var(--radius);
    box-shadow: 0 0 16px rgba(212,175,55,0.12);
    text-align: center;
}

/* Mentor Header Layout */
.mentor-header {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 14px;
}

/* Circular Mentor Photos */
.mentor-photo {
    width: 95px;
    height: 95px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid var(--gold);
    margin-bottom: 10px;
}

/* Text */
.mentor-name {
    font-size: 18px;
    font-weight: 700;
    color: var(--gold);
    margin-bottom: 4px;
}

.mentor-role {
    opacity: 0.75;
    font-size: 14px;
    margin-bottom: 10px;
}

.mentor-tagline {
    font-size: 14px;
    opacity: 0.8;
    margin-bottom: 12px;
}

/* Toggle Button */
.mentor-toggle {
    background: transparent;
    border: 1px solid var(--gold);
    color: var(--gold);
    padding: 8px 16px;
    border-radius: 999px;
    cursor: pointer;
    font-weight: 600;
    transition: 0.25s ease;
}

.mentor-toggle:hover {
    background: var(--gold);
    color: #000;
}

/* Hidden Details */
.mentor-details {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.35s ease;
    text-align: left;
    margin-top: 12px;
    padding: 0 6px;
}

.mentor-details.open {
    padding-top: 12px;
}

.mentor-details p {
    font-size: 14px;
    opacity: 0.85;
    margin-bottom: 10px;
}

.mentor-details ul {
    padding-left: 16px;
    font-size: 14px;
    opacity: 0.85;
}

.mentor-details li {
    margin-bottom: 6px;
}

@media (max-width: 900px) {
    .hero-inner {
        flex-direction: column;
        text-align: center;
    }

    .hero-video-block {
        width: 100%;
    }
}
/* FIX: Prevent sliders from stretching the grid */
.identity-card .scroll-row,
.telegram-card .scroll-row {
    display: flex;
    gap: 20px;
    width: max-content; /* prevents stretching */
}

/* FIX: Make sure cards don’t expand wider than their grid column */
.proof-card {
    width: 100%;
    overflow: hidden;
}
/* ========================================================= */
/*           PRICING V2 – CLONED FROM V1 DESIGN               */
/* ========================================================= */

/* PAGE BACKGROUND */
body.pricing-v2 {
    background: #000 !important;
}

/* TITLE */
.pricing-v2 #choose-path .section-title {
    color: #d4af37 !important;
    font-size: 32px !important;
    margin-top: 20px !important;
    margin-bottom: 40px !important;
    text-align: center;
}

/* 3-COLUMN GRID FIX */
.pricing-v2 #choose-path .choose-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 520px) !important; /* each card wider */
    justify-content: center !important;
    gap: 28px !important;
    max-width: 1300px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
}

/* CARD STYLE – EXACT V1 LOOK */
.pricing-v2 .choose-card {
    background: rgba(24, 24, 24, 0.55) !important;
    backdrop-filter: blur(14px) saturate(140%) !important;
    border: 1px solid rgba(212,175,55,0.25) !important;
    border-radius: 16px !important;
    padding: 24px !important;
    position: relative !important;
    box-shadow: 0 0 25px rgba(212,175,55,0.15) !important;
    color: white !important;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

/* MOST POPULAR GLOW */
.pricing-v2 .popular-card {
    border: 1px solid rgba(212,175,55,0.65) !important;
    box-shadow: 0 0 35px rgba(212,175,55,0.45) !important;
}

/* BUTTON FIX */
.pricing-v2 .btn-gold {
    background: #d4af37 !important;
    color: #000 !important;
    padding: 12px 20px !important;
    font-weight: 700 !important;
    border-radius: 999px !important;
    text-align: center !important;
    margin-top: auto !important;
}

/* COUNTDOWN */
.pricing-v2 .countdown-box {
    text-align: center !important;
    margin-top: 40px !important;
    color: #d4af37 !important;
    font-size: 20px !important;
}

.pricing-v2 .countdown-timer {
    font-size: 24px !important;
    color: #fff !important;
}

/* TRUST LINE */
.pricing-v2 .trust-line {
    margin-top: 40px !important;
    text-align: center !important;
    color: #d4af37 !important;
    font-size: 22px !important;
    opacity: 0.9;
}
/* ========================================================= */
/*                    PREMIUM PRICING ANIMATIONS             */
/* ========================================================= */

/* Smooth fade-up */
@keyframes premiumFadeUp {
    0% { opacity: 0; transform: translateY(25px) scale(0.98); }
    60% { opacity: 1; transform: translateY(-4px) scale(1.02); }
    100% { opacity: 1; transform: translateY(0) scale(1); }
}

/* Gold glow pulse */
@keyframes goldGlowIn {
    0% { box-shadow: 0 0 0 rgba(212,175,55,0); }
    100% { box-shadow: 0 0 35px rgba(212,175,55,0.35); }
}

/* Premium particle float */
@keyframes goldParticleFloat {
    0% { transform: translateY(0) scale(1); opacity: 0.9; }
    100% { transform: translateY(-80px) scale(0.5); opacity: 0; }
}

/* Premium shimmer for button */
@keyframes premiumShimmer {
    0% { left: -100%; }
    100% { left: 150%; }
}

/* Apply premium animation to pricing cards */
.pricing-v2 .choose-card {
    animation: premiumFadeUp 0.9s ease forwards;
    opacity: 0;
}
.pricing-v2 .choose-card:nth-child(1) { animation-delay: 0.15s; }
.pricing-v2 .choose-card:nth-child(2) { animation-delay: 0.35s; }
.pricing-v2 .choose-card:nth-child(3) { animation-delay: 0.55s; }

/* Premium card hover */
.pricing-v2 .choose-card:hover {
    transform: translateY(-6px) scale(1.02);
    box-shadow: 0 0 40px rgba(212,175,55,0.45) !important;
}

/* Gold dust particles */
.pricing-v2 .choose-card .particle-container span,
.pricing-v2 .choose-card .particle {
    animation: goldParticleFloat 5s linear infinite !important;
    opacity: 0.85;
}

/* Button glow + shimmer */
.pricing-v2 .btn-gold {
    position: relative;
    overflow: hidden;
    transition: 0.3s ease;
}
/* PREMIUM BUTTON HOVER */
.pricing-v2 .btn-gold {
    position: relative;
    overflow: hidden;
    transition: transform 0.35s cubic-bezier(0.23, 1, 0.32, 1),
                box-shadow 0.35s ease,
                background 0.35s ease;
}

.pricing-v2 .btn-gold:hover {
    transform: scale(1.06);
    box-shadow: 0 0 35px rgba(212,175,55,0.55),
                0 0 55px rgba(212,175,55,0.35);
    background: #e0bf4a !important;
}
.pricing-v2 .btn-gold::after {
    content: "";
    position: absolute;
    top: 0;
    left: -120%;
    width: 60%;
    height: 100%;
    background: linear-gradient(120deg, transparent, rgba(255,255,255,0.4), transparent);
    transform: skewX(-20deg);
}
.pricing-v2 .btn-gold:hover::after {
    animation: premiumShimmer 0.9s ease forwards;
}

/* Gold background glow behind card */
.pricing-v2 .choose-card::before {
    content: "";
    position: absolute;
    inset: -10px;
    background: radial-gradient(circle, rgba(212,175,55,0.18), transparent 70%);
    z-index: 0;
    opacity: 0;
    transition: opacity 0.4s ease;
}
.pricing-v2 .choose-card:hover::before {
    opacity: 1;
}
.offer-bullets {
    list-style: none;
    padding-left: 0;
    margin: 0;
}

/* Clean custom gold bullet */
.offer-bullets li::before {
    content: "•";
    position: absolute;
    left: 0;
    top: 0;
    font-size: 14px;
    color: var(--gold);
    opacity: 0.85;
}
.offer-subheader {
    color: var(--gold);
    font-size: 17px;
    font-weight: 700;
    margin-top: 18px;
    margin-bottom: 8px;
}


.offer-bullets li {
    margin: 4px 0;
    padding-left: 18px;
    position: relative;
    line-height: 1.42;
}
.offer-bullets li::before {
    content: "•";
    position: absolute;
    left: 0;
    top: 0px;
    font-size: 14px;
    color: var(--gold);
    opacity: 0.85;
}
.mentor-line {
    margin: 4px 0;
    padding-left: 0;
    font-size: 15px;
}
/* Smaller, tighter sublist under "Super Mentor" */
.mentor-sublist li {
    margin: 3px 0;
    padding-left: 18px;
}

/* Clean bullets for ALL lists (Super Mentor + Specialist) */
.offer-bullets li::before {
    content: "•";
    color: var(--gold);
    font-size: 14px;
    position: absolute;
    left: 0;
    top: 1px;
}
.package-subtitle {
    font-size: 16px;
    opacity: 0.85;
    margin-top: -8px;
    margin-bottom: 10px;
    text-align: center;
}
.subtitle {
    text-align: center;
    font-size: 16px;
    opacity: 0.8;
    margin-top: -4px;
    margin-bottom: 12px;
}
.flag {
    width: 16px;
    height: 16px;
    object-fit: contain;
    display: inline-block;
    margin-left: 6px;
    vertical-align: -3px;
}
/* ========================================= */
/*  FIX PRICING CARD ALIGNMENT               */
/* ========================================= */

/* 1. Make all titles the same height */
.pricing-v2 .choose-card h2 {
    min-height: 58px;          /* keep all titles aligned */
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

/* 2. Make subtitles consistent alignment */
.pricing-v2 .choose-card .subtitle,
.pricing-v2 .choose-card .package-subtitle {
    min-height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

/* 3. Make all cards equal height */
.pricing-v2 .choose-grid {
    align-items: stretch !important;
}

/* 4. Make button stay at the bottom */
.pricing-v2 .choose-card {
    display: flex;
    flex-direction: column;
}

.pricing-v2 .choose-card ul:last-of-type {
    flex-grow: 1;
}
.pricing-v2 #choose-path .choose-grid {
    max-width: 1650px !important; /* wider boxes */
}

/* Align the "Includes:" heading across all cards */
.pricing-v2 .card-header-block {
    min-height: 160px; /* adjust slightly if needed */
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    text-align: center;
}
.pricing-v2 .card-header-block {
    min-height: 160px; /* adjust slightly if needed */
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    text-align: center;
}
/* ========================================= */
/*          LUXURY PRICING ENHANCEMENTS      */
/* ========================================= */

/* 1. Increase spacing between cards */
.pricing-v2 #choose-path .choose-grid {
    gap: 40px !important; /* wider spacing for premium feel */
}

/* Base styling for all pricing cards */
.pricing-v2 .choose-card {
    border-top: 3px solid rgba(212, 175, 55, 0.55) !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* Highlight the MOST POPULAR card (middle card) */
.pricing-v2 .choose-card:nth-child(2) {
    transform: scale(1.03); /* base scale */
    z-index: 5;
    border-top: 4px solid rgba(212, 175, 55, 0.85) !important;
}

/* Smooth, consistent hover effect for ALL cards */
.pricing-v2 .choose-card:hover {
    transform: translateY(-6px) scale(1.05);
    box-shadow: 0 0 40px rgba(212,175,55,0.45) !important;
}

.pricing-v2 .pricing-image:hover {
    transform: scale(1.25);
}
@keyframes premiumFloat {
    0% { transform: scale(1.18) translateY(0); }
    100% { transform: scale(1.18) translateY(-6px); }
}
@keyframes premiumFloat {
    0% { transform: scale(1.18) translateY(0); }
    100% { transform: scale(1.18) translateY(-6px); }
}
/* ========================================================= */
/*  LUXURY BREATHING ZOOM ANIMATION FOR PRICING IMAGES       */
/* ========================================================= */

.pricing-image {
    width: 110px;
    height: 110px;
    border-radius: 50%;
    object-fit: cover;
    display: block;
    margin: 0 auto 20px;
    border: 3px solid var(--gold);

    transform-origin: center;
    transition:
        box-shadow 0.45s ease,
        border-color 0.45s ease,f
        filter 0.45s ease;
}

/* Luxury zoom in → zoom out “breathing” effect */
.pricing-image:hover,
.choose-card:hover .pricing-image {
    animation: luxBreath 2.3s ease-in-out infinite;
    filter: brightness(1.12) contrast(1.07);

    box-shadow:
        0 0 32px rgba(212,175,55,0.55),
        0 0 72px rgba(212,175,55,0.30);
    border-color: rgba(255,215,130,0.95);
}

/* Smooth, elegant breathing zoom */
@keyframes luxBreath {
    0%   { transform: scale(1.18); }
    50%  { transform: scale(1.26); }
    100% { transform: scale(1.18); }
}
/* ========================================================= */
/*  LUXURY PRICING TAGS — GOLD, CLEAN, PREMIUM               */
/* ========================================================= */

.lux-price {
    text-align: center;
    margin-bottom: 12px;
    margin-top: 6px;
}

.lux-price-new {
    font-size: 30px;
    font-weight: 800;
    color: var(--gold);
    text-shadow: 0 0 12px rgba(212,175,55,0.35);
    display: block;
}

.lux-price-old {
    font-size: 18px;
    opacity: 0.55;
    text-decoration: line-through;
    color: #fff;
    display: block;
    margin-top: -4px;
}

.lux-price-badge {
    display: inline-block;
    margin-top: 6px;
    background: rgba(212,175,55,0.18);
    color: var(--gold);
    border: 1px solid rgba(212,175,55,0.35);
    padding: 3px 12px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}
/* ========================================================= */
/*  LUXURY SEATS DISPLAY (MENTORSHIP)                        */
/* ========================================================= */

.lux-seats {
    text-align: center;
    margin-top: 6px;
}

.lux-seats span {
    display: inline-block;
    background: rgba(212,175,55,0.18);
    color: var(--gold);
    border: 1px solid rgba(212,175,55,0.35);
    padding: 5px 16px;
    border-radius: 999px;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.4px;
    text-transform: uppercase;
    animation: seatsPulse 2.5s infinite ease-in-out;
}

@keyframes seatsPulse {
    0%   { transform: scale(1);   opacity: 0.85; }
    50%  { transform: scale(1.04); opacity: 1; }
    100% { transform: scale(1);   opacity: 0.85; }
}
/* Align all pricing card header sections evenly */
.card-header-block {
    min-height: 240px; /* adjust higher/lower if needed */
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
}
/* ================================
   CLEAN FLAG STYLE (20px premium)
================================ */
.flag {
    width: 20px;
    height: 20px;
    object-fit: cover;
    vertical-align: -3px;
    margin-left: 6px;
    border-radius: 4px; /* matches your reference screenshot */
}
/* =======================================================
   YELLOW STYLE LISTS — EXACT MATCH TO OLD DESIGN
======================================================= */

/* Title / headings (Includes:, Does NOT Include:, etc.) */
.choose-card h3 {
    color: #d4af37; /* gold */
    font-size: 17px;
    margin-bottom: 8px;
    margin-top: 8px;
    font-weight: 700;
}

/* List items */
.choose-card ul li {
    list-style-type: disc; /* gold bullet */
    margin-left: 18px;
    margin-bottom: 6px;
    font-size: 15px;
    line-height: 1.45;
    color: #fff;
}

/* Turn the bullet gold */
.choose-card ul li::marker {
    color: #d4af37;
}

/* Flag alignment + size */
.flag {
    width: 20px;
    height: 20px;
    object-fit: cover;
    vertical-align: -3px;
    margin-left: 6px;
    border-radius: 4px; /* slight rounding, matches screenshot */
}
/* ======================================= */
/*   MOBILE RESPONSIVE FIXES (IMPORTANT)   */
/* ======================================= */

@media (max-width: 768px) {

    /* Make proof grid 1 column */
    .proof-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    /* Make offer section 1 column */
    .offer-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    /* Make mentors 1 column on mobile */
    .mentors-grid {
        grid-template-columns: 1fr;
        gap: 25px;
    }

    /* Adjust hero section for phones */
    .hero-title {
        font-size: 32px;
        text-align: center;
    }

    .hero-inner {
        flex-direction: column;
        text-align: center;
    }

    .hero-copy {
        align-items: center;
    }

    /* Improve spacing for phone screens */
    section {
        padding-left: 15px;
        padding-right: 15px;
    }
}
/* FORCE ALL CARD HEADERS TO SAME HEIGHT */
.pricing-v2 .card-header-block {
    min-height: 300px !important; /* adjust between 290–330 for pixel-perfect alignment */
    display: flex;
    flex-direction: column;
    justify-content: flex-end; 
    align-items: center;
    text-align: center;
}
.hero-video-card {
    padding: 0 !important;
}

.hero-video {
    border-radius: 0 !important;
    width: 100% !important;
    height: auto !important;
}
/* ===========================================
   MAKE HERO VIDEO MUCH LARGER
   =========================================== */

.hero-inner {
    align-items: flex-start;
}

/* Make video section take more space */
.hero-video-block {
    flex: 1.8 !important; /* previously 1 */
}

/* Make text section take less space */
.hero-copy {
    flex: 0.7 !important; /* previously 1 */
}

/* Remove padding so video expands fully */
.hero-video-card {
    padding: 0 !important;
    border-radius: 20px !important;
}

/* Make the video itself large and clean */
.hero-video {
    width: 100% !important;
    height: auto !important;
    border-radius: 12px !important;
}

/* Optional: add a premium golden glow */
.hero-video-card {
    box-shadow: 0 0 40px rgba(212,175,55,0.25) !important;
}
/* Centered video-first layout */
.hero-centered {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 35px;
}

/* Large premium video */
.hero-video-top {
    width: 100%;
    max-width: 1150px; /* adjust for even bigger video */
}

.hero-video-card {
    padding: 0 !important;
    background: var(--card-bg);
    border-radius: 18px;
    box-shadow: 0 0 40px rgba(212,175,55,0.25);
}

.hero-video {
    width: 100%;
    border-radius: 18px;
}

/* Center the text */
.hero-centered-text {
    max-width: 800px;
}

.hero-title {
    font-size: 52px;
    line-height: 1.2;
}

.hero-cta-row {
    justify-content: center;
}

.hero-trust-row {
    margin-top: 15px;
}
.hero-centered {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 25px;
    max-width: 900px;
    margin: 0 auto;
}

.hero-video-top {
    width: 100%;
    max-width: 1150px;
}

.hero-video-card {
    padding: 0 !important;
    border-radius: 18px;
    background: var(--card-bg);
    box-shadow: 0 0 40px rgba(212,175,55,0.25);
}

.hero-video {
    width: 100%;
    border-radius: 18px;
}

.hero-description {
    max-width: 750px;
    margin-top: 10px;
}

.hero-cta-row {
    display: flex;
    gap: 18px;
    justify-content: center;
    margin-top: 10px;
}

.hero-trust-row {
    display: flex;
    gap: 14px;
    justify-content: center;
    margin-top: 12px;
}
/* ================================
   GOLDEN VIDEO OVERLAY BUTTON
================================ */

.video-overlay {
    position: absolute;
    inset: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    background: rgba(0,0,0,0.45);
    backdrop-filter: blur(4px);
    cursor: pointer;
    z-index: 50;
    transition: opacity 0.35s ease;
}

.video-overlay.hidden {
    opacity: 0;
    pointer-events: none;
}

.overlay-inner {
    padding: 18px 32px;
    border-radius: 999px;
    background: rgba(0,0,0,0.55);
    border: 2px solid var(--gold);
    color: var(--gold);
    font-weight: 700;
    font-size: 20px;
    display: flex;
    align-items: center;
    gap: 12px;
    animation: goldPulse 2s infinite ease-in-out;
    box-shadow: 0 0 25px rgba(212,175,55,0.35);
}

/* Gold glowing pulse */
@keyframes goldPulse {
    0% {
        transform: scale(1);
        box-shadow: 0 0 20px rgba(212,175,55,0.25);
    }
    50% {
        transform: scale(1.06);
        box-shadow: 0 0 35px rgba(212,175,55,0.55);
    }
    100% {
        transform: scale(1);
        box-shadow: 0 0 20px rgba(212,175,55,0.25);
    }
}

/* Shimmering text */
.overlay-text {
    position: relative;
    overflow: hidden;
}

.overlay-text::after {
    content: "";
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(120deg, transparent, rgba(255,255,255,0.4), transparent);
    animation: shimmer 2s infinite;
}

@keyframes shimmer {
    0% { left: -100%; }
    100% { left: 150%; }
}

.overlay-icon {
    font-size: 22px;
}
.hero-logo-icon {
    width: 90px;              /* adjust size */
    height: auto;
    margin: 0 auto 14px auto; /* centered + spacing */
    display: block;
    filter: drop-shadow(0 0 12px rgba(212,175,55,0.35));
    animation: heroLogoFade 1.4s ease forwards;
    opacity: 0;
}

/* Fade-in animation */
@keyframes heroLogoFade {
    from {
        opacity: 0;
        transform: translateY(-10px) scale(0.94);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes heroBrandFade {
    0% { opacity: 0; transform: translateY(-6px) scale(0.96); }
    100% { opacity: 1; transform: translateY(0) scale(1); }
}
/* MAKE HERO STORY TEXT BIGGER AND STRONGER */
.hero-description {
    font-size: 24px !important;      /* bigger text */
    line-height: 1.55 !important;    /* easier to read */
    opacity: 0.95 !important;        /* stronger visibility */
    max-width: 900px !important;     /* wider paragraph */
    margin-top: 20px !important;     /* more breathing room */
}
@media (max-width: 768px) {
    .hero-description {
        font-size: 18px !important;
        line-height: 1.5 !important;
        max-width: 95% !important;
    }
}

/* Slight push down on headline for balance */
.hero-title {
    margin-top: -10px !important;        /* reduces awkward gap above the headline */
}

.overlay-brand-play {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 14px;
}

.overlay-logo {
    width: 170px;
    height: auto;
    filter: drop-shadow(0 0 18px rgba(212,175,55,0.55));
    animation: overlayFade 1s ease forwards;
    opacity: 0;
}

.overlay-play-text {
    font-size: 20px;
    font-weight: 700;
    color: var(--gold);
    background: rgba(0,0,0,0.55);
    padding: 10px 24px;
    border-radius: 999px;
    border: 2px solid var(--gold);
    box-shadow: 0 0 25px rgba(212,175,55,0.35);
    animation: overlayFade 1.3s ease forwards;
    opacity: 0;
}

@keyframes overlayFade {
    0% { opacity: 0; transform: translateY(6px) scale(0.98); }
    100% { opacity: 1; transform: translateY(0) scale(1); }
}
/* SHINY GOLD BUTTON */
.shine-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 14px 26px;
    background: rgba(24, 24, 24, 0.75);
    border: 1px solid rgba(212, 175, 55, 0.65);
    border-radius: 50px;
    color: #d4af37;
    font-size: 16px;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    transition: all 0.3s ease;
    margin-top: 18px;
}

/* Gold glow on hover */
.shine-btn:hover {
    box-shadow: 0 0 18px rgba(212, 175, 55, 0.55),
                0 0 32px rgba(212, 175, 55, 0.35);
    transform: translateY(-2px);
}

/* Shine sweep effect */
.shine-btn::after {
    content: "";
    position: absolute;
    top: 0;
    left: -80px;
    width: 60px;
    height: 100%;
    background: linear-gradient(120deg, transparent, rgba(255,255,255,0.5), transparent);
    transform: skewX(-20deg);
    transition: 0.75s;
}

/* Sweep animation on hover */
.shine-btn:hover::after {
    left: 110%;
}

/* Icon Style */
.shine-icon {
    width: 26px;
    height: 26px;
    object-fit: contain;
}
.identity-text-block {
    text-align: center;
    margin-top: 25px;
}

.identity-text-block .shine-btn {
    margin-top: 20px;
}
.telegram-text-block {
    text-align: center;
    margin-top: 25px;
}

.telegram-text-block .shine-btn {
    margin-top: 20px;
}
/* Gold styling + smaller size for proof titles */
.proof-title {
    font-size: 28px !important;       /* adjust as needed */
    line-height: 1.2 !important;
    margin-bottom: 18px !important;
    text-align: center !important;
    color: var(--gold) !important;    /* <-- make it gold again */
    font-weight: 700;                 /* makes it pop */
    text-shadow: 0 0 12px rgba(212,175,55,0.28); /* luxury gold glow */
}
/* Make both proof cards the same height */
.proof-grid {
    align-items: stretch !important;
}

.proof-card {
    height: 100% !important;
    display: flex;
    flex-direction: column;
}
/* Make both proof cards align item-by-item */
.proof-card {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

/* Ensure TITLE rows align */
.identity-slider-section .proof-title,
.telegram-slider-section .proof-title {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Ensure image slider rows align */
.identity-slider-section,
.telegram-slider-section {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

/* Force IDENTICAL spacing between title and images */
.proof-title {
    margin-bottom: 25px !important; /* change to adjust spacing */
}

/* Force IDENTICAL spacing between images and text */
.identity-text-block,
.telegram-text-block {
    margin-top: 30px !important;
}
.identity-text-block,
.telegram-text-block {
    display: flex;
    flex-direction: column;
    gap: 20px; /* optional */
}

.identity-text-block .shine-btn,
.telegram-text-block .shine-btn {
    margin-top: auto;  /* pushes buttons to the bottom */
}
/* Make the text + button sections flex containers */
.identity-text-block,
.telegram-text-block {
    display: flex;
    flex-direction: column;
    height: 100%;
}

/* Force the buttons to align at the bottom */
.identity-text-block .shine-btn,
.telegram-text-block .shine-btn {
    margin-top: auto;
}
/* ===========================================
   FINAL BUTTON ALIGNMENT FOR PROOF CARDS
   =========================================== */

/* 1. Make each proof card a column flex container */
.proof-card {
    display: flex !important;
    flex-direction: column;
}

/* 2. Make the text blocks fill the remaining height */
.identity-text-block,
.telegram-text-block {
    flex: 1 1 auto;          /* take up leftover space in the card */
    display: flex;
    flex-direction: column;
    height: auto;            /* override earlier height: 100% */
}

/* 3. Let the paragraph absorb the extra space */
.identity-text-block .proof-card-footer,
.telegram-text-block .proof-card-footer {
    margin-bottom: auto;     /* pushes the button wrapper down */
}

/* 4. Keep a small gap above the button */
.identity-text-block .shine-btn,
.telegram-text-block .shine-btn {
    margin-top: 24px;        /* fixed visual spacing, NOT auto */
}
/* Add spacing under proof section subtitle */
#proof .section-subtitle {
    margin-bottom: 35px !important; /* adjust up/down to taste */
}
.offer-grid.two-column {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
}

.offer-card.offer-large {
    padding: 42px;
}

.offer-grid.two-column {
    max-width: 1350px;
    margin: 0 auto;
}
#offer .section-subtitle {
    margin-bottom: 35px !important;
}
.faq-section {
    padding: 90px 20px;
    max-width: 1300px;
    margin: 0 auto;
}
.faq-item {
    background: var(--card-bg);
    border: 1px solid var(--border-gold);
    padding: 18px 22px;
    border-radius: var(--radius);
    margin-bottom: 14px;
}

.faq-question {
    font-size: 18px;
    font-weight: 600;
    color: var(--gold);
    cursor: pointer;
}

.faq-answer {
    padding-top: 10px;
    font-size: 15px;
    opacity: 0.85;
}
.final-cta-section {
    padding: 100px 20px;
    max-width: 1100px;
    margin: 0 auto;
}
.final-cta-buttons {
    display: flex;
    justify-content: center;
    gap: 20px;
    margin-top: 30px;
}
@media (max-width: 600px) {
    .final-cta-buttons {
        flex-direction: column;
        align-items: center;
    }

    .final-cta-buttons .btn {
        width: 100%;
        max-width: 320px;
        text-align: center;
    }
}
.faq-section .section-heading {
    max-width: 700px;
    margin: 0 auto 40px auto;
}
@keyframes faqFadeUp {
    0% {
        opacity: 0;
        transform: translateY(20px) scale(0.98);
        text-shadow: 0 0 0 rgba(212,175,55,0.0);
    }
    80% {
        opacity: 1;
        transform: translateY(-3px) scale(1.02);
        text-shadow: 0 0 12px rgba(212,175,55,0.22);
    }
    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
        text-shadow: 0 0 14px rgba(212,175,55,0.28);
    }
}
/* CENTER FAQ ITEMS */
.faq-grid {
    display: flex;
    flex-direction: column;
    align-items: center; /* centers the FAQ cards */
}

.faq-item {
    width: 100%;
    max-width: 700px; /* keeps them nicely centered */
}
/* Center FAQ text */
.faq-item summary,
.faq-item .faq-answer {
    text-align: center !important;
}

/* Remove the default arrow alignment issue */
.faq-item summary {
    list-style: none;
}

/* Hide default arrow and add custom centered one */
.faq-item summary::-webkit-details-marker {
    display: none;
}
/* Make both final CTA buttons perfectly aligned */
.final-cta-buttons .btn {
    padding: 16px 40px !important;   /* same padding for both */
    font-size: 20px !important;
    line-height: 1 !important;
}

.final-cta-buttons .btn-ghost {
    border-width: 2px !important;    /* match visual thickness */
}
/* =========================================================
   LUXURY FAQ ANIMATIONS — GOLD EXPANSION + MAGNETIC MOVEMENT
   ========================================================= */

/* FAQ container prepares for movement */
.faq-item {
    position: relative;
    transition: 
        border-color 0.35s ease,
        box-shadow 0.45s ease,
        transform 0.25s ease;
    border: 1px solid rgba(212,175,55,0.28);
    will-change: transform, box-shadow;
}

/* Magnetic hover lift (SUBTLE) */
.faq-item:hover {
    transform: translateY(-2px);
    box-shadow: 0 0 14px rgba(212,175,55,0.25);
}

/* Golden Expansion when opened */
.faq-item[open] {
    border-color: rgba(212,175,55,0.8);
    box-shadow: 0 0 22px rgba(212,175,55,0.45);
    transition: all 0.45s ease;
}

/* Fade + slide answer reveal */
.faq-item .faq-answer {
    opacity: 0;
    transform: translateY(6px);
    transition: opacity 0.45s ease, transform 0.45s ease;
}

.faq-item[open] .faq-answer {
    opacity: 1;
    transform: translateY(0);
}

/* Better summary styling */
.faq-question {
    user-select: none;
    position: relative;
    padding-right: 25px;
    transition: color 0.3s ease, transform 0.3s ease;
}

/* Slight gold brighten on hover */
.faq-question:hover {
    color: var(--gold);
}

/* Custom arrow indicator */
.faq-question::after {
    content: "›";
    position: absolute;
    right: 0;
    top: 2px;
    font-size: 20px;
    color: var(--gold);
    transition: transform 0.35s ease;
}

.faq-item[open] .faq-question::after {
    transform: rotate(90deg);
}

/* Subtle inner golden glow pulse */
.faq-item[open]::before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: 12px;
    background: radial-gradient(circle, rgba(212,175,55,0.18), transparent 70%);
    z-index: -1;
    opacity: 1;
    animation: faqGlowPulse 2.6s ease-in-out infinite;
}

@keyframes faqGlowPulse {
    0% { opacity: 0.75; }
    50% { opacity: 1; }
    100% { opacity: 0.75; }
}

/* Magnetic movement — subtle strength */
@media (min-width: 768px) {
    .faq-item {
        transition: transform 0.15s ease-out;
    }
}
/* Join Elite Button Under Video */
.join-cta-under-video {
    margin-top: 30px;
    display: flex;
    justify-content: center;
}

/* Luxury gold button */
.join-elite-btn {
    background: linear-gradient(180deg, #d4af37, #c19a32);
    color: #000;
    border-radius: 999px;
    padding: 16px 42px;
    font-size: 20px;
    font-weight: 700;
    letter-spacing: 0.3px;
    box-shadow: 0 0 22px rgba(212,175,55,0.25);
    transition: 0.35s ease;
}

/* Hover animation */
.join-elite-btn:hover {
    transform: translateY(-4px) scale(1.03);
    background: linear-gradient(180deg, #e0bf4a, #d4af37);
    box-shadow: 
        0 0 28px rgba(212,175,55,0.45),
        0 0 40px rgba(212,175,55,0.25);
}
/* Fix large gap under the Join button */
.join-cta-under-video {
    margin-bottom: 10px !important;
}

/* Reduce hero section bottom padding */
.hero-section {
    padding-bottom: 40px !important;
}

/* Reduce space between hero and the next section */
#proof {
    margin-top: -40px !important;
}
/* Reduce huge space between FAQ and final CTA */
.faq-section {
    padding-bottom: 40px !important;
}

.final-cta-section {
    padding-top: 40px !important;
}

/* Optional: tighten even further */
.faq-section .section-heading {
    margin-bottom: 20px !important;
}
/* Tighten space between Final CTA and FAQ */
.final-cta-section {
    padding-bottom: 20px !important;  /* was 100px */
}

#faq {
    margin-top: -20px !important;      /* pulls FAQ upward */
}
/* ===========================================
   Elite LinkUp — Uncopyable Legal Disclaimer
   =========================================== */

.elite-disclaimer {
    text-align: center;
    font-size: 15px;
    color: transparent; /* hides base text */
    max-width: 900px;
    margin: 30px auto 60px auto;
    line-height: 1.55;
    user-select: none !important;
    pointer-events: none !important;
}

/* Visible medium gray, uncopyable */
.elite-disclaimer::after {
    content: "Everything taught inside Elite LinkUp is for educational purposes only. We do not make any guarantees about your ability to earn money or achieve results. Your success depends entirely on your own effort, discipline, skills, and execution. Any testimonials or wins shared by members are their personal results and are not promises of future outcomes. Nothing inside Elite LinkUp is financial, legal, tax, or professional advice. By participating, you accept full responsibility for your decisions and actions.";
    color: #777;
    opacity: 0.85;
    display: block;
}
/* Centered support email under disclaimer */
.elite-support-email {
    text-align: center;
    margin-top: 18px;
    margin-bottom: 60px;
    font-size: 16px;
    font-weight: 500;
    color: #999;
    opacity: 0.85;
}

.elite-support-email a {
    color: #999;
    text-decoration: none;
}

.elite-support-email a:hover {
    color: var(--gold);
}
/* ======================================================================
   ELITE LINKUP — MASTER RESPONSIVE PATCH
   (Desktop is frozen above 1700px, nothing changes there)
   ====================================================================== */

@media (max-width: 1300px) {

    /* -----------------------------
       GLOBAL FIXES 
       ----------------------------- */

    body {
        overflow-x: hidden !important;
    }

    section {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }

    .section-title {
        font-size: 28px !important;
    }

    .section-subtitle {
        font-size: 16px !important;
        max-width: 95% !important;
    }


    /* -----------------------------
       NAVIGATION
       ----------------------------- */

    .top-nav-inner {
        flex-direction: column;
        gap: 10px;
    }

    .nav-links {
        display: none; /* hide desktop nav on smaller screens */
    }


    /* -----------------------------
       HERO SECTION 
       ----------------------------- */

    .hero-section {
        padding-top: 60px !important;
        padding-bottom: 40px !important;
    }

    /* Mobile-only logo resize */
    @media (max-width: 768px) {
        .overlay-logo {
            width: 120px !important;
            height: auto !important;
        }
    }

    /* Mobile-only Play Video button resize */
    @media (max-width: 768px) {
        .overlay-play-text {
            font-size: 15px !important;
            padding: 8px 18px !important;
            border-width: 1.5px !important;   /* keep the gold outline consistent */
        }
    }

    /* Mobile-only: force 1:1 slider images */
    @media (max-width: 768px) {
        .identity-img,
        .proof-img {
            width: 100px !important;
            height: 100px !important;
            min-width: 100px !important;
            object-fit: cover !important;
            border-radius: 10px !important;
        }
    }

    /* Mobile-only: fix flag alignment inside pricing lists */
    @media (max-width: 768px) {
        .choose-card ul li .flag {
            width: 14px !important;
            height: 14px !important;
            margin-left: 4px !important;
            vertical-align: middle !important;
        }

        .choose-card ul li {
            font-size: 14px !important;
            line-height: 1.35 !important;
            white-space: nowrap !important; /* prevents text from breaking mid-line */
        }
    }

    .hero-title {
        font-size: 32px !important;
        line-height: 1.25 !important;
    }

    .hero-centered {
        max-width: 100% !important;
        padding: 0 10px !important;
    }

    .hero-video-top {
        max-width: 100% !important;
    }

    .hero-video-card {
        border-radius: 14px !important;
    }

    .hero-video {
        width: 100% !important;
        height: auto !important;
    }

    .hero-description {
        font-size: 16px !important;
        max-width: 95% !important;
        line-height: 1.45 !important;
    }

    .join-cta-under-video {
        margin-top: 20px !important;
        margin-bottom: 10px !important;
    }


    /* -----------------------------
       PROOF SECTION 
       ----------------------------- */

    .proof-grid {
        grid-template-columns: 1fr !important;
        gap: 30px !important;
    }

    .scroll-wrapper {
        height: 110px !important;
    }

    .identity-img,
    .proof-img {
        width: 110px !important;
        height: 110px !important;
    }


    /* -----------------------------
       OFFER SECTION
       ----------------------------- */

    .offer-grid.two-column {
        grid-template-columns: 1fr !important;
        gap: 26px !important;
    }

    .offer-card.offer-large {
        padding: 30px !important;
    }


    /* -----------------------------
       MENTORS
       ----------------------------- */

    .mentors-grid {
        grid-template-columns: 1fr !important;
        gap: 28px !important;
    }

    .mentor-card {
        max-width: 100% !important;
    }


    /* -----------------------------
       FAQ
       ----------------------------- */

    .faq-grid {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .faq-item {
        max-width: 600px !important;
        width: 100% !important;
    }


    /* -----------------------------
       FINAL CTA 
       ----------------------------- */

    .final-cta-buttons {
        flex-direction: column !important;
        gap: 15px !important;
    }

    .final-cta-buttons .btn {
        width: 100% !important;
        max-width: 320px !important;
    }



    /* ==================================================================
       PRICING PAGE — THE BIG FIX
       ================================================================== */

    body.pricing-v2 #choose-path .choose-grid {
        grid-template-columns: 1fr !important;
        padding: 0 12px !important;
        gap: 28px !important;
        justify-content: center !important;
    }

    .pricing-v2 .choose-card {
        max-width: 420px !important;
        width: 100% !important;
        margin: 0 auto !important;
    }

    .pricing-v2 .pricing-image {
        width: 90px !important;
        height: 90px !important;
    }

    .pricing-v2 .lux-price-new {
        font-size: 26px !important;
    }

    .pricing-v2 .lux-price-old {
        font-size: 16px !important;
    }

    .pricing-v2 h2.section-title {
        font-size: 26px !important;
    }

}
/* Improved Disclaimer Styling */
.elite-disclaimer {
    max-width: 700px !important;
    margin: 40px auto 30px auto !important;
    line-height: 1.45 !important;
    font-size: 16px !important;
    text-align: center !important;
    opacity: 0.85 !important;
}

/* Center & separate email nicely */
.elite-support-email {
    text-align: center !important;
    margin-top: 25px !important;
    margin-bottom: 80px !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    opacity: 0.9 !important;
}
/* Center the logo on mobile */
.logo-header {
    width: 100%;
    display: flex;
    justify-content: center;
    padding: 15px 0;
}

.logo-header .logo {
    display: block;
    margin: 0 auto;
    max-width: 140px; /* optional */
}
/* =========================================================
   🔥 FINAL FIX — PERFECT MOBILE PRICING CARDS
   ========================================================= */
@media (max-width: 768px) {

    /* Reset whole grid */
    .pricing-v2 #choose-path .choose-grid {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 16px !important;
        gap: 26px !important;
        overflow-x: hidden !important;
    }

    /* Perfect card width */
    .pricing-v2 .choose-card {
        width: 92% !important;       /* <— slightly narrower */
        max-width: 420px !important; /* <— perfect mobile width */
        margin: 0 auto !important;
        padding: 26px !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
    }

    /* Make cards taller for better breathing room */
    .pricing-v2 .choose-card {
        padding-bottom: 40px !important;
    }

    /* Fix image */
    .pricing-v2 .pricing-image {
        width: 85px !important;
        height: 85px !important;
        margin-bottom: 14px !important;
    }

    /* Fix card glow bleed */
    .pricing-v2 .choose-card::before {
        inset: 0 !important;
    }

    /* Fix header height issue */
    .pricing-v2 .card-header-block {
        min-height: auto !important;
    }
}
/* Fix bullet text cutoff on mobile */
@media (max-width: 768px) {
    .choose-card ul li {
        white-space: normal !important;   /* allow text to wrap */
        line-height: 1.45 !important;     /* better readability */
        font-size: 14px !important;       /* slightly smaller */
        margin-left: 16px !important;     /* good spacing */
    }
}
/* =========================================================
   📱 MOBILE: FORCE ALL PRICING CARDS TO EXACT SAME WIDTH
   ========================================================= */
@media (max-width: 768px) {

    .pricing-v2 #choose-path .choose-grid {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        gap: 30px !important;
    }

    .pricing-v2 .choose-card {
        width: 95% !important;       /* same width for all cards */
        max-width: 380px !important; /* fixed identical width */
        margin: 0 auto !important;
    }
}
/* =========================================================
   DESKTOP FIX — Make Pricing Cards Responsive
   ========================================================= */
@media (min-width: 1024px) {

    /* Remove the hard-coded 520px width */
    .pricing-v2 #choose-path .choose-grid {
        display: grid !important;
        grid-template-columns: repeat(3, 1fr) !important;
        max-width: 1200px !important;    /* responsive width */
        margin: 0 auto !important;
        gap: 32px !important;
        padding: 0 20px !important;
    }

    /* Let cards size naturally instead of forcing 520px */
    .pricing-v2 .choose-card {
        width: 100% !important;
        max-width: 380px !important;
        margin: 0 auto !important;
    }

    /* Make header not excessively tall */
    .pricing-v2 .card-header-block {
        min-height: auto !important;
    }
}
.btn-gold {
    text-decoration: none !important;
}
.btn-gold:hover {
    text-decoration: none !important;
}
/* FIX: Mobile cards blocking button taps */
.pricing-v2 .choose-card::before {
    pointer-events: none !important;
}

/* Ensure gold buttons are always clickable */
.btn-gold {
    position: relative;
    z-index: 50 !important;
    text-decoration: none !important; /* removes underline */
}
/* Custom gold fullscreen button */
.fullscreen-btn {
    position: absolute;
    right: 16px;
    bottom: 16px;
    z-index: 60;
    border: 1px solid var(--gold);
    background: rgba(0,0,0,0.65);
    color: var(--gold);
    border-radius: 999px;
    padding: 6px 10px;
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: 0.25s ease;
}

.fullscreen-btn:hover {
    box-shadow: 0 0 14px rgba(212,175,55,0.6);
    transform: translateY(-1px);
}

.fullscreen-btn.hidden {
    display: none;
}
/* Gold final line under proof section (same as pricing page) */
.proof-final-line {
    margin-top: 45px;
    text-align: center;
    color: #d4af37;
    font-size: 22px;
    font-weight: 700;
    opacity: 0.9;
    text-shadow: 0 0 12px rgba(212,175,55,0.25);
}
html, body {
    overflow-x: hidden !important;
    width: 100% !important;
    position: relative;
}
.avatar-line {
    display: flex;
    align-items: center;
    justify-content: center; /* centers whole line */
    gap: 14px;
}

.avatar-group {
    display: flex;
    align-items: center;
}

.avatar-group .avatar {
    width: 36px;         /* size similar to your reference */
    height: 36px;
    border-radius: 50%;  /* makes each image a circle */
    object-fit: cover;   /* ensures proper cropping */
    border: 2px solid #000; /* optional clean border */
    margin-left: -10px;  /* overlap amount */
}

.avatar-group .avatar:first-child {
    margin-left: 0; /* no overlap on the first avatar */
}

.proof-final-line {
    font-size: 24px; /* match your current h2 size */
    font-weight: 500;
    margin: 0;
}
.avatar-line {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: nowrap;   /* 🔥 prevents avatars going to a new line */
    white-space: nowrap; /* 🔥 prevents text wrapping too early */
}
@media (max-width: 600px) {
    .avatar-line span,
    .avatar-line h2 {
        font-size: 16px;     /* smaller text */
        line-height: 1.2;
    }

    .avatar {
        width: 28px;
        height: 28px;        /* smaller avatars */
        margin-left: -8px;
    }
}
.avatar-text-wrapper {
    display: flex;
    align-items: center;
    justify-content: center; /* center BOTH avatars + text */
    gap: 12px;
    flex-wrap: nowrap;
    width: 100%;
    white-space: nowrap;
    margin-top: 35px;
}

.avatar-text {
    font-size: 24px;
    font-weight: 600;
    color: #d4af37;
}
/* MOBILE FIX FOR AVATAR + TEXT LINE */
@media (max-width: 600px) {
    .avatar-text-wrapper {
        flex-wrap: wrap;          /* allow wrapping on 2 lines if needed */
        gap: 8px;
    }

    .avatar-group .avatar {
        width: 26px;              /* smaller avatars on mobile */
        height: 26px;
        margin-left: -6px;
    }

    .avatar-text {
        font-size: 15px !important;   /* shrink text on mobile */
        line-height: 1.2;
        white-space: normal !important; /* allow text to wrap */
        text-align: left;
    }
}
/* Pricing Page — Avatar Line Fix */
.pricing-avatar-wrapper {
    margin-top: 35px;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    flex-wrap: nowrap;
    white-space: nowrap;
}

.pricing-avatar-wrapper .avatar-group .avatar {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid #000;
    margin-left: -10px;
}

.pricing-avatar-wrapper .avatar-group .avatar:first-child {
    margin-left: 0;
}

.pricing-avatar-wrapper .avatar-text {
    font-size: 24px;
    font-weight: 600;
    color: #d4af37;
}


/* MOBILE FIX — SAME AS INDEX */
@media (max-width: 600px) {
    .pricing-avatar-wrapper {
        flex-wrap: wrap;
        gap: 8px;
        white-space: normal;
    }

    .pricing-avatar-wrapper .avatar-group .avatar {
        width: 26px;
        height: 26px;
        margin-left: -6px;
    }

    .pricing-avatar-wrapper .avatar-text {
        font-size: 15px !important;
        line-height: 1.2;
        text-align: left;
        white-space: normal !important;
    }
}
/* ============================================
   SLIM GOLD TICKET TAB — MINIMAL & ELEGANT
============================================ */

.lifetime-badge {
    position: absolute;
    top: -6px;       /* sits closer to top */
    right: -10px;    /* hangs off a bit */

    background: linear-gradient(180deg, #d4af37, #b89028);
    color: #000;

    padding: 2px 8px;
    height: 18px;    /* fixed, slim height */
    line-height: 14px;

    font-size: 9px;  /* smaller text */
    font-weight: 800;

    border-radius: 4px 0 0 4px;
    letter-spacing: 0.5px;
    text-transform: uppercase;

    box-shadow: 0 2px 6px rgba(212,175,55,0.35);
    z-index: 50;
}

/* Small right-side ticket stub */
.lifetime-badge::after {
    content: "";
    position: absolute;
    top: 50%;
    right: -5px;
    transform: translateY(-50%);

    width: 10px;   /* smaller */
    height: 14px;  /* smaller */
    background: linear-gradient(180deg, #d4af37, #b89028);

    border-radius: 0 4px 4px 0;
    box-shadow: inset -2px 0 4px rgba(0,0,0,0.25);
}
/* ============================================
   FINAL MOBILE FIX — PERFECT BADGE ALIGNMENT
============================================ */
@media (max-width: 768px) {

    .pricing-v2 .choose-card {
        position: relative !important;
        overflow: visible !important; /* allow badge to sit outside cleanly */
    }

    .pricing-v2 .choose-card .lifetime-badge {
        top: -2px !important;        /* lower so it meets the rounded border */
        right: 4px !important;       /* move INSIDE instead of outside */

        padding: 2px 6px !important;
        font-size: 8px !important;
        height: 14px !important;

        border-radius: 4px !important;
        box-shadow: 0 2px 4px rgba(212,175,55,0.3) !important;

        /* REMOVE the ticket hang-off for mobile */
    }

    .pricing-v2 .choose-card .lifetime-badge::after {
        display: none !important; /* remove stub on mobile */
    }
}
/* ============================================
   MOBILE (LARGER BADGE) — CLEAN + CENTERED CORNER
============================================ */
@media (max-width: 768px) {

    .pricing-v2 .choose-card .lifetime-badge {
        top: -4px !important;        /* sits near the rounded corner */
        right: 6px !important;       /* inward for perfect fit */

        padding: 4px 10px !important; /* larger badge */
        height: 20px !important;

        font-size: 11px !important;   /* larger text */
        font-weight: 800 !important;

        border-radius: 6px !important;
        letter-spacing: 0.6px;

        box-shadow: 0 3px 8px rgba(212,175,55,0.35) !important;
    }

    /* hide stub on mobile for clean rounded alignment */
    .pricing-v2 .choose-card .lifetime-badge::after {
        display: none !important;
    }
}
.supermentor-programs {
  max-width: 1200px;
  margin: 40px auto 0 auto; /* ← THIS LINE FIXES EVERYTHING */
  padding: 0 20px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(420px, 1fr));
  gap: 60px;
}



.supermentor-card {
  background: radial-gradient(circle at top, #141414, #0a0a0a);
  border: 1px solid rgba(230, 193, 90, 0.45);
  border-radius: 28px;
  padding: 60px 40px;
  text-align: center;
  box-shadow:
    0 0 45px rgba(230, 193, 90, 0.15),
    inset 0 0 60px rgba(230, 193, 90, 0.05);
  transition: transform 0.35s ease, box-shadow 0.35s ease;
}

.supermentor-card:hover {
  transform: translateY(-6px);
  box-shadow:
    0 0 70px rgba(230, 193, 90, 0.25),
    inset 0 0 70px rgba(230, 193, 90, 0.08);
}

.supermentor-avatar {
  width: 140px;
  height: 140px;
  margin: 0 auto 30px;
  border-radius: 50%;
  border: 3px solid #e6c15a;
  overflow: hidden;
}

.supermentor-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.supermentor-card h3 {
  color: #ffffff;
  font-size: 1.5rem;
  margin-bottom: 10px;
}

.supermentor-card span {
  display: block;
  color: #e6c15a;
  font-size: 0.95rem;
  margin-bottom: 18px;
}

.supermentor-card p {
  color: #cfcfcf;
  font-size: 1rem;
  margin-bottom: 28px;
}
/* FINAL — Supermentor Program Card Sizing */
.supermentor-section .mentor-card {
    max-width: 520px;
    width: 100%;
}

.supermentor-programs {
    display: grid;
    grid-template-columns: repeat(2, minmax(520px, 1fr));
    gap: 60px;
    justify-content: center;
}

@media (max-width: 1100px) {
    .supermentor-programs {
        grid-template-columns: 1fr;
    }
}

.checkmark-wrapper {
    margin: 30px auto;
    text-align: center;
}

/* SVG container */
.checkmark {
    width: 72px;
    height: 72px;
    aspect-ratio: 1 / 1;
    display: block;
    margin: 0 auto;
}

/* Circle */
.checkmark-circle {
    stroke: var(--gold);
    stroke-width: 4;
    fill: none;


    stroke-linecap: butt;
    stroke-linejoin: round;

    stroke-dasharray: 150.8;
    stroke-dashoffset: 150.8;
    animation: stroke 0.6s ease-in-out forwards;
}

/* Check */
.checkmark-check {
    stroke: var(--gold);
    stroke-width: 4;
    fill: none;

    stroke-linecap: round;
    stroke-linejoin: round;
    vector-effect: non-scaling-stroke;

    stroke-dasharray: 48;
    stroke-dashoffset: 48;
    animation: stroke 0.3s 0.6s ease forwards;
}

@keyframes stroke {
    to {
        stroke-dashoffset: 0;
    }
}
.payment-success {
    margin-top: 22px;

    font-size: 26px;          /* noticeably bigger */
    font-weight: 800;         /* matches hero/check strength */
    letter-spacing: 2.5px;    /* luxury spacing */
    text-transform: uppercase;

    color: var(--gold);
    text-align: center;

    text-shadow:
        0 0 14px rgba(212,175,55,0.35);
}
/* =========================================
   ELITE LINKUP LIVE — SAFE WIDE CARD
   (NO impact on other mentor cards)
========================================= */

.live-library-section {
    margin-top: 90px;
    text-align: center;
}

/* Inner wrapper to control height & spacing */
.live-library-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
}
/* FULL WIDTH = SAME AS 3 MENTOR CARDS */
.live-library-card {
    grid-column: 1 / -1;
    max-width: 100%;
    margin: 0 auto;
}

/* ================================
   LIVE ROOM WIDTH FIX
================================ */

.live-room-section {
    width: 100%;
    margin-top: 80px;
}

.live-room-container {
    max-width: 1300px;   /* SAME width as mentors */
    margin: 0 auto;
    padding: 0 20px;
}

.live-room-card {
    width: 100%;
    background: var(--card-bg);
    border: 1px solid var(--border-gold);
    border-radius: var(--radius);
    padding: 40px;
    box-shadow: 0 0 28px rgba(212,175,55,0.18);
}
/* =========================================
   LIVE LIBRARY — BREAK OUT OF 300px LIMIT
========================================= */

.live-library-card {
    grid-column: 1 / -1;        /* span all 3 mentor columns */
    max-width: 1100px;
    width: 100%;
    margin: 0 auto;

    /* override mentor-card constraint */
    padding: 40px;
}
/* =========================================
   FIX: Live Library Logo (NO avatar styling)
   Scoped ONLY to Elite LinkUp Live
========================================= */

.live-library-section .mentor-photo {
    width: auto;              /* let logo define its width */
    height: 90px;             /* controlled logo height */
    max-width: 260px;         /* prevents overflow */
    border-radius: 0 !important;
    border: none !important;
    object-fit: contain;
    box-shadow: none !important;
    background: transparent;
}
/* =========================================
   LIVE LIBRARY LOGO — MATCH COURSE PAGE
   (Scoped, safe, no side effects)
========================================= */

.live-library-section .live-library-logo {
    width: 100%;
    height: 110px;
    margin-bottom: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.live-library-section .live-library-logo img {
    width: 100%;
    max-width: 420px;
    height: 100%;
    object-fit: contain;

    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: transparent;
}
/* =========================================
   MOBILE FIX — PREVENT LIVE CARD OVERFLOW
========================================= */

@media (max-width: 768px) {

    /* 1. Force single column grid */
    .live-library-section .mentors-grid {
        grid-template-columns: 1fr !important;
        gap: 20px;
    }

    /* 2. Remove desktop width forcing */
    .live-library-section .live-library-card {
        grid-column: auto !important;
        max-width: 100% !important;
        width: 100% !important;
        margin: 0 auto;
        box-sizing: border-box;
    }

    /* 3. Prevent horizontal overflow */
    .live-library-section {
        overflow-x: hidden;
        padding-left: 14px;
        padding-right: 14px;
    }

    /* 4. Inner container safety */
    .live-library-section .live-library-inner {
        width: 100%;
        box-sizing: border-box;
    }
}
/* =========================================
   FIX SPACING BETWEEN MENTORS & LIVE SECTION
========================================= */

/* Reduce space BELOW the mentors section */
.mentors-section {
    padding-bottom: 40px; /* was much larger */
}

/* Reduce space ABOVE the Live Library section */
.live-library-section {
    margin-top: 40px; /* was 90px */
}
.live-library-card {
    cursor: default;
}
.exclusive-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    height: 15px;          /* ↓ from 16px */
    padding: 0 5px;        /* ↓ from 6px */
    margin-left: 6px;

    background: #1a1a1a;
    border: 1px solid #d4af37;

    color: #d4af37;
    font-size: 8.5px;      /* ↓ from 9px */
    font-weight: 600;
    letter-spacing: 0.35px;
    line-height: 1;

    border-radius: 2px;
    vertical-align: middle;
}

.hero-video-iframe {
  position: relative;
  width: 100%;
  padding-top: 56.25%; /* 16:9 */
}

.hero-video-iframe iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
/* ============================================
   MOST POPULAR — LEFT BADGE (ADDITIVE ONLY)
============================================ */

.pricing-v2 .choose-card.is-popular {
    position: relative;
}

/* Left-side badge */
.pricing-v2 .choose-card.is-popular .popular-left-badge {
    position: absolute;
    top: -6px;
    left: -10px;
    z-index: 55;

    background: linear-gradient(180deg, #d4af37, #b89028);
    color: #000;

    padding: 2px 10px;
    height: 18px;
    line-height: 14px;

    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.5px;
    text-transform: uppercase;

    border-radius: 0 4px 4px 0;
    box-shadow: 0 2px 6px rgba(212,175,55,0.35);
}

/* Small left ticket stub */
.pricing-v2 .choose-card.is-popular .popular-left-badge::after {
    content: "";
    position: absolute;
    top: 50%;
    left: -6px;
    transform: translateY(-50%);

    width: 10px;
    height: 14px;

    background: linear-gradient(180deg, #d4af37, #b89028);
    border-radius: 4px 0 0 4px;
    box-shadow: inset 2px 0 4px rgba(0,0,0,0.25);
}
@media (max-width: 768px) {

    .pricing-v2 .choose-card.is-popular .popular-left-badge {
        top: -4px !important;
        left: 6px !important;

        padding: 4px 10px !important;
        height: 20px !important;

        font-size: 11px !important;
        border-radius: 6px !important;

        box-shadow: 0 3px 8px rgba(212,175,55,0.35) !important;
    }

    .pricing-v2 .choose-card.is-popular .popular-left-badge::after {
        display: none !important;
    }
}