:root {
  --ground: #100b08 !important;
  --ground2: #090604 !important;
  --card: #191410 !important;
  --card-2: #211a14 !important;
  --panel: #191410 !important;
  --panel2: #211a14 !important;
  --ink: #f2eee5 !important;
  --ink-2: #c9c3b8 !important;
  --muted: #b8b1a6 !important;
  --dim: #918b82 !important;
  --accent: #c5a96f !important;
  --accent2: #dec58e !important;
  --line: rgba(242, 238, 229, .16) !important;
  --line-soft: rgba(242, 238, 229, .08) !important;
  --warn: #d79b6b !important;
  --ok: #91b09a !important;
  --bad: #cf847d !important;
  --btn-ink: #0d0f10 !important;
  --shadow: none !important;
  --hard-shadow: none;
}

html {
  color-scheme: dark;
  background: var(--ground);
  scroll-padding-top: 96px;
}

body {
  color: var(--ink);
  background:
    radial-gradient(circle at 74% 7%, rgba(144,92,39,.09), transparent 38rem),
    var(--ground) !important;
  background-size: auto !important;
  font-size: 1.0625rem;
  line-height: 1.72;
  padding-top: 86px;
}

body::before,
body::after {
  display: none !important;
}

/* Page content must be immediately readable after navigation. */
.rv {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
}

.bg-topo {
  display: none !important;
}

body > .pixel-field {
  position: fixed !important;
  inset: 0;
  z-index: 0 !important;
  width: 100%;
  height: 100%;
  opacity: .7;
  pointer-events: none;
}

.nav {
  position: fixed !important;
  top: max(10px, env(safe-area-inset-top));
  left: 50%;
  z-index: 100 !important;
  width: min(calc(100% - 28px), 1180px);
  transform: translateX(-50%);
  background: rgba(16,11,8,.9) !important;
  border: 1px solid var(--line) !important;
  border-radius: 5px;
  box-shadow: 0 12px 38px rgba(0,0,0,.34), 0 1px 0 rgba(0,0,0,.5);
  isolation: isolate;
}

.nav::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: -1px;
  left: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(197,169,111,.55), transparent);
}

.wordmark {
  color: var(--ink) !important;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace !important;
  letter-spacing: .075em !important;
  text-transform: uppercase;
}

.wordmark .mark {
  width: 56px !important;
  height: 56px !important;
  flex: 0 0 56px;
  margin-right: -9px;
  color: currentColor;
  background: currentColor;
  -webkit-mask: url("assets/groundworks-mark-transparent.svg") center/contain no-repeat;
  mask: url("assets/groundworks-mark-transparent.svg") center/contain no-repeat;
}

.wordmark .mark rect { display: none; }
.wordmark .hq { color: var(--accent) !important; }

.nav-links { gap: 20px; }
.nav-links a {
  color: var(--muted);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: .75rem;
  letter-spacing: .075em;
  text-transform: uppercase;
}

.nav-links a:not(.btn) {
  padding: 9px 10px;
  transition: color .18s ease, background-color .18s ease;
}

.nav-links a:not(.btn):hover,
.nav-links a:not(.btn):focus-visible {
  color: var(--ink);
  background: rgba(242,238,229,.045);
  text-decoration: none;
}

.btn,
button,
input,
textarea,
select {
  border-radius: 2px !important;
}

.btn {
  color: var(--btn-ink) !important;
  background: var(--ink) !important;
  border: 1px solid var(--ink) !important;
  box-shadow: none !important;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-weight: 750;
  letter-spacing: .055em;
  text-transform: uppercase;
}

.btn:hover,
.btn:focus-visible {
  color: var(--btn-ink) !important;
  background: var(--accent2) !important;
  border-color: var(--accent2) !important;
  box-shadow: none !important;
  filter: none;
  transform: translateY(-1px) !important;
}

.btn-ghost {
  color: var(--ink) !important;
  background: transparent !important;
  border-color: var(--line) !important;
}

.btn-ghost:hover,
.btn-ghost:focus-visible {
  color: var(--ink) !important;
  background: rgba(242,238,229,.055) !important;
  border-color: rgba(242,238,229,.38) !important;
}

.eyebrow,
.tag,
.num,
.audit-head,
.audit-foot,
label {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace !important;
  letter-spacing: .15em !important;
}

.eyebrow {
  color: var(--accent) !important;
  font-size: .72rem !important;
}

.eyebrow::before {
  content: "";
  width: 24px;
  height: 1px;
  margin-right: 0;
  background: var(--accent);
  opacity: .82;
}

.eyebrow::after {
  flex-basis: 22px;
  background: var(--line) !important;
}

.tag,
.num,
label { font-size: .72rem !important; }

.display,
.page-hero h1,
.section-head h2,
.contact-grid h2 {
  color: var(--ink);
  letter-spacing: -.038em !important;
  text-wrap: balance;
}

.display em,
.page-hero h1 em {
  color: var(--accent2) !important;
  font-style: normal;
  text-decoration: none !important;
}

