/* ============================================================
   GREEN MODE (throwaway preview) — Cartesian Property
   Whole site sits on Formal Green. Depth comes from three green
   tints, not from light panels. Type is ecru; sage is the accent.
   Loaded AFTER main.css; overrides only.
   ============================================================ */

:root {
  /* green tint ladder: base → raised → panel → line */
  --g-base:   #0b241c;
  --g-raised: #0f3228;
  --g-panel:  #14402f;
  --g-panel-2:#183f33;
  --g-line:   rgba(178, 191, 180, 0.22);
  --g-line-soft: rgba(178, 191, 180, 0.14);

  --light: #f3f2ef;

  /* retarget the shared tokens so untouched rules follow along */
  --ecru:  #0b241c;
  --stone: #0f3228;
  --white: #14402f;
  --text:  #e9eeea;
  --text-soft: rgba(233, 238, 234, 0.72);
  --ink:   #f3f2ef;
}

body { background: var(--g-base); color: var(--text); }

h1, h2, h3, h4 { color: var(--light); }
.lead, .muted, p { color: var(--text-soft); }
.eyebrow { color: var(--sage); }
::selection { background: var(--sage); color: var(--g-base); }

/* section rhythm: alternate base / raised so the page still has bands */
.wash { background: var(--g-raised); }
.dark { background: var(--g-raised); }
.dark h1, .dark h2, .dark h3, .dark h4 { color: var(--light); }

/* ---------- Header ---------- */
.site-header.is-solid { background: rgba(11, 36, 28, 0.96); }

/* ---------- Buttons ---------- */
.btn-primary,
.dark .btn-primary,
.map-copy .btn-primary {
  background: var(--light);
  color: var(--g-raised);
}
.btn-primary:hover,
.dark .btn-primary:hover,
.map-copy .btn-primary:hover {
  background: #ffffff;
  color: var(--g-base);
}
.btn-ghost,
.dark .btn-ghost,
.map-copy .btn-ghost {
  border-color: rgba(243, 242, 239, 0.42);
  color: var(--light);
  background: transparent;
}
.btn-ghost:hover,
.dark .btn-ghost:hover,
.map-copy .btn-ghost:hover {
  border-color: var(--light);
  background: rgba(243, 242, 239, 0.1);
  color: var(--light);
}
.text-link { border-bottom-color: var(--sage); color: var(--light); }
.text-link:hover { border-bottom-color: var(--light); }

/* ---------- Heroes ---------- */
.hero::after {
  background: linear-gradient(
    to top,
    rgba(11, 36, 28, 0.94) 0%,
    rgba(11, 36, 28, 0.62) 45%,
    rgba(11, 36, 28, 0.34) 100%
  );
}
.page-hero {
  background: linear-gradient(160deg, var(--g-raised) 0%, var(--g-base) 100%);
  border-bottom: 1px solid var(--g-line-soft);
}

/* ---------- Rules & dividers (were dark-on-light) ---------- */
.split-list-items .list-item,
.num-list,
.num-row,
.faq,
.faq details,
.feature,
.service-row,
.process-grid,
.process-cell,
.criteria-card,
.field input,
.field textarea,
.field select {
  border-color: var(--g-line);
}
.num-row:hover { background: rgba(178, 191, 180, 0.07); }
@media (max-width: 900px) {
  .process-cell:nth-last-child(-n + 3) { border-bottom-color: var(--g-line); }
}

/* ---------- Surfaces that used to be white ---------- */
.card,
.team-card,
.criteria-card,
.pathway-card,
.process-grid {
  background: var(--g-panel);
  border: 1px solid var(--g-line-soft);
}
.process-grid { border-color: var(--g-line); }
.card:hover,
.team-card:hover,
.pathway-card:hover {
  box-shadow: 0 18px 40px -18px rgba(0, 0, 0, 0.55);
  background: var(--g-panel-2);
}
.card p, .team-meta .role, .team-meta .bio,
.pathway-body p, .criteria-card p, .process-cell p,
.feature p, .step p, .service-row p, .num-row p,
.faq details p, .split-copy p, .section-head p, .form-note {
  color: var(--text-soft);
}

/* team photos: green plate, headshots stay B&W */
.team-photo { background: var(--g-raised); }
.team-photo img { filter: grayscale(1) contrast(1.05) brightness(1.02); }

/* ---------- Gradient cards: kill the tan/stone variant ---------- */
.driver.on-green,
.mv-card.on-green {
  background: linear-gradient(120deg, var(--g-raised) 25%, #1b4b3a);
}
.driver.on-stone,
.mv-card.on-stone {
  background: linear-gradient(120deg, var(--g-panel) 20%, var(--g-raised));
  color: var(--text);
}
.driver.on-stone h3,
.mv-card.on-stone h3 { color: var(--light); }
.driver.on-stone p,
.mv-card.on-stone p { color: var(--text-soft); }

/* ---------- FAQ / forms ---------- */
.faq summary { color: var(--light); }
.faq summary:hover { color: var(--sage); }
.faq summary::after { color: var(--sage); }
.field label { color: var(--light); }
.field input, .field textarea, .field select {
  background: var(--g-panel);
  color: var(--light);
}
.field input::placeholder, .field textarea::placeholder {
  color: rgba(233, 238, 234, 0.45);
}
.field input:focus, .field textarea:focus, .field select:focus {
  border-color: var(--sage);
  box-shadow: 0 0 0 3px rgba(178, 191, 180, 0.18);
}

/* ---------- Map / footer ---------- */
.map-band .map-copy { background: var(--g-raised); }
.map-band .map-frame iframe {
  filter: grayscale(1) invert(0.92) brightness(0.82) sepia(0.55)
    hue-rotate(96deg) saturate(1.6) contrast(1.05);
}
/* keep the map inside the green world instead of glowing grey */
.map-band .map-frame::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(11, 36, 28, 0.35);
  pointer-events: none;
}
.site-footer {
  background: var(--g-base);
  border-top: 1px solid var(--g-line-soft);
  color: rgba(233, 238, 234, 0.72);
}
.site-footer .top { border-bottom-color: var(--g-line-soft); }
.site-footer .bottom { color: rgba(233, 238, 234, 0.5); }

