/* ==========================================================================
   Kennedy Pat Testing — "The Plug"
   --------------------------------------------------------------------------
   base.css owns the reset, wrap, header/nav mechanics, buttons, forms,
   footer skeleton, reveals, preloader shell and the hero headline contract.
   This file supplies the tokens, the exploded plug, the sticky test figure,
   the failure plate, the area index and the contact band.
   No @import. Every colour, font and radius comes from :root.
   ========================================================================== */

:root{
  /* ---------- the object ---------- */
  --forest:     #0f2a1f;
  --forest-2:   #14382a;
  --forest-3:   #1a4231;
  --paper:      #f4f3ee;
  --paper-2:    #ecebe4;
  --paper-3:    #e3e1d8;
  --brass:      #b08a3e;
  --brass-lit:  #d8b878;
  --brass-ink:  #7d5f22;
  --red:        #d0342c;
  --grey:       #868d88;

  /* ---------- base.css expects these names ---------- */
  --ink:        var(--forest);
  --ink-2:      #0c231a;
  --ink-3:      var(--forest-2);
  --surface:    var(--paper);
  --surface-2:  var(--paper-2);
  --text:       var(--paper);
  --muted:      #98a099;
  --ink-text:   #122a20;
  --ink-mute:   #52605a;

  --accent:     var(--brass);
  --accent-lit: var(--brass-lit);
  --accent-2:   var(--brass);
  --line:       color-mix(in srgb, var(--paper) 14%, transparent);
  --line-d:     color-mix(in srgb, var(--forest) 18%, transparent);

  /* ---------- type ---------- */
  --font-display: "Unbounded", "Arial Black", sans-serif;
  --font-body:    "PT Sans", "Helvetica Neue", Arial, sans-serif;
  --font-mono:    "Cutive Mono", ui-monospace, "SFMono-Regular", monospace;

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

html{ scroll-padding-top:96px; }
body{
  background:var(--paper);
  color:var(--ink-text);
  font-size:16.5px;
  line-height:1.62;
  font-weight:400;
}
::selection{ background:var(--brass); color:var(--forest); }
:focus-visible{ outline:2px solid var(--brass); outline-offset:3px; }

/* paper grain — 0.028, static, never over the header */
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='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:180px 180px;
}

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

/* ==========================================================================
   TYPE
   ========================================================================== */
