/* ═══════════════════════════════════════════════════════════
   twinalps SUBPAGE STYLES
   Loaded after base.css on all subpages (not index.html).
   Editorial infrastructure system: technical panels, deliverable
   cards, tags, alpine motif.
   No aurora, no glassmorphism. Radius 4-8px.
   Tokens, nav, footer, buttons, alpine motif -> base.css
   ═══════════════════════════════════════════════════════════ */

:root { --r: 6px; --r-sm: 4px; }

/* ── Page hero ───────────────────────────────────────────── */
.page-hero {
  position: relative;
  padding: 132px 0 64px;
  overflow: hidden;
  isolation: isolate;
}
/* Animated twin-peaks backdrop (peaks.js) - faint, behind the copy. */
.page-hero .peaks-canvas {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  opacity: 0.38;
  pointer-events: none;
}
[data-theme="dark"] .page-hero .peaks-canvas { opacity: 0.5; }
@media (min-width: 1024px) { .page-hero { padding: 156px 0 88px; } }

/* Service index / kicker under the lede */
.page-hero-meta {
  margin-top: 32px;
  display: flex; flex-wrap: wrap; gap: 20px 40px;
  font-family: 'Manrope', ui-sans-serif, system-ui, sans-serif; font-size: 12px;
  letter-spacing: 0.06em; color: var(--muted);
}
.page-hero-meta strong {
  display: block; font-family: 'Manrope', ui-sans-serif, system-ui, sans-serif;
  font-weight: 700; font-size: 17px; letter-spacing: 0;
  color: var(--ink); margin-bottom: 4px; text-transform: none;
}

.breadcrumb {
  display: flex; align-items: center; gap: 8px;
  font-family: 'Manrope', ui-sans-serif, system-ui, sans-serif; font-size: 11.5px;
  color: var(--muted); margin-bottom: 24px;
}
.breadcrumb a { color: var(--muted); text-decoration: none; transition: color 0.2s var(--ease-out); }
.breadcrumb a:hover { color: var(--ink); }
.breadcrumb .current { color: var(--ink); }

.page-h1 {
  font-family: 'Fraunces', Georgia, 'Times New Roman', serif; font-weight: 600;
  font-size: clamp(36px, 5.2vw, 62px); line-height: 1.06;
  letter-spacing: -0.028em; color: var(--ink); margin: 0; max-width: 20ch;
}
.page-h1 em {
  font-family: 'Fraunces', serif; font-style: italic;
  font-weight: 400; color: var(--blue); letter-spacing: -0.01em;
}
[data-theme="dark"] .page-h1 em { color: var(--blue-bright); }

.page-lede {
  margin: 22px 0 0;
  font-size: clamp(16px, 1.3vw, 18.5px); line-height: 1.6;
  color: var(--ink-2); max-width: 60ch;
}
[data-theme="dark"] .page-lede { color: var(--ink-2); }

/* ── Sections (no powerpoint separator lines) ────────────── */
.section { padding: 68px 0; }
@media (min-width: 1024px) { .section { padding: 88px 0; } }

.section-h2 {
  font-family: 'Fraunces', Georgia, 'Times New Roman', serif; font-weight: 600;
  font-size: clamp(26px, 3.4vw, 40px); line-height: 1.08;
  letter-spacing: -0.02em; color: var(--ink);
  margin: 4px 0 0; max-width: 22ch;
}
/* Service pages are operational documents: keep their headings in the UI face. */
.service-page .page-h1,
.service-page .section-h2,
.service-page .cta-block h2 {
  font-family: 'Manrope', ui-sans-serif, system-ui, sans-serif;
  font-weight: 700;
  letter-spacing: 0;
}
.service-page .page-h1 em {
  font-family: inherit;
  font-style: normal;
  font-weight: 700;
  letter-spacing: 0;
}
.service-page .footer-mark,
.case-study-page .footer-mark {
  font-family: 'Manrope', ui-sans-serif, system-ui, sans-serif;
  font-weight: 700;
  letter-spacing: .04em;
}
.section-intro {
  margin: 16px 0 0; font-size: 16px; line-height: 1.6;
  color: var(--muted); max-width: 62ch;
}
[data-theme="dark"] .section-intro { color: var(--ink-2); }
.section-head { max-width: 720px; margin-bottom: 40px; }

/* Run-of-show index inside eyebrow (shared with homepage look) */
.eyebrow .sec-idx { color: var(--muted-2); margin-right: 12px; font-variant-numeric: tabular-nums; }

/* ═══════════════════════════════════════════════════════════
   SHARED COMPONENTS - panel / tag / status / module / before-after
   / bench card / process. Mirrors the homepage system so subpages
   and homepage read as one product.
   ═══════════════════════════════════════════════════════════ */

.panel { background: var(--panel); border: 1px solid var(--ridge); border-radius: var(--r); }

.tag {
  display: inline-flex; align-items: center; gap: 6px;
  font-family: 'Manrope', ui-sans-serif, system-ui, sans-serif; font-size: 11px; font-weight: 500;
  letter-spacing: 0.04em; color: var(--muted);
  background: var(--panel-2); border: 1px solid var(--ridge);
  border-radius: var(--r-sm); padding: 4px 8px; white-space: nowrap;
}
[data-theme="dark"] .tag { background: rgba(255,255,255,0.04); border-color: var(--ridge); color: var(--ink-2); }
.tag--ok  { color: var(--ok);  border-color: color-mix(in srgb, var(--ok) 40%, var(--ridge)); }
.tag--red { color: var(--red); border-color: color-mix(in srgb, var(--red) 45%, var(--ridge)); background: var(--red-soft); }
.tag--blue{ color: var(--blue);border-color: color-mix(in srgb, var(--blue) 40%, var(--ridge)); }

.status-dot { width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0; }
.status-dot--ok  { background: var(--ok); }
.status-dot--soon{ background: var(--pending-grey); }

/* Problem-specific module (typical problem -> what we ship -> stack -> outcome) */
.modules { display: grid; grid-template-columns: 1fr; gap: 16px; }
@media (min-width: 820px) { .modules { grid-template-columns: 1fr 1fr; } }
.module { background: var(--panel); border: 1px solid var(--ridge); border-radius: var(--r); padding: 24px; }
.module-head { display: flex; align-items: center; gap: 12px; }
.module-ico {
  width: 38px; height: 38px; border-radius: var(--r-sm);
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--red-soft); color: var(--red); flex-shrink: 0;
}
.module h3 { font-family: 'Manrope', ui-sans-serif, system-ui, sans-serif; font-weight: 700; font-size: 18px; letter-spacing: 0; margin: 0; color: var(--ink); }
.module-rows { margin: 20px 0 0; display: flex; flex-direction: column; }
.module-rows .mr { padding: 12px 0; border-top: 1px solid var(--ridge); display: grid; grid-template-columns: 1fr; gap: 4px; }
@media (min-width: 520px) { .module-rows .mr { grid-template-columns: 128px 1fr; gap: 14px; align-items: baseline; } }
.module-rows .mr-k { font-family: 'Manrope', ui-sans-serif, system-ui, sans-serif; font-size: 10.5px; font-weight: 500; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); }
.module-rows .mr-v { font-size: 14px; line-height: 1.5; color: var(--ink); }
.module-rows .mr-v .stackline { display: flex; flex-wrap: wrap; gap: 5px; }
.module-rows .mr--out .mr-v { color: var(--blue); font-weight: 500; }
[data-theme="dark"] .module-rows .mr--out .mr-v { color: var(--blue-bright); }

/* Before / after block */
.ba { display: grid; grid-template-columns: 1fr auto 1fr; gap: 10px; align-items: center; padding: 14px; background: var(--paper-2); border-radius: var(--r-sm); }
[data-theme="dark"] .ba { background: rgba(255,255,255,0.03); }
.ba .lbl { font-family: 'Manrope', ui-sans-serif, system-ui, sans-serif; font-size: 9.5px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); }
.ba .val { font-family: 'Manrope', ui-sans-serif, system-ui, sans-serif; font-weight: 700; font-size: 17px; letter-spacing: 0; color: var(--ink); font-variant-numeric: tabular-nums lining-nums; }
.ba .val--after { color: var(--blue); }
[data-theme="dark"] .ba .val--after { color: var(--blue-bright); }
.ba .arrow { color: var(--muted-2); display: inline-flex; }

