/* ==========================================================================
   DRILL ZERO, landing page
   Flat. Hard lines. No radius, no shadows, no gradients, no glows.
   ========================================================================== */

:root {
  --worn-black: #0C0C0B;
  --black-2: #161614;
  --od-green: #4A5240;
  --od-deep: #343A2E;
  --coyote: #C9B99C;
  --bone: #EDEAE1;
  --orange: #E8641E;
  --line: #2A2A26;

  --font-display: 'Saira Stencil One', sans-serif;
  --font-cond: 'Barlow Condensed', sans-serif;
  --font-body: 'Barlow', sans-serif;
  --font-mono: 'IBM Plex Mono', monospace;

  --radius: 0;
  --header-h: 64px;
  --pad-x: 20px;
}

* { margin: 0; padding: 0; box-sizing: border-box; border-radius: 0; }

html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}

body {
  background: var(--worn-black);
  color: var(--bone);
  font-family: var(--font-body);
  font-size: 17px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

.mono { font-family: var(--font-mono); }

.sr-only {
  position: absolute; width: 1px; height: 1px;
  clip-path: inset(50%); overflow: hidden; white-space: nowrap;
}

.skip-link {
  position: absolute; left: -9999px; top: 0; z-index: 200;
  background: var(--bone); color: var(--worn-black);
  padding: 10px 16px; font-family: var(--font-mono); font-size: 13px;
}
.skip-link:focus { left: 0; }

a { color: inherit; }
:focus-visible { outline: 1px solid var(--bone); outline-offset: 3px; }

::selection { background: var(--coyote); color: var(--worn-black); }

/* --------------------------------------------------------------------------
   Slashed zero (wordmark only)
   -------------------------------------------------------------------------- */
.zero { position: relative; display: inline-block; letter-spacing: 0; }
.zero::after {
  content: ''; position: absolute; left: 50%; top: 50%;
  width: 0.62em; height: 0.045em; min-height: 2px;
  background: currentColor;
  transform: translate(-50%, -50%) rotate(-56deg);
}
.zero.orange::after { background: var(--orange); }

/* Restore the letter-space the span no longer carries */
.wordmark .zero { margin-right: 0.04em; }
.packet-top .zero { margin-right: 0.18em; }

/* --------------------------------------------------------------------------
   Header
   -------------------------------------------------------------------------- */
.site-header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  height: var(--header-h);
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 var(--pad-x);
  background: var(--worn-black);
  border-bottom: 1px solid var(--line);
}

.wordmark {
  font-family: var(--font-display);
  font-size: 24px;
  letter-spacing: 0.04em;
  color: var(--bone);
  text-decoration: none;
  line-height: 1;
}

.site-nav { display: none; }

.nav-toggle {
  display: flex; flex-direction: column; gap: 7px;
  background: none; border: 1px solid var(--line);
  width: 44px; height: 44px;
  align-items: center; justify-content: center;
  cursor: pointer;
}
.nav-toggle-bar {
  display: block; width: 20px; height: 1px;
  background: var(--bone);
  transition: transform 0.25s, opacity 0.25s;
}
.nav-toggle[aria-expanded="true"] .nav-toggle-bar:first-child { transform: translateY(4px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] .nav-toggle-bar:last-child { transform: translateY(-4px) rotate(-45deg); }

.mobile-menu[hidden] { display: none; }

.mobile-menu {
  position: fixed; inset: 0; z-index: 90;
  background: var(--worn-black);
  padding: calc(var(--header-h) + 40px) var(--pad-x) 40px;
  display: flex; flex-direction: column; justify-content: space-between;
}
.mobile-menu nav { display: flex; flex-direction: column; }
.mobile-menu nav a {
  font-family: var(--font-display);
  font-size: clamp(28px, 8vw, 44px);
  color: var(--bone);
  text-decoration: none;
  padding: 14px 0;
  border-bottom: 1px solid var(--line);
  line-height: 1.1;
}
.mobile-menu nav a:first-child { border-top: 1px solid var(--line); }
.mobile-menu-foot { color: var(--coyote); font-size: 12px; letter-spacing: 0.08em; }

@media (min-width: 880px) {
  :root { --pad-x: 48px; --header-h: 72px; }
  .nav-toggle, .mobile-menu { display: none; }
  .site-nav { display: flex; gap: 32px; }
  .site-nav a {
    font-family: var(--font-cond);
    font-weight: 600;
    font-size: 16px;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    color: var(--bone);
    text-decoration: none;
    padding: 4px 0;
    border-bottom: 1px solid transparent;
  }
  .site-nav a:hover { color: var(--coyote); border-bottom-color: var(--coyote); }
}

/* --------------------------------------------------------------------------
   Hero
   -------------------------------------------------------------------------- */
.hero {
  position: relative;
  min-height: 100svh;
  display: flex; align-items: center; justify-content: center;
  padding: calc(var(--header-h) + 48px) var(--pad-x) 96px;
  border-bottom: 1px solid var(--line);
  overflow: hidden;
}

.hero-canvas {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  display: block;
}

.hero-inner {
  position: relative; z-index: 2;
  max-width: 1080px;
  text-align: center;
}

.hero-title {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(38px, 9.2vw, 118px);
  line-height: 1.02;
  letter-spacing: 0.01em;
  color: var(--bone);
}

.h-line { display: block; overflow: hidden; }
.h-line-inner { display: block; }

.hero-sub {
  margin: 28px auto 0;
  max-width: 640px;
  color: var(--coyote);
  font-size: clamp(16px, 2vw, 19px);
  font-weight: 400;
}

.cta-row {
  margin-top: 40px;
  display: flex; gap: 14px; justify-content: center; flex-wrap: wrap;
}

.btn {
  display: inline-block;
  font-family: var(--font-cond);
  font-weight: 600;
  font-size: 17px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  text-decoration: none;
  padding: 15px 30px;
  border: 1px solid transparent;
  cursor: pointer;
  transition: background-color 0.18s, color 0.18s, border-color 0.18s;
}
.btn-primary {
  background: var(--orange);
  color: var(--worn-black);
  border-color: var(--orange);
}
.btn-primary:hover { background: var(--bone); border-color: var(--bone); }
.btn-ghost {
  background: transparent;
  color: var(--bone);
  border-color: var(--bone);
}
.btn-ghost:hover { background: var(--bone); color: var(--worn-black); }

.hero-meta {
  position: absolute; inset: 0; z-index: 1;
  pointer-events: none;
  font-size: 11px;
  letter-spacing: 0.08em;
  line-height: 1.7;
  color: var(--coyote);
}
.hero-meta > span { position: absolute; }
.hero-meta-tl { top: calc(var(--header-h) + 20px); left: var(--pad-x); }
.hero-meta-tr { top: calc(var(--header-h) + 20px); right: var(--pad-x); text-align: right; }
.hero-meta-bl { bottom: 24px; left: var(--pad-x); }
.hero-meta-br { bottom: 24px; right: var(--pad-x); text-align: right; }
.hero-meta .tick { display: inline-block; }

@media (max-width: 620px) {
  .hero-meta-br { display: none; }
  .hero-meta-tr { display: none; }
}

/* --------------------------------------------------------------------------
   Ticker
   -------------------------------------------------------------------------- */
.ticker {
  border-bottom: 1px solid var(--line);
  overflow: hidden;
  background: var(--worn-black);
}
.ticker-track {
  display: flex; width: max-content;
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: 0.14em;
  color: var(--coyote);
  padding: 13px 0;
  animation: ticker-scroll 150s linear infinite;
  white-space: nowrap;
}
@keyframes ticker-scroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
  .ticker-track { animation: none; }
}

