/* Quiet plum-and-green presentation over the original event-planning flow. */
.quote-page { --bg:#B0A474; --bg-2:#B0A474; --bg-3:#A39768; --ink:#3F292C; --ink-2:#493337; --amber:#3F292C; --amber-b:rgba(63,41,44,.2); --serif:'Cormorant Garamond',Georgia,serif; --sans:'EB Garamond',Georgia,serif; background:var(--bg); font-size:18px; }
/* Keep the embedded form and sticky estimate bar on one warm cream surface.
   Scroll padding keeps focused and revealed choices clear of that bar. */
.quote-embed {
  --sheet: #F1EBDF;
  background:var(--sheet);
  scroll-padding:16px 0 112px;
}
.quote-embed .quote-page { --bg:#F1EBDF; --bg-2:#E8DFCE; --bg-3:#D4C7B8; background:transparent; }
.quote-embed .quote-estimate-bar { background:var(--sheet); }
.quote-embed .quote-main { padding:30px 44px 0; }
.quote-step legend { font-weight:400; }
.quote-embed .quote-step legend { font-size:36px; }
.quote-event-grid,.quote-date-modes { display:block; }
/* Every choice keeps room on the left for the check, so selecting never shifts the text. */
.quote-choice,.quote-date-modes .quote-choice,.quote-event-grid .quote-choice { justify-content:initial; text-align:left; border:0; border-bottom:1px solid var(--amber-b); border-radius:0; padding:16px 8px 16px 34px; margin:0; background:transparent; box-shadow:none; gap:16px; min-height:52px; }
.quote-choice:hover,.quote-choice:active,.quote-choice:has(input:checked) { background:transparent; box-shadow:none; }
.quote-choice-title { font-size:25px; }
/* Hover is a faint underline on devices that can hover. Selected is a full ink underline and a check. */
@media (hover:hover) {
  .quote-choice:hover .quote-choice-title { text-decoration:underline; text-decoration-color:rgba(63,41,44,.32); text-underline-offset:6px; text-decoration-thickness:1px; }
}
.quote-choice:has(input:checked) .quote-choice-title { text-decoration:underline; text-decoration-color:var(--ink); text-underline-offset:6px; text-decoration-thickness:1px; }
.quote-choice:has(input:checked)::before { content:'✓'; position:absolute; left:6px; top:16px; font-size:19px; line-height:31px; color:var(--ink); }
.quote-choice:has(input:focus-visible) { border-radius:0; outline:1px solid var(--ink); outline-offset:3px; }
.quote-choice-detail { font-size:16px; }
.quote-choice-price { font-size:22px; }
.quote-help { font-size:17px; }
.quote-label { text-transform:none; letter-spacing:0; font-size:17px; }
.quote-primary { border:0; background:transparent; color:var(--ink)!important; padding:12px 0 12px 20px; font-size:19px; letter-spacing:0; text-decoration:underline; text-underline-offset:5px; }
.quote-primary:hover { background:transparent; }
.quote-back { font-size:18px!important; }
.quote-actions { margin-top:28px; }
.quote-running { text-transform:none;letter-spacing:0;font-size:17px; }
.quote-embed #quoteProgress { margin-bottom:32px; }
.quote-embed .quote-actions { margin-bottom:32px; }
.quote-embed .quote-estimate-bar { padding-top:20px; }
.quote-page input:not([type=radio]):not([type=checkbox]):not([type=range]):not([type=hidden]),.quote-page select,.quote-page textarea { background:transparent; border:0; border-bottom:1px solid var(--amber-b); border-radius:0; padding-left:0; padding-right:0; }
.quote-contact-grid { gap:0 18px; }
.quote-page .quote-step[data-step=contact] input,.quote-page .quote-step[data-step=contact] textarea { border-radius:0!important; padding-left:0!important; padding-right:0!important; }
.quote-step[data-step=contact] .quote-label { font-size:15px; }
@media(max-width:640px) {
  .quote-embed { scroll-padding-bottom:88px; }
  .quote-embed .quote-main { padding:24px 28px 0; }
  .quote-embed .quote-step legend { font-size:30px; }
  .quote-choice,.quote-date-modes .quote-choice,.quote-event-grid .quote-choice { padding:14px 4px 14px 30px; }
  .quote-choice:has(input:checked)::before { left:4px; top:14px; line-height:29px; }
  .quote-choice-title { font-size:23px; }
  .quote-choice-price { font-size:20px; }
  .quote-embed .quote-estimate-bar { padding-top:14px; padding-bottom:16px; }
}

.quote-page { background-color:#B0A474; background-image:none; background-size:640px 640px; }
.quote-wordmark { display:block; width:120px; height:auto; }
.quote-wordmark img { width:100%; height:auto; }
.quote-return { font-size:17px; }
.quote-page .quote-preview-note { padding:12px 0; color:var(--ink-2); font-size:16px; }
.quote-embed .quote-main { min-height:100dvh; }

/* Cream calendar: native date input remains the submission and validation source. */
.event-calendar { width:100%; max-width:370px; }
.calendar-toggle { display:flex; align-items:center; justify-content:space-between; gap:16px; width:100%; min-height:52px; padding:12px 0; border:0; border-bottom:1px solid var(--amber-b); border-radius:0; background:transparent; text-align:left; font-size:19px; }
.calendar-toggle svg { flex-shrink:0; }
.calendar-panel { scroll-margin-bottom:90px; margin-top:12px; padding:12px; border:1px solid rgba(63,41,44,.2); border-radius:24px; background:#F1EBDF; color:#3F292C; }
.calendar-panel[hidden] { display:none; }
.calendar-heading { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:8px; }
.calendar-heading p { margin:0; font-family:var(--serif); font-size:25px; }
.calendar-heading button { width:44px; height:44px; border:0; border-radius:50%; background:transparent; font-size:28px; }
.calendar-heading button:disabled { opacity:.3; cursor:default; }
.calendar-week { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); text-align:center; }
.calendar-week [role=columnheader] { padding:8px 0; font-size:14px; color:#493337; }
.calendar-week [role=gridcell] { min-width:0; min-height:44px; }
.calendar-week button { display:block; width:min(44px,100%); aspect-ratio:1; min-height:0; margin-inline:auto; padding:0; border:1px solid transparent; border-radius:50%; background:transparent; color:#3F292C; font-size:18px; }
.calendar-week button[aria-disabled=true] { color:rgba(63,41,44,.35); text-decoration:line-through; cursor:default; }
.calendar-week [aria-selected=true] button { background:#3F292C; color:#F1EBDF; }
.calendar-panel :focus-visible { outline:2px solid #3F292C; outline-offset:-2px; }
.calendar-note { margin:10px 0 0; text-align:center; font-size:14px; color:#493337; }
@media(hover:hover) {
  .calendar-week button[aria-disabled=false]:hover { border-color:#3F292C; }
  .calendar-heading button:not(:disabled):hover { background:#E8DFCE; }
}
@media(max-width:400px) { .calendar-panel { padding:8px 4px; } }

/* In the modal, the date choice reveals the calendar without a second trigger. */
.quote-embed .event-calendar.is-inline { max-width:none; }
.event-calendar.is-inline .calendar-toggle { display:none; }
.event-calendar.is-inline .calendar-panel { margin-top:8px; }

/* Text fields stay quiet on focus: a stronger rule and a faint plum wash. */
.quote-page :is(input:not([type=radio]):not([type=checkbox]):not([type=range]):not([type=hidden]), select, textarea):focus {
  outline:none;
  border-bottom-color:var(--ink);
  box-shadow:0 1px 0 var(--ink);
  background-color:rgba(63,41,44,.04);
}

/* The last modal step keeps both actions available while the fields scroll. */
.quote-embed.quote-contact-step { scroll-padding-bottom:112px; }
.quote-embed.quote-contact-step .quote-main { padding-bottom:calc(104px + env(safe-area-inset-bottom)); }
.quote-embed.quote-contact-step .quote-actions {
  position:fixed; inset:auto 24px 16px; z-index:5;
  display:grid; grid-template-columns:1fr 1fr; gap:16px; margin:0;
  background:transparent; pointer-events:none;
}
.quote-page .quote-actions button {
  pointer-events:auto; min-height:52px; padding:12px 16px calc(12px + env(safe-area-inset-bottom));
  border:1px solid var(--ink); border-radius:999px; text-decoration:none; font-size:20px !important;
}
.quote-page .quote-actions .quote-back { background:var(--bg); color:var(--ink); }
.quote-page .quote-actions .quote-primary { background:var(--ink); color:var(--bg) !important; }
.quote-page .quote-actions button:focus-visible { outline:2px solid currentColor; outline-offset:-7px; }
@media(hover:hover) {
  .quote-page .quote-actions .quote-back:hover { background:#E8DFCE; }
  .quote-page .quote-actions .quote-primary:hover { background:#2E1D20; }
}

/* Native radio choices keep keyboard navigation while matching the modal. */
.quote-day-options { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-top:12px; }
.quote-day-choice { position:relative; cursor:pointer; }
.quote-day-choice input { position:absolute; opacity:0; width:1px; height:1px; }
.quote-day-choice span { display:block; text-align:center; padding:10px 12px; border:1px solid var(--amber-b); border-radius:999px; }
.quote-day-choice:has(input:checked) span { background:var(--ink); color:var(--bg); border-color:var(--ink); }
.quote-day-choice:has(input:focus-visible) span { outline:2px solid var(--ink); outline-offset:3px; }
@media(hover:hover) { .quote-day-choice:hover span { border-color:var(--ink); } }
/* Compact the final summary, preserving readable fields and room for the pills. */
@media(min-width:600px) {
  .quote-embed.quote-contact-step .quote-main { padding-top:20px; padding-bottom:90px; }
  .quote-contact-step #quoteProgress { margin-bottom:18px; }
  .quote-embed.quote-contact-step .quote-step legend { font-size:30px; margin-bottom:12px; }
  .quote-contact-step .quote-final-total { font-size:42px; margin:0 0 4px; }
  .quote-contact-step .quote-review { margin-bottom:12px; }
  .quote-contact-step .quote-review summary { padding:8px 0; }
  .quote-page .quote-step[data-step=contact] input { margin-bottom:8px !important; }
  .quote-contact-step .quote-step > .quote-help:last-of-type { margin-bottom:8px; line-height:1.35; }
  .quote-contact-step .quote-preview-note { padding:0; font-size:13px; line-height:1.3; }
}
@media(min-width:600px) {
  .quote-embed.quote-contact-step #quoteProgress { margin-top:4px; margin-bottom:14px; }
  .quote-contact-step .quote-final-estimate { display:grid; grid-template-columns:1fr auto; align-items:baseline; gap:0 16px; }
  .quote-contact-step .quote-final-estimate .quote-label { margin-bottom:0; }
  .quote-contact-step #finalContext { grid-column:1 / -1; }
  .quote-contact-step .quote-step[data-step=contact] .quote-label { margin-bottom:2px; }
  .quote-page .quote-step[data-step=contact] textarea { min-height:48px !important; height:48px; margin-bottom:8px !important; }
}

/* Consistent navigation pills throughout the inquiry, with contact-only pinning. */
.quote-page .quote-actions { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.quote-page .quote-step[data-step=contact] input,
.quote-page .quote-step[data-step=contact] textarea {
  border:1px solid var(--amber-b) !important; border-radius:16px !important;
  padding-left:12px !important; padding-right:12px !important;
}
.quote-page .quote-step[data-step=contact] input:focus,
.quote-page .quote-step[data-step=contact] textarea:focus {
  border-color:var(--ink) !important; box-shadow:none !important; background-color:rgba(63,41,44,.04);
}