.sect__h2{
  font-family:var(--font-display);
  font-size:clamp(1.9rem, 4.9vw, 3.45rem);
  font-weight:500;
  line-height:1.04;
  letter-spacing:-.035em;
  text-wrap:balance;
}
.sect__num{
  display:flex; align-items:center; gap:.65rem;
  font-family:var(--font-mono); font-size:.7rem; font-weight:400;
  letter-spacing:.16em; text-transform:uppercase;
  color:var(--brass-ink);
  margin-bottom:1.35rem;
}
.sect__num::before{
  content:""; width:26px; height:1px; background:currentColor; flex:none;
}
.sect__lead{ font-size:1rem; line-height:1.7; color:#4f5d56; max-width:45ch; }
.sect--dark-2 .sect__lead,.sect__lead--on-dark{ color:color-mix(in srgb, var(--paper) 66%, transparent); }

/* ==========================================================================
   PRELOADER
   ========================================================================== */
.pre{ background:var(--forest); color:var(--paper); }
.pre__mark svg{ width:96px; height:96px; margin-bottom:1.4rem; }
.pre__shell{ stroke:rgba(244,243,238,.7); fill:none; stroke-width:1.4; }
.pre__pin{ stroke:var(--brass); stroke-width:2; }
.pre__wire{ stroke:rgba(244,243,238,.35); stroke-width:1; stroke-dasharray:3 4; }
.pre__tag{ stroke:rgba(244,243,238,.22); stroke-width:1; }
.pre__dot{ fill:var(--red); animation:prepulse 1.2s ease-in-out infinite; transform-origin:60px 94px; }
@keyframes prepulse{ 0%,100%{ opacity:.3; transform:scale(.8);} 50%{ opacity:1; transform:scale(1.35);} }
.pre__pct{ color:var(--brass-lit); }
.pre__bar i{ background:var(--brass); }

/* ==========================================================================
   HEADER
   ========================================================================== */
.hdr{ background:var(--forest); border-bottom:1px solid rgba(244,243,238,.12); }
.hdr__in{ min-height:78px; gap:1.4rem; }
.brand{ display:flex; align-items:center; gap:.6rem; }
.brand__glyph{ display:block; width:27px; color:var(--brass); flex:none; }
.brand__glyph svg{ display:block; width:100%; height:auto; }
.brand__txt{ display:grid; line-height:1; }
.brand__txt b{
  font-family:var(--font-display); font-size:1.02rem; font-weight:600;
  letter-spacing:-.02em; color:var(--paper);
}
.brand__txt i{
  font-family:var(--font-mono); font-style:normal; font-size:.52rem;
  letter-spacing:.26em; text-transform:uppercase; color:var(--brass);
  margin-top:.28rem;
}

.nav__list{ gap:.05rem; }
.nav__link{
  padding:.6rem .58rem;
  font-size:.685rem; font-weight:700; letter-spacing:.07em; text-transform:uppercase;
  color:rgba(244,243,238,.82);
  border-radius:0;
  position:relative;
}
.nav__link::after{
  content:""; position:absolute; left:.58rem; right:.58rem; bottom:.38rem;
  height:1px; background:var(--brass); transform:scaleX(0); transform-origin:left;
  transition:transform .25s var(--ease);
}
.nav__link:hover{ color:var(--paper); background:none; }
.nav__link:hover::after{ transform:scaleX(1); }
.nav__item--legal .nav__link{ font-size:.575rem; color:rgba(244,243,238,.5); padding-inline:.45rem; }
.nav__item--legal .nav__link::after{ left:.45rem; right:.45rem; }

.hdr__cta{
  display:grid; gap:.12rem; flex:none;
  padding:.48rem .8rem;
  border:1px solid rgba(176,138,62,.6);
  color:var(--paper);
  transition:background .22s, border-color .22s, color .22s;
}
.hdr__cta-l{
  font-family:var(--font-mono); font-size:.52rem; letter-spacing:.15em;
  text-transform:uppercase; color:rgba(244,243,238,.55);
}
.hdr__cta-n{ font-family:var(--font-mono); font-size:.72rem; letter-spacing:.03em; color:var(--brass-lit); }
.hdr__cta:hover{ background:var(--brass); border-color:var(--brass); color:var(--forest); }
.hdr__cta:hover .hdr__cta-l,.hdr__cta:hover .hdr__cta-n{ color:var(--forest); }

/* ==========================================================================
   HERO
   ========================================================================== */
.hero{
  position:relative;
  background:var(--forest);
  color:var(--paper);
  min-height:calc(100svh - 78px);
  display:flex; align-items:center;
  padding-block:clamp(2rem,5vh,3.6rem);
  overflow:hidden;
}
.hero::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background-image:radial-gradient(rgba(244,243,238,.1) 1px, transparent 1px);
  background-size:26px 26px;
  -webkit-mask-image:linear-gradient(100deg, rgba(0,0,0,.7), transparent 46%, transparent 60%, rgba(0,0,0,.55));
  mask-image:linear-gradient(100deg, rgba(0,0,0,.7), transparent 46%, transparent 60%, rgba(0,0,0,.55));
  opacity:.55;
}
.hero::after{
  content:""; position:absolute; top:0; bottom:0; left:50%; width:1px;
  background:linear-gradient(180deg, transparent, rgba(176,138,62,.24) 18%, rgba(176,138,62,.24) 82%, transparent);
  pointer-events:none;
}
.hero__grid{
  position:relative; z-index:1;
  display:grid;
  grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);
  gap:clamp(2rem,4.5vw,4rem);
  align-items:center;
}
.hero__copy{ max-width:620px; }
.hero__eyebrow{
  display:flex; flex-wrap:wrap; align-items:center; gap:.55rem .8rem;
  font-family:var(--font-mono); font-size:.63rem; letter-spacing:.16em;
  text-transform:uppercase; color:rgba(244,243,238,.62);
  margin-bottom:clamp(1.2rem,2.6vh,2rem);
}
.hero__eyebrow span + span::before{
  content:"/"; color:rgba(244,243,238,.28); margin-right:.8rem;
}
.hero__eyebrow-dot{ width:5px; height:5px; background:var(--brass); flex:none; }
.hero__h1{
  color:var(--paper);
  font-weight:500;
  letter-spacing:-.045em;
  max-width:15ch;
}
.hero__h1 em{ font-style:normal; color:var(--brass-lit); }
.hero__lead{
  margin-top:clamp(1.2rem,2.4vh,1.8rem);
  max-width:46ch;
  font-size:1.005rem; line-height:1.68;
  color:rgba(244,243,238,.7);
}
.hero__acts{ display:flex; flex-wrap:wrap; gap:.65rem; margin-top:clamp(1.4rem,3vh,2rem); }
.btn{ border-radius:var(--radius); font-family:var(--font-body); letter-spacing:.01em; }
.btn--solid{ background:var(--brass); color:var(--forest); }
.btn--solid:hover{ background:var(--brass-lit); filter:none; }
.btn--ghost{ border-color:rgba(244,243,238,.26); color:var(--paper); }
.btn--ghost:hover{ border-color:var(--brass); color:var(--brass-lit); }

