* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
html, body { margin: 0; min-height: 100%; }
body {
  background: var(--bg);
  color: var(--text);
  font-family: "Inter", sans-serif;
  overflow-x: hidden;
  transition: background-color .45s ease, color .45s ease;
}
a { color: inherit; text-decoration: none; }
button, a { -webkit-tap-highlight-color: transparent; }
button { font: inherit; }
::selection { background: rgba(var(--accent-rgb), .24); color: var(--text); }

.page-noise {
  position: fixed; inset: 0; pointer-events: none; z-index: 20; opacity: .025;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E");
}
.cursor-glow {
  position: fixed; width: 260px; height: 260px; border-radius: 50%;
  pointer-events: none; z-index: 19; opacity: 0;
  background: radial-gradient(circle, rgba(var(--accent-rgb), .075), transparent 68%);
  transform: translate(-50%, -50%);
  transition: opacity .3s ease;
}
body.cursor-active .cursor-glow { opacity: 1; }

.container { width: min(var(--max-width), calc(100% - (var(--gutter) * 2))); margin-inline: auto; }
.home-section { position: relative; min-height: 100svh; display: grid; align-items: center; padding: var(--section-pad) 0; border-bottom: 1px solid var(--border); }
.eyebrow {
  margin: 0 0 24px; color: var(--muted); font: 500 .7rem/1 "JetBrains Mono", monospace;
  letter-spacing: .16em; text-transform: uppercase;
}
.reveal { opacity: 0; transform: translateY(22px); transition: opacity .8s var(--ease), transform .8s var(--ease); }
.reveal.is-visible { opacity: 1; transform: translateY(0); }
.delay-1 { transition-delay: .12s; }

.button {
  min-height: 48px; display: inline-flex; align-items: center; justify-content: center; gap: 22px;
  padding: 0 18px; border: 1px solid var(--border-strong); border-radius: 7px;
  background: var(--surface);
  font: 500 .72rem/1 "JetBrains Mono", monospace; text-transform: uppercase; letter-spacing: .06em;
  transition: transform .22s var(--ease), border-color .22s ease, background-color .22s ease, box-shadow .22s ease;
}
.button span, .text-link span { transition: transform .22s var(--ease); }
.button-primary { background: var(--text); color: var(--bg); border-color: var(--text); }
.button-outline { background: var(--surface); color: var(--text); border-color: var(--border-strong); }
.button:hover { transform: translateY(-2px) scale(1.012); border-color: var(--accent); box-shadow: var(--glow); }
.button:hover span, .text-link:hover span { transform: translate(3px,-2px); }
.text-link {
  min-height: 48px; display: inline-flex; align-items: center; justify-content: center; gap: 14px;
  padding: 0 18px; border: 1px solid var(--border-strong); border-radius: 7px;
  background: var(--surface); color: var(--text);
  font: 500 .72rem/1 "JetBrains Mono", monospace; text-transform: uppercase; letter-spacing: .07em;
  transition: transform .22s var(--ease), color .22s ease, background-color .22s ease, border-color .22s ease, box-shadow .22s ease;
}
.text-link:hover { color: var(--text); background: var(--surface-2); border-color: var(--accent); box-shadow: var(--glow); transform: translateY(-2px) scale(1.012); text-shadow: none; }

.interactive { position: relative; }
.interactive::after {
  content: ""; position: absolute; inset: -7px; border-radius: inherit; pointer-events: none;
  opacity: 0; box-shadow: 0 0 24px rgba(var(--accent-rgb), .16); transition: opacity .25s ease;
}
.interactive:hover::after { opacity: 1; }

h1,h2,h3,p { margin-top: 0; }
h1,h2,h3 { letter-spacing: -.055em; }
