/* Design Tokens — Aquele Xêro Ateliê */
:root {
  /* Cores — Regra 60-30-10 */
  --color-bg:        #F9F7F2; /* Off-White: 60% — fundo */
  --color-olive:     #6B7045; /* Verde Oliva: 30% — menus, títulos */
  --color-rose:      #C58282; /* Rosa Queimado: 30% — subtítulos, selos */
  --color-terracota: #B65D3B; /* Terracota: 10% — CTAs, footer */
  --color-mustard:   #E3B45F; /* Amarelo Mostarda — detalhes decorativos */

  /* Variantes */
  --color-olive-light:     #8a8f5a;
  --color-olive-dark:      #4e5430;
  --color-terracota-dark:  #8e4a2e;
  --color-rose-light:      #d9a9a9;
  --color-text:            #3A3A3A;
  --color-text-muted:      #7a7a7a;
  --color-border:          rgba(107, 112, 69, 0.2);

  /* Tipografia */
  --font-title:     'Cormorant Garamond', 'Lora', Georgia, serif;
  --font-affective: 'Dancing Script', cursive;
  --font-body:      'Montserrat', 'Open Sans', sans-serif;

  /* Espaçamentos */
  --space-xs:  4px;
  --space-sm:  8px;
  --space-md:  16px;
  --space-lg:  32px;
  --space-xl:  64px;
  --space-2xl: 96px;

  /* Bordas */
  --radius-sm:   4px;
  --radius-md:   8px;
  --radius-lg:   16px;
  --radius-pill: 999px;

  /* Sombras */
  --shadow-sm:   0 1px 4px rgba(107, 112, 69, 0.08);
  --shadow-card: 0 2px 12px rgba(107, 112, 69, 0.10);
  --shadow-lg:   0 8px 32px rgba(107, 112, 69, 0.15);

  /* Transições */
  --transition: all 0.25s ease;
  --transition-fast: all 0.15s ease;

  /* Layout */
  --container-max: 1200px;
  --nav-height: 86px;
}