/* Engineer bench card */
.bench-row { display: grid; grid-template-columns: 1fr; gap: 16px; }
@media (min-width: 640px) { .bench-row { grid-template-columns: 1fr 1fr; } }
.eng { display: flex; flex-direction: column; padding: 18px; background: var(--panel); border: 1px solid var(--ridge); border-radius: var(--r); transition: border-color 0.25s var(--ease-out), box-shadow 0.25s var(--ease-out); }
.eng:hover, .eng:focus-within { border-color: var(--ridge-2); box-shadow: 0 8px 24px -14px rgba(10,14,26,0.30); }
[data-theme="dark"] .eng:hover, [data-theme="dark"] .eng:focus-within { box-shadow: 0 8px 24px -12px rgba(0,0,0,0.6); }
.eng-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.eng-avail { display: inline-flex; align-items: center; gap: 6px; font-family: 'Manrope', ui-sans-serif, system-ui, sans-serif; font-size: 10.5px; letter-spacing: 0.04em; color: var(--muted); }
.eng-role { font-family: 'Manrope', ui-sans-serif, system-ui, sans-serif; font-weight: 700; font-size: 16px; letter-spacing: 0; color: var(--ink); margin: 16px 0 2px; }
.eng-exp { font-family: 'Manrope', ui-sans-serif, system-ui, sans-serif; font-size: 11.5px; color: var(--muted); }
.eng-stack { display: flex; flex-wrap: wrap; gap: 5px; margin: 14px 0 0; }
.eng-stack .tag { font-size: 10.5px; padding: 3px 7px; }
.eng-meta { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--ridge); display: flex; flex-direction: column; gap: 8px; }
.eng-meta .row { display: flex; justify-content: space-between; gap: 10px; font-size: 12px; }
.eng-meta .k { font-family: 'Manrope', ui-sans-serif, system-ui, sans-serif; font-size: 10.5px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); }
.eng-meta .v { color: var(--ink); font-weight: 500; text-align: right; }
.eng-meta .v.ok { color: var(--ok); }

/* Process - numbered phase cards. Flat, legible, no connector line,
   no ringed circles: a phase overline, a big ghost numeral, the work. */
.steps {
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  gap: 1px;
  margin-top: 32px;
  background: var(--ridge);
  border: 1px solid var(--ridge);
  border-radius: var(--r);
  overflow: hidden;
  counter-reset: phase;
}
@media (min-width: 760px)  { .steps { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1100px) { .steps.steps-4 { grid-template-columns: repeat(4, 1fr); } }
.step {
  counter-increment: phase;
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
  padding: 24px 22px 22px;
  background: var(--panel);
  border: 0;
  border-radius: 0;
  box-shadow: none;
  overflow: hidden;
  transition: background 0.25s var(--ease-out);
}
.step:hover { background: var(--paper-2); box-shadow: none; }
[data-theme="dark"] .step:hover { background: rgba(255,255,255,0.035); }
/* Ghost phase numeral, echoing the service map's cartography. */
.step::after {
  content: counter(phase, decimal-leading-zero);
  position: absolute;
  right: 10px; top: -6px;
  font-family: 'Manrope', ui-sans-serif, system-ui, sans-serif;
  font-weight: 700;
  font-size: 74px;
  line-height: 1;
  letter-spacing: -0.04em;
  color: color-mix(in srgb, var(--ink) 5%, transparent);
  pointer-events: none;
}
[data-theme="dark"] .step::after { color: rgba(255,255,255,0.05); }
.step-num {
  width: auto;
  height: auto;
  border-radius: 0;
  display: inline-flex;
  background: transparent;
  border: 0;
  box-shadow: none;
  color: var(--muted);
  font-family: 'Manrope', ui-sans-serif, system-ui, sans-serif;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.step-num::after { content: none; }
[data-theme="dark"] .step-num {
  color: var(--muted);
  border: 0;
  box-shadow: none;
}
.step h3 {
  font-family: 'Manrope', ui-sans-serif, system-ui, sans-serif;
  font-weight: 700;
  font-size: 21px;
  line-height: 1.15;
  letter-spacing: -0.016em;
  margin: 14px 0 8px;
  color: var(--ink);
}
.step p {
  font-size: 14.5px;
  line-height: 1.6;
  color: var(--ink-2);
  margin: 0 0 20px;
}
[data-theme="dark"] .step p { color: var(--ink-2); }
.step-foot {
  margin-top: auto;
  padding-top: 0;
  border-top: 0;
  display: grid;
  gap: 8px;
}
.step-foot .line {
  display: grid;
  grid-template-columns: 1fr;
  gap: 3px;
  padding: 10px 12px;
  background: color-mix(in srgb, var(--paper-2) 70%, var(--panel));
  border: 1px solid var(--ridge);
  border-radius: var(--r-sm);
  font-family: 'Manrope', ui-sans-serif, system-ui, sans-serif;
  letter-spacing: 0;
}
.step-foot .k {
  color: var(--muted);
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.step-foot .v {
  color: var(--ink);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.25;
  text-align: left;
}

/* ═══════════════════════════════════════════════════════════
   DELIVERABLE CARDS - buyer-readable outputs, no fake terminal.
   ═══════════════════════════════════════════════════════════ */
.deliverables-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}
@media (min-width: 720px) {
  .deliverables-grid { grid-template-columns: repeat(2, 1fr); }
}
.deliverable-card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 210px;
  padding: 24px;
  background: var(--panel);
  border: 1px solid var(--ridge);
  border-radius: var(--r);
  overflow: hidden;
  transition: transform 0.3s var(--ease-out), box-shadow 0.3s var(--ease-out), border-color 0.3s var(--ease-out);
}
/* Deliverable card signature: a thin navy index rule down the left
   edge - static, not a hover reveal. */
.deliverable-card { border-left: 3px solid var(--ridge-2); }
[data-theme="dark"] .deliverable-card:hover { box-shadow: 0 16px 34px -16px rgba(0,0,0,0.55); }
.deliverable-label {
  align-self: flex-start;
  font-family: 'Manrope', ui-sans-serif, system-ui, sans-serif;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--blue);
  background: color-mix(in srgb, var(--blue) 8%, transparent);
  border: 1px solid color-mix(in srgb, var(--blue) 22%, var(--ridge));
  padding: 4px 9px;
  border-radius: 999px;
}
[data-theme="dark"] .deliverable-label { color: var(--blue-bright); border-color: color-mix(in srgb, var(--blue-bright) 30%, var(--ridge)); }
.deliverable-card h3 {
  font-family: 'Manrope', ui-sans-serif, system-ui, sans-serif;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -0.015em;
  color: var(--ink);
  margin: 14px 0 8px;
}
.deliverable-card p {
  font-size: 14.5px;
  line-height: 1.55;
  color: var(--muted);
  margin: 0;
}
[data-theme="dark"] .deliverable-card p { color: var(--ink-2); }
.deliverable-why {
  margin-top: auto;
  padding-top: 18px;
  font-size: 13px;
  line-height: 1.45;
  color: var(--ink);
  border-top: 1px solid var(--ridge);
}
.deliverable-why strong {
  font-family: 'Manrope', ui-sans-serif, system-ui, sans-serif;
  font-size: 10.5px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--muted);
  margin-right: 8px;
}

/* Legacy artifact/table styles retained only for non-marketing pages if reused later. */
.artifact { border: 1px solid var(--ridge); border-radius: var(--r); overflow: hidden; background: var(--panel); }
.artifact-head {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 10px 14px; background: var(--panel-2); border-bottom: 1px solid var(--ridge);
  font-family: 'Manrope', ui-sans-serif, system-ui, sans-serif; font-size: 11px; font-weight: 500;
  letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted);
}
.artifact-head .dot-row { display: inline-flex; gap: 6px; }
.artifact-head .dot-row i { width: 9px; height: 9px; border-radius: 50%; background: var(--ridge-2); display: block; }
.artifact-body { padding: 16px 18px; font-family: 'Manrope', ui-sans-serif, system-ui, sans-serif; font-size: 12.5px; line-height: 1.75; color: var(--ink-2); overflow-x: auto; }
.artifact-body pre { margin: 0; white-space: pre; font: inherit; }
.artifact .cmt  { color: var(--muted-2); }
.artifact .kw   { color: var(--blue); }
[data-theme="dark"] .artifact .kw { color: var(--blue-bright); }
.artifact .ok   { color: var(--ok); }
.artifact .warn { color: var(--red); }
.artifact .str  { color: var(--ink); }

/* Spec / results table */
.spec-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.spec-table th, .spec-table td { text-align: left; padding: 11px 14px; border-bottom: 1px solid var(--ridge); }
.spec-table th { font-family: 'Manrope', ui-sans-serif, system-ui, sans-serif; font-size: 10.5px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); font-weight: 500; }
.spec-table td { color: var(--ink); }
.spec-table tr:last-child td { border-bottom: 0; }
.spec-table .num { font-variant-numeric: tabular-nums; text-align: right; }
.spec-table .num.good { color: var(--ok); }

