/* Art direction: independent Polish review journal → sober, tactile, nocturnal.
   Palette: paper/charcoal with cochineal accent. Heroes are gradient-only. Typography: Bricolage Grotesque + Inter.
   Density: balanced editorial, mobile first. */
:root{--bg:#191614;--paper:#211d1a;--surface:#2a2420;--surface-2:#332b26;--ink:#f1e9dd;--muted:#c1b6aa;--faint:#a89a8e;--line:color-mix(in oklab,var(--ink) 17%,transparent);--accent:#df7180;--accent-hi:#f08c99;--accent-soft:#4a2930;--inverse:#1a1514;--success:#78bca3;--warning:#e2ae65;--shadow:0 16px 44px oklch(0 0 0/.4);--font-display:'Bricolage Grotesque','Inter',system-ui,sans-serif;--font-body:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;--xs:clamp(.75rem,.7rem + .25vw,.875rem);--sm:clamp(.875rem,.82rem + .3vw,1rem);--base:clamp(1rem,.96rem + .22vw,1.125rem);--lg:clamp(1.125rem,1rem + .7vw,1.5rem);--xl:clamp(1.5rem,1.18rem + 1.3vw,2.3rem);--xxl:clamp(2.15rem,1.45rem + 3vw,4.5rem);--s1:.25rem;--s2:.5rem;--s3:.75rem;--s4:1rem;--s5:1.25rem;--s6:1.5rem;--s8:2rem;--s10:2.5rem;--s12:3rem;--s16:4rem;--s20:5rem;--r1:.375rem;--r2:.625rem;--r3:1rem;--content:1620px;--prose:70ch}
*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:5rem}body{min-height:100dvh;background:var(--bg);color:var(--ink);font-family:var(--font-body);font-size:var(--base);line-height:1.65}img,svg{display:block;max-width:100%;height:auto}a{color:inherit;text-decoration-thickness:.08em;text-underline-offset:.18em}button{font:inherit;color:inherit;cursor:pointer}p,li{max-width:72ch}.skip{position:absolute;left:-9999px;top:var(--s2);z-index:999;background:var(--ink);color:var(--bg);padding:var(--s3)}.skip:focus{left:var(--s2)}:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:var(--r1)}
.wrap{width:min(100% - 2rem,var(--content));margin-inline:auto}.narrow{width:min(100% - 2rem,var(--prose));margin-inline:auto}.site-head{position:sticky;top:0;z-index:50;background:color-mix(in oklab,var(--bg) 90%,transparent);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}.head-row{min-height:4.25rem;display:flex;align-items:center;justify-content:space-between;gap:var(--s4)}.logo{display:inline-flex;align-items:center;gap:var(--s3);font-weight:700;text-decoration:none}.logo svg{width:2rem}.logo small{display:block;color:var(--muted);font-size:var(--xs);font-weight:500;line-height:1}.nav{display:none}.nav a{font-size:var(--sm);font-weight:500;text-decoration:none}.nav a:hover{color:var(--accent)}.head-actions{display:flex;align-items:center;gap:var(--s2);flex-shrink:0}
.hero{padding:var(--s8) 0 var(--s12)}.hero-grid{display:grid;gap:var(--s8);align-items:center}.hero-grid>*{min-width:0}.hero h1,.hero .lede{max-width:none}.eyebrow{font-size:var(--xs);text-transform:uppercase;letter-spacing:.14em;color:var(--accent);font-weight:700;margin-bottom:var(--s4)}h1,h2{font-family:var(--font-display);font-weight:700;line-height:1.05;text-wrap:balance}h1{font-size:var(--xxl);max-width:15ch;letter-spacing:-.035em}h2{font-size:var(--xl);letter-spacing:-.02em}h3{font-size:var(--lg);line-height:1.2;font-weight:600}h4{font-size:var(--base)}.lede{font-size:var(--lg);color:var(--muted);margin-top:var(--s5);max-width:58ch}.meta{font-size:var(--xs);color:var(--muted);margin-top:var(--s4)}.actions{display:flex;flex-wrap:wrap;gap:var(--s3);margin-top:var(--s6)}.btn{min-height:2.8rem;display:inline-flex;align-items:center;justify-content:center;padding:.7rem 1rem;border-radius:var(--r1);font-size:var(--sm);font-weight:700;text-decoration:none;border:1px solid transparent}.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover{background:var(--accent-hi)}.btn-secondary{background:var(--paper);border-color:var(--line)}.btn-secondary:hover{border-color:var(--accent);color:var(--accent)}.hero-art{width:100%;min-width:0;position:relative;overflow:hidden;border-radius:var(--r3);background:var(--surface);box-shadow:var(--shadow);aspect-ratio:4/5}.hero-art img{width:100%;height:100%;object-fit:cover;object-position:center top}
.breadcrumb{padding-top:var(--s5);font-size:var(--xs);color:var(--muted)}.breadcrumb ol{display:flex;gap:var(--s2);list-style:none;flex-wrap:wrap}.breadcrumb li+li:before{content:'/';margin-right:var(--s2)}.section{padding:var(--s12) 0}.section.tight{padding:var(--s8) 0}.section-head{display:grid;gap:var(--s3);margin-bottom:var(--s8)}.section-head p{color:var(--muted)}.paper{background:var(--paper)}.ink{background:var(--ink);color:var(--bg)}.ink .muted{color:color-mix(in oklab,var(--bg) 76%,transparent)}.grid{display:grid;gap:var(--s4)}.cards{grid-template-columns:1fr}.card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r2);padding:var(--s5);display:flex;flex-direction:column;gap:var(--s3);min-height:100%}.card:hover{box-shadow:0 10px 24px oklch(.2 .02 45/.08)}.card .kicker{color:var(--accent);font-size:var(--xs);font-weight:700;text-transform:uppercase;letter-spacing:.1em}.card p{color:var(--muted);font-size:var(--sm)}.card .link{margin-top:auto;font-weight:700;color:var(--accent)}.featured{display:grid;gap:var(--s5)}.featured img,.wide-art{width:100%;border-radius:var(--r2);object-fit:cover;aspect-ratio:3/2}.wide-art{aspect-ratio:16/9}.stat-band{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r2);overflow:hidden}.stat{background:var(--paper);padding:var(--s5)}.stat strong{font-family:var(--font-display);font-size:var(--xl);display:block}.stat span{font-size:var(--xs);color:var(--muted)}
.article{display:grid;gap:var(--s8)}.toc{background:var(--paper);border:1px solid var(--line);border-radius:var(--r2);padding:var(--s5);align-self:start}.toc strong{display:block;margin-bottom:var(--s3)}.toc a{display:block;padding:.35rem 0;font-size:var(--sm);color:var(--muted)}.prose{max-width:var(--prose)}.prose>*+*{margin-top:var(--s5)}.prose h2{margin-top:var(--s10);scroll-margin-top:5rem}.prose h3{margin-top:var(--s8)}.prose ul,.prose ol{padding-left:1.3rem}.prose li+li{margin-top:var(--s2)}.prose blockquote{font-family:var(--font-display);font-size:var(--lg);border-block:1px solid var(--line);padding:var(--s6) 0;color:var(--accent)}.note{padding:var(--s5);background:var(--surface);border-radius:var(--r2);font-size:var(--sm)}.note strong{display:block;margin-bottom:var(--s2)}.disclosure{padding:var(--s4);border:1px dashed var(--accent);border-radius:var(--r2);font-size:var(--sm);background:var(--accent-soft)}.score{display:grid;gap:var(--s3)}.score-row{display:grid;grid-template-columns:8rem 1fr auto;gap:var(--s3);align-items:center;font-size:var(--sm)}.bar{height:.55rem;background:var(--surface-2);border-radius:999px;overflow:hidden}.bar span{display:block;height:100%;background:var(--accent)}.pending{color:var(--warning);font-weight:700}.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r2)}table{width:100%;border-collapse:collapse;min-width:650px;background:var(--paper)}th,td{text-align:left;padding:var(--s4);border-bottom:1px solid var(--line);vertical-align:top}th{font-size:var(--xs);text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}td{font-size:var(--sm)}.faq details{border-top:1px solid var(--line);padding:var(--s4) 0}.faq summary{font-weight:700;cursor:pointer;min-height:2.75rem;display:flex;align-items:center}.faq details p{color:var(--muted);padding-bottom:var(--s3)}
.related{border-top:1px solid var(--line)}.site-foot{padding:var(--s10) 0 var(--s20);border-top:1px solid var(--line)}.foot-grid{display:grid;gap:var(--s8)}.foot-links{display:grid;grid-template-columns:1fr 1fr;gap:var(--s2) var(--s6)}.foot-links a{font-size:var(--sm)}.fine{font-size:var(--xs);color:var(--muted);margin-top:var(--s6)}
.age{position:fixed;inset:0;z-index:1000;background:color-mix(in oklab,#111 92%,transparent);color:#fff;display:grid;place-items:center;padding:var(--s4)}.age[hidden]{display:none}.age-card{width:min(100%,32rem);background:#211d1a;border:1px solid #514943;border-radius:var(--r3);padding:var(--s8);box-shadow:0 24px 70px #000}.age-mark{width:3.25rem;height:3.25rem;border:2px solid #df7180;color:#df7180;border-radius:50%;display:grid;place-items:center;font-weight:700;margin-bottom:var(--s5)}.age-card h2{font-size:var(--xl)}.age-card p{color:#c9beb3;margin-top:var(--s3)}.age-actions{display:grid;gap:var(--s3);margin-top:var(--s6)}.age .btn-primary{border:0}.age .btn-secondary{background:transparent;color:#fff;border-color:#655b54}.age-note{font-size:.75rem!important}.badge{display:inline-flex;align-items:center;min-height:1.8rem;padding:.2rem .55rem;border-radius:999px;background:var(--surface);color:var(--muted);font-size:var(--xs);font-weight:700}.author{display:flex;align-items:center;gap:var(--s3);margin-top:var(--s5)}.avatar{width:2.5rem;height:2.5rem;background:var(--ink);color:var(--bg);border-radius:50%;display:grid;place-items:center;font-weight:700}.author span{display:block;font-size:var(--xs);color:var(--muted)}
@media(min-width:720px){.wrap{width:min(100% - 3rem,var(--content))}.hero{padding:var(--s12) 0 var(--s16)}.hero-grid{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}.cards{grid-template-columns:repeat(2,1fr)}.featured{grid-template-columns:1fr 1fr;align-items:center}.stat-band{grid-template-columns:repeat(4,1fr)}.foot-grid{grid-template-columns:1fr 1fr}.age-actions{grid-template-columns:1fr 1fr}}
@media(min-width:980px){.nav{display:flex;align-items:center;gap:var(--s6)}.cards.three{grid-template-columns:1.25fr .85fr .85fr}.cards.four{grid-template-columns:repeat(4,1fr)}.article{grid-template-columns:15rem minmax(0,var(--prose));align-items:start}.toc{position:sticky;top:6rem}.hero-art{max-height:40rem}.featured img{aspect-ratio:4/3}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important}}

/* The affiliate action stays visible at every screen width. */
@media(max-width:979px){.hero-grid{grid-template-columns:minmax(0,1fr)}.hero .hero-art{display:none}}
.site-head .logo{flex-shrink:0}
.site-head .logo small{white-space:nowrap}
.header-cta{gap:.4rem;white-space:nowrap}
@media(max-width:479px){.head-row{gap:var(--s2)}.site-head .logo{gap:.5rem;font-size:1rem}.site-head .logo svg{width:1.5rem;flex:none}.site-head .logo small{font-size:.65rem}.header-cta{padding:.65rem .7rem;font-size:.8125rem}}

/* Long-form editorial pages: paragraph rhythm, readable links and bounded TOC. */
.article>*{min-width:0}
.prose section{scroll-margin-top:6rem}
.prose section>h2:first-child{margin-top:0}
.prose section+section{margin-top:var(--s12)}
.prose section>*+*{margin-top:var(--s5)}
.prose a{color:var(--accent);overflow-wrap:anywhere}
.prose .table-wrap{max-width:100%}

@media(min-width:980px){.toc{max-height:calc(100dvh - 8rem);overflow-y:auto;overscroll-behavior:contain}}

/* Shared subdued hero backdrops. */
.hero-with-background{position:relative;isolation:isolate;overflow:hidden;padding-top:0;background:var(--bg)}
.hero-with-background:before{content:'';position:absolute;inset:0;z-index:0;background:var(--hero-background,var(--hero-default)) var(--hero-focus,center 40%)/cover no-repeat;opacity:.4;pointer-events:none}
.hero-with-background:after{content:'';position:absolute;inset:0;z-index:0;background:linear-gradient(90deg,color-mix(in oklab,var(--bg) 65%,transparent),transparent 70%),linear-gradient(180deg,color-mix(in oklab,var(--bg) 65%,transparent),transparent 25%,transparent 70%,var(--bg));pointer-events:none}
.hero-with-background>.wrap{position:relative;z-index:1}
.hero-with-background>.hero-grid{padding-top:var(--s8)}
@media(min-width:720px){.hero-with-background>.hero-grid{padding-top:var(--s12)}}
@media(max-width:719px){.hero-with-background:before{background-position:var(--hero-mobile-focus,35% center)}}

/* Page heroes share the centered composition of the homepage. */
.hero-centered{min-height:80vh;min-height:80dvh;display:grid;align-items:center;padding-block:var(--s8);text-align:center}
.hero-centered>.hero-grid{grid-template-columns:minmax(0,1fr);padding-top:0}
.hero-centered>.hero-grid>div{width:100%;max-width:70rem;margin-inline:auto}
.hero-centered h1{max-width:26ch;margin-inline:auto}
.hero-centered p{margin-inline:auto}
.hero-centered .lede{max-width:64ch}
.hero-centered .actions,.hero-centered .author{justify-content:center}
.home .hero-centered:before{background-position:var(--hero-focus,center top)}
@media(max-width:767px){.home .hero-centered:before{background-position:var(--hero-mobile-focus,25% top)}}

/* Editorial modules: paper, numbered sections and distinct reading panels. */
.article{gap:clamp(1.5rem,3vw,3rem)}
.prose{max-width:none;min-width:0}
.prose .editorial-block{margin:0;padding:clamp(1.25rem,2.5vw,2.75rem);border:1px solid var(--line);border-radius:var(--r3);background:var(--bg)}
.prose .editorial-block+.editorial-block{margin-top:var(--s6)}
.prose .editorial-block>h2{display:flex;align-items:baseline;gap:var(--s4);font-size:clamp(1.5rem,1.15rem + 1vw,2.25rem);line-height:1.2;margin:0 0 var(--s6)}
.editorial-block>h2:before{content:attr(data-step);flex:none;font-family:var(--font-body);font-size:.75rem;font-weight:700;letter-spacing:.08em;color:var(--accent);border-bottom:2px solid var(--accent);padding-bottom:.35rem;align-self:flex-start;margin-top:.35rem}
.prose .reading-grid{display:grid;gap:var(--s5);margin-top:0}
.prose .reading-panel{min-width:0;padding:var(--s5);border:1px solid var(--line);border-radius:var(--r2);background:var(--paper)}
.prose .reading-panel>h3{margin:0 0 var(--s4);font-size:clamp(1.05rem,1rem + .3vw,1.25rem);line-height:1.3}
.prose .reading-panel p,.prose .editorial-body p,.prose .intro-columns p,.prose .block-note p{font-size:var(--base);line-height:1.75}
.prose .reading-panel p+p,.prose .editorial-body p+p,.prose .intro-columns p+p,.prose .block-note p+p{margin-top:var(--s4)}
.prose .editorial-intro{background:var(--surface);border-color:transparent}
.prose .intro-columns{margin-top:0}
.prose .intro-columns>p:first-child{font-weight:500}
.prose .editorial-feature{background:transparent}
.prose .editorial-feature .reading-panel{background:transparent;border:0;padding:0}
.prose .editorial-feature .reading-panel+.reading-panel{border-left:3px solid var(--accent);padding-left:var(--s5)}
.prose .editorial-band{background:var(--surface);border-color:transparent}
.prose .editorial-band .reading-panel{background:transparent;border:0;padding:0}
.prose .editorial-example{border-color:var(--accent);background:color-mix(in oklab,var(--accent-soft) 35%,var(--paper))}
.prose .editorial-example .reading-panel{background:var(--paper)}
.prose .editorial-next{background:var(--surface)}
.prose .editorial-next .reading-panel{border-color:transparent}
.prose .editorial-table{background:transparent}
.prose .editorial-body>.table-wrap{margin:var(--s5) 0}
.prose .editorial-table th{background:var(--surface);color:var(--ink)}
.prose .editorial-table tr:last-child td{border-bottom:0}
.prose .checklist-layout{display:grid;gap:var(--s5);margin-top:0;align-items:start}
.prose .checklist-card{background:var(--surface);border-radius:var(--r2);padding:var(--s5)}
.prose .checklist-card ul,.prose .checklist-card ol{list-style:none;padding:0;display:grid;gap:var(--s4);counter-reset:check}
.prose .checklist-card li{position:relative;padding-left:2rem;font-size:var(--sm);margin:0;counter-increment:check}
.prose .checklist-card li:before{content:'✓';position:absolute;left:0;color:var(--accent);font-weight:700}
.prose .checklist-card ol li:before{content:counter(check,decimal-leading-zero)}
.prose .block-note{border-top:1px solid var(--line);padding-top:var(--s5);margin-top:var(--s5)}
.prose .block-note p{color:var(--muted);font-size:var(--sm)}
.toc{padding:0;overflow:hidden}
.toc-disclosure>summary{cursor:pointer;font-weight:700;padding:var(--s5);list-style:none;display:flex;align-items:center;justify-content:space-between;gap:var(--s3)}
.toc-disclosure>summary::-webkit-details-marker{display:none}
.toc-disclosure>summary:after{content:'+';font-size:1.3rem;font-weight:400;color:var(--accent)}
.toc-disclosure[open]>summary:after{content:'−'}
.toc-links{border-top:1px solid var(--line);padding:var(--s3) var(--s5) var(--s5)}
.toc-links a{padding:.5rem 0;text-decoration:none;line-height:1.4;border-bottom:1px solid var(--line)}
.toc-links a:last-child{border:0}
.toc-links a:hover{color:var(--accent)}

/* Coral text links share the accent of the editorial eyebrow. */
main p a,main li a,.prose a,.faq a,.app-source{color:var(--accent);text-decoration:underline;text-underline-offset:.2em;text-decoration-thickness:.07em;overflow-wrap:anywhere}
main p a:hover,main li a:hover,.prose a:hover,.faq a:hover,.app-source:hover{color:var(--accent-hi);text-decoration-thickness:.13em}
/* FAQ shares the 1620px site container; answer lines stay easy to read. */
.faq{--faq-padding:clamp(1.25rem,2vw,1.875rem);--faq-number:2.5rem;--faq-gap:var(--s5);padding-block:clamp(3.5rem,5vw,5.5rem);border-top:1px solid var(--line);background:linear-gradient(180deg,color-mix(in oklab,var(--accent-soft) 12%,var(--bg)),var(--bg) 55%)}
.faq .faq-heading{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--s3) var(--s6);align-items:center;margin-bottom:var(--s8)}
.faq-heading .eyebrow{grid-column:1;margin:0}
.faq-heading h2{grid-column:1;max-width:28ch;font-size:clamp(1.8rem,1.3rem + 1.7vw,3rem);line-height:1.15}
.faq-heading:after{content:'?';grid-column:2;grid-row:1 / span 2;display:grid;place-items:center;width:5.5rem;aspect-ratio:1;border:1px solid var(--line);border-radius:50%;background:var(--paper);font-family:var(--font-display);font-size:3.2rem;line-height:1;color:var(--accent)}
.faq-list{display:grid;gap:var(--s4);counter-reset:faq-question}
.faq details{counter-increment:faq-question;margin:0;padding:0;min-width:0;overflow:hidden;border:1px solid var(--line);border-radius:var(--r3);background:var(--paper);transition:border-color .2s ease,background .2s ease}
.faq details:hover{border-color:color-mix(in oklab,var(--accent) 55%,var(--line))}
.faq details[open]{border-color:color-mix(in oklab,var(--accent) 65%,var(--line));background:linear-gradient(110deg,var(--paper),color-mix(in oklab,var(--accent-soft) 18%,var(--paper)))}
.faq summary{display:grid;grid-template-columns:var(--faq-number) minmax(0,1fr) 2.75rem;align-items:center;gap:var(--faq-gap);padding:var(--faq-padding);min-height:5.75rem;font-size:clamp(1rem,.9rem + .35vw,1.25rem);font-weight:700;line-height:1.45;list-style:none;cursor:pointer}
.faq summary::-webkit-details-marker{display:none}
.faq summary:before{content:counter(faq-question,decimal-leading-zero);display:grid;place-items:center;width:var(--faq-number);height:var(--faq-number);align-self:start;border-radius:.7rem;background:var(--surface);font-size:.75rem;font-weight:700;letter-spacing:.04em;color:var(--accent)}
.faq summary:after{content:'+';display:grid;place-items:center;width:2.75rem;height:2.75rem;border:1px solid var(--line);border-radius:50%;background:var(--bg);font-size:1.6rem;font-weight:400;line-height:1;color:var(--accent);transition:background .2s ease,border-color .2s ease}
.faq summary:hover:after,.faq details[open] summary:after{background:var(--accent-soft);border-color:transparent}
.faq details[open] summary:before{background:var(--accent-soft)}
.faq details[open] summary:after{content:'−'}
.faq summary:focus-visible{outline-offset:-4px;border-radius:var(--r3)}
.faq details p,.faq details[open] p{margin:0 var(--faq-padding) var(--faq-padding) calc(var(--faq-padding) + var(--faq-number) + var(--faq-gap));padding:var(--s5) 0 0;max-width:90ch;border-top:1px solid var(--line);font-size:var(--base);line-height:1.75;color:var(--muted)}
@media(max-width:719px){.faq{--faq-padding:var(--s4);--faq-number:2rem;--faq-gap:var(--s3)}.faq .faq-heading{gap:var(--s3);margin-bottom:var(--s6)}.faq-heading:after{width:3.25rem;font-size:2rem}.faq-heading h2{font-size:clamp(1.5rem,1rem + 2.5vw,2rem)}.faq summary{grid-template-columns:var(--faq-number) minmax(0,1fr) 2rem;min-height:4.75rem}.faq summary:after{width:2rem;height:2rem;font-size:1.3rem}.faq summary:before{font-size:.65rem;border-radius:.5rem}.faq details p,.faq details[open] p{margin-left:var(--faq-padding);padding-top:var(--s4)}}