/* --------------------------------------------------------------------------
   Sections, shared
   -------------------------------------------------------------------------- */
.section { padding: 88px var(--pad-x); }

.section-head { max-width: 1080px; margin: 0 auto 56px; }

.sec-label {
  font-size: 12px;
  letter-spacing: 0.16em;
  color: var(--coyote);
  margin-bottom: 20px;
}
.sec-num { color: var(--orange); }

.section-title {
  font-family: var(--font-cond);
  font-weight: 700;
  font-size: clamp(34px, 5.4vw, 60px);
  line-height: 1.04;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  color: var(--bone);
}

.section-intro {
  margin-top: 18px;
  max-width: 560px;
  color: var(--coyote);
}

/* --------------------------------------------------------------------------
   SEC 01, Phases
   -------------------------------------------------------------------------- */
.section-program { border-bottom: 1px solid var(--line); }

.phases {
  list-style: none;
  max-width: 1080px;
  margin: 0 auto;
  border-top: 1px solid var(--line);
}

.phase {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  padding: 28px 0;
  border-bottom: 1px solid var(--line);
}

.phase-code {
  font-size: 12px;
  letter-spacing: 0.16em;
  color: var(--coyote);
}

.phase-title {
  font-family: var(--font-cond);
  font-weight: 700;
  font-size: clamp(28px, 4.4vw, 44px);
  line-height: 1;
  text-transform: uppercase;
  color: var(--bone);
}

.phase-body { color: var(--coyote); max-width: 560px; }

.phase-05 {
  background: var(--od-deep);
  padding-left: 20px; padding-right: 20px;
  margin: 0 -20px;
}
.phase-05 .phase-body { color: var(--bone); }

@media (min-width: 880px) {
  .phase {
    grid-template-columns: 140px 1fr 1.2fr;
    gap: 32px;
    align-items: baseline;
    padding: 36px 0;
  }
  .phase-05 { padding-left: 32px; padding-right: 32px; margin: 0 -32px; }
}

/* --------------------------------------------------------------------------
   SEC 02, Stance
   -------------------------------------------------------------------------- */
.section-stance {
  background: var(--od-green);
  border-bottom: 1px solid var(--line);
}
.stance-inner { max-width: 1080px; margin: 0 auto; }

.sec-label-onOD { color: var(--bone); }
.sec-label-onOD .sec-num { color: var(--worn-black); }

.stance-title {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(30px, 6vw, 72px);
  line-height: 1.05;
  color: var(--bone);
  margin-bottom: 36px;
}

.stance-cols {
  display: grid; grid-template-columns: 1fr; gap: 20px;
  max-width: 900px;
}
.stance-body { color: var(--bone); }

.founding-line {
  margin: 56px 0;
  font-family: var(--font-display);
  font-size: clamp(24px, 3.6vw, 40px);
  line-height: 1.2;
  color: var(--worn-black);
}

@media (min-width: 880px) {
  .stance-cols { grid-template-columns: 1fr 1fr; gap: 48px; }
}

/* --------------------------------------------------------------------------
   Photo placeholders
   -------------------------------------------------------------------------- */
.photo-block {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 7;
  display: flex; align-items: flex-end;
  border: 1px solid var(--line);
}
.photo-block-coyote { background: var(--coyote); }
.photo-block-od { background: var(--od-deep); aspect-ratio: 16 / 8; }

.photo-caption {
  font-size: 11px;
  letter-spacing: 0.14em;
  padding: 12px 14px;
}
.photo-block-coyote .photo-caption { color: var(--worn-black); }
.photo-block-od .photo-caption { color: var(--coyote); }

/* --------------------------------------------------------------------------
   SEC 03, Status
   -------------------------------------------------------------------------- */
.section-status {
  border-bottom: 1px solid var(--line);
  max-width: none;
}
.section-status .sec-label { max-width: 1080px; margin-left: auto; margin-right: auto; margin-bottom: 20px; }

.status-strip {
  max-width: 1080px;
  margin: 0 auto;
  display: flex; flex-wrap: wrap; align-items: center; gap: 18px;
  border: 1px solid var(--line);
  background: var(--black-2);
  padding: 26px 24px;
}

.chip {
  font-size: 12px;
  letter-spacing: 0.14em;
  padding: 6px 12px;
  border: 1px solid var(--line);
  white-space: nowrap;
}
.chip-progress { color: var(--orange); border-color: var(--orange); }

.status-line {
  font-family: var(--font-cond);
  font-weight: 600;
  font-size: clamp(20px, 3vw, 28px);
  line-height: 1.2;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.status-note {
  max-width: 1080px;
  margin: 16px auto 0;
  font-size: 11px;
  letter-spacing: 0.1em;
  color: var(--coyote);
}

/* --------------------------------------------------------------------------
   SEC 04, Start (packet + drills)
   -------------------------------------------------------------------------- */
.start-grid {
  max-width: 1080px;
  margin: 0 auto;
  display: grid; grid-template-columns: 1fr; gap: 24px;
}

.start-panel {
  background: var(--black-2);
  border: 1px solid var(--line);
  padding: 32px 24px;
  scroll-margin-top: calc(var(--header-h) + 16px);
}

.panel-title {
  font-family: var(--font-cond);
  font-weight: 700;
  font-size: clamp(26px, 3.6vw, 36px);
  text-transform: uppercase;
  line-height: 1.05;
  margin-bottom: 14px;
}

.panel-body { color: var(--coyote); max-width: 520px; }

.panel-meta {
  margin-top: 14px;
  font-size: 11px;
  letter-spacing: 0.12em;
  color: var(--coyote);
}

@media (min-width: 880px) {
  .start-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
  .start-panel { padding: 44px 40px; }
}

/* Packet cover replica */
.packet-cover {
  margin: 28px 0 8px;
  border: 1px solid var(--bone);
  background: var(--worn-black);
  padding: 26px 22px;
  display: flex; flex-direction: column; gap: 18px;
}
.packet-top {
  font-size: 10px; letter-spacing: 0.18em; color: var(--coyote);
}
.packet-zero-top::after { background: var(--orange); }
.packet-title {
  font-family: var(--font-display);
  font-size: clamp(34px, 5vw, 52px);
  line-height: 1;
  color: var(--bone);
}
.packet-sub {
  font-family: var(--font-cond);
  font-weight: 600;
  font-size: 15px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--bone);
}
.packet-foot {
  font-size: 9px; letter-spacing: 0.16em; color: var(--coyote);
  border-top: 1px solid var(--line);
  padding-top: 14px;
}

