/* Webflow's base stylesheet differs from browser defaults the coded site relies on: put the browser defaults back. */
html{font-family:revert;height:revert}
body{color:revert;background-color:revert;min-height:revert;font-family:revert;font-size:revert;line-height:revert}
h1,h2,h3,h4,h5,h6{margin-top:revert;margin-bottom:revert;font-size:revert;line-height:revert;font-weight:revert}
p{margin-top:revert;margin-bottom:revert}
ul,ol{margin-top:revert;margin-bottom:revert;padding-left:revert}
img{vertical-align:revert;max-width:revert;display:revert}
blockquote{border-left:revert;margin:revert;padding:revert;font-size:revert;line-height:revert}
figure{margin:revert}figcaption{text-align:revert;margin-top:revert}
label{margin-bottom:revert;font-weight:revert;display:revert}
small{font-size:revert}sub,sup{vertical-align:revert;font-size:revert;line-height:revert;position:revert;top:revert;bottom:revert}
button,input,optgroup,select,textarea{color:revert;font:revert;margin:revert}
button{overflow:revert;text-transform:revert}
input{line-height:revert}
video,audio,canvas,progress{vertical-align:revert;display:revert}
table{border-collapse:revert;border-spacing:revert}td,th{padding:revert}
.vip-body{display:contents}
:root:not(#wfx){--charcoal: #161616; --ink: #232323; --cream: #F6F2EB; --emerald: #0B6B4A; --gold: #C4A465; --body: #4A4744; --muted-text: #6F6A63; --hairline: #E4DDD1;}
:not(#wfx)::selection{background: var(--emerald); color: var(--cream);}
[data-hero]:not(#wfx) ::selection,[data-on-dark]:not(#wfx) ::selection{background: var(--cream); color: var(--emerald);}
:focus-visible:not(#wfx){outline: 2px solid var(--emerald); outline-offset: 3px;}
[data-navbar]:not(#wfx) :focus-visible,[data-hero]:not(#wfx) :focus-visible,[data-on-dark]:not(#wfx) :focus-visible{outline-color: var(--cream);}
[data-panel]:not(#wfx) :focus-visible{outline-color: var(--gold);}
[tabindex="-1"]:focus:not(#wfx){outline: none;}
.skip:focus:not(#wfx){top: 16px; outline: 2px solid var(--emerald);}
[data-hover-fill]:focus-visible:not(#wfx){background: var(--cream) !important; color: var(--ink) !important;}
@media (hover: hover){[data-hover-fill]:hover:not(#wfx){background: var(--cream) !important; color: var(--ink) !important;}}
@media (hover: hover){[data-vip-footer]:not(#wfx) a:hover{color: var(--cream) !important;}}
@media (max-width: 380px){nav[data-menu]:not(#wfx) a[href="https://vipbookinglink.vercel.app/book"]{padding: 0px 10px !important; letter-spacing: 0.14em !important;}}
.bk-f.is-bad:not(#wfx){background: rgba(224, 126, 108, 0.1); box-shadow: rgb(232, 154, 138) 0px -2px 0px inset;}
.bk-f.is-bad:not(#wfx) > span{color: rgb(242, 185, 173);}
.bk-msg:not(#wfx){margin: 12px 0px 0px; font-size: 15px; line-height: 1.45; color: rgb(242, 185, 173);}
.bk-go.is-going:not(#wfx){pointer-events: none; opacity: 0.86;}
.closer-msg:not(#wfx){flex-basis: 100%; margin: 0px; font-size: 15px; line-height: 1.45; color: rgba(246, 242, 235, 0.8);}
.closer-msg.bad:not(#wfx){color: rgb(242, 185, 173);}
.closer-form:not(#wfx) input[aria-invalid="true"]{border-bottom-color: rgb(232, 154, 138);}
@media (prefers-reduced-motion: reduce){img:not(#wfx){translate: none !important; scale: none !important;}}
@keyframes vip-par { 
  0% { translate: 0px -4%; }
  100% { translate: 0px 4%; }
}
img.vpar:not(#wfx){scale: 1.1;}
@supports (animation-timeline: view()){.vpar-f:not(#wfx){view-timeline: --vpar;}}
@supports (animation-timeline: view()){img.vpar:not(#wfx){animation-duration: auto; animation-timing-function: linear; animation-delay: 0s; animation-iteration-count: 1; animation-direction: normal; animation-fill-mode: both; animation-play-state: running; animation-name: vip-par; animation-range: normal; animation-timeline: --vpar;}}
html.a11y-still:not(#wfx) img.vpar{animation: auto ease 0s 1 normal none running none; scale: none; translate: none;}
@media (prefers-reduced-motion: reduce){img.vpar:not(#wfx){animation: auto ease 0s 1 normal none running 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}
}
