/* Presentation only. Quote, pricing, booking and consent rules live in their engines. */
html body.quote-page { background: var(--atlas-canvas); }
.atlas-quote-main { max-width: 1136px; margin: 40px auto 64px; padding: 0 28px; }
.atlas-quote-layout { display: grid; grid-template-columns: minmax(0,660px) minmax(220px,1fr); gap: 48px; align-items: start; }
.atlas-quote-panel { min-width: 0; padding: 38px; background: #fff; border: 1px solid #e7e7ec; border-radius: 24px; box-shadow: 0 6px 30px #1d1d1f04; }
.atlas-quote-progress { margin-bottom: 28px; }
.atlas-quote-progress ol { display: flex; padding: 0; margin: 0; list-style: none; gap: 10px; }
.atlas-quote-progress li { flex: 1; min-width: 0; padding: 12px 0; border-bottom: 2px solid #dedee4; color: var(--atlas-muted); font-size: 13px; }
.atlas-quote-progress li[aria-current=step] { border-color: var(--atlas-green); color: var(--atlas-green); font-weight: 600; }
.atlas-quote-progress li.is-complete { border-color: #9abca4; color: var(--atlas-green); }
.atlas-quote-progress .atlas-step-number { margin-right: 5px; }
html body.quote-page .quote-step { animation: atlas-step-in 200ms var(--atlas-ease); }
html body.quote-page .quote-step>.progress-track { display: none; }
html body.quote-page .quote-step>.text-center { text-align: left; }
html body.quote-page .quote-step h1 { font-size: clamp(28px,3vw,38px); color: var(--atlas-ink); font-weight: 600; letter-spacing: -.04em; line-height: 1.12; }
html body.quote-page .quote-step h1:focus { outline: none; }
html body.quote-page .quote-step :is(.text-gray-500,.text-gray-400) { color: var(--atlas-muted); }
html body.quote-page .quote-step>div>p { font-size: 15px; }
html body.quote-page .quote-step label { font-size: 13px; font-weight: 500; text-transform: none; letter-spacing: 0; color: var(--atlas-ink); }
html body.quote-page :is(.damage-card,.side-card,.schedule-card,.time-window-card) {
  border: 1px solid #d5d5dc; border-radius: 16px; background: #fff; box-shadow: none;
  transition: border-color 180ms, background-color 180ms; transform: none;
}
html body.quote-page .damage-card { min-height: 132px; padding: 20px 12px; gap: 12px; }
html body.quote-page :is(.damage-card,.side-card,.schedule-card,.time-window-card):hover { border-color: #8c9e91; box-shadow: none; transform: none; }
html body.quote-page :is(.damage-card,.side-card,.schedule-card,.time-window-card).selected { border-color: var(--atlas-green); background: #f1f7f3; box-shadow: 0 0 0 1px var(--atlas-green); }
html body.quote-page .damage-card .damage-icon { background: transparent; width: 44px; height: 36px; border-radius: 0; }
html body.quote-page .damage-card.selected .damage-icon { background: transparent; }
html body.quote-page .damage-card .damage-icon svg { width: 38px; height: 34px; color: var(--atlas-ink); }
html body.quote-page .damage-card.selected .damage-icon svg { color: var(--atlas-green); }
html body.quote-page .damage-card.selected::after { width: 18px; height: 18px; top: 9px; right: 9px; background-size: 12px; }
html body.quote-page :is(.damage-label,.side-label,.schedule-label) { color: var(--atlas-ink); font-weight: 500; font-size: 14px; line-height: 1.35; }
html body.quote-page :is(.side-sub,.schedule-sub,.time-window-card span) { color: var(--atlas-muted); font-size: 12px; font-weight: 400; }
html body.quote-page .schedule-card { padding: 18px 14px; min-height: 84px; }
html body.quote-page .time-window-card { font-size: 15px; font-weight: 500; min-height: 78px; }
html body.quote-page :is(.atlas-select,.atlas-input-new) { padding: 15px; min-height: 54px; border-radius: 12px; border-width: 1px; color: var(--atlas-ink); font-size: 16px; }
html body.quote-page .atlas-select { padding-right: 38px; }
html body.quote-page .vehicle-search-result { min-height: 52px; padding: 12px 16px; }
html body.quote-page .vehicle-search-title { font-weight: 500; color: var(--atlas-ink); font-size: 15px; }
html body.quote-page .vehicle-search-sub { font-weight: 400; font-size: 12px; }
html body.quote-page .vehicle-search-results { border-radius: 14px; }
html body.quote-page .date-chip { min-height: 54px; font-size: 13px; font-weight: 500; border-width: 1px; }
html body.quote-page :is(.btn-next,.btn-vision-analyze) { min-height: 54px; padding: 15px 22px; font-size: 16px; font-weight: 500; border-radius: 999px; background: var(--atlas-green); box-shadow: none; }
html body.quote-page :is(.btn-next,.btn-vision-analyze):hover { background: var(--atlas-green-hover); transform: none; box-shadow: none; }
html body.quote-page .btn-next:disabled { opacity: 1; background: #e8e8ed; color: #6b6b72; }
html body.quote-page .btn-back-link { min-height: 44px; font-weight: 400; font-size: 14px; color: var(--atlas-green); }
html body.quote-page :is(.trust-pill,.damage-pill) { border: 0; background: var(--atlas-tint); color: var(--atlas-green); font-size: 12px; font-weight: 500; box-shadow: none; }
html body.quote-page .time-window-note { font-weight: 400; font-size: 13px; color: var(--atlas-muted); }
.atlas-quote-aside { padding-top: 18px; position: sticky; top: 112px; }
html body .atlas-quote-aside h2 { font-size: 20px; margin: 0 0 12px; }
.atlas-summary-intro { color: var(--atlas-muted); font-size: 14px; margin: 0 0 24px; }
.atlas-summary { margin: 0; }
.atlas-summary>div { padding: 18px 0; border-bottom: 1px solid var(--atlas-line); }
.atlas-summary dt { color: var(--atlas-muted); font-size: 12px; margin-bottom: 6px; }
.atlas-summary dd { margin: 0; font-size: 14px; font-weight: 500; overflow-wrap: anywhere; }
.atlas-summary-help { margin-top: 28px; font-size: 14px; }
.atlas-summary-help p { color: var(--atlas-muted); margin: 8px 0; }
.atlas-summary-help a { text-decoration: underline; text-underline-offset: 3px; color: var(--atlas-green); display: inline-flex; min-height: 36px; align-items: center; }
.atlas-summary-help strong { font-weight: 500; }
.atlas-mobile-summary { display: none; }
.atlas-service-zip { margin-bottom: 20px; }
.atlas-service-zip label { display: block; margin-bottom: 8px; font-size: 13px; }
.atlas-service-zip small { display: block; color: var(--atlas-muted); font-size: 12px; margin-top: 8px; }
.atlas-service-zip input { width: 100%; padding: 14px; }
.atlas-quote-footer { text-align: center; color: var(--atlas-muted); font-size: 12px; padding: 0 20px 32px; }
.atlas-choice-hint { color: var(--atlas-muted); font-size: 12px; margin-top: 10px; }

/* New quote journey. Keep embed.css last so embedded flows retain their shell. */
html body.quote-modern { background: var(--atlas-canvas); color: var(--atlas-ink); }
html body.quote-modern>.preview { border: 0; background: #edf5ef; color: #375c43; font-size: 12px; padding: 8px 20px; }
html body.quote-modern>header { background: #fff; border-bottom: 1px solid #e5e5ea; padding: 12px max(24px,calc((100vw - 1080px)/2)); }
html body.quote-modern>header img { width: 70px; height: 62px; object-fit: contain; }
html body.quote-modern .phone { color: var(--atlas-green); font-size: 15px; }
html body.quote-modern .phone span { color: var(--atlas-muted); font-size: 12px; }
html body.quote-modern>main { max-width: 1136px; margin: 36px auto 64px; padding: 0 28px; }
html body.quote-modern nav { margin-bottom: 30px; }
html body.quote-modern nav li { font-size: 13px; color: var(--atlas-muted); padding-bottom: 16px; }
html body.quote-modern nav li.active { color: var(--atlas-green); border-color: var(--atlas-green); }
html body.quote-modern nav li.active::before { background: var(--atlas-green); border-color: var(--atlas-green); }
html body.quote-modern .layout { grid-template-columns: minmax(0,680px) minmax(220px,1fr); gap: 40px; }
html body.quote-modern #formArea { background: #fff; padding: 36px; border: 1px solid #e7e7ec; border-radius: 24px; min-width: 0; box-shadow: 0 6px 30px #1d1d1f04; }
html body.quote-modern h1 { font-size: clamp(28px,3vw,38px); color: var(--atlas-ink); font-weight: 600; line-height: 1.12; letter-spacing: -.04em; }
html body.quote-modern h2 { color: var(--atlas-ink); font-weight: 600; font-size: 21px; }
html body.quote-modern .eyebrow { color: var(--atlas-green); font-size: 12px; font-weight: 500; text-transform: none; letter-spacing: 0; }
html body.quote-modern :is(.intro,.note,.optional,.option small) { color: var(--atlas-muted); }
html body.quote-modern .note { font-size: 13px; }
html body.quote-modern :is(label,legend) { color: var(--atlas-ink); font-weight: 500; font-size: 13px; }
html body.quote-modern :is(input:not([type=radio]):not([type=checkbox]):not([type=file]),select) { height: 54px; border-radius: 12px; background: #fff; border-color: #b9b9c0; }
html body.quote-modern #search { background: #fff; border-color: #b9b9c0; height: 56px; }
html body.quote-modern .primary { border-radius: 999px; min-height: 54px; background: var(--atlas-green); border-color: var(--atlas-green); font-size: 15px; font-weight: 500; box-shadow: none; }
html body.quote-modern .primary:hover { background: var(--atlas-green-hover); }
html body.quote-modern .primary:disabled { background: #e8e8ed; border-color: #e8e8ed; color: #6b6b72; opacity: 1; }
html body.quote-modern .secondary { border-radius: 999px; color: var(--atlas-green); font-size: 14px; min-height: 44px; border: 1px solid #b9b9c0; }
html body.quote-modern .back { color: var(--atlas-green); min-height: 44px; }
html body.quote-modern :is(.option,.upload-tile) { border-radius: 16px; }
html body.quote-modern .option:has(input:checked) { background: #f1f7f3; border-color: var(--atlas-green); box-shadow: 0 0 0 1px var(--atlas-green); }
html body.quote-modern .option strong { font-size: 15px; font-weight: 500; }
html body.quote-modern .upload-tile { background: #f7f9f7; border-color: #aabdb0; }
html body.quote-modern .upload-tile strong { color: var(--atlas-green); font-weight: 500; }
html body.quote-modern .upload-tile small { color: var(--atlas-muted); }
html body.quote-modern .remove-photo { min-height: 44px; width: 44px; flex-basis: 44px; border-radius: 50%; }
html body.quote-modern .price-band { background: var(--atlas-canvas); border: 0; border-radius: 20px; padding: 28px; margin: 24px 0; }
html body.quote-modern .price-band strong { font-size: clamp(32px,4vw,44px); font-weight: 600; letter-spacing: -.045em; color: var(--atlas-ink); }
html body.quote-modern .deposit-line { border-radius: 14px; background: var(--atlas-tint); border: 0; }
html body.quote-modern aside { padding: 8px 0 0; border: 0; top: 24px; }
html body.quote-modern .service-image { height: 170px; border-radius: 18px; }
html body.quote-modern aside h2 { font-size: 20px; margin-top: 22px; }
html body.quote-modern #summary dt { font-size: 12px; color: var(--atlas-muted); }
html body.quote-modern #summary dd { color: var(--atlas-ink); font-weight: 500; }
html body.quote-modern .help a { color: var(--atlas-green); min-height: 32px; }
html body.quote-modern summary { color: var(--atlas-green); font-weight: 500; min-height: 32px; }
html body.quote-modern footer { background: transparent; color: var(--atlas-muted); border: 0; }

/* VIN modal and original confirmation use the same controls and surfaces. */
html body :is(.atlas-modal,.ty-card) { border-radius: 24px; box-shadow: 0 8px 40px #1d1d1f0a; border: 1px solid #e4e4e9; }
html body .atlas-modal-header { background: #f5f5f7; border-bottom: 1px solid #dedee4; }
html body .atlas-modal-header :is(.atlas-hdr-text h2,.atlas-hdr-text span,.atlas-close-btn,.atlas-back-btn) { color: var(--atlas-ink); }
html body .atlas-card { border: 1px solid #dedee4; border-radius: 18px; box-shadow: none; }
html body .atlas-input-group label { text-transform: none; letter-spacing: normal; font-weight: 500; }
html body :is(.atlas-btn,.atlas-quote-btn) { border-radius: 999px; min-height: 48px; font-weight: 500; box-shadow: none; }
html body :is(.atlas-btn-primary,.atlas-btn-success,.atlas-quote-btn) { background: var(--atlas-green); }
html body :is(.atlas-btn-primary,.atlas-btn-success,.atlas-quote-btn):hover { background: var(--atlas-green-hover); transform: none; box-shadow: none; }
html body :is(.atlas-glass-wrap,.atlas-svc-opt) { border-radius: 14px; box-shadow: none; }
html body .ty-header-inner { max-width: 720px; padding: 10px 24px; }
html body .ty-header img { height: 54px; width: auto; }
html body .detail-label { color: var(--atlas-muted); text-transform: none; letter-spacing: 0; font-size: 13px; }
html body .detail-value { color: var(--atlas-ink); font-weight: 500; }
@keyframes atlas-step-in { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }
@media(max-width:900px) {
  .atlas-quote-layout { gap: 28px; grid-template-columns: minmax(0,1fr) 220px; }
  .atlas-quote-panel { padding: 28px; }
  html body.quote-modern .layout { gap: 28px; grid-template-columns: minmax(0,1fr) 220px; }
  html body.quote-modern #formArea { padding: 28px; }
}
@media(max-width:760px) {
  html body.quote-page { background: #fff; }
  .atlas-quote-main { margin: 12px auto 40px; padding: 0 20px; }
  .atlas-quote-layout { display: block; }
  .atlas-quote-panel { padding: 0; border: 0; border-radius: 0; box-shadow: none; }
  .atlas-quote-progress { margin-bottom: 24px; }
  .atlas-quote-progress li { font-size: 12px; padding-top: 18px; }
  .atlas-quote-aside { display: none; }
  .atlas-mobile-summary { display: block; background: var(--atlas-canvas); border-radius: 14px; margin: 0 0 24px; padding: 0 16px; }
  .atlas-mobile-summary summary { min-height: 48px; cursor: pointer; display: list-item; padding: 14px 0; color: var(--atlas-muted); font-size: 13px; }
  .atlas-mobile-summary p { margin: 0; padding: 0 0 16px; font-size: 13px; }
  html body.quote-page .damage-card { min-height: 126px; padding: 20px 10px; }
  html body.quote-page .damage-label { font-size: 13px; }
  html body.quote-page .quote-step h1 { font-size: 30px; }
  html body.quote-page .quote-step .grid-cols-3 { gap: 10px; }
  html body.quote-modern { background: #fff; }
  html body.quote-modern>header { padding: 10px 20px; }
  html body.quote-modern>header img { height: 48px; width: 54px; }
  html body.quote-modern>main { margin: 22px auto 40px; padding: 0 20px; }
  html body.quote-modern .layout { display: block; }
  html body.quote-modern #formArea { padding: 0; border: 0; border-radius: 0; box-shadow: none; }
  html body.quote-modern nav { margin-bottom: 28px; }
  html body.quote-modern nav li { font-size: 12px; gap: 6px; }
  html body.quote-modern nav li::before { width: 24px; height: 24px; flex-basis: 24px; }
  html body.quote-modern aside { position: static; margin-top: 36px; padding-top: 24px; border-top: 1px solid var(--atlas-line); }
  html body.quote-modern .service-image { display: none; }
  html body.quote-modern #summary { grid-template-columns: 1fr; gap: 0; }
  html body.quote-modern #summary div { padding: 12px 0; }
  html body.quote-modern .phone { font-size: 14px; }
  html body.quote-modern .vehicle-grid { grid-template-columns: 85px minmax(0,1fr) minmax(0,1fr); gap: 10px; }
  html body.quote-modern .price-band { padding: 22px; }
}
@media(max-width:380px) {
  .atlas-quote-progress ol { gap: 7px; }
  .atlas-quote-progress .atlas-step-number { display: none; }
  html body.quote-page .damage-card { min-height: 116px; padding: 18px 7px; }
  html body.quote-page .damage-label { font-size: 12px; }
  html body.quote-page .date-row { flex-wrap: wrap; }
  html body.quote-page .date-quick-actions { flex: 1; }
  html body.quote-modern .vehicle-grid { grid-template-columns: 1fr 1fr; }
  html body.quote-modern .vehicle-grid>div:last-child { grid-column: 1/-1; }
}
/* Desktop summary is open; on mobile the customer can collapse it. */
html body.quote-modern .atlas-new-summary>summary { font-size: 14px; color: var(--atlas-ink); margin-bottom: 18px; }
@media(min-width:761px) {
  html body.quote-modern .atlas-new-summary>summary { list-style: none; font-size: 20px; font-weight: 600; }
  html body.quote-modern .atlas-new-summary>summary::-webkit-details-marker { display: none; }
}
.quote-embedded body.quote-modern { background: transparent; }
.quote-embedded body.quote-modern #formArea { padding: 0; border: 0; box-shadow: none; border-radius: 0; background: transparent; }
/* Programmatic heading focus announces the step without drawing a control ring. */
html body.quote-modern h1:focus { outline: none; }
/* Insurer names remain secondary text without lowering their contrast. */
html body.quote-page .quote-step .opacity-60 { opacity: 1; }
html body.quote-receipt :is(.text-gray-400,.text-gray-500) { color: var(--atlas-muted); }
html body.quote-receipt .btn-sms { background: var(--atlas-tint); color: var(--atlas-green); min-height: 44px; border-radius: 999px; font-weight: 500; }
/* The same glass glyphs and quiet icon tiles as the portal guided Add Job. */
html body.quote-page .damage-card .damage-icon { width: 44px; height: 40px; border-radius: 10px; background: #f5f6f9; }
html body.quote-page .damage-card .damage-icon svg { width: 28px; height: 28px; color: #64748b; }
html body.quote-page .damage-card.selected .damage-icon { background: #e2eee6; }
html body.quote-page .damage-card.selected .damage-icon svg { color: var(--atlas-green); }
html body .atlas-glass-opt .icon .atlas-portal-glass-icon { width: 24px; height: 24px; color: #64748b; }
html body .atlas-glass-wrap.selected .atlas-portal-glass-icon { color: var(--atlas-green); }

/* Status uses words as well as color. Summary space remains stable while choices appear. */
.atlas-status { display:inline-flex; padding:7px 12px; border-radius:999px; color:var(--atlas-green); background:var(--atlas-tint); font-size:13px; line-height:1.4; }
html body.quote-modern .atlas-quote-help { margin-top:24px; padding:0; border:0; background:transparent; }
.atlas-quote-progress { scroll-margin-top:112px; }