/* HERO */
#hero{min-height:100vh;text-align:center}
.hbg{position:absolute;inset:0;background:radial-gradient(ellipse 80% 60% at 50% 40%,rgba(201,168,76,.06) 0%,transparent 60%),radial-gradient(ellipse 60% 50% at 30% 60%,rgba(74,144,217,.04) 0%,transparent 50%),var(--bg)}
.hh{position:absolute;inset:0;z-index:1;display:flex;align-items:center;justify-content:center;overflow:hidden}
.hh svg{width:min(700px,80vw);opacity:0;animation:hhi 2s .8s var(--eo) forwards}
@keyframes hhi{from{opacity:0;transform:scale(.88) translateY(30px);filter:blur(12px)}to{opacity:1;transform:scale(1);filter:blur(0)}}
.hc{position:relative;z-index:2}
.hc .hl{width:100px;margin:0 auto 24px;opacity:0;animation:fu 1.2s .3s var(--eo) forwards}
.hc h1{font-family:var(--fd);font-weight:800;font-size:clamp(50px,11vw,140px);letter-spacing:-4px;line-height:.92;margin-bottom:16px;background:linear-gradient(135deg,var(--tp) 30%,var(--gold) 70%,var(--blue));-webkit-background-clip:text;-webkit-text-fill-color:transparent;opacity:0;animation:fu 1.2s .5s var(--eo) forwards}
.hsub{font-family:var(--fd);font-size:clamp(18px,2.5vw,28px);font-weight:300;letter-spacing:2px;color:var(--ts);margin-bottom:10px;opacity:0;animation:fu 1s .9s var(--eo) forwards}
.htag{font-size:clamp(14px,1.5vw,18px);color:var(--tm);font-weight:300;letter-spacing:1px;opacity:0;animation:fu 1s 1.2s var(--eo) forwards}
.hcta{display:flex;gap:16px;justify-content:center;margin-top:40px;opacity:0;animation:fu 1s 1.5s var(--eo) forwards;flex-wrap:wrap}
.hscr{position:absolute;bottom:40px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:8px;opacity:0;animation:fuscr 1s 2s var(--eo) forwards}
@keyframes fuscr{from{opacity:0;transform:translateX(-50%) translateY(40px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}
.hscr span{font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--tm)}
.scl{width:1.5px;height:44px;background:linear-gradient(180deg,var(--gold),transparent);animation:sp 1.8s ease-in-out infinite;transform-origin:top}
@keyframes sp{0%{opacity:0;transform:scaleY(0)}20%{opacity:1;transform:scaleY(1)}80%{opacity:.5;transform:scaleY(1)}100%{opacity:0;transform:scaleY(1)}}
.hp{position:absolute;inset:0;z-index:1;pointer-events:none}
.pt{position:absolute;border-radius:50%;background:radial-gradient(circle,var(--gold),transparent);animation:pf linear infinite;opacity:.12}
@keyframes pf{0%{transform:translateY(100vh) scale(0);opacity:0}10%{opacity:.12}90%{opacity:.12}100%{transform:translateY(-100px) scale(1);opacity:0}}