/* Automatic step-to-step booking navigation preserves context below the
 * sticky site header, without changing the horizontally scrollable day grid. */
body.premium-home #reservation.booking-planner #bookingStartDate,
body.premium-home #reservation.booking-planner #bookingDays{
  scroll-margin-top:clamp(88px,12vh,140px);
}
/* Booking Week / Desktop Premium 2026-10-15.
 * A single contiguous seven-day row: no orphan fourth card or empty grid row.
 * At narrower desktop widths the week scrolls horizontally instead of shrinking
 * times/prices below accessible text sizes. Mobile retains its existing carousel.
 */
#reservation.booking-planner .booking-week-caption{
  margin:14px 0 -5px;
  color:#526f5d;
  font:600 12px/1.5 Arial,sans-serif;
  letter-spacing:.06em;
}
#reservation.booking-planner .booking-day-unavailable{
  background:linear-gradient(145deg,#f6f8f5,#f1f4f0);
  border-color:#e1e8e0;
}
#reservation.booking-planner .booking-day-unavailable .booking-day-head{
  color:#77857a;
}
#reservation.booking-planner .booking-day-empty{
  grid-column:1/-1;
  color:#637369;
  font:500 12px/1.5 Arial,sans-serif;
  margin:12px 4px;
  padding:12px 6px;
  text-align:center;
  border:1px dashed #cdd8cf;
  border-radius:10px;
}
#reservation.booking-planner .booking-date-control{
  isolation:isolate;
}
body #reservation.booking-planner .booking-date-control>.booking-date-trigger{
  position:relative!important;
  z-index:2!important;
  justify-content:stretch;
  text-align:left;
  font:inherit;
  -webkit-appearance:none;
  appearance:none;
  touch-action:manipulation;
  cursor:pointer!important;
}
body #reservation.booking-planner .booking-date-control>input#bookingStartDate{
  z-index:1!important;
  pointer-events:none!important;
}
body #reservation.booking-planner .booking-date-trigger:focus-visible{
  outline:3px solid #235842!important;
  outline-offset:3px!important;
}
body #reservation.booking-planner .booking-date-trigger:disabled{
  cursor:not-allowed!important;
  opacity:.65;
}
@media(min-width:761px){
  #reservation.booking-planner .booking-days{
    display:grid!important;
    grid-template-columns:repeat(var(--booking-visible-days,6),minmax(204px,1fr))!important;
    gap:10px;
    align-items:stretch;
    overflow-x:auto;
    overflow-y:hidden;
    scroll-snap-type:x proximity;
    overscroll-behavior-inline:contain;
    padding:5px 2px 15px;
    scrollbar-width:thin;
    scrollbar-color:#aabcae #eef2ec;
  }
  #reservation.booking-planner .booking-day{
    border:1px solid #d8e3d8;
    border-radius:13px;
    background:#fff;
    overflow:hidden;
    min-width:0;
    scroll-snap-align:start;
    box-shadow:0 5px 14px rgba(23,53,34,.045);
  }
  #reservation.booking-planner .booking-day-unavailable{
    background:#f5f8f4;
  }
  #reservation.booking-planner .booking-day-head{
    background:#f3f7f2;
    padding:13px 12px;
    display:flex;
    flex-direction:column;
    gap:3px;
    align-items:flex-start;
    border-bottom:1px solid #dce7db;
  }
  #reservation.booking-planner .booking-day-head small{
    font:600 11px/1.2 Arial,sans-serif;
    letter-spacing:.035em;
    text-transform:capitalize;
    color:#6c8272;
  }
  #reservation.booking-planner .booking-day-head strong{
    font:650 16px/1.3 Arial,sans-serif;
    color:#1f3f2b;
  }
  #reservation.booking-planner .booking-slots{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    align-content:start;
    gap:6px;
    padding:10px 8px 12px;
  }
  #reservation.booking-planner .slot-button{
    padding:8px 7px;
    min-height:58px;
    min-width:0;
    gap:4px;
    border-radius:7px;
    border-color:#d6e0d6;
    transition:background-color .15s,border-color .15s;
  }
  #reservation.booking-planner .slot-button span{
    font:650 14px/1.2 Arial,sans-serif;
    color:#183f2a;
  }
  #reservation.booking-planner .slot-button small{
    font:500 11px/1.2 Arial,sans-serif;
    letter-spacing:0;
  }
  #reservation.booking-planner .slot-button em{
    font:600 10px/1.35 Arial,sans-serif;
    letter-spacing:0;
    overflow-wrap:anywhere;
  }
  #reservation.booking-planner .slot-button:focus-visible{
    outline:2px solid #235842;
    outline-offset:1px;
  }
  #reservation.booking-planner .booking-day-empty{
    margin:20px 3px;
    min-height:80px;
    display:flex;
    align-items:center;
    justify-content:center;
  }
  body #reservation.booking-planner .booking-date-control>.booking-date-trigger{
    min-height:74px!important;
    padding:13px 18px!important;
    border-radius:13px!important;
    border:1px solid #d6e3d7!important;
    background:linear-gradient(115deg,#f5f8f4,#edf3ee)!important;
  }
  body #reservation.booking-planner .booking-date-control>.booking-date-trigger:hover{
    border-color:#618d71!important;
    background:#e9f3eb!important;
    box-shadow:0 3px 12px rgba(34,75,46,.08)!important;
  }
  body #reservation.booking-planner .booking-date-control>input#bookingStartDate{
    min-height:74px!important;
  }
  #reservation.booking-planner .booking-scroll-hint{
    display:block;
    margin-top:10px;
    font:500 11px/1.5 Arial,sans-serif;
    color:#77877b;
  }
}
@media(min-width:1660px){
  #reservation.booking-planner .booking-scroll-hint{
    display:none;
  }
}
@media(max-width:760px) and (pointer:coarse){
  /* iOS native date input takes the physical tap where showPicker may not be available. */
  body #reservation.booking-planner .booking-date-control>input#bookingStartDate{
    z-index:3!important;
    pointer-events:auto!important;
  }
}
@media(prefers-reduced-motion:reduce){
  #reservation.booking-planner .slot-button{transition:none}
}

