/**
 * Nav → Footer handoff — premium scroll transition
 */

:root {
    --nf-progress: 0;
    --nf-bridge-h: 0px;
    --nf-bridge-top: 92px;
    --nf-ease: cubic-bezier(0.22, 1, 0.36, 1);
}

.nf-horizon {
    position: relative;
    height: clamp(48px, 8vw, 96px);
    margin-top: -1px;
    background: linear-gradient(
        180deg,
        transparent 0%,
        rgba(250, 248, 245, 0.55) 45%,
        #faf8f5 100%
    );
    pointer-events: none;
    opacity: calc(var(--nf-progress) * 0.85);
    transition: opacity 0.4s var(--nf-ease);
}

/* Golden bridge */
.nav-footer-bridge {
    position: fixed;
    left: 50%;
    top: var(--nf-bridge-top);
    width: 3px;
    height: var(--nf-bridge-h);
    margin-left: -1.5px;
    z-index: 1040;
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.35s var(--nf-ease);
}

.nav-footer-bridge-beam {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(212, 175, 55, 0.95) 0%,
        rgba(232, 201, 106, 0.75) 40%,
        rgba(212, 175, 55, 0.35) 85%,
        rgba(212, 175, 55, 0) 100%
    );
    border-radius: 999px;
    transform-origin: top center;
    transform: scaleY(calc(0.15 + var(--nf-progress) * 0.85));
    box-shadow:
        0 0 12px rgba(212, 175, 55, 0.45),
        0 0 28px rgba(212, 175, 55, 0.2);
}

.nav-footer-bridge-head,
.nav-footer-bridge-tail {
    position: absolute;
    left: 50%;
    width: 10px;
    height: 10px;
    margin-left: -5px;
    border-radius: 50%;
    background: var(--color-gold);
    box-shadow: 0 0 14px rgba(212, 175, 55, 0.65);
}

.nav-footer-bridge-head {
    top: -4px;
    transform: scale(calc(0.6 + var(--nf-progress) * 0.5));
}

.nav-footer-bridge-tail {
    bottom: -2px;
    opacity: calc(var(--nf-progress) * 0.9);
    transform: scale(calc(0.4 + var(--nf-progress) * 0.6));
}

.nav-footer-bridge.is-live .nav-footer-bridge-beam {
    animation: nf-beam-pulse 2.4s ease-in-out infinite;
}

@keyframes nf-beam-pulse {
    0%, 100% { filter: brightness(1); }
    50% { filter: brightness(1.25); }
}

/* Header morph */
.site-header {
    transition:
        background 0.55s var(--nf-ease),
        box-shadow 0.55s var(--nf-ease),
        border-color 0.55s var(--nf-ease);
}

.site-header .main-nav,
.site-header .header-actions .hidden-mobile,
.site-header .header-whatsapp span {
    transition:
        opacity 0.45s var(--nf-ease),
        transform 0.5s var(--nf-ease),
        filter 0.45s var(--nf-ease);
}

.site-header .logo-dual {
    transition: transform 0.5s var(--nf-ease), opacity 0.45s var(--nf-ease);
}

.site-header.nf-handoff {
    background: linear-gradient(
        180deg,
        rgba(255, 255, 255, 0.97) 0%,
        rgba(250, 248, 245, 0.98) 100%
    );
    border-bottom-color: rgba(212, 175, 55, calc(0.15 + var(--nf-progress) * 0.55));
    box-shadow:
        0 4px 24px rgba(26, 24, 20, calc(0.04 + var(--nf-progress) * 0.06)),
        0 0 0 1px rgba(212, 175, 55, calc(var(--nf-progress) * 0.12));
}

.site-header.nf-handoff .main-nav {
    opacity: calc(1 - var(--nf-progress) * 1.1);
    transform: translateY(calc(-14px * var(--nf-progress))) scale(calc(1 - var(--nf-progress) * 0.03));
    filter: blur(calc(3px * var(--nf-progress)));
}

.site-header.nf-handoff-deep .main-nav {
    pointer-events: none;
}

.site-header.nf-handoff .header-actions .btn-outline-gold,
.site-header.nf-handoff .header-actions .btn-gold.hidden-mobile {
    opacity: calc(1 - var(--nf-progress) * 1.2);
    transform: translateY(calc(-8px * var(--nf-progress)));
}

.site-header.nf-handoff .header-whatsapp span {
    opacity: calc(1 - var(--nf-progress));
}

