/*
Theme Name: TungstenBuyers
Theme URI: https://tungstenbuyers.com
Author: Jeff Brokaw
Author URI: https://JeffBrokaw.com
Description: The Analyzer. A custom WordPress theme for Tungsten Buyers, a Tungsten Parts Wyoming company that buys tungsten, tungsten heavy alloy and tungsten carbide scrap. Built by JeffBrokaw.com.
Version: 2.0.0
Requires at least: 6.4
Tested up to: 7.0
Requires PHP: 8.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: tungstenbuyers
Tags: custom-theme, dark, one-column, custom-colors, custom-menu, accessibility-ready

Design system: The Analyzer.
Authored by JeffBrokaw.com.
*/

/* ============================================================
   TUNGSTENBUYERS  ·  THE ANALYZER
   Design + build: JeffBrokaw.com
   ------------------------------------------------------------
   v2 rebuild. v1 (The Weighbridge, a daylight scale-house world)
   read as a hardware-store catalog rather than the cutting-edge
   materials operation this brand needed to project, and its
   drawn tool icons carried no information a visitor could parse
   at a glance. Same product, same copy, same facts. New world.

   The page is now an assay instrument reading tungsten itself:
   near-black ground, glass HUD panels with corner brackets,
   live scan sweeps, a molten heat field at the melting point in
   the hero. Every material is identified the way an analyzer
   actually identifies it, by atomic signature, not by a drawing
   of a tool. W, Z 74. Orange is the lit reading and the primary
   action. Cyan is the live/verified signal and now runs through
   the whole instrument, not one boxed-in window.
   ============================================================ */

/* ---------- 1. FACES ---------------------------------------- */

@font-face{font-family:'Big Shoulders';src:url('assets/fonts/BigShoulders-Bold.woff2') format('woff2');
  font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Big Shoulders';src:url('assets/fonts/BigShoulders-XBold.woff2') format('woff2');
  font-weight:800;font-style:normal;font-display:swap}
@font-face{font-family:'Archivo';src:url('assets/fonts/Archivo-Regular.woff2') format('woff2');
  font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Archivo';src:url('assets/fonts/Archivo-Medium.woff2') format('woff2');
  font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Archivo';src:url('assets/fonts/Archivo-SemiBold.woff2') format('woff2');
  font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Archivo';src:url('assets/fonts/Archivo-Bold.woff2') format('woff2');
  font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'B612 Mono';src:url('assets/fonts/B612Mono-Regular.woff2') format('woff2');
  font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'B612 Mono';src:url('assets/fonts/B612Mono-Bold.woff2') format('woff2');
  font-weight:700;font-style:normal;font-display:swap}

/* ---------- 2. TOKENS --------------------------------------- */

:root{
  /* ground: near-black, cool, an instrument bay not a warehouse */
  --ground:    #06080B;
  --panel:     #0B0F14;
  --panel-2:   #10151C;
  --panel-hi:  #161D26;
  --line:      rgba(255,255,255,.10);
  --line-hot:  rgba(0,255,255,.32);

  /* text: light on dark */
  --ink:       #EDF1F4;
  --ink-2:     #A7B2BB;
  --ink-3:     #6E7981;

  /* the lit reading + primary action */
  --lit:       #FF4500;
  --lit-hi:    #FF6A33;
  --lit-dim:   rgba(255,69,0,.14);

  /* live / verified signal, now the instrument's whole language */
  --verified:  #00FFFF;
  --verified-dim: rgba(0,255,255,.12);

  /* alert, used sparingly for constraint/compliance content */
  --amber:     #F5C400;

  --disp: 'Big Shoulders', 'Arial Narrow', sans-serif;
  --body: 'Archivo', system-ui, sans-serif;
  --data: 'B612 Mono', ui-monospace, monospace;

  /* one cut chamfer, used consistently as the instrument's corner */
  --cut:    polygon(14px 0, 100% 0, 100% calc(100% - 14px), calc(100% - 14px) 100%, 0 100%, 0 14px);
  --cut-btn:polygon(9px 0, 100% 0, 100% calc(100% - 9px), calc(100% - 9px) 100%, 0 100%, 0 9px);

  --s1:8px; --s2:16px; --s3:24px; --s4:40px; --s5:64px; --s6:96px; --s7:144px;
  --wrap:1220px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}

body{
  margin:0;background:var(--ground);color:var(--ink);
  font:400 17px/1.62 var(--body);
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}

/* faint node grid on the ground, the lattice the whole world reads from */
body::before{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.5;
  background-image:
    radial-gradient(circle at 1px 1px, rgba(0,255,255,.14) 1px, transparent 1.6px);
  background-size:34px 34px;
}
.tb-shell{position:relative;z-index:1}

.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--s3)}
@media(max-width:640px){.wrap{padding:0 var(--s2)}}

/* ---------- 3. TYPE ------------------------------------------ */

h1,h2,h3,h4{
  font-family:var(--disp);font-weight:800;text-transform:uppercase;
  line-height:.92;letter-spacing:.004em;margin:0;text-wrap:balance;color:var(--ink);
}
h1{font-size:clamp(3rem,7.6vw,5.6rem)}
h2{font-size:clamp(2.2rem,4.8vw,3.6rem)}
h3{font-size:clamp(1.15rem,1.9vw,1.4rem);font-weight:700;letter-spacing:.005em}
h4{font-size:.98rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--ink)}
p{margin:0}
a{color:inherit}

