/*
Theme Name: Vallaradvanced Artifact
Description: Generated from an HTML artifact.
Version: 1.0.0
Text Domain: vallaradvanced
*/


:root{
  --ground:#F6F5F2;
  --panel:#E6EDE8;
  --ink:#161616;
  --muted:#777767;
  --grey-1:#C0BFBB;
  --grey-2:#777767;
  --grey-3:#35373A;
  --accent:#E26139;
  --signal:#E26139;
  --green:#4E6A5E;
  --green-pale:#B4CDC2;
  --rule:#D6D5D1;
  --rule-strong:#161616;
  --invert-ground:#161616;
  --invert-ink:#D8D8D5;

  --f-display:"Archivo","Helvetica Neue",Helvetica,Arial,sans-serif;
  --f-body:"Inter Tight","Helvetica Neue",Helvetica,Arial,sans-serif;
  --f-mono:"Inter Tight","Helvetica Neue",Helvetica,Arial,sans-serif;
  --f-sec:"Inter Tight","Helvetica Neue",Helvetica,Arial,sans-serif;
  --f-code:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --ground:#161616;
    --panel:#2C3A33;
    --ink:#D8D8D5;
    --muted:#8E8E7E;
    --grey-1:#4E5054;
    --grey-2:#777767;
    --grey-3:#C9C9C4;
    --accent:#E26139;
    --signal:#E26139;
    --green:#B4CDC2;
    --green-pale:#B4CDC2;
    --rule:#35373A;
    --rule-strong:#D8D8D5;
    --invert-ground:#D8D8D5;
    --invert-ink:#161616;
  }
}
:root[data-theme="dark"]{
  --ground:#161616;
  --panel:#2C3A33;
  --ink:#D8D8D5;
  --muted:#8E8E7E;
  --grey-1:#4E5054;
  --grey-2:#777767;
  --grey-3:#C9C9C4;
  --accent:#E26139;
  --signal:#E26139;
  --green:#B4CDC2;
  --green-pale:#B4CDC2;
  --rule:#35373A;
  --rule-strong:#D8D8D5;
  --invert-ground:#D8D8D5;
  --invert-ink:#161616;
}

*{box-sizing:border-box;}
body{
  background:var(--ground);
  color:var(--ink);
  font-family:var(--f-body);
  font-size:15px;
  line-height:1.6;
  margin:0;
  -webkit-font-smoothing:antialiased;
}
.wrap{max-width:1240px;margin-inline:auto;padding-inline:20px;}
img{max-width:100%;display:block;}

