/* =====================================================================
   TEMA · JF Beauty (Júlia Feltrin · Lashes & Brows)

   ÚNICO lugar onde se definem as CORES e as FONTES do site.
   Fonte da verdade: Identidade Visual.pdf.

   Para trocar uma cor: mude o valor aqui e o site inteiro acompanha.
   Para trocar uma fonte: mude a linha @import (Google Fonts) e o nome
   na variável --font-title ou --font-text logo abaixo.
   Nenhum outro arquivo .css deve conter cor em hexadecimal nem nome de fonte.
   ===================================================================== */

/* ---------- Fontes (Google Fonts) ---------- */
@import url("https://fonts.googleapis.com/css2?family=Cormorant+SC:wght@400;500;600&family=Quicksand:wght@400;500;600;700&display=swap");

:root {
  /* ---------- Cores da marca (identidade visual) ---------- */
  --brown: #8B6123;        /* Dark Brown · textos da marca, botões */
  --beige: #FDF5EE;        /* Light Beige · fundo */
  --gold: #B08540;         /* Medium Brown · fios, ícones, numerais (só detalhe: não passa AA em texto pequeno) */
  --green: #527249;        /* Dark Green · secundária, botão de WhatsApp, foco */
  --ink: #101010;          /* Dark Gray · texto corrido */

  /* ---------- Cores derivadas ---------- */
  --white: #FFFFFF;
  --brown-deep: #6E4C1A;   /* hover do marrom */
  --green-deep: #40593A;   /* hover do verde */
  --paper: #FFFBF7;        /* superfícies sobre o bege */
  --line: #E6D3BC;         /* fios e bordas suaves */
  --line-strong: #CDB08A;  /* bordas de campos */
  --muted: #5B5147;        /* texto secundário (AA sobre o bege) */
  --header-bg: rgba(253, 245, 238, 0.94);   /* bege translúcido do cabeçalho */
  --header-bg-light: rgba(253, 245, 238, 0.78);  /* barra das páginas internas: bege com leve transparência */

  /* ---------- Hero e chamada final (sobre o mármore rosa) ---------- */
  --rose-deep: #5C242C;                       /* rosa escuro que dá contraste ao texto branco */
  --rose-veil-strong: rgba(92, 36, 44, 0.72); /* véu sobre o mármore, lado do texto */
  --rose-veil-soft: rgba(92, 36, 44, 0.18);   /* véu sobre o mármore, lado da foto */
  --on-rose: #FFFFFF;                         /* texto sobre o mármore */
  --on-rose-line: rgba(255, 255, 255, 0.55);  /* fios e bordas sobre o mármore */

  /* ---------- Cores de estado ---------- */
  --alert: #9A2F22;        /* erros e pontos de atenção */
  --alert-bg: #FBE9E4;
  --alert-line: #F1CFC7;
  --ok-bg: #E9F0E6;

  /* ---------- Fontes ---------- */
  --font-title: "Cormorant SC", "Cormorant Garamond", "Cormorant", Georgia, "Times New Roman", serif;
  --font-text: "Quicksand", "Segoe UI", system-ui, -apple-system, Roboto, Arial, sans-serif;

  /* ---------- Medidas ---------- */
  --wrap: 68rem;           /* largura máxima do conteúdo */
  --radius: 14px;          /* cantos de cartões */
  --shadow-float: 0 12px 28px -12px rgba(16, 16, 16, 0.55);
}