/* =====================================================================
   BTP Consulting — Devin Design System v1.2 (light), static site.
   Tokens, components and page rhythm follow the design system and the
   farhan.app reference build: one hero, hairline rows, grainy panels,
   two-tone headings, pill actions, fluid sizing via clamp()/containers.
   ===================================================================== */
@font-face{font-family:"Geist";src:url(/fonts/geist.woff2) format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"Geist Mono";src:url(/fonts/geist-mono.woff2) format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"Inter";src:url(/fonts/inter.woff2) format("woff2");font-weight:100 900;font-display:swap}

:root{
  --text-primary:25 25 25; --text-secondary:25 25 25 / .78; --text-tertiary:25 25 25 / .64; --text-white:255 255 255;
  --accent:49 124 255; --link:26 95 224; --lead:25 25 25 / .5;
  --success:22 163 74; --warning:234 120 20; --danger:229 57 53;
  --bg-page:248 248 248; --bg-surface:252 252 252; --bg-elevated:255 255 255; --bg-primary:0 0 0;
  --tint-blue:51 125 244 / .10; --tint-green:62 237 155 / .20; --tint-orange:245 130 30 / .14; --tint-red:245 59 58 / .12;
  --fill:0 0 0 / .04; --fill-2:0 0 0 / .06; --border:0 0 0 / .08; --border-subtle:0 0 0 / .06;
  --c-text:rgb(var(--text-primary)); --c-muted:rgb(var(--text-secondary)); --c-subtle:rgb(var(--text-tertiary));
  --c-bg:rgb(var(--bg-page)); --c-elevated:rgb(var(--bg-elevated));
  --c-line:rgb(var(--border)); --c-line-2:rgb(var(--border-subtle)); --c-accent:rgb(var(--accent));
  --font-sans:"Geist","Helvetica Neue",Arial,sans-serif; --font-ui:"Inter","Segoe UI",system-ui,sans-serif;
  --font-mono:"Geist Mono","IBM Plex Mono",ui-monospace,Menlo,monospace;
  --fluid-display:clamp(2.5rem,1.6rem + 2.8vw,4rem);
  --fluid-h1:clamp(2.25rem,1rem + 2.25vw,4rem); --fluid-h2:clamp(1.75rem,1.2rem + 1.4vw,2.5rem); --fluid-title:clamp(1.5rem,1.1rem + 1vw,2rem);
  --gutter:clamp(1.125rem,-.1rem + 4.6vw,4rem);
  --space-hero-t:clamp(4rem,1.5rem + 8vw,7.5rem); --space-hero-b:clamp(3.5rem,1.5rem + 6vw,6rem);
  --space-head-t:clamp(2.5rem,1rem + 4.5vw,4.5rem); --space-head-b:clamp(1.75rem,1.2rem + 2vw,3rem);
  --space-sec-t:clamp(2.5rem,1.4rem + 3.5vw,3.75rem); --space-sec-b:clamp(3.5rem,2rem + 5vw,5.625rem);
  --space-body-t:clamp(1.75rem,1rem + 2.5vw,3rem);
  --frame:80rem; --h-nav:3.25rem;
  --r-xs:.25rem; --r-sm:.375rem; --r-md:.75rem; --r-lg:.875rem; --r-xl:1rem; --r-full:9999px;
  --shadow-float:0 2px 6px rgb(0 0 0 / .05),0 14px 36px rgb(0 0 0 / .12);
  --dur-fast:.15s; --dur:.2s; --ease:cubic-bezier(.2,0,0,1);
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .5 0 0 0 0 .5 0 0 0 0 .5 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --panel-sky:radial-gradient(120% 90% at 20% 10%,#cbd8e8 0,rgba(203,216,232,0) 60%),radial-gradient(90% 90% at 90% 90%,#b4cfd0 0,rgba(180,207,208,0) 65%),linear-gradient(160deg,#bac8da,#a8c4c8);
  --panel-haze:radial-gradient(100% 80% at 80% 0,#e8d5dd 0,rgba(232,213,221,0) 60%),radial-gradient(90% 90% at 10% 100%,#b9cbdc 0,rgba(185,203,220,0) 65%),linear-gradient(200deg,#c5d2e0,#b8ccd3);
  --panel-mist:radial-gradient(100% 100% at 50% 0,#dadde8 0,rgba(218,221,232,0) 60%),linear-gradient(180deg,#c3cedb,#b2c6cb);
}
@media (prefers-contrast:more){:root{--border:0 0 0 / .3;--border-subtle:0 0 0 / .2}}

/* ---------- base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:calc(var(--h-nav) + 1rem)}
body{margin:0;background:var(--c-bg);color:var(--c-text);font-family:var(--font-sans);font-size:1rem;line-height:1.4;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;min-height:100dvh;display:flex;flex-direction:column}
main{flex:1;display:flex;flex-direction:column}
main:focus{outline:none}
h1,h2,h3,h4,p,ul,ol,dl,dd,figure,blockquote{margin:0;padding:0;font-weight:400}
ul,ol{list-style:none}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
svg{display:block}
:focus-visible{outline:2px solid var(--c-accent);outline-offset:2px;border-radius:var(--r-xs)}
::selection{background:rgb(var(--accent) / .2)}
[hidden]{display:none!important}
.vh{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.mono{font-family:var(--font-mono)}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* ---------- frame ---------- */
.band{border-top:1px solid var(--c-line-2)}
.frame{position:relative;width:100%;max-width:var(--frame);margin-inline:auto;padding-inline:var(--gutter)}
.frame::before,.frame::after{content:"";position:absolute;top:0;bottom:0;width:0;border-left:1px dashed rgb(0 0 0 / .14);pointer-events:none}
.frame::before{left:0}.frame::after{right:0}
.sec{padding-block:var(--space-sec-t) var(--space-sec-b)}
.sec--tight{padding-top:var(--space-body-t)}
.page-body{padding-block:var(--space-body-t) var(--space-sec-b)}
.sec-head,.phead{display:flex;flex-wrap:wrap;gap:1rem 2rem;justify-content:space-between}
.sec-head{align-items:flex-start;margin-bottom:2.5rem}
.phead{align-items:flex-end;padding-block:var(--space-head-t) var(--space-head-b)}
.sec-head>:first-child,.phead>:first-child{flex:1 1 24rem}
.sec-head>.sec-desc,.phead>.sec-desc{flex:0 1 21.25rem}
.sec-num{font-size:var(--fluid-h2);line-height:1;letter-spacing:-.03em;color:var(--c-subtle)}
.sec-title{font-size:var(--fluid-h2);line-height:1.1;letter-spacing:-.03em;margin-top:.5rem}
.sec-desc{font-size:.8125rem;line-height:1.55;color:var(--c-muted);font-family:var(--font-ui);letter-spacing:-.005em}
.meta{font:400 .6875rem/1.4 var(--font-mono);letter-spacing:.04em;text-transform:uppercase;color:var(--c-subtle)}
.phead .meta{margin-bottom:1rem}

/* ---------- nav ---------- */
.topbar{position:sticky;top:0;z-index:50;background:rgb(248 248 248 / .92);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--c-line-2)}
.topbar .frame{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:0 1.5rem;min-height:var(--h-nav)}
.logo{display:inline-flex;align-items:center;gap:.5rem;min-height:2.75rem;font-size:1.25rem;line-height:1;letter-spacing:-.02em;white-space:nowrap}
.logo svg{width:1.25rem;height:1.25rem}
.logo b{font-weight:400;color:var(--c-subtle)}
.topnav ul{display:flex;flex-wrap:wrap;gap:.125rem;align-items:center}
.topnav a{height:1.75rem;padding:0 .75rem;border-radius:var(--r-full);font-size:.875rem;color:var(--c-muted);display:inline-flex;align-items:center;transition:background-color var(--dur-fast),color var(--dur-fast)}
.topnav a:is(:hover,[aria-current=page]){background:rgb(var(--fill));color:var(--c-text)}
.topnav a.cta-pill{background:rgb(var(--bg-primary));color:rgb(var(--text-white));margin-left:.5rem}
.topnav a.cta-pill:hover{background:rgb(var(--text-primary))}
.navtoggle{display:none;height:1.75rem;padding:0 .75rem;border-radius:var(--r-full);font-size:.875rem;color:var(--c-muted);align-items:center}
.navtoggle:is(:hover,[aria-expanded=true]){background:rgb(var(--fill));color:var(--c-text)}
@media (max-width:52rem){
  .js .navtoggle{display:inline-flex}
  .js .topnav{display:none;position:absolute;left:0;right:0;top:var(--h-nav);max-height:calc(100dvh - var(--h-nav));overflow-y:auto;padding:.25rem var(--gutter) 1rem;background:var(--c-bg);border-bottom:1px solid var(--c-line-2)}
  .js .topnav.open{display:block}
  .js .topnav ul{display:block}
  .js .topnav a,.js .topnav a.cta-pill{display:flex;height:auto;min-height:3rem;padding:.875rem 0;margin:0;border-radius:0;font-size:1.375rem;letter-spacing:-.02em;color:var(--c-text);border-top:1px solid var(--c-line-2);background:none}
  .js .topnav li:first-child a{border-top:0}
}

/* ---------- actions & links ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.375rem;height:2.625rem;padding:0 1.25rem;border-radius:var(--r-full);font-size:1rem;line-height:1.5;border:.8px solid transparent;white-space:nowrap;transition:background-color var(--dur),border-color var(--dur),transform var(--dur)}
.btn.primary{background:rgb(var(--bg-primary));color:rgb(var(--text-white))}
.btn.primary:hover{background:rgb(var(--text-primary))}
.btn.primary:active{transform:scale(.98)}
.btn.outline{border-color:rgb(var(--border))}
.btn.outline:hover{background:rgb(var(--fill-2))}
.btn.ghost:hover{background:rgb(var(--fill))}
.a{color:rgb(var(--link));text-decoration:underline;text-decoration-color:rgb(var(--link) / .35);text-decoration-thickness:1px;text-underline-offset:3px;transition:text-decoration-color var(--dur-fast)}
.a:is(:hover,:focus-visible){text-decoration-color:currentColor}
.link-muted{color:var(--c-subtle);transition:color var(--dur-fast)}
.link-muted:is(:hover,:focus-visible){color:var(--c-text)}
.link-arrow{display:inline-flex;align-items:center;gap:.375rem;color:rgb(var(--link));font-size:.875rem;line-height:1.5}
.link-arrow svg{width:.75rem;height:.75rem;transition:transform var(--dur) var(--ease)}
.link-arrow:hover svg{transform:translateX(3px)}
.skip{position:absolute;left:.75rem;top:-4rem;z-index:300;height:2.25rem;padding:0 1rem;display:inline-flex;align-items:center;border-radius:var(--r-full);background:rgb(var(--bg-primary));color:rgb(var(--text-white));font-size:.875rem;transition:top var(--dur) var(--ease)}
.skip:focus{top:.75rem}
.acts{display:flex;gap:.625rem;flex-wrap:wrap;margin-top:2.25rem}

/* ---------- type ---------- */
.h-display{font-size:var(--fluid-display);line-height:1;letter-spacing:-.03em;text-wrap:balance}
.h-h1{font-size:var(--fluid-h1);line-height:1.04;letter-spacing:-.03em;text-wrap:balance}
.h-h2{font-size:var(--fluid-h2);line-height:1.08;letter-spacing:-.03em;text-wrap:balance}
.h-title{font-size:var(--fluid-title);line-height:1.18;letter-spacing:-.02em}
.two-tone .lead{display:block;color:rgb(var(--lead))}
.two-tone .tail{display:block}
.prose{font-size:1rem;line-height:1.65;color:rgb(var(--text-primary) / .8);max-width:42rem;text-wrap:pretty}
.prose>*+*{margin-top:1em}
.prose h2{font-size:var(--fluid-title);line-height:1.18;letter-spacing:-.02em;color:var(--c-text);margin-top:1.8em;text-wrap:balance}
.prose>h2:first-child{margin-top:0}
.prose strong{font-weight:500;color:var(--c-text)}
.lede{font-size:clamp(1.125rem,1rem + .5vw,1.375rem);line-height:1.4;letter-spacing:-.01em;color:var(--c-muted);max-width:42rem;text-wrap:pretty}
.quote{padding-left:1.25rem;border-left:2px solid rgb(var(--border));font-size:1.125rem;line-height:1.5;letter-spacing:-.01em;color:var(--c-text);max-width:42rem}
.quote cite{display:block;margin-top:.625rem;font:400 .8125rem/1.4 var(--font-ui);color:var(--c-subtle);font-style:normal;letter-spacing:0}
.ul{display:grid;gap:.5rem;font-size:1rem;line-height:1.5;color:rgb(var(--text-primary) / .8)}
.ul>li{position:relative;padding-left:1.25rem}
.ul>li::before{content:"";position:absolute;left:.3125rem;top:.625rem;width:4px;height:4px;border-radius:50%;background:rgb(var(--text-primary) / .4)}
.chips{display:flex;flex-wrap:wrap;gap:.375rem}
.chip{display:inline-flex;align-items:center;padding:2px .5rem;border-radius:var(--r-md);background:rgb(var(--fill-2));color:var(--c-muted);font:400 .75rem/1rem var(--font-ui)}

/* ---------- surfaces: panels, glass, cards ---------- */
.panel{position:relative;overflow:hidden;isolation:isolate;background:var(--panel-sky)}
.panel::after{content:"";position:absolute;inset:0;background-image:var(--grain);opacity:.18;mix-blend-mode:overlay;pointer-events:none;z-index:-1}
.panel.haze{background:var(--panel-haze)}.panel.mist{background:var(--panel-mist)}
.glass{background:rgb(255 255 255 / .86);-webkit-backdrop-filter:blur(14px) saturate(1.2);backdrop-filter:blur(14px) saturate(1.2);border-radius:var(--r-md);box-shadow:var(--shadow-float)}
.app{font-family:var(--font-ui);font-size:.75rem;line-height:1.35;letter-spacing:-.005em}
.panel .glass{position:absolute;left:10%;right:10%;top:14%;padding:.75rem .875rem}
.vhead{display:flex;justify-content:space-between;gap:.75rem;margin-bottom:.5rem;font-weight:500;font-size:.8125rem}
.vhead small{font:400 .6875rem var(--font-mono);color:var(--c-subtle);letter-spacing:.02em}
.vrow{display:flex;align-items:center;gap:.5rem;margin:.375rem 0}
.vrow .tx{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vrow .v{font:400 .6875rem var(--font-mono);color:var(--c-subtle)}
.dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--c-accent);flex:none}
.dot.g{background:rgb(var(--success))}.dot.o{background:rgb(var(--warning))}.dot.r{background:rgb(var(--danger))}.dot.n{background:rgb(var(--text-tertiary))}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,20rem),1fr));gap:2rem .75rem}
.acard{display:grid;gap:.875rem;width:100%;height:100%;align-content:start;border-radius:var(--r-lg)}
.acard .panel{aspect-ratio:16/11;border-radius:var(--r-lg)}
.acard h3{font-size:1.25rem;line-height:1.2;letter-spacing:-.01em;transition:color var(--dur-fast)}
.acard p:not(.meta){font-size:.875rem;line-height:1.43;color:var(--c-muted)}
.acard:is(:hover,:focus-visible) h3{color:var(--c-accent)}
.acard:focus-visible{outline-offset:6px}