/* primary navigation — transparent over the hero, condenses on scroll */
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto;}}
.nav{
  position:fixed;top:0;left:0;right:0;z-index:90;
  padding-top:env(safe-area-inset-top,0px);
  background:transparent;border-bottom:1px solid transparent;
  transition:background .28s ease,border-color .28s ease,backdrop-filter .28s ease;
}
.nav .navin{
  max-width:1240px;margin-inline:auto;
  padding:clamp(18px,2.4vw,26px) clamp(24px,4vw,50px) 13px;
  display:flex;align-items:baseline;justify-content:space-between;gap:18px;
  transition:padding .28s ease;
}
.nav .navmark{
  font-family:var(--f-display);font-weight:700;font-stretch:112%;
  font-size:15px;letter-spacing:.2em;text-transform:uppercase;text-decoration:none;
  color:#F6F5F2;opacity:0;transform:translateY(-4px);pointer-events:none;
  transition:opacity .28s ease,transform .28s ease,color .28s ease;
}
.nav ul{list-style:none;margin:0;padding:0;display:flex;align-items:baseline;gap:clamp(18px,2.6vw,38px);margin-left:auto;}
.nav a.tab{
  position:relative;text-decoration:none;color:#F6F5F2;
  font-family:var(--f-sec);font-size:12px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;
  padding-bottom:4px;transition:color .28s ease;
}
.nav a.tab::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:1px;
  background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .2s ease;
}
.nav a.tab:hover::after,.nav a.tab:focus-visible::after{transform:scaleX(1);}
.nav a.tab.order{color:#F6F5F2;}
.nav a.tab.order::after{transform:scaleX(1);}
.nav.solid{background:var(--ground);border-bottom-color:var(--rule-strong);}
.nav.solid .navin{padding-top:12px;padding-bottom:11px;}
.nav.solid .navmark{color:var(--ink);opacity:1;transform:none;pointer-events:auto;}
.nav.solid a.tab{color:var(--ink);}
.nav.solid a.tab.order{color:var(--ink);}
@media (max-width:560px){
  .nav .navin{padding:14px 20px 11px;gap:10px;}
  .nav .navmark{font-size:12px;letter-spacing:.14em;}
  .nav ul{gap:14px;}
  .nav a.tab{font-size:10px;letter-spacing:.12em;}
}
#grades,#applications,#contact{scroll-margin-top:70px;}
a{color:inherit;}
:focus-visible{outline:2px solid var(--signal);outline-offset:3px;}

/* ================= specimen primitives ================= */
.rule{border-top:1px solid var(--rule-strong);}
.hair{border-top:1px solid var(--rule);}

/* tiny tracked caps — the atom of the whole sheet */
.t{
  font-family:var(--f-mono);
  font-weight:500;
  font-size:10px;
  letter-spacing:.14em;
  text-transform:uppercase;
  line-height:1.45;
  color:var(--ink);
}
.t.dim{color:var(--muted);}
.t.acc{color:var(--signal);font-weight:600;}

/* a row of field labels sitting under a hairline */
.fields{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:10px 26px;
  border-top:1px solid var(--rule-strong);
  padding-top:8px;
}
.fields.hairtop{border-top-color:var(--rule);}
.field .k{display:block;color:var(--muted);}
.field .v{display:block;color:var(--ink);}

/* the running header */
.metabar{
  display:grid;
  grid-template-columns:1fr 1fr 1fr auto;
  gap:14px;
  align-items:start;
  border-bottom:1px solid var(--rule-strong);
  padding:14px 0 10px;
}
.metabar .mark{
  font-family:var(--f-display);
  font-weight:700;
  font-size:13px;
  letter-spacing:.34em;
  margin-right:-.34em;
  text-transform:uppercase;
  white-space:nowrap;
}

/* oversized display type */
.giant{
  font-family:var(--f-display);
  font-weight:600;
  font-stretch:118%;
  font-size:clamp(52px,17.6vw,208px);
  line-height:.82;
  letter-spacing:-.035em;
  text-transform:uppercase;
  margin:0;
}
.giantwrap{display:flex;align-items:flex-start;gap:clamp(10px,2vw,26px);margin:12px 0 0;}
.giantwrap .sidecode{margin-left:auto;}
.sidecode{
  font-family:var(--f-display);
  font-weight:600;
  font-size:clamp(13px,2.1vw,26px);
  line-height:1.08;
  letter-spacing:.01em;
  text-transform:uppercase;
  padding-top:.12em;
  white-space:nowrap;
}
.sidecode .o{color:var(--signal);}
.madein{margin:0 0 14px;max-width:none;}
.madein .t{display:inline-block;padding-bottom:9px;border-bottom:1px solid var(--signal);color:var(--muted);}
.headline.cta{font-weight:700;font-stretch:118%;font-size:clamp(20px,3vw,39px);letter-spacing:-.035em;line-height:1;}
.headline{
  font-family:var(--f-display);
  font-weight:500;
  font-stretch:106%;
  font-size:clamp(26px,5.1vw,60px);
  line-height:1.02;
  letter-spacing:-.025em;
  text-transform:uppercase;
  margin:0;
  text-wrap:balance;
}
.headline sup{font-size:.42em;vertical-align:.95em;letter-spacing:.04em;font-weight:600;}
.subhead{
  font-family:var(--f-display);
  font-weight:700;
  font-stretch:112%;
  font-size:clamp(21px,3vw,36px);
  line-height:1.04;
  letter-spacing:-.028em;
  text-transform:uppercase;
  margin:0;
}

p{margin:0 0 14px;max-width:60ch;}
.lede{font-size:clamp(15px,1.55vw,17.5px);line-height:1.55;max-width:none;}
.statement em{font-style:italic;}
.statement{
  font-family:var(--f-body);font-weight:400;
  font-size:clamp(19px,2.5vw,32px);line-height:1.34;letter-spacing:-.015em;
  max-width:48ch;margin:0;text-wrap:pretty;
}
@media (min-width:860px){.statement{max-width:52ch;font-size:clamp(22px,2.5vw,34px);}}
.ledepair{display:grid;grid-template-columns:1fr;gap:14px clamp(30px,4.4vw,64px);}
.ledepair p{margin:0;font-size:clamp(15px,1.55vw,17.5px);line-height:1.55;}
@media (min-width:860px){
  .ledepair{grid-template-columns:1fr 1fr;}
  .ledepair p + p{border-left:1px solid var(--rule);padding-left:clamp(24px,3vw,40px);}
}
.note{font-size:12px;color:var(--muted);max-width:66ch;line-height:1.65;}
strong{font-weight:600;}

/* ================= opening plate ================= */
.plate{position:relative;height:clamp(600px,82vh,780px);background:#4E6A5E;color:#F6F5F2;overflow:hidden;}
.plate .bg{position:absolute;inset:0;}
.plate .bg img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.12) brightness(.66);}
.plate .tint{position:absolute;inset:0;background:#B4CDC2;mix-blend-mode:color;}
.plate .tint2{position:absolute;inset:0;background:#3E5A4C;mix-blend-mode:multiply;opacity:.45;}
.plate .inner{
  position:absolute;inset:0;
  max-width:1240px;margin-inline:auto;
  padding:clamp(24px,3.4vw,42px) clamp(24px,4vw,50px);
  display:flex;flex-direction:column;
}
.plate .inner{padding-top:clamp(74px,8.4vw,104px);}
@media (max-width:560px){.plate .inner{padding-top:66px;}}
.plate .t{color:#F6F5F2;}
.plate .bandline{display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;border-top:1px solid rgba(246,245,242,.8);padding-top:9px;}
.plate .body{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:clamp(14px,2.2vw,26px);}
.plate .logo{max-width:100%;}
.plate .say{font-family:var(--f-code);font-weight:500;font-size:clamp(11px,1.3vw,16px);line-height:1.5;letter-spacing:.17em;text-transform:uppercase;margin:0;max-width:34ch;}
.plate .giant{color:#F6F5F2;font-weight:700;font-stretch:100%;font-size:clamp(56px,12.4vw,164px);line-height:.84;letter-spacing:-.04em;margin:0;}
.plate .sub{
  display:flex;justify-content:space-between;width:100%;
  border-top:1px solid rgba(246,245,242,.85);
  margin-top:clamp(10px,1.2vw,16px);padding-top:clamp(7px,.9vw,11px);
  font-family:var(--f-display);font-weight:500;font-size:clamp(10px,1.35vw,17px);
  text-transform:uppercase;letter-spacing:0;
}
.plate .sub i{font-style:normal;display:block;}
.plate .sub i.sp{flex:0 0 clamp(6px,1.2vw,18px);}
.plate .foot{
  display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;
  border-top:1px solid rgba(246,245,242,.8);padding-top:10px;
}
@media (max-width:620px){
  .plate{height:auto;min-height:clamp(460px,76vh,640px);}
  .plate .body{gap:20px;padding-block:22px;}
  .plate .foot{gap:6px 18px;}
}

/* ================= Fig. 01 road plate ================= */
.roadplate{position:relative;margin:30px 0 0;min-height:clamp(520px,52vw,660px);background:#161616;color:#F6F5F2;overflow:hidden;display:flex;}
.roadplate > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 45%;filter:grayscale(1) contrast(1.12) brightness(.52);}
.roadplate .shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,10,8,.45) 0%,rgba(10,10,8,.1) 35%,rgba(10,10,8,.45) 62%,rgba(10,10,8,.88) 100%);}
.roadplate .edge{position:absolute;inset:clamp(12px,1.8vw,22px);border:1px solid rgba(246,245,242,.45);border-radius:18px;pointer-events:none;}
.roadplate .in{position:relative;flex:1;display:flex;flex-direction:column;justify-content:space-between;padding:clamp(30px,4vw,50px) clamp(30px,4.4vw,58px);}
.roadplate .t{color:#F6F5F2;}
.roadplate .t.soft{color:rgba(246,245,242,.72);}
.roadplate .top{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;}
.roadplate .stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid rgba(246,245,242,.45);}
.roadplate .st{padding:14px 22px 4px 0;}
.roadplate .st + .st{border-left:1px solid rgba(246,245,242,.25);padding-left:22px;}
.roadplate .n{display:block;font-family:var(--f-display);font-weight:700;font-stretch:112%;font-size:clamp(40px,6.6vw,84px);line-height:.9;letter-spacing:-.05em;font-variant-numeric:tabular-nums;margin:8px 0 12px;color:#F6F5F2;}
.roadplate .n i{font-style:normal;font-weight:500;font-size:.3em;letter-spacing:.04em;margin-left:.2em;vertical-align:.9em;color:#E26139;}
.roadplate .cap{display:block;max-width:24ch;line-height:1.6;}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
@media (max-width:760px){
  .roadplate .stats{grid-template-columns:1fr;}
  .roadplate .st + .st{border-left:none;padding-left:0;border-top:1px solid rgba(246,245,242,.25);}
}

/* ================= line heroes ================= */
.lh{position:relative;min-height:clamp(600px,56vw,720px);background:#1B2621;color:#F6F5F2;overflow:hidden;margin-top:26px;display:flex;}
.lh > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(1) sepia(.55) hue-rotate(105deg) saturate(.85) contrast(1.1) brightness(.56);}
.lh .shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,10,8,.55) 0%,rgba(10,10,8,.15) 38%,rgba(10,10,8,.35) 62%,rgba(10,10,8,.85) 100%);}
.lh .edge{position:absolute;inset:clamp(12px,1.8vw,22px);border:1px solid rgba(246,245,242,.45);border-radius:18px;pointer-events:none;}
.lh .in{position:relative;flex:1;display:flex;flex-direction:column;padding:clamp(30px,4vw,52px) clamp(30px,4.4vw,60px);}
.lh .t{color:#F6F5F2;}
.lh .top{display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;}
.lh .name{font-family:var(--f-display);font-weight:600;font-stretch:125%;font-size:clamp(64px,15.5vw,210px);line-height:.8;letter-spacing:-.045em;text-transform:uppercase;margin:auto 0 0;}
.lh .fin{font-family:var(--f-code);font-weight:400;font-size:clamp(9.5px,.95vw,11.5px);letter-spacing:.11em;text-transform:uppercase;line-height:1.5;margin:10px 0 0;color:rgba(246,245,242,.66);}
.lh .tox{font-family:var(--f-code);font-weight:500;font-size:clamp(10px,1.05vw,12.5px);letter-spacing:.16em;text-transform:uppercase;margin:12px 0 0;color:rgba(246,245,242,.88);}
.lh .myth{font-family:var(--f-sec);font-style:normal;font-weight:400;font-size:clamp(18px,2.1vw,28px);line-height:1.22;letter-spacing:-.005em;margin:14px 0 0;max-width:30ch;}
.lh .base{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:clamp(20px,3vw,40px);align-items:end;margin-top:clamp(24px,3vw,36px);border-top:1px solid rgba(246,245,242,.42);padding-top:14px;}
.lh .intro{font-size:14px;line-height:1.55;color:rgba(246,245,242,.88);margin:0 0 14px;max-width:52ch;}
.lh .sys{list-style:none;margin:0;padding:0;}
.lh .sys li{display:grid;grid-template-columns:minmax(92px,auto) 1fr auto;gap:14px;align-items:baseline;padding:8px 0;border-top:1px solid rgba(246,245,242,.2);font-size:13px;}
.lh .sys li b{font-family:var(--f-display);font-weight:700;letter-spacing:.05em;}
.lh .sys li span.d{font-family:var(--f-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:rgba(246,245,242,.7);text-align:right;white-space:nowrap;}
.lh .proof{background:var(--accent);color:#161616;padding:20px 22px;display:flex;flex-direction:column;gap:12px;}
.lh .proof .dash{display:block;width:30px;height:6px;background:#161616;}
.lh .proof .res{font-family:var(--f-display);font-weight:700;font-size:clamp(17px,1.8vw,23px);line-height:1.15;letter-spacing:-.015em;}
.lh .proof .t{color:#161616;}
.lh .proof .res + .res{font-size:clamp(14px,1.3vw,16px);font-weight:600;border-top:1px solid rgba(28,28,26,.35);padding-top:10px;}
.lh.right .name,.lh.right .myth{text-align:right;margin-left:auto;}

/* four systems as a 2x2 grid */
.introcard{
  position:relative;isolation:isolate;overflow:hidden;
  display:grid;grid-template-columns:1fr;gap:clamp(20px,3vw,40px);
  border:1px solid var(--rule-strong);padding:clamp(24px,3vw,40px);margin-bottom:clamp(14px,1.8vw,22px);
  color:#F6F5F2;
}
.introcard > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:46% 33%;z-index:-2;filter:grayscale(1) sepia(.55) hue-rotate(105deg) saturate(.85) contrast(1.08) brightness(.56);}
.introcard .icshade{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(10,14,12,.62) 0%,rgba(10,14,12,.42) 45%,rgba(10,14,12,.72) 100%);}
.introcard .t{color:rgba(246,245,242,.72);}
.introcard .t.dim{color:rgba(246,245,242,.55);}
.introcard .code{font-family:var(--f-display);font-weight:700;font-stretch:112%;font-size:clamp(34px,6vw,76px);line-height:1;letter-spacing:-.03em;margin:14px 0 18px;display:flex;align-items:baseline;gap:.04em;}
.introcard .code i{font-style:normal;color:rgba(246,245,242,.5);}
.introcard .code span:nth-child(1){color:#F6F5F2;}
.introcard .code span:nth-child(3){color:var(--signal);}
.introcard .code span:nth-child(5){color:var(--green-pale);}
.introcard .legend{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;}
.introcard .legend .lt,.introcard .legend .lv{
  min-width:0;padding-inline:clamp(10px,1.2vw,16px);
  border-left:1px solid rgba(246,245,242,.22);
}
.introcard .legend .lt{
  grid-row:1;align-self:end;
  font-family:var(--f-code);font-size:11px;font-weight:500;letter-spacing:.12em;line-height:1.3;
  text-transform:uppercase;color:rgba(246,245,242,.6);padding-bottom:9px;
}
.introcard .legend .lrule{
  grid-row:2;grid-column:1/-1;height:1px;background:rgba(246,245,242,.62);
  border:0;padding:0;margin:0;
}
.introcard .legend .lv{
  grid-row:3;font-family:var(--f-sec);font-size:clamp(12.5px,1.25vw,14px);line-height:1.45;
  letter-spacing:.01em;color:#F6F5F2;padding-top:10px;
}
.introcard .legend .lt:nth-child(1),.introcard .legend .lv:nth-child(7){border-left:0;padding-left:0;}
@media (max-width:699px){
  .introcard .legend{grid-template-columns:minmax(84px,34%) 1fr;}
  .introcard .legend .lrule{display:none;}
  .introcard .legend .lt,.introcard .legend .lv{
    border-left:0;padding-inline:0;padding-block:9px;
    border-bottom:1px solid rgba(246,245,242,.22);display:flex;align-items:center;gap:.45em;
  }
  .introcard .legend .lt{grid-column:1;align-self:stretch;}
  .introcard .legend .lv{grid-column:2;display:block;}
  .introcard .legend .lt:nth-child(1),.introcard .legend .lv:nth-child(7){grid-row:1;}
  .introcard .legend .lt:nth-child(2),.introcard .legend .lv:nth-child(8){grid-row:2;}
  .introcard .legend .lt:nth-child(3),.introcard .legend .lv:nth-child(9){grid-row:3;}
  .introcard .legend .lt:nth-child(4),.introcard .legend .lv:nth-child(10){grid-row:4;}
  .introcard .legend .lt:nth-child(5),.introcard .legend .lv:nth-child(11){grid-row:5;}
}
.introcard .ic-r{display:flex;flex-direction:column;}
.introcard .roster{display:grid;gap:0;grid-auto-rows:minmax(min-content,1fr);flex:1;border-top:1px solid rgba(246,245,242,.62);margin:14px 0 0;}
.introcard .roster > div{display:grid;grid-template-columns:minmax(76px,104px) 1fr;align-items:center;gap:16px;padding:12px 0;border-bottom:1px solid rgba(246,245,242,.22);}
.introcard .roster .rc{font-family:var(--f-display);font-weight:700;font-stretch:112%;font-size:clamp(24px,2.55vw,33px);line-height:1;letter-spacing:-.02em;color:#F6F5F2;}
.introcard .roster > div:nth-child(2) .rc{color:var(--signal);}
.introcard .roster .rd{font-size:clamp(15px,1.6vw,18.5px);line-height:1.25;color:rgba(246,245,242,.9);}
.introcard .ic-l > p:not(.code),.introcard .ic-r p{margin:14px 0 0;font-size:clamp(14px,1.45vw,16.5px);line-height:1.55;max-width:52ch;color:rgba(246,245,242,.9);}
.introcard .ic-r p strong{color:#F6F5F2;}
.introcard .ic-r p:last-child{margin-bottom:0;}
.introcard .ic-l > p:not(.code){color:rgba(246,245,242,.9);}
@media (min-width:860px){.introcard{grid-template-columns:minmax(0,42fr) minmax(0,58fr);}}
.lgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,1.6vw,20px);margin-top:26px;}
.lgrid .lh{margin-top:0;min-height:clamp(560px,52vw,680px);}
.lgrid .lh .edge{inset:clamp(10px,1.2vw,16px);border-radius:14px;}
.lgrid .lh .in{padding:clamp(26px,2.8vw,40px) clamp(24px,2.8vw,40px);}
.lgrid .lh .name{font-size:clamp(46px,6.2vw,86px);margin:clamp(22px,2.4vw,34px) 0 0;}
.lgrid .lh .base{margin-top:clamp(18px,2vw,26px);flex:1;align-items:start;}
.lgrid .lh .proof{align-self:end;}
.lgrid .lh .myth{margin-bottom:clamp(24px,2.6vw,36px);}
.lgrid .lh .myth{font-size:clamp(19px,1.9vw,26px);max-width:24ch;text-wrap:balance;}
.lgrid .lh .base{grid-template-columns:1fr;gap:16px;}
.lgrid .lh .proof{padding:16px 18px;gap:10px;}
.lgrid .lh .proof .res{font-size:clamp(15px,1.4vw,19px);}
.lgrid .lh .proof .res + .res{font-size:clamp(13px,1.1vw,15px);}
.lgrid .lh.right .name,.lgrid .lh.right .myth{text-align:left;margin-left:0;}
@media (max-width:860px){ .lgrid{grid-template-columns:1fr;} .lgrid .lh .name{font-size:clamp(56px,15vw,120px);} }
@media (max-width:760px){
  .lh .base{grid-template-columns:1fr;}
  .lh .sys li{grid-template-columns:1fr auto;}
  .lh .sys li span.n{grid-column:1 / -1;order:3;color:rgba(246,245,242,.75);}
  .lh.right .name,.lh.right .myth{text-align:left;margin-left:0;}
}

/* ================= system viewer + sector plates (split plate) ================= */
.splitplate{
  display:grid;grid-template-columns:minmax(0,34fr) minmax(0,66fr);
  border:1px solid var(--rule-strong);
}
.sp-l{
  background:var(--panel);color:var(--ink);
  padding:clamp(18px,2.2vw,26px);
  display:flex;flex-direction:column;gap:18px;position:relative;
}
.sp-r{position:relative;background:#243029;color:#F6F5F2;overflow:hidden;min-height:100%;}
.sp-r > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(1) sepia(.5) hue-rotate(105deg) saturate(.8) contrast(1.08) brightness(.66);}
.sp-r .hatch{position:absolute;inset:0;background:#35373A repeating-linear-gradient(135deg,rgba(246,245,242,.075) 0 1px,transparent 1px 12px);}
.sp-r .shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.28),rgba(0,0,0,0) 38%,rgba(0,0,0,.32));}
.sp-r .t{color:#F6F5F2;}
.sp-r .t.soft{color:rgba(246,245,242,.72);}

/* annotations sit top-left on the photo, two short columns */
.anno{position:absolute;top:clamp(18px,2.4vw,28px);left:clamp(18px,2.6vw,32px);right:clamp(18px,2.6vw,32px);
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 28px;max-width:560px;}
.anno p{margin:4px 0 0;font-size:12.5px;line-height:1.5;color:rgba(246,245,242,.9);max-width:32ch;}

/* the oversized characters */
.huge{
  position:absolute;left:clamp(16px,2.4vw,30px);bottom:clamp(28px,3vw,38px);
  font-family:var(--f-display);font-weight:600;font-stretch:125%;
  line-height:.8;letter-spacing:-.04em;text-transform:uppercase;color:#F6F5F2;margin:0;
}
.huge .ix{display:block;font-size:clamp(44px,7.4vw,104px);letter-spacing:-.05em;margin-bottom:.12em;}
.huge .cd{display:block;font-size:clamp(84px,15vw,212px);}
.huge.hs .cd.long{font-size:clamp(28px,4.2vw,56px);}
.huge.hs .cd{font-stretch:100%;font-size:clamp(38px,6.4vw,92px);letter-spacing:-.035em;}

.figtag{position:absolute;left:clamp(18px,2.6vw,32px);bottom:11px;font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:rgba(246,245,242,.62);}

/* the orange block */
.oblock{
  position:absolute;right:0;bottom:0;width:min(38%,300px);min-height:44%;
  background:var(--accent);color:#161616;
  padding:18px 20px;display:flex;flex-direction:column;justify-content:space-between;gap:14px;
}
.oblock .dash{display:block;width:30px;height:6px;background:#161616;}
.oblock .res{font-family:var(--f-display);font-weight:700;font-size:clamp(15px,1.5vw,19px);line-height:1.2;letter-spacing:-.015em;}
.oblock .res + .res{font-size:clamp(12.5px,1.15vw,15px);font-weight:600;border-top:1px solid currentColor;padding-top:8px;margin-top:8px;opacity:.92;}
.oblock .t{color:#161616;}

/* left-panel parts */
.sp-l .name{font-family:var(--f-display);font-weight:600;font-size:clamp(19px,2vw,26px);line-height:1.05;letter-spacing:-.02em;text-transform:uppercase;margin:6px 0 0;}
.sp-l .corner{display:grid;grid-template-columns:1fr 1fr;gap:10px 16px;margin-top:auto;border-top:1px solid var(--rule-strong);padding-top:9px;}
.sp-l .corner .k{display:block;color:var(--muted);}
.chev{
  appearance:none;border:0;background:none;padding:0;cursor:pointer;color:var(--ink);
  width:clamp(58px,7vw,86px);align-self:flex-start;
}
.chev svg{display:block;width:100%;height:auto;}
.chev:hover{color:var(--accent);}
.slashes{display:flex;gap:7px;align-items:center;flex-wrap:wrap;}
.slashes button{
  appearance:none;border:0;padding:0;cursor:pointer;
  width:5px;height:18px;background:var(--grey-1);transform:skewX(-28deg);
}
.slashes button[aria-current="true"]{background:var(--accent);}
.slashes button:hover{background:var(--ink);}
.sysrow{display:flex;align-items:center;gap:16px;}
.sysrow .count{font-variant-numeric:tabular-nums;}

/* the nine-system viewer */
.sysview .splitplate{height:clamp(560px,50vw,640px);}
.sysview .sp-l .lead{font-size:13.5px;line-height:1.55;margin:0;max-width:36ch;}

/* sector plates */
.sector + .sector{border-top:none;}
.sector{min-height:460px;}
.applist{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr;}
.applist li{font-family:var(--f-mono);font-size:10px;font-weight:500;letter-spacing:.13em;text-transform:uppercase;padding:6px 0;border-bottom:1px solid var(--rule);}
.applist li:first-child{border-top:1px solid var(--rule-strong);}

@media (max-width:820px){
  .splitplate{grid-template-columns:1fr;}
  .sysview .splitplate{height:auto;}
  .sp-r{min-height:440px;order:-1;}
  .sector{min-height:0;}
  .anno{grid-template-columns:1fr;}
  .anno > div:nth-child(2){display:none;}
  .oblock{width:52%;min-height:0;}
}


/* six sectors as a 2-column grid */
#applications .sechead{margin-bottom:39px;}
#proving{
  padding-top:33px;position:relative;isolation:isolate;
  --grid-ink:rgba(22,22,22,.055);
}
#proving::before{
  content:"";position:absolute;inset:33px 0 54px;z-index:-1;pointer-events:none;
  border-bottom:1px solid var(--grid-ink);
  background-image:
    linear-gradient(to right,var(--grid-ink) 1px,transparent 1px),
    linear-gradient(to bottom,var(--grid-ink) 1px,transparent 1px);
  background-size:clamp(56px,6vw,88px) clamp(56px,6vw,88px);
  background-position:0 0;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) #proving{--grid-ink:rgba(246,245,242,.075);}}
:root[data-theme="dark"] #proving{--grid-ink:rgba(246,245,242,.075);}
#proving .sechead{margin-bottom:39px;}
.sgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,1.6vw,20px);}
.sgrid .sector{min-height:0;grid-template-columns:1fr;grid-template-rows:auto 1fr;}
.sgrid .sector + .sector{border-top:1px solid var(--rule-strong);}
.sgrid .sp-r{order:-1;min-height:clamp(380px,36vw,450px);}
.sgrid .anno{grid-template-columns:1fr;max-width:56%;gap:10px;}
.sgrid .anno p{font-size:12px;}
.sgrid .huge .ix{font-size:clamp(30px,3.6vw,50px);}
.sgrid .huge.hs .cd{font-size:clamp(28px,3.4vw,46px);}
.sgrid .huge.hs .cd.long{font-size:clamp(22px,2.5vw,32px);}
.sgrid .oblock{width:min(44%,250px);min-height:0;padding:16px 18px;}
.sgrid .oblock .res{font-size:clamp(14px,1.25vw,16px);}
.sgrid .sp-l{gap:14px;}
.sgrid .applist{grid-template-columns:1fr 1fr;column-gap:18px;}
.sgrid .applist li:nth-child(2){border-top:1px solid var(--rule-strong);}
@media (max-width:820px){ .sgrid{grid-template-columns:1fr;} .sgrid .anno{max-width:none;} }
@media (max-width:560px){
  .sgrid .applist{grid-template-columns:1fr;} .sgrid .applist li:nth-child(2){border-top:0;}
  .sgrid .sp-r{display:flex;flex-direction:column;justify-content:flex-end;min-height:420px;padding-top:150px;}
  .sgrid .huge{position:relative;left:auto;bottom:auto;margin:0 18px 18px;}
  .sgrid .oblock{position:relative;width:auto;right:auto;bottom:auto;}
  .sgrid .figtag{display:none;}
}

/* tick scale, borrowed from the drawing margin */
.tickcol{
  width:26px;flex:none;
  background:repeating-linear-gradient(
    to bottom,
    var(--rule-strong) 0 1px,
    transparent 1px 13px);
  opacity:.5;
}

/* ================= sections ================= */
section{padding-block:22px 54px;}
.sechead{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:10px 22px;
  align-items:baseline;
  border-top:1px solid var(--rule-strong);
  padding-top:9px;
  margin-bottom:26px;
}
.sechead .idx{font-family:var(--f-mono);font-weight:600;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--signal);}
.sechead .ttl{grid-column:1 / -1;}
.sechead .t.dim{color:var(--green);}