/* Application directory directly beneath the home hero. */
.app-showcase{border-block:1px solid var(--line);background:var(--surface)}
.app-section-head{gap:var(--s5)}
.app-section-head .eyebrow{margin-bottom:var(--s3)}
.section-head .eyebrow{color:var(--accent)}
.app-section-head h2{max-width:25ch;line-height:1.15}
.app-section-head>p{max-width:45ch;font-size:var(--sm);align-self:end}
.app-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s5);list-style:none}
.app-card{position:relative;isolation:isolate;min-width:0;max-width:none;min-height:clamp(32rem,42vw,38rem);overflow:hidden;border:1px solid var(--line);border-radius:var(--r3);background:#211d1a;color:#fffaf4;display:flex;flex-direction:column}
.app-image-link{position:absolute;inset:0;z-index:0;display:block;overflow:hidden;background:#211d1a}
.app-image-link img{width:100%;height:100%;object-fit:cover;object-position:center 15%;transform:scale(1.16);transform-origin:50% 0%;transition:transform .3s ease}
.app-image-link:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(14,12,16,.02) 0%,rgba(14,12,16,.12) 28%,rgba(20,16,20,.7) 49%,rgba(24,19,22,.96) 74%,#181316 100%);pointer-events:none}
.app-card:hover .app-image-link img{transform:scale(1.2)}
.app-image-link:focus-visible{outline-offset:-5px;outline-color:#f08c99}
.app-card-body{position:relative;z-index:1;min-height:20rem;margin-top:auto;padding:var(--s6);display:flex;flex-direction:column;gap:var(--s3)}
.app-card .kicker{font-size:var(--xs);font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:#f08c99}
.app-card h3{font-size:1.5rem}
.app-card p{font-size:var(--sm);color:#e5dbd3;line-height:1.6}
.app-card-actions{margin-top:auto;padding-top:var(--s4);display:grid;gap:var(--s3)}
.app-card-actions .btn{justify-content:center}
.app-card-actions .btn-primary{min-height:3.25rem;background:#df7180;color:#1a1514}
.app-card-actions .btn-primary:hover{background:#f08c99}
.app-card .app-source{color:#f08c99}
.app-card .app-source:hover{color:#ffc0c9}
.app-source{font-size:var(--xs);width:fit-content}
.app-context{margin-top:var(--s6);font-size:var(--sm);color:var(--muted);max-width:none}
@media(max-width:719px){.app-grid{gap:var(--s4)}.app-card{min-height:22rem}.app-card-body{min-height:0;padding:var(--s4);gap:var(--s2)}.app-card .kicker{font-size:.6875rem;letter-spacing:.08em}.app-card h3{font-size:1.25rem}.app-card p{font-size:.875rem;line-height:1.5}.app-card-actions{padding-top:var(--s2);gap:var(--s2)}.app-card-actions .btn-primary{min-height:2.75rem;padding:.6rem .8rem;font-size:.875rem}}

/* Compact affiliate choices alongside the interior reading guides. */
.interior-apps{padding-block:clamp(2rem,4vw,3.5rem);border-block:1px solid var(--line);background:var(--surface)}
.interior-apps .app-section-head{align-items:end;margin-bottom:var(--s6)}
.interior-apps .app-section-head h2{max-width:29ch;font-size:clamp(1.6rem,1.2rem + 1.6vw,2.65rem)}
.interior-apps .app-card{min-height:20rem}
.interior-apps .app-card-body{min-height:0;padding:var(--s5);gap:var(--s2)}
.interior-apps .app-card .kicker{font-size:.6875rem}
.interior-apps .app-card h3{font-size:1.35rem}
.interior-apps .app-card-actions{padding-top:var(--s2)}
.interior-apps .app-card-actions .btn-primary{min-height:2.75rem;font-size:var(--sm)}
.interior-apps .app-context{display:flex;flex-wrap:wrap;gap:.5rem 1.25rem;margin-top:var(--s5);font-size:var(--xs)}
@media(max-width:719px){.interior-apps .app-grid{gap:var(--s3)}.interior-apps .app-card{min-height:10rem}.interior-apps .app-image-link{right:auto;width:32%}.interior-apps .app-image-link img,.interior-apps .app-card:hover .app-image-link img{transform:none;object-position:center top}.interior-apps .app-image-link:after{background:linear-gradient(90deg,transparent 55%,#211d1a 100%)}.interior-apps .app-card-body{margin:0 0 0 32%;padding:var(--s4);flex:1}.interior-apps .app-card h3{font-size:1.2rem}}

/* Complete site directory, grouped by subject. */
.foot-brand{min-width:0;grid-column:1/-1}
.foot-brand .logo{display:inline-flex;max-width:100%;font-size:var(--base);line-height:1.65}
.foot-brand .logo svg{flex-shrink:0}
.foot-brand .logo span{min-width:0}
.foot-brand .logo small{line-height:1.3}
.foot-brand .logo:hover{color:var(--ink);text-decoration:none}
.foot-about{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--s4) var(--s8);margin-top:var(--s6);padding-top:var(--s6);border-top:1px solid var(--line)}
.foot-about>p{font-size:var(--sm);color:var(--muted);max-width:48ch}
.foot-about .badge{display:block;min-height:0;padding:0;border-radius:0;background:none;font-weight:400;white-space:normal;line-height:1.6}
.foot-directory{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:var(--s8) var(--s5);padding:var(--s8) 0}
.foot-column{min-width:0}
.foot-column h2,.foot-column h3,.foot-title{font-family:var(--font-body);font-size:var(--xs);font-weight:700;line-height:1.2;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);margin-bottom:var(--s4)}
.foot-column ul{list-style:none;display:grid;gap:var(--s3)}
.foot-column a{font-size:var(--sm);line-height:1.4;text-decoration:none;display:inline-block}
.foot-column a:hover{color:var(--accent);text-decoration:underline}
.foot-bottom{border-top:1px solid var(--line);padding-top:var(--s5);display:grid;gap:var(--s3);color:var(--muted);font-size:var(--xs)}
.foot-bottom p{max-width:90ch}
@media(min-width:720px){.app-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.app-section-head{grid-template-columns:1.3fr 1fr}.foot-directory{grid-template-columns:repeat(2,minmax(0,1fr))}.prose .reading-grid,.prose .checklist-layout{grid-template-columns:repeat(2,minmax(0,1fr))}.intro-columns{columns:2;column-gap:var(--s8)}.intro-columns p{break-inside:avoid}.prose .intro-columns p+p{margin-top:0;margin-bottom:var(--s4)}}
@media(min-width:980px){.article{grid-template-columns:15rem minmax(0,1fr)}.toc{max-height:calc(100dvh - 8rem);overflow-y:auto}.foot-directory{grid-template-columns:repeat(4,minmax(0,1fr))}.foot-bottom{grid-template-columns:auto 1fr;gap:var(--s10)}.foot-bottom p:last-child{justify-self:end}}
@media(min-width:1180px){.app-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.foot-directory{grid-template-columns:1.15fr repeat(4,minmax(0,1fr));column-gap:var(--s8)}.foot-brand{grid-column:auto}}
@media(max-width:719px){.prose .editorial-block>h2{gap:var(--s3)}.prose .editorial-feature .reading-panel+.reading-panel{padding-left:var(--s4)}}

/* Home reading guide: distinct compositions for each editorial subject. */
.home-article .article{gap:clamp(1.5rem,3vw,3.5rem)}
.prose.home-editorial{min-width:0}
.home-editorial .home-section{margin:0;padding:0;min-width:0}
.home-editorial .home-section+.home-section{margin-top:clamp(3.5rem,6vw,6rem)}
.home-editorial .home-section>*+*{margin-top:0}
.home-editorial .home-section>h2{display:block;margin:0 0 var(--s6);max-width:30ch;font-size:clamp(1.6rem,1.25rem + 1.3vw,2.6rem);line-height:1.17}
.home-editorial .home-section>h2:before{content:attr(data-step);display:block;margin-bottom:var(--s3);font-family:var(--font-body);font-size:.75rem;font-weight:700;letter-spacing:.15em;color:var(--accent)}
.home-editorial h3{margin:0;font-size:clamp(1.15rem,1.05rem + .35vw,1.4rem);line-height:1.3}
.home-editorial p{max-width:72ch;font-size:var(--base);line-height:1.75;color:var(--muted)}
.home-editorial p+p{margin-top:var(--s4)}
.home-editorial .home-section-lead{font-size:var(--lg);line-height:1.6;max-width:60ch;margin-bottom:var(--s6)}
.home-editorial .home-caption{font-size:var(--sm);line-height:1.65}
.home-editorial .home-inline-note{margin-top:var(--s6);padding-left:var(--s5);border-left:2px solid var(--accent);font-size:var(--sm);max-width:80ch}
.home-tag{display:inline-block;font-size:.72rem;line-height:1.5;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--accent)}
.home-intro-copy{min-width:0}
.home-editorial .home-lead{font-family:var(--font-display);color:var(--ink);font-size:clamp(1.3rem,1.1rem + .6vw,1.8rem);line-height:1.4;max-width:28ch;margin-bottom:var(--s5)}
.home-pullquote{border-left:3px solid var(--accent);padding-left:var(--s5);margin:var(--s6) 0}
.home-editorial .home-pullquote p{color:var(--ink);font-weight:700;font-size:var(--lg);line-height:1.4}
.home-pullquote span{display:block;color:var(--accent);font-size:var(--xs);margin-top:var(--s2)}
.home-editorial .home-editorial-art{position:relative;overflow:hidden;border-radius:var(--r3);aspect-ratio:4/5;margin-top:var(--s6);max-height:36rem;min-width:0;background:var(--surface)}
.home-editorial-art img{width:100%;height:100%;object-fit:cover;object-position:50% 25%}
.home-editorial-art:after{content:'';position:absolute;inset:55% 0 0;background:linear-gradient(transparent,rgba(14,12,16,.8));pointer-events:none}

.home-route-grid,.home-format-grid,.home-creative-grid,.home-budget-grid{display:grid;gap:var(--s5)}
.home-editorial a.home-route{min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:var(--s4);padding:var(--s6);border:1px solid var(--line);border-radius:var(--r3);background:var(--bg);text-decoration:none;transition:border-color .2s ease,transform .2s ease}
.home-editorial a.home-route:hover{border-color:var(--accent);transform:translateY(-3px)}
.home-icon{display:grid;place-items:center;width:3rem;height:3rem;flex:none;border-radius:.8rem;background:var(--accent-soft);color:var(--accent)}
.home-icon svg{width:1.6rem;height:1.6rem}
.home-editorial .home-route p{font-size:var(--sm);line-height:1.7}
.home-route-link{display:flex;align-items:center;justify-content:space-between;width:100%;gap:var(--s3);margin-top:auto;padding-top:var(--s3);font-size:var(--sm);font-weight:700;color:var(--accent)}
.home-route-link span{font-size:1.25rem}
.home-format{padding:var(--s6);border-top:2px solid var(--accent);background:var(--surface);min-width:0}
.home-format-letter{display:block;font-family:var(--font-display);font-size:5rem;line-height:1;color:var(--accent);opacity:.5;margin-bottom:var(--s4)}
.home-format .home-tag{display:block;margin-bottom:var(--s2)}
.home-format h3{margin-bottom:var(--s4)}
.home-editorial .home-format p{font-size:var(--sm)}
.home-dictionary-grid,.home-evidence-grid{display:grid;gap:var(--s6);align-items:start}
.home-term{background:var(--accent-soft);border-radius:var(--r3);padding:var(--s6)}
.home-term>strong{display:block;font-family:var(--font-display);font-size:clamp(4.5rem,7vw,7rem);line-height:1.1;letter-spacing:-.05em;color:var(--accent);margin:var(--s4) 0}
.home-editorial .home-term p{color:var(--ink);font-size:var(--lg);line-height:1.5}
.home-term>a{display:block;margin-top:var(--s6);font-size:var(--sm);font-weight:700;color:var(--accent)}
.home-editorial .home-numbered-list{counter-reset:home-point;list-style:none;padding:0;margin:var(--s6) 0;display:grid;gap:var(--s5)}
.home-numbered-list li{counter-increment:home-point;position:relative;padding-left:2.5rem;font-size:var(--sm);line-height:1.7;color:var(--muted);max-width:none;margin:0}
.home-numbered-list li:before{content:counter(home-point,decimal-leading-zero);position:absolute;left:0;top:0;color:var(--accent);font-weight:700}
.home-numbered-list strong{color:var(--ink)}
.home-editorial .home-evidence{background:var(--surface);padding:clamp(1.25rem,3vw,2.5rem);border-radius:var(--r3)}
.home-editorial .home-check-list{list-style:none;padding:0;margin:var(--s6) 0;display:grid}
.home-check-list li{position:relative;padding:var(--s4) 0 var(--s4) 2rem;border-top:1px solid var(--line);max-width:none;margin:0}
.home-check-list li:before{content:'✓';position:absolute;left:0;top:var(--s4);font-weight:700;color:var(--accent)}
.home-check-list strong,.home-check-list span{display:block;font-size:var(--sm)}
.home-check-list span{color:var(--muted);margin-top:.2rem}
.home-evidence-card{padding:var(--s6);border-radius:var(--r2);background:var(--paper);min-width:0}
.home-evidence-card h3{margin-bottom:var(--s6)}
.home-date-list{display:grid;gap:var(--s5)}
.home-date-list>div{padding-left:var(--s4);border-left:2px solid var(--accent)}
.home-date-list dt{font-size:var(--base);font-weight:700}
.home-date-list dd{font-size:var(--sm);color:var(--muted);margin-top:var(--s2)}
.home-editorial .home-evidence-card>p{margin-top:var(--s6);font-size:var(--sm)}
.home-editorial .home-language-table{margin-bottom:var(--s6);border:0;border-radius:0}
.home-language-table table{min-width:0;table-layout:fixed;background:transparent}
.home-language-table caption{text-align:left;padding:0 0 var(--s4);font-size:var(--xs);font-weight:700;color:var(--accent);letter-spacing:.04em}
.home-language-table th:first-child{width:35%}
.home-language-table thead th{background:var(--surface);font-size:var(--xs)}
.home-language-table tbody th{font-size:var(--sm);text-transform:none;letter-spacing:0;color:var(--ink);font-weight:700}
.home-language-table td{color:var(--muted);line-height:1.6}
.home-language-links{display:flex;flex-wrap:wrap;gap:var(--s3);margin-top:var(--s6)}
.home-language-links a{display:inline-flex;align-items:center;gap:var(--s3);padding:var(--s3) var(--s4);border:1px solid var(--line);border-radius:var(--r2);text-decoration:none;font-size:var(--sm);font-weight:700}
.home-language-links a:hover{border-color:var(--accent)}
.home-language-links a>span:first-child{color:var(--accent);font-size:.7rem;letter-spacing:.07em}
.home-creative-card{padding:var(--s6);border:1px solid var(--line);border-radius:var(--r3);background:var(--bg);min-width:0}
.home-creative-card .home-icon{margin-bottom:var(--s5)}
.home-creative-card h3{margin-bottom:var(--s4)}
.home-creative-card .home-tag{display:block;border-top:1px solid var(--line);padding-top:var(--s4);margin-top:var(--s5)}
.home-tool-list{display:grid;gap:var(--s3)}
.home-tool-list>a{display:grid;grid-template-columns:3rem minmax(0,1fr) auto;align-items:center;gap:var(--s4);padding:var(--s5);background:var(--surface);border:1px solid transparent;border-radius:var(--r2);text-decoration:none;transition:border-color .2s ease}
.home-tool-list>a:hover{border-color:var(--accent)}
.home-tool-mark{display:grid;place-items:center;width:3rem;height:3rem;border-radius:.75rem;background:var(--paper);font-family:var(--font-display);font-size:1.5rem;color:var(--accent)}
.home-tool-list h3{font-size:1.1rem}
.home-editorial .home-tool-list p{margin-top:var(--s2);font-size:var(--sm);line-height:1.6}
.home-tool-arrow{color:var(--accent);font-size:1.5rem}
.home-editorial .home-journey{counter-reset:home-journey;display:grid;gap:var(--s3);padding:0;list-style:none;margin:var(--s6) 0}
.home-journey li{counter-increment:home-journey;display:flex;gap:var(--s3);align-items:center;max-width:none;margin:0;padding:var(--s3) 0;font-size:var(--sm);font-weight:700}
.home-journey li:before{content:counter(home-journey);display:grid;place-items:center;width:1.75rem;height:1.75rem;flex:none;border-radius:50%;background:var(--accent-soft);color:var(--accent);font-size:.75rem}
.home-editorial .home-budget{padding:clamp(1.25rem,3vw,2.5rem);border:1px solid var(--accent);border-radius:var(--r3);background:color-mix(in oklab,var(--accent-soft) 25%,var(--paper))}
.home-budget-equation{display:grid;gap:var(--s3);align-items:center;margin-bottom:var(--s6);padding-bottom:var(--s6);border-bottom:1px solid var(--line)}
.home-budget-equation>div{padding:var(--s4);background:var(--paper);border-radius:var(--r2);text-align:center;min-width:0}
.home-budget-equation>div>span{display:block;font-size:.72rem;color:var(--muted);margin-bottom:var(--s2)}
.home-budget-equation strong{font-family:var(--font-display);font-size:clamp(1.15rem,1rem + .5vw,1.6rem);line-height:1.3;font-weight:500;display:block}
.home-budget-symbol{font-size:1.6rem;font-weight:500;color:var(--accent);text-align:center;line-height:1}
.home-budget-grid{margin-top:var(--s6)}
.home-budget-grid h3{font-size:1.1rem;margin-bottom:var(--s3)}
.home-editorial .home-budget-grid p{font-size:var(--sm)}
.home-editorial .home-final-checks{display:grid;gap:var(--s5) var(--s6);list-style:none;padding:0;margin:var(--s6) 0}
.home-final-checks li{display:flex;gap:var(--s4);padding-top:var(--s5);border-top:1px solid var(--line);margin:0;max-width:none}
.home-final-checks li>span{font-size:.8rem;color:var(--accent);font-weight:700;padding-top:.25rem;flex:none}
.home-final-checks h3{font-size:1.1rem;margin-bottom:var(--s3)}
.home-editorial .home-final-checks p{font-size:var(--sm)}
.home-article .toc{border:0;background:transparent;border-radius:0}
.home-article .toc-links{counter-reset:home-toc;border-top:0}
.home-article .toc-links>a{counter-increment:home-toc;display:flex;gap:var(--s3);font-size:.8rem;align-items:baseline;padding:.7rem 0}
.home-article .toc-links>a:before{content:counter(home-toc,decimal-leading-zero);color:var(--accent);font-size:.65rem;font-weight:700;flex:none;min-width:1rem}
@media(min-width:720px){
  .home-creative-grid,.home-budget-grid,.home-editorial .home-final-checks{grid-template-columns:repeat(2,minmax(0,1fr))}
  .home-budget-equation{grid-template-columns:1fr auto 1.4fr auto 1.2fr}
  .home-editorial .home-journey{grid-template-columns:repeat(2,minmax(0,1fr))}
  .home-editorial .home-intro{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:0 var(--s6);align-items:start}
  .home-intro>h2,.home-intro-copy{grid-column:1}
  .home-editorial .home-intro>.home-editorial-art{grid-column:2;grid-row:1 / span 2;margin:0;height:100%;max-height:40rem;aspect-ratio:auto;min-height:25rem}
}
@media(min-width:1180px){
  .home-route-grid,.home-format-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .home-dictionary-grid{grid-template-columns:minmax(0,.85fr) minmax(0,1.5fr);gap:var(--s8)}
  .home-evidence-grid{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:var(--s8)}
  .home-editorial .home-journey{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media(min-width:980px){.home-article .toc-disclosure>summary{padding:0 0 var(--s5);font-size:var(--sm)}.home-article .toc-links{padding:0}}
@media(max-width:719px){.home-article .toc-disclosure{background:var(--surface);border-radius:var(--r2)}.home-language-table th,.home-language-table td{padding:var(--s3);overflow-wrap:anywhere}.home-tool-list>a{grid-template-columns:2.5rem minmax(0,1fr) auto;gap:var(--s3);padding:var(--s4)}.home-tool-mark{width:2.5rem;height:2.5rem}.home-editorial .home-section>h2{max-width:none}}

/* Interior reading guides share the home page's open editorial compositions. */
.interior-article .article{gap:clamp(1.5rem,3vw,3.5rem)}
.prose.interior-editorial{min-width:0}
.interior-editorial .interior-section{margin:0;padding:0;min-width:0}
.interior-editorial .interior-section+.interior-section{margin-top:clamp(3.5rem,6vw,6rem)}
.interior-editorial .interior-section>*+*{margin-top:0}
.interior-editorial .interior-section>h2{display:block;margin:0 0 var(--s6);max-width:32ch;font-size:clamp(1.6rem,1.25rem + 1.3vw,2.6rem);line-height:1.17}
.interior-section>h2:before{content:attr(data-step);display:block;margin-bottom:var(--s3);font-family:var(--font-body);font-size:.75rem;font-weight:700;letter-spacing:.15em;color:var(--accent)}
.interior-editorial h3{margin:0 0 var(--s4);font-size:clamp(1.1rem,1rem + .4vw,1.4rem);line-height:1.3}
.interior-editorial p{max-width:72ch;font-size:var(--base);line-height:1.75;color:var(--muted)}
.interior-editorial p+p{margin-top:var(--s4)}
.interior-editorial p strong{color:var(--ink);font-weight:700}
.interior-copy,.interior-panel,.interior-intro-copy{min-width:0}
.interior-editorial .interior-lead{font-family:var(--font-display);font-size:clamp(1.3rem,1.1rem + .6vw,1.8rem);line-height:1.4;color:var(--ink);max-width:32ch;margin-bottom:var(--s5)}
.interior-editorial .interior-intro-point{margin-block:var(--s6);padding-left:var(--s5);border-left:3px solid var(--accent);font-weight:700;color:var(--ink);font-size:var(--lg);line-height:1.5}
.interior-art{position:relative;isolation:isolate;overflow:hidden;border-radius:var(--r3);min-width:0;background:var(--surface);aspect-ratio:4/3}
.interior-art img{width:100%;height:100%;object-fit:cover;object-position:50% 22%}
.interior-art:after{content:'';position:absolute;inset:60% 0 0;background:linear-gradient(transparent,rgba(14,12,16,.8));pointer-events:none}

.interior-intro .interior-art{margin-top:var(--s6);max-height:32rem}
.interior-card-grid,.interior-contrast-grid,.interior-case-grid,.interior-next-grid{display:grid;gap:var(--s5)}
.interior-card{min-width:0;padding:clamp(1.25rem,2.5vw,2rem);border:1px solid var(--line);border-radius:var(--r3);background:var(--bg)}
.interior-card:before{content:attr(data-mark);display:grid;place-items:center;width:3rem;height:3rem;margin-bottom:var(--s5);border-radius:.8rem;background:var(--accent-soft);color:var(--accent);font-size:.8rem;font-weight:700;letter-spacing:.06em}
.interior-editorial .interior-card p{font-size:var(--sm);line-height:1.7}
.interior-definition-grid{display:grid;gap:var(--s6)}
.interior-editorial .interior-definition-point{padding:clamp(1.5rem,3vw,2.5rem);border-radius:var(--r3);background:var(--accent-soft);color:var(--ink);font-family:var(--font-display);font-size:clamp(1.2rem,1.05rem + .6vw,1.6rem);line-height:1.5;max-width:none;margin:0}
.interior-definition-point:before{content:'↗';display:block;font-family:var(--font-body);font-size:2rem;line-height:1;margin-bottom:var(--s5);color:var(--accent)}
.interior-editorial .interior-steps-list{counter-reset:interior-step;display:grid;gap:var(--s5);padding:0;list-style:none;margin:0}
.interior-steps-list>li{position:relative;counter-increment:interior-step;padding-top:var(--s5);border-top:1px solid var(--line);margin:0;max-width:none;min-width:0}
.interior-steps-list>li:before{content:counter(interior-step,decimal-leading-zero);display:block;font-family:var(--font-display);font-size:2.5rem;line-height:1;margin-bottom:var(--s5);color:var(--accent)}
.interior-editorial .interior-steps-list p{font-size:var(--sm);line-height:1.7}
.interior-steps-list p>strong{display:block;margin-bottom:var(--s3);font-size:var(--base);line-height:1.5}
.interior-contrast-grid{gap:0;border-block:1px solid var(--line)}
.interior-contrast-grid>.interior-panel{padding-block:var(--s6)}
.interior-contrast-grid>.interior-panel+.interior-panel{border-top:1px solid var(--line)}
.interior-contrast-grid h3{font-family:var(--font-display);font-size:var(--lg)}
.interior-media .interior-art{margin-bottom:var(--s6);max-height:28rem}
.interior-media .interior-copy h3{margin-top:var(--s6)}
.interior-media .interior-copy h3:first-child{margin-top:0}
.interior-media .interior-panel+.interior-panel{margin-top:var(--s5)}
.interior-band{padding:clamp(1.5rem,3vw,2.5rem);border-radius:var(--r3);background:var(--surface)}
.interior-editorial .interior-band-lead{font-family:var(--font-display);font-size:var(--lg);line-height:1.5;color:var(--ink);max-width:50ch;padding-bottom:var(--s6);margin-bottom:var(--s6);border-bottom:1px solid var(--line)}
.interior-band-body{display:grid;gap:var(--s5)}
.interior-editorial .interior-band-body p{font-size:var(--sm);margin:0}
.interior-checklist-grid{display:grid;gap:var(--s6);align-items:start}
.interior-checklist-items{min-width:0;padding:var(--s6);border-radius:var(--r3);background:var(--surface)}
.interior-editorial .interior-checklist-items ul,.interior-editorial .interior-checklist-items ol{display:grid;gap:var(--s4);padding:0;list-style:none;counter-reset:interior-check}
.interior-checklist-items li{position:relative;padding-left:2rem;margin:0;font-size:var(--sm);line-height:1.65;max-width:none;counter-increment:interior-check}
.interior-checklist-items li:before{content:'✓';position:absolute;left:0;color:var(--accent);font-weight:700}
.interior-checklist-items ol li:before{content:counter(interior-check,decimal-leading-zero)}
.interior-editorial .interior-note{margin-top:var(--s6);padding-left:var(--s5);border-left:2px solid var(--accent)}
.interior-editorial .interior-note p{font-size:var(--sm)}
.interior-table .table-wrap{margin-block:var(--s6);border-radius:var(--r3)}
.interior-table th{background:var(--surface);color:var(--ink)}
.interior-table tr:last-child td,.interior-table tr:last-child th{border-bottom:0}
.interior-case-grid{padding:clamp(1.5rem,3vw,2.5rem);background:color-mix(in oklab,var(--accent-soft) 28%,var(--paper));border-left:3px solid var(--accent);border-radius:0 var(--r3) var(--r3) 0}
.interior-case-grid h3{font-family:var(--font-display);font-size:var(--lg)}
.interior-editorial .interior-case-grid p{font-size:var(--sm)}
.interior-next-grid>.interior-panel{min-width:0;padding-top:var(--s6);border-top:2px solid var(--accent)}
.interior-next-grid>.interior-panel:before{content:'↗';display:block;color:var(--accent);font-size:2rem;line-height:1;margin-bottom:var(--s5)}
.interior-editorial .interior-next-grid p{font-size:var(--sm)}
.interior-next-grid p>strong{display:block;font-size:var(--base);margin-bottom:var(--s3);line-height:1.5}
.interior-article .toc{border:0;background:transparent;border-radius:0}
.interior-article .toc-links{border-top:0}
.interior-article .toc-links a{display:flex;gap:var(--s3);align-items:baseline;font-size:.8rem;padding:.7rem 0}
.interior-article .toc-links{counter-reset:interior-toc}
.interior-article .toc-links a:before{content:counter(interior-toc,decimal-leading-zero);counter-increment:interior-toc;min-width:1rem;flex:none;font-size:.65rem;font-weight:700;color:var(--accent)}
.interior-legal .interior-intro .interior-art{max-height:26rem}
.interior-legal .interior-section+.interior-section{margin-top:var(--s10)}
.interior-compact{padding-top:var(--s6);border-top:1px solid var(--line)}
.interior-compact h3{margin-top:var(--s6)}
.interior-intro-copy .note{margin-top:var(--s5)}
@media(min-width:720px){
  .interior-card-grid,.interior-contrast-grid,.interior-case-grid,.interior-next-grid,.interior-editorial .interior-steps-list{grid-template-columns:repeat(2,minmax(0,1fr))}
  .interior-contrast-grid>.interior-panel:first-child{padding-right:var(--s6)}
  .interior-contrast-grid>.interior-panel+.interior-panel{border-top:0;border-left:1px solid var(--line);padding-left:var(--s6)}
}
@media(min-width:1120px){
  .interior-editorial .interior-intro{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:0 var(--s6);align-items:start}
  .interior-intro>h2,.interior-intro-copy{grid-column:1}
  .interior-editorial .interior-intro>.interior-art{grid-column:2;grid-row:1 / span 2;margin:0;height:100%;max-height:46rem;min-height:32rem;aspect-ratio:auto;align-self:stretch}
  .interior-definition-grid,.interior-checklist-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr)}
  .interior-media{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:0 var(--s8);align-items:start}
  .interior-media>h2,.interior-media>.interior-copy{grid-column:2}
  .interior-media>.interior-art{grid-column:1;grid-row:1 / span 2;height:100%;margin:0;min-height:26rem;max-height:36rem;aspect-ratio:auto}
  .interior-band-body{grid-template-columns:repeat(3,minmax(0,1fr))}
  .interior-legal .interior-intro>.interior-art{min-height:22rem;max-height:28rem}
}
@media(min-width:1400px){.interior-editorial .interior-steps-list{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(min-width:980px){.interior-article .toc-disclosure>summary{padding:0 0 var(--s5);font-size:var(--sm)}.interior-article .toc-links{padding:0}}
@media(max-width:719px){.interior-article .toc-disclosure{background:var(--surface);border-radius:var(--r2)}.interior-editorial .interior-section>h2{max-width:none}.interior-editorial .interior-lead{max-width:none}.interior-editorial .interior-intro-point{font-size:var(--base)}}

/* Keep faces visible when article posters are cropped on small screens. */
.interior-art img.article-poster,.home-editorial-art img.article-poster{object-position:50% 0%}

/* Gradient heroes: the project ships without photography, so the backdrop is CSS only. */
:root{--hero-default:radial-gradient(120% 95% at 18% 8%,#4a2930 0%,transparent 58%),linear-gradient(155deg,#2a2420 0%,#191614 52%,#211d1a 100%)}
.hero-with-background.hero-gradient:before{opacity:1}
.hero-grad-dusk{--hero-background:radial-gradient(120% 95% at 18% 8%,#4a2930 0%,transparent 58%),linear-gradient(155deg,#2a2420 0%,#191614 52%,#211d1a 100%)}
.hero-grad-ember{--hero-background:radial-gradient(105% 80% at 82% 10%,#5c2f33 0%,transparent 55%),linear-gradient(200deg,#241e1b 0%,#191614 60%,#2a2420 100%)}
.hero-grad-violet{--hero-background:radial-gradient(115% 90% at 25% 92%,#3a2a44 0%,transparent 60%),linear-gradient(160deg,#211d1a 0%,#191614 55%,#2a2420 100%)}
.hero-grad-teal{--hero-background:radial-gradient(110% 85% at 78% 88%,#1f3a39 0%,transparent 58%),linear-gradient(145deg,#1d1a18 0%,#191614 50%,#272220 100%)}
.hero-grad-amber{--hero-background:radial-gradient(100% 80% at 12% 15%,#4b3620 0%,transparent 56%),linear-gradient(170deg,#241f1c 0%,#191614 58%,#2a2420 100%)}
.hero-grad-slate{--hero-background:radial-gradient(120% 90% at 88% 20%,#2c3340 0%,transparent 58%),linear-gradient(190deg,#1f1d1c 0%,#191614 55%,#282320 100%)}
.hero-grad-rose{--hero-background:radial-gradient(110% 90% at 50% 0%,#55303a 0%,transparent 60%),linear-gradient(180deg,#231e1c 0%,#191614 56%,#2a2420 100%)}
.hero-grad-forest{--hero-background:radial-gradient(105% 85% at 20% 85%,#243527 0%,transparent 58%),linear-gradient(150deg,#1e1b19 0%,#191614 52%,#272220 100%)}
/* No hero photo means the overlay only has to keep long headlines readable. */
.hero-gradient:after{background:linear-gradient(180deg,transparent,transparent 62%,color-mix(in oklab,var(--bg) 70%,transparent))}
/* Breadcrumbs stay visible on every indexable page, above the reading column. */
.interior-article>.wrap>.breadcrumb,.breadcrumb-bar{padding:0 0 var(--s5)}
.breadcrumb-bar{border-bottom:1px solid var(--line);margin-bottom:var(--s6)}
.breadcrumb-bar ol{margin:0}
.breadcrumb-bar a{text-decoration:none;color:var(--muted)}
.breadcrumb-bar a:hover{color:var(--accent)}
.breadcrumb-bar li[aria-current]{color:var(--ink)}
/* Sections marked noart carry no illustration, so they keep one full-width reading column. */
@media(min-width:1120px){
  .interior-editorial .interior-intro.interior-noart,
  .interior-editorial .interior-media.interior-noart{grid-template-columns:minmax(0,1fr)}
  .interior-media.interior-noart>h2,
  .interior-media.interior-noart>.interior-copy{grid-column:1}
  .interior-intro.interior-noart .interior-intro-copy{column-count:2;column-gap:var(--s8)}
  .interior-intro.interior-noart .interior-intro-copy>*{break-inside:avoid}
  .interior-intro.interior-noart .interior-lead,
  .interior-intro.interior-noart .interior-intro-point{column-span:all}
}
/* Photographic hero: the backdrop carries an image, so the scrim centres on the headline. */
/* The photo carries the page, so it stays bright; the copy gets its own panel instead of a full scrim. */
.hero-with-background:not(.hero-gradient):before{opacity:.62}
.home .hero-with-background:not(.hero-gradient):before{opacity:.92}
.hero-with-background:not(.hero-gradient):after{background:linear-gradient(180deg,color-mix(in oklab,var(--bg) 55%,transparent),transparent 22%,transparent 58%,color-mix(in oklab,var(--bg) 85%,transparent) 88%,var(--bg))}
.hero-photo .hero-grid>div{max-width:62rem;padding:clamp(1rem,2.5vw,2rem)}
.hero-photo .lede{color:var(--ink);text-shadow:0 1px 14px oklch(0 0 0/.75),0 0 40px oklch(0 0 0/.5)}
.hero-photo .eyebrow{text-shadow:0 1px 12px oklch(0 0 0/.8)}
.hero-photo h1{text-shadow:0 2px 18px oklch(0 0 0/.8),0 0 60px oklch(0 0 0/.55)}
.hero-photo .author{justify-content:center;padding-top:var(--s5);margin-top:var(--s6);border-top:1px solid color-mix(in oklab,var(--ink) 18%,transparent)}
.hero-photo .author strong,.hero-photo .author span{text-shadow:0 1px 10px oklch(0 0 0/.8)}

/* Figures band under the hero: four plain facts about the site, not ratings. */
.hero-stats{padding:0;margin-top:calc(var(--s12) * -1);position:relative;z-index:2}
.hero-stats .stat-band{box-shadow:var(--shadow);background:var(--line)}
.hero-stats .stat{background:var(--paper);padding:var(--s5) var(--s5) var(--s6)}
.hero-stats .stat strong{color:var(--accent);font-size:clamp(1.6rem,1.2rem + 1.4vw,2.4rem)}
.hero-stats .stat span{display:block;margin-top:var(--s2);line-height:1.45}
@media(max-width:719px){.hero-stats{margin-top:calc(var(--s8) * -1)}.hero-stats .stat-band{grid-template-columns:repeat(2,1fr)}}


/* Header sits over the hero instead of pinning to the viewport. */
body{position:relative}
.site-head{position:absolute;top:0;left:0;right:0;background:transparent;backdrop-filter:none;border-bottom:0}
.site-head .logo span,.site-head .nav a{text-shadow:0 1px 12px oklch(0 0 0/.75)}
.site-head .nav a:hover{color:var(--accent)}
.site-head .header-cta{box-shadow:0 10px 30px oklch(0 0 0/.35)}
.hero-with-background>.hero-grid,.hero-centered>.hero-grid{padding-top:var(--s16)}
@media(max-width:719px){.hero-with-background>.hero-grid,.hero-centered>.hero-grid{padding-top:var(--s12)}}
/* Photo hero: the subject holds the left of the frame, so the copy centres in the right half. */
@media(min-width:980px){
  .home .hero-photo .hero-grid>div{max-width:min(46rem,54%);margin-inline:auto 0}
  .home .hero-photo .hero-grid{padding-right:clamp(1rem,4vw,4rem)}
}
@media(min-width:1600px){.home .hero-photo .hero-grid>div{max-width:min(50rem,48%)}}
/* Copy hugs the right edge of its column, so the ragged edge runs along the frame. */
@media(min-width:980px){
  .home .hero-photo .hero-grid>div{text-align:right}
  .home .hero-photo h1,.home .hero-photo .lede,.home .hero-photo .eyebrow,
  .home .hero-photo .hero-grid>div>p{margin-inline:auto 0}
  .home .hero-photo .actions,.home .hero-photo .author{justify-content:flex-end}
  .home .hero-photo .author>div{text-align:right}
}
/* Hero heights. */
.hero-photo{--hero-h:80vh}
.home .hero-photo{--hero-h:94vh}
@media(max-width:719px){.hero-photo{--hero-h:72vh}.home .hero-photo{--hero-h:86vh}}
.hero-photo{min-height:var(--hero-h)}

/* Interior heroes set the copy over the middle of the frame, so they carry a deeper veil
   than the homepage, where the text sits in the open water on the right. */
body:not(.home) .hero-photo:after{background:
  radial-gradient(130% 100% at 50% 50%,color-mix(in oklab,var(--bg) 64%,transparent),color-mix(in oklab,var(--bg) 88%,transparent) 72%),
  linear-gradient(180deg,color-mix(in oklab,var(--bg) 72%,transparent),transparent 32%,transparent 58%,var(--bg))}
body:not(.home) .hero-photo .eyebrow{color:var(--accent-hi)}

/* ==========================================================================
   Homepage blocks. The page is a sequence of full-width modules rather than an
   article with a sidebar: a routed card grid, alternating image/text spreads,
   a data panel and an accent band. Shared language: a small step label with a
   rule, display headings and cards that lift on hover.
   ========================================================================== */
.home-block{padding:clamp(3.5rem,8vw,7rem) 0;position:relative}
.home-block+.home-block{border-top:1px solid var(--line)}
.home-lead,.home-table{background:var(--paper)}
.home-split{background:linear-gradient(180deg,var(--bg),color-mix(in oklab,var(--paper) 60%,var(--bg)))}

.block-head{display:grid;gap:var(--s4);margin-bottom:clamp(1.75rem,3.5vw,3rem);max-width:58rem}
.block-step{display:flex;align-items:center;gap:var(--s4);margin:0;
  font-size:var(--xs);font-weight:700;letter-spacing:.22em;color:var(--accent)}
.block-step:after{content:'';flex:1;height:1px;background:linear-gradient(90deg,color-mix(in oklab,var(--accent) 55%,transparent),transparent)}
.block-head h2{font-size:clamp(2rem,1.4rem + 2.4vw,3.6rem);line-height:1.04;letter-spacing:-.035em;max-width:20ch}
.block-lead{font-family:var(--font-display);font-size:clamp(1.15rem,1rem + .9vw,1.7rem);
  line-height:1.3;color:var(--muted);max-width:46ch;margin:0}
.block-copy>*+*{margin-top:var(--s5)}
.block-copy p{color:var(--muted)}
.block-point{font-family:var(--font-display);font-size:clamp(1.1rem,1rem + .7vw,1.6rem);
  line-height:1.3;color:var(--ink);border-left:3px solid var(--accent);padding:var(--s2) 0 var(--s2) var(--s5);max-width:40ch}
.block-note{font-size:var(--sm);color:var(--muted);margin-top:var(--s6);padding:var(--s5);
  border-left:3px solid var(--warning);background:var(--surface);border-radius:0 var(--r2) var(--r2) 0;max-width:72ch}

/* Opening and closing statements: one centred column, nothing competing with it. */
.home-lead .wrap{display:grid;justify-items:center;text-align:center}
.home-lead .block-head{justify-items:center;max-width:46rem}
.home-lead .block-step{justify-content:center}
.home-lead .block-step:after{display:none}
.home-lead .block-head h2{max-width:18ch}
.home-lead .block-lead{max-width:52ch;color:var(--ink)}
.home-lead .block-copy{max-width:60ch}
.home-lead .block-point{border-left:0;border-top:1px solid var(--line);padding:var(--s6) 0 0;
  margin-inline:auto;color:var(--accent);max-width:46ch}

/* Routed cards: the six ways into the site. */
.route-grid,.tile-grid,.strip-grid{display:grid;gap:clamp(1rem,2vw,1.5rem)}
.route-card,.tile-card,.strip-card{display:flex;flex-direction:column;min-width:0;overflow:hidden;
  border:1px solid var(--line);border-radius:var(--r3);background:var(--surface);
  transition:border-color .2s,transform .2s,box-shadow .2s}
.route-card:hover,.tile-card:hover,.strip-card:hover{transform:translateY(-4px);
  border-color:color-mix(in oklab,var(--accent) 55%,var(--line));box-shadow:0 20px 44px oklch(0 0 0/.4)}
.card-media{position:relative;overflow:hidden;background:var(--surface-2)}
.card-media img{width:100%;height:100%;object-fit:cover;display:block}
.route-card .card-media{aspect-ratio:4/3}
.tile-card .card-media{aspect-ratio:3/2}
.strip-card .card-media{aspect-ratio:16/9}
.card-media:after{content:'';position:absolute;inset:auto 0 0;height:55%;
  background:linear-gradient(transparent,color-mix(in oklab,var(--surface) 92%,transparent))}
.card-body{display:flex;flex-direction:column;gap:var(--s3);padding:clamp(1.1rem,2vw,1.6rem);flex:1}
.card-body h3{font-family:var(--font-display);font-size:clamp(1.1rem,1rem + .4vw,1.4rem);line-height:1.2}
.card-body p{color:var(--muted);font-size:var(--sm);margin:0}
.card-go{margin-top:auto;display:inline-flex;align-items:center;gap:.45rem;color:var(--accent);
  font-weight:700;font-size:var(--sm);text-decoration:none}
.card-go span{transition:transform .2s}
.route-card:hover .card-go span,.tile-card:hover .card-go span,.strip-card:hover .card-go span{transform:translateX(4px)}
.strip-card .card-body{gap:var(--s2);padding:var(--s4)}
.strip-card .card-body p{font-size:var(--xs)}

/* Image and text spreads, alternating sides down the page. */
.split-grid{display:grid;gap:clamp(1.5rem,4vw,3.5rem);align-items:center}
.split-grid .block-media{overflow:hidden;border-radius:var(--r3);background:var(--surface);aspect-ratio:4/5;
  box-shadow:0 24px 60px oklch(0 0 0/.4)}
.split-grid .block-media img{width:100%;height:100%;object-fit:cover;display:block}
.split-copy>*+*{margin-top:var(--s5)}
.split-copy p{color:var(--muted)}

/* The warning band: the one block that breaks the page ground. */
.home-band{background:linear-gradient(150deg,var(--accent-soft),color-mix(in oklab,var(--accent-soft) 30%,var(--surface)));
  border-block:1px solid color-mix(in oklab,var(--accent) 35%,transparent)}
.home-band .block-head h2{max-width:24ch}
.band-lead{margin-bottom:var(--s6)}
.band-lead .block-lead{color:var(--ink);max-width:40ch}
.band-body>*+*{margin-top:var(--s5)}
.band-body p{color:color-mix(in oklab,var(--ink) 82%,transparent)}

/* Checklist: reasoning on one side, the list as chips on the other. */
.check-grid{display:grid;gap:clamp(1.5rem,3vw,3rem)}
.check-items ul{display:grid;gap:var(--s3);list-style:none;padding:0;margin:0}
.check-items li{position:relative;margin:0;padding:var(--s4) var(--s4) var(--s4) 3rem;max-width:none;
  border-radius:var(--r2);background:var(--surface);border:1px solid var(--line);font-size:var(--sm)}
.check-items li:before{content:'';position:absolute;left:var(--s4);top:50%;width:1.1rem;height:1.1rem;
  margin-top:-.55rem;border-radius:50%;border:2px solid var(--accent);
  background:radial-gradient(circle,var(--accent) 0 35%,transparent 36%)}

/* Criteria table as a standalone data panel. */
.home-table .table-wrap{border:0;border-radius:var(--r3);overflow:hidden;box-shadow:0 18px 48px oklch(0 0 0/.35);margin-top:var(--s6)}
.home-table table{background:var(--surface);min-width:560px}
.home-table thead th{background:color-mix(in oklab,var(--accent) 18%,var(--surface));color:var(--ink);
  font-size:var(--xs);letter-spacing:.12em;padding-block:var(--s4)}
.home-table tbody tr:nth-child(odd) td,.home-table tbody tr:nth-child(odd) th{background:color-mix(in oklab,var(--bg) 35%,transparent)}
.home-table tbody tr:hover td,.home-table tbody tr:hover th{background:color-mix(in oklab,var(--accent) 10%,transparent)}
.home-table tbody th{color:var(--ink);font-weight:700}

@media(min-width:720px){
  .route-grid,.tile-grid,.strip-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .check-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr)}
  .check-items ul{grid-template-columns:repeat(2,minmax(0,1fr))}
  .band-body{column-count:2;column-gap:var(--s8)}
  .band-body>p{break-inside:avoid;margin:0 0 var(--s4)}
}
@media(min-width:980px){
  .split-grid{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr)}
  .split-grid .block-media{aspect-ratio:3/4;max-height:34rem}
  .home-split:nth-child(even) .split-grid>.block-media{grid-column:2;grid-row:1}
  .home-split:nth-child(even) .split-grid>.split-copy{grid-column:1;grid-row:1}
  .strip-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media(min-width:1120px){
  .route-grid,.tile-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .tile-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .band-body{column-count:3}
}
@media(prefers-reduced-motion:reduce){
  .route-card,.tile-card,.strip-card,.card-go span{transition:none}
}
/* On a phone the homepage copy sits over the middle of the photo, so it needs the deeper veil too. */
@media(max-width:719px){
  .home .hero-with-background:not(.hero-gradient):before{opacity:.7}
  .home .hero-photo:after{background:
    radial-gradient(130% 90% at 50% 55%,color-mix(in oklab,var(--bg) 58%,transparent),color-mix(in oklab,var(--bg) 84%,transparent) 72%),
    linear-gradient(180deg,color-mix(in oklab,var(--bg) 70%,transparent),transparent 28%,transparent 60%,var(--bg))}
}

/* Opening manifesto: heading column against the body copy, with the claim running
   full width underneath both. */
.home-manifest{background:var(--paper)}
.manifest-grid{display:grid;gap:clamp(1.5rem,4vw,3.5rem)}
.home-manifest .block-head{margin-bottom:0;max-width:none}
.home-manifest .block-head h2{max-width:14ch;font-size:clamp(2.2rem,1.4rem + 3vw,4.4rem)}
.home-manifest .block-lead{max-width:34ch}
.manifest-copy>*+*{margin-top:var(--s5)}
.manifest-copy p{color:var(--muted);max-width:60ch}
.manifest-copy p:first-child{font-size:clamp(1.02rem,.98rem + .3vw,1.2rem);color:var(--ink)}
.home-manifest .block-point{margin-top:clamp(2rem,4vw,3.5rem);padding:clamp(1.25rem,3vw,2rem) 0 0;
  border-left:0;border-top:1px solid color-mix(in oklab,var(--accent) 45%,transparent);
  max-width:none;font-size:clamp(1.2rem,1rem + 1.1vw,2.1rem);color:var(--accent);line-height:1.22}
@media(min-width:980px){
  .manifest-grid{grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);align-items:start}
  .home-manifest .block-head{position:sticky;top:var(--s8)}
}
/* The whole card is the click target: the go-link stretches over its card, which keeps a
   single link with a short accessible name instead of wrapping all the copy in an anchor. */
.route-card,.tile-card,.strip-card{position:relative}
.card-go:after{content:'';position:absolute;inset:0;z-index:1;border-radius:inherit}
.route-card:hover .card-body h3,.tile-card:hover .card-body h3,.strip-card:hover .card-body h3{color:var(--accent)}
.route-card:focus-within,.tile-card:focus-within,.strip-card:focus-within{
  border-color:var(--accent);outline:2px solid var(--accent);outline-offset:3px}
.card-go:focus-visible{outline:none}
.card-body h3{transition:color .2s}
@media(prefers-reduced-motion:reduce){.card-body h3{transition:none}}

/* Closing block: the three moves to make, as numbered steps rather than a paragraph run. */
.home-steps{background:var(--paper)}
.steps-list{list-style:none;padding:0;margin:0;display:grid;gap:clamp(1.25rem,3vw,2.5rem);counter-reset:step}
.steps-list li{margin:0;max-width:none;padding-top:var(--s5);border-top:1px solid var(--line);
  display:grid;gap:var(--s4)}
.step-mark{font-family:var(--font-display);font-size:clamp(2.2rem,1.6rem + 2vw,3.4rem);line-height:.9;
  color:color-mix(in oklab,var(--accent) 75%,transparent)}
.steps-list p{margin:0;color:var(--muted);font-size:var(--sm);line-height:1.7;max-width:46ch}
.home-steps .block-point{margin-top:clamp(2rem,4vw,3rem)}
@media(min-width:720px){.steps-list{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* Hero headline carries the page, so it runs larger and tighter, and the line under it
   steps back to a subtitle rather than a paragraph. */
.hero h1{font-size:clamp(2.6rem,1.5rem + 4.8vw,6.2rem);line-height:1.02;letter-spacing:.005em}
.hero-centered h1{max-width:16ch}
.home .hero-photo h1{max-width:13ch}
.hero .lede{font-size:clamp(1rem,.95rem + .38vw,1.22rem);line-height:1.55;margin-top:var(--s5)}
.hero-centered .lede{max-width:46ch}
.home .hero-photo .lede{max-width:40ch}
@media(max-width:719px){.hero h1{font-size:clamp(2.2rem,1.5rem + 3.4vw,3.2rem)}}

/* ==========================================================================
   Type scale. One size per level across the whole site: every h2 matches every
   other h2, every h3 every h3, every lead line every lead line, and body copy is
   one size wherever it sits. The selectors mirror the component rules they
   replace, so the scale wins by source order rather than by !important.
   Labels (eyebrows, kickers, breadcrumbs, buttons, table heads, footer) keep
   their own small UI size: they are interface, not text.
   ========================================================================== */
:root{
  --fs-body:clamp(1.0625rem,.98rem + .45vw,1.25rem);  /* 17px phone → 20px desktop */
  --fs-lead:clamp(1.2rem,1.05rem + .6vw,1.5rem);      /* 19px → 24px */
  --fs-h3:clamp(1.25rem,1.02rem + .7vw,1.625rem);     /* 20px → 26px */
  --fs-h2:clamp(2rem,1.45rem + 1.9vw,3rem);           /* 32px → 48px */
  --base:var(--fs-body);
}
body{font-size:var(--fs-body)}

h2,.age-card h2,.block-head h2,.home-manifest .block-head h2,.faq-heading h2,
.interior-apps .app-section-head h2,.interior-editorial .interior-section>h2,
.prose .editorial-block>h2{font-size:var(--fs-h2);line-height:1.08}

h3,.card-body h3,.app-card h3,.interior-apps .app-card h3,.interior-editorial h3,
.interior-contrast-grid h3,.interior-case-grid h3,.prose .reading-panel>h3{
  font-size:var(--fs-h3);line-height:1.25}

.block-lead,.block-point,.home-manifest .block-point,
.interior-editorial .interior-lead,.interior-editorial .interior-intro-point,
.interior-editorial .interior-definition-point,.interior-editorial .interior-band-lead{
  font-size:var(--fs-lead);line-height:1.35}

.hero .lede,td,.note,.block-note,.card p,.app-card p,.app-section-head>p,
.faq summary,.faq details p,.faq details[open] p,
.interior-editorial p,.interior-editorial .interior-card p,.interior-editorial .interior-steps-list p,
.interior-editorial .interior-band-body p,.interior-checklist-items li,.interior-editorial .interior-note p,
.interior-editorial .interior-case-grid p,.interior-editorial .interior-next-grid p,
.prose .reading-panel p,.prose .editorial-body p,.prose .intro-columns p,.prose .block-note p,
.prose .checklist-card li,.card-body p,.strip-card .card-body p,.check-items li,
.manifest-copy p:first-child,.steps-list p{font-size:var(--fs-body)}
.interior-steps-list p>strong,.interior-next-grid p>strong{font-size:inherit}

/* The phone override from the donor theme would shrink the pull-quote below the scale. */
@media(max-width:719px){.interior-editorial .interior-intro-point{font-size:var(--fs-lead)}}

/* Cut-out figure: no frame, no cover crop. The whole figure stands on a soft accent glow,
   and the thighs, cut by the original frame, fade into the section ground instead of
   ending on a hard edge. */
.split-grid .block-media.is-cutout{position:relative;overflow:visible;background:none;box-shadow:none;
  border-radius:0;aspect-ratio:auto;max-height:none;display:flex;justify-content:center;align-items:flex-end;
  isolation:isolate;padding-top:var(--s4)}
.split-grid .block-media.is-cutout:before{content:'';position:absolute;z-index:-1;left:50%;top:46%;
  width:min(115%,40rem);aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;
  background:radial-gradient(circle,color-mix(in oklab,var(--accent) 34%,transparent) 0,
    color-mix(in oklab,var(--accent) 12%,transparent) 42%,transparent 70%);filter:blur(8px)}
.split-grid .block-media.is-cutout img{width:auto;max-width:100%;height:auto;max-height:min(44rem,82vh);
  object-fit:contain;filter:drop-shadow(0 24px 40px oklch(0 0 0/.45));
  -webkit-mask-image:linear-gradient(180deg,#000 82%,transparent);mask-image:linear-gradient(180deg,#000 82%,transparent)}
@media(min-width:980px){.split-grid .block-media.is-cutout{aspect-ratio:auto;max-height:none}}
@media(max-width:979px){.split-grid .block-media.is-cutout img{max-height:30rem}}
/* Full-length cut-out: the figure ends on its own feet, so instead of a fade it stands on
   a soft floor shadow, and it may run taller than a half-figure. */
.split-grid .block-media.is-cutout.is-full{padding-bottom:var(--s5)}
.split-grid .block-media.is-cutout.is-full img{-webkit-mask-image:none;mask-image:none;
  max-height:min(50rem,86vh)}
.split-grid .block-media.is-cutout.is-full:after{content:'';position:absolute;z-index:-1;left:50%;bottom:var(--s3);
  width:min(70%,16rem);height:1.4rem;transform:translateX(-50%);border-radius:50%;
  background:radial-gradient(ellipse,oklch(0 0 0/.55),transparent 70%);filter:blur(4px)}
.split-grid .block-media.is-cutout.is-full:before{top:52%}
@media(max-width:979px){.split-grid .block-media.is-cutout.is-full img{max-height:34rem}}

/* ==========================================================================
   FAQ: a lean accordion. Heading column on the left, questions as hairline rows
   on the right, one answer open at a time. The icon turns from plus to minus;
   the height animation lives in site.js so it runs the same in every browser.
   ========================================================================== */
.qa{padding:clamp(3.5rem,7vw,6rem) 0;border-top:1px solid var(--line)}
.qa-layout{display:grid;gap:clamp(1.75rem,4vw,4rem)}
.qa-head h2{max-width:14ch}
.qa-aside{margin-top:var(--s5);color:var(--muted);font-size:var(--fs-body)}
.qa-aside a{color:var(--accent);text-underline-offset:.2em}
.qa-list{border-top:1px solid var(--line)}
.qa-item{border-bottom:1px solid var(--line);overflow:hidden}
.qa-item summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:var(--s5);
  padding:clamp(1rem,1.6vw,1.35rem) 0;cursor:pointer;font-size:var(--fs-body);font-weight:600;line-height:1.4;
  color:var(--ink);transition:color .25s ease}
.qa-item summary::-webkit-details-marker{display:none}
.qa-item summary:hover,.qa-item[open] summary{color:var(--accent)}
.qa-item summary:focus-visible{outline:2px solid var(--accent);outline-offset:4px;border-radius:var(--r1)}
.qa-icon{position:relative;flex:none;width:1.1rem;height:1.1rem;opacity:.75;transition:opacity .25s}
.qa-item summary:hover .qa-icon,.qa-item[open] .qa-icon{opacity:1}
.qa-icon:before,.qa-icon:after{content:'';position:absolute;left:0;top:50%;width:100%;height:2px;margin-top:-1px;
  border-radius:2px;background:currentColor;transition:transform .4s cubic-bezier(.2,.7,.2,1)}
.qa-icon:after{transform:rotate(90deg)}
.qa-item[open] .qa-icon:after{transform:rotate(0deg)}
.qa-item[open] .qa-icon:before{transform:rotate(180deg)}
.qa-a{padding:0 clamp(1.5rem,4vw,3rem) clamp(1.1rem,2vw,1.5rem) 0}
.qa-a p{margin:0;max-width:64ch;color:var(--muted);font-size:var(--fs-body);line-height:1.7}
@media(min-width:980px){
  .qa-layout{grid-template-columns:minmax(0,.75fr) minmax(0,1.45fr);align-items:start}
  .qa-head{position:sticky;top:var(--s8)}
}
@media(prefers-reduced-motion:reduce){.qa-icon:before,.qa-icon:after,.qa-item summary{transition:none}}

/* ==========================================================================
   Partner tools. Each service is a tall card: its own photograph with a rank
   and a feature badge, the name, what it is good at, and one clear call to
   action. The whole card is the click target; the review link sits above the
   overlay so it stays reachable.
   ========================================================================== */
.tools{position:relative;padding:clamp(3.5rem,7vw,6rem) 0;border-block:1px solid var(--line);
  background:radial-gradient(70% 60% at 85% 0%,color-mix(in oklab,var(--accent) 14%,transparent),transparent 70%),
    radial-gradient(60% 50% at 0% 100%,color-mix(in oklab,var(--accent) 8%,transparent),transparent 70%),var(--paper)}
.tools-head{display:grid;gap:var(--s3);max-width:46rem;margin-bottom:clamp(1.75rem,3.5vw,2.75rem)}
.tools-head .eyebrow{margin:0}
.tools-lead{color:var(--muted);font-size:var(--fs-body);max-width:52ch}
.tools-grid{list-style:none;margin:0;padding:0;display:grid;gap:clamp(1rem,1.8vw,1.5rem)}
.tool{position:relative;display:flex;flex-direction:column;min-width:0;max-width:none;margin:0;overflow:hidden;
  border-radius:var(--r3);background:var(--surface);border:1px solid var(--line);
  box-shadow:0 18px 40px oklch(0 0 0/.35);transition:transform .35s cubic-bezier(.2,.7,.2,1),border-color .25s,box-shadow .35s}
.tool:hover{transform:translateY(-6px);border-color:color-mix(in oklab,var(--accent) 60%,var(--line));
  box-shadow:0 28px 60px oklch(0 0 0/.5),0 0 0 1px color-mix(in oklab,var(--accent) 35%,transparent)}
.tool:focus-within{outline:2px solid var(--accent);outline-offset:3px}

.tool-media{position:relative;aspect-ratio:4/5;overflow:hidden;background:var(--surface-2)}
.tool-media img{width:100%;height:100%;object-fit:cover;display:block;transform:scale(1.001);
  transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.tool:hover .tool-media img{transform:scale(1.06)}
.tool-media:after{content:'';position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,oklch(0 0 0/.35) 0,transparent 26%,transparent 52%,var(--surface) 100%)}
.tool-rank,.tool-badge{position:absolute;z-index:1;top:var(--s4);display:inline-flex;align-items:center;
  min-height:2rem;padding:0 .75rem;border-radius:999px;font-size:var(--xs);font-weight:700;letter-spacing:.06em;
  backdrop-filter:blur(10px)}
.tool-rank{left:var(--s4);background:oklch(0 0 0/.45);color:#fff;border:1px solid oklch(1 0 0/.18)}
.tool-badge{right:var(--s4);background:var(--accent);color:#fff;box-shadow:0 6px 18px oklch(0 0 0/.35)}

.tool-body{position:relative;display:flex;flex-direction:column;gap:var(--s3);flex:1;
  padding:0 clamp(1.1rem,1.6vw,1.5rem) clamp(1.1rem,1.6vw,1.5rem);margin-top:-2.25rem;z-index:1}
.tool-kicker{margin:0;color:var(--accent);font-size:var(--xs);font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.tool-name{margin:0;font-family:var(--font-display);font-size:var(--fs-h3);line-height:1.1}
.tool-note{margin:0;color:var(--muted);font-size:clamp(.95rem,.92rem + .2vw,1.05rem);line-height:1.55}
.tool-tags{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.4rem}
.tool-tags li{margin:0;padding:.3rem .65rem;border-radius:999px;font-size:var(--xs);font-weight:600;
  color:var(--ink);background:color-mix(in oklab,var(--ink) 8%,transparent);border:1px solid var(--line)}

.tool-cta{margin-top:auto;display:flex;align-items:center;justify-content:center;gap:.55rem;min-height:3.1rem;
  padding:.8rem 1rem;border-radius:var(--r2);font-weight:700;font-size:var(--sm);color:#fff;text-decoration:none;
  background:linear-gradient(135deg,var(--accent-hi),var(--accent));box-shadow:0 10px 24px color-mix(in oklab,var(--accent) 35%,transparent);
  transition:filter .2s,box-shadow .25s}
.tool-cta span{transition:transform .25s}
.tool:hover .tool-cta{filter:brightness(1.06);box-shadow:0 14px 30px color-mix(in oklab,var(--accent) 50%,transparent)}
.tool:hover .tool-cta span{transform:translateX(4px)}
.tool-cta:after{content:'';position:absolute;inset:0;z-index:1}
.tool-cta:focus-visible{outline:none}
.tool-meta{display:flex;justify-content:space-between;align-items:center;gap:var(--s3);margin:0;
  font-size:var(--xs);color:var(--faint)}
.tool-review{position:relative;z-index:2;color:var(--muted);text-decoration:underline;text-underline-offset:.2em}
.tool-review:hover{color:var(--accent)}
.tools-context{margin-top:var(--s6);font-size:var(--xs);color:var(--faint);max-width:72ch}

@media(min-width:720px){.tools-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1120px){.tools-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
/* Phones: the cards stack in a single column. */
@media(prefers-reduced-motion:reduce){.tool,.tool-media img,.tool-cta,.tool-cta span{transition:none}}
/* Footer line of a tool card: two labels that wrap as wholes, never mid-phrase. */
.tool-meta{flex-wrap:wrap;row-gap:.35rem}
.tool-meta>span,.tool-review{white-space:nowrap}
@media(max-width:719px){.tool-media{aspect-ratio:5/4}}
/* Compact cards: a landscape frame and a tighter body keep the row at roughly one screen. */
.tool-media{aspect-ratio:16/10}
.tool-body{gap:var(--s2);margin-top:-1.5rem;padding:0 clamp(1rem,1.4vw,1.25rem) clamp(1rem,1.4vw,1.25rem)}
.tool-name{margin:.1rem 0 0}
.tool-note{font-size:clamp(.9rem,.88rem + .15vw,1rem);line-height:1.5}
.tool-tags{margin-top:.15rem}
.tool-tags li{padding:.22rem .55rem}
.tool-cta{min-height:2.75rem;padding:.65rem 1rem;margin-top:auto}
.tool-body>.tool-cta{margin-top:max(var(--s2),auto)}
.tool-rank,.tool-badge{top:var(--s3);min-height:1.75rem;padding:0 .6rem}
.tool-rank{left:var(--s3)}.tool-badge{right:var(--s3)}
.tool-meta{flex-wrap:nowrap}
@media(max-width:719px){.tool-media{aspect-ratio:16/10}}
/* Hover seam fix. The fade used to be a separate overlay above the scaling photo; during the
   lift the two composited layers drifted by a pixel and a line of photo showed through. The
   fade now lives in the photo's own mask, the frame clips itself, and the backdrop under the
   photo is the card colour, so there is nothing left to leak. */
.tool{will-change:transform;backface-visibility:hidden}
.tool-media{background:var(--surface);transform:translateZ(0);
  clip-path:inset(0 round var(--r3) var(--r3) 0 0)}
.tool-media:after{content:none}
.tool-media img{-webkit-mask-image:linear-gradient(180deg,#000 45%,transparent 98%);
  mask-image:linear-gradient(180deg,#000 45%,transparent 98%);backface-visibility:hidden}

/* Whole card as the click target. The body is a flex item, so it can sit above the photo
   with z-index alone and is not the containing block for the CTA's overlay: the overlay
   stretches over the entire card, photo included. The review link stays above it. */
.tool-body{position:static;z-index:1}
.tool-cta:after{z-index:1;border-radius:var(--r3)}
.tool-review{position:relative;z-index:3}
/* The theme colours every link inside a list item with the accent on hover; on the accent
   button that made the label vanish. The card's own rules outrank it. */
.tools .tool .tool-cta,.tools .tool .tool-cta:hover,.tools .tool .tool-cta:focus-visible{
  color:#fff;text-decoration:none}
.tools .tool .tool-review{color:var(--muted)}
.tools .tool .tool-review:hover{color:var(--accent)}
/* The glow behind a cut-out figure is wider than its column on purpose. On phones that put
   its soft edge past the viewport and added a sideways scroll; the section clips it.
   overflow-x:clip, unlike hidden, creates no scroll container. */
.home-split{overflow-x:clip}
@media(max-width:719px){.split-grid .block-media.is-cutout:before{width:100%}}
