/* Tokens de marca Böll — ÚNICA fuente de color y tipografía.
   Ningún widget escribe un hex a mano. */
:root {
	/* Color */
	--boll-color-primary:      #ff4438;
	--boll-color-primary-dark: #d92f24;
	--boll-color-primary-soft: rgba(255, 68, 56, .14);
	--boll-color-neon:         #42ef43;

	--boll-color-bg:           #050505;
	--boll-color-bg-alt:       #0d0d0d;
	--boll-color-surface:      #141414;
	--boll-color-surface-2:    #1b1b1b;

	--boll-color-text:         #ffffff;
	--boll-color-muted:        rgba(255, 255, 255, .68);
	--boll-color-faint:        rgba(255, 255, 255, .42);
	--boll-color-border:       rgba(255, 255, 255, .12);
	--boll-color-border-strong: rgba(255, 255, 255, .24);
	--boll-color-danger:       #ff6b61;

	/* Tipografía */
	--boll-font-display: 'Bebas Neue', Impact, 'Arial Narrow', sans-serif;
	--boll-font-body:    'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif;
	--boll-font-sub:     'Outfit', 'Manrope', system-ui, sans-serif; /* títulos de tarjetas, como en agenciaboll.com */

	/* Pesos. Bebas Neue solo existe en 400: el sitio actual la usa a 800 y el navegador la engrosa;
	   se replica para que se vea igual. */
	--boll-fw-display: 800;
	--boll-fw-sub: 600;

	--boll-fs-hero: clamp(3rem, 8.5vw, 6.5rem);
	--boll-fs-h2:   clamp(2.25rem, 5vw, 3.75rem);
	--boll-fs-h3:   clamp(1.25rem, 2vw, 1.5rem);
	--boll-fs-lead: clamp(1.05rem, 1.6vw, 1.25rem);
	--boll-fs-body: 1rem;
	--boll-fs-small: .875rem;
	--boll-lh-display: .98;
	--boll-lh-tight: 1.2;
	--boll-lh-body: 1.65;

	/* Espaciado y forma */
	--boll-space-section: clamp(3.5rem, 7vw, 6rem);
	--boll-space-gap: clamp(1rem, 2.4vw, 1.75rem);
	--boll-radius: 20px;
	--boll-radius-sm: 12px;
	--boll-radius-pill: 999px;
	--boll-container: 1200px;
	--boll-gutter: clamp(1.25rem, 4vw, 2rem);
	--boll-header-h: 76px;

	/* Efectos */
	--boll-shadow: 0 24px 60px rgba(0, 0, 0, .55);
	--boll-glow: 0 10px 34px rgba(255, 68, 56, .38);
	--boll-ease: cubic-bezier(.2, .7, .2, 1);
}