﻿:root{
  /* --bg-rgb must track --slate: every image veil/overlay is built from it. */
  --slate:#181c1a; --slate-deep:#101210; --slate-raise:#212722;
  /* Space-separated (not comma-separated) - required because every use
     below is the modern rgb(var(--bg-rgb) / alpha) slash-alpha syntax,
     which is invalid CSS if the R/G/B channels are comma-separated
     (can't mix legacy comma syntax with the slash alpha modifier - the
     whole background-image silently drops to `none`, no console error). */
  --bg-rgb:24 28 26;
  --accent:#c98a3a; --accent-2:#9c6a26;
  --permit:#c98a3a; --permit-dim:#9c6a26; --board-line:#7fd4c4;
  --on-accent:#0e120f;
  --reflect:#eef2ef; --haze:#98a39d; --haze-deep:#7d8781;
  --daylight:#efe9dd; --daylight-2:#e1dacb;
  --rule:rgba(238,242,239,.13); --rule-soft:rgba(238,242,239,.07); --glass:rgba(238,242,239,.06);
  --radius:8px; --btn-radius:6px;
  --display:'Space Grotesk',system-ui,sans-serif;
  --body:'Inter',system-ui,sans-serif;
  --data:'IBM Plex Mono',ui-monospace,monospace;
  --gut:min(6vw,72px);
  --ease:cubic-bezier(.2,.8,.2,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--body);color:var(--reflect);background:var(--slate);line-height:1.65;font-size:16.5px;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
.shell{max-width:1400px;margin:auto;padding-inline:var(--gut)}
.h-xl,.h-lg,.h-md{font-family:var(--display);font-weight:800;letter-spacing:-.02em;line-height:.96}
.h-xl{font-size:clamp(44px,8vw,116px)}
.h-lg{font-size:clamp(30px,4.8vw,58px)}
.tag,.crumb{font-family:var(--data);font-size:11px;text-transform:uppercase;letter-spacing:.16em;color:var(--haze)}
.dot{width:4px;height:4px;border-radius:50%;background:var(--haze);display:inline-block}

/* NAV */
.nav{position:fixed;inset:0 0 auto;z-index:300;border-bottom:1px solid transparent;transition:.3s}
.nav.scrolled{background:rgba(16,18,16,.92);backdrop-filter:blur(14px);border-color:var(--rule)}
.nav-in{display:flex;justify-content:space-between;align-items:center;padding-block:20px}
.wordmark{display:flex;align-items:center;gap:13px}
.plate{padding:6px 9px;border-radius:6px;border:1px solid var(--accent);color:var(--accent);font-family:var(--display);font-weight:800}
.name{font:800 17px var(--display)}
.nav-links{display:flex;align-items:center;gap:26px}
.nav-links a{font:500 12.5px var(--data);text-transform:uppercase;letter-spacing:.1em;color:var(--haze);transition:.15s}
.nav-links a.active,.nav-links a:hover{color:var(--reflect)}
.nav-phone{color:var(--accent)!important}
.burger{display:none;background:none;border:0;color:var(--reflect);font-size:24px;cursor:pointer}

/* BUTTONS / ACTIONS */
.act{display:inline-flex;align-items:center;gap:10px;padding:15px 26px;border-radius:var(--btn-radius);border:1px solid var(--accent);font:600 12.5px var(--data);text-transform:uppercase;letter-spacing:.1em;color:var(--accent);background:transparent;transition:.2s var(--ease);cursor:pointer}
.act--solid{background:var(--accent);color:var(--on-accent);border-color:transparent}
.act--solid:hover{transform:translateY(-2px);box-shadow:0 12px 30px -10px var(--accent)}
.act--quiet{border-color:var(--rule);color:var(--reflect)}
.act--quiet:hover{border-color:var(--accent);color:var(--accent)}
.act:active{transform:scale(.965)}
.act:focus-visible{outline:none;box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent)}

/* Visible keyboard focus everywhere, not just on .act buttons. */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* HERO (home, split layout) */
.hero{min-height:100svh;padding:150px 0 42px;position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:center}
.hero-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(.08) contrast(1.03)}
.hero-veil{position:absolute;inset:0;background:
  linear-gradient(90deg,var(--slate) 2%,rgb(var(--bg-rgb) / .92) 22%,rgb(var(--bg-rgb) / .62) 40%,rgb(var(--bg-rgb) / .2) 56%,transparent 68%),
  linear-gradient(180deg,transparent 55%,var(--slate) 100%)}
