:root {
    color-scheme: dark;
    --ink: #f5f8fb;
    --muted: #a8b8c6;
    --quiet: #7890a3;
    --night: #081423;
    --night-deep: #050d17;
    --panel: #0d1d2e;
    --panel-soft: #11263a;
    --line: rgba(220, 238, 248, .14);
    --accent: #4de3ff;
    --accent-deep: #0ca8c4;
    --warm: #f39a68;
    --warm-deep: #b94f37;
    --cream: #fff7eb;
    --sage: #91a779;
    --paper: #f3efe7;
    --paper-ink: #13233e;
    --paper-muted: #596778;
    --paper-line: #dcd2c4;
    --radius: 1.15rem;
    --shell: min(1180px, calc(100% - 2.5rem));
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    margin: 0;
    color: var(--ink);
    background: var(--night);
    font-family: Inter, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    font-size: 1rem;
    line-height: 1.65;
    -webkit-font-smoothing: antialiased;
}
body::before {
    position: fixed;
    z-index: -1;
    inset: 0;
    background-image:
        linear-gradient(rgba(77, 227, 255, .02) 1px, transparent 1px),
        linear-gradient(90deg, rgba(77, 227, 255, .02) 1px, transparent 1px);
    background-size: 34px 34px;
    content: "";
    pointer-events: none;
}
a { color: inherit; }
button, input, textarea, select { font: inherit; }
.shell { width: var(--shell); margin-inline: auto; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; z-index: 100; left: 1rem; top: 1rem; padding: .75rem 1rem; color: var(--night); background: var(--accent); transform: translateY(-160%); }
.skip-link:focus { transform: translateY(0); }

