/* ETHOS — Design Tokens
   Estética: preto absoluto, tipografia geométrica, acento gradiente (anel do Instagram). */

:root {
  /* Cores */
  --bg: #000000;
  --surface: #0b0b0b;
  --surface-2: #141414;
  --surface-3: #1c1c1c;
  --line: #262626;
  --line-soft: #1a1a1a;

  --text: #ffffff;
  --text-2: #b4b4b4;
  --muted: #7a7a7a;

  /* Acento da marca — vermelho */
  --brand: #e01e2b;
  --brand-claro: #ff4d3d;
  --brand-escuro: #8f0f18;
  --grad: linear-gradient(135deg, #ff4d3d 0%, #e01e2b 52%, #8f0f18 100%);
  --grad-soft: linear-gradient(135deg, rgba(255,77,61,.14), rgba(224,30,43,.14), rgba(143,15,24,.14));

  --success: #24c07a;
  --danger: #ff4d4d;
  --warn: #f2b544;

  /* Tipografia */
  --font-display: 'Poppins', system-ui, sans-serif;
  --font-body: 'Inter', system-ui, -apple-system, sans-serif;

  --fs-xs: .6875rem;   /* 11px */
  --fs-sm: .8125rem;   /* 13px */
  --fs-base: .9375rem; /* 15px */
  --fs-md: 1.0625rem;
  --fs-lg: 1.375rem;
  --fs-xl: 2rem;
  --fs-2xl: clamp(2.2rem, 6vw, 4.5rem);

  /* Espaçamento */
  --sp-1: .25rem;
  --sp-2: .5rem;
  --sp-3: .75rem;
  --sp-4: 1rem;
  --sp-5: 1.5rem;
  --sp-6: 2rem;
  --sp-7: 3rem;
  --sp-8: 4.5rem;
  --sp-9: 7rem;

  /* Layout */
  --wrap: 1320px;
  --wrap-sm: 900px;
  --header-h: 68px;
  --bar-h: 34px;

  --radius: 4px;
  --radius-lg: 10px;
  --radius-pill: 999px;

  --shadow: 0 18px 50px rgba(0, 0, 0, .65);
  --ease: cubic-bezier(.22, .61, .36, 1);
  --t: .28s var(--ease);
}

@media (max-width: 768px) {
  :root { --header-h: 60px; }
}