/**
 * Acorde Acordes — Design Tokens
 * Fonte de verdade visual da marca.
 * Não usar cores e medidas soltas nos componentes quando existir um token.
 */

:root {

	/* ==================================================
	   CORES — BRAND CORE V1
	   ================================================== */

	--aa-color-carvao: #111111;
	--aa-color-papel: #F5F0E7;
	--aa-color-ferrugem: #C2472A;
	--aa-color-ambar: #D99A2B;
	--aa-color-oliva: #65784E;
	--aa-color-grafite: #4A4A4A;
    --aa-color-border: rgba(17, 17, 17, 0.14);
    --aa-shadow-card: 0 12px 30px rgba(17, 17, 17, 0.08);

	/* ==================================================
	   CORES SEMÂNTICAS
	   ================================================== */

	--aa-color-background: var(--aa-color-papel);
	--aa-color-surface-dark: var(--aa-color-carvao);

	--aa-color-text: var(--aa-color-carvao);
	--aa-color-text-secondary: var(--aa-color-grafite);
	--aa-color-text-inverse: var(--aa-color-papel);

	--aa-color-action: var(--aa-color-ferrugem);
	--aa-color-attention: var(--aa-color-ambar);
	--aa-color-success: var(--aa-color-oliva);


	/* ==================================================
	   TIPOGRAFIA
	   ================================================== */

	--aa-font-display: "Barlow Condensed", "Arial Narrow", sans-serif;
	--aa-font-body: "Inter", Arial, sans-serif;

	--aa-font-weight-regular: 400;
	--aa-font-weight-medium: 500;
	--aa-font-weight-semibold: 600;
	--aa-font-weight-bold: 700;
	--aa-font-weight-display: 800;

	/* Display — validar posteriormente com Barlow real */
	--aa-display-line-height: 0.95;
	--aa-display-letter-spacing: 0.01em;

	--aa-body-line-height: 1.6;


	/* ==================================================
	   ESCALA TIPOGRÁFICA
	   ================================================== */

	--aa-text-xs: 0.75rem;
	--aa-text-sm: 0.875rem;
	--aa-text-base: 1rem;
	--aa-text-lg: 1.125rem;
	--aa-text-xl: 1.25rem;
	--aa-text-2xl: 1.5rem;
	--aa-text-3xl: 2rem;
	--aa-text-4xl: 2.5rem;
	--aa-text-5xl: 3.5rem;
	--aa-text-6xl: 4.5rem;


	/* ==================================================
	   ESPAÇAMENTO
	   Base: 4px
	   ================================================== */

	--aa-space-1: 0.25rem;
	--aa-space-2: 0.5rem;
	--aa-space-3: 0.75rem;
	--aa-space-4: 1rem;
	--aa-space-5: 1.5rem;
	--aa-space-6: 2rem;
	--aa-space-7: 3rem;
	--aa-space-8: 4rem;
	--aa-space-9: 6rem;
	--aa-space-10: 8rem;


	/* ==================================================
	   LAYOUT
	   ================================================== */

	--aa-container: 1200px;
	--aa-container-narrow: 760px;

	--aa-gutter-mobile: 20px;
	--aa-gutter-tablet: 32px;
	--aa-gutter-desktop: 40px;

	--aa-section-space-mobile: 64px;
	--aa-section-space-desktop: 96px;


	/* ==================================================
	   BORDAS / RAIOS
	   ================================================== */

	--aa-radius-sm: 4px;
	--aa-radius-md: 8px;
	--aa-radius-lg: 16px;
	--aa-radius-pill: 999px;

	--aa-border: 1px;


	/* ==================================================
	   TRANSIÇÕES
	   ================================================== */

	--aa-transition-fast: 150ms ease;
	--aa-transition-base: 250ms ease;

}