/* ==========================================================================
   WSBL Ltd — "The Isolation"
   --------------------------------------------------------------------------
   base.css owns reset, wrap, sections, header/nav mechanics, buttons, forms,
   footer skeleton, reveals, preloader shell and the hero headline contract.
   This file supplies the tokens, the machine-foot drawing, the specimen plates
   and the two-trace figure. No @import. Every value comes from :root.
   ========================================================================== */

:root{
  /* ---------- the material palette ---------- */
  --carbon:     #101214;   /* ground */
  --paper:      #f2f0ea;   /* the page, and the drawing sheet */
  --orange:     #d4552a;   /* the isolation mount — the one accent */
  --orange-lit: #ef6a38;
  --steel:      #9aa1a7;
  --sage:       #8d9b8a;

  /* ---------- surfaces mixed from the palette ---------- */
  --ink:        var(--carbon);
  --ink-2:      #15181b;
  --ink-3:      #1c2024;
  --surface:    var(--paper);
  --surface-2:  #e7e3d9;
  --text:       #f2f0ea;
  --muted:      #8f969c;
  --ink-text:   #14161a;
  --ink-mute:   #5f5f58;

  /* ---------- base.css expects these names ---------- */
  --accent:     var(--orange);
  --accent-lit: var(--orange-lit);
  --accent-2:   var(--orange);
  --line:       color-mix(in srgb, var(--paper) 14%, transparent);
  --line-d:     color-mix(in srgb, var(--carbon) 16%, transparent);

  /* ---------- type ---------- */
  --font-display: "Bitter", "Rockwell", Georgia, serif;
  --font-body:    "Merriweather Sans", system-ui, -apple-system, sans-serif;
  --font-mono:    "Nanum Gothic Coding", ui-monospace, SFMono-Regular, monospace;

  --wrap-max: 1240px;
  --pad: clamp(1.15rem, 4vw, 2.6rem);
  --radius: 2px;
  --ease: cubic-bezier(.22,.61,.36,1);
}

html{ scroll-padding-top:92px; }
body{ font-size:16.5px; background:var(--carbon); }

::selection{ background:var(--orange); color:var(--carbon); }
:focus-visible{ outline:2px solid var(--orange); outline-offset:3px; }

/* paper grain — one texture over the whole page, never over the nav */
body::after{
  content:""; position:fixed; inset:0; z-index:890;
  pointer-events:none; opacity:.028;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:160px 160px;
}

.skip{
  position:absolute; left:.5rem; top:.5rem; z-index:10000;
  width:1px; height:1px; overflow:hidden; clip-path:inset(50%);
  padding:.8rem 1.15rem;
  background:var(--orange); color:var(--carbon);
  font-family:var(--font-mono); font-size:.68rem; letter-spacing:.1em; text-transform:uppercase;
}
.skip:focus{ width:auto; height:auto; clip-path:none; }

/* ==========================================================================
   PRELOADER — a trace hitting a mount
   ========================================================================== */
.pre{ background:var(--carbon); }
.pre__mark{ width:min(190px,52vw); color:var(--paper); }
.pre__mark svg{ width:100%; height:auto; display:block; }
.pre__trace{ color:var(--paper); opacity:.85; }
.pre__trace--flat{ color:var(--orange); opacity:1; }
.pre__mount{ color:var(--orange); }
.pre__slab{ color:var(--steel); }
.pre__meta{ letter-spacing:.18em; }
.pre__bar i{ background:var(--orange); }

/* ==========================================================================
   HEADER
   ========================================================================== */
.hdr{ background:var(--carbon); border-bottom:1px solid var(--line); }
.hdr__in{ min-height:84px; gap:1.4rem; }

/* the legacy wordmark is blue/green; on carbon it reads as a white silhouette */
.brand img{ width:152px; filter:brightness(0) invert(1); opacity:.94; }

.nav__list{ gap:.05rem; }
.nav__link{
  font-family:var(--font-body);
  font-size:.79rem; font-weight:400; letter-spacing:.005em;
  color:color-mix(in srgb, var(--paper) 82%, transparent);
  padding:.6rem .66rem;
  border-radius:2px;
}
.nav__link:hover{ color:var(--orange-lit); background:transparent; }