/* ---------- rows ---------- */
.rows{container-type:inline-size}
.rows>li{border-top:1px solid var(--c-line-2)}
.rows>li:last-child{border-bottom:1px solid var(--c-line-2)}
.rowline{position:relative;display:grid;align-items:center;gap:1rem;padding:.875rem 0}
a.rowline:focus-visible{outline-offset:-2px;background:rgb(var(--fill))}
.rowline .ic{width:.875rem;height:.875rem;color:var(--c-subtle);transition:transform var(--dur) var(--ease),color var(--dur)}
a.rowline:is(:hover,:focus-visible) .ic{transform:translateX(3px);color:var(--c-text)}
a.rowline:is(:hover,:focus-visible) :is(.t,.n){text-decoration:underline;text-decoration-color:rgb(0 0 0 / .25);text-underline-offset:4px}
.changelog{grid-template-columns:5.6875rem 1fr auto 1.25rem}
.changelog .d{color:var(--c-subtle);font-family:var(--font-mono)}
.changelog .t{font-size:1rem}
.changelog .t small{display:block;margin-top:.125rem;font-size:.875rem;line-height:1.4;color:var(--c-muted)}
.changelog .c{font-size:.875rem;color:var(--c-subtle)}
.res{grid-template-columns:minmax(8rem,13rem) 1fr auto 1.25rem}
.res .n{font-size:1rem}
.res .w{font-size:.875rem;color:var(--c-muted)}
.res .c{font-size:.875rem;color:var(--c-subtle)}
.xp{grid-template-columns:9rem 1fr auto;padding-block:.875rem}
.xp .p{font:400 .75rem/1.4 var(--font-mono);color:var(--c-subtle)}
.xp .o{font-size:.875rem;color:var(--c-muted)}
@container (max-width:40rem){
  .changelog{grid-template-columns:1fr auto;gap:.25rem .75rem}
  .changelog .d{grid-column:1/-1;font-size:.6875rem;letter-spacing:.04em;text-transform:uppercase}
  .changelog .c{grid-column:1/-1}
  .changelog .ic{display:none}
  .xp{grid-template-columns:1fr;gap:.125rem}
}
@container (max-width:45rem){
  .res{grid-template-columns:1fr auto;gap:.125rem .75rem}
  .res .w{grid-column:1/-1;order:3}
  .res .ic{display:none}
}