/* ── Stack groups (panels with interactive chips) ────────── */
.stack-groups { display: grid; grid-template-columns: 1fr; gap: 16px; }
@media (min-width: 640px)  { .stack-groups { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .stack-groups { grid-template-columns: repeat(3, 1fr); } }
.stack-group {
  padding: 20px 20px 22px; border: 1px solid var(--ridge); border-radius: var(--r);
  background: var(--panel);
  transition: border-color 0.25s var(--ease-out), box-shadow 0.25s var(--ease-out);
}
.stack-group:hover { border-color: var(--ridge-2); box-shadow: 0 12px 28px -20px rgba(10,14,26,0.30); }
[data-theme="dark"] .stack-group:hover { box-shadow: 0 12px 28px -18px rgba(0,0,0,0.6); }
.stack-group h3 {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: 'Manrope', ui-sans-serif, system-ui, sans-serif; font-size: 11px; font-weight: 500;
  letter-spacing: 0.1em; text-transform: uppercase; color: var(--blue); margin: 0 0 14px;
}
[data-theme="dark"] .stack-group h3 { color: var(--blue-bright); }
.stack-group h3::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.chips { display: flex; flex-wrap: wrap; gap: 6px; }
.chip {
  font-family: 'Manrope', ui-sans-serif, system-ui, sans-serif; font-size: 11.5px; color: var(--ink-2);
  background: var(--panel-2); border: 1px solid var(--ridge); border-radius: var(--r-sm);
  padding: 5px 9px;
  transition: color 0.2s var(--ease-out), border-color 0.2s var(--ease-out), background 0.2s var(--ease-out), transform 0.2s var(--ease-out);
}
[data-theme="dark"] .chip { background: rgba(255,255,255,0.04); color: var(--ink-2); }
.chip:hover { color: var(--blue); border-color: color-mix(in srgb, var(--blue) 45%, var(--ridge)); background: color-mix(in srgb, var(--blue) 7%, var(--panel-2)); transform: translateY(-1px); }
[data-theme="dark"] .chip:hover { color: var(--blue-bright); }
@media (prefers-reduced-motion: reduce) { .chip:hover { transform: none; } }

/* ── Stat row ────────────────────────────────────────────── */
.stat-row { display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid var(--ridge); border-radius: var(--r); overflow: hidden; }
.stat-cell { padding: 22px 20px; border-right: 1px solid var(--ridge); background: var(--panel); }
.stat-cell:last-child { border-right: 0; }
.stat-cell-num { font-family: 'Manrope', ui-sans-serif, system-ui, sans-serif; font-weight: 700; font-size: 30px; line-height: 1; letter-spacing: 0; color: var(--ink); font-variant-numeric: tabular-nums lining-nums; }
.stat-cell-label { font-family: 'Manrope', ui-sans-serif, system-ui, sans-serif; font-size: 10.5px; font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); margin-top: 10px; }

/* ── CTA block (panel, no glass) ─────────────────────────── */
.cta-section { background: transparent; }
.cta-block {
  padding: 40px; border-radius: var(--r);
  border: 1px solid var(--ridge); background: var(--panel);
  position: relative; overflow: hidden;
}
.cta-block { border-left: 3px solid var(--trust-navy); }
.cta-block h2 { font-family: 'Fraunces', Georgia, 'Times New Roman', serif; font-weight: 600; font-size: clamp(24px, 3vw, 34px); line-height: 1.1; letter-spacing: -0.02em; color: var(--ink); margin: 0 0 12px; }
.cta-block p { font-size: 15.5px; line-height: 1.6; color: var(--muted); margin: 0 0 26px; max-width: 560px; }
[data-theme="dark"] .cta-block p { color: var(--ink-2); }
.cta-row { display: flex; gap: 12px; flex-wrap: wrap; }

/* ── Cross-link grid (panels, no glass) ──────────────────── */
.cross-grid { display: grid; grid-template-columns: 1fr; gap: 16px; }
@media (min-width: 640px) { .cross-grid { grid-template-columns: repeat(3, 1fr); } }
.cross-card {
  display: flex; flex-direction: column; text-decoration: none; padding: 22px;
  border: 1px solid var(--ridge); border-radius: var(--r); background: var(--panel);
  transition: border-color 0.25s var(--ease-out), box-shadow 0.25s var(--ease-out), transform 0.25s var(--ease-out);
}
.cross-card:hover { border-color: var(--ridge-2); box-shadow: 0 8px 24px -14px rgba(10,14,26,0.30); }
[data-theme="dark"] .cross-card:hover { box-shadow: 0 8px 24px -12px rgba(0,0,0,0.6); }
.cross-num { font-family: 'Manrope', ui-sans-serif, system-ui, sans-serif; font-size: 11px; color: var(--muted); letter-spacing: 0.1em; margin-bottom: 12px; }
.cross-card h3 { font-family: 'Manrope', ui-sans-serif, system-ui, sans-serif; font-weight: 700; font-size: 18px; letter-spacing: 0; color: var(--ink); margin: 0 0 8px; }
.cross-card p { font-size: 13.5px; line-height: 1.55; color: var(--muted); margin: 0 0 16px; }
[data-theme="dark"] .cross-card p { color: var(--ink-2); }
.cross-link { margin-top: auto; font-family: 'Manrope', ui-sans-serif, system-ui, sans-serif; font-size: 11.5px; font-weight: 500; letter-spacing: 0.06em; text-transform: uppercase; color: var(--blue); }
[data-theme="dark"] .cross-link { color: var(--blue-bright); }

/* ── Form fields (bordered; contact.html overrides within its card) */
.field {
  width: 100%; background: var(--paper); color: var(--ink);
  border: 1px solid var(--ridge-2); border-radius: var(--r-sm);
  padding: 11px 12px; font-size: 15px; font-family: inherit;
  transition: border-color 0.2s var(--ease-out), box-shadow 0.2s var(--ease-out);
}
[data-theme="dark"] .field { background: var(--panel-2); }
.field:focus { outline: none; border-color: var(--blue); box-shadow: 0 0 0 3px color-mix(in srgb, var(--blue) 18%, transparent); }
.field::placeholder { color: var(--muted-2); }
[data-theme="dark"] .field:focus { border-color: var(--blue-bright); }
textarea.field { resize: vertical; min-height: 96px; }

/* ── Prose (legal pages) ─────────────────────────────────── */
.prose { max-width: 760px; font-size: 16px; line-height: 1.7; color: var(--ink-2); }
[data-theme="dark"] .prose { color: var(--ink-2); }
.prose h2 { font-family: 'Manrope', ui-sans-serif, system-ui, sans-serif; font-weight: 700; font-size: 24px; letter-spacing: 0; color: var(--ink); margin: 48px 0 16px; padding-top: 32px; border-top: 1px solid var(--ridge); }
.prose h2:first-child { border-top: 0; padding-top: 0; margin-top: 0; }
.prose h3 { font-family: 'Manrope', ui-sans-serif, system-ui, sans-serif; font-weight: 700; font-size: 17px; color: var(--ink); margin: 28px 0 8px; }
.prose p  { margin: 0 0 16px; }
.prose ul { padding-left: 20px; margin: 0 0 20px; }
.prose ul li { margin-bottom: 6px; }
.prose strong { color: var(--ink); font-weight: 600; }
.prose code { font-family: 'Manrope', ui-sans-serif, system-ui, sans-serif; font-size: 14px; background: var(--red-soft); color: var(--red); padding: 2px 6px; border-radius: 4px; }
.prose .placeholder { font-family: 'Manrope', ui-sans-serif, system-ui, sans-serif; font-size: 14px; color: var(--muted); background: var(--panel-2); padding: 2px 8px; border-radius: 4px; border: 1px dashed var(--ridge-2); }

/* ------------------------------------------------------------------
   Subpage redesign layer: homepage rhythm, buyer proof, editorial cards
   ------------------------------------------------------------------ */
.page-hero.band { padding: 116px 0 56px; }
@media (min-width: 1024px) { .page-hero.band { padding: 132px 0 76px; } }

.subpage-hero-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 34px;
  align-items: center;
}
@media (min-width: 960px) {
  .subpage-hero-grid { grid-template-columns: minmax(0, 1.05fr) minmax(320px, 0.78fr); gap: 52px; }
}
.page-hero-copy { min-width: 0; }

