/* Page-specific overrides only. Shared rules live in /currency.css
   (extracted in PR 1 of specs/brand/004). Anything added here wins
   over currency.css, because this block is parsed after that link. */

.lockup .word {font-family:'Inter',sans-serif;font-weight:600;font-size:26px;letter-spacing:-0.65px;line-height:1}

/* =================== HERO =================== */
.hero-band {min-height:calc(100vh - 76px);display:flex;flex-direction:column}

.hero {
  position:relative;z-index:2;flex:1;
  max-width:1100px;margin:0 auto;
  padding-top:80px;padding-bottom:80px;
}

.foot-brand .lk .w {font-family:'Inter',sans-serif;font-weight:600;font-size:22px;letter-spacing:-0.55px}

/* --- Brand-page frame primitive (currency-native).
   Same shape as .plot-frame / .globe-frame: 2px ink border, drafting
   grid, parchment substrate. Corner .plot-tag labels re-used. */
.mark-frame {
  position:relative;
  border:2px solid var(--money-ink);
  /* Drafting grid is part of the frame, not a debug affordance. Same
     32px intaglio rule as .plot-frame and .globe-frame in currency.css,
     so every framed figure on the site sits on the same paper. */
  background:
    linear-gradient(to bottom, rgba(27,48,32,.08) 1px, transparent 1px),
    linear-gradient(to right, rgba(27,48,32,.08) 1px, transparent 1px),
    var(--parchment-hi);
  background-size:32px 32px;
  background-position:-1px -1px;
  padding:48px 28px 32px;
  color:var(--money-ink);
  overflow:hidden;
}

.mark-frame svg {max-width:100%;height:auto;display:block;margin:0 auto}

/* --- Standard content row rhythm · documented in Section 13 ---
   .b-head supplies 56px above the row. Nothing supplied anything below
   it, so every band ended flush with its last frame. Invisible between
   two parchment bands, obvious where Section 11 met the footer. */
.band > .wrap {padding-bottom:72px}

/* --- Row anatomy diagram (Section 13) --- */
.rowspec {position:relative;border:2px dashed rgba(27,48,32,.32);background:rgba(133,187,101,.07)}
.rowspec-inner {position:relative;border:2px solid var(--money-ink);background:var(--parchment-hi)}
.rowspec-lab {
  font-family:var(--mono,'JetBrains Mono',monospace);font-size:10px;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;color:var(--money-green-mid);
  display:flex;align-items:center;justify-content:center;gap:8px;
}
.rowspec-lab::before,.rowspec-lab::after {content:'';flex:1;border-top:1px dashed rgba(27,48,32,.34)}
.rowspec-note {font-size:13.5px;line-height:1.6;color:var(--money-green-mid);margin:14px 0 0}
.rowspec-note code {font-family:var(--mono,'JetBrains Mono',monospace);font-size:12.5px;color:var(--money-ink);font-weight:700}

/* --- Brand page: shrink the hero, no viewport-fill blank. --- */
.hero-band {min-height:auto}

.hero {padding-top:56px;padding-bottom:56px}

/* --- Construction guides toggle (page-wide) ---
   Every dashed circle, tick, radius label, cap-height bracket, and
   corner tag is marked with `.mark-guide`. The drafting grid inside
   .mark-frame is applied ONLY when body.show-guides is set. Default:
   guides are HIDDEN so the marks show cleanly. */
.mark-guide {display:none}

body.show-guides .mark-guide {display:initial}

/* The grid now ships with .mark-frame itself, so show-guides only has to
   reveal the construction annotations (.mark-guide).

   Corner tags are NOT construction annotations. They name the subject of
   the frame and carry its FIG. number, which is how every figure on the
   site is labelled (see .plot-frame in currency.css). They were being
   hidden along with the guides, which left every frame on this page
   unlabelled by default. They ship visible. */
.plot-tag {display:inline-flex}