.hero-sweep{position:absolute;top:0;bottom:0;width:46vw;pointer-events:none;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--accent) 7%,transparent) 45%,rgba(238,242,239,.045) 55%,transparent);animation:sweep 15s linear infinite;z-index:1}
@keyframes sweep{0%{transform:translateX(-60vw) skewX(-12deg)}100%{transform:translateX(150vw) skewX(-12deg)}}
.hero-in{position:relative;z-index:2}
.hero h1{max-width:13ch}
.hero-meta{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin-bottom:22px}
.rolling{font:500 11px var(--data);color:var(--accent);text-transform:uppercase;letter-spacing:.14em}
.rolling::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--accent);display:inline-block;margin-right:7px;animation:blip 2.4s ease-in-out infinite}
@keyframes blip{0%,100%{opacity:1}50%{opacity:.25}}
.thin{display:block;margin-top:24px;max-width:54ch;color:var(--haze);font:400 clamp(16px,1.5vw,18px)/1.55 var(--body)}
.word-accent{color:var(--accent)}
.hero-acts{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin-top:28px}

/* CHECKPOINT TRACK — signature element: the training route, permit to license.
   Content is generic/placeholder per-program status (see EXAMPLE_PROGRAMS),
   never a specific claim about a lead's real offerings until confirmed. */
.board{position:relative;z-index:2;margin-top:56px;border:1px solid var(--rule);border-top:3px solid var(--accent);border-radius:var(--radius);overflow:visible;padding-top:34px;background:rgba(16,18,16,.9);backdrop-filter:blur(8px);box-shadow:0 18px 44px -22px rgba(0,0,0,.6)}
.sample-flag{position:absolute;top:-13px;left:20px;background:var(--accent);color:var(--on-accent);font:800 11px var(--data);text-transform:uppercase;letter-spacing:.08em;padding:4px 10px;border-radius:4px;z-index:4;box-shadow:0 3px 10px rgba(0,0,0,.4)}
.board-head,.lane{display:grid;grid-template-columns:1.7fr .8fr .7fr;gap:20px;padding:14px 22px;border-bottom:1px dashed var(--rule);font:11px var(--data)}
.board-head{color:var(--haze-deep);text-transform:uppercase}
.lane{align-items:center;position:relative}
.lane::before{content:"";position:absolute;left:22px;top:50%;width:8px;height:8px;border-radius:50%;background:var(--board-line);transform:translate(-16px,-50%)}
.lane-route{font:700 clamp(15px,1.8vw,19px) var(--display);color:var(--reflect)}
.lane-detail{color:var(--haze);font-family:var(--data);font-size:13px}
.lane-status{color:var(--accent);font-family:var(--data);text-transform:uppercase;font-size:11px}
.board-foot{padding:14px 22px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;color:var(--haze-deep);font:11px var(--data);text-transform:uppercase}
.board-foot a{color:var(--accent)}
.board-sync{font-family:var(--data);color:var(--haze-deep)}

/* HERO — centered layout (alternate composition, picked via config `layout`) */
.hero-centered{align-items:center;text-align:center}
/* The base .hero-veil is a left-to-right gradient tuned for the split
   layout (text on the left half, photo visible on the right). Centered
   layout puts text in the middle of the frame instead, so that gradient
   leaves the photo at full strength behind the headline - on a busy photo
   (e.g. a truck driving straight at camera) the text becomes unreadable.
   Layer a second, symmetric veil so the center of the frame is always
   dark enough for the centered headline/subtext to read as the page's
   primary content, regardless of what's in the photo or which variant. */
.hero-centered .hero-veil{background:
  radial-gradient(ellipse 60% 70% at 50% 40%,rgb(var(--bg-rgb) / .82),rgb(var(--bg-rgb) / .3) 65%,transparent 85%),
  linear-gradient(90deg,var(--slate) 2%,rgb(var(--bg-rgb) / .55) 30%,rgb(var(--bg-rgb) / .55) 70%,var(--slate) 98%),
  linear-gradient(180deg,transparent 45%,var(--slate) 100%)}
