/* ==========================================================================
   02 · VARIÁVEIS (design tokens)
   Toda cor, fonte, tamanho e espaçamento do site sai daqui.
   Para mudar a identidade visual, altere apenas este arquivo.
   ========================================================================== */

:root {
  /* ---------- Cores da marca ---------- */
  --wine:          #4b1b22;  /* vinho: topo, atendimentos, contato */
  --plum:          #2e2830;  /* ameixa: faixa da citação */
  --cream:         #f2ecdf;  /* creme: "O que aparece", "Escuta" */
  --paper:         #faf7f0;  /* papel: fundo geral */
  --sage:          #aeb989;  /* verde sálvia: botões e destaques */
  --sage-session:  #b5bf91;  /* verde da seção "Na sessão" */
  --green-bright:  #8ccf70;  /* verde vivo: subtítulo do topo */
  --green-ink:     #4f7145;  /* verde escuro: rótulos e textos verdes sobre claro */
  --green-soft:    #527548;  /* verde dos textos grandes em itálico */
  --rose:          #c97f76;  /* rosa: marca "fio" e detalhes */
  --rose-ink:      #a65b52;  /* rosa escurecido: números pequenos legíveis */
  --ink:           #211b1b;  /* texto principal */

  /* Textos sobre fundos escuros */
  --on-dark:        var(--cream);
  --on-dark-soft:   #e0d6cc;
  --on-dark-muted:  #ddd2ca;
  --on-dark-quote:  #f2e9df;
  --on-dark-footer: #c8d0a8;

  /* Textos sobre o verde */
  --on-sage:        #38282a;
  --on-sage-soft:   #3b342d;

  /* Linhas e divisórias */
  --rule:          rgba(75, 27, 34, .22);
  --rule-strong:   rgba(75, 27, 34, .34);
  --rule-light:    rgba(255, 255, 255, .22);
  --rule-light-strong: rgba(255, 255, 255, .28);

  /* ---------- Tipografia ---------- */
  --font-serif: "Cormorant Garamond", "Cormorant", Garamond, "Times New Roman", serif;
  --font-sans:  "DM Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;

  /* Escala fluida: cresce com a largura da tela, sem saltos */
  --fs-hero-name:  clamp(2.6rem, 13vw, 5.6rem);           /* nome no topo (celular/tablet) */
  --fs-hero-line:  clamp(1.5rem, 1rem + 1.9vw, 2.6rem);    /* "Criar espaço para…" */
  --fs-h2:         clamp(2.6rem, 1.4rem + 4.6vw, 5.5rem);  /* título de toda seção */
  --fs-h3:         clamp(1.75rem, 1.35rem + 1.3vw, 2.5rem);/* títulos dos blocos numerados */
  --fs-serif-lg:   clamp(1.4rem, 1.15rem + .8vw, 1.75rem); /* destaques em itálico */
  --fs-quote:      clamp(1.35rem, 1.05rem + 1vw, 2rem);    /* citação de Freud */
  --fs-body:       1rem;
  --fs-body-lg:    clamp(1rem, .95rem + .2vw, 1.08rem);
  --fs-small:      .875rem;
  --fs-label:      .72rem;                                  /* rótulos em caixa alta */

  --lh-tight: .95;
  --lh-title: 1.05;
  --lh-body:  1.7;

  --tracking-label:  .18em;
  --tracking-button: .14em;

  /* ---------- Layout e espaçamento ---------- */
  --shell:      1180px;                         /* largura máxima do conteúdo */
  --gutter:     clamp(20px, 5vw, 40px);         /* margem lateral mínima */
  --section-y:  clamp(84px, 3.5rem + 6vw, 148px); /* respiro vertical das seções */
  --head-gap:   clamp(48px, 2rem + 3vw, 78px);  /* título → conteúdo */
  --col-gap:    clamp(48px, 9vw, 145px);        /* espaço entre colunas */
  --nav-h:      68px;                           /* altura do menu fixo */

  /* ---------- Movimento ---------- */
  --ease: cubic-bezier(.2, .7, .2, 1);
  --t-fast: .2s;
  --t-med:  .35s;

  /* ---------- Camadas ---------- */
  --z-header: 50;
  --z-menu:   45;
  --z-fab:    40;
}

@media (min-width: 1080px) {
  :root {
    --nav-h: 82px;
  }
}