/* Layer2 Studio — styles. All styling lives here: no inline style="" in the markup. */
/* ===== Fonts — Geist + Geist Mono, self-hosted (SIL OFL, see assets/fonts/OFL.txt). Latin subset; no third-party requests ===== */
@font-face{font-family:'Geist';src:url(/assets/fonts/geist-latin.woff2) format('woff2');font-weight:400 700;font-style:normal;font-display:swap;unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2190-2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Geist Mono';src:url(/assets/fonts/geist-mono-600-latin.woff2) format('woff2');font-weight:600;font-style:normal;font-display:swap;unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2190-2193, U+2212, U+2215, U+FEFF, U+FFFD}
/* ===== Tokens — mirrors Figma "Colour", "Spacers", text styles and "Globals" (Desktop / Tablet / Mobile) ===== */
:root{
  --mb:#00050d;--mb80:#33373d;--mb60:#66696e;--mb40:#999b9e;--mb20:#cccdcf;--mb10:#e6e6e7;--mb05:#f2f2f3;--mb02:#fafafa;
  --blue:#207eff;--blue80:#4d98ff;--white:#ffffff;--error:#e12f76;--success:#19be71;
  /* Effects */
  --nav-bg:rgba(255,255,255,.92);--nav-blur:12px;--stripe:rgba(255,255,255,.035);--shadow-card:4px 4px 8px rgba(0,5,13,.08);
  --border-heavy:8px;
  /* Fonts */
  --font-sans:'Geist',system-ui,sans-serif;--font-mono:'Geist Mono',ui-monospace,monospace;
  /* Spacers (fixed — Figma "Spacers/Space-n"; 40 is ours, not in Figma) */
  --space-2:2px;--space-4:4px;--space-8:8px;--space-12:12px;--space-16:16px;--space-24:24px;--space-32:32px;--space-40:40px;
  --space-48:48px;--space-60:60px;--space-80:80px;--space-120:120px;--space-160:160px;--space-240:240px;
  --container:1440px;--card-restricted:860px;--hero-max:1080px;--intro-max:520px;
  --nav-height:120px;--nav-link-height:40px;--border-radius:0px;--touch:44px;
  /* Globals · Desktop */
  --section-horizontal:32px;--section-vertical:200px;--section-vertical-sm:80px;--section-vertical-lg:240px;
  --padding-xxl:80px;--padding-xl:60px;--padding-lg:48px;--padding-md:40px;--padding-sm:32px;--padding-xs:24px;--padding-xxs:16px;
  /* Type (Figma text styles; headings scaled per breakpoint, body sizes fixed) */
  --fs-jumbo:128px;--fs-h1:82px;--fs-h2:64px;--fs-h3:54px;--fs-shout:48px;--fs-h4:32px;--fs-lead:32px;--fs-lead-sm:24px;--fs-eyebrow:18px;
  --fs-body-lg:18px;--fs-body:16px;--fs-caption:14px;
  /* Layout */
  --cols-metrics:4;--cols-sectors:4;--cols-articles:3;--svc-indent:160px;--logo-h:60px;--gap-section:120px;
}
@media (max-width:1199px){:root{
  /* Globals · Tablet */
  --section-horizontal:24px;--section-vertical:100px;--section-vertical-sm:40px;--section-vertical-lg:120px;
  --padding-xxl:60px;--padding-xl:40px;--padding-lg:32px;--padding-md:24px;--padding-sm:20px;--padding-xs:16px;--padding-xxs:8px;
  --fs-jumbo:96px;--fs-h1:60px;--fs-h2:48px;--fs-h3:36px;--fs-shout:36px;--fs-h4:28px;--fs-lead:24px;--fs-lead-sm:20px;--fs-eyebrow:16px;
  --cols-metrics:2;--cols-sectors:2;--cols-articles:2;--svc-indent:120px;--logo-h:52px;--gap-section:80px;
}}
@media (max-width:767px){:root{
  /* Globals · Mobile */
  --section-horizontal:16px;--section-vertical:60px;--section-vertical-sm:24px;--section-vertical-lg:72px;
  --padding-xxl:40px;--padding-xl:32px;--padding-lg:24px;--padding-md:16px;--padding-sm:12px;--padding-xs:8px;--padding-xxs:2px;
  --fs-jumbo:72px;--fs-h1:40px;--fs-h2:36px;--fs-h3:26px;--fs-shout:28px;--fs-h4:24px;--fs-lead:20px;--fs-lead-sm:18px;--fs-eyebrow:14px;
  --cols-metrics:1;--cols-sectors:1;--cols-articles:1;--svc-indent:0px;--logo-h:44px;--gap-section:56px;
}}

/* ===== Base ===== */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
section[id],footer[id]{scroll-margin-top:var(--nav-height)}
body{margin:0;font-family:var(--font-sans);color:var(--mb);background:var(--white);-webkit-font-smoothing:antialiased}
.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}
h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin:0}
a{color:inherit}
a:hover{opacity:.8}
[hidden]{display:none !important}