.page-proof-panel {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--ridge);
  border-radius: var(--r);
  background: var(--panel);
  box-shadow: 0 18px 42px -32px rgba(10,14,26,0.44);
}
.page-proof-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 15px 17px;
  background: var(--panel-2);
  border-bottom: 1px solid var(--ridge);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--muted);
}
.page-proof-title { display: inline-flex; align-items: center; gap: 8px; color: var(--ink); }
.page-proof-badge {
  color: var(--blue);
  font-variant-numeric: tabular-nums;
}
[data-theme="dark"] .page-proof-badge { color: var(--blue-bright); }
.page-proof-body { display: grid; }
.page-proof-row {
  display: grid;
  grid-template-columns: 34% 1fr;
  gap: 14px;
  padding: 14px 17px;
  border-bottom: 1px solid var(--ridge);
  align-items: baseline;
  font-size: 14px;
  color: var(--ink);
}
.page-proof-row:last-child { border-bottom: 0; }
.page-proof-row span:first-child {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--muted);
}
.page-proof-row strong { font-weight: 700; color: var(--ink); }
.page-proof-photo {
  margin: 0;
  position: relative;
  overflow: hidden;
  border: 1px solid var(--ridge);
  border-radius: var(--r);
  background: var(--panel-2);
  aspect-ratio: 16 / 10;
}
.page-proof-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: saturate(0.98);
}
.page-proof-photo figcaption {
  position: absolute;
  left: 10px;
  bottom: 10px;
  padding: 4px 8px;
  border-radius: var(--r-sm);
  background: rgba(10,14,26,0.62);
  color: #fff;
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.page-proof-stack { display: flex; flex-wrap: wrap; gap: 5px; }

.jump-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 12px 0 0;
  margin-top: 26px;
  border-top: 1px solid var(--ridge);
}
.jump-row a {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 7px 11px;
  border: 1px solid var(--ridge);
  border-radius: var(--r-sm);
  background: var(--panel);
  color: var(--ink);
  text-decoration: none;
  font-size: 12.5px;
  font-weight: 700;
  transition: background 0.24s var(--ease-out), border-color 0.24s var(--ease-out), color 0.24s var(--ease-out), transform 0.24s var(--ease-out);
}
.jump-row a:hover {
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--blue) 35%, var(--ridge));
  color: var(--blue);
}
[data-theme="dark"] .jump-row a:hover { color: var(--blue-bright); }

.section.band { padding: 68px 0; }
@media (min-width: 1024px) { .section.band { padding: 88px 0; } }
.section.band .section-head,
.section.band .modules,
.section.band .deliverables-grid,
.section.band .stack-groups,
.section.band .steps,
.section.band .bench-row,
.section.band .cross-grid,
.section.band .cta-block,
.section.band .split,
.section.band .founders-lead,
.section.band .founder-grid { position: relative; z-index: 2; }

/* Service pages: one restrained palette.
   Section distinction comes from spacing, borders, and density - not
   alternating beige / blue / white blocks. Keep navy only for process. */
body.service-page main > .section.band:not(.page-hero):not(.band--ink) {
  background: var(--paper);
  border-top: 1px solid var(--line-soft);
}
body.service-page #deliverables.band--warm,
body.service-page #team.band--blue {
  background: var(--paper);
}
body.service-page .section-head {
  margin-bottom: 34px;
}
body.service-page .deliverable-card,
body.service-page .stack-group,
body.service-page .eng,
body.service-page .cross-card,
body.service-page .cta-block {
  background: color-mix(in srgb, var(--panel) 94%, var(--paper));
}
body.service-page .deliverable-card {
  border-left-color: var(--line-soft);
}
body.service-page .deliverable-label,
body.service-page .stack-group h3,
body.service-page .eng-code,
body.service-page .eng-avail {
  color: var(--muted);
}
body.service-page .deliverable-label {
  background: transparent;
  border-color: var(--ridge);
}
body.service-page .stack-group h3::before {
  background: var(--ridge-2);
  box-shadow: none;
}
body.service-page .chip:hover,
body.service-page .tag:hover {
  color: var(--ink);
  border-color: var(--ridge-2);
  background: color-mix(in srgb, var(--panel-2) 72%, var(--panel));
}
body.service-page .module-rows .mr--out {
  border-top-color: var(--ridge);
  background: color-mix(in srgb, var(--panel-2) 72%, var(--panel));
}
body.service-page .module-rows .mr--out .mr-k {
  color: var(--muted);
}
body.service-page #process.band--ink {
  border-top: 0;
}

/* Service pages: restrained blue accents.
   The field stays ivory/grey; blue returns as a structural signal. */
body.service-page main > .section.band:not(.band--ink) .eyebrow {
  color: var(--kosovo-blue);
}
body.service-page .deliverable-card {
  border-left-color: var(--kosovo-blue);
}
body.service-page .deliverable-label {
  color: var(--kosovo-blue);
  background: color-mix(in srgb, var(--kosovo-blue) 7%, transparent);
  border-color: color-mix(in srgb, var(--kosovo-blue) 24%, var(--ridge));
}
body.service-page .stack-group h3 {
  color: var(--kosovo-blue);
}
body.service-page .stack-group h3::before {
  background: currentColor;
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--kosovo-blue) 10%, transparent);
}
body.service-page .module-rows .mr--out {
  border-top-color: color-mix(in srgb, var(--kosovo-blue) 24%, var(--ridge));
  background: color-mix(in srgb, var(--kosovo-blue) 5%, var(--panel));
}
body.service-page .module-rows .mr--out .mr-k {
  color: var(--kosovo-blue);
}
body.service-page .eng-avail {
  color: var(--kosovo-blue);
}
body.service-page .eng-avail .status-dot--ok,
body.service-page .page-proof-title .status-dot--ok {
  background: var(--kosovo-blue);
}
body.service-page .deliverable-card:hover,
body.service-page .stack-group:hover,
body.service-page .eng:hover,
body.service-page .eng:focus-within,
body.service-page .cross-card:hover {
  border-color: color-mix(in srgb, var(--kosovo-blue) 30%, var(--ridge));
}
body.service-page .deliverable-card:hover,
body.service-page .eng:hover,
body.service-page .eng:focus-within {
  box-shadow: 0 14px 30px -24px color-mix(in srgb, var(--kosovo-blue) 45%, rgba(10,14,26,0.35));
}
body.service-page .chip:hover,
body.service-page .tag:hover {
  color: var(--kosovo-blue);
  border-color: color-mix(in srgb, var(--kosovo-blue) 38%, var(--ridge));
  background: color-mix(in srgb, var(--kosovo-blue) 6%, var(--panel-2));
}

/* ── Card interaction: flat and differentiated ────────────────
   The previous build gave five unrelated families ONE identical
   hover: a blue top-rule, a diagonal wash, and a shared upward lift.
   That uniformity was the strongest AI fingerprint. Each family now
   settles quietly and differently - no lift, no blue rule, no wash. */
.module,
.deliverable-card,
.stack-group,
.eng,
.cross-card {
  position: relative;
  transition: border-color 0.28s var(--ease-out), box-shadow 0.28s var(--ease-out);
}
/* Modules: editorial text blocks - the border simply firms up. */
.module:hover { border-color: var(--ridge-2); }
/* Deliverables & cross-links: border + faint settle shadow. */
.deliverable-card:hover,
.cross-card:hover {
  border-color: var(--ridge-2);
  box-shadow: 0 10px 26px -20px rgba(10,14,26,0.26);
}
/* Stack groups: quiet border only. */
.stack-group:hover { border-color: var(--ridge-2); }
/* Bench/profile cards: image-led dossier - border + faint shadow. */
.eng:hover,
.eng:focus-within {
  border-color: var(--ridge-2);
  box-shadow: 0 10px 26px -18px rgba(10,14,26,0.24);
}
[data-theme="dark"] .module:hover,
[data-theme="dark"] .deliverable-card:hover,
[data-theme="dark"] .stack-group:hover,
[data-theme="dark"] .cross-card:hover,
[data-theme="dark"] .eng:hover,
[data-theme="dark"] .eng:focus-within {
  border-color: var(--ridge-2);
  box-shadow: 0 10px 26px -18px rgba(0,0,0,0.5);
}

/* ── Brief modules: a client dossier, not a feature card. ─────
   Numbered header strip, flat keyed rows, and the "first 30 days"
   outcome as a blue-grey result band across the foot. */
.module { padding: 0; min-height: 100%; overflow: hidden; box-shadow: var(--shadow-sm); display: flex; flex-direction: column; }
.module-head {
  padding: 16px 22px;
  background: var(--panel-2);
  border-bottom: 1px solid var(--ridge);
  gap: 14px;
}
[data-theme="dark"] .module-head { background: rgba(255,255,255,0.04); }
.module-ico {
  width: auto; height: auto;
  background: transparent; border: 0; border-radius: 0;
  font-family: 'Manrope', ui-sans-serif, system-ui, sans-serif;
  font-weight: 700; font-size: 26px; line-height: 1;
  letter-spacing: 0;
  color: var(--muted-2);
  font-variant-numeric: lining-nums;
}
.module h3 { font-size: 19px; }
.module-rows { margin: 0; padding: 4px 22px 0; flex: 1 1 auto; display: flex; flex-direction: column; }
.module-rows .mr {
  border: 0; border-radius: 0; background: transparent;
  border-top: 1px solid var(--ridge);
  padding: 14px 0;
}
.module-rows .mr:first-child { border-top: 0; }
@media (min-width: 520px) { .module-rows .mr { grid-template-columns: 118px 1fr; gap: 14px; } }
.module-rows .mr-v { color: var(--ink-2); }
.module-rows .mr-v strong { color: var(--ink); }
/* Result band: what lands in the first 30 days. */
.module-rows .mr--out {
  margin: 10px -22px 0;
  padding: 15px 22px 17px;
  border-top: 1px solid color-mix(in srgb, var(--availability-blue) 28%, var(--ridge));
  background: color-mix(in srgb, var(--availability-blue) 6%, var(--panel));
}
[data-theme="dark"] .module-rows .mr--out {
  background: color-mix(in srgb, var(--availability-blue) 9%, var(--panel));
}
.module-rows .mr--out .mr-k { color: var(--availability-blue); }
.module-rows .mr--out .mr-v { color: var(--ink); font-weight: 600; }