/* --- Fixed floating toggle · top-right, just below topbar --- */
.guide-toggle {
  position:fixed;top:80px;right:24px;z-index:50;
  display:inline-flex;align-items:center;gap:10px;
  padding:10px 16px;border-radius:100px;
  border:2px solid var(--money-ink);background:var(--parchment-hi);
  color:var(--money-ink);cursor:pointer;
  font-family:'JetBrains Mono',monospace;font-size:11px;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;
  box-shadow:0 12px 24px -12px rgba(27,48,32,.35);
  transition:background .12s ease, color .12s ease;
}

.guide-toggle:hover {background:var(--money-ink);color:var(--money-green-lt)}

.guide-toggle .gt-dot {
  width:8px;height:8px;border-radius:50%;background:transparent;
  border:1.5px solid currentColor;transition:background .12s ease;
}

body.show-guides .guide-toggle .gt-dot {background:var(--money-green)}

.guide-toggle .gt-off {display:inline}

.guide-toggle .gt-on {display:none}

body.show-guides .guide-toggle .gt-off {display:none}

body.show-guides .guide-toggle .gt-on {display:inline}

.band[id] {scroll-margin-top:112px}

@media (max-width:600px) {.guide-toggle{top:auto;bottom:20px;right:20px}}

/* --- Section 03 · The Golden Prompt · chip primitive --- */
.gp-chip {
  display:inline-flex;align-items:center;gap:6px;
  padding:8px 14px;border-radius:100px;
  border:1.5px solid var(--money-ink);
  background:transparent;color:var(--money-ink);
  font-family:'Inter',sans-serif;font-size:13px;font-weight:600;letter-spacing:.01em;
  cursor:default;user-select:none;
}

.gp-chip svg {width:14px;height:14px}

/* --- Section 04 · Photography · image tiles ---
   Same 16:10 + 3:4 aspect ratios and scrim structure as the prod
   brand page, absorbed into currency: dollar-green pill + hover
   accent, ink scrim (rgba on money-ink), no amber glow. */
.bc-image-card {
  position:relative;display:block;
  border-radius:14px;overflow:hidden;
  border:1px solid rgba(27,48,32,.35);
  text-decoration:none;background:var(--money-ink);
  cursor:pointer;
  transition:transform .3s cubic-bezier(0.22,1,0.36,1), box-shadow .3s;
}

.bc-image-card.bc-h {aspect-ratio:16/10}

.bc-image-card.bc-v {aspect-ratio:3/4}

.bc-image-card img {
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  transition:transform .6s cubic-bezier(0.22,1,0.36,1);will-change:transform;
}

.bc-image-card::before {
  content:'';position:absolute;inset:0;pointer-events:none;z-index:1;
  background:linear-gradient(to top,
    rgba(27,48,32,0.95) 0%,
    rgba(27,48,32,0.55) 45%,
    transparent 82%);
}

.bc-image-card:hover {
  transform:translateY(-3px);
  box-shadow:0 24px 60px -20px rgba(27,48,32,.55);
}

.bc-image-card:hover img {transform:scale(1.04)}

.bc-img-body {position:absolute;left:0;right:0;bottom:0;z-index:2;padding:22px}

.bc-v .bc-img-body {padding:18px}

.bc-img-title {
  font-family:'Inter',sans-serif;font-weight:900;
  letter-spacing:0;line-height:1.08;
  color:#fff;font-size:22px;margin-bottom:10px;
  text-shadow:0 2px 18px rgba(0,0,0,0.65);
}

.bc-v .bc-img-title {font-size:19px}

.bc-img-bullet {
  font-family:'Inter',sans-serif;
  font-size:13px;line-height:1.45;
  color:rgba(255,255,255,0.82);
  text-shadow:0 1px 8px rgba(0,0,0,0.55);
}

.bc-v .bc-img-bullet {font-size:12.5px}

@media (max-width:720px) {
  .bc-img-title{font-size:18px}
  .bc-v .bc-img-title{font-size:16px}
}

/* --- Section 05 · Email signature card --- */
.email-sig-currency {
  display:flex;align-items:center;gap:20px;
  background:var(--parchment-hi);
  border:1.5px solid var(--money-ink);
  border-radius:14px;padding:22px 24px;
  max-width:520px;margin:12px 0 24px;
}

