/* layout — ported from the approved design; colours come only from theme variables. */
main{display:block;min-height:70vh;outline:none}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gut)}
.sec{padding:clamp(56px,7vw,104px) 0}
.sec-tight{padding:clamp(40px,5vw,72px) 0}
.sec-head{max-width:720px;margin-bottom:clamp(28px,4vw,48px)}
.sec-head p{color:var(--muted);font-size:1.08em}
.grid{display:grid;gap:clamp(16px,2vw,26px)}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
.card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);padding:clamp(20px,2.4vw,30px);box-shadow:var(--shadow)}
.dark{background:var(--night);color:var(--chrome-text)}
.dark h2,.dark h3,.dark h4{color:var(--white)}
.dark .eyebrow{color:var(--mint)}
.dark a{color:var(--violet-light)}
.pill{display:inline-flex;align-items:center;gap:6px;font:700 .74rem/1 var(--fd);letter-spacing:.04em;padding:6px 10px;border-radius:999px;background:var(--pill-bg);color:var(--night);white-space:nowrap}
.pill.mint{background:var(--mint-soft);color:var(--mint-ink)}
.pill.tan{background:var(--tan-soft);color:var(--tan-ink)}
.pill.vio{background:var(--violet-soft);color:var(--violet-ink)}
.pill.gray{background:var(--gray-soft);color:var(--gray-ink)}
.pill.dot::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.page-hero{padding-top:clamp(44px,6vw,84px);padding-bottom:clamp(28px,4vw,48px)}
.page-hero p.lead{font-size:clamp(1.05rem,.5vw + .95rem,1.25rem);color:var(--muted);max-width:720px}
.crumbs{font-size:.86rem;color:var(--muted);margin-bottom:18px;display:flex;gap:8px;flex-wrap:wrap}
.crumbs a{color:var(--muted)}
.checks{list-style:none;padding:0}
.checks li{position:relative;padding-left:30px;margin:.55em 0}
.checks li::before{content:"";position:absolute;left:0;top:.28em;width:18px;height:18px;border-radius:6px;background:var(--mint)}
.checks li::after{content:"";position:absolute;left:3px;top:calc(.28em + 3px);width:12px;height:12px;background:var(--night);-webkit-mask:var(--tick) center/100% no-repeat;mask:var(--tick) center/100% no-repeat}
.crosses li::before{background:var(--tan-soft)}
.crosses li::after{background:var(--tan-ink);-webkit-mask-image:var(--cross);mask-image:var(--cross)}
.photo{position:relative;border-radius:var(--r-lg);overflow:hidden;background:var(--photo-bg);box-shadow:0 18px 40px -26px color-mix(in srgb,var(--night) 45%,transparent)}
.photo>svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.photo::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(120% 90% at 30% 20%,color-mix(in srgb,var(--white) 18%,transparent),transparent 55%),linear-gradient(180deg,transparent 62%,color-mix(in srgb,var(--night) 16%,transparent))}
.letter .photo{max-width:340px;width:100%;justify-self:center}h1[tabindex="-1"]:focus{outline:none}
.r45{aspect-ratio:4/5}.r32{aspect-ratio:3/2}.r169{aspect-ratio:16/9}
.kv{margin:0}.kv div{display:flex;justify-content:space-between;gap:14px;padding:9px 0;border-bottom:1px solid var(--line);font-size:.93rem}.kv dt{color:var(--muted)}.kv dd{margin:0;font-weight:700;text-align:right}