/* The brief is a quiet, fixed three-part summary. */
.service-page #brief .module { overflow: visible; border: 0; background: transparent; box-shadow: none; }
.service-page #brief .module-head { padding: 0 0 18px; background: transparent; border-bottom: 0; }
.service-page #brief .module-ico { color: var(--kosovo-blue); }
.service-page #brief .brief-signal { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0; overflow: hidden; border: 1px solid var(--ridge); border-radius: var(--r-sm); background: var(--panel); box-shadow: none; }
.service-page #brief .brief-stage { min-height: 102px; padding: 20px 18px; border: 0; background: transparent; opacity: 1; transform: none; transition: none; }
.service-page #brief .brief-stage + .brief-stage { border-left: 1px solid var(--ridge); }
.service-page #brief .brief-stage::before,
.service-page #brief .brief-stage::after { content: none; }
.service-page #brief .brief-stage small { display: block; margin-bottom: 8px; color: var(--muted); font: 700 8px/1.2 'Manrope', sans-serif; letter-spacing: .1em; text-transform: uppercase; }
.service-page #brief .brief-stage strong { display: block; max-width: 17ch; color: var(--ink); font: 700 clamp(12px, 1.15vw, 15px)/1.3 'Manrope', sans-serif; }
.service-page #brief .module-rows { margin-top: 16px; padding: 0; }
.service-page #brief .module-rows .mr { padding: 13px 0; }
.service-page #brief .module-rows .mr--out { margin: 9px 0 0; padding: 15px 0 0; background: transparent; }
@media (max-width:560px) { .service-page #brief .brief-signal { grid-template-columns: 1fr; }.service-page #brief .brief-stage { min-height: 0; padding: 16px 18px; }.service-page #brief .brief-stage + .brief-stage { border-top: 1px solid var(--ridge); border-left: 0; } }
.delivery-instrument { --delivery-progress:0; position:relative; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(14px,3vw,34px); margin:34px 0 42px; padding:26px 26px 22px; overflow:hidden; border:1px solid var(--ridge); border-radius:var(--r-sm); background:color-mix(in srgb,var(--panel) 78%,var(--paper-2)); box-shadow:0 12px 26px -28px rgba(10,14,26,.42); clip-path:none; }
.delivery-instrument::before { display:none; }
.delivery-instrument::after { content:''; position:absolute; left:9%; right:9%; top:42px; height:1px; background:color-mix(in srgb,var(--kosovo-blue) 16%,var(--ridge)); }
.delivery-route { display:none; }
.delivery-route::after { display:none; }
.delivery-node { position:relative; z-index:3; min-height:116px; padding:60px 0 0; opacity:1; transform:none; transition:none; }
.delivery-node::before { content:''; position:absolute; top:35px; left:0; width:12px; height:12px; border:2px solid color-mix(in srgb,var(--kosovo-blue) 68%,var(--ridge)); border-radius:50%; background:var(--panel); box-shadow:0 0 0 4px color-mix(in srgb,var(--kosovo-blue) 6%,transparent); }
.delivery-node:last-of-type::before { background:var(--panel); }
.delivery-node small { display:block; margin-bottom:8px; color:var(--muted); font:700 8px/1.2 'Manrope',sans-serif; letter-spacing:.12em; text-transform:uppercase; }
.delivery-node strong { display:block; max-width:17ch; color:var(--ink); font:700 clamp(13px,1.2vw,16px)/1.24 'Manrope',sans-serif; }
@media(max-width:560px){.delivery-instrument{grid-template-columns:1fr;gap:0;margin:28px 0 34px;padding:24px 24px 24px 54px;clip-path:none}.delivery-instrument::after{left:27px;top:34px;bottom:34px;right:auto;width:1px;height:auto}.delivery-route{display:none}.delivery-node{min-height:76px;padding:0 0 0 12px}.delivery-node::before{left:-34px;top:1px}}
@media(prefers-reduced-motion:reduce){.delivery-route{display:none}.delivery-node{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce) and (max-width:560px){.delivery-route{display:none;width:0;height:0;transform:none}}

.deliverable-card { min-height: 218px; }
.deliverable-label { border-radius: var(--r-sm); }

.stack-group { min-height: 136px; }
.stack-group h3::before { box-shadow: 0 0 0 4px color-mix(in srgb, currentColor 12%, transparent); }
.chip:hover { transform: none; }

.eng { min-height: 100%; }
.eng-person { display: inline-flex; align-items: center; gap: 10px; min-width: 0; }
.eng-avatar {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  flex-shrink: 0;
  object-fit: cover;
  border: 1px solid var(--ridge);
  background: var(--paper-2);
  box-shadow: 0 8px 18px -14px rgba(10,14,26,0.45);
}
.eng-person-text { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.eng-name {
  font-family: 'Manrope', ui-sans-serif, system-ui, sans-serif;
  font-size: 16px;
  line-height: 1.05;
  font-weight: 700;
  letter-spacing: 0;
  color: var(--ink);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.eng-code {
  font-family: 'Manrope', ui-sans-serif, system-ui, sans-serif;
  font-size: 10px;
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--muted);
}

.cross-card { min-height: 178px; }

.cta-section.band .cta-block {
  box-shadow: 0 22px 52px -36px rgba(10,14,26,0.45);
}

.band--ink .page-proof-panel,
.band--ink .module,
.band--ink .deliverable-card,
.band--ink .stack-group,
.band--ink .eng,
.band--ink .cross-card,
.band--ink .cta-block {
  background: rgba(255,255,255,0.045);
  border-color: rgba(255,255,255,0.10);
  box-shadow: none;
}
/* Steps on the ink band: solid cells with light hairlines between. */
.band--ink .steps { background: rgba(255,255,255,0.15); border-color: rgba(255,255,255,0.15); }
.band--ink .step { background: color-mix(in srgb, #FFFFFF 4%, var(--band-ink)); }
.band--ink .step:hover { background: color-mix(in srgb, #FFFFFF 8%, var(--band-ink)); }
.band--ink .step::after { color: rgba(255,255,255,0.06); }
.band--ink .step h3 { color: #F7F8FA; }
.band--ink .page-proof-head,
.band--ink .module-rows .mr,
.band--ink .step-foot .line {
  background: rgba(255,255,255,0.05);
  border-color: rgba(255,255,255,0.10);
}
.band--ink .page-proof-row,
.band--ink .deliverable-why,
.band--ink .eng-meta,
.band--ink .cross-card p,
.band--ink .cta-block p {
  border-color: rgba(255,255,255,0.10);
}
.band--ink .module:hover,
.band--ink .deliverable-card:hover,
.band--ink .stack-group:hover,
.band--ink .eng:hover,
.band--ink .eng:focus-within,
.band--ink .cross-card:hover {
  background: rgba(255,255,255,0.075);
  border-color: color-mix(in srgb, var(--blue-bright) 45%, rgba(255,255,255,0.10));
  box-shadow: 0 20px 44px -22px rgba(0,0,0,0.65);
}
.band--ink .module p,
.band--ink .module-rows .mr-v,
.band--ink .deliverable-card p,
.band--ink .deliverable-why,
.band--ink .eng-exp,
.band--ink .eng-meta .k,
.band--ink .cross-card p,
.band--ink .step p { color: rgba(244,245,248,0.74); }
.band--ink .module-rows .mr-v,
.band--ink .eng-meta .v,
.band--ink .step-foot .v { color: #F7F8FA; }
.band--ink .module-rows .mr-k,
.band--ink .deliverable-why strong,
.band--ink .step-foot .k,
.band--ink .page-proof-row span:first-child { color: rgba(244,245,248,0.58); }
.band--ink .step-num { background: transparent; box-shadow: none; color: rgba(244,245,248,0.6); }

.band--blue .composition,
.band--blue .founder-photo,
.band--blue .defs,
.band--blue .trust-ledger {
  background: color-mix(in srgb, var(--panel) 90%, var(--kosovo-blue));
}
[data-theme="dark"] .band--blue .composition,
[data-theme="dark"] .band--blue .founder-photo,
[data-theme="dark"] .band--blue .defs,
[data-theme="dark"] .band--blue .trust-ledger { background: rgba(255,255,255,0.03); }

/* About page */
.about-hero-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 38px;
  align-items: center;
}
@media (min-width: 960px) { .about-hero-grid { grid-template-columns: 1fr 0.9fr; gap: 56px; } }
.about-hero-media { display: grid; gap: 16px; }
.idea-line {
  margin-top: 22px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
  font-size: 12px;
  color: var(--muted);
}
.idea-line .node { display: inline-flex; align-items: center; gap: 7px; color: var(--ink); }
.idea-line .dot { width: 7px; height: 7px; border-radius: 50%; }
.idea-line .dot--at { background: var(--red); }
.idea-line .dot--xk { background: var(--kosovo-blue); }

.founders-lead { display: grid; grid-template-columns: 1fr; gap: 32px; align-items: center; }
@media (min-width: 900px) { .founders-lead { grid-template-columns: 5fr 7fr; gap: 48px; } }
.founders-lead--solo {
  max-width: 820px;
}
@media (min-width: 900px) {
  .founders-lead--solo { grid-template-columns: 1fr; }
}
.founder-group {
  margin: 0;
  position: relative;
  overflow: hidden;
  border: 1px solid var(--ridge);
  border-radius: var(--r);
  aspect-ratio: 4 / 3;
  background: var(--panel-2);
}
.founder-group img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 30%;
  display: block;
  filter: saturate(0.98);
}
.founder-group figcaption,
.founder-photo figcaption {
  position: absolute;
  left: 10px;
  bottom: 10px;
  padding: 4px 8px;
  border-radius: var(--r-sm);
  background: rgba(10,14,26,0.62);
  color: #fff;
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.founders-lead-body h3 {
  font-family: 'Fraunces', Georgia, 'Times New Roman', serif;
  font-weight: 600;
  font-size: clamp(22px, 2.6vw, 30px);
  letter-spacing: -0.02em;
  color: var(--ink);
  margin: 0 0 14px;
}
.founders-lead-body p,
.prose-block p {
  font-size: 15.5px;
  line-height: 1.72;
  color: var(--ink-2);
  margin: 0 0 16px;
}
.founders-lead-body p:last-child,
.prose-block p:last-child { margin-bottom: 0; }
.prose-block strong { color: var(--ink); font-weight: 700; }

.founder-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
  margin-top: 32px;
}
@media (min-width: 640px) { .founder-grid { grid-template-columns: repeat(3, 1fr); } }
.founder-card { margin: 0; display: flex; flex-direction: column; }
.founder-photo {
  position: relative;
  width: 100%;
  aspect-ratio: 4 / 5;
  border: 1px solid var(--ridge);
  border-radius: var(--r);
  overflow: hidden;
  background: var(--panel-2);
  box-shadow: 0 14px 34px -28px rgba(10,14,26,0.38);
}
.founder-photo.is-highlighted {
  border-color: var(--blue);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--blue) 18%, transparent), 0 18px 38px -24px rgba(37,99,235,0.55);
}
[data-theme="dark"] .founder-photo.is-highlighted {
  border-color: var(--blue-bright);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--blue-bright) 24%, transparent), 0 18px 38px -24px rgba(96,165,250,0.52);
}
.founder-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: saturate(0.98);
}
.founder-photo img.shift-y-up-15 { height: 123%; transform: translateY(-15%); }
.founder-card figcaption { margin-top: 14px; }
.founder-card strong {
  display: block;
  font-family: 'Manrope', ui-sans-serif, system-ui, sans-serif;
  font-weight: 700;
  font-size: 16px;
  letter-spacing: 0;
  color: var(--ink);
}
.founder-role {
  display: block;
  margin-top: 4px;
  font-size: 10.5px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--muted);
}
.split { display: grid; grid-template-columns: 1fr; gap: 40px; align-items: start; }
@media (min-width: 940px) { .split { grid-template-columns: 1fr 1fr; gap: 56px; } }

.defs,
.trust-ledger {
  display: flex;
  flex-direction: column;
  gap: 0;
  border: 1px solid var(--ridge);
  border-radius: var(--r);
  overflow: hidden;
  background: var(--panel);
}
.def {
  padding: 20px 22px;
  border-bottom: 1px solid var(--ridge);
}
.def:last-child { border-bottom: 0; }
.def-k {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--blue);
  margin-bottom: 8px;
}
[data-theme="dark"] .def-k { color: var(--blue-bright); }
.def-v {
  font-size: 14.5px;
  line-height: 1.6;
  color: var(--ink-2);
}
.def-v strong { color: var(--ink); font-weight: 700; }