.hero__facts{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  gap:0; margin-top:clamp(1.8rem,4vh,2.6rem);
  border-top:1px solid rgba(244,243,238,.16);
  padding-top:1.3rem;
}
.hero__facts div{ padding-right:1rem; min-width:0; }
.hero__facts div + div{ border-left:1px solid rgba(244,243,238,.13); padding-left:1.1rem; }
.hero__facts dt{
  font-family:var(--font-display); font-size:.98rem; font-weight:500;
  letter-spacing:-.02em; color:var(--brass-lit); line-height:1.2;
}
.hero__facts dd{
  margin-top:.3rem; font-size:.72rem; line-height:1.45;
  color:rgba(244,243,238,.55);
}
.hero__note{
  margin-top:1.35rem;
  font-family:var(--font-mono); font-size:.63rem; letter-spacing:.1em;
  color:rgba(244,243,238,.4);
}

/* ---------- the exploded plug ---------- */
.stage{
  margin:0;
  border:1px solid rgba(244,243,238,.18);
  background:
    linear-gradient(160deg, rgba(26,66,49,.9), rgba(8,26,18,.96));
  position:relative;
}
.stage::before,.stage::after{
  content:""; position:absolute; width:9px; height:9px; border:1px solid var(--brass);
  pointer-events:none; z-index:2;
}
.stage::before{ top:-1px; left:-1px; border-right:0; border-bottom:0; }
.stage::after{ bottom:-1px; right:-1px; border-left:0; border-top:0; }
.stage__bar{
  display:flex; justify-content:space-between; gap:.8rem;
  padding:.6rem .8rem;
  border-bottom:1px solid rgba(244,243,238,.14);
  font-family:var(--font-mono); font-size:.55rem; letter-spacing:.13em;
  text-transform:uppercase; color:rgba(244,243,238,.58);
}
.stage__bar-mid{ color:var(--brass-lit); }
.plug{
  display:block; width:100%; height:auto; max-height:min(72vh, 760px);
  margin-inline:auto;
}
.plug__axis line{ stroke:rgba(176,138,62,.32); stroke-width:1; stroke-dasharray:2 7; }
.plug__axis path{ stroke:rgba(176,138,62,.5); stroke-width:1; }
.plug__cable-out{ stroke:rgba(244,243,238,.22); stroke-width:19; fill:none; }
.plug__cable-in{ stroke:#081d14; stroke-width:15; fill:none; }
.plug__cut{ stroke:rgba(244,243,238,.25); stroke-width:1; }
.plug__live-strand{ stroke:var(--red); stroke-width:2; }
.plug__engrave{
  font-family:var(--font-mono); font-size:10.5px; letter-spacing:.1em;
  fill:rgba(15,42,31,.62);
}
.plug__engrave--dim{ fill:rgba(244,243,238,.34); font-size:9px; }
.plug__letter{
  font-family:var(--font-mono); font-size:12px; fill:rgba(244,243,238,.42);
}
.plug__labels path{ stroke:rgba(176,138,62,.55); stroke-width:1; fill:none; }
.plug__labels circle{ fill:var(--brass); }
.plug__n{
  font-family:var(--font-mono); font-size:10.5px; letter-spacing:.08em;
  fill:var(--brass);
}
.plug__label{
  font-family:var(--font-mono); font-size:11.2px; letter-spacing:.095em;
  fill:rgba(244,243,238,.72);
}
.plug__fig{ font-family:var(--font-mono); font-size:11px; letter-spacing:.16em; fill:var(--brass); }
.plug__cap{ font-family:var(--font-mono); font-size:9.6px; letter-spacing:.1em; fill:rgba(244,243,238,.66); }
.plug__cap--dim{ fill:rgba(244,243,238,.4); }
.plug__key path{ fill:none; }
.stage__foot{
  display:flex; justify-content:space-between; gap:.8rem; flex-wrap:wrap;
  padding:.6rem .8rem;
  border-top:1px solid rgba(244,243,238,.14);
  font-family:var(--font-mono); font-size:.55rem; letter-spacing:.1em;
  color:rgba(244,243,238,.48);
}
.stage__foot span:first-child{ color:rgba(176,138,62,.85); }
.stage__foot-r{ text-align:right; }

/* ==========================================================================
   01 — WHAT WE TEST (sticky object)
   ========================================================================== */
.test{ background:var(--paper); color:var(--ink-text); }
.test .sect__head{ margin-bottom:clamp(2rem,4vw,3.4rem); }
.test__grid{
  display:grid;
  grid-template-columns:minmax(0,1.02fr) minmax(0,.88fr);
  gap:clamp(2.2rem,6vw,5.5rem);
  align-items:start;
}
.test__notes{
  display:grid;
  gap:clamp(2.6rem,9vh,6rem);
  padding-bottom:clamp(2rem,8vh,5rem);
}
.note{
  border-top:1px solid var(--line-d);
  padding-top:1.25rem;
  max-width:48ch;
}
.note__n{
  font-family:var(--font-mono); font-size:.64rem; letter-spacing:.16em;
  text-transform:uppercase; color:var(--brass-ink);
  margin-bottom:.9rem;
}
.note__h{
  font-family:var(--font-display); font-size:clamp(1.25rem,2.2vw,1.6rem);
  font-weight:500; line-height:1.16; letter-spacing:-.025em;
  color:var(--forest);
  margin-bottom:.8rem;
}
.note__p{ font-size:1rem; line-height:1.68; color:#4f5d56; max-width:42ch; }
.note__list{
  margin-top:1.15rem; display:grid; gap:.38rem;
  font-family:var(--font-mono); font-size:.71rem; letter-spacing:.03em;
  color:#3d4b44;
}
.note__list li{ display:flex; gap:.6rem; align-items:baseline; }
.note__list li::before{
  content:""; width:5px; height:1px; background:var(--brass); flex:none;
  transform:translateY(-.28em);
}

.testfig{
  position:sticky; top:104px;
  margin:0;
  background:var(--forest);
  color:var(--paper);
  border:1px solid rgba(15,42,31,.35);
  box-shadow:0 26px 50px -34px rgba(15,42,31,.5);
}
.testfig__bar{
  display:flex; justify-content:space-between; gap:1rem;
  padding:.6rem .8rem;
  border-bottom:1px solid rgba(244,243,238,.14);
  font-family:var(--font-mono); font-size:.55rem; letter-spacing:.13em;
  text-transform:uppercase; color:rgba(244,243,238,.5);
}
.testfig__bar span:last-child{ color:var(--brass-lit); }
.testsvg{ display:block; width:100%; height:auto; }
.testsvg__engrave{ font-family:var(--font-mono); font-size:7.4px; letter-spacing:.1em; fill:rgba(244,243,238,.35); }
.testsvg__letter{ font-family:var(--font-mono); font-size:8px; fill:rgba(244,243,238,.66); }
.testsvg__fuse{ font-family:var(--font-mono); font-size:6.6px; letter-spacing:.12em; fill:rgba(244,243,238,.5); }
.testsvg__fuse-mark{ font-family:var(--font-mono); font-size:7px; letter-spacing:.08em; fill:rgba(15,42,31,.62); }
.testsvg__cable{ stroke:#06180f; stroke-width:23; fill:none; }
.testsvg__live{
  fill:none; stroke:var(--red); stroke-width:2.2; stroke-linecap:round;
  stroke-dasharray:700; stroke-dashoffset:700;
}
.testsvg__row{ font-family:var(--font-mono); font-size:10px; letter-spacing:.12em; fill:rgba(244,243,238,.6); }
.testsvg__tick{ fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; opacity:0; }
.testsvg__tick--1{ stroke:var(--brass-lit); }
.testsvg__tick--2{ stroke:var(--brass-lit); }
.testsvg__tick--3{ stroke:var(--brass-lit); }
.testsvg__pass{
  font-family:var(--font-display); font-size:19px; font-weight:600;
  letter-spacing:-.02em; fill:var(--forest);
}
.testsvg__tagline{ font-family:var(--font-mono); font-size:7.4px; letter-spacing:.11em; fill:rgba(15,42,31,.7); }
.testsvg__stamp{ opacity:0; transform:scale(1.28) rotate(7deg); transform-box:fill-box; transform-origin:center; }

.testfig.is-in .testsvg__live{ animation:liveDraw 1.9s .25s cubic-bezier(.4,0,.2,1) forwards; }
.testfig.is-in .testsvg__tick--1{ animation:tickIn .3s 1.45s forwards; }
.testfig.is-in .testsvg__tick--2{ animation:tickIn .3s 1.7s forwards; }
.testfig.is-in .testsvg__tick--3{ animation:tickIn .3s 1.95s forwards; }
.testfig.is-in .testsvg__stamp{ animation:stampIn .5s 2.35s cubic-bezier(.2,.85,.3,1) forwards; }
@keyframes liveDraw{ to{ stroke-dashoffset:0; } }
@keyframes tickIn{ from{ opacity:0; transform:translateY(2px); } to{ opacity:1; transform:none; } }
@keyframes stampIn{
  0%{ opacity:0; transform:scale(1.28) rotate(7deg); }
  70%{ opacity:1; transform:scale(.97) rotate(-1.5deg); }
  100%{ opacity:1; transform:scale(1) rotate(0deg); }
}
.testfig__foot{
  display:flex; justify-content:space-between; gap:.8rem; flex-wrap:wrap;
  padding:.6rem .8rem;
  border-top:1px solid rgba(244,243,238,.14);
  font-family:var(--font-mono); font-size:.55rem; letter-spacing:.1em;
  color:rgba(244,243,238,.38);
}
.testfig__cap{ color:rgba(176,138,62,.9); }
.testfig__note{ text-align:right; }

/* ==========================================================================
   02 — WHAT FAILS
   ========================================================================== */
.fails{
  background:var(--forest);
  color:var(--paper);
  border-top:1px solid rgba(244,243,238,.12);
  position:relative;
}
.fails .sect__num{ color:var(--brass); }
.fails .sect__h2{ color:var(--paper); }
.fails .sect__head{ margin-bottom:clamp(2rem,4vw,3rem); }
.fails__list{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  border-top:1px solid rgba(244,243,238,.18);
}
.fail{ padding:1.6rem clamp(1rem,2.4vw,2rem) 1rem; border-right:1px solid rgba(244,243,238,.14); min-width:0; }
.fail:first-child{ padding-left:0; }
.fail:last-child{ border-right:0; padding-right:0; }
.fail__top{ display:flex; align-items:center; justify-content:space-between; gap:.6rem; }
.fail__n{
  font-family:var(--font-mono); font-size:.68rem; letter-spacing:.14em; color:var(--brass);
}
.fail__tag{
  font-family:var(--font-mono); font-size:.56rem; letter-spacing:.13em;
  text-transform:uppercase; color:rgba(244,243,238,.6);
  border:1px solid rgba(244,243,238,.28); padding:.2rem .4rem;
}
.fail__fig{ width:100%; max-width:200px; height:auto; margin:1.7rem 0 1.3rem; }
.fail__label{ font-family:var(--font-mono); font-size:8.4px; letter-spacing:.12em; fill:rgba(244,243,238,.5); }
.fail__engrave{ font-family:var(--font-mono); font-size:9px; letter-spacing:.08em; fill:rgba(15,42,31,.65); }
.fail__h{
  font-family:var(--font-display); font-size:clamp(1.1rem,1.8vw,1.32rem);
  font-weight:500; line-height:1.18; letter-spacing:-.02em;
  color:var(--paper); margin-bottom:.65rem;
}
.fail__p{ font-size:.92rem; line-height:1.65; color:rgba(244,243,238,.62); max-width:34ch; }

/* ==========================================================================
   03 — SERVICES & AREAS
   ========================================================================== */
.areas{ background:var(--paper-2); color:var(--ink-text); }
.areas .sect__head{ margin-bottom:clamp(2rem,4vw,3rem); }
.areas__grid{
  display:grid; grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);
  gap:clamp(2rem,5vw,4.5rem); align-items:start;
}
.svc__row{
  display:grid; grid-template-columns:38px minmax(0,1fr); gap:.9rem;
  border-top:1px solid var(--line-d);
  padding:1.35rem 0;
}
.svc__row:first-child{ border-top:0; padding-top:0; }
.svc__n{ font-family:var(--font-mono); font-size:.68rem; color:var(--brass-ink); letter-spacing:.1em; padding-top:.25rem; }
.svc__h{
  font-family:var(--font-display); font-size:clamp(1.1rem,1.8vw,1.28rem);
  font-weight:500; line-height:1.2; letter-spacing:-.02em; color:var(--forest);
  margin-bottom:.5rem;
}
.svc__p{ font-size:.95rem; line-height:1.65; color:#4f5d56; max-width:46ch; }
.svc__note{
  margin-top:1.6rem; padding-top:1rem; border-top:1px solid var(--line-d);
  font-family:var(--font-mono); font-size:.65rem; letter-spacing:.05em; line-height:1.7;
  color:#5a6861;
}

.cover{
  position:relative;
  background:var(--paper);
  border:1px solid rgba(15,42,31,.22);
  padding:clamp(1.25rem,3vw,1.9rem);
}
.cover::before,.cover::after{
  content:""; position:absolute; width:8px; height:8px; background:var(--brass);
  pointer-events:none;
}
.cover::before{ top:-1px; left:-1px; }
.cover::after{ bottom:-1px; right:-1px; }
.cover__head{
  display:flex; align-items:baseline; justify-content:space-between; gap:1rem; flex-wrap:wrap;
  border-bottom:1px solid var(--line-d); padding-bottom:.85rem; margin-bottom:1.15rem;
}
.cover__h{
  font-family:var(--font-display); font-size:1.18rem; font-weight:500;
  letter-spacing:-.02em; color:var(--forest);
}
.cover__link{
  font-family:var(--font-mono); font-size:.61rem; letter-spacing:.07em;
  color:var(--brass-ink); border-bottom:1px solid rgba(125,95,34,.35); padding-bottom:.1rem;
  transition:color .18s, border-color .18s;
}
.cover__link:hover{ color:var(--forest); border-color:var(--forest); }
.cover__list{
  display:grid; grid-template-columns:repeat(auto-fill,minmax(128px,1fr));
  gap:.42rem 1rem;
  font-family:var(--font-mono); font-size:.73rem; line-height:1.45; color:#43514a;
}
.cover__list li{ display:flex; align-items:baseline; gap:.45rem; min-width:0; }
.cover__list li::before{ content:""; width:3px; height:3px; background:var(--brass); flex:none; transform:translateY(-.2em); }
.cover__out{
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);
  border-top:1px solid var(--line-d); margin-top:1.35rem;
}
.cover__place{
  display:grid; grid-template-columns:1fr auto; align-items:start; gap:.15rem .8rem;
  padding:1rem 1rem 1rem 0; border-right:1px solid var(--line-d);
  transition:background .2s, padding .2s;
}
.cover__place:last-child{ border-right:0; padding-left:1rem; padding-right:0; }
.cover__place-name,.cover__place-meta{ grid-column:1; }
.cover__place-name{
  font-family:var(--font-display); font-size:clamp(.92rem,1.1vw,1rem); font-weight:500;
  letter-spacing:-.02em; color:var(--forest); white-space:nowrap;
}
.cover__place-meta{
  grid-column:1; font-family:var(--font-mono); font-size:.58rem;
  letter-spacing:.06em; color:#5d6b64;
}
.cover__place-arrow{ grid-column:2; grid-row:1 / span 2; justify-self:end; color:var(--brass-ink); font-size:1rem; transition:transform .2s var(--ease); }
.cover__place:hover .cover__place-arrow{ transform:translate(2px,-2px); color:var(--forest); }
.cover__place:hover .cover__place-name{ color:var(--brass-ink); }

/* ==========================================================================
   04 — HOW A VISIT WORKS
   ========================================================================== */
.visit{ background:var(--paper); color:var(--ink-text); }
.visit .sect__head{ margin-bottom:clamp(2rem,4vw,3rem); }
.visit__grid{
  display:grid; grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);
  gap:clamp(2rem,5vw,4.5rem); align-items:start;
}
.shot{
  margin:0; padding:10px 10px 0;
  background:#faf9f4;
  border:1px solid var(--line-d);
  position:relative;
}
.shot::before{
  content:"FIG. 02"; position:absolute; top:-1px; right:-1px; z-index:1;
  background:var(--brass); color:var(--forest);
  font-family:var(--font-mono); font-size:.55rem; letter-spacing:.12em;
  padding:.3rem .5rem;
}
.shot img{
  width:100%; aspect-ratio:460 / 374; height:auto; object-fit:cover;
  filter:grayscale(.92) sepia(.12) contrast(1.06) brightness(1.02);
  mix-blend-mode:multiply;
}
.shot__cap{
  display:flex; justify-content:space-between; gap:.8rem; flex-wrap:wrap;
  padding:.65rem .15rem .7rem;
  border-top:1px solid rgba(15,42,31,.14);
  font-family:var(--font-mono); font-size:.57rem; letter-spacing:.06em;
  color:#5d6b64;
}
.shot__cap span:first-child{ color:var(--brass-ink); }
.shot__cap span:last-child{ text-align:right; }

.steps{ display:grid; }
.step{
  display:grid; grid-template-columns:44px minmax(0,1fr); gap:1rem;
  border-top:1px solid var(--line-d); padding:1.2rem 0;
}
.step:first-child{ border-top:0; padding-top:0; }
.step__n{
  font-family:var(--font-mono); font-size:.72rem; letter-spacing:.1em;
  color:var(--brass-ink); padding-top:.3rem;
}
.step__h{
  font-family:var(--font-display); font-size:1.08rem; font-weight:500;
  line-height:1.25; letter-spacing:-.02em; color:var(--forest);
  margin-bottom:.35rem;
}
.step__p{ font-size:.94rem; line-height:1.65; color:#4f5d56; max-width:48ch; }

.quote{
  margin-top:clamp(2.6rem,7vw,5.2rem);
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:clamp(1.6rem,4vw,3.5rem);
  background:var(--forest); color:var(--paper);
  padding:clamp(1.5rem,4vw,2.8rem);
  position:relative;
  overflow:hidden;
}
.quote::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background-image:radial-gradient(rgba(244,243,238,.12) 1px, transparent 1px);
  background-size:20px 20px;
  -webkit-mask-image:linear-gradient(120deg, rgba(0,0,0,.5), transparent 65%);
  mask-image:linear-gradient(120deg, rgba(0,0,0,.5), transparent 65%);
  opacity:.5;
}
.quote > *{ position:relative; }
.quote__num{
  font-family:var(--font-mono); font-size:.63rem; letter-spacing:.16em;
  text-transform:uppercase; color:var(--brass); margin-bottom:1rem;
}
.quote__h{
  font-family:var(--font-display); font-size:clamp(1.45rem,3vw,2.15rem);
  font-weight:500; line-height:1.1; letter-spacing:-.03em; color:var(--paper);
}
.quote__p{ font-size:.95rem; line-height:1.68; color:rgba(244,243,238,.68); max-width:44ch; }
.quote__tel{
  display:inline-flex; align-items:baseline; gap:.5rem; margin-top:1.15rem;
  font-family:var(--font-mono); font-size:1.45rem; letter-spacing:.02em;
  color:var(--brass-lit); border-bottom:1px solid rgba(176,138,62,.4);
  padding-bottom:.2rem; transition:color .2s, border-color .2s;
}
.quote__tel:hover{ color:var(--paper); border-color:var(--paper); }
.quote__hours{
  margin-top:.7rem; font-family:var(--font-mono); font-size:.65rem;
  letter-spacing:.08em; color:rgba(244,243,238,.42);
}

/* ==========================================================================
   05 — CONTACT
   ========================================================================== */
.contact{
  background:var(--forest); color:var(--paper);
  border-top:1px solid rgba(244,243,238,.12);
}
.contact__grid{
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.92fr);
  gap:clamp(2.2rem,5vw,5rem); align-items:start;
}
.contact .sect__num{ color:var(--brass); }
.contact__copy .sect__h2{ color:var(--paper); margin-bottom:1.2rem; }
.contact__lead{ font-size:1rem; line-height:1.68; color:rgba(244,243,238,.66); max-width:40ch; }
.contact__tel{
  display:inline-block; margin-top:1.9rem;
  font-family:var(--font-display); font-size:clamp(1.6rem,3.6vw,2.5rem);
  font-weight:500; letter-spacing:-.03em; color:var(--brass-lit);
  line-height:1.1;
  border-bottom:1px solid rgba(176,138,62,.35); padding-bottom:.25rem;
  transition:color .2s, border-color .2s;
}
.contact__tel:hover{ color:var(--paper); border-color:var(--paper); }
.contact__hours{
  margin-top:.7rem; font-family:var(--font-mono); font-size:.7rem;
  letter-spacing:.08em; color:rgba(244,243,238,.45);
}
.contact__details{
  display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);
  gap:1.4rem; margin-top:2rem; padding-top:1.3rem;
  border-top:1px solid rgba(244,243,238,.16);
}
.contact__k{
  font-family:var(--font-mono); font-size:.55rem; letter-spacing:.16em;
  text-transform:uppercase; color:rgba(244,243,238,.4); margin-bottom:.4rem;
}
.contact__details a,.contact__details address{
  font-size:.88rem; line-height:1.6; color:rgba(244,243,238,.8);
  overflow-wrap:anywhere;
}
.contact__details a:hover{ color:var(--brass-lit); }
.contact__small{
  margin-top:1.6rem; font-family:var(--font-mono); font-size:.63rem;
  letter-spacing:.06em; color:rgba(244,243,238,.36); max-width:38ch;
}

