/* STREAM International Games — landing page styles
   Global rules + keyframe animations carried over from the design prototype.
   Section/element styling lives inline in index.html (the design is final). */

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; font-family: 'Lexend', -apple-system, BlinkMacSystemFont, sans-serif; }
::placeholder { color: #9AA1AC; }
input, select, textarea, button { font-family: 'Lexend', sans-serif; }
input:focus, select:focus, textarea:focus { outline: none; border-color: #F5B400; }

/* visible focus ring for keyboard users on the custom pill/chip groups */
.opt-btn:focus-visible,
a:focus-visible,
button:focus-visible { outline: 2px solid #F5B400; outline-offset: 2px; }

/* hover behaviours (replaces the prototype's style-hover attribute) */
.hover-scale { transition: transform .2s ease; }
.hover-scale:hover { transform: scale(1.05); }
.hover-scale-soft:hover { transform: scale(1.02); }
a.hover-scale-soft[href="#vision"]:hover { transform: scale(1.05); background: rgba(255,255,255,0.08); }

@keyframes sig-bounce { 0%,100% { transform: translateY(0); opacity: .9; } 50% { transform: translateY(10px); opacity: .4; } }
@keyframes sig-draw   { to { stroke-dashoffset: 0; } }
@keyframes sig-pulse  { 0% { transform: scale(1); opacity: .9; } 70% { transform: scale(2.6); opacity: 0; } 100% { opacity: 0; } }

.sig-bounce { animation: sig-bounce 1.8s ease-in-out infinite; }
.sig-draw-a { animation: sig-draw 2.8s ease forwards .4s; }
.sig-draw-b { animation: sig-draw 3s ease forwards .7s; }

/* founding-community connection lines (pathLength=1 → dasharray/offset of 1) */
.fc-line { stroke-dasharray: 1; stroke-dashoffset: 1; animation: sig-draw 1.6s ease forwards var(--d, .3s); }
.fc-line-slow { animation-duration: 1.8s; }

/* footer collapses to a single column on small screens */
@media (max-width: 640px) {
  .footer-top { grid-template-columns: 1fr !important; }
}

/* respect users who prefer reduced motion: no draw-in, bounce or count-up flourish */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .sig-bounce, .sig-draw-a, .sig-draw-b, .fc-line { animation: none !important; }
  .sig-draw-a, .sig-draw-b, .fc-line { stroke-dashoffset: 0 !important; }
  .hover-scale, .hover-scale-soft { transition: none; }
}
