/* /assets/css/fonts.css */
@font-face{font-family:'Spectral';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/spectral-latin-400.bcb83e9c56.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Spectral';font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/spectral-latin-500.79ce505722.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Spectral';font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/spectral-latin-600.1fb6ca29fc.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Spectral';font-style:italic;font-weight:500;font-display:swap;src:url(/assets/fonts/spectral-latin-500-italic.a0533b33dd.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:400 700;font-display:swap;src:url(/assets/fonts/hanken-grotesk-latin-var.1f21c6eaa0.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Spline Sans Mono';font-style:normal;font-weight:400 500;font-display:swap;src:url(/assets/fonts/spline-sans-mono-latin-var.2b193a4f0f.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* /assets/css/template.css */
:root{
  --canvas:#F4F4F4;          
  --surface-1:#E9E9E9;       
  --surface-2:#DCDCDC;       
  --ink:#1F1F1F;             
  --ink-2:#4A4A4A;           
  --accent:#5A5A5A;          
  --accent-deep:#3A3A3A;     
  --accent-decor:#B8B8B8;    
  --accent-ink:#FFFFFF;      
  --line:rgba(31,31,31,.10);     
  --tile-ring:rgba(31,31,31,.08);
  --band:#1E1E1E;                  
  --band-slot:#262626;             
  --band-ink:#F2F2F2;              
  --band-accent:#C9C9C9;           
  --band-line:rgba(201,201,201,.22);   
  --band-ink-2:rgba(242,242,242,.72);  
  --sqfill-1:var(--surface-1);
  --sqfill-2:var(--surface-2);
  --sqfill-canvas:var(--canvas);
  --sqfill-band:var(--band);
  --sq-outline-color:var(--tile-ring);
  --metal:linear-gradient(100deg,#6E6E6E 0%,#BFBFBF 30%,#FFFFFF 50%,#C8C8C8 66%,#5E5E5E 100%);
  --metal-text:linear-gradient(100deg,#3E3E3E 0%,#5C5C5C 50%,#3E3E3E 100%);        
  --metal-button:linear-gradient(100deg,#BFBFBF 0%,#D6D6D6 30%,#FFFFFF 50%,#D6D6D6 66%,#BFBFBF 100%); 
  --field-line:#8C8C8C;        
  --shadow-obj:0 6px 22px rgba(20,20,20,.12);   
  --slot-hatch:rgba(31,31,31,.025);              
  --band-slot-hatch:rgba(201,201,201,.05);       
  --btn-primary-ic-bg:rgba(0,0,0,.14);           
  --font-head:'Spectral','Iowan Old Style',Georgia,serif;
  --font-body:'Hanken Grotesk',system-ui,sans-serif;
  --font-mono:'Spline Sans Mono',ui-monospace,monospace;
  --weight-head:500;                              
  --sq-xs:8px; --sq-sm:12px; --sq:16px; --sq-lg:24px;
  --sq-smooth:1;
  --num-radius:12px;          
  --ease-reveal:cubic-bezier(.22,1,.36,1);
  --ease-press:cubic-bezier(.32,.72,0,1);
  --ease-pop:cubic-bezier(.19,1,.22,1);
  --ease-settle:cubic-bezier(.16,1,.3,1);
  --maxw:1240px;
  --seam:3px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--canvas); color:var(--ink); font-family:var(--font-body);
  font-size:17px; line-height:1.65; -webkit-font-smoothing:antialiased;
  text-rendering:geometricPrecision; min-height:100dvh;
  overflow-x:hidden;
}
img,video{max-width:100%;display:block}
.wrap{max-width:var(--maxw); margin-inline:auto; padding-inline:20px}
@media(min-width:1024px){ .wrap{padding-inline:40px} }
h1,h2,h3,h4{font-family:var(--font-head); font-weight:var(--weight-head); text-wrap:balance; letter-spacing:-.012em; color:var(--ink)}
h1{font-size:clamp(2.6rem,6.4vw,4.6rem); line-height:1.02}
h2{font-size:clamp(1.9rem,3.6vw,2.8rem); line-height:1.1}
h3{font-size:clamp(1.25rem,2vw,1.55rem); line-height:1.2}
h4{font-size:1.12rem; line-height:1.25}
.h3{font-size:clamp(1.25rem,2vw,1.55rem); line-height:1.2}
.h4{font-size:1.12rem; line-height:1.25}
p{max-width:66ch; text-wrap:pretty; color:var(--ink-2)}
li{text-wrap:pretty}
.nowrap{white-space:nowrap}
.page-hero h1{font-size:clamp(2.2rem,5vw,4.2rem); line-height:1.04}
@media(max-width:640px){ .wrap > .page-hero{padding-inline:0} }
section{padding-block:clamp(64px,9vw,116px)}
.mono{font-family:var(--font-mono); font-variant-numeric:tabular-nums; font-feature-settings:"tnum"}
.eyebrow{font-family:var(--font-mono); font-size:11px; letter-spacing:.18em;
  text-transform:uppercase; color:var(--accent); display:inline-block; font-weight:500}
.lede{font-size:clamp(1.06rem,1.4vw,1.22rem); color:var(--ink-2); line-height:1.55}
.gilt{
  font-family:var(--font-head); font-style:italic; font-weight:var(--weight-head);
  background:var(--metal-text); background-size:220% 100%;
  -webkit-background-clip:text; background-clip:text; color:transparent;
  line-height:1.1; padding-bottom:.04em; background-position:50% 0;
  animation:shimmer 1.8s var(--ease-reveal) .35s 1 both;
}
@keyframes shimmer{from{background-position:0% 0}to{background-position:50% 0}}
.sq{
  --squircle-radius:var(--sq);
  --squircle-smooth:var(--sq-smooth);
  --squircle-fill:var(--sqfill-1);
  background-image:paint(squircle);
  background-color:transparent;
}
.sq-xs{--squircle-radius:var(--sq-xs)}
.sq-sm{--squircle-radius:var(--sq-sm)}
.sq-lg{--squircle-radius:var(--sq-lg)}
.fill-dune1{--squircle-fill:var(--sqfill-1)}
.fill-dune2{--squircle-fill:var(--sqfill-2)}
.fill-canvas{--squircle-fill:var(--sqfill-canvas)}
.fill-band{--squircle-fill:var(--sqfill-band)}
.sq-mask{
  --squircle-radius:var(--sq);
  --squircle-smooth:var(--sq-smooth);
  mask-image:paint(squircle);
  -webkit-mask-image:paint(squircle);
}
.sq-mask.sq-lg{--squircle-radius:var(--sq-lg)}
.sq-mask.sq-sm{--squircle-radius:var(--sq-sm)}
@supports not (background:paint(squircle)){
  .sq{background-image:none;background-color:var(--sqfill-1);border-radius:var(--sq)}
  .sq.sq-xs{border-radius:var(--sq-xs)} .sq.sq-sm{border-radius:var(--sq-sm)} .sq.sq-lg{border-radius:var(--sq-lg)}
  .sq.fill-dune2{background-color:var(--sqfill-2)}
  .sq.fill-canvas{background-color:var(--sqfill-canvas)}
  .sq.fill-band{background-color:var(--sqfill-band)}
  .sq-mask{mask-image:none;-webkit-mask-image:none;border-radius:var(--sq);overflow:hidden}
  .sq-mask.sq-lg{border-radius:var(--sq-lg)} .sq-mask.sq-sm{border-radius:var(--sq-sm)}
}
.band{
  position:relative; padding:3px; background:var(--canvas);
}
.band__inner{
  --squircle-radius:var(--sq-lg);
  --squircle-smooth:var(--sq-smooth);
  --squircle-fill:var(--sqfill-band);
  background-image:paint(squircle); background-color:transparent;
  color:var(--band-ink);
  padding-block:clamp(72px,10vw,128px); padding-inline:clamp(24px,5vw,72px);
}
@supports not (background:paint(squircle)){
  .band__inner{background-image:none;background-color:var(--sqfill-band);border-radius:var(--sq-lg)}
}
.band h1,.band h2,.band h3,.band h4{color:var(--band-ink)}
.band p{color:var(--band-ink-2)}
.band .eyebrow{color:var(--band-accent)}
.band .mono{color:var(--band-accent)}
.band-content{max-width:var(--maxw); margin-inline:auto}
.band-rule{
  height:1px; width:100%; background:var(--band-line);
  transform-origin:left center; transform:scaleX(0);
}
.band.in .band-rule{transform:scaleX(1); transition:transform 1100ms var(--ease-reveal)}
.nav-spacer{height:84px}
.nav{position:fixed; top:var(--seam); left:0; right:0; z-index:100;
  display:flex; justify-content:center; padding-inline:var(--seam); pointer-events:none}
.island{
  pointer-events:auto; width:100%; max-width:var(--maxw);
  display:flex; align-items:center; gap:24px;
  padding:9px 9px 9px 22px;
  --squircle-radius:var(--sq); --squircle-smooth:var(--sq-smooth); --squircle-fill:var(--sqfill-1);
  background-image:paint(squircle); background-color:transparent;
}
@supports not (background:paint(squircle)){
  .island{background-image:none;background-color:var(--sqfill-1);border-radius:var(--sq)}
}
.brand{display:flex; align-items:center; gap:10px; font-family:var(--font-head);
  font-size:18px; letter-spacing:.01em; color:var(--ink); text-decoration:none; min-height:44px}
.seal{width:22px; height:22px; border-radius:9999px; border:2px solid transparent;
  background:linear-gradient(var(--surface-1),var(--surface-1)) padding-box, var(--metal) border-box;
  position:relative; flex:none}
.seal::after{content:""; position:absolute; inset:5px 0 5px 5px; width:2px;
  background:var(--accent); border-radius:2px}
.nav-links{display:flex; gap:22px; font-size:14px; margin-left:auto}
.nav-links a{color:var(--ink-2); text-decoration:none; transition:color .3s var(--ease-press);
  display:inline-flex; align-items:center; min-height:44px}
.nav-links a:hover{color:var(--accent)}
@media(max-width:820px){ .nav-links{display:none} .island{gap:12px} }
.cta-row{display:flex; gap:14px; flex-wrap:wrap; align-items:center}
.btn{display:inline-flex; align-items:center; gap:10px; font-family:var(--font-body);
  font-weight:600; font-size:15px; line-height:1.3; border-radius:9999px; padding:9px 9px 9px 22px;
  min-height:48px; justify-content:center;
  cursor:pointer; border:0; text-decoration:none; white-space:nowrap;
  transition:transform .25s var(--ease-press), color .25s var(--ease-press), border-color .25s var(--ease-press),
    background-color .25s var(--ease-press)}
.btn:active{transform:scale(.98)}
.btn-primary{background:var(--metal-button); background-size:220% 100%; background-position:50% 0; color:var(--accent-ink);
  animation:shimmer 1.8s var(--ease-reveal) .35s 1 both}
.btn-primary .ic{background:var(--btn-primary-ic-bg)}
.btn-ghost{background-color:transparent; color:var(--accent);
  border:1px solid var(--accent); padding:9px 22px}
.btn-ghost:hover{color:var(--accent-deep); border-color:var(--accent-deep); background-color:color-mix(in srgb,var(--accent) 7%,transparent)}
.ic{width:30px; height:30px; border-radius:9999px; display:grid; place-items:center;
  transition:transform .25s var(--ease-press)}
.btn-primary:hover .ic{transform:translate(2px,-1px) scale(1.05)}
.ic svg{width:14px; height:14px}
.band .btn-ghost{color:var(--band-accent); border-color:var(--band-line)}
.band .btn-ghost:hover{color:var(--band-ink); border-color:var(--band-accent); background-color:color-mix(in srgb,var(--band-accent) 12%,transparent)}
.slot{
  position:relative; display:grid; place-items:center; text-align:center;
  background:
    repeating-linear-gradient(135deg,var(--slot-hatch) 0 14px,transparent 14px 28px),
    var(--surface-2);
  color:var(--ink-2); min-height:160px; padding:20px;
  --squircle-radius:var(--sq); --squircle-smooth:var(--sq-smooth);
  -webkit-mask-image:paint(squircle); mask-image:paint(squircle);
}
.slot.sq-lg{--squircle-radius:var(--sq-lg)}
@supports not (background:paint(squircle)){
  .slot{-webkit-mask-image:none;mask-image:none;border-radius:var(--sq);overflow:hidden}
  .slot.sq-lg{border-radius:var(--sq-lg)}
}
.slot .tag{font-family:var(--font-mono); font-size:10.5px; letter-spacing:.12em;
  text-transform:uppercase; color:var(--accent); opacity:.9}
.slot .desc{font-size:12.5px; margin-top:6px; max-width:34ch; color:var(--ink-2)}
.band .slot{
  background:
    repeating-linear-gradient(135deg,var(--band-slot-hatch) 0 14px,transparent 14px 28px),
    var(--band-slot);
  color:var(--band-ink-2);
}
.band .slot .tag{color:var(--band-accent)}
.band .slot .desc{color:var(--band-ink-2)}
.reveal{opacity:1; transform:none}
@keyframes settle{from{opacity:0; transform:translate3d(0,14px,0)}to{opacity:1; transform:none}}
.hero-content > *, .page-hero > *, #quote .quote-box > *, .cat-hero > *, .prog-hero > *{
  animation:settle 600ms var(--ease-settle) both}
.hero-content > :nth-child(2), .page-hero > :nth-child(2), #quote .quote-box > :nth-child(2),
.cat-hero > :nth-child(2), .prog-hero > :nth-child(2){animation-delay:70ms}
.hero-content > :nth-child(3), .page-hero > :nth-child(3), #quote .quote-box > :nth-child(3),
.cat-hero > :nth-child(3), .prog-hero > :nth-child(3){animation-delay:140ms}
.hero-content > :nth-child(n+4), .page-hero > :nth-child(n+4), #quote .quote-box > :nth-child(n+4),
.cat-hero > :nth-child(n+4), .prog-hero > :nth-child(n+4){animation-delay:210ms}
.pre{opacity:0}
.pre.in{animation:settle 600ms var(--ease-settle) both}
.tile{padding:clamp(22px,2.4vw,34px)}
.tile h3,.tile .h3{margin-top:6px}
.hairline{height:1px; background:var(--line); border:0; margin-block:0}
.cap{height:5px; width:46px; border-radius:9999px; background:var(--metal); margin-bottom:18px}
.corner-note{
  position:fixed; bottom:10px; right:12px; z-index:90;
  font-family:var(--font-mono); font-size:10px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--ink-2); opacity:.5; pointer-events:none;
}
.site-footer{padding:40px 0 64px; color:var(--ink-2); font-size:13px; text-align:center;
  font-family:var(--font-mono); letter-spacing:.04em}
.hero{padding:0 var(--seam); margin-top:0}
.hero-grid{display:flex; flex-direction:column; gap:var(--seam)}
@media(min-width:960px){ .hero-grid{display:grid; grid-template-columns:1fr 1.75fr} }
.hero-media{position:relative; min-height:18rem; overflow:hidden}
.hero-media .slot{min-height:100%; height:100%}
.hero-content{position:relative; padding:clamp(40px,6vw,72px) clamp(28px,4.5vw,72px); text-align:center}
.hero-content h1{margin:0 auto; max-width:14ch}
.hero-content .lede{margin:24px auto 30px; max-width:54ch}
.hero-content .cta-row{justify-content:center}
.hero-comp{position:relative; height:118px; margin:0 auto 8px; max-width:300px}
@media(min-width:960px){
  .hero-comp{position:absolute; top:46px; left:-2px; width:34%; height:auto; margin:0; z-index:5}
}
.hero-comp .obj{position:absolute; top:0; left:50%; width:120px; height:96px;
  transform:translateX(-50%); display:grid; place-items:center;
  background:var(--surface-2); color:var(--accent); font-family:var(--font-mono);
  font-size:9px; letter-spacing:.1em; text-transform:uppercase; text-align:center; padding:8px;
  --squircle-radius:var(--sq-sm); --squircle-smooth:1;
  -webkit-mask-image:paint(squircle); mask-image:paint(squircle);
  box-shadow:var(--shadow-obj)}
@supports not (background:paint(squircle)){ .hero-comp .obj{-webkit-mask-image:none;mask-image:none;border-radius:var(--sq-sm)} }
.hero-comp .obj:nth-child(1){z-index:3}
.hero-comp .obj:nth-child(2){z-index:1; transform:translateX(-86%) scale(.82) rotate(-4deg)}
.hero-comp .obj:nth-child(3){z-index:2; transform:translateX(-14%) scale(.82) rotate(4deg)}
.hero-proof{margin-top:18px; font-family:var(--font-mono); font-size:12px;
  letter-spacing:.06em; color:var(--accent)}
.bento{display:grid; gap:var(--seam); grid-template-columns:1fr}
@media(min-width:760px){
  .bento{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bento .feat{grid-column:span 2}
}
@media(min-width:1100px){
  .bento{grid-template-columns:repeat(4,minmax(0,1fr))}
  .bento .feat{grid-column:span 2; grid-row:span 2}
}
.ptile{display:flex; flex-direction:column}
.ptile .slot{min-height:140px; margin-bottom:16px}
.ptile.feat .slot{min-height:240px}
.ptile .one{font-size:14.5px; margin-top:8px; color:var(--ink-2)}
.ptile.feat .one{font-size:16px}
.split{display:grid; gap:32px; align-items:center; grid-template-columns:1fr}
@media(min-width:960px){ .split{grid-template-columns:1.1fr .9fr; gap:48px} }
.split .slot{min-height:300px}
.spotlight{max-width:780px; margin-inline:auto; text-align:center; padding:clamp(36px,5vw,60px)}
.spec-chip{display:inline-flex; align-items:baseline; gap:12px; margin-top:22px;
  padding:14px 22px; --squircle-radius:var(--sq-sm); --squircle-smooth:1; --squircle-fill:var(--sqfill-canvas);
  background-image:paint(squircle); background-color:transparent}
@supports not (background:paint(squircle)){ .spec-chip{background-image:none;background-color:var(--sqfill-canvas);border-radius:var(--sq-sm)} }
.spec-chip .big{font-family:var(--font-head); font-size:clamp(1.6rem,3vw,2.2rem); color:var(--accent)}
.spec-chip .lab{font-family:var(--font-mono); font-size:12px; color:var(--ink-2); letter-spacing:.04em; text-align:left}
.steps{display:grid; gap:var(--seam); grid-template-columns:1fr}
@media(min-width:760px){ .steps{grid-template-columns:repeat(3,1fr)} }
.step{padding-top:42px; position:relative}
.step .num{position:absolute; top:-18px; left:24px; width:40px; height:40px;
  display:grid; place-items:center; font-family:var(--font-mono); font-weight:500;
  color:var(--accent-ink); background:var(--metal-button);
  --squircle-radius:var(--num-radius); --squircle-smooth:1;
  -webkit-mask-image:paint(squircle); mask-image:paint(squircle)}
@supports not (background:paint(squircle)){ .step .num{-webkit-mask-image:none;mask-image:none;border-radius:var(--num-radius)} }
@media(min-width:760px){ .step:nth-child(2){margin-top:28px} }
.step h3{margin-bottom:8px}
.step p{font-size:15px}
.paths{display:grid; gap:var(--seam); grid-template-columns:1fr; margin:32px 0 26px}
@media(min-width:760px){ .paths{grid-template-columns:1fr 1fr} }
.path h3{margin-bottom:8px}
.path p{font-size:15px}
.close-line{font-family:var(--font-head); font-size:clamp(1.1rem,2vw,1.35rem);
  color:var(--ink); max-width:none; margin-bottom:24px}
.section-head{display:flex; flex-direction:column; gap:14px; margin-bottom:44px; max-width:48ch}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .gilt,.btn-primary{animation:none; background-position:50% 0}
  .reveal,.pre{opacity:1 !important; transform:none !important}
  .band-rule{transform:scaleX(1) !important; transition:none !important}
  *{transition:none !important; animation:none !important}
}

/* /assets/css/themes/graphite-leaf.css */
:root{
  --canvas:#F4F2EC;
  --surface-1:#EAE7DE;
  --surface-2:#DDD9CC;
  --ink:#1A1916;
  --ink-2:#46443E;
  --accent:#45423B;
  --accent-deep:#2E2C27;
  --accent-decor:#B89152;
  --accent-ink:#241B08;
  --line:rgba(26,25,22,.12);
  --tile-ring:rgba(26,25,22,.08);
  --band:#16140E;
  --band-slot:#201D14;
  --band-ink:#F0EBDD;
  --band-accent:#C9A458;
  --band-line:rgba(201,164,88,.24);
  --band-ink-2:rgba(240,235,221,.70);
  --sqfill-1:var(--surface-1);
  --sqfill-2:var(--surface-2);
  --sqfill-canvas:var(--canvas);
  --sqfill-band:var(--band);
  --sq-outline-color:var(--tile-ring);
  --metal:linear-gradient(100deg,#8A6A24 0%,#B89152 30%,#E2C886 50%,#B89152 66%,#7E5E1E 100%);
  --metal-text:linear-gradient(100deg,#7A5A1C 0%,#9A7432 38%,#A07A36 50%,#9A7432 62%,#7A5A1C 100%);
  --metal-button:linear-gradient(100deg,#A8834A 0%,#B89152 30%,#E2C886 50%,#B89152 66%,#A8834A 100%);
  --field-line:#84827A;
  --shadow-obj:0 7px 22px rgba(26,25,22,.14);
  --slot-hatch:rgba(26,25,22,.028);
  --band-slot-hatch:rgba(201,164,88,.05);
  --btn-primary-ic-bg:rgba(36,27,8,.16);
  --font-head:'Spectral','Iowan Old Style',Georgia,serif;
  --font-body:'Hanken Grotesk',system-ui,sans-serif;
  --font-mono:'Spline Sans Mono',ui-monospace,monospace;
  --weight-head:500;
  --sq-xs:8px; --sq-sm:12px; --sq:16px; --sq-lg:24px;
  --sq-smooth:1;
  --num-radius:12px;
}

/* /assets/css/inline.css */
.u-80d654f{text-decoration:none !important}
.u-8f3466a{margin:0 0 18px !important}
.u-69b2b1a{text-align:center !important; max-width:840px !important}
.u-1a2983b{margin:16px auto 0 !important; max-width:18ch !important}
.u-fde402d{max-width:120px !important; margin:24px auto 22px !important}
.u-bb08a92{margin-inline:auto !important; max-width:58ch !important; font-size:clamp(1.06rem,1.6vw,1.28rem) !important}
.u-9fb3d27{margin:0 auto 20px !important; max-width:24ch !important}
.u-12a52ae{margin:0 auto 28px !important; max-width:52ch !important; font-size:clamp(1rem,1.4vw,1.16rem) !important}
.u-16d7fcc{margin-bottom:48px !important}
.u-91a8701{text-align:center !important}
.u-aa7195e{max-width:80px !important; margin:0 auto 26px !important}
.u-745c601{font-size:clamp(1.9rem,4.2vw,3.1rem) !important; max-width:18ch !important; margin-inline:auto !important}
.u-33917d7{margin:18px auto 0 !important; max-width:44ch !important}
.u-4926234{max-width:42ch !important}
.u-e77fa00{max-width:20ch !important; margin-inline:auto !important}
.u-48aa572{margin:18px auto 30px !important; max-width:56ch !important}
.u-03c4bb6{justify-content:center !important}
.u-56f4356{margin-top:12px !important}
.u-cd7cf50{margin:14px 0 18px !important}
.u-87c136d{margin-bottom:16px !important}
.u-349507f{margin:14px 0 0 !important; color:var(--band-ink) !important}
.u-6498d9b{max-width:120px !important; margin:22px 0 20px !important}
.u-e441890{max-width:52ch !important; font-size:clamp(1.06rem,1.5vw,1.24rem) !important}
.u-c1a78f4{max-width:24ch !important}
.u-e91e9f3{max-width:48ch !important}
.u-15ea914{max-width:44ch !important}
.u-243c640{display:block !important; max-width:62ch !important}
.u-c1d9d10{font-size:clamp(1.06rem,1.5vw,1.24rem) !important}
.u-c011387{max-width:52ch !important}
.u-d219378{padding-bottom:clamp(24px,3vw,40px) !important}
.u-ef0b7a1{margin-bottom:0 !important}
.u-6cf1612{display:block !important; max-width:64ch !important}
.u-31607d4{padding-top:clamp(40px,6vw,72px) !important}
.u-ca03f4c{max-width:26ch !important}
.u-01a8c80{max-width:54ch !important}
.u-d34d921{margin-top:36px !important}
.u-37e8d35{margin:0 auto !important; max-width:22ch !important}
.u-662e54b{margin:18px auto 0 !important; max-width:54ch !important}
.u-6726845{margin:18px auto 0 !important; max-width:56ch !important}
.u-0e8c6b4{padding-top:clamp(24px,4vw,48px) !important}
.u-4260ebe{padding-top:0 !important}

/* /assets/css/site.css */
/* Production layer: loads after template.css, the theme and product.css. */

.visually-hidden{position:absolute !important; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0}

.skip-link{position:absolute; left:12px; top:-60px; z-index:200; padding:10px 16px;
  background:var(--ink); color:var(--canvas); border-radius:var(--sq-sm); text-decoration:none;
  font-size:14px; font-weight:600}
.skip-link:focus{top:12px}
.skip-link{min-height:44px; display:inline-flex; align-items:center}

/* the fixed nav never covers a focused element (WCAG 2.4.11) */
html{scroll-padding-top:104px}
@media(max-width:820px){ html{scroll-padding-top:84px} }
#main:focus{outline:none}

a:focus-visible, button:focus-visible, summary:focus-visible, select:focus-visible{outline:2px solid var(--accent); outline-offset:3px}
.btn:focus-visible{outline-offset:3px; border-radius:9999px}
.band a:focus-visible{outline-color:var(--band-accent)}

/* the success state hides the form; .qform{display:flex} must not override [hidden] */
.qform[hidden]{display:none}
/* required fields carry a visible marker (the label text itself is locked copy) */
.field:has(> [required]) > label::after{content:" *"; color:var(--ink); letter-spacing:0}

/* ---------- nav: disclosure menu under 820px ---------- */
.island{position:relative}
.nav-links a[aria-current="page"]{color:var(--ink)}
.nav-toggle{display:none; flex:none; width:44px; height:44px; border:0; border-radius:9999px;
  background:transparent; color:var(--ink); cursor:pointer; place-items:center}
.nav-toggle:hover{background:var(--surface-2)}
.nav-toggle-bars, .nav-toggle-bars::before, .nav-toggle-bars::after{
  display:block; width:18px; height:1.5px; background:currentColor; border-radius:2px;
  transition:transform .25s var(--ease-press), opacity .2s linear}
.nav-toggle-bars{position:relative}
.nav-toggle-bars::before, .nav-toggle-bars::after{content:""; position:absolute; left:0}
.nav-toggle-bars::before{top:-6px}
.nav-toggle-bars::after{top:6px}
.nav-toggle[aria-expanded="true"] .nav-toggle-bars{background:transparent}
.nav-toggle[aria-expanded="true"] .nav-toggle-bars::before{transform:translateY(6px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] .nav-toggle-bars::after{transform:translateY(-6px) rotate(-45deg)}

@media(max-width:820px){
  .island{flex-wrap:wrap; padding:6px 6px 6px 18px; gap:8px}
  .island .brand{margin-right:auto}
  .island > .btn-primary{padding:10px 18px; font-size:14px}
  .nav-links{display:flex; order:10; width:100%; margin:0; gap:4px 18px; flex-wrap:wrap;
    padding:4px 0 8px; font-size:15px}
}
/* The disclosure menu needs script (site.js toggles it). Keyed to the scripting media feature, not
   a class set by a script, so head.js can load async without a flash of the no-script nav. */
@media(max-width:820px) and (scripting:enabled){
  html .nav-toggle{display:grid}
  html .nav-links{display:none; position:absolute; top:calc(100% + var(--seam)); left:0; right:0;
    flex-direction:column; gap:0; padding:8px; width:auto; font-size:16px;
    --squircle-radius:var(--sq); --squircle-smooth:var(--sq-smooth); --squircle-fill:var(--sqfill-1);
    background-image:paint(squircle); background-color:transparent;
    box-shadow:0 14px 34px rgba(26,25,22,.10)}
  html .nav-links.is-open{display:flex}
  html .nav-links a{display:flex; align-items:center; min-height:48px; padding:0 14px; border-radius:var(--sq-sm)}
  html .nav-links a:hover{background:var(--surface-2); color:var(--ink)}
  @supports not (background:paint(squircle)){
    html .nav-links{background-image:none; background-color:var(--sqfill-1); border-radius:var(--sq)}
  }
}
@media(max-width:400px){
  .island > .btn-primary .ic{display:none}
  .island > .btn-primary{padding:10px 16px}
}

/* ---------- layouts that collapse when a media slot has no real image ---------- */
/* home hero without its media panel: one centred panel, a two-line headline on desktop,
   the drawn shelf of the program underneath */
.hero-grid--solo{display:block}
@media(min-width:960px){ .hero-grid--solo{display:block} }
.hero-grid--solo .hero-content{padding:clamp(36px,5.4vw,76px) clamp(20px,4.5vw,72px) clamp(24px,3vw,40px)}
.hero-grid--solo .hero-content h1{max-width:36ch; font-size:clamp(2.3rem,4.5vw,3.95rem); line-height:1.03}
.hero-grid--solo .hero-content .lede{margin:clamp(16px,2vw,24px) auto clamp(22px,2.4vw,30px)}
.hero-grid--solo .hero-proof{margin-top:16px}
.hero-shelf{max-width:1000px; margin:clamp(26px,4vw,52px) auto 0}
.hero-shelf .art svg{width:100%; height:auto}

.split--solo{grid-template-columns:1fr}
@media(min-width:960px){ .split--solo{grid-template-columns:minmax(0,66ch); gap:0} }

/* product heroes without a gallery: the quote panel spans the row, headline left, form right */
#quote{padding-top:clamp(8px,2vw,24px)}
.pdp--solo{grid-template-columns:minmax(0,1fr)}
@media(min-width:960px){
  .pdp--solo .quote-box{position:static; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    grid-template-rows:auto auto 1fr; column-gap:clamp(40px,6vw,96px);
    padding:clamp(36px,4.4vw,60px)}
  .pdp--solo .quote-box > :not(form){grid-column:1; align-self:start}
  .pdp--solo .quote-box > .eyebrow{justify-self:start}
  .pdp--solo .quote-box h1{font-size:clamp(2.3rem,3.7vw,3.3rem); line-height:1.04}
  .pdp--solo .quote-box .lede{margin:20px 0 0}
  .pdp--solo .quote-box > form{grid-column:2; grid-row:1 / -1; margin-top:0}
}

.ptile .cap{flex:none}

/* ---------- interim line drawings in empty photo slots ----------
   .media is the slot: when a photo lands, it takes the same frame. */
.art svg{display:block; width:100%; height:100%; overflow:visible}
.art svg *{fill:none; vector-effect:non-scaling-stroke; stroke-linecap:round; stroke-linejoin:round}
.art .s{stroke:var(--ink); stroke-width:1.1}
.art .f0{fill:var(--canvas)}
.art .f1{fill:var(--surface-1)}
.art .f2{fill:var(--surface-2)}
.art .k{fill:var(--ink); stroke:none}
.art .h{stroke:var(--ink-2); stroke-width:1; stroke-dasharray:4 3}
.art .c{stroke:var(--ink-2); stroke-width:.8; stroke-dasharray:16 4 2 4; opacity:.6}
.art .d{stroke:var(--ink-2); stroke-width:.8; opacity:.7}
.art .x{stroke:var(--ink-2); stroke-width:.7; opacity:.45}
.art .ko{stroke:var(--canvas); stroke-width:2.6}

.media--art{display:grid; place-items:center; min-width:0}

/* in the product bento: a drawing above the name, the featured tile's drawing fills the tile */
.ptile .media--art{display:block; margin:4px 0 26px}
.ptile .media--art svg{height:124px; width:auto; max-width:100%}
.ptile.feat .media--art{flex:1 1 auto; display:grid; place-items:center; min-height:220px; margin:8px 0 30px}
.ptile.feat .media--art .art{width:100%}
.ptile.feat .media--art svg{width:100%; height:auto; max-height:340px}
.art svg{transition:transform .5s var(--ease-settle)}
.tile--link:hover .art svg{transform:translateY(-3px)}
@media(max-width:759px){
  .ptile .media--art, .ptile.feat .media--art{display:block; min-height:0; flex:none; margin:0 0 20px}
  .ptile .media--art svg, .ptile.feat .media--art svg{height:104px; width:auto; max-width:100%}
}

/* in a text + image split: a paper plate the size a photo would take */
.split > .media--art{aspect-ratio:4/3; padding:clamp(22px,4vw,52px);
  --squircle-radius:var(--sq-lg); --squircle-smooth:var(--sq-smooth); --squircle-fill:var(--sqfill-1);
  background-image:paint(squircle); background-color:transparent}
.split > .media--art .art{width:100%; height:100%}
@supports not (background:paint(squircle)){
  .split > .media--art{background-image:none; background-color:var(--sqfill-1); border-radius:var(--sq-lg)}
}
@media(max-width:959px){ .split > .media--art{aspect-ratio:16/10; max-height:400px} }
@media(min-width:760px) and (max-width:1099px){
  .ptile.feat .media--art{min-height:0; flex:none; margin:4px 0 26px}
  .ptile.feat .media--art svg{height:220px; width:auto; max-width:100%}
}

/* linked tiles: link sits on the heading and stretches over the whole card */
.tile--link{position:relative}
.tile-link{color:inherit; text-decoration:none}
.tile-link::after{content:""; position:absolute; inset:0; border-radius:var(--sq-lg)}
.tile-link:focus-visible{outline:none}
.tile-link:focus-visible::after{outline:2px solid var(--accent); outline-offset:3px}
.tile--link:hover h2, .tile--link:hover h3{color:var(--accent-deep)}
.tile-link{scroll-margin-top:104px}

.hero-content .hero-proof{margin-inline:auto}

/* inline text links (the comps left these as browser-default blue) */
main p a:not(.btn){color:var(--ink); text-decoration:underline; text-decoration-color:var(--accent-decor);
  text-decoration-thickness:1px; text-underline-offset:3px}
main p a:not(.btn):hover{color:var(--accent-deep)}

/* ---------- real photos placed where a slot had a matching image ---------- */
.gallery--single{grid-template-columns:1fr; grid-auto-rows:auto}
.gallery--single .photo-frame{aspect-ratio:3/2}
.photo-frame{overflow:hidden; border-radius:var(--sq-lg); background:var(--sqfill-1)}
.photo-frame img{width:100%; height:100%; object-fit:cover; display:block}
.split .photo-frame{aspect-ratio:4/3}
.photo-frame--crop-top img{object-position:50% 100%; transform:scale(1.14); transform-origin:50% 100%}
img{height:auto}

/* ---------- product photography (tools/photos.json) ----------
   Every frame has a fixed aspect ratio that matches the build's crop, so nothing shifts as
   images load; the img fills it with object-fit (crop, never distortion). */
picture{display:contents}
.media--photo{position:relative; overflow:hidden; border-radius:var(--sq-lg); background:var(--sqfill-1); min-width:0}
.media--photo img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block}
.ptile .media--photo{aspect-ratio:4/3; margin:4px 0 24px; border-radius:var(--sq)}
@media(min-width:1100px){
  .ptile.feat .media--photo{flex:1 1 auto; aspect-ratio:auto; min-height:300px; margin:8px 0 30px}
}
.split > .media--photo{aspect-ratio:4/3}
.gallery--photos{grid-auto-rows:auto; grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
/* one column under 960px: minmax(0,1fr) so a photo's intrinsic width can't push the column past the
   viewport (the devices gallery overflowed by 4px at 320px with a plain 1fr) */
@media(max-width:959px){ .pdp{grid-template-columns:minmax(0,1fr)} }
.gallery--photos > .media--photo{height:auto; min-height:0}
.gallery--photos > .lead{grid-row:auto; aspect-ratio:1/1}
.gallery--photos > .media--photo:not(.lead){aspect-ratio:4/3; border-radius:var(--sq)}
.hero-shelf.media--photo{aspect-ratio:12/5; max-width:1000px; margin:clamp(26px,4vw,52px) auto 0}
.prog-hero .hero-photo{aspect-ratio:2/1; max-width:1000px; margin:clamp(30px,4vw,52px) auto 0}
.opt-photo, .photo-bento{position:relative}
.opt-photo img, .photo-bento img{position:absolute; inset:0}

/* ---------- contact form states ---------- */
.field-error{font-family:var(--font-mono); font-size:12px; letter-spacing:.02em; color:#8A2E1D; margin:2px 0 0}
.field input[aria-invalid="true"], .field textarea[aria-invalid="true"]{border-color:#8A2E1D}
.hp-field{position:absolute !important; left:-10000px; width:1px; height:1px; overflow:hidden}
.btn[disabled]{opacity:.7; cursor:progress}

/* ---------- simple page (thanks, 404) ---------- */
.simple-page{text-align:center; padding-block:clamp(56px,9vw,120px)}
.simple-page h1{max-width:18ch; margin:0 auto}
.simple-page .lede{margin:22px auto 30px; max-width:52ch}
.simple-page .cta-row{justify-content:center}

/* ---------- footer ---------- */
.site-footer{padding:56px 0 48px; text-align:left; font-family:var(--font-body); letter-spacing:0;
  border-top:1px solid var(--line); margin-top:clamp(32px,5vw,64px)}
.footer-grid{display:grid; gap:32px; grid-template-columns:1fr}
@media(min-width:760px){ .footer-grid{grid-template-columns:1.4fr 1fr 1fr} }
.footer-brand p{font-size:14px; margin-top:12px; color:var(--ink-2)}
.footer-col h2{font-family:var(--font-mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--accent); font-weight:500; margin-bottom:12px}
.footer-col ul{list-style:none; display:flex; flex-direction:column; gap:0}
.footer-col a, .footer-meta a{color:var(--ink-2); text-decoration:none; font-size:14px;
  display:inline-flex; align-items:center; min-height:44px}
.footer-col h2{margin-bottom:4px}
.footer-col a:hover, .footer-meta a:hover{color:var(--ink); text-decoration:underline; text-underline-offset:3px}
.footer-meta{margin-top:36px; padding-top:20px; border-top:1px solid var(--line);
  display:flex; flex-wrap:wrap; gap:8px 24px; justify-content:space-between;
  font-family:var(--font-mono); font-size:12px; letter-spacing:.04em; color:var(--ink-2)}
.footer-meta p{max-width:none; color:var(--ink-2)}

/* without JS the squircle worklet never registers: paint() then draws nothing and a
   paint() mask hides its element. Fall back to plain fills and radii so panels, bands
   and badges still render. (html:root keeps the specificity the old html:not(.js) had.) */
@media(scripting:none){
html:root .sq, html:root .island, html:root .band__inner, html:root .spec-chip,
html:root .split > .media--art{
  background-image:none; background-color:var(--squircle-fill); border-radius:var(--squircle-radius)}
html:root .sq-mask, html:root .slot, html:root .step .num, html:root .qr-code,
html:root .jnum{
  -webkit-mask-image:none; mask-image:none; border-radius:var(--squircle-radius); overflow:hidden}

/* without JS the band hairline would never draw on */
html:root .band-rule{transform:scaleX(1)}
}

/* /assets/css/compliance.css */
/* Legal pages, footer legal links and contact-form notices. Hand-authored; loads after site.css. */

/* ---------- footer legal links ---------- */
.footer-legal ul{list-style:none; display:flex; flex-wrap:wrap; gap:4px 20px; margin:0; padding:0}
.footer-legal a{display:inline-block; padding-block:4px}

/* ---------- legal pages ---------- */
.legal-page{max-width:calc(72ch + 40px); padding-block:clamp(48px,7vw,96px)}
.legal-page h1{font-size:clamp(2.2rem,5vw,3.4rem); margin-bottom:12px}
.legal-page h2{font-size:clamp(1.4rem,2.4vw,1.8rem); margin:48px 0 12px; scroll-margin-top:96px}
.legal-page h3{font-size:1.15rem; margin:28px 0 8px}
.legal-page p, .legal-page li{color:var(--ink-2); max-width:72ch}
.legal-page p + p{margin-top:12px}
.legal-page ul{margin:12px 0 0 1.2em; display:flex; flex-direction:column; gap:8px}
.legal-page strong{color:var(--ink); font-weight:600}
.legal-page a{color:var(--ink); text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:3px}
.legal-page a:hover{color:var(--accent-deep)}
.legal-page section{padding-block:0}
.legal-meta{font-family:var(--font-mono); font-size:13px; letter-spacing:.04em; margin-bottom:28px}
.legal-address{margin-top:12px}

/* ---------- contact form notices ---------- */
.field .req{text-transform:none; letter-spacing:.02em}
.field-hint{font-family:var(--font-mono); font-size:12px; letter-spacing:.02em; color:var(--ink-2); margin:2px 0 0}
.form-legal{font-size:14px; line-height:1.5; color:var(--ink-2); text-align:center; margin:4px auto 0; max-width:48ch}
.form-legal a{color:var(--ink); text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:3px}
.error-summary:empty{display:none}
.error-summary{border:2px solid #8A2E1D; border-radius:var(--sq-sm); padding:14px 16px; background:var(--canvas)}
.error-summary:focus{outline:2px solid var(--accent); outline-offset:2px}
.error-summary p{color:#8A2E1D; font-weight:600; font-size:15px}
.error-summary ul{margin:6px 0 0 1.2em; font-size:15px}
.error-summary a{color:#8A2E1D; text-decoration:underline; text-underline-offset:3px}

/* /assets/css/consent.css */
/* Consent banner, cookie settings panel, footer privacy links and the Cookie Policy page.
   Hand-authored. The consent manager's own sheet (cookieconsent.css) loads on demand;
   these variables theme it to DESIGN.md (graphite on warm paper, gold kept off). */

#cc-main{
  --cc-font-family:var(--font-body);
  --cc-bg:var(--surface-1);
  --cc-primary-color:var(--ink);
  --cc-secondary-color:var(--ink-2);
  --cc-link-color:var(--ink);
  --cc-modal-border-radius:var(--sq);
  --cc-btn-border-radius:9999px;
  /* Accept all and Reject all are the same button: same fill, size and weight. */
  --cc-btn-primary-bg:var(--ink);
  --cc-btn-primary-color:var(--canvas);
  --cc-btn-primary-border-color:var(--ink);
  --cc-btn-primary-hover-bg:var(--accent-deep);
  --cc-btn-primary-hover-color:var(--canvas);
  --cc-btn-primary-hover-border-color:var(--accent-deep);
  --cc-btn-secondary-bg:transparent;
  --cc-btn-secondary-color:var(--accent);
  --cc-btn-secondary-border-color:var(--accent);
  --cc-btn-secondary-hover-bg:var(--surface-2);
  --cc-btn-secondary-hover-color:var(--accent-deep);
  --cc-btn-secondary-hover-border-color:var(--accent-deep);
  --cc-separator-border-color:#C9C5B8;
  --cc-toggle-on-bg:var(--ink);
  --cc-toggle-off-bg:#76736B;
  --cc-toggle-on-knob-bg:var(--canvas);
  --cc-toggle-off-knob-bg:var(--canvas);
  --cc-toggle-enabled-icon-color:var(--canvas);
  --cc-toggle-disabled-icon-color:var(--canvas);
  --cc-toggle-readonly-bg:#9C988C;
  --cc-toggle-readonly-knob-bg:var(--canvas);
  --cc-toggle-readonly-knob-icon-color:#46443E;
  --cc-section-category-border:#C9C5B8;
  --cc-cookie-category-block-bg:var(--canvas);
  --cc-cookie-category-block-border:#C9C5B8;
  --cc-cookie-category-block-hover-bg:var(--surface-2);
  --cc-cookie-category-block-hover-border:#B3AFA2;
  --cc-cookie-category-expanded-block-bg:var(--canvas);
  --cc-cookie-category-expanded-block-hover-bg:var(--surface-2);
  --cc-overlay-bg:rgba(22,20,14,.62);
  --cc-footer-bg:var(--surface-2);
  --cc-footer-color:var(--ink-2);
  --cc-footer-border-color:#C9C5B8;
  --cc-webkit-scrollbar-bg:#B3AFA2;
  --cc-webkit-scrollbar-hover-bg:#8C8A82;
  --cc-z-index:2147483000;
}
#cc-main .cm.cm, #cc-main .pm.pm{border:1px solid #B3AFA2; box-shadow:none}
#cc-main .cm:focus-visible, #cc-main .pm:focus-visible{outline-offset:-3px !important}
#cc-main .cm__title, #cc-main .pm__title{font-family:var(--font-head); font-weight:var(--weight-head); letter-spacing:0; font-size:1.3rem}
#cc-main .cm__desc, #cc-main .pm__section-desc{font-size:15px; line-height:1.55; color:var(--ink-2)}
#cc-main a{text-decoration:underline; text-underline-offset:2px}
#cc-main .cm__btn, #cc-main .pm__btn{font-weight:600; font-size:15px; min-height:44px}
#cc-main .cc-gpc{display:block; margin-top:.6em; font-family:var(--font-mono); font-size:12px; letter-spacing:.06em; text-transform:uppercase; color:var(--ink)}
#cc-main :focus-visible{outline:2px solid var(--ink) !important; outline-offset:3px}
#cc-main .section__toggle:focus-visible ~ .toggle__icon{outline:2px solid var(--ink); outline-offset:3px}

/* Toggles at least 24px tall (WCAG 2.5.8). */
#cc-main .pm .section__toggle, #cc-main .pm .section__toggle-wrapper,
#cc-main .pm .toggle__icon, #cc-main .pm .toggle__label{height:26px; width:52px}
#cc-main .pm .toggle__icon-circle{height:26px; width:26px}
#cc-main .pm .section__toggle:checked ~ .toggle__icon .toggle__icon-circle{transform:translateX(26px)}

/* Keep focused page content clear of the banner (WCAG 2.4.11). */
html.show--consent{scroll-padding-bottom:var(--cc-banner-h, 0px)}

@media (prefers-reduced-motion: reduce){
  #cc-main{--cc-modal-transition-duration:0ms}
}

/* ---------- footer privacy links ---------- */
.privacy-links{list-style:none; margin:14px 0 0; padding:0; display:flex; flex-wrap:wrap; gap:6px 22px}
.privacy-links a{font-size:13px; color:var(--ink-2); padding-block:.5rem; display:inline-block}
.privacy-links a:hover{color:var(--ink)}

/* ---------- Cookie Policy page ---------- */
.cookie-policy{max-width:1100px}
.cookie-policy h2{margin-top:2.2em; scroll-margin-top:96px}
.cookie-policy h3{margin-top:1.6em}
.cookie-policy p, .cookie-policy li{max-width:70ch}
.cookie-policy .cc-updated{font-family:var(--font-mono); font-size:12px; letter-spacing:.06em; color:var(--ink-2)}
.cookie-policy .cc-muted{color:var(--ink-2)}
.cookie-policy .cc-list{padding-left:1.2em}
.cookie-policy .cc-list li{margin:.4em 0}
.cookie-policy .cc-empty{color:var(--ink-2)}
.cookie-policy button[hidden]{display:none}
.cc-table-wrap{overflow-x:auto; margin:1.2em 0 1.8em; border-radius:var(--sq-sm); background:var(--surface-1)}
.cc-table-wrap:focus-visible{outline:2px solid var(--accent); outline-offset:3px}
.cc-table{border-collapse:collapse; width:100%; min-width:760px; font-size:14px; line-height:1.5}
.cc-table caption{text-align:left; padding:14px 16px 6px; font-family:var(--font-mono); font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--ink)}
.cc-table th, .cc-table td{text-align:left; vertical-align:top; padding:10px 16px; border-top:1px solid #C9C5B8}
.cc-table thead th{font-weight:600; color:var(--ink); white-space:nowrap}
.cc-table tbody th{font-family:var(--font-mono); font-weight:500; font-size:13px; word-break:break-word; min-width:9em}
.cc-later{margin-top:1.4em}
.cc-later summary{cursor:pointer; font-weight:600; padding:.5rem 0}
.cc-later summary:focus-visible{outline:2px solid var(--accent); outline-offset:3px}