.hdr__cta{
  display:inline-flex; align-items:center; gap:.45rem;
  flex-shrink:0;
  padding:.5rem 0 .45rem;
  border-bottom:1px solid var(--orange);
  font-family:var(--font-mono); font-size:.64rem; letter-spacing:.13em; text-transform:uppercase;
  color:var(--paper);
  transition:color .18s, border-color .18s;
}
.hdr__cta svg{ width:13px; height:13px; transition:transform .22s var(--ease); }
.hdr__cta:hover{ color:var(--orange-lit); }
.hdr__cta:hover svg{ transform:translateX(3px); }
@media (min-width:1024px){ .nav__foot{ display:none; } }

/* ==========================================================================
   HERO — the machine foot
   ========================================================================== */
.hero{
  position:relative;
  overflow:hidden;
  padding-block:clamp(3.4rem,6vw,5.6rem) 0;
  background:
    radial-gradient(58% 62% at 82% 34%, color-mix(in srgb, var(--orange) 13%, transparent) 0%, transparent 72%),
    linear-gradient(to right, color-mix(in srgb, var(--steel) 7%, transparent) 1px, transparent 1px) 0 0/88px 88px,
    linear-gradient(to bottom, color-mix(in srgb, var(--steel) 7%, transparent) 1px, transparent 1px) 0 0/88px 88px,
    var(--carbon);
}
.hero__grid{
  display:grid;
  grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);
  gap:clamp(1.6rem,4vw,3.6rem);
  align-items:center;
  padding-bottom:clamp(2.6rem,5vw,4.2rem);
}
.hero__eyebrow{
  display:flex; flex-wrap:wrap; align-items:center; gap:.65rem;
  font-family:var(--font-mono); font-size:.62rem; letter-spacing:.15em; text-transform:uppercase;
  color:var(--steel);
  margin-bottom:1.6rem;
}
.hero__dot{
  width:7px; height:7px; background:var(--orange); flex-shrink:0;
}
.hero__place{ color:color-mix(in srgb, var(--steel) 72%, transparent); }
.hero__place::before{ content:"· "; }

.hero__h1{
  font-family:var(--font-display);
  font-weight:600;
  letter-spacing:-.042em;
  color:var(--paper);
  margin-bottom:1.5rem;
}
.hero__h1 em{ font-style:normal; color:var(--orange); }

.hero__lead{
  max-width:46ch;
  font-size:1rem; font-weight:300; line-height:1.76;
  color:color-mix(in srgb, var(--paper) 68%, transparent);
  margin-bottom:2rem;
}
.hero__acts{ display:flex; flex-wrap:wrap; gap:.7rem; margin-bottom:2.6rem; }