/* ===== Type (Figma text styles) ===== */
.h1{font-size:var(--fs-h1);line-height:1.1;letter-spacing:-.03em;font-weight:700}
.h2{font-size:var(--fs-h2);line-height:1.15;letter-spacing:-.025em;font-weight:700}
.h3{font-size:var(--fs-h3);line-height:1.15;letter-spacing:-.0225em;font-weight:700}
.h4{font-size:var(--fs-h4);line-height:1.25;letter-spacing:-.02em;font-weight:600}
.jumbo{font-size:var(--fs-jumbo);line-height:1;letter-spacing:-.04em;font-weight:700}
.shout{font-size:var(--fs-shout);line-height:1.08;letter-spacing:-.04em;font-weight:700}
.lead{font-size:var(--fs-lead);line-height:1.5;letter-spacing:-.03em;font-weight:500}
.lead-sm{font-size:var(--fs-lead-sm);line-height:1.5;letter-spacing:-.02em;font-weight:500}
.body-lg{font-size:var(--fs-body-lg);line-height:1.5;letter-spacing:-.015em}
.body-lg-semi{font-size:var(--fs-body-lg);line-height:1.5;letter-spacing:-.02em;font-weight:500}
.body-md{font-size:var(--fs-body);line-height:1.5;letter-spacing:-.01em;font-weight:500}
.body-sm{font-size:var(--fs-body);line-height:1.5}
.caption{font-size:var(--fs-caption);line-height:1.5}
.balance{text-wrap:balance}
.text-white{color:var(--white)}
.text-mb80{color:var(--mb80)}
.text-mb60{color:var(--mb60)}
.text-mb40{color:var(--mb40)}
.text-mb20{color:var(--mb20)}
.eyebrow{display:flex;flex-wrap:wrap;align-items:center;column-gap:var(--padding-xs);row-gap:var(--space-4);min-height:32px;font-family:var(--font-mono);font-weight:600;font-size:var(--fs-eyebrow);line-height:27px;letter-spacing:-.015em;text-transform:uppercase;color:var(--mb40)}
.eyebrow i{display:block;width:1px;height:32px;background:var(--mb20)}
@media (max-width:767px){.eyebrow--stack{flex-direction:column;align-items:flex-start;row-gap:0}.eyebrow--stack i{display:none}}

/* ===== Layout ===== */
.container{max-width:var(--container);margin:0 auto}
.section{padding:var(--section-vertical) var(--section-horizontal)}
.section--lg{padding-block:var(--section-vertical-lg)}
.section--tint{background:var(--mb02)}
.section--ruled{background:var(--white);border-top:1px solid var(--mb10);border-bottom:1px solid var(--mb10)}
.section-stack{display:flex;flex-direction:column;gap:var(--space-80)}
.section-stack--wide{gap:var(--gap-section)}
.section-head{display:flex;flex-direction:column;gap:var(--space-24)}

