/* Bold v1 additions: three levels, lane demo, truth boundary.
   Uses Bold tokens (--paper, --ink, --orange, --muted, --line, --display, --body)
   and the guide's warm panels (#F1E9DD, #FFFAF2). Status is always in words. */

/* ---------- Three levels ---------- */
.levels .level-grid { grid-template-columns: repeat(3, 1fr); }
.level-card { position: relative; padding: 28px 25px 32px; border-right: 1px solid var(--line); display: flex; flex-direction: column; color: var(--ink); }
.level-card:last-child { border-right: 0; }
.level-card .text-link { margin-top: auto; padding-top: 22px; align-self: flex-start; }
.level-status { display: inline-flex; align-items: center; gap: 8px; margin: 22px 0 0 !important; font: 500 13px/1.3 var(--body) !important; }
.level-status::before { content: ""; width: 9px; height: 9px; border-radius: 50%; flex: none; }
.level-status-live::before { background: var(--ink); }
.level-status-depends::before { background: transparent; border: 2px solid #963714; }
.level-status-depends { color: #7a2e10; }

/* ---------- Lane demo ---------- */
.lane-section { padding: 100px 0 90px; background: var(--paper); }
.lane-demo { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); background: #fffaf2; border: 1px solid #bfa88e; border-radius: 5px; overflow: hidden; }
.lane-jobs { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 12px; padding: 22px; border-bottom: 1px solid var(--line); }
.lane-jobs button { min-height: 48px; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 2px; padding: 9px 20px; border: 1px solid #bca68e; border-radius: 30px; background: transparent; color: var(--ink); font: 500 15px/1.25 var(--body); cursor: pointer; text-align: left; }
.lane-jobs button > span { font: 500 11px/1.3 var(--body); letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.lane-jobs button[aria-pressed="true"] { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.lane-jobs button[aria-pressed="true"] > span { color: #dccbb6; }
.lane-jobs button:hover:not([aria-pressed="true"]) { background: #f1e9dd; }

.lane-call { padding: 30px; border-right: 1px solid var(--line); min-width: 0; display: flex; flex-direction: column; gap: 22px; }
.lane-call-top { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px; align-items: baseline; }
.lane-status { font: 400 14px/1.5 var(--body); color: var(--muted); }
.lane-transcript { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 14px; min-height: 120px; }
.turn { display: grid; gap: 4px; padding: 14px 18px; border-radius: 4px; background: #f1e9dd; max-width: 92%; }
.turn-agent { background: #fff; border-left: 3px solid var(--orange); justify-self: end; margin-left: auto; }
.turn-who { font: 500 11px/1.3 var(--body); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.turn-text { font: 400 17px/1.55 var(--body); }
.turn[hidden] { display: none; }
.turn.is-new { animation: lane-arrive .22s ease-out; }

.lane-controls { display: flex; flex-wrap: wrap; gap: 10px; }
.lane-controls button { min-height: 44px; display: inline-flex; align-items: center; gap: 8px; padding: 10px 18px; border-radius: 30px; border: 1px solid #bca68e; background: transparent; color: var(--ink); font: 500 15px/1 var(--body); cursor: pointer; }
.lane-controls button .icon { width: 20px; height: 20px; }
.lane-controls .lane-play { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.lane-controls button:disabled { color: var(--muted); border-style: dashed; background: transparent; cursor: default; }
.lane-controls .lane-play:disabled { background: #4a453d; border-color: #4a453d; color: var(--paper); }

.lane-audio { margin: 0; padding: 16px 18px; border: 1px dashed #bca68e; border-radius: 4px; display: grid; gap: 8px; }
.lane-audio figcaption { display: grid; gap: 4px; font: 400 14px/1.5 var(--body); color: var(--muted); }
.lane-audio figcaption .mini-label { color: var(--ink); }
.lane-audio audio { width: 100%; }
.lane-audio-empty { margin: 0; font: 500 14px/1.4 var(--body); color: #7a2e10; }

.lane-board { margin: 0; padding: 18px 30px 26px; display: grid; align-content: start; min-width: 0; }
.lane { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 14px; padding: 13px 0; border-bottom: 1px solid #e3d6c5; transition: background .22s ease; }
.lane:last-child { border-bottom: 0; }
.lane dt { font: 500 11px/1.9 var(--body); letter-spacing: .09em; text-transform: uppercase; color: var(--muted); }
.lane dd { margin: 0; font: 400 15px/1.55 var(--body); min-width: 0; overflow-wrap: anywhere; }
.lane dd p, .lane dd ul { margin: 0; }
.lane dd ul { padding-left: 18px; }
.lane.is-new { background: #f1e9dd; }
.lane[data-lane="assessment"] dd { font-weight: 500; }
.lane-empty { color: var(--muted); }
.lane-action { display: flex; flex-wrap: wrap; gap: 8px; align-items: baseline; }
.lane-state { display: inline-block; padding: 3px 10px; border-radius: 20px; font: 500 12px/1.4 var(--body); }
.lane-state-done { background: var(--ink); color: var(--paper); }
.lane-state-pending { border: 1.5px solid #963714; color: #7a2e10; }

.lane-note { margin-top: 18px; }
.lane-cta, .how-actions, .close-actions { margin-top: 26px; display: flex; flex-wrap: wrap; gap: 14px 26px; align-items: center; }

.close-actions { margin: 6px 0 0; }
.bh-close .close-actions .button { margin: 0; }

@keyframes lane-arrive { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

/* ---------- Truth boundary (an anchoring dark section) ---------- */
.truth-boundary { background: var(--ink); color: var(--paper); padding: 90px 0; }
.truth-boundary .bh-label { color: #e6b697; }
.truth-boundary h2 { font: 400 clamp(38px, 4.5vw, 67px)/1.06 var(--display); letter-spacing: -.042em; margin: 0 0 48px; }
.truth-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; border-top: 1px solid #5a5247; }
.truth-grid article { padding: 30px 28px 10px 0; border-right: 1px solid #5a5247; }
.truth-grid article + article { padding-left: 28px; }
.truth-grid article:last-child { border-right: 0; }
.truth-grid h3 { font: 400 clamp(23px, 2.1vw, 32px)/1.15 var(--display); letter-spacing: -.02em; margin: 14px 0 12px; }
.truth-grid p { font: 400 16px/1.65 var(--body); color: #dfd0bd; margin: 0; }
.truth-tag { display: inline-block; padding: 4px 12px; border-radius: 20px; font: 500 12px/1.4 var(--body) !important; letter-spacing: .04em; }
.truth-tag-live { background: var(--paper); color: var(--ink) !important; }
.truth-tag-depends { border: 1.5px solid #e6b697; color: #f1d2b8 !important; }
.truth-tag-direction { border: 1.5px dashed #a99a87; color: #dfd0bd !important; }
.truth-foot { margin: 36px 0 0; font: 400 15px/1.6 var(--body); color: #cdbca7; max-width: 760px; }

/* ---------- Responsive ---------- */
@media (max-width: 1100px) {
  .lane { grid-template-columns: 96px minmax(0, 1fr); }
}
@media (max-width: 900px) {
  .levels .level-grid { grid-template-columns: 1fr; }
  .level-card { border-right: 0; border-bottom: 1px solid var(--line); }
  .level-card:last-child { border-bottom: 0; }
  .lane-demo { grid-template-columns: 1fr; }
  .lane-call { border-right: 0; border-bottom: 1px solid var(--line); }
  .truth-grid { grid-template-columns: 1fr; }
  .truth-grid article, .truth-grid article + article { padding: 26px 0 22px; border-right: 0; border-bottom: 1px solid #5a5247; }
  .truth-grid article:last-child { border-bottom: 0; }
}
@media (max-width: 700px) {
  .lane-section { padding: 70px 0 60px; }
  .lane-jobs { padding: 14px; gap: 8px; }
  .lane-jobs button { width: 100%; }
  .lane-call { padding: 18px; }
  .lane-board { padding: 8px 18px 18px; }
  .lane { grid-template-columns: 1fr; gap: 4px; }
  .turn { max-width: 100%; }
  .turn-text { font-size: 16px; }
  .lane-controls button { flex: 1 1 auto; justify-content: center; }
  .truth-boundary { padding: 64px 0; }
}

/* ---------- Reduced motion: everything visible at once, no movement ---------- */
@media (prefers-reduced-motion: reduce) {
  .turn.is-new { animation: none; }
  .lane { transition: none; }
}
html.motion-paused .turn.is-new { animation: none; }

.turn-empty { background: transparent; border: 1px dashed #cbb9a6; color: var(--muted); font: 400 15px/1.5 var(--body); max-width: 100%; }

/* Sign in stays reachable on desktop (the original hid it); the mobile menu carries it below 900px. */
body[data-theme=bold] .nav-actions .signin, body[data-theme=bold][data-page=index] .nav-actions .signin { display: inline-flex; align-items: center; min-height: 44px; padding: 0 6px; font: 500 14px/1 var(--body); color: var(--ink); }
@media (max-width: 900px) { body[data-theme=bold] .nav-actions .signin, body[data-theme=bold][data-page=index] .nav-actions .signin { display: none; } }
/* On Home the header sits over the portrait: a cream pill keeps Sign in readable on any part of the photo. */
body[data-theme=bold][data-page=index] .nav-actions .signin { background: rgba(247, 241, 231, .94); border-radius: 30px; padding: 0 18px; }

/* Small screens: the latest lane change sits right under the controls. */
.lane-latest { display: none; }
@media (max-width: 900px) {
  .lane-latest:not([hidden]) { display: grid; gap: 8px; padding: 14px 16px; border-radius: 4px; background: #f1e9dd; border-left: 3px solid var(--ink); }
  .lane-latest ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
  .lane-latest li { display: grid; gap: 2px; font: 400 15px/1.45 var(--body); }
  .lane-latest-label { font: 500 11px/1.4 var(--body); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
  .lane-latest.is-new { animation: lane-arrive .22s ease-out; }
}
@media (prefers-reduced-motion: reduce) { .lane-latest.is-new { animation: none; } }
html.motion-paused .lane-latest.is-new { animation: none; }
.lane-audio-failed { margin: 0; font: 500 14px/1.5 var(--body); color: #7a2e10; }

/* Footer small print: #686157 -> #655F55 lifts 12px text from 4.40:1 to 4.56:1 on #E7D9C5.
   CIEDE2000 difference 1.0, below a visible change. The wordmark dot is left as the brand
   orange (logotypes are exempt; a passing footer dot, #D15127, would be a visible change of 5.8). */
.site-footer .footer-bottom span, .site-footer .footer-bottom p { color: #655F55; }

/* ---------- Enquiry form (contact.html) ---------- */
.enquiry-form .field { font: 500 14px/1.45 var(--body); color: var(--ink); }
.enquiry-form .field > .field-error, .enquiry-form .consent + .field-error { display: block; opacity: 1; font: 500 13px/1.45 var(--body); color: #8f2a0c; margin-top: 6px; min-height: 0; }
.enquiry-form .field > .field-optional { opacity: 1; font: 400 13px/1 var(--body); color: var(--muted); }
.enquiry-form [aria-invalid="true"] { border-color: #8f2a0c !important; box-shadow: 0 0 0 1px #8f2a0c; }
.enquiry-intro { margin: 0 0 26px; font: 400 16px/1.6 var(--body); }
.field-hint { margin: -10px 0 18px; font: 400 13px/1.55 var(--body); color: var(--muted); }
.consent { display: grid; grid-template-columns: 24px 1fr; gap: 12px; align-items: start; font: 400 15px/1.5 var(--body); cursor: pointer; }
.consent input { width: 22px; height: 22px; margin: 1px 0 0; accent-color: var(--ink); }
.consent a { color: var(--ink); }
.hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.turnstile-slot:empty { display: none; }
.turnstile-slot { margin: 18px 0 0; }
.enquiry-form .enquiry-actions { margin-top: 24px; }
.form-status { margin-top: 12px; font: 500 14px/1.5 var(--body); }
.enquiry-done, .enquiry-failed { display: grid; gap: 10px; padding: 26px; border-radius: 4px; }
.enquiry-done[hidden], .enquiry-failed[hidden] { display: none; }
.enquiry-done { background: var(--ink); color: var(--paper); }
.enquiry-done .mini-label { color: #e6b697; }
.enquiry-failed { background: #f1e9dd; border-left: 3px solid #8f2a0c; margin-top: 18px; }
.enquiry-done h3, .enquiry-failed h3 { margin: 0; font: 400 28px/1.15 var(--display); letter-spacing: -.02em; }
.enquiry-done p, .enquiry-failed p { margin: 0; font: 400 16px/1.6 var(--body); }
.enquiry-failed a:not(.button) { color: var(--ink); }
.enquiry-failed .enquiry-actions { flex-wrap: wrap; flex-direction: row; gap: 14px; }
.enquiry-done:focus, .enquiry-failed:focus { outline: 3px solid #963714; outline-offset: 5px; }
/* Form columns may shrink: WebKit sizes a select to its longest option otherwise. */
.enquiry-form .form-row > *, .enquiry-form .field { min-width: 0; }
.enquiry-form .field select, .enquiry-form .field input, .enquiry-form .field textarea { max-width: 100%; min-width: 0; text-overflow: ellipsis; }
/* The original sets button:disabled { opacity: .55 }, which fades the muted label below 4.5:1. */
.lane-controls button:disabled { opacity: 1; }
/* Footer tagline, same treatment as the footer small print (CIEDE2000 1.0, not a visible change). */
.site-footer .footer-grid p { color: #655F55; }
/* Grid tracks may shrink below their content (1fr alone means minmax(auto, 1fr)). */
.bh-contact-layout > *, .enquiry, .enquiry-form { min-width: 0; }
@media (max-width: 700px) { .enquiry-form .form-row { grid-template-columns: minmax(0, 1fr); } }
@media (min-width: 701px) { .enquiry-form .form-row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.enquiry-form select { overflow: hidden; }

/* Draft legal wording: visible until Karan approves. */
.legal-draft { display: inline-block; margin: 0 0 22px; padding: 6px 12px; border: 1.5px dashed #8f2a0c; border-radius: 4px; font: 500 13px/1.4 var(--body); color: #7a2e10; }

/* =====================================================================
   Talk to ATI guide widget
   ===================================================================== */
.talk { position: fixed; right: 22px; bottom: 22px; z-index: 150; font-family: var(--body); }
.talk[hidden] { display: none; }
.talk-orb { display: inline-flex; align-items: center; gap: 12px; min-height: 60px; padding: 8px 22px 8px 8px; border: 0; border-radius: 40px; background: var(--ink); color: var(--paper); font: 500 15px/1 var(--body); cursor: pointer; box-shadow: 0 12px 30px rgba(37,34,28,.28); transition: transform .18s ease, box-shadow .18s ease; }
.talk-orb:hover { transform: translateY(-2px); box-shadow: 0 16px 36px rgba(37,34,28,.34); }
.orb { position: relative; width: 44px; height: 44px; border-radius: 50%; flex: none;
  background: radial-gradient(circle at 35% 30%, #ffd2b3 0, #ea5b2c 46%, #963714 100%); }
.orb::after { content: ""; position: absolute; inset: -5px; border-radius: 50%; border: 2px solid rgba(234,91,44,.55); animation: orb-breathe 3.2s ease-in-out infinite; }
.orb-sm { width: 34px; height: 34px; }
.orb-sm::after { display: none; }
@keyframes orb-breathe { 0%, 100% { transform: scale(.94); opacity: .9; } 50% { transform: scale(1.12); opacity: .25; } }
.talk.is-open .talk-orb { display: none; }

.talk-panel { position: fixed; right: 22px; bottom: 22px; width: min(400px, calc(100vw - 44px)); max-height: min(720px, calc(100vh - 44px)); display: flex; flex-direction: column; background: var(--paper); color: var(--ink); border: 1px solid #bfa88e; border-radius: 10px; box-shadow: 0 24px 60px rgba(37,34,28,.32); overflow: hidden; animation: talk-in .24s ease-out; }
.talk-panel[hidden] { display: none; }
@keyframes talk-in { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
.talk-head { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 12px; padding: 14px 14px 14px 18px; background: var(--ink); color: var(--paper); }
.talk-head h2 { margin: 0; font: 500 18px/1.2 var(--display); letter-spacing: -.01em; }
.talk-head p { margin: 2px 0 0; font: 400 12px/1.3 var(--body); color: #dccbb6; }
.talk-close { width: 44px; height: 44px; display: grid; place-items: center; border: 0; border-radius: 50%; background: transparent; color: var(--paper); cursor: pointer; }
.talk-close:hover { background: rgba(247,241,231,.12); }
.talk-body { padding: 20px 20px 22px; overflow-y: auto; display: grid; gap: 14px; align-content: start; }
.talk-badge { justify-self: start; padding: 4px 10px; border-radius: 20px; border: 1.5px dashed #963714; color: #7a2e10; font: 500 12px/1.4 var(--body); }
.talk-title { margin: 0; font: 500 26px/1.12 var(--display); letter-spacing: -.02em; }
.talk-lede { margin: 0; font: 400 15px/1.6 var(--body); }
.talk-small, .talk-note { margin: 0; font: 400 13px/1.5 var(--body); color: var(--muted); }
.talk-actions { display: flex; flex-wrap: wrap; gap: 10px 18px; align-items: center; }
.talk-actions .button { margin: 0; }
.talk-preview-flag { margin: 0; padding: 8px 12px; border-radius: 6px; background: #f1e9dd; font: 500 12px/1.45 var(--body); color: #7a2e10; }
.talk-mic { padding: 14px 16px; border: 1px solid var(--line); border-radius: 6px; display: grid; gap: 4px; }
.talk-mic-title { margin: 0; font: 500 15px/1.4 var(--body); }
.talk-stage { display: grid; justify-items: center; gap: 8px; padding: 8px 0 4px; }
.talk-voice { display: flex; gap: 5px; align-items: center; height: 42px; }
.talk-voice i { width: 6px; height: 100%; border-radius: 4px; background: #cbb9a6; transform: scaleY(.2); }
.talk-voice.is-agent i { background: var(--orange); animation: voice .9s ease-in-out infinite; }
.talk-voice.is-visitor i { background: var(--ink); animation: voice 1.1s ease-in-out infinite; }
.talk-voice i:nth-child(2) { animation-delay: -.2s; } .talk-voice i:nth-child(3) { animation-delay: -.5s; } .talk-voice i:nth-child(4) { animation-delay: -.35s; } .talk-voice i:nth-child(5) { animation-delay: -.7s; }
.talk-status { margin: 0; font: 500 13px/1.3 var(--body); color: var(--muted); }
.talk-log { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; max-height: 300px; overflow-y: auto; }
.talk-line { display: grid; gap: 3px; padding: 10px 13px; border-radius: 8px; background: #fffaf2; border: 1px solid #e3d6c5; max-width: 92%; }
.talk-line-visitor { justify-self: end; background: var(--ink); color: var(--paper); border-color: var(--ink); }
.talk-who { font: 500 11px/1.3 var(--body); letter-spacing: .07em; text-transform: uppercase; color: var(--muted); }
.talk-line-visitor .talk-who { color: #dccbb6; }
.talk-text { font: 400 15px/1.5 var(--body); }
.talk-controls { display: flex; gap: 8px; }
.talk-controls .pill { box-shadow: none; border: 1px solid #bca68e; }
.talk-end { background: #8f2a0c !important; color: #fff !important; border-color: #8f2a0c !important; }
.talk-type { display: grid; grid-template-columns: 1fr auto; gap: 8px; }
.talk-type input { min-height: 44px; padding: 0 14px; border: 1px solid #bca68e; border-radius: 6px; background: #fffdf8; font: 400 16px/1 var(--body); color: var(--ink); }
.talk-type .button { margin: 0; min-height: 44px; }
.talk-prefill { padding: 14px 16px; border-radius: 8px; background: #f1e9dd; display: grid; gap: 8px; }
.talk-prefill dl { margin: 0; display: grid; gap: 4px; }
.talk-prefill dl div { display: grid; grid-template-columns: 84px 1fr; gap: 8px; font: 400 14px/1.4 var(--body); }
.talk-prefill dt { color: var(--muted); }
.talk-prefill dd { margin: 0; }
.talk-clock { margin: 0; font: 500 12px/1 var(--body); letter-spacing: .04em; color: var(--muted); font-variant-numeric: tabular-nums; min-height: 12px; }
.talk-clock.is-low { color: #8f2a0c; }
.talk-icon-btn { width: 44px; height: 44px; display: grid; place-items: center; border: 1px solid #bca68e; border-radius: 50%; background: transparent; color: var(--ink); cursor: pointer; }
.talk-icon-btn[aria-pressed="true"] { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.talk-icon-btn:hover { border-color: var(--ink); }
.talk-controls { align-items: center; }
/* Live call: one quiet header row, captions below, typing at the foot. */
.talk.is-live .talk-stage { display: flex; align-items: center; gap: 12px; padding: 0 0 12px; border-bottom: 1px solid var(--line); }
.talk.is-live .talk-voice { height: 22px; gap: 3px; flex: none; }
.talk.is-live .talk-voice i { width: 4px; }
.talk-stage-text { display: grid; gap: 3px; margin-right: auto; min-width: 0; }
.talk.is-live .talk-status { font-size: 14px; color: var(--ink); }
.talk.is-live .talk-controls { gap: 8px; flex: none; }
.talk-end { min-height: 44px; padding: 0 18px; border-radius: 40px; font: 500 14px/1 var(--body); cursor: pointer; }
.talk.is-live .talk-log { padding-top: 2px; }
.talk.is-live .talk-body { padding-top: 0; }
.talk.is-live .talk-stage { position: sticky; top: 0; z-index: 1; background: var(--paper); padding-top: 14px; }   /* End stays in reach */
.talk-link-btn { justify-self: start; padding: 0; border: 0; background: none; cursor: pointer; font: 400 14px/1.4 var(--body); color: var(--ink); text-decoration: underline; text-underline-offset: 3px; min-height: 44px; }
.talk-check:empty { display: none; }
.talk-check { padding: 0 20px 16px; }
.enquiry-prefilled { margin: 0 0 18px; padding: 10px 14px; border-radius: 6px; background: #f1e9dd; border-left: 3px solid var(--orange); font: 500 14px/1.5 var(--body); }

/* The guide points at a section: a short orange outline pulse. */
.guide-highlight { animation: guide-ring 3.2s ease-out 1; outline: 3px solid transparent; outline-offset: -3px; }
@keyframes guide-ring { 0% { outline-color: rgba(234,91,44,0); } 12% { outline-color: rgba(234,91,44,.95); } 80% { outline-color: rgba(234,91,44,.9); } 100% { outline-color: rgba(234,91,44,0); } }

@media (max-width: 700px) {
  .talk { right: 14px; bottom: 14px; }
  .talk-orb { min-height: 56px; padding: 6px; }
  .talk-orb-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .talk-panel { right: 0; left: 0; bottom: 0; width: 100%; max-height: 92dvh; border-radius: 14px 14px 0 0; border-bottom: 0; }
  /* While talking, keep the page visible above the sheet so the guide can point at sections. */
  .talk.is-live .talk-panel { max-height: 54dvh; }
  .talk.is-live .talk-body { gap: 10px; padding: 0 16px 16px; }
  .talk.is-live .talk-head { padding: 8px 8px 8px 16px; }
  .talk.is-live .talk-head .orb-sm { width: 28px; height: 28px; }
  .talk.is-live .talk-prefill { padding: 12px 14px; gap: 6px; }
  .talk.is-live .talk-log { max-height: none; }

}
@media (prefers-reduced-motion: reduce) {
  .orb::after, .talk-voice i, .talk-panel, .guide-highlight { animation: none; }
  .guide-highlight { outline-color: rgba(234,91,44,.9); }
}
@media (max-width: 700px) {
  .talk-orb { transition: transform .25s ease, opacity .25s ease; }
  .talk.is-tucked .talk-orb { transform: translateY(140%); opacity: 0; pointer-events: none; }
}

/* =====================================================================
   One street, every call (section 01): line-art street, zoom, one call
   ===================================================================== */
.street-section { padding: 96px 0 84px; background: var(--paper); }
.street { display: grid; gap: 14px; }
.street-view { position: relative; overflow: hidden; transition: height .7s cubic-bezier(.2,.8,.2,1); }
.street-track { position: relative; list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr));
  transform-origin: 0 0; transition: transform .7s cubic-bezier(.2,.8,.2,1); }
.lot { min-width: 0; transition: opacity .5s ease; }
.lot-btn { display: block; width: 100%; padding: 0 0 6px; border: 0; border-radius: 12px; background: none; color: var(--ink); font: inherit; text-align: center; text-decoration: none; cursor: pointer; }
.lot-btn:focus-visible { outline: 2px solid var(--orange); outline-offset: -2px; }
.lot-art { display: block; width: 100%; height: auto; overflow: visible; }
.lot-art path { vector-effect: non-scaling-stroke; }
.lot-art .acc { stroke: var(--orange); }
.lot-art .soft { fill: var(--orange); fill-opacity: .26; stroke: none; }
.lot-art .dash { stroke-dasharray: 3 6; }
.lot-art .art-text { fill: currentColor; stroke: none; font: 600 12px/1 var(--body); letter-spacing: .02em; }
.lot-art .art-sign { letter-spacing: .16em; }
.lot-name { display: block; margin-top: 4px; font: 500 12px/1.3 var(--body); letter-spacing: .1em; text-transform: uppercase; color: var(--muted); transition: opacity .3s ease, color .2s ease; }
.lot-btn:hover .lot-name { color: var(--ink); }
.lot-plot .lot-name { color: #963714; }
/* Scene reactions: hidden until the call reaches the moment. */
.react { opacity: 0; transition: opacity .6s ease; }
.b.is-headlights .react-headlights, .b.is-slot .react-slot, .b.is-promise .react-promise, .b.is-form .react-form { opacity: 1; }
/* Ringing phones: a short shake every few seconds, staggered along the street. */
.phone-body { transform-box: fill-box; transform-origin: 50% 50%; }
.phone .ring { opacity: 0; }
.lot.is-active .phone { color: var(--orange); }
@media (prefers-reduced-motion: no-preference) {
  .street:not(.is-calling) .phone-body { animation: phone-ring 3.4s ease-in-out infinite; animation-delay: var(--ring, 0s); }
  .street:not(.is-calling) .phone .ring { animation: phone-waves 3.4s ease-out infinite; animation-delay: var(--ring, 0s); }
}
@media (prefers-reduced-motion: reduce) { .street:not(.is-calling) .phone .ring { opacity: .85; } }
@keyframes phone-ring { 0%, 18%, 100% { transform: none; } 3% { transform: rotate(-13deg); } 6% { transform: rotate(11deg); } 9% { transform: rotate(-8deg); } 12% { transform: rotate(6deg); } 15% { transform: rotate(-2deg); } }
@keyframes phone-waves { 0%, 22%, 100% { opacity: 0; } 4%, 15% { opacity: 1; } }
/* Zoomed into one building */
.street.is-zoomed .lot:not(.is-active) { opacity: .22; }
.street.is-zoomed .lot-name { opacity: 0; }

/* The call, under the street */
.street-call, .street .story-foot { width: min(100%, 980px); margin-inline: auto; }
.street-call { position: relative; background: #fffaf2; border: 1px solid #e3d6c5; border-radius: 18px; padding: 14px 22px 0; overflow: hidden;
  box-shadow: 0 1px 0 rgba(37,34,28,.03), 0 18px 40px -24px rgba(37,34,28,.22); }
.call-bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 44px; }
.call-name { margin: 0; min-width: 0; display: flex; align-items: baseline; gap: 12px; font: 500 17px/1.3 var(--display); letter-spacing: -.01em; }
.call-level { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: 400 13px/1.3 var(--body); letter-spacing: 0; color: var(--muted); }
.street-call .story-live { padding: 16px 2px 14px; }
.street-dots { display: none; }
.story-controls { display: flex; gap: 2px; }
.icon-btn { width: 44px; height: 44px; display: grid; place-items: center; border: 0; border-radius: 50%; background: transparent; color: var(--ink); cursor: pointer; transition: background .18s ease; }
.icon-btn:hover:not(:disabled) { background: #f1e9dd; }
.icon-btn:disabled { color: #a99a87; cursor: default; }
.icon-btn[aria-pressed="true"] { color: #963714; }
.icon-btn .icon { width: 20px; height: 20px; }

.story-live { min-width: 0; display: grid; gap: 6px; }
.story-who { display: flex; align-items: center; gap: 10px; margin: 0; font: 500 11px/1 var(--body); letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.story-who.who-agent { color: #963714; }
.story-time { margin-left: auto; letter-spacing: 0; text-transform: none; font-variant-numeric: tabular-nums; color: #6f675d; font-weight: 400; font-size: 12px; }
.wave { display: inline-flex; align-items: center; gap: 2px; height: 14px; }
.wave i { width: 2.5px; height: 100%; border-radius: 2px; background: currentColor; transform: scaleY(.22); }
.story-who.is-speaking .wave i { animation: voice .9s ease-in-out infinite; }
.story-who.is-speaking .wave i:nth-child(2) { animation-delay: -.3s; } .story-who.is-speaking .wave i:nth-child(3) { animation-delay: -.6s; }
.story-who.is-speaking .wave i:nth-child(4) { animation-delay: -.15s; } .story-who.is-speaking .wave i:nth-child(5) { animation-delay: -.45s; }
@keyframes voice { 0%, 100% { transform: scaleY(.22); } 50% { transform: scaleY(1); } }

.story-line { margin: 0; min-height: 1.35em; font: 400 clamp(19px, 1.9vw, 25px)/1.35 var(--body); letter-spacing: -.005em; color: var(--ink); white-space: nowrap; overflow: hidden; }
.story-line .cap-text.is-new { display: inline-block; animation: line-in .22s ease-out; }
.story-line .cap-wait { color: var(--muted); }
.story-line .w { transition: opacity .16s ease, color .3s ease; }
.story-line .w-next { opacity: 0; }
.story-line .w-now { color: #963714; }
@keyframes line-in { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }

.chips { list-style: none; margin: 0 2px; padding: 0 0 18px; display: flex; flex-wrap: nowrap; gap: 8px; overflow: hidden; min-height: 50px; }
.chip { flex: none; display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 13px; border-radius: 999px; background: #fff; border: 1px solid #e3d6c5; font: 500 13px/1 var(--body); color: var(--ink); white-space: nowrap; }
.chip.is-new { animation: chip-in .26s cubic-bezier(.2,.8,.2,1); }
.chip-icon { width: 14px; height: 14px; color: #2f6a46; }
.chip-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--orange); }
.chip-pending .chip-dot { background: transparent; border: 1.5px solid #963714; }
.chip-changed { border-color: #efc7ad; }
@keyframes chip-in { from { opacity: 0; transform: translateY(6px) scale(.96); } to { opacity: 1; transform: none; } }

.story-progress { position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: #efe4d6; }
.story-progress span { display: block; height: 100%; width: 0; background: var(--orange); }

.story-foot { display: flex; flex-wrap: wrap; gap: 6px 22px; align-items: baseline; }
.story-foot .live-transcript { border: 0; padding: 0; }
.story-foot .live-transcript summary { min-height: 44px; display: flex; align-items: center; cursor: pointer; font: 500 14px/1.4 var(--body); }
.story-foot .live-transcript[open] { flex-basis: 100%; }
.story-note, .live-audio-note { margin: 0; font: 400 13px/1.5 var(--body); color: var(--muted); }
.street-section .lane-cta { margin-top: 18px; }


@media (max-width: 700px) {
  .street-section { padding: 68px 0 58px; }
  /* One building per screen; the street scrolls sideways inside its own box, never the page. */
  .street-view { overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; overscroll-behavior-x: contain; scrollbar-width: none; }
  .street-view::-webkit-scrollbar { display: none; }
  .street-track { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 84%; }
  .lot { scroll-snap-align: center; }
  .street.is-zoomed .street-view { overflow-x: hidden; }
  .street-dots { display: flex; justify-content: center; gap: 7px; transition: opacity .3s ease; }
  .street-dots i { width: 6px; height: 6px; border-radius: 50%; background: #d8c8b4; transition: background .2s ease, transform .2s ease; }
  .street-dots i.is-on { background: var(--ink); transform: scale(1.15); }
  .street.is-zoomed .street-dots { opacity: 0; }
  .lot-name { font-size: 11.5px; }
  .street-call { padding: 10px 12px 0; border-radius: 16px; }
  .call-name { flex-direction: column; gap: 2px; font-size: 16px; }
  .call-level { font-size: 12px; }
  .story-controls { gap: 0; }
  .street-call .story-live { padding: 12px 4px 12px; }
  .story-line { font-size: 17.5px; }
  .chips { padding-bottom: 14px; min-height: 46px; }
  .chip { height: 30px; padding: 0 11px; font-size: 12.5px; }
}
@media (prefers-reduced-motion: reduce) {
  .story-who.is-speaking .wave i, .story-line .cap-text.is-new, .chip.is-new { animation: none; }
  .story-line .w, .street-view, .street-track, .lot, .react { transition: none; }
}
html.motion-paused .story-who.is-speaking .wave i, html.motion-paused .phone-body, html.motion-paused .phone .ring { animation: none; }