.btn{
  border-radius:2px;
  font-family:var(--font-mono); font-size:.68rem; font-weight:700;
  letter-spacing:.11em; text-transform:uppercase;
  padding:.95rem 1.3rem;
}
.btn--solid{ background:var(--orange); color:var(--carbon); }
.btn--solid:hover{ background:var(--orange-lit); transform:translateY(-2px); }
.btn--ghost{ border:1px solid var(--line); color:var(--paper); }
.btn--ghost:hover{ border-color:var(--orange); color:var(--orange); }
.btn--ink{ background:var(--carbon); color:var(--paper); }
.btn--ink:hover{ background:#000; transform:translateY(-2px); }
.btn--inkline{ border:1px solid color-mix(in srgb, var(--carbon) 45%, transparent); color:var(--carbon); }
.btn--inkline:hover{ border-color:var(--carbon); background:var(--carbon); color:var(--paper); }

.hero__facts{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1rem;
  border-top:1px solid var(--line);
  padding-top:1.15rem;
}
.hero__facts li{ display:grid; gap:.18rem; }
.hero__facts b{
  font-family:var(--font-display); font-weight:600; font-size:1rem;
  letter-spacing:-.015em; color:var(--paper);
}
.hero__facts span{
  font-family:var(--font-mono); font-size:.56rem; letter-spacing:.1em; text-transform:uppercase;
  color:var(--steel); line-height:1.5;
}

.hero__fig{
  width:108%;
  margin-right:-8%;
  align-self:center;
}
.fig{ width:100%; height:auto; display:block; overflow:visible; }
.fig__trace,
.fig__trace-hot,
.fig__trace-ghost{ fill:none; }
.fig__trace{ opacity:.92; }
.fig__trace-hot{ filter:drop-shadow(0 0 6px color-mix(in srgb, var(--orange) 45%, transparent)); }
.fig__beat{ animation:beat 4.8s ease-in-out infinite; transform-box:fill-box; transform-origin:center; }
@keyframes beat{ 0%,100%{ opacity:.55; transform:scale(.85); } 50%{ opacity:1; transform:scale(1.2); } }
.fig__labels{ font-size:12.5px; }

.hero__figcap{
  display:flex; justify-content:space-between; gap:1rem;
  margin-top:.9rem; padding-top:.65rem;
  border-top:1px solid var(--line);
  font-family:var(--font-mono); font-size:.58rem; letter-spacing:.09em; text-transform:uppercase;
  color:var(--steel);
}
.hero__figcap span:first-child{ color:var(--orange); }

.hero__strip{
  display:flex; flex-wrap:wrap; justify-content:space-between; gap:.5rem 1.5rem;
  border-top:1px solid var(--line);
  padding-block:1rem;
  font-family:var(--font-mono); font-size:.6rem; letter-spacing:.11em; text-transform:uppercase;
  color:color-mix(in srgb, var(--steel) 84%, transparent);
}
.hero__strip-l{ color:var(--paper); }

/* ==========================================================================
   01 — THE INTERRUPTION
   ========================================================================== */
.interrupt{ border-top:1px solid color-mix(in srgb, var(--carbon) 12%, transparent); }
.interrupt .sect__h2{ color:var(--ink-text); }

.trace{
  margin-top:clamp(1.8rem,3.6vw,3rem);
  border:1px solid color-mix(in srgb, var(--carbon) 18%, transparent);
  background:#f7f5ef;
}
.trace__bar{
  display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:.6rem 1.4rem;
  padding:.72rem 1rem;
  border-bottom:1px solid color-mix(in srgb, var(--carbon) 15%, transparent);
  font-family:var(--font-mono); font-size:.6rem; letter-spacing:.11em; text-transform:uppercase;
  color:var(--ink-mute);
}
.trace__tag{ color:var(--ink-text); }
.trace__legend{ display:flex; flex-wrap:wrap; gap:.5rem 1.3rem; }
.trace__key{ display:inline-flex; align-items:center; gap:.5rem; }
.trace__key i{ display:block; width:22px; height:0; border-top:2px solid var(--ink-mute); }
.trace__key--steel i{ border-color:#6b6b66; height:0; border-top-width:1px; }
.trace__key--hot i{ border-color:var(--orange); border-top-width:3px; }

.trace__plot{ padding:1.2rem 1rem .9rem; }
.trace__svg{ display:block; width:100%; height:clamp(250px,31vw,368px); overflow:visible; }

.trace__path{ stroke-linecap:round; stroke-linejoin:round; fill:none; }
.trace__path--heat{ filter:drop-shadow(0 0 7px color-mix(in srgb, var(--orange) 38%, transparent)); }
.trace__path{ stroke-dasharray:1; stroke-dashoffset:1; }

/* the pulse dot */
.trace__pulse{ opacity:.85; }
@media (prefers-reduced-motion: no-preference){
  .trace.is-in .trace__path{ animation:draw 2.3s var(--ease) forwards; }
  .trace.is-in .trace__path--hot{ animation-duration:2.8s; animation-delay:.15s; }
}
@keyframes draw{ to{ stroke-dashoffset:0; } }

.trace__foot{
  display:flex; flex-wrap:wrap; justify-content:space-between; gap:.5rem 1.4rem;
  padding:.8rem 1rem;
  border-top:1px solid color-mix(in srgb, var(--carbon) 15%, transparent);
}
.trace__note{
  font-size:.78rem; line-height:1.6; color:var(--ink-mute); max-width:62ch;
}
.trace__warn{
  font-family:var(--font-mono); font-size:.6rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--carbon); background:var(--orange); padding:.18rem .4rem; margin-right:.35rem;
}
.trace__fig{
  font-family:var(--font-mono); font-size:.58rem; letter-spacing:.1em; text-transform:uppercase;
  color:var(--ink-mute); white-space:nowrap;
}

.interrupt__grid{
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.12fr);
  gap:clamp(1.8rem,4vw,3.6rem);
  margin-top:clamp(2rem,4vw,3.2rem);
}
.interrupt__kicker{
  font-family:var(--font-mono); font-size:.6rem; letter-spacing:.16em; text-transform:uppercase;
  color:var(--orange); margin-bottom:.8rem;
}
.interrupt__col p:not(.interrupt__kicker){
  font-size:.93rem; line-height:1.75; color:var(--ink-mute); max-width:48ch;
}
.interrupt__col p + p{ margin-top:.9rem; }

