/* ============================================================================
   RIDGEWAY AI — components.css (generated; do not hand-edit)

   Deterministic source order:
   01. partials/css/blog-article.css
   02. partials/css/blog.css
   03. partials/css/funnel.css
   04. partials/css/hero-backdrop.css
   05. partials/css/hero-engine.css
   06. partials/css/legal.css
   07. partials/css/loop-diagram.css
   08. partials/css/marquee.css
   09. partials/css/model-finder.css
   10. partials/css/terminal.css
   11. partials/css/tools.css
   12. partials/page-specific.css (preserved page-cluster rules)

   Regenerate: python3 tools/build-components.py
   Verify only: python3 tools/build-components.py --check
   ============================================================================ */

/* ============================================================================
   SOURCE 01: partials/css/blog-article.css
   ============================================================================ */
/* == blog article template (Field Notes posts — owner: B7) ==================
   Article page chrome: dark post hero (breadcrumb, category chip, title, dek,
   byline), bone article column, "The short answer" callout, inline pitch card,
   ghost-ink sizing inside the column, related grid, dark pre-footer CTA.
   Core tokens/type/cards/tables live in ridgeway.css — not duplicated here. */
.post-hero{padding:clamp(44px,7vw,84px) 0 clamp(48px,6vw,76px)}
.crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:10px;font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--tx-muted)}
.crumbs a{color:var(--tx-muted);transition:color .18s}
.crumbs a:hover{color:var(--tx)}
.crumbs .sep{opacity:.55}
.post-meta{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin-top:30px}
.post-date{font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--tx-muted)}
.post-title{margin-top:20px;font-size:clamp(34px,4.8vw,62px);font-weight:300;line-height:1.06;letter-spacing:-.035em;max-width:940px}
.post-hero .post-dek{margin-top:20px}
.post-byline{margin-top:26px;font-family:var(--mono);font-size:12.5px;letter-spacing:.06em;color:var(--tx-muted)}
.post-byline b{color:var(--tx);font-weight:500}

.article-col{max-width:768px}
.post-body h2{margin:56px 0 4px;font-size:clamp(26px,3.2vw,38px)}
.post-body h3{margin:38px 0 0}
.post-body p{margin:16px 0;color:var(--tx-soft)}
.post-body ul.list,.post-body ol.list{margin:16px 0}
.post-body .table-scroll{margin:28px 0}
.post-body .ghost-ink{margin:56px 0;font-size:clamp(24px,3.4vw,36px);line-height:1.32}

.short-answer{border:1px solid var(--rule);border-top:3px solid var(--gold-text-light);background:var(--card-bg);padding:clamp(20px,3vw,28px);margin:0 0 8px}
.short-answer .micro{color:var(--gold-text-light)}
.short-answer p{margin:10px 0 0;color:var(--tx-soft);font-size:16.5px}

/* inline pitch card — dark island in the bone column; markup: class="pitch-card dark" */
.pitch-card{margin:54px 0;padding:clamp(24px,3.5vw,36px);border:1px solid var(--line-dark);background:var(--obsidian-1)}
.pitch-card h3{margin-top:12px}
.pitch-card p{margin:12px 0 22px;color:var(--tx-muted);font-size:16px}

.post-cta h2{margin-top:18px;max-width:820px}
.post-cta .lede{margin-top:14px}
.post-cta .cta-row{margin-top:32px}

/* ============================================================================
   SOURCE 02: partials/css/blog.css
   ============================================================================ */
/* ============================================================
   Ridgeway AI — blog.css ("Field Notes", contract §7)  (B6)
   Scope: blog/index.html listing (featured card, index panel,
   post cards) + related-notes grids + pitch-card kicker.
   The ARTICLE template classes (.post-hero, .crumbs, .post-meta,
   .post-title, .post-dek, .post-byline, .article-col, .post-body,
   .short-answer, .pitch-card, .post-cta) live in the B7 section
   of assets/components.css — shared by all 15 posts, NOT
   duplicated here. Token fallbacks baked in so the listing
   renders standalone. Radius 0 throughout.
   Integrator: already concatenated into assets/components.css
   under  == blog / Field Notes listing (B6) ==
   ============================================================ */

