/* ==========================================================================
   CENTRAL FLORIDA LASER SOLUTIONS — Design System
   Style:   Technical Dark / Industrial Precision
   Palette: near-black substrate, annealed white, laser red
   Type:    Archivo (display, variable width) / Inter (body) / JetBrains Mono (data)
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. TOKENS
   -------------------------------------------------------------------------- */
:root {
  /* Surfaces — never pure #000 (OLED smear + harsh on LCD) */
  --ink-950:#050506;
  --ink-900:#08090B;
  --ink-850:#0B0C0F;
  --ink-800:#101216;
  --ink-750:#15181D;
  --ink-700:#1A1E25;
  --ink-600:#232830;

  /* Lines */
  --line:      #23272F;
  --line-soft: #191D24;
  --line-hard: #343A46;

  /* Foreground */
  --fg:   #F4F5F7;   /* 19:1 on --ink-950 */
  --fg-2: #B7BCC7;   /* 10:1 */
  --fg-3: #858B99;   /*  5.6:1 — smallest size allowed for real text */
  --fg-4: #5C6270;   /* 3.3:1 — icons, rules and dividers ONLY, never text */

  /* Brand — laser red */
  --laser:      #E01B24;  /* fills, rules, glows. NOT for small text on dark */
  --laser-lit:  #FF4A4A;  /* 5.9:1 on --ink-950 — safe for small text */
  --laser-deep: #8E1015;
  --laser-glow: rgba(224,27,36,.45);

  /* Signal colors — ANSI Z535.4 accurate */
  --sig-danger:  #C8102E;
  --sig-warning: #F2A900;
  --sig-caution: #FFD100;
  --sig-notice:  #005EB8;
  --sig-safety:  #00843D;

  /* Semantic */
  --bg:        var(--ink-950);
  --surface:   var(--ink-850);
  --surface-2: var(--ink-800);
  --accent:    var(--laser);
  --focus:     #FF6B6B;

  /* Spacing — 4/8 rhythm */
  --s-1:4px;  --s-2:8px;  --s-3:12px; --s-4:16px; --s-5:24px;
  --s-6:32px; --s-7:48px; --s-8:64px; --s-9:96px; --s-10:128px;

  /* Radii — tight, machined */
  --r-sm:3px; --r-md:5px; --r-lg:8px; --r-xl:14px;

  /* Elevation */
  --e-1:0 1px 2px rgba(0,0,0,.6);
  --e-2:0 4px 16px rgba(0,0,0,.5);
  --e-3:0 16px 48px rgba(0,0,0,.6);

  /* Motion */
  --ease:cubic-bezier(.16,1,.3,1);
  --ease-io:cubic-bezier(.4,0,.2,1);
  --t-fast:140ms; --t-med:240ms; --t-slow:420ms;

  /* Layout */
  --wrap:1200px;
  --wrap-narrow:820px;
  --gutter:clamp(20px,5vw,48px);
  --header-h:74px;

  /* Type */
  --f-display:'Archivo','Arial Narrow',system-ui,sans-serif;
  --f-body:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --f-mono:'JetBrains Mono',ui-monospace,'SF Mono',Consolas,monospace;

  /* Z-scale */
  --z-base:0; --z-raised:10; --z-sticky:40; --z-header:100; --z-overlay:500; --z-modal:1000;
}

/* --------------------------------------------------------------------------
   2. RESET
   -------------------------------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box}
*{margin:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + 24px)}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

body{
  overflow-wrap:break-word;
  font-family:var(--f-body);
  font-size:16px;
  line-height:1.65;
  color:var(--fg-2);
  background:var(--bg);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
  min-height:100dvh;
}
img,svg,video{display:block;max-width:100%}
/* Let <picture> vanish from the box tree so every `... img` rule below
   keeps applying exactly as it did before the WebP sources were added. */
picture{display:contents}
img{height:auto}
button,input,select,textarea{font:inherit;color:inherit}
button{background:none;border:0;cursor:pointer}
a{color:inherit;text-decoration:none}
ul,ol{list-style:none;padding:0}
table{border-collapse:collapse;width:100%}
:focus-visible{outline:2px solid var(--focus);outline-offset:3px;border-radius:2px}
::selection{background:var(--laser);color:#fff}

/* --------------------------------------------------------------------------
   3. TYPOGRAPHY
   -------------------------------------------------------------------------- */
h1,h2,h3,h4,h5{
  font-family:var(--f-display);
  color:var(--fg);
  line-height:1.06;
  letter-spacing:-.015em;
  font-weight:700;
  font-stretch:112%;
  text-wrap:balance;
}
h1{font-size:clamp(2.4rem,1.4rem + 4.4vw,4.6rem);letter-spacing:-.028em}
h2{font-size:clamp(1.85rem,1.2rem + 2.6vw,3.1rem);letter-spacing:-.022em}
h3{font-size:clamp(1.3rem,1.05rem + 1.05vw,1.75rem);line-height:1.15;letter-spacing:-.015em}
h4{font-size:1.075rem;line-height:1.25;font-stretch:106%;letter-spacing:-.005em}
h5{font-size:.95rem;font-stretch:104%}
p{text-wrap:pretty}

.lead{font-size:clamp(1.05rem,.98rem + .42vw,1.3rem);line-height:1.6;color:var(--fg-2)}
.muted{color:var(--fg-3)}
.small{font-size:.875rem;line-height:1.6}
.tiny{font-size:.78rem;line-height:1.55}
.mono{font-family:var(--f-mono);font-variant-numeric:tabular-nums}
.tabular{font-variant-numeric:tabular-nums}
strong,b{color:var(--fg);font-weight:600}
.prose p + p{margin-top:1em}
.prose{max-width:68ch}
.mb-0{margin-bottom:0}
.mt-2{margin-top:var(--s-2)}
.mt-3{margin-top:var(--s-3)}
.mt-4{margin-top:var(--s-4)}
.mt-5{margin-top:var(--s-5)}
.mt-6{margin-top:var(--s-6)}
.mt-7{margin-top:var(--s-7)}
.center{text-align:center}

/* Eyebrow — the recurring "— TECHNICAL LABEL" tag */
.eyebrow{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--f-mono);font-size:.7rem;font-weight:500;
  letter-spacing:.22em;text-transform:uppercase;
  color:var(--laser-lit);margin-bottom:var(--s-4);
}
.eyebrow::before{
  content:"";width:26px;height:1px;flex:none;
  background:linear-gradient(90deg,transparent,var(--laser));
}
.eyebrow--mute{color:var(--fg-3)}
.eyebrow--mute::before{background:linear-gradient(90deg,transparent,var(--line-hard))}