.lede{font-size:clamp(1.05rem,1.65vw,1.22rem);line-height:1.62;max-width:62ch;color:var(--ink-2)}
.prose{max-width:68ch;color:var(--ink-2)}
.prose p + p{margin-top:var(--s2)}
.prose strong{color:var(--ink);font-weight:700}
.prose em{color:var(--verified);font-style:normal}
.dim{color:var(--ink-3)}

.meas{font-family:var(--data);font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.plate-type{font-family:var(--data);font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-3)}

/* ---------- 4. SCAN RULE -------------------------------------
   a thin glowing line replaces the old hazard stripe as the
   primary section divider: instrument, not warehouse. */

.hazard{
  height:1px;background:linear-gradient(90deg,transparent,var(--line-hot) 18%,var(--line-hot) 82%,transparent);
  position:relative;
}
.hazard::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,transparent,rgba(0,255,255,.9) 50%,transparent);
  width:120px;opacity:.9;animation:scanrule 5s linear infinite;
}
.hazard--thin{height:1px}
@keyframes scanrule{0%{transform:translateX(-160px)}100%{transform:translateX(calc(100vw + 160px))}}

/* ---------- 5. HEADER ------------------------------------------ */

.site-head{
  position:sticky;top:0;z-index:60;background:rgba(6,8,11,.86);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line);
}
.site-head__bar{display:flex;align-items:stretch;gap:var(--s3);height:78px}

.brand{display:flex;align-items:center;gap:14px;text-decoration:none;flex:0 0 auto;transition:transform .16s cubic-bezier(.16,1,.3,1)}
.brand:hover{transform:translateY(-1px)}
.brand:focus-visible{outline:2px solid var(--verified);outline-offset:4px}

.brand__die{position:relative;width:44px;height:44px;flex:0 0 auto;display:block}
.brand__die svg{width:100%;height:100%;display:block;overflow:visible}
.brand__die .die{fill:var(--panel-2);stroke:var(--verified);stroke-width:1.6;stroke-linejoin:miter}
.brand__die .w{fill:none;stroke:var(--lit);stroke-width:5.5;stroke-linecap:butt;stroke-linejoin:miter}
.brand:hover .die{stroke:var(--lit)}
.brand__die b{
  position:absolute;right:-6px;bottom:-5px;background:var(--lit);color:#fff;
  font-family:var(--data);font-weight:700;font-size:.54rem;line-height:1;
  padding:3px 4px;letter-spacing:.02em;
}

.brand__text{display:block}
.brand__name{font-family:var(--disp);font-weight:800;text-transform:uppercase;font-size:1.86rem;line-height:.88;display:block}
.brand__name em{font-style:normal;color:var(--lit)}
.brand__sub{font-family:var(--body);font-weight:500;font-size:.6rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ink-3);margin-top:5px;display:block}

.nav{display:flex;align-items:center;gap:2px;margin-left:auto}
.nav a{
  font-family:var(--disp);font-weight:700;text-transform:uppercase;font-size:.92rem;
  letter-spacing:.03em;text-decoration:none;padding:9px 14px;color:var(--ink-2);
  border:1px solid transparent;line-height:1;transition:color .14s,border-color .14s,background .14s;
}
.nav a:hover{color:var(--verified);border-color:var(--line-hot)}
.nav a[aria-current="page"]{color:var(--ink);background:var(--panel-2);border-color:var(--line-hot)}

.burger{display:none;margin-left:auto;background:var(--panel-2);border:1px solid var(--line);
  width:46px;height:46px;align-items:center;justify-content:center;cursor:pointer}
.burger svg{width:22px;height:22px;stroke:var(--ink)}

@media(max-width:1080px){
  .nav{display:none}
  .burger{display:flex}
  .nav.is-open{
    display:flex;position:absolute;left:0;right:0;top:100%;flex-direction:column;
    align-items:stretch;background:var(--ground);border-bottom:1px solid var(--line);padding:var(--s2);gap:2px;
  }
  .nav.is-open a{padding:15px}
}

/* ---------- 6. THE READOUT (signature component) ---------------- */

.rig{display:grid;grid-template-columns:1.02fr .98fr;gap:var(--s5);align-items:center;padding:var(--s6) 0 var(--s5)}
@media(max-width:960px){.rig{grid-template-columns:1fr;gap:var(--s4);padding:var(--s5) 0 var(--s4)}}

.rig h1 span{display:block}
.rig h1 .struck{position:relative;display:inline-block;color:var(--ink-3)}
.rig h1 .struck::after{
  content:"";position:absolute;left:-1%;right:-1%;top:53%;height:6px;background:var(--lit);
  box-shadow:0 0 18px rgba(255,69,0,.8);
  transform:scaleX(0);transform-origin:left;animation:strike .5s .7s cubic-bezier(.16,1,.3,1) forwards;
}
@keyframes strike{to{transform:scaleX(1)}}

/* the instrument: glass panel, cyan bracket corners, live glow */
.scale{
  border:1px solid var(--line-hot);clip-path:var(--cut);
  background:linear-gradient(168deg,rgba(16,21,28,.92),rgba(9,12,16,.96));
  backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  box-shadow:0 30px 70px -30px rgba(0,0,0,.7),inset 0 1px 0 rgba(255,255,255,.05);
}
.scale__head{
  display:flex;align-items:center;justify-content:space-between;gap:var(--s2);
  padding:11px var(--s2);border-bottom:1px solid var(--line);
}
.scale__head b{font-family:var(--disp);font-weight:700;font-size:.76rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink-2);white-space:nowrap}
.scale__head .seal{display:flex;align-items:center;gap:7px;font-family:var(--body);font-weight:500;
  font-size:.66rem;letter-spacing:.04em;color:var(--verified);white-space:nowrap}
