
:root{
  --paper:#F3F1EB; --sheet:#FFFFFF;
  --ink:#171A1D; --ink-2:#4C545B; --ink-3:#8C9298;
  --rule:#CBC7BD; --rule-2:#E4E1D8;
  --cinnabar:#B03027;
  --display:"IBM Plex Sans Condensed","Arial Narrow",Arial,sans-serif;
  --body:"IBM Plex Sans","Segoe UI",system-ui,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,monospace;
  --pad:clamp(20px,3.2vw,72px);
}
*{box-sizing:border-box;}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--body);font-size:17px;line-height:1.62;-webkit-font-smoothing:antialiased;}
a{color:inherit;}
img,svg{max-width:100%;}

.banner{background:var(--ink);color:var(--paper);font-family:var(--mono);font-size:11.5px;letter-spacing:.09em;text-transform:uppercase;padding:10px 20px;text-align:center;}

/* ---------- header ---------- */
header{position:sticky;top:0;z-index:20;background:var(--paper);border-bottom:1px solid var(--rule);}
.hwrap{width:100%;margin:0;padding:0 var(--pad) 0 0;display:flex;align-items:stretch;justify-content:space-between;gap:32px;}
.lockup{display:flex;align-items:center;gap:16px;text-decoration:none;flex:none;padding:18px var(--pad);border-right:1px solid var(--rule);}
.lockup svg{width:clamp(48px,4.2vw,62px);height:clamp(48px,4.2vw,62px);flex:none;}
.word{display:flex;flex-direction:column;gap:5px;}
.word b{font-family:var(--display);font-weight:700;text-transform:uppercase;letter-spacing:.15em;font-size:clamp(20px,1.9vw,27px);line-height:1;white-space:nowrap;}
.word i{font-family:var(--mono);font-style:normal;font-size:clamp(8.5px,.72vw,10.5px);letter-spacing:.17em;text-transform:uppercase;color:var(--ink-3);white-space:nowrap;}
nav{display:flex;align-items:center;gap:clamp(20px,2.6vw,52px);flex-wrap:wrap;}
nav a{font-family:var(--display);font-weight:600;text-transform:uppercase;letter-spacing:.07em;font-size:clamp(14px,1.05vw,17px);color:var(--ink-2);text-decoration:none;padding-bottom:3px;border-bottom:2px solid transparent;}
nav a:hover{color:var(--ink);}
nav a.on{color:var(--ink);border-bottom-color:var(--cinnabar);}

/* ---------- layout ---------- */
main{width:100%;margin:0;padding:0 var(--pad) 110px;}


section{padding-block:62px;border-bottom:1px solid var(--rule-2);}
section:last-child{border-bottom:0;}
.eyebrow{font-family:var(--mono);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--cinnabar);margin:0 0 16px;}
h1{font-family:var(--display);font-weight:700;font-size:clamp(34px,4.4vw,68px);line-height:1.04;letter-spacing:-.005em;margin:0 0 24px;max-width:19ch;text-wrap:balance;}
h2{font-family:var(--display);font-weight:700;text-transform:uppercase;letter-spacing:.04em;font-size:clamp(20px,1.7vw,28px);margin:0 0 20px;}
h3{font-family:var(--display);font-weight:600;text-transform:uppercase;letter-spacing:.05em;font-size:clamp(16px,1.1vw,18px);margin:0 0 9px;}
p{margin:0 0 17px;max-width:72ch;}
.lede{font-size:clamp(18px,1.35vw,24px);color:var(--ink-2);max-width:60ch;}
.note{font-size:15px;color:var(--ink-3);max-width:70ch;}

