/*
 * OneGetUp — Tokens de diseño.
 * ÚNICA fuente de verdad de los valores del sistema (decisión C-51).
 * Copyright © 2026 OneGetUP — JAZO.
 *
 * Los colores maestros de marca NO se modifican bajo ninguna circunstancia.
 * La adaptación a WCAG 2.2 AA se resuelve en la capa de interfaz, no en la marca.
 */

:root {
	/* ── Primitivas de marca — no se modifican ───────────────────────── */
	--ogu-brand-cyan: #00b2ff;
	--ogu-brand-blue: #0077ff;
	--ogu-brand-navy: #0a1a2f;
	--ogu-brand-grey: #e6e6e6;
	--ogu-brand-white: #ffffff;
	--ogu-brand-angle: 40deg;
	--ogu-brand-gradient: linear-gradient(40deg, #005fcc 0%, #0077ff 45%, #00b2ff 100%);

	/* ── Escala azul de interfaz ─────────────────────────────────────── */
	--ogu-blue-50: #e6f1ff;
	--ogu-blue-100: #cce3ff;
	--ogu-blue-200: #99c7ff;
	--ogu-blue-300: #66aaff;
	--ogu-blue-400: #338eff;
	--ogu-blue-500: #0077ff;
	--ogu-blue-600: #005fcc;
	--ogu-blue-700: #004799;
	--ogu-blue-800: #00396f;
	--ogu-blue-900: #002b54; /* DISCREPANCIA-01 resuelta el 14/08/2026 */

	/* ── Escala cian ─────────────────────────────────────────────────── */
	--ogu-cyan-200: #99e1ff;
	--ogu-cyan-300: #66d2ff;
	--ogu-cyan-400: #33c2ff;
	--ogu-cyan-500: #00b2ff;
	--ogu-cyan-600: #008ecc;
	--ogu-cyan-700: #006b99;
	--ogu-cyan-800: #00536f;

	/* ── Neutros con subtono navy. No son grises puros ───────────────── */
	--ogu-white: #ffffff;
	--ogu-ink-50: #f4f6f9;
	--ogu-ink-100: #e6e9ee;
	--ogu-ink-200: #c9d0da;
	--ogu-ink-300: #828d9c;
	--ogu-ink-400: #66707f;
	--ogu-ink-500: #47515f;
	--ogu-ink-600: #2c3543;
	--ogu-ink-700: #1d2530;
	--ogu-ink-800: #131c28;
	--ogu-ink-900: #0a1a2f; /* es el navy de marca */
	--ogu-ink-950: #050b14;

	/* ── Semánticos ──────────────────────────────────────────────────── */
	--ogu-success-50: #e4f6ef;
	--ogu-success-600: #06805a;
	--ogu-success-700: #056648;
	--ogu-success-light: #3dd9a0;
	--ogu-warning-50: #fdf3e3;
	--ogu-warning-600: #96470a;
	--ogu-warning-700: #7a3908;
	--ogu-warning-light: #f7b24c;
	--ogu-error-50: #fdeae8;
	--ogu-error-600: #c22b1f;
	--ogu-error-700: #9e2118;
	--ogu-error-light: #ff8578;

	/* ── Tipografía ──────────────────────────────────────────────────── */
	--ogu-font-display: poppins, ui-sans-serif, system-ui, -apple-system, "Segoe UI", roboto, sans-serif;
	--ogu-font-text: geist, ui-sans-serif, system-ui, -apple-system, "Segoe UI", roboto, sans-serif;
	--ogu-font-mono: "Geist Mono", ui-monospace, sfmono-regular, menlo, consolas, monospace;

	--ogu-text-xs: clamp(0.75rem, 0.72rem + 0.12vw, 0.8125rem);
	--ogu-text-sm: clamp(0.875rem, 0.85rem + 0.12vw, 0.9375rem);
	--ogu-text-base: clamp(1rem, 0.97rem + 0.15vw, 1.0625rem);
	--ogu-text-lg: clamp(1.125rem, 1.06rem + 0.3vw, 1.25rem);
	--ogu-text-xl: clamp(1.25rem, 1.14rem + 0.5vw, 1.5rem);
	--ogu-text-2xl: clamp(1.5rem, 1.3rem + 0.9vw, 1.875rem);
	--ogu-text-3xl: clamp(1.875rem, 1.55rem + 1.4vw, 2.375rem);
	--ogu-text-4xl: clamp(2.25rem, 1.75rem + 2.1vw, 3rem);
	--ogu-text-5xl: clamp(2.75rem, 1.95rem + 3.4vw, 4rem);
	--ogu-text-6xl: clamp(3.25rem, 2.1rem + 4.9vw, 5.25rem);
	--ogu-text-7xl: clamp(3.75rem, 2.1rem + 7vw, 7rem);

	--ogu-leading-none: 1;
	--ogu-leading-tight: 1.1;
	--ogu-leading-snug: 1.25;
	--ogu-leading-normal: 1.5;
	--ogu-leading-relaxed: 1.65;

	--ogu-tracking-tighter: -0.035em;
	--ogu-tracking-tight: -0.02em;
	--ogu-tracking-normal: 0;
	--ogu-tracking-wide: 0.06em;
	--ogu-tracking-widest: 0.14em;

	--ogu-weight-regular: 400;
	--ogu-weight-medium: 500;
	--ogu-weight-semibold: 600;
	--ogu-weight-bold: 700;

	/* ── Espaciado, base 4px ─────────────────────────────────────────── */
	--ogu-space-1: 0.25rem;
	--ogu-space-2: 0.5rem;
	--ogu-space-3: 0.75rem;
	--ogu-space-4: 1rem;
	--ogu-space-5: 1.25rem;
	--ogu-space-6: 1.5rem;
	--ogu-space-8: 2rem;
	--ogu-space-10: 2.5rem;
	--ogu-space-12: 3rem;
	--ogu-space-16: 4rem;
	--ogu-space-20: 5rem;
	--ogu-space-24: 6rem;
	--ogu-space-32: 8rem;
	--ogu-space-40: 10rem;
	--ogu-section-y: clamp(4rem, 9vw, 10rem);

	/* ── Contenedores y rejilla ──────────────────────────────────────── */
	--ogu-container: 1280px;
	--ogu-container-wide: 1440px;
	--ogu-container-narrow: 920px;
	--ogu-prose: 68ch;
	--ogu-gutter: clamp(1.25rem, 4vw, 2.5rem);
	--ogu-grid-cols: 12;
	--ogu-grid-gap: clamp(1rem, 2.2vw, 2rem);

	/* ── Radios ──────────────────────────────────────────────────────── */
	--ogu-radius-xs: 2px;
	--ogu-radius-sm: 4px;
	--ogu-radius-md: 6px;
	--ogu-radius-lg: 10px;
	--ogu-radius-pill: 999px;

	/* ── Sombras: solo con elevación real ────────────────────────────── */
	--ogu-shadow-1: 0 1px 2px rgb(5 7 15 / 6%), 0 4px 12px rgb(5 7 15 / 6%);
	--ogu-shadow-2: 0 8px 28px rgb(5 7 15 / 14%), 0 2px 6px rgb(5 7 15 / 8%);
	--ogu-shadow-sticky: 0 1px 0 var(--ogu-border);

	/* ── Movimiento ──────────────────────────────────────────────────── */
	--ogu-dur-1: 120ms;
	--ogu-dur-2: 180ms;
	--ogu-dur-3: 240ms;
	--ogu-dur-4: 320ms;
	--ogu-ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
	--ogu-ease-entrance: cubic-bezier(0.16, 1, 0.3, 1);
	--ogu-ease-exit: cubic-bezier(0.4, 0, 1, 1);

	/* ── Capas ───────────────────────────────────────────────────────── */
	--ogu-z-base: 1;
	--ogu-z-sticky: 100;
	--ogu-z-dropdown: 200;
	--ogu-z-overlay: 300;
	--ogu-z-modal: 400;
	--ogu-z-toast: 500;

	/* ── Capa semántica — MODO CLARO (lienzo de lectura) ─────────────── */
	--ogu-bg: var(--ogu-white);
	--ogu-bg-subtle: var(--ogu-ink-50);
	--ogu-surface: var(--ogu-white);
	--ogu-surface-raised: var(--ogu-white);
	--ogu-surface-inverse: var(--ogu-ink-950);
	--ogu-text: var(--ogu-ink-900);
	--ogu-text-secondary: var(--ogu-ink-500);
	--ogu-text-muted: var(--ogu-ink-400);
	--ogu-text-inverse: var(--ogu-ink-50);
	--ogu-border: var(--ogu-ink-100);
	--ogu-border-strong: var(--ogu-ink-300);
	--ogu-accent: var(--ogu-blue-600);
	--ogu-accent-hover: var(--ogu-blue-700);
	--ogu-accent-active: var(--ogu-blue-800);
	--ogu-accent-contrast: var(--ogu-white);
	--ogu-accent-subtle: var(--ogu-blue-50);
	--ogu-focus: var(--ogu-blue-600);
	--ogu-success: var(--ogu-success-600);
	--ogu-warning: var(--ogu-warning-600);
	--ogu-error: var(--ogu-error-600);
}

/* ── Capa semántica — MODO OSCURO ────────────────────────────────────
 * Estrategia aprobada: híbrido «marca oscura, lienzo claro» con soporte
 * completo de prefers-color-scheme (decisión P-03).
 */
@media (prefers-color-scheme: dark) {
	:root {
		--ogu-bg: var(--ogu-ink-950);
		--ogu-bg-subtle: var(--ogu-ink-900);
		--ogu-surface: var(--ogu-ink-900);
		--ogu-surface-raised: var(--ogu-ink-800);
		--ogu-surface-inverse: var(--ogu-white);
		--ogu-text: var(--ogu-ink-50);
		--ogu-text-secondary: var(--ogu-ink-200);
		--ogu-text-muted: var(--ogu-ink-200);
		--ogu-text-inverse: var(--ogu-ink-950);
		--ogu-border: var(--ogu-ink-700);
		--ogu-border-strong: var(--ogu-ink-400);
		--ogu-accent: var(--ogu-blue-300);
		--ogu-accent-hover: var(--ogu-cyan-400);
		--ogu-accent-active: var(--ogu-cyan-300);
		--ogu-accent-contrast: var(--ogu-ink-950);
		--ogu-accent-subtle: rgb(0 178 255 / 12%);
		--ogu-focus: var(--ogu-cyan-400);
		--ogu-success: var(--ogu-success-light);
		--ogu-warning: var(--ogu-warning-light);
		--ogu-error: var(--ogu-error-light);
		--ogu-shadow-1: 0 1px 2px rgb(0 0 0 / 40%), 0 4px 12px rgb(0 0 0 / 30%);
		--ogu-shadow-2: 0 8px 28px rgb(0 0 0 / 50%), 0 2px 6px rgb(0 0 0 / 40%);
	}
}

/* Superficies de marca: navy, donde el cian rinde 7.33:1 (AAA). */
.ogu-surface-brand {
	--ogu-bg: var(--ogu-brand-navy);
	--ogu-surface: var(--ogu-brand-navy);
	--ogu-text: var(--ogu-ink-50);
	--ogu-text-secondary: var(--ogu-ink-200);
	--ogu-border: var(--ogu-ink-700);
	--ogu-accent: var(--ogu-cyan-500);
	--ogu-accent-contrast: var(--ogu-ink-950);
	--ogu-focus: var(--ogu-cyan-400);

	background-color: var(--ogu-bg);
	color: var(--ogu-text);
}