/* Forms */
.dz-form { margin-top: 28px; border-top: 1px solid var(--line); padding-top: 22px; }

.form-label {
  font-size: 11px; letter-spacing: 0.16em; color: var(--coyote);
  margin-bottom: 16px;
}

.form-grid {
  display: grid; grid-template-columns: 1fr; gap: 14px;
  margin-bottom: 18px;
}
@media (min-width: 560px) {
  .form-grid { grid-template-columns: 1fr 1fr; }
}

.dz-form label {
  display: flex; flex-direction: column; gap: 6px;
  font-family: var(--font-cond);
  font-weight: 600;
  font-size: 13px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--bone);
}

.dz-form input {
  background: var(--worn-black);
  border: 1px solid var(--line);
  color: var(--bone);
  font-family: var(--font-body);
  font-size: 16px;
  padding: 11px 12px;
  width: 100%;
}
.dz-form input:focus { outline: none; border-color: var(--bone); }
.dz-form input.invalid { border-color: var(--orange); }

.parent-fields { border-top: 1px solid var(--line); padding-top: 16px; margin-bottom: 4px; }
.parent-note { color: var(--coyote); font-size: 14px; margin-bottom: 14px; }

.form-error { margin-top: 14px; font-size: 11px; letter-spacing: 0.1em; color: var(--orange); }
.form-success { margin-top: 14px; font-size: 12px; letter-spacing: 0.1em; color: var(--bone); background: var(--od-deep); padding: 12px 14px; }

/* --------------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------------- */
.site-footer {
  border-top: 1px solid var(--line);
  padding: 56px var(--pad-x) 40px;
  color: var(--coyote);
}
.footer-top {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 16px;
  max-width: 1080px; margin: 0 auto 28px;
}
.wordmark-footer { font-size: 20px; }
.footer-tag { font-family: var(--font-cond); font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em; font-size: 15px; }

.footer-status, .footer-disclaimer, .footer-legal {
  max-width: 1080px;
  margin: 0 auto 14px;
  font-size: 11px;
  letter-spacing: 0.06em;
  line-height: 1.8;
}
.footer-disclaimer { border-top: 1px solid var(--line); padding-top: 18px; margin-top: 18px; }
.footer-legal { margin-bottom: 0; }

/* --------------------------------------------------------------------------
   Reveal defaults (JS enhances; without JS everything stays visible)
   -------------------------------------------------------------------------- */
.js .reveal { opacity: 0; }
.js .h-line-inner { transform: translateY(110%); }

@media (prefers-reduced-motion: reduce) {
  .js .reveal { opacity: 1; }
  .js .h-line-inner { transform: none; }
}

/* --------------------------------------------------------------------------
   Interior pages (drills)
   -------------------------------------------------------------------------- */
.page-main { padding-top: var(--header-h); }

.page-hero {
  padding: 72px var(--pad-x) 64px;
  border-bottom: 1px solid var(--line);
}
.page-hero .sec-label { max-width: 1080px; margin-left: auto; margin-right: auto; }

.page-title {
  max-width: 1080px;
  margin: 0 auto;
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(32px, 6.4vw, 84px);
  line-height: 1.04;
  color: var(--bone);
}

.page-intro {
  max-width: 1080px;
  margin: 22px auto 0;
  color: var(--coyote);
  font-size: clamp(16px, 2vw, 19px);
}
@media (min-width: 880px) { .page-intro { max-width: 1080px; } .page-intro { padding-right: 30%; } }

/* Two tiers */
.section-tiers { border-bottom: 1px solid var(--line); }
.tier-grid {
  max-width: 1080px; margin: 0 auto;
  display: grid; grid-template-columns: 1fr; gap: 24px;
}
@media (min-width: 880px) { .tier-grid { grid-template-columns: 1fr 1fr; gap: 32px; } }

.tier-card {
  background: var(--black-2);
  border: 1px solid var(--line);
  padding: 28px 24px;
}
.tier-card-drill { border-color: var(--bone); }

.tier-chips { display: flex; gap: 8px; margin-bottom: 18px; flex-wrap: wrap; }

.chip-type { font-size: 11px; letter-spacing: 0.14em; color: var(--bone); border-color: var(--bone); }
.chip-dim { color: var(--coyote); border-color: var(--line); }

.tier-title {
  font-family: var(--font-cond);
  font-weight: 700;
  font-size: clamp(22px, 3vw, 30px);
  text-transform: uppercase;
  margin-bottom: 10px;
}
.tier-body { color: var(--coyote); }

.tier-note {
  max-width: 1080px;
  margin: 22px auto 0;
  font-size: 11px;
  letter-spacing: 0.12em;
  color: var(--coyote);
}

/* Schedule */
.section-sched { border-bottom: 1px solid var(--line); }
.sched-disclaimer {
  margin-top: 14px;
  font-size: 11px;
  letter-spacing: 0.12em;
  color: var(--coyote);
}

.sched {
  list-style: none;
  max-width: 1080px;
  margin: 0 auto;
  border-top: 1px solid var(--line);
}

.sched-row {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
  padding: 26px 0;
  border-bottom: 1px solid var(--line);
}

.sched-row-drill {
  background: var(--black-2);
  padding-left: 20px; padding-right: 20px;
  margin: 0 -20px;
}

.sched-when { display: flex; gap: 16px; align-items: baseline; }
.sched-date { font-size: 13px; letter-spacing: 0.12em; color: var(--bone); }
.sched-time { font-size: 13px; letter-spacing: 0.12em; color: var(--coyote); }

