/* Existing live Quote Walk design language, base 28cfa412.
 * Shell, hero, cards, type and controls come from index.html and mobile-canvas.css.
 * Local adapters below support the new screen sequence without a new composition. */
.guided-walk .site-head img { height: 28px; max-width: 100%; width: auto; display: block; }
.guided-flow { min-width: 0; }
.guided-screen h2 { margin: 0 0 10px; color: var(--navy); font-family: var(--head); letter-spacing: -.02em; }
.guided-screen p { font-size: 16px; line-height: 1.55; }
.guided-screen .helper { color: var(--muted); margin: 0 0 22px; }
.guided-screen .cta { width: 100%; margin: 18px 0 0; }
.guided-echo { margin: 12px 0 0; color: var(--muted); }
.guided-save { margin: 12px 0 0; }
.guided-save [data-save-button] { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; margin: 0 auto; padding: 8px 12px; border: 0; border-radius: 8px; color: var(--navy); background: transparent; font-family: var(--body); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.guided-save svg { width: 18px; height: 18px; stroke-width: 2; }
.guided-save [data-save-button]:disabled { color: var(--muted); cursor: wait; }
.guided-save p { margin: 7px 0 0; color: var(--muted); font-size: 16px; }
.guided-save [data-save-status]:empty { display: none; }
.guided-help-links { display: flex; flex-direction: column; align-items: flex-start; margin-top: 14px; }
.guided-link { display: inline-flex; align-items: center; min-height: 44px; padding: 8px 0; border: 0; background: transparent; font-family: inherit; font-size: 16px; line-height: 1.4; color: var(--navy); text-decoration: underline; text-underline-offset: 3px; }
.guided-expectation { color: var(--muted); }
/* Equal side columns center the title independently of the back arrow. */
.guided-flow .qw-progress { display: grid; grid-template-columns: 44px minmax(0, 1fr) 44px; align-items: center; gap: 0; padding: 0 0 10px; margin-bottom: 20px; }
.guided-flow .qw-position { grid-column: 2; display: block; min-width: 0; margin: 0; padding: 0; white-space: normal; text-align: center; font: 800 28px/1.2 var(--head, Outfit, sans-serif); }
.guided-flow .qw-position strong { font-weight: 800; overflow-wrap: anywhere; }
.guided-flow .qw-progress:has([data-guided-back][hidden]) .qw-position { grid-column: 1 / -1; }
.guided-walk[data-active-screen]:not([data-active-screen="connection"]) .guided-hero,
.guided-walk[data-active-screen]:not([data-active-screen="connection"]) .proof-carousel { display: none; }
.guided-walk .field input, .guided-walk .field textarea, .guided-walk .consent-fine { font-size: 16px; line-height: 1.55; }
.guided-walk .addr-opt[aria-selected=true] { background: var(--gold-tint); outline: 2px solid var(--gold-ink); outline-offset: -2px; }
.guided-walk [data-help-examples] img { max-width: 100%; height: auto; }
/* Existing guide image and caption stay visible in a compact reference slot. */
.guided-outlet-reference { width: 240px; max-width: 100%; margin: 16px auto 0; text-align: center; }
.guided-outlet-reference img { display: block; width: 100%; height: auto; }
.guided-outlet-reference figcaption { margin-top: 8px; color: var(--muted); font-size: 16px; line-height: 1.4; }
.guided-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
/* Copy fallback reuses the live form-card radius, shadow, inputs and controls. */
.qw-save-dialog { width: min(440px, calc(100% - 32px)); max-height: calc(100dvh - 32px); padding: 24px 22px 26px; border: 0; border-radius: 20px; box-shadow: 0 18px 44px rgba(11,31,59,.14), 0 4px 12px rgba(11,31,59,.06); background: #fff; color: #0b1f3b; font-family: var(--body, Inter, sans-serif); }
.qw-save-dialog::backdrop { background: rgba(11,31,59,.55); }
.qw-save-dialog h2 { margin: 0 0 18px; font-family: var(--head, Outfit, sans-serif); font-size: 20px; }
.qw-save-dialog p { font-size: 16px; line-height: 1.5; }
.qw-save-dialog input { width: 100%; min-height: 52px; font-size: 16px; border: 0; padding: 0 16px; border-radius: 14px; background: #fafbfc; box-shadow: inset 0 0 0 1.5px rgba(11,31,59,.1); }
.qw-save-dialog button { min-height: 44px; padding: 10px 16px; margin-top: 12px; border: 0; border-radius: 100px; background: #ffba00; font-size: 16px; }
.qw-save-dialog [data-save-close] { background: transparent; text-decoration: underline; }
.qw-sms-submit-dialog { overflow: auto; }
.qw-sms-submit-dialog .guided-communication-choices { min-inline-size: 0; margin: 16px 0; padding: 0; border: 0; }
.qw-sms-submit-dialog .guided-communication-choice { display: flex; align-items: flex-start; gap: 12px; min-height: 44px; padding: 6px 0; font-size: 15px; line-height: 1.5; color: var(--text, #152b44); cursor: pointer; }
.qw-sms-submit-dialog .guided-communication-choice input { flex: 0 0 20px; width: 20px; height: 20px; min-height: 20px; margin: 2px 0 0; padding: 0; border-radius: 0; box-shadow: none; accent-color: var(--navy, #0b1f3b); appearance: auto; -webkit-appearance: auto; }
.qw-sms-submit-dialog .guided-choice-note { margin: 2px 0 6px 32px; color: var(--muted, #536174); font-size: 14px; line-height: 1.5; }
.qw-sms-submit-dialog .guided-communication-choices a { color: var(--navy, #0b1f3b); text-decoration: underline; text-underline-offset: 3px; }
.qw-sms-submit-dialog .qw-sms-submit-actions { display: grid; gap: 8px; }
.qw-sms-submit-dialog .qw-sms-submit-actions button { width: 100%; margin: 0; font: inherit; font-weight: 600; }
.qw-sms-submit-dialog .qw-sms-submit-actions .guided-link { background: transparent; color: var(--navy, #0b1f3b); text-decoration: underline; text-underline-offset: 3px; }
.qw-sms-submit-dialog [data-sms-submit-allow]:disabled { background: #e8edf2; color: #46566d; cursor: default; }
.qw-sms-submit-dialog :is(button, input, a):focus-visible { outline: 3px solid #005fcc; outline-offset: 3px; }
@media(min-width:1024px) {
  .guided-walk[data-active-screen]:not([data-active-screen="connection"]) .intro-card { display: contents; }
  .guided-walk[data-active-screen]:not([data-active-screen="connection"]) .site-head { min-height: 64px; border-radius: 18px; padding: 0 30px; }
  .guided-walk[data-active-screen]:not([data-active-screen="connection"]) .body-grid { margin-top: 18px !important; }
  .guided-walk[data-active-screen]:not([data-active-screen="connection"]) .guided-flow.form-card { padding: 0; border-radius: 0; background: transparent; box-shadow: none; }
}
@media(prefers-reduced-motion:reduce) {
  .guided-walk *, .guided-walk *::before, .guided-walk *::after,
  .guided-walk .page .room, .guided-walk .page .room .ric {
    scroll-behavior: auto !important;
    transition: none !important;
    animation: none !important;
  }
  .guided-walk .room:active, .guided-walk .choice:active { transform: none !important; }
}
/* Outlet choices copied from live connection.html. */
  .choices{display:grid;grid-template-columns:1fr 1fr;gap:12px}
  .choice{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:164px;padding:18px 11px 15px;text-align:center;background:var(--card);border-radius:var(--r-md);box-shadow:var(--shadow-sm),inset 0 0 0 1.5px var(--edge)}
  .choice:active{transform:scale(.98)}
  .choice img,.choice .connection-icon{width:96px;height:96px;object-fit:contain;display:block}
  .connection-icon-30{position:relative;overflow:hidden;border-radius:50%;background:#fff}
  .connection-icon-30::before{content:"";position:absolute;inset:0;background:var(--navy);-webkit-mask:url("/img/30amp-outlet-navy.png") center/contain no-repeat;mask:url("/img/30amp-outlet-navy.png") center/contain no-repeat}
  .choice strong{font-family:var(--head);font-size:18px;color:var(--navy)}
  .choice .shape{font-size:13px;font-weight:600;color:var(--navy-mid)}
  .choice .truth{font-size:13px;line-height:1.4;color:var(--muted)}
  .choice[aria-pressed=true]{background:#fff8ec;box-shadow:var(--shadow-md),inset 0 0 0 2.5px var(--gold)}
  .choice[aria-pressed=true]::after{content:"✓";position:absolute;top:10px;right:10px;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--gold);color:var(--navy);font-size:15px;font-weight:900}
/* Reused location.html room and panel-example primitives. */
  .rooms {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }
  .room {
    position: relative;
    display: flex;
    align-items: center;
    gap: 11px;
    min-height: 58px;
    padding: 10px 14px 10px 16px;
    background: var(--card);
    border-radius: var(--r-md);
    box-shadow: var(--shadow-sm), inset 0 0 0 1.5px var(--edge);
    font-family: var(--head);
    font-size: 16px;
    font-weight: 600;
    color: var(--navy);
    text-align: left;
    overflow: hidden;
    transition: box-shadow var(--dur) var(--ease), background var(--dur) var(--ease), color var(--dur) var(--ease), transform var(--dur) var(--ease);
  }
  .room::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background: var(--gold);
    transform: scaleY(0);
    transform-origin: center;
    transition: transform var(--dur) var(--ease);
  }
  .room:active { transform: scale(0.98); }
  .room .ric {
    width: 30px;
    height: 30px;
    flex: 0 0 auto;
    border-radius: 9px;
    background: var(--sunken);
    color: var(--navy-mid);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background var(--dur) var(--ease), color var(--dur) var(--ease);
  }
  .room .ric svg { width: 16px; height: 16px; stroke-width: 1.8; }
  .room[aria-pressed="true"] {
    background: #fff8ec;
    color: var(--navy);
    box-shadow: var(--shadow-md), inset 0 0 0 2.5px var(--gold);
  }
  .room[aria-pressed="true"]::before { content: none; }
  .room[aria-pressed="true"] .ric {
    background: transparent;
    color: var(--navy);
  }
  .room.room--wide { grid-column: 1 / -1; }
  .room-copy { display: flex; min-width: 0; flex-direction: column; gap: 2px; }
  .room-copy strong { font: inherit; }
  .room-sub { color: var(--muted); font-family: var(--body); font-size: 13px; font-weight: 500; line-height: 1.3; }
  .room[aria-pressed="true"] .room-sub { color: var(--muted); }
  .rooms.is-collapsed { grid-template-columns: 1fr; }
  .rooms.is-collapsed .room:not([aria-pressed="true"]) { display: none; }
  .panel-examples {
    width: 100%;
    max-width: 440px;
    margin: 0 auto;
  }
  .panel-example-images {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }
  .panel-example-images img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 1;
    object-fit: cover;
    border-radius: 12px;
    box-shadow: var(--shadow-sm), inset 0 0 0 1px var(--edge);
  }
  .panel-examples figcaption {
    margin-top: 9px;
    color: var(--muted);
    font-size: 13.5px;
    line-height: 1.4;
    text-align: center;
  }

/* Reused distance.html diagram and option primitives, including their color
 * token and the original 24px separation between the diagram and choices. */
.guided-screen[data-screen="distance"] { --navy-soft: #44587a; }
.guided-screen[data-screen="distance"] .explain + .opts { margin-top: 24px; }
  .explain { display: flex; flex-direction: column; gap: 14px; }
  .explain .lead {
    font-size: 16px;
    line-height: 1.55;
    color: var(--muted);
    margin: 0;
  }
  .explain .lead b { color: var(--text); font-weight: 600; }

  .diagram {
    background: var(--sunken);
    border-radius: var(--r-lg);
    box-shadow: inset 0 0 0 1px var(--edge-soft);
    padding: 20px 18px 16px;
  }
  .dia-track { display: flex; align-items: center; gap: 0; }
  .dia-ico {
    flex: 0 0 auto;
    width: 56px;
    height: 56px;
    border-radius: 14px;
    background: var(--card);
    box-shadow: var(--shadow-sm);
    overflow: hidden;
  }
  .dia-ico img { width: 100%; height: 100%; object-fit: cover; display: block; }
  /* solid gray line bridging the panel, distance, and connection box */
  .dia-line { flex: 1 1 auto; height: 2px; border-radius: 2px; background: var(--navy-soft); opacity: 0.4; }
  .dia-mid {
    flex: 0 0 auto;
    min-width: 58px;
    min-height: 42px;
    padding: 7px 9px;
    border-radius: 11px;
    background: var(--card);
    box-shadow: var(--shadow-sm), inset 0 0 0 1px var(--edge);
    color: var(--navy);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: var(--head);
    font-size: 14px;
    font-weight: 700;
    line-height: 1.1;
    text-align: center;
  }
  .dia-mid.is-pending { font-size: 20px; color: var(--faint); }
  .dia-foot { display: flex; align-items: flex-start; justify-content: space-between; margin-top: 10px; gap: 8px; }
  .dia-lbl {
    font-family: var(--head);
    font-size: 14px;
    font-weight: 700;
    color: var(--navy);
    line-height: 1.25;
    max-width: 48%;
  }
  .dia-foot .dia-lbl:first-child { text-align: left; }
  .dia-foot .dia-lbl:last-child { text-align: right; }
  .dia-lbl span {
    display: block;
    font-family: var(--body);
    font-size: 13px;
    font-weight: 500;
    color: var(--faint);
    margin-top: 2px;
  }
  .dia-cue {
    margin-top: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 9px 14px;
    background: var(--gold-tint);
    border-radius: var(--r-pill);
    font-family: var(--head);
    font-size: 13.5px;
    font-weight: 700;
    color: var(--gold-ink);
  }
  .dia-cue svg { width: 15px; height: 15px; stroke-width: 2.4; color: var(--gold-ink); }

  .opts { display: flex; flex-direction: column; gap: 10px; }
  .opt {
    display: flex;
    align-items: center;
    gap: 14px;
    width: 100%;
    min-height: 60px;
    padding: 12px 16px;
    background: var(--card);
    border-radius: var(--r-md);
    box-shadow: var(--shadow-sm), inset 0 0 0 1.5px var(--edge);
    text-align: left;
    transition: box-shadow var(--dur) var(--ease), background var(--dur) var(--ease), transform var(--dur) var(--ease);
  }
  .opt:active { transform: scale(0.985); }
  .cord { order: 2; flex: 0 0 auto; width: 84px; height: 16px; display: flex; align-items: center; }
  .cord .plug {
    width: 8px;
    height: 13px;
    border-radius: 2.5px;
    background: var(--navy-soft);
    flex: 0 0 auto;
    transition: background var(--dur) var(--ease);
  }
  .cord .run {
    height: 3px;
    border-radius: 2px;
    background: var(--navy-soft);
    opacity: 0.5;
    width: var(--w, 14px);
    transition: background var(--dur) var(--ease), opacity var(--dur) var(--ease);
  }
  .cord .qm {
    font-family: var(--head);
    font-size: 18px;
    font-weight: 800;
    color: var(--faint);
    line-height: 1;
    margin-left: 2px;
    transition: color var(--dur) var(--ease);
  }
  .opt .lbl { order: 1; flex: 1 1 auto; font-family: var(--head); font-size: 16px; font-weight: 700; color: var(--navy); }
  .opt .tick {
    order: 3;
    flex: 0 0 auto;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    box-shadow: inset 0 0 0 2px var(--edge);
    display: flex;
    align-items: center;
    justify-content: center;
    color: transparent;
    transition: background var(--dur) var(--ease), box-shadow var(--dur) var(--ease), color var(--dur) var(--ease);
  }
  .opt .tick svg { width: 12px; height: 12px; stroke-width: 3; }
  .opt[aria-pressed="true"] { background: #fff8ec; box-shadow: var(--shadow-md), inset 0 0 0 2.5px var(--gold); }
  .opt[aria-pressed="true"] .lbl { color: var(--navy); }
  .opt[aria-pressed="true"] .cord .plug { background: var(--navy); }
  .opt[aria-pressed="true"] .cord .run { background: var(--navy); opacity: 0.95; }
  .opt[aria-pressed="true"] .cord .qm { color: var(--navy); }
  .opt[aria-pressed="true"] .tick { background: var(--gold); box-shadow: none; color: var(--navy); }


/* Required multiline address and accessibility behavior. */
.guided-walk .addr-opt { min-height: 52px; height: auto; font-size: 16px; white-space: normal; }
.guided-walk .addr-opt .lines { min-width: 0; }
.guided-walk .addr-opt .a1, .guided-walk .addr-opt .a2 { white-space: normal; overflow-wrap: anywhere; }
.guided-walk .addr-opt .a2 { font-size: 16px; }
.guided-walk textarea[data-f="addr"] { resize: none; overflow: hidden; }
/* Required narrow-screen reflow for the existing hero wording. */
.guided-walk .hero h1 .hero-line { white-space: normal; }
/* Use the existing hero text area before wrapping, including on desktop. */
.guided-walk .page[data-screen-label="Landing page (interactive, mobile)"] .hero h1 { max-width: 100% !important; }

/* Preserve full choice labels at narrow reflow widths. */
@media(max-width:359px) { .guided-walk .rooms { grid-template-columns: 1fr; } }

/* Reuse the outlet selection treatment without changing answer-card geometry.
   The panel icon slot holds the same check badge, leaving full label room. */
.guided-walk .page .room[aria-pressed="true"],
.guided-walk .page .room[aria-pressed="true"]:is(:hover, :active, :focus, :focus-visible) {
  background: #fff8ec !important;
  color: var(--navy) !important;
}
.guided-walk .page .room[aria-pressed="true"] .ric,
.guided-walk .page .room[aria-pressed="true"]:is(:hover, :active) .ric {
  position: relative;
  background: transparent !important;
  color: var(--navy) !important;
}
.guided-walk .room[aria-pressed="true"] .ric svg { visibility: hidden; }
.guided-walk .room[aria-pressed="true"] .ric::after {
  content: "✓";
  position: absolute;
  inset: 3px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--gold);
  color: var(--navy);
  font-size: 15px;
  font-weight: 900;
}

/* Opening v2: translated from the generated BPP composition, using the existing
 * shell, card, outlet, type and shadow primitives. Only the opening is compact. */
.guided-walk .page .guided-hero .textzone { padding-top: 14px !important; padding-bottom: 20px !important; }
.guided-walk .page .guided-hero h1 { max-width: none; font-size: 24px !important; line-height: 1.12 !important; font-weight: 750; }
.guided-walk .page .guided-hero .sub { margin-top: 8px; font-size: 16px; line-height: 1.45; }
.guided-walk .page .guided-hero .identity { grid-template-columns: 92px minmax(0, 1fr); gap: 14px; margin-top: 12px; }
.guided-walk .page .guided-hero .portrait { width: 92px; height: 92px; margin: 0; border-width: 3px; }
.guided-walk .page .guided-hero .identity strong { font-family: "Dancing Script Review", "Dancing Script", cursive; font-size: 25px; line-height: 1.05; font-weight: 700; }
.guided-walk .page .guided-hero .identity div > span { font-size: 11px; line-height: 1.3; letter-spacing: .08em; text-transform: uppercase; }
.guided-walk[data-active-screen="connection"] .page > .body-grid { padding-top: 16px !important; }
.guided-walk[data-active-screen="connection"] .guided-flow.form-card { padding: 20px; }
.guided-screen[data-screen="connection"] h2 { font-size: 22px !important; line-height: 1.2 !important; margin-bottom: 8px; }
.guided-screen[data-screen="connection"] .helper { margin-bottom: 0; line-height: 1.45; }
.guided-screen .guided-save--opening { display: flex; flex-wrap: wrap; align-items: center; gap: 0 4px; margin: 0 0 4px; }
.guided-screen .guided-save--opening [data-save-hint] { margin: 0; font-size: 16px; line-height: 1.4; }
.guided-screen .guided-save--opening [data-save-button] { margin: 0 !important; padding: 8px 0 !important; font-size: 16px !important; }
.guided-screen .guided-save--opening [data-save-status] { flex-basis: 100%; }
.guided-screen[data-screen="connection"] .guided-echo:empty { display: none; }
.guided-screen[data-screen="connection"] .guided-expectation { margin: 16px 0 0; font-size: 16px; line-height: 1.45; }
.guided-screen[data-screen="connection"] .cta { margin-top: 12px; }
.guided-offer-summary { margin: 0 20px; padding: 4px 20px; border-radius: var(--r-lg); background: var(--card); box-shadow: var(--shadow-sm); }
.guided-offer-row { display: flex; align-items: flex-start; gap: 14px; padding: 18px 0; }
.guided-offer-row + .guided-offer-row { border-top: 1px solid var(--edge-soft); }
.guided-offer-row > svg { width: 28px; height: 28px; flex: 0 0 28px; color: var(--navy); }
.guided-offer-row h2 { margin: 0 0 6px; font: 700 18px/1.3 var(--head); letter-spacing: -.02em; color: var(--navy); }
.guided-offer-row p { margin: 0; font-size: 16px; line-height: 1.5; color: var(--muted); }
.guided-walk[data-active-screen]:not([data-active-screen="connection"]) .guided-offer-summary { display: none; }
@media (min-width: 1024px) {
  .guided-walk[data-active-screen="connection"] .page[data-screen-label] { grid-template-columns: minmax(0, 1fr) !important; grid-template-areas: "intro" "form" "proof" "foot" !important; width: min(760px, calc(100vw - 64px)) !important; max-width: 760px !important; }
  .guided-walk .page .guided-hero .textzone { padding: 30px 30px 38px !important; justify-content: flex-start; }
  .guided-walk .page .guided-hero h1 { font-size: 36px !important; line-height: 1.1 !important; }
  .guided-walk .page .guided-hero .sub { font-size: 18px; margin-top: 16px; }
  .guided-walk .page .guided-hero .identity { margin-top: 24px; }
  .guided-walk[data-active-screen="connection"] .page .intro-card { height: auto; }
  .guided-walk[data-active-screen="connection"] .page > .body-grid { padding-top: 0 !important; }
  .guided-walk[data-active-screen="connection"] .guided-flow.form-card { padding: 28px; justify-content: flex-start; }
  .guided-offer-summary { grid-area: proof; margin: 0; padding: 6px 28px; }
  .guided-offer-row { gap: 18px; }
}

/* Reuse the current photo/card language for tangible installation proof. */
.guided-offer-proof { display: grid; gap: 20px; margin: 0 20px; }
.guided-offer-proof .guided-offer-summary { margin: 0; }
.guided-install-photo { margin: 0; padding: 16px; background: var(--card); border-radius: var(--r-lg); box-shadow: var(--shadow-sm); }
.guided-install-photo img { display: block; width: 100%; height: 180px; object-fit: cover; object-position: 50% 42%; border-radius: var(--r-md); }
.guided-install-photo figcaption { margin: 12px 0 0; color: var(--muted); font-size: 16px; line-height: 1.45; }
.guided-walk[data-active-screen]:not([data-active-screen="connection"]) .guided-offer-proof { display: none; }
@media (min-width: 1024px) {
  .guided-offer-proof { grid-area: proof; grid-template-columns: minmax(0, 1fr); margin: 0; gap: 22px; }
  .guided-offer-proof .guided-offer-summary { grid-area: auto; }
  .guided-install-photo img { height: 320px; }
}

/* Compact scope line reuses the hero supporting-copy treatment. */
.guided-walk .page .guided-hero .guided-offer-inline { margin: 12px 0 0; color: var(--gold); font-size: 16px; line-height: 1.4; }

/* The combined page reuses the saved estimate/card layout and existing form. */
.guided-walk[data-active-screen="contact"] .guided-flow.form-card { padding: 0; border-radius: 0; background: transparent; box-shadow: none; }
.guided-walk[data-active-screen="contact"] .qw-progress { padding-inline: 20px; }
.guided-walk [data-contact-text-later] { display: flex; justify-content: center; margin: 12px auto 0; text-align: center; }
.guided-walk [data-contact-text-later]:disabled { color: var(--muted); cursor: default; }
.guided-walk [data-estimate-status]:not(:empty) { padding: 20px; }
.guided-walk [data-contact-card] .helper { margin: 10px 0 22px; }
.guided-walk [data-screen="recovery"] > .guided-link { display: flex; }

/* Gold stays the action accent. Navy gives focus and input boundaries enough
   contrast against the existing light cards, including mobile override rules. */
.guided-walk :is(button, a, input, textarea, [tabindex="-1"]):focus-visible,
.guided-walk .field :is(input, textarea):focus-visible,
.guided-walk .page[data-screen-label] .field[data-addr-field] textarea:focus-visible,
.qw-save-dialog :is(button, input):focus-visible {
  outline: 3px solid var(--navy, #0b1f3b) !important;
  outline-offset: 3px;
}
.guided-walk .site-head a:focus-visible,
.guided-walk .guided-estimate-card [tabindex="-1"]:focus-visible {
  outline-color: var(--gold, #ffba00) !important;
}
.guided-walk .page[data-screen-label] .field :is(input, textarea), .qw-save-dialog input {
  border: 1px solid var(--muted, #4d5a6e) !important;
}
.guided-walk .page[data-screen-label] .field.has-error :is(input, textarea),
.guided-walk .page[data-screen-label] .field :is(input, textarea)[aria-describedby~="guided-submit-error"] {
  border-color: var(--red, #dc2626) !important;
}
@media (forced-colors: active) {
  .guided-walk :is(button, a, input, textarea, [tabindex="-1"]):focus-visible,
  .qw-save-dialog :is(button, input):focus-visible { outline-color: Highlight !important; }
  .guided-walk :is(.choice, .room, .opt)[aria-pressed="true"] { border: 2px solid Highlight; }
}

/* Estimate, required photo and contact reveal form one calm reading order. */
.guided-walk [data-screen="contact"] .guided-range-layout { display: flex; flex-direction: column; max-width: none; width: 100%; margin-inline: auto; }
.guided-walk [data-screen="contact"] .guided-range-layout > * { width: 100%; }
.guided-walk [data-screen="contact"] .initial-panel-photo { margin: 0; }
.guided-walk [data-initial-range-choice] { background: #fff; }
.guided-walk [data-initial-range-choice] h2 { margin-top: 0; }
.guided-walk [data-initial-range-choice] p { font-size: 16px; line-height: 1.55; }
.guided-walk .guided-contact-revealed [data-initial-range-choice] { padding-block: 14px; background: #f4f6fa; box-shadow: none; }
.guided-walk .guided-contact-revealed [data-initial-range-choice] > h2,
.guided-walk .guided-contact-revealed [data-initial-range-choice] > p:not([data-initial-range-hint]) { display: none; }
.guided-walk .guided-contact-revealed [data-initial-range-hint] { margin: 0; color: #24513b; }
.guided-walk #contact-heading { scroll-margin-top: 24px; }
/* The existing photo box becomes the form box; its height follows its content. */
.guided-request-card { min-width: 0; }
.guided-walk .guided-request-card.guided-request-form { padding: 22px; border: 1px solid #d8e0ec; border-radius: var(--r-lg); background: var(--card, #fff); box-shadow: var(--shadow-sm); }
.guided-walk [data-screen="contact"] [data-request-card].guided-request-form > [data-initial-panel-photo],
.guided-walk .guided-request-form [data-contact-card] { padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.guided-walk [data-screen="contact"] [data-request-card].guided-request-form > [data-initial-panel-photo] h2 { margin: 0 0 8px; font-size: 16px !important; line-height: 1.4; }
.guided-walk [data-request-card].guided-request-form > [data-initial-panel-photo] h2::before { width: 24px; height: 24px; margin-right: 6px; }
.guided-walk [data-request-card].guided-request-form .initial-photo-preview { margin-block: 8px; gap: 10px; }
.guided-walk [data-request-card].guided-request-form .initial-photo-preview img { width: 48px; height: 48px; flex-basis: 48px; }
.guided-walk [data-request-card].guided-request-form > [data-initial-panel-photo] .initial-photo-preview figcaption { flex-basis: 10em; font-size: 14px; }
.guided-walk .guided-request-form [data-contact-card] { margin-top: 16px; }
.guided-walk .guided-request-form #contact-heading { border-radius: var(--r-md); }
/* Keep field content and its validation mark together when text is enlarged. */
.guided-walk [data-contact-card] .field { display: grid; grid-template-columns: minmax(0, 1fr); }
.guided-walk [data-contact-card] .field label { grid-area: 1 / 1; }
.guided-walk [data-contact-card] .field input,
.guided-walk [data-contact-card] .field textarea { grid-area: 2 / 1; min-height: calc(1.5em + 28px); }
.guided-walk [data-contact-card] .field .ok-mark { position: static; grid-area: 2 / 1; justify-self: end; align-self: center; margin-right: 14px; z-index: 1; }
.guided-walk [data-contact-card] .guided-draft-note { margin: 16px 0 0; text-align: left; color: var(--muted); font-size: 14px; line-height: 1.5; }
/* One form heading and one submit action; consent and recovery stay explicit. */
.guided-walk [data-contact-card] #contact-heading { margin: 0 0 22px; font: 700 24px/1.2 var(--head); }
.guided-walk [data-contact-card] .submit-row { gap: 12px; margin-top: 16px; }
.guided-walk [data-contact-card] .guided-communication-choices { min-inline-size: 0; margin: 0; padding: 0; border: 0; }
.guided-walk [data-contact-card] .guided-contact-workflow { margin: 0; }
.guided-walk [data-contact-card] .guided-communication-choices legend { padding: 0; margin: 0 0 2px; font: 600 16px/1.4 var(--head); color: var(--navy); }
.guided-walk [data-contact-card] .submit-row > .cta { margin: 4px 0 0; }
.guided-walk [data-contact-card] .guided-form-options { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 4px 24px; }
.guided-walk [data-contact-card] [data-edit-initial-photo][hidden] { display: none !important; }
.guided-walk [data-contact-card] .guided-draft-details { flex: 1 1 12em; min-width: 0; }
.guided-walk [data-contact-card] .guided-draft-details:has([data-unsent-draft-note][hidden]) { display: none; }
.guided-walk [data-contact-card] .guided-draft-details > summary { display: list-item; width: fit-content; min-height: 44px; padding: 10px 0; color: var(--navy); font-size: 14px; line-height: 24px; cursor: pointer; }
.guided-walk [data-contact-card] .guided-draft-details .guided-draft-note { margin: 4px 0 0; }
.guided-walk [data-contact-card] .guided-draft-details > summary:focus-visible,
.guided-walk [data-estimate-confirmation] .guided-confirmation-utilities > summary:focus-visible { outline: 3px solid var(--navy); outline-offset: 3px; border-radius: 4px; }
.guided-walk [data-estimate-confirmation][data-confirmation-layout="minimal"] > h2 { margin-bottom: 12px; font-weight: 700; }
.guided-walk [data-estimate-confirmation][data-confirmation-layout="minimal"] .guided-confirmation-status { margin: 0; color: var(--muted); }
.guided-walk [data-estimate-confirmation][data-confirmation-layout="minimal"] > .guided-review-expectation { margin: 18px 0 0; color: var(--navy); }
.guided-walk [data-estimate-confirmation][data-confirmation-layout="minimal"] .guided-power-guide-receipt { margin: 22px 0 0; padding: 0; border: 0; }
.guided-walk [data-estimate-confirmation][data-confirmation-layout="minimal"] .guided-power-guide-receipt h3 { font: 600 19px/1.3 var(--head); }
.guided-walk [data-estimate-confirmation] .guided-confirmation-utilities { margin-top: 20px; padding-top: 4px; border-top: 1px solid var(--edge); }
.guided-walk [data-estimate-confirmation] .guided-confirmation-utilities > summary { min-height: 44px; padding: 10px 0; color: var(--navy); font-size: 15px; line-height: 24px; cursor: pointer; }
.guided-walk [data-estimate-confirmation] .guided-confirmation-utilities p { color: var(--muted); font-size: 15px; }
.guided-walk [data-estimate-confirmation] .guided-confirmation-utilities .guided-optional-photos { margin: 16px 0 0; padding: 0; border: 0; background: transparent; box-shadow: none; }
.guided-walk [data-estimate-confirmation] .guided-confirmation-utilities .guided-optional-photos h3 { margin: 0 0 8px; color: var(--navy); font: 600 18px/1.3 var(--head); }
.guided-walk .foot nav { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; column-gap: 16px; row-gap: 8px; }

/* Keep the identity/rating readable when text is enlarged on narrow screens. */
.guided-walk .page .guided-hero .identity > div { min-width: 0; }
.guided-walk .page .guided-hero .identity-rating { flex-wrap: wrap; min-width: 0; line-height: 1.35; }
.guided-walk .page .guided-hero .identity-rating em { white-space: normal; overflow-wrap: anywhere; }
.guided-walk .page .guided-hero .identity strong { overflow-wrap: anywhere; }

/* The estimate stays in place while its request box changes state. */
.guided-walk [data-estimate-confirmation] h2 { margin: 0 0 16px; font: 750 24px/1.2 var(--head); letter-spacing: -.02em; color: var(--navy); }
.guided-walk [data-estimate-confirmation] p { font-size: 16px; line-height: 1.55; }
.guided-walk [data-estimate-confirmation] .guided-received-owner { display: flex; align-items: flex-start; gap: 12px; margin: 0 0 12px; }
.guided-walk [data-estimate-confirmation] .guided-received-owner-photo { flex: 0 0 40px; width: 40px; height: 40px; border-radius: 50%; object-fit: cover; object-position: center 42%; }
.guided-walk [data-estimate-confirmation] .guided-received-owner-copy { min-width: 0; }
.guided-walk [data-estimate-confirmation] .guided-received-owner-name { margin: 0; font-weight: 600; }
.guided-walk [data-estimate-confirmation] .guided-received-thanks { margin: 0; overflow-wrap: anywhere; }
.guided-walk [data-request-card] > [data-screen="recovery"] h2 { margin-top: 0; }
.guided-walk [data-request-card] > [data-screen="recovery"] .guided-save { margin-top: 16px; }
.guided-walk [data-terminal-edit-cancel] { margin-top: 16px; }
.guided-walk [data-request-phase="confirmed"] .guided-panel-receipt { margin-top: 0; }
/* Reuse the saved-estimate navy treatment in the current quote sequence. */
.guided-walk [data-screen="contact"] .guided-estimate-card.guided-estimate-summary { background: #0b1f3b; color: #fff; border-color: #0b1f3b; }
.guided-walk [data-screen="contact"] .guided-estimate-card.guided-estimate-summary h1 { color: #fff; }
.guided-walk [data-screen="contact"] .guided-estimate-card.guided-estimate-summary .guided-amount { color: #ffba00; }
.guided-walk [data-screen="contact"] .guided-estimate-card.guided-estimate-summary :is(.guided-range-basis, .guided-range-caption, .guided-range-condition) { color: #dbe5f2; }
.guided-walk [data-screen="contact"] .guided-estimate-card.guided-estimate-summary .guided-range-condition { border-color: #63748c; }
.guided-walk [data-estimate-layout]:has([data-request-phase="confirmed"]) [data-power-guide-teaser] { display: none; }
.guided-walk .guided-guide-opening { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; margin: 18px 0 0; padding: 12px 14px; border: 1px solid #dfb745; border-radius: var(--r-md); background: #fff4cc; color: var(--navy); text-align: left; }
.guided-walk #mainPage .guided-guide-opening,
.guided-walk #mainPage .guided-guide-opening * { color: #000; }
.guided-walk .guided-guide-opening > p { flex: 1 1 10em; margin: 0; min-width: 0; color: inherit; font: 400 15px/1.5 var(--body); }
.guided-walk .guided-guide-opening strong { display: block; font: inherit; font-weight: 700; }
.guided-walk .guided-guide-offer-copy { display: block; margin-top: 6px; }
.guided-walk .guided-guide-preview { position: relative; flex: 0 0 50px; width: 50px; height: 70px; margin-inline: 3px; }
.guided-walk .guided-guide-preview img { position: absolute; top: 4px; left: 0; width: 48px; height: 62px; border: 1px solid #d4c59f; border-radius: 3px; background: #fff; object-fit: contain; box-shadow: 0 3px 7px rgba(11,31,59,.16); }
.guided-walk .guided-guide-preview img:first-child { z-index: 1; transform: rotate(-5deg); }
.guided-walk .guided-guide-preview img:last-child { left: 6px; transform: rotate(5deg); }
@media(max-width:479px) {
  .guided-walk .guided-guide-opening { gap: 12px; padding: 10px 12px; }
  .guided-walk .guided-guide-preview { flex-basis: 40px; width: 40px; height: 56px; }
  .guided-walk .guided-guide-preview img { width: 38px; height: 49px; }
}
.guided-walk .guided-communication-choices { margin: 18px 0; text-align: left; }
.guided-walk .guided-communication-choice { display: flex; align-items: flex-start; gap: 12px; min-height: 44px; padding: 6px 0; font-size: 15px; line-height: 1.5; font-weight: 400; color: var(--text); cursor: pointer; }
.guided-walk .guided-communication-choice input { flex: 0 0 20px; width: 20px; height: 20px; margin: 2px 0 0; accent-color: var(--navy); appearance: auto; -webkit-appearance: auto; }
.guided-walk .guided-communication-choice input:focus-visible { outline: 3px solid var(--navy); outline-offset: 4px; }
.guided-walk .guided-communication-choices .guided-choice-note { margin: 2px 0 6px 32px; color: var(--muted); font-size: 14px; line-height: 1.5; }
.guided-walk .guided-communication-choices .guided-choice-note:last-child { margin-bottom: 0; }
.guided-walk .guided-communication-choices a { text-decoration: underline; text-underline-offset: 3px; color: var(--navy); }
.guided-walk .guided-power-guide-receipt { margin: 20px 0; padding-block: 18px; border-block: 1px solid var(--edge); }
.guided-walk .guided-power-guide-receipt h3 { margin: 0; font: 700 19px/1.35 var(--head); color: var(--navy); }
.guided-walk .guided-power-guide-receipt p { margin: 8px 0 4px; overflow-wrap: anywhere; }
.guided-walk .guided-power-guide-receipt .guided-link { display: inline-flex; align-items: center; min-height: 44px; padding: 4px 0; }

.guided-walk [data-guided-back][hidden] { display: none !important; }

/* Keep the mobile Safari canvas light in portrait and landscape.
   Fixed paint strips were omitted so content and focus remain unobstructed. */
@media (hover: none) and (pointer: coarse) {
  html:has(> body.guided-walk), body.guided-walk { background: var(--page, #fafbfc); }
}