.contact__form{
  background:var(--paper);
  border:1px solid rgba(15,42,31,.3);
  border-top:3px solid var(--brass);
  border-radius:0;
  color:var(--ink-text);
  padding:clamp(1.25rem,3vw,1.9rem);
}
.contact__form-h{
  font-family:var(--font-display); font-size:1.1rem; font-weight:500;
  letter-spacing:-.02em; color:var(--forest); margin-bottom:1.3rem;
}
.contact__form-row{ display:grid; grid-template-columns:1fr 1fr; gap:0 1rem; }
.contact__form .form label{
  font-family:var(--font-mono); font-size:.55rem; letter-spacing:.15em;
  color:#44524b; margin-bottom:1rem;
}
.contact__form input,.contact__form textarea{
  background:transparent; border:0; border-bottom:1px solid rgba(15,42,31,.3);
  border-radius:0; padding:.5rem 0 .45rem;
  font-size:.92rem; color:var(--forest);
  caret-color:var(--brass-ink);
}
.contact__form input:focus,.contact__form textarea:focus{ border-color:var(--brass-ink); outline:none; }
.contact__form input::placeholder,.contact__form textarea::placeholder{ color:rgba(15,42,31,.38); }
.contact__form .btn{ margin-top:.9rem; background:var(--brass); color:var(--forest); }
.contact__form .btn:hover{ background:var(--brass-lit); }
.contact__form-note{
  margin-top:.8rem; font-family:var(--font-mono); font-size:.58rem;
  letter-spacing:.06em; color:#6d7a73; text-align:center;
}