.email-sig-tile {
  width:64px;height:64px;flex-shrink:0;
  background:var(--parchment-hi);border:1px solid rgba(27,48,32,.22);border-radius:14px;
  display:flex;align-items:center;justify-content:center;
}

.email-sig-body {flex:1;min-width:0}

.email-sig-name {font-family:'Inter',sans-serif;font-weight:700;font-size:17px;color:var(--money-ink);line-height:1.2}

.email-sig-role {font-family:'Inter',sans-serif;font-size:14px;color:var(--money-green-mid);margin-top:2px}

.email-sig-meta {font-family:'Inter',sans-serif;font-size:13px;color:var(--money-green-mid);margin-top:8px}

.email-sig-link {color:var(--money-green-dp);text-decoration:none;border-bottom:1.5px solid var(--money-green);font-weight:600}

.email-sig-note {
  padding:16px 18px;border-left:3px solid var(--money-green);
  background:var(--parchment);border-radius:0 8px 8px 0;
  font-size:13px;color:var(--money-green-dp);line-height:1.55;max-width:640px;
}

.email-sig-note strong {color:var(--money-ink);font-weight:700}

/* --- Section 06 · Social · Squares grid --- */
.social-grid {
  display:grid;grid-template-columns:repeat(4, 1fr);gap:16px;margin-top:24px;
}
.social-grid.social-grid--approved {grid-template-columns:minmax(220px,360px)}

@media (max-width:900px) {.social-grid{grid-template-columns:repeat(2, 1fr)}}

@media (max-width:520px) {.social-grid{grid-template-columns:1fr}}

.social-card {
  position:relative;aspect-ratio:1/1;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  border-radius:14px;overflow:hidden;
  border:1.5px solid var(--money-ink);
  padding:24px;
}

.social-card--vault {background:var(--money-ink)}

.social-card--parchment {background:var(--parchment-hi);border-color:rgba(27,48,32,.15)}

.social-card--space {background:#254f3c;border-color:transparent}

.social-card--eclipse {background:#07150d;border-color:#07150d}

.social-card-meta {
  position:absolute;bottom:12px;left:16px;
  font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.14em;
  text-transform:uppercase;color:rgba(255,255,255,0.55);
}

.social-card-meta--dark {color:rgba(27,48,32,.45)}

.social-card-corner {
  position:absolute;top:14px;right:16px;
  font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--space-light-purple);
}

.social-cap {
  margin-top:10px;font-family:'JetBrains Mono',monospace;font-size:10px;
  letter-spacing:.14em;text-transform:uppercase;color:var(--money-green-mid);
}

.spec-caption {
  margin-top:12px;
  font-family:'JetBrains Mono',monospace;
  font-size:10px;
  letter-spacing:.14em;
  line-height:1.5;
  text-transform:uppercase;
  color:var(--money-green-mid);
}

/* --- Brand-page primitive showcase helpers --- */
.prim-grid {display:grid;gap:16px;margin-top:16px}

.prim-grid--2 {grid-template-columns:repeat(2,1fr)}

.prim-grid--3 {grid-template-columns:repeat(3,1fr)}

@media (max-width:820px) {.prim-grid--2,.prim-grid--3{grid-template-columns:1fr}}

/* Photo-card showcase grids (FIG. 06b/06c) · pulled out of inline styles so
   they get a mobile breakpoint. Desktop values match what was inline. */
.bc-grid-2 {grid-template-columns:repeat(2,1fr)}
.bc-grid-2-minmax {grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:600px) {.bc-grid-2,.bc-grid-2-minmax{grid-template-columns:1fr}}

.prim-cell {
  background:var(--parchment);border:1.5px solid rgba(27,48,32,.18);
  border-radius:10px;padding:22px;display:flex;flex-direction:column;gap:14px;
  min-height:140px;
}

.prim-cell.on-dark {background:var(--money-ink);border-color:rgba(200,223,168,.18);color:var(--money-green-lt)}

.prim-cell.on-space {
  background:#182d22;
  border-color:rgba(223,248,200,.24);color:var(--parchment-hi);
}

.prim-cell-cap {
  font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--money-green-mid);
}

