/* Hero, skill orbit and tools marquee */
/* hero */
.hero{position:relative;overflow:hidden;isolation:isolate}
.aurora{position:absolute;inset:-10%;z-index:-1;pointer-events:none}
.aurora i{position:absolute;border-radius:50%;filter:blur(90px);opacity:var(--glow-a);animation:drift 18s ease-in-out infinite alternate}
.aurora i:nth-child(1){width:46vw;height:46vw;max-width:620px;max-height:620px;background:var(--v);left:-6%;top:-8%}
.aurora i:nth-child(2){width:40vw;height:40vw;max-width:560px;max-height:560px;background:var(--c);right:-4%;top:12%;animation-delay:-6s}
.aurora i:nth-child(3){width:30vw;height:30vw;max-width:420px;max-height:420px;background:var(--p);left:38%;bottom:-14%;animation-delay:-11s;opacity:calc(var(--glow-a)*.6)}
.dots{position:absolute;inset:0;z-index:-1;background-image:radial-gradient(color-mix(in srgb,var(--ink) 22%,transparent) 1px,transparent 1.2px);background-size:30px 30px;-webkit-mask-image:radial-gradient(ellipse at 50% 40%,#000 20%,transparent 72%);mask-image:radial-gradient(ellipse at 50% 40%,#000 20%,transparent 72%);opacity:.5}
.hero .wrap{display:grid;grid-template-columns:1.05fr .95fr;gap:30px;align-items:center;padding-block:76px 40px;min-height:min(780px,calc(100svh - 70px))}
.pill{display:inline-flex;align-items:center;gap:10px;background:var(--card);border:1px solid var(--card-b);padding:8px 16px 8px 10px;border-radius:999px;font-size:.9rem;font-weight:600;backdrop-filter:blur(8px);text-decoration:none}
.pill b{background:var(--c);color:#fff;border-radius:999px;padding:3px 10px;font-size:.78rem}
.hero h1{font-size:clamp(2.2rem,5.4vw,4.3rem);margin-top:24px;font-weight:700}
.hero .lead{margin-top:22px;font-size:1.18rem;color:var(--soft);max-width:33rem}
.cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.intro>*{opacity:0;transform:translateY(22px);animation:up .8s cubic-bezier(.2,.8,.2,1) forwards}
.intro>*:nth-child(2){animation-delay:.1s}.intro>*:nth-child(3){animation-delay:.2s}.intro>*:nth-child(4){animation-delay:.3s}

/* orbit */
.scene{perspective:1000px;display:grid;place-items:center}
.orbit{--size:min(480px,88vw);position:relative;width:var(--size);height:var(--size);transform-style:preserve-3d;transition:transform .25s ease-out;transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));opacity:0;animation:fadein 1.1s .25s ease forwards}
.core{position:absolute;inset:0;margin:auto;width:36%;height:36%;border-radius:50%;background:#fff var(--logo) center/118% no-repeat;box-shadow:0 0 0 calc(var(--size)*.02) color-mix(in srgb,var(--v) 16%,transparent),0 20px calc(var(--size)*.14) -10px color-mix(in srgb,var(--v) 55%,transparent);animation:pulse 4s ease-in-out infinite}
.guide{position:absolute;border-radius:50%;border:1px dashed color-mix(in srgb,var(--ink) 20%,transparent);inset:0;margin:auto}
.g1{width:62%;height:62%}.g2{width:84%;height:84%}
.ring{position:absolute;inset:0;animation:spin var(--t) linear infinite}
.r1{--t:42s;--r:calc(var(--size)*.31)}
.r2{--t:64s;--r:calc(var(--size)*.42);animation-direction:reverse}
.chip{position:absolute;top:50%;left:50%;width:0;height:0;transform:rotate(var(--a)) translateX(var(--r))}
.chip span{position:absolute;left:0;top:0;white-space:nowrap;transform:translate(-50%,-50%) rotate(calc(var(--a) * -1));animation:unspin var(--t) linear infinite;background:var(--solid);border:1px solid var(--card-b);border-radius:999px;padding:8px 14px;font:700 .8rem var(--body);box-shadow:0 8px 24px -10px rgba(0,0,0,.5)}
.r2 .chip span{animation-direction:reverse}
.chip span::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--dot,var(--c));margin-right:8px}

/* marquee */
.marquee{overflow:hidden;border-block:1px solid var(--card-b);background:color-mix(in srgb,var(--bg2) 60%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.track{display:flex;gap:14px;width:max-content;padding:18px 0;animation:slide 40s linear infinite}
.marquee:hover .track{animation-play-state:paused}
.track span{background:var(--card);border:1px solid var(--card-b);border-radius:999px;padding:9px 20px;font-weight:700;font-size:.93rem;color:var(--soft)}