/* ==========================================================================
   FOOTER
   ========================================================================== */
.foot{ background:#0a1f17; border-top:1px solid rgba(244,243,238,.1); }
.foot__brand .brand__glyph{ width:30px; color:var(--brass); }
.foot__brand .brand__txt b{ font-size:1.12rem; }
.foot__blurb{
  margin-top:1rem; font-size:.86rem; line-height:1.65;
  color:rgba(244,243,238,.5); max-width:30ch;
}
.foot__tel{
  display:inline-block; margin-top:1.1rem;
  font-family:var(--font-mono); font-size:.95rem; letter-spacing:.03em;
  color:var(--brass-lit);
}
.foot__h{ color:rgba(244,243,238,.4); }
.foot__nav a,.foot__nav span{ font-size:.82rem; color:rgba(244,243,238,.72); overflow-wrap:anywhere; }
.foot__nav a[href^="mailto:"]{ overflow-wrap:normal; word-break:normal; }
@media (min-width:1024px){
  .foot__nav{ grid-template-columns:1fr .8fr 1.3fr .8fr; }
}
.foot__nav a:hover{ color:var(--brass-lit); }
.foot__bottom{ color:rgba(244,243,238,.34); }
.foot__bottom p:last-child{ color:rgba(244,243,238,.28); }

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width:1199px){
  .nav__link{ font-size:.63rem; padding-inline:.45rem; }
  .nav__item--legal .nav__link{ font-size:.55rem; }
  .hdr__cta-l{ display:none; }
}

