/* ===== RESET & BASE ===== */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { min-height: 100vh; }
img, svg { display: block; max-width: 100%; }
button { cursor: pointer; font-family: inherit; }
a { text-decoration: none; }
ul { list-style: none; }

/* ===== CUSTOM SCROLLBAR ===== */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: #1A1A22; }
::-webkit-scrollbar-thumb { background: #FF4F28; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #E83E1A; }

/* ===== SELECTION ===== */
::selection { background: #FF4F28; color: #fff; }

/* ===== MOBILE MENU ANIMATION ===== */
.menu-line { transition: transform 0.3s ease, opacity 0.3s ease, width 0.3s ease; }
#mobile-menu.open .menu-line:nth-child(1) { transform: rotate(45deg) translate(5px, 5px); }
#mobile-menu.open .menu-line:nth-child(2) { opacity: 0; }
#mobile-menu.open .menu-line:nth-child(3) { transform: rotate(-45deg) translate(5px, -5px); width: 1.5rem; }

/* ===== NAVBAR SCROLL STATE ===== */
#navbar.scrolled {
  background: rgba(15, 15, 20, 0.95);
  box-shadow: 0 4px 30px rgba(0,0,0,0.3);
}

/* ===== HERO PARALLAX SUBTLE ===== */
#hero { scroll-snap-align: start; }

/* ===== CARD HOVER LIFT ===== */
.group:hover { transform: translateY(-2px); }
.group { transition: transform 0.3s ease; }

/* ===== FOCUS VISIBLE ===== */
:focus-visible { outline: 2px solid #FF4F28; outline-offset: 2px; border-radius: 4px; }

/* ===== REDUCED MOTION ===== */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .reveal { opacity: 1; transform: none; transition: none; }
  .group:hover { transform: none; }
  img { transition: none; }
}