/* ════════════════════════════════════════════════════════════════════
   VARIABLES — design tokens (cores, fontes, espaçamentos, raios, sombras)
   Fonte única do sistema visual. Alterar aqui propaga a todo o site.
   ════════════════════════════════════════════════════════════════════ */
:root {
  /* ── Cores · base institucional ── */
  --navy:           #1A1A2E;   /* fundo escuro principal (hero, bandas) */
  --navy-soft:      #2C3E50;   /* azul-petróleo (títulos, hovers) */
  --ivory:          #FAF9F6;   /* fundo geral da página */
  --white:          #FFFFFF;
  --panel:          #EDF0F3;   /* secções alternadas claras */
  --panel-border:   #E0E3E6;

  /* ── Cores · ouro / champagne (acentos) ── */
  --gold:           #B8935A;
  --gold-dark:      #9A7A48;
  --gold-soft:      #C9A86A;
  --champagne:      #E8D5B0;
  --champagne-bg:   #F5EED8;
  --champagne-fill: #F6F3EC;   /* placeholders de imagem */
  --champagne-line: #ECE6D6;

  /* ── Cores · texto e linhas ── */
  --ink:            #1C1C1C;
  --ink-strong:     #0F0F0F;
  --slate:          #4A5568;
  --muted:          #8B95A1;
  --muted-2:        #A9B0B8;
  --line:           #E5E3DC;
  --line-2:         #C8CDD3;
  --line-3:         #EDF0F3;
  --danger:         #B23A3A;

  /* ── Tipografia ── */
  --serif: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --sans:  'Inter', 'Helvetica Neue', Arial, sans-serif;

  /* ── Métricas ── */
  --container: 1280px;
  --gutter: clamp(20px, 5vw, 48px);   /* margem lateral fluida (responsiva) */
  --radius: 4px;
  --radius-lg: 8px;
  --radius-pill: 2px;

  /* ── Sombras ── */
  --shadow-card: 0 8px 28px rgba(15, 15, 15, 0.07);
  --shadow-lift: 0 12px 36px rgba(15, 15, 15, 0.09);

  /* breakpoints (referência — usados em responsive.css):
       mobile  < 760px
       tablet  760–1039px
       desktop ≥ 1040px                                          */
}