/* BenMac Creative: solid-color hero, no media. The scroll-video hero stays in hero.css for later. */
.hero{position:relative;display:grid;align-items:center;min-height:100vh;min-height:100svh;padding:calc(var(--nav-h) + 6vh) 0 14vh;background:var(--canvas-deep);color:var(--text-on-deep);overflow:hidden;isolation:isolate}
.hero-art{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.hero-art .glow{position:absolute;right:-10%;top:-16%;width:min(70vw,900px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(255,90,42,.18) 0%,rgba(255,90,42,.06) 42%,rgba(255,90,42,0) 66%)}
.hero-art .mark{position:absolute;right:-5vw;bottom:-12vh;width:min(52vw,760px);height:auto;opacity:.07}
.hero-art .mark path{fill:var(--accent)}
.hero-art .route{position:absolute;left:0;bottom:8vh;width:100%;height:30vh}
.hero-art .route path{fill:none;stroke:rgba(246,242,234,.16);stroke-width:2;stroke-dasharray:2 9;stroke-linecap:round}

.hero-inner{display:grid;justify-items:start;max-width:960px}
.hero .kicker{color:var(--accent);margin-bottom:26px}
.hero h1{font-size:clamp(46px,7vw,104px);line-height:.98;letter-spacing:-.03em;max-width:18ch}
.hero .lede{margin-top:26px;max-width:46ch;font-size:clamp(19px,1.7vw,24px);color:var(--text-on-deep-2)}
.hero .actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px 20px;margin-top:38px}
.hero .btn-ghost{color:var(--text-on-deep)}
.hero-cue{position:absolute;left:50%;bottom:26px;transform:translateX(-50%);display:inline-flex;align-items:center;gap:10px;color:var(--text-on-deep-2);text-decoration:none;font:500 11px/1 var(--font-label);letter-spacing:.24em;text-transform:uppercase;transition:color .35s var(--ease-out)}
.hero-cue:hover{color:var(--text-on-deep)}
.hero-cue svg{width:14px;height:14px;animation:cue-bob 2.6s var(--ease-in-out) infinite;animation-delay:-.7s}
@keyframes cue-bob{50%{transform:translateY(5px)}}

@media (max-height:720px){.hero{min-height:auto;padding:calc(var(--nav-h) + 9vh) 0 12vh}.hero-cue{display:none}}
@media (max-width:640px){.hero h1{font-size:clamp(38px,10vw,58px)}.hero .lede{font-size:18px}}