/* Boost Club, concept 6 "Colour Club": bottle green rooms, bone daylight, one loud colour per shake.
   Type: Inter Tight (facts) + Cormorant italic (one feeling word) + Anton (the loud voice). */
:root{
  --bottle:#0B2B22; --night:#071E17; --pine:#123D31; --leaf:#1F6B4F; --leaf-hi:#2F8A63;
  --brass:#D9B26A; --brass-hi:#E6C68A; --brass-ink:#7A5B1E;
  --bone:#FBF8F2; --oat:#EFE8DA; --ink:#0E1412; --stone:#5E6A64; --sage:#B9C7B4;
  --line-d:rgba(244,239,230,.14); --line-l:#E2DACB; --cream:#F4EFE6;
  --display:'Inter Tight',ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;
  --accent:'Cormorant','Iowan Old Style',Georgia,serif;
  --loud:'Anton','Oswald',Impact,'Arial Narrow',sans-serif;
  --ease:cubic-bezier(.2,.7,.1,1);
  color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bone);color:var(--ink);font-family:var(--display);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
body.dark{background:var(--night);color:var(--cream)}
img,video{max-width:100%;display:block}
a{color:inherit}
p{margin:0 0 14px}
h1,h2,h3{margin:0;font-weight:600;letter-spacing:-.045em;line-height:.95;text-wrap:balance}
.it{font-family:var(--accent);font-style:italic;font-weight:500;letter-spacing:-.01em}
.loud{font-family:var(--loud);font-weight:400;text-transform:uppercase;letter-spacing:.005em;line-height:.86}
.eyebrow{display:block;font-size:12px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--brass-ink);margin-bottom:14px}
.on-dark .eyebrow,.dark .eyebrow{color:var(--brass)}
.gut{padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
@media (min-width:900px){.gut{padding-left:max(56px,env(safe-area-inset-left,0px));padding-right:max(56px,env(safe-area-inset-right,0px))}}
.wrap{max-width:1320px;margin:0 auto}
.sec{padding-block:clamp(88px,11vw,160px)}
.on-dark{background:var(--bottle);color:var(--cream)}
.night{background:var(--night);color:var(--cream)}
.oat{background:var(--oat)}
.h-xl{font-size:clamp(56px,8.6vw,146px);line-height:.88;letter-spacing:-.06em}
.h-l{font-size:clamp(44px,6vw,92px)}
.h-m{font-size:clamp(32px,3.6vw,52px);letter-spacing:-.04em}
.h-l .it,.h-xl .it{color:var(--leaf)}
.on-dark .h-l .it,.on-dark .h-xl .it,.night .h-l .it,.night .h-xl .it,.dark .h-xl .it,.dark .h-l .it{color:var(--brass)}
.lead{font-size:clamp(18px,1.6vw,22px);line-height:1.45;max-width:46ch}
.muted{color:var(--stone)}.on-dark .muted,.night .muted{color:rgba(244,239,230,.72)}
.small{font-size:13px}
.grid2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,6vw,96px);align-items:center}
@media (max-width:900px){.grid2{grid-template-columns:minmax(0,1fr)}}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:56px;padding:0 28px;border-radius:999px;font:600 16px/1 var(--display);text-decoration:none;border:0;cursor:pointer;white-space:nowrap;transition:background .16s var(--ease),color .16s var(--ease)}
.btn .ar{transition:transform .16s var(--ease)}.btn:hover .ar{transform:translateX(4px)}
.btn-brass{background:var(--brass);color:#13201B}.btn-brass:hover{background:var(--brass-hi)}
.btn-bottle{background:var(--bottle);color:#fff}.btn-bottle:hover{background:var(--pine)}
.btn-ghost{background:transparent;color:inherit;box-shadow:inset 0 0 0 1px currentColor}.btn-ghost:hover{background:rgba(127,127,127,.12)}
.btn-sm{height:44px;padding:0 20px;font-size:14px}
.row{display:flex;gap:10px;flex-wrap:wrap}
:focus-visible{outline:2px solid var(--brass);outline-offset:3px}

/* header */
.nav{position:fixed;inset:0 0 auto 0;z-index:40;display:flex;align-items:center;justify-content:space-between;gap:24px;height:76px;padding-top:env(safe-area-inset-top,0px);color:var(--cream);transition:background .3s var(--ease),color .3s var(--ease),height .3s var(--ease),box-shadow .3s}
.nav.light-start{color:var(--ink)}
.nav .brand img{height:20px;width:auto}
.nav .brand .d{display:none}
.nav.light-start .brand .c,.nav.solid .brand .c{display:none}.nav.light-start .brand .d,.nav.solid .brand .d{display:block}
.nav ul{display:flex;gap:28px;list-style:none;margin:0;padding:0;font-size:14px;font-weight:500}
.nav ul a{text-decoration:none;opacity:.86}.nav ul a:hover,.nav ul a[aria-current]{opacity:1}
.nav ul a[aria-current]{text-decoration:underline;text-underline-offset:6px;text-decoration-color:var(--brass);text-decoration-thickness:2px}
.nav .r{display:flex;align-items:center;gap:18px;font-size:13px;font-weight:600;letter-spacing:.08em}
.nav .lang b{color:var(--brass)}
.nav.solid{background:rgba(251,248,242,.94);backdrop-filter:blur(14px);color:var(--ink);height:64px;box-shadow:0 1px 0 var(--line-l)}
.nav .mb{display:none;width:42px;height:42px;border-radius:50%;border:1px solid currentColor;background:transparent;color:inherit;align-items:center;justify-content:center;cursor:pointer}
.nav .mb i{display:block;width:16px;height:1.5px;background:currentColor;box-shadow:0 5px 0 currentColor,0 -5px 0 currentColor}
@media (max-width:1060px){.nav ul,.nav .lang,.nav .r .btn{display:none}.nav .mb{display:inline-flex}.nav{height:64px}}
.sheet{position:fixed;inset:0;z-index:60;background:var(--bottle);color:var(--cream);display:flex;flex-direction:column;padding:calc(20px + env(safe-area-inset-top,0px)) max(20px,env(safe-area-inset-right,0px)) calc(28px + env(safe-area-inset-bottom,0px)) max(20px,env(safe-area-inset-left,0px));transform:translateY(-100%);transition:transform .5s var(--ease);visibility:hidden}
.sheet.on{transform:none;visibility:visible}
.sheet .top{display:flex;justify-content:space-between;align-items:center}
.sheet .top img{height:20px}
.sheet .x{width:42px;height:42px;border-radius:50%;border:1px solid currentColor;background:none;color:inherit;font-size:20px;cursor:pointer}
.sheet nav{margin-top:auto;display:flex;flex-direction:column;gap:6px}
.sheet nav a{font-size:clamp(34px,9vw,52px);font-weight:600;letter-spacing:-.04em;text-decoration:none;line-height:1.1}
.sheet .bot{margin-top:28px;display:flex;justify-content:space-between;align-items:center;font-size:14px;color:var(--sage)}

/* reserve bar */
.rbar{position:fixed;left:50%;bottom:calc(18px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:45;width:min(1120px,calc(100% - 40px));display:grid;grid-template-columns:1.5fr 1fr 1fr .8fr auto;background:rgba(7,30,23,.88);backdrop-filter:blur(18px);color:var(--cream);border:1px solid rgba(244,239,230,.16);border-radius:999px;padding:6px;box-shadow:0 18px 50px rgba(0,0,0,.28);animation:rin 1s var(--ease) .7s both}
@keyframes rin{from{opacity:0;transform:translate(-50%,140%)}to{opacity:1;transform:translate(-50%,0)}}
.rbar label{display:flex;flex-direction:column;justify-content:center;padding:6px 22px;border-right:1px solid rgba(127,127,127,.25);min-width:0;cursor:pointer}
.rbar label span{font-size:10px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;opacity:.6}
.rbar select{appearance:none;-webkit-appearance:none;background:transparent;border:0;color:inherit;font:600 15px/1.3 var(--display);padding:2px 0 0;cursor:pointer;width:100%}
.rbar select option{color:#0E1412}
.rbar .btn{height:58px;padding:0 30px}
.rbar .mini{display:none}
@media (max-width:860px){.rbar{grid-template-columns:1fr auto;width:calc(100% - 24px);bottom:calc(12px + env(safe-area-inset-bottom,0px))}.rbar label{display:none}.rbar .mini{display:flex;flex-direction:column;justify-content:center;padding:0 18px;font-size:14px;font-weight:600;line-height:1.25}.rbar .mini small{font-size:11px;font-weight:500;opacity:.65}.rbar .btn{height:50px;padding:0 22px}}
.toast{position:fixed;left:50%;bottom:110px;transform:translate(-50%,20px);opacity:0;z-index:70;background:var(--ink);color:#fff;padding:14px 20px;border-radius:14px;font-size:14px;max-width:min(520px,calc(100% - 32px));transition:all .35s var(--ease);pointer-events:none}
.toast.on{opacity:1;transform:translate(-50%,0)}

/* page hero for inner pages: framed photo + big type */
.phero{position:relative;padding-top:132px;padding-bottom:56px}
.phero .h-xl{max-width:14ch}
.phero .sub{margin-top:24px}
.frame{position:relative;border-radius:6px;overflow:hidden;background:var(--pine)}
.frame img{width:100%;height:100%;object-fit:cover}
.pframe{margin-top:44px;aspect-ratio:21/9}
@media (max-width:900px){.phero{padding-top:104px}.pframe{aspect-ratio:4/5}}

/* ruled list */
.ruled{list-style:none;margin:0;padding:0;border-top:1px solid var(--line-l)}
.on-dark .ruled,.night .ruled{border-color:var(--line-d)}
.ruled li{display:grid;grid-template-columns:120px minmax(0,1fr);gap:20px;padding:24px 0;border-bottom:1px solid var(--line-l)}
.on-dark .ruled li,.night .ruled li{border-color:var(--line-d)}
.ruled li .k{font-size:13px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--brass-ink);padding-top:6px}
.on-dark .ruled li .k,.night .ruled li .k{color:var(--brass)}
.ruled h3{font-size:clamp(22px,2.2vw,30px);letter-spacing:-.03em;margin-bottom:6px}
.ruled p{margin:0;color:var(--stone)}.on-dark .ruled p,.night .ruled p{color:rgba(244,239,230,.72)}
@media (max-width:640px){.ruled li{grid-template-columns:minmax(0,1fr);gap:4px}}

/* faq */
.faq details{border-bottom:1px solid var(--line-l);padding:20px 0}
.faq details:first-child{border-top:1px solid var(--line-l)}
.on-dark .faq details,.night .faq details{border-color:var(--line-d)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:20px;font-size:clamp(19px,1.8vw,24px);font-weight:600;letter-spacing:-.02em}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:none;display:none;flex:none;width:14px;height:14px;margin-top:6px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 26'%3E%3Cpath d='M12 1C5 7 3 14 6 21c2 3 5 4 6 4 1 0 4-1 6-4 3-7 1-14-6-20z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 26'%3E%3Cpath d='M12 1C5 7 3 14 6 21c2 3 5 4 6 4 1 0 4-1 6-4 3-7 1-14-6-20z'/%3E%3C/svg%3E") center/contain no-repeat;color:var(--leaf);transition:transform .3s var(--ease)}
.faq details[open] summary::after{transform:rotate(90deg)}
.faq details p{margin:12px 0 0;max-width:62ch;color:var(--stone)}
.on-dark .faq details p{color:rgba(244,239,230,.72)}

/* colour cards (shakes) */
.stack{position:relative}
.ccard{position:sticky;top:0;height:100svh;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.ccard .pic{position:relative;overflow:hidden}
.ccard .pic img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ccard .txt{display:flex;flex-direction:column;padding:110px clamp(24px,4vw,64px) 130px}
.ccard .k{display:flex;justify-content:space-between;font-size:12px;font-weight:600;letter-spacing:.2em;text-transform:uppercase}
.ccard .nm{font-size:clamp(60px,7.2vw,138px);margin-top:auto;max-width:100%}
.ccard p{font-size:20px;font-weight:500;margin:16px 0 0;max-width:24ch}
.ccard .go{margin-top:28px;font-weight:600;text-decoration:none;color:inherit;border-bottom:2px solid currentColor;padding-bottom:4px;width:max-content}
.ccard:nth-child(even) .pic{order:2}
@media (max-width:900px){.ccard{grid-template-columns:minmax(0,1fr);grid-template-rows:58% 42%}.ccard:nth-child(even) .pic{order:0}.ccard .txt{padding:20px 20px 112px}.ccard .nm{font-size:15vw}.ccard p{font-size:16px}.ccard .k{display:none}}

/* cup tiles */
.cupwrap{position:relative;display:inline-block;height:100%}
.cupwrap .cup,.cupwrap .cs{height:100%;width:auto;aspect-ratio:2/3;object-fit:contain;max-width:none}
.cupwrap .cup{position:relative;z-index:2}
.cupwrap .cs{position:absolute;left:0;bottom:1%;z-index:1;transform-origin:50% 100%;transform:translateX(26%) scaleY(.26) skewX(-58deg);filter:brightness(0) blur(1.5px);opacity:.24}
.tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
@media (max-width:1000px){.tiles{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:640px){.tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}}
.tile{position:relative;aspect-ratio:4/5;border-radius:4px;overflow:hidden;display:flex;flex-direction:column;padding:18px;text-decoration:none}
.tile .cupwrap{position:absolute;left:50%;top:12%;height:62%;transform:translateX(-50%);transition:transform .6s var(--ease)}
.tile:hover .cupwrap{transform:translateX(-50%) translateY(-8px) rotate(-4deg)}
.tile .n{position:relative;z-index:3;margin-top:auto;font-size:clamp(22px,2.2vw,32px)}
.tile .d{position:relative;z-index:3;font-size:13px;font-weight:500;margin-top:6px;max-width:26ch;opacity:.85}
@media (max-width:640px){.tile{padding:12px}.tile .d{display:none}.tile .n{font-size:20px}}

/* readout + scan */
.scan{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(24px,5vw,72px);align-items:center}
@media (max-width:860px){.scan{grid-template-columns:minmax(0,1fr)}}
.scan svg{width:100%;max-width:340px;height:auto;margin:0 auto;overflow:visible}
.scan .beam{animation:beam 3.2s var(--ease) infinite}
@keyframes beam{0%{transform:translateY(-10px);opacity:0}10%{opacity:1}85%{opacity:1}100%{transform:translateY(420px);opacity:0}}
.readout{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid currentColor}
.readout div{padding:20px 0 18px;border-bottom:1px solid rgba(127,127,127,.3)}
.readout div:nth-child(odd){padding-right:20px;border-right:1px solid rgba(127,127,127,.3)}
.readout div:nth-child(even){padding-left:20px}
.readout b{display:block;font-size:clamp(34px,4.6vw,56px);font-weight:600;letter-spacing:-.05em;line-height:1;font-variant-numeric:tabular-nums}
.readout b small{font-size:.42em;letter-spacing:-.01em;font-weight:500;margin-left:4px;opacity:.7}
.readout span{font-size:13px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;opacity:.65}
.disclaim{font-size:13px;opacity:.6;margin-top:14px}

/* quotes */
.quotes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 48px}
@media (max-width:800px){.quotes{grid-template-columns:minmax(0,1fr)}}
.quotes figure{margin:0;padding:24px 0;border-top:1px solid var(--line-l)}
.on-dark .quotes figure,.night .quotes figure{border-color:var(--line-d)}
.quotes blockquote{margin:0;font-size:19px;line-height:1.45}
.quotes figcaption{margin-top:12px;font-size:13px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--stone)}
.on-dark .quotes figcaption,.night .quotes figcaption{color:var(--sage)}
.quotes .tag{display:inline-block;font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--brass-ink);margin-bottom:10px}
.big5{font-size:clamp(80px,11vw,170px);font-weight:600;letter-spacing:-.07em;line-height:.8}

/* hours table */
.hours{border-top:1px solid var(--line-l)}
.hours div{display:flex;justify-content:space-between;gap:16px;padding:14px 0;border-bottom:1px solid var(--line-l);font-variant-numeric:tabular-nums}
.on-dark .hours,.on-dark .hours div,.night .hours,.night .hours div{border-color:var(--line-d)}

/* forms */
.form{display:grid;gap:18px}
.form label{display:grid;gap:8px;font-size:13px;font-weight:600}
.form input,.form textarea{height:56px;border-radius:12px;border:1px solid #D8D2C4;background:#fff;padding:0 16px;font:500 16px var(--display);color:var(--ink)}
.form input:focus{outline:none;border:2px solid var(--brass)}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips input{position:absolute;opacity:0;pointer-events:none}
.chips span{display:inline-flex;align-items:center;height:42px;padding:0 16px;border-radius:999px;border:1px solid #D8D2C4;font-size:14px;font-weight:500;cursor:pointer;background:#fff}
.chips input:checked+span{background:var(--bottle);color:#fff;border-color:var(--bottle)}
.chips input:focus-visible+span{outline:2px solid var(--brass);outline-offset:2px}

/* footer */
.foot{background:var(--night);color:var(--cream);padding-block:72px 150px}
.foot .cols{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr));gap:32px}
@media (max-width:860px){.foot .cols{grid-template-columns:repeat(2,minmax(0,1fr))}}
.foot h4{margin:0 0 12px;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--brass)}
.foot a{display:block;text-decoration:none;opacity:.82;padding:3px 0}.foot a:hover{opacity:1;text-decoration:underline}
.foot .wm{margin-top:56px;width:100%;height:auto;opacity:.95}
.foot .fine{font-size:12px;color:rgba(244,239,230,.64);margin-top:24px;max-width:96ch}

/* photo-slot labels, for planning the shoot */
body.slots [data-slot]{outline:3px dashed #FF3D7F;outline-offset:-3px}
body.slots [data-slot]::before{content:"PHOTO SLOT · " attr(data-slot);position:absolute;z-index:9;left:10px;top:10px;background:#FF3D7F;color:#fff;font:700 11px/1 var(--display);letter-spacing:.06em;padding:6px 8px;border-radius:4px}
[data-slot]{position:relative}
.slotbtn{position:fixed;right:max(16px,env(safe-area-inset-right,0px));top:calc(84px + env(safe-area-inset-top,0px));z-index:50;font:600 12px var(--display);background:rgba(14,20,18,.8);color:#fff;border:0;border-radius:999px;padding:8px 12px;cursor:pointer}
@media (max-width:1060px){.slotbtn{display:none}}
.foot .slotlink{background:none;border:0;color:var(--brass);font:inherit;font-size:13px;padding:3px 0;cursor:pointer;opacity:.82}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* brand marks */
.nav .bfl{height:12px;width:auto;display:block;margin-top:2px}
.nav .bfl.l{display:none}
.nav.light-start .bfl.d,.nav.solid .bfl.d{display:none}.nav.light-start .bfl.l,.nav.solid .bfl.l{display:block}
.leaf{width:1em;height:1.07em;display:inline-block;vertical-align:-.12em}
.faq .fl{flex:none;width:16px;color:var(--leaf);transition:transform .35s var(--ease);--leafcut:var(--bone)}
.oat .faq .fl{--leafcut:var(--oat)}.on-dark .faq .fl,.night .faq .fl{color:var(--brass);--leafcut:var(--bottle)}
.faq details[open] .fl{transform:rotate(-90deg)}
.faq summary:hover .fl{transform:rotate(-20deg)}
.btn .ico{width:18px;height:18px;flex:none}
.foot .bt{display:flex;flex-direction:column;gap:8px;margin-top:22px;opacity:1}
.foot .bt img{height:34px;width:auto;opacity:.9}
.foot .bt span{font-size:13px;color:var(--brass)}
[hidden]{display:none!important}
[id]{scroll-margin-top:96px}

.phsplit{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(28px,5vw,80px);align-items:end}
.phport{aspect-ratio:4/5;max-height:72vh;width:100%}
@media (max-width:900px){.phsplit{grid-template-columns:minmax(0,1fr)}.phport{max-height:none}}
/* light sections on dark pages keep ink text */
.dark .oat{color:var(--ink)}.dark .oat .eyebrow{color:var(--brass-ink)}.dark .oat .h-xl .it,.dark .oat .h-l .it{color:var(--leaf)}.dark .oat .muted{color:var(--stone)}

.vhero>.wrap{width:100%}

.phport:has(img[src*="consult-handshake"]){aspect-ratio:1218/1292}.phport img[src*="consult-handshake"]{object-position:50% 50%!important}
