/* === Brevya Design Tokens === */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700;800;900&display=swap');

:root {
  --background: 40 20% 97%;
  --foreground: 0 0% 8%;
  --card: 40 15% 95%;
  --card-foreground: 0 0% 8%;
  --primary: 56 18% 42%;
  --primary-foreground: 0 0% 100%;
  --secondary: 40 10% 90%;
  --secondary-foreground: 0 0% 15%;
  --muted: 40 10% 92%;
  --muted-foreground: 0 0% 40%;
  --accent: 56 18% 42%;
  --border: 40 10% 85%;
  --input: 40 10% 85%;
  --ring: 56 18% 42%;
  --gold: 56 18% 42%;
  --gold-light: 56 18% 55%;
  --gold-dark: 56 18% 33%;
  --surface: 40 15% 94%;
  --surface-elevated: 40 12% 91%;
  --radius: 0.5rem;
}

.dark {
  --background: 0 0% 0%;
  --foreground: 0 0% 100%;
  --card: 0 0% 5%;
  --card-foreground: 0 0% 100%;
  --primary: 56 18% 51%;
  --primary-foreground: 0 0% 0%;
  --secondary: 0 0% 10%;
  --secondary-foreground: 0 0% 83%;
  --muted: 0 0% 12%;
  --muted-foreground: 0 0% 65%;
  --accent: 56 18% 51%;
  --border: 0 0% 16%;
  --input: 0 0% 16%;
  --ring: 56 18% 51%;
  --gold: 56 18% 51%;
  --gold-light: 56 18% 65%;
  --gold-dark: 56 18% 40%;
  --surface: 0 0% 6%;
  --surface-elevated: 0 0% 9%;
}

* { box-sizing: border-box; margin: 0; padding: 0; border-color: hsl(var(--border)); }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  font-family: 'Montserrat', system-ui, sans-serif;
  background: hsl(var(--background));
  color: hsl(var(--foreground));
  -webkit-font-smoothing: antialiased;
  line-height: 1.5;
  overflow-x: hidden;
}
img, svg { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; cursor: pointer; background: none; border: none; color: inherit; }
input, textarea, select { font: inherit; color: inherit; }
ul { list-style: none; }

.container { max-width: 1400px; margin: 0 auto; padding: 0 1rem; }
@media (min-width: 1024px) { .container { padding: 0 2rem; } }
.max-w-3xl { max-width: 48rem; margin-left: auto; margin-right: auto; }
.max-w-4xl { max-width: 56rem; margin-left: auto; margin-right: auto; }
.max-w-5xl { max-width: 64rem; margin-left: auto; margin-right: auto; }
.max-w-6xl { max-width: 72rem; margin-left: auto; margin-right: auto; }

/* Utilities */
.text-gradient-gold {
  background: linear-gradient(135deg, hsl(56 18% 51%), hsl(56 18% 70%));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}
.border-gold-subtle { border-color: hsl(56 18% 51% / 0.2); }
.bg-surface { background: hsl(var(--surface)); }
.bg-surface-elevated { background: hsl(var(--surface-elevated)); }
.text-muted { color: hsl(var(--muted-foreground)); }
.text-primary { color: hsl(var(--primary)); }
.bg-primary { background: hsl(var(--primary)); }

/* Reveal-on-scroll */
.reveal { opacity: 0; transform: translateY(28px); transition: opacity .7s ease, transform .7s ease; }
.reveal.is-visible { opacity: 1; transform: none; }
.reveal-delay-1 { transition-delay: .1s; }
.reveal-delay-2 { transition-delay: .2s; }
.reveal-delay-3 { transition-delay: .3s; }

/* Focus */
:focus-visible { outline: 2px solid hsl(var(--ring)); outline-offset: 2px; border-radius: 4px; }

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
}