.display em::after,
.page-hero h1 em::after { display: none !important; }

.hero,
.page-hero {
  position: relative;
  overflow: clip;
}

.hero::before,
.hero::after,
.page-hero::before,
.page-hero::after { display: none !important; }

.hero-in {
  padding-block: clamp(72px, 10vw, 132px) clamp(78px, 10vw, 132px);
}

.lede {
  color: var(--muted) !important;
  font-size: 1.18rem !important;
  line-height: 1.72;
}

.section {
  border-top: 1px solid var(--line) !important;
  padding-block: clamp(72px, 9vw, 108px);
}

.section-head p.sub,
.contact-grid .pitch {
  color: var(--muted) !important;
  font-size: 1.04rem !important;
  line-height: 1.75;
}

.audit,
.svc,
.step,
.fit-card,
.price-card,
.about-card,
.contact-form,
.portal-card,
.card,
.quiz,
.login-card,
.dcard,
.cta-band,
.care-strip {
  color: var(--ink) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.018), transparent 34%),
    var(--panel) !important;
  border: 1px solid var(--line) !important;
  border-radius: 2px !important;
  box-shadow: none !important;
  clip-path: none !important;
}

.svc::before,
.step::before,
.fit-card::before,
.price-card::before,
.about-card::before,
.contact-form::before,
.portal-card::before,
.card::before { display: none !important; }

.svc-grid .svc:nth-child(2n),
.steps .step:nth-child(2n) {
  color: var(--ink) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.018), transparent 34%),
    var(--panel) !important;
}

.svc-grid .svc:nth-child(2n) p,
.steps .step:nth-child(2n) p {
  color: var(--muted) !important;
}

.svc-grid .svc:nth-child(2n) .tag,
.steps .step:nth-child(2n) .num {
  color: var(--accent) !important;
}

.svc,
.step,
.price-card,
.fit-card,
.care-strip {
  transition: transform .2s ease, border-color .2s ease, background-color .2s ease;
}

@media (hover:hover) and (pointer:fine) {
  .svc:hover,
  .svc:focus-within,
  .step:hover,
  .step:focus-within,
  .price-card:hover,
  .price-card:focus-within,
  .fit-card:hover,
  .fit-card:focus-within,
  .care-strip:hover,
  .care-strip:focus-within {
    border-color: rgba(197,169,111,.55) !important;
    box-shadow: none !important;
    transform: translateY(-3px) !important;
  }
}

.svc {
  padding: clamp(26px,3vw,34px) !important;
}

.svc::after {
  right: 0;
  bottom: 0;
  left: 0;
  height: 1px;
  background: linear-gradient(90deg, var(--accent), transparent 72%);
}

.svc .tag,
.step .num,
.price-card .tag,
.principle .tag { color: var(--accent) !important; }

.svc p,
.step p,
.price-card .blurb,
.price-card li,
.principle p,
.cta-band p,
.prose,
.honesty,
.care-strip p {
  color: var(--muted) !important;
}

.svc p,
.step p { font-size: 1rem !important; line-height: 1.7 !important; }
.prose { font-size: 1.08rem !important; line-height: 1.78; }

.process-section {
  position: relative;
  overflow: clip;
}

.process-section > .wrap {
  width: 100% !important;
  max-width: 1608px !important;
}

.process-section .section-head {
  max-width: 940px;
}

.process-section .section-head .sub {
  max-width: 760px;
  margin-top: 20px;
}

.process-sequence {
  position: relative;
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: clamp(22px,3vw,34px) !important;
  margin: 0;
  padding: 0;
  list-style: none;
}

.process-story,
.steps .process-story:nth-child(2n) {
  display: grid !important;
  grid-template-columns: minmax(300px,.72fr) minmax(560px,1.28fr);
  min-width: 0;
  min-height: 0;
  padding: 0 !important;
  overflow: hidden;
  color: var(--ink) !important;
  background: var(--panel) !important;
  border: 1px solid rgba(242,238,229,.2) !important;
  border-top-color: rgba(197,169,111,.7) !important;
  transform: none !important;
}

.process-story:hover,
.process-story:focus-within {
  border-color: rgba(197,169,111,.5) !important;
  transform: none !important;
}

.process-story-copy {
  position: relative;
  z-index: 1;
  display: flex;
  min-width: 0;
  padding: clamp(34px,4.2vw,58px);
  flex-direction: column;
  justify-content: center;
  background:
    linear-gradient(135deg, rgba(197,169,111,.04), transparent 42%),
    var(--panel);
}

.process-story-copy::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 1px;
  background: linear-gradient(transparent, rgba(197,169,111,.46), transparent);
}

.process-story .num,
.steps .process-story:nth-child(2n) .num {
  color: var(--accent) !important;
  font: 750 .72rem/1 ui-monospace, SFMono-Regular, Menlo, monospace;
  letter-spacing: .17em;
}

