/* Hallmark · genre: editorial · macrostructure: Photographic · H6 hero foto-dominante, texto centralizado ao pé
 * theme: studied-DNA (source: url https://www.sanmattoni.com.br) · sistema travado em design.md (06/08)
 * display+body: Urbanist (variável, 100–900) — trocado de Abel+Source Code Pro em 17/08 a pedido do cliente
 * paper: oklch(97.5% 0.004 250) · accent: oklch(35% 0.12 262) navy do logo · axes: light / geometric-sans / cool
 * nav: N9 edge-aligned · footer: Ft1 mast-headed · enrichment: fotografia própria + ambientação IA legendada
 * studied: yes · pre-emit critique: P5 H5 E5 S5 R5 V4
 * contrast: medido (ver design.md) · slop: pass · tokens: pass · mobile: pass (320–1920)
 */

@font-face {
  font-family: "Urbanist";
  src: url("assets/fonts/urbanist-variable.woff2") format("woff2");
  font-weight: 100 900; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Urbanist";
  src: url("assets/fonts/urbanist-italic-variable.woff2") format("woff2");
  font-weight: 100 900; font-style: italic; font-display: swap;
}

:root {
  /* superfície — neutro frio tingido; nunca #fff / #000 puros */
  --color-paper:      oklch(97.5% 0.004 250);
  --color-paper-2:    oklch(95% 0.005 250);
  --color-ink:        oklch(21% 0.012 262);
  --color-ink-2:      oklch(38% 0.011 262);
  --color-muted:      oklch(52% 0.009 260);
  --color-rule:       oklch(88% 0.005 250);
  --color-accent:     oklch(35% 0.12 262);

  /* texto sobre foto e sobre faixa escura */
  --color-over-ink:   oklch(98.5% 0.004 250);
  --color-over-ink-2: oklch(93% 0.005 250);
  --color-over-muted: oklch(86% 0.005 250);
  --color-rule-escura: oklch(40% 0.012 262);

  /* véu do hero — calibrado por medição de contraste */
  --color-scrim-0:    oklch(18% 0.012 262 / 0);
  --color-scrim-topo: oklch(18% 0.012 262 / 0.60);
  --color-scrim-meio: oklch(18% 0.012 262 / 0.44);
  --color-scrim-base: oklch(16% 0.012 262 / 0.74);
  --shadow-pill:      0 1px 3px oklch(18% 0.012 262 / 0.28);

  /* tipografia — uma família, hierarquia por peso */
  --font-display: "Urbanist", sans-serif;
  --font-body:    "Urbanist", sans-serif;

  /* tracking óptico: quanto maior o corpo, menor o espaçamento */
  --tr-xl: 0.085em;
  --tr-lg: 0.11em;
  --tr-md: 0.15em;
  --tr-sm: 0.26em;

  /* escala tipográfica */
  --text-d1: clamp(2.1rem, 4.6vw, 4rem);
  --text-d2: clamp(1.7rem, 3.2vw, 2.7rem);
  --text-d3: clamp(1.1rem, 1.5vw, 1.3rem);
  --text-voz:  clamp(13.5px, 1.05vw, 15px);
  --text-func: clamp(13px, 1vw, 14.5px);
  --text-selo: 11px;

  /* espaço — 4pt */
  --space-2xs: 0.375rem;
  --space-xs:  0.625rem;
  --space-sm:  1rem;
  --space-md:  1.5rem;
  --space-lg:  2.25rem;
  --space-xl:  3.5rem;
  --space-2xl: 5.5rem;
  --space-3xl: 8rem;
  --space-4xl: 11rem;
  --page-gutter: clamp(20px, 6vw, 88px);

  /* movimento — um só */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-short: 240ms;
  --dur-longa: 700ms;

  --rule-hair: 1px;
  --radius-pill: 999px;
  --z-base: 1;
  --z-sticky: 200;
}