/*
  Identidade visual — "Biblioteca de Superfícies Arquitetônicas".
  Paleta e tipografia aprovadas (Fase 1-3). Ver DESIGN.md para o racional completo.
  Trocar valores aqui não exige alterar outros arquivos.
*/

:root {
  /* Paleta */
  --color-marfim: #F5F2ED;
  --color-creme: #F0EBE6;
  --color-preto: #0D0D0D;
  --color-grafite: #2D2E30;
  --color-champanhe: #AF8F61;
  --color-areia: #DCC8AE;
  /* Variante mais escura do champanhe — única versão usada como TEXTO sobre
     fundo claro (marfim/creme), para cumprir contraste em títulos e ênfases. */
  --color-champanhe-text: #93744B;

  /* Papéis semânticos */
  --color-bg: var(--color-marfim);
  --color-bg-alt: var(--color-creme);
  --color-heading: var(--color-preto);
  --color-text: var(--color-grafite);
  --color-text-muted: #5C5E62;
  --color-border: rgba(45, 46, 48, 0.16);

  --color-bg-dark: var(--color-preto);
  --color-text-on-dark: var(--color-marfim);
  --color-text-muted-on-dark: var(--color-areia);
  --color-border-on-dark: rgba(245, 242, 237, 0.18);

  --color-whatsapp: #25D366;
  --color-whatsapp-dark: #1DA851;

  /* Tipografia — Manrope conduz o documento; Newsreader é uso restrito (ênfase pontual) */
  --font-heading: "Manrope", "Segoe UI", Arial, sans-serif;
  --font-body: "Manrope", "Segoe UI", Arial, sans-serif;
  --font-accent: "Newsreader", "Georgia", serif;

  --fs-h1: clamp(1.9rem, 4.2vw, 3rem);
  --fs-h2: clamp(1.35rem, 2.8vw, 1.9rem);
  --fs-h3: clamp(1.05rem, 1.9vw, 1.25rem);
  --fs-body: 1rem;
  --fs-small: 0.875rem;

  /* Espaçamento */
  --space-xs: 0.5rem;
  --space-sm: 1rem;
  --space-md: 1.5rem;
  --space-lg: 2.5rem;
  --space-xl: 4rem;
  --space-2xl: 6rem;

  /* Layout */
  --max-width: 1200px;
  --radius: 2px;
  --radius-sm: 2px;

  /* Foco acessível */
  --focus-ring: 3px solid var(--color-champanhe);
  --focus-offset: 2px;

  /* Transições (respeitam prefers-reduced-motion em style.css) */
  --transition-fast: 160ms cubic-bezier(0.23, 1, 0.32, 1);
  --transition-base: 280ms cubic-bezier(0.23, 1, 0.32, 1);

  /* ========================================================================
     DYNEW CAMADA — tokens do novo design system (docs/DYNEW-CAMADA-design-system-v1.md)
     Fase 1: aplicados apenas ao header e ao hero por enquanto. O resto da
     página continua na paleta/tipografia acima até as próximas fases.
     ======================================================================== */
  --dy-carbon: #111315;
  --dy-graphite: #25292d;
  --dy-plaster: #f2efe8;
  --dy-paper: #fcfbf8;
  --dy-wood: #b8793f;
  --dy-copper: #d4a46e;
  --dy-steel: #8d9599;
  --dy-moss: #506047;

  --dy-font-sans: "Manrope", system-ui, sans-serif;
  --dy-font-mono: "IBM Plex Mono", ui-monospace, monospace;

  --dy-space-page-mobile: 20px;
  --dy-space-page-tablet: 32px;
  --dy-space-page-desktop: clamp(56px, 4.86vw, 70px);
  --dy-space-section: clamp(72px, 9vw, 144px);

  --dy-cut-sm: 12px;
  --dy-cut-lg: 20px;

  --dy-motion-instant: 120ms;
  --dy-motion-ui: 240ms;
  --dy-motion-layer: 520ms;
  --dy-motion-reveal: 800ms;
  --dy-motion-scene: 1200ms;

  --dy-ease-pressure: cubic-bezier(0.2, 0.8, 0.2, 1);
  --dy-ease-adhere: cubic-bezier(0.16, 1, 0.3, 1);
  --dy-ease-squeegee: cubic-bezier(0.77, 0, 0.18, 1);

  /* Header/logo (Fase 1) — ver seção 10-B do design system */
  --dy-header-h-desktop: 76px;
  --dy-header-h-mobile: 66px;
}