.process-story h3 {
  max-width: 12ch;
  margin: 18px 0 18px !important;
  color: var(--ink);
  font-size: clamp(2rem,3.2vw,3rem);
  line-height: .98 !important;
  letter-spacing: -.045em;
  text-wrap: balance;
}

.process-story .process-step-intro,
.steps .process-story:nth-child(2n) .process-step-intro {
  max-width: 38rem;
  margin: 0;
  color: var(--muted) !important;
  font-size: 1rem !important;
  line-height: 1.7 !important;
}

.process-takeaways {
  display: grid;
  gap: 10px;
  margin-top: clamp(26px,3vw,40px);
}

.process-takeaway {
  display: grid;
  grid-template-columns: 92px 1fr;
  gap: 14px;
  align-items: baseline;
  padding-top: 12px;
  border-top: 1px solid var(--line-soft);
}

.process-takeaway span {
  color: var(--dim);
  font: 750 .62rem/1.2 ui-monospace, SFMono-Regular, Menlo, monospace;
  letter-spacing: .11em;
  text-transform: uppercase;
}

.process-takeaway strong {
  color: var(--ink-2);
  font-size: .86rem;
  font-weight: 620;
  line-height: 1.4;
}

.process-proof {
  position: relative;
  display: flex;
  min-width: 0;
  margin: 0;
  padding: clamp(18px,2.5vw,32px);
  flex-direction: column;
  justify-content: center;
  background:
    radial-gradient(circle at 75% 18%, rgba(197,169,111,.075), transparent 34%),
    #090c0e;
}

.process-proof::before {
  content: "LIVE VISUAL / AUTO-PLAYS IN VIEW";
  position: absolute;
  z-index: 2;
  top: 12px;
  right: 20px;
  padding: 6px 8px;
  color: rgba(242,238,229,.62);
  background: rgba(8,11,13,.84);
  border: 1px solid rgba(242,238,229,.13);
  font: 700 .54rem/1 ui-monospace, SFMono-Regular, Menlo, monospace;
  letter-spacing: .13em;
}

.process-film-button {
  position: relative;
  display: block;
  width: 100%;
  padding: 0;
  color: inherit;
  background: transparent;
  border: 0;
  border-radius: 0;
  cursor: zoom-in;
  appearance: none;
  -webkit-appearance: none;
}

.process-film-button::after {
  content: "TAP TO EXPAND ↗";
  position: absolute;
  right: 10px;
  bottom: 10px;
  z-index: 2;
  padding: 7px 9px;
  color: var(--ink);
  background: rgba(8,11,13,.9);
  border: 1px solid rgba(222,197,142,.48);
  font: 750 .56rem/1 ui-monospace, SFMono-Regular, Menlo, monospace;
  letter-spacing: .12em;
  pointer-events: none;
}

.process-film-button:hover::after,
.process-film-button:focus-visible::after {
  color: var(--ground);
  background: var(--accent2);
}

.process-inline-film {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 8/5;
  object-fit: contain;
  background: #080b0d;
  border: 1px solid rgba(242,238,229,.18);
  box-shadow: 0 24px 60px rgba(0,0,0,.34);
  pointer-events: none;
}

.video-lightbox[hidden] { display: none !important; }

.video-lightbox {
  position: fixed !important;
  inset: 0;
  z-index: 1000 !important;
  display: grid;
  grid-template-rows: auto minmax(0,1fr);
  width: 100%;
  min-height: 100vh;
  min-height: 100dvh;
  padding: max(12px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));
  background: rgba(5,7,8,.97);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}

.video-lightbox-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  width: min(100%,1280px);
  margin-inline: auto;
  padding: 4px 0 12px;
  border-bottom: 1px solid var(--line);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
}

.video-lightbox-bar > div {
  display: flex;
  align-items: baseline;
  gap: 14px;
  min-width: 0;
}

.video-lightbox-bar strong {
  color: var(--accent2);
  font-size: .78rem;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.video-lightbox-bar span {
  color: var(--muted);
  font-size: .72rem;
}

.video-lightbox-close {
  min-width: 88px;
  min-height: 44px;
  padding: 9px 12px;
  color: var(--ink);
  background: rgba(242,238,229,.055);
  border: 1px solid var(--line);
  border-radius: 2px;
  font: 700 .72rem/1 ui-monospace, SFMono-Regular, Menlo, monospace;
  letter-spacing: .08em;
  text-transform: uppercase;
  cursor: pointer;
}

.video-lightbox-close:hover,
.video-lightbox-close:focus-visible {
  color: var(--ground);
  background: var(--accent2);
  border-color: var(--accent2);
}

.video-lightbox-close span { color: inherit; font-size: 1rem; }

.video-lightbox-stage {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  min-height: 0;
  padding-block: 12px;
}

.video-lightbox-film {
  display: block;
  width: min(100%,1280px);
  max-height: calc(100dvh - 92px);
  aspect-ratio: 8/5;
  object-fit: contain;
  background: #050708;
  border: 1px solid rgba(222,197,142,.32);
  box-shadow: 0 30px 100px rgba(0,0,0,.7);
}

body.video-lightbox-open { overflow: hidden; }

.process-proof figcaption {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  padding-top: 13px;
  color: var(--dim);
  font: 700 .6rem/1.35 ui-monospace, SFMono-Regular, Menlo, monospace;
  letter-spacing: .11em;
  text-transform: uppercase;
}

.process-proof figcaption span:last-child {
  color: var(--accent);
  text-align: right;
  white-space: nowrap;
}

.audit {
  isolation: isolate;
  overflow: hidden;
  background: #0a0d0e !important;
  border-color: rgba(242,238,229,.2) !important;
}

.audit::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    repeating-linear-gradient(0deg, rgba(255,255,255,.012) 0 1px, transparent 1px 4px),
    linear-gradient(rgba(242,238,229,.022) 1px, transparent 1px),
    linear-gradient(90deg, rgba(242,238,229,.022) 1px, transparent 1px);
  background-size: auto, 24px 24px, 24px 24px;
  pointer-events: none;
}