.site-header { position: sticky; z-index: 30; top: 0; border-bottom: 1px solid var(--line); background: rgba(8, 20, 35, .9); backdrop-filter: blur(16px); }
.header-inner { min-height: 5rem; display: flex; align-items: center; justify-content: space-between; gap: 2rem; }
.brand { display: inline-flex; flex: 0 0 auto; align-items: center; gap: .75rem; max-width: 100%; min-height: 2.75rem; color: var(--ink); text-decoration: none; }
.brand-mark { display: block; flex: 0 0 auto; width: 3.5rem; height: 2.5rem; }
.brand-name { font-size: 1.35rem; font-weight: 800; letter-spacing: -.045em; line-height: 1.1; white-space: nowrap; }
.brand-name span { color: var(--accent); }
.main-nav { display: flex; align-items: center; gap: 1.65rem; }
.main-nav a { color: var(--muted); text-decoration: none; font-size: .93rem; font-weight: 650; }
.main-nav a:hover, .main-nav a:focus-visible, .main-nav a.is-active { color: var(--ink); }
.main-nav .header-cta { min-height: 2.75rem; display: inline-flex; align-items: center; padding: .55rem 1rem; border-radius: .7rem; color: var(--night); background: var(--warm); }
.main-nav .header-cta:hover, .main-nav .header-cta:focus-visible { color: var(--night); background: #ffc09d; }
.menu-toggle { display: none; flex: 0 0 auto; width: 2.75rem; height: 2.75rem; border: 1px solid var(--line); border-radius: .65rem; color: var(--ink); background: transparent; }
.menu-toggle span[aria-hidden] { width: 1.15rem; height: 1px; display: block; margin: .34rem auto; background: currentColor; }

.hero { min-height: calc(100vh - 5rem); display: grid; grid-template-columns: minmax(0, 1fr) minmax(25rem, .95fr); gap: clamp(2.5rem, 6vw, 5.5rem); align-items: center; padding-block: clamp(4.5rem, 8vw, 7rem); }
.hero h1 { max-width: 49rem; margin: 0 0 1.6rem; font-size: clamp(3.2rem, 6vw, 5.8rem); line-height: .96; letter-spacing: -.062em; text-wrap: balance; }
.eyebrow { margin: 0 0 1.25rem; color: var(--warm); font-size: .79rem; font-weight: 750; letter-spacing: .1em; line-height: 1.5; text-transform: uppercase; }
.hero-intro { max-width: 44rem; margin: 0; color: var(--muted); font-size: clamp(1.05rem, 1.7vw, 1.3rem); }
.hero-intro, .audience-layout > div > p, .service-card p, .teaser-card p, .listing-row p, .entry-lead, .contact-copy > p:not(.eyebrow) { white-space: pre-line; }
.hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1.6rem; margin-top: 2.2rem; }
.button { min-height: 3rem; display: inline-flex; justify-content: center; align-items: center; gap: .6rem; padding: .75rem 1.25rem; border: 0; border-radius: .75rem; color: var(--night); background: var(--warm); text-decoration: none; font-weight: 750; cursor: pointer; }
.button:hover, .button:focus-visible { background: #ffc09d; }
.text-link { color: var(--ink); text-underline-offset: .3em; font-weight: 700; }
.text-link span { color: var(--accent); }
.hero-showcase { display: grid; gap: 1rem; min-width: 0; }
.hero-visual { position: relative; isolation: isolate; margin: 0; overflow: hidden; border: 1px solid rgba(243, 154, 104, .42); border-radius: 1.65rem; background: var(--cream); box-shadow: 0 2rem 5rem rgba(0, 0, 0, .24); }
.hero-visual::after { position: absolute; z-index: 1; inset: 0; border-radius: inherit; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .38); content: ""; pointer-events: none; }
.hero-visual img { width: 100%; height: auto; display: block; }
.hero-visual figcaption { position: absolute; z-index: 2; left: 1rem; bottom: 1rem; display: grid; gap: .05rem; padding: .7rem .9rem; border: 1px solid rgba(255, 255, 255, .14); border-radius: .8rem; color: var(--ink); background: rgba(8, 20, 35, .9); box-shadow: 0 .7rem 2rem rgba(0, 0, 0, .2); backdrop-filter: blur(10px); }
.hero-visual figcaption span { color: #cfdae2; font-size: .68rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; }
.hero-visual figcaption strong { font-size: .92rem; }
.process-card { padding: 1.2rem 1.35rem; border: 1px solid rgba(77, 227, 255, .22); border-radius: var(--radius); background: rgba(13, 29, 46, .9); box-shadow: 0 1.5rem 4rem rgba(0, 0, 0, .16); }
.process-card-head { display: flex; justify-content: space-between; gap: 1rem; padding-bottom: 1rem; color: var(--quiet); font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; }
.process-card ol { list-style: none; display: grid; grid-template-columns: 1fr 1fr; gap: 0 1.25rem; margin: 0; padding: 0; }
.process-card li { display: grid; grid-template-columns: 2rem 1fr; gap: .55rem; padding: .9rem 0; border-top: 1px solid var(--line); }
.process-card li span { color: var(--warm); font-size: .76rem; }
.process-card strong { font-size: .95rem; }

.services-section { padding-block: clamp(5rem, 10vw, 9rem); border-block: 1px solid var(--paper-line); color: var(--paper-ink); background: var(--paper); }
.services-section .eyebrow { color: var(--warm-deep); }
.section-heading { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; align-items: end; margin-bottom: 3rem; }
.section-heading h2, .audience-section h2, .contact-band h2, .simple-page h1 { margin: 0; font-size: clamp(2.25rem, 5vw, 4.5rem); line-height: 1.02; letter-spacing: -.05em; text-wrap: balance; }
.section-heading > p { max-width: 34rem; margin: 0; color: var(--paper-muted); font-size: 1.08rem; }
.service-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.service-card { min-height: 23rem; display: flex; flex-direction: column; padding: 1.7rem; border: 1px solid var(--paper-line); border-radius: var(--radius); color: var(--paper-ink); background: rgba(255, 253, 248, .8); box-shadow: 0 1.2rem 3.5rem rgba(38, 48, 62, .06); text-decoration: none; transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease; }
.service-card:hover, .service-card:focus-visible { transform: translateY(-.35rem); border-color: rgba(185, 79, 55, .5); box-shadow: 0 1.5rem 3.5rem rgba(38, 48, 62, .12); }
.service-card-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; }
.service-number { color: var(--warm-deep); font-size: .77rem; }
.service-icon { width: 3.3rem; height: 3.3rem; display: grid; place-items: center; border-radius: 1rem; color: #287f8e; background: #dff0ed; }
.service-card:nth-child(2) .service-icon { color: #a84d37; background: #f8ded0; }
.service-card:nth-child(3) .service-icon { color: #5f754c; background: #e3ead9; }
.service-icon svg { width: 2rem; height: 2rem; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.service-card h3 { margin: 5.2rem 0 .8rem; font-size: 1.6rem; letter-spacing: -.03em; }
.service-card p { margin: 0 0 1.5rem; color: var(--paper-muted); }
.card-link { margin-top: auto; font-size: .9rem; font-weight: 750; }
.services-section .card-link span { color: var(--warm-deep); }

.audience-section { padding-block: clamp(5rem, 10vw, 9rem); }
.audience-layout { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(18rem, .85fr); gap: clamp(3rem, 8vw, 7rem); }
.audience-layout > div > p { margin-top: .35rem; color: var(--muted); font-size: 1.08rem; }
.check-list { list-style: none; margin: 2rem 0 0; padding: 0; }
.check-list li { position: relative; padding: .8rem 0 .8rem 2rem; border-top: 1px solid var(--line); }
.check-list li::before { position: absolute; left: 0; color: var(--accent); content: "↳"; }

.contact-band { color: var(--paper-ink); background: linear-gradient(120deg, #f6b18a 0%, #f5cbb4 38%, var(--paper) 100%); }
.contact-band-inner { min-height: 22rem; display: flex; justify-content: space-between; align-items: center; gap: 3rem; padding-block: 4rem; }
.contact-band .eyebrow { color: #8f3727; }
.contact-band h2 { max-width: 47rem; }
.button-light { color: #fff; background: var(--paper-ink); white-space: nowrap; }
.button-light:hover, .button-light:focus-visible { color: #fff; background: #26466b; }

.simple-page { min-height: 60vh; padding-block: 7rem; }
.simple-page > p:not(.eyebrow) { max-width: 44rem; color: var(--muted); font-size: 1.1rem; }
.simple-page .button { margin-top: 1rem; }

.page-hero { max-width: 62rem; margin-inline: auto; padding-block: clamp(5rem, 10vw, 9rem) clamp(3rem, 7vw, 6rem); text-align: center; }
.page-hero h1, .entry-page h1, .about-intro h1, .contact-copy h1, .legal-page h1 { margin: 0 0 1.5rem; font-size: clamp(3rem, 7vw, 6rem); line-height: .96; letter-spacing: -.06em; text-wrap: balance; }
.page-hero > p:last-child { max-width: 44rem; margin: 0 auto; color: var(--muted); font-size: 1.15rem; }
.listing-section { padding-bottom: clamp(5rem, 10vw, 9rem); }
.listing-row { display: grid; grid-template-columns: 3rem minmax(0, 1fr) auto; gap: 2rem; align-items: center; padding-block: 2rem; border-top: 1px solid var(--line); color: inherit; text-decoration: none; }
.listing-row:last-child { border-bottom: 1px solid var(--line); }
.listing-row:hover h2, .listing-row:focus-visible h2 { color: var(--accent); }
.listing-number, .teaser-meta { color: var(--accent); font-size: .78rem; letter-spacing: .08em; text-transform: uppercase; }
.teaser-meta { display: flex; flex-wrap: wrap; gap: .4rem .65rem; }
.teaser-meta time { color: var(--muted); }
.listing-section.has-publication-date .listing-row { grid-template-columns: 7rem minmax(0, 1fr) auto; }
.listing-number time { white-space: nowrap; }
.listing-row h2 { margin: 0 0 .35rem; font-size: clamp(1.5rem, 3vw, 2.4rem); letter-spacing: -.035em; transition: color .2s ease; }
.listing-row p { margin: 0; color: var(--muted); }
.listing-arrow { color: var(--accent); font-size: 1.5rem; }

.entry-page { max-width: 58rem; padding-block: clamp(5rem, 10vw, 9rem); }
.entry-page header { padding-block: 3rem 4rem; border-bottom: 1px solid var(--line); }
.back-link { color: var(--muted); text-underline-offset: .3em; }
.entry-lead { max-width: 46rem; margin: 0; color: var(--muted); font-size: 1.2rem; }
.prose { color: #c5d1da; font-size: 1.06rem; }
.prose > * { max-width: 46rem; }
.prose h2 { margin: 4rem 0 1rem; color: var(--ink); font-size: clamp(1.8rem, 4vw, 2.8rem); line-height: 1.1; letter-spacing: -.04em; }
.prose h3 { margin: 2.5rem 0 .75rem; color: var(--ink); font-size: 1.35rem; }
.prose p, .prose ul { margin-block: 1.2rem; }
.prose li { margin-block: .45rem; padding-left: .35rem; }
.prose li::marker { color: var(--accent); }
.prose a { color: var(--accent); text-underline-offset: .25em; }

.about-page { padding-block: clamp(5rem, 10vw, 9rem); }
.about-intro { max-width: 60rem; }
.about-body { margin: 3rem 0 5rem auto; }
.principles-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.principles-grid article { min-height: 18rem; padding: 1.6rem; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); }
.principles-grid article > span { color: var(--accent); font-size: .78rem; }
.principles-grid h2 { margin: 5rem 0 .75rem; font-size: 1.6rem; }
.principles-grid p { margin: 0; color: var(--muted); }

.teaser-section { padding-block: clamp(5rem, 9vw, 8rem); border-top: 1px solid var(--line); background: var(--night-deep); }
.section-title-row { display: flex; justify-content: space-between; align-items: end; gap: 2rem; margin-bottom: 2.5rem; }
.section-title-row h2 { margin: 0; font-size: clamp(2.25rem, 5vw, 4.2rem); letter-spacing: -.05em; }
.teaser-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.teaser-card { min-height: 18rem; display: flex; flex-direction: column; padding: 1.5rem; border: 1px solid var(--line); border-radius: var(--radius); color: inherit; background: var(--panel); text-decoration: none; }
.teaser-card h3 { margin: auto 0 .7rem; font-size: 1.45rem; }
.teaser-card p { margin: 0 0 1.3rem; color: var(--muted); }

.contact-page { display: grid; grid-template-columns: minmax(0, .85fr) minmax(25rem, 1.15fr); gap: clamp(3rem, 8vw, 7rem); align-items: start; padding-block: clamp(5rem, 10vw, 9rem); }
.contact-copy { position: sticky; top: 8rem; }
.contact-copy > p:not(.eyebrow) { max-width: 34rem; color: var(--muted); font-size: 1.1rem; }
.direct-contact { display: grid; gap: .2rem; margin-top: 2.5rem; }
.direct-contact span { color: var(--quiet); font-size: .8rem; text-transform: uppercase; letter-spacing: .08em; }
.direct-contact strong { font-size: 1.05rem; font-weight: 700; }
.direct-contact a { color: var(--accent); font-size: 1.15rem; text-underline-offset: .25em; }
.contact-form-wrap { padding: clamp(1.25rem, 4vw, 2.5rem); border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); box-shadow: 0 2rem 5rem rgba(0, 0, 0, .2); }
.contact-form { display: grid; gap: 1.35rem; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.dynamic-fields { display: grid; gap: 1.35rem; }
.dynamic-fields[hidden] { display: none; }
.form-field { display: grid; gap: .45rem; }
.form-field label { font-size: .9rem; font-weight: 700; }
.form-field label span { color: var(--quiet); font-weight: 400; }
.form-field input, .form-field textarea, .form-field select { width: 100%; min-height: 3rem; padding: .72rem .8rem; border: 1px solid #395064; border-radius: .6rem; color: var(--ink); background: #07111d; }
.form-field textarea { resize: vertical; }
.form-field input:focus, .form-field textarea:focus, .form-field select:focus { border-color: var(--accent); outline: 2px solid rgba(77, 227, 255, .25); outline-offset: 0; }
.form-privacy { margin: 0; color: var(--quiet); font-size: .84rem; }
.form-privacy a { color: var(--muted); }
.honeypot { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.notice { margin-bottom: 1.3rem; padding: 1rem 1.1rem; border-radius: .65rem; }
.notice-success { color: #c7f8d7; border: 1px solid #287846; background: #0e3420; }
.notice-error { color: #ffd2cc; border: 1px solid #a94537; background: #3b1815; }
.notice-warning { color: #ffe1a8; border: 1px solid #94651e; background: #35240c; }

.legal-page { max-width: 58rem; min-height: 60vh; padding-block: clamp(5rem, 10vw, 9rem); }
.legal-page header { margin-bottom: 3rem; }
.legal-page .notice { max-width: 46rem; }
.footer-contact { display: inline-block; margin-top: .6rem; color: var(--accent); text-underline-offset: .25em; }
.footer-location { display: grid; gap: .15rem; color: var(--muted); font-size: .92rem; font-style: normal; }

.site-footer { padding-top: 4rem; border-top: 1px solid var(--line); background: var(--night-deep); }
.footer-grid { display: grid; grid-template-columns: 1fr auto; gap: 4rem; padding-bottom: 3.5rem; }
.footer-grid p { max-width: 32rem; color: var(--quiet); }
.footer-brand { margin-bottom: 1.2rem; }
.footer-brand .brand-mark { width: 4.2rem; height: 3rem; }
.footer-brand .brand-name { font-size: 1.5rem; }
.footer-grid nav { display: grid; align-content: start; gap: .75rem; }
.footer-grid nav a { color: var(--muted); text-underline-offset: .3em; }
.footer-bottom { display: flex; justify-content: space-between; gap: 1rem; padding-block: 1.2rem; border-top: 1px solid var(--line); color: var(--quiet); font-size: .82rem; }

:focus-visible { outline: 3px solid var(--accent); outline-offset: 4px; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; } }

@media (max-width: 1040px) {
    .menu-toggle { display: block; }
    .main-nav { position: absolute; left: 1rem; right: 1rem; top: calc(100% + .5rem); display: none; padding: 1rem; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); box-shadow: 0 1rem 3rem rgba(0,0,0,.3); }
    .main-nav.is-open { display: grid; gap: .25rem; }
    .main-nav a { min-height: 3rem; display: flex; align-items: center; padding-inline: .75rem; }
    .main-nav .header-cta { justify-content: center; margin-top: .5rem; }
}

@media (max-width: 820px) {
    :root { --shell: min(100% - 2rem, 42rem); }
    .hero { min-height: auto; grid-template-columns: minmax(0, 1fr); gap: 3.5rem; padding-block: 5rem; }
    .hero h1 { font-size: clamp(3rem, 14vw, 5rem); }
    .process-card { align-self: auto; }
    .section-heading, .audience-layout { grid-template-columns: 1fr; gap: 2rem; }
    .service-grid { grid-template-columns: 1fr; }
    .service-card { min-height: 16rem; }
    .service-card h3 { margin-top: 3.5rem; }
    .contact-band-inner { align-items: flex-start; flex-direction: column; }
    .contact-page { grid-template-columns: 1fr; }
    .contact-copy { position: static; }
    .principles-grid, .teaser-grid { grid-template-columns: 1fr; }
    .principles-grid article { min-height: 14rem; }
    .principles-grid h2 { margin-top: 3rem; }
}

@media (max-width: 520px) {
    .brand { gap: .5rem; }
    .brand-mark { width: 2.8rem; height: 2rem; }
    .brand-name { font-size: clamp(.95rem, 4.25vw, 1.1rem); }
    .header-inner { min-height: 4.5rem; gap: .75rem; }
    .footer-brand .brand-mark { width: 3.5rem; height: 2.5rem; }
    .footer-brand .brand-name { font-size: 1.1rem; }
    .hero-actions { align-items: stretch; flex-direction: column; }
    .hero-actions .button, .hero-actions .text-link { text-align: center; }
    .process-card ol { grid-template-columns: minmax(0, 1fr); }
    .section-heading h2, .audience-section h2, .contact-band h2, .simple-page h1 { font-size: 2.35rem; }
    .footer-grid { grid-template-columns: 1fr; gap: 2rem; }
    .footer-bottom { flex-direction: column; }
    .form-grid { grid-template-columns: 1fr; }
    .listing-row { grid-template-columns: 2rem minmax(0, 1fr); gap: 1rem; }
    .listing-arrow { display: none; }
    .section-title-row { align-items: flex-start; flex-direction: column; }
}