.hero-center-inner{position:relative;z-index:2;max-width:760px;margin:0 auto;padding:150px 24px 100px;display:flex;flex-direction:column;align-items:center}
.brand-mark-lg{width:62px;height:62px;border-radius:14px;background:linear-gradient(135deg,var(--accent-2),var(--accent));display:grid;place-items:center;font-family:var(--display);font-weight:800;color:var(--on-accent);font-size:23px;margin-bottom:20px;box-shadow:0 12px 30px -10px var(--accent)}
.hiring-pill{display:inline-flex;align-items:center;gap:8px;padding:7px 14px;border:1px solid var(--accent);border-radius:999px;color:var(--accent);font-family:var(--data);font-size:11.5px;text-transform:uppercase;letter-spacing:.06em;width:fit-content;margin-bottom:22px;background:var(--glass)}
.hiring-pill::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--accent);animation:pulse-glow 2.2s ease-in-out infinite}
@keyframes pulse-glow{0%,100%{box-shadow:0 0 8px 1px var(--accent)}50%{box-shadow:0 0 16px 4px var(--accent)}}
.center-h1{font-family:var(--display);font-size:clamp(34px,6vw,56px);font-weight:800;margin:0 0 10px}
.center-tag{font-family:var(--data);font-size:13px;color:var(--haze);text-transform:uppercase;letter-spacing:.06em;margin-bottom:36px}
.big-number{display:flex;flex-direction:column;align-items:center;margin-bottom:34px}
.bn-num{font-family:var(--display);font-weight:800;font-size:clamp(30px,5vw,52px);color:var(--accent);line-height:1}
.bn-label{font-size:13px;color:var(--haze);text-transform:uppercase;letter-spacing:.06em;margin-top:10px}
.center-stats{display:flex;gap:40px;margin-bottom:36px;flex-wrap:wrap;justify-content:center}
.cs{display:flex;flex-direction:column;align-items:center}
.cs b{font-family:var(--data);font-weight:600;font-size:20px;color:var(--reflect)}
.cs span{font-size:11px;color:var(--haze);text-transform:uppercase;letter-spacing:.06em;margin-top:4px}
.hero-cta.center{justify-content:center;display:flex;gap:14px;flex-wrap:wrap}
.center-micro{font-size:12.5px;color:var(--haze-deep);margin-top:16px}
.scroll-hint.center{left:50%;transform:translateX(-50%)}

/* PROOF STRIP — registry-derived status badges, not fabricated counts */
.proof{background:var(--slate-deep);border-block:1px solid var(--rule)}
.proof-grid{display:grid;grid-template-columns:repeat(3,1fr)}
.pf{padding:26px 22px;text-align:center;border-right:1px dashed var(--rule)}
.pf:last-child{border-right:0}
.pf b{display:block;font:800 clamp(18px,2.2vw,26px) var(--display);line-height:1.15;color:var(--reflect)}
.pf-word b{font-size:clamp(15px,1.8vw,20px)}
.pf span{display:block;margin-top:9px;color:var(--haze);font:11px var(--data);text-transform:uppercase;letter-spacing:.1em}