.principles{ display:grid; gap:0; }
.principles li{
  display:grid; grid-template-columns:1.7rem minmax(0,1fr);
  column-gap:.7rem; row-gap:.2rem;
  padding-block:1rem;
  border-top:1px solid var(--line-d);
}
.principles li:last-child{ border-bottom:1px solid var(--line-d); }
.principles__n{
  font-family:var(--font-mono); font-size:.62rem; color:var(--orange);
  padding-top:.2rem;
}
.principles b{
  font-family:var(--font-display); font-weight:600; font-size:1.06rem;
  letter-spacing:-.02em; color:var(--ink-text);
}
.principles p{
  grid-column:2; font-size:.86rem; line-height:1.65; color:var(--ink-mute); max-width:44ch;
}

/* ==========================================================================
   02 — PRODUCTS — specimen plates
   ========================================================================== */
.products{ background:var(--carbon); }
.products .sect__lead{ color:color-mix(in srgb, var(--paper) 66%, transparent); }
.plates{
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  gap:10px;
}
.plate{
  position:relative;
  display:flex; flex-direction:column;
  padding:clamp(1.1rem,2vw,1.5rem);
  border:1px solid var(--line);
  background:var(--ink-2);
  color:var(--paper);
  transition:transform .28s var(--ease), border-color .28s, background .28s;
}
.plate--paper{
  background:var(--paper); color:var(--ink-text);
  border-color:color-mix(in srgb, var(--paper) 40%, transparent);
}
.plate--wide{ grid-column:span 7; }
.plate:nth-child(2){ grid-column:span 5; }
.plate:nth-child(n+3){ grid-column:span 4; }

.plate__top{
  display:flex; justify-content:space-between; align-items:baseline; gap:.8rem;
  font-family:var(--font-mono); font-size:.6rem; letter-spacing:.14em; text-transform:uppercase;
}
.plate__code{ color:var(--orange); }
.plate__idx{ color:currentColor; opacity:.45; }

.plate__swatch{
  position:relative;
  margin-block:1rem .2rem;
  height:170px;
  background-image:url("assets/material-swatches.jpg");
  background-size:340%;
  background-repeat:no-repeat;
  border:1px solid color-mix(in srgb, var(--paper) 16%, transparent);
}
.plate--wide .plate__swatch{ height:250px; background-size:260%; }
.plate--paper .plate__swatch{ border-color:color-mix(in srgb, var(--carbon) 18%, transparent); }
.plate__swatch::after{
  content:""; position:absolute; inset:7px;
  border:1px solid color-mix(in srgb, var(--paper) 22%, transparent);
  pointer-events:none;
}
.plate--paper .plate__swatch::after{ border-color:color-mix(in srgb, var(--carbon) 16%, transparent); }
.plate__swatch--a{ background-position:52% 42%; }
.plate__swatch--b{ background-position:8% 88%; }
.plate__swatch--c{ background-position:74% 18%; background-size:390%; }
.plate__swatch--d{ background-position:22% 58%; background-size:300%; }
.plate__swatch--e{ background-position:92% 74%; background-size:370%; }

.plate__name{
  font-family:var(--font-display); font-weight:600;
  font-size:clamp(1.35rem,2.1vw,1.8rem); letter-spacing:-.025em; line-height:1.05;
  margin-top:1.1rem;
}
.plate--wide .plate__name{ font-size:clamp(1.7rem,2.6vw,2.35rem); }
.plate__desc{
  margin-top:.55rem;
  font-size:.87rem; line-height:1.62;
  color:color-mix(in srgb, var(--paper) 68%, transparent);
  max-width:52ch;
}
.plate--paper .plate__desc{ color:var(--ink-mute); }

.plate__spec{
  display:grid; gap:.32rem;
  margin-top:1.1rem; padding-top:.85rem;
  border-top:1px solid var(--line);
}
.plate--paper .plate__spec{ border-color:var(--line-d); }
.plate__spec div{ display:grid; grid-template-columns:4.1rem minmax(0,1fr); gap:.5rem; align-items:baseline; }
.plate__spec dt{
  font-family:var(--font-mono); font-size:.54rem; letter-spacing:.11em; text-transform:uppercase;
  color:var(--steel);
}
.plate__spec dd{ font-size:.79rem; line-height:1.45; }
.plate__spec dd{ color:color-mix(in srgb, var(--paper) 82%, transparent); }
.plate--paper .plate__spec dd{ color:var(--ink-text); }