.scale__head .seal svg{width:12px;height:12px}

.window{padding:var(--s2) var(--s3) 14px;position:relative;overflow:hidden}
.window__row{display:flex;gap:var(--s3);border-bottom:1px solid var(--line);padding-bottom:11px;margin-bottom:var(--s2);align-items:flex-start}
.window__cell{flex:1}
.window__cell b{display:block;font-family:var(--disp);font-weight:700;font-size:.68rem;letter-spacing:.08em;
  color:var(--ink-3);margin-bottom:5px}
.window__cell span{display:block;line-height:1.25;font-family:var(--data);font-weight:700;font-size:.94rem;
  color:var(--verified);font-variant-numeric:tabular-nums}

.readout{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap;min-height:auto;padding:var(--s1) 0 0}
.readout__cur{font-family:var(--disp);font-weight:800;font-size:clamp(1.4rem,3vw,2rem);color:var(--lit);line-height:1;padding-bottom:4px}
.readout__note{font-family:var(--body);font-size:.86rem;color:var(--ink-3);margin-top:var(--s2);line-height:1.65}
.readout__quote{
  font-family:var(--disp);font-weight:800;text-transform:uppercase;
  font-size:clamp(1.5rem,3.2vw,2.3rem);color:var(--verified);line-height:1;
  text-shadow:0 0 26px rgba(0,255,255,.4);
}
.readout__quote.is-no{color:var(--lit);text-shadow:0 0 26px rgba(255,69,0,.4)}

/* --- seven segment digits --- */
.segs{display:flex;align-items:flex-end;gap:.14em;font-size:clamp(34px,6.6vw,58px)}
.dig{position:relative;width:.60em;height:1em;flex:0 0 auto}
.dig i{position:absolute;background:var(--lit);display:block;transition:opacity .13s linear;opacity:0}
.dig i.on{opacity:1;filter:drop-shadow(0 0 6px rgba(255,69,0,.7))}
.dig i.gh{opacity:1;background:rgba(255,69,0,.08)}
.dig .a,.dig .g,.dig .d{left:9%;width:82%;height:.135em;clip-path:polygon(11% 0,89% 0,100% 50%,89% 100%,11% 100%,0 50%)}
.dig .a{top:0}.dig .g{top:calc(50% - .0675em)}.dig .d{bottom:0}
.dig .f,.dig .b,.dig .e,.dig .c{width:.135em;height:calc(50% - .075em);clip-path:polygon(0 11%,50% 0,100% 11%,100% 89%,50% 100%,0 89%)}
.dig .f{top:.075em;left:0}.dig .b{top:.075em;right:0}.dig .e{bottom:.075em;left:0}.dig .c{bottom:.075em;right:0}
.dig--sep{width:.30em}.dig--sep i{background:var(--lit);opacity:1;width:.15em;height:.21em;left:28%;bottom:-.05em;clip-path:polygon(0 0,100% 0,100% 52%,34% 100%,0 68%)}
.dig--dash{width:.42em}.dig--dash i{background:var(--lit);opacity:1;left:8%;width:84%;height:.135em;top:calc(50% - .0675em);clip-path:polygon(11% 0,89% 0,100% 50%,89% 100%,11% 100%,0 50%)}

/* --- controls --- */
.ctrl{padding:var(--s3)}
.ctrl__lab{display:block;font-family:var(--disp);font-weight:700;font-size:.72rem;letter-spacing:.1em;
  color:var(--ink-3);margin-bottom:11px}
.keys{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:var(--s3)}
.keys--lot{margin-bottom:0}
.key{
  background:var(--panel-2);border:1px solid var(--line);color:var(--ink-2);clip-path:var(--cut-btn);
  padding:11px 12px;text-align:left;cursor:pointer;font-family:var(--body);font-size:.86rem;font-weight:600;line-height:1.25;
  transition:border-color .14s,color .14s,background .14s;
}
.key small{display:block;font-family:var(--body);font-weight:400;font-size:.72rem;color:var(--ink-3);margin-top:3px}
.key:hover{border-color:var(--line-hot);color:var(--ink)}
.key:active{transform:translateY(1px)}
.key[aria-pressed="true"]{background:var(--lit-dim);border-color:var(--lit);color:var(--ink)}
.key[aria-pressed="true"] small{color:rgba(255,140,90,.8)}
.key:focus-visible{outline:2px solid var(--verified);outline-offset:2px}

.beam{position:relative;padding:var(--s1) 0 0}
.beam input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:34px;background:transparent;cursor:pointer;margin:0}
.beam input[type=range]::-webkit-slider-runnable-track{height:2px;background:var(--line)}
.beam input[type=range]::-moz-range-track{height:2px;background:var(--line)}
.beam input[type=range]::-webkit-slider-thumb{
  -webkit-appearance:none;width:18px;height:18px;background:var(--lit);border-radius:50%;
  margin-top:-8px;cursor:grab;box-shadow:0 0 14px rgba(255,69,0,.7)}
.beam input[type=range]::-moz-range-thumb{width:18px;height:18px;background:var(--lit);border:0;border-radius:50%;cursor:grab}
.beam input[type=range]:focus-visible{outline:2px solid var(--verified);outline-offset:4px}
.beam__scale{display:flex;justify-content:space-between;font-family:var(--data);font-size:.62rem;color:var(--ink-3);margin-top:5px}
.beam__val{display:flex;align-items:baseline;gap:8px;margin-bottom:2px}
.beam__val b{font-family:var(--disp);font-weight:800;font-size:2rem;line-height:1;color:var(--ink);font-variant-numeric:tabular-nums}
.beam__val span{font-family:var(--data);font-size:.76rem;color:var(--ink-3)}