.prim-cell.on-dark .prim-cell-cap {color:var(--money-green)}

.prim-cell.on-space .prim-cell-cap {color:var(--space-light-pink)}

/* Standalone ribbon strip for the motion showcase */
.ribbon-strip {
  height:32px;border:2px solid var(--money-ink);border-radius:6px;overflow:hidden;
  background:linear-gradient(90deg,#1A3A60 0%,#5A8EC8 25%,#C2D9F0 50%,#5A8EC8 75%,#1A3A60 100%);
  background-size:200% 100%;animation:ribbonShimmer 12s linear infinite;
  margin-top:14px;
}

@keyframes ribbonShimmer {
  0% {background-position:200% 0}
  100% {background-position:-200% 0}
}

.text-entry-specimen {display:grid;grid-template-columns:minmax(0,.8fr) minmax(360px,1.2fr);gap:48px;align-items:center;max-width:980px;margin:0 auto}
.text-entry-copy h3 {margin:0 0 12px;color:var(--money-ink);font-family:'Inter',sans-serif;font-size:30px;line-height:1.12;letter-spacing:0}
.text-entry-copy p {margin:0;color:var(--money-green-mid);font-size:15px;line-height:1.6}
.text-entry-copy ul {display:flex;flex-wrap:wrap;gap:8px 18px;margin:20px 0 0;padding:0;list-style:none;color:var(--money-ink);font-size:13px;font-weight:700}
.text-entry-copy li::before {content:'✓';margin-right:7px;color:var(--money-green-dp)}
.text-entry-form {padding:24px;border:1.5px solid var(--money-ink);background:var(--parchment-hi)}
.text-entry-form label {display:block;margin-bottom:9px;color:var(--money-ink);font-size:14px;font-weight:750}
.text-entry-control {display:grid;grid-template-columns:minmax(0,1fr) auto;min-height:56px}
.text-entry-control input {min-width:0;border:1.5px solid var(--money-ink);border-right:0;border-radius:0;background:var(--parchment);padding:0 16px;color:var(--money-ink);font:600 16px/1.2 'Inter',sans-serif}
.text-entry-control input:focus {position:relative;z-index:1;outline:3px solid var(--money-green);outline-offset:2px}
.text-entry-control button {min-height:56px;border:1.5px solid var(--money-ink);border-radius:0;background:var(--money-ink);padding:0 20px;color:var(--parchment-hi);font:750 15px/1 'Inter',sans-serif;cursor:pointer}
.text-entry-control button:hover {background:var(--money-green-dp)}
.text-entry-control button:focus-visible {outline:3px solid var(--money-green);outline-offset:2px}
.text-entry-form > p {margin:10px 0 0;color:var(--money-green-mid);font-size:12px;line-height:1.45}
@media (max-width:760px) {
  .text-entry-specimen {grid-template-columns:1fr;gap:24px}
  .text-entry-control {grid-template-columns:1fr}
  .text-entry-control input {min-height:54px;border-right:1.5px solid var(--money-ink);border-bottom:0}
  .text-entry-control button {width:100%}
}

.product-hub-card {
  min-width:0;
  padding:16px;
  border:1.5px solid rgba(27,48,32,.2);
  background:var(--parchment-hi);
  color:var(--money-ink);
}

.product-hub-card h3 {
  margin:14px 0 6px;
  font-family:'Inter',sans-serif;
  font-size:16px;
  line-height:1.2;
  color:var(--money-ink);
}

.product-hub-card p {
  margin:0;
  color:var(--money-green-mid);
  font-size:12.5px;
  line-height:1.45;
}

.product-hub-preview {
  position:relative;
  min-height:112px;
  border:1.5px solid var(--money-ink);
  background:
    repeating-linear-gradient(0deg,transparent 0 15px,rgba(27,48,32,.07) 15px 16px),
    repeating-linear-gradient(90deg,transparent 0 15px,rgba(27,48,32,.07) 15px 16px),
    var(--parchment);
  overflow:hidden;
}

.product-hub-preview--workspace {
  display:grid;
  grid-template-columns:34px 1fr;
}

.workspace-rail {
  display:flex;
  flex-direction:column;
  gap:8px;
  padding:12px 9px;
  border-right:1.5px solid rgba(27,48,32,.18);
}

.workspace-rail span {
  width:13px;
  height:13px;
  border-radius:50%;
  border:1.5px solid var(--money-ink);
  background:var(--parchment-hi);
}

.workspace-rail span:first-child {background:var(--money-green)}

.workspace-panel {padding:13px 12px}

.workspace-bar {
  width:48%;
  height:8px;
  background:var(--money-ink);
  margin-bottom:16px;
}

.workspace-message {
  height:8px;
  width:58%;
  background:rgba(27,48,32,.28);
  margin-bottom:8px;
}

.workspace-message--wide {width:82%}

.workspace-status {
  display:flex;
  align-items:center;
  gap:7px;
  margin-top:17px;
}

.workspace-status i {
  width:12px;
  height:12px;
  border-radius:50%;
  background:var(--money-green-dp);
}

.workspace-status span {
  width:48px;
  height:7px;
  background:rgba(27,48,32,.22);
}

.product-hub-preview--agents {
  display:grid;
  place-items:center;
}

.product-hub-preview--chat {
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:8px;
  padding:12px;
}

.chat-line {
  display:block;
  width:82%;
  height:12px;
  border:1px solid color-mix(in srgb,var(--money-ink) 22%,transparent);
  background:var(--parchment-hi);
}

.chat-line--user {align-self:flex-end;background:color-mix(in srgb,var(--money-green-lt) 32%,var(--parchment-hi))}
.chat-line--short {width:58%}

.agent-node {
  position:absolute;
  width:26px;
  height:26px;
  border:1.5px solid var(--money-ink);
  border-radius:50%;
  background:var(--parchment-hi);
}

.agent-node--active {
  width:36px;
  height:36px;
  background:var(--money-ink);
  box-shadow:0 0 0 8px rgba(133,187,101,.18);
}

.agent-node:nth-child(2) {transform:translate(-42px,34px)}
.agent-node:nth-child(3) {transform:translate(46px,-30px)}

.agent-route {
  position:absolute;
  width:82px;
  height:1.5px;
  background:rgba(27,48,32,.35);
  transform:rotate(-24deg);
}

.product-hub-preview--workflow {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  padding:8px;
}

.product-hub-preview--workflow span {
  padding:5px 4px;
  border:1.5px solid var(--money-ink);
  background:var(--parchment-hi);
  font-size:8px;
  font-weight:750;
}

.product-hub-preview--workflow i {
  width:10px;
  flex:0 0 10px;
  border-top:1.5px solid var(--money-ink);
}

.product-hub-preview--connections {
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:8px;
  padding:12px;
}

.connection-row {
  display:flex;
  align-items:center;
  gap:8px;
  height:18px;
  padding:0 6px;
  border:1.5px solid color-mix(in srgb,var(--money-ink) 50%,transparent);
  background:var(--parchment-hi);
}

.connection-row i,.product-hub-preview--evidence i {
  width:7px;
  height:7px;
  flex:0 0 auto;
  border-radius:50%;
  background:var(--money-green-dp);
}

.connection-row span {width:58%;height:5px;background:color-mix(in srgb,var(--money-ink) 28%,transparent)}

.product-hub-preview--evidence {
  display:grid;
  align-content:center;
  gap:6px;
  padding:10px;
}

.product-hub-preview--evidence div {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto 7px;
  align-items:center;
  gap:5px;
  height:22px;
  padding:0 5px;
  border:1.5px solid color-mix(in srgb,var(--money-ink) 50%,transparent);
  background:var(--parchment-hi);
}

.product-hub-preview--evidence b,.product-hub-preview--evidence span {font-size:7px;line-height:1;white-space:nowrap}
.product-hub-preview--evidence span {color:var(--money-green-mid)}
.product-hub-preview--evidence i {width:6px;height:6px}

.product-hub-preview--roadmap {
  display:flex;
  align-items:end;
  justify-content:center;
  gap:9px;
  padding:18px;
}

.product-hub-preview--roadmap span {
  width:16px;
  height:var(--h);
  min-height:24px;
  border:1.5px solid var(--money-ink);
  background:rgba(133,187,101,.32);
}

.velocity-shell {
  display:grid;
  grid-template-columns:minmax(0,1fr) 280px;
  gap:24px;
  align-items:stretch;
}

.velocity-feed {
  position:relative;
  margin:0;
  padding:0;
  list-style:none;
  border:2px solid var(--money-ink);
  background:var(--parchment-hi);
}

.velocity-feed::before {
  content:'';
  position:absolute;
  top:28px;
  bottom:28px;
  left:29px;
  border-left:1.5px solid rgba(27,48,32,.24);
}

.velocity-feed li {
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:34px minmax(0,1fr) auto;
  gap:14px;
  align-items:start;
  padding:20px 22px;
  border-bottom:1px solid rgba(27,48,32,.14);
}

.velocity-feed li:last-child {border-bottom:0}

.velocity-dot {
  width:16px;
  height:16px;
  margin-top:2px;
  border:2px solid var(--money-ink);
  border-radius:50%;
  background:var(--parchment-hi);
}

.velocity-dot--done {background:var(--money-green-dp)}
.velocity-dot--active {
  background:var(--money-green);
  box-shadow:0 0 0 6px rgba(133,187,101,.22);
  animation:velocityPulse 2.8s ease-in-out infinite;
}
.velocity-dot--return {background:linear-gradient(135deg,var(--money-green-dp) 50%,var(--parchment-hi) 50%)}

.velocity-feed strong {
  display:block;
  color:var(--money-ink);
  font-size:15px;
  line-height:1.25;
}

.velocity-feed p {
  margin:5px 0 0;
  color:var(--money-green-mid);
  font-size:13px;
  line-height:1.45;
}

.velocity-feed time {
  color:var(--money-green-mid);
  font:700 10px/1 'JetBrains Mono',monospace;
  letter-spacing:.14em;
  text-transform:uppercase;
}

.velocity-meter {
  display:flex;
  flex-direction:column;
  justify-content:end;
  min-height:240px;
  padding:24px;
  border:2px solid var(--money-ink);
  background:var(--money-ink);
  color:var(--parchment-hi);
}

.velocity-meter span {
  font-size:92px;
  font-weight:800;
  line-height:.9;
  letter-spacing:0;
}

.velocity-meter strong {
  margin-top:12px;
  color:var(--money-green-lt);
  font-size:17px;
}

.velocity-meter p {
  margin:10px 0 0;
  color:rgba(255,255,255,.74);
  font-size:13.5px;
  line-height:1.5;
}

.motion-rule-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
}