/* ---------- steps, table, facts ---------- */
.steps{counter-reset:s;container-type:inline-size}
.steps>li{counter-increment:s;display:grid;grid-template-columns:3.25rem minmax(0,1fr) minmax(0,1.1fr);gap:.25rem 1rem;padding:1.25rem 0;border-top:1px solid var(--c-line-2)}
.steps>li:last-child{border-bottom:1px solid var(--c-line-2)}
.steps>li::before{content:counter(s,decimal-leading-zero);font-size:1.75rem;font-weight:300;letter-spacing:-.02em;line-height:1;color:var(--c-subtle)}
.steps h3{font-size:1.25rem;line-height:1.2;letter-spacing:-.01em}
.steps p{font-size:.875rem;line-height:1.5;color:var(--c-muted)}
@container (max-width:40rem){.steps>li{grid-template-columns:3.25rem 1fr}.steps>li>p{grid-column:2}}
.tw{width:100%;overflow-x:auto}
.table{width:100%;border-collapse:collapse;font:400 .875rem/1.43 var(--font-sans);text-align:left;font-variant-numeric:tabular-nums}
.table th{font:400 .8125rem/1.4 var(--font-ui);color:var(--c-subtle);padding:.625rem 1rem;border-bottom:1px solid var(--c-line);white-space:nowrap;text-align:left}
.table td,.table tbody th{padding:.8125rem 1rem;border-top:1px solid var(--c-line-2);vertical-align:top}
.table tbody th{font-weight:400;color:var(--c-text)}
.table tbody tr:first-child :is(td,th){border-top:0}
.table .num{text-align:right}
.table .good{color:rgb(var(--success))}
.table :is(th,td):first-child{padding-left:0}
.table :is(th,td):last-child{padding-right:0}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,9rem),1fr));gap:0 2rem;border-top:1px solid var(--c-line-2);margin-bottom:2rem}
.facts>div{padding:.875rem 0;display:grid;gap:.25rem;align-content:start}
.facts dt{font:400 .6875rem/1.4 var(--font-mono);letter-spacing:.04em;text-transform:uppercase;color:var(--c-subtle)}
.facts dd{font-size:.875rem;line-height:1.43}
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.stat{display:grid;gap:.375rem;padding:1.5rem 1.5rem 1.5rem 0;align-content:start}
.stat+.stat{padding-left:1.5rem;border-left:1px solid var(--c-line-2)}
.stat .v{font-size:clamp(2.25rem,1.5rem + 2.4vw,3.5rem);font-weight:300;line-height:1;letter-spacing:-.03em}
.stat .l{font:400 .8125rem/1.4 var(--font-ui);color:var(--c-muted)}
@media (max-width:64rem){.stats{grid-template-columns:1fr 1fr}.stat:nth-child(odd){padding-left:0;border-left:0}.stat:nth-child(n+3){border-top:1px solid var(--c-line-2)}}
@media (max-width:30rem){.stats{grid-template-columns:1fr}.stat,.stat+.stat{padding-left:0;padding-right:0;border-left:0}.stat+.stat{border-top:1px solid var(--c-line-2)}}