.plate__link{
  margin-top:auto; padding-top:1.1rem;
  align-self:flex-start;
  font-family:var(--font-mono); font-size:.62rem; letter-spacing:.1em; text-transform:uppercase;
  color:var(--orange);
  border-bottom:1px solid color-mix(in srgb, var(--orange) 45%, transparent);
  transition:border-color .2s, color .2s;
}
.plate__link span{ display:inline-block; transition:transform .2s var(--ease); }
.plate__link:hover{ color:var(--orange-lit); border-color:var(--orange-lit); }
.plate__link:hover span{ transform:translateX(4px); }

@media (hover:hover) and (pointer:fine){
  .plate:hover{ transform:translateY(-3px); border-color:var(--orange); }
}

.plates__note{
  display:flex; flex-wrap:wrap; justify-content:space-between; gap:.6rem 1.4rem;
  margin-top:1.6rem; padding-top:1rem;
  border-top:1px solid var(--line);
  font-size:.8rem; line-height:1.6; color:color-mix(in srgb, var(--paper) 62%, transparent);
}
.plates__note a{
  font-family:var(--font-mono); font-size:.62rem; letter-spacing:.09em; text-transform:uppercase;
  color:var(--orange);
}
.plates__note a:hover{ color:var(--orange-lit); }

/* ==========================================================================
   03 — MANUFACTURING
   ========================================================================== */
.mfg{ background:var(--ink-2); border-block:1px solid var(--line); }
.mfg__grid{
  display:grid; grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);
  gap:clamp(1.8rem,4vw,3.6rem);
  align-items:start;
}
.shot{ border:1px solid var(--line); background:var(--carbon); }
.shot img{ width:100%; height:auto; aspect-ratio:4/3; object-fit:cover; filter:saturate(.82) contrast(1.04); }
.shot figcaption{
  padding:.6rem .7rem;
  border-top:1px solid var(--line);
  font-family:var(--font-mono); font-size:.56rem; letter-spacing:.08em; line-height:1.6;
  text-transform:uppercase; color:var(--steel);
}
.proc{
  display:grid; grid-template-columns:1fr 1fr;
  gap:0 1.4rem;
  margin-top:1.4rem;
  counter-reset:p;
}
.proc li{
  counter-increment:p;
  display:flex; align-items:baseline; gap:.5rem;
  padding-block:.62rem;
  border-bottom:1px solid var(--line);
  font-family:var(--font-mono); font-size:.66rem; letter-spacing:.07em; text-transform:uppercase;
  color:color-mix(in srgb, var(--paper) 78%, transparent);
}
.proc li::before{
  content:counter(p,decimal-leading-zero);
  font-size:.54rem; color:var(--orange);
}

.cap{ border:1px solid var(--line); background:color-mix(in srgb, var(--carbon) 55%, transparent); }
.cap__head{
  display:flex; justify-content:space-between; gap:1rem;
  padding:.7rem .95rem;
  border-bottom:1px solid var(--line);
  font-family:var(--font-mono); font-size:.58rem; letter-spacing:.13em; text-transform:uppercase;
  color:var(--steel);
}
.cap__head span:first-child{ color:var(--paper); }
.cap__row{
  display:grid; grid-template-columns:3.2rem minmax(0,1fr);
  gap:1rem; align-items:baseline;
  padding:.72rem .95rem;
  border-top:1px solid var(--line);
  transition:background .22s;
}
.cap__row:first-child{ border-top:0; }
.cap__row:hover{ background:color-mix(in srgb, var(--orange) 8%, transparent); }
.cap__row dt b{
  font-family:var(--font-display); font-weight:600; font-size:1.32rem; line-height:1;
  color:var(--orange); letter-spacing:-.02em;
}
.cap__row dd{ font-size:.85rem; line-height:1.55; color:color-mix(in srgb, var(--paper) 82%, transparent); }
.cap__foot{
  padding:.85rem .95rem;
  border-top:1px solid var(--line);
  font-family:var(--font-mono); font-size:.6rem; line-height:1.7; letter-spacing:.02em;
  color:var(--steel);
}

