/* ═══════════════════════════════════════════════════════════════════════
   CAMADA DE MARCA — Marcela Forte · Psicóloga (Jundiaí/SP)

   Preset: TERRACOTA (derivado da identidade visual da cliente:
   creme rosado, terracota como única cor de marca, metal dourado-quente)
   ═══════════════════════════════════════════════════════════════════════ */

:root {
  /* ── Fundos: três degraus de luz quente, nunca branco puro ──────────── */
  --fundo:        #FBF5F0;
  --fundo-2:      #F4E8DE;
  --papel:        #FFFCF8;

  /* ── Marca: um único matiz, em seis intensidades ────────────────────── */
  --marca-950:    #48200F;
  --marca-900:    #5E2C18;
  --marca-700:    #8C452C;
  --marca-500:    #B0603F;
  --marca-200:    #EBBFA9;
  --marca-050:    #FAEBE1;

  /* ── Metal: fio de destaque, sempre em dose homeopática ─────────────── */
  --metal:        #C09265;
  --metal-claro:  #E7CDB2;
  --metal-escuro: #8A6236;   /* 4.6:1 sobre --fundo — não clareie */

  /* ── Tinta ──────────────────────────────────────────────────────────── */
  --tinta:        #1E1712;
  --tinta-suave:  #5A4C43;
  --tinta-fraca:  #A0938A;   /* placeholders */

  /* ── Sobre fundo escuro ─────────────────────────────────────────────── */
  --claro:        #FFFAF6;
  --claro-suave:  #F7E9E0;
  --alerta:       #FFE1CC;

  /* ── Triplas RGB — combinadas com alfa dentro de components.css ─────── */
  --rgb-marca:        140, 69, 44;
  --rgb-marca-escura: 94, 44, 24;
  --rgb-marca-clara:  235, 191, 169;
  --rgb-metal:        192, 146, 101;
  --rgb-metal-claro:  231, 205, 178;
  --rgb-fundo:        251, 245, 240;
  --rgb-papel:        255, 252, 248;
  --rgb-superficie:   252, 247, 243;
  --rgb-claro:        247, 233, 224;

  /* ── Tipografia ─────────────────────────────────────────────────────── */
  --display:  "Playfair Display", "Iowan Old Style", Georgia, serif;
  --texto:    "Lato", "Segoe UI", system-ui, -apple-system, sans-serif;
  --script:   "Sacramento", "Segoe Script", cursive;

  /* ── Layout ─────────────────────────────────────────────────────────── */
  --largura:    1160px;
  --gutter:     clamp(1.25rem, 5vw, 3rem);
  --raio:       20px;
  --nav-altura: 76px;

  /* ── Movimento: curva única de todo o site ──────────────────────────── */
  --mola: cubic-bezier(.22, 1, .36, 1);

  /* ── Sombras: luz de estúdio, difusa e baixa ────────────────────────── */
  --sombra-nav:       0 14px 40px -22px rgba(var(--rgb-marca-escura), .55),
                      0 2px 8px -4px rgba(var(--rgb-marca-escura), .18);
  --sombra-menu:      0 26px 50px -26px rgba(var(--rgb-marca-escura), .6);
  --sombra-botao:     0 12px 26px -16px rgba(var(--rgb-marca-escura), .9);
  --sombra-retrato:   0 42px 70px -46px rgba(var(--rgb-marca-escura), .7);
  --sombra-foto:      0 34px 60px -42px rgba(var(--rgb-marca-escura), .65);
  --sombra-badge:     0 16px 34px -22px rgba(var(--rgb-marca-escura), .6);
  --sombra-cartao:    0 26px 46px -34px rgba(var(--rgb-marca-escura), .6);
  --sombra-flutuante: 0 16px 32px -14px rgba(var(--rgb-marca-escura), .8);

  /* ── Superfícies translúcidas ───────────────────────────────────────── */
  --vidro-nav:   rgba(var(--rgb-superficie), .72);
  --vidro-menu:  rgba(var(--rgb-superficie), .94);
  --campo-fundo: rgba(var(--rgb-papel), .96);

  /* ── Linhas ─────────────────────────────────────────────────────────── */
  --linha:        rgba(var(--rgb-marca), .16);
  --linha-fraca:  rgba(var(--rgb-marca), .14);
  --linha-forte:  rgba(var(--rgb-marca), .30);
  --linha-clara:  rgba(var(--rgb-marca-clara), .25);
  --linha-metal:  rgba(var(--rgb-metal), .50);
}