.motion-rule {
  padding:18px;
  border:1.5px solid rgba(27,48,32,.2);
  background:var(--parchment-hi);
}

.motion-rule--wide {
  grid-column:span 4;
  display:grid;
  grid-template-columns:260px minmax(0,1fr);
  gap:18px;
  align-items:center;
}

.motion-rule h3 {
  margin:14px 0 7px;
  color:var(--money-ink);
  font-size:16px;
  line-height:1.2;
}

.motion-rule p {
  margin:0;
  color:var(--money-green-mid);
  font-size:12.8px;
  line-height:1.45;
}

.motion-demo {
  position:relative;
  min-height:120px;
  border:1.5px solid var(--money-ink);
  background:
    repeating-linear-gradient(0deg,transparent 0 15px,rgba(27,48,32,.07) 15px 16px),
    repeating-linear-gradient(90deg,transparent 0 15px,rgba(27,48,32,.07) 15px 16px),
    var(--parchment);
  overflow:hidden;
}

.motion-demo--dotfield {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  place-items:center;
}

.motion-demo--dotfield i {
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--money-green-dp);
  animation:dotFieldBreathe 3.2s ease-in-out infinite;
}

.motion-demo--dotfield i:nth-child(2n) {animation-delay:.25s}
.motion-demo--dotfield i:nth-child(3n) {animation-delay:.5s}