/* --- listing: featured card (markup: class="featured-card dark") --- */
.featured-card{
  display:grid;gap:26px;
  border:1px solid var(--line-dark,#242c38);
  padding:clamp(26px,4.5vw,52px);
}
@media(min-width:920px){
  .featured-card{grid-template-columns:1.25fr .75fr;align-items:end}
}
.featured-card .fc-kicker{
  font-family:var(--mono,'IBM Plex Mono',monospace);
  font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  color:var(--obsidian-0,#0b0d10);background:var(--gold,#c9955d);
  display:inline-block;padding:5px 9px;margin-bottom:20px;
}
.featured-card h2{margin-top:18px;max-width:720px}
.featured-card h2 a{color:inherit;border:0}
.featured-card h2 a:hover{color:var(--gold-bright,#e3b57e)}
.featured-card .fc-excerpt{margin-top:16px;max-width:640px;color:var(--tx-soft,#c7cdd8)}
.featured-card .fc-read{display:inline-block;margin-top:26px;font-weight:500}
.fc-index{
  border:1px solid var(--line-dark-soft,#1c232e);
  padding:22px 24px;
  font-family:var(--mono,'IBM Plex Mono',monospace);
}
.fc-index p{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--tx-muted,#9aa3b2)}
.fc-index ul{list-style:none;margin-top:14px}
.fc-index li{
  display:flex;justify-content:space-between;gap:18px;
  border-top:1px solid var(--line-dark-soft,#1c232e);
  padding:9px 0;font-size:12.5px;letter-spacing:.04em;color:var(--tx-soft,#c7cdd8);
}
.fc-index li b{font-weight:500;color:var(--gold,#c9955d)}

/* --- listing + related grids: post cards ----------------------- */
.post-card{display:flex;flex-direction:column}
.post-card .pc-top{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.post-card h3{margin-top:16px;font-size:21px;line-height:1.3}
.post-card .pc-excerpt{margin-top:10px;color:var(--tx-muted,#606775);font-size:16px}
.post-card .pc-foot{
  margin-top:auto;padding-top:22px;
  display:flex;justify-content:space-between;gap:14px;align-items:baseline;
  font-family:var(--mono,'IBM Plex Mono',monospace);
  font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--tx-muted,#606775);
}
.post-card .pc-foot .pc-read{color:var(--accent-text,#8F5E32);font-weight:500}
a.post-card:hover h3{color:var(--accent-text,#8F5E32)}

/* --- article: related-notes grid ------------------------------- */
.related-grid{margin-top:34px}

/* --- pitch-card kicker (base .pitch-card is in the B7 section) --- */
.pitch-card .pk-kicker{
  font-family:var(--mono,'IBM Plex Mono',monospace);
  font-size:11.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:var(--gold,#c9955d);
}

@media print{
  .featured-card{background:#fff!important;border-color:#000}
}

/* ============================================================================
   SOURCE 03: partials/css/funnel.css
   ============================================================================ */
/* == kc-ai-workflow-scorecard funnel (B8) ==
   Standalone no-nav paid-funnel page (@no-chrome). Ported from the archive
   funnel styles, retokened to the v3 system (contract §2): bone body, obsidian
   chrome, bronze on light / gold on dark. Scoped: .funnel-*, .sc-*, and
   .funnel-page descendants only. Radius 0 (status-dot 50% sanctioned). */

.funnel-page{background:var(--bone-0);color:var(--ink)}

/* chrome: obsidian top bar + trust-strip footer */
.funnel-top{background:var(--obsidian-0);border-bottom:1px solid var(--line-dark-soft)}
.funnel-top-inner{min-height:64px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding-block:12px}
.funnel-brand{display:inline-flex;align-items:center;gap:12px;font-size:19px;font-weight:600;letter-spacing:-.03em;color:var(--bone-0);white-space:nowrap}
.funnel-brand b{color:var(--gold);font-weight:600}
.funnel-brand .pixel-rw{width:46px;height:27px;color:var(--bone-0);--pixel:var(--obsidian-0);flex:0 0 auto}
.funnel-market{font-family:var(--mono);font-size:11.5px;text-transform:uppercase;letter-spacing:.14em;color:var(--muted-dark);text-align:right}
.funnel-footer{
  background:var(--obsidian-0);border-top:1px solid var(--line-dark-soft);
  padding:26px 0;font-family:var(--mono);font-size:12.5px;letter-spacing:.05em;color:var(--muted-dark);
}
.funnel-footer b{color:var(--bone-0);font-weight:500}

/* hero */
.funnel-hero{border-bottom:1px solid var(--line-light)}
.funnel-hero-grid{
  display:grid;grid-template-columns:minmax(0,1.08fr) minmax(320px,.72fr);
  gap:clamp(28px,6vw,78px);align-items:center;padding-block:clamp(54px,8vw,106px);
}
.funnel-copy h1{max-width:880px;font-size:clamp(40px,5.4vw,72px)}
.funnel-copy .lede{margin-top:20px}
.funnel-cta-row{margin-top:28px}

/* dark sequence panel (hero aside) */
.funnel-sequence{
  --tx:var(--bone-0);--tx-soft:#c7cdd8;--tx-muted:var(--muted-dark);
  --rule:var(--line-dark);--accent-text:var(--gold);
  background:var(--obsidian-1);border:1px solid var(--line-dark);color:var(--tx);
}
.funnel-sequence ol{list-style:none;margin:0;padding:8px 22px 24px;display:grid}
.funnel-sequence li{border-top:1px solid var(--line-dark-soft);padding:18px 0}
.funnel-sequence li:first-child{border-top:0}
.funnel-sequence b{display:block;color:var(--bone-0);font-size:17.5px;font-weight:500;letter-spacing:-.02em}
.funnel-sequence li span{display:block;color:var(--muted-dark);font-size:14px;margin-top:4px}
.funnel-page .panel-top{
  display:flex;justify-content:space-between;align-items:center;gap:14px;
  padding:12px 18px;border-bottom:1px solid var(--line-dark-soft);
  font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted-dark);
}
.funnel-page .status-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--live-dark);margin-right:9px}

/* proof strip */
.funnel-proof-strip{border-bottom:1px solid var(--line-light);background:var(--bone-1)}
.funnel-proof-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line-light);border-left:1px solid var(--line-light);border-right:1px solid var(--line-light)}
.funnel-proof-grid div{background:var(--bone-1);padding:20px}
.funnel-proof-grid b{display:block;font-weight:500;color:var(--ink)}
.funnel-proof-grid span{display:block;color:var(--muted);font-size:14px;margin-top:4px}

/* section heads + closer band */
.funnel-section-head{display:grid;grid-template-columns:minmax(280px,.82fr) 1fr;gap:clamp(28px,5vw,72px);align-items:end;margin-bottom:36px}
.funnel-form-shell{margin-top:28px}
.funnel-next{border-top:1px solid var(--line-light);background:var(--bone-1)}
.funnel-next-grid{display:grid;grid-template-columns:minmax(260px,.62fr) 1fr;gap:clamp(28px,5vw,72px);align-items:start}

/* scorecard questions */
.sc-shell{display:grid;gap:1px;background:var(--line-light);border:1px solid var(--line-light)}
.sc-q{background:var(--bone-0);border:0;margin:0;padding:clamp(22px,3vw,32px)}
.sc-q legend{font-size:clamp(19px,2.1vw,24px);font-weight:500;letter-spacing:-.025em;color:var(--ink);padding:0;margin-bottom:16px}
.sc-q .number{display:block;margin-bottom:8px;font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-text-light)}
.sc-opts{display:grid;gap:10px}
.sc-opt{display:flex;align-items:flex-start;gap:12px;border:1px solid var(--line-light);background:var(--paper);padding:14px 16px;cursor:pointer;transition:border-color .15s,background-color .15s}
.sc-opt:hover{border-color:var(--ink)}
.sc-opt input{margin-top:4px;flex:0 0 auto;accent-color:var(--bronze);width:18px;height:18px}
.sc-opt span{color:var(--ink-soft);font-size:15.5px;line-height:1.5}
.sc-opt:has(input:checked){border-color:var(--bronze);background:rgba(143,94,50,.08)}
.sc-actions{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin-top:28px}
.sc-note{font-size:14px;color:var(--muted);max-width:560px}

/* result panel (dark) */
.sc-result{
  --tx:var(--bone-0);--tx-soft:#c7cdd8;--tx-muted:var(--muted-dark);
  --rule:var(--line-dark);--accent-text:var(--gold);
  --card-bg:var(--obsidian-2);
  border:1px solid var(--line-dark);background:var(--obsidian-1);color:var(--tx);
  padding:clamp(26px,4vw,44px);
}
.sc-result h2{color:var(--bone-0)}
.sc-gauge{display:flex;align-items:baseline;gap:14px;margin:18px 0 6px}
.sc-score{font-size:clamp(48px,8vw,84px);font-weight:300;letter-spacing:-.05em;line-height:1;color:var(--gold);font-variant-numeric:tabular-nums}
.sc-tier{font-family:var(--mono);font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:#c7cdd8}
.sc-result p{color:#c7cdd8;margin-top:12px;max-width:760px}
.sc-result .sc-top b{color:var(--bone-0)}
.sc-meter{height:8px;background:rgba(247,244,236,.12);margin:18px 0;position:relative;overflow:hidden}
.sc-meter span{position:absolute;left:0;top:0;bottom:0;background:var(--gold);width:0;transition:width .5s ease}
.sc-result .sc-note{color:var(--muted-dark)}

/* light form island inside the dark result panel */
.sc-result .lead-form{background:var(--bone-1);padding:clamp(20px,3vw,30px);margin-top:8px;display:grid;gap:16px}
.sc-result .lead-form .field label{color:var(--ink-soft)}
.sc-result .lead-form input,.sc-result .lead-form select,.sc-result .lead-form textarea{background:var(--paper);color:var(--ink);border:1px solid var(--line-light)}
.sc-result .lead-form .form-msg.ok{color:#1d6f47}
.sc-result .lead-form .form-msg.err{color:var(--warn)}
.sc-result .form-intro h2{color:var(--bone-0);font-size:clamp(26px,3vw,38px)}
.sc-result .form-intro p{margin-top:12px}

@media(max-width:900px){
  .funnel-hero-grid,.funnel-section-head,.funnel-next-grid{grid-template-columns:1fr}
  .funnel-proof-grid{grid-template-columns:1fr}
  .funnel-top-inner{align-items:flex-start;flex-direction:column}
  .funnel-market{text-align:left}
}
@media(prefers-reduced-motion:reduce){
  .sc-meter span{transition:none}
  .sc-opt{transition:none}
}

/* ============================================================================
   SOURCE 04: partials/css/hero-backdrop.css
   ============================================================================ */
/* ===========================================================================
   Hero photograph + Ben-Day halftone reveal.

   Layer contract:
     z0  .hero-backdrop (sharp photo + halftone canvas)
     z1  .hero::before  (permanent readability scrim)
     z2  .hero > .wrap  (copy, CTAs, engine — set in page-specific.css)

   The only reveal operation happens inside the canvas. No CSS mask touches
   the backdrop, hero, or foreground content.
   ========================================================================== */

.hero {
  isolation: isolate;
}

.hero-backdrop {
  position: absolute;
  inset: 0;
  z-index: 0;
  contain: paint;
  margin: 0;
  overflow: hidden;
  pointer-events: none;
  background: var(--obsidian-0);
}

/* Permanent contrast layer. The pointer reveals the HD photograph beneath
   this scrim, so headline and CTA contrast never depends on cursor position. */
.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(90deg,
      rgba(11, 13, 16, .72) 0%,
      rgba(11, 13, 16, .54) 38%,
      rgba(11, 13, 16, .18) 72%,
      rgba(11, 13, 16, .08) 100%),
    linear-gradient(180deg,
      rgba(11, 13, 16, .12) 0%,
      rgba(11, 13, 16, 0) 48%,
      var(--obsidian-0) 100%);
}

.hero-backdrop__picture,
.hero-backdrop__picture img,
.hero-backdrop__halftone {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.hero-backdrop__picture {
  z-index: 0;
}

/* boot.js adds html.js before first paint. Keep the sharp image covered until
   the canvas has a complete frame so mobile never flashes clear -> dots. The
   tiny delayed animation is a CSS-only safety release: if this module fails
   to load or canvas is unavailable, the photograph appears after .9s instead
   of leaving a permanent black panel. */
html.js .hero-backdrop[data-halftone-reveal]:not(.is-visual-ready) .hero-backdrop__picture {
  opacity: 0;
  animation: hero-photo-safety-reveal 1ms linear .9s forwards;
}

@keyframes hero-photo-safety-reveal {
  to { opacity: 1; }
}

.hero-backdrop__picture img {
  object-fit: cover;
  object-position: 72% 50%;
  filter: brightness(.72) saturate(1.08);
}

.hero-backdrop__halftone {
  z-index: 1;
  display: block;
  opacity: 0;
  visibility: hidden;
  filter: brightness(.72) saturate(1.08);
}

.hero-backdrop__halftone.is-ready {
  opacity: 1;
  visibility: visible;
}

.hero-backdrop__halftone.is-clear {
  display: none;
}

/* No-JS is the sharp photograph. JS only exposes the canvas after it has a
   complete, correctly registered halftone frame, preventing a blank flash. */
html:not(.js) .hero-backdrop__halftone {
  display: none;
}

@media (max-width: 720px), (pointer: coarse) {
  .hero-backdrop__picture img {
    object-position: 86% 50%;
  }
}

/* The mobile hero is much taller than its first viewport. Reframe the image
   toward the central valley, then lift both rendered layers together so the
   opening view contains sky, ridgelines, and forest instead of mostly sky.
   Keeping the picture and canvas on the same transform preserves exact HD /
   halftone registration. The early obsidian fade absorbs the lower edge. */
@media (max-width: 720px) {
  .hero-backdrop__picture img {
    object-position: 72% 50%;
  }

  .hero-backdrop__picture,
  .hero-backdrop__halftone {
    transform: translateY(-12%);
  }
}

/* Motion preference wins over the decorative treatment: clear photo, no
   halftone entrance, pointer reveal, or mobile ambient cells. */
@media (prefers-reduced-motion: reduce) {
  html.js .hero-backdrop[data-halftone-reveal]:not(.is-visual-ready) .hero-backdrop__picture {
    opacity: 1;
    animation: none;
  }

  .hero-backdrop__halftone {
    display: none;
  }
}

/* ============================================================================
   SOURCE 05: partials/css/hero-engine.css
   ============================================================================ */
/* ============================================================
   Ridgeway AI — Hero Engine ("The Ridge Engine", contract §3.1 Layer 3)
   Scope: everything under .hero-engine
   Colors: design tokens only (var(--...)); alphas via color-mix.
   Radius 0 everywhere. Exceptions per contract: status/port dots,
   radar rings (circles), 2px icon tiles.
   Design spaces: desktop 1180x470 · mobile (<=719px) 430x850.
   JS: /assets/js/hero-engine.js (external, CSP script-src 'self').
   ============================================================ */

/* ---------- panel / terminal chrome ---------- */
.hero-engine {
  position: relative;
  width: 100%;
  font-family: var(--sans);
}

.hero-engine .he-frame {
  position: relative;
  margin: 0 auto;
  width: max-content;
  max-width: 100%;
  border: 1px solid var(--line-dark);
  background: linear-gradient(180deg, var(--obsidian-1), var(--obsidian-0));
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, var(--bone-0) 7%, transparent),
    0 24px 48px -32px color-mix(in srgb, var(--obsidian-0) 85%, transparent);
}

.hero-engine .he-bar {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 14px;
  border-bottom: 1px solid var(--line-dark-soft);
  background: color-mix(in srgb, var(--obsidian-2) 72%, var(--obsidian-1));
}

.hero-engine .he-bar__dots { display: flex; gap: 6px; }
.hero-engine .he-bar__dots i {
  width: 9px; height: 9px;
  border-radius: 50%; /* status-dot exception */
  background: var(--obsidian-3);
  border: 1px solid var(--line-dark);
}

.hero-engine .he-bar__title {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: .12em;
  color: var(--muted-dark);
}

.hero-engine .he-bar__chip {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 4px 10px;
  border: 1px solid var(--line-dark);
  background: color-mix(in srgb, var(--obsidian-3) 60%, transparent);
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--muted-dark);
  white-space: nowrap;
}

.hero-engine .he-dot {
  position: relative;
  width: 7px; height: 7px;
  border-radius: 50%; /* status-dot exception */
  background: var(--live-dark);
  flex: none;
}
.hero-engine .he-dot::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%; /* exception: status-dot ping */
  background: var(--live-dark);
  animation: hePing 2s cubic-bezier(0, 0, .2, 1) infinite;
}
@keyframes hePing {
  0%   { transform: scale(1);   opacity: .7; }
  80%, 100% { transform: scale(2.6); opacity: 0; }
}

/* ---------- viewport + fixed design space ---------- */
.hero-engine .he-viewport {
  padding: 18px 16px 20px;
  overflow: hidden;
}

.hero-engine .he-scalewrap { margin: 0 auto; }

.hero-engine .he-stage {
  position: relative;
  width: 1180px;
  height: 470px;
  margin: 0 auto;
}

/* faint dot grid, masked toward center — static, zero cost */
.hero-engine .he-stage::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: radial-gradient(
    color-mix(in srgb, var(--line-dark) 72%, transparent) 1px,
    transparent 1px
  );
  background-size: 26px 26px;
  -webkit-mask-image: radial-gradient(62% 70% at 50% 50%, #000 30%, transparent 78%);
  mask-image: radial-gradient(62% 70% at 50% 50%, #000 30%, transparent 78%);
  pointer-events: none;
}

/* no-JS fallback scaling (JS overrides with inline zoom/transform) */
html:not(.js) .hero-engine .he-stage { zoom: 1; }
@media (max-width: 1279px) {
  html:not(.js) .hero-engine .he-stage { zoom: .78; }
}
@media (max-width: 991px) {
  html:not(.js) .hero-engine .he-stage { zoom: .55; }
}
@media (max-width: 719px) {
  html:not(.js) .hero-engine .he-stage { zoom: 1; }
}
@media (max-width: 479px) {
  html:not(.js) .hero-engine .he-stage { zoom: .8; }
}

/* ---------- column captions ---------- */
.hero-engine .he-cap {
  position: absolute;
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--muted-dark);
  white-space: nowrap;
}
.hero-engine .he-cap__n { color: var(--gold); margin-right: 6px; }

.hero-engine .he-cap--in   { left: 0;    top: 20px; width: 200px; }
.hero-engine .he-cap--core { left: 390px; top: 20px; width: 400px; text-align: center; }
.hero-engine .he-cap--out  { left: 960px; top: 20px; width: 220px; text-align: right; }

/* ---------- edge SVG layers ---------- */
.hero-engine .he-edges,
.hero-engine .he-packets {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
}

/* layout switching: desktop svg vs mobile svg (geometry must stay
   computable for JS -> visibility, never display:none) */
.hero-engine .he-edges--m { visibility: hidden; }
@media (max-width: 719px) {
  .hero-engine .he-edges--d { visibility: hidden; }
  .hero-engine .he-edges--m { visibility: visible; }
}

/* triple-stroke edge system: base rail / static blurred glow / marching ants */
.hero-engine .he-lay-base use {
  stroke: var(--line-dark);
  stroke-width: 1.5;
  fill: none;
}
.hero-engine .he-lay-glow use {
  stroke-width: 7;
  opacity: .22;
  filter: blur(3px); /* STATIC layer — geometry never animates */
  fill: none;
}
.hero-engine .he-lay-dash use {
  stroke-width: 2.75;
  stroke-linecap: round;
  stroke-dasharray: 6 11; /* period 6+11 = 17 */
  stroke-dashoffset: 0;
  fill: none;
  animation: heDash 1.15s linear infinite;
}
@keyframes heDash {
  to { stroke-dashoffset: -17; } /* == dasharray period -> seamless loop */
}
/* desync the ants */
.hero-engine .he-lay-dash use:nth-of-type(1) { animation-delay: 0s;    }
.hero-engine .he-lay-dash use:nth-of-type(2) { animation-delay: -.2s;  }
.hero-engine .he-lay-dash use:nth-of-type(3) { animation-delay: -.4s;  }
.hero-engine .he-lay-dash use:nth-of-type(4) { animation-delay: -.6s;  }
.hero-engine .he-lay-dash use:nth-of-type(5) { animation-delay: -.8s;  }
.hero-engine .he-lay-dash use:nth-of-type(6) { animation-delay: -.35s; }
.hero-engine .he-lay-dash use:nth-of-type(7) { animation-delay: -.55s; }
.hero-engine .he-lay-dash use:nth-of-type(8) { animation-delay: -.75s; }
.hero-engine .he-lay-dash use:nth-of-type(9) { animation-delay: -1s;   }

/* gradient stops (userSpaceOnUse gradients defined in the SVG defs) */
.hero-engine stop.he-s-bronze { stop-color: var(--bronze); }
.hero-engine stop.he-s-gold   { stop-color: var(--gold); }
.hero-engine stop.he-s-bright { stop-color: var(--gold-bright); }

/* ---------- packets (JS-driven comets) ---------- */
.hero-engine .he-pkt__head  { fill: var(--gold-bright); }
.hero-engine .he-pkt__halo  { fill: var(--gold); opacity: .22; }
.hero-engine .he-pkt__trail { fill: var(--gold); }

/* ---------- nodes ---------- */
.hero-engine .he-node { position: absolute; }

/* transform layering: entrance on .he-node, idle bob on .he-bob,
   flash lift on .he-card — three levels so transforms never fight */
.hero-engine .he-bob { width: 100%; height: 100%; }

.hero-engine .he-card {
  position: relative;
  display: flex;
  align-items: center;
  gap: 11px;
  width: 100%;
  height: 100%;
  padding: 0 13px;
  border: 1px solid var(--line-dark);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--obsidian-3) 55%, var(--obsidian-2)),
    var(--obsidian-2)
  );
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--bone-0) 6%, transparent);
  transition:
    transform .34s cubic-bezier(.2, .7, .3, 1.2),
    border-color .3s ease,
    box-shadow .3s ease;
}

.hero-engine .he-node.is-active .he-card {
  transform: translateY(-2px) scale(1.025);
  border-color: color-mix(in srgb, var(--gold) 65%, var(--line-dark));
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, var(--bone-0) 8%, transparent),
    0 0 0 1px color-mix(in srgb, var(--gold) 30%, transparent),
    0 6px 18px -6px color-mix(in srgb, var(--gold) 30%, transparent),
    0 0 26px -4px color-mix(in srgb, var(--gold) 24%, transparent);
}

/* input node sizes / positions — desktop 1180x470 */
.hero-engine .he-node--in { width: 200px; height: 58px; }
.hero-engine .he-n-email   { left: 0; top: 51px;  }
.hero-engine .he-n-sheets  { left: 0; top: 122px; }
.hero-engine .he-n-books   { left: 0; top: 193px; }
.hero-engine .he-n-crm     { left: 0; top: 264px; }
.hero-engine .he-n-phone   { left: 0; top: 335px; }
.hero-engine .he-n-content { left: 0; top: 406px; }

/* outcome nodes */
.hero-engine .he-node--out { width: 220px; height: 58px; }
.hero-engine .he-o-replies  { left: 960px; top: 51px;  }
.hero-engine .he-o-invoices { left: 960px; top: 122px; }
.hero-engine .he-o-docs     { left: 960px; top: 193px; }
.hero-engine .he-o-brief    { left: 960px; top: 264px; }
.hero-engine .he-o-voice    { left: 960px; top: 335px; }
.hero-engine .he-o-content  { left: 960px; top: 406px; }

.hero-engine .he-tile {
  flex: none;
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border: 1px solid var(--line-dark);
  border-radius: 2px; /* contract exception: icon tile */
  background: var(--obsidian-3);
  color: var(--muted-dark);
  transition: color .3s ease, border-color .3s ease;
}
.hero-engine .he-tile svg { width: 19px; height: 19px; display: block; }
.hero-engine .he-node.is-active .he-tile {
  color: var(--gold-bright);
  border-color: color-mix(in srgb, var(--gold) 55%, var(--line-dark));
}

.hero-engine .he-node__txt { min-width: 0; flex: 1 1 auto; }
.hero-engine .he-node__label {
  display: block;
  font-family: var(--mono);
  font-size: 10.5px;
  font-weight: 500;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--bone-0);
  white-space: nowrap;
}
.hero-engine .he-node__sub {
  display: block;
  margin-top: 3px;
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: .08em;
  color: var(--muted-dark);
  white-space: nowrap;
}

/* The content node has the longest metadata string. Tighten only its tracking
   enough to keep the final word inside the fixed 200px card. */
.hero-engine .he-n-content .he-node__sub { letter-spacing: .04em; }

/* outcome text + demo counters */
.hero-engine .he-node--out .he-node__label {
  font-family: var(--sans);
  font-size: 13.5px;
  font-weight: 500;
  letter-spacing: .01em;
  text-transform: none;
}
.hero-engine .he-live {
  display: block;
  margin-top: 4px;
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: .08em;
  color: var(--gold);
  white-space: nowrap;
}
.hero-engine .he-live b {
  font-weight: 600;
  color: var(--gold-bright);
}

/* port dots */
.hero-engine .he-port {
  position: absolute;
  width: 11px;
  height: 11px;
  border-radius: 50%; /* status-dot exception */
  background: var(--obsidian-1);
  border: 1.5px solid var(--muted-dark);
  transition: border-color .3s ease, box-shadow .3s ease;
  z-index: 2;
}
.hero-engine .he-node--in  .he-port { right: -6px; top: 50%; margin-top: -5.5px; }
.hero-engine .he-node--out .he-port { left: -6px;  top: 50%; margin-top: -5.5px; }
.hero-engine .he-node.is-active .he-port {
  border-color: var(--gold-bright);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--gold) 25%, transparent);
}

/* ---------- the core ---------- */
.hero-engine .he-corewrap {
  position: absolute;
  left: 515px;
  top: 160px;
  width: 150px;
  height: 150px;
}

.hero-engine .he-ring {
  position: absolute;
  inset: 0;
  border-radius: 50%; /* radar rings — contract signature element */
  border: 1px solid color-mix(in srgb, var(--gold) 45%, transparent);
  animation: heRing 2.8s cubic-bezier(.2, .6, .35, 1) infinite;
  pointer-events: none;
}
.hero-engine .he-ring--2 { animation-delay: 1.4s; }
@keyframes heRing {
  0%   { transform: scale(.88); opacity: .8; }
  100% { transform: scale(1.28); opacity: 0; }
}

.hero-engine .he-core {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 7px;
  width: 100%;
  height: 100%;
  border: 1px solid var(--line-dark);
  background:
    repeating-linear-gradient(
      0deg,
      color-mix(in srgb, var(--bone-0) 2.5%, transparent) 0 1px,
      transparent 1px 3px
    ),
    linear-gradient(180deg, var(--obsidian-3), var(--obsidian-2));
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--bone-0) 7%, transparent);
  transition:
    transform .38s cubic-bezier(.2, .7, .3, 1.25),
    border-color .3s ease,
    box-shadow .35s ease;
}
.hero-engine .he-corewrap.is-processing .he-core {
  transform: scale(1.06);
  border-color: color-mix(in srgb, var(--gold) 70%, var(--line-dark));
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, var(--bone-0) 9%, transparent),
    0 0 0 1px color-mix(in srgb, var(--gold) 35%, transparent),
    0 0 30px -4px color-mix(in srgb, var(--gold) 35%, transparent),
    0 0 60px -10px color-mix(in srgb, var(--gold) 28%, transparent);
}

.hero-engine .he-mark {
  width: 36px;
  height: 36px;
  color: var(--bone-0);
  transition: transform .5s cubic-bezier(.2, .7, .3, 1);
  will-change: transform;
}
.hero-engine .he-mark svg { width: 100%; height: 100%; display: block; }

.hero-engine .he-core__label {
  font-family: var(--mono);
  font-size: 9px;
  font-weight: 500;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--muted-dark);
}

.hero-engine .he-core__rule {
  width: 26px;
  height: 1px;
  background: var(--line-dark);
}

.hero-engine .he-word {
  font-family: var(--mono);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: .16em;
  color: var(--gold-bright);
}
.hero-engine .he-word.is-tick { animation: heWordIn .45s cubic-bezier(.2, .7, .3, 1); }
@keyframes heWordIn {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ---------- satellite chips (operator / audit log) ---------- */
.hero-engine .he-chip {
  position: absolute;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: max-content;
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 5px 11px;
  font-family: var(--mono);
  font-size: 9.5px;
  font-weight: 500;
  letter-spacing: .13em;
  text-transform: uppercase;
  white-space: nowrap;
  z-index: 2;
}
.hero-engine .he-chip--op {
  top: 114px;
  background: var(--bone-0); /* bone chip per contract */
  border: 1px solid var(--line-light);
  color: var(--ink);
}
.hero-engine .he-chip--op .he-dot { background: var(--live); }
.hero-engine .he-chip--op .he-dot::after { background: var(--live); }
.hero-engine .he-chip--audit {
  top: 336px;
  background: color-mix(in srgb, var(--obsidian-3) 70%, transparent);
  border: 1px solid var(--line-dark);
  color: var(--muted-dark);
}
.hero-engine .he-chip--audit .he-chip__tick { color: var(--gold); }

/* dashed connectors chip <-> core */
.hero-engine .he-chip::after {
  content: "";
  position: absolute;
  left: 50%;
  width: 0;
  border-left: 1px dashed color-mix(in srgb, var(--muted-dark) 55%, transparent);
}
.hero-engine .he-chip--op::after    { top: 100%; height: 20px; }
.hero-engine .he-chip--audit::after { bottom: 100%; height: 20px; }

/* ---------- entrance stagger (gated on html.js; no-JS sees all) ---------- */
html.js .hero-engine .he-cap,
html.js .hero-engine .he-node,
html.js .hero-engine .he-chip {
  animation: heIn .7s cubic-bezier(.2, .7, .3, 1) both;
  animation-delay: var(--ed, 0s);
}
html.js .hero-engine .he-corewrap {
  animation: heCoreIn .8s cubic-bezier(.2, .7, .3, 1.2) both;
  animation-delay: var(--ed, .9s);
}
html.js .hero-engine .he-edges,
html.js .hero-engine .he-packets {
  animation: heFade .9s ease both;
  animation-delay: 1.05s;
}
@keyframes heIn {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes heCoreIn {
  from { opacity: 0; transform: scale(.92); }
  to   { opacity: 1; transform: scale(1); }
}
@keyframes heFade {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* idle bob — inner wrapper so it never fights entrance/flash transforms */
html.js .hero-engine .he-node .he-bob {
  animation: heBob var(--bd, 7s) ease-in-out var(--bo, 0s) infinite;
}
@keyframes heBob {
  0%, 100% { transform: translateY(2px); }
  50%      { transform: translateY(-3px); }
}

/* ---------- IO / visibility pause hook (JS toggles .he-paused) ---------- */
.hero-engine.he-paused .he-lay-dash use,
.hero-engine.he-paused .he-ring,
.hero-engine.he-paused .he-bob,
.hero-engine.he-paused .he-dot::after {
  animation-play-state: paused;
}

/* ---------- mobile stacked layout (<=719px) — 430x850 design space ---------- */
@media (max-width: 719px) {
  .hero-engine .he-viewport { padding: 14px 12px 16px; }
  .hero-engine .he-stage { width: 430px; height: 850px; }
  .hero-engine .he-stage::before { background-size: 22px 22px; }

  /* captions become bordered chips so the spine edge reads as labeled wire */
  .hero-engine .he-cap {
    left: 0; right: 0;
    width: max-content;
    margin: 0 auto;
    padding: 4px 10px;
    background: var(--obsidian-1);
    border: 1px solid var(--line-dark-soft);
    text-align: center;
    z-index: 1;
  }
  .hero-engine .he-cap--in   { top: 0; }
  .hero-engine .he-cap--core { top: 190px; }
  .hero-engine .he-cap--out  { top: 446px; }

  .hero-engine .he-node--in { width: 200px; height: 44px; }
  .hero-engine .he-node--in .he-card { gap: 9px; padding: 0 11px; }
  .hero-engine .he-node__sub { display: none; }
  .hero-engine .he-tile { width: 28px; height: 28px; }
  .hero-engine .he-tile svg { width: 16px; height: 16px; }
  .hero-engine .he-node__label { font-size: 9.5px; }

  .hero-engine .he-n-email  { left: 0;     top: 30px;  }
  .hero-engine .he-n-sheets { left: 230px; top: 30px;  }
  .hero-engine .he-n-books  { left: 0;     top: 82px;  }
  .hero-engine .he-n-crm    { left: 230px; top: 82px;  }
  .hero-engine .he-n-phone  { left: 0;     top: 134px; }
  .hero-engine .he-n-content{ left: 230px; top: 134px; }

  /* ports rotate to bottom (inputs) / top (outcomes) center */
  .hero-engine .he-node--in .he-port {
    right: auto; top: auto;
    left: 50%; bottom: -6px;
    margin: 0 0 0 -5.5px;
  }
  .hero-engine .he-node--out .he-port {
    left: 50%; top: -6px;
    margin: 0 0 0 -5.5px;
  }

  .hero-engine .he-corewrap { left: 140px; top: 252px; }
  .hero-engine .he-chip--op    { top: 214px; }
  .hero-engine .he-chip--audit { top: 414px; }
  .hero-engine .he-chip--op::after    { height: 14px; }
  .hero-engine .he-chip--audit::after { height: 14px; }

  .hero-engine .he-node--out { width: 380px; height: 50px; }
  .hero-engine .he-node--out .he-node__txt {
    display: flex;
    flex-direction: column;
    width: 100%;
    align-items: flex-start;
    justify-content: center;
    gap: 2px;
  }
  .hero-engine .he-node--out .he-node__label {
    max-width: 100%;
    font-size: 12.5px;
    line-height: 1.15;
    white-space: normal;
  }
  .hero-engine .he-live {
    display: none;
  }
  .hero-engine .he-o-replies  { left: 25px; top: 472px; }
  .hero-engine .he-o-invoices { left: 25px; top: 530px; }
  .hero-engine .he-o-docs     { left: 25px; top: 588px; }
  .hero-engine .he-o-brief    { left: 25px; top: 646px; }
  .hero-engine .he-o-voice    { left: 25px; top: 704px; }
  .hero-engine .he-o-content  { left: 25px; top: 762px; }
}

/* ---------- reduced motion: full static fallback ---------- */
@media (prefers-reduced-motion: reduce) {
  .hero-engine *,
  .hero-engine *::before,
  .hero-engine *::after {
    animation: none !important;
    transition: none !important;
  }
  .hero-engine .he-ring { display: none; }         /* rings off */
  .hero-engine .he-lay-dash { display: none; }     /* marching ants off */
  .hero-engine .he-lay-glow use { opacity: .16; }  /* calmer static glow */
  /* JS places 3 frozen packet dots mid-path; base+glow rails stay visible */
}

/* ============================================================================
   SOURCE 06: partials/css/legal.css
   ============================================================================ */
/* == legal + infra pages (B8: privacy / terms / data-handling / client / 404) ==
   Scoped: .legal-*, .draft-banner, .retention-*, .own-callout, .bill-*, .nf-*
   Tokens from ridgeway.css (contract §2). Radius 0, 1px rules, no shadows. */

/* ---------- shared legal shell ---------- */
.legal-hero{padding-block:80px 64px}
@media(min-width:900px){.legal-hero{padding-block:104px 80px}}
.legal-hero h1{margin-top:20px;font-size:clamp(40px,5.6vw,76px)}
.legal-hero .lede{margin-top:20px}
.legal-wrap{max-width:920px}
.legal-prose{display:grid;gap:40px}
.legal-sec .micro{display:block;margin-bottom:10px;color:var(--accent-text)}
.legal-sec h2{font-size:clamp(23px,2.6vw,30px);font-weight:400;letter-spacing:-.025em}
.legal-sec p,.legal-sec li{color:var(--tx-muted)}
.legal-sec p{margin-top:12px;max-width:800px}
.legal-sec ul{margin:12px 0 0;padding-left:22px}
.legal-sec li{margin:8px 0}
.legal-sec li::marker{color:var(--accent-text)}

/* attorney-review draft banner — kept per honesty rail §4.8 */
.draft-banner{
  border:1px solid var(--rule);border-left:3px solid var(--accent-text);
  background:var(--card-bg);padding:18px 22px;margin-top:30px;
  font-size:15px;line-height:1.6;color:var(--tx-muted);max-width:800px;
}
.draft-banner b{
  display:block;margin-bottom:6px;color:var(--accent-text);
  font-family:var(--mono);font-size:11.5px;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;
}
.dark .draft-banner{background:var(--obsidian-2)}

/* ---------- data-handling ---------- */
.own-callout{
  border:1px solid var(--rule);border-left:3px solid var(--accent-text);
  background:var(--card-bg);padding:clamp(26px,4vw,40px);
}
.own-callout p{
  margin-top:14px;font-size:clamp(19px,2.2vw,24px);line-height:1.5;
  letter-spacing:-.02em;color:var(--tx);max-width:860px;
}
.retention-list{border:1px solid var(--rule);background:var(--card-bg);margin-top:22px}
.retention-row{display:grid;gap:4px 26px;padding:16px 20px;border-top:1px solid var(--rule)}
.retention-row:first-child{border-top:0}
@media(min-width:720px){.retention-row{grid-template-columns:minmax(220px,.8fr) 1.2fr}}
.retention-row b{font-weight:500;color:var(--tx)}
.retention-row span{color:var(--tx-muted);font-size:15.5px}

/* ---------- client billing ---------- */
.bill-line{
  display:flex;flex-wrap:wrap;gap:8px 28px;align-items:baseline;
  border:1px solid var(--rule);border-left:3px solid var(--accent-text);
  background:var(--card-bg);padding:16px 22px;margin-top:30px;max-width:800px;
}
.bill-line b{font-family:var(--mono);font-size:11.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--accent-text)}
.bill-line span{color:var(--tx-soft);font-size:15.5px}
.term-list{border:1px solid var(--rule);background:var(--card-bg)}
.term-list-row{display:grid;gap:4px 26px;padding:18px 22px;border-top:1px solid var(--rule)}
.term-list-row:first-child{border-top:0}
@media(min-width:720px){.term-list-row{grid-template-columns:minmax(240px,.8fr) 1.2fr}}
.term-list-row b{font-weight:500;color:var(--tx);letter-spacing:-.01em}
.term-list-row span{color:var(--tx-muted);font-size:15.5px}

/* ---------- 404 ---------- */
.nf-section{min-height:calc(88vh - var(--nav-h));display:flex;align-items:center}
.nf-grid{display:grid;gap:clamp(32px,5vw,64px);align-items:center;grid-template-columns:1fr;width:100%}
@media(min-width:960px){.nf-grid{grid-template-columns:1.05fr .95fr}}
.nf-copy h1{margin-top:20px}
.nf-copy .lede{margin-top:18px;max-width:520px}
.nf-copy .cta-row{margin-top:30px}
.nf-term{width:100%;min-width:0}
.nf-term .term-body{padding:20px 22px 26px}
.nf-log{max-width:100%;font-family:var(--mono);font-size:13.5px;line-height:2.05;margin:0;overflow-x:auto}
.nf-log .cmd{color:var(--bone-0)}
.nf-log .dim{color:var(--muted-dark)}
.nf-log .err{color:#e07a6e}
.nf-log a{color:var(--gold);border-bottom:1px solid rgba(201,149,93,.4);transition:color .15s,border-color .15s}
.nf-log a:hover{color:var(--gold-bright);border-color:var(--gold-bright)}
.nf-cursor{display:inline-block;width:8px;height:15px;background:var(--gold);vertical-align:-2px;animation:nf-blink 1.1s steps(2,start) infinite}
@keyframes nf-blink{to{visibility:hidden}}
@media(prefers-reduced-motion:reduce){.nf-cursor{animation:none}}

/* ============================================================================
   SOURCE 07: partials/css/loop-diagram.css
   ============================================================================ */
/* ============================================================
   Ridgeway AI — loop-diagram.css (design contract section 3.4)
   Process loop: MAP -> BUILD -> SHADOW -> OPERATE, traveling token.
   Pairs with: partials/fragments/loop-diagram.html
               assets/js/loop-diagram.js
   States:
   - default (no JS, or JS not yet live): static, ALL nodes lit, token hidden
   - .is-live (added by JS when motion is allowed): nodes dim, token lights
     whatever it passes within 55 SVG units
   - prefers-reduced-motion: forced back to static all-lit, token hidden
   Radius 0 everywhere; the only circles are SVG node geometry + chrome dots
   (status-dot exception in the contract).
   ============================================================ */

.loop-diagram{
  background:var(--obsidian-1,#10141a);
  border:1px solid var(--line-dark,#242c38);
  border-radius:0;
}

/* --- chrome bar ------------------------------------------------ */
.ld-chrome{
  display:flex;
  align-items:center;
  gap:14px;
  padding:12px 18px;
  border-bottom:1px solid var(--line-dark-soft,#1c232e);
  font-family:var(--mono,'IBM Plex Mono',ui-monospace,monospace);
  font-size:12px;
  letter-spacing:.08em;
  color:var(--muted-dark,#9aa3b2);
}
.ld-dots{display:inline-flex;gap:6px;flex:0 0 auto}
.ld-dots i{width:9px;height:9px;border-radius:50%;/* exception: terminal status dots */background:#242c38;display:block}
.ld-chrome-title{white-space:nowrap}
.ld-chrome-note{margin-left:auto;color:var(--muted-dark,#9aa3b2);white-space:nowrap}
@media (max-width:640px){.ld-chrome-note{display:none}}

/* --- scroll shell (page must never scroll horizontally) -------- */
.ld-scroll{
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  padding:22px 18px 10px;
}
.ld-scroll:focus-visible{outline:2px solid var(--gold,#c9955d);outline-offset:-2px}
.ld-svg{display:block;width:100%;min-width:920px;height:auto}

/* --- rail + direction chevrons --------------------------------- */
.ld-rail{fill:none;stroke:var(--line-dark,#242c38);stroke-width:1.5}
.ld-chevron{fill:none;stroke:#3d4756;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* --- nodes (default = lit; this IS the no-JS render) ----------- */
.ld-node .ld-ring{
  fill:var(--obsidian-3,#1b222c);
  stroke:var(--gold,#c9955d);
  stroke-width:1.75;
  transition:stroke .35s ease,fill .35s ease;
}
/* glow = layered translucent gold halos — never CSS blur */
.ld-halo{fill:none;stroke:var(--gold,#c9955d);transition:opacity .45s ease}
.ld-halo-inner{stroke-width:2;opacity:.22}
.ld-halo-outer{stroke-width:1;opacity:.1}

.ld-num{
  font:500 11px var(--mono,'IBM Plex Mono',ui-monospace,monospace);
  letter-spacing:.16em;
  fill:var(--gold,#c9955d);
  opacity:.85;
}
.ld-name{
  font:600 16px var(--mono,'IBM Plex Mono',ui-monospace,monospace);
  letter-spacing:.12em;
  fill:var(--bone-0,#f7f4ec);
  transition:fill .35s ease;
}
/* plain-English sublabels; knockout stroke lets them cross the rail cleanly */
.ld-sub{
  font:400 13.5px var(--sans,'IBM Plex Sans',system-ui,sans-serif);
  fill:var(--muted-dark,#9aa3b2);
  paint-order:stroke;
  stroke:var(--obsidian-1,#10141a);
  stroke-width:6px;
  stroke-linejoin:round;
}

/* --- loop-back label (the operate half) ------------------------ */
.ld-loop-label{
  font:500 13px var(--mono,'IBM Plex Mono',ui-monospace,monospace);
  letter-spacing:.02em;
  fill:var(--gold,#c9955d);
  paint-order:stroke;
  stroke:var(--obsidian-1,#10141a);
  stroke-width:6px;
  stroke-linejoin:round;
}

/* --- dashed branch to YOU --------------------------------------- */
.ld-branch{
  stroke:var(--gold,#c9955d);
  stroke-width:1.5;
  stroke-dasharray:4 6;
  opacity:.8;
  transition:stroke .35s ease,opacity .35s ease;
}
.ld-branch-arrow{
  fill:none;
  stroke:var(--gold,#c9955d);
  stroke-width:1.5;
  stroke-linecap:round;
  stroke-linejoin:round;
  transition:stroke .35s ease,opacity .35s ease;
}
.ld-branch-label{
  font:500 12.5px var(--mono,'IBM Plex Mono',ui-monospace,monospace);
  letter-spacing:.02em;
  fill:var(--gold,#c9955d);
  paint-order:stroke;
  stroke:var(--obsidian-1,#10141a);
  stroke-width:6px;
  stroke-linejoin:round;
}
.ld-you-ring{
  fill:none;
  stroke:var(--gold,#c9955d);
  stroke-width:1.5;
  stroke-dasharray:5 7;
  transition:stroke .35s ease,opacity .35s ease;
}
.ld-you-halo{fill:none;stroke:var(--gold,#c9955d);stroke-width:1.5;opacity:.14;transition:opacity .45s ease}
.ld-you-name{
  font:600 15px var(--mono,'IBM Plex Mono',ui-monospace,monospace);
  letter-spacing:.12em;
  fill:var(--bone-0,#f7f4ec);
  transition:fill .35s ease;
}

/* --- traveling token + trail ------------------------------------ */
.ld-token,.ld-trail{opacity:0;transition:opacity .35s ease}
.ld-token-head{fill:var(--gold-bright,#e3b57e)}
.ld-token-halo{fill:var(--gold,#c9955d);opacity:.22}
.ld-trail circle{fill:var(--gold,#c9955d)}

/* ============================================================
   LIVE state — JS added .is-live (in view, tab visible, motion OK).
   Nodes dim until the token is within 55 units.
   ============================================================ */
.loop-diagram.is-live .ld-token{opacity:1}
.loop-diagram.is-live .ld-trail-1{opacity:.5}
.loop-diagram.is-live .ld-trail-2{opacity:.3}
.loop-diagram.is-live .ld-trail-3{opacity:.16}

.loop-diagram.is-live .ld-node:not(.is-lit) .ld-ring{stroke:var(--line-dark,#242c38);fill:var(--obsidian-2,#151a22)}
.loop-diagram.is-live .ld-node:not(.is-lit) .ld-name{fill:var(--muted-dark,#9aa3b2)}
.loop-diagram.is-live .ld-node:not(.is-lit) .ld-halo{opacity:0}

.loop-diagram.is-live .ld-you:not(.is-lit) .ld-you-ring{stroke:var(--muted-dark,#9aa3b2);opacity:.55}
.loop-diagram.is-live .ld-you:not(.is-lit) .ld-you-name{fill:var(--muted-dark,#9aa3b2)}
.loop-diagram.is-live .ld-you:not(.is-lit) .ld-you-halo{opacity:0}

.loop-diagram.is-live .ld-branch-group:not(.is-lit) .ld-branch{stroke:var(--muted-dark,#9aa3b2);opacity:.45}
.loop-diagram.is-live .ld-branch-group:not(.is-lit) .ld-branch-arrow{stroke:var(--muted-dark,#9aa3b2);opacity:.6}

/* ============================================================
   Reduced motion — static, ALL nodes lit, token hidden.
   JS also refuses to animate; this is the belt-and-braces layer
   in case .is-live was left behind.
   ============================================================ */
@media (prefers-reduced-motion: reduce){
  .loop-diagram .ld-token,
  .loop-diagram .ld-trail{opacity:0 !important}

  .loop-diagram.is-live .ld-node .ld-ring{stroke:var(--gold,#c9955d) !important;fill:var(--obsidian-3,#1b222c) !important}
  .loop-diagram.is-live .ld-node .ld-name{fill:var(--bone-0,#f7f4ec) !important}
  .loop-diagram.is-live .ld-node .ld-halo-inner{opacity:.22 !important}
  .loop-diagram.is-live .ld-node .ld-halo-outer{opacity:.1 !important}

  .loop-diagram.is-live .ld-you .ld-you-ring{stroke:var(--gold,#c9955d) !important;opacity:1 !important}
  .loop-diagram.is-live .ld-you .ld-you-name{fill:var(--bone-0,#f7f4ec) !important}
  .loop-diagram.is-live .ld-you .ld-you-halo{opacity:.14 !important}

  .loop-diagram.is-live .ld-branch-group .ld-branch{stroke:var(--gold,#c9955d) !important;opacity:.8 !important}
  .loop-diagram.is-live .ld-branch-group .ld-branch-arrow{stroke:var(--gold,#c9955d) !important;opacity:1 !important}

  .ld-node .ld-ring,.ld-name,.ld-halo,.ld-branch,.ld-branch-arrow,.ld-you-ring,.ld-you-name,.ld-you-halo{transition:none}
}

/* ============================================================================
   SOURCE 08: partials/css/marquee.css
   ============================================================================ */
/* ============================================================
   Ridgeway AI — integrations marquee (DESIGN-DIRECTION §3.2)
   CSS-only. Zero JS. Works identically with JS disabled.

   Seamless-loop math:
   - Each .mq-track holds exactly TWO identical .mq-group lists.
   - A group's rendered width INCLUDES its trailing gap
     (flex gap between pills + padding-right = one full gap),
     so track width = 2 × group width exactly.
   - Animating the track from translateX(0) to translateX(-50%)
     therefore shifts by exactly one group width → seamless wrap.
   - Row 1 runs right-to-left in 54s; row 2 reverses in 62s.

   Reduced motion: animation off, duplicate group hidden,
   remaining group wraps into a static centered grid.
   ============================================================ */

.mq {
  --mq-gap: 18px;
  background: var(--bone-0, #f7f4ec);
  padding: 72px 0 76px;
  overflow: hidden;
}

@media (max-width: 720px) {
  .mq { padding: 48px 0 52px; }
}

.mq-eyebrow {
  margin: 0 auto 40px;
  padding: 0 24px;
  max-width: 1248px;
  font-family: var(--mono, 'IBM Plex Mono', ui-monospace, monospace);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  text-align: center;
  color: var(--muted, #606775);
}

/* Viewport: clips the tracks, fades both edges. */
.mq-viewport {
  display: grid;
  gap: 14px;
  -webkit-mask-image: linear-gradient(
    90deg,
    transparent 0%,
    #000 9%,
    #000 91%,
    transparent 100%
  );
  mask-image: linear-gradient(
    90deg,
    transparent 0%,
    #000 9%,
    #000 91%,
    transparent 100%
  );
}

.mq-row {
  overflow: hidden;
}

.mq-track {
  display: flex;
  width: max-content;
  will-change: transform;
  animation: mq-scroll 54s linear infinite;
}

.mq-row--2 .mq-track {
  animation-duration: 62s;
  animation-direction: reverse;
}

/* Hovering a row pauses its track so pills can be read/targeted. */
.mq-row:hover .mq-track {
  animation-play-state: paused;
}

@keyframes mq-scroll {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

/* One group = the real 20-pill list. Its twin is aria-hidden.
   padding-right supplies the trailing gap that makes group width
   (content + gaps + trailing gap) an exact half of the track. */
.mq-group {
  display: flex;
  align-items: center;
  gap: var(--mq-gap);
  padding: 4px var(--mq-gap) 4px 0; /* 4px vertical room for hover lift */
  margin: 0;
  list-style: none;
  flex: none;
}

/* ---- Pills ------------------------------------------------ */

.mq-pill {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  height: 56px;
  padding: 0 20px;
  background: var(--paper, #fffdf8);
  border: 1px solid var(--line-light, #d6ccbb);
  border-radius: 2px; /* logo-pill exception per contract §2 */
  white-space: nowrap;
  transition: transform 0.18s cubic-bezier(0.2, 0.7, 0.3, 1),
              border-color 0.18s ease;
}

.mq-pill:hover {
  transform: translateY(-3px);
  border-color: var(--gold, #c9955d);
}

.mq-pill img {
  display: block;
  width: 26px;
  height: 26px;
  flex: none;
}

.mq-name {
  font-family: var(--mono, 'IBM Plex Mono', ui-monospace, monospace);
  font-size: 13.5px;
  font-weight: 400;
  color: var(--ink-soft, #3a404c);
}

/* Wordmark fallback pill: no logo asset exists (or the brand had
   its icon removed from simple-icons) — honest text treatment:
   the tool's initial in a hairline square + the name in Mono 600. */
.mq-pill--wordmark .mq-initial {
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  flex: none;
  border: 1px solid var(--line-light, #d6ccbb);
  border-radius: 2px;
  background: var(--bone-0, #f7f4ec);
  font-family: var(--mono, 'IBM Plex Mono', ui-monospace, monospace);
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
  color: var(--gold-text-light, #85572e);
}

.mq-pill--wordmark .mq-name {
  font-weight: 600;
  color: var(--ink, #101216);
}

/* ---- Reduced motion: static wrapped grid ------------------ */

@media (prefers-reduced-motion: reduce) {
  .mq-track {
    animation: none;
    width: auto;
    justify-content: center;
  }

  .mq-group {
    flex-wrap: wrap;
    justify-content: center;
    max-width: 1248px;
    margin: 0 auto;
    padding-left: 24px;
    padding-right: 24px;
  }

  /* The duplicate group exists only to feed the loop — drop it. */
  .mq-group[aria-hidden="true"] {
    display: none;
  }

  .mq-viewport {
    -webkit-mask-image: none;
    mask-image: none;
  }

  .mq-pill,
  .mq-pill:hover {
    transform: none;
  }
}

/* ============================================================================
   SOURCE 09: partials/css/model-finder.css
   ============================================================================ */
/* ============================================================
   Ridgeway AI — model-finder.css (design contract section 3.5)
   Pricing-page self-ID picker: 5 buttons -> instant recommendation
   card (Audit / Consulting / Contracting / "don't hire us yet").
   Pairs with: partials/fragments/model-finder.html
               assets/js/model-finder.js
   No email gate, no tracking. Radius 0. Sits on a bone surface;
   the recommendation card inverts to obsidian.
   No-JS: the interactive rail stays hidden (html.js gate + .is-ready
   set by the module) and a static three-shape fallback shows instead.
   ============================================================ */

.model-finder{
  background:var(--paper,#fffdf8);
  border:1px solid var(--line-light,#d6ccbb);
  border-radius:0;
}

/* --- chrome bar ------------------------------------------------ */
.mf-chrome{
  display:flex;
  align-items:center;
  gap:14px;
  padding:12px 18px;
  border-bottom:1px solid var(--line-light,#d6ccbb);
  background:var(--bone-1,#efe9dc);
  font-family:var(--mono,'IBM Plex Mono',ui-monospace,monospace);
  font-size:12px;
  letter-spacing:.08em;
  color:var(--muted,#606775);
}
.mf-dots{display:inline-flex;gap:6px;flex:0 0 auto}
.mf-dots i{width:9px;height:9px;border-radius:50%;/* exception: terminal status dots */background:var(--line-light,#d6ccbb);display:block}
.mf-chrome-title{white-space:nowrap}
.mf-chrome-note{margin-left:auto;text-transform:uppercase;font-size:11px;letter-spacing:.14em;white-space:nowrap}
@media (max-width:640px){.mf-chrome-note{display:none}}

.mf-body{padding:clamp(22px,3.5vw,40px)}

/* --- prompt ----------------------------------------------------- */
.mf-prompt{
  margin:0;
  font-family:var(--sans,'IBM Plex Sans',system-ui,sans-serif);
  font-size:24px;
  font-weight:500;
  letter-spacing:-.02em;
  color:var(--ink,#101216);
}
.mf-prompt-sub{
  margin:8px 0 0;
  font-size:15px;
  line-height:1.6;
  color:var(--muted,#606775);
  max-width:640px;
}

/* --- gates: interactive only when JS actually initialized ------- */
.mf-interactive{display:none}
html.js .model-finder.is-ready .mf-interactive{display:block}
html.js .model-finder.is-ready .mf-fallback{display:none}

/* --- the five self-ID buttons ----------------------------------- */
.mf-choices{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  gap:10px;
  margin-top:24px;
}
.mf-choice{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:10px;
  min-height:96px;
  padding:16px;
  text-align:left;
  background:var(--bone-0,#f7f4ec);
  border:1px solid var(--line-light,#d6ccbb);
  border-radius:0;
  color:var(--ink,#101216);
  font:inherit;
  cursor:pointer;
  transition:border-color .18s ease,background .18s ease,box-shadow .18s ease;
}
.mf-choice:hover{border-color:var(--ink,#101216)}
.mf-choice:focus-visible{outline:2px solid var(--bronze,#8F5E32);outline-offset:2px}
.mf-choice[aria-pressed="true"]{
  border-color:var(--bronze,#8F5E32);
  box-shadow:inset 0 0 0 1px var(--bronze,#8F5E32);
  background:rgba(143,94,50,.07);
}
.mf-choice-num{
  font-family:var(--mono,'IBM Plex Mono',ui-monospace,monospace);
  font-size:11px;
  letter-spacing:.16em;
  color:var(--gold-text-light,#85572e);
}
.mf-choice-label{
  font-size:15.5px;
  font-weight:500;
  line-height:1.35;
  letter-spacing:-.01em;
}

/* --- result stage ------------------------------------------------ */
.mf-stage{margin-top:26px;min-height:240px}
.mf-placeholder{
  border:1px dashed var(--line-light,#d6ccbb);
  padding:clamp(20px,3vw,28px);
  color:var(--muted,#606775);
  font-size:15px;
  line-height:1.65;
}
.mf-placeholder p{margin:0;max-width:640px}
.mf-placeholder[hidden]{display:none !important}

/* recommendation card — inverted obsidian on the bone page */
.mf-card{
  background:var(--obsidian-1,#10141a);
  border:1px solid var(--line-dark,#242c38);
  padding:clamp(24px,3.5vw,40px);
  opacity:0;
  transform:translateY(14px);
  transition:opacity .45s cubic-bezier(.2,.7,.3,1),transform .45s cubic-bezier(.2,.7,.3,1);
}
.mf-card.is-in{opacity:1;transform:none}
.mf-card[hidden]{display:none !important}

.mf-card-top{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:12px;
}
.mf-card-eyebrow{
  font-family:var(--mono,'IBM Plex Mono',ui-monospace,monospace);
  font-size:11px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--gold,#c9955d);
}
.mf-card-shape{
  font-family:var(--mono,'IBM Plex Mono',ui-monospace,monospace);
  font-size:11px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--gold,#c9955d);
  border:1px solid rgba(201,149,93,.45);
  padding:6px 10px;
}
.mf-card-title{
  margin:18px 0 0;
  font-family:var(--sans,'IBM Plex Sans',system-ui,sans-serif);
  font-size:clamp(24px,2.8vw,32px);
  font-weight:400;
  letter-spacing:-.03em;
  line-height:1.1;
  color:var(--bone-0,#f7f4ec);
}
.mf-card-body{
  margin:14px 0 0;
  max-width:760px;
  font-size:16.5px;
  line-height:1.65;
  color:var(--muted-dark,#9aa3b2);
}
.mf-card-ctas{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:24px;
}
.mf-cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-height:46px;
  padding:12px 20px;
  border:1px solid transparent;
  border-radius:0;
  font-size:15px;
  font-weight:500;
  line-height:1;
  text-decoration:none;
  transition:background .18s ease,border-color .18s ease,color .18s ease;
}
.mf-cta-primary{background:var(--bronze,#8F5E32);border-color:var(--bronze,#8F5E32);color:#fff}
.mf-cta-primary:hover{background:var(--bronze-hover,#734823);border-color:var(--bronze-hover,#734823)}
.mf-cta-primary:focus-visible{outline:2px solid var(--gold,#c9955d);outline-offset:2px}
.mf-cta-ghost{background:transparent;border-color:rgba(247,244,236,.28);color:var(--bone-0,#f7f4ec)}
.mf-cta-ghost:hover{border-color:var(--gold,#c9955d);color:var(--gold-bright,#e3b57e)}
.mf-cta-ghost:focus-visible{outline:2px solid var(--gold,#c9955d);outline-offset:2px}

/* --- no-JS fallback ---------------------------------------------- */
.mf-fallback{padding-top:22px}
.mf-fallback-note{
  margin:0;
  font-size:16px;
  color:var(--muted,#606775);
}
.mf-fallback-list{
  margin:16px 0 0;
  padding:0;
  list-style:none;
  border-top:1px solid var(--line-light,#d6ccbb);
}
.mf-fallback-list li{
  border-bottom:1px solid var(--line-light,#d6ccbb);
  padding:14px 0;
  font-size:15.5px;
  line-height:1.6;
  color:var(--ink-soft,#3a404c);
}
.mf-fallback-list a{
  color:var(--gold-text-light,#85572e);
  font-weight:500;
  text-decoration:none;
  border-bottom:1px solid rgba(133,87,46,.4);
}
.mf-fallback-list a:hover{color:var(--bronze-hover,#734823);border-bottom-color:var(--bronze-hover,#734823)}

/* --- reduced motion: cards appear instantly ---------------------- */
@media (prefers-reduced-motion: reduce){
  .mf-card{transition:none;opacity:1;transform:none}
  .mf-choice,.mf-cta{transition:none}
}

/* ============================================================================
   SOURCE 10: partials/css/terminal.css
   ============================================================================ */
/* ============================================================
   Ridgeway AI — live operator terminal (contract §3.3)
   Scope: .terminal — pairs with partials/fragments/terminal.html
   + assets/js/terminal.js. Token fallbacks baked in so the
   component renders correctly standalone (tools/ preview).
   Radius 0 everywhere; only status dots are circles (allowed
   exception). Scanline hint is STATIC — never animated.
   ============================================================ */

.terminal {
  width: 100%;
  background: var(--obsidian-1, #10141a);
  border: 1px solid var(--line-dark, #242c38);
  border-radius: 0;
  font-family: var(--mono, 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace);
  color: var(--bone-0, #f7f4ec);
  /* dark-surface glow = layered translucent gold halos, no blur on animated els */
  box-shadow:
    0 0 0 1px rgba(201, 149, 93, 0.05),
    0 0 44px rgba(201, 149, 93, 0.05),
    0 28px 64px -48px rgba(0, 0, 0, 0.85);
}

/* ---- chrome bar ---- */
.terminal__chrome {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 11px 16px;
  background: var(--obsidian-2, #151a22);
  border-bottom: 1px solid var(--line-dark-soft, #1c232e);
  min-width: 0;
}
.terminal__dots {
  display: inline-flex;
  gap: 6px;
  flex: none;
}
.terminal__dots span {
  width: 10px;
  height: 10px;
  border-radius: 50%; /* status-dot exception */
  background: var(--obsidian-3, #1b222c);
  border: 1px solid var(--line-dark, #242c38);
}
.terminal__title {
  font-size: 12.5px;
  letter-spacing: 0.08em;
  color: var(--muted-dark, #9aa3b2);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
.terminal__chip {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  flex: none;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--live-dark, #39c27f);
  border: 1px solid rgba(57, 194, 127, 0.28);
  padding: 4px 10px;
}
.terminal__chip-dot {
  position: relative;
  width: 7px;
  height: 7px;
  border-radius: 50%; /* status-dot exception */
  background: var(--live-dark, #39c27f);
}
.terminal__chip-dot::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 50%; /* exception: status-dot ping */
  background: inherit;
  animation: t-ping 2s cubic-bezier(0, 0, 0.2, 1) infinite;
}
@keyframes t-ping {
  0% { transform: scale(1); opacity: 0.75; }
  75%, 100% { transform: scale(2.6); opacity: 0; }
}

/* ---- scenario tabs ---- */
.terminal__tabs {
  display: flex;
  gap: 2px;
  padding: 0 10px;
  background: var(--obsidian-2, #151a22);
  border-bottom: 1px solid var(--line-dark, #242c38);
  overflow-x: auto;
}
.terminal__tab {
  appearance: none;
  background: none;
  border: 0;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  color: var(--muted-dark, #9aa3b2);
  font-family: inherit;
  font-size: 12px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  padding: 14px 14px 12px;
  min-height: 44px;
  cursor: pointer;
  white-space: nowrap;
  transition: color 0.18s ease, border-color 0.18s ease;
}
.terminal__tab:hover { color: var(--bone-0, #f7f4ec); }
.terminal__tab[aria-selected="true"] {
  color: var(--gold, #c9955d);
  border-bottom-color: var(--gold, #c9955d);
}
.terminal__tab:focus-visible {
  outline: 2px solid var(--gold-bright, #e3b57e);
  outline-offset: -2px;
}
/* no-JS: tabs are inert — hide them (static transcript still shows) */
html:not(.js) .terminal__tabs { display: none; }

/* ---- transcript screen ---- */
.terminal__screen {
  height: 430px;
  overflow-y: auto;
  padding: 20px 22px 26px;
  font-size: 13.5px;
  line-height: 1.8;
  /* static scanline hint — terminal surface only, never animated */
  background-image: repeating-linear-gradient(
    0deg,
    rgba(255, 255, 255, 0.02) 0 1px,
    transparent 1px 3px
  );
  scrollbar-width: thin;
  scrollbar-color: var(--line-dark, #242c38) transparent;
  overscroll-behavior: contain;
}
.terminal__screen:focus-visible {
  outline: 2px solid var(--gold-bright, #e3b57e);
  outline-offset: -2px;
}

/* ---- transcript lines ---- */
.t-line {
  display: flex;
  gap: 10px;
  margin: 0 0 6px;
  overflow-wrap: anywhere;
}
.t-g {
  flex: 0 0 1.2ch;
  text-align: center;
  user-select: none;
}
.t-text { min-width: 0; }

.t-line--in { color: var(--bone-0, #f7f4ec); }
.t-line--in .t-g { color: var(--gold-bright, #e3b57e); }

.t-line--tool { color: var(--gold, #c9955d); }
.t-line--tool .t-g { color: var(--gold, #c9955d); opacity: 0.7; }
.t-call { color: var(--gold-bright, #e3b57e); }
.t-arrow { color: var(--muted-dark, #9aa3b2); }
.t-res { color: var(--gold, #c9955d); }

.t-line--sys { color: var(--muted-dark, #9aa3b2); }

.t-line--reply {
  border-left: 2px solid var(--gold, #c9955d);
  background: rgba(201, 149, 93, 0.05);
  padding: 7px 12px 7px 14px;
  margin: 10px 0;
  color: var(--bone-0, #f7f4ec);
}
.t-line--reply .t-g { display: none; }
/* consecutive reply lines (the morning brief) merge into one block */
.t-line--reply + .t-line--reply {
  margin-top: -10px;
  padding-top: 0;
}

.t-line--op { color: var(--live-dark, #39c27f); margin-top: 4px; }
.t-line--op .t-g { color: var(--live-dark, #39c27f); }

.t-line--ok { color: var(--live-dark, #39c27f); }

/* ---- blinking block cursor ---- */
.t-cursor {
  display: inline-block;
  width: 0.58em;
  height: 1.05em;
  margin-left: 3px;
  background: var(--gold-bright, #e3b57e);
  vertical-align: -0.15em;
  animation: t-blink 1s steps(2, start) infinite;
}
@keyframes t-blink {
  to { visibility: hidden; }
}

/* ---- foot / status bar ---- */
.terminal__foot {
  margin: 0;
  padding: 9px 16px;
  border-top: 1px solid var(--line-dark-soft, #1c232e);
  font-size: 11px;
  letter-spacing: 0.06em;
  color: var(--muted-dark, #9aa3b2);
}

/* ---- reduced motion: static cursor, no ping (JS renders the finished
        transcript instantly — this covers the pure-CSS animations) ---- */
@media (prefers-reduced-motion: reduce) {
  .t-cursor { animation: none; }
  .terminal__chip-dot::after { animation: none; content: none; }
  .terminal__tab { transition: none; }
}

/* ---- small screens ---- */
@media (max-width: 720px) {
  .terminal__screen {
    height: 370px;
    padding: 16px 14px 22px;
    font-size: 12.5px;
  }
  .terminal__chrome { gap: 10px; padding: 10px 12px; }
  .terminal__chip { letter-spacing: 0.1em; }
  .terminal__tab { padding: 13px 11px 11px; min-height: 44px; letter-spacing: 0.09em; }
}

/* ============================================================================
   SOURCE 11: partials/css/tools.css
   ============================================================================ */
/* ============================================================
   Ridgeway AI — tools.css
   Scoped styles for the two free tools:
     partials/fragments/fitcheck.html   (+ assets/js/fitcheck.js)
     partials/fragments/calculator.html (+ assets/js/calculator.js)

   Every selector is namespaced under .tool- ; safe to load sitewide.
   Design tokens come from the site root stylesheet (DESIGN-DIRECTION §2);
   every var() carries the contract fallback so the fragments render
   correctly standalone (e.g. tools/preview-tools.html).

   Contract compliance:
   - border-radius 0 everywhere (sole exception: status-dot circles).
   - 1px rules, no drop shadows on light surfaces.
   - IBM Plex Sans / IBM Plex Mono only.
   - Terminal-chrome frame (three dots + title + chip), mono labels,
     bronze accents on light, gold on dark.
   - prefers-reduced-motion: meter/hover transitions disabled.
   - no-JS: compute UI hidden until html.js; .tool-nojs note shown instead.
   ============================================================ */

/* ---------- shell ---------- */

.tool-embed {
  max-width: 880px;
  margin: 0 auto;
  font-family: var(--sans, 'IBM Plex Sans', system-ui, sans-serif);
  color: var(--ink, #101216);
}

.tool-panel {
  background: var(--paper, #fffdf8);
  border: 1px solid var(--line-light, #d6ccbb);
  border-radius: 0;
}

/* ---------- terminal chrome ---------- */

.tool-chrome {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 10px 16px;
  background: var(--obsidian-1, #10141a);
  border-bottom: 1px solid var(--line-dark, #242c38);
}

.tool-dots {
  display: inline-flex;
  gap: 6px;
  flex: none;
}

.tool-dots i {
  width: 8px;
  height: 8px;
  border-radius: 50%; /* status-dot circle — allowed radius exception */
  background: var(--line-dark, #242c38);
}

.tool-chrome-title {
  font-family: var(--mono, 'IBM Plex Mono', ui-monospace, monospace);
  font-size: 12px;
  letter-spacing: .06em;
  color: var(--muted-dark, #9aa3b2);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.tool-chip {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 4px 10px;
  border: 1px solid var(--line-dark, #242c38);
  font-family: var(--mono, 'IBM Plex Mono', ui-monospace, monospace);
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--muted-dark, #9aa3b2);
  white-space: nowrap;
}

.tool-chip-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%; /* status-dot circle — allowed radius exception */
  background: var(--live-dark, #39c27f);
  flex: none;
}

/* ---------- head ---------- */

.tool-body {
  padding: 34px;
}

.tool-eyebrow {
  margin: 0;
  font-family: var(--mono, 'IBM Plex Mono', ui-monospace, monospace);
  font-size: 12px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--gold-text-light, #85572e);
}

.tool-title {
  margin: 10px 0 0;
  font-size: clamp(24px, 2.6vw, 30px);
  font-weight: 500;
  line-height: 1.15;
  letter-spacing: -.01em;
}

.tool-lede {
  margin: 12px 0 0;
  max-width: 62ch;
  font-size: 17px;
  line-height: 1.65;
  color: var(--ink-soft, #3a404c);
}

/* ---------- fit-check questions ---------- */

.tool-form {
  margin-top: 26px;
}

.tool-q {
  min-width: 0;
  margin: 0 0 14px;
  padding: 20px 22px 22px;
  border: 1px solid var(--line-light, #d6ccbb);
  background: var(--bone-0, #f7f4ec);
}

.tool-q-legend {
  float: left; /* keep the legend inside the box, off the border line */
  width: 100%;
  margin: 0 0 14px;
  padding: 0;
  font-size: 17px;
  font-weight: 500;
  line-height: 1.4;
  color: var(--ink, #101216);
}

.tool-q-num {
  display: block;
  margin: 0 0 8px;
  font-family: var(--mono, 'IBM Plex Mono', ui-monospace, monospace);
  font-size: 12px;
  font-weight: 400;
  letter-spacing: .14em;
  color: var(--gold-text-light, #85572e);
}

.tool-opts {
  clear: both;
  display: grid;
  gap: 8px;
}

.tool-opt {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 12px 14px;
  border: 1px solid var(--line-light, #d6ccbb);
  background: var(--paper, #fffdf8);
  cursor: pointer;
  font-size: 15.5px;
  line-height: 1.5;
  color: var(--ink-soft, #3a404c);
}

.tool-opt:hover {
  border-color: var(--bronze, #8F5E32);
}

.tool-opt input {
  flex: none;
  width: 15px;
  height: 15px;
  margin: 3px 0 0;
  accent-color: var(--bronze, #8F5E32);
}

.tool-opt input:focus-visible {
  outline: 2px solid var(--bronze, #8F5E32);
  outline-offset: 2px;
}

.tool-opt:has(input:checked) {
  border-color: var(--bronze, #8F5E32);
  background: #fff;
  color: var(--ink, #101216);
}

/* ---------- calculator fields ---------- */

.tool-fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px 22px;
}

.tool-field label {
  display: block;
  margin: 0 0 8px;
  font-family: var(--mono, 'IBM Plex Mono', ui-monospace, monospace);
  font-size: 13px;
  line-height: 1.55;
  color: var(--ink-soft, #3a404c);
}

.tool-field input,
.tool-field select {
  width: 100%;
  padding: 12px 14px;
  border: 1px solid var(--line-light, #d6ccbb);
  border-radius: 0;
  background: #fff;
  font-family: var(--mono, 'IBM Plex Mono', ui-monospace, monospace);
  font-size: 16px;
  color: var(--ink, #101216);
}

.tool-field input:focus-visible,
.tool-field select:focus-visible {
  border-color: var(--bronze, #8F5E32);
  outline: 2px solid var(--bronze, #8F5E32);
  outline-offset: 1px;
}

/* ---------- actions / buttons ---------- */

.tool-actions {
  display: flex;
  align-items: center;
  gap: 18px;
  flex-wrap: wrap;
  margin-top: 24px;
}

.tool-btn {
  display: inline-block;
  padding: 14px 24px;
  border: 1px solid var(--bronze, #8F5E32);
  border-radius: 0;
  background: var(--bronze, #8F5E32);
  color: var(--bone-0, #f7f4ec);
  font-family: var(--sans, 'IBM Plex Sans', system-ui, sans-serif);
  font-size: 15px;
  font-weight: 500;
  letter-spacing: .01em;
  line-height: 1.2;
  text-decoration: none;
  cursor: pointer;
  transition: background-color .18s ease, border-color .18s ease, color .18s ease;
}

.tool-btn:hover {
  background: var(--bronze-hover, #734823);
  border-color: var(--bronze-hover, #734823);
}

.tool-btn:focus-visible {
  outline: 2px solid var(--bronze-hover, #734823);
  outline-offset: 2px;
}

/* ghost variant — used on the dark result panel */
.tool-btn-ghost {
  background: transparent;
  border-color: #3a4450;
  color: var(--bone-0, #f7f4ec);
}

.tool-btn-ghost:hover {
  background: transparent;
  border-color: var(--gold, #c9955d);
  color: var(--gold-bright, #e3b57e);
}

.tool-btn-ghost:focus-visible {
  outline-color: var(--gold, #c9955d);
}

.tool-validate {
  margin: 0;
  font-family: var(--mono, 'IBM Plex Mono', ui-monospace, monospace);
  font-size: 13px;
  line-height: 1.5;
  color: var(--warn, #b42318);
}

/* ---------- no-JS gate ---------- */
/* Without JS the compute button can't do anything: hide it, show the note.
   Each tool module adds html.js on load, flipping this. */

html:not(.js) .tool-actions {
  display: none;
}

.tool-nojs {
  margin: 24px 0 0;
  padding: 14px 16px;
  border: 1px dashed var(--line-light, #d6ccbb);
  font-family: var(--mono, 'IBM Plex Mono', ui-monospace, monospace);
  font-size: 13px;
  line-height: 1.6;
  color: var(--ink-soft, #3a404c);
}

html.js .tool-nojs {
  display: none;
}

/* ---------- result panel (dark) ---------- */

.tool-result {
  margin-top: 30px;
  padding: 34px;
  background: var(--obsidian-1, #10141a);
  border: 1px solid var(--line-dark, #242c38);
  color: var(--bone-0, #f7f4ec);
}

.tool-result[hidden] {
  display: none;
}

.tool-result-eyebrow {
  margin: 0;
  font-family: var(--mono, 'IBM Plex Mono', ui-monospace, monospace);
  font-size: 12px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--gold, #c9955d);
}

.tool-gauge {
  display: flex;
  align-items: baseline;
  gap: 16px;
  flex-wrap: wrap;
  margin-top: 16px;
}

.tool-score {
  font-family: var(--mono, 'IBM Plex Mono', ui-monospace, monospace);
  font-weight: 500;
  font-size: clamp(40px, 6vw, 60px);
  line-height: 1;
  color: var(--gold-bright, #e3b57e);
  font-variant-numeric: tabular-nums;
}

.tool-tier {
  padding: 6px 12px;
  border: 1px solid var(--line-dark, #242c38);
  font-family: var(--mono, 'IBM Plex Mono', ui-monospace, monospace);
  font-size: 13px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--muted-dark, #9aa3b2);
}

.tool-meter {
  height: 6px;
  margin-top: 22px;
  border: 1px solid var(--line-dark, #242c38);
  background: var(--obsidian-3, #1b222c);
  overflow: hidden;
}

.tool-meter span {
  display: block;
  height: 100%;
  width: 0;
  background: linear-gradient(90deg, var(--bronze, #8F5E32), var(--gold-bright, #e3b57e));
  transition: width .8s cubic-bezier(.2, .7, .3, 1);
}

.tool-top {
  margin: 22px 0 0;
  font-size: 16px;
  line-height: 1.6;
  color: var(--muted-dark, #9aa3b2);
}

.tool-top strong {
  font-weight: 500;
  color: var(--bone-0, #f7f4ec);
}

.tool-rec {
  margin: 12px 0 0;
  max-width: 64ch;
  font-size: 16.5px;
  line-height: 1.65;
  color: var(--bone-1, #efe9dc);
}

.tool-note {
  margin: 14px 0 0;
  max-width: 70ch;
  font-family: var(--mono, 'IBM Plex Mono', ui-monospace, monospace);
  font-size: 12.5px;
  line-height: 1.65;
  color: var(--muted-dark, #9aa3b2);
}

.tool-cta-row {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  margin-top: 26px;
}

.tool-footnote {
  margin: 18px 0 0;
  font-family: var(--mono, 'IBM Plex Mono', ui-monospace, monospace);
  font-size: 12.5px;
  letter-spacing: .02em;
  color: var(--muted-dark, #9aa3b2);
}

/* screen-reader-only status line (final values, announced once) */
.tool-sr {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

/* ---------- responsive ---------- */

@media (max-width: 720px) {
  .tool-fields {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .tool-body {
    padding: 22px 16px;
  }
  .tool-result {
    padding: 24px 18px;
  }
  .tool-chrome {
    padding: 9px 12px;
    gap: 10px;
  }
  .tool-q {
    padding: 16px 14px 18px;
  }
  .tool-btn {
    width: 100%;
    text-align: center;
  }
}

/* ---------- reduced motion ---------- */

@media (prefers-reduced-motion: reduce) {
  .tool-meter span,
  .tool-btn {
    transition: none;
  }
}

/* ============================================================================
   SOURCE 12: partials/page-specific.css
   ============================================================================ */
/* ==========================================================================
   Ridgeway AI — page-specific.css
   Preserved page-cluster rules authored directly during the parallel v3 build.
   tools/build-components.py appends this file after the eleven alphabetically
   ordered component partials. Keep reusable components in partials/css/.
   ========================================================================== */

/* == industries pages + KC hub (B4) ======================================== */
/* Interior dark hero band (contract §6 interior pattern). Namespaced .ind- to
   avoid collisions with other build agents' one-offs. */
.ind-hero{padding:92px 0 84px}
@media(max-width:719px){.ind-hero{padding:60px 0 56px}}
.ind-hero h1{font-size:clamp(40px,5.6vw,76px);max-width:1020px;margin-top:22px}
.ind-hero .lede{margin-top:22px}
.ind-hero .cta-row{margin-top:36px}
.ind-hero .check-row{margin-top:28px}
.ind-hero .chip-row{margin-top:32px}
/* mono breadcrumb row inside dark heroes */
.crumbs{display:flex;flex-wrap:wrap;gap:9px;align-items:baseline;margin-bottom:26px;font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--tx-muted)}
.crumbs a{color:var(--tx-muted);border-bottom:1px solid transparent;transition:color .15s}
.crumbs a:hover{color:var(--tx);border-bottom-color:currentColor}
.crumbs .sep{color:var(--accent-text)}
/* table footnote under .table-scroll workflow maps */
.map-foot{margin-top:14px;font-family:var(--mono);font-size:12px;letter-spacing:.06em;color:var(--tx-muted)}
/* related-reading kicker rows reuse .card; give link cards equal arrows */
.rel-arrow{display:inline-block;margin-top:16px;font-family:var(--mono);font-size:13px;color:var(--accent-text)}

/* == index page one-offs (homepage) == source: authored with index.html == */

/* -- hero (§3.1: backdrop behind, engine graph in front, headline above) -- */
.hero{position:relative;overflow:hidden;padding:clamp(56px,8vh,96px) 0 clamp(56px,7vh,88px)}
@media(min-width:900px){.hero{min-height:92vh;display:flex;align-items:center}}
.hero>.wrap{position:relative;z-index:2;width:100%}
.hero-copy{position:relative;isolation:isolate;max-width:900px;margin-bottom:clamp(38px,6vh,60px)}
/* A diffuse ink bloom follows the copy instead of boxing it in. It keeps the
   mountain and halftone visible while protecting every line from local image
   highlights, including the desktop pointer reveal. */
.hero-copy::before{
  content:"";position:absolute;z-index:0;pointer-events:none;
  inset:-30px -110px -36px -44px;
  background:radial-gradient(ellipse at 27% 40%,rgba(11,13,16,.56) 0%,rgba(11,13,16,.42) 48%,rgba(11,13,16,.16) 68%,rgba(11,13,16,0) 84%);
  filter:blur(14px)
}
.hero-copy>*{position:relative;z-index:1}
.hero-copy h1{
  margin-top:22px;max-width:16ch;color:var(--bone-0);
  text-shadow:0 1px 2px rgba(0,0,0,.96),0 6px 24px rgba(0,0,0,.68)
}
.hero-copy .grad-gold{
  background-image:none;-webkit-background-clip:border-box;background-clip:border-box;
  color:var(--gold-bright);-webkit-text-fill-color:var(--gold-bright);
  text-shadow:0 0 24px rgba(227,181,126,.26)
}
.hero-copy .eyebrow{
  font-size:clamp(13px,.9vw,14px);font-weight:600;color:var(--gold-bright);
  text-shadow:0 1px 2px rgba(0,0,0,.96),0 4px 16px rgba(0,0,0,.74)
}
.hero-copy .lede{
  margin-top:20px;max-width:56ch;font-size:clamp(19px,1.7vw,22px);font-weight:400;color:var(--bone-1);
  text-shadow:0 1px 2px rgba(0,0,0,.96),0 4px 18px rgba(0,0,0,.72)
}
.hero-copy .cta-row{margin-top:32px}
.hero-copy .btn{font-size:17px;font-weight:600;box-shadow:0 8px 28px rgba(0,0,0,.28)}
.hero-copy .btn-ghost{background:rgba(11,13,16,.62);border-color:rgba(247,244,236,.52)}
.hero-copy .btn-ghost:hover{background:rgba(11,13,16,.76)}
.hero-copy .check-row{margin-top:26px;gap:12px 28px}
.hero-copy .check{
  font-size:clamp(13.5px,.95vw,14.5px);font-weight:500;line-height:1.5;letter-spacing:.02em;color:var(--bone-1);
  text-shadow:0 1px 2px rgba(0,0,0,.96),0 4px 16px rgba(0,0,0,.74)
}
.hero-copy .check::before{color:var(--gold-bright);font-size:1.05em}
@media(max-width:719px){
  .hero-copy::before{inset:-20px -28px -28px;background:radial-gradient(ellipse at 40% 38%,rgba(11,13,16,.6) 0%,rgba(11,13,16,.42) 56%,rgba(11,13,16,0) 88%);filter:blur(10px)}
  .hero-copy .eyebrow{gap:10px;font-size:12.75px;letter-spacing:.1em}
  .hero-copy .eyebrow::before,.hero-copy .eyebrow::after{width:18px}
  .hero-copy .cta-row{gap:12px}
  .hero-copy .btn{width:100%;white-space:normal;text-align:center}
  .hero-copy .check-row{gap:10px}
  .hero-copy .check{width:100%;font-size:14px}
}
@media(max-width:359px){
  .hero-copy .eyebrow::before,.hero-copy .eyebrow::after{display:none}
}
/* headline entrance — gated on html.js so no-JS never hides the pitch */
html.js .hero-copy>*{opacity:0;transform:translateY(18px);animation:hero-rise .7s var(--ease) forwards;animation-delay:var(--hd,0s)}
@keyframes hero-rise{to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){html.js .hero-copy>*{opacity:1;transform:none;animation:none}}

/* -- plain-language gateways: channels on one side, breadth of offer on the other -- */
.gateway-section{padding-top:clamp(64px,7vw,88px);padding-bottom:clamp(64px,7vw,88px)}
.gateway-grid{display:grid;gap:clamp(28px,5vw,72px);align-items:start}
.gateway-grid h2{margin-top:18px;max-width:14ch}
.gateway-grid .lede{margin-top:18px;max-width:62ch}
.gateway-channels{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin-top:26px;padding:0}
.gateway-channels li{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--rule);background:var(--paper);padding:8px 12px;font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--tx-soft)}
.gateway-channels img{display:block;width:22px;height:22px;object-fit:contain;flex:0 0 22px}
.gateway-scope{border-left:3px solid var(--bronze);background:var(--paper);padding:clamp(24px,4vw,38px)}
.gateway-scope h3{margin-top:12px;font-size:clamp(24px,3vw,32px);max-width:18ch}
.gateway-scope p:last-child{margin-top:16px;color:var(--tx-muted)}
@media(min-width:900px){.gateway-grid{grid-template-columns:minmax(0,1.08fr) minmax(340px,.92fr)}}

/* -- 01 what we do: audit banner card -- */
.audit-banner{margin-top:22px;display:grid;gap:18px;align-items:center}
@media(min-width:900px){.audit-banner{grid-template-columns:1fr auto}}
.audit-banner h3{margin-top:10px}

/* -- 02 watch it work: operator console width -- */
.terminal-wrap{max-width:980px;margin-inline:auto}

/* -- 03 how it works: static loop teaser (full diagram lives on /how-it-works) -- */
.loop-steps{display:grid;gap:1px;background:var(--rule);border:1px solid var(--rule);grid-template-columns:1fr}
@media(min-width:720px){.loop-steps{grid-template-columns:repeat(4,1fr)}}
.loop-step{position:relative;background:var(--card-bg);padding:26px 24px 30px}
.loop-step .n{font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.12em;color:var(--accent-text)}
.loop-step .nm{display:block;margin-top:14px;font-family:var(--mono);font-size:17px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--tx)}
.loop-step p{margin-top:10px;color:var(--tx-muted);font-size:16px}
.loop-step .arr{position:absolute;top:24px;right:18px;color:var(--accent-text);font-family:var(--mono)}
@media(max-width:719px){.loop-step .arr{display:none}}
.loop-foot{margin-top:18px;display:flex;flex-wrap:wrap;gap:12px 28px;justify-content:space-between;align-items:baseline}
.loop-foot .micro{letter-spacing:.08em}

/* -- operating terms: prose replaces marketing counters -- */
.terms-grid{display:grid;gap:1px;background:var(--rule);border:1px solid var(--rule);grid-template-columns:1fr}
.term-card{background:var(--obsidian-1);padding:clamp(22px,3vw,30px)}
.term-card h3{margin-top:12px;font-size:19px}
.term-card p:last-child{margin-top:10px;color:var(--tx-muted);font-size:15.5px}
@media(min-width:680px){.terms-grid{grid-template-columns:1fr 1fr}}
@media(min-width:1080px){.terms-grid{grid-template-columns:repeat(4,1fr)}}

/* -- 05 ways in: shape chips row inside cards -- */
.card .chip-row{margin-top:14px}

/* -- what-we-don't-do teaser (manifesto rows) -- */
.wwdd-grid{display:grid;gap:0 clamp(28px,4vw,64px);grid-template-columns:1fr}
@media(min-width:840px){.wwdd-grid{grid-template-columns:1fr 1fr}}
.wwdd-item{border-top:1px solid var(--rule);padding:24px 0 26px;display:grid;grid-template-columns:56px 1fr;gap:16px;align-items:start}
.wwdd-item .n{font-family:var(--mono);font-size:14px;font-weight:500;letter-spacing:.1em;color:var(--accent-text);padding-top:5px}
.wwdd-item h3{font-size:20px}
.wwdd-item p{margin-top:8px;color:var(--tx-muted);font-size:16px}

/* -- final CTA band: subtle ridgeline contour art -- */
.cta-final{position:relative;overflow:hidden}
.cta-final .ridge-art{position:absolute;left:0;right:0;bottom:-2px;width:100%;height:auto;color:var(--gold);opacity:.14;pointer-events:none}
.cta-final>.wrap{position:relative;z-index:1}
.cta-final .lede{max-width:620px}
.cta-final .cta-row{margin-top:30px}

/* -- shared: section link-out row -- */
.sec-more{margin-top:26px}

/* == company + resources pages (B5: about / contact / faq / glossary / tool wrappers) == */

/* ---- interior dark hero band ---- */
.page-hero{padding:clamp(64px,10vw,120px) 0 clamp(56px,8vw,96px)}
.page-hero h1{font-size:clamp(38px,5.6vw,72px);font-weight:300;line-height:1.04;letter-spacing:-.04em;max-width:21ch;margin-top:22px}
.page-hero .lede{margin-top:22px}
.page-hero .check-row{margin-top:32px}

/* ---- about: pixel monogram figure (no photo — the monogram is the portrait) ---- */
.monogram-fig{margin:0}
.monogram-stage{
  display:grid;justify-items:center;gap:0;
  padding:clamp(30px,5vw,58px) clamp(22px,4vw,44px);
  background-image:radial-gradient(var(--line-dark-soft) 1px,transparent 1px);
  background-size:22px 22px;background-position:center;
}
.monogram-stage svg{width:min(300px,78%);height:auto;color:var(--obsidian-0);--pixel:var(--gold)}
.monogram-cap{
  display:grid;gap:5px;padding:18px clamp(22px,4vw,44px) 24px;
  border-top:1px solid var(--line-dark-soft);
  font-family:var(--mono);font-size:12.5px;letter-spacing:.06em;color:var(--muted-dark);
}
.monogram-cap .name{color:var(--bone-0);letter-spacing:.1em;text-transform:uppercase}

/* ---- numbered operating-rules list (about) ---- */
.rules{list-style:none;counter-reset:rw-rule;max-width:900px}
.rules li{
  counter-increment:rw-rule;border-top:1px solid var(--rule);
  padding:26px 0;display:grid;grid-template-columns:58px 1fr;gap:4px 22px;
}
.rules li:last-child{border-bottom:1px solid var(--rule)}
.rules li::before{
  content:counter(rw-rule,decimal-leading-zero);grid-row:1/span 2;
  font-family:var(--mono);font-size:14px;letter-spacing:.08em;color:var(--accent-text);padding-top:5px;
}
.rules h3{font-size:20px;grid-column:2}
.rules p{grid-column:2;color:var(--tx-muted);font-size:16px;max-width:72ch}

/* ---- what-happens-next steps (contact) ---- */
.step{border:1px solid var(--rule);background:var(--card-bg);padding:24px 26px}
.step+.step{margin-top:14px}
.step-num{font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-text)}
.step h3{margin-top:10px;font-size:19px}
.step p{margin-top:8px;color:var(--tx-muted);font-size:16px}

/* ---- booking frame (contact — the lead form inside terminal chrome) ---- */
.book-layout{display:grid;gap:clamp(28px,4vw,56px);grid-template-columns:minmax(0,1fr);align-items:start}
.book-layout>*{min-width:0}
@media(min-width:1000px){.book-layout{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}}
.book-panel .term-body{padding:clamp(22px,3.5vw,36px)}
.book-form{display:grid;gap:16px}
.book-intro{color:var(--tx-soft);font-size:16px;margin-bottom:18px;max-width:60ch}
.contact-direct{
  display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;
  margin:-4px 0 22px;padding:12px 0;border-block:1px solid var(--line-dark-soft);
  font-family:var(--mono);font-size:12.5px;letter-spacing:.03em;color:var(--muted-dark);
}
.contact-direct a{color:var(--bone-0);text-decoration:underline;text-decoration-color:rgba(200,162,91,.45);text-underline-offset:4px}
.contact-direct a:hover{color:var(--gold)}
.field-optional{font-size:10px;font-weight:400;letter-spacing:.06em;color:var(--muted-dark)}
.booking-picker{margin-bottom:8px;padding:clamp(18px,3vw,26px);border:1px solid var(--line-dark);background:var(--obsidian-2)}
.booking-picker__head{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:12px 20px}
.booking-picker__head h3{margin-top:6px;font-size:clamp(20px,2.3vw,25px);color:var(--bone-0)}
.booking-zone{padding:6px 9px;border:1px solid rgba(200,162,91,.38);font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold)}
.booking-status{margin-top:18px;padding:12px 14px;border-left:2px solid var(--line-dark);background:rgba(255,255,255,.025);font-size:14.5px;color:var(--muted-dark)}
.booking-status.is-ready{border-left-color:var(--gold);color:var(--tx-soft)}
.booking-status.is-error{border-left-color:#e07a6e;color:#f0a49b}
.booking-status.is-empty{border-left-color:var(--muted-dark);color:var(--tx-soft)}
.booking-retry{margin-top:12px}
.booking-dates{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:18px}
.booking-date{
  min-height:64px;padding:10px 8px;border:1px solid var(--line-dark);background:var(--obsidian-1);
  display:grid;gap:3px;place-items:center;color:var(--muted-dark);cursor:pointer;transition:border-color .18s,background-color .18s,color .18s;
}
.booking-date span{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase}
.booking-date strong{font-size:15px;font-weight:500;color:var(--bone-0)}
.booking-date:hover{border-color:rgba(200,162,91,.62)}
.booking-date[aria-pressed="true"]{border-color:var(--gold);background:rgba(200,162,91,.11);color:var(--gold)}
.booking-times{min-width:0;margin-top:22px;padding:0;border:0}
.booking-times legend{width:100%;padding-bottom:10px;border-bottom:1px solid var(--line-dark-soft);font-family:var(--mono);font-size:11.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--bone-0)}
.booking-times legend span{font-weight:400;color:var(--muted-dark)}
.booking-slots{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:12px}
.booking-slot{position:relative;min-width:0;cursor:pointer}
.booking-slot input{position:absolute;inline-size:1px;block-size:1px;opacity:.001}
.booking-slot__body{min-height:52px;padding:10px 12px;border:1px solid var(--line-dark);background:var(--obsidian-1);display:flex;align-items:center;justify-content:space-between;gap:8px;color:var(--bone-0);transition:border-color .18s,background-color .18s}
.booking-slot__time{font-family:var(--mono);font-size:13px;letter-spacing:.03em}
.booking-slot__duration{font-size:11.5px;color:var(--muted-dark)}
.booking-slot:hover .booking-slot__body{border-color:rgba(200,162,91,.62)}
.booking-slot input:focus-visible+.booking-slot__body{outline:2px solid var(--gold);outline-offset:2px}
.booking-slot input:checked+.booking-slot__body{border-color:var(--gold);background:rgba(200,162,91,.13)}
.booking-slot input:checked+.booking-slot__body .booking-slot__duration{color:var(--gold)}
.booking-success{padding:clamp(26px,4vw,40px);border:1px solid rgba(57,194,127,.5);background:rgba(57,194,127,.07)}
.booking-success h3{margin-top:10px;font-size:clamp(27px,3.4vw,38px);color:var(--bone-0)}
.booking-success>p:not(.micro){margin-top:12px;color:var(--tx-soft)}
.booking-success dl{display:grid;gap:0;margin-top:24px;border-top:1px solid var(--line-dark-soft)}
.booking-success dl div{display:grid;grid-template-columns:82px 1fr;gap:12px;padding:13px 0;border-bottom:1px solid var(--line-dark-soft)}
.booking-success dt{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted-dark)}
.booking-success dd{color:var(--bone-0);overflow-wrap:anywhere}
.booking-success .booking-success__help{margin-top:22px;font-size:14px;color:var(--muted-dark)}
.booking-success a,.lead-nojs a{color:var(--gold);text-decoration:underline;text-underline-offset:3px}
@media(max-width:560px){
  .booking-dates{grid-template-columns:repeat(2,minmax(0,1fr))}
  .booking-slots{grid-template-columns:1fr}
}
.lead-nojs{
  margin:4px 0 0;padding:14px 16px;border:1px dashed var(--rule);
  font-family:var(--mono);font-size:13px;line-height:1.6;color:var(--tx-soft);
}
html.js .lead-nojs{display:none}
html:not(.js) .lead-submit{display:none}

/* ---- digital business card (contact: tap-first on mobile, QR on wide screens) ---- */
.contact-card-section{border-top:1px solid var(--line-dark-soft)}
.contact-card-section .contact-card{
  position:relative;overflow:hidden;display:grid;
  border:1px solid var(--line-dark);background:var(--obsidian-0);
}
.contact-card-section .contact-card__body{
  min-width:0;padding:clamp(26px,7vw,54px) clamp(22px,6vw,58px);
  border-left:3px solid var(--gold);
}
.contact-card-section .contact-card__body h2{max-width:13ch;margin-top:16px}
.contact-card-section .contact-card__copy{
  max-width:620px;margin-top:18px;color:var(--tx-soft);font-size:clamp(16px,2vw,18px);
}
.contact-card-section .contact-card__actions{display:grid;gap:10px;margin-top:28px}
.contact-card-section .contact-card__actions .btn{
  width:100%;min-width:0;min-height:58px;justify-content:space-between;
  padding-inline:20px;line-height:1.25;text-align:left;white-space:normal;
}
.contact-card-section .contact-card__action-icon{
  flex:0 0 auto;font-family:var(--mono);font-size:20px;line-height:1;
}
.contact-card-section .contact-card__meta{
  margin-top:22px;padding-top:16px;border-top:1px solid var(--line-dark-soft);
  font-family:var(--mono);font-size:10.5px;letter-spacing:.07em;text-transform:uppercase;color:var(--muted-dark);
}
.contact-card-section .contact-card__qr{display:none}
@media(min-width:600px){
  .contact-card-section .contact-card__actions{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(min-width:840px){
  .contact-card-section .contact-card{grid-template-columns:minmax(0,1fr) minmax(290px,340px)}
  .contact-card-section .contact-card__qr{
    display:grid;align-content:center;gap:18px;padding:clamp(24px,3vw,34px);
    border-left:1px solid var(--line-dark);background:var(--bone-0);color:var(--ink);
  }
  .contact-card-section .contact-card__qr-frame{padding:13px;border:1px solid var(--line-light);background:var(--paper)}
  .contact-card-section .contact-card__qr img{width:100%;height:auto}
  .contact-card-section .contact-card__qr figcaption{display:grid;gap:4px}
  .contact-card-section .contact-card__qr figcaption span{
    font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--bronze);
  }
  .contact-card-section .contact-card__qr figcaption strong{
    font-size:14px;font-weight:500;letter-spacing:-.01em;color:var(--ink);overflow-wrap:anywhere;
  }
}

/* ---- anchor rail nav (faq) + letter nav (glossary) ---- */
.anchor-nav{display:grid;gap:2px;margin-top:20px}
.anchor-nav a{
  display:flex;gap:12px;align-items:baseline;padding:10px 12px;
  border:1px solid transparent;font-size:15px;color:var(--tx-soft);transition:border-color .18s,color .18s;
}
.anchor-nav a:hover{border-color:var(--rule);color:var(--tx)}
.anchor-nav .n{font-family:var(--mono);font-size:11.5px;letter-spacing:.08em;color:var(--accent-text);flex:0 0 auto}
.letter-nav{display:flex;flex-wrap:wrap;gap:6px;margin-top:20px}
.letter-nav a{
  display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;
  border:1px solid var(--rule);font-family:var(--mono);font-size:13px;color:var(--tx-soft);
  transition:border-color .18s,color .18s;
}
.letter-nav a:hover{border-color:var(--accent-text);color:var(--tx)}

/* ---- faq page: section blocks in the accordion column ---- */
.faq-block{margin-top:56px}
.faq-block:first-child{margin-top:0}
.faq-block>.eyebrow{margin-bottom:14px}
.faq-block h2{font-size:clamp(24px,2.6vw,32px);margin-bottom:10px}

/* ---- glossary term rows ---- */
.gloss-group{margin-top:48px}
.gloss-group:first-of-type{margin-top:0}
.gloss-letter{
  display:flex;align-items:center;gap:14px;margin-bottom:6px;
  font-family:var(--mono);font-size:13px;font-weight:600;letter-spacing:.16em;
  text-transform:uppercase;color:var(--accent-text);
}
.gloss-letter::after{content:"";height:1px;flex:1;background:var(--rule)}
.gloss-term{border-top:1px solid var(--rule);padding:20px 0}
.gloss-term:first-of-type{border-top:0}
.gloss-term h3{font-size:19px}
.gloss-term p{margin-top:8px;color:var(--tx-muted);font-size:16px;max-width:76ch}

/* ---- tool pages: section wrapper around the A7 fragments ---- */
.tool-section .tool-embed{margin-top:8px}
.tool-aside{max-width:880px;margin:26px auto 0}
.tool-aside p{color:var(--tx-muted);font-size:16px}

/* ---- calculator math card (visitor-cost math — the ONLY sanctioned $ page) ---- */
.math-card{max-width:880px;margin-inline:auto}
.math-lines{list-style:none;margin-top:18px;border:1px solid var(--rule);background:var(--card-bg)}
.math-lines li{
  display:grid;gap:4px 18px;padding:16px 20px;border-top:1px solid var(--rule);
  font-family:var(--mono);font-size:13.5px;line-height:1.6;color:var(--tx-soft);
}
.math-lines li:first-child{border-top:0}
.math-lines .lbl{font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--tx-muted)}
@media(min-width:760px){
  .math-lines li{grid-template-columns:220px 1fr}
  .math-lines .lbl{padding-top:2px}
}

@media(prefers-reduced-motion:reduce){
  .anchor-nav a,.letter-nav a{transition:none}
}

/* == services pages (B2 — audit/consulting/contracting/how-it-works/what-we-dont-do/security) == */

/* ---- dark hero band (interior pages: dark hero -> bone body -> dark CTA) ---- */
.hero-band{position:relative;isolation:isolate;overflow:hidden}
.hero-band::before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background-image:radial-gradient(color-mix(in srgb,var(--line-dark) 66%,transparent) 1px,transparent 1px);
  background-size:26px 26px;
  -webkit-mask-image:radial-gradient(95% 130% at 50% -12%,#000 28%,transparent 80%);
  mask-image:radial-gradient(95% 130% at 50% -12%,#000 28%,transparent 80%);
}
.hero-band .eyebrow{margin-bottom:24px}
.hero-band h1{max-width:1080px}
.hero-band .lede{margin-top:24px}
.hero-band .cta-row{margin-top:38px}
.hero-band .check-row{margin-top:30px}
.hero-band .hero-embed{margin-top:clamp(40px,6vw,64px)}

/* ---- dark pre-footer CTA band (faint concentric ridgeline contours) ---- */
.cta-band{position:relative;isolation:isolate;overflow:hidden}
.cta-band::before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.5;
  background-image:repeating-radial-gradient(
    130% 100% at 88% 130%,
    transparent 0 46px,
    color-mix(in srgb,var(--gold) 13%,transparent) 46px 47px
  );
  -webkit-mask-image:linear-gradient(115deg,transparent 34%,#000 78%);
  mask-image:linear-gradient(115deg,transparent 34%,#000 78%);
}
.cta-band h2{max-width:860px;margin-top:20px}
.cta-band .lede{margin-top:18px}
.cta-band .cta-row{margin-top:36px}

/* ---- manifesto (what-we-dont-do) ---- */
.mx-list{border-bottom:1px solid var(--rule)}
.mx-item{display:grid;gap:8px 40px;padding:42px 0;border-top:1px solid var(--rule);grid-template-columns:1fr}
@media(min-width:760px){.mx-item{grid-template-columns:150px minmax(0,1fr);padding:54px 0;gap:0 48px}}
.mx-rail{display:flex;flex-direction:column;gap:10px}
.mx-no{font-family:var(--mono);font-size:11.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--accent-text)}
.mx-num{font-family:var(--mono);font-weight:400;font-size:clamp(44px,6vw,68px);line-height:.95;letter-spacing:-.02em;color:var(--ghost)}
.mx-item h3{max-width:640px}
.mx-body{margin-top:14px;color:var(--tx-soft);max-width:720px}
.mx-body p+p{margin-top:12px}

/* ---- phase panels with duration chips (how-it-works) ---- */
.phase-grid{display:grid;gap:18px;grid-template-columns:1fr}
@media(min-width:900px){.phase-grid{grid-template-columns:1fr 1fr;gap:22px}}
.phase{background:var(--card-bg);border:1px solid var(--rule);padding:clamp(22px,3vw,32px)}
.phase-top{display:flex;flex-wrap:wrap;gap:12px 14px;align-items:center;justify-content:space-between}
.phase-step{font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-text)}
.phase h3{margin-top:16px}
.phase p{margin-top:10px;color:var(--tx-muted)}

/* ---- yes/no lists (who it's for / not for; security posture) ---- */
.tick-list,.cross-list{list-style:none;margin:18px 0 0;padding:0}
.tick-list li,.cross-list li{position:relative;padding:11px 0 11px 30px;border-top:1px solid var(--rule);color:var(--tx-soft);font-size:16px}
.tick-list li::before{content:"✓";position:absolute;left:2px;top:11px;font-family:var(--mono);font-weight:600;color:var(--accent-text)}
.cross-list li::before{content:"—";position:absolute;left:0;top:11px;font-family:var(--mono);font-weight:600;color:var(--tx-muted)}

/* ---- small shared helpers (B2 pages) ---- */
.note-mono{font-family:var(--mono);font-size:12.5px;letter-spacing:.05em;color:var(--tx-muted)}
.maxw-760{max-width:760px}
.mt-16{margin-top:16px}.mt-28{margin-top:28px}.mt-44{margin-top:44px}

/* == pricing + use-cases cluster (B3: pricing / use-cases hub / 5 dept pages) == */
/* Reuses B2's .hero-band/.cta-band, B4's .crumbs/.rel-arrow. New classes are
   namespaced .uc-/.pat-/.ba-/.path- to avoid cross-agent collisions. */

/* interior dark hero rhythm for this cluster (mirrors .ind-hero) */
.uc-hero{padding:92px 0 84px}
@media(max-width:719px){.uc-hero{padding:60px 0 56px}}
.uc-hero h1{font-size:clamp(40px,5.6vw,76px);max-width:1020px;margin-top:22px}
.uc-hero .lede{margin-top:22px}
.uc-hero .cta-row{margin-top:36px}
.uc-hero .check-row{margin-top:28px}
.uc-hero .chip-row{margin-top:32px}

/* hub department cards: kicker row carries a pattern count */
.uc-kick{display:flex;justify-content:space-between;gap:12px;align-items:baseline}
.uc-count{font-family:var(--mono);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--tx-muted)}

/* workflow pattern cards: trigger -> what the system does -> what you approve */
.pat-num{font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:.14em;color:var(--gold-text-light)}
.dark .pat-num{color:var(--gold)}
.pattern-card h3{margin-top:12px;font-size:21px}
.pat-flow{margin:18px 0 0}
.pat-flow>div{border-top:1px solid var(--rule);padding:12px 0;display:grid;gap:4px}
.pat-flow dt{font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-text-light)}
.dark .pat-flow dt{color:var(--gold)}
.pat-flow dd{margin:0;color:var(--tx-muted);font-size:16px;line-height:1.6}

/* before/after bars — ALWAYS paired with the `illustrative` chip label */
.ba-grid{display:grid;gap:18px;grid-template-columns:1fr;margin-top:34px}
@media(min-width:900px){.ba-grid{grid-template-columns:repeat(3,1fr)}}
.ba{border:1px solid var(--rule);background:var(--card-bg);padding:clamp(20px,3vw,28px)}
.ba-task{font-weight:500;font-size:17px;letter-spacing:-.01em;color:var(--tx)}
.ba-row{display:grid;grid-template-columns:58px 1fr;gap:6px 14px;align-items:center;margin-top:18px}
.ba-tag{font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--tx-muted)}
.ba-bar{height:13px;background:var(--bone-1);border:1px solid var(--rule);overflow:hidden}
.dark .ba-bar{background:var(--obsidian-2)}
.ba-fill{display:block;height:100%;width:var(--ba,100%)}
.ba-fill--before{background:var(--ink-soft)}
.ba-fill--after{background:linear-gradient(90deg,var(--bronze),var(--gold))}
.ba-val{grid-column:2;font-family:var(--mono);font-size:12px;letter-spacing:.02em;color:var(--tx-muted)}
/* bar sweep rides reveal.js's .in class; gated on html.js so no-JS shows full bars */
html.js .ba .ba-fill{transform:scaleX(0);transform-origin:left center;transition:transform 1s var(--ease) .15s}
html.js .ba.in .ba-fill{transform:scaleX(1)}

/* pricing: 4-step start path */
.path{display:grid;gap:18px;grid-template-columns:1fr;counter-reset:none}
@media(min-width:900px){.path{grid-template-columns:repeat(4,1fr)}}
.path-step{position:relative;border:1px solid var(--rule);background:var(--card-bg);padding:24px}
.path-num{font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:.14em;color:var(--gold-text-light)}
.path-step h3{font-size:19px;margin-top:10px}
.path-step p{margin-top:8px;color:var(--tx-muted);font-size:16px}
.path-step .chip{margin-top:16px}
@media(min-width:900px){
  .path-step::after{content:"\2192";position:absolute;right:-16px;top:24px;color:var(--gold-text-light);font-size:17px;z-index:1}
  .path-step:last-child::after{display:none}
}

/* cluster helpers */
.card .chip-row{margin-top:14px}
.sec-foot{margin-top:26px;font-family:var(--mono);font-size:12.5px;letter-spacing:.05em;color:var(--tx-muted);max-width:760px}

@media(prefers-reduced-motion:reduce){
  html.js .ba .ba-fill{transform:none;transition:none}
}
/* Cookie choices — analytics and attribution never load before consent. */
.privacy-notice {
  position: fixed;
  z-index: 1200;
  right: clamp(14px, 3vw, 30px);
  bottom: clamp(14px, 3vw, 30px);
  left: auto;
  display: block;
  width: min(860px, calc(100vw - 28px));
  padding: 20px;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 2px;
  background: rgba(11, 13, 16, .96);
  color: #f4f0e8;
  box-shadow: 0 24px 70px rgba(0, 0, 0, .34);
  backdrop-filter: blur(18px);
}
.privacy-notice[hidden] { display: none; }
.privacy-notice__summary { display: grid; grid-template-columns: minmax(0, 1fr) 410px; align-items: center; gap: 24px; }
.privacy-notice__summary[hidden], .privacy-notice__preferences[hidden] { display: none; }
.privacy-notice__copy { font-size: 13.5px; line-height: 1.5; }
.privacy-notice strong { display: block; margin-bottom: 2px; color: #fff; }
.privacy-notice a { margin-left: 6px; color: #e1b56f; text-decoration: underline; text-underline-offset: 3px; }
.privacy-notice__actions { display: grid; grid-template-columns: 1.25fr 1fr; gap: 8px; }
.privacy-notice__actions [data-cookie-necessary] { grid-column: 1 / -1; }
.privacy-notice .btn-cookie-allow, .privacy-notice .btn-cookie-secondary { width: 100%; padding-inline: 12px; }
.privacy-notice .btn-cookie-allow { background: var(--bronze); border-color: var(--bronze); color: #fff; font-weight: 600; }
.privacy-notice .btn-cookie-allow:hover { background: var(--bronze-hover); border-color: var(--bronze-hover); }
.privacy-notice .btn-cookie-secondary { background: transparent; border-color: rgba(255,255,255,.28); color: #f4f0e8; }
.privacy-notice .btn-cookie-secondary:hover { border-color: #e1b56f; color: #fff; }
.privacy-notice__preferences { display: grid; gap: 12px; }
.privacy-notice__preference-head > span, .privacy-notice__preference-row div > span { display: block; color: rgba(244,240,232,.72); font-size: 12.5px; line-height: 1.45; }
.privacy-notice__preference-row { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 12px 0; border-top: 1px solid rgba(255,255,255,.12); color: #fff; }
.privacy-notice__preference-row b { display: block; margin-bottom: 2px; font-size: 13.5px; }
.privacy-notice__always { flex: 0 0 auto; font-family: var(--mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: #e1b56f; }
.privacy-notice__preference-row input { width: 22px; height: 22px; flex: 0 0 auto; accent-color: var(--bronze); }
.privacy-notice__preference-row input:focus-visible { outline: 2px solid #e1b56f; outline-offset: 3px; }
.privacy-notice__preference-actions { display: grid; grid-template-columns: 1fr auto; gap: 8px; }
@media (max-width: 760px) {
  .privacy-notice__summary { grid-template-columns: 1fr; gap: 14px; }
}
@media (max-width: 440px) {
  .privacy-notice__actions { grid-template-columns: 1fr; }
  .privacy-notice__actions [data-cookie-necessary] { grid-column: auto; }
  .privacy-notice__preference-actions { grid-template-columns: 1fr; }
}