/* Herte Laef! – hertanimatie: het hert loopt boven de letters; daarna zakt het vuurhart naar zijn plek boven Herte|Laef */
.hero{isolation:isolate}
.stag-shade,.stag-animation{position:absolute;left:0;top:0;width:900px;height:506px;pointer-events:none}
/* zachte donkere spot onder de animatie, zodat het zilveren hert en het vuur contrast houden */
.stag-shade{z-index:1;background:radial-gradient(ellipse 34% 52% at var(--hx,51%) 52%,#000d 0%,#000a 45%,#0000 100%),
  radial-gradient(circle at var(--hx,51%) var(--hy,24%),#000b 0%,#0000 22%);opacity:0;animation:stagShadeIn 1.2s .2s ease forwards}
.stag-animation{z-index:2;mix-blend-mode:screen}
/* na het weglopen zakt het hart naar de originele plek (transform berekend in hert-animatie.js) */
.stag-animation,.stag-shade{transform-origin:var(--hx,51%) var(--hy,24%);transition:transform 2.4s cubic-bezier(.45,0,.25,1),opacity 1.2s ease}
.stag-animation.is-sunk{transform:var(--sink)}
.stag-shade.is-sunk{transform:var(--sink);opacity:.55!important}
.stag-animation video,.stag-animation .stag-poster{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:contain}
.stag-loop,.stag-poster{opacity:0}
.stag-animation.is-looping .stag-loop{opacity:1}
.stag-animation.is-looping .stag-main{visibility:hidden}
.stag-animation.is-static .stag-main,.stag-animation.is-static .stag-loop{visibility:hidden}
.stag-animation.is-static .stag-poster{opacity:1;transform-origin:var(--hx,51%) var(--hy,24%);animation:stagBeat 1s ease-in-out infinite}
@keyframes stagBeat{0%,100%{transform:scale(1)}8%{transform:scale(1.045)}18%{transform:scale(1)}28%{transform:scale(1.025)}40%{transform:scale(1)}}
@keyframes stagShadeIn{to{opacity:1}}
.hero-layout{position:relative;z-index:3}
/* het oude statische vuurhart-plaatje blijft alleen als (onzichtbaar) ankerpunt voor de uitlijning */
.hero-antlers.hero-fire{opacity:0!important;visibility:hidden!important;animation:none!important}
@media(prefers-reduced-motion:reduce){.stag-animation.is-static .stag-poster{animation:none}.stag-shade{animation:none;opacity:1}}
/* ruimte boven de titel zodat het hert er boven de letters kan lopen */
@media(max-width:750px){.stag-shade{filter:opacity(.7)}.hero .hero-title{margin-top:clamp(150px,44vw,210px)!important}}