/* Booking form: native port of limestone 3's tap form. Colours come from the site theme.
   Class names that clash with the older form (field, chip, chips, consent) are prefixed "l". */
[hidden]{ display:none !important }
.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0 }
.book-page{ max-width:var(--max); margin:0 auto; padding:clamp(40px, 7vh, 72px) var(--gut) clamp(72px, 10vh, 110px) }
.book-head{ max-width:900px; margin-bottom:clamp(28px, 4vh, 44px) }
.book-head .kicker span{ color:var(--accent-text) }
.book-head h1{ margin-top:14px; font-size:clamp(42px, 6.4vw, 92px); line-height:.95 }
.book-head .doc-meta{ margin-top:16px; font-size:15px; color:var(--ink-2) }
.book-layout{ display:grid; grid-template-columns:minmax(0, 1.35fr) minmax(0, .65fr); gap:clamp(24px, 4vw, 56px); align-items:start }

.lbk{ background:var(--card); border:1px solid var(--rule); border-radius:18px; padding:clamp(22px, 3vw, 40px); box-shadow:0 30px 80px rgba(20,20,20,.08) }
.bk-progress{ list-style:none; margin:0 0 28px; padding:0; display:grid; grid-template-columns:repeat(3, 1fr); gap:8px }
.bk-progress li{ display:flex; align-items:center; gap:8px; padding-top:12px; border-top:3px solid var(--rule); font:500 13px var(--sans); color:var(--ink-2); transition:color .3s, border-color .3s }
.bk-progress li i{ font-style:normal; display:grid; place-items:center; width:24px; height:24px; border-radius:50%; background:var(--paper-2); font-size:12px; font-weight:600 }
.bk-progress li.on, .bk-progress li.done{ color:var(--ink); border-top-color:var(--accent) }
.bk-progress li.on i, .bk-progress li.done i{ background:var(--accent); color:var(--on-accent) }
.bk-step{ border:0; margin:0; padding:0; min-width:0; outline:none }
.bk-step > legend{ font-family:var(--display, var(--serif)); font-weight:var(--hw, 700); font-size:clamp(28px, 3vw, 40px); line-height:1.05; letter-spacing:-.01em; margin-bottom:20px; padding:0; text-transform:none }
.bk-step.enter{ animation:bk-up .45s cubic-bezier(.22,.61,.36,1) both }
@keyframes bk-up{ from{ opacity:0; transform:translateY(14px); filter:blur(4px) } to{ opacity:1; transform:none; filter:none } }

.bk-cards{ display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:10px }
.bk-card{ position:relative; display:grid; grid-template-columns:42px 1fr; grid-template-rows:auto auto; column-gap:12px; align-items:center;
  padding:14px 16px; border:1.5px solid var(--rule); border-radius:14px; cursor:pointer; background:var(--card); min-height:72px;
  transition:border-color .25s, background .25s, transform .25s }
