/* ============================================================
   base.css — Tokens, reset, tipografia base
   DESAFIO PRIMAL — Identidade visual preta + amarelo alerta
   Design System: contraste maximo, sem gradientes, sem suavidade
   ============================================================ */

/* @font-face — Neue Plak (fontes locais) */
@font-face{
  font-family: 'Neue Plak Cond';
  src: url('../assets/fonts/Neue Plak Condensed Bold.ttf') format('truetype');
  font-weight: 700;
  font-display: swap;
}
@font-face{
  font-family: 'Neue Plak Cond';
  src: url('../assets/fonts/Neue Plak Condensed ExtraBlack.ttf') format('truetype');
  font-weight: 800;
  font-display: swap;
}
@font-face{
  font-family: 'Neue Plak Text';
  src: url('../assets/fonts/NeuePlakText-Regular.ttf') format('truetype');
  font-weight: 400;
  font-display: swap;
}
@font-face{
  font-family: 'Neue Plak Text';
  src: url('../assets/fonts/Neue Plak Text SemiBold.ttf') format('truetype');
  font-weight: 600;
  font-display: swap;
}

:root{
  /* Paleta — Desafio Primal (DS oficial, 4 cores apenas) */
  --bg-deep: #000000;
  --bg-elev: #0A0A0A;
  --bg-elev-2: #111111;
  --sand: #F5F0EC;
  --warm: #9E9B96;
  --gold: #FDD502;
  --gold-rgb: 253, 213, 2;
  --gold-deep: #D4B402;

  /* SEM gradientes coloridos (DS proibe). Apenas solid gold */
  --grad-gold: #FDD502;

  /* Linhas / bordas — mais cruas, menos transparencia */
  --line: rgba(253,213,2,.15);
  --line-soft: rgba(245,240,236,.06);
  --line-hard: rgba(253,213,2,.35);

  /* Sem sombras douradas (DS: plano, sem sombras coloridas) */
  --shadow-card: none;

  /* Radius — menor, mais bruto */
  --radius-card: 2px;
  --radius-btn: 2px;

  /* Tipo — Neue Plak em tudo */
  --font-display: 'Neue Plak Cond', 'Oswald', 'Arial Narrow', Impact, sans-serif;
  --font-body: 'Neue Plak Text', 'Neue Plak', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;

  /* Easing */
  --ease: cubic-bezier(.16,1,.3,1);

  /* WhatsApp */
  --wa-green: #25D366;

  /* CTA principal — amarelo solido */
  --btn-cta-green: #FDD502;
  --btn-cta-green-rgb: 253, 213, 2;
}

/* Reset */
*, *::before, *::after{
  box-sizing: border-box;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

html, body{
  margin: 0;
  padding: 0;
  background: var(--bg-deep);
}

body{
  font-family: var(--font-body);
  color: var(--sand);
  min-height: 100vh;
  /* Fundo preto puro. Sem radial-gradient. Espaco em preto = principio do DS */
  background: var(--bg-deep);
  line-height: 1.55;
  letter-spacing: 0.3px;
  -webkit-text-size-adjust: 100%;
}

button{
  font-family: inherit;
  cursor: pointer;
  background: transparent;
  border: none;
  color: inherit;
  padding: 0;
}

input, textarea, select{
  font-family: inherit;
  color: inherit;
}

a{
  color: var(--gold);
  text-decoration: none;
}

img{ max-width: 100%; display: block; }

/* Tipografia destaque — amarelo solido, sem shimmer (DS: sem gradientes) */
.foil{
  color: var(--gold);
  font-weight: 800;
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* Focus visivel */
:focus-visible{
  outline: 2px solid var(--gold);
  outline-offset: 2px;
  border-radius: 0;
}

/* Utilitarios */
.gold{ color: var(--gold); }
[hidden]{ display: none !important; }