﻿: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:#33517e; --accent-2:#213655;
  --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: campus — editorial serif headline over a warm-dark
   hero photo, floating pill nav detached from the top edge, and
   the signature Checkpoint Track flipped to a white paper card
   (elevated with shadow, not dark glass) — reads as a school
   handout/syllabus rather than a dispatcher's board.
   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:#201a12; --slate-deep:#15110d; --slate-raise:#2b2319;
  --bg-rgb:32 26 18;
  --reflect:#f7f4ee; --haze:#c9beac; --haze-deep:#a89a83;
  --daylight:#faf7f0; --daylight-2:#efe9dd;
  --glass:rgba(247,244,238,.06);
  --radius:16px; --btn-radius:999px;
  --display:'Fraunces',serif;
}
/* --rule is scoped to .light sections only here (not :root) - campus is a
   light editorial reskin, but the base template still has dark sections
   (hero, phero, close band, footer) where a dark --rule value would make
   borders disappear against the dark background. */
.light{--rule:rgba(32,26,18,.13)}

/* Floating pill nav, detached from the top edge. */
.nav{padding-top:18px}
.nav.scrolled{background:transparent;border-color:transparent}
.nav-in{background:rgba(255,255,255,.94);backdrop-filter:blur(14px);border:1px solid rgba(32,26,18,.08);border-radius:999px;padding:12px 24px;box-shadow:0 12px 34px -16px rgba(32,26,18,.28)}
.nav-links a{color:#3a3325}
.nav-links a.active,.nav-links a:hover{color:var(--accent)}
.burger{color:#3a3325}
.wordmark .name{color:#241f16}
.wordmark .plate{color:var(--accent);border-color:var(--accent)}

/* Hero: serif italic headline, no sweep animation, warm-dark veil. */
.hero-sweep{display:none}
.hero h1{font-style:italic;font-weight:600}
.word-accent{font-style:italic}

/* Checkpoint Track flips to a white paper card - the signature
   structural change: elevated shadow instead of dark glass panel. */
.board{background:#fff;border:none;border-top:none;color:#241f16;box-shadow:0 30px 70px -30px rgba(32,26,18,.4);border-radius:20px;padding-top:0}
.sample-flag{background:var(--accent);color:#fff;top:-12px}
.board-head{color:#8a7f6c;border-bottom-color:rgba(32,26,18,.1)}
.lane{border-bottom-color:rgba(32,26,18,.08)}
.lane-route{color:#241f16;font-family:var(--display);font-style:italic;font-weight:600}
.lane-detail{color:#6b6152}
.board-foot{color:#8a7f6c}

/* Proof strip and programs: paper cards, soft shadow elevation. */
.proof{background:#fff;border-block:none}
.pf{border-right-color:rgba(32,26,18,.1)}
.pf b{color:#241f16}
.prog{background:#fff;border:none;border-top:none;border-radius:18px;box-shadow:0 1px 2px rgba(32,26,18,.06)}
.prog:hover{box-shadow:0 26px 50px -24px rgba(32,26,18,.24);transform:translateY(-4px)}
.prog h3{font-family:var(--display);font-style:italic;font-weight:600}

/* Section heads: serif italic. */
.sec-body h2,.close h2{font-family:var(--display);font-style:italic;font-weight:600}

/* Form cards get the paper-card treatment everywhere they appear - the
   actual inquiry/contact forms live in non-.light sections in the page
   markup, so this can't be scoped under .light or it never applies. */
.form-card{background:#fff;border:none;box-shadow:0 20px 50px -24px rgba(32,26,18,.22)}
.form-card h3{color:#241f16;font-family:var(--display);font-style:italic;font-weight:600}
.form-card .sub,.form-card .sub a{color:#8a7f6c}
.fld label{color:#8a7f6c}
.fld input,.fld select,.fld textarea{background:rgba(32,26,18,.04);color:#241f16;border-color:rgba(32,26,18,.14)}
.fld input:focus,.fld select:focus,.fld textarea:focus{border-color:var(--accent);background:rgba(32,26,18,.07)}
.light .partner-rows .v{color:#241f16}

@media(max-width:860px){
  .nav{padding-top:12px}
}