.led-by {
  display: flex;
  gap: 18px;
  align-items: flex-start;
  padding: 22px 24px;
  border: 1px solid var(--ridge);
  border-radius: var(--r);
  background: var(--panel);
}
.led-by-mark {
  flex-shrink: 0;
  width: 52px;
  height: 52px;
  border-radius: var(--r-sm);
  background: var(--ink);
  color: var(--paper);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Manrope', ui-sans-serif, system-ui, sans-serif;
  font-weight: 700;
  font-size: 17px;
  letter-spacing: 0.02em;
}
.led-by-text { font-size: 14.5px; line-height: 1.6; color: var(--ink-2); }
.led-by-text strong { color: var(--ink); }
.led-by-eyebrow {
  display: block;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 6px;
}
.why-list { list-style: none; padding: 0; margin: 0; }
.why-list li {
  display: grid;
  grid-template-columns: 132px 1fr;
  gap: 16px;
  padding: 15px 0;
  border-top: 1px solid var(--ridge);
  align-items: baseline;
}
@media (max-width: 520px) { .why-list li { grid-template-columns: 1fr; gap: 4px; } }
.why-list .k {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--blue);
}
[data-theme="dark"] .why-list .k { color: var(--blue-bright); }
.why-list .v { font-size: 14.5px; line-height: 1.55; color: var(--ink); }
.why-list .v span { color: var(--muted); }
.manifesto {
  margin: 0;
  padding: 24px 28px;
  border-left: 3px solid var(--blue);
  background: var(--panel-2);
  border-radius: 0 var(--r) var(--r) 0;
  font-size: clamp(17px, 1.8vw, 20px);
  line-height: 1.5;
  letter-spacing: -0.01em;
  color: var(--ink);
}
[data-theme="dark"] .manifesto { border-left-color: var(--blue-bright); }
.manifesto em {
  font-family: 'Fraunces', serif;
  font-style: italic;
  font-weight: 400;
  color: var(--blue);
}
[data-theme="dark"] .manifesto em { color: var(--blue-bright); }
.band--ink .founders-lead-body h3,
.band--ink .founder-card strong,
.band--ink .def-v strong,
.band--ink .led-by-text strong,
.band--ink .why-list .v,
.band--ink .prose-block strong { color: #F7F8FA; }
.band--ink .founders-lead-body p,
.band--ink .prose-block p,
.band--ink .def-v,
.band--ink .led-by-text,
.band--ink .why-list .v span { color: rgba(244,245,248,0.74); }
.band--ink .defs,
.band--ink .trust-ledger,
.band--ink .led-by,
.band--ink .manifesto {
  background: rgba(255,255,255,0.045);
  border-color: rgba(255,255,255,0.10);
}
.band--ink .manifesto { color: #F7F8FA; }
.band--ink .manifesto em { color: #FFFFFF; }
.band--ink .def,
.band--ink .why-list li { border-color: rgba(255,255,255,0.10); }
.band--ink .led-by-mark { background: #F7F8FA; color: var(--band-ink); }

/* ── Page-hero entrance - restrained fade-up ─────────────── */
.page-hero .breadcrumb,
.page-hero .eyebrow,
.page-h1,
.page-lede,
.page-hero-meta,
.page-proof-panel,
.page-proof-photo,
.jump-row {
  opacity: 0; transform: translateY(12px);
  animation: heroIn 0.8s var(--ease-out) forwards;
}
.page-hero .breadcrumb { animation-delay: 0.04s; }
.page-hero .eyebrow    { animation-delay: 0.12s; }
.page-h1               { animation-delay: 0.20s; }
.page-lede             { animation-delay: 0.32s; }
.page-hero-meta        { animation-delay: 0.42s; }
.page-proof-panel      { animation-delay: 0.34s; }
.page-proof-photo      { animation-delay: 0.24s; }
.jump-row              { animation-delay: 0.48s; }
@keyframes heroIn { to { opacity: 1; transform: translateY(0); } }

/* ── Scroll reveal ───────────────────────────────────────── */
[data-reveal] { transition: opacity 0.7s var(--ease-out), transform 0.7s var(--ease-out); }

/* ── Reduced motion ──────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .page-hero .breadcrumb,
  .page-hero .eyebrow,
  .page-h1,
  .page-lede,
  .page-hero-meta,
  .page-proof-panel,
  .page-proof-photo,
  .jump-row { opacity: 1; transform: none; animation: none; }
  .module:hover,
  .deliverable-card:hover,
  .stack-group:hover,
  .cross-card:hover,
  .eng:hover,
  .jump-row a:hover { transform: none; }
}

/* ==========================================================
   SUBPAGE MOTION SPINE
   A single delivery signal links the hero, proof and CTA.
   ========================================================== */
.service-page,
.about-page {
  --subpage-progress: 0;
  --subpage-edge: clamp(22px, calc((100vw - 1120px) / 2 - 38px), 130px);
  --subpage-blue: var(--kosovo-blue);
  --subpage-ease: cubic-bezier(.22, 1, .36, 1);
}
[data-theme="dark"] .service-page,
[data-theme="dark"] .about-page { --subpage-blue: var(--kosovo-blue-bright); }
.service-page main,
.about-page main { position: relative; isolation: isolate; }
.service-page main > section,
.about-page main > section { position: relative; z-index: 1; }

.subpage-journey {
  position: absolute;
  left: var(--subpage-edge);
  top: var(--subpage-top, 0px);
  width: 1px;
  height: var(--subpage-height, 0px);
  z-index: 5;
  opacity: 0;
  pointer-events: none;
  transition: opacity .5s ease;
}
.subpage-motion-ready .subpage-journey { opacity: .82; }
.subpage-journey-track,
.subpage-journey-fill {
  position: absolute;
  inset: 0;
  width: 1px;
  transform-origin: top;
}
.subpage-journey-track { background: color-mix(in srgb, var(--subpage-blue) 19%, var(--ridge)); }
.subpage-journey-fill {
  height: calc(var(--subpage-progress) * 100%);
  background: linear-gradient(to bottom, color-mix(in srgb, var(--subpage-blue) 42%, transparent), var(--subpage-blue));
  box-shadow: 0 0 12px color-mix(in srgb, var(--subpage-blue) 24%, transparent);
}
.subpage-journey-signal {
  position: absolute;
  left: 50%;
  top: calc(var(--subpage-progress) * 100%);
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--subpage-blue);
  box-shadow:
    0 0 0 5px color-mix(in srgb, var(--subpage-blue) 11%, transparent),
    0 0 18px color-mix(in srgb, var(--subpage-blue) 58%, transparent);
  transform: translate(-50%, -50%);
}
.subpage-marker {
  position: absolute;
  left: var(--subpage-edge);
  top: clamp(78px, 8vw, 108px);
  z-index: 6;
  width: 1px;
  height: 1px;
  pointer-events: none;
}
.subpage-marker::before {
  content: '';
  position: absolute;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--panel);
  border: 1px solid color-mix(in srgb, var(--subpage-blue) 42%, var(--ridge));
  transform: translate(-50%, -50%);
  transition: background .35s ease, border-color .35s ease, box-shadow .35s ease;
}
.subpage-marker::after {
  content: '';
  position: absolute;
  left: 6px;
  top: 0;
  width: clamp(28px, 3.5vw, 52px);
  height: 1px;
  background: var(--subpage-blue);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .7s var(--subpage-ease);
}
.subpage-marker span {
  position: absolute;
  left: 13px;
  bottom: 9px;
  width: 120px;
  font-family: 'Manrope', ui-sans-serif, system-ui, sans-serif;
  font-size: 8.5px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: .11em;
  text-transform: uppercase;
  color: var(--muted-2);
  white-space: nowrap;
  transition: color .35s ease;
}
[data-motion-scene].is-active .subpage-marker::before {
  background: var(--subpage-blue);
  border-color: var(--subpage-blue);
  box-shadow: 0 0 0 5px color-mix(in srgb, var(--subpage-blue) 10%, transparent);
}
[data-motion-scene].is-active .subpage-marker::after { transform: scaleX(1); }
[data-motion-scene].is-active .subpage-marker span { color: var(--subpage-blue); }
.band--ink .subpage-marker::before { background: var(--band-ink); }
.cta-section .subpage-marker::before {
  width: 10px;
  height: 10px;
  box-shadow: 0 0 0 7px color-mix(in srgb, var(--subpage-blue) 10%, transparent);
}

.subpage-handoff {
  position: absolute;
  left: var(--subpage-edge);
  bottom: -1px;
  width: 1px;
  height: 74px;
  z-index: 6;
  overflow: hidden;
  pointer-events: none;
}
.subpage-handoff::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, transparent, var(--subpage-blue));
  transform: translateY(-100%);
  animation: subpage-handoff-line 1s var(--subpage-ease) .75s both;
}
.subpage-handoff::after {
  content: '';
  position: absolute;
  left: 50%;
  top: 0;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--subpage-blue);
  box-shadow: 0 0 14px color-mix(in srgb, var(--subpage-blue) 70%, transparent);
  transform: translate(-50%, -8px);
  animation: subpage-handoff-dot 1s var(--subpage-ease) .75s both;
}
@keyframes subpage-handoff-line { to { transform: translateY(0); } }
@keyframes subpage-handoff-dot { to { transform: translate(-50%, 70px); } }

