/* ============================================================
   MID ATLANTIC LINEMAN TRAINING CENTER
   Design system · rugged high-voltage industrial
   Saira Condensed (display) · Barlow (body) · JetBrains Mono (technical)
   ============================================================ */

:root{
  /* ---- surfaces ---- */
  --ink:        #0A0C0F;   /* asphalt base */
  --ink-2:      #0E1218;
  --panel:      #12161D;   /* raised slate */
  --panel-2:    #171C25;
  --panel-3:    #1E2530;
  --line:       rgba(255,255,255,.09);
  --line-2:     rgba(255,255,255,.06);

  /* ---- brand ---- */
  --amber:      #FFB200;   /* hard-hat / hazard */
  --amber-2:    #FFC23D;
  --amber-deep: #E08A00;
  --arc:        #38E1FF;   /* live-wire cyan, used sparingly */
  --arc-deep:   #11B7DC;
  --danger:     #FF5A2C;

  /* ---- type ---- */
  --bone:       #EEF1F5;   /* headings on dark */
  --text:       #C2C9D2;   /* body on dark */
  --muted:      #8B97A6;   /* secondary */
  --faint:      #5B6573;   /* tertiary / hints */

  --font-display: "Saira Condensed", "Arial Narrow", sans-serif;
  --font-body:    "Barlow", system-ui, sans-serif;
  --font-mono:    "JetBrains Mono", ui-monospace, monospace;

  /* ---- layout ---- */
  --wrap: 1200px;
  --gutter: clamp(20px, 5vw, 56px);
  --radius: 4px;
  --radius-lg: 8px;

  --ease: cubic-bezier(.2,.7,.2,1);
  --shadow: 0 18px 50px -20px rgba(0,0,0,.7);
  --shadow-amber: 0 14px 40px -16px rgba(255,178,0,.32);
}