/* ---------- Accents / misc ---------- */
.quote blockquote { color: var(--light); }
.quote figcaption { color: var(--text-soft); }
.stat-block .stat-num,
.step .ghost-num,
.criteria-card .crit-num,
.num-row .num { color: var(--sage); }
.journey-stop::before { background: var(--sage); }
.feature-row { border-left-color: var(--sage); }

/* line icons and pattern art were drawn dark for light backgrounds */
.num-icon,
.process-cell img,
.journey-stop img,
.split-media.illustration img {
  /* line art was drawn dark for light paper: invert keeps the linework
     and its tonal detail instead of flattening it into a white blob */
  filter: invert(1) brightness(1.08) opacity(0.92);
}
.driver .pattern,
.mv-card .pattern {
  opacity: 0.18;
  mix-blend-mode: lighten;
}
.page-hero .pattern {
  opacity: 0.16;
  mix-blend-mode: lighten;
}
.logo-track img { filter: grayscale(1) brightness(0) invert(1); opacity: 0.6; }
.logo-track img:hover { opacity: 0.9; }

/* ============================================================
   LIGHT BANDS — sections that break the green with a cool grey.
   Green / white / grey only: no tan, no stone, no warm tint.
   ============================================================ */
:root {
  --l-bg:    #eceeec;   /* cool grey paper */
  --l-panel: #ffffff;
  --l-ink:   #10221b;
  --l-text:  #4c5a54;
  --l-line:  rgba(16, 34, 27, 0.16);
}

.light {
  background: var(--l-bg);
  color: var(--l-text);
}
.light h1, .light h2, .light h3, .light h4 { color: var(--l-ink); }
.light p, .light .lead, .light .muted, .light .section-head p { color: var(--l-text); }
.light .eyebrow { color: var(--g-raised); }

/* rules, dividers, grids */
.light .feature,
.light .num-list,
.light .num-row,
.light .faq,
.light .faq details,
.light .service-row,
.light .split-list-items .list-item,
.light .process-grid,
.light .process-cell,
.light .criteria-card { border-color: var(--l-line); }
.light .num-row:hover { background: rgba(255, 255, 255, 0.6); }

/* surfaces */
.light .card,
.light .team-card,
.light .criteria-card,
.light .pathway-card,
.light .process-grid {
  background: var(--l-panel);
  border-color: var(--l-line);
}
.light .card:hover,
.light .team-card:hover,
.light .pathway-card:hover {
  background: var(--l-panel);
  box-shadow: 0 18px 40px -18px rgba(16, 34, 27, 0.28);
}
.light .team-photo { background: #e2e5e2; }

/* accents flip back to green on light */
.light .num-row .num,
.light .step .ghost-num,
.light .criteria-card .crit-num,
.light .stat-block .stat-num,
.light .faq summary::after { color: var(--g-raised); }
.light .feature-row { border-left-color: var(--g-raised); }
.light .text-link { color: var(--l-ink); border-bottom-color: var(--g-raised); }
.light .text-link:hover { border-bottom-color: var(--l-ink); }

/* buttons on light */
.light .btn-primary { background: var(--g-raised); color: #f3f2ef; }
.light .btn-primary:hover { background: var(--g-base); }
.light .btn-ghost {
  border-color: rgba(16, 34, 27, 0.35);
  color: var(--l-ink);
  background: transparent;
}
.light .btn-ghost:hover { border-color: var(--g-raised); background: rgba(16, 34, 27, 0.06); }

/* line art goes back to its original dark drawing on light bands */
.light .num-icon,
.light .process-cell img,
.light .journey-stop img,
.light .split-media.illustration img { filter: none; }
.light .logo-track img { filter: grayscale(1); opacity: 0.65; }
.light .logo-track img:hover { opacity: 0.9; }

/* map band back to the way it was: light copy panel, plain grey map */
.map-band.light .map-copy {
  background: var(--l-bg);
  color: var(--l-text);
}
.map-band.light .map-copy h2 { color: var(--l-ink); }
.map-band.light .map-copy .eyebrow { color: var(--g-raised); }
.map-band.light .map-copy address { color: var(--l-text); }
.map-band.light .map-copy .btn-primary { background: var(--g-raised); color: #f3f2ef; }
.map-band.light .map-copy .btn-primary:hover { background: var(--g-base); }
.map-band.light .map-frame iframe { filter: grayscale(1) contrast(1.02); }
.map-band.light .map-frame::after { display: none; }

/* ---------- Hero background video (drone footage) ---------- */
.hero-media video {
  width: 100%;
  height: 112%;
  object-fit: cover;
  display: block;
  will-change: transform;
}
/* keep the drone footage inside the green world: desaturate, then wash */
.hero-media video {
  filter: saturate(0.55) contrast(1.02) brightness(0.92);
}
.hero-media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(15, 50, 40, 0.42);
  pointer-events: none;
}
