/* =========================================================================
   GHz Sounds — Design Tokens
   Brandbook: base P&B (Ink + Paper), laranja só em acentos. Nada de azul.
   Tudo reto: zero radius, zero sombra decorativa, zero gradiente.
   ========================================================================= */
:root {
	/* --- Cores da marca --- */
	--ink: #0C0C0E;            /* fundo escuro principal */
	--bone: #EFEDE6;           /* fundo claro alternativo */
	--paper: #FDFCF9;          /* texto sobre escuro */
	--sounds-orange: #F07A2C;  /* acento GHz Sounds */
	--orange-deep: #A84E14;    /* variação escura do laranja */
	--surface-dark: #1A1A1E;   /* cards/superfícies sobre Ink */
	--gray-support: #8A8A90;   /* texto secundário, legendas */
	--border-dark: #26262A;    /* bordas sobre Ink */

	/* --- Papéis semânticos --- */
	--bg: var(--ink);
	--bg-surface: var(--surface-dark);
	--text: var(--paper);
	--text-muted: var(--gray-support);
	--accent: var(--sounds-orange);
	--accent-deep: var(--orange-deep);
	--border: var(--border-dark);
	--on-accent: var(--ink);   /* texto sobre laranja chapado */
	/* Cor funcional só de UI (erro/destrutivo) — não é cor de marca.
	   O brandbook proíbe azul, não vermelho; erro precisa de sinal claro (WCAG). */
	--danger: #E5484D;

	/* --- Tipografia --- */
	--font-display: "Archivo", system-ui, sans-serif;   /* títulos: 900 */
	--font-body: "Hanken Grotesk", system-ui, sans-serif;
	--font-mono: "JetBrains Mono", ui-monospace, monospace;

	--fw-body: 400;
	--fw-body-medium: 500;
	--fw-body-bold: 700;
	--fw-display: 900;
	--fw-mono: 400;
	--fw-mono-medium: 500;

	/* Escala de tamanho (clamp para fluidez desktop/mobile) */
	--fs-eyebrow: 0.8125rem;                       /* 13px mono */
	--fs-body: 1.0625rem;                          /* 17px */
	--fs-small: 0.875rem;                          /* 14px */
	--fs-lead: clamp(1.125rem, 1rem + 0.6vw, 1.375rem);
	--fs-h3: clamp(1.375rem, 1.1rem + 1.2vw, 1.875rem);
	--fs-h2: clamp(2rem, 1.4rem + 3vw, 3.5rem);
	--fs-h1: clamp(2.75rem, 1.6rem + 5.4vw, 5.5rem);
	--fs-wordmark: clamp(3.5rem, -1rem + 22vw, 20rem); /* footer gigante */

	/* Tracking e leading do display */
	--display-tracking: -0.03em;
	--display-leading: 1.02;
	--body-leading: 1.6;

	/* --- Layout --- */
	--container: 1200px;
	--gutter: clamp(1.25rem, 5vw, 3rem);
	--section-y: clamp(4rem, 8vw, 10rem);   /* 64px mobile → 160px desktop */
	--header-h: 72px;

	/* --- Hero (background + overlay) --- */
	--hero-image: none;                     /* sobrescrito inline pelo Customizer */
	--hero-overlay: rgba(12, 12, 14, 0.72); /* camada opaca sobre a imagem */
	--hero-min-h: 92dvh;

	/* --- Espaçamento (escala 4px) --- */
	--space-1: 0.25rem;
	--space-2: 0.5rem;
	--space-3: 0.75rem;
	--space-4: 1rem;
	--space-5: 1.25rem;
	--space-6: 1.5rem;
	--space-8: 2rem;
	--space-10: 2.5rem;
	--space-12: 3rem;
	--space-16: 4rem;
	--space-20: 5rem;

	/* --- Bordas (tudo reto) --- */
	--radius: 0;
	--border-width: 1px;

	/* --- Transição --- */
	--transition: 160ms ease;

	/* --- Z-index --- */
	--z-header: 100;
}