/* Laser rule — brand motif: fading line ending in a point of light */
.laser-rule{
  position:relative;height:1px;border:0;margin:var(--s-6) 0;
  background:linear-gradient(90deg,transparent,var(--laser-deep) 20%,var(--laser) 88%,transparent);
}
.laser-rule::after{
  content:"";position:absolute;right:8%;top:50%;
  width:5px;height:5px;margin-top:-2.5px;border-radius:50%;
  background:#fff;box-shadow:0 0 6px 2px var(--laser),0 0 18px 6px var(--laser-glow);
}

/* --------------------------------------------------------------------------
   4. LAYOUT
   -------------------------------------------------------------------------- */
.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gutter)}
.wrap--narrow{max-width:var(--wrap-narrow)}
.wrap--wide{max-width:1400px}
.section{padding-block:clamp(52px,7vw,96px);position:relative}
.section--tight{padding-block:clamp(40px,5.5vw,72px)}
.section--alt{background:var(--ink-900);border-block:1px solid var(--line-soft)}
.section--deep{background:linear-gradient(180deg,var(--ink-950),var(--ink-900) 60%,var(--ink-950))}
.section-head{max-width:760px;margin-bottom:var(--s-7)}
.section-head p{margin-top:var(--s-4)}
.section-head--center{margin-inline:auto;text-align:center}
.section-head--center .eyebrow{justify-content:center}

.grid{display:grid;gap:var(--s-5)}
.g-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,5vw,72px);align-items:center}
.split--top{align-items:start}
.split--60{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)}
.split--40{grid-template-columns:minmax(0,1fr) minmax(0,1.35fr)}
.stack-4{display:flex;flex-direction:column;gap:var(--s-4)}
.stack-5{display:flex;flex-direction:column;gap:var(--s-5)}
.row{display:flex;flex-wrap:wrap;gap:var(--s-3);align-items:center}

@media (max-width:960px){
  .g-4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .g-3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .split,.split--60,.split--40{grid-template-columns:minmax(0,1fr);gap:var(--s-7)}
}
@media (max-width:620px){
  .g-2,.g-3,.g-4{grid-template-columns:minmax(0,1fr)}
}

/* Technical grid backdrop */
.tech-grid{position:relative;isolation:isolate}
.tech-grid::before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.028) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.028) 1px,transparent 1px);
  background-size:64px 64px;
  mask-image:radial-gradient(ellipse 80% 60% at 50% 40%,#000 25%,transparent 78%);
  -webkit-mask-image:radial-gradient(ellipse 80% 60% at 50% 40%,#000 25%,transparent 78%);
}

/* --------------------------------------------------------------------------
   5. HEADER / NAV
   -------------------------------------------------------------------------- */
.skip-link{
  position:absolute;left:var(--s-4);top:-100px;z-index:var(--z-modal);
  background:var(--laser);color:#fff;padding:12px 20px;border-radius:var(--r-md);
  font-weight:600;font-size:.9rem;transition:top var(--t-fast) var(--ease-io);
}
.skip-link:focus{top:var(--s-4)}

.site-header{
  position:sticky;top:0;z-index:var(--z-header);
  height:var(--header-h);
  background:rgba(5,5,6,.72);
  backdrop-filter:blur(16px) saturate(150%);
  -webkit-backdrop-filter:blur(16px) saturate(150%);
  border-bottom:1px solid var(--line-soft);
  transition:background var(--t-med) var(--ease-io),border-color var(--t-med) var(--ease-io);
}
.site-header[data-scrolled="true"]{background:rgba(5,5,6,.94);border-bottom-color:var(--line)}
.site-header::after{
  content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;
  background:linear-gradient(90deg,transparent,var(--laser-deep) 30%,var(--laser) 50%,var(--laser-deep) 70%,transparent);
  opacity:.5;
}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:var(--s-5);height:100%}