.sched-info { display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }

.sched-flag {
  font-size: 10px; letter-spacing: 0.16em;
  color: var(--orange);
  border: 1px solid var(--orange);
  padding: 4px 8px;
}

.sched-title {
  font-family: var(--font-cond);
  font-weight: 700;
  font-size: clamp(22px, 3.2vw, 32px);
  line-height: 1;
  text-transform: uppercase;
  color: var(--bone);
}

.sched-loc { color: var(--coyote); font-size: 15px; }
.sched-agenda { font-size: 11px; letter-spacing: 0.1em; color: var(--coyote); line-height: 1.8; }

.btn-rsvp { justify-self: start; padding: 12px 26px; font-size: 15px; }

.rsvp-panel { border-top: 1px solid var(--line); padding-top: 4px; }
.rsvp-panel[hidden] { display: none; }
.rsvp-panel .dz-form { border-top: none; }

@media (min-width: 880px) {
  .sched-row {
    grid-template-columns: 170px 1fr auto;
    gap: 28px;
    align-items: start;
    padding: 32px 0;
  }
  .sched-row-drill { padding-left: 28px; padding-right: 28px; margin: 0 -28px; }
  .sched-when { flex-direction: column; gap: 4px; }
  .rsvp-panel { grid-column: 1 / -1; }
}

/* What to expect */
.section-expect { border-bottom: 1px solid var(--line); }
.expect-grid {
  max-width: 1080px; margin: 0 auto;
  display: grid; grid-template-columns: 1fr; gap: 20px;
}
@media (min-width: 880px) { .expect-grid { grid-template-columns: 1fr 1fr 1fr; gap: 28px; } }

.expect-card { border: 1px solid var(--line); padding: 24px 22px; background: var(--black-2); }
.expect-code { font-size: 11px; letter-spacing: 0.16em; color: var(--coyote); margin-bottom: 12px; }
.expect-title {
  font-family: var(--font-cond);
  font-weight: 700;
  font-size: 24px;
  text-transform: uppercase;
  margin-bottom: 10px;
}
.expect-body { color: var(--coyote); font-size: 15px; }

.expect-meta {
  max-width: 1080px;
  margin: 28px auto 0;
  display: flex; flex-direction: column; gap: 12px;
}
.expect-bring { color: var(--coyote); }
.expect-bring-label { color: var(--bone); font-size: 11px; letter-spacing: 0.14em; margin-right: 10px; }
.expect-cost { font-size: 12px; letter-spacing: 0.14em; color: var(--bone); background: var(--od-deep); padding: 12px 16px; align-self: flex-start; }

/* Page CTA */
.page-cta {
  max-width: 1080px; margin: 0 auto;
  display: flex; flex-direction: column; gap: 20px; align-items: flex-start;
}
.page-cta-line {
  font-family: var(--font-cond);
  font-weight: 600;
  font-size: clamp(20px, 2.6vw, 26px);
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

/* Schedule link on home drill panel */
.panel-link-row { margin-top: 16px; }
.sched-link {
  font-size: 12px;
  letter-spacing: 0.14em;
  color: var(--bone);
  text-decoration: none;
  border-bottom: 1px solid var(--coyote);
  padding-bottom: 3px;
}
.sched-link:hover { color: var(--coyote); }

/* Real photo blocks (temp comps until program photos are shot) */
.photo-block-img {
  background: var(--black-2);
  overflow: hidden;
}
.photo-block-img img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
  filter: grayscale(12%) contrast(1.02);
}
.photo-caption-chip {
  position: relative;
  background: var(--worn-black);
  color: var(--coyote);
  padding: 10px 14px;
  margin: 0 0 14px 14px;
}

/* --------------------------------------------------------------------------
   Timeline (Where We Are)
   -------------------------------------------------------------------------- */
.section-timeline { border-bottom: 1px solid var(--line); }

.timeline {
  list-style: none;
  position: relative;
  max-width: 860px;
  margin: 0 auto;
  padding: 8px 0;
}

.timeline-rail {
  position: absolute;
  top: 0; bottom: 0;
  left: 5px;
  width: 1px;
  background: var(--line);
}
.timeline-progress {
  position: absolute; inset: 0;
  background: var(--coyote);
  transform: scaleY(0);
  transform-origin: top;
}

.tl-entry {
  position: relative;
  display: grid;
  grid-template-columns: 32px 1fr;
  padding: 26px 0;
}

.tl-node {
  width: 11px; height: 11px;
  margin-top: 6px;
  background: var(--worn-black);
  border: 1px solid var(--coyote);
  justify-self: start;
}
.tl-node-done { background: var(--od-deep); border-color: var(--bone); }
.tl-node-active { background: var(--worn-black); border-color: var(--orange); }

.tl-meta {
  display: flex; align-items: center; gap: 12px;
  margin-bottom: 10px;
}
.tl-num { font-size: 12px; letter-spacing: 0.16em; color: var(--coyote); }

.tl-chip { font-size: 11px; letter-spacing: 0.14em; padding: 5px 10px; }
.tl-chip-complete { color: var(--bone); background: var(--od-deep); border-color: var(--od-deep); }
.tl-chip-progress { color: var(--orange); border-color: var(--orange); }
.tl-chip-next { color: var(--coyote); border-color: var(--line); }

.tl-title {
  font-family: var(--font-cond);
  font-weight: 700;
  font-size: clamp(24px, 3.4vw, 34px);
  line-height: 1.05;
  text-transform: uppercase;
  color: var(--bone);
  margin-bottom: 8px;
}

.tl-body { color: var(--coyote); max-width: 560px; }

@media (min-width: 880px) {
  .timeline-rail { left: 5px; }
  .tl-entry { grid-template-columns: 44px 1fr; padding: 32px 0; }
}

.cta-row-left { justify-content: flex-start; margin-top: 0; }

.status-link-row { max-width: 1080px; margin: 20px auto 0; }

/* --------------------------------------------------------------------------
   Training calendar (drills)
   -------------------------------------------------------------------------- */
.section-cal { border-bottom: 1px solid var(--line); }
.cal { max-width: 1080px; margin: 0 auto; }

.cal-tabs {
  display: flex;
  border: 1px solid var(--line);
  width: max-content;
  margin-bottom: 28px;
}
.cal-tab {
  font-size: 12px;
  letter-spacing: 0.14em;
  padding: 11px 20px;
  background: transparent;
  color: var(--coyote);
  border: none;
  border-right: 1px solid var(--line);
  cursor: pointer;
}
.cal-tab:last-child { border-right: none; }
.cal-tab[aria-selected="true"] { background: var(--black-2); color: var(--bone); }

