/* Hero motion layer: full-bleed illustration + subtle SVG birds. */
.hero-shell {
    background: #f6f0e6;
}

.hero-media {
    background: #f6f0e6;
}

.hero-media > img {
    width: 100%;
    height: 100%;
    margin: 0;
    opacity: 1;
    object-fit: cover;
    object-position: center center;
}

/* The SVG owns the desktop overlap: its single Bézier sweep keeps the cream
   panel smooth from top to bottom, without an elliptical CSS edge. */
.hero-curve {
    display: block;
    filter: drop-shadow(8px 0 22px rgba(72, 54, 31, 0.055));
}

.hero-panel {
    position: relative;
    color: #121827;
}

.hero-panel::before {
    content: none;
}

/* Hero copy is viewport-aligned rather than constrained by the 1440px
   content container used by the editorial sections below. */
.hero-panel-inner {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: none;
    margin: 0;
    padding-left: clamp(2rem, 5vw, 6rem);
    padding-right: clamp(2rem, 3vw, 3.5rem);
}

.hero-body {
    max-width: 42rem;
    gap: clamp(.9rem, 1.8vh, 1.2rem);
}

.hero-heading {
    color: #121827;
    font-size: clamp(3.48rem, 5.04vw, 5.76rem);
    font-weight: 700;
    line-height: .98;
    letter-spacing: -.045em;
    white-space: nowrap;
    text-wrap: nowrap;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.28);
}

.hero-heading-accent {
    display: block;
    color: #5958e8;
    white-space: nowrap;
}

.hero-lede {
    max-width: 36rem;
    color: rgba(18, 24, 39, 0.68);
}

/* Keep the first screen focused on one action: search. The quick chips and
   repeated trust claims remain in the markup for compatibility but move out
   of the visual hierarchy. */
.hero-suggestions,
.hero-trust {
    display: none;
}

.hero-search-wrapper {
    max-width: 36rem;
}

.hero-eyebrow {
    background: rgba(89, 88, 232, 0.08);
    border-color: rgba(89, 88, 232, 0.2);
    color: #4f50c8;
}

.hero-eyebrow-dot {
    background: #6567f1;
    box-shadow: 0 0 8px rgba(89, 88, 232, 0.38);
}

.hero-search {
    border-color: rgba(18, 24, 39, 0.12);
    background: rgba(255, 255, 255, 0.72);
    box-shadow: 0 8px 28px rgba(72, 54, 31, 0.08);
    backdrop-filter: blur(16px) saturate(120%);
    -webkit-backdrop-filter: blur(16px) saturate(120%);
}

.hero-search:focus-within {
    border-color: rgba(89, 88, 232, 0.48);
    background: rgba(255, 255, 255, 0.82);
    box-shadow: 0 0 0 3px rgba(89, 88, 232, 0.12), 0 10px 30px rgba(72, 54, 31, 0.1);
}

.hero-search input {
    color: #121827;
}

.hero-search input::placeholder {
    color: rgba(18, 24, 39, 0.42);
}

.hero-search input::-webkit-search-cancel-button {
    filter: none;
    opacity: .52;
}

.hero-search-icon,
.trust-icon {
    color: #5958e8;
}

