/* Sloty signup flow */
.su{padding:clamp(108px,12vw,140px) var(--gutter) 80px}
.su-wrap{max-width:760px;margin-inline:auto}
.su-head h1{font-size:clamp(2rem,4.6vw,3rem)}
.su-head .lead{margin-top:12px}
.stepper{list-style:none;padding:0;margin:30px 0 22px;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;counter-reset:s}
.stepper li{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:16px;background:var(--surface);box-shadow:inset 0 0 0 1px var(--line);font-weight:600;font-size:15px;color:var(--muted)}
.stepper li span{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--surface-high);color:var(--ink-soft);font-weight:800;font-size:14px;flex:0 0 auto}
.stepper li.on{color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink)}
.stepper li.on span{background:var(--ink);color:#fff}
.stepper li.done span{background:var(--success);color:#fff}
.su-step{background:var(--surface);border-radius:28px;padding:clamp(22px,4vw,36px);box-shadow:0 0 0 1px var(--line),var(--shadow)}
.su-step h2{font-size:clamp(1.4rem,3vw,1.8rem)}
.su-note{color:var(--ink-soft);margin-top:6px}
.su-plans{display:grid;gap:10px;margin-top:20px}
.su-plan{position:relative;cursor:pointer}
.su-plan input{position:absolute;opacity:0;inset:0}
.sp-in{display:grid;grid-template-columns:1fr auto;grid-template-areas:"badge badge" "name price" "who price";gap:2px 16px;align-items:center;padding:16px 18px;border-radius:18px;box-shadow:inset 0 0 0 1.5px var(--outline-variant);transition:box-shadow .2s,background-color .2s}
.sp-badge{grid-area:badge;justify-self:start;background:var(--brand);color:#fff;font-size:12.5px;font-weight:700;padding:3px 10px;border-radius:99px;margin-bottom:6px}
.sp-name{grid-area:name;font-size:18px}
.sp-who{grid-area:who;color:var(--ink-soft);font-size:14.5px}
.sp-price{grid-area:price;text-align:end;color:var(--muted);font-size:14px;white-space:nowrap}
.sp-price b{color:var(--ink);font-size:24px;font-weight:800}
.sp-price s{display:none;margin-inline-end:4px}
.su.disc .sp-price s{display:inline}
.su-plan input:checked+.sp-in{box-shadow:inset 0 0 0 2px var(--brand);background:var(--brand-soft)}
.su-plan input:focus-visible+.sp-in{outline:3px solid var(--brand);outline-offset:3px}
.su-offers{display:grid;gap:10px;margin-top:16px}
.su-offer{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:14px;background:var(--brand-soft);color:var(--ink);font-size:15px}
.su-offer svg{color:var(--brand-dark);flex:0 0 auto;margin-top:2px}
.su-mil{margin:0;padding:12px 14px;border-radius:14px;background:#EEF0E4;box-shadow:inset 0 0 0 1px #D3D7BF;color:#2B3424}
.su-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:space-between;margin-top:24px}
.su-actions .btn-primary{margin-inline-start:auto}
.su-fs{border:0;padding:0;margin-inline:0}
.su-fs legend{font-weight:600;font-size:15px;padding:0}
.opt{color:var(--muted);font-weight:500;font-size:13.5px}
.su-terms{display:flex;gap:10px;align-items:flex-start;margin-top:18px;font-size:15px;color:var(--ink-soft);cursor:pointer}
.su-terms input{width:20px;height:20px;margin:1px 0 0;accent-color:var(--brand);flex:0 0 auto}
.su-terms.bad{color:#BA1A1A}
.su-summary{display:grid;gap:8px;margin-top:18px}
.su-summary div{display:flex;justify-content:space-between;gap:16px;padding:12px 14px;border-radius:14px;background:var(--canvas);font-size:15.5px}
.su-summary span{color:var(--muted)}
.su-summary .total{background:var(--ink);color:#fff}
.su-summary .total span{color:rgba(255,255,255,.75)}
.su-summary .total b{font-size:20px}
.su-pay-todo{margin-top:14px;padding:12px 14px;border-radius:14px;background:var(--warning-soft);color:#6b3f0a;font-size:15px}
@media(max-width:560px){.stepper li{font-size:13px;padding:8px;gap:6px}.stepper li span{width:24px;height:24px}.sp-in{grid-template-columns:1fr;grid-template-areas:"badge" "name" "who" "price"}.sp-price{text-align:start;margin-top:6px}}
.su-payframe{margin-top:18px;border-radius:18px;overflow:hidden;box-shadow:0 0 0 1px var(--line)}
.su-payframe iframe{display:block;width:100%;height:640px;border:0;background:#fff}
.su-secure{display:flex;gap:8px;align-items:center;margin-top:14px;font-size:14px;color:var(--muted)}
.su-secure svg{color:var(--success);flex:0 0 auto}
.su-done{text-align:center}
.su-done .pill-ico{margin:0 auto 14px;width:64px;height:34px;border-radius:17px}
.su-done .pill-ico svg{width:20px;height:20px}
.su-done .su-summary div{text-align:start}
.su-done .su-actions{justify-content:center}
.su-done .su-actions .btn-primary{margin-inline-start:0}