/* ==========================================================================
   CENTRALUX — "THE SCHEMATIC"
   Shared stylesheet. Drawing-document design system.
   DWG-SET CX-000 · REV 2.0 · ISSUED 2026-08-27
   ========================================================================== */

/* --- 1. TOKENS ----------------------------------------------------------- */
:root{
  /* ink family */
  --ink:#0b0d0f;
  --ink-2:#0e1114;
  --panel:#111519;
  --panel-2:#151a1f;
  --line:#20262d;
  --line-2:#2b333c;
  --line-3:#39424d;

  /* type colours */
  --text:#eef1f4;
  --body:#aab3bd;
  --dim:#8b949e;
  --faint:#737c86;

  /* accent */
  --gold:#E3B23E;
  --gold-2:#c8992c;
  --gold-soft:rgba(227,178,62,.16);
  --gold-line:rgba(227,178,62,.34);

  /* families */
  --mono:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --sans:'Archivo','Helvetica Neue',system-ui,-apple-system,sans-serif;

  /* metrics */
  --max:1180px;
  --pad:clamp(18px,4.6vw,52px);
  --sec:clamp(60px,8vw,108px);
  --r:2px;
  --ease:cubic-bezier(.2,.7,.3,1);
}

/* --- 2. RESET ------------------------------------------------------------ */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;
  font-family:var(--sans);
  font-size:16.5px;
  line-height:1.72;
  color:var(--body);
  background-color:var(--ink);
  background-image:
    linear-gradient(rgba(227,178,62,.028) 1px,transparent 1px),
    linear-gradient(90deg,rgba(227,178,62,.028) 1px,transparent 1px),
    linear-gradient(rgba(255,255,255,.014) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.014) 1px,transparent 1px);
  background-size:160px 160px,160px 160px,32px 32px,32px 32px;
  background-position:0 0,0 0,0 0,0 0;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img,svg{max-width:100%}
h1,h2,h3,h4{margin:0;color:var(--text);font-weight:600;letter-spacing:-.02em;line-height:1.14}
p{margin:0 0 1.05em}
p:last-child{margin-bottom:0}
a{color:var(--gold);text-decoration:none}
a:hover{color:#f0c661}
ul,ol{margin:0 0 1.05em;padding-left:1.15em}
li{margin-bottom:.4em}
hr{border:0;border-top:1px solid var(--line);margin:0}
::selection{background:var(--gold);color:#0b0d0f}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}

h1{font-size:clamp(31px,5.6vw,62px);letter-spacing:-.028em;line-height:1.05}
h2{font-size:clamp(24px,3.5vw,40px);line-height:1.13}
h3{font-size:clamp(17px,1.6vw,21px);letter-spacing:-.012em;line-height:1.3}
h4{font-size:15px;letter-spacing:-.005em}

/* --- 3. PRIMITIVES ------------------------------------------------------- */
.wrap{max-width:var(--max);margin:0 auto;padding-left:var(--pad);padding-right:var(--pad)}
.mono{font-family:var(--mono)}
.gold{color:var(--gold)}
.lead{font-size:clamp(16.5px,1.55vw,19.5px);line-height:1.68;color:var(--body)}
.dim{color:var(--dim)}
.tick{font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--faint)}

/* buttons */
.btn{
  display:inline-flex;align-items:center;gap:9px;
  font-family:var(--mono);font-size:11px;font-weight:500;
  letter-spacing:.15em;text-transform:uppercase;
  padding:13px 20px;border-radius:var(--r);
  background:var(--gold);color:#0b0d0f;border:1px solid var(--gold);
  transition:background .18s var(--ease),transform .18s var(--ease);
  white-space:nowrap;
}
.btn:hover{background:#f0c661;border-color:#f0c661;color:#0b0d0f;transform:translateY(-1px)}
.btn-ghost{background:transparent;color:var(--gold);border:1px solid rgba(227,178,62,.58)}
.btn-ghost:hover{background:var(--gold-soft);color:var(--gold);border-color:var(--gold)}
.btn-sm{padding:10px 15px;font-size:10px;letter-spacing:.14em}
.btn-row{display:flex;flex-wrap:wrap;gap:12px;align-items:center}

/* --- 4. HEADER ----------------------------------------------------------- */
.revstrip{
  border-bottom:1px solid var(--line);
  background:var(--ink-2);
  font-family:var(--mono);font-size:10px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--faint);
}
.revstrip .wrap{display:flex;flex-wrap:wrap;gap:6px 22px;padding-top:8px;padding-bottom:8px}
.revstrip b{color:var(--dim);font-weight:500}

.hdr{
  position:sticky;top:0;z-index:60;
  border-bottom:1px solid var(--line);
  background:rgba(11,13,15,.9);
  -webkit-backdrop-filter:saturate(150%) blur(12px);
  backdrop-filter:saturate(150%) blur(12px);
}
.hdr .wrap{display:flex;align-items:center;gap:20px;min-height:62px;padding-top:10px;padding-bottom:10px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:11px;color:var(--gold);flex:0 0 auto}
.brand svg{width:23px;height:23px;display:block}
.brand .wm{
  font-family:var(--sans);font-weight:600;font-size:14.5px;
  letter-spacing:.2em;color:var(--text);text-transform:uppercase;
}
.nav{display:flex;align-items:center;gap:clamp(14px,2.2vw,26px);margin-left:auto}
.nav a{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.15em;text-transform:uppercase;
  color:var(--dim);padding:4px 0;border-top:1px solid transparent;
}
.nav a:hover{color:var(--text)}
.nav a[aria-current="page"]{color:var(--gold);border-top-color:var(--gold)}
.hdr .btn{margin-left:4px}

/* --- 5. TITLE BLOCK ------------------------------------------------------ */
.tb{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(128px,1fr));
  border:1px solid var(--line);border-radius:var(--r);
  background:linear-gradient(180deg,rgba(255,255,255,.018),transparent);
  margin-top:26px;
}
.tb-cell{padding:11px 14px;border-right:1px solid var(--line);min-width:0}
.tb-cell:last-child{border-right:0}
.tb-cell .k{
  display:block;font-family:var(--mono);font-size:9px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--faint);margin-bottom:5px;
}
.tb-cell .v{
  display:block;font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;
  color:var(--text);text-transform:uppercase;overflow-wrap:anywhere;
}
.tb-cell .v.g{color:var(--gold)}

