/* ==========================================================================
   tokens.css — brand custom properties + @font-face declarations
   No layout rules here; consumed by base.css and section stylesheets.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Font faces (self-hosted — no external requests)
   -------------------------------------------------------------------------- */

@font-face {
	font-family: 'Bebas Neue';
	font-style:  normal;
	font-weight: 400;
	font-display: swap;
	src: url('../fonts/bebas-neue-v16-latin.woff2') format('woff2');
}

@font-face {
	font-family: 'Manrope';
	font-style:  normal;
	font-weight: 200 800; /* variable font — full range */
	font-display: swap;
	src: url('../fonts/manrope-v20-latin-variable.woff2') format('woff2-variations');
}


/* --------------------------------------------------------------------------
   Brand palette
   -------------------------------------------------------------------------- */

:root {
	--onog-red:    #E6141E;
	--deep-navy:   #0E1F4D;
	--marine-blue: #1B4D8C;
	--steel-blue:  #5B7CA8;
	--ink:         #0A0F1A;
	--slate-700:   #3D4654;
	--slate-400:   #8B95A6;
	--slate-200:   #D4D9E2;
	--slate-50:    #F4F6FA;
	--white:       #FFFFFF;

	/* Pre-darkened hover variants (~15% darker, staying in-palette) */
	--onog-red-dark:    #C01018;
	--deep-navy-dark:   #091330;
	--marine-blue-dark: #143b6b;
}


/* --------------------------------------------------------------------------
   Typography
   -------------------------------------------------------------------------- */

:root {
	--font-display: 'Bebas Neue', Impact, 'Arial Narrow', sans-serif;
	--font-body:    'Manrope', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

	/* Desktop type scale */
	--text-h1:   3.5rem;   /* 56px */
	--text-h2:   2.5rem;   /* 40px */
	--text-h3:   1.5rem;   /* 24px */
	--text-body: 1rem;     /* 16px */

	--leading-tight:  1.2;
	--leading-normal: 1.7;

	--tracking-display: 2px; /* headings */
	--tracking-wide:    3px; /* wordmark / hero */
}

/* Mobile overrides */
@media (max-width: 767px) {
	:root {
		--text-h1: 2.5rem;  /* 40px */
		--text-h2: 2rem;    /* 32px */
		--text-h3: 1.25rem; /* 20px */
	}
}


/* --------------------------------------------------------------------------
   Spacing scale (8px base)
   -------------------------------------------------------------------------- */

:root {
	--space-1:  0.5rem;   /*  8px */
	--space-2:  1rem;     /* 16px */
	--space-3:  1.5rem;   /* 24px */
	--space-4:  2rem;     /* 32px */
	--space-5:  3rem;     /* 48px */
	--space-6:  4rem;     /* 64px */
	--space-7:  6rem;     /* 96px */
}


/* --------------------------------------------------------------------------
   Misc
   -------------------------------------------------------------------------- */

:root {
	--radius: 4px;
}