/* Hero proof is assembled row by row after the headline lands. */
.service-page .page-proof-row,
.about-page .page-proof-row {
  opacity: 0;
  transform: translateX(12px);
  transition: opacity .58s var(--subpage-ease), transform .68s var(--subpage-ease);
}
.service-page .page-hero.is-active .page-proof-row,
.about-page .page-hero.is-active .page-proof-row { opacity: 1; transform: none; }
.page-hero .page-proof-row:nth-child(2) { transition-delay: 70ms; }
.page-hero .page-proof-row:nth-child(3) { transition-delay: 140ms; }
.page-hero .page-proof-row:nth-child(4) { transition-delay: 210ms; }
.page-hero .page-proof-row:nth-child(5) { transition-delay: 280ms; }
.subpage-motion-ready .page-h1 {
  opacity: 1;
  transform: none;
  clip-path: inset(0 0 100% 0);
  animation: subpage-title-mask .9s var(--subpage-ease) .12s forwards;
}
@keyframes subpage-title-mask { to { clip-path: inset(0); } }

/* Internal hierarchy: cards arrive individually, not as one generic block. */
.service-page [data-motion-scene] .module,
.service-page [data-motion-scene] .deliverable-card,
.service-page [data-motion-scene] .stack-group,
.service-page [data-motion-scene] .eng,
.service-page [data-motion-scene] .cross-card {
  opacity: 0;
  transform: translateY(16px);
  transition:
    opacity .62s var(--subpage-ease),
    transform .72s var(--subpage-ease),
    border-color .25s var(--ease-out),
    box-shadow .25s var(--ease-out);
}
.service-page [data-motion-scene].is-active .module,
.service-page [data-motion-scene].is-active .deliverable-card,
.service-page [data-motion-scene].is-active .stack-group,
.service-page [data-motion-scene].is-active .eng,
.service-page [data-motion-scene].is-active .cross-card { opacity: 1; transform: none; }
.service-page [data-motion-scene] .module:nth-child(2),
.service-page [data-motion-scene] .deliverable-card:nth-child(2),
.service-page [data-motion-scene] .stack-group:nth-child(2),
.service-page [data-motion-scene] .eng:nth-child(2),
.service-page [data-motion-scene] .cross-card:nth-child(2) { transition-delay: 80ms; }
.service-page [data-motion-scene] .deliverable-card:nth-child(3),
.service-page [data-motion-scene] .stack-group:nth-child(3),
.service-page [data-motion-scene] .cross-card:nth-child(3) { transition-delay: 160ms; }
.service-page [data-motion-scene] .deliverable-card:nth-child(4),
.service-page [data-motion-scene] .stack-group:nth-child(4) { transition-delay: 240ms; }
.service-page [data-motion-scene] .stack-group:nth-child(5) { transition-delay: 320ms; }
.service-page [data-motion-scene] .stack-group:nth-child(6) { transition-delay: 400ms; }
.service-page [data-motion-scene]:not(.is-complete) .module:hover,
.service-page [data-motion-scene]:not(.is-complete) .deliverable-card:hover,
.service-page [data-motion-scene]:not(.is-complete) .stack-group:hover,
.service-page [data-motion-scene]:not(.is-complete) .eng:hover,
.service-page [data-motion-scene]:not(.is-complete) .cross-card:hover { transform: none; }

/* Deliverables get a blue acceptance line instead of another hover gimmick. */
.service-page .deliverable-card::after {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 3px;
  height: 100%;
  background: var(--subpage-blue);
  transform: scaleY(0);
  transform-origin: top;
  transition: transform .68s var(--subpage-ease) 180ms;
}
.service-page [data-motion-scene].is-active .deliverable-card::after { transform: scaleY(1); }