/* ---------- page patterns ---------- */
.hero{padding-block:var(--space-hero-t) var(--space-hero-b)}
.hero h1{max-width:20em}
.hero .sub{margin-top:1.75rem;max-width:32rem;font-size:1.0625rem;line-height:1.5;color:var(--c-muted)}
.ahead{padding-block:var(--space-head-t) var(--space-body-t);display:grid;gap:1.25rem;justify-items:start}
.ahead>*{max-width:44rem}
.ahead .acts{margin-top:.5rem}
.crumb a{display:inline-flex;align-items:center;min-height:1.5rem}
.leadpanel{height:clamp(13rem,6rem + 28vw,30rem);border-radius:var(--r-xl);margin-bottom:2.5rem}
.leadpanel .glass{left:50%;right:auto;top:50%;transform:translate(-50%,-50%);width:min(80%,26rem);padding:1rem 1.125rem}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:2rem clamp(2rem,6vw,5rem)}
.split>*{min-width:0}
@media (max-width:52rem){.split{grid-template-columns:1fr}}
.endnav{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-top:4rem;padding-top:1.25rem;border-top:1px solid var(--c-line-2);font-size:.875rem}
.endnav a{display:inline-flex;align-items:center;min-height:1.5rem}
.cta{text-align:center;padding-block:clamp(4.5rem,2rem + 8vw,7.5rem)}
.cta .acts{justify-content:center;margin-top:2.25rem}
.foot{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:2rem;padding-block:3.75rem 2rem}
.foot h2{font-size:.875rem;margin-bottom:.75rem}
.foot li+li{margin-top:.375rem}
.foot a{font-size:.875rem;color:var(--c-subtle);transition:color var(--dur-fast);display:inline-flex;min-height:1.5rem;align-items:center}
.foot a:is(:hover,:focus-visible){color:var(--c-text)}
.foot .logo{color:rgb(var(--text-primary) / .5);font-size:1.75rem}
.foot .logo svg{width:1.75rem;height:1.75rem}
.foot .meta{margin-top:3rem;line-height:1.7}
.foot-base{display:flex;justify-content:space-between;flex-wrap:wrap;gap:.5rem 1rem;padding-block:1rem 1.5rem;border-top:1px solid var(--c-line-2)}
@media (max-width:52rem){.foot{grid-template-columns:1fr 1fr}.foot>:first-child{grid-column:1/-1}}
@media (max-width:30rem){.foot{grid-template-columns:1fr}}