.band{
  background:var(--panel-2);border-top:1px solid var(--line);
  display:flex;align-items:center;justify-content:space-between;gap:var(--s2);padding:var(--s2) var(--s3);flex-wrap:wrap;
}
.band p{font-family:var(--body);font-size:.82rem;line-height:1.6;max-width:34ch;color:var(--ink-3)}

/* ---------- 7. BUTTONS -------------------------------------- */

.btn{
  display:inline-flex;align-items:center;gap:10px;cursor:pointer;text-decoration:none;
  font-family:var(--disp);font-weight:800;text-transform:uppercase;letter-spacing:.03em;
  font-size:1rem;line-height:1;padding:15px 24px;clip-path:var(--cut-btn);
  background:var(--lit);color:#fff;border:1px solid var(--lit);
  transition:background .14s,box-shadow .14s,transform .1s;
}
.btn:hover{background:var(--lit-hi);box-shadow:0 0 30px rgba(255,69,0,.5)}
.btn:active{transform:translateY(1px)}
.btn:focus-visible{outline:2px solid var(--verified);outline-offset:3px}
.btn--lit{background:var(--lit);border-color:var(--lit)}
.btn--ghost{background:transparent;color:var(--ink);border-color:var(--line-hot)}
.btn--ghost:hover{background:rgba(0,255,255,.08);box-shadow:0 0 24px rgba(0,255,255,.22)}
.btn svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:2.4}

/* ---------- 8. SECTIONS ------------------------------------- */

section{padding:var(--s6) 0;position:relative}
@media(max-width:760px){section{padding:var(--s5) 0}}
.sec-dark{background:var(--panel)}
.sec-hi{background:var(--panel-2)}
.close{background:linear-gradient(180deg,var(--panel-2),var(--panel))}

.sec-head{max-width:66ch;margin-bottom:var(--s5)}
.sec-head h2{margin-bottom:var(--s2)}
h2{margin-bottom:0}
.cols2 h2 + .prose,.cols2 h2 + .settle{margin-top:var(--s3)}
section .sec-head h2{margin-bottom:var(--s2)}

/* kicker device retired entirely: the heading carries its weight */
.station{display:none}

/* ---------- 9. THE PRICE / ASSAY BOARD ----------------------- */

.board{border:1px solid var(--line-hot);clip-path:var(--cut);overflow:hidden;
  background:linear-gradient(168deg,rgba(16,21,28,.92),rgba(9,12,16,.96));
  backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);}
.board__top{display:flex;align-items:center;justify-content:space-between;gap:var(--s2);
  padding:13px var(--s3);border-bottom:1px solid var(--line);flex-wrap:wrap}
.board__top h3{color:var(--ink);font-size:1rem}
.board__stamp{display:flex;align-items:center;gap:8px;font-family:var(--body);font-weight:500;
  font-size:.72rem;color:var(--verified)}
.board__stamp i{width:6px;height:6px;background:var(--verified);display:block;border-radius:50%;
  box-shadow:0 0 8px var(--verified);animation:tick 2.4s ease-in-out infinite}
@keyframes tick{0%,100%{opacity:1}50%{opacity:.25}}

.board table{width:100%;border-collapse:collapse;font-family:var(--body)}
.board th{text-align:left;font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--ink-3);font-weight:700;padding:11px var(--s3);border-bottom:1px solid var(--line)}
.board th:last-child,.board td:last-child{text-align:right}
.board td{padding:13px var(--s3);border-bottom:1px solid rgba(255,255,255,.05);color:var(--ink-2);
  font-size:.92rem;vertical-align:middle}
.board tr:last-child td{border-bottom:0}
.board tr:hover td{background:rgba(255,255,255,.02)}
.board .grade{color:var(--ink);font-weight:700}
.board .rng{color:var(--lit);font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap;font-family:var(--data)}
.board .qte{color:var(--verified);font-weight:700;letter-spacing:.06em;font-size:.78rem;font-family:var(--data)}
.board__foot{padding:var(--s2) var(--s3);font-family:var(--body);font-size:.8rem;line-height:1.7;
  color:var(--ink-3);border-top:1px solid var(--line)}
.board__foot a{color:var(--verified)}
@media(max-width:640px){.board th,.board td{padding:11px var(--s2);font-size:.84rem}
  .board th:nth-child(2),.board td:nth-child(2){display:none}}

/* ---------- 10. SPEC PANEL (proof, glass not steel) ---------- */

.plate{
  position:relative;border:1px solid var(--line-hot);clip-path:var(--cut);
  background:linear-gradient(168deg,rgba(16,21,28,.9),rgba(9,12,16,.94));
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  box-shadow:0 20px 50px -28px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.04);
  padding:var(--s3);
}
.plate::before{content:"";position:absolute;top:0;left:0;width:22px;height:22px;
  border-top:1px solid var(--verified);border-left:1px solid var(--verified);opacity:.85}
.plate::after{content:"";position:absolute;bottom:0;right:0;width:22px;height:22px;
  border-bottom:1px solid var(--verified);border-right:1px solid var(--verified);opacity:.85}
