/* ==========================================================================
   Tokens — fonte única de cores/tipografia/espaçamento (contrato §4/§9).
   Marca LASSORI (extraída do site no ar). Nunca repetir cor "mágica" fora daqui.
   ========================================================================== */

/* Fontes da marca — replicam EXATAMENTE o sistema do original (famílias nomeadas,
   cada uma weight:normal). Referenciar por NOME de família por elemento (não por peso),
   assim a espessura/faux-bold renderiza idêntico ao original. Servidas pelo tema. */
@font-face { font-family: "Clash Grotesk";          src: url("../../fonts/ClashGrotesk-Variable.ttf")   format("truetype"); font-weight: normal; font-style: normal; font-display: swap; }
@font-face { font-family: "ClashGrotesk-Variable";   src: url("../../fonts/ClashGrotesk-Variable.ttf")   format("truetype"); font-weight: normal; font-style: normal; font-display: swap; }
@font-face { font-family: "ClashGrotesk-Extralight"; src: url("../../fonts/ClashGrotesk-Extralight.ttf") format("truetype"); font-weight: normal; font-style: normal; font-display: swap; }
@font-face { font-family: "ClashGrotesk-Light";      src: url("../../fonts/ClashGrotesk-Light.ttf")      format("truetype"); font-weight: normal; font-style: normal; font-display: swap; }
@font-face { font-family: "ClashGrotesk-Regular";    src: url("../../fonts/ClashGrotesk-Regular.ttf")    format("truetype"); font-weight: normal; font-style: normal; font-display: swap; }
@font-face { font-family: "ClashGrotesk-Medium";     src: url("../../fonts/ClashGrotesk-Medium.ttf")     format("truetype"); font-weight: normal; font-style: normal; font-display: swap; }
@font-face { font-family: "ClashGrotesk-Semibold";   src: url("../../fonts/ClashGrotesk-Semibold.ttf")   format("truetype"); font-weight: normal; font-style: normal; font-display: swap; }
@font-face { font-family: "ClashGrotesk-Bold";       src: url("../../fonts/ClashGrotesk-Bold.ttf")       format("truetype"); font-weight: normal; font-style: normal; font-display: swap; }

:root {
	/* Paleta da marca LASSORI */
	--raz-ink: #161F21;          /* texto / hero escuro */
	--raz-primary: #034554;      /* petróleo — footer / seções escuras */
	--raz-primary-dark: #023540;
	--raz-accent: #055B6C;       /* teal — links / acento */
	--raz-cream: #F1F2E7;        /* creme — títulos sobre escuro / fundo claro */
	--raz-beige: #E9E2E1;        /* bege/rosa — faixas claras */
	--raz-muted: #6b7375;        /* texto secundário */
	--raz-line: #e2e0dd;         /* bordas/divisórias */
	--raz-surface: #F1F2E7;      /* superfície clara */
	--raz-base: #ffffff;         /* fundo branco */

	/* Superfície escura */
	--raz-dark: #161F21;         /* hero escuro */
	--raz-dark-elev: #1f2a2c;

	/* Tipografia — Clash Grotesk (títulos) + Montserrat (corpo) */
	--raz-font: "Montserrat", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
	--raz-font-display: "Clash Grotesk", "ClashGrotesk-Variable", system-ui, sans-serif; /* variável (vaga, etc.) */
	--raz-font-light: "ClashGrotesk-Light", "Clash Grotesk", system-ui, sans-serif;       /* hero, CTA, cards (Equipe) */
	--raz-font-xlight: "ClashGrotesk-Extralight", "ClashGrotesk-Light", system-ui, sans-serif; /* títulos finos da Home */
	--raz-font-nav: "ClashGrotesk-Variable", "Clash Grotesk", system-ui, sans-serif;       /* menu */
	--raz-fs-sm: 0.8125rem;
	--raz-fs-md: 1rem;          /* corpo 16px */
	--raz-fs-lg: 1.25rem;
	--raz-fs-xl: clamp(1.75rem, 1rem + 3vw, 2.75rem);
	--raz-fs-2xl: clamp(2.25rem, 1.2rem + 4vw, 3.625rem); /* h1 ≈ 58px no desktop */
	--raz-lh: 1.6;
	--raz-lh-display: 1.12;

	/* Espaçamento */
	--raz-sp-1: 0.5rem;
	--raz-sp-2: 1rem;
	--raz-sp-3: 1.5rem;
	--raz-sp-4: 2.5rem;
	--raz-sp-5: 4rem;

	/* Layout — medidas do original (controle) */
	--raz-container: 1240px;     /* largura de conteúdo do original (controle: x100→1340 @1440) */
	--raz-container-pad: 1.25rem;
	--raz-radius: 0.5rem;
	--raz-header-h: 89px;        /* altura do header do original */

	/* Breakpoints do projeto (mobile-first): mobile <740 · tablet 740–1159 · desktop ≥1160 */
	--raz-bp-tablet: 740px;
	--raz-bp-desktop: 1160px;

	/* Camadas */
	--raz-z-header: 100;
	--raz-z-drawer: 1000;
	--raz-z-float: 900;
	--raz-z-popup: 1100;
}