/* ============================================================ reset */
*,*::before,*::after{ box-sizing:border-box; }
*{ margin:0; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
@media (prefers-reduced-motion:reduce){ html{ scroll-behavior:auto; } }
body{
  font-family:var(--font-body);
  background:var(--ink);
  color:var(--text);
  line-height:1.6;
  font-size:17px;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  /* soft atmospheric glows (no grid) */
  background-image:
    radial-gradient(1200px 700px at 78% -8%, rgba(56,225,255,.06), transparent 60%),
    radial-gradient(1000px 800px at -5% 8%, rgba(255,178,0,.05), transparent 55%);
  background-attachment: fixed, fixed;
}
img,svg,video{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; cursor:pointer; }
ul{ list-style:none; padding:0; }
[hidden]{ display:none !important; }

/* ============================================================ type */
h1,h2,h3,h4,.display{
  font-family:var(--font-display);
  font-weight:700;
  color:var(--bone);
  line-height:.95;
  letter-spacing:.01em;
  text-transform:uppercase;
}
h1,.h1{ font-size:clamp(2.9rem, 7vw, 6rem); }
h2,.h2{ font-size:clamp(2.1rem, 4.6vw, 3.6rem); }
h3,.h3{ font-size:clamp(1.4rem, 2.4vw, 1.9rem); letter-spacing:.02em; }
p{ max-width:64ch; }
strong{ color:var(--bone); font-weight:600; }

.kicker{
  font-family:var(--font-mono);
  font-size:.74rem; font-weight:500;
  letter-spacing:.32em; text-transform:uppercase;
  color:var(--amber);
  display:inline-flex; align-items:center; gap:.7em;
}
.kicker::before{
  content:""; width:26px; height:2px; background:var(--amber);
  box-shadow:0 0 12px var(--amber);
}
.kicker.arc{ color:var(--arc); }
.kicker.arc::before{ background:var(--arc); box-shadow:0 0 12px var(--arc); }
.lead{ font-size:clamp(1.05rem,1.6vw,1.28rem); color:var(--text); max-width:60ch; }

/* ============================================================ layout */
.wrap{ width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:var(--gutter); }
.section{ padding:clamp(64px,9vw,128px) 0; position:relative; }
.section--tight{ padding:clamp(48px,6vw,80px) 0; }
.section-head{ max-width:62ch; margin-bottom:clamp(36px,5vw,60px); }
.section-head h2{ margin:.5rem 0 .9rem; }
.center{ text-align:center; margin-inline:auto; }
.center .kicker{ justify-content:center; }

/* hazard rule */
.hazard{
  height:8px; width:100%;
  background:repeating-linear-gradient(-45deg, var(--amber) 0 16px, var(--ink) 16px 32px);
  opacity:.9;
}
.rule{ height:1px; background:var(--line); border:0; }

/* ============================================================ buttons */
.btn{
  --bg:var(--amber); --fg:#0A0C0F;
  display:inline-flex; align-items:center; gap:.6em; line-height:1;
  font-family:var(--font-display); text-transform:uppercase;
  font-weight:600; font-size:1.05rem; letter-spacing:.06em;
  padding:.92em 1.6em; border-radius:var(--radius);
  background:var(--bg); color:var(--fg); border:2px solid var(--bg);
  transition:transform .18s var(--ease), box-shadow .25s var(--ease), background .2s;
  white-space:nowrap;
}
.btn svg{ width:1.05em; height:1.05em; }
.btn:hover{ transform:translateY(-2px); box-shadow:var(--shadow-amber); background:var(--amber-2); border-color:var(--amber-2); }
.btn:active{ transform:translateY(0); }
.btn--ghost{ --bg:transparent; --fg:var(--bone); border-color:var(--line); }
.btn--ghost:hover{ background:rgba(255,255,255,.04); border-color:var(--amber); color:var(--bone); box-shadow:none; transform:translateY(-2px); }
.btn--arc{ --bg:var(--arc); --fg:#04222A; }
.btn--arc:hover{ background:#5fe9ff; border-color:#5fe9ff; box-shadow:0 14px 40px -16px rgba(56,225,255,.4); }
.btn--lg{ font-size:1.18rem; padding:1.05em 2em; }
.btn-row{ display:flex; flex-wrap:wrap; gap:14px; align-items:center; }

.textlink{
  font-family:var(--font-mono); font-size:.82rem; letter-spacing:.12em; text-transform:uppercase;
  color:var(--amber); display:inline-flex; align-items:center; gap:.5em;
  border-bottom:1px solid transparent; padding-bottom:2px; transition:.2s;
}
.textlink svg{ width:1em; transition:transform .2s var(--ease); }
.textlink:hover{ color:var(--amber-2); border-color:var(--amber); }
.textlink:hover svg{ transform:translateX(4px); }

/* ============================================================ header */
.site-header{
  position:sticky; top:0; z-index:100;
  transition:background .3s var(--ease), border-color .3s;
  border-bottom:1px solid transparent;
}
.site-header.scrolled{
  background:rgba(8,10,13,.86);
  backdrop-filter:blur(14px) saturate(1.2);
  border-bottom-color:var(--line);
}
.nav{ display:flex; align-items:center; gap:28px; height:74px; }
.brand{ display:flex; align-items:center; gap:12px; margin-right:auto; }
.brand .mark{ width:48px; height:48px; color:var(--amber); flex:none; filter:drop-shadow(0 0 10px rgba(255,178,0,.35)); }
.brand .wordmark{ display:flex; flex-direction:column; line-height:1; }
.brand .wm-1{ font-family:var(--font-display); font-weight:700; text-transform:uppercase; font-size:1.18rem; letter-spacing:.04em; color:var(--bone); }
.brand .wm-2{ font-family:var(--font-mono); font-size:.56rem; letter-spacing:.34em; text-transform:uppercase; color:var(--amber); margin-top:3px; }
.nav-links{ display:flex; align-items:center; gap:22px; }
.nav-links a{
  font-family:var(--font-mono); font-size:.76rem; letter-spacing:.1em; text-transform:uppercase;
  color:var(--text); padding:10px 13px; border-radius:var(--radius); position:relative; transition:color .2s;
  display:inline-flex; align-items:center; line-height:1;
}
.nav-links a::after{
  content:""; position:absolute; left:13px; right:13px; bottom:6px; height:2px;
  background:var(--amber); transform:scaleX(0); transform-origin:left; transition:transform .25s var(--ease);
}
.nav-links a:hover{ color:var(--bone); }
.nav-links a:hover::after, .nav-links a[aria-current="page"]::after{ transform:scaleX(1); }
.nav-links a[aria-current="page"]{ color:var(--bone); }
.nav-cta{ display:flex; align-items:center; gap:14px; }
.nav-backdrop,.nav-close,.nav-drawer-cta{ display:none; }
.nav-phone{ font-family:var(--font-mono); font-size:.84rem; letter-spacing:.04em; color:var(--bone); display:inline-flex; align-items:center; gap:.5em; white-space:nowrap; flex:none; line-height:1; }
.nav-phone svg{ width:15px; color:var(--amber); }
.nav-toggle{ display:none; background:none; border:1px solid var(--line); border-radius:var(--radius); width:46px; height:42px; padding:0; position:relative; }
.nav-toggle span,.nav-toggle span::before,.nav-toggle span::after{
  content:""; position:absolute; left:11px; width:22px; height:2px; background:var(--bone); transition:.25s var(--ease);
}
.nav-toggle span{ top:20px; }
.nav-toggle span::before{ top:-7px; } .nav-toggle span::after{ top:7px; }
body.nav-open .nav-toggle span{ background:transparent; }
body.nav-open .nav-toggle span::before{ top:0; transform:rotate(45deg); }
body.nav-open .nav-toggle span::after{ top:0; transform:rotate(-45deg); }

/* ============================================================ hero */
.hero{ position:relative; min-height:calc(100svh - 74px); display:flex; align-items:flex-end; overflow:hidden; padding-bottom:clamp(48px,7vw,96px); }
.hero-bg{ position:absolute; inset:0; z-index:0; }
.hero-bg img{ width:100%; height:100%; object-fit:cover; object-position:50% 38%; filter:contrast(1.05) saturate(.92) brightness(.9); }
.hero-bg::after{
  content:""; position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(8,10,13,.72) 0%, rgba(8,10,13,.32) 38%, rgba(8,10,13,.86) 100%),
    linear-gradient(90deg, rgba(8,10,13,.92) 0%, rgba(8,10,13,.5) 46%, transparent 80%);
}
.hero-bg::before{ /* arc-cyan rim light top-right */
  content:""; position:absolute; inset:0; z-index:1;
  background:radial-gradient(900px 480px at 92% 0%, rgba(56,225,255,.16), transparent 60%);
  mix-blend-mode:screen;
}
.hero .wrap{ position:relative; z-index:2; width:100%; }
.hero h1{ margin:.7rem 0 1.1rem; max-width:16ch; }
.hero h1 .hl{ color:var(--amber); display:inline-block; position:relative; }
.hero h1 .hl::after{ content:""; position:absolute; left:0; right:0; bottom:.06em; height:4px; background:var(--arc); box-shadow:0 0 18px var(--arc); transform:scaleX(0); transform-origin:left; animation:hl-draw .7s var(--ease) .68s both; }
@keyframes hl-draw{ to{ transform:scaleX(1); } }
.hero .lead{ margin-bottom:2rem; }
.hero-meta{ display:flex; flex-wrap:wrap; gap:28px; margin-top:2.6rem; padding-top:1.6rem; border-top:1px solid var(--line); }
.hero-meta .item{ display:flex; flex-direction:column; gap:3px; }
.hero-meta .n{ font-family:var(--font-display); font-size:1.7rem; color:var(--bone); line-height:1; }
.hero-meta .l{ font-family:var(--font-mono); font-size:.66rem; letter-spacing:.2em; text-transform:uppercase; color:var(--muted); }
.scroll-cue{ position:absolute; left:50%; bottom:22px; transform:translateX(-50%); z-index:2; font-family:var(--font-mono); font-size:.6rem; letter-spacing:.3em; color:var(--muted); text-transform:uppercase; display:flex; flex-direction:column; align-items:center; gap:8px; }
.scroll-cue .bar{ width:1px; height:34px; background:linear-gradient(var(--amber),transparent); animation:cue 1.8s var(--ease) infinite; }
@keyframes cue{ 0%{transform:scaleY(0);transform-origin:top} 45%{transform:scaleY(1);transform-origin:top} 55%{transform:scaleY(1);transform-origin:bottom} 100%{transform:scaleY(0);transform-origin:bottom} }

/* ============================================================ marquee strip */
.strip{ background:var(--amber); color:#0A0C0F; overflow:hidden; border-block:1px solid #0A0C0F; }
.strip-track{ display:flex; gap:0; white-space:nowrap; animation:scroll 32s linear infinite; }
.strip:hover .strip-track{ animation-play-state:paused; }
.strip-item{ font-family:var(--font-display); text-transform:uppercase; font-weight:700; font-size:1.05rem; letter-spacing:.06em; padding:13px 0; display:inline-flex; align-items:center; }
.strip-item::after{ content:"／"; opacity:.4; margin:0 26px; font-weight:400; }
@keyframes scroll{ to{ transform:translateX(-50%); } }

/* ============================================================ stat band */
.statband{ background:var(--panel); border-block:1px solid var(--line); }
.statgrid{ display:grid; grid-template-columns:repeat(4,1fr); }
.stat{ padding:clamp(28px,4vw,48px) clamp(18px,3vw,36px); border-left:1px solid var(--line); }
.stat:first-child{ border-left:0; }
.stat .n{ font-family:var(--font-display); font-size:clamp(2.4rem,4vw,3.4rem); color:var(--amber); line-height:1; }
.stat .l{ font-family:var(--font-mono); font-size:.7rem; letter-spacing:.18em; text-transform:uppercase; color:var(--muted); margin-top:10px; }
.stat .d{ font-size:.95rem; color:var(--text); margin-top:8px; }

/* ============================================================ programs / cards */
.cards{ display:grid; gap:18px; grid-template-columns:repeat(auto-fit,minmax(290px,1fr)); }
.card{
  position:relative; background:var(--panel); border:1px solid var(--line); border-radius:var(--radius-lg);
  padding:30px 28px 26px; overflow:hidden; transition:transform .3s var(--ease), border-color .3s, background .3s;
  display:flex; flex-direction:column;
}
.card::before{ content:""; position:absolute; inset:0 auto 0 0; width:3px; background:var(--amber); transform:scaleY(0); transform-origin:bottom; transition:transform .3s var(--ease); }
.card:hover{ transform:translateY(-6px); border-color:rgba(255,178,0,.4); background:var(--panel-2); }
.card:hover::before{ transform:scaleY(1); }
.card .num{ font-family:var(--font-mono); font-size:.72rem; letter-spacing:.18em; color:var(--faint); }
.card .ico{ width:50px; height:50px; color:var(--amber); margin:6px 0 18px; }
.card h3{ margin-bottom:.5rem; }
.card p{ font-size:.97rem; color:var(--text); flex:1; }
.card .textlink{ margin-top:20px; }
.card--feature{ background:linear-gradient(160deg, var(--panel-2), var(--panel)); }

/* ============================================================ split / media */
.split{ display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(32px,5vw,72px); align-items:center; }
.split.rev{ direction:rtl; } .split.rev>*{ direction:ltr; }
.media{ position:relative; border-radius:var(--radius-lg); overflow:hidden; border:1px solid var(--line); }
.media img{ width:100%; height:100%; object-fit:cover; filter:contrast(1.05) saturate(.9); }
.media.tall{ aspect-ratio:4/5; }
.media.wide{ aspect-ratio:16/10; }
.media::after{ content:""; position:absolute; inset:0; background:linear-gradient(140deg, transparent 55%, rgba(255,178,0,.12)); pointer-events:none; }
.media .tag{ position:absolute; left:16px; bottom:16px; background:rgba(8,10,13,.82); backdrop-filter:blur(6px); border:1px solid var(--line); color:var(--bone); font-family:var(--font-mono); font-size:.66rem; letter-spacing:.16em; text-transform:uppercase; padding:8px 12px; border-radius:var(--radius); }
.media.duo{ filter:none; }
.media.duo img{ filter:grayscale(1) contrast(1.15) brightness(.85); mix-blend-mode:luminosity; }
.media.duo::before{ content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(160deg, rgba(255,178,0,.25), rgba(56,225,255,.18)); mix-blend-mode:overlay; }

/* feature list */
.flist{ display:grid; gap:2px; margin-top:8px; }
.flist li{ display:flex; gap:16px; padding:18px 0; border-bottom:1px solid var(--line-2); }
.flist .fi{ flex:none; width:28px; height:28px; color:var(--amber); margin-top:2px; }
.flist h4{ font-family:var(--font-display); text-transform:uppercase; color:var(--bone); font-size:1.15rem; letter-spacing:.02em; margin-bottom:3px; }
.flist p{ font-size:.95rem; color:var(--muted); margin:0; }

/* checklist */
.checks{ display:grid; gap:13px; margin-top:6px; }
.checks li{ display:flex; gap:13px; align-items:flex-start; }
.checks li::before{ content:""; flex:none; width:22px; height:22px; margin-top:3px; border-radius:3px; background:rgba(255,178,0,.12); border:1px solid rgba(255,178,0,.35);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFB200' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E"); background-size:14px; background-repeat:no-repeat; background-position:center; }
.checks li span{ color:var(--text); }

/* ============================================================ safety / dark band */
.band{ position:relative; background:var(--ink-2); border-block:1px solid var(--line); overflow:hidden; }
.band--photo{ background:#0A0C0F; }
.band--photo .bg{ position:absolute; inset:0; z-index:0; opacity:1; }
.band--photo .bg img{ width:100%; height:100%; object-fit:cover; filter:grayscale(.25) contrast(1.03) brightness(.82); }
.band--photo .bg::after{ content:""; position:absolute; inset:0; background:linear-gradient(95deg, rgba(8,10,13,.9), rgba(8,10,13,.62) 58%, rgba(8,10,13,.5)); }
.band--photo .wrap{ position:relative; z-index:1; }
.band::before{ content:""; position:absolute; top:0; left:0; right:0; height:8px; background:repeating-linear-gradient(-45deg, var(--amber) 0 16px, transparent 16px 32px); opacity:.5; }

/* ============================================================ cta band */
.cta{ position:relative; overflow:hidden; background:var(--amber); color:#0A0C0F; }
.cta::before{ content:""; position:absolute; inset:0; background-image:url("../img/cta-bg.jpg"); background-size:cover; background-position:center; opacity:.14; mix-blend-mode:multiply; }
.cta .wrap{ position:relative; z-index:1; text-align:center; padding-block:clamp(56px,8vw,104px); }
.cta .kicker{ color:#0A0C0F; justify-content:center; }
.cta .kicker::before{ background:#0A0C0F; box-shadow:none; }
.cta h2{ color:#0A0C0F; margin:.5rem auto .7rem; max-width:18ch; }
.cta p{ color:#26211a; margin:0 auto 2rem; max-width:52ch; font-weight:500; }
.cta .btn{ --bg:#0A0C0F; --fg:#FFB200; border-color:#0A0C0F; }
.cta .btn:hover{ background:#000; border-color:#000; box-shadow:0 16px 40px -16px rgba(0,0,0,.5); }
.cta .btn--ghost{ --bg:transparent; --fg:#0A0C0F; border-color:rgba(10,12,15,.4); }
.cta .btn--ghost:hover{ background:rgba(10,12,15,.08); --fg:#0A0C0F; }

/* ============================================================ page banner (subpages) */
.page-banner{ position:relative; padding:calc(74px + clamp(56px,8vw,96px)) 0 clamp(40px,5vw,64px); overflow:hidden; border-bottom:1px solid var(--line); }
.page-banner .bg{ position:absolute; inset:0; z-index:0; }
.page-banner .bg img{ width:100%; height:100%; object-fit:cover; filter:brightness(.5) saturate(.8); }
.page-banner .bg::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(8,10,13,.7), rgba(8,10,13,.94)), linear-gradient(90deg, rgba(8,10,13,.85), transparent 70%); }
.page-banner .wrap{ position:relative; z-index:1; }
.page-banner h1{ margin:.6rem 0 .6rem; max-width:18ch; }
.breadcrumb{ font-family:var(--font-mono); font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); display:flex; gap:.6em; flex-wrap:wrap; }
.breadcrumb a:hover{ color:var(--amber); }
.breadcrumb .sep{ color:var(--faint); }

/* prose */
.prose{ max-width:72ch; }
.prose h2{ margin:2.2rem 0 1rem; }
.prose h3{ margin:1.8rem 0 .7rem; }
.prose p{ margin-bottom:1.1rem; }
.prose ul{ margin:0 0 1.2rem; display:grid; gap:11px; }
.prose ul li{ padding-left:26px; position:relative; }
.prose ul li::before{ content:""; position:absolute; left:0; top:11px; width:10px; height:10px; background:var(--amber); transform:rotate(45deg); }
.prose a{ color:var(--amber); border-bottom:1px solid rgba(255,178,0,.4); }

/* ============================================================ forms */
.form{ background:var(--panel); border:1px solid var(--line); border-radius:var(--radius-lg); padding:clamp(24px,4vw,40px); }
.form .row{ margin-bottom:20px; }
.form .grid2{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.form label{ display:block; font-family:var(--font-mono); font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); margin-bottom:8px; }
.form .req{ color:var(--amber); }
.form input,.form select,.form textarea{
  width:100%; background:var(--ink); border:1px solid var(--line); border-radius:var(--radius);
  color:var(--bone); font-family:var(--font-body); font-size:1rem; padding:13px 15px; transition:border-color .2s, box-shadow .2s;
}
.form input::placeholder,.form textarea::placeholder{ color:var(--faint); }
.form input:focus,.form select,.form textarea:focus{ outline:none; }
.form input:focus,.form select:focus,.form textarea:focus{ border-color:var(--amber); box-shadow:0 0 0 3px rgba(255,178,0,.16); }
.form input[type=file]{ padding:11px; color:var(--muted); }
.form input[type=file]::file-selector-button{ font-family:var(--font-mono); font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; background:var(--panel-3); color:var(--bone); border:1px solid var(--line); border-radius:var(--radius); padding:8px 12px; margin-right:12px; cursor:pointer; }
.form .note{ font-size:.82rem; color:var(--muted); }
.form .hp{ position:absolute!important; left:-9999px!important; height:0; width:0; overflow:hidden; }
.form .resp{ margin-top:14px; font-family:var(--font-mono); font-size:.85rem; min-height:1em; }
.form .resp.ok{ color:#5fd07a; } .form .resp.err{ color:#ff7a5c; }
fieldset{ border:1px solid var(--line); border-radius:var(--radius); padding:18px 18px 6px; margin-bottom:20px; }
legend{ font-family:var(--font-mono); font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--amber); padding:0 8px; }

/* contact aside */
.contact-grid{ display:grid; grid-template-columns:1fr 1.1fr; gap:clamp(32px,5vw,64px); align-items:start; }
.infocard{ background:var(--panel); border:1px solid var(--line); border-radius:var(--radius-lg); padding:26px; margin-bottom:16px; }
.infocard .label{ font-family:var(--font-mono); font-size:.68rem; letter-spacing:.18em; text-transform:uppercase; color:var(--muted); margin-bottom:8px; }
.infocard .big{ font-family:var(--font-display); text-transform:uppercase; font-size:1.6rem; color:var(--bone); }
.infocard a.big:hover{ color:var(--amber); }

/* ============================================================ footer */
.site-footer{ background:#070809; border-top:1px solid var(--line); position:relative; }
.site-footer::before{ content:""; position:absolute; top:0; left:0; right:0; height:6px; background:repeating-linear-gradient(-45deg, var(--amber) 0 14px, transparent 14px 28px); opacity:.6; }
.foot-top{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1.2fr; gap:40px; padding-block:clamp(48px,6vw,76px); }
.foot-brand .mark{ width:56px; color:var(--amber); margin-bottom:16px; }
.foot-brand p{ font-size:.95rem; color:var(--muted); max-width:34ch; }
.foot-col h4{ font-family:var(--font-mono); font-size:.7rem; letter-spacing:.18em; text-transform:uppercase; color:var(--bone); margin-bottom:18px; }
.foot-col ul{ display:grid; gap:11px; }
.foot-col a{ font-size:.95rem; color:var(--muted); transition:color .2s; }
.foot-col a:hover{ color:var(--amber); }
.foot-contact .line{ display:flex; gap:11px; align-items:flex-start; margin-bottom:14px; font-size:.95rem; color:var(--text); }
.foot-contact svg{ width:17px; color:var(--amber); flex:none; margin-top:3px; }
.foot-bayside{ border-top:1px solid var(--line); padding-block:26px; display:flex; align-items:center; gap:18px; flex-wrap:wrap; }
.foot-bayside img{ width:42px; height:42px; border-radius:50%; flex:none; }
.foot-bayside p{ font-size:.9rem; color:var(--muted); margin:0; }
.foot-bayside strong{ color:var(--text); }
.foot-legal{ border-top:1px solid var(--line); padding-block:22px; display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; font-family:var(--font-mono); font-size:.72rem; letter-spacing:.06em; color:var(--faint); }
.foot-legal a:hover{ color:var(--amber); }

/* ============================================================ reveal */
.reveal{ opacity:0; transform:translateY(26px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
.reveal.in{ opacity:1; transform:none; }
.reveal[data-d="1"]{ transition-delay:.08s; }
.reveal[data-d="2"]{ transition-delay:.16s; }
.reveal[data-d="3"]{ transition-delay:.24s; }
.reveal[data-d="4"]{ transition-delay:.32s; }
@media (prefers-reduced-motion:reduce){ .reveal{ opacity:1; transform:none; transition:none; } .strip-track,.scroll-cue .bar{ animation:none; } .hero h1 .hl::after{ transform:none; animation:none; } }

/* ============================================================ responsive */
@media (max-width:1020px){
  .foot-top{ grid-template-columns:1fr 1fr; gap:32px; }
  .statgrid{ grid-template-columns:repeat(2,1fr); }
  .stat:nth-child(odd){ border-left:0; }
  .stat:nth-child(n+3){ border-top:1px solid var(--line); }
}
@media (max-width:880px){
  /* header is non-sticky on mobile -> sidesteps iOS position:sticky bugs entirely */
  .site-header{ position:static; }
  .nav-phone{ display:none; }
  .nav-toggle{ display:block; }

  /* ---- right-side slide-in drawer ---- */
  .nav-links{
    position:fixed; top:0; right:0; bottom:0; left:auto;
    width:min(84vw,330px); display:flex; flex-direction:column; align-items:stretch; gap:2px;
    background:#FFFFFF; border-left:1px solid rgba(18,22,30,.10);
    box-shadow:-26px 0 70px -28px rgba(18,22,30,.55);
    padding:calc(env(safe-area-inset-top,0px) + 64px) 18px calc(env(safe-area-inset-bottom,0px) + 24px);
    transform:translateX(100%); transition:transform .32s var(--ease);
    z-index:120; overflow-y:auto; -webkit-overflow-scrolling:touch;
  }
  body.nav-open .nav-links{ transform:none; }
  .nav-links a{ display:flex; align-items:center; padding:16px 14px; font-size:1.12rem; line-height:1; color:var(--bone); border-radius:var(--radius); }
  .nav-links a:active{ background:var(--panel-2); }
  .nav-links a::after{ display:none; }

  /* primary CTA pinned to the bottom of the drawer */
  .nav-drawer-cta{ display:block; margin-top:auto; padding-top:22px; }
  .nav-drawer-cta .btn{ width:100%; justify-content:center; padding:1em 1.1em; font-size:1.05rem; color:var(--fg); background:var(--bg); }
  .nav-drawer-cta .btn:active{ background:var(--amber-2); }

  /* backdrop + close button (injected by site.js) */
  /* light frosted scrim (not a dark sheet) so iOS 26 Safari's Liquid Glass chrome samples white, not grey */
  .nav-backdrop{ display:block; position:fixed; inset:0; z-index:110; background:rgba(255,255,255,.55); -webkit-backdrop-filter:blur(8px) saturate(1.1); backdrop-filter:blur(8px) saturate(1.1); opacity:0; pointer-events:none; transition:opacity .3s var(--ease); }
  body.nav-open .nav-backdrop{ opacity:1; pointer-events:auto; }
  .nav-close{ position:fixed; top:calc(env(safe-area-inset-top,0px) + 16px); right:16px; z-index:122; width:44px; height:44px; padding:0; border-radius:var(--radius); border:1px solid var(--line); background:#FFFFFF; color:var(--bone); display:none; align-items:center; justify-content:center; }
  body.nav-open .nav-close{ display:inline-flex; }
  .nav-close svg{ width:22px; height:22px; }

  body.nav-open{ overflow:hidden; }
  .split,.contact-grid{ grid-template-columns:1fr; }
  .split.rev{ direction:ltr; }
  .form .grid2{ grid-template-columns:1fr; }
}
@media (max-width:560px){
  body{ font-size:16px; }
  .statgrid{ grid-template-columns:1fr; }
  .stat{ border-left:0!important; border-top:1px solid var(--line); }
  .stat:first-child{ border-top:0; }
  .hero-meta{ gap:20px; }
  .foot-top{ grid-template-columns:1fr; }
  .foot-legal{ justify-content:flex-start; }
}

/* ============================================================ application wizard (/careers/) */
.app-chips{ display:flex; flex-wrap:wrap; gap:10px; margin-top:24px; }
.app-chips span{ font-family:var(--font-mono); font-size:.68rem; letter-spacing:.12em; text-transform:uppercase; color:var(--bone); background:rgba(255,255,255,.05); border:1px solid var(--line); border-radius:100px; padding:9px 15px; display:inline-flex; align-items:center; gap:.6em; }
.app-chips span::before{ content:""; width:6px; height:6px; border-radius:50%; background:var(--amber); box-shadow:0 0 8px var(--amber); flex:none; }

.app-shell{ display:grid; grid-template-columns:320px 1fr; gap:clamp(22px,3.5vw,48px); align-items:start; }

.app-aside{ position:sticky; top:96px; display:grid; gap:14px; }
.app-panel{ background:var(--panel); border:1px solid var(--line); border-radius:var(--radius-lg); padding:24px; }
.app-panel h3{ font-size:1.2rem; letter-spacing:.02em; margin-bottom:20px; }
.app-panel .label{ font-family:var(--font-mono); font-size:.66rem; letter-spacing:.18em; text-transform:uppercase; color:var(--muted); margin-bottom:9px; }
.app-panel .big{ font-family:var(--font-display); text-transform:uppercase; font-size:1.5rem; color:var(--bone); }
.app-panel a.big:hover{ color:var(--amber); }

.app-timeline{ counter-reset:t; display:grid; }
.app-timeline li{ position:relative; padding:0 0 20px 40px; }
.app-timeline li:last-child{ padding-bottom:0; }
.app-timeline li::before{ counter-increment:t; content:counter(t,decimal-leading-zero); position:absolute; left:0; top:-1px; width:27px; height:27px; border-radius:50%; background:rgba(255,178,0,.1); border:1px solid rgba(255,178,0,.4); color:var(--amber); font-family:var(--font-mono); font-size:.64rem; display:flex; align-items:center; justify-content:center; }
.app-timeline li::after{ content:""; position:absolute; left:13px; top:28px; bottom:2px; width:1px; background:var(--line); }
.app-timeline li:last-child::after{ display:none; }
.app-timeline h4{ font-family:var(--font-display); text-transform:uppercase; font-size:1.02rem; letter-spacing:.02em; color:var(--bone); margin-bottom:2px; line-height:1.1; padding-top:4px; }
.app-timeline p{ font-size:.86rem; color:var(--muted); margin:0; }

/* progress */
.app-prog{ margin-bottom:28px; }
.app-prog-top{ display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:13px; }
.app-prog-title{ font-family:var(--font-display); text-transform:uppercase; font-size:1.4rem; color:var(--bone); letter-spacing:.02em; line-height:1; }
.app-prog-step{ font-family:var(--font-mono); font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); white-space:nowrap; }
.app-prog-step b{ color:var(--amber); }
.app-prog-segs{ display:flex; gap:6px; }
.app-prog-segs i{ flex:1; height:5px; border-radius:3px; background:var(--panel-3); transition:background .35s var(--ease), box-shadow .35s var(--ease); }
.app-prog-segs i.done{ background:var(--amber); }
.app-prog-segs i.active{ background:linear-gradient(90deg,var(--amber),var(--amber-2)); box-shadow:0 0 12px rgba(255,178,0,.45); }

/* steps */
.app-step__intro{ font-size:.95rem; color:var(--muted); margin:-2px 0 22px; max-width:52ch; }
.app-subhead{ font-family:var(--font-mono); font-size:.7rem; letter-spacing:.16em; text-transform:uppercase; color:var(--amber); margin:24px 0 14px; padding-top:18px; border-top:1px solid var(--line-2); }
.app-subhead.first{ margin-top:0; padding-top:0; border-top:0; }

/* dropzone */
.app-drop{ position:relative; display:block; border:1.5px dashed var(--line); border-radius:var(--radius-lg); padding:32px 22px; text-align:center; transition:border-color .2s, background .2s; cursor:pointer; }
.app-drop:hover, .app-drop.drag{ border-color:var(--amber); background:rgba(255,178,0,.05); }
.app-drop.has-file{ border-style:solid; border-color:var(--amber); background:rgba(255,178,0,.06); }
.app-drop input[type=file]{ position:absolute; inset:0; width:100%; height:100%; opacity:0; cursor:pointer; padding:0; }
.app-drop input[type=file]::file-selector-button{ display:none; }
.app-drop .ico{ width:34px; height:34px; color:var(--amber); margin:0 auto 12px; }
.app-drop .dz-title{ font-family:var(--font-display); text-transform:uppercase; color:var(--bone); letter-spacing:.02em; font-size:1.12rem; }
.app-drop .dz-sub{ font-size:.84rem; color:var(--muted); margin-top:5px; }
.app-drop .dz-file{ display:none; font-family:var(--font-mono); font-size:.82rem; color:var(--amber); margin-top:12px; word-break:break-all; }
.app-drop.has-file .dz-file{ display:block; }

/* nav */
.app-nav{ display:flex; align-items:center; gap:12px; margin-top:28px; }
.app-nav .spacer{ flex:1; }

/* progressive enhancement: hidden until JS adds .js-wizard */
.app-prog, .app-nav{ display:none; }
.app-form.js-wizard .app-prog{ display:block; }
.app-form.js-wizard .app-nav{ display:flex; }
.app-form.js-wizard .app-fallback{ display:none; }
.app-form.js-wizard .app-step{ display:none; }
.app-form.js-wizard .app-step.is-active{ display:block; animation:appstep .4s var(--ease); }
@keyframes appstep{ from{ opacity:0; transform:translateX(14px); } to{ opacity:1; transform:none; } }

@media (max-width:900px){
  .app-shell{ grid-template-columns:1fr; }
  .app-aside{ position:static; order:2; grid-template-columns:1fr 1fr; }
  .app-aside .app-panel:first-child{ grid-column:1 / -1; }
}
@media (max-width:560px){
  .app-aside{ grid-template-columns:1fr; }
  .app-prog-title{ font-size:1.2rem; }
}
@media (max-width:480px){
  .app-nav{ gap:8px; }
  .app-nav .btn{ font-size:1.02rem; padding:.85em 1.15em; }
}

/* ============================================================ LIGHT THEME (optional, via header toggle) */
:root[data-theme="light"]{
  --ink:#FFFFFF; --ink-2:#F3F5F7; --panel:#FFFFFF; --panel-2:#F6F8FA; --panel-3:#EBEEF2;
  --line:rgba(18,22,30,.12); --line-2:rgba(18,22,30,.055);
  --bone:#14171C; --text:#39424F; --muted:#616B79; --faint:#98A1AE;
  --ink-amber:#955200;
  --shadow:0 18px 48px -22px rgba(18,22,30,.22);
}
[data-theme="light"] body{ background-image:none; }
/* cards get a hair of lift on pure white so they still read as cards */
[data-theme="light"] .card,
[data-theme="light"] .infocard,
[data-theme="light"] .app-panel,
[data-theme="light"] .form{ box-shadow:0 1px 2px rgba(18,22,30,.05), 0 10px 26px -20px rgba(18,22,30,.2); }

/* header solid & light from the top */
[data-theme="light"] .site-header{ background:#FFFFFF; backdrop-filter:none; border-bottom:1px solid var(--line); }
@media (max-width:880px){ [data-theme="light"] .nav-links{ background:#FFFFFF; backdrop-filter:none; } }

/* amber-as-text -> readable deep amber on light surfaces */
[data-theme="light"] .kicker,
[data-theme="light"] .textlink,
[data-theme="light"] .stat .n,
[data-theme="light"] .card .ico,
[data-theme="light"] .flist .fi,
[data-theme="light"] .form .req,
[data-theme="light"] legend,
[data-theme="light"] .brand .wm-2,
[data-theme="light"] .nav-phone svg,
[data-theme="light"] .foot-contact svg,
[data-theme="light"] .app-subhead,
[data-theme="light"] .app-prog-step b,
[data-theme="light"] .app-drop .ico,
[data-theme="light"] .app-drop .dz-file,
[data-theme="light"] .app-timeline li::before,
[data-theme="light"] .prose a{ color:var(--ink-amber); }
[data-theme="light"] .kicker::before{ background:var(--ink-amber); box-shadow:none; }
[data-theme="light"] .kicker.arc{ color:var(--arc-deep); }
[data-theme="light"] .kicker.arc::before{ background:var(--arc-deep); box-shadow:none; }

/* keep eyebrow + text vibrant/light where it sits on the dark hero & banner photos */
[data-theme="light"] .hero .kicker,
[data-theme="light"] .page-banner .kicker{ color:var(--amber); }
[data-theme="light"] .hero .kicker::before,
[data-theme="light"] .page-banner .kicker::before{ background:var(--amber); box-shadow:0 0 12px var(--amber); }
[data-theme="light"] .hero h1,
[data-theme="light"] .page-banner h1{ color:#EEF1F5; }
[data-theme="light"] .hero .lead,
[data-theme="light"] .page-banner .lead{ color:#D9DEE5; }
[data-theme="light"] .hero-meta{ border-top-color:rgba(255,255,255,.2); }
[data-theme="light"] .hero-meta .n{ color:#EEF1F5; }
[data-theme="light"] .hero-meta .l,
[data-theme="light"] .scroll-cue{ color:#A6B0BD; }
[data-theme="light"] .hero .btn--ghost{ --fg:#EEF1F5; border-color:rgba(255,255,255,.28); }
[data-theme="light"] .hero .btn--ghost:hover{ background:rgba(255,255,255,.1); --fg:#fff; border-color:rgba(255,255,255,.4); }
[data-theme="light"] .breadcrumb{ color:#A9B2BE; }
[data-theme="light"] .breadcrumb .sep{ color:#727c89; }
[data-theme="light"] .media .tag{ color:#EEF1F5; }
[data-theme="light"] .app-chips span{ color:#EEF1F5; background:rgba(255,255,255,.08); }

/* dark surfaces that flip to light panels */
/* safety band stays a dark photo block in light mode -> re-pin its text light */
[data-theme="light"] .band--photo .kicker{ color:var(--amber); }
[data-theme="light"] .band--photo h2,
[data-theme="light"] .band--photo .flist h4{ color:#EEF1F5; }
[data-theme="light"] .band--photo .lead{ color:#D9DEE5; }
[data-theme="light"] .band--photo .flist p{ color:#A7B1BE; }
[data-theme="light"] .band--photo .flist li{ border-bottom-color:rgba(255,255,255,.12); }
[data-theme="light"] .site-footer{ background:var(--ink-2); }

/* cta stays an amber block -> re-assert its dark eyebrow */
[data-theme="light"] .cta .kicker{ color:#0A0C0F; }
[data-theme="light"] .cta .kicker::before{ background:#0A0C0F; }

/* misc */
[data-theme="light"] .hazard{ background:repeating-linear-gradient(-45deg, var(--amber) 0 16px, #1c1f25 16px 32px); }
[data-theme="light"] .btn--ghost:hover{ background:rgba(24,28,34,.05); }

/* theme toggle button (JS-injected into the header nav) */
.theme-toggle{ width:42px; height:42px; flex:none; border:1px solid var(--line); border-radius:var(--radius); background:transparent; color:var(--text); display:inline-flex; align-items:center; justify-content:center; transition:color .2s, border-color .2s; }
.theme-toggle:hover{ color:var(--amber); border-color:var(--amber); }
.theme-toggle svg{ width:18px; height:18px; }
.theme-toggle .i-moon{ display:none; }
[data-theme="light"] .theme-toggle .i-sun{ display:none; }
[data-theme="light"] .theme-toggle .i-moon{ display:block; }
@media (max-width:400px){ .theme-toggle{ display:none; } }

/* ============================================================ refinements */
/* drop the eyebrow dash */
.kicker::before{ display:none; }
/* remove decorative card + feature icons */
.card .ico, .flist .fi{ display:none; }
.card .num{ display:block; margin-bottom:14px; }
/* keep stat values on one line */
.stat .n{ white-space:nowrap; }
/* 4-up card grids: one clean row, no orphaned blank space */
.cards.cards--4{ grid-template-columns:repeat(4,1fr); }
@media (max-width:1000px){ .cards.cards--4{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .cards.cards--4{ grid-template-columns:1fr; } }
/* hero: on small screens top-align below the fixed header so the headline isn't covered */
@media (max-width:768px){
  .scroll-cue{ display:none; }
  .hero{ align-items:flex-start; padding-top:36px; padding-bottom:56px; }
}
/* compact, non-wrapping header lockup on phones */
@media (max-width:560px){
  .nav{ gap:10px; }
  .brand{ gap:10px; margin-right:auto; min-width:0; }
  .brand .mark{ width:38px; height:38px; }
  .brand .wm-1{ white-space:nowrap; font-size:1.02rem; }
  .brand .wm-2{ display:none; }
  .nav-cta{ gap:10px; }
  .nav-cta .btn{ padding:.62em .95em; font-size:.9rem; }
}
@media (prefers-reduced-motion:reduce){
  .app-form.js-wizard .app-step.is-active{ animation:none; }
}