.plate h4{margin-bottom:var(--s2);color:var(--verified);letter-spacing:.08em}
.plate dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:9px var(--s3);font-family:var(--data);font-size:.78rem}
.plate dt{color:var(--ink-3);letter-spacing:.03em}
.plate dd{margin:0;font-weight:700;text-align:right;color:var(--ink);font-variant-numeric:tabular-nums}
.plate p{color:var(--ink-2)}

/* ---------- alert panel: compliance/caveat, its own object ---- */

.placard{
  position:relative;border:1px solid rgba(245,196,0,.4);clip-path:var(--cut);
  background:linear-gradient(168deg,rgba(38,30,4,.55),rgba(16,13,4,.7));
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  padding:var(--s3);
}
.placard::before{
  content:"";position:absolute;top:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg,transparent,var(--amber) 30%,var(--amber) 70%,transparent);
}
.placard h4{color:var(--amber);letter-spacing:.06em;margin-top:6px}
.placard p{color:#D8CBA0;font-size:.92rem;line-height:1.65}
.placard dl{margin:var(--s2) 0 0;display:grid;grid-template-columns:auto 1fr;gap:6px var(--s2);font-family:var(--data);font-size:.76rem}
.placard dt{color:#A69569;letter-spacing:.04em;font-weight:700}
.placard dd{margin:0;font-weight:700;text-align:right;color:#F0E4BE;font-variant-numeric:tabular-nums}
.placard .bolt{display:none}

/* ---------- 11. MATERIAL RANK — periodic-cell identity, not icons ----
   "the icons make no sense" was a real defect: line-art tools
   carried no information a visitor could parse in passing. This
   is what actually identifies tungsten: element W, atomic number
   74. Every material row now reads by that signature instead. */

.mats{border-top:1px solid var(--line)}
.mat{display:grid;grid-template-columns:80px 1.3fr 1fr;gap:var(--s3);align-items:center;
  padding:var(--s3) 0;border-bottom:1px solid var(--line)}
.mat__cell{
  width:80px;height:80px;flex:0 0 auto;position:relative;
  border:1px solid var(--line-hot);clip-path:var(--cut-btn);
  background:linear-gradient(160deg,rgba(0,255,255,.07),rgba(0,255,255,.015));
  display:flex;flex-direction:column;justify-content:space-between;padding:8px 9px;
}
.mat__cell b{font-family:var(--data);font-size:1.5rem;font-weight:700;color:var(--ink);line-height:1}
.mat__cell i{font-style:normal;font-family:var(--data);font-size:.6rem;color:var(--verified);
  align-self:flex-end;letter-spacing:.02em}
.mat__cell span{font-family:var(--body);font-weight:600;font-size:.58rem;letter-spacing:.03em;
  text-transform:uppercase;color:var(--ink-3);line-height:1.15}
.mat__name h3{margin-bottom:5px}
.mat__name p{font-size:.9rem;color:var(--ink-3);max-width:44ch}
.mat__spec{font-family:var(--data);font-size:.8rem;color:var(--ink-2);line-height:1.9}
.mat__spec b{color:var(--verified);letter-spacing:.03em}
.mat__px{display:none}
@media(max-width:860px){
  .mat{grid-template-columns:64px 1fr;gap:var(--s2)}
  .mat__cell{width:64px;height:64px}
  .mat__cell b{font-size:1.15rem}
  .mat__spec{grid-column:2}
}

/* carbide block: delimited so it lifts out in one edit */
.carbide-gate{border-left:2px solid var(--lit);padding-left:var(--s3);margin:var(--s4) 0}

/* ---------- 12. DENSITY COLUMN ------------------------------ */

.dens{display:flex;flex-direction:column;gap:11px}
.drow{display:grid;grid-template-columns:132px 1fr 74px;align-items:center;gap:var(--s2)}
.dname{font-family:var(--body);font-size:.86rem;font-weight:500;color:var(--ink-2)}
.dtrack{height:24px;background:var(--panel-2);border:1px solid var(--line);overflow:hidden}
.dfill{height:100%;width:0;background:var(--ink-3);transition:width 1.1s cubic-bezier(.16,1,.3,1)}
.dfill--w{background:linear-gradient(90deg,var(--lit),var(--lit-hi));box-shadow:0 0 14px rgba(255,69,0,.5)}
.dval{font-family:var(--data);font-weight:700;text-align:right;font-size:.84rem;color:var(--ink);font-variant-numeric:tabular-nums}
.drow--w .dname{font-weight:700;color:var(--ink)}
@media(max-width:640px){.drow{grid-template-columns:86px 1fr 62px;gap:10px}.dname{font-size:.76rem}}

/* ---------- 13. PROCESS STEPS -------------------------------- */

.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s4)}
.step{border-top:1px solid var(--line-hot);padding-top:var(--s2)}
.step__n{font-family:var(--data);font-size:.7rem;letter-spacing:.12em;color:var(--lit);
  text-transform:uppercase;font-weight:700}
.step h3{margin:11px 0 var(--s1)}
.step p{color:var(--ink-3);font-size:.95rem}
@media(max-width:820px){.steps{grid-template-columns:1fr;gap:var(--s3)}}

/* ---------- 14. TICKET / SUBMISSION FORM ---------------------- */

.ticket{
  border:1px solid var(--line-hot);clip-path:var(--cut);position:relative;
  background:linear-gradient(168deg,rgba(16,21,28,.94),rgba(9,12,16,.98));
  backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  box-shadow:0 28px 60px -30px rgba(0,0,0,.7);
}
.ticket__perf{height:0}
.ticket__head{background:var(--panel-2);border-bottom:1px solid var(--line);padding:var(--s2) var(--s3);
  display:flex;justify-content:space-between;align-items:center;gap:var(--s2);flex-wrap:wrap}
.ticket__head h3{color:var(--ink)}
.ticket__no{font-family:var(--data);font-size:.66rem;letter-spacing:.1em;color:var(--verified)}
.ticket__body{padding:var(--s3)}

.f{display:flex;flex-direction:column;gap:7px;margin-bottom:var(--s2)}
.f2{display:grid;grid-template-columns:1fr 1fr;gap:var(--s2)}
@media(max-width:560px){.f2{grid-template-columns:1fr}}
label{font-family:var(--disp);font-weight:700;font-size:.68rem;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-3)}
input,select,textarea{
  font-family:var(--body);font-size:1rem;color:var(--ink);
  background:var(--panel);border:1px solid var(--line);padding:12px 13px;border-radius:0;width:100%;
  transition:border-color .13s,background .13s;
}
input:hover,select:hover,textarea:hover{border-color:var(--line-hot)}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--verified);background:var(--panel-2);
  box-shadow:0 0 0 1px var(--verified)}