.audit-head {
  color: var(--muted) !important;
  background: #111416 !important;
  border-bottom-color: var(--line) !important;
  font-size: .7rem !important;
}

.audit-session { color: var(--dim) !important; font-size: .64rem !important; }

.audit-body {
  color: var(--ink);
  background-image: radial-gradient(rgba(242,238,229,.08) .55px, transparent .65px);
  background-size: 4px 4px;
  font-size: .82rem !important;
  line-height: 1.82 !important;
}

.audit-note { color: var(--dim) !important; font-size: .72rem !important; }
.ln.cmd { color: var(--ink) !important; }
.ln.dim { color: var(--muted) !important; }
.ln.warn { color: var(--warn) !important; }
.ln.ok { color: var(--ok) !important; }
.ln.sum { color: var(--accent2) !important; font-size: .87rem !important; }
.caret { background: var(--accent2) !important; }

.audit-foot {
  color: var(--dim) !important;
  border-top-color: var(--line) !important;
  font-size: .68rem !important;
  line-height: 1.55;
}

.audit-next {
  color: var(--ink) !important;
  background: rgba(242,238,229,.025) !important;
  border-color: rgba(197,169,111,.6) !important;
}

.audit-next strong { color: var(--accent2) !important; }

.audit-terminal,
.audit-flow {
  transition: opacity .2s ease, transform .2s ease, filter .2s ease !important;
}

.audit.show-flow .audit-terminal {
  opacity: 0;
  filter: blur(.7px);
  transform: translateY(-3px);
}

.audit.show-flow .audit-flow {
  opacity: 1;
  filter: none;
  transform: none;
}

.flow-kicker,
.flow-chart-head,
.flow-node b,
.flow-node small,
.flow-chart text { color: var(--dim); fill: var(--dim); }
.flow-title,
.flow-node span { color: var(--ink); }
.flow-node { background: #121618; border-color: var(--line); }
.flow-node:last-child { background: rgba(197,169,111,.065); border-color: rgba(197,169,111,.58); }
.flow-link { background: var(--line); }
.flow-link::after { border-left-color: var(--ok); }
.flow-chart .grid { stroke: var(--line-soft); }
.flow-chart .money { stroke: var(--accent); }
.flow-chart .time { stroke: var(--ok); }
.flow-chart .money-label { fill: var(--accent2); }
.flow-chart .time-label { fill: var(--ok); }

.audit-pixels {
  position: absolute;
  inset: 0;
  z-index: 5;
  display: block;
  opacity: 0;
  background:
    radial-gradient(circle, rgba(242,238,229,.92) 0 .55px, transparent .7px) 0 0 / 3px 3px,
    radial-gradient(circle, rgba(197,169,111,.72) 0 .45px, transparent .65px) 1px 2px / 5px 5px,
    repeating-linear-gradient(0deg, transparent 0 2px, rgba(255,255,255,.13) 2px 3px, transparent 3px 5px);
  mix-blend-mode: screen;
  pointer-events: none;
  will-change: opacity, background-position, filter;
}

.audit-pixels::before,
.audit-pixels::after {
  content: "";
  position: absolute;
  inset: 0;
  opacity: .55;
  background: repeating-linear-gradient(90deg, transparent 0 3px, rgba(242,238,229,.14) 3px 4px, transparent 4px 7px);
}

.audit-pixels::after {
  opacity: .36;
  background: repeating-linear-gradient(0deg, transparent 0 7px, rgba(197,169,111,.24) 7px 8px, transparent 8px 13px);
}

.audit-pixels span { display: none !important; }

.audit.pixelating .audit-pixels {
  animation: fine-static .76s steps(9, end) both;
}

@keyframes fine-static {
  0%   { opacity: 0;   background-position: 0 0, 1px 2px, 0 0; filter: contrast(1); }
  10%  { opacity: .35; background-position: 2px -1px, -2px 4px, 0 1px; filter: contrast(1.25); }
  22%  { opacity: .62; background-position: -3px 2px, 4px -1px, 0 -2px; filter: contrast(1.55); }
  38%  { opacity: .9;  background-position: 4px 1px, -1px -4px, 0 3px; filter: contrast(1.9); }
  54%  { opacity: .72; background-position: -2px -3px, 3px 2px, 0 -1px; filter: contrast(1.65); }
  72%  { opacity: .48; background-position: 3px -2px, -4px 1px, 0 2px; filter: contrast(1.4); }
  88%  { opacity: .2;  background-position: -1px 1px, 2px -3px, 0 0; filter: contrast(1.15); }
  100% { opacity: 0;   background-position: 0 0, 1px 2px, 0 0; filter: contrast(1); }
}

.manifesto {
  background:
    linear-gradient(120deg, rgba(197,169,111,.055), transparent 38%),
    rgba(255,255,255,.012) !important;
}

.manifesto-first { padding-block: clamp(58px,7vw,84px) !important; }

.manifesto blockquote {
  max-width: 30em;
  color: var(--ink);
  border-left: 2px solid var(--accent) !important;
  font-size: clamp(1.55rem,3vw,2.25rem) !important;
  font-weight: 520 !important;
  line-height: 1.28 !important;
}

.manifesto blockquote span { color: var(--muted) !important; }

.price-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: clamp(18px,2.4vw,28px) !important; }
.price-card { padding: clamp(28px,3vw,40px) !important; gap: 16px !important; }
.price-card.featured { border-color: rgba(197,169,111,.52) !important; }
.price-card.featured::before {
  display: block !important;
  color: var(--ground) !important;
  background: var(--accent2) !important;
  border-radius: 1px !important;
}
.price-card .amount { color: var(--ink); }

