.header-appointment { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:9px 17px; color:var(--color-blue-strong); border:1px solid #a9c4dc; border-radius:var(--radius-control); font:700 14px var(--font-body); text-decoration:none; white-space:nowrap; }
.header-appointment:hover { background:var(--color-surface); border-color:var(--color-blue-strong); }
.mobile-appointment { display:none; }
.appointment-overlay { position:fixed; z-index:1000; inset:0; padding:20px; display:flex; align-items:center; justify-content:center; background:rgba(3,20,37,.68); }
body.appointment-open { overflow:hidden; }
.appointment-dialog { width:min(100%,620px); max-height:calc(100dvh - 40px); display:flex; flex-direction:column; overflow:hidden; color:var(--color-text); background:#fff; border:1px solid #d9e6f0; border-radius:16px; box-shadow:0 34px 90px rgba(1,18,35,.28); }
.appointment-top { padding:25px 29px 17px; display:flex; justify-content:space-between; gap:12px; flex:0 0 auto; }
.appointment-kicker { color:var(--color-blue-strong); font:800 11px var(--font-body); letter-spacing:.14em; }
.appointment-top h2 { margin:5px 0 4px; font:800 clamp(24px,3vw,29px)/1.2 var(--font-heading); }
.appointment-top p { margin:0; color:var(--color-muted); font-size:14px; line-height:1.45; }
.appointment-top .appointment-reassurance { margin-top:5px; color:#45647e; font-size:12px; }
.appointment-close { flex:0 0 38px; width:38px; height:38px; display:grid; place-items:center; color:var(--color-navy); background:#f2f7fb; border:1px solid var(--color-border); border-radius:50%; cursor:pointer; }
.appointment-close .icon { width:17px; height:17px; }
.appointment-progress { padding:0 29px 14px; color:var(--color-blue-strong); font:750 12px var(--font-body); flex:0 0 auto; }
.appointment-progress > div { height:3px; margin-top:8px; overflow:hidden; background:#dcebf7; border-radius:4px; }
.appointment-progress i { display:block; width:33.333%; height:100%; background:var(--color-blue); transition:width 210ms ease; }
.appointment-form { min-height:0; display:flex; flex-direction:column; }
.appointment-form .hp-field { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.appointment-step { min-height:0; overflow-y:auto; padding:5px 29px 14px; scrollbar-gutter:stable; }
.appointment-step h3 { margin:0 0 2px; font:800 21px/1.3 var(--font-heading); }
.appointment-step-intro { margin:0 0 15px; color:var(--color-muted); font-size:14px; }
.appointment-options { display:grid; gap:9px; }
.appointment-problems { grid-template-columns:repeat(2,minmax(0,1fr)); }
.appointment-choice { position:relative; min-width:0; min-height:74px; padding:12px; display:flex; align-items:flex-start; gap:11px; color:var(--color-text); background:#fbfdff; border:1.5px solid #cfdde9; border-radius:var(--radius-card); cursor:pointer; transition:background 200ms ease,border-color 200ms ease,box-shadow 200ms ease; }
.appointment-choice:hover { border-color:#75abe0; background:#f3f9ff; }
.appointment-choice:has(input:checked) { border-color:var(--color-blue-strong); background:#edf7ff; box-shadow:inset 0 0 0 1px var(--color-blue-strong); }
.appointment-choice:focus-within { outline:3px solid #70baff; outline-offset:2px; }
.appointment-choice input { position:absolute; width:1px; height:1px; opacity:0; }
.appointment-choice > span:nth-last-child(2) { min-width:0; flex:1; }
.appointment-choice strong { display:block; font:750 14px/1.3 var(--font-heading); }
.appointment-choice small { display:block; margin-top:4px; color:var(--color-muted); font-size:12px; line-height:1.35; }
.appointment-choice-icon { flex:0 0 26px; width:26px; height:26px; display:grid; place-items:center; color:var(--color-blue-strong); background:#e7f4ff; border-radius:7px; }
.appointment-choice-icon .icon { width:16px; height:16px; }
.appointment-choice-check { flex:0 0 20px; color:var(--color-blue-strong); opacity:0; }
.appointment-choice-check .icon { width:20px; height:20px; }
.appointment-choice:has(input:checked) .appointment-choice-check { opacity:1; }
.appointment-urgencies .appointment-choice { min-height:64px; align-items:center; }
.appointment-acute { margin:14px 0; padding:13px 15px; display:flex; align-items:center; gap:15px; justify-content:space-between; background:#e8f4ff; border:1px solid #9dc6e8; border-radius:var(--radius-card); }
.appointment-acute strong { font:800 15px var(--font-heading); }
.appointment-acute p { margin:2px 0 0; color:#435f79; font-size:12px; line-height:1.35; }
.appointment-acute .btn { min-height:42px; padding:9px 11px; flex:0 0 auto; font-size:12px; }
.appointment-acute .icon { width:16px; height:16px; }
.appointment-field { margin-top:14px; }
.appointment-field label { display:block; margin-bottom:6px; font:700 14px var(--font-body); }
.appointment-field label span { color:var(--color-muted); font-size:12px; font-weight:400; }
.appointment-field input,.appointment-field select,.appointment-field textarea { width:100%; min-height:48px; padding:10px 12px; color:var(--color-text); background:#fff; border:1px solid #aebfcd; border-radius:var(--radius-control); font:400 16px/1.4 var(--font-body); }
.appointment-field textarea { min-height:84px; resize:vertical; }
.appointment-field input[aria-invalid=true],.appointment-field select[aria-invalid=true] { border-color:var(--color-error); }
.appointment-field small { display:block; margin-top:4px; color:var(--color-muted); font-size:12px; }
.appointment-field-error { display:block; color:var(--color-error); font-size:12px; }
.appointment-more { margin-top:14px; }
.appointment-more summary { display:flex; align-items:center; gap:8px; width:max-content; color:var(--color-blue-strong); font:700 14px var(--font-body); cursor:pointer; }
.appointment-more summary::marker { content:''; }
.appointment-more summary .icon { width:15px; height:15px; }
.appointment-more[open] summary .icon { transform:rotate(180deg); }
.appointment-summary { margin-top:18px; padding:15px; background:#f2f8fd; border:1px solid #d6e7f4; border-radius:var(--radius-card); }
.appointment-summary h4 { margin:0 0 7px; font:800 15px var(--font-heading); }
.appointment-summary dl { margin:0; }
.appointment-summary dl > div { padding:5px 0; display:grid; grid-template-columns:100px minmax(0,1fr) auto; align-items:center; gap:8px; border-top:1px solid #dbe8f2; font-size:12px; }
.appointment-summary dt { color:var(--color-muted); }
.appointment-summary dd { min-width:0; margin:0; font-weight:700; overflow-wrap:anywhere; }
.appointment-summary button { padding:4px 0; color:var(--color-blue-strong); background:none; border:0; font:700 12px var(--font-body); text-decoration:underline; cursor:pointer; }
.appointment-privacy { margin:12px 0 0; color:var(--color-muted); font-size:12px; line-height:1.45; }
.appointment-privacy a { color:var(--color-blue-strong); }
.appointment-error { margin:0 29px 10px; padding:9px 11px; color:#872b29; background:#fff0ef; border-left:3px solid #b43c38; border-radius:4px; font-size:13px; }
.appointment-actions { padding:13px 29px 8px; display:flex; align-items:center; justify-content:flex-end; gap:12px; background:#fff; border-top:1px solid #e5edf4; flex:0 0 auto; }
.appointment-actions .btn { min-height:46px; }
.appointment-actions .btn .icon { width:16px; height:16px; }
.appointment-actions .btn:disabled { opacity:.48; cursor:not-allowed; }
.appointment-back { margin-right:auto; padding:8px; color:var(--color-blue-strong); background:none; border:0; font:700 14px var(--font-body); cursor:pointer; }
.appointment-submit-note { margin:0; padding:0 29px 15px; color:var(--color-muted); font-size:11px; line-height:1.35; text-align:right; }
.appointment-success,.appointment-abandon { padding:35px 29px; overflow-y:auto; text-align:center; }
.appointment-success-icon { width:48px; height:48px; margin:0 auto 15px; display:grid; place-items:center; color:#16734e; background:#e8f8ef; border-radius:50%; }
.appointment-success-icon .icon { width:26px; height:26px; }
.appointment-success h3,.appointment-abandon h3 { margin:0 0 8px; font:800 24px var(--font-heading); }
.appointment-success p,.appointment-abandon p { margin:0 auto 18px; max-width:410px; color:var(--color-muted); font-size:15px; }
.appointment-success > div,.appointment-abandon > div { display:flex; justify-content:center; gap:10px; flex-wrap:wrap; }
.appointment-success .icon { width:16px; height:16px; }
@media (max-width:1300px) { .header-appointment { display:none; } .mobile-appointment { display:flex; align-items:center; justify-content:space-between; margin:12px; padding:13px 15px!important; color:#fff!important; background:var(--color-blue-strong); border-radius:var(--radius-control); font-weight:700!important; } .mobile-appointment .icon { width:16px; } }
@media (max-width:640px) {
  .appointment-overlay { padding:0; align-items:flex-end; }
  .appointment-dialog { width:100%; height:min(96dvh,900px); max-height:100dvh; border-radius:18px 18px 0 0; border-bottom:0; }
  .appointment-top { padding:18px 18px 12px; }
  .appointment-top h2 { font-size:23px; }
  .appointment-top p { font-size:13px; }
  .appointment-progress { padding:0 18px 12px; }
  .appointment-step { padding:4px 18px 12px; }
  .appointment-problems { grid-template-columns:1fr; gap:8px; }
  .appointment-choice { min-height:65px; padding:10px 12px; }
  .appointment-choice small { margin-top:2px; }
  .appointment-actions { padding:12px 18px calc(10px + env(safe-area-inset-bottom)); }
  .appointment-submit-note { padding:0 18px calc(8px + env(safe-area-inset-bottom)); text-align:left; }
  .appointment-error { margin:0 18px 8px; }
  .appointment-acute { align-items:flex-start; flex-direction:column; gap:9px; }
  .appointment-acute .btn { width:100%; }
  .appointment-success,.appointment-abandon { padding:26px 18px calc(20px + env(safe-area-inset-bottom)); }
}
@media (max-width:360px) { .appointment-top h2 { font-size:21px; } .appointment-top .appointment-reassurance { font-size:11px; } .appointment-choice strong { font-size:13px; } }
@media (prefers-reduced-motion:reduce) { .appointment-progress i,.appointment-choice { transition:none; } }

/* Tap-through choices share the existing visual language. */
button.appointment-choice { width:100%; text-align:left; font:inherit; }
.appointment-choice[aria-pressed=true] { border-color:var(--color-blue-strong); background:#edf7ff; box-shadow:inset 0 0 0 1px var(--color-blue-strong); }
.appointment-choice[aria-pressed=true] .appointment-choice-check { opacity:1; }
.appointment-locations { grid-template-columns:repeat(2,minmax(0,1fr)); margin-top:16px; }
.appointment-city { min-height:48px; padding:11px 12px; align-items:center; }
.appointment-city:last-child { grid-column:1/-1; }
.appointment-city strong { font-size:13px; }
.appointment-optional-urgency { margin:18px 0 0; padding:0; border:0; }
.appointment-optional-urgency legend { margin-bottom:8px; font:700 14px var(--font-body); }
.appointment-optional-urgency legend span { font-weight:400; color:var(--color-muted); font-size:12px; }
.appointment-optional-urgency .appointment-choice { min-height:44px; padding:10px 12px; }
.appointment-more summary { width:auto; min-height:40px; }
@media (max-width:640px) {
  .appointment-problems { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .appointment-problems .appointment-choice { min-height:90px; padding:10px; gap:7px; }
  .appointment-problems .appointment-choice-icon { display:none; }
  .appointment-problems .appointment-choice-check { flex-basis:16px; }
  .appointment-problems .appointment-choice-check .icon { width:16px; height:16px; }
  .appointment-locations { gap:8px; }
  .appointment-city { min-height:48px; padding:10px; gap:6px; }
  .appointment-city .appointment-choice-check { flex-basis:16px; }
  .appointment-city .appointment-choice-check .icon { width:16px; height:16px; }
}
.appointment-form > .appointment-acute { margin:0 29px 12px; flex:0 0 auto; }
@media (max-width:640px) { .appointment-form > .appointment-acute { margin:0 18px 12px; } }
.appointment-summary dl > div { grid-template-columns:90px minmax(0,1fr); }
.appointment-summary dd { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.appointment-summary dd > span { min-width:0; }
.appointment-summary button { flex-shrink:0; }

/* Compact contact step: editable context above fields, clear submit area below. */
.appointment-context { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin:12px 0 18px; }
.appointment-context button { min-width:0; min-height:44px; display:flex; align-items:center; gap:7px; padding:9px 10px; color:var(--color-navy); background:var(--color-surface); border:1px solid var(--color-border); border-radius:var(--radius-control); font:650 12px/1.35 var(--font-body); text-align:left; cursor:pointer; }
.appointment-context button > span { flex:1; min-width:0; overflow-wrap:anywhere; }
.appointment-context .icon { flex:0 0 15px; width:15px; height:15px; color:var(--color-blue-strong); }
.appointment-context button:hover { border-color:var(--color-blue-strong); }
.appointment-context button:focus-visible { outline:2px solid var(--color-blue-strong); outline-offset:2px; }
.appointment-contact-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px 12px; }
.appointment-contact-grid .appointment-field { margin:0; min-width:0; }
.appointment-contact-grid .appointment-field:has([name=email], [name=message]) { grid-column:1/-1; }
.appointment-contact-grid label { font-size:13px; }
.appointment-contact-grid input, .appointment-contact-grid textarea { border-color:#c4d4e2; background:#fbfdff; }
.appointment-contact-grid input:focus, .appointment-contact-grid textarea:focus { border-color:var(--color-blue-strong); background:#fff; outline:2px solid #c5e3ff; outline-offset:1px; }
.appointment-contact-grid textarea { min-height:64px; }
@media (max-width:640px) { .appointment-dialog { height:auto; max-height:96dvh; } }