/* Services: four prestations in one row on desktop, including 981-1099px laptops.
 * Tablets and phones retain the stacked responsive design. */
@media(min-width:981px){
  body.premium-home #services .cards{
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:clamp(12px,1.2vw,20px);
    align-items:stretch;
  }
  body.premium-home #services .cards article{
    min-width:0;
    min-height:310px;
    padding:clamp(19px,1.55vw,27px);
    border-radius:15px;
  }
  body.premium-home #services .cards .featured-service{
    padding-top:50px;
  }
  body.premium-home #services .cards .card-offer{
    font-size:8px;
    padding:7px 9px;
    max-width:90%;
  }
  body.premium-home #services .cards h3{
    font-size:clamp(21px,1.8vw,27px);
    max-width:none;
    line-height:1.2;
    margin-top:23px;
    overflow-wrap:break-word;
  }
  body.premium-home #services .cards strong:not(.retest-card-price){
    font-size:clamp(36px,3.4vw,50px);
    margin-top:16px;
  }
  body.premium-home #services .cards .retest-service-card{
    min-height:310px;
  }
  body.premium-home #services .cards .retest-service-card .retest-card-price{
    font-size:clamp(19px,1.9vw,25px);
    padding-top:12px;
  }
  body.premium-home #services .cards article>a{
    min-height:44px;
    margin-top:17px;
    padding-top:12px;
  }
}


/* 2026-10-19: calendar is a REAL native date input, no invisible overlay or
 * showPicker dependency. Label click and browser picker icon both work. */
body.premium-home #reservation.booking-planner .booking-date-control {
  display:flex!important;
  flex-direction:column!important;
  gap:10px!important;
  isolation:auto!important;
}
body.premium-home #reservation.booking-planner .booking-date-control .booking-date-caption {
  font:600 clamp(14px,1.4vw,17px)/1.4 Arial,sans-serif!important;
  color:#234835!important;
}
body.premium-home #reservation.booking-planner .booking-date-control>input#bookingStartDate {
  position:static!important;
  inset:auto!important;
  display:block!important;
  opacity:1!important;
  z-index:auto!important;
  pointer-events:auto!important;
  width:100%!important;
  height:auto!important;
  min-height:72px!important;
  max-height:none!important;
  margin:0!important;
  padding:14px 20px!important;
  border:2px solid #235842!important;
  border-radius:14px!important;
  background:#fff!important;
  color:#163e2b!important;
  font:650 clamp(18px,2vw,23px)/1.2 Arial,sans-serif!important;
  color-scheme:light!important;
  cursor:pointer!important;
  box-shadow:0 3px 12px rgba(18,70,39,.07)!important;
}
body.premium-home #reservation.booking-planner .booking-date-control>input#bookingStartDate:focus-visible {
  outline:3px solid #246846!important;
  outline-offset:3px!important;
}
body.premium-home #reservation.booking-planner .booking-date-control>input#bookingStartDate::-webkit-calendar-picker-indicator {
  display:block!important;
  width:30px!important;
  height:30px!important;
  opacity:1!important;
  cursor:pointer!important;
  padding:4px!important;
}
body.premium-home #reservation.booking-planner .booking-live-head {
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  justify-content:flex-start!important;
  gap:10px!important;
  margin-top:29px!important;
}
body.premium-home #reservation.booking-planner .booking-live-top {
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:flex-start!important;
  flex-wrap:wrap!important;
  gap:clamp(12px,2.2vw,24px)!important;
  width:100%!important;
}
body.premium-home #reservation.booking-planner .booking-live-top>strong {
  font:750 clamp(21px,2.5vw,28px)/1.2 Arial,sans-serif!important;
  letter-spacing:.005em!important;
  color:#17442d!important;
}
body.premium-home #reservation.booking-planner .booking-live-top>#bookingRefresh {
  min-height:51px!important;
  min-width:166px!important;
  width:auto!important;
  padding:12px 21px!important;
  margin:0!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  font:750 clamp(16px,1.7vw,19px)/1.2 Arial,sans-serif!important;
  letter-spacing:0!important;
  border:2px solid #326949!important;
  border-radius:12px!important;
  background:#ebf3ed!important;
  color:#16442a!important;
}
body.premium-home #reservation.booking-planner .booking-live-head>#bookingLiveStatus {
  display:block!important;
  width:100%!important;
  font:650 clamp(17px,1.9vw,21px)/1.5 Arial,sans-serif!important;
  letter-spacing:0!important;
  color:#234a34!important;
}
body.premium-home #reservation.booking-planner .booking-week-caption {
  font:750 clamp(18px,2.2vw,24px)/1.45 Arial,sans-serif!important;
  letter-spacing:0!important;
  color:#185337!important;
  margin:18px 0 12px!important;
}
@media(max-width:760px){
  body.premium-home #reservation.booking-planner .booking-live-top{gap:12px!important}
  body.premium-home #reservation.booking-planner .booking-live-top>#bookingRefresh{
    min-width:138px!important;
    min-height:48px!important;
    padding:10px 14px!important;
  }
}

