@property --pull{syntax:"<number>";inherits:true;initial-value:0}.same{--made:var(--paper);--make:#ffda35;--dim:color-mix(in srgb, var(--paper) 30%, transparent);padding:clamp(88px, 10vw, 180px) var(--gutter);color:var(--paper);background:#000;position:relative;overflow:clip}.same__wrap{width:100%;max-width:1808px;margin-inline:auto;position:relative}.slot{--fs:clamp(30px, 3.6vw, 72px);--row:calc(var(--fs) * 3.4);grid-template-columns:minmax(0,1fr) clamp(120px,11vw,200px) minmax(0,1fr);grid-template-areas:"head-made.head-make""made lever make";gap:clamp(12px,1.4vw,28px) clamp(16px,2vw,40px);display:grid}.same__head{font:500 clamp(17px, 1.55vw, 30px) / 1.3 var(--font-body);letter-spacing:-.01em;text-align:center;color:color-mix(in srgb, var(--paper) 72%, transparent);margin:0}.slot__head--made{grid-area:head-made}.slot__head--make{grid-area:head-make}.slot__window{height:calc(var(--row) * 2);min-width:0;position:relative}.slot__window--made{grid-area:made}.slot__window--make{grid-area:make}.slot__reel{will-change:filter;margin:0;padding:0;list-style:none;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#0000 6%,#000 40% 60%,#0000 94%);mask-image:linear-gradient(#0000 6%,#000 40% 60%,#0000 94%)}.slot__reel li{inset:calc(50% - var(--row) / 2) 0 auto;height:var(--row);color:var(--dim);font:500 var(--fs) / 1.02 var(--font-body);letter-spacing:-.04em;text-align:center;text-wrap:balance;transform:translateY(calc(var(--d,0) * var(--row)));will-change:transform;place-items:center;display:grid;position:absolute}.slot__reel li.is-lit{color:var(--made)}[data-reel=make] li.is-lit{color:var(--make)}.slot__lever{--pivot:64%;--arm:50%;--ball:clamp(60px, 5vw, 84px);--tilt:14deg;--swing:calc(var(--pull) * -150deg);perspective:700px;min-height:300px;perspective-origin:50% var(--pivot);transform-style:preserve-3d;touch-action:none;-webkit-user-select:none;user-select:none;grid-area:lever;position:relative}.slot__lever.is-springing{transition:--pull .78s cubic-bezier(.34,1.7,.5,1)}@media (prefers-reduced-motion:no-preference){.slot__lever[data-seen]:not(.is-busy,.is-dragging,.is-used,.is-springing){animation:lever-nudge 3.2s var(--ease-out) 1.5s infinite}}@keyframes lever-nudge{0%,72%,to{--pull:0}82%{--pull:.14}}.slot__mount{left:calc(50% - 26px);top:calc(var(--pivot) - 70px);background:linear-gradient(90deg,#0000 44%,#000000bf 46% 54%,#0000 56%) 50% 18px/100% calc(100% - 36px) no-repeat,linear-gradient(90deg,#1d1d1d,#8d8d8d 18%,#e9e9e9 34%,#a7a7a7 52%,#4a4a4a 78%,#161616);border-radius:26px;width:52px;height:140px;position:absolute;box-shadow:inset 0 1px #ffffff80,inset 0 -6px 10px #0000008c,0 18px 36px #000000b3,0 0 0 1px #ffffff0f}.slot__mount i{background:radial-gradient(circle at 35% 30%,#f5f5f5,#6a6a6a 60%,#1b1b1b);border-radius:50%;width:8px;height:8px;position:absolute;left:calc(50% - 4px);box-shadow:0 1px 1px #000c}.slot__mount i:first-child{top:6px}.slot__mount i:last-child{bottom:6px}.slot__arm{left:calc(50% - 9px);bottom:calc(100% - var(--pivot));width:18px;height:var(--arm);transform-origin:50% 100%;transform:rotateZ(var(--tilt)) rotateX(var(--swing));transform-style:preserve-3d;position:absolute}.slot__rod{inset:calc(var(--ball) * .4) 0 0;clip-path:polygon(22% 0,78% 0,100% 100%,0 100%);background:linear-gradient(90deg,#262626,#7c7c7c 16%,#f4f4f4 34%,#c8c8c8 46%,#6d6d6d 70%,#1c1c1c);position:absolute}.slot__collar{top:calc(var(--ball) * .4 - 4px);background:linear-gradient(90deg,#2a2a2a,#9a9a9a 20%,#fff 36%,#b5b5b5 55%,#3c3c3c 85%,#1a1a1a);border-radius:4px;width:18px;height:12px;position:absolute;left:0;box-shadow:0 2px 3px #00000080}.slot__ball{left:calc(50% - var(--ball) / 2);top:calc(var(--ball) * -.55);width:var(--ball);height:var(--ball);transform:rotateX(calc(-1 * var(--swing))) rotateZ(calc(-1 * var(--tilt)));background:radial-gradient(circle at 34% 26%,#fffffff2 0 5%,#fff0 16%),radial-gradient(circle at 62% 80%,#ff96828c,#ff968200 30%),radial-gradient(circle at 38% 34%,#ff8b7c,#f2402e 34%,#b3170b 64%,#4d0602 100%);border-radius:50%;position:absolute;box-shadow:inset -6px -10px 18px #2800008c,inset 4px 4px 10px #ffd2c840,0 16px 30px #000000a6}.slot__hub{left:calc(50% - 22px);top:calc(var(--pivot) - 22px);background:radial-gradient(circle,#151515 0 18%,#0000 20%),radial-gradient(circle at 36% 30%,#fff,#b9b9b9 30%,#5e5e5e 62%,#1c1c1c);border-radius:50%;width:44px;height:44px;position:absolute;transform:translateZ(2px);box-shadow:0 8px 18px #000000b3,inset 0 -3px 6px #00000080}.slot__knob{border-radius:var(--bds-radius-lg,16px);cursor:grab;background:0 0;border:0;padding:0;position:absolute;inset:0}.slot__lever>:not(.slot__knob){pointer-events:none}.slot__lever.is-dragging .slot__knob{cursor:grabbing}.slot__lever.is-busy .slot__knob{cursor:progress}.slot__knob:focus-visible{outline:2px solid var(--make);outline-offset:6px}.slot__hint{top:calc(var(--pivot) + 90px);font:600 13px / 1 var(--font-body);letter-spacing:.12em;text-align:center;text-transform:uppercase;opacity:.55;transition:opacity .3s;position:absolute;left:0;right:0}.slot__lever:is(.is-busy,.is-dragging,.is-used) .slot__hint{opacity:0}@media (max-width:760px){.slot{--fs:clamp(26px, 7.6vw, 36px);grid-template-columns:minmax(0,1fr) 76px;grid-template-areas:"head-made lever""made lever""head-make lever""make lever";gap:10px}.slot__head--make{margin-top:18px}.same__head{font-size:16px}.slot__window{height:calc(var(--row) * 1.4)}.slot__reel{-webkit-mask-image:linear-gradient(#0000,#000 30% 70%,#0000);mask-image:linear-gradient(#0000,#000 30% 70%,#0000)}.slot__lever{--ball:52px;--tilt:-7deg;--arm:36%;--pivot:54%;perspective:500px}.slot__mount{transform:scale(.8)}.slot__hint{top:calc(var(--pivot) + 70px)}}.sv-page{gap:0;padding-bottom:0}.sv-page .sheet{background:var(--deep);border-radius:0}.eco{--globe:clamp(230px, 30vw, 520px);--app:clamp(52px, 6.6vw, 124px);--eco-ring:1.8;--sun:#ffda35;--glass:linear-gradient(160deg, #ffffff1a, #ffffff08 55%);--glass-edge:inset 0 1px 0 #ffffff47, inset 0 -1px 0 #ffffff0f, inset 0 0 22px #ffffff0f;border-radius:0 0 var(--sheet-r) var(--sheet-r);background:var(--deep);align-content:center;min-height:100svh;padding-block:clamp(16px,2vw,40px);display:grid;overflow:clip}.eco__stage{height:calc(var(--globe) * 1.5);touch-action:pan-y;-webkit-user-select:none;user-select:none;place-items:center;display:grid;position:relative}.eco__stage.is-live{cursor:grab}.eco__stage.is-dragging{cursor:grabbing}.eco__mark{z-index:2;justify-items:start;row-gap:calc(var(--globe) * .05);width:-moz-fit-content;width:fit-content;color:var(--paper);transition:opacity .9s var(--ease-out), scale 1.3s var(--ease-out);margin:0;display:grid;position:relative}.eco__mark svg{width:calc(var(--globe) * .86);height:auto}.eco__suite{font:400 calc(var(--globe) * .285) / 1.15 var(--font-display);text-transform:uppercase;letter-spacing:-.02em}.eco__orbit{margin:0;padding:0;list-style:none}.eco__app{width:var(--app);pointer-events:auto;cursor:pointer;position:relative}.eco__stage:not(.is-live) .eco__orbit{display:none}.eco__stage.is-live .eco__orbit{pointer-events:none;place-items:center;display:grid;position:absolute;inset:0}.eco__stage.is-live .eco__app{margin:calc(var(--app) / -2) 0 0 calc(var(--app) / -2);will-change:transform, opacity;position:absolute;top:50%;left:50%}.eco__app:hover,.eco__app:focus-visible,.eco__app.is-open{z-index:5!important}.eco__app picture{transition:opacity .7s var(--ease-out), scale 1.1s var(--ease-spring);transition-delay:calc(var(--i,0) * 70ms + .24s);display:block}.eco__app img{filter:drop-shadow(0 16px 22px #00000080);width:100%;height:auto;transition:scale .48s var(--ease-spring), translate .48s var(--ease-spring);display:block}.eco__app:hover img,.eco__app:focus-visible img,.eco__app.is-open img{translate:0 -4px;scale:1.12}.eco__token{--t:#ffda35;aspect-ratio:1;background:radial-gradient(circle at 34% 26%, #ffffff8c, #fff0 34%), radial-gradient(circle at 50% 60%, var(--t), color-mix(in srgb, var(--t), #000 45%) 100%);color:#10230f;font:700 max(10px, calc(var(--app) * .17)) / 1 var(--font-body);letter-spacing:-.03em;filter:drop-shadow(0 16px 22px #00000080);transition:opacity .7s var(--ease-out), scale 1.1s var(--ease-spring), translate .48s var(--ease-spring);transition-delay:calc(var(--i,0) * 70ms + .24s), calc(var(--i,0) * 70ms + .24s), 0s;border-radius:50%;place-items:center;display:grid;box-shadow:inset -6px -10px 18px #0000004d,inset 4px 5px 10px #ffffff40}.eco__token>span{text-align:center;max-width:92%}.eco__token[data-category=Campaigns]{--t:#a2c52e}.eco__token[data-category=Branding]{--t:#b277ea}.eco__token[data-category=Websites]{--t:#55bece}.eco__token[data-category=Apps]{--t:#ffda35}.eco__app:hover .eco__token,.eco__app:focus-visible .eco__token,.eco__app.is-open .eco__token{transition-delay:0s;translate:0 -4px;scale:1.12}.eco__app:focus-visible{outline:2px solid var(--paper);outline-offset:8px;border-radius:30%}.eco__card{z-index:4;background:var(--glass), #050a069e;-webkit-backdrop-filter:blur(14px)saturate(130%);backdrop-filter:blur(14px)saturate(130%);width:max-content;max-width:min(22rem,78vw);box-shadow:var(--glass-edge), 0 18px 40px #00000059;color:var(--paper);font:500 clamp(16px, 1.1vw, 20px) / 1.4 var(--font-body);text-align:left;translate:var(--cx,-50%) var(--cy,8px);opacity:0;pointer-events:none;transition:opacity .24s var(--ease-out), translate .42s var(--ease-spring);border-radius:18px;padding:16px 20px 18px;position:absolute;bottom:calc(100% + 12px);left:50%}.eco__card>b{font:700 clamp(24px, 1.8vw, 34px) / 1.1 var(--font-body);letter-spacing:-.02em;display:block}.eco__card>span{color:color-mix(in srgb, var(--paper) 72%, transparent);text-wrap:pretty;margin-top:9px;display:block}.eco__app:hover .eco__card,.eco__app:focus-visible .eco__card,.eco__app.is-open .eco__card{opacity:1;--cy:0px}.eco__app[data-side=l] .eco__card{--cx:0px;left:0}.eco__app[data-side=r] .eco__card{--cx:0px;left:auto;right:0}.eco-model{--sun:#ffda35;text-align:center;padding-block:clamp(40px,6vw,120px) clamp(24px,3vw,56px)}.eco-model__kicker{color:var(--sun);font:700 clamp(13px, .85vw, 16px) / 1.2 var(--font-body);letter-spacing:.02em;margin:0 0 clamp(18px,1.6vw,30px)}.eco-model__title{max-width:11em;font:500 clamp(44px, 6.4vw, 132px) / .95 var(--font-body);letter-spacing:-.04em;text-wrap:balance;margin:0 auto}.eco-model__lede{max-width:34em;color:color-mix(in srgb, var(--paper) 78%, transparent);font:400 clamp(17px, 1.3vw, 24px) / 1.45 var(--font-body);text-wrap:balance;margin:clamp(22px,2vw,40px) auto 0}.eco-why{--sun:#ffda35;padding-block:clamp(64px,8vw,160px)}.eco-why__close{max-width:14em;font:400 clamp(30px, 4.4vw, 84px) / 1.2 var(--font-display);text-align:center;text-wrap:balance;margin:0 auto}.eco-why__close b{color:var(--sun);transition:opacity .24s var(--ease-out), translate .24s var(--ease-out);font-weight:400;display:inline-block}.eco-why__close b.is-out{opacity:0;translate:0 .25em}.eco-why__points{grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(28px,3.6vw,72px);margin:clamp(72px,9vw,180px) 0 0;padding:0;list-style:none;display:grid}.eco-why__points li{border-top:1px solid color-mix(in srgb, var(--paper) 22%, transparent);padding-top:clamp(18px,1.6vw,28px)}.eco-why__n{color:var(--sun);font:700 clamp(12px, .8vw, 14px) / 1 var(--font-body);letter-spacing:.04em;display:block}.eco-why__label{font:500 clamp(24px, 2.1vw, 40px) / 1.05 var(--font-body);letter-spacing:-.03em;margin:clamp(14px,1.2vw,22px) 0 .55em}.eco-why__points p{color:color-mix(in srgb, var(--paper) 76%, transparent);font:400 clamp(16px, 1.05vw, 19px) / 1.55 var(--font-body);text-wrap:pretty;margin:0}.eco__mark{animation:eco-mark-in 1s var(--ease-out) both}@keyframes eco-mark-in{0%{opacity:0;scale:.9}}@media (prefers-reduced-motion:reduce){.eco__mark{animation:none}}[data-eco-reveal]:not([data-in]) .eco__app :is(picture,.eco__token){opacity:0;scale:.2}.eco-model__kicker,.eco-model__title,.eco-model__lede,.eco-why__close,.eco-why__points li{transition:opacity .8s var(--ease-out), translate 1s var(--ease-out)}.eco-model__title{transition-delay:.12s}.eco-model__lede{transition-delay:.32s}.eco-why__points li:nth-child(2){transition-delay:.16s}.eco-why__points li:nth-child(3){transition-delay:.32s}[data-eco-reveal]:not([data-in]) :is(.eco-model__kicker,.eco-model__title,.eco-model__lede),[data-eco-reveal]:not([data-in]).eco-why__close,[data-eco-reveal]:not([data-in])>li{opacity:0;translate:0 .6em}@media (max-width:900px){.eco{--eco-ring:1.53;--globe:clamp(250px, 68vw, 620px)}@media (max-width:600px){.eco{--eco-ring:1.3;--globe:60vw;--app:56px}}.eco__stage{height:calc(var(--globe) * 1.3)}.eco-why__points{grid-template-columns:minmax(0,1fr)}}@media (prefers-reduced-motion:reduce){.eco__mark,.eco__app picture,.eco__app img,.eco__token,.eco__card,.eco-why__close b{transition:none}}