.hero-search-submit {
    background: linear-gradient(135deg, #7878ff, #6464ec);
    color: #111528;
    box-shadow: 0 4px 14px rgba(89, 88, 232, 0.22);
}

.hero-search-submit:hover {
    background: linear-gradient(135deg, #8585ff, #6d6df2);
}

.hero-suggestions .suggestions-label {
    color: rgba(18, 24, 39, 0.46);
}

.suggestion-chip {
    background: rgba(255, 255, 255, 0.5);
    border-color: rgba(18, 24, 39, 0.1);
    color: rgba(18, 24, 39, 0.66);
}

.suggestion-chip:hover {
    background: rgba(89, 88, 232, 0.1);
    border-color: rgba(89, 88, 232, 0.25);
    color: #252747;
}

.hero-trust li {
    color: rgba(18, 24, 39, 0.66);
}

/* Light floating navigation to match the painterly hero rather than the old
   dark bar. */
.site-header {
    padding: 10px clamp(1rem, 3vw, 2rem) 0;
    background: transparent;
    border-bottom: 0;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    box-shadow: none;
}

.site-header-inner {
    min-height: 62px;
    padding-inline: clamp(1rem, 2vw, 1.45rem);
    border: 1px solid rgba(18, 24, 39, 0.08);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.68);
    box-shadow: 0 8px 30px rgba(67, 52, 34, 0.06);
    backdrop-filter: blur(18px) saturate(125%);
    -webkit-backdrop-filter: blur(18px) saturate(125%);
}

.site-header.is-scrolled {
    background: transparent;
    border-bottom: 0;
    box-shadow: none;
}

.site-header.is-scrolled .site-header-inner {
    background: rgba(255, 255, 255, 0.86);
    border-color: rgba(18, 24, 39, 0.11);
    box-shadow: 0 8px 32px rgba(40, 34, 28, 0.11);
}

.site-header .hero-brand,
.site-header .hero-nav-links a {
    color: #182033;
}

.site-header .hero-nav-links a:hover {
    color: #5558dd;
}

.site-header .hero-nav-cta {
    border-color: rgba(89, 88, 232, 0.18);
    background: linear-gradient(135deg, #5657d9, #4c4dcc);
    color: #fff;
    box-shadow: 0 5px 15px rgba(76, 77, 204, 0.18);
}

.site-header .hero-nav-cta:hover {
    border-color: rgba(89, 88, 232, 0.3);
    background: linear-gradient(135deg, #6263e5, #5657d9);
}

.landing-theme-toggle {
    display: inline-grid;
    place-items: center;
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    padding: 0;
    border: 1px solid rgba(18, 24, 39, 0.1);
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.54);
    color: #4c4dcc;
    cursor: pointer;
    font: inherit;
    font-size: 1rem;
}

.landing-theme-toggle:hover { background: rgba(255, 255, 255, 0.82); }
.landing-theme-toggle:focus-visible { outline: 2px solid #5657d9; outline-offset: 3px; }

/* Warm charcoal preserves the landing page's legal-editorial mood while the
   illustration remains a bright, legible point of focus. */
body.landing-page.dark-theme {
    --hero-page: #211d1b;
    --hero-panel: #19191e;
    --hero-panel-2: #242026;
    --hero-text: #fcf7ed;
    --hero-text-2: rgba(252, 247, 237, 0.74);
    --hero-text-3: rgba(252, 247, 237, 0.56);
    --ink: #f5eee4;
    --ink-2: rgba(245, 238, 228, 0.72);
    --ink-3: rgba(245, 238, 228, 0.54);
    --hairline: rgba(245, 238, 228, 0.16);
    --accent-deep: #a09dff;
}

body.landing-page.dark-theme .hero-shell,
body.landing-page.dark-theme .hero-media { background: #211d1b; }

body.landing-page.dark-theme .hero-media::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(25, 20, 19, 0.42), rgba(25, 20, 19, 0.1) 58%, rgba(25, 20, 19, 0.04));
    pointer-events: none;
}

body.landing-page.dark-theme #hero-panel-fill stop:nth-child(1) { stop-color: #28211f; }
body.landing-page.dark-theme #hero-panel-fill stop:nth-child(2) { stop-color: #241f1d; }
body.landing-page.dark-theme #hero-panel-fill stop:nth-child(3) { stop-color: #201d1d; }
body.landing-page.dark-theme .hero-curve { filter: drop-shadow(8px 0 22px rgba(0, 0, 0, 0.22)); }
body.landing-page.dark-theme .hero-panel { color: var(--hero-text); }
body.landing-page.dark-theme .hero-heading { color: var(--hero-text); text-shadow: none; }
body.landing-page.dark-theme .hero-heading-accent { color: #a09dff; }
body.landing-page.dark-theme .hero-lede { color: var(--hero-text-2); }
body.landing-page.dark-theme .hero-eyebrow { background: rgba(160, 157, 255, 0.12); border-color: rgba(160, 157, 255, 0.28); color: #c2c0ff; }
body.landing-page.dark-theme .hero-search { border-color: rgba(252, 247, 237, 0.17); background: rgba(33, 29, 27, 0.82); box-shadow: 0 8px 28px rgba(0, 0, 0, 0.22); }
body.landing-page.dark-theme .hero-search input { color: var(--hero-text); }
body.landing-page.dark-theme .hero-search input::placeholder { color: var(--hero-text-3); }
body.landing-page.dark-theme .hero-suggestions .suggestions-label,
body.landing-page.dark-theme .hero-trust li { color: var(--hero-text-3); }
body.landing-page.dark-theme .suggestion-chip { background: rgba(252, 247, 237, 0.07); border-color: rgba(252, 247, 237, 0.15); color: var(--hero-text-2); }
body.landing-page.dark-theme .site-header-inner { border-color: rgba(252, 247, 237, 0.12); background: rgba(35, 29, 27, 0.74); box-shadow: 0 8px 30px rgba(0, 0, 0, 0.2); }
body.landing-page.dark-theme .site-header.is-scrolled .site-header-inner { background: rgba(35, 29, 27, 0.92); border-color: rgba(252, 247, 237, 0.18); }
body.landing-page.dark-theme .site-header .hero-brand,
body.landing-page.dark-theme .site-header .hero-nav-links a { color: var(--hero-text); }
body.landing-page.dark-theme .landing-theme-toggle { border-color: rgba(252, 247, 237, 0.14); background: rgba(252, 247, 237, 0.08); color: #f6d791; }
body.landing-page.dark-theme .landing-theme-toggle:hover { background: rgba(252, 247, 237, 0.15); }

/* The editorial sections are light paper by default.  Their former dark
   treatment is reserved for the explicit dark preference above. */
body.landing-page:not(.dark-theme) .section--dark {
    background: #EAE8E0;
    color: var(--ink);
}

body.landing-page:not(.dark-theme) .section--dark .section-eyebrow,
body.landing-page:not(.dark-theme) .source-mark { color: var(--accent-deep); }

body.landing-page:not(.dark-theme) .section--dark .section-lede,
body.landing-page:not(.dark-theme) .feature-panel p,
body.landing-page:not(.dark-theme) .source-row p { color: var(--ink-2); }

body.landing-page:not(.dark-theme) .feature-panel {
    border-color: var(--hairline);
    background: rgba(255, 253, 248, 0.92);
    color: var(--ink);
}

body.landing-page:not(.dark-theme) .feature-icon {
    border-color: rgba(85, 88, 221, 0.2);
    background: rgba(85, 88, 221, 0.09);
    color: var(--accent-deep);
}

body.landing-page:not(.dark-theme) .source-row,
body.landing-page:not(.dark-theme) .source-row:last-child { border-color: var(--hairline); }

body.landing-page:not(.dark-theme) .section-cta {
    border-color: rgba(85, 88, 221, 0.22);
    background: rgba(85, 88, 221, 0.09);
    color: var(--accent-deep);
}

body.landing-page:not(.dark-theme) .section-cta:hover {
    border-color: rgba(85, 88, 221, 0.38);
    background: rgba(85, 88, 221, 0.15);
}

body.landing-page:not(.dark-theme) .doc-layer {
    border-color: var(--hairline);
    background: rgba(255, 253, 248, 0.65);
    color: var(--ink-2);
}

body.landing-page:not(.dark-theme) .doc-layer--1 {
    border-color: rgba(85, 88, 221, 0.28);
    background: rgba(85, 88, 221, 0.09);
    color: var(--accent-deep);
}

body.landing-page:not(.dark-theme) .fragment-frame {
    border-color: var(--hairline);
    background: #EAE8E0;
}

body.landing-page:not(.dark-theme) .fragment-frame::after {
    background: linear-gradient(180deg, rgba(255, 253, 248, 0.02), rgba(18, 22, 29, 0.12));
}

body.landing-page:not(.dark-theme) .final-panel {
    border: 1px solid var(--hairline);
    background: #FFFDF8;
}

body.landing-page:not(.dark-theme) .final-title { color: var(--ink); }

body.landing-page:not(.dark-theme) .site-footer {
    background: #E6E4DC;
    color: var(--ink-2);
}

body.landing-page:not(.dark-theme) .site-footer .hero-brand,
body.landing-page:not(.dark-theme) .footer-col h3 { color: var(--ink); }

body.landing-page:not(.dark-theme) .footer-col a { color: var(--ink-2); }

/* Birds stay as a separate motion layer so the artwork itself remains static
   and can be swapped independently later. */
.hero-birds {
    position: absolute;
    top: 4%;
    right: 0;
    z-index: 2;
    width: 57%;
    height: 48%;
    overflow: visible;
    pointer-events: none;
    color: rgba(34, 51, 69, 0.44);
}

.hero-bird {
    opacity: 0.68;
    will-change: transform;
}

.hero-bird--2 { opacity: 0.54; }
.hero-bird--3 { opacity: 0.44; }
.hero-bird--4 { opacity: 0.36; }

.hero-bird__shape {
    fill: none;
    stroke: currentColor;
    stroke-width: 2.2;
    stroke-linecap: round;
    stroke-linejoin: round;
    vector-effect: non-scaling-stroke;
    transform-box: fill-box;
    transform-origin: center;
    will-change: transform;
}

@media (max-width: 1080px) {
    .hero-body {
        max-width: 31rem;
    }

    .hero-birds {
        width: 60%;
    }
}

@media (max-width: 860px) {
    .site-header {
        padding: 8px .75rem 0;
    }

    .site-header-inner {
        border-radius: 14px;
    }

    .hero-panel-inner {
        padding-left: clamp(1.25rem, 4vw, 2rem);
        padding-right: clamp(1.25rem, 4vw, 2rem);
    }

    .hero-panel::before {
        content: "";
        position: absolute;
        inset: 0;
        z-index: 0;
        width: 100%;
        border-radius: 0;
        background: #f7f2e9;
        pointer-events: none;
    }

    body.landing-page.dark-theme .hero-panel::before { background: #211d1b; }

    .hero-media {
        background-position: 62% 42%;
    }

    .hero-media > img {
        width: 100%;
        margin-left: 0;
    }

    .hero-birds {
        width: 100%;
        height: 58%;
        opacity: 0.68;
    }

    .hero-bird--3,
    .hero-bird--4 {
        display: none;
    }
}

@media (max-width: 560px) {
    .site-header .hero-nav-cta {
        padding-inline: .75rem;
    }

    .hero-panel-inner {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .hero-heading {
        font-size: clamp(3rem, 13.2vw, 3.6rem);
    }

    .hero-search {
        background: rgba(255, 255, 255, 0.86);
    }

    .landing-theme-toggle { flex-basis: 36px; width: 36px; height: 36px; }
}

@media (prefers-reduced-motion: reduce) {
    .hero-bird,
    .hero-bird__shape {
        will-change: auto;
    }
}