.cal-head {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  font-size: 10px;
  letter-spacing: 0.14em;
  color: var(--coyote);
}
.cal-head span { padding: 0 0 10px 10px; }

.cal-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.cal-cell {
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  min-height: 108px;
  padding: 8px;
}
.cal-cell-empty { background: var(--black-2); }

.cal-day {
  display: block;
  font-size: 10px;
  letter-spacing: 0.1em;
  color: var(--coyote);
  margin-bottom: 6px;
}
.cal-cell-today .cal-day { color: var(--orange); }

.cal-ev {
  display: block;
  width: 100%;
  text-align: left;
  font-size: 10px;
  letter-spacing: 0.1em;
  color: var(--coyote);
  background: transparent;
  border: 1px solid var(--line);
  padding: 5px 7px;
  margin-top: 4px;
  cursor: pointer;
}
.cal-ev:hover { border-color: var(--coyote); color: var(--bone); }
.cal-ev-drill {
  background: var(--od-deep);
  border-color: var(--bone);
  color: var(--bone);
}

.cal-legend {
  max-width: 1080px;
  margin: 20px auto 0;
  font-size: 11px;
  letter-spacing: 0.12em;
  color: var(--coyote);
}

.row-target { outline: 1px solid var(--coyote); outline-offset: 5px; }

@media (max-width: 879px) {
  .cal-cell { min-height: 64px; padding: 5px; }
  .cal-head span { padding-left: 5px; font-size: 9px; }
  .cal-day { font-size: 9px; }
  .cal-cell-today .cal-day { overflow: hidden; white-space: nowrap; }
  .cal-ev {
    width: 12px; height: 12px;
    padding: 0;
    display: inline-block;
    margin-right: 3px;
  }
  .cal-ev .cal-ev-label { display: none; }
  .cal-ev-drill { width: 14px; height: 14px; }
}

/* --------------------------------------------------------------------------
   Landing clarity: kicker, next-up line, baseline strip, footer nav
   -------------------------------------------------------------------------- */
.hero-kicker {
  font-size: 12px;
  letter-spacing: 0.18em;
  color: var(--coyote);
  margin-bottom: 22px;
}

.hero-next { margin-top: 26px; }
.hero-next-link {
  font-size: 12px;
  letter-spacing: 0.12em;
  color: var(--bone);
  text-decoration: none;
  border: 1px solid var(--line);
  padding: 10px 16px;
  display: inline-block;
}
.hero-next-link:hover { border-color: var(--coyote); color: var(--coyote); }

/* Baseline strip */
.section-baseline {
  background: var(--black-2);
  border-bottom: 1px solid var(--line);
}
.baseline-points {
  list-style: none;
  max-width: 1080px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr;
  border-top: 1px solid var(--line);
}
.baseline-point {
  display: grid;
  grid-template-columns: 72px 1fr;
  gap: 16px;
  align-items: baseline;
  padding: 18px 0;
  border-bottom: 1px solid var(--line);
}
.baseline-code {
  font-size: 11px;
  letter-spacing: 0.16em;
  color: var(--coyote);
}
.baseline-point p { color: var(--bone); max-width: 640px; }

.baseline-status {
  max-width: 1080px;
  margin: 22px auto 0;
  font-size: 11px;
  letter-spacing: 0.14em;
  color: var(--coyote);
}

@media (min-width: 880px) {
  .baseline-points { grid-template-columns: 1fr 1fr; column-gap: 48px; }
  .baseline-point:nth-last-child(-n+2) { }
}

/* Next-3 mini list on home drill panel */
.next-list {
  list-style: none;
  margin: 24px 0;
  border-top: 1px solid var(--line);
}
.next-list li { border-bottom: 1px solid var(--line); }
.next-list a {
  display: block;
  padding: 12px 2px;
  font-size: 12px;
  letter-spacing: 0.1em;
  color: var(--coyote);
  text-decoration: none;
}
.next-list a:hover { color: var(--bone); }

/* Footer nav */
.footer-nav {
  max-width: 1080px;
  margin: 0 auto 22px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px 26px;
  font-size: 11px;
  letter-spacing: 0.14em;
}
.footer-nav a {
  color: var(--coyote);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  padding-bottom: 2px;
}
.footer-nav a:hover { color: var(--bone); border-bottom-color: var(--coyote); }

/* --------------------------------------------------------------------------
   About page
   -------------------------------------------------------------------------- */
.dz-form textarea {
  background: var(--worn-black);
  border: 1px solid var(--line);
  color: var(--bone);
  font-family: var(--font-body);
  font-size: 16px;
  padding: 11px 12px;
  width: 100%;
  min-height: 130px;
  resize: vertical;
}
.dz-form textarea:focus { outline: none; border-color: var(--bone); }
.form-grid-full { grid-column: 1 / -1; }

.about-rows {
  list-style: none;
  max-width: 1080px;
  margin: 0 auto;
  border-top: 1px solid var(--line);
}
.about-row {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  padding: 24px 0;
  border-bottom: 1px solid var(--line);
}
.about-row-label {
  font-family: var(--font-cond);
  font-weight: 700;
  font-size: clamp(20px, 2.6vw, 26px);
  text-transform: uppercase;
  line-height: 1.05;
  color: var(--bone);
}
.about-row-line { color: var(--coyote); max-width: 640px; }
@media (min-width: 880px) {
  .about-row { grid-template-columns: 320px 1fr; gap: 32px; align-items: baseline; padding: 30px 0; }
}

.about-block {
  max-width: 1080px;
  margin: 0 auto;
  padding: 56px 0;
  border-bottom: 1px solid var(--line);
}
.about-block:last-child { border-bottom: none; }
.about-block-title {
  font-family: var(--font-cond);
  font-weight: 700;
  font-size: clamp(26px, 3.6vw, 40px);
  text-transform: uppercase;
  line-height: 1.05;
  margin-bottom: 16px;
}
.about-block p { color: var(--coyote); max-width: 680px; margin-bottom: 14px; }
.about-block p:last-child { margin-bottom: 0; }
.about-block .mono-note {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.12em;
  color: var(--coyote);
  margin-top: 18px;
}
.fund-flag {
  display: inline-block;
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.14em;
  color: var(--bone);
  background: var(--od-deep);
  padding: 8px 12px;
  margin-bottom: 16px;
}

.inline-link { color: var(--bone); text-decoration: none; border-bottom: 1px solid var(--coyote); }
.inline-link:hover { color: var(--coyote); }
.dz-form textarea.invalid { border-color: var(--orange); }