/* ===== Buttons & links ===== */
.btn{display:inline-flex;align-items:center;gap:var(--space-12);padding:var(--space-16) var(--space-32);border:2px solid;border-radius:var(--border-radius);font:inherit;font-size:var(--fs-body-lg);line-height:1.5;letter-spacing:-.02em;font-weight:500;text-decoration:none;cursor:pointer}
.btn--sm{gap:var(--space-8);min-height:48px;padding:var(--space-12) var(--space-24);font-size:var(--fs-body);letter-spacing:-.01em}
.btn--dark{background:var(--mb);border-color:var(--mb);color:var(--white)}
.btn--light{background:var(--white);border-color:var(--white);color:var(--mb)}
.btn:disabled{opacity:.6}
.link-arrow{display:inline-flex;align-items:center;gap:var(--space-8);min-height:var(--touch);color:var(--blue);font-size:var(--fs-body);font-weight:500;text-decoration:underline;text-underline-offset:6px}
.text-btn{display:inline-flex;align-items:center;min-height:var(--touch);padding:0;background:none;border:0;color:var(--white);font:inherit;font-size:var(--fs-body);font-weight:500;text-decoration:underline;text-underline-offset:6px;cursor:pointer}
.skip-link{position:absolute;left:var(--space-16);top:-100px;z-index:20;padding:var(--space-12) var(--space-16);background:var(--mb);color:var(--white);text-decoration:none}
.skip-link:focus{top:var(--space-16)}

/* ===== Header / nav ===== */
.header{position:sticky;top:0;z-index:10;background:var(--nav-bg);-webkit-backdrop-filter:blur(var(--nav-blur));backdrop-filter:blur(var(--nav-blur));border-bottom:1px solid var(--mb10)}
.header-bar{height:var(--nav-height);padding:0 var(--section-horizontal);display:flex;align-items:center;justify-content:space-between;gap:var(--space-24)}
.header-logo{position:relative;z-index:2;display:flex;align-items:center}
.header-logo img{display:block;height:var(--logo-h);width:auto}
.header-actions{display:flex;align-items:center;gap:var(--space-60)}
.nav-links{display:flex;align-items:center;gap:var(--space-32)}
.nav-link{position:relative;display:flex;align-items:center;height:var(--nav-link-height);font-size:var(--fs-body);font-weight:500;letter-spacing:-.01em;text-decoration:none}
.nav-link::after{content:"";position:absolute;left:0;right:0;bottom:6px;height:2px;background:var(--blue);transform:scaleX(0);transition:transform .2s ease}
.nav-link:hover{opacity:1}
.nav-link:hover::after,.nav-link[aria-current]::after{transform:scaleX(1)}
.nav-menu{display:none;position:relative}
.nav-menu>summary{list-style:none;cursor:pointer}
.nav-menu>summary::-webkit-details-marker{display:none}
/* Mobile / tablet menu: full-screen overlay (100vw × 100vh) */
.nav-toggle{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;width:48px;height:48px;border:2px solid var(--mb);background:var(--white);color:var(--mb)}
.nav-menu .ic-x,.nav-menu[open] .ic-menu{display:none}
.nav-menu[open] .ic-x{display:block}
.nav-overlay{position:fixed;inset:0;z-index:1;width:100vw;height:100vh;height:100dvh;overflow-y:auto;display:flex;flex-direction:column;justify-content:space-between;gap:var(--padding-xl);padding:calc(var(--nav-height) + var(--padding-md)) var(--section-horizontal) max(var(--padding-xl),env(safe-area-inset-bottom));background:var(--white)}
.nav-overlay ul{list-style:none;margin:0;padding:0;border-top:1px solid var(--mb10)}
.nav-overlay li a{display:flex;align-items:baseline;gap:var(--padding-xs);min-height:72px;padding:var(--padding-xs) 0;border-bottom:1px solid var(--mb10);font-size:var(--fs-h3);line-height:1.15;letter-spacing:-.0225em;font-weight:700;color:var(--mb80);text-decoration:none}
.nav-overlay li a span{min-width:2.5ch;font-family:var(--font-mono);font-weight:600;font-size:var(--fs-eyebrow);letter-spacing:-.015em;color:var(--mb60)}
.nav-overlay-foot{display:flex;flex-direction:column;align-items:flex-start;gap:var(--padding-xs)}
.nav-overlay-cta{display:flex;align-items:center;justify-content:space-between;gap:var(--space-12);width:100%;min-height:56px;padding:var(--space-16) var(--space-24);background:var(--mb);color:var(--white);font-size:var(--fs-body-lg);font-weight:500;letter-spacing:-.02em;text-decoration:none}
.nav-overlay-mail{display:inline-flex;align-items:center;min-height:var(--touch);font-size:var(--fs-body);color:var(--mb60)}
/* backdrop-filter would trap the fixed overlay inside the header; drop it while open, and lock page scroll */
.header:has(.nav-menu[open]){-webkit-backdrop-filter:none;backdrop-filter:none;background:var(--white)}
html:has(.nav-menu[open]){overflow:hidden}
@media (max-width:1199px){.nav-links{display:none}.nav-menu{display:block}}
@media (max-width:767px){.nav-cta{display:none}}