.site-header.nf-handoff .logo-dual {
    transform: scale(calc(1 - var(--nf-progress) * 0.08));
}

.header-handoff-strip {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) translateY(calc(10px * (1 - var(--nf-progress))));
    display: none;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    background: rgba(255, 255, 255, 0.85);
    border: 1px solid rgba(212, 175, 55, calc(0.2 + var(--nf-progress) * 0.35));
    border-radius: var(--radius-pill);
    box-shadow: 0 4px 20px rgba(212, 175, 55, calc(var(--nf-progress) * 0.15));
    opacity: calc(var(--nf-progress) * 1.15);
    pointer-events: none;
    white-space: nowrap;
    z-index: 2;
    backdrop-filter: blur(8px);
    transition:
        opacity 0.4s var(--nf-ease),
        transform 0.5s var(--nf-ease),
        box-shadow 0.45s var(--nf-ease);
}

.site-header.nf-handoff-deep .header-handoff-strip {
    pointer-events: auto;
}

.header-handoff-label {
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--color-gold-dark);
    padding-right: 8px;
    border-right: 1px solid rgba(212, 175, 55, 0.3);
    margin-right: 2px;
}

.header-handoff-link {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--text-secondary);
    padding: 4px 10px;
    border-radius: var(--radius-pill);
    transition: color 0.25s ease, background 0.25s ease;
}

.header-handoff-link:hover {
    color: var(--color-gold-dark);
    background: rgba(212, 175, 55, 0.1);
}

.header-handoff-link--gold {
    color: var(--color-gold-dark);
    font-weight: 700;
}

.header-handoff-dot {
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: rgba(212, 175, 55, 0.45);
    flex-shrink: 0;
}

/* Footer entrance */
.site-footer {
    --nf-reveal-y: 28px;
}

.site-footer.nf-handoff-target .ft-accent {
    transform: scaleX(calc(0.2 + var(--nf-progress) * 0.8));
    opacity: calc(0.4 + var(--nf-progress) * 0.6);
}

.site-footer .ft-accent {
    transform-origin: center;
    transition: transform 0.6s var(--nf-ease), opacity 0.5s var(--nf-ease);
}

.nf-reveal {
    opacity: 0;
    transform: translateY(var(--nf-reveal-y));
    transition:
        opacity 0.65s var(--nf-ease),
        transform 0.75s var(--nf-ease);
    transition-delay: var(--nf-delay, 0ms);
}

.nf-reveal.nf-visible {
    opacity: 1;
    transform: translateY(0);
}

.nf-reveal-d1 { --nf-delay: 60ms; }
.nf-reveal-d2 { --nf-delay: 120ms; }
.nf-reveal-d3 { --nf-delay: 180ms; }
.nf-reveal-d4 { --nf-delay: 240ms; }
.nf-reveal-d5 { --nf-delay: 300ms; }

.site-footer.nf-revealed .ft-cta {
    animation: nf-footer-glow 0.8s var(--nf-ease) both;
}

@keyframes nf-footer-glow {
    from { box-shadow: 0 0 0 rgba(212, 175, 55, 0); }
    50% { box-shadow: 0 0 32px rgba(212, 175, 55, 0.12); }
    to { box-shadow: none; }
}

body.nf-handoff-active .whatsapp-float,
body.nf-handoff-active .back-to-top {
    transform: translateY(calc(-6px * var(--nf-progress)));
    transition: transform 0.45s var(--nf-ease);
}

.back-to-top {
    background: var(--color-white);
    border: 1px solid var(--border-gold);
    color: var(--color-gold-dark);
    box-shadow: var(--shadow-md);
}

.back-to-top:hover {
    background: var(--color-gold);
    color: var(--color-white);
}

@media (min-width: 1024px) {
    .header-handoff-strip {
        display: flex;
    }
}

@media (max-width: 1023px) {
    .site-header.nf-handoff .main-nav {
        opacity: 1;
        transform: none;
        filter: none;
    }

    .nav-footer-bridge {
        left: auto;
        right: 24px;
        width: 2px;
        margin-left: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .nav-footer-bridge,
    .nf-horizon {
        display: none !important;
    }

    .nf-reveal {
        opacity: 1;
        transform: none;
        transition: none;
    }

    .site-header.nf-handoff .main-nav {
        opacity: 1;
        transform: none;
        filter: none;
    }
}