.story{--sbg:#DCE2D4;position:relative;margin-top:-52px;height:460vh;background:var(--sbg)}.story-pin{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:var(--sbg);display:flex;align-items:center;padding-top:70px;box-sizing:border-box}.story-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(20px,4vw,60px);align-items:center;width:100%}.story-grid>*{min-width:0}.story-text{display:grid;gap:clamp(14px,2.4vh,28px)}.story-line{transition:opacity .4s}.story-k{display:inline-block;font:700 12px/1 var(--f-body);letter-spacing:.14em;text-transform:uppercase;border:2px solid var(--ink);border-radius:var(--r-pill);padding:6px 10px;margin-bottom:10px;background:#ffffff8c}.story-line.hb .story-k{background:var(--ink);color:var(--cream)}.story-h{font-size:clamp(30px,min(4vw,6.4vh),60px);line-height:.98}.story-h .wd{display:inline-block;opacity:var(--wo,1);transform:translateY(calc((1 - var(--wo,1)) * 18px));transition:opacity .15s linear}.story-h em.s .wd{color:var(--cherry)}.story-sub{margin:10px 0 0;color:var(--ink-2);font-size:clamp(15px,1.3vw,18px);max-width:42ch;opacity:var(--so,1);transition:opacity .3s}.story-cta{margin-top:18px;opacity:var(--so,1);pointer-events:var(--pe,auto)}.story-line.dim .story-sub{max-height:0;margin:0;opacity:0}.story-sub{max-height:6em;overflow:hidden;transition:max-height .4s,opacity .3s,margin .4s}.story-line.past .story-h{text-decoration:line-through;text-decoration-thickness:4px;text-decoration-color:var(--cherry)}.story-stage{position:relative;height:min(72vh,620px);height:min(72svh,620px)}.si{position:absolute;left:50%;top:50%;width:clamp(96px,11vw,150px);margin:calc(clamp(96px,11vw,150px)/-2) 0 0 calc(clamp(96px,11vw,150px)/-2);will-change:transform,opacity}.si svg{width:100%;overflow:visible;filter:drop-shadow(0 10px 10px rgba(15,28,46,.18))}.si .tag{position:absolute;left:50%;bottom:-8px;transform:translate(-50%) rotate(-4deg);white-space:nowrap;font:800 12px/1 var(--f-display);background:var(--cream);border:2px solid var(--ink);border-radius:var(--r-pill);padding:6px 10px;box-shadow:0 3px 0 var(--ink)}.si.tasty .tag{background:var(--ink);color:var(--cream);box-shadow:0 3px 0 var(--cherry)}.vs{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(var(--vs,0));font:italic 400 clamp(40px,5vw,70px)/1 var(--f-serif);background:var(--cream);border:2.5px solid var(--ink);border-radius:50%;width:1.7em;height:1.7em;display:grid;place-items:center;box-shadow:0 5px 0 var(--ink);z-index:3}.merge{position:absolute;left:50%;top:50%;width:min(62%,380px);aspect-ratio:1;transform:translate(-50%,-50%) scale(var(--ms,0)) rotate(calc((1 - var(--ms,0)) * -30deg));z-index:4;perspective:1200px}.story-pack{width:78%;height:112%;top:48%}.merge .pw{font-size:clamp(22px,2.4vw,32px)}.merge .pkind{font-size:12px}.merge .pflav{font-size:15px}.merge .ptags span{font-size:7.5px;padding:4px 5px}.mg{position:absolute;transform:scale(var(--gs,1))}.chipx{position:absolute;font:800 clamp(12px,1.1vw,15px)/1 var(--f-display);border:2px solid var(--ink);border-radius:var(--r-pill);padding:9px 13px;box-shadow:0 3px 0 var(--ink);white-space:nowrap;opacity:var(--co,0);transform:translateY(calc((1 - var(--co,0)) * 16px)) rotate(var(--cr,0deg))}.chipx.c1{left:-14%;top:30%;background:var(--mint);--cr:-6deg}.chipx.c2{right:-14%;top:44%;background:var(--peach);--cr:5deg}.chipx.c3{left:12%;bottom:-6%;background:var(--pink);--cr:-3deg}.story-prog{position:absolute;right:clamp(10px,2vw,28px);top:50%;transform:translateY(-50%);display:grid;gap:8px}.story-prog span{width:6px;height:36px;border-radius:6px;background:#0f1c2e26;overflow:hidden;position:relative}.story-prog span:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:var(--ink);transform:scaleY(var(--f,0));transform-origin:top}@media(max-width:760px){.story{height:300svh}.story-pin{align-items:flex-start;padding-top:calc(76px + env(safe-area-inset-top,0px));touch-action:none;overscroll-behavior:contain}.story-grid{grid-template-columns:1fr;gap:6px}.story-text{position:relative;min-height:220px;display:block}.story-line{position:absolute;left:0;right:0;top:0}.story-stage{height:48svh}.si{width:84px;margin:-42px 0 0 -42px}.si .tag{font-size:10px;padding:4px 7px}.vs{font-size:34px;width:1.6em;height:1.6em}.merge{width:min(78%,300px)}.chipx.c1{left:-6%}.chipx.c2{right:-6%}.story-prog{display:none}}
/*# sourceMappingURL=/cdn/shop/t/27/assets/hb-story.css.map */
