/* Homepage hero: gold-line logo that draws itself, with a soft light that follows the cursor. Scoped to .hx and html.hx-on. */
.hx{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:clip;--mx:68%;--my:46%;--px:0;--py:0}
.hx-glow{position:absolute;inset:0;background:radial-gradient(420px circle at var(--mx) var(--my),rgba(201,161,75,.15),transparent 70%)}
.hx-stage{position:absolute;right:max(-6vw,-90px);top:50%;width:min(74vh,52vw,720px);aspect-ratio:117/124;transform:translate3d(calc(var(--px) * 22px),calc(-50% + var(--py) * 16px),0);transition:transform .5s var(--ease)}
.hx-base,.hx-lit{position:absolute;inset:0}
.hx-stage svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;color:var(--gold);animation:hxBreathe 9s 3s ease-in-out infinite alternate}
.hx path{fill:currentColor;fill-opacity:0;stroke:currentColor;stroke-width:.55;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1}
.hx-base path{stroke-opacity:.3;animation:hxDraw 2.8s .35s var(--ease) forwards,hxFill 1.6s 2.6s ease forwards}
/* The brighter copy only shows where the light is. */
.hx-lit{-webkit-mask-image:radial-gradient(230px circle at var(--lx,68%) var(--ly,46%),#000,transparent 72%);mask-image:radial-gradient(230px circle at var(--lx,68%) var(--ly,46%),#000,transparent 72%)}
.hx-lit path{stroke-opacity:.95;stroke-width:.8;animation:hxDraw 2.8s .35s var(--ease) forwards;filter:drop-shadow(0 0 3px rgba(224,192,124,.55))}
@keyframes hxDraw{to{stroke-dashoffset:0}}
@keyframes hxFill{to{fill-opacity:.07}}
@keyframes hxBreathe{from{transform:scale(1)}to{transform:scale(1.035)}}
/* The page's own content stays above it; the small hero logo is replaced by the large one. */
html.hx-on .hero>.wrap{position:relative;z-index:1}
html.hx-on .hero-mark .tilt{visibility:hidden}
@media (max-width:900px){
  .hx-stage{right:-18vw;top:46%;width:112vw}
  .hx-base path{stroke-opacity:.22}
  .hx-glow{background:radial-gradient(300px circle at var(--mx) var(--my),rgba(201,161,75,.13),transparent 70%)}
}
@media (prefers-reduced-motion:reduce){
  .hx-stage{transition:none;transform:translate3d(0,-50%,0)}
  .hx-base,.hx-lit{position:absolute;inset:0}
.hx-stage svg{animation:none}
  .hx path{animation:none;stroke-dashoffset:0}
  .hx-base path{fill-opacity:.07}
  .hx-lit,.hx-glow{display:none}
}
