@font-face{font-family:"Verbatim";src:url("/fonts/verbatim-bold.woff2") format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"Verbatim";src:url("/fonts/verbatim-black.woff2") format("woff2");font-weight:900;font-display:swap}
@font-face{font-family:"Work Sans";src:url("/fonts/work-sans-regular.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Work Sans";src:url("/fonts/work-sans-medium.woff2") format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Work Sans";src:url("/fonts/work-sans-semibold.woff2") format("woff2");font-weight:600;font-display:swap}

:root{--charcoal:#161616;--ink:#232323;--cream:#F6F2EB;--emerald:#0B6B4A;--gold:#C4A465;--body:#4A4744;--muted-text:#6F6A63;--hairline:#E4DDD1}
::selection{background:var(--emerald);color:var(--cream)}
[data-hero] ::selection,[data-on-dark] ::selection{background:var(--cream);color:var(--emerald)}

/* Focus: 2px, contrast-checked per surface (emerald on cream 5.9:1, cream on dark/emerald, gold on charcoal 7.6:1) */
:focus-visible{outline:2px solid var(--emerald);outline-offset:3px}
[data-navbar] :focus-visible,[data-hero] :focus-visible,[data-on-dark] :focus-visible{outline-color:var(--cream)}
[data-panel] :focus-visible{outline-color:var(--gold)}
[tabindex="-1"]:focus{outline:none}

.skip{position:fixed;left:16px;top:-80px;z-index:10002;padding:14px 18px;background:var(--cream);color:var(--ink);font:500 11px/1 "Work Sans",sans-serif;letter-spacing:.2em;text-transform:uppercase;text-decoration:none;transition:top .2s cubic-bezier(.22,1,.36,1)}
.skip:focus{top:16px;outline:2px solid var(--emerald)}

[data-hover-fill]:focus-visible{background:var(--cream)!important;color:var(--ink)!important}@media (hover:hover){/* "Book now" hover fill (was a Claude Design style-hover attribute) */
[data-hover-fill]:hover{background:var(--cream)!important;color:var(--ink)!important}}
/* Logo alt text stays legible if the image fails */
nav[data-menu] img{color:var(--cream);font:500 11px "Work Sans",sans-serif}

/* Footer (handoff 5a): links are inline-styled; add the hover and kill default underlines */
[data-vip-footer] a{text-decoration:none}
/* Footer links: 44px to tap without moving the layout */
[data-vip-footer] a{padding-block:11px;margin-block:-11px}
@media (hover:hover){[data-vip-footer] a:hover{color:var(--cream)!important}}
[data-vip-footer] a[href^="tel"]{padding-bottom:2px}
/* Phones: two aligned columns instead of five individually centred blocks */
@media (max-width:600px){
  [data-vip-footer] [style*="minmax(180px"]{grid-template-columns:1fr 1fr!important;gap:44px 20px!important;padding-top:44px!important}
  [data-vip-footer] [style*="justify-self:center"]{justify-self:start!important}
  [data-vip-footer] [style*="minmax(180px"] a{white-space:normal!important}
  [data-vip-footer] [style*="minmax(180px"]>div{min-width:0}
}
@media (max-width:520px){[data-toggle]>span:last-child{display:none!important}[data-toggle]{padding:0 16px!important}}
@media (max-width:380px){nav[data-menu] a[href="/book"]{padding:0 10px!important;letter-spacing:.14em!important}}
/* Menu on phones: one column, links wrap, the services column (hover-only) is hidden */
@media (max-width:760px){
  [data-panel]>div:last-child{grid-template-columns:1fr!important;align-content:start!important;padding-top:32px}
  [data-panel]>div:last-child>div:first-child a>span>span{font-size:clamp(38px,11vw,54px)!important;white-space:normal!important}
  [data-panel] [data-k="svcgrp"]{display:none!important}
}

.bk-f.is-bad{background:rgba(224,126,108,.1);box-shadow:inset 0 -2px 0 #E89A8A}
.bk-f.is-bad>span{color:#F2B9AD}
.bk-msg{margin:12px 0 0;font-size:15px;line-height:1.45;color:#F2B9AD}
.bk-go.is-going{pointer-events:none;opacity:.86}
.closer-msg{flex-basis:100%;margin:0;font-size:15px;line-height:1.45;color:rgba(246,242,235,.8)}
.closer-msg.bad{color:#F2B9AD}
.closer-form input[aria-invalid="true"]{border-bottom-color:#E89A8A}
@media (prefers-reduced-motion: reduce){img{translate:none!important;scale:none!important}}
/* Photo parallax (src/js/parallax.js): the frame names a view timeline and its photo drifts along it, on the compositor. */
@keyframes vip-par{from{translate:0 -4%}to{translate:0 4%}}
img.vpar{scale:1.1}
@supports (animation-timeline: view()){.vpar-f{view-timeline:--vpar block}img.vpar{animation:vip-par linear both;animation-timeline:--vpar}}
html.a11y-still img.vpar{animation:none;scale:none;translate:none}
@media (prefers-reduced-motion: reduce){img.vpar{animation:none}}
/* Touch screens: every control gets a target of at least 44x44px without anything moving. The extra area is an
   invisible ::after centred on the control (or padding offset by margin where ::after is taken). Shared by the coded
   site and the Webflow build, so both stay identical. */
@media (pointer:coarse){
.io-l,.hm-tl,.lv-go,.csvc-all,.qa-text,.pk-tabs button,[data-toc] a,[data-vip-footer] a,a[data-hk],.qa-rail a,.oc-n{position:relative}
.io-l::after,.hm-tl::after,.lv-go::after,.csvc-all::after,.qa-text::after,.pk-tabs button::after,[data-toc] a::after,[data-vip-footer] a::after,a[data-hk]::after,.qa-rail a::after,.oc-n::after,.reel-cap::after,.chips button::after{content:"";position:absolute;left:50%;top:50%;width:max(100%,44px);height:max(100%,44px);transform:translate(-50%,-50%)}
[data-toc-details] summary{padding-block:5px;margin-block:-5px}
.mad input{min-width:44px}
}