input,
textarea,
select {
  min-height: 48px;
  color: var(--ink) !important;
  background: #101315 !important;
  border: 1px solid var(--line) !important;
  box-shadow: none !important;
  font-size: 1rem;
}

input::placeholder,
textarea::placeholder { color: var(--dim) !important; }

input:focus,
textarea:focus,
select:focus {
  outline: 1px solid var(--accent) !important;
  outline-offset: 1px;
}

.contact-grid {
  grid-template-columns: minmax(250px,.62fr) minmax(0,1.38fr) !important;
  align-items: start;
}

.booking-shell {
  min-width: 0;
  overflow: hidden;
  border: 1px solid rgba(197,169,111,.5);
  background: #0d1011;
  box-shadow: 0 24px 70px rgba(0,0,0,.25);
}

.booking-status,
.booking-fallback {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 15px;
  color: var(--dim);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: .62rem;
  font-weight: 700;
  line-height: 1.45;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.booking-status {
  border-bottom: 1px solid var(--line);
  background: rgba(255,255,255,.018);
}

.booking-status span:first-child {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--ok);
}

.booking-status i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: currentColor;
  box-shadow: 0 0 0 4px rgba(114,167,138,.1);
}

.booking-calendar {
  display: block;
  width: 100%;
  min-height: 720px;
  border: 0;
  background: #fff;
  color-scheme: light;
}

.booking-fallback { border-top: 1px solid var(--line); }
.booking-fallback a { color: var(--accent2); }
.booking-fallback a:hover { color: var(--ink); text-decoration: none; }

.yn button {
  color: var(--muted) !important;
  background: #101315 !important;
  border-color: var(--line) !important;
}
.yn button:hover { color: var(--ink) !important; border-color: var(--accent) !important; }
.yn button[aria-pressed="true"] { color: var(--ground) !important; background: var(--accent2) !important; border-color: var(--accent2) !important; }

.chip.live { color: var(--ok); border-color: var(--ok); }
.chip.sample { color: var(--warn); border-color: var(--warn); }
.chip.stage { color: var(--accent); border-color: var(--accent); }
.pill.new { color: var(--accent2); background: rgba(197,169,111,.09); }
.pill.contacted { color: var(--ok); }
.pill.booked { color: var(--warn); }

.foot-in {
  color: var(--dim);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: .78rem;
  letter-spacing: .035em;
  text-transform: none;
}
.foot-in a { color: var(--muted); }
.foot-in a:hover { color: var(--ink); }

.svc-link {
  display: inline-block;
  margin-top: 20px;
  color: var(--accent2);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.founder-card {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(240px, .7fr);
  gap: 28px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--accent);
  padding: clamp(26px, 4vw, 42px);
  background: var(--card);
}

.founder-card h3 {
  margin-top: 12px;
  color: var(--ink);
  font-family: "Inter", sans-serif;
  font-size: clamp(1.65rem, 3vw, 2.35rem);
  letter-spacing: -.035em;
}

.founder-card p {
  max-width: 680px;
  margin-top: 12px;
  color: var(--muted);
}

.founder-contact {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  justify-content: center;
  gap: 8px;
  border-left: 1px solid var(--line);
  padding-left: 28px;
  font-size: .76rem;
}