/* --- 6. SECTION HEADS ---------------------------------------------------- */
section,article[id]{scroll-margin-top:84px}
.sec{padding-top:var(--sec);padding-bottom:var(--sec)}
.sec-tight{padding-top:calc(var(--sec)*.6);padding-bottom:calc(var(--sec)*.6)}
.sec-line{border-top:1px solid var(--line)}

.shead{margin-bottom:clamp(28px,3.6vw,44px)}
.shead-top{
  display:flex;align-items:baseline;gap:16px;
  padding-bottom:10px;margin-bottom:22px;border-bottom:1px solid var(--line-2);
}
.shead-num{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--gold);white-space:nowrap;
}
.shead-ref{
  font-family:var(--mono);font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--faint);margin-left:auto;text-align:right;
}
.shead h2{max-width:22ch}
.shead h2.wide{max-width:30ch}
.shead p{margin-top:16px;max-width:62ch}

/* --- 7. FIGURE ----------------------------------------------------------- */
.fig{
  border:1px solid var(--line);border-radius:var(--r);
  background:
    linear-gradient(rgba(255,255,255,.012) 1px,transparent 1px) 0 0/22px 22px,
    linear-gradient(90deg,rgba(255,255,255,.012) 1px,transparent 1px) 0 0/22px 22px,
    var(--ink-2);
  padding:clamp(14px,2.4vw,26px);
  position:relative;
}
.fig-head{
  display:flex;flex-wrap:wrap;gap:6px 18px;align-items:baseline;
  border-bottom:1px solid var(--line);padding-bottom:11px;margin-bottom:clamp(14px,2vw,22px);
}
.fig-head .id{font-family:var(--mono);font-size:10.5px;letter-spacing:.2em;color:var(--gold);text-transform:uppercase}
.fig-head .nm{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;color:var(--dim);text-transform:uppercase}
.fig-head .sc{font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;color:var(--faint);text-transform:uppercase}
@media (min-width:620px){.fig-head .sc{margin-left:auto}}
.fig svg{display:block;width:100%;height:auto}

