/* ============================================
   HOME — color only
   Same layout as before. Charcoal/gold -> navy/brass.
   ============================================ */

.page-home {
    --luxury-obsidian: #06101c;
    --luxury-charcoal: #0b1a33;
    --luxury-charcoal-mid: #122544;
    --luxury-charcoal-soft: #1a3360;
    --luxury-warm-ink: #06101c;
    --luxury-warm-stone: #0b1a33;
    --luxury-warm-ember: #122544;
    --luxury-gold: #d4af37;
    --luxury-gold-bright: #e8d48b;
    --luxury-gold-deep: #c9a227;
    --luxury-gold-muted: rgba(212, 175, 55, 0.65);
    --luxury-gold-line: rgba(212, 175, 55, 0.38);
    --luxury-gold-subtle: rgba(212, 175, 55, 0.14);
    --luxury-glass: rgba(12, 28, 56, 0.55);
    --luxury-glass-gold: rgba(212, 175, 55, 0.12);
    background:
        radial-gradient(ellipse 90% 50% at 50% 0%, rgba(46, 92, 158, 0.12), transparent 55%),
        linear-gradient(180deg, #06101c 0%, #050d18 40%, #0b1a33 100%) !important;
    color: var(--luxury-white-soft);
}

.page-home .navbar.navbar-home-scrolled {
    background: rgba(6, 16, 28, 0.92) !important;
    border-bottom-color: var(--luxury-gold-line) !important;
}

.page-home .nav-cta {
    color: #06101c;
}

.page-home .nav-cta:hover {
    color: var(--luxury-gold);
}

.page-home .hero-cinematic-btn-primary {
    color: #06101c !important;
}

.page-home .hero.hero-cinematic {
    background: #06101c;
}

.page-home .hero-cinematic-shade {
    background:
        linear-gradient(100deg, rgba(6, 16, 32, 0.72) 0%, rgba(8, 24, 48, 0.38) 34%, rgba(10, 32, 64, 0.08) 58%, transparent 78%),
        linear-gradient(225deg, rgba(40, 90, 160, 0.32) 0%, rgba(30, 70, 140, 0.14) 28%, transparent 55%),
        radial-gradient(ellipse 70% 55% at 72% 38%, rgba(70, 130, 210, 0.22) 0%, rgba(30, 70, 140, 0.08) 42%, transparent 70%),
        linear-gradient(180deg, rgba(6, 16, 32, 0.18) 0%, transparent 48%, rgba(6, 16, 28, 0.42) 88%, rgba(5, 13, 24, 0.78) 100%),
        linear-gradient(160deg, transparent 35%, rgba(12, 40, 88, 0.28) 100%) !important;
}

.page-home .hero-cinematic-stats li {
    gap: 0.5rem;
}

.page-home .hero-stat-icon {
    border-color: rgba(212, 175, 55, 0.55);
    color: var(--luxury-gold);
}

.page-home .featured-adventures {
    background: linear-gradient(165deg, #0b1a33 0%, #06101c 45%, #122544 100%) !important;
}

.page-home .featured-adventures::before {
    background-image: url('images/Adventure.png') !important;
}

.page-home .featured-adventures::after {
    background:
        linear-gradient(
            180deg,
            rgba(6, 16, 32, 0.55) 0%,
            rgba(8, 20, 40, 0.4) 45%,
            rgba(6, 16, 28, 0.62) 100%
        ),
        radial-gradient(ellipse 70% 55% at 15% 20%, rgba(46, 92, 158, 0.18), transparent 58%),
        radial-gradient(ellipse 60% 50% at 90% 80%, rgba(212, 175, 55, 0.12), transparent 55%) !important;
}

.page-home .featured-adv-card {
    background: linear-gradient(180deg, #122544 0%, #0b1a33 100%) !important;
    border-color: rgba(110, 160, 220, 0.28) !important;
}

.page-home .featured-adv-card:hover {
    border-color: rgba(212, 175, 55, 0.5) !important;
}

.page-home .featured-adv-tag {
    color: #06101c !important;
}

.page-home .about.about-story {
    --about-bg-image: url('images/Adventure.png');
    background-color: #0b1a33 !important;
}

.page-home .about.about-story::before {
    background-color: #0b1a33 !important;
    background-image:
        linear-gradient(
            180deg,
            rgba(6, 16, 32, 0.58) 0%,
            rgba(8, 22, 44, 0.42) 42%,
            rgba(6, 16, 28, 0.62) 100%
        ),
        url('images/Adventure.png') !important;
}

.page-home .adventures-explorer {
    background: linear-gradient(165deg, #0b1a33 0%, #06101c 48%, #122544 100%) !important;
    overflow: hidden;
}

.page-home .adventures-explorer::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background-image: url('images/Adventure.png');
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    transform: scale(1.02);
}

.page-home .adventures-explorer::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        linear-gradient(
            180deg,
            rgba(6, 16, 32, 0.55) 0%,
            rgba(8, 20, 40, 0.4) 45%,
            rgba(6, 16, 28, 0.62) 100%
        ),
        radial-gradient(ellipse 70% 55% at 15% 20%, rgba(46, 92, 158, 0.18), transparent 58%),
        radial-gradient(ellipse 60% 50% at 90% 80%, rgba(212, 175, 55, 0.12), transparent 55%);
}

.page-home .next-adventure {
    background:
        radial-gradient(ellipse 60% 50% at 50% 100%, rgba(46, 92, 158, 0.14), transparent 60%),
        linear-gradient(180deg, #0b1a33 0%, #06101c 100%) !important;
}

.page-home .next-adventure-overlay {
    background:
        linear-gradient(
            105deg,
            rgba(6, 16, 32, 0.68) 0%,
            rgba(8, 20, 40, 0.48) 48%,
            rgba(12, 28, 56, 0.35) 100%
        ),
        radial-gradient(ellipse 55% 70% at 80% 50%, rgba(212, 175, 55, 0.18), transparent 60%) !important;
}

.page-home .footer {
    background:
        radial-gradient(ellipse 70% 60% at 20% 0%, rgba(46, 92, 158, 0.1), transparent 55%),
        linear-gradient(180deg, #081426 0%, #050d18 100%) !important;
    border-top-color: rgba(90, 140, 200, 0.22) !important;
}

.page-home .footer-section h4 {
    color: var(--luxury-gold);
}

@media (min-width: 1025px) {
    .page-home .hero-cinematic-eyebrow {
        font-size: 0.58rem;
        margin-bottom: 0.5rem;
    }

    .page-home .hero-cinematic-title {
        font-size: clamp(1.7rem, 3.4vw, 2.55rem);
        margin-bottom: 0.55rem;
        line-height: 1.08;
    }

    .page-home .hero-cinematic-lead {
        font-size: 0.9rem;
        line-height: 1.5;
        margin-bottom: 1.05rem;
        max-width: 38em;
    }

    .page-home .hero-cinematic-btn {
        font-size: 0.72rem;
        padding: 0.7rem 1.25rem;
        letter-spacing: 0.1em;
    }

    .page-home .hero-stat-value {
        font-size: clamp(1rem, 1.3vw, 1.2rem);
    }

    .page-home .hero-stat-label {
        font-size: 0.48rem;
    }

    .page-home .hero-cinematic-scroll-label {
        font-size: 0.58rem;
    }
}

@media (max-width: 1024px) {
    .page-home .navbar.navbar-cinematic {
        background: rgba(6, 16, 28, 0.42);
        border-bottom-color: rgba(212, 175, 55, 0.14);
    }

    .page-home .navbar.navbar-home-scrolled {
        background: rgba(6, 16, 28, 0.92) !important;
        border-bottom-color: rgba(212, 175, 55, 0.38) !important;
    }

    /* Match nav gutter so logo and hero copy share one left edge */
    .page-home .hero-cinematic-inner {
        padding-top: calc(var(--nav-bar-height, 68px) + env(safe-area-inset-top, 0px) + 1.55rem) !important;
        padding-left: max(var(--page-gutter), env(safe-area-inset-left)) !important;
        padding-right: max(var(--page-gutter), env(safe-area-inset-right)) !important;
    }

    .page-home .hero-cinematic-eyebrow {
        margin-top: 0;
    }

    .page-home .hero-cinematic-copy {
        margin-left: 0;
        text-align: left;
    }
}

@media (max-width: 768px) {
    .page-home .hero-cinematic-inner {
        padding-top: calc(var(--nav-bar-height, 64px) + env(safe-area-inset-top, 0px) + 1.35rem) !important;
        padding-left: max(var(--page-gutter), env(safe-area-inset-left)) !important;
        padding-right: max(var(--page-gutter), env(safe-area-inset-right)) !important;
    }

    .page-home .hero-cinematic-eyebrow {
        margin-top: 0;
        margin-bottom: 0.55rem;
    }
}

@media (max-width: 600px) {
    .page-home .hero-cinematic-inner {
        padding-top: calc(var(--nav-bar-height, 60px) + env(safe-area-inset-top, 0px) + 1.25rem) !important;
        padding-left: max(var(--page-gutter), env(safe-area-inset-left)) !important;
        padding-right: max(var(--page-gutter), env(safe-area-inset-right)) !important;
    }

    .page-home .featured-adventures-track {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 0.55rem !important;
        overflow: visible !important;
        scroll-snap-type: none !important;
    }

    .page-home .featured-adv-card,
    .page-home .featured-adv-card:first-child {
        flex: none !important;
        width: 100% !important;
        min-width: 0 !important;
        grid-column: auto !important;
        border-radius: 0.4rem;
    }

    .page-home .featured-adv-card .featured-adv-media,
    .page-home .featured-adv-card:first-child .featured-adv-media,
    .page-home .featured-adv-card:not(:first-child) .featured-adv-media {
        aspect-ratio: 16 / 10 !important;
    }

    .page-home .featured-adv-card .featured-adv-body,
    .page-home .featured-adv-card:first-child .featured-adv-body,
    .page-home .featured-adv-card:not(:first-child) .featured-adv-body {
        gap: 0.32rem !important;
        padding: 0.65rem 0.65rem 0.75rem !important;
    }

    .page-home .featured-adv-card .featured-adv-name,
    .page-home .featured-adv-card:first-child .featured-adv-name,
    .page-home .featured-adv-card:not(:first-child) .featured-adv-name {
        font-size: 0.92rem !important;
        line-height: 1.2 !important;
    }

    .page-home .featured-adv-tag,
    .page-home .featured-adv-card:not(:first-child) .featured-adv-tag {
        font-size: 0.46rem !important;
        padding: 0.18rem 0.4rem !important;
    }

    .page-home .featured-adv-meta,
    .page-home .featured-adv-card:not(:first-child) .featured-adv-meta {
        font-size: 0.6rem !important;
        gap: 0.28rem 0.45rem !important;
    }

    .page-home .featured-adv-card:last-child {
        grid-column: 1 / -1 !important;
    }

    .page-home .featured-adv-card:last-child .featured-adv-media {
        aspect-ratio: 16 / 8 !important;
    }

    .page-home .featured-adv-card:last-child .featured-adv-body {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 0.35rem 0.75rem !important;
        padding: 0.7rem 0.85rem 0.8rem !important;
    }

    .page-home .featured-adv-card:last-child .featured-adv-name {
        font-size: 1.05rem !important;
        margin-right: auto;
    }
}