/* Mobile Safari: keep the reservation in the normal document flow.
 * Do not size the entire form from 100vw: native date picker internals can
 * enlarge the visual viewport and make the rest of the site look shrunken.
 * Clip only the native date control's internal paint, not the page. */
@media(max-width:760px){
  body.premium-home #reservation.booking-planner{
    box-sizing:border-box!important;
    display:block!important;
    width:auto!important;
    max-width:none!important;
    min-width:0!important;
    margin-inline:clamp(12px,4vw,20px)!important;
    padding:18px clamp(12px,3vw,18px)!important;
  }
  body.premium-home #reservation.booking-planner .booking-intro,
  body.premium-home #reservation.booking-planner .booking-controls.vehicle-booking-controls,
  body.premium-home #reservation.booking-planner .booking-date-field,
  body.premium-home #reservation.booking-planner .booking-date-control{
    box-sizing:border-box!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
  }
  body.premium-home #reservation.booking-planner .booking-controls.vehicle-booking-controls{
    margin-top:12px!important;
  }
  body.premium-home #reservation.booking-planner .booking-date-field{
    padding:16px 0 0!important;
    gap:10px!important;
  }
  body.premium-home #reservation.booking-planner .booking-date-control{
    /* minmax(0,1fr) stops Safari's native input intrinsic size from
       setting the width of this grid. Overflow stays within the form. */
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    overflow:hidden!important;
  }
  body.premium-home #reservation.booking-planner .booking-date-control .booking-date-caption{
    min-width:0!important;
    font:600 14px/1.4 Arial,sans-serif!important;
    letter-spacing:0!important;
    overflow-wrap:break-word;
  }
  body.premium-home #reservation.booking-planner .booking-date-control>input#bookingStartDate{
    box-sizing:border-box!important;
    display:block!important;
    position:static!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    min-inline-size:0!important;
    max-inline-size:100%!important;
    height:56px!important;
    min-height:56px!important;
    max-height:56px!important;
    margin:0!important;
    padding:10px 12px!important;
    border:2px solid #235842!important;
    border-radius:12px!important;
    font:600 16px/1.25 Arial,sans-serif!important;
    letter-spacing:0!important;
    text-align:left!important;
    grid-column:1!important;
    grid-row:2!important;
  }
  body.premium-home #reservation.booking-planner .booking-date-control>input#bookingStartDate::-webkit-datetime-edit{
    min-width:0!important;
    max-width:100%!important;
    overflow:hidden!important;
  }
  body.premium-home #reservation.booking-planner .booking-date-control>input#bookingStartDate::-webkit-calendar-picker-indicator{
    box-sizing:border-box!important;
    width:22px!important;
    height:22px!important;
    padding:2px!important;
  }
  body.premium-home #reservation.booking-planner .booking-date-control:focus-within{
    border-radius:12px;
    outline:2px solid #246846;
    outline-offset:2px;
  }
}

/* One persistent frame around the caption AND date, matching the focused group. */
body.premium-home #reservation.booking-planner .booking-date-control{
  box-sizing:border-box!important;
  border:2px solid #235842!important;
  border-radius:14px!important;
  padding:12px!important;
  background:#fff!important;
}
body.premium-home #reservation.booking-planner .booking-date-control>input#bookingStartDate{
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
}
body.premium-home #reservation.booking-planner .booking-date-control>input#bookingStartDate:focus-visible{
  outline:none!important;
}

/* Center the caption inside the existing single date-group frame. */
body.premium-home #reservation.booking-planner .booking-date-control .booking-date-caption{
  display:block!important;
  width:100%!important;
  box-sizing:border-box!important;
  text-align:center!important;
}