/* Manto Supply — design tokens (v0.1, 2026-10-22)
   Base clara do dossiê + navy/dourado como assinatura.
   Regra: dourado SÓ em CTA e detalhes. Sem gradientes, sem sombras pesadas. */
:root {
  /* Neutros */
  --manto-offwhite: #F6F4EF;
  --manto-paper:    #FFFFFF;
  --manto-sand:     #E9E5DC;
  --manto-stone:    #A7A39A;
  --manto-graphite: #55534E;
  --manto-carbon:   #1C1C1E;
  --manto-black:    #0B0B0C;

  /* Assinatura */
  --manto-navy:      #12213F;
  --manto-navy-soft: #1E3160;
  --manto-gold:      #C9A24A;
  --manto-gold-ink:  #8A6A22; /* dourado legível sobre claro (texto/ícone) */

  /* Feedback */
  --manto-success: #2F6B4F;
  --manto-error:   #A23B32;

  /* Papéis */
  --bg:          var(--manto-offwhite);
  --surface:     var(--manto-paper);
  --text:        var(--manto-carbon);
  --text-muted:  var(--manto-graphite);
  --border:      var(--manto-sand);
  --accent:      var(--manto-navy);
  --cta-bg:      var(--manto-carbon);
  --cta-text:    var(--manto-offwhite);
  --cta-accent:  var(--manto-gold);

  /* Tipografia */
  --font-display: "Outfit", "Inter", system-ui, sans-serif;
  --font-body:    "Inter", system-ui, -apple-system, sans-serif;
  --font-label:   "Bebas Neue", "Outfit", sans-serif; /* só números e etiquetas de coleção */

  --fs-xs:   0.75rem;
  --fs-sm:   0.875rem;
  --fs-base: 1rem;
  --fs-lg:   1.125rem;
  --fs-xl:   clamp(1.375rem, 1.1rem + 1vw, 1.75rem);
  --fs-2xl:  clamp(1.75rem, 1.3rem + 2vw, 2.5rem);
  --fs-hero: clamp(2.5rem, 1.6rem + 4.5vw, 4.75rem);

  --lh-tight: 1.05;
  --lh-snug:  1.25;
  --lh-body:  1.6;
  --tracking-display: -0.02em;
  --tracking-label:   0.08em;

  /* Espaço (escala 4px) */
  --space-1: 4px;  --space-2: 8px;  --space-3: 12px; --space-4: 16px;
  --space-5: 24px; --space-6: 32px; --space-7: 48px; --space-8: 64px;
  --space-9: 96px; --space-10: 128px;
  --gutter: 16px;
  --container: 1240px;

  /* Forma e movimento */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-pill: 999px;
  --shadow-soft: 0 1px 2px rgba(11, 11, 12, 0.06);
  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --dur-fast: 160ms;
  --dur-base: 240ms;
}

@media (min-width: 768px) {
  :root { --gutter: 32px; }
}