.motion-demo--reveal {
  display:grid;
  align-content:center;
  gap:9px;
  padding:18px;
}

.motion-demo--reveal span {
  height:16px;
  border:1.5px solid var(--money-ink);
  background:var(--parchment-hi);
  animation:cardReveal 3.6s ease-in-out infinite;
}

.motion-demo--reveal span:nth-child(2) {animation-delay:.18s}
.motion-demo--reveal span:nth-child(3) {animation-delay:.36s}

.motion-demo--status {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
}

.motion-demo--status span {
  position:relative;
  width:28px;
  height:28px;
  border:2px solid var(--money-ink);
  border-radius:50%;
  background:var(--parchment-hi);
  animation:statusFill 4s steps(1,end) infinite;
}

.motion-demo--status span::after {
  content:'';
  position:absolute;
  left:8px;
  top:6px;
  width:8px;
  height:13px;
  border-right:2px solid var(--parchment-hi);
  border-bottom:2px solid var(--parchment-hi);
  transform:rotate(40deg);
  opacity:0;
  animation:statusCheck 4s steps(1,end) infinite;
}

.motion-demo--status span:nth-child(2),.motion-demo--status span:nth-child(2)::after {animation-delay:.45s}
.motion-demo--status span:nth-child(3),.motion-demo--status span:nth-child(3)::after {animation-delay:.9s}

