/* ============ v3 hero scenes and section blocks (each page combines its own) ============ */

/* split hero: copy left, scene right */
.v-hero--split{padding:40px 0 70px}
.v-hero--split .v-split{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:48px;align-items:center}
.v-head--l{text-align:left;align-items:flex-start}
.v-head--l h1{max-width:12ch;font-size:clamp(38px,5vw,68px)}
.v-head--l .f-lead{margin-left:0}
.v-head--l .hero-cta{justify-content:flex-start}
.v-hero--center .x-hz{margin-top:44px}

.x-hz{position:relative}
.x-hz-panel{position:relative;border-radius:28px;padding:44px clamp(16px,3vw,40px) 28px;background:url(/_site/img/grain.png) center/240px repeat,linear-gradient(160deg,var(--p1,#FF5A45),var(--p2,#FF8A3D));background-blend-mode:soft-light,normal;overflow:hidden}
.x-hz-panel .mk-stage{padding:0}
.x-hz-panel>.mk-stage>*{animation:stg-rise 1s cubic-bezier(.2,.7,.2,1) both .15s}
.x-hz-panel--sm{padding:30px 22px 22px}
.v-hero--center .x-hz-panel{max-width:1100px;margin:0 auto;border-radius:32px 32px 0 0;max-height:520px}
.v-hero--center .x-hz-panel::after{content:"";position:absolute;left:0;right:0;bottom:0;height:120px;background:linear-gradient(180deg,rgba(245,248,250,0),var(--bg))}
.x-chp{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:550;color:var(--ink-2);background:#fff;border:1px solid var(--line);border-radius:100px;padding:5px 12px 5px 6px;white-space:nowrap;box-shadow:0 1px 2px rgba(13,31,43,.05)}
.x-chp-i{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:8px;background:var(--brand-tint);color:var(--brand);flex:none}
.x-chp-i .ic,.x-tst-i .ic{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.x-chps{display:flex;flex-wrap:wrap;gap:8px}

/* toasts */
.x-tst-stack{position:absolute;right:-18px;top:-22px;width:min(320px,62%);display:flex;flex-direction:column;gap:10px;z-index:3}
.x-tst,.x-pop,.x-cal-t{display:flex;align-items:center;gap:11px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:10px 14px 10px 10px;box-shadow:0 20px 40px -20px rgba(13,31,43,.45)}
.x-tst-i{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:var(--brand-tint);color:var(--brand);flex:none}
.x-tst b,.x-pop b{display:block;font-size:13.5px;font-weight:600;line-height:1.3}
.x-tst small,.x-pop small{display:block;font-size:12px;color:var(--ink-faint)}
.x-tst{opacity:0;animation:tst-in 10s cubic-bezier(.2,.8,.2,1) infinite}
.x-tst.x-d2,.x-cal-t.x-d2{animation-delay:1.2s}.x-tst.x-d3,.x-cal-t.x-d3{animation-delay:2.4s}.x-tst.x-d4,.x-cal-t.x-d4{animation-delay:3.6s}
@keyframes tst-in{0%{opacity:0;transform:translateX(40px) scale(.96)}6%,82%{opacity:1;transform:none}90%,100%{opacity:0;transform:translateY(-8px)}}

/* orbit: chips pass behind the panel on the upper half and in front of it on the lower half */
.x-hz-orbit{position:relative;width:min(1180px,100%);margin:10px auto 0;padding-top:70px}
.x-orb-r{position:absolute;left:50%;top:250px;border:1.5px dashed rgba(8,121,127,.3);border-radius:50%;transform:translate(-50%,-50%);pointer-events:none;z-index:0}
.x-orb-r.x-r1{width:1120px;height:380px}.x-orb-r.x-r2{width:880px;height:280px;border-color:rgba(255,90,69,.3)}
.x-orb-c{position:absolute;left:50%;top:20px;margin-left:-590px;display:inline-flex;align-items:center;gap:7px;font-size:13.5px;font-weight:600;background:#fff;border:1px solid var(--line);border-radius:100px;padding:6px 14px 6px 6px;box-shadow:0 16px 30px -16px rgba(13,31,43,.45);white-space:nowrap;offset-rotate:0deg;animation:orb 28s linear infinite}
.x-orb-c.x-o1,.x-orb-c.x-o3{offset-path:path('M 30 230 A 560 190 0 1 1 1150 230 A 560 190 0 1 1 30 230')}
.x-orb-c.x-o2,.x-orb-c.x-o4{offset-path:path('M 150 230 A 440 140 0 1 1 1030 230 A 440 140 0 1 1 150 230');animation-duration:22s}
.x-orb-c.x-o2{animation-delay:-5s}.x-orb-c.x-o3{animation-delay:-14s}.x-orb-c.x-o4{animation-delay:-16s}
@keyframes orb{0%{offset-distance:0%;z-index:1;opacity:.75}49.9%{z-index:1;opacity:.75}50%{z-index:4;opacity:1}100%{offset-distance:100%;z-index:4;opacity:1}}
.x-hz-orbit .x-hz-panel{position:relative;z-index:2;max-width:820px;margin:0 auto;border-radius:28px 28px 0 0;max-height:430px}

/* fan of gift cards */
.x-hz-fan{min-height:460px}
.x-fan{position:absolute;left:0;top:10px;width:300px;height:200px;z-index:3}
.x-fan-c{position:absolute;inset:0;border-radius:18px;padding:18px;color:#fff;display:flex;flex-direction:column;justify-content:space-between;box-shadow:0 30px 50px -26px rgba(13,31,43,.6);transform-origin:20% 120%;animation:fan 9s ease-in-out infinite;background:linear-gradient(135deg,#FF5A45,#FF8A3D)}
.x-fan-c.x-f2{background:linear-gradient(135deg,#0FB5B5,#0A5E8A);animation-name:fan2}
.x-fan-c.x-f3{background:linear-gradient(135deg,#0D1F2B,#1B3242);animation-name:fan3}
.x-fan-c.x-f4{background:linear-gradient(135deg,#F7D28B,#C9321C);animation-name:fan4}
.x-fan-logo{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;background:rgba(255,255,255,.92)}
.x-fan-logo img{width:24px;height:24px}
.x-fan-k{font-size:11px;font-weight:650;letter-spacing:.12em;text-transform:uppercase;opacity:.85}
.x-fan-c b{font-size:18px;font-weight:600;letter-spacing:-.02em}
.x-fan-chip{position:absolute;right:18px;top:20px;width:34px;height:26px;border-radius:6px;background:linear-gradient(135deg,#F9E7B5,#D6B160)}
@keyframes fan{0%,12%,100%{transform:rotate(0)}30%,80%{transform:rotate(-16deg)}}
@keyframes fan2{0%,12%,100%{transform:rotate(0)}30%,80%{transform:rotate(-5deg)}}
@keyframes fan3{0%,12%,100%{transform:rotate(0)}30%,80%{transform:rotate(6deg)}}
@keyframes fan4{0%,12%,100%{transform:rotate(0)}30%,80%{transform:rotate(17deg)}}
.x-hz-fan .x-hz-panel{margin:120px 0 0 22%}

/* phone with pop-ups */
.x-hz-phone{min-height:520px;display:flex;justify-content:center}
.x-hz-panel--phone{width:min(460px,100%);padding:34px 24px 24px}
.x-pop{position:absolute;z-index:3;max-width:250px;opacity:0;animation:pop 8s cubic-bezier(.2,.9,.3,1.3) infinite}
.x-pop.x-p1{left:-2%;top:12%}.x-pop.x-p2{right:-4%;top:28%;animation-delay:1.4s}.x-pop.x-p3{left:-6%;top:58%;animation-delay:2.8s}.x-pop.x-p4{right:-2%;top:74%;animation-delay:4.2s}
@keyframes pop{0%{opacity:0;transform:scale(.6)}8%,84%{opacity:1;transform:scale(1)}92%,100%{opacity:0;transform:scale(.9)}}

/* chat */
.x-hz-chat{display:grid;grid-template-columns:minmax(0,1fr);gap:0}
.x-chatw{position:relative;z-index:3;width:min(400px,92%);background:#fff;border:1px solid var(--line);border-radius:22px;box-shadow:0 30px 60px -30px rgba(13,31,43,.5);overflow:hidden}
.x-chatw-h{display:flex;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid var(--line)}
.x-chatw-h .stg-logo{width:36px;height:36px;border-radius:11px}
.x-chatw-live{margin-left:auto;display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--mint);font-weight:600}
.x-chatw-live i{width:7px;height:7px;border-radius:50%;background:#22C55E}
.x-chatw-b{display:flex;flex-direction:column;gap:10px;padding:16px 14px;min-height:300px}
.x-cm{display:flex;flex-direction:column;gap:3px;max-width:82%;opacity:0;animation:cm 12s ease-out infinite}
.x-cm.out{align-self:flex-end;align-items:flex-end}
.x-cm-who{font-size:11px;color:var(--ink-faint);font-weight:550}
.x-cm-b{font-size:14px;line-height:1.4;padding:9px 13px;border-radius:16px 16px 16px 4px;background:var(--bg-2)}
.x-cm.out .x-cm-b{border-radius:16px 16px 4px 16px;background:var(--brand);color:#fff}
.x-cm.x-m2{animation-delay:1.6s}.x-cm.x-m3{animation-delay:3.2s}.x-cm.x-m4{animation-delay:4.8s}
@keyframes cm{0%{opacity:0;transform:translateY(10px)}5%,85%{opacity:1;transform:none}95%,100%{opacity:0}}
.x-cm-typing{display:flex;gap:4px;padding:10px 13px;background:var(--bg-2);border-radius:16px;align-self:flex-start;animation:cm-ty 12s infinite}
.x-cm-typing i{width:6px;height:6px;border-radius:50%;background:var(--ink-faint);animation:dot 1s infinite}
.x-cm-typing i:nth-child(2){animation-delay:.15s}.x-cm-typing i:nth-child(3){animation-delay:.3s}
@keyframes dot{0%,60%,100%{opacity:.3;transform:none}30%{opacity:1;transform:translateY(-3px)}}
@keyframes cm-ty{0%,45%{opacity:1}50%,100%{opacity:0}}
.x-hz-chat .x-hz-panel{margin:-140px 0 0 30%}

/* kanban */
.x-kb{position:relative;z-index:3;display:grid;grid-template-columns:repeat(3,1fr);gap:10px;background:#fff;border:1px solid var(--line);border-radius:22px;padding:14px;box-shadow:0 30px 60px -30px rgba(13,31,43,.5);min-height:300px}
.x-kb-col{background:var(--bg);border-radius:14px;min-height:270px;padding:10px}
.x-kb-h{font-size:12px;font-weight:650;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft)}
.x-kb-cards{position:absolute;left:14px;right:14px;top:48px}
.x-kb-card{position:absolute;left:0;width:calc((100% - 20px)/3);background:#fff;border:1px solid var(--line);border-radius:12px;padding:9px 11px;box-shadow:0 8px 18px -12px rgba(13,31,43,.4);animation:kb 12s cubic-bezier(.6,0,.3,1) infinite}
.x-kb-card b{display:block;font-size:12px;font-weight:600;line-height:1.3;margin-top:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.x-kb-tag{font-size:10.5px;font-weight:650;color:var(--pk,var(--brand));background:var(--brand-tint);border-radius:6px;padding:2px 6px}
.x-kb-card.x-k1{top:0}.x-kb-card.x-k2{top:58px;animation-delay:-3s}.x-kb-card.x-k3{top:116px;animation-delay:-6s}.x-kb-card.x-k4{top:174px;animation-delay:-9s}
@keyframes kb{0%,20%{transform:translateX(0)}33%,53%{transform:translateX(calc(100% + 10px))}66%,90%{transform:translateX(calc(200% + 20px))}100%{transform:translateX(0)}}
.x-hz-kanban .x-hz-panel{margin:-24px 0 0 22%}

/* calendar */
.x-hz-cal{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:18px;max-width:1100px;margin:0 auto}
.x-calg{background:#fff;border:1px solid var(--line);border-radius:22px;padding:14px;box-shadow:0 30px 60px -36px rgba(13,31,43,.45)}
.x-calg-h{display:grid;grid-template-columns:repeat(7,1fr);font-size:12px;font-weight:650;color:var(--ink-soft);text-align:center;padding-bottom:8px}
.x-calg-b{display:grid;grid-template-columns:repeat(7,1fr);grid-template-rows:repeat(4,38px);gap:6px;background:repeating-linear-gradient(90deg,var(--bg) 0 calc(100%/7 - 6px),transparent calc(100%/7 - 6px) calc(100%/7))}
.x-cb{border-radius:9px;background:var(--p1,#3C93F4);opacity:0;transform:scale(.6);animation:cb 10s cubic-bezier(.2,.9,.3,1.2) infinite}
.x-cb:nth-child(3n){background:var(--accent)}.x-cb:nth-child(4n){background:#2BB673}
.x-cb.x-b1{grid-area:1/1}.x-cb.x-b2{grid-area:2/2;animation-delay:.3s}.x-cb.x-b3{grid-area:1/3;animation-delay:.6s}.x-cb.x-b4{grid-area:3/4;animation-delay:.9s}.x-cb.x-b5{grid-area:2/5;animation-delay:1.2s}.x-cb.x-b6{grid-area:1/6/span 2;animation-delay:1.5s}.x-cb.x-b7{grid-area:3/7;animation-delay:1.8s}
.x-cb.x-b8{grid-area:4/1;animation-delay:2.1s}.x-cb.x-b9{grid-area:3/2;animation-delay:2.4s}.x-cb.x-b10{grid-area:2/3/span 2;animation-delay:2.7s}.x-cb.x-b11{grid-area:4/4;animation-delay:3s}.x-cb.x-b12{grid-area:4/5;animation-delay:3.3s}.x-cb.x-b13{grid-area:3/6/span 2;animation-delay:3.6s}.x-cb.x-b14{grid-area:1/7/span 2;animation-delay:3.9s}
@keyframes cb{0%{opacity:0;transform:scale(.6)}4%,88%{opacity:1;transform:none}96%,100%{opacity:0}}
.x-cal-ts{display:flex;flex-direction:column;gap:10px;justify-content:center}
.x-cal-t{font-size:13px;font-weight:600;opacity:0;animation:tst-in 10s cubic-bezier(.2,.8,.2,1) infinite}
.x-hz-cal .x-hz-panel{grid-column:1/-1}

/* stamp card */
.x-stc{position:relative;z-index:3;width:min(380px,90%);border-radius:22px;padding:18px;color:#fff;background:linear-gradient(140deg,#0D1F2B,#0A5E8A);box-shadow:0 30px 60px -30px rgba(13,31,43,.6)}
.x-stc-h{display:flex;align-items:center;gap:10px}
.x-stc-h b{font-size:16px}.x-stc-h small{margin-left:auto;font-size:12px;opacity:.75}
.x-stc-g{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-top:18px}
.x-st{aspect-ratio:1;border-radius:50%;border:2px dashed rgba(255,255,255,.35);position:relative}
.x-st::after{content:"";position:absolute;inset:3px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#FFB199,#FF5A45);transform:scale(0) rotate(-30deg);animation:stamp 11s cubic-bezier(.2,.9,.3,1.4) infinite}
.x-st.x-s2::after{animation-delay:.5s}.x-st.x-s3::after{animation-delay:1s}.x-st.x-s4::after{animation-delay:1.5s}.x-st.x-s5::after{animation-delay:2s}.x-st.x-s6::after{animation-delay:2.5s}.x-st.x-s7::after{animation-delay:3s}.x-st.x-s8::after{animation-delay:3.5s}.x-st.x-s9::after{animation-delay:4s}.x-st.x-s10::after{animation-delay:4.5s}
@keyframes stamp{0%{transform:scale(0) rotate(-30deg)}4%,86%{transform:scale(1) rotate(0)}94%,100%{transform:scale(0)}}
.x-stc-perk{margin-top:16px;background:#fff;color:var(--ink);border-radius:14px;padding:10px 14px;opacity:0;animation:perk 11s cubic-bezier(.2,.9,.3,1.3) infinite}
.x-stc-perk b{display:block;font-size:14px;color:var(--coral)}.x-stc-perk small{font-size:12.5px;color:var(--ink-soft)}
@keyframes perk{0%,46%{opacity:0;transform:translateY(10px) scale(.95)}52%,86%{opacity:1;transform:none}94%,100%{opacity:0}}
.x-hz-stamps .x-chps{position:relative;z-index:3;margin:16px 0 0}
.x-hz-stamps .x-hz-panel{margin:-200px 0 0 34%}

/* odometer counters */
.x-kts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;max-width:1100px;margin:0 auto}
.x-kt{background:#fff;border:1px solid var(--line);border-radius:18px;padding:16px 18px;box-shadow:0 1px 2px rgba(13,31,43,.05)}
.x-kt-l{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:600;color:var(--ink-soft)}
.x-kt b{display:flex;margin-top:10px;font-size:clamp(24px,2.6vw,34px);font-weight:600;letter-spacing:-.03em;line-height:1.1;height:1.1em;overflow:hidden}
.x-od{display:inline-block;height:1.1em;overflow:hidden}
.x-od>span{display:block;line-height:1.1em;animation:od 2.4s cubic-bezier(.2,.8,.2,1) both .3s}
.x-od.x-v0{--y:0}.x-od.x-v1{--y:-1.1em}.x-od.x-v2{--y:-2.2em}.x-od.x-v3{--y:-3.3em}.x-od.x-v4{--y:-4.4em}.x-od.x-v5{--y:-5.5em}.x-od.x-v6{--y:-6.6em}.x-od.x-v7{--y:-7.7em}.x-od.x-v8{--y:-8.8em}.x-od.x-v9{--y:-9.9em}
@keyframes od{from{transform:translateY(0)}to{transform:translateY(var(--y))}}
.x-bars{display:flex;align-items:flex-end;gap:6px;height:80px;max-width:1100px;margin:18px auto 0;padding:0 4px}
.x-bar{flex:1;border-radius:6px 6px 0 0;background:linear-gradient(180deg,var(--p1,#2BB673),var(--p2,#17845C));transform-origin:bottom;animation:bar 1.4s cubic-bezier(.2,.8,.2,1) both}
.x-bar.x-b1{height:30%}.x-bar.x-b2{height:45%;animation-delay:.05s}.x-bar.x-b3{height:38%;animation-delay:.1s}.x-bar.x-b4{height:60%;animation-delay:.15s}.x-bar.x-b5{height:52%;animation-delay:.2s}.x-bar.x-b6{height:78%;animation-delay:.25s}.x-bar.x-b7{height:92%;animation-delay:.3s}
.x-bar.x-b8{height:40%;animation-delay:.35s}.x-bar.x-b9{height:48%;animation-delay:.4s}.x-bar.x-b10{height:44%;animation-delay:.45s}.x-bar.x-b11{height:66%;animation-delay:.5s}.x-bar.x-b12{height:58%;animation-delay:.55s}.x-bar.x-b13{height:84%;animation-delay:.6s}.x-bar.x-b14{height:100%;animation-delay:.65s}
@keyframes bar{from{transform:scaleY(0)}to{transform:none}}
.x-hz-counter .x-hz-panel{margin-top:0}

/* radar */
.x-rad{position:relative;width:min(560px,90vw);aspect-ratio:1;margin:-10px auto -230px;border-radius:50%;background:radial-gradient(circle,rgba(8,121,127,.08),transparent 70%)}
.x-rad-r{position:absolute;inset:0;border:1.5px solid rgba(8,121,127,.18);border-radius:50%}
.x-rad-r.x-r2{inset:18%}.x-rad-r.x-r3{inset:36%}
.x-rad-sw{position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,rgba(8,151,159,.32),rgba(8,151,159,0) 22%,transparent 100%);animation:sweep 6s linear infinite;-webkit-mask:radial-gradient(circle,#000 69%,transparent 70%);mask:radial-gradient(circle,#000 69%,transparent 70%)}
@keyframes sweep{to{transform:rotate(360deg)}}
.x-blip{position:absolute;display:flex;align-items:center;gap:8px;transform:translate(-50%,-50%);z-index:4}
.x-blip i{width:12px;height:12px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 0 rgba(255,90,69,.6);animation:blip 6s infinite}
.x-blip.x-b1{left:30%;top:20%;flex-direction:row-reverse}.x-blip.x-b1 i{animation-delay:5.4s}
.x-blip.x-b2{left:72%;top:22%}.x-blip.x-b2 i{animation-delay:.9s}
.x-blip.x-b3{left:86%;top:47%}.x-blip.x-b3 i{animation-delay:1.9s}
.x-blip.x-b4{left:14%;top:49%;flex-direction:row-reverse}.x-blip.x-b4 i{animation-delay:4.2s}
@keyframes blip{0%,100%{transform:scale(.8);box-shadow:0 0 0 0 rgba(255,90,69,0)}4%{transform:scale(1.5);box-shadow:0 0 0 12px rgba(255,90,69,.18)}20%{transform:scale(1)}}
.x-rad-hub{top:36%}
.x-hz-radar .x-hz-panel{max-width:1100px;margin:0 auto}

/* ask */
.x-ask{position:relative;z-index:3;display:flex;align-items:center;gap:12px;max-width:760px;margin:0 auto;background:#fff;border:1px solid var(--line);border-radius:20px;padding:14px 16px;box-shadow:0 30px 60px -30px rgba(13,31,43,.5)}
.x-ask-i{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:var(--grad);color:#fff;flex:none}
.x-ask-i .ic{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.8}
.x-ask-t{position:relative;flex:1;height:26px;overflow:hidden;font-size:17px;font-weight:550}
.x-ask-q{position:absolute;left:0;top:0;white-space:nowrap;overflow:hidden;width:0;border-right:2px solid var(--brand);opacity:0;animation:type 16s steps(34,end) infinite}
.x-ask-q.x-q2{animation-delay:4s}.x-ask-q.x-q3{animation-delay:8s}.x-ask-q.x-q4{animation-delay:12s}
@keyframes type{0%{width:0;opacity:1}12%,22%{width:100%;opacity:1}25%,100%{width:100%;opacity:0}}
.x-ask-go{display:grid;place-items:center;width:36px;height:36px;border-radius:10px;background:var(--ink);color:#fff;font-weight:700}
.x-hz-ask .x-chps{justify-content:center;margin:16px 0 30px}

/* ---------- sections ---------- */
.x-alt{padding:60px 0}
.alt-row{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:56px;align-items:center;margin-bottom:90px}
.alt-row:last-child{margin-bottom:0}
.alt-row.flip .x-alt-copy{order:2}
.x-alt-copy{display:flex;flex-direction:column;align-items:flex-start}
.x-alt-copy h3,.x-tb-copy h3,.x-tb-full h3{font-size:clamp(28px,3vw,42px);line-height:1.05;letter-spacing:-.04em;font-weight:560;margin-top:18px}
.x-alt-copy p,.x-tb-copy p{color:var(--ink-soft);font-size:17px;line-height:1.6;margin-top:14px}
.x-alt-art{border-radius:28px;padding:40px 30px;background:url(/_site/img/grain.png) center/240px repeat,linear-gradient(200deg,var(--p1),var(--p2));background-blend-mode:soft-light,normal;box-shadow:16px 16px 0 -2px rgba(13,31,43,.06)}
.alt-row.flip .x-alt-art{box-shadow:-16px 16px 0 -2px rgba(13,31,43,.06)}
.x-alt-art .f-ill{width:100%;border-radius:18px}

.x-tbs{padding:90px 0 40px}
.x-tb{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.tb-in{position:absolute;opacity:0;pointer-events:none}
.x-tb-l{cursor:pointer;font-size:14.5px;font-weight:600;padding:10px 18px;border-radius:100px;border:1px solid var(--line);background:#fff;color:var(--ink-soft);transition:all .2s}
.x-tb-l:hover{color:var(--ink)}
.tb-in:checked+.x-tb-l{background:var(--ink);color:#fff;border-color:var(--ink)}
.tb-in:focus-visible+.x-tb-l{outline:2px solid var(--brand);outline-offset:2px}
.x-tb-ps{flex-basis:100%;margin-top:26px;background:#fff;border:1px solid var(--line);border-radius:32px;padding:20px 20px 20px 44px;box-shadow:0 30px 60px -40px rgba(13,31,43,.35)}
.x-tb-p{display:none;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:24px;align-items:center;animation:tb-in .5s ease both}
.x-tb:has(.tb-in:nth-of-type(1):checked) .x-tb-p.x-p1,.x-tb:has(.tb-in:nth-of-type(2):checked) .x-tb-p.x-p2,.x-tb:has(.tb-in:nth-of-type(3):checked) .x-tb-p.x-p3,.x-tb:has(.tb-in:nth-of-type(4):checked) .x-tb-p.x-p4,.x-tb:has(.tb-in:nth-of-type(5):checked) .x-tb-p.x-p5,.x-tb:has(.tb-in:nth-of-type(6):checked) .x-tb-p.x-p6,.x-tb:has(.tb-in:nth-of-type(7):checked) .x-tb-p.x-p7{display:grid}
.x-tb-p.x-flowp{grid-template-columns:1fr;padding:10px 24px 24px 0}
@keyframes tb-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.x-tb-copy{display:flex;flex-direction:column;align-items:flex-start;padding:24px 0}
.x-tb-art{border-radius:24px;padding:34px 26px;background:url(/_site/img/grain.png) center/240px repeat,linear-gradient(160deg,var(--p1),var(--p2));background-blend-mode:soft-light,normal}
.x-tb-full h3{text-align:center;margin:10px auto 26px;max-width:22ch}

.x-stps{padding:90px 0 40px}
.x-sp-row{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr 1.3fr;gap:14px;position:relative}
.x-sp-row::before{content:"";position:absolute;left:3%;right:3%;top:22px;height:3px;border-radius:3px;background:var(--line)}
.x-sp-row::after{content:"";position:absolute;left:3%;top:22px;height:3px;width:94%;border-radius:3px;background:linear-gradient(90deg,var(--brand),var(--accent));transform-origin:left;animation:sp-line 6s ease-in-out infinite}
@keyframes sp-line{0%{transform:scaleX(0)}60%,90%{transform:scaleX(1)}100%{transform:scaleX(1);opacity:0}}
.x-sp{position:relative;z-index:1;display:flex;flex-direction:column;gap:12px}
.x-sp-n{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:#fff;border:2px solid var(--line);font-weight:700;font-size:17px;animation:sp-n 6s infinite}
.x-sp.x-s2 .x-sp-n{animation-delay:1s}.x-sp.x-s3 .x-sp-n{animation-delay:2s}.x-sp.x-s4 .x-sp-n{animation-delay:3s}.x-sp.x-s5 .x-sp-n{animation-delay:3.6s}
@keyframes sp-n{0%,5%{border-color:var(--line);background:#fff;color:var(--ink)}12%,92%{border-color:var(--brand);background:var(--brand);color:#fff}}
.x-sp b{font-size:16px;font-weight:600;line-height:1.35}
.x-sp .x-chps{flex-direction:column;align-items:flex-start}
.x-sp-out{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.x-sp-out li{display:flex;gap:9px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:14px;padding:9px 11px}
.x-sp-out b{font-size:13.5px;display:block}.x-sp-out small{font-size:12px;color:var(--ink-soft)}

.x-bento{padding:90px 0 30px}
.x-bt-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:minmax(170px,auto);gap:14px}
.x-bt{background:#fff;border:1px solid var(--line);border-radius:24px;padding:26px;overflow:hidden;position:relative;transition:transform .2s,box-shadow .2s}
.x-bt:hover{transform:translateY(-3px);box-shadow:0 24px 40px -28px rgba(13,31,43,.35)}
.x-bt .fi{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--brand-tint);color:var(--brand)}
.x-bt .fi .ic{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.x-bt h3{font-size:18px;font-weight:600;letter-spacing:-.02em;margin-top:16px}
.x-bt p{color:var(--ink-soft);font-size:15px;line-height:1.55;margin-top:8px}
.x-bt-big{grid-column:span 2;grid-row:span 2;color:#fff;background:url(/_site/img/grain.png) center/240px repeat,linear-gradient(160deg,var(--p1,#0FB5B5),var(--p2,#0A5E8A));background-blend-mode:soft-light,normal;border:0}
.x-bt-big h3{font-size:clamp(24px,2.4vw,32px);letter-spacing:-.03em;font-weight:560}
.x-bt-big p{color:rgba(255,255,255,.88);font-size:16.5px;max-width:34ch}
.x-bt-big .fi{background:rgba(255,255,255,.2);color:#fff}
.x-bt-feed{list-style:none;margin:22px 0 0;padding:0;height:132px;overflow:hidden;-webkit-mask:linear-gradient(180deg,transparent,#000 20%,#000 80%,transparent);mask:linear-gradient(180deg,transparent,#000 20%,#000 80%,transparent)}
.x-bt-feed li{display:block;width:max-content;max-width:100%;background:rgba(255,255,255,.95);color:var(--ink);font-size:13.5px;font-weight:600;border-radius:12px;padding:8px 12px;margin-bottom:8px;animation:feed 12s linear infinite}
@keyframes feed{to{transform:translateY(-176px)}}
.x-bt.x-bt1{grid-column:span 2}.x-bt.x-bt4,.x-bt.x-bt5{grid-column:span 2}

.x-mq{padding:40px 0;overflow:hidden;display:flex;flex-direction:column;gap:12px}
.x-mq-track{overflow:hidden;-webkit-mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.x-mq-run{display:flex;gap:12px;width:max-content;animation:mq 50s linear infinite}
.x-mq-track.x-rev .x-mq-run{animation-direction:reverse;animation-duration:60s}
@keyframes mq{to{transform:translateX(-50%)}}
.x-mq-i{display:inline-flex;align-items:center;gap:8px;font-size:15px;font-weight:600;background:#fff;border:1px solid var(--line);border-radius:100px;padding:8px 18px 8px 8px;white-space:nowrap}
.x-mq-i.x-alt{padding:9px 18px;background:var(--ink);color:#fff;border-color:var(--ink);font-weight:550}

/* ---------- small screens ---------- */
@media(max-width:980px){
  .v-hero--split .v-split{grid-template-columns:1fr;gap:30px}
  .alt-row,.x-tb-p{grid-template-columns:1fr!important;gap:24px}
  .alt-row.flip .x-alt-copy{order:0}
  .x-tb-ps{padding:18px}
  .x-sp-row{grid-template-columns:1fr 1fr;row-gap:28px}
  .x-sp-row::before,.x-sp-row::after{display:none}
  .x-bt-grid{grid-template-columns:1fr 1fr}
  .x-kts{grid-template-columns:1fr 1fr}
  .x-hz-cal{grid-template-columns:1fr}
}
@media(max-width:760px){
  .x-tst-stack{position:relative;right:auto;top:auto;width:100%;margin-top:14px}
  .x-hz-fan{min-height:0}.x-fan{position:relative;width:260px;height:170px;margin:0 auto 20px}.x-hz-fan .x-hz-panel{margin:0}
  .x-pop{position:relative;left:auto!important;right:auto!important;top:auto!important;margin:8px auto 0;opacity:1;animation:none}
  .x-hz-phone{flex-direction:column;align-items:center;min-height:0}
  .x-hz-chat .x-hz-panel,.x-hz-kanban .x-hz-panel,.x-hz-stamps .x-hz-panel{margin:16px 0 0}
  .x-kb{grid-template-columns:repeat(3,1fr)}
  .x-orb-c{position:relative;offset-path:none!important;animation:none!important;margin:4px!important}
  .x-hz-orbit{display:flex;flex-wrap:wrap;justify-content:center;padding-top:10px}.x-hz-orbit .x-hz-panel{flex-basis:100%;margin-top:14px}.x-orb-c{margin-left:0!important}.x-orb-r{display:none}
  .x-rad{margin-bottom:-160px}.x-blip .x-chp{display:none}
  .x-sp-row,.x-bt-grid{grid-template-columns:1fr}
  .x-bt-big,.x-bt.x-bt1,.x-bt.x-bt4,.x-bt.x-bt5{grid-column:auto;grid-row:auto}
  .x-ask-t{font-size:14px}
}
@media(prefers-reduced-motion:reduce){
  .x-tst,.x-pop,.x-cal-t,.x-cm,.x-cb,.perk,.x-stc-perk,.x-ask-q{opacity:1!important;animation:none!important;transform:none!important}
  .x-orb-c,.x-fan-c,.x-kb-card,.x-st::after,.x-od>span,.x-bar,.x-rad-sw,.x-blip i,.x-sp-row::after,.x-sp-n,.x-bt-feed li,.x-mq-run,.x-cm-typing,.x-cm-typing i,.x-hz-panel>.mk-stage>*{animation:none!important}
  .x-st::after{transform:none}.x-od>span{transform:translateY(var(--y))}.x-ask-q:not(.x-q1){display:none}.x-cm-typing{display:none}
}

/* venue pages: three ways to show the splits (chosen per venue in src/venues.json) */
.splits--alt .split{position:relative!important;top:auto!important;min-height:0;box-shadow:none;border:0;background:transparent;padding:0;margin-bottom:80px!important;gap:56px}

.splits--alt .split.flip .s-copy{order:2}
.splits--duo .wrap{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px!important}
.splits--duo .split{position:relative!important;top:auto!important;display:flex!important;flex-direction:column-reverse;min-height:0;padding:16px!important;gap:18px}
.splits--duo .split>.mk-stage{padding:22px 16px;min-height:280px}
.splits--duo .s-copy{padding:4px 10px 14px!important}
.splits--duo .s-copy h3{font-size:clamp(22px,2vw,28px)!important}
@media(max-width:980px){.splits--duo .wrap{grid-template-columns:1fr!important}.splits--alt .split.flip .s-copy{order:0}}
.x-hz-cal .x-hz-panel{width:100%}
.splits--duo .split>.mk-stage .mk-win{zoom:.62}
.splits--duo .split>.mk-stage .mk-duo .mk-win{zoom:1}
/* steps as cards */
.x-sp-row{align-items:stretch}
.x-sp-card{flex:1;display:flex;flex-direction:column;gap:12px;background:#fff;border:1px solid var(--line);border-radius:18px;padding:16px;box-shadow:0 1px 2px rgba(13,31,43,.04)}
.x-sp-card b{font-size:16px;line-height:1.35}
.x-sp-ex{display:flex;align-items:flex-start;gap:8px;margin-top:auto;font-size:13px;font-weight:550;color:var(--ink-2);background:var(--bg);border-radius:12px;padding:9px 11px;line-height:1.35}
.x-sp-ex i{width:8px;height:8px;border-radius:50%;background:#22C55E;flex:none;margin-top:5px;box-shadow:0 0 0 3px rgba(34,197,94,.18)}
.x-sp .x-sp-card .x-chps{flex-direction:column;align-items:flex-start}
.x-sp.x-s5 .x-sp-n{font-size:20px}
/* venue scene in the hero panel */
.v-scene{display:block;width:100%;height:auto;border-radius:20px;box-shadow:0 30px 60px -36px rgba(13,31,43,.5)}
.x-hz-panel:has(.v-scene),.stg-panel:has(.v-scene){padding:22px;max-height:none}
.x-hz-panel:has(.v-scene)::after,.stg-panel:has(.v-scene)::after{display:none}
.stg-panel:has(.v-scene) .stg-mk{max-width:1060px}
.x-kt b{font-variant-numeric:tabular-nums}
.x-od{width:.62em;text-align:center}
.x-hz-counter:has(.v-scene) .x-bars{display:none}
.x-hz-counter:has(.v-scene) .x-hz-panel{margin-top:18px}
/* venue scenes run edge to edge */
.x-hz-panel:has(.v-scene),.stg-panel:has(.v-scene){width:100vw;max-width:none!important;margin-left:calc(50% - 50vw)!important;margin-right:0;border-radius:0!important;padding:0!important;background:none!important;overflow:visible}
.stg-panel:has(.v-scene)::before{display:none}
.stg-panel:has(.v-scene) .stg-mk{max-width:none}
.v-scene{border-radius:0;box-shadow:none;max-height:78vh;object-fit:cover;-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 12%,#000 82%,transparent);mask-image:linear-gradient(180deg,transparent 0,#000 12%,#000 82%,transparent)}
.x-hz-orbit:has(.v-scene){width:100%}
.x-hz-orbit .x-hz-panel:has(.v-scene){max-height:none}
.x-fan-c{background-size:cover!important;background-position:center!important}
.x-fan-c.x-f1{background:linear-gradient(160deg,rgba(255,90,69,.15),rgba(201,50,28,.85)),url(/_site/img/ill-gift.jpg)}
.x-fan-c.x-f2{background:linear-gradient(160deg,rgba(15,181,181,.1),rgba(10,94,138,.85)),url(/_site/img/ill-party.jpg)}
.x-fan-c.x-f3{background:linear-gradient(160deg,rgba(13,31,43,.2),rgba(13,31,43,.88)),url(/_site/img/ill-escape.jpg)}
.x-fan-c.x-f4{background:linear-gradient(160deg,rgba(247,210,139,.1),rgba(201,50,28,.85)),url(/_site/img/ill-vr.jpg)}
.x-fan-c b,.x-fan-k{text-shadow:0 1px 8px rgba(0,0,0,.35)}
.x-hz-panel:has(.v-scene){flex:none}
.x-odv{display:inline-flex}
.x-ask-q{max-width:max-content}