/* Enhancements: animations, micro-interactions, accessibility */

/* Page fade-in */
html.enhanced body{opacity:0;transition:opacity .5s ease}
html.enhanced.ready body{opacity:1}

/* Nav underline animation */
.navlinks a{position:relative}
.navlinks a::after{content:"";position:absolute;left:6px;right:6px;bottom:4px;height:2px;background:linear-gradient(90deg,var(--brand),#ff7a7a);transform:scaleX(0);transform-origin:left;transition:transform .25s ease}
.navlinks a:hover::after,.navlinks a.active::after{transform:scaleX(1)}

/* Hero animated glow */
.hero{background:radial-gradient(ellipse at top, rgba(229,9,20,.12), transparent 60%)}
.hero::before{content:"";position:absolute;inset:-10% -10% auto -10%;height:60%;
  background:radial-gradient(600px 200px at 20% 10%, rgba(229,9,20,.18), transparent 70%),
             radial-gradient(400px 120px at 80% 20%, rgba(255,255,255,.05), transparent 70%);
  pointer-events:none;filter:blur(18px);opacity:.8;animation:heroGlow 12s ease-in-out infinite alternate}
@keyframes heroGlow{from{transform:translateY(0)}to{transform:translateY(14px)}}

/* Buttons micro-interactions */
.btn:hover{box-shadow:0 6px 22px rgba(229,9,20,.25)}
.btn.primary{box-shadow:0 6px 18px rgba(229,9,20,.2)}
.btn.primary:hover{transform:translateY(-2px)}

/* Scroll-reveal utilities (scoped to .enhanced for safe no-JS fallback) */
html.enhanced .reveal{opacity:0;transform:translateY(14px);transition:opacity .6s ease, transform .6s ease;will-change:transform,opacity}
html.enhanced .reveal.in{opacity:1;transform:none}
html.enhanced .reveal-up{transform:translateY(18px)}
html.enhanced .reveal-left{transform:translateX(-18px)}
html.enhanced .reveal-right{transform:translateX(18px)}
html.enhanced .reveal.in.reveal-left,html.enhanced .reveal.in.reveal-right,html.enhanced .reveal.in.reveal-up{transform:none}
html.enhanced .reveal-stagger > *{--i:0}
html.enhanced .reveal-stagger.in > *{transition-delay:calc(var(--i) * 80ms)}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  html.enhanced body{transition:none}
  .hero::before{animation:none}
  .card,.btn,.navlinks a::after,.reveal{transition:none}
}