/* ---------- hero ---------- */
.hero{padding-block:78px 62px;}
.hero:has(.heroGrid){padding-block:0 62px;}
.heroGrid{display:grid;grid-template-columns:1fr;gap:0;align-items:stretch;margin-inline:calc(var(--pad) * -1);border-bottom:1px solid var(--rule-2);}
.heroText{padding:78px var(--pad) 70px;display:flex;flex-direction:column;justify-content:center;}
.heroGrid > figure{background:var(--sheet);border:0;border-top:1px solid var(--rule-2);padding:clamp(24px,2.6vw,56px);display:flex;flex-direction:column;justify-content:center;}
@media (min-width:1120px){
  .heroGrid:has(> figure){grid-template-columns:minmax(0,1fr) minmax(0,1fr);}
  .heroGrid > figure{border-top:0;border-left:1px solid var(--rule-2);}
}
.bleed{margin-inline:calc(var(--pad) * -1);}

/* ---------- branches ---------- */
.split{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:1px;background:var(--rule-2);border-bottom:1px solid var(--rule-2);margin:0 calc(var(--pad) * -1);}
.branch{background:var(--sheet);padding:38px var(--pad) 42px;display:flex;flex-direction:column;gap:13px;}
.branch .tag{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--cinnabar);}
.branch p{font-size:16px;color:var(--ink-2);margin:0;}
.branch a{font-family:var(--display);font-weight:600;text-transform:uppercase;letter-spacing:.06em;font-size:14px;text-decoration:none;color:var(--ink);border-bottom:2px solid var(--cinnabar);align-self:flex-start;padding-bottom:2px;margin-top:8px;}

/* ---------- cards ---------- */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:30px;margin-top:8px;}
.card{border-left:2px solid var(--cinnabar);padding-left:20px;}
.card p{font-size:16px;color:var(--ink-2);margin:0;}
.card a{display:inline-block;margin-top:11px;font-family:var(--mono);font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink);text-decoration:none;border-bottom:1px solid var(--rule);}

/* ---------- steps ---------- */
.steps{display:flex;flex-direction:column;gap:1px;background:var(--rule-2);border:1px solid var(--rule-2);margin-top:10px;}
.step{background:var(--sheet);padding:30px 34px;display:grid;grid-template-columns:56px minmax(0,1fr);gap:26px;align-items:start;}
@media (min-width:1400px){ .step{grid-template-columns:56px minmax(0,1.4fr) minmax(0,.75fr);} .step .out{margin-top:0;} }
.step .n{font-family:var(--display);font-weight:700;font-size:30px;color:var(--cinnabar);line-height:1;}
.step .q{font-family:var(--mono);font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);margin:0 0 10px;}
.step p{margin:0 0 13px;}
.step .out{border-left:2px solid var(--cinnabar);padding-left:16px;font-size:15.5px;color:var(--ink-2);margin:0;}
.step .out b{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink);display:block;margin-bottom:4px;font-weight:500;}

/* ---------- band ---------- */
.band{background:var(--ink);color:var(--paper);padding:52px 42px;margin-top:10px;}
.band h2{color:var(--paper);}
.band p{color:#C6CBCF;}
.band ol{margin:24px 0 0;padding-left:24px;max-width:70ch;}
.band li{margin-bottom:13px;color:var(--paper);}

/* ---------- defs ---------- */
.defs{display:grid;grid-template-columns:1fr;gap:22px;margin-top:6px;}
@media (min-width:1240px){ .defs.two{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 56px;} }
.def{border-top:1px solid var(--rule-2);padding-top:17px;}
.def b{font-family:var(--display);text-transform:uppercase;letter-spacing:.05em;font-size:15px;display:block;margin-bottom:6px;}
.def p{margin:0;color:var(--ink-2);font-size:16px;}

/* ---------- figures ---------- */
figure{margin:0;}
figure svg{display:block;width:100%;height:auto;color:var(--ink);}
figcaption{font-family:var(--mono);font-size:11.5px;letter-spacing:.05em;color:var(--ink-3);margin-top:14px;max-width:60ch;line-height:1.6;}
.figbox{background:var(--sheet);border:1px solid var(--rule-2);padding:28px 30px 24px;}
.figwide{margin-top:34px;}

/* ---------- exhibits ---------- */
.exSec{background:var(--sheet);margin-inline:calc(var(--pad) * -1);padding:clamp(34px,3.4vw,64px) var(--pad) clamp(30px,2.8vw,52px);border-bottom:1px solid var(--rule-2);}
.exHead{display:grid;grid-template-columns:1fr;gap:6px;padding-bottom:22px;margin-bottom:clamp(20px,2vw,38px);border-bottom:2px solid var(--ink);}
.exNum{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--cinnabar);}
.exTitle{font-family:var(--display);font-weight:700;font-size:clamp(21px,2vw,34px);line-height:1.12;letter-spacing:-.003em;margin:0;max-width:34ch;text-wrap:balance;}
.exSub{font-family:var(--mono);font-size:clamp(11px,.78vw,12.5px);letter-spacing:.07em;text-transform:uppercase;color:var(--ink-3);margin:4px 0 0;max-width:none;}
.exFoot{font-family:var(--mono);font-size:11px;letter-spacing:.04em;color:var(--ink-3);margin:clamp(18px,1.8vw,30px) 0 0;padding-top:14px;border-top:1px solid var(--rule-2);max-width:none;line-height:1.7;}
.exSec figure svg{width:100%;height:auto;}

