/* ============================================================
   DESIGN TOKENS — RTR v2 (Google-style light theme)
   ============================================================ */

:root {
  /* ─── Cores — sistema light ─────────────────────────── */
  --bg:              #ffffff;
  --bg-soft:         #f8f9fa;          /* google soft gray */
  --bg-softer:       #fbfbfb;
  --bg-elevated:     #ffffff;
  --bg-tinted-gold:  #fdfaf2;          /* very subtle warm tint */
  --bg-tinted-navy:  #f4f7fb;          /* very subtle cool tint */

  --text:            #202124;          /* google charcoal */
  --text-muted:      #5f6368;          /* google secondary */
  --text-dim:        #80868b;          /* google tertiary */
  --text-faint:      #bdc1c6;

  --divider:         #e8eaed;          /* google divider */
  --divider-soft:    #f1f3f4;

  --gold:            #b8902a;          /* tonal pra fundo claro */
  --gold-bright:     #d4af37;
  --gold-deep:       #8a6c1f;
  --gold-soft-bg:    rgba(184, 144, 42, 0.08);

  --navy:            #1a3a6e;
  --navy-deep:       #0a1f3a;
  --navy-soft-bg:    rgba(26, 58, 110, 0.06);

  --green:           #1e8e3e;          /* google green (origin) */
  --red:             #d93025;          /* google red */

  /* Sombras — sutis, escala Google ─────────────────────── */
  --shadow-1:  0 1px 2px rgba(60, 64, 67, 0.06), 0 1px 3px rgba(60, 64, 67, 0.04);
  --shadow-2:  0 1px 2px rgba(60, 64, 67, 0.08), 0 2px 6px rgba(60, 64, 67, 0.06);
  --shadow-3:  0 1px 3px rgba(60, 64, 67, 0.10), 0 4px 12px rgba(60, 64, 67, 0.08);
  --shadow-hero: 0 24px 60px rgba(15, 30, 60, 0.12);

  /* ─── Tipografia ─────────────────────────────────────── */
  --font-display:    'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-body:       'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-arabic:     'Cairo', 'Inter', sans-serif;

  /* Escala fluida — propositadamente generosa */
  --fs-eyebrow:      0.8125rem;                                    /* 13px */
  --fs-body-sm:      clamp(0.9375rem, 0.9rem + 0.2vw, 1rem);
  --fs-body:         clamp(1rem, 0.95rem + 0.3vw, 1.125rem);       /* 18px desktop */
  --fs-lead:         clamp(1.125rem, 1.05rem + 0.4vw, 1.375rem);   /* 22px desktop */
  --fs-h3:           clamp(1.375rem, 1.2rem + 0.7vw, 1.75rem);     /* 28px */
  --fs-h2:           clamp(1.75rem, 1.4rem + 1.4vw, 2.625rem);     /* 42px */
  --fs-h1:           clamp(2.25rem, 1.7rem + 2.5vw, 4rem);         /* 64px */
  --fs-display:      clamp(2.75rem, 1.9rem + 4vw, 5.5rem);         /* 88px */

  /* Pesos — sem 900, max 700 */
  --fw-regular:      400;
  --fw-medium:       500;
  --fw-semibold:     600;
  --fw-bold:         700;

  /* Letter-spacing — quase neutro */
  --ls-tight:        -0.025em;
  --ls-normal:       0;
  --ls-wide:         0.05em;
  --ls-eyebrow:      0.12em;

  /* Line-height — generoso */
  --lh-tight:        1.1;
  --lh-snug:         1.25;
  --lh-base:         1.6;
  --lh-loose:        1.75;

  /* ─── Spacing — escala Google generosa ───────────────── */
  --sp-1:            0.25rem;
  --sp-2:            0.5rem;
  --sp-3:            0.75rem;
  --sp-4:            1rem;
  --sp-5:            1.5rem;
  --sp-6:            2rem;
  --sp-7:            3rem;
  --sp-8:            4rem;
  --sp-9:            6rem;
  --sp-10:           8rem;
  --sp-11:           10rem;
  --sp-12:           12rem;     /* sections muito grandes */

  /* Layout */
  --container:        1200px;
  --container-narrow: 880px;
  --container-text:   720px;
  --gutter:           clamp(1.25rem, 3vw, 2.5rem);

  /* Nav */
  --nav-h:            72px;
  --nav-h-mobile:     60px;

  /* Radius — Google usa pill + medium rounded */
  --r-sm:             8px;
  --r:                12px;
  --r-lg:             24px;
  --r-pill:           999px;

  /* Transições */
  --t-fast:           120ms cubic-bezier(0.4, 0, 0.2, 1);
  --t:                240ms cubic-bezier(0.4, 0, 0.2, 1);
  --t-slow:           400ms cubic-bezier(0.4, 0, 0.2, 1);

  /* Z-index */
  --z-nav:            50;
  --z-drawer:         60;
  --z-modal:          100;
}