input::placeholder,textarea::placeholder{color:var(--ink-3)}
input[aria-invalid="true"],select[aria-invalid="true"]{border-color:#E5484D;background:rgba(229,72,77,.06)}
.err{font-family:var(--body);font-size:.78rem;color:#F5847F;display:none}
.err.show{display:block}
.formnote{font-family:var(--body);font-size:.78rem;color:var(--ink-3);line-height:1.7;margin-top:var(--s2)}
.formnote a{color:var(--verified);font-weight:600}
.sent{border:1px solid var(--line-hot);background:rgba(0,255,255,.05);padding:var(--s3);display:none}
.sent.show{display:block}
.sent h3{color:var(--verified);margin-bottom:var(--s1)}
.sent p{font-size:.94rem;color:var(--ink-2)}

/* ---------- 15. FAQ (AEO surface) ------------------------------ */

.faq{border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{
  cursor:pointer;list-style:none;padding:var(--s3) var(--s4) var(--s3) 0;position:relative;
  font-family:var(--disp);font-weight:700;text-transform:uppercase;font-size:1.08rem;line-height:1.2;color:var(--ink);
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"";position:absolute;right:6px;top:50%;width:15px;height:15px;margin-top:-8px;
  background:var(--verified);
  -webkit-mask:linear-gradient(#000,#000) center/100% 2px no-repeat,linear-gradient(#000,#000) center/2px 100% no-repeat;
  mask:linear-gradient(#000,#000) center/100% 2px no-repeat,linear-gradient(#000,#000) center/2px 100% no-repeat;
  transition:transform .22s cubic-bezier(.16,1,.3,1);
}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq summary:hover{color:var(--verified)}
.faq summary:focus-visible{outline:2px solid var(--verified);outline-offset:2px}
.faq__a{padding:0 var(--s4) var(--s3) 0;color:var(--ink-2);max-width:70ch}
.faq__a p + p{margin-top:var(--s2)}

/* ---------- 16. CLOSE + FOOTER ---------------------------------- */

.close h2{max-width:19ch}
.close .btn--ghost{color:var(--ink)}

.site-foot{background:var(--ground);border-top:1px solid var(--line);color:var(--ink-3);padding:var(--s5) 0 var(--s4);font-size:.9rem}
.foot-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:var(--s4)}
@media(max-width:820px){.foot-grid{grid-template-columns:1fr;gap:var(--s3)}}
.site-foot h4{color:var(--ink);margin-bottom:var(--s2);font-family:var(--disp);font-size:.68rem;letter-spacing:.12em;font-weight:700}
.site-foot a{color:var(--ink-2);text-decoration:none}
.site-foot a:hover{color:var(--verified)}
.site-foot ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}
.certs{font-family:var(--data);font-size:.78rem;line-height:2}
.certs b{color:var(--verified);font-weight:700}
.colophon{border-top:1px solid var(--line);margin-top:var(--s4);padding-top:var(--s3);
  display:flex;justify-content:space-between;gap:var(--s2);flex-wrap:wrap;font-family:var(--data);font-size:.7rem;color:var(--ink-3)}

/* ---------- 17. DRAFT MARKER ------------------------------------ */

.draft{background:var(--lit);color:#fff;text-align:center;padding:8px 16px;
  font-family:var(--disp);font-weight:700;font-size:.68rem;letter-spacing:.12em;text-transform:uppercase}

/* ---------- 18. UTILITY ------------------------------------------ */

.skip{position:absolute;left:-9999px;top:0;background:var(--verified);color:#000;
  padding:12px 18px;z-index:200;font-family:var(--disp);font-weight:700;text-transform:uppercase}
.skip:focus{left:0}
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap}
.cols2{display:grid;grid-template-columns:1fr 1fr;gap:var(--s5);align-items:start}
@media(max-width:900px){.cols2{grid-template-columns:1fr;gap:var(--s4)}}
.stack-s3{display:flex;flex-direction:column;gap:var(--s3)}
.stack-s2{display:flex;flex-direction:column;gap:var(--s2)}
.row-gap{display:flex;flex-wrap:wrap;gap:var(--s2);align-items:center}
.mt2{margin-top:var(--s2)}.mt3{margin-top:var(--s3)}.mt4{margin-top:var(--s4)}.mt5{margin-top:var(--s5)}

/* ---------- 19. FORGE (first viewport) --------------------------- */

.forge{position:relative;isolation:isolate;overflow:hidden;
  min-height:100svh;display:flex;flex-direction:column;justify-content:center;border-bottom:1px solid var(--line)}
.forge__gl{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:0}
.forge::before{
  content:"";position:absolute;inset:0;z-index:0;
  background:
    radial-gradient(120% 85% at 22% 108%, #FFE7C2 0%, #FFAE4D 12%, #FF4500 30%, #4a1400 58%, #06080B 82%),
    linear-gradient(var(--ground),var(--ground));
}
.forge.is-gl::before{opacity:0}
.forge::after{content:"";position:absolute;left:0;right:0;bottom:0;height:22%;z-index:1;pointer-events:none;
  background:linear-gradient(to bottom,transparent,var(--ground))}
.forge__inner{position:relative;z-index:2;width:100%;padding:var(--s3) 0 var(--s5)}

.forge h1{color:#FFF7EE;text-shadow:0 3px 34px rgba(0,0,0,.7),0 1px 3px rgba(0,0,0,.6)}
.forge h1 .struck{color:rgba(255,247,238,.42)}
.forge .lede{color:rgba(255,244,233,.9);text-shadow:0 2px 18px rgba(0,0,0,.75)}
.forge .meas{color:rgba(255,238,222,.72)!important}
.forge .rig{padding:var(--s4) 0 0;align-items:start}
.forge .scale__head{padding-top:9px;padding-bottom:9px}
.forge .window{padding:var(--s2) var(--s3) 14px}
.forge .ctrl{padding:var(--s2) var(--s3) var(--s3)}
.forge .keys{margin-bottom:var(--s2)}
.forge .segs{font-size:clamp(32px,4.4vw,54px)}

.telem{
  position:relative;z-index:2;display:flex;align-items:center;gap:12px;
  padding:11px 0;border-bottom:1px solid rgba(255,247,238,.16);
  font-family:var(--body);font-weight:500;font-size:.76rem;letter-spacing:.03em;
  color:#FFD9B8;min-height:40px;margin-bottom:var(--s2);
}
.telem__dot{width:7px;height:7px;flex:0 0 auto;background:var(--verified);border-radius:50%;
  box-shadow:0 0 12px var(--verified);animation:tick 2.4s ease-in-out infinite}
.telem b{color:var(--verified);font-weight:700;flex:0 0 auto;font-family:var(--disp);letter-spacing:.1em}
.telem span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.telem span::after{content:"_";animation:caret 1s steps(1) infinite;color:var(--verified)}
@keyframes caret{0%,50%{opacity:1}51%,100%{opacity:0}}

.melt{position:relative;z-index:2;display:flex;align-items:baseline;gap:12px;margin-top:var(--s4)}
.melt b{font-family:var(--disp);font-weight:800;font-size:clamp(2.6rem,6vw,4.4rem);line-height:.85;
  color:#FFF7EE;font-variant-numeric:tabular-nums;text-shadow:0 0 44px rgba(255,140,50,.75),0 2px 4px rgba(0,0,0,.6)}
.melt i{font-style:normal;font-family:var(--disp);font-weight:800;font-size:clamp(1.2rem,2.4vw,1.9rem);color:#FFC98F}
.melt em{font-style:normal;font-family:var(--body);font-size:.78rem;color:rgba(255,232,212,.78);max-width:22ch;line-height:1.6}

@media(max-width:960px){.forge{min-height:auto}.forge__inner{padding:var(--s2) 0 var(--s4)}.melt{margin-top:var(--s3)}}

/* ---------- 20. HUD BRACKET + ANNOTATION ------------------------- */

.bracket{position:relative}
.bracket::before,.bracket::after{
  content:"";position:absolute;width:24px;height:24px;pointer-events:none;z-index:3;
  border:1px solid var(--verified);opacity:0;transition:opacity .4s,transform .5s cubic-bezier(.16,1,.3,1);
}
.bracket::before{top:-9px;left:-9px;border-right:0;border-bottom:0;transform:translate(9px,9px)}
.bracket::after{bottom:-9px;right:-9px;border-left:0;border-top:0;transform:translate(-9px,-9px)}
.is-live .bracket::before,.is-live .bracket::after,.forge .bracket::before,.forge .bracket::after{opacity:.9;transform:translate(0,0)}

.anno{
  position:absolute;z-index:4;font-family:var(--disp);font-weight:700;font-size:.7rem;letter-spacing:.06em;
  text-transform:uppercase;color:var(--verified);white-space:nowrap;pointer-events:none;
  opacity:0;animation:annoIn .6s .9s cubic-bezier(.16,1,.3,1) forwards;text-shadow:0 1px 8px rgba(0,0,0,.9);
}
.anno::before{content:"";position:absolute;top:50%;height:1px;background:var(--verified);opacity:.7}
.anno--l{left:calc(100% + 26px)}
.anno--l::before{right:100%;width:20px}
.anno--r{left:calc(100% + 26px)}
.anno--r::before{right:100%;width:20px}
.anno i{font-style:normal;display:block;font-family:var(--body);font-weight:400;color:rgba(255,247,238,.7);
  font-size:.62rem;letter-spacing:.02em;text-transform:none}
@keyframes annoIn{to{opacity:1}}
@media(max-width:1400px){.anno{display:none}}
@media(min-width:1400px){.forge .rig{padding-right:158px}}

/* ---------- station rail --------------------------------------- */

.rail{position:fixed;right:22px;top:50%;transform:translateY(-50%);z-index:50;
  display:flex;flex-direction:column;gap:2px;padding:14px 12px;
  background:rgba(6,8,11,.9);border:1px solid var(--line);backdrop-filter:blur(6px)}
.rail__stop{display:flex;align-items:center;gap:9px;text-decoration:none;
  font-family:var(--disp);font-weight:700;font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);padding:5px 2px;transition:color .2s}
.rail__stop i{width:8px;height:8px;flex:0 0 auto;border:1px solid var(--ink-3);border-radius:50%;transition:.24s}
.rail__stop span{opacity:0;max-width:0;overflow:hidden;transition:opacity .22s,max-width .28s;white-space:nowrap}
.rail:hover .rail__stop span{opacity:1;max-width:150px}
.rail__stop.is-done i{background:var(--ink-3);border-color:var(--ink-3)}
.rail__stop.is-on{color:var(--verified)}
.rail__stop.is-on i{background:var(--verified);border-color:var(--verified);box-shadow:0 0 10px rgba(0,255,255,.7)}
.rail__stop:hover{color:var(--ink)}
.rail__stop:focus-visible{outline:2px solid var(--verified);outline-offset:2px}
@media(max-width:1180px){.rail{display:none}}

/* ---------- scan sweep on acquire -------------------------------- */

.scanline{position:relative;overflow:hidden}
.scanline::after{
  content:"";position:absolute;left:0;right:0;top:0;height:36%;pointer-events:none;z-index:2;
  background:linear-gradient(to bottom,transparent,rgba(0,255,255,.1),transparent);
  transform:translateY(-140%);
}
.is-live .scanline::after{animation:sweep 1.05s .1s cubic-bezier(.35,0,.2,1) forwards}
@keyframes sweep{to{transform:translateY(340%)}}

@media(prefers-reduced-motion:reduce){
  .telem span::after{animation:none}
  .is-live .scanline::after{animation:none;opacity:0}
  .anno{opacity:1;animation:none}
  .hazard::after{animation:none;display:none}
}

/* ---------- 21. THE ONE AUTHORED MOMENT ---------------------------- */

.settle{opacity:0;transform:translateY(22px)}
.is-live .settle{animation:settle .72s cubic-bezier(.16,1,.3,1) forwards}
.is-live .settle[data-d="1"]{animation-delay:.07s}
.is-live .settle[data-d="2"]{animation-delay:.14s}
.is-live .settle[data-d="3"]{animation-delay:.21s}
.is-live .settle[data-d="4"]{animation-delay:.28s}
@keyframes settle{0%{opacity:0;transform:translateY(22px)}62%{opacity:1;transform:translateY(-4px)}100%{opacity:1;transform:translateY(0)}}
.no-js .settle,.reveal-off .settle{opacity:1;transform:none;animation:none}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important;scroll-behavior:auto!important}
  .settle{opacity:1!important;transform:none!important}
  .rig h1 .struck::after{transform:scaleX(1)}
}

/* ---------- 22. LATTICE FIELD (ambient motion, dark sections) ---- */
/* A slow node-and-line network, the way an analyzer visualizes a
   crystal lattice. Canvas 2D, cheap, paused off-screen and under
   reduced motion. Applied to sec-dark sections as depth, not the
   main event; the forge and the instrument stay the leads. */

.lattice{position:absolute;inset:0;z-index:0;opacity:.5;pointer-events:none}
[data-lattice-host]{position:relative;isolation:isolate}
[data-lattice-host] > .wrap{position:relative;z-index:1}

/* ---------- 23. INNER-PAGE MASTHEAD ------------------------------- */

.mast{padding:var(--s6) 0 var(--s5);position:relative}
.mast__grid{display:grid;grid-template-columns:1.3fr .7fr;gap:var(--s4);align-items:center}
.mast__say h1{max-width:13ch}
.mast__say .lede{max-width:52ch}
.mast__plate .plate{margin-left:auto;max-width:400px}
@media(max-width:900px){
  .mast{padding:var(--s5) 0 var(--s4)}
  .mast__grid{grid-template-columns:1fr;gap:var(--s4);align-items:start}
  .mast__plate .plate{margin-left:0;max-width:420px}
}

/* ---------- 24. PRINT ---------------------------------------------- */
@media print{
  body::before,.site-head,.draft,.close,.band,.lattice{display:none}
  body{background:#fff;color:#000}
  .window{background:#fff}
  .dig i{background:#000}
}


/* ---------- live-instrument pulse + scan-in (new tweaks) ---------- */

@keyframes tb-pulse{
  0%,100%{opacity:1}
  50%{opacity:.45}
}
.seal svg{animation:tb-pulse 2.2s ease-in-out infinite}

@keyframes tb-scan{
  0%{box-shadow:inset 0 0 0 1px rgba(0,255,255,.32)}
  35%{box-shadow:inset 0 0 0 1px rgba(0,255,255,1),0 0 18px rgba(0,255,255,.5)}
  100%{box-shadow:inset 0 0 0 1px rgba(0,255,255,.32)}
}
.is-live .mat__cell{animation:tb-scan 1.1s ease-out}
.is-live .mats .mat:nth-child(2) .mat__cell{animation-delay:.08s}
.is-live .mats .mat:nth-child(3) .mat__cell{animation-delay:.16s}
.is-live .mats .mat:nth-child(4) .mat__cell{animation-delay:.24s}
.is-live .mats .mat:nth-child(5) .mat__cell{animation-delay:.32s}

@media(prefers-reduced-motion:reduce){
  .seal svg{animation:none}
  .is-live .mat__cell{animation:none}
}