/* people */
.person .portrait{height:clamp(11rem,8rem + 12vw,16rem);border-radius:var(--r-lg);display:grid;place-items:center;margin-top:1.5rem}
.person .portrait span{font-size:clamp(3.5rem,2.5rem + 4vw,6rem);font-weight:300;letter-spacing:-.05em;line-height:1;color:rgb(var(--text-primary) / .5)}
.person .role{margin-top:.75rem}
.person .prose>*+*{margin-top:1em}
.person .facts{margin-top:2rem;margin-bottom:0}
.person .quote{margin-top:2rem}

/* forms */
.form{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem 1rem;max-width:40rem}
.form .full{grid-column:1/-1}
@media (max-width:34rem){.form{grid-template-columns:1fr}}
.lbl{font-size:.875rem;line-height:1.25rem;margin-bottom:.375rem;display:block}
.hint{font:400 .75rem/1rem var(--font-ui);color:var(--c-subtle);margin-top:.375rem}
.input,.select,.textarea{width:100%;height:2.25rem;padding:0 .75rem;border-radius:var(--r-sm);border:1px solid rgb(var(--border));background:var(--c-elevated);color:var(--c-text);font:400 .875rem/1.25rem var(--font-sans);transition:border-color var(--dur),box-shadow var(--dur)}
.input::placeholder,.textarea::placeholder{color:var(--c-subtle)}
.input:hover,.select:hover,.textarea:hover{border-color:rgb(0 0 0 / .18)}
.input:focus,.select:focus,.textarea:focus{outline:none;border-color:var(--c-accent);box-shadow:0 0 0 3px rgb(var(--accent) / .16)}
.input.invalid{border-color:rgb(var(--danger));box-shadow:0 0 0 3px rgb(var(--tint-red))}
.textarea{height:auto;min-height:7.5rem;padding:.5rem .75rem;resize:vertical}
.select{appearance:none;padding-right:2rem;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none' stroke='%23191919' stroke-opacity='.56' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 4.5 6 7.5l3-3'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .75rem center}
.status{display:flex;align-items:center;gap:.5rem;font:400 .8125rem/1.4 var(--font-ui);color:var(--c-muted)}