/* ==========================================================================
   04 — PROJECTS
   ========================================================================== */
.proj .sect__h2{ color:var(--ink-text); }
.proj__grid{
  display:grid; grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);
  gap:clamp(1.8rem,4vw,3.4rem);
  align-items:start;
}
.proj__media{ display:grid; gap:.8rem; }
.shot--tight figcaption{ text-transform:none; letter-spacing:.03em; font-size:.58rem; }

.ledger{ counter-reset:l; }
.ledger__row{
  display:grid; grid-template-columns:2.1rem minmax(0,1fr);
  column-gap:.8rem; row-gap:.12rem;
  padding-block:.88rem;
  border-top:1px solid var(--line-d);
}
.ledger__row:last-child{ border-bottom:1px solid var(--line-d); }
.ledger__n{
  font-family:var(--font-mono); font-size:.6rem; color:var(--orange);
  padding-top:.25rem;
}
.ledger__name{
  font-family:var(--font-display); font-weight:600; font-size:1.06rem;
  letter-spacing:-.018em; line-height:1.25; color:var(--ink-text);
  transition:color .2s;
}
.ledger__mat{
  grid-column:2;
  font-size:.79rem; line-height:1.55; color:var(--ink-mute);
}
.ledger__row:hover .ledger__name{ color:var(--orange); }
.proj__note{
  margin-top:1.3rem;
  font-size:.78rem; line-height:1.6; color:var(--ink-mute);
}
.proj__note a{
  font-family:var(--font-mono); font-size:.6rem; letter-spacing:.09em; text-transform:uppercase;
  color:var(--orange); margin-left:.5rem; white-space:nowrap;
}

/* ==========================================================================
   05 — CERTIFICATIONS & POLICY
   ========================================================================== */
.cert{ background:var(--carbon); }
.cert__grid{
  display:grid; grid-template-columns:minmax(0,3.1fr) minmax(0,4fr) minmax(0,4.4fr);
  gap:clamp(1.4rem,3.2vw,2.4rem);
  align-items:start;
}
.badge__plate{
  background:var(--paper);
  padding:clamp(1rem,2vw,1.5rem);
  border:1px solid color-mix(in srgb, var(--paper) 30%, transparent);
}
.badge__plate img{ width:100%; height:auto; }
.badge__cap{
  margin-top:.75rem;
  font-size:.74rem; line-height:1.6; color:color-mix(in srgb, var(--paper) 62%, transparent);
}
.badge__cap span{
  display:block;
  font-family:var(--font-mono); font-size:.56rem; letter-spacing:.12em; text-transform:uppercase;
  color:var(--orange); margin-bottom:.25rem;
}

.cert__h{
  font-family:var(--font-mono); font-size:.6rem; letter-spacing:.15em; text-transform:uppercase;
  color:var(--steel);
  padding-bottom:.65rem; border-bottom:1px solid var(--line);
}
.tested li{
  display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);
  gap:.7rem; align-items:baseline;
  padding-block:.62rem;
  border-bottom:1px solid var(--line);
}
.tested li span{
  font-family:var(--font-mono); font-size:.61rem; letter-spacing:.06em;
  color:var(--orange); text-transform:uppercase;
}
.tested li em{
  font-style:normal; font-size:.8rem; line-height:1.45;
  color:color-mix(in srgb, var(--paper) 84%, transparent);
}
.cert__fine{
  margin-top:.9rem; font-size:.72rem; line-height:1.6;
  color:color-mix(in srgb, var(--paper) 52%, transparent);
}
.cert__link{
  display:inline-block; margin-top:1.1rem;
  font-family:var(--font-mono); font-size:.6rem; letter-spacing:.09em; text-transform:uppercase;
  color:var(--paper); border-bottom:1px solid var(--line);
  padding-bottom:.3rem;
}
.cert__link:hover{ color:var(--orange); border-color:var(--orange); }