/* --------------------------------------------------------------------------
   Schoolhouse: field-note cards + articles + pulse check
   -------------------------------------------------------------------------- */
.note-grid {
  max-width: 1080px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
}
@media (min-width: 880px) { .note-grid { grid-template-columns: 1fr 1fr 1fr; gap: 28px; } }

.note-card {
  display: flex;
  flex-direction: column;
  gap: 12px;
  background: var(--od-deep);
  border: 1px solid var(--line);
  padding: 26px 22px;
  text-decoration: none;
  color: var(--bone);
  min-height: 240px;
  transition: border-color 0.18s;
}
.note-card:hover { border-color: var(--bone); }

.note-code {
  font-size: 10px;
  letter-spacing: 0.18em;
  color: var(--coyote);
  border-bottom: 1px solid var(--line);
  padding-bottom: 12px;
}
.note-title {
  font-family: var(--font-cond);
  font-weight: 700;
  font-size: 26px;
  line-height: 1.05;
  text-transform: uppercase;
}
.note-sub { color: var(--coyote); font-size: 15px; flex-grow: 1; }
.note-foot { font-size: 10px; letter-spacing: 0.14em; color: var(--coyote); }

.note-more {
  max-width: 1080px;
  margin: 26px auto 0;
  font-size: 11px;
  letter-spacing: 0.12em;
  color: var(--coyote);
}

.crumb { color: var(--coyote); text-decoration: none; }
.crumb:hover { color: var(--bone); }

.article-meta {
  max-width: 1080px;
  margin: 18px auto 0;
  font-size: 11px;
  letter-spacing: 0.14em;
  color: var(--coyote);
}

.article-inner { max-width: 720px; margin: 0 auto; }
.article h2 {
  font-family: var(--font-cond);
  font-weight: 700;
  font-size: clamp(22px, 2.8vw, 28px);
  text-transform: uppercase;
  margin: 36px 0 12px;
}
.article-inner > h2:first-child { margin-top: 0; }
.article p { color: var(--bone); margin-bottom: 14px; }
.article-list {
  list-style: none;
  margin: 14px 0 18px;
  border-top: 1px solid var(--line);
}
.article-list li {
  display: flex;
  gap: 16px;
  align-items: baseline;
  padding: 10px 0;
  border-bottom: 1px solid var(--line);
  color: var(--bone);
}
.li-key {
  min-width: 64px;
  font-size: 11px;
  letter-spacing: 0.14em;
  color: var(--coyote);
}

.command-note {
  border: 1px solid var(--line);
  background: var(--black-2);
  padding: 20px 22px;
  margin-bottom: 32px;
}
.command-note-label {
  font-size: 11px;
  letter-spacing: 0.16em;
  color: var(--orange);
  margin-bottom: 10px;
}
.command-note p:last-child { color: var(--coyote); margin-bottom: 0; }

.article-sources {
  margin-top: 40px;
  font-size: 10px;
  letter-spacing: 0.12em;
  color: var(--coyote);
  border-top: 1px solid var(--line);
  padding-top: 16px;
  line-height: 1.9;
}
.article-back { margin-top: 22px; }

/* --------------------------------------------------------------------------
   Zero Packet page
   -------------------------------------------------------------------------- */
.doc-list {
  list-style: none;
  max-width: 1080px;
  margin: 0 auto;
  border-top: 1px solid var(--line);
}
.doc-list li {
  display: grid;
  grid-template-columns: 96px 1fr;
  gap: 18px;
  align-items: baseline;
  padding: 16px 0;
  border-bottom: 1px solid var(--line);
  color: var(--bone);
}
.doc-key { font-size: 11px; letter-spacing: 0.16em; color: var(--coyote); }

.zp-grid {
  max-width: 1080px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr;
  gap: 32px;
  align-items: center;
}
@media (min-width: 880px) { .zp-grid { grid-template-columns: 1fr 1fr; gap: 56px; } }

/* --------------------------------------------------------------------------
   Program page
   -------------------------------------------------------------------------- */
.program-phase {
  max-width: 1080px;
  margin: 0 auto;
  padding: 44px 0;
  border-bottom: 1px solid var(--line);
}
.program-phase:last-child { border-bottom: none; }
.program-phase .phase-code { margin-bottom: 10px; }
.pp-title {
  font-family: var(--font-cond);
  font-weight: 700;
  font-size: clamp(30px, 4.4vw, 48px);
  line-height: 1;
  text-transform: uppercase;
  margin-bottom: 14px;
}
.pp-body { color: var(--coyote); max-width: 680px; margin-bottom: 12px; }
.program-phase .photo-block { margin-top: 24px; max-width: 680px; aspect-ratio: 16 / 6; }
.program-phase-05 {
  background: var(--od-deep);
  padding-left: 24px; padding-right: 24px;
  margin-left: -24px; margin-right: -24px;
  max-width: calc(1080px + 48px);
}
@media (min-width: 1128px) { .program-phase-05 { margin-left: auto; margin-right: auto; } }
.program-phase-05 .pp-body { color: var(--bone); }

/* --------------------------------------------------------------------------
   Baseline page
   -------------------------------------------------------------------------- */
.bl-grid {
  max-width: 1080px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
}
@media (min-width: 880px) { .bl-grid { grid-template-columns: 1fr 1fr 1fr; gap: 28px; } }

.bl-card {
  display: flex;
  flex-direction: column;
  gap: 14px;
  background: var(--black-2);
  border: 1px solid var(--line);
  padding: 26px 22px;
  min-height: 260px;
}
.bl-id { font-size: 10px; letter-spacing: 0.18em; color: var(--coyote); }
.bl-title {
  font-family: var(--font-display);
  font-size: clamp(24px, 2.4vw, 30px);
  line-height: 1.1;
  color: var(--bone);
}
.bl-bar { display: block; width: 62%; height: 8px; background: var(--orange); }
.bl-foot { font-size: 10px; letter-spacing: 0.14em; color: var(--coyote); flex-grow: 1; }
.bl-status {
  font-size: 9px; letter-spacing: 0.14em; color: var(--bone);
  border-top: 1px solid var(--line);
  padding-top: 12px;
}

/* --------------------------------------------------------------------------
   Sponsors page
   -------------------------------------------------------------------------- */
.tier4-grid {
  max-width: 1080px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
}
@media (min-width: 880px) { .tier4-grid { grid-template-columns: 1fr 1fr; gap: 28px; } }
.tier-cadence { font-size: 11px; letter-spacing: 0.16em; color: var(--coyote); margin-bottom: 12px; }

