/* Centera v3 · Nora web chat (2026-10-03). Opt-in per page; needs centera.css first (tokens, .btn, .bubble, .typing, .sr-only).
   Colors come from the page's tokens only, so the chat follows the page (the site is dark-only today).
   Phone first: under 640px the panel is a full-width bottom sheet over a dim scrim; from 640px it is a 392px panel that
   rises from the launcher's corner. Every animation sits inside prefers-reduced-motion: no-preference, and centera.css
   also zeroes the --dur-* tokens under reduce, so reduced motion means no motion at all.
   The avatar is the walk layer's Nora mark (assets/walk.css .wk-av), copied so this file works on pages without walk.css. */

/* ---- Nora's avatar: one Nora across the site ---- */
.nora-av {
  position: relative; flex: none; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%;
  color: #fff; font-weight: 800; font-size: 18px; line-height: 1;
  background: radial-gradient(circle at 35% 30%, #9b86ff, var(--ember) 48%, var(--ember-700)) center / cover;
  box-shadow: 0 0 0 1px #a78bfa99, 0 0 18px -4px var(--ember-glow);
}
.nora-av b { font-weight: 800; }

/* ---- launcher ---- */
.cw-launch {
  position: fixed; right: var(--gutter); bottom: calc(var(--gutter) + env(safe-area-inset-bottom, 0px)); z-index: 80;
  display: inline-flex; align-items: center; gap: 10px; min-height: 56px; padding: 6px 20px 6px 6px;
  border: 1px solid var(--line-2); border-radius: var(--radius-pill);
  background: var(--surface-1); color: var(--bone); box-shadow: var(--shadow-3);
  font: inherit; font-size: 16px; font-weight: 700; line-height: 1.2; cursor: pointer;
  transition: transform var(--dur-2) var(--ease), border-color var(--dur-2) var(--ease), opacity var(--dur-3) var(--ease-out), visibility var(--dur-3);
}
.cw-launch:hover { border-color: var(--ember-line); transform: translateY(-2px); }
.cw-launch[aria-expanded="true"], .cw-handed .cw-launch, .cw-down .cw-launch { opacity: 0; visibility: hidden; pointer-events: none; }
.cw-down { display: none; }
/* pages that load the launcher: keep the footer's last row (copyright + EN/ES toggle) clear of it at the end of the page */
.site-footer { padding-bottom: calc(var(--gutter) + 56px + 12px + env(safe-area-inset-bottom, 0px)); }

/* ---- scrim (phone sheet only) + panel ---- */
.cw-scrim { position: fixed; inset: 0; z-index: 94; background: rgba(5, 5, 10, 0.6); opacity: 0; transition: opacity var(--dur-3) var(--ease-out); }
.is-open .cw-scrim { opacity: 1; }
.cw-panel {
  position: fixed; z-index: 95; left: 0; right: 0; bottom: 0;
  height: min(720px, 88dvh);
  display: flex; flex-direction: column; overflow: hidden;
  padding-bottom: env(safe-area-inset-bottom, 0px);
  background: var(--surface-1); color: var(--bone);
  border: 1px solid var(--line-2); border-bottom: 0; border-radius: 22px 22px 0 0; box-shadow: var(--shadow-3);
  opacity: 0; transform: translateY(32px); transform-origin: bottom center;
  transition: opacity var(--dur-3) var(--ease-out), transform 420ms var(--ease-out);
}
.cw-panel[hidden], .cw-scrim[hidden] { display: none; }
.is-open .cw-panel { opacity: 1; transform: none; }
@media (max-width: 639px) {
  html.cw-on { overflow: hidden; }   /* the sheet owns the scroll while it is open */
  .cw-panel::before { content: ""; position: absolute; top: 7px; left: 50%; width: 40px; height: 4px; margin-left: -20px; border-radius: 4px; background: var(--line-2); }
}
@media (min-width: 640px) {
  .cw-scrim { display: none; }
  .cw-panel {
    left: auto; right: var(--gutter); bottom: var(--gutter); width: 392px;
    height: min(660px, calc(100dvh - var(--nav-h) - 32px));
    padding-bottom: 0; border-bottom: 1px solid var(--line-2); border-radius: var(--radius-xl);
    transform: translateY(18px) scale(0.94); transform-origin: bottom right;
  }
}
@media (prefers-reduced-motion: reduce) { .cw-panel, .cw-scrim, .cw-launch { transition: none; } }

/* ---- header ---- */
.cw-head {
  display: flex; align-items: center; gap: var(--space-3); padding: 16px 8px 12px 16px; border-bottom: 1px solid var(--line);
  background: linear-gradient(180deg, var(--ember-tint), rgba(120, 92, 255, 0) 100%);
}
.cw-head .nora-av { width: 40px; height: 40px; font-size: 17px; }
.cw-id { flex: 1; min-width: 0; }
.cw-title { font-size: 17px; font-weight: 700; line-height: 1.2; letter-spacing: -0.01em; }
.cw-sub { display: flex; align-items: center; gap: 6px; margin-top: 2px; font-size: 13px; line-height: 1.35; color: var(--muted); }
.cw-dot { flex: none; width: 7px; height: 7px; border-radius: 50%; background: var(--ember-soft); box-shadow: 0 0 0 3px var(--ember-tint); }
.cw-x { flex: none; display: grid; place-items: center; width: var(--tap); height: var(--tap); border: 0; border-radius: var(--radius); background: none; color: var(--bone-2); font-size: 26px; line-height: 1; cursor: pointer; transition: background var(--dur-2) var(--ease), color var(--dur-2) var(--ease); }
.cw-x:hover { background: var(--surface-3); color: var(--bone); }

/* ---- conversation ---- */
.cw-log { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; display: flex; flex-direction: column; gap: var(--space-2); padding: 16px 14px; font-size: 16px; line-height: 1.45; }
.cw-log .bubble { white-space: pre-wrap; overflow-wrap: anywhere; }
.cw-log .bubble a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.cw-log .bubble-desk a { color: var(--ember-soft); }
.cw-rest { border: 1px solid var(--line-2); }

/* ---- the hand-off card ---- */
.cw-hand { display: flex; flex-direction: column; gap: 8px; margin-top: 4px; padding: 12px 14px; border-radius: var(--radius); background: var(--ember-tint); border: 1px solid var(--ember-line); }
.cw-hand p { font-size: 15px; line-height: 1.45; color: var(--bone-2); }
.cw-hand .cw-hand-h { display: flex; align-items: center; gap: 8px; color: var(--bone); font-weight: 700; }
.cw-hand .cw-hand-h svg { flex: none; color: var(--ember-soft); }
.cw-hand-wait { display: flex; align-items: center; gap: 8px; }
.cw-dots { display: inline-flex; gap: 3px; }
.cw-dots i { width: 5px; height: 5px; border-radius: 50%; background: var(--ember-soft); opacity: 0.5; }
.cw-hand.is-failed { background: var(--surface-2); border-color: var(--line-2); }

/* ---- suggestions, input, actions ---- */
.cw-chips { display: flex; flex-wrap: wrap; gap: 8px; padding: 0 14px 12px; }
.cw-chips[hidden] { display: none; }
.cw-chip { min-height: var(--tap); padding: 0 14px; border-radius: var(--radius-pill); border: 1px solid var(--line-strong); background: var(--surface-2); color: var(--bone); font: inherit; font-size: 15px; font-weight: 600; cursor: pointer; transition: border-color var(--dur-2) var(--ease), background var(--dur-2) var(--ease), transform var(--dur-1) var(--ease); }
.cw-chip:hover { border-color: var(--ember-line); background: var(--surface-3); }
.cw-chip:active { transform: scale(0.98); }

.cw-form { display: flex; gap: 8px; padding: 12px 14px 10px; border-top: 1px solid var(--line); }
.cw-in { flex: 1; min-width: 0; min-height: var(--tap); padding: 10px 16px; border-radius: var(--radius-pill); border: 1px solid var(--line-strong); background: var(--surface-2); color: var(--bone); font: inherit; font-size: 16px; transition: border-color var(--dur-2) var(--ease); }
.cw-in:focus { border-color: var(--ember-soft); outline: none; box-shadow: 0 0 0 3px var(--ember-tint); }
.cw-in::placeholder { color: var(--muted); }
.cw-in:disabled { opacity: 0.55; }
.cw-send { flex: none; display: grid; place-items: center; width: var(--tap); height: var(--tap); border: 0; border-radius: 50%; background: var(--ember-600); color: #fff; cursor: pointer; transition: background var(--dur-2) var(--ease), transform var(--dur-1) var(--ease); }
.cw-send:hover { background: var(--ember-700); }
.cw-send:active { transform: scale(0.94); }
.cw-send:disabled { opacity: 0.45; cursor: default; }

.cw-foot { display: flex; flex-wrap: wrap; gap: 8px; padding: 0 14px 8px; }
.cw-person, .cw-book { flex: 1 1 auto; display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: var(--tap); padding: 0 14px; border-radius: var(--radius-pill); font: inherit; font-size: 15px; font-weight: 700; line-height: 1.2; text-align: center; cursor: pointer; transition: border-color var(--dur-2) var(--ease), background var(--dur-2) var(--ease); }
.cw-person { border: 1px solid var(--ember-line); background: var(--ember-tint); color: var(--bone); }
.cw-person svg { flex: none; color: var(--ember-soft); }
.cw-person:hover { background: var(--ember-tint-2); }
.cw-person:disabled { opacity: 0.55; cursor: default; }
.cw-book { border: 1px solid var(--line-strong); background: none; color: var(--bone); }
.cw-book:hover { border-color: var(--ember-line); }
.cw-note { padding: 0 16px 12px; font-size: 13px; line-height: 1.4; color: var(--muted); text-align: center; }

/* ---- cards in the log: the contact ask, the four-questions offer, next steps ---- */
.cw-card { display: flex; flex-direction: column; gap: 10px; margin-top: 2px; padding: 12px 14px; border-radius: var(--radius); background: var(--surface-2); border: 1px solid var(--line-2); }
.cw-card-h { font-size: 15px; line-height: 1.45; color: var(--bone); }
.cw-card-row { display: flex; flex-wrap: wrap; gap: 8px; }
.cw-card-row .btn { flex: 1 1 auto; border-radius: var(--radius-pill); white-space: normal; }
.cw-contact { border-color: var(--ember-line); background: var(--ember-tint); }
.cw-contact-row { display: flex; gap: 8px; }
.cw-contact-row .cw-in { background: var(--surface-1); }
.cw-contact-row .btn { flex: none; border-radius: var(--radius-pill); }
.cw-contact .cw-in[aria-invalid="true"] { border-color: var(--err); }
.cw-err { font-size: 14px; line-height: 1.4; color: var(--err); }
.cw-err[hidden] { display: none; }
.cw-consent { font-size: 13px; line-height: 1.45; color: var(--bone-2); }
.cw-link { align-self: flex-start; min-height: var(--tap); padding: 0 2px; border: 0; background: none; color: var(--bone-2); font: inherit; font-size: 14px; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.cw-link:hover { color: var(--bone); }
.cw-log .cw-qq { border: 1px solid var(--ember-line); }
.cw-log .cw-skipped { opacity: 0.7; font-style: italic; }
.cw-chip-quiet { min-height: 36px; padding: 0 12px; font-size: 14px; color: var(--bone-2); background: none; }

/* ---- the re-ask card's actions, and the next-page nudge (after a "Not now" earlier in the session) ---- */
.cw-contact-acts { align-items: center; }
.cw-contact-acts .btn { flex: 0 1 auto; }
.cw-contact-acts .cw-link { align-self: center; }
.cw-nudge {
  position: fixed; z-index: 81; right: var(--gutter); bottom: calc(var(--gutter) + 56px + 14px + env(safe-area-inset-bottom, 0px));
  display: flex; align-items: flex-start; gap: 2px; max-width: min(300px, calc(100vw - 2 * var(--gutter)));
  border-radius: var(--radius-lg); background: var(--surface-2); border: 1px solid var(--ember-line); box-shadow: var(--shadow-3);
}
.cw-nudge::after { content: ""; position: absolute; right: 30px; bottom: -7px; width: 12px; height: 12px; background: var(--surface-2); border-right: 1px solid var(--ember-line); border-bottom: 1px solid var(--ember-line); transform: rotate(45deg); }
.cw-nudge-open { flex: 1; min-height: var(--tap); padding: 12px 4px 12px 14px; border: 0; border-radius: var(--radius-lg); background: none; color: var(--bone); font: inherit; font-size: 15px; line-height: 1.4; text-align: left; cursor: pointer; }
.cw-nudge-open:hover { color: #fff; }
.cw-nudge-x { flex: none; display: grid; place-items: center; width: var(--tap); height: var(--tap); border: 0; border-radius: var(--radius); background: none; color: var(--bone-2); font-size: 22px; line-height: 1; cursor: pointer; }
.cw-nudge-x:hover { color: var(--bone); background: var(--surface-3); }
.is-open .cw-nudge, .cw-handed .cw-nudge, .cw-down .cw-nudge, .wk-sheet .cw-nudge { display: none; }
/* nora-pop: the free-report line (a link, not a chat opener) */
.cw-pop .cw-pop-go { text-decoration: none; display: block; }
.cw-pop .cw-pop-cta { display: block; margin-top: 6px; color: var(--ember, #c4b5fd); font-weight: 600; }
.cw-pop .cw-pop-go:hover .cw-pop-cta { text-decoration: underline; }

/* ---- motion (only when the visitor has not asked for less) ---- */
@media (prefers-reduced-motion: no-preference) {
  /* the launcher arrives once, then Nora "breathes" a few times and rests (no endless motion next to the page) */
  .cw-launch { animation: cw-arrive 520ms var(--ease-out) backwards; }
  .cw-launch .nora-av { animation: cw-breathe 4.2s ease-in-out 1.4s 4; }
  .cw-log > * { animation: cw-in 360ms var(--ease-out) backwards; }
  .cw-log > .bubble-customer { transform-origin: bottom right; }
  .cw-log > .bubble-desk, .cw-log > .typing { transform-origin: bottom left; }
  .cw-hand, .cw-card { animation: cw-in 420ms var(--ease-out) backwards; }
  .cw-nudge { animation: cw-arrive 460ms var(--ease-out) backwards; transform-origin: bottom right; }
  .cw-dots i { animation: c-typing 1.2s infinite ease-in-out; }
  .cw-dots i:nth-child(2) { animation-delay: 0.15s; }
  .cw-dots i:nth-child(3) { animation-delay: 0.3s; }
  .cw-chips .cw-chip { animation: cw-in 360ms var(--ease-out) backwards; }
  .cw-chips .cw-chip:nth-child(2) { animation-delay: 60ms; }
  .cw-chips .cw-chip:nth-child(3) { animation-delay: 120ms; }
  @keyframes cw-arrive { from { opacity: 0; transform: translateY(14px) scale(0.96); } }
  @keyframes cw-in { from { opacity: 0; transform: translateY(8px) scale(0.98); } }
  @keyframes cw-breathe {
    0%, 100% { transform: scale(1); box-shadow: 0 0 0 1px #a78bfa99, 0 0 18px -4px var(--ember-glow); }
    50% { transform: scale(1.05); box-shadow: 0 0 0 1px #c4b5fdcc, 0 0 0 8px rgba(120, 92, 255, 0.12), 0 0 28px -2px var(--ember-glow); }
  }
}
@media (prefers-reduced-motion: reduce) { .typing i { animation: none; opacity: 0.7; } }

/* nora-record begin (13 Oct 2026, "fix nora's lead record"): the second contact box, the confirmation card (a person's summary,
   the channel, Looks right / Edit), the in-card Edit form, the holding line of a slow answer, the recovery card and the client route.
   Tokens only (the page's colours), 44 px tap targets, no motion beyond the cards' own arrival (already reduced-motion aware). */
.cw-c2-row .cw-in { font-size: 15px; }
.cw-log .cw-hold { color: var(--bone-2); font-style: italic; border: 1px dashed var(--line-2); }
.cw-confirm { border-color: var(--ember-line); }
.cw-sum { display: flex; flex-direction: column; gap: 6px; padding: 10px 12px; border-radius: var(--radius); background: var(--surface-1); border: 1px solid var(--line); }
.cw-sum p { font-size: 15px; line-height: 1.45; color: var(--bone); overflow-wrap: anywhere; }
.cw-channel { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.cw-channel-h { flex: 1 0 100%; font-size: 14px; line-height: 1.4; color: var(--bone-2); }
.cw-chip-sm { min-height: var(--tap); padding: 0 16px; font-size: 14px; }
.cw-chip[aria-pressed="true"] { border-color: var(--ember-soft); background: var(--ember-tint); color: var(--bone); }
.cw-confirm-acts { align-items: center; }
.cw-confirm-acts .btn { flex: 0 1 auto; }
.cw-confirm-acts .cw-link { align-self: center; }
.cw-next-line { font-size: 14px; line-height: 1.45; color: var(--bone-2); }
.cw-updated { font-weight: 600; color: var(--ember-soft); }
.cw-edit { display: grid; grid-template-columns: 1fr; gap: 10px; }
.cw-edit-f { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.cw-edit-f[hidden] { display: none; }
.cw-edit-l { font-size: 13px; font-weight: 600; line-height: 1.3; color: var(--bone-2); }
.cw-edit .cw-in { width: 100%; background: var(--surface-1); border-radius: var(--radius); }
.cw-edit textarea.cw-in { min-height: 64px; resize: vertical; line-height: 1.4; }
.cw-edit select.cw-in { appearance: auto; }
.cw-slow { border-color: var(--ember-line); }
.cw-slow .cw-card-row .btn, .cw-client .cw-card-row .btn { flex: 1 1 auto; }
/* a short screen (a phone on its side, 200% zoom): the conversation keeps the room; the two foot buttons share one row */
@media (max-height: 560px) {
  .cw-head { padding: 8px 8px 6px 12px; }
  .cw-head .nora-av { width: 32px; height: 32px; font-size: 15px; }
  .cw-foot { flex-wrap: nowrap; }
  .cw-person, .cw-book { flex: 1 1 0; min-width: 0; padding: 4px 10px; font-size: 14px; }
  .cw-person svg, .cw-book span[aria-hidden] { display: none; }
  .cw-note { padding-bottom: 6px; font-size: 12px; }
}
/* nora-record end */

/* ads-intake (24 Oct 2026): the Call now pill in the chat header */
.cw-call { margin-left: auto; margin-right: 8px; display: inline-flex; align-items: center; padding: 8px 12px; border-radius: 999px; border: 1px solid var(--ember-line); background: var(--ember-tint); color: var(--bone); font-weight: 600; font-size: 13px; line-height: 1; text-decoration: none; white-space: nowrap; }
.cw-call:hover { background: var(--ember-tint-2); }
@media (max-width: 380px) { .cw-call { padding: 8px 10px; font-size: 12px; } }