.policy{
  background:var(--paper); color:var(--ink-text);
  padding:clamp(1.1rem,2.2vw,1.6rem);
  border-top:4px solid var(--orange);
}
.policy__head{
  display:flex; flex-wrap:wrap; gap:.4rem;
  font-family:var(--font-mono); font-size:.6rem; letter-spacing:.12em; text-transform:uppercase;
  color:var(--ink-text);
  padding-bottom:.7rem; border-bottom:1px solid var(--line-d);
}
.policy__head span{ color:var(--orange); }
.policy__lede{
  margin-top:.8rem;
  font-size:.8rem; line-height:1.65; color:var(--ink-mute);
}
.policy__list{ margin-top:.9rem; display:grid; }
.policy__list li{
  display:grid; grid-template-columns:1.5rem minmax(0,1fr);
  gap:.4rem;
  padding-block:.5rem;
  border-top:1px solid color-mix(in srgb, var(--carbon) 12%, transparent);
  font-size:.78rem; line-height:1.55;
}
.policy__list li span{
  font-family:var(--font-mono); font-size:.55rem; color:var(--orange); padding-top:.15rem;
}
.policy__foot{
  margin-top:.8rem;
  font-family:var(--font-mono); font-size:.56rem; line-height:1.8; letter-spacing:.02em;
  color:var(--ink-mute);
}
.policy__foot a{ color:var(--orange); border-bottom:1px solid color-mix(in srgb, var(--orange) 40%, transparent); }

/* ==========================================================================
   06 — CONTACT
   ========================================================================== */
.contact{
  background:var(--orange);
  color:var(--carbon);
  padding-block:clamp(3.2rem,6vw,5rem);
}
.contact :focus-visible{ outline-color:var(--carbon); }
.contact__grid{
  display:grid; grid-template-columns:minmax(0,1.06fr) minmax(0,.94fr);
  gap:clamp(1.8rem,4vw,4rem);
  align-items:start;
}
.contact__num{
  font-family:var(--font-mono); font-size:.6rem; letter-spacing:.16em; text-transform:uppercase;
  color:color-mix(in srgb, var(--carbon) 62%, transparent);
  margin-bottom:.9rem;
}
.contact__h{
  font-family:var(--font-display); font-weight:600;
  font-size:clamp(2.05rem,4.6vw,3.5rem); line-height:1; letter-spacing:-.038em;
  color:var(--carbon);
}
.contact__lead{
  max-width:42ch; margin-top:1.1rem;
  font-size:.95rem; line-height:1.7;
  color:color-mix(in srgb, var(--carbon) 78%, transparent);
}
.contact__acts{ display:flex; flex-wrap:wrap; gap:.7rem; margin-top:1.8rem; }
.contact__acts .btn--inkline{ text-transform:none; letter-spacing:.03em; font-size:.8rem; }
.contact__panel{
  border-left:1px solid color-mix(in srgb, var(--carbon) 30%, transparent);
  padding-left:clamp(1.2rem,3vw,2.4rem);
}
.contact__tel{ display:block; padding-bottom:1.1rem; border-bottom:1px solid color-mix(in srgb, var(--carbon) 30%, transparent); }
.contact__tel-k{
  display:block;
  font-family:var(--font-mono); font-size:.58rem; letter-spacing:.14em; text-transform:uppercase;
  color:color-mix(in srgb, var(--carbon) 66%, transparent);
  margin-bottom:.3rem;
}
.contact__tel-v{
  display:block;
  font-family:var(--font-display); font-weight:600;
  font-size:clamp(1.65rem,3vw,2.3rem); letter-spacing:-.03em; line-height:1.05;
}
.contact__tel:hover .contact__tel-v{ text-decoration:underline; text-underline-offset:4px; }
.contact__rows{ display:grid; margin-top:.4rem; }
.contact__rows p{
  display:grid; grid-template-columns:5.4rem minmax(0,1fr); gap:.6rem;
  padding-block:.55rem;
  border-bottom:1px solid color-mix(in srgb, var(--carbon) 22%, transparent);
  font-size:.88rem;
}
.contact__rows span{
  font-family:var(--font-mono); font-size:.56rem; letter-spacing:.12em; text-transform:uppercase;
  color:color-mix(in srgb, var(--carbon) 62%, transparent);
  padding-top:.15rem;
}
.contact__rows a{ font-weight:600; overflow-wrap:anywhere; }
.contact__rows a:hover{ text-decoration:underline; text-underline-offset:3px; }
.contact__addr{
  margin-top:1.1rem;
  font-family:var(--font-mono); font-size:.66rem; line-height:1.9; letter-spacing:.01em;
  color:color-mix(in srgb, var(--carbon) 76%, transparent);
}

/* ==========================================================================
   FOOTER
   ========================================================================== */