.founder-contact span {
  margin-bottom: 6px;
  color: var(--dim);
  letter-spacing: .1em;
}

.seo-footer-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 20px;
  margin-bottom: 26px;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: .68rem;
  letter-spacing: .055em;
  text-transform: uppercase;
}

.seo-footer-links a {
  color: var(--muted);
}

.seo-footer-links a:hover {
  color: var(--ink);
}

::selection { color: var(--ground); background: var(--accent2); }

@media (max-width: 1000px) {
  .process-story,
  .steps .process-story:nth-child(2n) {
    grid-template-columns: 1fr;
  }
  .process-story-copy::after {
    top: auto;
    right: 0;
    bottom: 0;
    left: 0;
    width: auto;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(197,169,111,.46), transparent);
  }
  .process-story h3 { max-width: 18ch; }
  .process-proof { border-top: 1px solid var(--line-soft); }
}

@media (max-width: 900px) {
  .price-grid { grid-template-columns: 1fr !important; }
}

@media (max-width: 760px) {
  html { scroll-padding-top: 88px; }
  body { padding-top: 80px; }
  .nav {
    top: max(7px, env(safe-area-inset-top));
    width: calc(100% - 16px);
  }
  .nav-in { height: 64px; }
  .wordmark .mark { width: 52px !important; height: 52px !important; flex-basis: 52px; }
  .hero-in { padding-block: 58px 72px; }
  .section { padding-block: 62px; }
  .process-section > .wrap { width: 100% !important; }
  .manifesto-first { padding-block: 54px !important; }
  .display { font-size: clamp(2.5rem,12vw,3.35rem) !important; }
  .svc,
  .step:not(.process-story) { padding: 24px !important; }
  .process-story,
  .steps .process-story:nth-child(2n) { padding: 0 !important; }
  .process-story-copy { padding: 28px 24px 30px; }
  .process-story h3 {
    max-width: 14ch;
    margin-block: 15px !important;
    font-size: clamp(2rem,9vw,2.55rem);
  }
  .process-story .process-step-intro,
  .steps .process-story:nth-child(2n) .process-step-intro { font-size: .98rem !important; }
  .process-takeaways { margin-top: 26px; }
  .process-takeaway { grid-template-columns: 82px 1fr; }
  .process-proof { padding: 14px; }
  .process-proof::before {
    top: 7px;
    right: 8px;
    font-size: .47rem;
  }
  .process-proof figcaption {
    align-items: flex-start;
    flex-direction: column;
    gap: 5px;
    font-size: .56rem;
  }
  .process-proof figcaption span:last-child { text-align: left; }
  .process-film-button::after {
    right: 7px;
    bottom: 7px;
    padding: 7px 8px;
    font-size: .53rem;
  }
  .video-lightbox { padding: max(8px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left)); }
  .video-lightbox-bar { gap: 10px; padding-bottom: 8px; }
  .video-lightbox-bar > div { display: block; }
  .video-lightbox-bar strong,
  .video-lightbox-bar span { display: block; }
  .video-lightbox-bar span { margin-top: 2px; font-size: .62rem; }
  .video-lightbox-close { min-width: 78px; }
  .video-lightbox-stage { padding-block: 8px; }
  .video-lightbox-film { width: 100%; max-height: calc(100dvh - 78px); }
  .audit-body { min-height: 388px; font-size: .86rem !important; line-height: 1.76 !important; }
  .audit-head { font-size: .68rem !important; }
  .audit-foot { font-size: .68rem !important; }
  .manifesto blockquote { font-size: clamp(1.42rem,7vw,1.78rem) !important; }
  .contact-grid { grid-template-columns: 1fr !important; }
  .booking-status,
  .booking-fallback { align-items: flex-start; flex-direction: column; }
  .booking-calendar { min-height: 830px; }
  .founder-card { grid-template-columns: 1fr; }
  .founder-contact {
    border-top: 1px solid var(--line);
    border-left: 0;
    padding-top: 24px;
    padding-left: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .pixel-field { opacity: .62; }
  .audit-pixels { display: none; }
  .audit-terminal,
  .audit-flow { transition: none !important; }
}

/* ---------- homepage systems lab ---------- */
.field-visuals {
  position: relative;
  overflow: hidden;
  border-block: 1px solid var(--line-soft);
  background:
    radial-gradient(circle at 84% 8%, rgba(214, 167, 86, .12), transparent 28%),
    linear-gradient(180deg, #131210, #0d0c0b);
}

.field-visuals::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .32;
  background-image:
    linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
  background-size: 34px 34px;
  mask-image: linear-gradient(to bottom, #000, transparent 92%);
}

.field-visuals > .wrap { position: relative; }

.field-visuals-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 28px;
  margin-bottom: clamp(24px, 4vw, 42px);
}

.field-visuals-head h2 {
  max-width: 760px;
  margin-top: 10px;
  font-size: clamp(1.85rem, 4vw, 3.25rem);
  line-height: .98;
  letter-spacing: -.045em;
}