/* Logo lockup — inline SVG mark + wordmark */
.logo{display:flex;align-items:center;gap:11px;flex:none;padding:6px 4px;border-radius:var(--r-md)}
.logo svg{width:48px;height:auto;flex:none;overflow:visible}
.fl-outline{fill:none;stroke:#fff;stroke-width:5.5;stroke-linejoin:round;stroke-linecap:round}
.fl-beam{stroke:var(--laser);stroke-width:6;stroke-linecap:round;filter:drop-shadow(0 0 4px var(--laser))}
.fl-burst{fill:var(--laser);filter:drop-shadow(0 0 6px var(--laser))}
.fl-burst--x{opacity:.75}
.fl-core{fill:#fff;filter:drop-shadow(0 0 5px #fff)}
.logo-type{display:flex;flex-direction:column;line-height:1;gap:3px}
.logo-type .l1{
  font-family:var(--f-display);font-weight:600;font-stretch:118%;
  font-size:.94rem;letter-spacing:.055em;color:#fff;white-space:nowrap;
}
.logo-type .l2{
  font-family:var(--f-display);font-weight:600;font-stretch:118%;
  font-size:.62rem;letter-spacing:.2em;color:var(--laser-lit);white-space:nowrap;
}

/* Desktop nav */
.nav{display:flex;align-items:center;gap:2px}
.nav a{
  position:relative;display:block;padding:9px 13px;border-radius:var(--r-md);
  font-size:.875rem;font-weight:500;color:var(--fg-2);
  transition:color var(--t-fast) var(--ease-io),background var(--t-fast) var(--ease-io);
  white-space:nowrap;
}
.nav a:hover{color:var(--fg);background:rgba(255,255,255,.045)}
.nav a[aria-current="page"]{color:var(--fg)}
.nav a[aria-current="page"]::after{
  content:"";position:absolute;left:13px;right:13px;bottom:2px;height:2px;
  background:var(--laser);border-radius:2px;box-shadow:0 0 8px var(--laser-glow);
}
.nav-actions{display:flex;align-items:center;gap:var(--s-3);flex:none}
.nav-tel{
  display:inline-flex;align-items:center;gap:8px;font-family:var(--f-mono);
  font-size:.82rem;color:var(--fg-2);padding:8px 10px;border-radius:var(--r-md);
  transition:color var(--t-fast) var(--ease-io);
}
.nav-tel:hover{color:var(--fg)}
.nav-tel svg{width:15px;height:15px;color:var(--laser-lit)}

.nav-toggle{
  display:none;width:44px;height:44px;place-items:center;border-radius:var(--r-md);
  border:1px solid var(--line);color:var(--fg);
}
.nav-toggle svg{width:20px;height:20px}
.nav-toggle .icon-x{display:none}
.nav-toggle[aria-expanded="true"] .icon-menu{display:none}
.nav-toggle[aria-expanded="true"] .icon-x{display:block}

@media (max-width:1140px){
  .nav a{padding:9px 9px;font-size:.82rem}
  .nav-tel span{display:none}
}
@media (max-width:1000px){
  .nav,.nav-tel,.nav-actions .btn{display:none}
  .nav-toggle{display:grid}
}

/* Mobile drawer */
.mobile-nav{
  position:fixed;inset:var(--header-h) 0 0;z-index:var(--z-overlay);
  background:var(--ink-950);border-top:1px solid var(--line);
  padding:var(--s-5) var(--gutter) calc(var(--s-8) + env(safe-area-inset-bottom));
  overflow-y:auto;overscroll-behavior:contain;
  display:flex;flex-direction:column;
  opacity:0;visibility:hidden;transform:translateY(-8px);
  transition:opacity var(--t-med) var(--ease-io),transform var(--t-med) var(--ease-io),visibility var(--t-med);
}
.mobile-nav[data-open="true"]{opacity:1;visibility:visible;transform:none}
.mobile-nav a.mnav-link{
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 4px;min-height:56px;font-size:1.05rem;font-weight:500;color:var(--fg);
  border-bottom:1px solid var(--line-soft);
}
.mobile-nav a.mnav-link svg{width:16px;height:16px;color:var(--fg-4)}
.mobile-nav a.mnav-link[aria-current="page"]{color:var(--laser-lit)}
.mobile-nav a.mnav-link[aria-current="page"] svg{color:var(--laser-lit)}
.mobile-nav .btn{margin-top:var(--s-5);justify-content:center}
.footer-contact strong{overflow-wrap:anywhere}
.mobile-nav-meta{margin-top:var(--s-5);padding-top:var(--s-5);border-top:1px solid var(--line-soft);display:flex;flex-direction:column;gap:var(--s-3)}
.mobile-nav-meta a{display:flex;align-items:center;gap:10px;font-size:.9rem;color:var(--fg-2);min-height:44px}
.mobile-nav-meta svg{width:16px;height:16px;color:var(--laser-lit);flex:none}
body[data-nav-open="true"]{overflow:hidden}

/* --------------------------------------------------------------------------
   6. BUTTONS
   -------------------------------------------------------------------------- */
.btn{
  position:relative;display:inline-flex;align-items:center;justify-content:center;gap:9px;
  min-height:46px;padding:12px 22px;border-radius:var(--r-md);
  font-family:var(--f-display);font-weight:600;font-stretch:106%;
  font-size:.9rem;letter-spacing:.02em;white-space:nowrap;cursor:pointer;max-width:100%;
  border:1px solid transparent;
  transition:transform var(--t-fast) var(--ease-io),background var(--t-fast) var(--ease-io),
             border-color var(--t-fast) var(--ease-io),box-shadow var(--t-med) var(--ease-io),color var(--t-fast) var(--ease-io);
}
.btn svg{width:17px;height:17px;flex:none;transition:transform var(--t-med) var(--ease)}
.btn:active{transform:translateY(1px)}

.btn--primary{background:var(--laser);color:#fff;box-shadow:0 4px 20px -6px var(--laser-glow)}
.btn--primary:hover{background:#F02831;box-shadow:0 6px 30px -6px var(--laser-glow),0 0 0 1px rgba(255,90,90,.4)}
.btn--primary:hover svg{transform:translateX(3px)}

.btn--ghost{border-color:var(--line-hard);color:var(--fg);background:rgba(255,255,255,.02)}
.btn--ghost:hover{border-color:var(--fg-4);background:rgba(255,255,255,.06)}
.btn--ghost:hover svg{transform:translateX(3px)}

.btn--quiet{color:var(--fg-2);padding-inline:6px;min-height:40px}
.btn--quiet:hover{color:var(--laser-lit)}
.btn--quiet:hover svg{transform:translateX(3px)}

.btn--lg{min-height:54px;padding:16px 30px;font-size:1rem}
.btn--block{display:flex;width:100%}
.btn[disabled],.btn[aria-disabled="true"]{opacity:.45;pointer-events:none;cursor:not-allowed}
.btn[data-loading="true"]{pointer-events:none;color:transparent}
.btn[data-loading="true"]::after{
  content:"";position:absolute;inset:0;margin:auto;width:18px;height:18px;
  border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;
  animation:spin .7s linear infinite;
}
@keyframes spin{to{transform:rotate(360deg)}}
@media (max-width:620px){
  .btn{white-space:normal;text-align:center;line-height:1.3}
}

/* Inline text link */
.link{
  color:var(--laser-lit);font-weight:500;
  border-bottom:1px solid rgba(255,74,74,.3);
  transition:border-color var(--t-fast) var(--ease-io);
}
.link:hover{border-bottom-color:var(--laser-lit)}

/* --------------------------------------------------------------------------
   7. CARDS & SURFACES
   -------------------------------------------------------------------------- */
.card{
  position:relative;background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r-lg);padding:var(--s-5);
  transition:border-color var(--t-med) var(--ease-io),background var(--t-med) var(--ease-io),transform var(--t-med) var(--ease);
}
.card--pad{padding:clamp(24px,3vw,36px)}
.card--flush{padding:0;overflow:hidden}
.card--plain{background:transparent}

/* HUD corner brackets — motif lifted from the brand collateral */
.card--hud::before,.card--hud::after{
  content:"";position:absolute;width:14px;height:14px;pointer-events:none;
  transition:border-color var(--t-med) var(--ease-io);
}
.card--hud::before{top:-1px;left:-1px;border-top:2px solid var(--line-hard);border-left:2px solid var(--line-hard);border-top-left-radius:var(--r-lg)}
.card--hud::after{bottom:-1px;right:-1px;border-bottom:2px solid var(--line-hard);border-right:2px solid var(--line-hard);border-bottom-right-radius:var(--r-lg)}
.card--hud:hover::before,.card--hud:hover::after{border-color:var(--laser)}

a.card,.card--link{display:block}
a.card:hover,.card--link:hover{border-color:var(--line-hard);background:var(--surface-2);transform:translateY(-3px)}
a.card:hover .card-title,.card--link:hover .card-title{color:var(--laser-lit)}

.card-icon{
  width:44px;height:44px;display:grid;place-items:center;flex:none;
  border-radius:var(--r-md);border:1px solid var(--line);
  background:linear-gradient(150deg,rgba(224,27,36,.14),rgba(224,27,36,.02));
  color:var(--laser-lit);margin-bottom:var(--s-4);
  transition:border-color var(--t-med) var(--ease-io),box-shadow var(--t-med) var(--ease-io);
}
.card-icon svg{width:21px;height:21px}
a.card:hover .card-icon{border-color:rgba(224,27,36,.5);box-shadow:0 0 22px -6px var(--laser-glow)}
.card-title{
  margin-bottom:var(--s-2);font-size:1.075rem;line-height:1.25;
  font-stretch:106%;letter-spacing:-.005em;
  transition:color var(--t-fast) var(--ease-io);
}
.card p{font-size:.925rem}
.card-meta{
  margin-top:var(--s-4);padding-top:var(--s-4);border-top:1px solid var(--line-soft);
  font-family:var(--f-mono);font-size:.72rem;letter-spacing:.08em;
  text-transform:uppercase;color:var(--fg-3);line-height:1.6;
}
.card-more{
  display:inline-flex;align-items:center;gap:7px;margin-top:var(--s-4);
  font-family:var(--f-display);font-weight:600;font-size:.85rem;color:var(--laser-lit);
}
.card-more svg{width:15px;height:15px;transition:transform var(--t-med) var(--ease)}
a.card:hover .card-more svg{transform:translateX(4px)}

/* Numbered step card */
.step{position:relative;padding-top:var(--s-6)}
.step-num{
  position:absolute;top:0;left:0;
  font-family:var(--f-display);font-weight:800;font-stretch:125%;
  font-size:2.6rem;line-height:1;color:transparent;
  -webkit-text-stroke:1px #454C5A;
  transition:-webkit-text-stroke-color var(--t-med) var(--ease-io);
}
.step:hover .step-num{-webkit-text-stroke-color:var(--laser)}
.step h3{margin-bottom:var(--s-2)}

/* Spec / feature list with laser ticks */
.ticks li{
  position:relative;padding-left:26px;margin-bottom:11px;font-size:.925rem;line-height:1.6;
}
.ticks li:last-child{margin-bottom:0}
.ticks li::before{
  content:"";position:absolute;left:0;top:.62em;width:12px;height:1px;
  background:var(--laser);box-shadow:0 0 5px var(--laser-glow);
}
.ticks--check li{padding-left:30px}
.ticks--check li::before{
  content:"";left:3px;top:.42em;width:9px;height:5px;background:none;box-shadow:none;
  border-left:1.5px solid var(--laser-lit);border-bottom:1.5px solid var(--laser-lit);
  transform:rotate(-45deg);
}
.ticks li strong{display:block}

/* Chip / tag */
.chip{
  display:inline-flex;align-items:center;gap:7px;
  padding:6px 12px;border-radius:100px;border:1px solid var(--line);
  background:rgba(255,255,255,.025);
  font-family:var(--f-mono);font-size:.72rem;letter-spacing:.07em;
  text-transform:uppercase;color:var(--fg-2);white-space:nowrap;
}
.chip svg{width:13px;height:13px;color:var(--laser-lit)}
.chip--laser{border-color:rgba(224,27,36,.35);color:var(--laser-lit);background:rgba(224,27,36,.07)}
a.chip{transition:border-color var(--t-fast) var(--ease-io),color var(--t-fast) var(--ease-io)}
a.chip:hover{border-color:var(--laser);color:var(--fg)}

/* Stat block */
.stat{border-left:2px solid var(--laser);padding-left:var(--s-4)}
.stat-n{
  display:block;font-family:var(--f-display);font-weight:700;font-stretch:118%;
  font-size:clamp(1.9rem,1.4rem + 1.9vw,2.7rem);line-height:1;color:var(--fg);
  font-variant-numeric:tabular-nums;margin-bottom:6px;
}
.stat-l{font-size:.83rem;color:var(--fg-3);line-height:1.45}

/* --------------------------------------------------------------------------
   8. HERO
   -------------------------------------------------------------------------- */
.hero{
  position:relative;isolation:isolate;overflow:hidden;
  padding-block:clamp(56px,9vw,120px) clamp(52px,7vw,96px);
  border-bottom:1px solid var(--line-soft);
}
.hero-bg{position:absolute;inset:0;z-index:-2;overflow:hidden;pointer-events:none}
.hero-bg::before{
  content:"";position:absolute;inset:-10% -5%;
  background-image:
    linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px),
    radial-gradient(circle,rgba(224,27,36,.35) 1px,transparent 1.6px);
  background-size:72px 72px,72px 72px,72px 72px;
  background-position:0 0,0 0,36px 36px;
  transform:skewY(-4deg);
  mask-image:radial-gradient(ellipse 70% 90% at 78% 45%,#000 10%,transparent 72%);
  -webkit-mask-image:radial-gradient(ellipse 70% 90% at 78% 45%,#000 10%,transparent 72%);
}
.hero-bg::after{
  content:"";position:absolute;inset:0;
  background:
    radial-gradient(ellipse 55% 60% at 76% 52%,rgba(224,27,36,.13),transparent 68%),
    linear-gradient(180deg,rgba(5,5,6,.5),transparent 30%,rgba(5,5,6,.6) 84%,var(--ink-950));
}
.hero-inner{position:relative;display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);gap:clamp(32px,4vw,64px);align-items:center}
.hero h1{font-size:clamp(2.3rem,1.5rem + 2.9vw,3.55rem);margin-bottom:var(--s-5)}
.hero h1 em{font-style:normal;color:var(--laser-lit);text-shadow:0 0 34px var(--laser-glow)}
.hero .lead{max-width:56ch;margin-bottom:var(--s-6)}
.hero-cta{display:flex;flex-wrap:wrap;gap:var(--s-3);margin-bottom:var(--s-6)}
.hero-proof{display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-5);padding-top:var(--s-5);border-top:1px solid var(--line)}
.hero-proof span{display:inline-flex;align-items:center;gap:8px;font-size:.8rem;color:var(--fg-3)}
.hero-proof svg{width:15px;height:15px;color:var(--laser-lit);flex:none}

.hero-visual{position:relative;border-radius:var(--r-xl);overflow:hidden;border:1px solid var(--line);box-shadow:var(--e-3)}
.hero-visual img{width:100%;height:auto;display:block}
.hero-visual::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  box-shadow:inset 0 0 90px rgba(0,0,0,.55);border-radius:inherit;
}
@media (max-width:1000px){
  .hero-inner{grid-template-columns:1fr;gap:var(--s-7)}
  .hero-visual{order:-1}
  .hero-bg img{object-position:center}
}

/* Interior page header band */
.pagehead{
  position:relative;isolation:isolate;overflow:hidden;
  padding-block:clamp(44px,6.5vw,84px);
  border-bottom:1px solid var(--line);
}
.pagehead-bg{position:absolute;inset:0;z-index:-2;overflow:hidden;pointer-events:none}
.pagehead-bg::before{
  content:"";position:absolute;inset:-20% -5%;
  background-image:
    linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px),
    radial-gradient(circle,rgba(224,27,36,.4) 1px,transparent 1.6px);
  background-size:64px 64px,64px 64px,64px 64px;
  background-position:0 0,0 0,32px 32px;
  transform:skewY(-4deg);
  mask-image:linear-gradient(90deg,transparent,rgba(0,0,0,.5) 45%,#000);
  -webkit-mask-image:linear-gradient(90deg,transparent,rgba(0,0,0,.5) 45%,#000);
}
/* Laser rule sweeping in from the right edge of the band */
.pagehead-bg::after{
  content:"";position:absolute;right:0;top:62%;width:62%;height:1px;
  background:linear-gradient(90deg,transparent,var(--laser-deep) 45%,var(--laser));
  box-shadow:0 0 22px 3px rgba(224,27,36,.28);
}
.pagehead h1{font-size:clamp(2.05rem,1.4rem + 2.8vw,3.5rem);margin-bottom:var(--s-4)}
.pagehead .lead{max-width:62ch}
.pagehead-inner{max-width:840px}

/* Breadcrumbs */
.crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:var(--s-4);font-size:.75rem;font-family:var(--f-mono);letter-spacing:.06em}
.crumbs a{color:var(--fg-3);transition:color var(--t-fast) var(--ease-io)}
.crumbs a:hover{color:var(--laser-lit)}
.crumbs [aria-current]{color:var(--fg-2)}
.crumbs svg{width:12px;height:12px;color:var(--fg-4)}

/* --------------------------------------------------------------------------
   9. STANDARDS STRIP
   -------------------------------------------------------------------------- */
.standards{border-block:1px solid var(--line-soft);background:var(--ink-900);padding-block:var(--s-5)}
.standards-inner{display:flex;align-items:center;gap:var(--s-5) var(--s-6);flex-wrap:wrap;justify-content:center}
.standards-label{
  font-family:var(--f-mono);font-size:.7rem;letter-spacing:.2em;
  text-transform:uppercase;color:var(--fg-3);white-space:nowrap;
}
.standards-list{display:flex;flex-wrap:wrap;gap:var(--s-3) var(--s-6);justify-content:center}
.standards-list li{
  font-family:var(--f-display);font-weight:600;font-stretch:112%;font-size:.88rem;
  letter-spacing:.08em;color:var(--fg-2);white-space:nowrap;
  display:flex;align-items:center;gap:10px;
}
.standards-list li::before{content:"";width:4px;height:4px;border-radius:50%;background:var(--laser);flex:none;box-shadow:0 0 6px var(--laser-glow)}

/* --------------------------------------------------------------------------
   10. TABLES — spec / code reference
   -------------------------------------------------------------------------- */
.table-scroll{
  overflow-x:auto;border:1px solid var(--line);border-radius:var(--r-lg);
  background:var(--surface);-webkit-overflow-scrolling:touch;
}
.table-scroll table{min-width:660px}
.table-scroll--compact table{min-width:430px}
.table-scroll--compact .t-spec td,.table-scroll--compact .t-spec th{white-space:nowrap}
.t-spec{font-size:.875rem}
.t-spec caption{
  text-align:left;padding:var(--s-4) var(--s-5);border-bottom:1px solid var(--line);
  font-family:var(--f-mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--fg-3);
}
.t-spec th{
  text-align:left;padding:13px var(--s-4);
  font-family:var(--f-mono);font-size:.7rem;font-weight:500;letter-spacing:.12em;
  text-transform:uppercase;color:var(--fg-3);
  background:var(--ink-800);border-bottom:1px solid var(--line);
  white-space:nowrap;
}
.t-spec td{padding:14px var(--s-4);border-bottom:1px solid var(--line-soft);vertical-align:top;line-height:1.55}
.t-spec tbody tr:last-child td{border-bottom:0}
.t-spec tbody tr{transition:background var(--t-fast) var(--ease-io)}
.t-spec tbody tr:hover{background:rgba(255,255,255,.022)}
.t-spec td:first-child{color:var(--fg);font-weight:500}
.t-spec .code{font-family:var(--f-mono);font-size:.8rem;color:var(--laser-lit);white-space:nowrap;font-variant-numeric:tabular-nums}
.t-spec .num{font-family:var(--f-mono);font-variant-numeric:tabular-nums;white-space:nowrap}
.table-note{margin-top:var(--s-3);font-size:.78rem;color:var(--fg-3)}

/* Durability meter */
.meter{display:flex;gap:3px;align-items:center}
.meter i{width:9px;height:16px;border-radius:1px;background:var(--ink-600);display:block}
.meter i.on{background:var(--laser);box-shadow:0 0 7px -1px var(--laser-glow)}
.meter-label{margin-left:9px;font-family:var(--f-mono);font-size:.72rem;color:var(--fg-3);white-space:nowrap}

/* --------------------------------------------------------------------------
   11. ANSI SIGNAL WORD LADDER + ASME PIPE SWATCHES
   -------------------------------------------------------------------------- */
.signals{display:grid;gap:var(--s-3)}
.signal{
  display:grid;grid-template-columns:200px minmax(0,1fr);
  border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;background:var(--surface);
  transition:border-color var(--t-med) var(--ease-io),transform var(--t-med) var(--ease);
}
.signal:hover{border-color:var(--line-hard);transform:translateX(3px)}
.signal-word{
  display:flex;align-items:center;gap:11px;padding:16px var(--s-4);
  font-family:var(--f-display);font-weight:800;font-stretch:118%;
  font-size:1.15rem;letter-spacing:.06em;
}
.signal-word svg{width:24px;height:24px;flex:none}
.signal-body{padding:16px var(--s-5);font-size:.9rem}
.signal-label{display:block;margin-bottom:3px;color:var(--fg);font-weight:600;
  font-family:var(--f-display);font-stretch:106%}
.sig-danger  .signal-word{background:var(--sig-danger);color:#fff}
.sig-warning .signal-word{background:var(--sig-warning);color:#000}
.sig-caution .signal-word{background:var(--sig-caution);color:#000}
.sig-notice  .signal-word{background:var(--sig-notice);color:#fff}
.sig-safety  .signal-word{background:var(--sig-safety);color:#fff}
@media (max-width:620px){.signal{grid-template-columns:1fr}}

.pipe-swatch{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:122px;padding:7px 13px;border-radius:var(--r-sm);
  font-family:var(--f-display);font-weight:700;font-stretch:112%;
  font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;
  border:1px solid rgba(255,255,255,.16);white-space:nowrap;
}

/* --------------------------------------------------------------------------
   12. PLATE — engraved-label preview component
   -------------------------------------------------------------------------- */
.plate{
  position:relative;border-radius:var(--r-md);overflow:hidden;
  background:linear-gradient(115deg,#2A2E35 0%,#3D434C 22%,#2C3037 46%,#454B55 68%,#2A2E35 100%);
  border:1px solid #565C67;
  box-shadow:var(--e-2),inset 0 1px 0 rgba(255,255,255,.14),inset 0 -1px 0 rgba(0,0,0,.5);
  padding:var(--s-5);
}
.plate::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.35;
  background:repeating-linear-gradient(97deg,rgba(255,255,255,.045) 0 1px,transparent 1px 3px);
}
.plate > *{position:relative}
.plate-head{
  display:flex;align-items:center;justify-content:space-between;gap:var(--s-4);
  padding-bottom:11px;margin-bottom:13px;border-bottom:1px solid rgba(255,255,255,.2);
}
.plate-title{
  font-family:var(--f-display);font-weight:800;font-stretch:118%;font-size:1.02rem;
  letter-spacing:.1em;color:#F2F3F5;text-transform:uppercase;line-height:1.1;
}
.plate-sub{font-family:var(--f-mono);font-size:.64rem;letter-spacing:.14em;color:#9AA1AB;text-transform:uppercase}
.plate-rows{display:grid;gap:9px}
.plate-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--s-4);align-items:baseline}
.plate-k{font-family:var(--f-mono);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:#A8AEB8;line-height:1.4}
.plate-v{font-family:var(--f-mono);font-size:.82rem;font-weight:500;color:#fff;font-variant-numeric:tabular-nums;text-align:right;line-height:1.4}
.plate-foot{margin-top:13px;padding-top:11px;border-top:1px solid rgba(255,255,255,.2);display:flex;justify-content:space-between;gap:var(--s-3);align-items:center}
.plate-band{
  display:flex;align-items:center;gap:9px;margin:-24px -24px 16px;padding:10px 24px;
  background:var(--sig-danger);color:#fff;
  font-family:var(--f-display);font-weight:800;font-stretch:118%;font-size:1.05rem;letter-spacing:.12em;
}
.plate-band svg{width:22px;height:22px;flex:none}

/* Annotated callouts */
.anno{counter-reset:anno}
.anno li{position:relative;padding-left:38px;margin-bottom:var(--s-4);font-size:.875rem;line-height:1.55;counter-increment:anno}
.anno li:last-child{margin-bottom:0}
.anno li::before{
  content:counter(anno,decimal-leading-zero);
  position:absolute;left:0;top:0;
  width:26px;height:26px;display:grid;place-items:center;border-radius:var(--r-sm);
  border:1px solid rgba(224,27,36,.4);background:rgba(224,27,36,.1);
  font-family:var(--f-mono);font-size:.66rem;color:var(--laser-lit);
}
.anno li strong{display:block;color:var(--fg);margin-bottom:2px}

/* --------------------------------------------------------------------------
   13. ACCORDION
   -------------------------------------------------------------------------- */
.acc{border-top:1px solid var(--line)}
.acc-item{border-bottom:1px solid var(--line)}
.acc-btn{
  width:100%;display:flex;align-items:flex-start;justify-content:space-between;gap:var(--s-4);
  padding:22px 4px;min-height:56px;text-align:left;
  font-family:var(--f-display);font-weight:600;font-stretch:106%;font-size:1.03rem;
  color:var(--fg);line-height:1.35;transition:color var(--t-fast) var(--ease-io);
}
.acc-btn:hover{color:var(--laser-lit)}
.acc-btn svg{width:19px;height:19px;flex:none;color:var(--fg-3);margin-top:3px;transition:transform var(--t-med) var(--ease),color var(--t-fast) var(--ease-io)}
.acc-btn[aria-expanded="true"] svg{transform:rotate(180deg);color:var(--laser-lit)}
.acc-panel{overflow:hidden;height:0;transition:height var(--t-med) var(--ease-io)}
.acc-panel-inner{padding:0 var(--s-8) 24px 4px;font-size:.94rem}
.acc-panel-inner p + p{margin-top:.85em}
.acc-panel-inner ul{margin-top:.7em}
@media (max-width:620px){.acc-panel-inner{padding-right:var(--s-4)}}

/* --------------------------------------------------------------------------
   14. FORMS
   -------------------------------------------------------------------------- */
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-4) var(--s-5)}
.field{display:flex;flex-direction:column;gap:7px;min-width:0}
.field--full{grid-column:1/-1}
@media (max-width:680px){.form-grid{grid-template-columns:1fr}}

.field label,.fieldset-legend{
  font-family:var(--f-display);font-weight:600;font-stretch:104%;
  font-size:.82rem;letter-spacing:.03em;color:var(--fg);
}
.req{color:var(--laser-lit);margin-left:3px}
.hint{font-size:.78rem;color:var(--fg-3);line-height:1.5}

.field input,.field select,.field textarea{
  width:100%;min-height:48px;padding:12px 14px;
  background:var(--ink-900);border:1px solid var(--line);border-radius:var(--r-md);
  color:var(--fg);font-size:16px;line-height:1.4;
  transition:border-color var(--t-fast) var(--ease-io),background var(--t-fast) var(--ease-io),box-shadow var(--t-fast) var(--ease-io);
}
.field textarea{min-height:130px;resize:vertical;padding-top:13px;font-family:inherit}
.field input::placeholder,.field textarea::placeholder{color:var(--fg-3)}
.field input:hover,.field select:hover,.field textarea:hover{border-color:var(--line-hard)}
.field input:focus,.field select:focus,.field textarea:focus{
  outline:0;border-color:var(--laser);background:var(--ink-850);
  box-shadow:0 0 0 3px rgba(224,27,36,.16);
}
.field select{
  appearance:none;cursor:pointer;padding-right:42px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23858B99' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center;background-size:17px;
}
.field[data-invalid="true"] input,.field[data-invalid="true"] select,.field[data-invalid="true"] textarea{
  border-color:#FF5A5A;background:rgba(224,27,36,.05);
}
.field-error{display:none;align-items:center;gap:6px;font-size:.8rem;color:#FF6B6B;font-weight:500}
.field-error svg{width:14px;height:14px;flex:none}
.field[data-invalid="true"] .field-error{display:flex}

/* Checkbox / radio groups */
.fieldset{border:1px solid var(--line);border-radius:var(--r-lg);padding:var(--s-5);background:rgba(255,255,255,.014)}
.fieldset-legend{display:block;padding:0;margin-bottom:var(--s-2);float:left;width:100%}
.check-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:10px;margin-top:var(--s-4);clear:both}
.check{
  display:flex;align-items:flex-start;gap:11px;padding:13px 14px;min-height:48px;
  border:1px solid var(--line);border-radius:var(--r-md);cursor:pointer;
  background:var(--ink-900);font-size:.885rem;line-height:1.4;
  transition:border-color var(--t-fast) var(--ease-io),background var(--t-fast) var(--ease-io);
}
.check:hover{border-color:var(--line-hard);background:var(--ink-850)}
.check input{
  appearance:none;width:18px;height:18px;flex:none;margin-top:1px;
  border:1.5px solid var(--line-hard);border-radius:3px;background:var(--ink-950);cursor:pointer;
  transition:border-color var(--t-fast) var(--ease-io),background var(--t-fast) var(--ease-io);
}
.check input[type="radio"]{border-radius:50%}
.check input:checked{background-color:var(--laser);border-color:var(--laser)}
.check input[type="checkbox"]:checked{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
  background-size:12px;background-position:center;background-repeat:no-repeat;
}
.check input[type="radio"]:checked{box-shadow:inset 0 0 0 3px var(--ink-950)}
.check:has(input:checked){border-color:rgba(224,27,36,.55);background:rgba(224,27,36,.07)}
.check input:focus-visible{outline:2px solid var(--focus);outline-offset:2px}

/* File drop */
.drop{
  position:relative;display:flex;flex-direction:column;align-items:center;gap:10px;
  padding:var(--s-6) var(--s-5);text-align:center;cursor:pointer;
  border:1.5px dashed var(--line-hard);border-radius:var(--r-lg);background:var(--ink-900);
  transition:border-color var(--t-fast) var(--ease-io),background var(--t-fast) var(--ease-io);
}
.drop:hover,.drop[data-drag="true"]{border-color:var(--laser);background:rgba(224,27,36,.05)}
.drop input[type="file"]{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}
.drop > svg{width:26px;height:26px;color:var(--laser-lit)}
.drop-title{font-family:var(--f-display);font-weight:600;font-size:.94rem;color:var(--fg)}
.drop-files{margin-top:var(--s-3);display:flex;flex-direction:column;gap:6px;width:100%}
.drop-files li{
  display:flex;align-items:center;gap:9px;padding:9px 12px;border-radius:var(--r-sm);
  background:var(--ink-800);border:1px solid var(--line);
  font-family:var(--f-mono);font-size:.76rem;color:var(--fg-2);text-align:left;
}
.drop-files svg{width:14px;height:14px;color:var(--fg-3);flex:none}
.drop-files .fname{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0}

/* Form status */
.form-status{
  display:none;align-items:flex-start;gap:12px;padding:var(--s-4) var(--s-5);
  border-radius:var(--r-md);border:1px solid;font-size:.9rem;margin-bottom:var(--s-5);
}
.form-status[data-show="true"]{display:flex}
.form-status svg{width:20px;height:20px;flex:none;margin-top:1px}
.form-status--err{border-color:rgba(255,90,90,.5);background:rgba(224,27,36,.08);color:#FF9B9B}
.form-status--err strong{color:#FFC0C0}

.form-success{
  display:none;text-align:center;padding:clamp(48px,7vw,88px) var(--s-5);
  border:1px solid rgba(0,132,61,.4);border-radius:var(--r-xl);background:rgba(0,132,61,.055);
}
.form-success[data-show="true"]{display:block}
.form-success .tick{
  width:62px;height:62px;margin:0 auto var(--s-5);border-radius:50%;
  display:grid;place-items:center;background:rgba(0,132,61,.18);border:1px solid rgba(0,132,61,.5);
}
.form-success .tick svg{width:30px;height:30px;color:#4ADE80}
.form-success h2{margin-bottom:var(--s-4)}
.form-success p{max-width:52ch;margin-inline:auto}

/* --------------------------------------------------------------------------
   15. CTA BAND
   -------------------------------------------------------------------------- */
.cta-band{position:relative;isolation:isolate;overflow:hidden;border-block:1px solid var(--line);background:var(--ink-900)}
.cta-band::before{
  content:"";position:absolute;inset:0;z-index:-2;
  background-image:
    linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px),
    radial-gradient(circle,rgba(224,27,36,.5) 1px,transparent 1.4px);
  background-size:56px 56px,56px 56px,56px 56px;
  background-position:0 0,0 0,28px 28px;
  opacity:.5;
}
.cta-band::after{
  content:"";position:absolute;inset:0;z-index:-1;
  background:radial-gradient(ellipse 70% 100% at 50% 100%,rgba(224,27,36,.16),transparent 68%);
}
.cta-band .wrap{padding-block:clamp(56px,7vw,92px);text-align:center}
.cta-band h2{margin-bottom:var(--s-4);max-width:19ch;margin-inline:auto}
.cta-band .lead{max-width:58ch;margin:0 auto var(--s-6)}
.cta-band .row{justify-content:center}
.cta-meta{margin-top:var(--s-5);font-family:var(--f-mono);font-size:.74rem;letter-spacing:.08em;text-transform:uppercase;color:var(--fg-3)}

/* --------------------------------------------------------------------------
   16. FOOTER
   -------------------------------------------------------------------------- */
.site-footer{background:var(--ink-950);border-top:1px solid var(--line);padding-top:clamp(48px,6vw,80px)}
.footer-top{display:grid;grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr));gap:var(--s-7) var(--s-5);padding-bottom:var(--s-7)}
.footer-brand .logo{margin-left:-4px;margin-bottom:var(--s-4)}
.footer-brand p{font-size:.875rem;max-width:38ch;margin-bottom:var(--s-5)}
.footer-contact{display:flex;flex-direction:column;gap:11px}
/* Direct children only — nested spans hold wrapped label/description text
   and must NOT become flex containers. */
.footer-contact > a,.footer-contact > span{display:flex;align-items:flex-start;gap:10px;font-size:.875rem;color:var(--fg-2);transition:color var(--t-fast) var(--ease-io)}
.footer-contact > a > span,.footer-contact > span > span{min-width:0;line-height:1.45}
.footer-contact a:hover{color:var(--laser-lit)}
.footer-contact svg{width:16px;height:16px;color:var(--fg-4);flex:none;margin-top:3px}
.footer-col-title{
  font-family:var(--f-mono);font-size:.7rem;font-weight:500;letter-spacing:.16em;
  text-transform:uppercase;color:var(--fg-3);margin-bottom:var(--s-4);
  font-stretch:100%;line-height:1.4;
}
.footer-col li{margin-bottom:10px}
.footer-col a{font-size:.875rem;color:var(--fg-2);transition:color var(--t-fast) var(--ease-io)}
.footer-col a:hover{color:var(--laser-lit)}
.footer-bottom{
  display:flex;flex-wrap:wrap;gap:var(--s-3) var(--s-5);align-items:center;justify-content:space-between;
  padding-block:var(--s-5);border-top:1px solid var(--line-soft);
  font-size:.78rem;color:var(--fg-3);
}
.footer-bottom p{max-width:78ch;line-height:1.6}
.footer-legal{display:flex;gap:var(--s-4);flex-wrap:wrap}
.footer-legal a:hover{color:var(--fg-2)}
@media (max-width:900px){.footer-top{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.footer-top{grid-template-columns:1fr;gap:var(--s-6)}}

/* --------------------------------------------------------------------------
   17. MISC
   -------------------------------------------------------------------------- */
.callout{
  display:flex;gap:var(--s-4);padding:var(--s-5);border-radius:var(--r-lg);
  border:1px solid var(--line);border-left:2px solid var(--laser);
  background:linear-gradient(90deg,rgba(224,27,36,.06),transparent 45%);
}
.callout svg{width:20px;height:20px;color:var(--laser-lit);flex:none;margin-top:3px}
.callout strong{display:block;margin-bottom:4px;font-family:var(--f-display);font-stretch:106%}
.callout p{font-size:.9rem}

.media{border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line);background:var(--ink-900)}
.media img{width:100%;height:auto;display:block}
.media--poster img{aspect-ratio:4/5;object-fit:cover;object-position:top center}
.media--panel img{aspect-ratio:3/2;object-fit:cover}

.sticky-side{position:sticky;top:calc(var(--header-h) + 24px)}
@media (max-width:960px){.sticky-side{position:static}}

.county-map{width:100%;height:auto}
.county-map .land{fill:var(--ink-800);stroke:var(--line-hard);stroke-width:1.4;stroke-linejoin:round}
.county-map .core{fill:rgba(224,27,36,.2);stroke:var(--laser);stroke-width:1.6}
.county-map .beam{stroke:var(--laser);stroke-width:1.6;opacity:.85}
.county-map .pin{fill:var(--laser-lit)}
.county-map text{font-family:var(--f-mono);font-size:8px;fill:var(--fg-3);letter-spacing:.1em}

/* --------------------------------------------------------------------------
   18. SCROLL REVEAL
   -------------------------------------------------------------------------- */
/* Opt-IN, not opt-out: elements only hide once JS has confirmed it can
   bring them back. No JS, old browser, or a thrown error = content visible. */
.reveal-ready [data-reveal]{
  opacity:0;transform:translateY(18px);
  transition:opacity 560ms var(--ease),transform 560ms var(--ease);
  transition-delay:var(--d,0ms);
}
.reveal-ready [data-reveal].in{opacity:1;transform:none}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;animation-iteration-count:1 !important;
    transition-duration:.01ms !important;scroll-behavior:auto !important;
  }
  .reveal-ready [data-reveal]{opacity:1;transform:none}
}

/* --------------------------------------------------------------------------
   19. PRINT
   -------------------------------------------------------------------------- */
@media print{
  .site-header,.mobile-nav,.cta-band,.hero-bg,.pagehead-bg,.btn,.skip-link{display:none !important}
  body{background:#fff;color:#111}
  h1,h2,h3,h4{color:#000}
  .card,.table-scroll{border-color:#bbb;background:#fff}
  a[href^="http"]::after{content:" (" attr(href) ")";font-size:.8em;color:#555}
}