/* disclosure */
.acc details{border-top:1px solid var(--c-line-2)}
.acc details:last-child{border-bottom:1px solid var(--c-line-2)}
.acc summary{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 0;font-size:1rem;line-height:1.5;cursor:pointer;list-style:none}
.acc summary::-webkit-details-marker{display:none}
.acc summary::after{content:"+";font-size:1.25rem;line-height:1;color:var(--c-subtle);transition:transform var(--dur) var(--ease)}
.acc details[open] summary::after{transform:rotate(45deg)}
.acc .ans{padding:0 2.5rem 1.125rem 0;color:var(--c-muted);font-size:.875rem;line-height:1.55;max-width:42rem}

/* toast */
.toast{position:fixed;bottom:1.5rem;left:50%;transform:translate(-50%,1.25rem);padding:.5rem .875rem;border-radius:var(--r-full);background:rgb(var(--text-primary));color:#fff;font-size:.875rem;opacity:0;pointer-events:none;transition:opacity var(--dur),transform var(--dur)}
.toast.show{opacity:1;transform:translate(-50%,0)}
@media (forced-colors:active){.btn.primary{border-color:ButtonText}.panel{forced-color-adjust:none}}
@media print{.topbar,.skip,.endnav{display:none}.frame::before,.frame::after{display:none}}