/* SECTIONS */
.sec{padding:clamp(76px,10vw,140px) 0;position:relative}
.sec.light{background:var(--daylight);color:var(--slate-deep)}
.sec-head{display:grid;grid-template-columns:140px 1fr;gap:50px;margin-bottom:56px}
.sec-body{max-width:62ch}
.sec-body h2{margin-bottom:18px}
.light .sec-head p,.light .body-copy{color:#4b4a40}
.body-copy{color:var(--haze);margin:18px 0}

/* PROGRAM TEASER (home only - see services.html for the full grid) */
.prog-teaser{list-style:none;display:flex;flex-wrap:wrap;gap:14px 32px;margin:0 0 28px;padding-top:20px;border-top:1px solid var(--rule)}
.prog-teaser li{display:flex;align-items:center;gap:10px;font:600 15px var(--body);color:var(--reflect)}
.light .prog-teaser li{color:var(--slate-deep)}
.prog-teaser-code{font:11px var(--data);color:var(--accent)}

/* PROGRAMS GRID */
.progs{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.prog{background:var(--slate-deep);border:1px solid var(--rule);border-top:3px solid var(--accent);border-radius:var(--radius);overflow:hidden;transition:transform .3s var(--ease)}
.light .prog{background:#fff}
.prog-photo{height:210px;background:center/cover;filter:grayscale(.3)}
.prog-body{padding:24px}
.prog h3{font:800 24px var(--display);margin:8px 0}
.prog p{color:var(--haze)}
.light .prog p{color:#4b4a40}
.prog-code{font:11px var(--data);color:var(--accent)}
.prog:hover{transform:translateY(-6px) rotateX(var(--rx,0)) rotateY(var(--ry,0))}
.prog a.more{color:var(--accent);font-weight:600;font-size:13.5px;display:inline-block;margin-top:12px;font-family:var(--data);text-transform:uppercase;letter-spacing:.04em}

/* PAGE HERO (subpages) */
.phero{position:relative;padding:170px 0 78px;border-bottom:1px solid var(--rule);overflow:hidden}
.phero-photo{position:absolute;inset:0;background:center/cover;opacity:.32;filter:grayscale(.45)}
.phero-veil{position:absolute;inset:0;background:linear-gradient(90deg,var(--slate),rgb(var(--bg-rgb) / .6))}
.phero-in{position:relative;z-index:2}
.phero p{color:var(--haze);max-width:54ch;margin-top:14px}

/* START FIGURE (enroll page) — next-start-date figure, permit-amber accent */
.start-fig{border-top:2px solid var(--permit);padding-top:22px;margin:40px 0 32px;display:inline-block}
.start-fig .fig{font-family:var(--display);font-weight:800;font-size:clamp(34px,6vw,72px);line-height:.94;letter-spacing:-.02em;color:var(--permit)}
.start-fig .unit{font-family:var(--data);font-size:12px;text-transform:uppercase;letter-spacing:.14em;color:var(--haze);margin-top:10px}

/* ENROLL TEASER (home mid-section + enroll page) */
.enroll-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(36px,6vw,80px);align-items:start}
.perks{list-style:none;margin-top:24px;border-top:1px solid var(--rule)}
.perks li{display:flex;align-items:center;gap:12px;padding:13px 0;border-bottom:1px solid var(--rule);font:500 14.5px var(--body);color:var(--reflect)}
.perks li::before{content:"";width:7px;height:7px;flex:0 0 7px;border-radius:50%;background:var(--accent)}
.form-card{background:var(--slate-deep);border:1px solid var(--rule);border-top:3px solid var(--accent);border-radius:var(--radius);padding:clamp(24px,3.5vw,36px)}
.form-card h3{font:800 22px var(--display)}
.form-card .sub{font:11px var(--data);color:var(--haze);text-transform:uppercase;letter-spacing:.1em;margin-top:6px}
.fld{margin-top:18px}
.fld label{display:block;margin-bottom:8px;font:11px var(--data);color:var(--haze);text-transform:uppercase;letter-spacing:.04em}
.fld input,.fld select,.fld textarea{width:100%;padding:11px 12px;background:rgba(238,242,239,.04);border:1px solid var(--rule);border-radius:5px;color:var(--reflect);font:inherit}
.fld textarea{min-height:100px;resize:vertical}
.fld select option{background:var(--slate-raise)}
.fld input:focus,.fld select:focus,.fld textarea:focus{outline:none;border-color:var(--accent);background:rgba(238,242,239,.07)}
.form-card .act{width:100%;justify-content:center;margin-top:24px}

/* PARTNERS — for trucking companies / referral partners (replaces trucking's
   shipper/broker "book direct" section; a real, relevant CDL-school angle:
   carriers are these schools' driver-placement partners). */
.partners{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,6vw,80px);align-items:center}
.partner-photo{min-height:400px;background:center/cover;filter:grayscale(.3);border-radius:var(--radius);border:1px solid var(--rule)}
.partner-rows{list-style:none;margin:26px 0;border-top:1px solid var(--rule)}
.partner-rows li{padding:14px 2px;border-bottom:1px solid var(--rule);display:flex;gap:14px;flex-wrap:wrap}
.partner-rows .k{color:var(--accent);font:11px var(--data);text-transform:uppercase}
.partner-rows .v{font-size:15px}

/* STEPS (programs page "how it works") */
.run{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--rule);border:1px solid var(--rule);border-radius:var(--radius);overflow:hidden}
.run-step{padding:26px;background:var(--slate)}
.run-step .n{font:11px var(--data);color:var(--accent);text-transform:uppercase}
.run-step h4{font:800 18px var(--display);margin:14px 0 8px}
.run-step p{color:var(--haze);font-size:14px}

/* ABOUT */
.duo{display:grid;grid-template-columns:1.1fr .9fr;gap:52px;align-items:center}
.duo-media{min-height:410px;background:center/cover;filter:grayscale(.3);border-radius:var(--radius);border:1px solid var(--rule)}
.figs{display:grid;grid-template-columns:repeat(4,1fr)}
.fig-cell{padding:26px 20px;text-align:center;border-right:1px dashed var(--rule)}
.fig-cell:last-child{border-right:0}
.fig-cell b{display:block;font:800 clamp(16px,2vw,22px) var(--display)}
.fig-cell span{display:block;margin-top:8px;color:var(--haze);font:11px var(--data);text-transform:uppercase;letter-spacing:.08em}
.light .fig-cell span{color:#5a594e}

/* REQUIREMENTS */
.reqs{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:0 32px;margin-top:24px}
.reqs li{display:flex;gap:12px;align-items:center;color:var(--reflect);padding:11px 0;border-bottom:1px solid var(--rule)}
.reqs li::before{content:"";flex:0 0 16px;height:16px;border:2px solid var(--accent);border-radius:3px;
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/></svg>") center/11px no-repeat;
  mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/></svg>") center/11px no-repeat;
  background:var(--accent)}
.light .reqs li{color:var(--slate-deep)}

/* CTA BAND */
.close{padding:110px 0;text-align:center;border-top:1px solid var(--rule)}
.close .h-lg{max-width:16ch;margin:18px auto}
.close p{color:var(--haze);margin:auto;max-width:44ch}
.close-acts{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;margin-top:28px}

/* CONTACT */
.contact-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:70px}
.lines{list-style:none;margin:26px 0;border-top:1px solid var(--rule)}
.lines li{padding:16px 2px;border-bottom:1px solid var(--rule);display:flex;gap:14px;flex-wrap:wrap}
.lines .k{color:var(--accent);font:11px var(--data);text-transform:uppercase}
.lines .v{font-size:17px}
.duo-pair{display:grid;grid-template-columns:1fr 1fr;gap:18px}

/* FOOTER */
footer{background:var(--slate-deep);border-top:1px solid var(--rule);padding:56px 0 30px;color:var(--haze)}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px;padding-bottom:28px;border-bottom:1px solid var(--rule)}
.foot-grid .desc{max-width:340px;font-size:15px;margin-top:16px}
.foot-col h5{font-family:var(--data);font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--reflect);margin-bottom:14px}
.foot-col a{display:block;padding:5px 0;font-size:15px}
.foot-col a:hover{color:var(--accent)}
.legal{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-top:24px;font-size:13px;font-family:var(--data)}
.brand{display:flex;align-items:center;gap:12px}
.brand .mark{width:42px;height:42px;border-radius:10px;background:linear-gradient(135deg,var(--accent-2),var(--accent));display:grid;place-items:center;font-family:var(--display);font-weight:800;color:var(--on-accent);font-size:16px}
.brand b{font-family:var(--display);font-weight:800;font-size:19px}