@media (max-width:1023px){
  .plug__label{ font-size:13px; }
  .plug__n{ font-size:11.5px; }
  .plug__cap{ font-size:11px; }
  .plug__fig{ font-size:12px; }
  .hero{ min-height:0; padding-block:clamp(2.4rem,7vw,4rem) clamp(2.4rem,7vw,3.6rem); }
  .hero::after{ display:none; }
  .hero__grid{ grid-template-columns:minmax(0,1fr); gap:2.6rem; }
  .hero__copy{ max-width:none; }
  .hero__h1{ max-width:18ch; }
  .stage{ max-width:560px; margin-inline:auto; width:100%; }
  .plug{ max-height:none; }
  .hdr__cta{ display:none; }
  .test__grid{ grid-template-columns:minmax(0,1fr); gap:2.4rem; }
  .testfig{ position:relative; top:auto; order:-1; max-width:560px; margin-inline:auto; width:100%; }
  .test__notes{ gap:2.6rem; padding-bottom:0; }
  .fails__list{ grid-template-columns:minmax(0,1fr); }
  .fail{ border-right:0; border-bottom:1px solid rgba(244,243,238,.14); padding:1.5rem 0 1.8rem; }
  .fail:last-child{ border-bottom:0; }
  .fail__fig{ max-width:180px; margin:1.2rem 0 1rem; }
  .fail__p{ max-width:52ch; }
  .areas__grid{ grid-template-columns:minmax(0,1fr); gap:2.6rem; }
  .visit__grid{ grid-template-columns:minmax(0,1fr); gap:2.4rem; }
  .shot{ max-width:520px; }
  .quote{ grid-template-columns:minmax(0,1fr); }
  .contact__grid{ grid-template-columns:minmax(0,1fr); gap:2.6rem; }
  .contact__form{ max-width:560px; }
}

