/* ==========================================================
   RESPIRO — Design tokens
   Tudo o que é cor, tipografia, espaçamento e breakpoint vive aqui.
   ========================================================== */

:root {
  /* Paleta */
  --creme: #F7F3F0;          /* fundo principal */
  --creme-quente: #F2EBE6;   /* fundo alternativo, ligeiramente mais denso */
  --creme-profundo: #EBE1DB; /* secções "cheias" do início */
  --rosa-nevoa: #D8BFC4;
  --dusty-rose: #B9878F;     /* identidade + CTA */
  --dusty-rose-escuro: #A5747C;
  --mauve: #8E666C;
  --cinza-ameixa: #595156;
  --carvao: #343033;
  /* Paleta v3 da marca (26 set 2026): tons escuros para destaques e contraste */
  --borgonha-ameixa: #723F4C;
  --borgonha-profundo: #5A2635;

  /* Papéis das cores (v3): CTA em mauve; rosa queimado só em detalhes, nunca texto pequeno */
  --cta: var(--mauve);
  --cta-hover: var(--borgonha-ameixa);
  --destaque: var(--mauve);
  --destaque-forte: var(--borgonha-ameixa);

  /* Texto */
  --texto: var(--carvao);
  --texto-suave: var(--cinza-ameixa);
  --texto-claro: var(--creme);
  --cta-texto: #FBF8F6;

  /* Linhas finas */
  --linha: rgba(89, 81, 86, 0.18);
  --linha-forte: rgba(89, 81, 86, 0.32);

  /* Tipografia */
  --font-serif: "Cormorant Garamond", "Cardo", Georgia, serif;
  --font-sans: "DM Sans", "Montserrat", system-ui, -apple-system, sans-serif;

  --fs-eyebrow: 0.75rem;
  --fs-small: 0.875rem;
  --fs-body: 1.0625rem;
  --fs-lead: clamp(1.125rem, 1rem + 0.45vw, 1.3125rem);
  --fs-h3: clamp(1.5rem, 1.2rem + 1vw, 2rem);
  --fs-h2: clamp(2rem, 1.4rem + 2.4vw, 3.5rem);
  --fs-h1: clamp(3.4rem, 1.6rem + 7vw, 7.5rem);
  --fs-display: clamp(2.6rem, 1.2rem + 5.6vw, 6.5rem);

  --lh-tight: 1.05;
  --lh-title: 1.15;
  --lh-body: 1.65;

  --tracking-eyebrow: 0.28em;
  --tracking-cta: 0.2em;

  /* Espaçamento */
  --space-2xs: 0.5rem;
  --space-xs: 0.75rem;
  --space-s: 1rem;
  --space-m: 1.5rem;
  --space-l: 2.5rem;
  --space-xl: 4rem;
  --space-2xl: clamp(5rem, 3rem + 7vw, 9rem);
  --space-3xl: clamp(7rem, 4rem + 10vw, 13rem);

  --gutter: clamp(1.25rem, 0.6rem + 3vw, 4rem);
  --max-width: 1240px;
  --max-text: 38rem;

  /* Forma */
  --radius-pill: 999px;
  --radius-s: 4px;

  /* Movimento — lento e orgânico, como uma respiração */
  --ease-breath: cubic-bezier(0.37, 0, 0.18, 1);
  --dur-fade: 1.4s;
  --dur-hover: 0.45s;
}

/* Breakpoints (referência — usados nas media queries):
   --bp-tablet: 760px
   --bp-desktop: 1080px */