/* problem section */
.problede{margin:0;}
.pgrid{display:grid;grid-template-columns:1fr;gap:clamp(12px,1.6vw,20px);margin-top:26px;}
@media (min-width:860px){.pgrid{grid-template-columns:repeat(2,minmax(0,1fr));}}
.pcard{border:1px solid var(--rule-strong);padding:clamp(20px,2.4vw,32px);display:flex;flex-direction:column;}
.pcard .ptop{display:flex;justify-content:space-between;align-items:baseline;gap:14px;}
.pcard .ptop .sys{color:var(--signal);}
.pcard .pname{
  font-family:var(--f-display);font-weight:700;font-stretch:112%;
  font-size:clamp(26px,3.1vw,42px);line-height:1.02;letter-spacing:-.03em;
  text-transform:uppercase;margin:14px 0 0;max-width:none;
}
.pcard .plist{list-style:none;margin:20px 0 0;padding:0;border-top:1px solid var(--rule-strong);flex:1;display:grid;grid-auto-rows:minmax(min-content,1fr);}
.pcard .plist li{
  display:grid;grid-template-columns:14px 1fr;gap:14px;align-items:start;
  padding:11px 0;border-bottom:1px solid var(--rule);
  font-size:clamp(13.5px,1.3vw,15.5px);line-height:1.42;
}
.pcard .plist li::before{content:"";width:14px;height:1px;background:var(--signal);margin-top:.68em;}
.pcard .pcost{background:var(--accent);color:#161616;padding:16px 18px;margin-top:18px;}
.pcard .pcost .fig{font-family:var(--f-display);font-weight:700;font-size:clamp(17px,1.7vw,22px);line-height:1.18;letter-spacing:-.02em;}
.pcard .pcost .t{color:#161616;display:block;margin-top:8px;}

/* ================= figures ================= */
figure{margin:0;}
.shot{position:relative;background:var(--panel);overflow:hidden;}
.shot img{width:100%;height:100%;object-fit:cover;}
.shot.tall{aspect-ratio:21/9;}
.shot.mid{aspect-ratio:16/9;}
figcaption{
  font-family:var(--f-mono);font-weight:500;font-size:10px;
  letter-spacing:.14em;text-transform:uppercase;color:var(--muted);
  border-top:1px solid var(--rule);padding-top:7px;margin-top:7px;
}

/* ================= data figures ================= */
.datarow{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  border-top:1px solid var(--rule-strong);
}
.dat{padding:14px 22px 20px 0;border-right:1px solid var(--rule);}
.dat:last-child{border-right:none;}
.dat .n{
  font-family:var(--f-display);font-weight:700;font-stretch:112%;
  font-size:clamp(44px,7vw,82px);line-height:.88;letter-spacing:-.05em;
  font-variant-numeric:tabular-nums;display:block;margin-top:6px;
}
.dat .n i{font-style:normal;font-weight:500;font-size:.26em;color:var(--signal);letter-spacing:.06em;margin-left:.2em;vertical-align:.9em;}
.dat .cap{display:block;margin-top:12px;max-width:24ch;}

/* ================= tables ================= */
.split>*,.cols>*,.fields>*,.datarow>*,.giantwrap>*{min-width:0;}
.tablewrap{overflow-x:auto;max-width:100%;}
table{border-collapse:collapse;width:100%;min-width:520px;font-family:var(--f-display);font-size:13.5px;}
thead th{
  text-align:left;font-weight:600;font-size:10px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--muted);
  padding:0 14px 7px 0;border-bottom:1px solid var(--rule-strong);
}
tbody td{border-bottom:1px solid var(--rule);padding:9px 14px 9px 0;vertical-align:top;}
tbody tr:last-child td{border-bottom:1px solid var(--rule-strong);}
td.k{color:var(--muted);font-size:10px;letter-spacing:.14em;text-transform:uppercase;font-weight:500;white-space:nowrap;padding-top:12px;}
td.v{font-weight:500;}
td.code{font-family:var(--f-mono);font-weight:700;letter-spacing:.08em;white-space:nowrap;}
tr.cat td{padding:16px 0 7px;border-bottom:1px solid var(--rule-strong);font-family:var(--f-mono);font-size:10px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--signal);}
td.num{font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--muted);}