.visual-motion-toggle {
  flex: 0 0 auto;
  min-width: 112px;
  padding: 10px 14px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(21, 20, 19, .8);
  color: var(--ink-2);
  font: 700 .68rem/1 Inter, sans-serif;
  letter-spacing: .1em;
  text-transform: uppercase;
  cursor: pointer;
}

.visual-motion-toggle:hover,
.visual-motion-toggle:focus-visible {
  border-color: var(--accent);
  color: var(--ink);
  outline: none;
}

.system-evidence {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  margin: 0 0 18px;
  border: 1px solid rgba(214, 167, 86, .26);
  border-radius: 18px;
  background: #090908;
  box-shadow: 0 24px 70px rgba(0, 0, 0, .4);
}

.system-evidence::after {
  content: "";
  position: absolute;
  z-index: 1;
  inset: 38% 0 0;
  pointer-events: none;
  background: linear-gradient(to bottom, transparent, rgba(6, 6, 5, .9));
}

.system-evidence video {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 7.2;
  object-fit: cover;
  object-position: center 52%;
  background: #090908;
}

.system-evidence figcaption {
  position: absolute;
  z-index: 2;
  inset: auto 0 0;
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 22px;
  padding: 24px 26px;
  color: var(--ink);
}

.system-evidence figcaption span {
  flex: 0 0 auto;
  color: var(--accent);
  font: 800 .62rem/1 Inter, sans-serif;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.system-evidence figcaption strong {
  max-width: 540px;
  font-size: clamp(.92rem, 1.65vw, 1.28rem);
  line-height: 1.2;
  text-align: right;
}

.systems-lab {
  display: grid;
  grid-template-columns: minmax(0, 1.52fr) minmax(310px, .88fr);
  gap: 18px;
  align-items: stretch;
}

.systems-stack {
  display: grid;
  grid-template-rows: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.system-visual {
  position: relative;
  overflow: hidden;
  min-width: 0;
  border: 1px solid rgba(214, 167, 86, .25);
  border-radius: 18px;
  color: #24211d;
  background:
    linear-gradient(rgba(95, 81, 58, .055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(95, 81, 58, .055) 1px, transparent 1px),
    #f3efe6;
  background-size: 22px 22px;
  box-shadow: 0 24px 70px rgba(0, 0, 0, .34);
}

.system-visual::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border: 7px solid rgba(255, 255, 255, .18);
  border-radius: inherit;
  box-shadow: inset 0 0 0 1px rgba(47, 42, 35, .08);
}

.system-visual-main {
  display: flex;
  min-height: 610px;
  flex-direction: column;
}

.system-visual-small {
  display: flex;
  min-height: 296px;
  flex-direction: column;
}

.system-visual-head {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 14px;
  align-items: start;
  padding: 24px 26px 0;
}

.system-index {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border: 1px solid rgba(150, 110, 45, .55);
  border-radius: 50%;
  color: #8a6125;
  font: 800 .64rem/1 Inter, sans-serif;
  letter-spacing: .08em;
}

.system-visual-head h3 {
  margin: 0;
  color: #24211d;
  font-size: clamp(1rem, 1.55vw, 1.28rem);
  line-height: 1.05;
  letter-spacing: -.025em;
}

.system-visual-head p {
  max-width: 360px;
  margin: 7px 0 0;
  color: #746c60;
  font-size: .75rem;
  line-height: 1.45;
}

.system-state {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 8px 10px;
  border: 1px solid rgba(58, 117, 77, .24);
  border-radius: 999px;
  color: #326845;
  background: rgba(74, 143, 97, .08);
  font: 800 .59rem/1 Inter, sans-serif;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.system-state i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #4d9b67;
  box-shadow: 0 0 0 5px rgba(77, 155, 103, .12);
  animation: system-status 1.9s ease-in-out infinite;
}

.system-visual svg {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  overflow: visible;
}

.handoff-map {
  flex: 1;
  min-height: 400px;
  margin: 6px 0 0;
}

.map-paper { fill: transparent; }
.map-grid-line {
  fill: none;
  stroke: rgba(58, 51, 42, .065);
  stroke-width: 1;
}

.map-branch {
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.map-branch-muted {
  stroke: rgba(88, 79, 67, .32);
  stroke-width: 2;
}

.map-route {
  stroke: #9a6d2d;
  stroke-width: 3;
  stroke-dasharray: .055 .022;
  animation: system-route 5.2s linear infinite;
}

.map-node circle,
.map-core rect {
  fill: #f8f5ee;
  stroke: #756b5e;
  stroke-width: 2;
}

.map-node path,
.map-core path {
  fill: none;
  stroke: #756b5e;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.map-core rect {
  fill: #1b1916;
  stroke: #9a6d2d;
}

.map-core path { stroke: rgba(244, 238, 226, .58); }
.map-core circle {
  fill: #d6a756;
  animation: system-core 2.2s ease-in-out infinite;
}

.map-node-destination circle {
  stroke: #9a6d2d;
  stroke-width: 2.5;
}

.map-node-destination path { stroke: #9a6d2d; }

.map-signal,
.leak-pulse,
.lead-signal {
  fill: #d6a756;
  stroke: #f8f5ee;
  stroke-width: 3;
  transform-box: fill-box;
  transform-origin: center;
  animation: system-signal 2.7s ease-in-out infinite;
}

.signal-b,
.leak-pulse-b,
.lead-signal-b { animation-delay: .5s; }
.signal-c,
.leak-pulse-c,
.lead-signal-c { animation-delay: 1s; }

.system-visual-foot {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 13px;
  margin: 0 26px 24px;
  padding: 13px 16px;
  border: 1px solid rgba(70, 62, 51, .16);
  border-radius: 10px;
  color: #5d554b;
  background: rgba(255, 255, 255, .34);
  font: 800 .58rem/1 Inter, sans-serif;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.system-visual-foot b {
  color: #a87831;
  font-size: .84rem;
}

.system-visual-small .system-visual-head {
  padding: 22px 22px 0;
}

.system-visual-small svg {
  flex: 1;
  min-height: 180px;
  margin-top: -2px;
}

.leak-route,
.lead-route {
  fill: none;
  stroke: #9a6d2d;
  stroke-width: 3;
  stroke-linecap: round;
  stroke-dasharray: .06 .024;
  animation: system-route 4.4s linear infinite;
}

.leak-old {
  fill: none;
  stroke: rgba(152, 76, 54, .46);
  stroke-width: 2;
  stroke-dasharray: 5 6;
}

.leak-stages rect {
  fill: #f8f5ee;
  stroke: #70675b;
  stroke-width: 2;
}

.lead-funnel {
  fill: rgba(214, 167, 86, .26);
  stroke: #9a6d2d;
  stroke-width: 2;
  stroke-linejoin: round;
}

.lead-node circle:first-child {
  fill: #f8f5ee;
  stroke: #70675b;
  stroke-width: 2;
}

.lead-node circle:last-child { fill: #9a6d2d; }
.lead-finish rect {
  fill: #1b1916;
  stroke: #9a6d2d;
  stroke-width: 2;
}
.lead-finish path {
  fill: none;
  stroke: #d6a756;
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
}

@keyframes system-route {
  to { stroke-dashoffset: -1; }
}

@keyframes system-signal {
  0%, 100% { opacity: .55; transform: scale(.82); }
  48% { opacity: 1; transform: scale(1.28); }
}

@keyframes system-core {
  0%, 100% { opacity: .6; transform: scale(.88); transform-origin: 453px 215px; }
  50% { opacity: 1; transform: scale(1.2); transform-origin: 453px 215px; }
}

@keyframes system-status {
  0%, 100% { opacity: .62; }
  50% { opacity: 1; }
}

.field-visuals-note {
  max-width: 760px;
  margin: 20px 0 0;
  color: var(--dim);
  font-size: .74rem;
  line-height: 1.55;
}

.field-visuals.is-paused *,
.field-visuals.is-paused *::before,
.field-visuals.is-paused *::after {
  animation-play-state: paused !important;
}

@media (max-width: 920px) {
  .systems-lab { grid-template-columns: 1fr; }
  .systems-stack {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: none;
  }
  .system-visual-main { min-height: 560px; }
}

@media (max-width: 640px) {
  .field-visuals-head {
    align-items: start;
    margin-bottom: 22px;
  }

  .visual-motion-toggle {
    min-width: 94px;
    padding: 9px 11px;
    font-size: .6rem;
  }

  .systems-stack { grid-template-columns: 1fr; }
  .system-visual {
    border-radius: 12px;
    background-size: 18px 18px;
  }
  .system-evidence {
    margin-bottom: 12px;
    border-radius: 12px;
  }
  .system-evidence video {
    min-height: 300px;
    aspect-ratio: 4 / 3;
  }
  .system-evidence figcaption {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
    padding: 18px;
  }
  .system-evidence figcaption strong {
    max-width: 320px;
    text-align: left;
  }
  .system-visual-main { min-height: 490px; }
  .system-visual-small { min-height: 270px; }
  .system-visual-head {
    grid-template-columns: auto minmax(0, 1fr);
    gap: 11px;
    padding: 19px 18px 0;
  }
  .system-visual-small .system-visual-head { padding: 19px 18px 0; }
  .system-state {
    grid-column: 2;
    justify-self: start;
    margin-top: -3px;
  }
  .handoff-map {
    min-height: 320px;
    transform: scale(1.08);
  }
  .system-visual-foot {
    flex-wrap: wrap;
    gap: 8px 10px;
    margin: 0 18px 18px;
    font-size: .52rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .visual-motion-toggle { display: none; }
  .field-visuals *,
  .field-visuals *::before,
  .field-visuals *::after { animation: none !important; }
}