/* ===== Hero ===== */
.hero{max-width:var(--hero-max);display:flex;flex-direction:column;gap:var(--space-48)}

/* ===== Metrics ===== */
.metrics{background:var(--white);border-top:1px solid var(--mb10);border-bottom:1px solid var(--mb10)}
.metrics-grid{display:grid;grid-template-columns:repeat(var(--cols-metrics),minmax(0,1fr));gap:1px;background:var(--mb20)}
.metric{display:flex;flex-direction:column;align-items:center;gap:var(--padding-sm);padding:var(--padding-xxl) var(--padding-md) var(--padding-xl);background:var(--white);text-align:center}
.metric-value{display:flex;align-items:flex-end;justify-content:center;gap:var(--space-16)}
.metric-value .shout{margin-bottom:var(--space-8)}

/* ===== 01 Problem ===== */
.problem{padding-block:var(--space-48)}
.problem-card{display:flex;flex-direction:column;gap:var(--space-48);padding:var(--padding-xxl);background:repeating-linear-gradient(135deg,var(--stripe) 0 2px,transparent 2px 7px),var(--mb80);border-bottom:var(--border-heavy) solid var(--mb)}

/* ===== 02 Approach ===== */
.approach{display:flex;flex-wrap:wrap;gap:var(--padding-xl)}
.approach-intro{flex:1 1 360px;max-width:var(--intro-max);display:flex;flex-direction:column;gap:var(--padding-xs)}
.approach-body{flex:999 1 520px;min-width:0;display:flex;justify-content:flex-end}
.approach-cards{width:100%;max-width:var(--card-restricted);display:flex;flex-direction:column;gap:var(--space-80)}
.card{display:flex;flex-direction:column;gap:var(--padding-xs);padding:var(--padding-xxl);background:var(--mb02);border-bottom:var(--border-heavy) solid var(--blue80);box-shadow:var(--shadow-card)}
.card-copy{display:flex;flex-direction:column;gap:var(--padding-xxs)}

/* ===== 03 Services accordion ===== */
.svc-list{border-top:1px solid var(--mb80)}
.svc{padding:var(--padding-md) 0;border-bottom:1px solid var(--mb20)}
.svc>summary{display:flex;align-items:center;justify-content:space-between;gap:var(--space-24);list-style:none;cursor:pointer}
.svc>summary::-webkit-details-marker{display:none}
/* "+" rotates into "×" when a service opens */
.svc-icon svg{display:block;transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.svc[open] .svc-icon svg{transform:rotate(45deg)}
.svc>summary:focus-visible,.nav-menu>summary:focus-visible{outline:2px solid var(--blue);outline-offset:4px}
.svc-title{display:flex;flex-wrap:wrap;align-items:center;row-gap:var(--space-8);min-width:0}
.svc-index{width:var(--svc-indent);min-width:120px}
.svc-icon{flex:0 0 48px;width:48px;height:48px;color:var(--mb)}
.svc-body{display:flex;flex-wrap:wrap;gap:var(--padding-xl);padding:var(--padding-md) 0 0 var(--svc-indent)}
.svc-intro{flex:1 1 300px;min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:var(--padding-xxs)}
.svc-included{flex:1 1 300px;min-width:0}
.svc-included ul{margin:0;padding:0;list-style:none}
.svc-included li{padding:var(--space-16) 0;border-bottom:1px solid var(--mb20)}
.svc-included li:last-child{border-bottom:0}

/* ===== 04 Sectors ===== */
.sectors{padding-bottom:var(--section-vertical-sm)}
.sector-grid{display:grid;grid-template-columns:repeat(var(--cols-sectors),minmax(0,1fr));gap:1px;background:var(--mb20);border:1px solid var(--mb20)}
.sector{display:flex;flex-direction:column;justify-content:space-between;gap:var(--space-40);min-height:320px;padding:var(--padding-md);background:var(--white)}
.sector-icon{color:var(--mb)}
.sector-icon .accent{fill:var(--blue);stroke:none}
.sector-icon .accent-line{stroke:var(--blue)}
.sector-text{display:flex;flex-direction:column;gap:var(--space-8)}

/* ===== Client logos ===== */
.logos{background:var(--mb02);padding:var(--padding-xl) max(var(--section-horizontal),min(var(--space-80),4vw))}
.logos-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--space-32) var(--padding-xl)}
.logos-row img{width:auto}