.legend{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:0;margin-top:clamp(16px,2.4vw,26px);border-top:1px solid var(--line);
}
.legend div{
  display:flex;gap:12px;padding:12px 14px 12px 0;border-bottom:1px solid var(--line);
  font-size:13.5px;line-height:1.5;color:var(--dim);
}
.legend div b{
  font-family:var(--mono);font-size:11px;letter-spacing:.08em;color:var(--gold);
  font-weight:500;flex:0 0 auto;padding-top:1px;
}
.legend div span i{font-style:normal;color:var(--text);display:block;font-size:12.5px;
  font-family:var(--mono);letter-spacing:.07em;text-transform:uppercase;margin-bottom:2px}

/* --- 8. CARDS ------------------------------------------------------------ */
.cards{display:grid;gap:clamp(14px,1.8vw,20px);grid-template-columns:1fr}
@media (min-width:620px){.cards{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1000px){.cards{grid-template-columns:repeat(4,1fr)}}
.cards-2{grid-template-columns:1fr}
@media (min-width:760px){.cards-2{grid-template-columns:repeat(2,1fr)}}
.cards-3{grid-template-columns:1fr}
@media (min-width:620px){.cards-3{grid-template-columns:repeat(2,1fr)}}
@media (min-width:900px){.cards-3{grid-template-columns:repeat(3,1fr)}}
.card{
  position:relative;border:1px solid var(--line);border-radius:var(--r);
  background:var(--panel);padding:clamp(18px,2.2vw,26px);
  transition:border-color .2s var(--ease),background .2s var(--ease);
  display:flex;flex-direction:column;
}
.card::before,.card::after{
  content:"";position:absolute;width:9px;height:9px;pointer-events:none;
  border-color:var(--gold-line);opacity:.75;
}
.card::before{top:-1px;left:-1px;border-top:1px solid;border-left:1px solid}
.card::after{bottom:-1px;right:-1px;border-bottom:1px solid;border-right:1px solid}
.card:hover{border-color:var(--line-3);background:var(--panel-2)}
.card .no{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.18em;color:var(--gold);
  text-transform:uppercase;display:block;margin-bottom:12px;
}
.card h3{margin-bottom:10px}
.card p{font-size:14.6px;line-height:1.66}
.card .more{
  align-self:flex-start;margin-top:auto;padding-top:18px;
  font-family:var(--mono);font-size:10px;
  letter-spacing:.16em;text-transform:uppercase;color:var(--dim);
  border-bottom:1px solid var(--line-2);padding-bottom:2px;
}
.card .more:hover{color:var(--gold);border-bottom-color:var(--gold-line)}

/* --- 9. SPEC STRIP / REGISTER ------------------------------------------- */
.spec{border:1px solid var(--line);border-radius:var(--r);background:var(--panel)}
.spec-row{display:flex;gap:14px;padding:12px 16px;border-bottom:1px solid var(--line)}
.spec-row:last-child{border-bottom:0}
.spec-row .k{
  font-family:var(--mono);font-size:9.5px;letter-spacing:.17em;text-transform:uppercase;
  color:var(--faint);flex:0 0 92px;padding-top:3px;
}
.spec-row .v{font-size:14px;line-height:1.5;color:var(--text)}

.sheetidx{
  margin-top:16px;border:1px solid var(--line);border-radius:var(--r);
  background:linear-gradient(180deg,rgba(255,255,255,.015),transparent);
  padding:16px 16px 8px;
}
.sheetidx .k{
  display:block;font-family:var(--mono);font-size:9px;letter-spacing:.22em;
  text-transform:uppercase;color:var(--faint);margin-bottom:12px;
}
.sheetidx a{
  display:flex;gap:14px;align-items:baseline;padding:6px 0;
  border-bottom:1px solid var(--line);color:var(--dim);
}
.sheetidx a:last-child{border-bottom:0}
.sheetidx a b{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;color:var(--gold);
  font-weight:500;flex:0 0 auto;
}
.sheetidx a span{font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase}
.sheetidx a:hover span{color:var(--text)}

.register{border-top:1px solid var(--line-2)}
.reg-row{
  display:grid;grid-template-columns:96px minmax(0,1fr);gap:0 24px;
  padding:clamp(20px,2.4vw,26px) 0;border-bottom:1px solid var(--line);
}
.reg-row .code{
  font-family:var(--mono);font-size:11px;letter-spacing:.16em;color:var(--gold);
  text-transform:uppercase;padding-top:4px;
}
.reg-row h3{margin-bottom:9px}
.reg-row p{font-size:14.8px;line-height:1.68;max-width:62ch}
.reg-note{
  display:none;font-family:var(--mono);font-size:9.5px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--faint);line-height:1.9;
  padding:5px 0 0 20px;border-left:1px solid var(--line);
}
.reg-note b{display:block;color:var(--gold);font-weight:500;margin-bottom:4px}
@media (min-width:1000px){
  .reg-row{grid-template-columns:96px minmax(0,1fr) 216px}
  .reg-note{display:block}
}