/* hooking glow line under hero subtext on the enroll page */
.glow-cta{display:inline-block;margin-top:22px;font:800 13px var(--data);text-transform:uppercase;letter-spacing:.12em;color:var(--accent);text-shadow:0 0 18px color-mix(in srgb, var(--accent) 70%, transparent),0 0 40px color-mix(in srgb, var(--accent) 35%, transparent);animation:glow-pulse 2.2s ease-in-out infinite}
@keyframes glow-pulse{0%,100%{opacity:1}50%{opacity:.6}}

/* Scroll reveal (see footer.html for the IntersectionObserver) */
.rv{opacity:0;transform:translateY(20px);transition:opacity .65s var(--ease),transform .65s var(--ease)}
.rv.seen{opacity:1;transform:none}
.word-wrap{display:inline-block;overflow:hidden}
.word{display:inline-block;transform:translateY(110%);transition:transform .55s var(--ease)}
.words-on .word{transform:none}

@media(max-width:860px){
  .nav-links{display:none}
  .burger{display:block}
  .nav.open .nav-links{display:flex;position:absolute;top:72px;right:4vw;background:var(--slate-deep);padding:20px;flex-direction:column;align-items:flex-start;border:1px solid var(--rule);border-radius:var(--radius)}
  .proof-grid,.figs,.run{grid-template-columns:repeat(2,1fr)}
  .progs{grid-template-columns:1fr}
  .sec-head,.duo,.partners,.contact-grid,.enroll-grid{grid-template-columns:1fr}
  .board-head,.lane{grid-template-columns:1.4fr 1fr}
  .lane-status{display:none}
  .phero{padding-top:130px}
  .prog-photo{height:180px}
  .reqs{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr;gap:28px}
  .duo-pair{grid-template-columns:1fr}
  .duo-media,.partner-photo{min-height:260px}
  .hero-center-inner{padding:120px 20px 70px}
  .center-stats{gap:26px}
}
@media(prefers-reduced-motion:reduce){
  *{transition:none !important}
  .rv{opacity:1;transform:none}
  .hiring-pill::before,.rolling::before,.glow-cta,.hero-sweep{animation:none}
}

