@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/BricolageGrotesque-700.woff2) format('woff2')}
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:800;font-display:swap;src:url(/fonts/BricolageGrotesque-800.woff2) format('woff2')}
@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/HankenGrotesk-400.woff2) format('woff2')}
@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/HankenGrotesk-500.woff2) format('woff2')}
@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/HankenGrotesk-600.woff2) format('woff2')}
@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/HankenGrotesk-700.woff2) format('woff2')}
body{margin:0;background:#FFF6EC}
.d{--bg:#FBF1E3;--card:#FFFFFF;--ink:#2B1A12;--mu:#7A6556;--peach:#EBCFAE;--coral:#D2703A;--sage:#BFE3CF;--sageD:#2F7D5B;--lav:#D9D2FF;--lavD:#5B4BC4;--sun:#F5C46B;--line:#E9D6BC;
 position:relative;overflow:hidden;background:var(--bg);color:var(--ink);font-family:'Hanken Grotesk',system-ui,sans-serif;font-size:18px;line-height:1.55}
.d *{box-sizing:border-box}
.d a{color:inherit;text-decoration:none}
.d :where(h1,h2,h3){font-family:'Bricolage Grotesque',system-ui,sans-serif;margin:0;font-weight:800;letter-spacing:-0.03em;text-wrap:balance}
.d :where(p){margin:0}
.wrap{max-width:1180px;margin:0 auto;padding:0 28px;position:relative;z-index:2}
/* blobs */
.blob{position:absolute;border-radius:50%;filter:blur(2px);z-index:0;pointer-events:none}
.b1{width:560px;height:560px;background:var(--peach);right:-160px;top:-120px;opacity:.7;animation:drift 18s ease-in-out infinite}
.b2{width:380px;height:380px;background:var(--lav);left:-140px;top:520px;opacity:.6;animation:drift 22s -6s ease-in-out infinite reverse}
.b3{width:300px;height:300px;background:var(--sage);right:6%;top:2300px;opacity:.55;animation:drift 20s -3s ease-in-out infinite}
@keyframes drift{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(30px,26px) scale(1.06)}}
/* nav */
.nav{display:flex;justify-content:space-between;align-items:center;padding:24px 0;flex-wrap:wrap;gap:14px;animation:pop .7s both}
.logo{display:flex;align-items:center;gap:10px;font-family:'Bricolage Grotesque',system-ui,sans-serif;font-weight:800;font-size:21px}
.lg{width:44px;height:44px;display:block;animation:wob 5s ease-in-out infinite}
@keyframes wob{0%,100%{transform:rotate(-6deg)}50%{transform:rotate(6deg) translateY(-2px)}}
@keyframes spin{to{transform:rotate(360deg)}}
.links{display:flex;gap:26px;align-items:center;font-weight:500;font-size:16px;flex-wrap:wrap}
.links a:not(.btn){position:relative}
.links a:not(.btn):after{content:'';position:absolute;left:0;right:0;bottom:-4px;height:3px;border-radius:3px;background:var(--coral);transform:scaleX(0);transform-origin:left;transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.links a:not(.btn):hover:after{transform:scaleX(1)}
.btn{display:inline-flex;align-items:center;gap:10px;min-height:52px;padding:0 28px;border-radius:18px;font-weight:600;font-size:17px;transition:transform .3s cubic-bezier(.3,1.6,.5,1),box-shadow .3s}
.btn.pri{background:var(--ink);color:#fff;box-shadow:0 6px 0 0 #170D08}
.btn.pri:hover{transform:translateY(3px);box-shadow:0 3px 0 0 #170D08}
.btn.pri:active{transform:translateY(6px);box-shadow:0 0 0 0 #170D08}
.btn.alt{background:#fff;border:2px solid var(--ink);box-shadow:0 6px 0 0 var(--ink)}
.btn.alt:hover{transform:translateY(3px);box-shadow:0 3px 0 0 var(--ink)}
/* hero */
.hero{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:40px;align-items:center;padding:36px 0 110px}
.tag{display:inline-flex;gap:8px;align-items:center;background:#fff;border:2px solid var(--ink);border-radius:999px;padding:6px 16px;font-weight:600;font-size:15px;animation:pop .7s .1s both}
.tag i{width:9px;height:9px;border-radius:50%;background:var(--sageD);animation:blink 2s infinite}
@keyframes blink{50%{opacity:.25}}
.hero h1{font-family:'Bricolage Grotesque',system-ui,sans-serif;font-weight:800;letter-spacing:-0.035em;font-size:68px;line-height:1.02;margin:24px 0 24px;animation:pop .8s .2s both}
.hero h1 .hl{position:relative;display:inline-block;z-index:0}
.hero h1 .hl:before{content:'';position:absolute;left:-6px;right:-6px;bottom:6px;height:.34em;background:var(--sun);z-index:-1;border-radius:6px;transform-origin:left;animation:wipe .9s .9s cubic-bezier(.2,.8,.2,1) both}
@keyframes wipe{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.lede{font-size:21px;color:var(--mu);max-width:29em;animation:pop .8s .35s both}
.cta{display:flex;gap:18px;flex-wrap:wrap;margin-top:38px;animation:pop .8s .5s both}
.fine{margin-top:22px;font-size:15px;color:var(--mu);animation:pop .8s .6s both}
@keyframes pop{from{opacity:0;transform:translateY(24px) scale(.97)}to{opacity:1;transform:none}}

/* ---------- the telegram chat ---------- */
.stage{position:relative;height:760px;animation:pop 1s .4s both}
.phone{position:absolute;left:50%;top:6px;width:366px;margin-left:-183px;background:#fff;border:3px solid var(--ink);border-radius:42px;padding:12px 10px 12px;box-shadow:10px 12px 0 0 var(--ink);transform:rotate(-2.5deg);transition:transform .5s cubic-bezier(.3,1.4,.5,1)}
.phone:hover{transform:rotate(0deg) scale(1.01)}
.tg{border-radius:30px;overflow:hidden;background:#fff;display:flex;flex-direction:column;height:716px}
.tg-h{display:flex;align-items:center;gap:11px;padding:12px 14px;background:#fff;border-bottom:2px solid var(--ink);position:relative;z-index:3}
.tg-h .back{font-size:22px;font-weight:600;color:var(--lavD);line-height:1;margin-right:-2px}
.tg-h .av{width:40px;height:40px}
.tg-h b{display:block;font-family:'Bricolage Grotesque';font-size:17px;line-height:1.15;font-weight:800;letter-spacing:-.01em}
.tg-h span{display:block;font-size:12.5px;color:var(--mu);line-height:1.2}
.scenes{display:flex;gap:6px;padding:8px 12px;background:#FFF9F0;border-bottom:1px dashed var(--line);position:relative;z-index:3}
.scenes span{flex:1;text-align:center;font-size:11.5px;font-weight:600;padding:4px 0;border-radius:999px;border:1.5px solid var(--ink);color:var(--mu);white-space:nowrap}
.wall{flex:1;min-height:0;position:relative;background-color:#EAD7BC;background-image:radial-gradient(circle at 14px 14px,rgba(255,255,255,.7) 0 2px,transparent 2.5px),radial-gradient(circle at 42px 38px,rgba(122,74,50,.14) 0 2px,transparent 2.5px);background-size:56px 56px}
.msgs{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;padding:0 10px 10px;overflow:hidden;-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 34px);mask-image:linear-gradient(to bottom,transparent 0,#000 34px)}
.row{display:flex;gap:7px;align-items:flex-end;overflow:hidden;flex:none;padding:0 2px}
.row.own{flex-direction:row-reverse}
.row.sys{justify-content:center}
.row.sys span{background:rgba(43,26,18,.55);color:#fff;font-size:12.5px;font-weight:500;padding:3px 12px;border-radius:999px}
.av{width:32px;height:32px;flex:none;border-radius:50%;display:block}
.col{display:flex;flex-direction:column;align-items:flex-start;gap:3px;min-width:0;max-width:248px}
.own .col{align-items:flex-end}
.nm{font-family:'Hanken Grotesk';font-weight:600;font-size:12.5px;line-height:1.2;margin:0 0 -1px 10px;display:flex;gap:6px;align-items:center}
.nm.dd{color:var(--lavD)}.nm.b{color:var(--sageD)}
.nm i{font-style:normal;font-size:10px;font-weight:600;border:1.5px solid var(--sageD);border-radius:5px;padding:0 4px;line-height:1.3}
.bb{position:relative;background:#fff;border:2px solid var(--ink);border-radius:16px 16px 16px 4px;padding:7px 11px 6px;font-size:15px;line-height:1.35;text-align:left;box-shadow:3px 3px 0 0 rgba(43,26,18,.9)}
.own .bb{background:var(--peach);border-radius:16px 16px 4px 16px}
.bb time{float:right;margin:7px 0 -3px 12px;font-size:11px;color:var(--mu);display:inline-flex;gap:3px;align-items:center;line-height:1}
.own .bb time{color:#8a4a30}
.bb time u{width:13px;height:7px;border-left:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(-45deg) scale(.7);margin-top:-2px;display:inline-block}
.bb.dots{display:flex;gap:4px;padding:11px 14px}
.dots i{width:7px;height:7px;border-radius:50%;background:var(--ink);opacity:.35;animation:dot 1s infinite}
.dots i:nth-child(2){animation-delay:.15s}.dots i:nth-child(3){animation-delay:.3s}
@keyframes dot{0%,60%,100%{transform:none;opacity:.35}30%{transform:translateY(-4px);opacity:1}}
.rp{border-left:3px solid var(--coral);padding:0 8px;margin:0 0 5px;font-size:12.5px;line-height:1.3;color:var(--mu);background:rgba(242,112,75,.12);border-radius:0 6px 6px 0}
.rp b{display:block;color:var(--coral);font-weight:600}
.ik{display:flex;flex-direction:column;gap:4px;width:100%;min-width:190px}
.ik span{background:#fff;border:2px solid var(--ink);border-radius:11px;text-align:center;font-weight:600;font-size:13.5px;padding:5px 8px}
.toast{position:absolute;left:50%;bottom:20px;transform:translate(-50%,10px);opacity:0;background:var(--ink);color:#fff;font-weight:600;font-size:14px;padding:6px 16px;border-radius:999px;z-index:4;white-space:nowrap}
.bb.ph2{padding:5px 5px 6px;width:248px}
.bb time.ph{display:block;float:none;text-align:right;margin:4px 6px 0 0}
.shot{background:#121110;color:#ECE8E1;border-radius:11px;padding:11px 12px 12px;font-family:'Hanken Grotesk'}
.sh{display:flex;justify-content:space-between;align-items:baseline;gap:6px}
.sh b{font-family:'Bricolage Grotesque';font-size:19px;font-weight:800}
.sh span{font-size:10.5px;color:#9a948a}
.sf{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:8px 0 9px}
.sf small{display:block;font-size:9.5px;color:#9a948a;line-height:1.2}
.sf b{font-family:'Bricolage Grotesque';font-size:17px;font-weight:800;line-height:1.15}
.stl{position:relative;height:16px;background:#1c1a18;border-radius:5px}
.stl i{position:absolute;display:block}
.stl .n{top:3px;height:10px;background:#6E7BB0;border-radius:3px}
.stl .p{top:5px;height:6px;background:#A9B2D6;border-radius:3px}
.stl .w{top:0;height:16px;width:3px;background:#6E9E8A;z-index:2;border-radius:1px}
.sax{display:flex;justify-content:space-between;font-size:8.5px;color:#7d776e;margin-top:2px}
.scare{height:9px;border-radius:5px;background:#6E9E8A;margin-top:8px;overflow:hidden}
.sleg{font-size:10px;color:#9a948a;margin-top:4px}
.kbd{background:#FFF9F0;border-top:2px solid var(--ink);padding:9px 10px 10px;display:grid;grid-template-columns:1fr 1fr;gap:6px;position:relative;z-index:3}
.kb{display:contents}
.kb span{--k:#fff;border:2px solid var(--ink);border-radius:11px;text-align:center;padding:7px 4px;font-weight:600;font-size:13.5px;background:var(--k)}
.kb span:nth-child(1){--k:var(--lav)}.kb span:nth-child(2){--k:var(--sun)}.kb span:nth-child(3){--k:var(--sage)}.kb span:nth-child(4){--k:var(--peach)}
.row{animation-duration:62.0s;animation-iteration-count:infinite;animation-timing-function:cubic-bezier(.25,1,.4,1);max-height:0;opacity:0;margin-top:0}
@keyframes r0{0%,0.968%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}1.855%,96.129%{max-height:var(--mh);opacity:1;margin-top:9px;transform:none}98.065%,100%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}}
@keyframes r1{0%,3.226%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}4.113%,96.129%{max-height:var(--mh);opacity:1;margin-top:9px;transform:none}98.065%,100%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}}
@keyframes ty2{0%,4.113%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}4.516%,5.726%{max-height:var(--mh);opacity:1;margin-top:9px;transform:none}6.129%,100%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}}
@keyframes r2{0%,5.806%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}6.694%,96.129%{max-height:var(--mh);opacity:1;margin-top:9px;transform:none}98.065%,100%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}}
@keyframes r3{0%,8.71%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}9.597%,96.129%{max-height:var(--mh);opacity:1;margin-top:9px;transform:none}98.065%,100%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}}
@keyframes ty4{0%,9.597%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}10.0%,11.21%{max-height:var(--mh);opacity:1;margin-top:9px;transform:none}11.613%,100%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}}
@keyframes r4{0%,11.29%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}12.177%,96.129%{max-height:var(--mh);opacity:1;margin-top:9px;transform:none}98.065%,100%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}}
@keyframes r5{0%,14.516%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}15.403%,96.129%{max-height:var(--mh);opacity:1;margin-top:9px;transform:none}98.065%,100%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}}
@keyframes r6{0%,17.097%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}17.984%,96.129%{max-height:var(--mh);opacity:1;margin-top:9px;transform:none}98.065%,100%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}}
@keyframes ty7{0%,17.661%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}18.065%,19.274%{max-height:var(--mh);opacity:1;margin-top:9px;transform:none}19.677%,100%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}}
@keyframes r7{0%,19.355%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}20.242%,96.129%{max-height:var(--mh);opacity:1;margin-top:9px;transform:none}98.065%,100%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}}
@keyframes p7{0%,22.177%{background:#fff;transform:none}22.258%{background:var(--sun);transform:scale(.96)}23.065%,100%{background:#fff;transform:none}}
@keyframes to7{0%,22.419%{opacity:0;transform:translate(-50%,10px)}22.903%,24.839%{opacity:1;transform:translate(-50%,0)}25.484%,100%{opacity:0;transform:translate(-50%,0)}}
@keyframes r8{0%,26.129%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}27.016%,96.129%{max-height:var(--mh);opacity:1;margin-top:9px;transform:none}98.065%,100%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}}
@keyframes ty9{0%,26.694%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}27.097%,28.306%{max-height:var(--mh);opacity:1;margin-top:9px;transform:none}28.71%,100%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}}
@keyframes r9{0%,28.387%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}29.274%,96.129%{max-height:var(--mh);opacity:1;margin-top:9px;transform:none}98.065%,100%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}}
@keyframes r10{0%,32.258%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}33.145%,96.129%{max-height:var(--mh);opacity:1;margin-top:9px;transform:none}98.065%,100%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}}
@keyframes ty11{0%,32.823%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}33.226%,34.435%{max-height:var(--mh);opacity:1;margin-top:9px;transform:none}34.839%,100%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}}
@keyframes r11{0%,34.516%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}35.403%,96.129%{max-height:var(--mh);opacity:1;margin-top:9px;transform:none}98.065%,100%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}}
@keyframes r12{0%,39.032%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}39.919%,96.129%{max-height:var(--mh);opacity:1;margin-top:9px;transform:none}98.065%,100%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}}
@keyframes ty13{0%,39.597%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}40.0%,41.21%{max-height:var(--mh);opacity:1;margin-top:9px;transform:none}41.613%,100%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}}
@keyframes r13{0%,41.29%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}42.177%,96.129%{max-height:var(--mh);opacity:1;margin-top:9px;transform:none}98.065%,100%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}}
@keyframes r14{0%,45.806%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}46.694%,96.129%{max-height:var(--mh);opacity:1;margin-top:9px;transform:none}98.065%,100%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}}
@keyframes ty15{0%,46.371%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}46.774%,47.984%{max-height:var(--mh);opacity:1;margin-top:9px;transform:none}48.387%,100%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}}
@keyframes r15{0%,48.065%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}48.952%,96.129%{max-height:var(--mh);opacity:1;margin-top:9px;transform:none}98.065%,100%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}}
@keyframes r16{0%,51.935%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}52.823%,96.129%{max-height:var(--mh);opacity:1;margin-top:9px;transform:none}98.065%,100%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}}
@keyframes ty17{0%,52.5%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}52.903%,54.113%{max-height:var(--mh);opacity:1;margin-top:9px;transform:none}54.516%,100%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}}
@keyframes r17{0%,54.194%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}55.081%,96.129%{max-height:var(--mh);opacity:1;margin-top:9px;transform:none}98.065%,100%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}}
@keyframes r18{0%,58.065%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}58.952%,96.129%{max-height:var(--mh);opacity:1;margin-top:9px;transform:none}98.065%,100%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}}
@keyframes ty19{0%,58.629%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}59.032%,60.242%{max-height:var(--mh);opacity:1;margin-top:9px;transform:none}60.645%,100%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}}
@keyframes r19{0%,60.323%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}61.21%,96.129%{max-height:var(--mh);opacity:1;margin-top:9px;transform:none}98.065%,100%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}}
@keyframes r20{0%,64.839%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}65.726%,96.129%{max-height:var(--mh);opacity:1;margin-top:9px;transform:none}98.065%,100%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}}
@keyframes ty21{0%,65.403%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}65.806%,67.016%{max-height:var(--mh);opacity:1;margin-top:9px;transform:none}67.419%,100%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}}
@keyframes r21{0%,67.097%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}67.984%,96.129%{max-height:var(--mh);opacity:1;margin-top:9px;transform:none}98.065%,100%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}}
@keyframes ty22{0%,68.306%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}68.71%,69.919%{max-height:var(--mh);opacity:1;margin-top:9px;transform:none}70.323%,100%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}}
@keyframes r22{0%,70.0%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}70.887%,96.129%{max-height:var(--mh);opacity:1;margin-top:9px;transform:none}98.065%,100%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}}
@keyframes ty23{0%,72.5%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}72.903%,74.113%{max-height:var(--mh);opacity:1;margin-top:9px;transform:none}74.516%,100%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}}
@keyframes r23{0%,74.194%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}75.081%,96.129%{max-height:var(--mh);opacity:1;margin-top:9px;transform:none}98.065%,100%{max-height:0;opacity:0;margin-top:0;transform:translateY(10px) scale(.96)}}
@keyframes k0{0%{background:var(--k);transform:none;box-shadow:none}31.613%{background:var(--k);transform:none}31.694%{background:#fff;transform:translateY(2px) scale(.96)}32.258%{background:var(--k);transform:none}57.419%{background:var(--k);transform:none}57.5%{background:#fff;transform:translateY(2px) scale(.96)}58.065%{background:var(--k);transform:none}100%{background:var(--k);transform:none}}
.kb span:nth-child(1){animation:k0 62.0s infinite}
@keyframes k1{0%{background:var(--k);transform:none;box-shadow:none}38.387%{background:var(--k);transform:none}38.468%{background:#fff;transform:translateY(2px) scale(.96)}39.032%{background:var(--k);transform:none}51.29%{background:var(--k);transform:none}51.371%{background:#fff;transform:translateY(2px) scale(.96)}51.935%{background:var(--k);transform:none}100%{background:var(--k);transform:none}}
.kb span:nth-child(2){animation:k1 62.0s infinite}
@keyframes k2{0%{background:var(--k);transform:none;box-shadow:none}45.161%{background:var(--k);transform:none}45.242%{background:#fff;transform:translateY(2px) scale(.96)}45.806%{background:var(--k);transform:none}100%{background:var(--k);transform:none}}
.kb span:nth-child(3){animation:k2 62.0s infinite}
@keyframes k3{0%{background:var(--k);transform:none;box-shadow:none}64.194%{background:var(--k);transform:none}64.274%{background:#fff;transform:translateY(2px) scale(.96)}64.839%{background:var(--k);transform:none}100%{background:var(--k);transform:none}}
.kb span:nth-child(4){animation:k3 62.0s infinite}
@keyframes sc0{0%,30.634999999999998%{background:var(--ink);color:#fff}30.645%,98.065%{background:transparent;color:var(--mu)}100%{background:var(--ink);color:#fff}}
@keyframes sc1{0%,30.634999999999998%{background:transparent;color:var(--mu)}30.645%,44.506%{background:var(--ink);color:#fff}44.516%,100%{background:transparent;color:var(--mu)}}
@keyframes sc2{0%,44.506%{background:transparent;color:var(--mu)}44.516%,63.861000000000004%{background:var(--ink);color:#fff}63.871%,100%{background:transparent;color:var(--mu)}}
@keyframes sc3{0%,63.861000000000004%{background:transparent;color:var(--mu)}63.871%,99.99%{background:var(--ink);color:#fff}100.0%,100%{background:transparent;color:var(--mu)}}

.sticker{position:absolute;border:3px solid var(--ink);border-radius:20px;background:#fff;padding:10px 16px;font-family:'Bricolage Grotesque';font-weight:800;font-size:20px;box-shadow:5px 6px 0 0 var(--ink);animation:float 6s ease-in-out infinite;z-index:5}
.sticker small{display:block;font-family:'Hanken Grotesk';font-weight:500;font-size:13px;color:var(--mu)}
.st1{left:-26px;top:150px;background:var(--sage);transform:rotate(-6deg)}
.st2{right:-30px;top:420px;background:var(--lav);transform:rotate(5deg);animation-delay:-2s}
.st3{left:-6px;bottom:26px;background:var(--sun);transform:rotate(3deg);animation-delay:-4s}
@keyframes float{0%,100%{translate:0 0}50%{translate:0 -12px}}
/* marquee */
.mq{background:var(--ink);color:#fff;padding:18px 0;overflow:hidden;transform:rotate(-1.2deg);margin:0 -20px;position:relative;z-index:2}
.mq-t{display:flex;gap:44px;white-space:nowrap;width:max-content;font-family:'Bricolage Grotesque';font-weight:800;font-size:30px;animation:mq 28s linear infinite}
.mq-t span:nth-child(3n+1){color:var(--sun)}.mq-t span:nth-child(3n+2){color:var(--peach)}.mq-t span:nth-child(3n){color:var(--sage)}
.mq:hover .mq-t{animation-play-state:paused}
@keyframes mq{to{transform:translateX(-50%)}}
/* sections */
section{padding:120px 0 40px;position:relative}
.kick{display:inline-block;background:var(--lav);color:var(--lavD);font-weight:600;border-radius:999px;padding:5px 15px;font-size:15px;margin-bottom:20px}
h2{font-size:64px;line-height:1}
.sub{color:var(--mu);font-size:20px;max-width:32em;margin-top:20px}
/* no app */
.noapp{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:56px;align-items:center}
.vs{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.vcol{border:3px solid var(--ink);border-radius:30px;padding:26px 22px 28px;box-shadow:8px 9px 0 0 var(--ink);display:flex;flex-direction:column;gap:12px}
.vcol h3{font-size:22px;margin-bottom:6px}
.vcol.old{background:#fff}
.vcol.new{background:var(--sun)}
.chip{border:2px solid var(--ink);border-radius:14px;padding:9px 14px;font-weight:600;font-size:16px;background:#fff;position:relative;width:fit-content;max-width:100%}
.old .chip{color:var(--mu);border-style:dashed;background:#FFF9F0}
.old .chip:after{content:'';position:absolute;left:10px;right:10px;top:50%;height:3px;border-radius:3px;background:var(--coral);transform-origin:left}
.new .chip{background:#fff}
.zero{font-family:'Bricolage Grotesque';font-weight:800;font-size:96px;line-height:.9;letter-spacing:-.05em}
.zero small{display:block;font-family:'Hanken Grotesk';font-weight:600;font-size:16px;letter-spacing:0;margin-top:8px}
.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px;margin-top:60px}
.step{background:var(--card);border:3px solid var(--ink);border-radius:30px;padding:32px 28px 34px;box-shadow:8px 9px 0 0 var(--ink);transition:transform .4s cubic-bezier(.3,1.5,.5,1),box-shadow .4s}
.step:hover{transform:translate(-4px,-6px) rotate(-.6deg);box-shadow:12px 15px 0 0 var(--ink)}
.step:nth-child(2){background:#FBE6B8}.step:nth-child(3){background:#E7F5EC}
.num{width:52px;height:52px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;font-family:'Bricolage Grotesque';font-weight:800;font-size:24px;margin-bottom:22px}
.step h3{font-size:30px;margin-bottom:10px}
.step p{color:var(--mu);font-size:17px}
.step code{display:inline-block;margin-top:16px;background:#fff;border:2px solid var(--ink);border-radius:10px;padding:4px 12px;font-size:15px;font-family:ui-monospace,Menlo,monospace}
/* report */
.rep{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:56px;align-items:center}
.card2{background:#fff;border:3px solid var(--ink);border-radius:32px;padding:30px;box-shadow:10px 12px 0 0 var(--ink);transition:transform .5s cubic-bezier(.3,1.4,.5,1)}
.card2:hover{transform:rotate(.8deg) translateY(-6px)}
.rh{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:6px}
.rh b{font-family:'Bricolage Grotesque';font-size:30px;font-weight:800}
.rh span{color:var(--mu);font-size:15px}
.fg{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:22px 0}
.fg div{border-radius:18px;padding:14px 14px 16px}
.fg div:nth-child(1){background:var(--lav)}.fg div:nth-child(2){background:var(--sun)}.fg div:nth-child(3){background:var(--sage)}
.fg small{display:block;font-size:12px;font-weight:600;color:#4A3326}
.fg b{font-family:'Bricolage Grotesque';font-weight:800;font-size:30px;line-height:1.1}
.row2{display:flex;align-items:center;gap:12px;margin-top:10px;font-size:14px;font-weight:600}
.row2 span{width:44px;flex:none}
.trk{position:relative;flex:1;height:22px;background:#F3E6D3;border-radius:11px;overflow:hidden}
.seg{position:absolute;top:4px;height:14px;border-radius:7px;transform-origin:left;animation:fill 1.6s cubic-bezier(.3,1.2,.5,1) both}
.seg.n{background:var(--lavD)}.seg.p{background:#9AA7E8;top:6px;height:10px}.seg.a{background:var(--coral);top:1px;height:20px;width:5px}.seg.g{background:var(--sageD);top:1px;height:20px;width:5px}
@keyframes fill{from{transform:scaleX(0);opacity:0}to{transform:scaleX(1);opacity:1}}
.care{display:flex;height:34px;border-radius:12px;overflow:hidden;border:2px solid var(--ink);margin-top:22px}
.care i{font-style:normal;display:grid;place-items:center;font-weight:800;font-size:14px;transform-origin:left;animation:fill 1.4s .5s cubic-bezier(.3,1.2,.5,1) both}
.cl{display:flex;gap:18px;margin-top:10px;font-size:14px;font-weight:600;flex-wrap:wrap}
.cl span:before{content:'';display:inline-block;width:11px;height:11px;border-radius:4px;background:var(--c);margin-right:7px;border:2px solid var(--ink)}
.note{margin-top:14px;font-size:13px;color:var(--mu)}
.ticks{list-style:none;padding:0;margin:34px 0 0;display:flex;flex-direction:column;gap:18px}
.ticks li{display:flex;gap:16px;font-size:18px;color:var(--mu)}
.ticks li:before{content:'';flex:none;width:28px;height:28px;border-radius:50%;background:var(--sage);border:2px solid var(--ink);margin-top:0;box-shadow:inset -5px -5px 0 0 rgba(47,125,91,.55)}
.ticks b{color:var(--ink);font-weight:600}
/* trust */
.keep{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px;margin-top:56px}
.kc{border:3px solid var(--ink);border-radius:30px;padding:30px 28px 32px;box-shadow:8px 9px 0 0 var(--ink)}
.kc.yes{background:var(--sage)}.kc.no{background:var(--peach)}
.kc h3{font-size:28px;margin-bottom:16px}
.kc ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:11px}
.kc li{display:flex;gap:12px;font-size:17px;line-height:1.4;color:#4A3326}
.kc li:before{content:'';flex:none;width:22px;height:22px;border-radius:50%;background:#fff;border:2px solid var(--ink);margin-top:1px}
.kc.no li:before{background:linear-gradient(45deg,transparent 44%,var(--ink) 44% 56%,transparent 56%),linear-gradient(-45deg,transparent 44%,var(--ink) 44% 56%,transparent 56%),#fff}
.tr{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:26px}
.tc{border:3px solid var(--ink);border-radius:26px;padding:26px 22px;background:#fff;transition:transform .4s cubic-bezier(.3,1.5,.5,1)}
.tc:hover{transform:translateY(-8px) rotate(1deg)}
.tc:nth-child(1){background:var(--lav)}.tc:nth-child(2){background:var(--sun)}.tc:nth-child(3){background:#FBE6B8}
.tc h3{font-size:24px;margin-bottom:8px}.tc p{font-size:16px;color:#4A3326}
.legal{margin-top:22px;font-size:14px;color:var(--mu);max-width:48em}
.end{margin:100px 0 0;border:3px solid var(--ink);border-radius:44px;background:var(--coral);color:#fff;padding:90px 40px;text-align:center;box-shadow:12px 14px 0 0 var(--ink);position:relative;overflow:hidden}
.end h2{font-family:'Bricolage Grotesque',system-ui,sans-serif;font-weight:800;letter-spacing:-0.035em;font-size:60px;line-height:1.05;}
.bh{font-family:'Bricolage Grotesque',system-ui,sans-serif!important;font-weight:800!important;letter-spacing:-0.035em!important;}
.end p{margin:20px auto 38px;font-size:21px;max-width:28em;color:#FFF2EA}
.end .btn.pri{background:#fff;color:var(--ink);box-shadow:0 6px 0 0 var(--ink);border:2px solid var(--ink)}
.end .btn.pri:hover{box-shadow:0 3px 0 0 var(--ink)}
.moon{position:absolute;width:140px;height:140px;border-radius:50%;background:var(--sun);right:-30px;top:-30px;opacity:.9;animation:drift 12s ease-in-out infinite}
footer{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:40px 0 56px;color:var(--mu);font-size:15px}


/* characters */
.cw{display:block}
.cw img{display:block;width:100%;height:auto;transform-origin:50% 96%}
.cast{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:34px;max-width:540px;animation:pop .9s .75s both}
.who{text-align:center;display:flex;flex-direction:column;align-items:center;gap:1px}
.who .cw{width:100%;max-width:170px}
.who b{font-family:'Bricolage Grotesque',system-ui,sans-serif;font-size:17px;letter-spacing:-.02em;line-height:1.15;margin-top:2px}
.who small{font-size:13px;color:var(--mu);line-height:1.25}
.cw.m img{animation:droop 5s ease-in-out infinite}
.cw.dd img{animation:droop 6.5s -2s ease-in-out infinite}
.cw.k img{animation:bounce 1.7s cubic-bezier(.3,0,.3,1) infinite}
@keyframes droop{0%,100%{transform:rotate(-2deg)}50%{transform:rotate(3deg) translateY(2px)}}
@keyframes bounce{0%,100%{transform:translateY(0) scale(1,1)}12%{transform:scale(1.05,.94)}50%{transform:translateY(-16px) scale(.98,1.03)}88%{transform:scale(1.03,.97)}}
.cc.bb{background:#FFD9E0}
.cc .cw{max-width:230px;margin:0 auto}
.sd.bolt{background:#F5C46B;box-shadow:inset 0 0 0 3px #fff}
.cups{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:56px}
.cm{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:48px;align-items:center;margin-top:60px}
.bean{position:absolute;right:34px;bottom:-8px;width:190px;animation:float 5s ease-in-out infinite;z-index:1}
@media (max-width:900px){.cups{grid-template-columns:1fr}.cm{grid-template-columns:1fr}.cast{margin-inline:auto}.bean{width:130px;right:10px}}
@media (max-width:560px){.cast{gap:6px}.who b{font-size:14px}.who small{font-size:11.5px}}
@media (prefers-reduced-motion:reduce){.lg{animation:none}}
/* coffee meter */
.cc{border:3px solid var(--ink);border-radius:30px;padding:22px 18px 24px;box-shadow:8px 9px 0 0 var(--ink);text-align:center;transition:transform .45s cubic-bezier(.3,1.5,.5,1)}
.cc:hover{transform:translateY(-8px) rotate(-1deg)}
.cc.fw{background:#FBE6B8}.cc.de{background:#E7E0FA}
.liq{transform-box:fill-box;transform-origin:bottom;transform:scaleY(var(--lvl))}
.steam{fill:none;stroke:var(--ink);stroke-width:5;stroke-linecap:round;opacity:0;animation:steam 3.4s ease-in-out infinite}
.steam.s2{animation-delay:.9s}.steam.s3{animation-delay:1.8s}
@keyframes steam{0%{opacity:0;transform:translateY(8px)}30%{opacity:.5}100%{opacity:0;transform:translateY(-16px)}}
@keyframes pour{from{transform:scaleY(0)}to{transform:scaleY(var(--lvl))}}
.cc h3{font-size:24px;margin:8px 0 2px}
.cc .up{font-size:15px;color:var(--mu)}
.shots{display:flex;gap:8px;justify-content:center;margin:14px 0 8px}
.sd{width:22px;height:22px;border-radius:50%;border:2px solid var(--ink);background:#fff}
.sd.on{background:var(--ink);box-shadow:inset 0 0 0 3px #fff}
.cc .big{font-family:'Bricolage Grotesque',system-ui,sans-serif;font-weight:800;font-size:28px;letter-spacing:-.03em;line-height:1.1}
.ticket{background:#FFFDF8;border:3px solid var(--ink);padding:28px 26px 30px;box-shadow:8px 9px 0 0 var(--ink);font-family:ui-monospace,Menlo,monospace;font-size:15px;color:var(--ink);position:relative;transform:rotate(1.2deg);transition:transform .5s cubic-bezier(.3,1.4,.5,1)}
.ticket:hover{transform:rotate(0deg) translateY(-6px)}
.ticket h4{margin:0;font-family:'Bricolage Grotesque',system-ui,sans-serif;font-size:26px;letter-spacing:-.02em;text-align:center;font-weight:800}
.ticket .tsub{text-align:center;color:var(--mu);font-size:13px;margin:4px 0 16px}
.ticket hr{border:0;border-top:2px dashed var(--ink);margin:14px 0}
.tl{display:flex;justify-content:space-between;gap:12px;margin:8px 0}
.tl b{font-weight:700}
.tl span:last-child{white-space:nowrap}
.tn{color:var(--mu);font-size:13px;margin-top:2px}
.tt{font-family:'Bricolage Grotesque',system-ui,sans-serif;font-size:19px;text-align:center;margin-top:6px;font-weight:700}
.rule{margin-top:26px;font-size:14px;color:var(--mu);max-width:36em}
@media (max-width:900px){.ticket{transform:none}}
@media (prefers-reduced-motion:reduce){.steam{display:none}}
@supports (animation-timeline:view()){
 .rv{animation:pop linear both;animation-timeline:view();animation-range:entry 4% entry 40%}
 .liq{animation:pour linear both;animation-timeline:view();animation-range:entry 20% entry 100%}
 .old .chip:after{animation:wipe linear both;animation-timeline:view();animation-range:entry 30% entry 90%}
 .old .chip:nth-child(3):after{animation-range:entry 36% entry 94%}.old .chip:nth-child(4):after{animation-range:entry 42% entry 98%}
 .old .chip:nth-child(5):after{animation-range:entry 48% entry 100%}.old .chip:nth-child(6):after{animation-range:entry 54% entry 100%}
}

/* price + waitlist */
.pw{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:30px;margin-top:56px;align-items:stretch}
.pc{background:var(--sun);border:3px solid var(--ink);border-radius:30px;padding:34px 30px 32px;box-shadow:8px 9px 0 0 var(--ink);display:flex;flex-direction:column;gap:14px}
.pc .amt{font-family:'Bricolage Grotesque',system-ui,sans-serif;font-size:96px;line-height:.95;}
.pc .amt small{font-family:'Hanken Grotesk',system-ui,sans-serif;font-size:19px;font-weight:600;text-shadow:none;margin-left:10px}
.pc h3{font-size:26px}
.pc ul{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-direction:column;gap:10px}
.pc li{display:flex;gap:12px;font-size:17px;line-height:1.4;color:#4A3326}
.pc li:before{content:'';flex:none;width:22px;height:22px;border-radius:50%;background:#fff;border:2px solid var(--ink);margin-top:1px;box-shadow:inset 0 0 0 4px var(--sageD)}
.pc .pn{font-size:14px;color:#6B4F18;margin-top:auto}
.wf{background:#fff;border:3px solid var(--ink);border-radius:30px;padding:34px 30px 30px;box-shadow:8px 9px 0 0 var(--ink)}
.wf h3{font-size:30px;margin-bottom:8px}
.wf>p{color:var(--mu);font-size:17px}
.wf label,.wf legend{display:block;font-weight:600;font-size:15px;margin:22px 0 8px;padding:0}
.wf fieldset{border:0;padding:0;margin:0;min-width:0}
.wf input[type=email]{width:100%;min-height:54px;border:3px solid var(--ink);border-radius:16px;padding:0 16px;font:inherit;font-size:17px;background:var(--bg);color:var(--ink)}
.wf input[type=email]:focus-visible{outline:3px solid var(--lavD);outline-offset:2px}
.opts{display:flex;gap:10px;flex-wrap:wrap}
.opts label{margin:0;position:relative;cursor:pointer}
.opts input{position:absolute;opacity:0;inset:0}
.opts span{display:inline-block;border:2px solid var(--ink);border-radius:14px;padding:9px 14px;font-weight:600;font-size:15px;background:#fff;transition:transform .25s cubic-bezier(.3,1.6,.5,1),background .2s}
.opts input:checked+span{background:var(--lav);box-shadow:0 3px 0 0 var(--ink);transform:translateY(-2px)}
.opts input:focus-visible+span{outline:3px solid var(--lavD);outline-offset:2px}
.wf button{margin-top:26px;border:0;cursor:pointer;font-family:inherit;width:100%;justify-content:center}
.wf .legal{margin-top:16px}
.wf .ok{display:none;text-align:center;padding:30px 0 10px}
.wf .ok img{width:120px;display:block;margin:0 auto 14px}
.wf .ok h3{font-size:30px}
.wf.sent form{display:none}.wf.sent .ok{display:block}
@media (max-width:900px){.pw{grid-template-columns:1fr}.pc .amt{font-size:84px}}
@media (max-width:1000px){.stage{height:780px}.st1{left:-6px}.st2{right:-6px}}
@media (max-width:900px){.hero,.rep,.noapp{grid-template-columns:1fr}.hero h1{font-size:50px}h2{font-size:42px}.end h2{font-size:40px}.steps{grid-template-columns:1fr}.tr{grid-template-columns:1fr}.keep{grid-template-columns:1fr}}
@media (max-width:560px){.fg{grid-template-columns:1fr}.vs{grid-template-columns:1fr}.sticker{display:none}.hero h1{font-size:38px}.phone{width:330px;margin-left:-165px}.tg{height:700px}.stage{height:760px}}
@media (prefers-reduced-motion:reduce){.d *{animation:none!important;transition:none!important}.row{max-height:var(--mh)!important;opacity:1!important;margin-top:9px!important}.row.ty{display:none}.toast{display:none}.mq-t{transform:none!important}.old .chip:after{transform:none}}

.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.wf .err{margin-top:14px;color:#9B2C1C;font-weight:600;font-size:15px}
.wf .err[hidden]{display:none}
.wf button[disabled]{opacity:.6;cursor:progress}
a.inl{text-decoration:underline;text-underline-offset:3px}
/* privacy page */
.doc{max-width:760px;padding-block:20px 40px}
.doc h1{font-size:46px;line-height:1.08;margin:18px 0 12px}
.doc h2{font-size:28px;margin:44px 0 12px}
.doc p,.doc li{font-size:18px;color:#4A3326}
.doc p{margin:0 0 14px}
.doc ul{margin:0 0 14px;padding-left:22px;display:flex;flex-direction:column;gap:6px}
.doc .when{color:var(--mu);font-size:15px}
.doc p a,.doc li a{text-decoration:underline;text-underline-offset:3px}
.doc .box{background:var(--sage);border:3px solid var(--ink);border-radius:24px;padding:20px 24px;box-shadow:6px 7px 0 0 var(--ink);margin:24px 0}
.doc .box p{margin:0;color:var(--ink)}
@media (max-width:560px){.doc h1{font-size:34px}.doc h2{font-size:24px}}

/* ---------- phone first ---------- */
.d :where(h1,h2,h3){line-height:1.1}
.step h3,.kc h3,.tc h3,.wf h3,.pc h3,.cc h3{line-height:1.12}
.hcol{display:block}
.three{list-style:none;margin:30px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;max-width:640px;animation:pop .8s .55s both}
.three li{display:flex;flex-direction:column;gap:8px;font-weight:600;font-size:15.5px;line-height:1.3}
.three b{width:30px;height:30px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;font-family:'Bricolage Grotesque',system-ui,sans-serif;font-size:15px}
.sticky{display:none}
@media (max-width:900px){
 .d{padding-bottom:84px}
 .wrap{padding:0 20px}
 section{padding:72px 0 24px}
 .nav{padding:14px 0;flex-wrap:nowrap}
 .links{gap:0}
 .links a:not(.btn){display:none}
 .logo{font-size:19px}.lg{width:38px;height:38px}
 .hero{padding:8px 0 56px;gap:0}
 .hcol{display:contents}
 .tag{justify-self:start;font-size:14px;padding:6px 14px}
 .hero h1{font-size:40px;margin:18px 0 14px}
 .lede{font-size:18px;max-width:none}
 .cta{flex-direction:column;gap:12px;margin-top:22px}
 .cta .btn{width:100%;justify-content:center;min-height:56px;font-size:18px}
 .three{margin-top:26px}
 .fine{margin-top:16px}
 .stage{order:1;margin-top:34px;height:740px}
 .cast{order:2;justify-self:center;margin-top:8px;width:100%}
 .phone{left:0;right:0;margin-left:auto;margin-right:auto;width:min(340px,calc(100% - 12px));box-shadow:6px 8px 0 0 var(--ink)}
 h2{font-size:36px}
 .sub{font-size:17px;margin-top:14px}
 .cups{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;margin-inline:-20px;padding:0 20px 18px;scroll-padding:0 20px;-webkit-overflow-scrolling:touch}
 .cups .cc{flex:0 0 78%;scroll-snap-align:center}
 .cc .cw{max-width:190px}
 .pc{padding:26px 22px}
 .pc .amt{font-size:72px}
 .pc .amt small{display:block;margin:8px 0 0;font-size:17px}
 .wf{padding:26px 20px}
 .opts span{padding:12px 16px}
 .wf button{min-height:56px}
 .end{margin-top:64px;padding:48px 22px 150px;border-radius:32px;box-shadow:8px 10px 0 0 var(--ink)}
 .end h2{font-size:34px}
 .end p{font-size:18px;margin:14px auto 26px}
 .end .btn.pri{width:100%;justify-content:center}
 .bean{left:calc(50% - 60px);right:auto;width:120px;bottom:-6px}
 .moon{width:90px;height:90px}
 footer{flex-direction:column;gap:6px;padding:32px 0 24px}
 .mq{padding:12px 0}.mq-t{font-size:22px;gap:32px}
 .sticky{display:block;position:fixed;left:0;right:0;bottom:0;z-index:50;padding:10px 16px calc(10px + env(safe-area-inset-bottom,0px));background:rgba(251,241,227,.95);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-top:2px solid var(--ink);transform:translateY(110%);visibility:hidden;transition:transform .3s,visibility 0s .3s}
 .sticky.on{transform:none;visibility:visible;transition:transform .3s,visibility 0s}
 .sticky .btn{box-sizing:border-box;width:100%;justify-content:center;min-height:52px;font-size:17px}
}
@media (max-width:560px){
 .three{grid-template-columns:1fr;gap:12px}
 .three li{flex-direction:row;align-items:center;gap:12px}
 .hero h1{font-size:36px}
}
@media (prefers-reduced-motion:reduce){.sticky{transition:none}}

/* language switch */
.langs{display:flex;gap:6px;align-items:center}
.d .langs a,.d .links .langs a{padding:4px 11px;border:2px solid var(--ink);border-radius:999px;font-weight:700;font-size:13px;line-height:1.4;background:#fff;color:var(--ink);text-decoration:none}
.d .links .langs a:after{display:none}
.d .langs a[aria-current]{background:var(--ink);color:#fff}
footer{align-items:center}
@media (max-width:900px){.links .langs{display:none}}