.dz-form select {
  background: var(--worn-black);
  border: 1px solid var(--line);
  color: var(--bone);
  font-family: var(--font-body);
  font-size: 16px;
  padding: 11px 12px;
  width: 100%;
  appearance: none;
}
.dz-form select:focus { outline: none; border-color: var(--bone); }
.dz-form select.invalid { border-color: var(--orange); }

/* --------------------------------------------------------------------------
   Light register (The Watch)
   -------------------------------------------------------------------------- */
body.light { background: var(--bone); color: var(--worn-black); }
body.light .site-header,
body.light .mobile-menu { background: var(--bone); }
body.light .site-header { border-bottom-color: #D6CFC0; }
body.light .wordmark, body.light .site-nav a, body.light .mobile-menu nav a { color: var(--worn-black); }
body.light .site-nav a:hover { color: var(--od-deep); border-bottom-color: var(--od-deep); }
body.light .nav-toggle { border-color: #D6CFC0; }
body.light .nav-toggle-bar { background: var(--worn-black); }
body.light .mobile-menu nav a { border-bottom-color: #D6CFC0; }
body.light .mobile-menu nav a:first-child { border-top-color: #D6CFC0; }
body.light .mobile-menu-foot { color: var(--od-deep); }
body.light .zero.orange::after { background: var(--worn-black); }
body.light .sec-label { color: var(--od-deep); }
body.light .sec-num { color: var(--orange); }
body.light .page-intro { color: var(--od-deep); }
body.light .about-block-title { color: var(--worn-black); }
body.light .about-block p { color: #3A382F; }
body.light .about-block { border-bottom-color: #D6CFC0; }
body.light .inline-link { color: var(--worn-black); border-bottom-color: var(--od-green); }
body.light .inline-link:hover { color: var(--od-deep); }
body.light .page-hero { border-bottom-color: #D6CFC0; }
body.light .photo-block { border-color: #D6CFC0; }
body.light .site-footer { border-top-color: #D6CFC0; color: var(--od-deep); }
body.light .site-footer .wordmark { color: var(--worn-black); }
body.light .footer-nav a { color: var(--od-deep); }
body.light .footer-nav a:hover { color: var(--worn-black); border-bottom-color: var(--od-deep); }
body.light .footer-disclaimer { border-top-color: #D6CFC0; }
body.light .footer-tag { color: var(--worn-black); }

.watch-title {
  max-width: 1080px;
  margin: 0 auto;
  font-family: var(--font-cond);
  font-weight: 700;
  font-size: clamp(34px, 6vw, 72px);
  line-height: 1.02;
  text-transform: uppercase;
  color: var(--worn-black);
}
.watch-status {
  font-size: 11px;
  letter-spacing: 0.14em;
  color: var(--worn-black);
  background: #DDD6C6;
  padding: 10px 14px;
  display: inline-block;
  margin-bottom: 14px;
}

/* --------------------------------------------------------------------------
   Home: What Drill Zero Is strip
   -------------------------------------------------------------------------- */
.section-whatis { border-bottom: 1px solid var(--line); }

.whatis-statement {
  font-family: var(--font-cond);
  font-weight: 600;
  font-size: clamp(22px, 3.2vw, 34px);
  line-height: 1.3;
  color: var(--bone);
  max-width: 880px;
  text-transform: none;
  letter-spacing: 0.01em;
}

.whatis-grid {
  list-style: none;
  max-width: 1080px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr;
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}
.whatis-cell {
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  padding: 20px 18px;
  background: var(--black-2);
}
.whatis-label {
  display: block;
  font-size: 11px;
  letter-spacing: 0.16em;
  color: var(--coyote);
  margin-bottom: 10px;
}
.whatis-cell p { color: var(--bone); font-size: 15px; line-height: 1.5; }

@media (min-width: 640px) { .whatis-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1000px) { .whatis-grid { grid-template-columns: repeat(5, 1fr); } .whatis-cell { padding: 22px 16px; } .whatis-cell p { font-size: 14px; } }

/* --------------------------------------------------------------------------
   Home: the long game loop
   -------------------------------------------------------------------------- */
.loop-grid {
  list-style: none;
  max-width: 1080px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr;
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
  counter-reset: loop;
}
.loop-cell {
  position: relative;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  padding: 20px 18px;
  background: var(--worn-black);
}
.loop-code {
  display: block;
  font-size: 11px;
  letter-spacing: 0.16em;
  color: var(--coyote);
  margin-bottom: 10px;
}
.loop-cell p { color: var(--bone); font-size: 15px; line-height: 1.5; }
.loop-note {
  max-width: 1080px;
  margin: 20px auto 0;
  font-size: 11px;
  letter-spacing: 0.12em;
  color: var(--coyote);
}
@media (min-width: 880px) {
  .loop-grid { grid-template-columns: repeat(4, 1fr); }
  .loop-cell { padding: 22px 18px; }
}

/* --------------------------------------------------------------------------
   Flow pass: ticker label, router, program index, nav states, footer groups
   -------------------------------------------------------------------------- */
.ticker-wrap { border-bottom: 1px solid var(--line); }
.ticker-label {
  font-size: 10px;
  letter-spacing: 0.16em;
  color: var(--coyote);
  padding: 12px var(--pad-x) 0;
  max-width: 1080px;
  margin: 0 auto;
}
.ticker-wrap .ticker { border-bottom: none; }

.section-router { border-bottom: 1px solid var(--line); }
.router-grid {
  max-width: 1080px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
}
@media (min-width: 880px) { .router-grid { grid-template-columns: 1fr 1fr 1fr; gap: 28px; } }
.router-cell {
  display: flex; flex-direction: column; gap: 12px;
  background: var(--black-2);
  border: 1px solid var(--line);
  padding: 26px 22px;
  text-decoration: none;
  color: var(--bone);
  transition: border-color 0.18s;
}
.router-cell:hover { border-color: var(--bone); }
.router-label { font-size: 11px; letter-spacing: 0.16em; color: var(--coyote); }
.router-cell p { color: var(--bone); font-size: 15px; flex-grow: 1; }
.router-go { font-size: 11px; letter-spacing: 0.14em; color: var(--coyote); }
.router-cell:hover .router-go { color: var(--bone); }

.pindex { list-style: none; max-width: 1080px; margin: 0 auto; border-top: 1px solid var(--line); }
.pindex a {
  display: grid;
  grid-template-columns: 40px 1fr auto;
  grid-template-areas: "code name go" "code line go";
  gap: 2px 16px;
  align-items: baseline;
  padding: 18px 0;
  border-bottom: 1px solid var(--line);
  text-decoration: none;
  color: var(--bone);
}
.pindex a:hover .pindex-name { color: var(--coyote); }
.pindex-code { grid-area: code; font-size: 11px; letter-spacing: 0.16em; color: var(--coyote); }
.pindex-name {
  grid-area: name;
  font-family: var(--font-cond);
  font-weight: 700;
  font-size: clamp(20px, 2.6vw, 26px);
  text-transform: uppercase;
  line-height: 1.05;
}
.pindex-line { grid-area: line; color: var(--coyote); font-size: 15px; max-width: 640px; }
.pindex-go { grid-area: go; font-size: 14px; color: var(--coyote); align-self: center; }
@media (min-width: 880px) {
  .pindex a { grid-template-columns: 56px 220px 1fr auto; grid-template-areas: "code name line go"; padding: 20px 0; }
}

/* Current-page state */
.site-nav a[aria-current="page"],
.mobile-menu nav a[aria-current="page"] {
  color: var(--bone);
  border-bottom: 2px solid var(--orange);
}

/* Footer nav groups */
.footer-nav-groups {
  max-width: 1080px;
  margin: 0 auto 26px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 18px 40px;
}
@media (min-width: 880px) { .footer-nav-groups { grid-template-columns: auto auto auto; justify-content: start; } }
.footer-group-label {
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.18em;
  color: var(--od-green);
  margin-bottom: 8px;
}
.footer-group {
  display: flex; flex-wrap: wrap; gap: 8px 22px;
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.14em;
}
.footer-group a { color: var(--coyote); text-decoration: none; border-bottom: 1px solid transparent; padding-bottom: 2px; }
.footer-group a:hover { color: var(--bone); border-bottom-color: var(--coyote); }
body.light .footer-group a { color: var(--od-deep); }
body.light .footer-group a:hover { color: var(--worn-black); }
body.light .footer-group-label { color: var(--od-green); }

/* Mobilizing overlay (zero packet form) */
.mobilize-wrap { position: relative; max-width: 720px; margin: 0 auto; }
.mobilize-wrap .dz-form { opacity: 0.35; pointer-events: none; }
.mobilize-note {
  position: absolute;
  top: 34%;
  left: 50%;
  transform: translateX(-50%);
  width: min(92%, 560px);
  background: var(--od-deep);
  border: 1px solid var(--bone);
  color: var(--bone);
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: 0.12em;
  line-height: 2;
  text-align: center;
  padding: 22px 24px;
  z-index: 5;
}
.mobilize-note a { color: var(--bone); }

/* Minimal home (flow2) */
.whatis-stance {
  margin-top: 18px;
  font-family: var(--font-cond);
  font-weight: 600;
  font-size: clamp(17px, 2.2vw, 21px);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--coyote);
}
.fallin-inner { max-width: 1080px; margin: 0 auto; }
.fallin-inner .next-list { max-width: 640px; margin-top: 0; }
.fallin-inner .cta-row { margin-top: 28px; }
.fallin-inner .panel-meta { margin-top: 18px; }

/* Home identity merge + path strip + true footer (flow3) */
.founder-row {
  max-width: 1080px;
  margin: 40px auto 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
  align-items: center;
}
@media (min-width: 880px) { .founder-row { grid-template-columns: 1.4fr 1fr; gap: 48px; } }
.founder-title {
  font-family: var(--font-cond);
  font-weight: 700;
  font-size: clamp(24px, 3vw, 32px);
  text-transform: uppercase;
  margin-bottom: 10px;
}
.founder-copy p { color: var(--coyote); max-width: 480px; }

.path-strip {
  background: var(--od-deep);
  border-bottom: 1px solid var(--line);
}
.path-strip-line {
  max-width: 1080px;
  margin: 0 auto;
  padding: 14px var(--pad-x);
  font-size: 11px;
  letter-spacing: 0.14em;
  color: var(--bone);
  line-height: 1.9;
}
.path-strip-label { color: var(--coyote); margin-right: 14px; }
.path-strip-line a { color: var(--bone); margin-left: 14px; }
.path-strip-line a:hover { color: var(--coyote); }

/* Footer reads as a footer: compressed, dimmed, on the panel color */
.site-footer {
  background: var(--black-2);
  padding: 40px var(--pad-x) 32px;
}
.site-footer .footer-top { margin-bottom: 20px; gap: 12px; }
.site-footer .wordmark-footer { font-size: 15px; }
.site-footer .footer-tag {
  font-family: var(--font-mono);
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-size: 10px;
  color: var(--coyote);
}
.footer-nav-groups { margin-bottom: 20px; }
.footer-status, .footer-disclaimer, .footer-legal { font-size: 10px; }
.footer-disclaimer { padding-top: 14px; margin-top: 14px; }
body.light .site-footer { background: #E3DECF; }

/* The One Percent strip (flow4) */
.section-pct { border-bottom: 1px solid var(--line); padding-top: 0; }
.pct-grid {
  max-width: 1080px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr;
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}
@media (min-width: 880px) { .pct-grid { grid-template-columns: 1fr 1fr 1fr; } }
.pct-cell {
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  padding: 34px 26px 26px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.pct-mark {
  font-family: var(--font-display);
  font-size: clamp(44px, 5.4vw, 64px);
  line-height: 1;
  color: var(--bone);
}
.pct-line { color: var(--bone); font-size: 15px; flex-grow: 1; }
.pct-src { font-size: 9px; letter-spacing: 0.14em; color: var(--coyote); }

/* Interior credibility stamp + form privacy line (flow4) */
.cred-stamp {
  max-width: 1080px;
  margin: 18px auto 0;
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.16em;
  color: var(--coyote);
}
.form-privacy {
  margin-top: 12px;
  font-size: 9px;
  letter-spacing: 0.12em;
  color: var(--coyote);
  line-height: 1.9;
}
body.light .cred-stamp { color: var(--od-deep); }

/* whatis cells as doorways (flow5) */
.whatis-cell { padding: 0; }
.whatis-cell > a {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 20px 18px;
  height: 100%;
  text-decoration: none;
  color: inherit;
  transition: background-color 0.18s;
}
.whatis-cell > a:hover { background: var(--od-deep); }
.whatis-cell .whatis-label { margin-bottom: 0; }
.whatis-cell p { flex-grow: 1; }
.whatis-go { font-size: 13px; color: var(--coyote); }
.whatis-cell > a:hover .whatis-go { color: var(--bone); }
@media (min-width: 1000px) { .whatis-cell > a { padding: 22px 16px; } }