/*
         .            '||
 ....  .||.  .... ...  ||    ....   ....
||. '   ||    '|.  |   ||  .|...|| ||. '
. '|..  ||     '|.|    ||  ||      . '|..
|'..|'  '|.'    '|    .||.  '|...' |'..|'
             .. |
              ''
----------------------------------------------------------
  styles.css  --  the booking box, one column, any screen
*/

/*
  .           '||
.||.    ...    ||  ..    ....  .. ...    ....
 ||   .|  '|.  || .'   .|...||  ||  ||  ||. '
 ||   ||   ||  ||'|.   ||       ||  ||  . '|..
 '|.'  '|..|' .||. ||.  '|...' .||. ||. |'..|'
*/
:root{
  --ink:#12161c;
  --ink-2:#3d4652;
  --ink-3:#6f7780;
  --line:#ece6e3;
  --hair:#f5efec;
  --bg:#fdfbfa;
  --card:#fff;
  --tint:#faf7f5;
  --brand:#12161c;
  --on-brand:#fff;
  --on-brand-mute:#aab4c0;

  --rose:#f2b8b5;
  --rose-deep:#c9605b;
  --rose-tint:#fdeeec;

  --ok:#0d7a4a;
  --ok-bg:#e8f6ee;
  --ok-line:#bfe6ce;
  --ok-bright:#9fe6c1;

  --no:#8f99a5;
  --no-bg:#f4efec;

  --warn:#a63d1f;

  --radius:20px;
  --radius-sm:12px;
  --shadow:0 1px 2px rgba(18,22,28,.04), 0 14px 34px -16px rgba(18,22,28,.22);
}

*,*::before,*::after{box-sizing:border-box}

html{-webkit-text-size-adjust:100%}

