/* Hallmark · genre: atmospheric · macrostructure: split-studio · theme: custom (Grafite & Âmbar) · vibe: motorsport premium, precisão e garantia · paper: oklch(14% 0.01 75) · accent: oklch(77% 0.155 72) · display: Archivo variável (eixo wdth, expandida) · body: Barlow · axes: dark / grotesk-sans / chromatic-amber · enrichment: fotos reais da oficina + logo oficial · nav: N5 · footer: Ft5 · redesign 22/08: passe impeccable (decal skew, brackets de visor, spec-sheet de serviços, ghost numerals) · contrast: pass · slop: pass · honest: pass · chrome: pass · tokens: pass · responsive: pass · mobile: pass */
/* Hallmark · pre-emit critique: P5 H5 E5 S5 R4 V5 */

:root {
  /* ---- cor · grafite quente, elevação por luminosidade ---- */
  --color-paper: #080604;
  --color-paper-2: #110e09;
  --color-paper-3: #1c1711;
  --color-ink: #eeebe5;
  --color-ink-2: #aaa49a;
  --color-ink-3: #898279;
  --color-rule: #2e2923;
  --color-rule-2: #443f38;

  /* acento único · âmbar */
  --color-accent: #f0a226;
  --color-accent-hi: #ffb831;
  --color-accent-ink: #1c0b00;
  --color-focus: #ffb831;

  /* blooms do canvas (atmospheric · 2 no máximo, fixos) */
  --bloom-1: rgba(87,56,15,0.34);
  --bloom-2: rgba(71,44,19,0.22);

  /* faixa clara · o "detalhes claros, meio a meio" do briefing */
  --color-band: #f0ece5;
  --color-band-2: #e1dcd4;
  --color-band-ink: #1c1812;
  --color-band-ink-2: #544f47;
  --color-band-rule: #c3bdb4;
  --color-band-focus: #925200;

  /* ---- tipo · Archivo variável (display) + Barlow (corpo) ---- */
  --font-display: "Archivo", "Barlow", sans-serif;
  --font-body: "Barlow", sans-serif;
  --stretch-display: 118%;
  --stretch-h1: 115%;
  --stretch-wide: 125%;
  --stretch-sub: 108%;

  --text-2xs: 0.75rem;
  --text-xs: 0.8125rem;
  --text-sm: 0.9375rem;
  --text-md: 1.0625rem;
  --text-lg: 1.3125rem;
  --text-xl: clamp(1.5rem, 1.15rem + 1.5vw, 2rem);
  --text-2xl: clamp(1.7rem, 1.1rem + 2.2vw, 2.85rem);
  --text-display: clamp(2.1rem, 1.05rem + 3.85vw, 4.2rem);
  --text-stat: clamp(2.4rem, 1.65rem + 2.7vw, 3.9rem);
  --text-ghost: clamp(3rem, 2.2rem + 2.4vw, 4.5rem);

  /* ---- espaço · escala 4pt ---- */
  --space-2xs: 0.25rem;
  --space-xs:  0.5rem;
  --space-sm:  0.75rem;
  --space-md:  1rem;
  --space-lg:  1.5rem;
  --space-xl:  2.5rem;
  --space-2xl: 4rem;
  --space-3xl: 6rem;
  --space-4xl: 9rem;

  --page-gutter: clamp(1.125rem, 4vw, 4rem);
  --page-max: 74rem;

  /* ---- movimento ---- */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in:  cubic-bezier(0.7, 0, 0.84, 0);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-micro: 120ms;
  --dur-short: 220ms;
  --dur-long:  420ms;
  --dur-reveal: 700ms;
  --dur-ticker: 38s;

  /* brilho do sheen dos botões decal */
  --sheen: rgba(254,252,244,0.45);

  /* ---- profundidade · cantos técnicos, quase retos ---- */
  --shadow-nav: 0 10px 32px rgba(0,0,0,0.45);
  --rule-hair: 1px;
  --radius-sm: 3px;
  --radius-md: 6px;
  --skew: -10deg;
  --z-base: 1;
  --z-raised: 10;
  --z-sticky: 200;
  --z-fab: 210;
}

/* cor moderna · só onde o navegador entende oklch (Chrome/WebView 111+, Safari 15.4+).
   Os hex acima são o piso: em celular antigo o site continua com fundo, letra e âmbar certos. */
@supports (color: oklch(50% 0.1 70)) {
  :root {
  --color-paper: oklch(12.5% 0.010 75);
  --color-paper-2: oklch(16.5% 0.012 75);
  --color-paper-3: oklch(21% 0.014 75);
  --color-ink: oklch(94% 0.008 80);
  --color-ink-2: oklch(72% 0.016 78);
  --color-ink-3: oklch(61% 0.016 78);
  --color-rule: oklch(28.5% 0.014 75);
  --color-rule-2: oklch(37% 0.014 75);
  --color-accent: oklch(77% 0.155 72);
  --color-accent-hi: oklch(83% 0.16 78);
  --color-accent-ink: oklch(17% 0.05 75);
  --color-focus: oklch(83% 0.16 78);
  --bloom-1: oklch(37% 0.07 70 / 0.34);
  --bloom-2: oklch(32% 0.055 60 / 0.22);
  --color-band: oklch(94.5% 0.010 80);
  --color-band-2: oklch(89.5% 0.012 80);
  --color-band-ink: oklch(21% 0.012 75);
  --color-band-ink-2: oklch(43% 0.014 75);
  --color-band-rule: oklch(80% 0.014 78);
  --color-band-focus: oklch(50% 0.14 72);
  --sheen: oklch(99% 0.01 90 / 0.45);
  --shadow-nav: 0 10px 32px oklch(8% 0.01 75 / 0.45);
  }
}