/*
    funnel.css — campaign landing pages only (no-nav).
    Loaded by the door / MetaFest landing pages on top of the standard
    token + component stack. It does ONE job: a minimal brand-only header
    and a slim legal-only footer, so a paid-traffic page has a single
    action and no navigation to leak the visitor back into the site.

    Site pages (Free Intro, /method/, etc.) keep the full .site-header nav
    and do NOT load this file.
*/

/* --- Minimal brand-only header --- */
.landing-header {
    border-bottom: var(--border-hairline);
    background: var(--surface-base);
}

.landing-header-inner {
    display: flex;
    align-items: center;
    justify-content: center;       /* centred logo — no nav to balance against */
    max-width: var(--content-width);
    margin: 0 auto;
    padding: var(--space-3) var(--space-4);
}

/* The brand mark is deliberately NOT a link on a landing page — clicking
   away to the homepage is the exact leak these pages exist to prevent. */
.landing-brand-mark {
    display: block;
    height: 36px;
    width: auto;
}

/* --- Slim legal-only footer --- */
.landing-footer {
    border-top: var(--border-hairline);
    background: var(--surface-base);
    margin-top: var(--space-12);
}

.landing-footer-inner {
    max-width: var(--content-width);
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
    text-align: center;
    color: var(--ink-muted);
}

.landing-footer-inner .brand {
    margin-bottom: var(--space-1);
}

.landing-footer-legal {
    font-size: var(--text-sm);
    color: var(--ink-muted);
    margin-top: var(--space-2);
}

.landing-footer-legal a {
    color: var(--ink-muted);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.landing-footer-legal a:hover {
    color: var(--accent-link);
}

/* --- MetaFest seal — featured on the navy bonus band, where its gold-on-navy
   emblem actually belongs (never mashed against the WW wordmark in the header). --- */
.metafest-seal { display: block; width: 92px; height: auto; margin: 0 auto var(--space-3); border-radius: 50%; }

/* --- Hero "what you get" promise list --- */
.get-list {
    list-style: none; padding: 0;
    margin: var(--space-4) 0;
    display: grid; gap: var(--space-2);
}
.get-list li {
    position: relative; padding-left: var(--space-5, 34px);
    line-height: var(--lh-body); color: var(--ink);
}
.get-list li strong { color: var(--ink-deep); }
/* Lotus-seed medallion marker (same vocabulary as the benefit lists). */
.get-list li::before {
    content: ""; position: absolute; left: 0; top: 0.05em;
    width: 26px; height: 26px; border-radius: 50%;
    border: var(--border-hairline);
    background: url('/img/logos/logo-icon-abstract.svg') no-repeat center / 14px auto;
}

/* --- Continuity cue under the hero --- */
.hero-more {
    margin-top: var(--space-6);
    text-align: center;
    font-size: var(--text-sm);
    color: var(--ink-muted);
}

/* --- Resource link (podcast) — a quiet horizontal card --- */
.resource-link {
    display: flex; align-items: center; gap: var(--space-3);
    margin-top: var(--space-6);
    padding: var(--space-3) var(--space-4);
    border: var(--border-hairline); border-radius: var(--radius-md);
    background: var(--surface-base); text-decoration: none;
    transition: border-color var(--transition-fast);
}
.resource-link:hover { border-color: var(--accent-end); }
.resource-kind {
    flex: none;
    font-family: var(--font-structure); font-weight: var(--weight-extrabold);
    font-size: var(--text-xs); text-transform: uppercase; letter-spacing: var(--tracking-eyebrow);
    color: var(--accent-link);
}
.resource-body { display: flex; flex-direction: column; gap: 2px; flex: 1; }
.resource-title { font-family: var(--font-display); font-size: var(--text-lg); color: var(--ink-deep); line-height: var(--lh-heading); }
.resource-meta { font-size: var(--text-sm); color: var(--ink-muted); line-height: var(--lh-body); }
.resource-platforms { display: flex; align-items: center; gap: 10px; margin-top: 6px; opacity: 0.55; }
.resource-arrow { flex: none; color: var(--accent-link); font-size: var(--text-xl); }

/* --- Closing capture: keep the second form to a comfortable reading width --- */
.section-close-capture .lp-form,
.form--centered { max-width: 460px; margin-inline: auto; }
.section-close-capture .section-head { text-align: center; }