/* --- 10. PIPELINE (mobile stack) ---------------------------------------- */
.pipe-wide{display:block}
.pipe-tall{display:none}
.stage{
  position:relative;padding:0 0 26px 42px;
}
.stage:last-child{padding-bottom:0}
.stage::before{
  content:"";position:absolute;left:12px;top:26px;bottom:-4px;width:1px;background:var(--line-2);
}
.stage:last-child::before{display:none}
.stage .dot{
  position:absolute;left:0;top:2px;width:25px;height:25px;border-radius:50%;
  border:1px solid var(--gold-line);background:var(--ink-2);color:var(--gold);
  font-family:var(--mono);font-size:10px;display:flex;align-items:center;justify-content:center;
}
.stage h4{font-family:var(--mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--text);margin-bottom:7px}
.stage p{font-size:13.8px;line-height:1.6;color:var(--dim);margin-bottom:7px}
.stage .rec{font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;color:var(--dim);line-height:1.65}
.stage .rec b{color:var(--gold);font-weight:500}

.steps{max-width:56ch}

/* --- 11. PHASES ---------------------------------------------------------- */
.phases{display:grid;gap:clamp(14px,1.8vw,20px);grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
.phase{border:1px solid var(--line);border-top:2px solid var(--gold);border-radius:var(--r);background:var(--panel);padding:clamp(18px,2.2vw,26px)}
.phase .ph{font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);display:block;margin-bottom:11px}
.phase h3{margin-bottom:9px}
.phase p{font-size:14.4px;line-height:1.64}
.phase ul{margin-top:12px;padding-left:0;list-style:none}
.phase li{
  font-family:var(--mono);font-size:11px;letter-spacing:.05em;color:var(--dim);
  line-height:1.55;padding-left:15px;position:relative;margin-bottom:7px;
}
.phase li::before{content:"—";position:absolute;left:0;color:var(--faint)}

/* --- 12. CALLOUT / NOTE -------------------------------------------------- */
.note{
  border-left:2px solid var(--gold);background:rgba(227,178,62,.045);
  padding:16px 20px;border-radius:0 var(--r) var(--r) 0;
}
.note .k{
  display:block;font-family:var(--mono);font-size:9.5px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--gold);margin-bottom:7px;
}
.note p{font-size:14.4px;line-height:1.65;color:var(--body)}

/* --- 13. CTA BLOCK ------------------------------------------------------- */
.cta{
  border:1px solid var(--line-2);border-radius:var(--r);
  background:
    radial-gradient(120% 140% at 12% 0%,rgba(227,178,62,.10),transparent 62%),
    var(--panel);
  padding:clamp(28px,4.4vw,54px);
  position:relative;overflow:hidden;
}
.cta h2{max-width:18ch;margin-bottom:16px}
.cta p{max-width:58ch;font-size:15.5px}
.cta .btn-row{margin-top:26px}
.cta-mark{
  position:absolute;right:-40px;bottom:-56px;width:250px;height:250px;
  color:var(--gold);opacity:.05;pointer-events:none;
}