.foot{ background:var(--carbon); border-top:1px solid var(--line); }
.foot__brand img{ width:138px; margin-bottom:1.2rem; filter:brightness(0) invert(1); opacity:.88; }
.foot__brand p{
  font-size:.82rem; line-height:1.7; max-width:36ch;
  color:color-mix(in srgb, var(--paper) 62%, transparent);
}
.foot__fine{
  margin-top:.8rem; font-size:.7rem !important;
  color:color-mix(in srgb, var(--paper) 40%, transparent) !important;
}
.foot__nav{ grid-template-columns:repeat(3,minmax(0,1fr)); }
.foot__addr{
  margin-top:1rem;
  font-family:var(--font-mono); font-size:.66rem; line-height:1.85;
  color:color-mix(in srgb, var(--paper) 48%, transparent);
}
.foot__bottom{ font-size:.58rem; letter-spacing:.05em; }

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width:1100px){
  .plates{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .plate--wide,
  .plate:nth-child(2),
  .plate:nth-child(n+3){ grid-column:span 1; }
  .plate--wide{ grid-column:span 2; }
  .cert__grid{ grid-template-columns:minmax(0,1fr) minmax(0,1.15fr); }
  .policy{ grid-column:1 / -1; }
}

@media (max-width:1023px){
  .hero__grid{ grid-template-columns:minmax(0,1fr); gap:2.4rem; }
  .hero__fig{ width:100%; max-width:560px; margin:0 auto; }
  .hero__figcap span:last-child{ max-width:52ch; }

  .interrupt__grid{ grid-template-columns:minmax(0,1fr); gap:1.6rem; }
  .mfg__grid{ grid-template-columns:minmax(0,1fr); }
  .mfg__media{ max-width:520px; }
  .proj__grid{ grid-template-columns:minmax(0,1fr); }
  .proj__media{ grid-template-columns:1fr 1fr; }
  .contact__grid{ grid-template-columns:minmax(0,1fr); gap:2.2rem; }
  .contact__panel{ border-left:0; padding-left:0; border-top:1px solid color-mix(in srgb, var(--carbon) 30%, transparent); padding-top:1.4rem; }
}

@media (max-width:720px){
  .hero__facts{ gap:.7rem; }
  .hero__facts span{ font-size:.52rem; letter-spacing:.06em; }
  .hero__place::before{ content:none; }
  .fig__labels{ font-size:17px; }
  .hero__strip{ flex-direction:column; gap:.25rem; }
  .plates{ grid-template-columns:minmax(0,1fr); gap:8px; }
  .plate--wide{ grid-column:span 1; }
  .plate--wide .plate__swatch{ height:190px; }
  .cert__grid{ grid-template-columns:minmax(0,1fr); }
  .badge{ max-width:340px; }
  .badge__plate img{ max-height:240px; object-fit:contain; }
  .proj__media{ grid-template-columns:1fr; }
  .ledger__row{ grid-template-columns:1.8rem minmax(0,1fr); }
  .trace__svg{ height:250px; }
  .trace__foot{ flex-direction:column; }
  .contact__rows p{ grid-template-columns:4.8rem minmax(0,1fr); }
}

@media (max-width:640px){
  .hdr__cta{ display:none; }
  .hero__figcap{ flex-direction:column; gap:.35rem; }
  .trace__bar{ align-items:flex-start; }
  .plate__spec div{ grid-template-columns:3.7rem minmax(0,1fr); }
  .cap__row{ grid-template-columns:2.6rem minmax(0,1fr); gap:.7rem; padding-inline:.75rem; }
  .cap__head{ padding-inline:.75rem; }
  .cap__foot{ padding-inline:.75rem; }
  .foot__nav{ grid-template-columns:1fr 1fr; }
  .foot__contact{ grid-column:1 / -1; }
}

@media (max-width:480px){
  .hero__eyebrow{ display:block; }
  .hero__dot{ display:inline-block; vertical-align:middle; margin:0 .55rem .2rem 0; }
  .hero__place{ display:block; margin-top:.25rem; }
  .fig__labels,.fig__ann{ display:none; }
}

@media (prefers-reduced-motion: reduce){
  .fig__beat{ animation:none; opacity:1; transform:none; }
  .trace__path{ stroke-dashoffset:0 !important; animation:none !important; }
  .trace__pulse{ display:none; }
  .plate:hover{ transform:none; }
}