/* ═══════════════════════════════════════════════════════════════════
 * Dr. Leonardo Eloy — Design Tokens v5.1 "A Sala Iluminada"
 * Sálvia Calmo + Âmbar Firme + Creme Quente · Lora + Source Sans 3
 * Aprovado 2026-04-11 · Status: PRODUCTION
 * ═══════════════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400;0,500;0,600;1,400;1,500&family=Source+Sans+3:wght@300;400;500;600;700&display=swap');

:root {
  /* ── Paleta v5.1 ───────────────────────────────────────────────── */
  --primary:        #7B9380;   /* Sálvia Calmo       */
  --primary-deep:   #4F6B58;   /* Sálvia Profunda    */
  --primary-soft:   #A7B8A5;   /* Sálvia clara p/ hover */
  --primary-darker: #2F4438;   /* Sálvia escurecida p/ superfícies escuras */

  --warm:           #A06C28;   /* Âmbar Firme        */
  --warm-light:     #BA8840;   /* Âmbar Médio        */
  --warm-soft:      #D4A968;   /* Âmbar claro p/ hover/acento */

  --surface:        #E8DCC4;   /* Areia Lavada       */
  --cream:          #F4EEE0;   /* Creme Quente       */
  --cream-soft:     #F9F4E6;   /* Creme mais claro p/ cards */

  --ink:            #3A3833;   /* Grafite Calmo      */
  --ink-soft:       #6B665C;   /* Grafite Suave      */
  --ink-mute:       #8C8679;   /* Texto muted        */

  --line:           #D6CBB0;   /* Dune — borders/dividers */
  --line-soft:      #E4DCC4;   /* Borda suave        */

  /* Sálvia escala (p/ fundos escuros e sutilezas) */
  --sage-100: #EFF3EE;
  --sage-200: #D8E0D6;
  --sage-300: #B6C4B3;
  --sage-400: #94A891;
  --sage-500: #7B9380;
  --sage-600: #5E7963;
  --sage-700: #4F6B58;
  --sage-800: #38493D;
  --sage-900: #25322A;

  /* Âmbar escala */
  --amber-100: #F4E8D2;
  --amber-200: #E5CA9A;
  --amber-300: #D4A968;
  --amber-500: #BA8840;
  --amber-600: #A06C28;
  --amber-700: #7F561F;
  --amber-800: #5F4117;

  /* ── Semantic aliases (mantêm classes legadas funcionando) ── */
  --color-bg:            var(--cream);
  --color-bg-section:    var(--surface);
  --color-white:         #FFFFFF;                 /* usado apenas para cards sobre creme */
  --color-text-primary:  var(--ink);
  --color-text-secondary:var(--ink-soft);
  --color-text-muted:    var(--ink-mute);
  --color-border:        var(--line);

  /* ── Tipografia ────────────────────────────────────────────────── */
  --font-display: 'Lora', Georgia, 'Times New Roman', serif;
  --font-heading: 'Lora', Georgia, 'Times New Roman', serif;  /* alias legado */
  --font-body:    'Source Sans 3', 'Helvetica Neue', system-ui, sans-serif;

  --text-xs:   0.75rem;   /* 12 */
  --text-sm:   0.875rem;  /* 14 */
  --text-base: 1rem;      /* 16 */
  --text-lg:   1.125rem;  /* 18 */
  --text-xl:   1.25rem;   /* 20 */
  --text-2xl:  1.5rem;    /* 24 */
  --text-3xl:  1.875rem;  /* 30 */
  --text-4xl:  2.25rem;   /* 36 */
  --text-5xl:  3rem;      /* 48 */
  --text-6xl:  4rem;      /* 64 */

  /* Letter-spacing */
  --tracking-tight:   -0.015em;
  --tracking-normal:  0;
  --tracking-wide:    0.04em;
  --tracking-wider:   0.1em;
  --tracking-widest:  0.18em;

  /* ── Spacing ──────────────────────────────────────────────────── */
  --space-1:  0.25rem;
  --space-2:  0.5rem;
  --space-3:  0.75rem;
  --space-4:  1rem;
  --space-6:  1.5rem;
  --space-8:  2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-14: 3.5rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;

  --spacing-xs:      var(--space-2);
  --spacing-sm:      var(--space-4);
  --spacing-md:      var(--space-6);
  --spacing-lg:      var(--space-8);
  --spacing-xl:      var(--space-12);
  --spacing-2xl:     var(--space-20);
  --spacing-section: var(--space-20);   /* 5rem — ar generoso, Sage não grita */

  /* ── Layout ────────────────────────────────────────────────────── */
  --container-max:     1160px;
  --container-padding: 1.5rem;

  /* ── Radii ────────────────────────────────────────────────────── */
  --radius-xs:   4px;
  --radius-sm:   8px;
  --radius-md:   14px;   /* mais orgânico que 12 */
  --radius-lg:   20px;
  --radius-xl:   28px;
  --radius-full: 9999px;

  /* ── Shadows (suaves, nunca dramáticas — Sage calmo) ───────────── */
  --shadow-xs:   0 1px 2px rgba(58, 56, 51, 0.04);
  --shadow-sm:   0 2px 6px rgba(58, 56, 51, 0.05);
  --shadow-card: 0 4px 22px rgba(79, 107, 88, 0.08);
  --shadow-card-hover: 0 14px 40px rgba(79, 107, 88, 0.14);
  --shadow-btn:  0 6px 20px rgba(160, 108, 40, 0.22);
  --shadow-deep: 0 20px 60px rgba(47, 68, 56, 0.18);

  /* ── Motion ────────────────────────────────────────────────────── */
  --ease-out:    cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast:    180ms;
  --dur-base:    280ms;
  --dur-slow:    480ms;

  /* ── WhatsApp (identidade externa) ─────────────────────────────── */
  --whatsapp: #25D366;
}

/* ── Reset mínimo ────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  font-family: var(--font-body);
  font-size: var(--text-base);
  line-height: 1.65;
  color: var(--ink);
  background: var(--cream);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
img, svg { display: block; max-width: 100%; }
a { text-decoration: none; color: inherit; }
button { font: inherit; cursor: pointer; border: none; background: none; color: inherit; }
h1, h2, h3, h4 { font-family: var(--font-display); font-weight: 500; color: var(--ink); }
p { margin: 0; }
ul, ol { list-style: none; }

/* Focus visível (a11y) */
:focus-visible {
  outline: 2px solid var(--warm);
  outline-offset: 3px;
  border-radius: 4px;
}

/* Acessibilidade — respeito a 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;
  }
}