/* --- 14. PROSE (legal pages) -------------------------------------------- */
.prose{max-width:74ch}
.prose h2{font-size:clamp(19px,2.2vw,25px);margin:46px 0 14px;letter-spacing:-.015em}
.prose h2:first-child{margin-top:0}
.prose h3{margin:26px 0 9px;font-size:16px}
.prose p,.prose li{font-size:15.4px;line-height:1.75}
.prose ul{padding-left:1.1em}
.prose .anum{
  font-family:var(--mono);font-size:11px;letter-spacing:.16em;color:var(--gold);
  display:block;margin-bottom:6px;text-transform:uppercase;
}
.prose .stamp{
  border:1px solid var(--line);border-radius:var(--r);background:var(--panel);
  padding:16px 20px;margin-bottom:40px;
}
.prose .stamp p{font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;color:var(--dim);line-height:1.9;margin:0}
.prose .stamp p b{color:var(--text);font-weight:500}

.legal-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:0}
.legal-nav{display:none}
@media (min-width:1000px){
  .legal-grid{grid-template-columns:minmax(0,1fr) 236px;gap:60px;align-items:start}
  .legal-nav{display:block;position:sticky;top:90px;border-left:1px solid var(--line);padding-left:22px}
}
.legal-nav .k{
  display:block;font-family:var(--mono);font-size:9px;letter-spacing:.22em;
  text-transform:uppercase;color:var(--faint);margin-bottom:12px;
}
.legal-nav ol{list-style:none;padding:0;margin:0}
.legal-nav li{margin:0}
.legal-nav a{
  display:flex;gap:10px;padding:6px 0;border-bottom:1px solid var(--line);
  font-family:var(--mono);font-size:9.5px;letter-spacing:.09em;text-transform:uppercase;
  color:var(--dim);line-height:1.5;
}
.legal-nav a b{color:var(--gold);font-weight:500;flex:0 0 auto}
.legal-nav a:hover{color:var(--text)}
.legal-nav li:last-child a{border-bottom:0}

/* --- 15. FOOTER ---------------------------------------------------------- */
.ftr{border-top:1px solid var(--line-2);background:var(--ink-2);margin-top:clamp(34px,4.5vw,64px)}
.ftr-grid{
  display:grid;gap:0;grid-template-columns:1.4fr 1fr 1fr 1fr;
  border-bottom:1px solid var(--line);
}
.ftr-cell{padding:26px 22px 26px 0;border-right:1px solid var(--line)}
.ftr-cell:first-child{padding-right:26px}
.ftr-cell:last-child{border-right:0;padding-right:0}
.ftr-cell .k{
  display:block;font-family:var(--mono);font-size:9px;letter-spacing:.22em;
  text-transform:uppercase;color:var(--faint);margin-bottom:12px;
}
.ftr-cell address{
  font-style:normal;font-family:var(--mono);font-size:11.5px;letter-spacing:.03em;
  line-height:1.85;color:var(--body);
}
.ftr-cell .ln{display:block;font-family:var(--mono);font-size:11.5px;line-height:1.85;color:var(--body)}
.ftr-cell a.ln:hover{color:var(--gold)}
.ftr-brand{display:flex;align-items:center;gap:11px;color:var(--gold);margin-bottom:14px}
.ftr-brand svg{width:22px;height:22px;display:block}
.ftr-brand .wm{font-weight:600;font-size:13.5px;letter-spacing:.2em;color:var(--text);text-transform:uppercase}
.ftr-cell .blurb{font-size:13px;line-height:1.6;color:var(--dim);max-width:34ch}
.ftr-bot{
  display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center;
  padding:18px 0 30px;
}
.ftr-nav{display:flex;flex-wrap:wrap;gap:10px 20px}
.ftr-nav a{
  font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--dim);
}
.ftr-nav a:hover{color:var(--gold)}
.ftr-dwg{
  font-family:var(--mono);font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--faint);margin-left:auto;
}

/* --- 16. SCHEMATIC ANIMATION -------------------------------------------- */
.sch .wire{fill:none;stroke:var(--line-3);stroke-width:1.2}
.sch .wire-hot{fill:none;stroke:var(--gold);stroke-width:1.2;opacity:.55;
  stroke-dasharray:5 11;animation:dashflow 2.6s linear infinite}
.sch .wire-out{fill:none;stroke:var(--gold);stroke-width:1.3;opacity:.62;
  stroke-dasharray:5 11;animation:dashflow 2.6s linear infinite reverse}
