/* Gochi Hand — place font files in assets/fonts/ */
@font-face {
  font-family: 'Gochi Hand';
  src: url('../assets/fonts/GochiHand-Regular.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

/* ─── RESET & BASE ─────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
:root {
  --yellow: #D4F53C;
  --blue:   #0047FF;
  --black:  #0A0A0A;
  --white:  #FFFFFF;
  --font:   'Montserrat', 'Helvetica Neue', Arial, sans-serif;
  --font-hw: 'Gochi Hand', cursive;
}
html { scroll-behavior: auto; }
body {
  font-family: var(--font);
  background: #FAFAFA;
  color: var(--black);
  overflow-x: hidden;
  position: relative;
}
img { max-width: 100%; display: block; }

/* ─── SCROLLBAR ────────────────────────────────────────────── */
::-webkit-scrollbar { width: 4px; }
::-webkit-scrollbar-track { background: var(--black); }
::-webkit-scrollbar-thumb { background: var(--yellow); border-radius: 2px; }

/* ─── SECTION WRAPPER ──────────────────────────────────────── */
section { position: relative; }

/* ─── UTILITY ───────────────────────────────────────────────── */
.section-eyebrow {
  font-size: .75rem; font-weight: 800; letter-spacing: .2em;
  text-transform: uppercase; color: #888; margin-bottom: 24px;
}

/* ─── FADE IN ON SCROLL ──────────────────────────────────── */
.fade-in {
  opacity: 0; transform: translateY(24px);
  transition: opacity .6s ease, transform .6s ease;
}
.fade-in.visible { opacity: 1; transform: none; }