.motion-demo--return span {
  position:absolute;
  top:45px;
  left:22px;
  width:38px;
  height:28px;
  border:1.5px solid var(--money-ink);
  background:var(--parchment-hi);
  animation:evidenceReturn 4s ease-in-out infinite;
}

.motion-demo--return i {
  position:absolute;
  right:20px;
  top:32px;
  width:54px;
  height:54px;
  border:2px solid var(--money-ink);
  background:var(--money-ink);
}

.motion-demo--reduced {
  display:flex;
  align-items:center;
  gap:10px;
  padding:18px;
}

.motion-demo--reduced span {
  flex:1;
  height:34px;
  border:1.5px solid var(--money-ink);
  background:linear-gradient(90deg,var(--money-green-dp) 0 65%,var(--parchment-hi) 65% 100%);
}

@keyframes velocityPulse {
  0%,100% {box-shadow:0 0 0 5px rgba(133,187,101,.18)}
  50% {box-shadow:0 0 0 9px rgba(133,187,101,.08)}
}

@keyframes dotFieldBreathe {
  0%,100% {transform:translate(0,0);opacity:.65}
  50% {transform:translate(8px,-6px);opacity:1}
}

@keyframes cardReveal {
  0%,18% {transform:translateY(10px);opacity:.35}
  38%,100% {transform:translateY(0);opacity:1}
}

@keyframes statusFill {
  0%,34% {background:var(--parchment-hi)}
  35%,100% {background:var(--money-green-dp)}
}

@keyframes statusCheck {
  0%,34% {opacity:0}
  35%,100% {opacity:1}
}

@keyframes evidenceReturn {
  0%,20% {transform:translateX(0);opacity:.5}
  55%,100% {transform:translateX(92px);opacity:1}
}

@media (max-width:1050px) {
  .motion-rule-grid {grid-template-columns:repeat(2,minmax(0,1fr))}
  .motion-rule--wide {grid-column:span 2}
}

@media (max-width:760px) {
  .motion-rule-grid,.velocity-shell {grid-template-columns:1fr}
  .motion-rule--wide {grid-column:span 1;grid-template-columns:1fr}
  .velocity-meter {min-height:180px}
}