/* ============================================================
   VARIANT: range — industrial, squared, high-contrast. Cool slate
   base, zero blur, uppercase display type, hard left-edge accent
   borders — reads like a training-range equipment log rather than
   a classroom handout. Structural differences from base: square
   corners (radius:0), left-border card treatment, uppercase type.
   Appended after styles.css, so plain rules beat base rules.
   NOTE: any grid-template-columns change here MUST be repeated
   in the mobile block at the bottom, or it overrides the base
   860px collapse and breaks phones.
   ============================================================ */
:root{
  --slate:#0e1a17; --slate-deep:#0a1310; --slate-raise:#132420;
  --bg-rgb:14 26 23;
  --reflect:#eef4f1; --haze:#8fa39c; --haze-deep:#647871;
  --daylight:#dbe6e1; --daylight-2:#c9d8d1;
  --rule:rgba(238,244,241,.14); --glass:rgba(238,244,241,.035);
  --radius:0px; --btn-radius:2px;
}

.h-xl,.h-lg,.h-md,.center-h1{text-transform:uppercase;letter-spacing:0}

/* Uppercase runs wider - pull sizes back so headlines still fit. */
.hero h1{font-size:clamp(32px,5.6vw,64px);line-height:1.04}
.sec-body h2{font-size:clamp(24px,3.6vw,40px)}
.close h2{font-size:clamp(26px,4.2vw,44px)}
.phero h1{font-size:clamp(26px,4.2vw,48px)}

/* Square corners everywhere; solid panels instead of frosted glass. */
.board,.prog,.form-card,.duo-media,.partner-photo,.act,.plate,.brand-mark-lg,.brand .mark{border-radius:0}
.glass,.hiring-pill{background:var(--slate-raise);border-color:var(--rule);backdrop-filter:none}

/* Left-edge accent border - the industrial signature, replacing
   the base's top-edge accent border. */
.prog,.form-card,.board{border-top:none;border-left:3px solid var(--accent)}
.prog:hover{transform:none;border-color:var(--rule);border-left-color:var(--accent);background:#152722}

/* Hard-ruled proof strip. */
.proof-grid{padding:6px 0}
.pf{border-right:1px solid var(--rule)}
.pf b{color:var(--accent);font-size:clamp(15px,1.8vw,20px)}

/* Buttons: blocky, letterspaced, no lift. */
.act{text-transform:uppercase;letter-spacing:.1em;font-size:12.5px}
.act--solid:hover{transform:none;box-shadow:none;background:var(--accent-2)}

/* Requirement checks and figure cells pick up the square accent too. */
.reqs li::before{border-radius:0}
.fig-cell{border-right-color:var(--rule)}

@media(max-width:860px){
  .pf{border-right:0;border-bottom:1px solid var(--rule)}
}