/* ---------- table ---------- */
.tw{overflow-x:auto;}
table{border-collapse:collapse;width:100%;min-width:560px;font-size:16px;}
th,td{text-align:left;padding:14px 16px;border-bottom:1px solid var(--rule-2);vertical-align:top;}
th{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);font-weight:500;}

/* ---------- form ---------- */
.form{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;max-width:1000px;margin-top:8px;}
.f{display:flex;flex-direction:column;gap:7px;}
.f.wide{grid-column:1/-1;}
label{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);}
input,textarea{font-family:var(--body);font-size:16px;color:var(--ink);background:var(--sheet);border:1px solid var(--rule);padding:12px 13px;border-radius:0;}
input:focus,textarea:focus{outline:2px solid var(--cinnabar);outline-offset:-2px;}
textarea{min-height:130px;resize:vertical;}
button{font-family:var(--display);font-weight:600;text-transform:uppercase;letter-spacing:.07em;font-size:14.5px;background:var(--cinnabar);color:#fff;border:0;padding:14px 30px;cursor:pointer;justify-self:start;}
.sent{font-family:var(--mono);font-size:12px;letter-spacing:.06em;color:var(--cinnabar);margin-top:11px;}

/* ---------- footer ---------- */
footer{border-top:1px solid var(--rule);background:var(--paper);}
.fwrap{width:100%;margin:0;padding:44px var(--pad) 58px;display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:36px;}
footer h4{font-family:var(--mono);font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-3);margin:0 0 11px;font-weight:500;}
footer p,footer a{font-size:15px;color:var(--ink-2);margin:0 0 6px;text-decoration:none;display:block;}
footer a:hover{color:var(--ink);}
.legal{grid-column:1/-1;border-top:1px solid var(--rule-2);padding-top:20px;font-size:13.5px;color:var(--ink-3);display:flex;gap:22px;flex-wrap:wrap;justify-content:space-between;}
.legal a{display:inline;font-size:13.5px;}

@media (min-width:2400px){ body{font-size:18.5px;} h1{font-size:clamp(48px,3.6vw,80px);} }
@media (min-width:3000px){ body{zoom:1.2;} }

@media (max-width:820px){
  .hwrap{flex-direction:column;align-items:stretch;gap:0;padding:0;}
  .lockup{border-right:0;border-bottom:1px solid var(--rule);padding:14px var(--pad);}
  nav{gap:18px;padding:12px var(--pad) 14px;}
  .heroText{padding:44px var(--pad) 40px;}
  .step{grid-template-columns:1fr;gap:12px;}
  .band{padding:32px 22px;}
  .figbox{padding:20px 16px 18px;}
}