.brand-stat-number {margin-bottom:14px;color:var(--parchment-hi);font-size:88px;font-weight:800;line-height:.95;letter-spacing:0}
.brand-stat-number small {color:var(--money-green-lt);font-size:.4em;font-weight:700}
.brand-stat-copy {max-width:24ch;color:#eef6e7;font-size:16px;font-weight:650;line-height:1.5}

.bc-image-card::before {background:linear-gradient(to top,rgba(8,20,12,.99) 0%,rgba(8,20,12,.86) 52%,rgba(8,20,12,.18) 100%)}
.bc-image-card .bc-img-title span {color:#dff8c8 !important}
.bc-image-card .bc-img-bullet {color:#fff}
.bc-image-card img.bc-subject-top {object-position:center 18%}

.deployment-sequence {display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;padding:72px 28px 42px}
.deployment-step {position:relative;min-width:0;padding:26px 20px 20px;border-top:3px solid var(--money-ink)}
.deployment-step::before {content:'';position:absolute;top:-9px;left:20px;width:12px;height:12px;border:2px solid var(--parchment-hi);border-radius:50%;background:var(--money-green-dp);box-shadow:0 0 0 1px var(--money-ink)}
.deployment-step > span {position:absolute;top:26px;left:20px;display:block;color:var(--money-green-dp);font:700 11px/1 'JetBrains Mono',monospace;letter-spacing:.14em}
.deployment-step > strong {display:block;margin:36px 0 8px;color:var(--money-ink);font-size:16px;line-height:1.25}
.deployment-step p {margin:0;color:var(--money-green-mid);font-size:13px;line-height:1.45}

.system-map {display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1.35fr) auto minmax(0,1fr);gap:18px;align-items:stretch;margin-top:28px;padding:32px;border:1px solid rgba(255,255,255,.16);background:#07150d}
.system-map-node {padding:24px;border:1px solid rgba(255,255,255,.24);background:rgba(255,255,255,.05)}
.system-map-node span {display:block;margin-bottom:28px;color:#b9e99f;font:700 11px/1 'JetBrains Mono',monospace;letter-spacing:.14em}
.system-map-node strong,.system-map-tools strong {display:block;color:#fff;font-size:18px;line-height:1.25}
.system-map-node p,.system-map-tools p,.system-map-return p {margin:8px 0 0;color:rgba(255,255,255,.74);font-size:14px;line-height:1.5}
.system-map-node--core {border-color:#b9e99f;background:rgba(185,233,159,.1)}
.system-map-arrow {display:grid;place-items:center;color:#b9e99f;font-size:26px}
.system-map-tools {grid-column:1 / -1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;margin-top:6px;background:rgba(255,255,255,.16)}
.system-map-tools > div {padding:20px;background:#0b1d11}
.system-map-tools strong {font-size:15px}.system-map-tools p {font-size:13px}
.system-map-return {grid-column:2 / 5;display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:center;padding:18px 22px;border-left:3px solid #b9e99f;background:rgba(185,233,159,.08)}
.system-map-return span {color:#b9e99f;font-size:28px}.system-map-return p {margin:0}.system-map-return strong {color:#fff}

@media (max-width:820px) {
  .text-entry-specimen {grid-template-columns:1fr;gap:28px}
  .deployment-sequence {grid-template-columns:1fr;padding:52px 22px 26px}
  .deployment-step {border-top:0;border-left:3px solid var(--money-ink);padding:8px 18px 28px 28px}
  .deployment-step::before {top:8px;left:-8px}
  .deployment-step > span {position:static;margin-bottom:8px}
  .deployment-step > strong {margin:0 0 8px}
  .system-map {grid-template-columns:1fr;padding:20px}
  .system-map-arrow {transform:rotate(90deg)}
  .system-map-tools,.system-map-return {grid-column:1}
  .system-map-tools {grid-template-columns:1fr}
}

@media (max-width:520px) {
  .text-entry-control {grid-template-columns:1fr}
  .text-entry-control input {min-height:54px;border-right:1.5px solid var(--money-ink);border-bottom:0}
  .brand-stat-number {font-size:68px}
}

@media (prefers-reduced-motion:reduce) {
  .ribbon-strip,
  .velocity-dot--active,
  .motion-demo--dotfield i,
  .motion-demo--reveal span,
  .motion-demo--status span,
  .motion-demo--status span::after,
  .motion-demo--return span {animation:none}
  .motion-demo--dotfield i {transform:none;opacity:1}
  .motion-demo--reveal span {transform:none;opacity:1}
  .motion-demo--status span {background:var(--money-green-dp)}
  .motion-demo--status span::after {opacity:1}
  .motion-demo--return span {transform:translateX(92px);opacity:1}
}
