/* Home page */

/* hero */
.hero{position:relative;min-height:100svh;color:var(--rice);display:grid;grid-template-rows:1fr auto auto;padding:clamp(130px,16vh,170px) var(--pad) 32px;overflow:hidden;border-radius:0 0 var(--r) var(--r)}
.hero__bg{position:absolute;inset:0;background:radial-gradient(120% 90% at 75% 40%,var(--mocha-hi) 0%,var(--mocha) 40%,var(--mocha-lo) 85%);z-index:-2}
.hero__bg::after{content:"";position:absolute;inset:0;background:radial-gradient(40% 40% at 72% 48%,rgba(240,138,60,.28),transparent 70%);animation:breathe 7s ease-in-out infinite}
#bottle{position:absolute;inset:0;width:100%;height:100%;z-index:-1}
.hero__copy{align-self:center;max-width:640px;position:relative}
.hero__meta{margin-bottom:34px}
.hero__title{font-size:clamp(58px,9vw,138px);line-height:.92;letter-spacing:-.045em;font-weight:800}
.hero__title .ln{display:block;overflow:hidden;padding-bottom:.04em}
.hero__title .ln>span{display:inline-block}
.hero__lede{max-width:470px;margin-top:30px;font-size:clamp(16px,1.3vw,19px);color:rgba(246,240,233,.84)}
.hero__ctas{display:flex;gap:12px;flex-wrap:wrap;margin-top:36px}
.hero__pulse{width:100%;height:60px;margin:40px 0 20px;overflow:visible}
.hero__pulse path{fill:none;stroke:var(--peach);stroke-width:1.5;vector-effect:non-scaling-stroke;stroke-linejoin:round}
.hero__facts{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;border-top:1px solid var(--cream-line);padding-top:20px}
.hero__facts dt{font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;opacity:.6}
.hero__facts dd{margin-top:4px;display:flex;align-items:baseline;gap:8px;font-size:15px;color:rgba(246,240,233,.85)}
.hero__facts dd b{font-size:28px;font-weight:200;letter-spacing:-.03em;color:var(--rice)}
.hero__facts dd .dot{align-self:center}
@media (max-width:760px){.hero__facts{grid-template-columns:1fr 1fr}}

/* ticker */
.ticker{overflow:hidden;padding:30px 0;border-bottom:1px solid var(--line)}
.ticker__track{display:flex;align-items:center;gap:36px;width:max-content;font-size:clamp(22px,2.6vw,38px);letter-spacing:-.03em;font-weight:600;white-space:nowrap;color:var(--mocha-lo)}
.ticker__track i{width:34px;height:15px;border-radius:99px;border:1.5px solid var(--mocha);position:relative;overflow:hidden;flex:none}
.ticker__track i::after{content:"";position:absolute;inset:0 0 0 50%;background:var(--yuzu)}

.center{display:flex;justify-content:center;margin-top:clamp(40px,5vw,64px)}

/* 01 why */
.why__lead{font-size:clamp(26px,3.2vw,48px);line-height:1.15;letter-spacing:-.03em;font-weight:300;max-width:1100px;margin-bottom:clamp(40px,5vw,72px)}
.why .prose--cols{border-top:1px solid var(--line);padding-top:32px;color:var(--ink-2)}
.why .prose--cols b{color:var(--ink)}