.sch .nodebox{fill:#111519;stroke:var(--line-2);stroke-width:1}
.sch .nodebox-out{fill:#111519;stroke:rgba(227,178,62,.34);stroke-width:1}
.sch .glyph{fill:none;stroke:var(--dim);stroke-width:1.2;stroke-linecap:square}
.sch .glyph-g{fill:none;stroke:var(--gold);stroke-width:1.2;stroke-linecap:square}
.sch .lbl{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;fill:#dfe4e9}
.sch .lbl-s{font-family:var(--mono);font-size:9px;letter-spacing:.08em;fill:#98a1ab}
.sch .lbl-n{font-family:var(--mono);font-size:9px;letter-spacing:.12em;fill:#E3B23E}
.sch .core-ring{fill:none;stroke:rgba(227,178,62,.3);stroke-width:1}
.sch .core-pulse{fill:none;stroke:var(--gold);stroke-width:1;opacity:0;
  animation:pulsering 3.6s var(--ease) infinite}
.sch .core-pulse-sm{animation:pulsering-sm 3.6s var(--ease) infinite}
.sch .core-plate{fill:#0e1114;stroke:rgba(227,178,62,.5);stroke-width:1.2}
.sch .markgold{color:var(--gold)}
.sch .pkt{fill:var(--gold);opacity:0}
.sch .tickmark{stroke:var(--line-2);stroke-width:1;fill:none}

@keyframes dashflow{to{stroke-dashoffset:-160}}
@keyframes pulsering{
  0%{r:78px;opacity:0}
  20%{opacity:.42}
  100%{r:106px;opacity:0}
}
@keyframes pulsering-sm{
  0%{r:64px;opacity:0}
  20%{opacity:.42}
  100%{r:88px;opacity:0}
}

/* --- 17. PIPELINE SVG STYLES -------------------------------------------- */
.pp .rail{fill:none;stroke:var(--line-3);stroke-width:1.2}
.pp .railflow{fill:none;stroke:var(--gold);stroke-width:1.4;opacity:.6;
  stroke-dasharray:6 12;animation:dashflow 3s linear infinite}
.pp .box{fill:#111519;stroke:var(--line-2);stroke-width:1}
.pp .boxtop{fill:none;stroke:var(--gold);stroke-width:1.6;opacity:.8}
.pp .num{font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;fill:#E3B23E}
.pp .nm{font-family:var(--mono);font-size:11px;letter-spacing:.11em;fill:#eef1f4}
.pp .sub{font-family:var(--mono);font-size:9px;letter-spacing:.05em;fill:#98a1ab}
.pp .gate{fill:none;stroke:rgba(227,178,62,.5);stroke-width:1}
.pp .tap{fill:none;stroke:var(--line-2);stroke-width:1;stroke-dasharray:2 4}
.pp .ledger{fill:#0e1114;stroke:rgba(227,178,62,.3);stroke-width:1}

/* --- 18. RESPONSIVE ------------------------------------------------------ */
.hero{padding-top:clamp(42px,5.5vw,68px);padding-bottom:clamp(46px,6vw,80px)}
.hero-grid{display:grid;grid-template-columns:1.4fr .85fr;gap:clamp(28px,4vw,60px);align-items:start}
.hero h1{margin-bottom:22px;max-width:16ch}
.hero .lead{max-width:56ch;margin-bottom:30px}
.hero .eyebrow{
  display:inline-flex;align-items:center;gap:10px;margin-bottom:20px;
  font-family:var(--mono);font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);
}
.hero .eyebrow::before{content:"";width:26px;height:1px;background:var(--gold);opacity:.6}

.two{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3vw,44px);align-items:start}
.two-a{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(20px,3vw,44px);align-items:start}

.svc{border-top:1px solid var(--line-2);padding-top:clamp(26px,3vw,38px);margin-top:clamp(38px,5vw,62px)}
.svc:first-of-type{margin-top:0}
.svc-head{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:baseline;margin-bottom:20px}
.svc-head .no{font-family:var(--mono);font-size:11px;letter-spacing:.18em;color:var(--gold);text-transform:uppercase}
.svc-head h2{font-size:clamp(22px,3vw,33px);flex:1 1 320px}
.svc-body{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(22px,3vw,46px);align-items:start}
.svc-block{margin-bottom:26px}
.svc-block:last-child{margin-bottom:0}
.svc-block .k{
  display:block;font-family:var(--mono);font-size:9.5px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--faint);margin-bottom:9px;
  padding-bottom:7px;border-bottom:1px solid var(--line);
}
.svc-block p{font-size:14.8px;line-height:1.7}
.svc-list{list-style:none;padding:0;margin:0}
.svc-list li{
  position:relative;padding-left:20px;font-size:14.2px;line-height:1.6;
  color:var(--body);margin-bottom:9px;
}
.svc-list li::before{
  content:"";position:absolute;left:0;top:9px;width:7px;height:7px;
  border:1px solid var(--gold-line);transform:rotate(45deg);
}
.svc-not{
  margin-top:20px;border:1px dashed var(--line-2);border-radius:var(--r);
  padding:14px 17px;
}
.svc-not .k{
  display:block;font-family:var(--mono);font-size:9.5px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--dim);margin-bottom:6px;
}
.svc-not p{font-size:13.8px;line-height:1.6;color:var(--dim)}

@media (max-width:900px){
  .hero-grid{grid-template-columns:1fr;gap:34px}
  .hero h1{max-width:18ch}
  .two,.two-a{grid-template-columns:1fr;gap:26px}
  .svc-body{grid-template-columns:1fr;gap:24px}
  .ftr-grid{grid-template-columns:1fr 1fr}
  .ftr-cell{border-bottom:1px solid var(--line);padding-right:22px}
  .ftr-cell:nth-child(2){border-right:0}
  .ftr-cell:nth-child(3),.ftr-cell:nth-child(4){padding-bottom:26px}
  .ftr-cell:nth-child(4){border-right:0}
  .ftr-cell:first-child{grid-column:1 / -1;border-right:0}
}
@media (max-width:760px){
  .fig svg.pipe-wide,.pipe-wide{display:none}
  .pipe-tall{display:block}
  .fig svg.sch-wide{display:none}
  .fig svg.sch-tall{display:block}
  .reg-row{grid-template-columns:1fr;gap:10px}
  .reg-row .code{padding-top:0}
  .shead-ref{margin-left:0;width:100%;text-align:left;order:3}
  .shead-top{flex-wrap:wrap;gap:6px 14px}
}
@media (min-width:761px){
  .fig svg.sch-tall{display:none}
  .fig svg.sch-wide{display:block}
  .fig svg.pipe-wide{display:block}
  .pipe-tall{display:none}
}
@media (max-width:620px){
  .hdr .wrap{min-height:0;gap:12px 16px;padding-top:12px;padding-bottom:12px}
  .nav{margin-left:0;order:3;width:100%;gap:0;justify-content:space-between;
    border-top:1px solid var(--line);padding-top:10px}
  .hdr .btn{margin-left:auto;order:2}
  .nav a{font-size:9.5px;letter-spacing:.1em}
  .ftr-grid{grid-template-columns:1fr}
  .ftr-cell{border-right:0;padding-right:0}
  .ftr-dwg{margin-left:0;width:100%}
  .tb{grid-template-columns:1fr 1fr}
  .tb-cell{border-bottom:1px solid var(--line)}
  .tb-cell:nth-child(2n){border-right:0}
  .tb-cell:nth-last-child(-n+2){border-bottom:0}
  .legend{grid-template-columns:1fr}
  .cta-mark{width:170px;right:-30px;bottom:-40px}
}
@media (max-width:400px){
  .nav a{font-size:9px;letter-spacing:.06em}
  .brand .wm{font-size:13px;letter-spacing:.16em}
  .tb-cell{padding:10px 11px}
}

/* --- 19. MOTION SAFETY --------------------------------------------------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.001ms !important;animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
  .sch .pkt{display:none}
  .sch .core-pulse{display:none}
  .sch .wire-hot,.sch .wire-out,.pp .railflow{animation:none;opacity:.5}
}

/* --- 20. PRINT ----------------------------------------------------------- */
@media print{
  body{background:#fff;color:#111}
  .hdr,.cta,.btn{display:none}
  a{color:#111}
}