/* ================= spec panel ================= */
.spec{border:1px solid var(--rule-strong);padding:22px;}
.spec .mark{
  font-family:var(--f-display);font-weight:700;font-size:21px;
  letter-spacing:.3em;margin-right:-.3em;display:block;text-transform:uppercase;
}
.spec .bar{border-top:2px solid var(--green);margin:8px 0 6px;}
.spec dl{margin:18px 0 0;display:grid;grid-template-columns:auto 1fr;gap:5px 16px;}
.spec dt{font-weight:700;}
.spec dd{margin:0;color:var(--muted);}

/* ================= charts ================= */
.chart{margin-block:0 30px;}
#proving .split{align-items:stretch;}
#proving .split > .chart:first-child .btrack,#proving .split > .chart:first-child .bbar{height:90px;}
#proving .split > .chart:first-child .brow{margin-bottom:13px;}
.split > .chart{display:flex;flex-direction:column;height:100%;}
.split > .chart > .takeaway{margin-top:auto;}
.chart .src{margin:6px 0 20px;}
.brow{display:grid;grid-template-columns:minmax(110px,180px) 1fr 62px;align-items:center;gap:14px;margin-bottom:11px;}
.blab{font-family:var(--f-mono);font-size:10px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;line-height:1.4;}
.blab em{display:block;font-style:normal;font-weight:400;color:var(--muted);}
.blab[style] em{color:var(--muted);}
.btrack{border-left:1px solid var(--rule-strong);height:28px;}
.bbar{height:28px;background:var(--accent);}
.bbar.mut{background:var(--grey-1);}
.bbar.mid{background:var(--green);}
.bval{font-family:var(--f-display);font-size:14px;font-weight:700;text-align:right;font-variant-numeric:tabular-nums;letter-spacing:-.02em;}
.bticks{grid-column:2;display:flex;justify-content:space-between;border-top:1px solid var(--rule-strong);padding-top:6px;}
.btick{font-family:var(--f-mono);font-weight:500;font-size:9px;letter-spacing:.14em;color:var(--muted);text-transform:uppercase;}
.takeaway{
  border-top:1px solid var(--rule-strong);padding-top:9px;margin-top:5px;
  font-family:var(--f-mono);font-size:10px;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;line-height:1.6;
}