/* 02 method */
.regimen{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:18px;counter-reset:s}
.step{background:var(--paper);border-radius:24px;padding:clamp(24px,2.6vw,36px);box-shadow:0 0 0 1px var(--line);display:flex;flex-direction:column;gap:16px;min-height:380px;transform-style:preserve-3d}
.step__top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:auto}
.step__n{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2)}
.step__vessel{width:46px;height:74px;border-radius:12px 12px 16px 16px;background:linear-gradient(90deg,color-mix(in oklab,var(--c) 75%,#000 8%),color-mix(in oklab,var(--c) 50%,#fff) 40%,var(--c));position:relative;margin-top:14px}
.step__vessel::before{content:"";position:absolute;left:30%;right:30%;top:-16px;height:14px;border-radius:5px 5px 2px 2px;background:var(--mocha-deep)}
.step h3{font-size:clamp(28px,2.8vw,40px);font-weight:700;letter-spacing:-.04em;line-height:1}
.step p{color:var(--ink-2)}
@media (max-width:900px){.regimen{grid-template-columns:1fr}.step{min-height:0}}

/* 03 actives */
.actives__grid{display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}
.active{padding:28px 24px 32px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:12px;position:relative;overflow:hidden;transition:background .5s,color .5s}
.active::before{content:"";position:absolute;inset:auto -30% -60% auto;width:160%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(240,138,60,.22),transparent 60%);opacity:0;transform:scale(.6);transition:opacity .6s,transform .8s var(--ease);pointer-events:none}
.active:hover::before{opacity:1;transform:none}
.active__n{font-family:var(--mono);font-size:11px;color:var(--yuzu)}
.active h3{font-size:20px;font-weight:600;letter-spacing:-.025em;line-height:1.15}
.active p{font-size:15px;color:var(--ink-2)}
@media (max-width:1180px){.actives__grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:760px){.actives__grid{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.actives__grid{grid-template-columns:1fr}}
.wired{margin-top:56px;display:grid;gap:18px}
.wired .mono{color:var(--ink-2)}
.wired__list{list-style:none;display:flex;flex-wrap:wrap;gap:8px}
.wired__list li{padding:10px 18px;border-radius:99px;background:var(--paper);box-shadow:0 0 0 1px var(--line);font-weight:500;font-size:15px;transition:background .3s,color .3s}
.wired__list li:hover{background:var(--ink);color:var(--rice)}
.wired p{color:var(--ink-2);max-width:620px}

/* 04 routine */
.routine__grid{display:grid;grid-template-columns:1.3fr 1fr;gap:clamp(24px,4vw,64px);align-items:center}
.routine__rails{display:grid;gap:6px}
.rail{display:grid;grid-template-columns:130px 1fr 64px;gap:20px;align-items:center;padding:20px 0;border-bottom:1px solid var(--cream-line);cursor:pointer}
.rail__k{font-size:clamp(18px,1.7vw,24px);font-weight:500;letter-spacing:-.02em}
.rail output{text-align:right;font-weight:200;font-size:26px;letter-spacing:-.03em;font-variant-numeric:tabular-nums;color:var(--peach)}
.routine__out{display:grid;justify-items:start;gap:22px;padding:clamp(24px,3vw,40px);border-radius:24px;background:rgba(246,240,233,.06);box-shadow:0 0 0 1px var(--cream-line)}
.routine__out .mono{color:rgba(246,240,233,.6)}
.dose{position:relative;width:min(240px,60vw);aspect-ratio:1}
.dose__ring{width:100%;height:100%;transform:rotate(-90deg)}
.dose__ring circle{fill:none;stroke-width:10;stroke:rgba(246,240,233,.12)}
.dose__ring #doseArc{stroke:var(--yuzu);stroke-linecap:round;stroke-dasharray:540.35;stroke-dashoffset:135}
.dose__num{position:absolute;inset:0;display:grid;place-content:center;text-align:center}
.dose__num b{font-size:clamp(64px,7vw,96px);font-weight:200;letter-spacing:-.06em;line-height:1;font-variant-numeric:tabular-nums}
.dose__num span{color:rgba(246,240,233,.6);font-size:18px}
.dose__num i{font-style:normal}
.routine__verdict{font-size:clamp(17px,1.4vw,20px);max-width:440px}
.routine__fine{font-size:13px;color:rgba(246,240,233,.55);max-width:440px}
.routine__more{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;margin-top:56px;padding-top:26px;border-top:1px solid var(--cream-line);font-size:clamp(18px,1.6vw,22px)}
.routine__more .mono{color:rgba(246,240,233,.6)}
.routine__more i{font-style:normal;display:inline-block;transition:transform .5s var(--ease)}
.routine__more:hover i{transform:translateX(8px)}
@media (max-width:900px){.routine__grid{grid-template-columns:1fr}.rail{grid-template-columns:100px 1fr 56px;gap:12px}}

/* 05 work */
.cases{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.case{display:grid;gap:22px;padding:18px;border-radius:26px;background:var(--paper);box-shadow:0 0 0 1px var(--line);transform-style:preserve-3d;transition:box-shadow .5s}
.case:hover{box-shadow:0 0 0 1px var(--line),0 40px 80px -40px rgba(74,55,45,.45)}
.case__screen{border-radius:16px;overflow:hidden;aspect-ratio:16/10;background:var(--rice-2);display:flex;flex-direction:column}
.case--field .case__screen{background:linear-gradient(160deg,#DDE5D6,#C4D1BA)}
.case--coach .case__screen{background:linear-gradient(160deg,#E9DCE8,#D4C0D2)}
.cs-bar{display:flex;gap:6px;padding:12px 14px}.cs-bar i{width:9px;height:9px;border-radius:50%;background:rgba(43,33,28,.2)}
.cs-body{margin:4% 10% 0;flex:1;background:var(--paper);border-radius:14px 14px 0 0;padding:22px 24px;display:flex;flex-direction:column;gap:6px;box-shadow:0 -20px 50px -30px rgba(43,33,28,.4);transition:transform .7s var(--ease)}
.case:hover .cs-body{transform:translateY(-8px)}
.cs-body b{font-size:18px;letter-spacing:-.02em}
.cs-body>span{font-size:13px;color:var(--ink-2)}
.cs-body ul{list-style:none;margin:10px 0;display:grid;gap:0;font-size:14px}
.cs-body li{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px dashed var(--line)}
.cs-body em{font-style:normal;color:var(--ink-2)}
.cs-body strong{margin-top:auto;display:flex;justify-content:space-between;align-items:center;font-size:22px;letter-spacing:-.03em}
.cs-body strong small{font-size:12px;font-weight:500;padding:7px 12px;border-radius:99px;background:var(--yuzu);color:#fff;letter-spacing:0}
.case__meta{display:grid;gap:14px;padding:0 10px 10px}
.case__meta h3{font-size:clamp(32px,3.4vw,52px);font-weight:700;letter-spacing:-.045em;line-height:1}
.case__meta dl{display:flex;flex-wrap:wrap;gap:8px 28px}
.case__meta dt{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2)}
.case__meta dd{font-weight:500}
.case__meta .mono{color:var(--yuzu)}
@media (max-width:860px){.cases{grid-template-columns:1fr}}
.work .stats{margin-top:clamp(40px,5vw,70px)}

/* 06 people */
.duo{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.person{background:var(--paper);border-radius:24px;padding:clamp(24px,3vw,40px);box-shadow:0 0 0 1px var(--line);display:grid;gap:12px;align-content:start}
.person__orb{width:120px;aspect-ratio:1;border-radius:50%;display:grid;place-items:center;margin-bottom:14px;background:radial-gradient(circle at 32% 28%,#fff,var(--peach) 35%,var(--yuzu) 85%);box-shadow:inset -10px -14px 30px rgba(196,79,6,.35);position:relative}
.person__orb--c{background:radial-gradient(circle at 32% 28%,#fff,var(--mocha-hi) 35%,var(--mocha-lo) 85%);box-shadow:inset -10px -14px 30px rgba(74,55,45,.4)}
.person__orb span{font-size:48px;font-weight:200;color:#fff;letter-spacing:-.04em}
.person .mono{color:var(--ink-2)}
.person h3{font-size:clamp(36px,3.6vw,56px);font-weight:700;letter-spacing:-.045em;line-height:1}
.person p{color:var(--ink-2)}
.people__quote{margin-top:clamp(56px,7vw,100px)}
@media (max-width:860px){.duo{grid-template-columns:1fr}}

/* 07 stand */
.stand__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,80px);margin-bottom:48px}
.stand__lede{font-size:clamp(20px,1.9vw,27px);line-height:1.4;font-weight:300;letter-spacing:-.015em}
.stand__lede em{font-style:normal;padding:0 .25em;border-radius:6px;background:var(--rice-2);text-decoration:line-through;text-decoration-color:var(--yuzu)}
.pledges{list-style:none;border-top:1px solid var(--line)}
.pledges li{display:flex;gap:20px;padding:18px 0;border-bottom:1px solid var(--line);font-size:17px}
.pledges span{font-family:var(--mono);font-size:11px;color:var(--yuzu);padding-top:5px}
@media (max-width:860px){.stand__grid{grid-template-columns:1fr}}

/* 08 ways */
.slots{margin-bottom:clamp(40px,5vw,64px)}
.slots__head{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;margin-bottom:18px}
.slots__head .mono{color:rgba(246,240,233,.65)}
.slots__key{list-style:none;display:flex;gap:18px;flex-wrap:wrap;font-size:13px;color:rgba(246,240,233,.75)}
.slots__key li{display:flex;align-items:center;gap:8px}
.slots__key i{width:12px;height:12px;border-radius:4px}
.k-open{background:var(--yuzu)}.k-held{background:transparent;border:1.5px dashed var(--peach)}.k-done{background:rgba(246,240,233,.85)}
.slots__cal{list-style:none;display:grid;grid-template-columns:repeat(12,1fr);gap:6px}
.slots__cal li{border-radius:14px;padding:14px 10px;min-height:96px;display:flex;flex-direction:column;justify-content:space-between;font-size:12px;background:rgba(246,240,233,.06);box-shadow:inset 0 0 0 1px var(--cream-line);transition:transform .4s var(--ease)}
.slots__cal li:hover{transform:translateY(-4px)}
.slots__cal b{font-family:var(--mono);font-weight:500;font-size:11px;letter-spacing:.12em;text-transform:uppercase}
.slots__cal .s-done{background:rgba(246,240,233,.88);color:var(--ink);box-shadow:none}
.slots__cal .s-open{background:var(--yuzu);color:#fff;box-shadow:none;position:relative}
.slots__cal .s-open::after{content:"";position:absolute;top:12px;right:12px;width:7px;height:7px;border-radius:50%;background:#fff;animation:ping 2s infinite}
.slots__cal .s-held{box-shadow:inset 0 0 0 1.5px var(--peach);background:repeating-linear-gradient(135deg,transparent 0 6px,rgba(244,201,168,.12) 6px 12px)}
.slots__cal .s-closed,.slots__cal .s-na{opacity:.5}
.slots__note{margin-top:18px;max-width:620px;color:rgba(246,240,233,.72);font-size:15px}
@media (max-width:1000px){.slots__cal{grid-template-columns:repeat(6,1fr)}}
@media (max-width:520px){.slots__cal{grid-template-columns:repeat(4,1fr)}}
.regime{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;align-items:stretch}
.plan{border-radius:24px;padding:clamp(24px,2.6vw,36px);background:rgba(246,240,233,.07);box-shadow:0 0 0 1px var(--cream-line);display:flex;flex-direction:column;gap:18px;transform-style:preserve-3d}
.plan .tag{align-self:flex-start;opacity:.85}
.plan h3{font-size:clamp(28px,2.6vw,38px);font-weight:300;letter-spacing:-.03em}
.plan__price{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.plan__price b{font-size:clamp(48px,4.6vw,72px);font-weight:800;letter-spacing:-.05em;line-height:1}
.plan__price span,.plan__price small{opacity:.65}
.plan .dash-list{font-size:15px}
.plan .pill{align-self:flex-start;margin-top:auto}
.plan__link{align-self:flex-start;font-size:15px}
.plan--feat{background:var(--rice);color:var(--ink);box-shadow:0 40px 80px -30px rgba(0,0,0,.35)}
.plan--feat .tag{opacity:1}
.plan--feat .dash-list li{border-color:var(--line)}
.plan--feat .dash-list li::before{color:var(--yuzu)}
.plan:not(.plan--feat) .pill--rice:hover{color:var(--ink)}
@media (max-width:1000px){.regime{grid-template-columns:1fr}}

/* 09 shelf */
.shelf__row{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.product{display:grid;grid-template-rows:auto 1fr;gap:0;border-radius:26px;background:var(--paper);box-shadow:0 0 0 1px var(--line);overflow:hidden;transition:box-shadow .5s}
.product:hover{box-shadow:0 0 0 1px var(--line),0 40px 80px -40px rgba(74,55,45,.45)}
.product .vessel{padding:48px 0 30px;max-width:150px}
.product:hover .vessel{transform:translateY(-10px) rotate(-3deg)}
.product>.vessel{background:none}
.product{background:linear-gradient(180deg,var(--rice-2) 0 280px,var(--paper) 280px)}
.product__info{padding:26px clamp(20px,2.4vw,32px) 30px;display:flex;flex-direction:column;gap:14px}
.product__info .mono{color:var(--ink-2)}
.product__info h3{font-size:clamp(26px,2.4vw,34px);font-weight:700;letter-spacing:-.04em;line-height:1}
.product__info p{color:var(--ink-2);font-size:15px}
.product__price{display:flex;gap:28px;padding:14px 0;border-block:1px solid var(--line)}
.product__price small{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2)}
.product__price b{font-size:28px;font-weight:700;letter-spacing:-.04em}
.product__price em{font-style:normal;font-size:14px;font-weight:400;color:var(--ink-2)}
.product .dash-list{font-size:14px}.product .dash-list li{padding:9px 0}
.product__cta{margin-top:auto;padding-top:10px;font-weight:600;color:var(--yuzu)}
.product__cta i{font-style:normal;display:inline-block;transition:transform .5s var(--ease)}
.product:hover .product__cta i{transform:translateX(6px)}
@media (max-width:1000px){.shelf__row{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.shelf__row{grid-template-columns:1fr}}

/* 12 enquire */
.enquire__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,80px);align-items:start}
.enquire .h2{color:var(--rice)}
.enquire__quote{padding:0;margin-top:48px}
.enquire__quote blockquote{font-size:clamp(20px,1.9vw,27px);line-height:1.3}
.form{display:grid;gap:22px;padding:clamp(24px,3vw,40px);border-radius:24px;background:var(--rice);color:var(--ink);box-shadow:0 40px 80px -40px rgba(0,0,0,.4)}
.form .pill{justify-self:start}
.form__fine{font-size:13px;color:var(--ink-2)}
@media (max-width:900px){.enquire__grid{grid-template-columns:1fr}}