/* ===== 05 Testimonials ===== */
.testimonials{padding-top:var(--section-vertical-sm)}
.quotes{display:flex;flex-direction:column;gap:var(--padding-md)}
.quote{display:flex;flex-direction:column;gap:var(--padding-md);padding-bottom:var(--padding-lg);border-bottom:1px solid var(--mb20)}
.quote-cite{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--space-16);padding-top:var(--space-24)}
.quote-person{display:flex;align-items:center;gap:var(--space-16)}
.quote-name{display:flex;flex-direction:column;gap:var(--space-4)}
.quote-logo{width:auto}
.avatar{flex:0 0 56px;width:56px;height:56px;border-radius:50%;object-fit:cover}

/* ===== Footer / contact ===== */
.footer{background:var(--mb);color:var(--white);padding:var(--section-vertical) var(--section-horizontal) var(--space-80)}
.footer-main{display:flex;flex-wrap:wrap;gap:var(--gap-section)}
.footer-intro{flex:1 1 360px;max-width:var(--intro-max);display:flex;flex-direction:column;gap:var(--space-32)}
.footer-details{display:flex;flex-direction:column;gap:var(--space-16);padding-top:var(--space-24);border-top:1px solid var(--mb80)}
.footer-row{display:flex;flex-wrap:wrap;gap:var(--space-8) var(--space-32)}
.footer-row dt{width:120px;color:var(--mb40)}
.footer-row a{color:var(--white);text-underline-offset:4px}
.footer-social{display:flex;flex-wrap:wrap;gap:var(--space-8) var(--space-24)}
.icon-link{display:inline-flex;align-items:center;gap:var(--space-8);text-decoration:none}
.footer-form{flex:1 1 440px;max-width:800px;min-width:0}
.footer-bottom{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:var(--space-24);padding-top:var(--space-32)}
.footer-brand{display:flex;flex-direction:column;gap:var(--space-16)}
.footer-mark .mark-dark{fill:var(--mb)}
.footer-mark .mark-light{fill:var(--white)}
.footer-nav{display:flex;flex-wrap:wrap;gap:0 var(--space-24);font-size:var(--fs-body);line-height:1.5}
.footer-nav a{display:inline-flex;align-items:center;min-height:var(--touch);color:var(--mb20);text-decoration:none}

/* ===== Form ===== */
.contact-form{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:var(--space-24);align-content:start}
.contact-form .btn--light{border-color:var(--mb)}
.form-field{display:flex;flex-direction:column;gap:var(--space-8)}
.form-full{grid-column:1/-1}
.form-label{font-size:var(--fs-body);line-height:1.5;color:var(--mb20)}
.form-req{color:var(--mb40)}
.form-actions{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--space-16)}
.form-status{flex:1 1 260px;color:var(--mb40)}
.form-status[data-tone="error"]{color:var(--error)}
.field{min-height:56px;width:100%;padding:0 var(--space-16);background:var(--mb80);border:1px solid var(--mb60);border-radius:var(--border-radius);color:var(--white);font:inherit;font-size:var(--fs-body);line-height:1.5}
textarea.field{min-height:168px;padding-top:var(--space-16);resize:vertical}
.field::placeholder{color:var(--mb40)}
.field:focus{outline:2px solid var(--blue80);outline-offset:1px}
.field.is-invalid{border-color:var(--error)}
.err{font-size:var(--fs-caption);line-height:1.4;color:var(--error)}
.contact-done{display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-24);padding:var(--padding-xl);background:var(--mb80);border-bottom:var(--border-heavy) solid var(--success)}
.contact-done-icon{color:var(--success)}