@media (max-width:760px){
  .hero__facts{ grid-template-columns:minmax(0,1fr); gap:0; }
  .hero__facts div{ padding:.7rem 0; }
  .hero__facts div + div{ border-left:0; border-top:1px solid rgba(244,243,238,.13); padding-left:0; }
  .hero__facts dd{ max-width:34ch; }
  .stage__bar{ font-size:.5rem; }
  .contact__details{ grid-template-columns:minmax(0,1fr); gap:1rem; }
  .foot__nav{ grid-template-columns:1fr 1fr; }
}

@media (max-width:900px){
  .foot__nav > div:nth-child(3),
  .foot__nav > div:nth-child(4){ grid-column:1 / -1; border-top:1px solid var(--line); padding-top:1.15rem; }
  .cover__out{ grid-template-columns:minmax(0,1fr); }
  .cover__place{ border-right:0; border-bottom:1px solid var(--line-d); padding:1rem 0; }
  .cover__place:last-child{ border-bottom:0; padding-left:0; }
}

@media (max-width:520px){
  .sect{ padding-block:3.2rem; }
  .test__notes{ gap:2.2rem; }
  .cover{ padding:1.1rem; }
  .hero__acts .btn{ width:100%; justify-content:center; }
  .stage__foot-r,.testfig__note{ display:none; }
  .cover__list{ grid-template-columns:repeat(2,minmax(0,1fr)); font-size:.68rem; }
  .contact__form-row{ grid-template-columns:minmax(0,1fr); }
  .shot__cap span:last-child{ display:none; }
  .quote{ padding:1.25rem; }
}

@media (max-width:360px){
  .cover__list{ grid-template-columns:minmax(0,1fr); }
  .brand__txt b{ font-size:.92rem; }
}

/* ---------- reduced motion: finish the drawing, no travel ---------- */
@media (prefers-reduced-motion: reduce){
  .testsvg__live{ stroke-dashoffset:0 !important; animation:none !important; }
  .testsvg__tick,.testsvg__stamp{ opacity:1 !important; transform:none !important; animation:none !important; }
  .pre__dot{ animation:none !important; opacity:1; }
  .hero::before{ opacity:.3; }
}

/* ---------- pointer-only lift, never on touch ---------- */
@media (hover:hover) and (pointer:fine){
  .svc__row{ transition:background .2s; }
  .cover__place{ transition:background .2s; }
  .step{ transition:background .2s; }
  .btn--solid:hover{ transform:translateY(-2px); }
}
