.hero{padding:48px 0 64px;background:linear-gradient(180deg,var(--bg-soft),#fff)}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:40px;align-items:center}
@media (max-width:900px){.hero-grid{grid-template-columns:1fr}}
.hero-copy .lead{font-size:1.08rem;color:var(--muted);max-width:520px}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin:22px 0}
.hero-points{display:flex;flex-wrap:wrap;gap:8px}
.hero-art{background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow);padding:12px}
.hero-art svg{width:100%;height:auto}
.hero-caption{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 6px 2px}
.hero-caption p{margin:0;font-weight:600;color:var(--navy);font-size:.95rem}
.dots{display:flex;gap:8px}
.dots button{width:10px;height:10px;border-radius:50%;border:0;background:var(--line);cursor:pointer;padding:0}
.dots button.on{background:var(--teal);width:26px;border-radius:99px}
.scene{opacity:0;transition:opacity .5s;pointer-events:none}
.scene.active{opacity:1}
.scene *{transform-box:fill-box;transform-origin:center}
.t{font-family:var(--font);font-weight:600}
.s1.active .qmark{animation:blink 1.2s infinite}
.s1.active .sign{animation:pulse 1.6s infinite}
.s2.active .win{animation:pop .6s both}
.s2.active .shield{animation:pop .6s .5s both}
.s2.active .check{animation:fade .4s 1s both}
.s3.active .pin{animation:drop .8s both}
.s3.active .rank{animation:pop .5s .8s both}
.s3.active .star{animation:fade .3s both}
.s3.active .star:nth-of-type(2){animation-delay:1.1s}.s3.active .star:nth-of-type(3){animation-delay:1.3s}.s3.active .star:nth-of-type(4){animation-delay:1.5s}.s3.active .star:nth-of-type(5){animation-delay:1.7s}
.s4.active .person{animation:walk 2.2s both}
.s4.active .bar{transform-origin:bottom;animation:grow 1s both}
.s4.active .b2{animation-delay:.3s}.s4.active .b3{animation-delay:.6s}.s4.active .b4{animation-delay:.9s}
.s4.active .brand-end{animation:fade .6s 1.6s both}
@keyframes blink{50%{opacity:.25}}
@keyframes pulse{50%{transform:scale(1.06)}}
@keyframes pop{0%{transform:scale(.3);opacity:0}100%{transform:scale(1);opacity:1}}
@keyframes fade{0%{opacity:0}100%{opacity:1}}
@keyframes drop{0%{transform:translateY(-90px);opacity:0}70%{transform:translateY(6px);opacity:1}100%{transform:none}}
@keyframes walk{0%{transform:translateX(-140px);opacity:0}25%{opacity:1}100%{transform:none}}
@keyframes grow{0%{transform:scaleY(0)}100%{transform:scaleY(1)}}
@media (prefers-reduced-motion:reduce){.scene *{animation:none!important}}