/* ===== Legal pages (terms-of-service.html, privacy-policy.html) ===== */
.legal-hero{padding-block:var(--padding-xxl)}
.legal-head{max-width:var(--hero-max);display:flex;flex-direction:column;gap:var(--space-24)}
.legal-body{padding-top:var(--padding-xxl)}
.legal{display:flex;flex-wrap:wrap;align-items:flex-start;gap:var(--padding-xl) var(--space-80)}
.legal-toc{flex:1 1 240px;max-width:320px;position:sticky;top:calc(var(--nav-height) + var(--space-24));max-height:calc(100vh - var(--nav-height) - var(--space-48));overflow-y:auto;display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-16)}
.legal-toc ol{list-style:none;margin:0;padding:0;width:100%;border-top:1px solid var(--mb10)}
.legal-toc ol a{display:flex;align-items:baseline;gap:var(--space-12);min-height:var(--touch);padding:var(--space-8) 0;border-bottom:1px solid var(--mb10);font-size:var(--fs-body);line-height:1.5;font-weight:500;letter-spacing:-.01em;color:var(--mb80);text-decoration:none}
.legal-toc ol a span{min-width:2.5ch;font-family:var(--font-mono);font-weight:600;font-size:var(--fs-caption);color:var(--mb60)}
.legal-article{flex:999 1 560px;min-width:0;max-width:800px;display:flex;flex-direction:column;gap:var(--padding-lg)}
.legal-section{display:flex;flex-direction:column;gap:var(--space-16);padding-top:var(--padding-lg);border-top:1px solid var(--mb10)}
.legal-section:first-child{padding-top:0;border-top:0}
.legal-heading{display:flex;align-items:baseline;gap:var(--space-16);color:var(--mb)}
.legal-num{font-family:var(--font-mono);font-weight:600;font-size:var(--fs-eyebrow);letter-spacing:-.015em;color:var(--mb60)}
.prose p,.prose li,.prose address{font-size:var(--fs-body-lg);line-height:1.6;letter-spacing:-.015em;color:var(--mb80)}
.prose ul{margin:0;padding-left:1.25em;display:flex;flex-direction:column;gap:var(--space-8)}
.prose li::marker{color:var(--blue)}
.prose strong{font-weight:600;color:var(--mb)}
.prose a{color:var(--blue);text-underline-offset:4px}
.prose address{font-style:normal}
@media (max-width:1199px){.legal-toc{position:static;max-width:none;max-height:none;overflow:visible}}
.footer-nav a[aria-current="page"]{color:var(--white)}

/* ===== Articles (articles/index.html, articles/*.html) ===== */
.article-hero{padding-block:var(--padding-xxl)}
.article-head{max-width:var(--hero-max);display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-24)}
.link-back svg{transform:rotate(180deg)}
.article-hero-img{display:block;width:100%;max-width:var(--hero-max);height:auto;aspect-ratio:3/2;object-fit:cover;margin-top:var(--padding-xl);background:var(--mb05)}
.article-section{padding-top:var(--padding-xxl)}
.article-body{max-width:800px;display:flex;flex-direction:column;gap:var(--space-24)}
.article-body h2{margin-top:var(--space-24);font-size:var(--fs-h4);line-height:1.25;letter-spacing:-.02em;font-weight:600;color:var(--mb)}
.article-body h3{margin-top:var(--space-8);font-size:var(--fs-body-lg);line-height:1.5;letter-spacing:-.02em;font-weight:600;color:var(--mb)}
.prose ul.facts{list-style:none;padding:var(--padding-sm);background:var(--mb02);border-left:var(--border-heavy) solid var(--blue80)}
.article-more{padding-block:var(--padding-xxl)}
.article-grid{display:grid;grid-template-columns:repeat(var(--cols-articles),minmax(0,1fr));gap:var(--padding-xl) var(--padding-md)}
.article-card-link{display:flex;flex-direction:column;gap:var(--space-16);height:100%;color:var(--mb);text-decoration:none}
.article-card-link:hover{opacity:1}
.article-card-link:hover .article-card-title{text-decoration:underline;text-underline-offset:4px}
.article-card-img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;background:var(--mb05)}
.article-meta{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-4) var(--space-16);font-family:var(--font-mono);font-weight:600;font-size:var(--fs-caption);letter-spacing:-.015em;text-transform:uppercase;color:var(--mb60)}
.article-meta i{display:block;width:1px;height:16px;background:var(--mb20)}

/* ===== Thanks page ===== */
.page-dark{color:var(--white);background:var(--mb)}
.thanks{min-height:calc(100vh - var(--nav-height));display:flex;align-items:center;padding:var(--section-vertical) var(--section-horizontal)}
.thanks-inner{max-width:720px;margin:0 auto;display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-32)}

@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none !important}}