/* ============================================================
   BASE — reset, typography, utility classes, motion primitives
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Source+Serif+4:ital,opsz,wght@0,8..60,400;0,8..60,500;0,8..60,600;1,8..60,400;1,8..60,500&family=Outfit:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap');

*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; }
body{
  background:var(--black); color:var(--white); font-family:var(--font-body);
  font-weight:300; line-height:1.7; -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
::selection{ background:var(--gold); color:var(--black); }
img{ max-width:100%; display:block; }
a{ color:var(--gold); text-decoration:none; transition:color var(--dur-fast) var(--ease-out); }
a:hover{ color:var(--gold-light); }
ul{ list-style:none; }
button{ font-family:inherit; }

h1,h2,h3,h4,h5{ font-family:var(--font-display); line-height:1.15; letter-spacing:-0.01em; color:var(--white); font-weight:500; }
h1{ font-size:clamp(2rem,4.6vw,3.9rem); font-weight:400; }
h2{ font-size:clamp(1.7rem,3.2vw,2.7rem); }
h3{ font-size:1.35rem; }
h4{ font-size:1.1rem; font-weight:600; font-family:var(--font-body); }
p{ font-size:1rem; color:var(--gray-light); font-weight:300; }

/* --- utility --- */
.gold-line{ width:52px; height:2px; background:linear-gradient(90deg,var(--gold),transparent); margin-bottom:var(--space-lg); }
.gold-line--center{ margin-left:auto; margin-right:auto; background:linear-gradient(90deg,transparent,var(--gold),transparent); }

.overline{ font-family:var(--font-mono); font-size:0.72rem; font-weight:500; letter-spacing:0.2em; text-transform:uppercase; color:var(--teal-light); display:block; margin-bottom:0.75rem; }
.label{ display:inline-block; font-size:0.7rem; font-weight:600; letter-spacing:0.15em; text-transform:uppercase; color:var(--teal-light); margin-bottom:var(--space-sm); }

.tag{ display:inline-block; font-family:var(--font-mono); font-size:0.68rem; font-weight:500; letter-spacing:0.05em; padding:5px 12px; border-radius:20px; border:1px solid; }
.tag--gold{ color:var(--gold); border-color:var(--gold-dim); background:rgba(197,151,58,0.06); }
.tag--teal{ color:var(--teal-light); border-color:var(--teal-dark); background:rgba(26,148,133,0.06); }

/* --- reveal-on-scroll (subtle, no bounce) --- */
.reveal{ opacity:0; transform:translateY(16px); transition:opacity 0.6s var(--ease-out), transform 0.6s var(--ease-out); }
.reveal.visible{ opacity:1; transform:translateY(0); }
.reveal-delay-1{ transition-delay:0.08s; }
.reveal-delay-2{ transition-delay:0.16s; }
.reveal-delay-3{ transition-delay:0.24s; }

@keyframes needlePulse{ 0%,100%{ opacity:0.9; } 50%{ opacity:1; filter:brightness(1.15); } }

@media (prefers-reduced-motion: reduce){
  *{ transition:none !important; animation:none !important; scroll-behavior:auto !important; }
}