/* Service process: one compact sticky phase sequence. */
.service-page #process .section-head::after { display: none; }
@media (min-width: 1024px) and (min-height: 700px) {
  .service-page.subpage-motion-ready #process { min-height: max(900px, 126vh); overflow: clip; }
  .service-page.subpage-motion-ready #process > .container { position: sticky; top: 13vh; }
  .service-page.subpage-motion-ready #process .steps { position: relative; --process-progress: 0; }
  .service-page.subpage-motion-ready #process .process-signal {
    position: relative;
    z-index: 4;
    display: block;
    height: 24px;
    margin: 0 8%;
    pointer-events: none;
  }
  .service-page.subpage-motion-ready #process .process-signal-track,
  .service-page.subpage-motion-ready #process .process-signal-fill {
    position: absolute;
    top: 3px;
    left: 0;
    height: 2px;
  }
  .service-page.subpage-motion-ready #process .process-signal-track { width: 100%; background: rgba(255,255,255,.16); }
  .service-page.subpage-motion-ready #process .process-signal-fill {
    width: calc(var(--process-progress) * 100%);
    background: var(--subpage-blue);
    box-shadow: 0 0 12px color-mix(in srgb, var(--subpage-blue) 48%, transparent);
  }
  .service-page.subpage-motion-ready #process .process-signal-pulse {
    position: absolute;
    top: 0;
    left: calc(var(--process-progress) * 100%);
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 0 0 3px var(--subpage-blue), 0 0 18px color-mix(in srgb, var(--subpage-blue) 72%, transparent);
    transform: translateX(-50%);
    transition: left .08s linear;
  }
  .service-page.subpage-motion-ready #process .step {
    opacity: .72;
    transition: opacity .5s ease, transform .55s var(--subpage-ease), background .4s ease;
  }
  .service-page.subpage-motion-ready #process .step.is-current {
    opacity: 1;
    transform: translateY(-4px);
    background: rgba(255,255,255,.07);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--subpage-blue) 48%, transparent);
  }
  .service-page.subpage-motion-ready #process .step.is-past { opacity: .88; }
}

/* About: editorial founder reveal, accountability rows and QA checkpoint. */
.about-page [data-motion-scene] .founder-card,
.about-page [data-motion-scene] .def,
.about-page [data-motion-scene] .stat-cell,
.about-page [data-motion-scene] .why-list li,
.about-page [data-motion-scene] .led-by,
.about-page [data-motion-scene] .manifesto {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity .64s var(--subpage-ease), transform .74s var(--subpage-ease);
}
.about-page [data-motion-scene].is-active .founder-card,
.about-page [data-motion-scene].is-active .def,
.about-page [data-motion-scene].is-active .stat-cell,
.about-page [data-motion-scene].is-active .why-list li,
.about-page [data-motion-scene].is-active .led-by,
.about-page [data-motion-scene].is-active .manifesto { opacity: 1; transform: none; }
.about-page .founder-card:nth-child(2),
.about-page .def:nth-child(2),
.about-page .stat-cell:nth-child(2),
.about-page .why-list li:nth-child(2),
.about-page .manifesto { transition-delay: 90ms; }
.about-page .founder-card:nth-child(3),
.about-page .def:nth-child(3),
.about-page .stat-cell:nth-child(3),
.about-page .why-list li:nth-child(3) { transition-delay: 180ms; }
.about-page .def:nth-child(4),
.about-page .why-list li:nth-child(4) { transition-delay: 270ms; }
.about-page .why-list li:nth-child(5) { transition-delay: 360ms; }
.about-page .founder-photo::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 2px;
  background: var(--subpage-blue);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .8s var(--subpage-ease) 180ms;
}
.about-page [data-motion-scene].is-active .founder-photo::after { transform: scaleX(1); }

/* Riad is the named accountability signal inside the quality story. */
.about-page .band--ink.is-quality-focus .led-by {
  border-color: color-mix(in srgb, var(--subpage-blue) 72%, rgba(255,255,255,.18));
  box-shadow: 0 18px 38px -28px color-mix(in srgb, var(--subpage-blue) 90%, transparent);
}
.about-page .band--ink.is-quality-focus .led-by-text strong { color: var(--subpage-blue); }
.about-page .band--ink.is-quality-focus .led-by-eyebrow { color: rgba(247,248,250,.68); }

/* Contact now uses the same route handoff and precise panel motion as the service pages. */
.contact-page .page-hero { background: var(--paper); }
.contact-page .page-hero .contact-hero-aurora { opacity: 0; }
.contact-page [data-motion-scene] .trust-row,
.contact-page [data-motion-scene] .contact-meta-card,
.contact-page [data-motion-scene] .contact-form-card,
.contact-page [data-motion-scene] .faq-section {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity .68s var(--subpage-ease), transform .76s var(--subpage-ease), border-color .25s var(--ease-out), box-shadow .25s var(--ease-out);
}
.contact-page [data-motion-scene].is-active .trust-row,
.contact-page [data-motion-scene].is-active .contact-meta-card,
.contact-page [data-motion-scene].is-active .contact-form-card,
.contact-page [data-motion-scene].is-active .faq-section { opacity: 1; transform: none; }
.contact-page .trust-row { transition-delay: 180ms; }
.contact-page .contact-form-card { transition-delay: 90ms; }
.contact-page .faq-section { transition-delay: 140ms; }
.contact-page .contact-form-card { border-top: 2px solid var(--subpage-blue); }
.contact-page .contact-meta-card:hover,
.contact-page .contact-form-card:hover { border-color: color-mix(in srgb, var(--subpage-blue) 42%, var(--ridge)); }

@media (min-width: 1024px) and (min-height: 700px) {
  .about-page.subpage-motion-ready .band--ink { min-height: max(820px, 116vh); overflow: clip; }
  .about-page.subpage-motion-ready .band--ink > .container { position: sticky; top: 16vh; }
  .about-page.subpage-motion-ready .band--ink .split > div:last-child { position: relative; --quality-progress: 0; }
  .about-page.subpage-motion-ready .quality-gate {
    position: absolute;
    left: -18px;
    top: 4px;
    bottom: 4px;
    width: 8px;
    pointer-events: none;
  }
  .about-page.subpage-motion-ready .quality-gate-track,
  .about-page.subpage-motion-ready .quality-gate-fill {
    position: absolute;
    top: 0;
    left: 3px;
    width: 2px;
  }
  .about-page.subpage-motion-ready .quality-gate-track { height: 100%; background: rgba(255,255,255,.22); }
  .about-page.subpage-motion-ready .quality-gate-fill {
    height: calc(var(--quality-progress) * 100%);
    background: var(--subpage-blue);
    box-shadow: 0 0 13px color-mix(in srgb, var(--subpage-blue) 56%, transparent);
  }
  .about-page.subpage-motion-ready .quality-gate-pulse {
    position: absolute;
    left: 0;
    top: calc(var(--quality-progress) * 100%);
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 0 0 3px var(--subpage-blue), 0 0 18px color-mix(in srgb, var(--subpage-blue) 72%, transparent);
    transform: translateY(-50%);
    transition: top .08s linear;
  }
  .about-page.subpage-motion-ready .band--ink.is-complete .quality-gate-pulse {
    box-shadow: 0 0 0 5px color-mix(in srgb, var(--subpage-blue) 68%, transparent), 0 0 26px color-mix(in srgb, var(--subpage-blue) 70%, transparent);
  }
  .about-page.subpage-motion-ready .band--ink.is-quality-focus .led-by-mark {
    box-shadow: 0 0 0 8px color-mix(in srgb, var(--subpage-blue) 15%, transparent), 0 0 26px color-mix(in srgb, var(--subpage-blue) 28%, transparent);
  }
  .about-page.subpage-motion-ready .band--ink .manifesto {
    background-image: linear-gradient(90deg, color-mix(in srgb, var(--subpage-blue) 10%, transparent), transparent 58%);
  }
}

@media (max-width: 1023px) {
  .service-page,
  .about-page { --subpage-edge: 20px; }
  .subpage-marker span { display: none; }
  .subpage-marker::after { width: 26px; }
}
@media (max-width: 719px) {
  .subpage-journey,
  .subpage-marker,
  .subpage-handoff,
  .process-signal,
  .quality-gate { display: none; }
  .service-page [data-motion-scene] .stack-group:nth-child(n),
  .about-page [data-motion-scene] .why-list li:nth-child(n) { transition-delay: 0ms; }
}

@media (prefers-reduced-motion: reduce) {
  .subpage-journey,
  .subpage-marker,
  .subpage-handoff,
  .process-signal,
  .quality-gate { display: none !important; }
  .service-page [data-motion-scene] *,
  .about-page [data-motion-scene] *,
  .service-page [data-motion-scene] *::before,
  .service-page [data-motion-scene] *::after,
  .about-page [data-motion-scene] *::before,
  .about-page [data-motion-scene] *::after {
    opacity: 1 !important;
    transform: none !important;
    clip-path: none !important;
    animation: none !important;
    transition: none !important;
  }
  .service-page #process,
  .about-page .band--ink { min-height: 0 !important; }
  .service-page #process > .container,
  .about-page .band--ink > .container { position: static !important; }
}