.bk-card:hover{ border-color:var(--ink-2); transform:translateY(-1px) }
.bk-card input{ position:absolute; opacity:0; pointer-events:none }
.bk-ico{ grid-row:1 / span 2; display:grid; place-items:center; width:42px; height:42px; border-radius:12px; background:var(--paper-2); color:var(--ink) }
.bk-ico svg{ width:22px; height:22px }
.bk-card b{ font:600 15.5px/1.25 var(--sans) }
.bk-card small{ font-size:13px; color:var(--ink-2); line-height:1.35 }
.bk-card:has(input:checked){ border-color:var(--ink); background:var(--accent-soft) }
.bk-card:has(input:checked) .bk-ico{ background:var(--accent); color:var(--on-accent) }
.bk-card:has(input:focus-visible){ box-shadow:0 0 0 3px var(--accent) }
.bk-card.danger .bk-ico{ background:var(--ink); color:var(--dk-accent, var(--accent)) }
.bk-card:last-child:nth-child(odd){ grid-column:1 / -1 }
.bk-urgent{ margin-top:14px; display:flex; flex-wrap:wrap; align-items:center; gap:12px 18px; padding:16px 18px; border-radius:14px; background:var(--ink); color:#F2F3F1; font-size:15px; line-height:1.5 }
.bk-urgent p{ flex:1 1 260px } .bk-urgent b{ color:var(--accent) }

.lfield{ display:block; margin-top:16px }
.lfield > span{ display:block; font:600 12px var(--sans); letter-spacing:.08em; text-transform:uppercase; color:var(--ink-2); margin-bottom:6px }
.lfield input, .lfield select, .lfield textarea{ width:100%; height:52px; border:1.5px solid var(--rule); border-radius:12px; background:#fff; color:var(--ink); padding:0 14px; font:16px var(--sans); -webkit-appearance:none; appearance:none }
.lfield textarea{ height:auto; min-height:92px; padding:12px 14px; resize:vertical }
.lfield select{ background:#fff url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8'><path d='M1 1l5 5 5-5' fill='none' stroke='%23323232' stroke-width='1.5'/></svg>") no-repeat right 14px center; padding-right:36px }
.lfield input:focus, .lfield select:focus, .lfield textarea:focus{ outline:2px solid var(--ink); outline-offset:0; border-color:transparent }
.lfield > span em, .bk-inline legend em{ font-style:normal; font-weight:400; color:var(--ink-2); text-transform:none; letter-spacing:0; margin-left:4px }
.row2{ display:grid; grid-template-columns:1fr 1fr; gap:12px }
.bk-hint{ min-height:20px; margin-top:6px; font-size:14px; color:var(--ink-2) }
.bk-hint.ok{ color:var(--ok) }
.bk-inline{ border:0; margin:18px 0 0; padding:0; min-width:0 }
.bk-inline legend{ font:600 12px var(--sans); letter-spacing:.08em; text-transform:uppercase; color:var(--ink-2); margin-bottom:8px; padding:0 }
.lchips{ display:flex; flex-wrap:wrap; gap:8px }
.lchip{ position:relative }
.lchip input{ position:absolute; opacity:0; pointer-events:none }
.lchip span{ display:inline-flex; align-items:center; min-height:44px; padding:0 18px; border-radius:999px; border:1.5px solid var(--rule); font-size:15px; cursor:pointer; transition:border-color .2s, background .2s }
.lchip span:hover{ border-color:var(--ink-2) }
.lchip input:checked + span{ border-color:var(--ink); background:var(--accent-soft); font-weight:600 }
.lchip input:focus-visible + span{ box-shadow:0 0 0 3px var(--accent) }
.lconsent{ display:grid; grid-template-columns:22px 1fr; gap:10px; align-items:start; margin-top:16px; font-size:14px; line-height:1.45; color:var(--ink-2); cursor:pointer }
.lconsent input{ width:20px; height:20px; margin:1px 0 0; accent-color:var(--ink); cursor:pointer }
.tcpa{ margin-top:14px; font-size:12.5px; line-height:1.5; color:var(--ink-2) }
.tcpa a, .bk-privacy a{ color:var(--ink) }
.hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden }
.bk-err{ margin-top:12px; font-size:14.5px; color:#9b1c1c; font-weight:600 }
.bk-err:empty{ margin:0 }
.bk-nav{ display:flex; justify-content:space-between; align-items:center; gap:10px; margin-top:24px }

/* Buttons inside the form (reuse the hero pill; light-background variant for "line") */
.lbk .ls-pill, .bk-side .ls-pill, .bk-done .ls-pill{ white-space:normal; text-align:center; line-height:1.15; height:auto; min-height:52px; padding:10px 22px }
.lbk .ls-pill.line{ color:var(--ink); background:transparent; box-shadow:inset 0 0 0 1.5px var(--rule) }
.lbk .ls-pill.line:hover{ background:var(--paper-2) }
.bk-nav .ls-pill{ min-width:150px }
.bk-urgent .ls-pill{ min-height:46px }
.linkbtn{ border:0; background:none; padding:10px 0; font:inherit; color:var(--ink); cursor:pointer; text-decoration:underline; text-underline-offset:3px }

.bk-send{ margin-top:24px; padding-top:22px; border-top:1px solid var(--rule) }
.bk-send-lede{ font-size:15.5px; color:var(--ink-2); margin-bottom:14px } .bk-send-lede b{ color:var(--ink) }
.bk-send-btns{ display:grid; grid-template-columns:1fr 1fr; gap:10px }
.bk-send-btns .ls-pill{ width:100%; gap:10px }
.bk-send-btns svg{ width:20px; height:20px; flex-shrink:0; fill:none; stroke:currentColor; stroke-width:1.9; stroke-linejoin:round }
.ls-pill.wa{ background:#fff; color:var(--ink); box-shadow:inset 0 0 0 1.5px var(--rule) }
.ls-pill.wa:hover{ background:#f1f8f4; box-shadow:inset 0 0 0 1.5px #128C7E }
.ls-pill.wa .wa-logo{ fill:#25D366; stroke:none; width:22px; height:22px }
.bk-back{ display:block; margin:12px auto 0; color:var(--ink-2) }

.bk-done{ text-align:center; outline:none; animation:bk-up .5s cubic-bezier(.22,.61,.36,1) both }
.bk-check{ display:inline-grid; place-items:center; width:64px; height:64px; border-radius:50%; background:var(--accent); color:var(--on-accent); margin-bottom:16px }
.bk-check svg{ width:30px; height:30px }
.bk-done h2{ font-family:var(--display, var(--serif)); font-weight:var(--hw, 700); font-size:clamp(32px, 3.6vw, 46px); line-height:1.02; text-transform:none }
.bk-done > p{ margin-top:10px; color:var(--ink-2) }
.bk-handoff{ display:flex; flex-wrap:wrap; justify-content:center; gap:10px; margin-top:22px }
.bk-done .ls-pill.line{ color:var(--ink); background:transparent; box-shadow:inset 0 0 0 1.5px var(--rule) }
.bk-copied{ min-height:20px; margin-top:10px; font-size:14px; color:var(--ok) }
.bk-preview{ max-width:440px; margin:6px auto 0; text-align:left; font-size:14px }
.bk-preview summary{ cursor:pointer; color:var(--ink-2); text-align:center; min-height:44px; display:flex; align-items:center; justify-content:center }
.bk-preview pre{ margin-top:10px; padding:14px 16px; border-radius:12px; background:var(--paper-2); white-space:pre-wrap; font:13.5px/1.55 var(--sans); color:var(--ink) }
.bk-done .bk-next{ text-align:left; max-width:440px; margin:28px auto }

.bk-side{ position:sticky; top:100px; display:flex; flex-direction:column; gap:22px }
.bk-side h2{ font-family:var(--display, var(--serif)); font-weight:var(--hw, 700); font-size:30px; line-height:1; text-transform:none }
.bk-emergency{ display:flex; flex-direction:column; gap:4px; padding:20px; border-radius:16px; background:var(--ink); color:#F2F3F1 }
.bk-emergency small{ font:600 11.5px var(--sans); letter-spacing:.12em; text-transform:uppercase; color:var(--accent) }
.bk-emergency a{ font-family:var(--display, var(--serif)); font-size:34px; line-height:1.15; color:#fff; text-decoration:none }
.bk-emergency a:hover{ text-decoration:underline }
.bk-emergency span{ font-size:14.5px; color:rgba(242,243,241,.8) }
.bk-next{ list-style:none; margin:0; padding:0; counter-reset:n; display:flex; flex-direction:column; gap:14px }
.bk-next li{ counter-increment:n; display:grid; grid-template-columns:32px 1fr; column-gap:12px }
.bk-next li::before{ content:counter(n); grid-row:1 / span 2; display:grid; place-items:center; width:30px; height:30px; border-radius:50%; background:var(--accent); color:var(--on-accent); font:600 13px var(--sans) }
.bk-next b{ font:600 15.5px var(--sans) }
.bk-next span{ font-size:14.5px; color:var(--ink-2); line-height:1.45 }
.bk-proof{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:8px }
.bk-proof li{ font:500 13px var(--sans); display:inline-flex; align-items:center; gap:7px; padding:7px 13px 7px 10px; border-radius:999px; border:1px solid var(--rule); background:var(--paper) }
.bk-proof svg{ flex-shrink:0; width:16px; height:16px; fill:none; stroke:var(--ink); stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round }
.bk-privacy{ font-size:13px; color:var(--ink-2) }

@media (max-width:900px){ .book-layout{ grid-template-columns:minmax(0, 1fr) } .bk-side{ position:static } }
@media (max-width:560px){
  .bk-cards{ grid-template-columns:minmax(0, 1fr) }
  .bk-progress li{ font-size:0; gap:0; justify-content:center }
  .bk-progress li i{ font-size:12px }
  .bk-nav .ls-pill{ min-width:0; flex:1 }
  .row2{ grid-template-columns:minmax(0, 1fr); gap:0 }
  .bk-send-btns{ grid-template-columns:1fr }
  .bk-handoff .ls-pill{ width:100% }
}
@media (prefers-reduced-motion:reduce){ .bk-step.enter, .bk-done{ animation:none } }

/* Guards against the older form styles (.done) and the flex kicker */
.bk-progress li.done, .bk-progress li.on{ border:0; border-top:3px solid var(--accent); border-radius:0; box-shadow:none; background:none; padding:12px 0 0; margin:0 }
.book-head .kicker{ display:block }
.book-head .kicker::before{ display:inline-block; vertical-align:middle; margin-right:10px }