/* ================= lists ================= */
.chips{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:0;margin:0;padding:0;list-style:none;border-top:1px solid var(--rule-strong);}
.chips li{
  font-family:var(--f-mono);font-weight:500;font-size:10px;
  letter-spacing:.14em;text-transform:uppercase;
  padding:10px 14px 10px 0;border-bottom:1px solid var(--rule);
}
.chips li::before{content:attr(data-n);color:var(--muted);margin-right:10px;font-variant-numeric:tabular-nums;}

.cols{display:grid;gap:30px;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));}
.cols h4{margin:0 0 9px;}
.cols p{font-size:14px;margin:0;}
.step{border-top:1px solid var(--rule);padding-top:9px;}
.step .n{color:var(--signal);font-weight:600;}
.split{display:grid;gap:36px;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;}
.split.wide-left{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);}

/* ================= close ================= */
.contact{border-top:3px solid var(--rule-strong);padding-block:44px 40px;}
.mail{
  font-family:var(--f-display);font-weight:700;font-stretch:112%;
  font-size:clamp(15px,2.2vw,24px);letter-spacing:-.035em;
  color:var(--signal);text-decoration:none;
  text-transform:lowercase;display:inline-block;margin-top:10px;
}
.mail.sub{display:block;font-size:clamp(13px,1.6vw,18px);margin-top:18px;}
.cgrid{display:grid;grid-template-columns:1fr;gap:26px clamp(30px,4.4vw,64px);}
.cgrid .cnote{font-size:13px;line-height:1.55;color:var(--muted);margin:10px 0 0;max-width:42ch;}
.cgrid .gov{border-left:3px solid var(--signal);padding-left:clamp(16px,2vw,24px);}
@media (min-width:860px){.cgrid{grid-template-columns:1fr 1fr;}}
.regions{margin-top:clamp(30px,4vw,48px);border-top:1px solid var(--rule-strong);padding-top:11px;}
.regions ul{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:0 clamp(20px,3.4vw,52px);}
.regions li{
  font-family:var(--f-display);font-weight:600;font-size:clamp(12px,1.2vw,15px);
  letter-spacing:.01em;text-transform:uppercase;white-space:nowrap;
  padding:9px 0;
}

footer{padding-bottom:40px;}
.foot-line{
  border-top:1px solid var(--rule-strong);padding-top:11px;
  display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;
}

@media (max-width:760px){
  .split,.split.wide-left{grid-template-columns:1fr;gap:26px;}
  .metabar{grid-template-columns:1fr 1fr;}
  .metabar .mark{grid-row:1;grid-column:2;justify-self:end;}
  .dat{border-right:none;border-bottom:1px solid var(--rule);padding-right:0;}
  .dat:last-child{border-bottom:none;}
  .brow{grid-template-columns:minmax(88px,120px) 1fr 52px;gap:10px;}
  .tickcol{display:none;}
  section{padding-block:18px 42px;}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;}}


/* Keep the full-width artifact layout inside WordPress. */
.wp-site-blocks{padding:0} .wp-site-blocks > *{margin-block-start:0} body{padding:0} html{scroll-padding-top:80px} body.admin-bar .nav{top:32px} @media(max-width:782px){body.admin-bar .nav{top:46px}}
:focus-visible{outline:2px solid var(--signal);outline-offset:5px}
