/* cinematic full-bleed hero */
.sl{height:min(640px,84vh);min-height:480px;background:#05050a}
.sl .s1{display:block}
.sl .bg{position:absolute;inset:-10%;background-size:cover;background-position:center;filter:blur(30px) brightness(.38) saturate(1.3)}
.sl .s1.full .bg{inset:0;filter:brightness(.5) saturate(1.1)}
.sl .ov{position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,5,10,.9) 0%,rgba(5,5,10,.5) 55%,rgba(140,0,0,.28) 100%)}
.sl .tx{position:absolute;left:clamp(24px,5vw,84px);top:50%;transform:translateY(-50%);z-index:2;max-width:680px;padding:0}
.sl .tx small{color:#fff;font-weight:700;letter-spacing:.14em;font-size:14px}
.sl .tx h2{font-family:'Chakra Petch','Jost',sans-serif!important;font-weight:700;text-transform:uppercase!important;font-size:clamp(42px,6.2vw,92px);line-height:.96;letter-spacing:0;margin:20px 0 32px;color:#fff}
.sl .tx p{display:none}
.sl .tx .btn.p{background:#E10600;border-color:#E10600;color:#fff;font-family:'Chakra Petch',sans-serif!important;letter-spacing:.18em;font-weight:700;padding:18px 40px}
.sl .tx .btn.p:hover{background:#fff;color:#111;border-color:#fff}
.sl .im{position:absolute;right:7%;top:50%;transform:translateY(-50%);width:min(38%,440px);z-index:2;background:none;display:block}
.sl .im img{width:100%;aspect-ratio:1;border-radius:50%;object-fit:contain;background:#fff;mix-blend-mode:normal;padding:20px;box-shadow:0 0 0 12px rgba(255,255,255,.06),0 0 110px rgba(225,6,0,.5)}
.sl .s1.full .im{display:none}
.sl .dots,.sl #dd{left:50%;transform:translateX(-50%);bottom:30px;gap:12px}
.sl #dd button{width:64px;height:2px;background:rgba(255,255,255,.4)}
.sl #dd button.on{background:#fff}
@media(max-width:1000px){.sl .im{display:none}.sl .tx{right:24px}}
.sl .tx{max-width:min(640px,54%)}
.sl .tx h2{font-size:clamp(34px,5.4vw,88px)}
.sl .im{width:min(32%,420px);right:5%}
@media(max-width:900px){.sl .im{display:none}.sl .tx{max-width:calc(100% - 48px)}}

/* how to order */
#how{margin-top:20px;margin-bottom:20px}
.hw-h{text-align:center;margin:0 0 22px}.hw-h h2{font-size:clamp(24px,2.8vw,32px);font-weight:700;color:#111}.hw-h p{color:#666;margin-top:4px;font-size:15px}
.hw-h{text-align:center;margin:72px 0 34px}.hw-h h2{font-size:clamp(28px,3.6vw,44px);font-weight:700;color:#111}.hw-h p{color:#666;margin-top:8px}
.hw3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:6px 0 80px;align-items:start}
.hs3{position:relative;background:#F3F3F3;border-radius:32px;padding:26px 26px 30px;transition:transform .3s cubic-bezier(.3,1.6,.5,1),box-shadow .3s}
.hs3:nth-child(2){margin-top:34px}.hs3:nth-child(3){margin-top:68px}
.hs3:hover{transform:translateY(-8px);box-shadow:0 30px 44px -28px rgba(0,0,0,.4)}
.hs3 .gn{position:absolute;left:38px;top:38px;z-index:3;width:38px;height:38px;border-radius:50%;background:#111;color:#fff;font:600 16px 'Jost',sans-serif;display:grid;place-items:center}
.hs3 h3{font-family:'Jost',sans-serif;font-size:24px;font-weight:600;color:#111;text-transform:none;margin:18px 0 6px}
.hs3 p{color:#555;font-size:16px}.hs3 p b{color:#E10600;font-weight:600}
.sc{height:128px;border-radius:22px;background:#fff;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;gap:14px}
.sc1 .mini{width:74px;height:74px;border-radius:18px;background:#F3F3F3;display:grid;place-items:center}
.sc1 .btns{position:relative;width:118px;height:42px}
.sc1 .btns b{position:absolute;inset:0;display:grid;place-items:center;border-radius:999px;font:500 14px 'Jost',sans-serif;color:#fff}
.sc1 .b-a{background:#E10600;animation:bta 3.4s infinite}
.sc1 .b-b{background:#111;opacity:0;animation:btb 3.4s infinite}
@keyframes bta{0%,40%{opacity:1;scale:1}46%{scale:.9}50%,90%{opacity:0;scale:1}100%{opacity:1}}
@keyframes btb{0%,48%{opacity:0;scale:.9}54%,88%{opacity:1;scale:1}96%,100%{opacity:0}}
.sc2 .env{animation:envm 3s ease-in-out infinite}
@keyframes envm{0%{translate:-70px 0;opacity:0}20%{opacity:1}60%{translate:20px -6px;opacity:1}100%{translate:90px -14px;opacity:0}}
.sc2 i{position:absolute;height:3px;border-radius:3px;background:#f3b3af;left:22%;animation:trl 3s ease-in-out infinite}
.sc2 .tr1{top:44%;width:28px}.sc2 .tr2{top:54%;width:42px;animation-delay:.12s}.sc2 .tr3{top:64%;width:20px;animation-delay:.24s}
@keyframes trl{0%{translate:-30px 0;opacity:0}30%{opacity:1}100%{translate:60px 0;opacity:0}}
.doc{position:relative;width:78px;height:96px;background:#F3F3F3;border-radius:12px;padding:16px 12px;display:grid;gap:9px;align-content:start}
.doc i{display:block;height:5px;border-radius:5px;background:#cfcfcf;transform-origin:left;animation:dl 3.2s ease-in-out infinite}
.doc i:nth-child(2){width:75%;animation-delay:.3s}.doc i:nth-child(3){width:55%;animation-delay:.6s}
@keyframes dl{0%{scale:0 1}30%,85%{scale:1 1}100%{scale:0 1}}
.doc u{position:absolute;right:-12px;bottom:-12px;width:36px;height:36px;border-radius:50%;background:#E10600;color:#fff;text-decoration:none;display:grid;place-items:center;font:700 18px 'Jost',sans-serif;border:3px solid #fff;animation:ckp 3.2s ease-in-out infinite}
@keyframes ckp{0%,45%{scale:0}60%{scale:1.2}70%,88%{scale:1}100%{scale:0}}
@media(max-width:900px){.hw3{grid-template-columns:1fr}.hs3:nth-child(n){margin-top:0}}
@media(prefers-reduced-motion:reduce){.col .pb2,.sc *{animation:none!important}.sc1 .b-b{opacity:1}.sc1 .b-a{opacity:0}.sc2 .env{opacity:1}.doc i{scale:1}.doc u{scale:1}}
.hw-h{margin:56px 0 22px}.hw-h h2{font-size:clamp(24px,2.8vw,32px)}.hw-h p{font-size:15px;margin-top:4px}
.hw3{gap:16px;margin:0 0 56px;align-items:stretch}
.hs3,.hs3:nth-child(n){margin-top:0;padding:18px 20px 22px;border-radius:24px;display:flex;flex-direction:column}
.hs3:hover{transform:translateY(-4px)}
.hs3 .gn{left:30px;top:30px;width:30px;height:30px;font-size:14px}
.hs3 h3{font-size:19px;margin:14px 0 4px}.hs3 p{font-size:15px;line-height:1.45;margin:0}
.sc{height:96px;border-radius:16px}
.sc1 .mini{width:56px;height:56px;border-radius:14px}.sc1 .mini svg{width:28px;height:28px}
.sc1 .btns{width:108px;height:38px}
.sc2 .env{width:46px;height:46px}
.doc{width:62px;height:76px;padding:12px 10px;gap:7px}
#how .hw-h h2{font-size:34px;font-weight:600;letter-spacing:inherit;text-transform:none}#how .hw-h{margin-bottom:26px}