body{
  margin:0;
  min-height:100dvh;
  background:var(--bg);
  background-image:radial-gradient(120% 60% at 50% 0%, #fff 0%, var(--bg) 60%);
  color:var(--ink);
  font:16px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  -webkit-tap-highlight-color:transparent;
}

.stage{
  max-width:660px;
  margin:0 auto;
  padding:26px 18px 40px;
}

.visually-hidden{
  position:absolute;
  width:1px;height:1px;
  margin:-1px;padding:0;
  overflow:hidden;
  clip:rect(0 0 0 0);
  clip-path:inset(50%);
  white-space:nowrap;
  border:0;
}

/*
'||
 || ...    ...   ... ...
 ||'  || .|  '|.  '|..'
 ||    | ||   ||   .|.
 '|...'   '|..|' .|  ||.
*/
.box{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  overflow:hidden;
}

.box__head{
  background:transparent;
  color:var(--ink);
  padding:22px 20px 20px;
  border-bottom:1px solid var(--line);
}
.box__top{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
}
.box__back{
  display:flex;align-items:center;justify-content:center;
  flex:0 0 auto;
  width:55px;height:33px;
  border:2.5px solid var(--ink);
  border-radius:7px;
  color:var(--ink);
  text-decoration:none;
  transition:background-color .14s ease, border-color .14s ease, color .14s ease;
}
.box__back:hover{ background:var(--rose-tint); border-color:var(--rose-deep); color:#2b1310 }
.box__back:focus-visible{ outline:2px solid var(--ink); outline-offset:3px }

.box__shop{
  display:inline-block;
  margin:0;
  padding:6px 11px;
  border:2.5px solid var(--ink);
  border-radius:7px;
  font-size:11.5px;
  font-weight:700;
  letter-spacing:.09em;
  text-transform:uppercase;
  color:var(--ink);
  text-decoration:none;
  cursor:pointer;
  transition:background-color .14s ease, border-color .14s ease, color .14s ease;
}
.box__shop:hover{ background:var(--rose-tint); border-color:var(--rose-deep); color:#2b1310 }
.box__shop:focus-visible{ outline:2px solid var(--ink); outline-offset:3px }
.box__title{
  margin:12px 0 0;
  font-size:clamp(24px,6vw,31px);
  font-weight:800;
  letter-spacing:-.03em;
  line-height:1.08;
}
.booking{padding:18px 20px 20px}

/*
 ....  .||.    ....  ... ...   ....
||. '   ||   .|...||  ||'  || ||. '
. '|..  ||   ||       ||    | . '|..
|'..|'  '|.'  '|...'  ||...'  |'..|'
                      ||
                     ''''
*/
.step{
  padding:18px 0;
  border-top:1px solid var(--hair);
}
.step:first-of-type{border-top:0;padding-top:16px}
.step[hidden]{display:none}

.step__legend{
  display:flex;
  align-items:center;
  gap:10px;
  margin:0 0 13px;
  font-size:18.5px;
  font-weight:650;
  letter-spacing:-.16px;
}
.step__num{
  flex:none;
  width:27px;
  height:27px;
  border-radius:50%;
  background:var(--rose-tint);
  color:var(--rose-deep);
  font-size:14.5px;
  font-weight:700;
  display:grid;
  place-items:center;
  position:relative;
  transition:background .2s ease;
}

.step__num__n{transition:opacity .16s ease,transform .2s ease}
.step__num__tick{position:absolute;inset:0;width:27px;height:27px;opacity:0;transition:opacity .1s ease}
.step__num__tick circle{display:none}
.step__num__tick path{
  fill:none;stroke:var(--ok);stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round;
  stroke-dasharray:14;stroke-dashoffset:14;
}
.step__num.is-done{background:var(--ok-line);animation:step-pop .34s cubic-bezier(.34,1.56,.64,1)}
.step__num.is-done .step__num__n{opacity:0;transform:scale(.35)}
.step__num.is-done .step__num__tick{opacity:1}
.step__num.is-done .step__num__tick path{animation:tick-mark .3s .06s ease-out forwards}
@media (prefers-reduced-motion: reduce){
  .step__num.is-done .step__num__tick path{stroke-dashoffset:0}
}

.step__hint{margin:10px 0 0;font-size:12.5px;color:var(--ink-3)}

/*
                                 ||
 ....    ....  ... ..  .... ... ...    ....    ....   ....
||. '  .|...||  ||' ''  '|.  |   ||  .|   '' .|...|| ||. '
. '|.. ||       ||       '|.|    ||  ||      ||      . '|..
|'..|'  '|...' .||.       '|    .||.  '|...'  '|...' |'..|'
*/
.services{display:grid;gap:9px}

.service{
  position:relative;
  display:flex;
  flex-direction:column;
  gap:4px;
  align-items:flex-start;
  text-align:left;
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius:var(--radius-sm);
  background:var(--card);
  color:inherit;
  font:inherit;
  cursor:pointer;
}
.service__name{font-size:16px;font-weight:650}

.service__blurb{
  position:absolute;
  left:0;
  top:3px;
  width:60%;
  font-size:14px;
  line-height:1.34;
  color:var(--ink-3);
  z-index:2;
  pointer-events:none;
}
@media (min-width:560px){
  .service__blurb{width:56%;font-size:13px;line-height:1.38}
}

.service__art{
  position:relative;
  display:block;
  width:100%;
  aspect-ratio:2.95;
  margin-top:2px;
  overflow:hidden;
}
.service__wheel{
  position:absolute;
  top:50%;
  width:32%;
  height:auto;
  aspect-ratio:1;
  translate:-50% -50%;
  color:rgb(18 22 28 / 0.55);
}
.service__wheel .wheel-disc{fill:var(--tint)}
.service[aria-checked="true"] .service__wheel .wheel-disc{fill:var(--hair)}

.service__art--swap .service__wheel--knobby{left:94%;z-index:2}
.service__art--swap .service__wheel--tyre{left:94%;transform:translateX(-48%) scale(.8);color:rgb(18 22 28 / 0.35);z-index:1}
.service__art--slide .service__wheel--down{left:94%;z-index:2}
.service__art--slide .service__wheel--back{left:94%;transform:translateX(-48%) scale(.8);color:rgb(18 22 28 / 0.35);z-index:1}

@media (max-width:559px){
  .service{padding:7px 12px;gap:0}
  .service__art{aspect-ratio:auto;height:91px;margin-top:-16px}
  .service__blurb{top:25px}
  .service__wheel{width:34%;max-width:89px}
  .service__art--swap .service__wheel--tyre,
  .service__art--swap .service__wheel--knobby,
  .service__art--slide .service__wheel--down,
  .service__art--slide .service__wheel--back{left:95%}
}

.service[aria-checked="true"]{
  border-color:var(--brand);
  background:var(--hair);
  box-shadow:inset 0 0 0 1px var(--brand);
}

/*
  ....   ....   ... ..   ....
.|   '' '' .||   ||' '' ||. '
||      .|' ||   ||     . '|..
 '|...' '|..'|' .||.    |'..|'
*/
.cars{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}
.cars__pick{
  padding:14px 10px;
  font:inherit;font-size:14.5px;font-weight:650;
  color:var(--ink-2);background:var(--card);
  border:1px solid var(--line);border-radius:var(--radius-sm);
  cursor:pointer;
  transition:border-color .15s ease,box-shadow .15s ease;
}
.cars__pick:hover{border-color:var(--ink-3)}
.cars__pick[aria-checked="true"]{
  border-color:var(--brand);
  box-shadow:inset 0 0 0 1px var(--brand);
  background:var(--hair);
  color:var(--ink);
}
@media (min-width:420px){ .cars{grid-template-columns:repeat(4,1fr)} }

#step-address{position:relative;z-index:2}

/*
           .    .||      '||   .||      ||      '||
   ....  .||.  .||. ..    ||  .||. ...   ||  ..   ||   ....
 .|...||  ||    ||   ||   ||   ||   ||   || .'    ||  ||. '
 ||       ||    ||   ||   ||   ||   ||   ||'|.    ||   . '|..
  '|...'  '|.'  '|.' ||. .||.  '|.' ||. .||. ||. .||.  |'..|'
*/
.cal{
  border:1px solid var(--line);
  border-radius:14px;
  background:var(--tint);
  padding:10px 10px 12px;
}

.cal__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-bottom:8px;
}
.cal__month{
  margin:0;
  font-size:14px;
  font-weight:700;
  letter-spacing:-.1px;
}
.cal__nav{
  flex:none;
  width:44px;
  height:44px;
  border:1px solid var(--line);
  border-radius:10px;
  background:var(--card);
  color:var(--ink);
  font:inherit;
  font-size:19px;
  font-weight:600;
  line-height:1;
  cursor:pointer;
}
.cal__nav:disabled{opacity:.32;cursor:default}
.cal__nav:not(:disabled):active{transform:translateY(1px)}

.cal__dow,
.cal__grid{
  display:grid;
  grid-template-columns:repeat(7,1fr);
  gap:5px;
}
.cal__dow{
  margin-bottom:4px;
  font-size:10.5px;
  font-weight:600;
  letter-spacing:.04em;
  color:var(--ink-3);
  text-align:center;
}

.cal__day{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  min-height:45px;
  padding:4px 1px;
  border:1px solid var(--line);
  border-radius:10px;
  background:var(--card);
  color:inherit;
  font:inherit;
  cursor:pointer;
}
.cal__num{
  font-size:14px;
  font-weight:650;
  font-variant-numeric:tabular-nums;
  line-height:1.1;
}
.cal__day--today .cal__num{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:2px}
.cal__day:disabled{
  background:var(--no-bg);
  border-color:var(--hair);
  color:var(--no);
  cursor:not-allowed;
}
.cal__day.cal__day--out{
  background:transparent;
  border-color:transparent;
  color:#c3cad2;
}
.cal__day[aria-checked="true"]{
  background:var(--brand);
  border-color:var(--brand);
  color:var(--on-brand);
}
.cal__day[aria-checked="true"] .cal__num{text-decoration:none}

.cal__pad{visibility:hidden}

/*
  .    ||
.||.  ...  .. .. ..     ....   ....
 ||    ||   || || ||  .|...|| ||. '
 ||    ||   || || ||  ||      . '|..
 '|.' .||. .|| || ||.  '|...' |'..|'
*/
.times{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:9px;
}
.slot{
  display:flex;
  align-items:center;
  justify-content:center;
  padding:14px 10px;
  font:inherit;
  font-size:14.5px;
  font-weight:650;
  color:var(--ink-2);
  background:var(--card);
  border:1px solid var(--line);
  border-radius:var(--radius-sm);
  font-variant-numeric:tabular-nums;
  cursor:pointer;
  transition:border-color .15s ease,box-shadow .15s ease;
}
.slot:hover:not(:disabled):not([aria-checked="true"]){border-color:var(--ink-3)}
.slot[aria-checked="true"]{
  border-color:var(--brand);
  box-shadow:inset 0 0 0 1px var(--brand);
  background:var(--hair);
  color:var(--ink);
}

.slot:disabled{
  background:#faf8f7;
  border-color:var(--line);
  color:var(--no);
  cursor:not-allowed;
}
.slot:disabled{position:relative}
.slot:disabled::after{
  content:"";
  position:absolute;
  left:15%;
  right:15%;
  top:50%;
  height:2.5px;
  background:currentColor;
  border-radius:1px;
  transform:translateY(-50%);
  pointer-events:none;
}

.key{
  display:flex;
  gap:14px;
  list-style:none;
  margin:12px 0 0;
  padding:0;
  font-size:11.5px;
  color:var(--ink-3);
}
.key__chip{
  display:inline-block;
  width:10px;
  height:10px;
  border-radius:3px;
  margin-right:5px;
  vertical-align:-1px;
}
.key__chip--open{background:var(--card);border:1px solid var(--line)}
.key__chip--taken{background:var(--no-bg);border:1px solid var(--line)}
.key__chip--picked{background:var(--brand);border:1px solid var(--brand)}

/*
                    .    '||
 ...    ...   .... .||.   ||     ...    ...   ...
.. '  .|  '|. '' .||  ||   ||   .|  '|. .|  '|. .|  '|.
''.... ||   || .|' ||  ||   ||   ||   || ||   || ||   ||
      '|..|' '|..'|' .||. .||.   '|..|'  '|..|'  '|..|'
*/
.notes{display:block}
.notes__input{
  display:block;
  width:100%;
  font-size:16px;
  padding:12px 13px;
  border:1px solid var(--line);
  border-radius:var(--radius-sm);
  background:var(--tint);
  color:var(--ink);
  font:inherit;
  font-size:16px;
  line-height:1.45;
  resize:vertical;
  min-height:76px;
}
.notes__input::placeholder{color:#a8b1bb}
.notes__input:focus{outline:none;border-color:var(--brand);background:var(--card)}

.notes__count{
  margin:6px 0 0;
  text-align:right;
  font-size:11.5px;
  color:var(--ink-3);
  font-variant-numeric:tabular-nums;
}
.notes__count--full{color:var(--ink-2);font-weight:650}

.field{display:block}
.field + .field{margin-top:12px}
.field__label{
  display:block;
  margin-bottom:6px;
  font-size:13px;
  font-weight:600;
  color:var(--ink-2);
}
.field__input{
  display:block;
  width:100%;
  min-height:46px;
  padding:12px 13px;
  border:1px solid var(--line);
  border-radius:var(--radius-sm);
  background:var(--tint);
  color:var(--ink);
  font:inherit;
  font-size:16px;
  line-height:1.3;
}
.field__input::placeholder{color:#a8b1bb}
.field__input:focus{outline:none;border-color:var(--brand);background:var(--card)}

.addr{position:relative}
.addr__box{
  position:absolute;
  z-index:5;
  left:0;
  right:0;
  top:calc(100% + 4px);
  border:1px solid var(--line);
  border-radius:var(--radius-sm);
  background:var(--card);
  box-shadow:0 14px 30px -14px rgba(18,22,28,.35);
  overflow:hidden;
}
.addr__box[hidden]{display:none}
.addr__list{
  margin:0;
  padding:0;
  list-style:none;
  max-height:236px;
  overflow-y:auto;
}
.addr__item{
  display:flex;
  align-items:baseline;
  gap:9px;
  padding:11px 13px;
  font-size:14px;
  line-height:1.35;
  cursor:pointer;
}
.addr__item + .addr__item{border-top:1px solid var(--hair)}
.addr__item[aria-selected="true"]{background:var(--ok-bg)}

.addr__warn{
  margin:8px 2px 0;
  font-size:12.5px;
  line-height:1.45;
  color:var(--warn);
}
.addr__warn[hidden]{display:none}

.summary{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:12px;
  margin:14px 0 0;
  font-variant-numeric:tabular-nums;
}
.summary[hidden]{display:none}
.summary__when{font-size:13.5px;font-weight:600;color:var(--ink-2)}
.summary__price{font-size:20px;font-weight:700;letter-spacing:-.3px}

.cta{
  width:100%;
  margin-top:12px;
  padding:15px;
  border:2px solid var(--rose);
  border-radius:var(--radius-sm);
  background:var(--rose);
  color:#2b1310;
  font:inherit;
  font-size:16px;
  font-weight:700;
  letter-spacing:-.01em;
  cursor:pointer;
  transition:background-color .14s ease, border-color .14s ease;
}
.cta:hover:not(:disabled){background:var(--rose-deep);border-color:var(--rose-deep);color:#fff}
.cta:disabled{opacity:.42;cursor:not-allowed}
.cta:active{transform:translateY(1px)}
.cta--ghost{
  background:var(--card);
  color:var(--ink);
  border-color:var(--line);
}

/*
                                 ||             .
... ..    ....    ....    ....  ...  ... ...  .||.
 ||' '' .|...|| .|   '' .|...||  ||   ||'  ||  ||
 ||     ||      ||      ||       ||   ||    |  ||
.||.     '|...'  '|...'  '|...' .||.  ||...'   '|.'
                                      ||
                                     ''''
*/
.receipt{
  margin:0 20px 20px;
  padding:16px 16px 14px;
  border:1px solid var(--ok-line);
  border-radius:14px;
  background:var(--ok-bg);
}
.receipt__title{margin:0 0 12px;font-size:15px;letter-spacing:-.1px}
.receipt__list{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:6px 14px;
  margin:0;
  font-size:13.5px;
}
.receipt__list dt{color:var(--ink-3)}
.receipt__list dd{
  margin:0;
  text-align:right;
  font-weight:600;
  font-variant-numeric:tabular-nums;
}
.receipt__list dd.is-wrap{
  font-weight:600;
  font-size:13.5px;
  line-height:1.4;
  white-space:pre-wrap;
  overflow-wrap:anywhere;
}
.receipt__list dd.is-note{font-weight:400}
.receipt__list dd.is-total{
  font-size:18px;
  letter-spacing:-.2px;
}

.box__foot{
  padding:16px 20px 18px;
  border-top:1px solid var(--hair);
  background:var(--tint);
  font-size:13px;
  color:var(--ink-2);
}
.box__foot p{margin:0 0 7px}
.box__foot p:last-child{margin-bottom:0}
.box__foot a{color:var(--ink);text-decoration-thickness:1px;text-underline-offset:2px}
.box__area{font-size:12.5px;color:var(--ink-3);line-height:1.45}
.box__note{font-size:12.5px;color:var(--ink-3);line-height:1.45}

.credit{
  margin:16px 0 0;
  display:flex;align-items:center;justify-content:center;gap:6px;
  font-size:12px;
  color:var(--ink-3);
  text-decoration:none;
  width:fit-content;margin-left:auto;margin-right:auto;
  transition:color .14s ease;
}
.credit:hover{ color:var(--rose-deep) }
.credit:focus-visible{ outline:2px solid var(--ink);outline-offset:3px;border-radius:3px }
.credit__mark{width:13px;height:13px;flex:0 0 auto;opacity:.9;display:block}
@media (forced-colors: active){
  .credit__mark{forced-color-adjust:none;color:CanvasText}
}
.credit--small{margin-top:4px;font-size:11px;color:rgb(18 22 28 / 0.75)}

/*
 ....    ....  ... ..  ....   ....  .... ...  ....
||. '  .|...||  ||' ''  '|.  |  ||. '  '|.  |  ||. '
. '|.. ||       ||       '|.|   . '|..  '|.|
|'..|'  '|...' .||.       '|    |'..|'  '|
*/
:focus-visible{outline:2px solid var(--brand);outline-offset:2px;border-radius:8px}
/*
'||                      '||                   '||
 || ...    ...     ...    ||  ..    ....     .. ||
 ||'  || .|  '|. .|  '|.  || .'   .|...||  .'  '||
 ||    | ||   || ||   ||  ||'|.   ||       |.   ||
 '|...'   '|..|'  '|..|' .||. ||.  '|...'  '|..'||.
  what the booking says for itself
*/
.receipt__said{margin:14px 0 0;font-size:15px;font-weight:600;color:var(--ok)}
.receipt__said--no{color:var(--warn)}
.receipt__dev{margin:6px 0 0;font-size:13px;color:var(--ink-3)}
.receipt__said[hidden],
.receipt__dev[hidden]{display:none}

/*
      .     '||     .        '||      ||    .
    .||.     ||   .||.     .. ||    ...  .||.
     ||      ||    ||    .'  '||     ||   ||
     ||      ||    ||    |.   ||     ||   ||
    .||.    .||.  .||.   '|..'||.   .||.  '|.
  the tick, and what it says
*/
.booked{
  margin:0 16px 22px;padding:30px 20px 24px;text-align:center;
  background:var(--tint);border:1px solid var(--line);border-radius:var(--radius);
}
.booked[hidden]{display:none}

.booked__tick{width:78px;height:78px;display:block;margin:0 auto 14px}
.booked__tick[hidden]{display:none}
.booked__tick circle{
  fill:none;stroke:var(--ok-line);stroke-width:2.5;
  stroke-dasharray:157;stroke-dashoffset:157;
  animation:tick-ring .55s ease-out forwards;
}
.booked__tick path{
  fill:none;stroke:var(--ok);stroke-width:5;
  stroke-linecap:round;stroke-linejoin:round;
  stroke-dasharray:42;stroke-dashoffset:42;
  animation:tick-mark .32s .45s ease-out forwards;
}
@keyframes tick-ring{to{stroke-dashoffset:0}}
@keyframes tick-mark{to{stroke-dashoffset:0}}
@keyframes step-pop{0%{transform:scale(1)}45%{transform:scale(1.18)}100%{transform:scale(1)}}

.booked__mail{width:78px;height:78px;display:block;margin:0 auto 14px}
.booked__mail[hidden]{display:none}
.booked__mail rect{
  fill:none;stroke:var(--ink);stroke-width:2.5;
  stroke-dasharray:150;stroke-dashoffset:150;
  animation:tick-ring .6s ease-out forwards;
}
.booked__mail path{
  fill:none;stroke:var(--ink);stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round;
  stroke-dasharray:60;stroke-dashoffset:60;
  animation:tick-mark .4s .45s ease-out forwards;
}
.booked__eyebrow{
  margin:0 0 4px;font-size:12px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;
  color:var(--ink);
}
.booked__eyebrow[hidden]{display:none}

#booked-open-mail{
  display:block;text-align:center;text-decoration:none;
  background:var(--rose);border:2px solid var(--rose);color:#2b1310;
}
#booked-open-mail:hover{background:var(--rose-deep);border-color:var(--rose-deep);color:#fff}
.booked__alt{
  display:block;width:fit-content;margin:10px auto 0;
  font-size:12.5px;font-weight:600;color:var(--ink-3);
  text-decoration:underline;text-underline-offset:2px;
}
.booked__alt:hover{ color:var(--ink) }
.booked__alt[hidden]{ display:none }
#booked-open-mail[hidden],
#booked-again[hidden]{display:none}

@media (prefers-reduced-motion: reduce){
  .booked__tick circle,.booked__tick path,
  .booked__mail rect,.booked__mail path{animation:none;stroke-dashoffset:0}
}

.booked__title{margin:0 0 6px;font-size:27px;letter-spacing:-.015em}
.booked__when{margin:0 0 18px;font-size:15px;font-weight:600;color:var(--ink)}
.booked__list{
  display:grid;grid-template-columns:auto 1fr;gap:8px 14px;
  margin:0 auto 18px;padding:0;max-width:340px;text-align:left;
}
.booked__list dt{color:var(--ink-3);font-size:14px}
.booked__list dd{margin:0;font-size:15px;min-width:0;word-break:break-word}
.booked__list dd.is-total{font-weight:700}
.booked__dev{margin:0 0 16px;font-size:13px;color:var(--ink-3)}

.box__head :focus-visible{outline-color:var(--ink)}

@media (min-width:480px){
  .times{grid-template-columns:repeat(4,1fr)}
  .cal__day{min-height:46px}
  .cal__num{font-size:15px}
}

@media (min-width:560px){
  .services{grid-template-columns:1fr 1fr}
  .stage{padding:40px 20px 48px}
  .booking{padding:2px 24px 22px}
  .box__head{padding:26px 24px 22px}
  .box__foot{padding:18px 24px 20px}
  .receipt{margin:0 24px 22px}
  .cal{padding:12px 12px 14px}
  .cal__grid,.cal__dow{gap:6px}
}

@media (min-width:900px){
  .cal__day{min-height:50px}
}

@media (prefers-reduced-motion:reduce){
  *{animation:none !important;transition:none !important;scroll-behavior:auto !important}
  .cta:active{transform:none}
  .cal__nav:not(:disabled):active{transform:none}
  .booked__tick circle,
  .booked__tick path{animation:none;stroke-dashoffset:0}
}

.box__legal{ margin:8px 0 0;font-size:12px;opacity:.62 }