/* ==========================================================================
   Costasol Seguridad — tokens.css
   Sistema de diseño heredado literalmente de Costasol Formación.
   Cualquier cambio de marca se hace aquí y se propaga a todo el sitio.
   ========================================================================== */

:root {
  /* --- Color corporativo (idéntico a Costasol Formación) --- */
  --costasol-navy-deep: #0c2c48;
  --costasol-navy: #123b60;
  --costasol-turquoise: #168eaa;
  --costasol-turquoise-soft: #dff2f5;
  --costasol-orange: #f39a18;
  --costasol-orange-hover: #de8a0c;
  --costasol-orange-ink: #30200b;
  --costasol-ink: #17283a;
  --costasol-muted: #5f6f7e;
  --costasol-light: #f3f6f8;
  --costasol-line: #d9e2e7;
  --costasol-white: #ffffff;
  --costasol-error: #a32020;
  --costasol-success: #176b43;

  /* --- Propios de Seguridad (sobre fondo oscuro) --- */
  --costasol-navy-veil: rgba(12, 44, 72, .82);
  --costasol-on-dark: rgba(255, 255, 255, .84);
  --costasol-on-dark-line: rgba(255, 255, 255, .18);

  /* --- Tipografía --- */
  --costasol-font-sans: "Geist", "Segoe UI", Arial, sans-serif;
  --costasol-text-base: clamp(1rem, 0.25vw + 0.96rem, 1.125rem);
  --costasol-leading-body: 1.65;

  /* --- Retícula --- */
  --costasol-container: 1280px;
  --costasol-gutter: 24px;
  --costasol-section-space: clamp(4.5rem, 6vw, 5.875rem);
  --costasol-section-space-mobile: 3.75rem;

  /* --- Forma --- */
  --costasol-radius-control: 8px;
  --costasol-radius-card: 14px;
  --costasol-shadow-card: 0 13px 34px rgba(12, 44, 72, .07);
  --costasol-shadow-card-hover: 0 20px 42px rgba(12, 44, 72, .12);
  --costasol-shadow-menu: 0 20px 45px rgba(12, 44, 72, .16);

  --costasol-focus: 0 0 0 3px rgba(22, 142, 170, .18);
  --costasol-transition: 180ms ease;
}

@media (max-width: 1199px) {
  :root { --costasol-container: 1080px; --costasol-gutter: 20px; }
}

@media (max-width: 921px) {
  :root { --costasol-gutter: 18px; --costasol-section-space: var(--costasol-section-space-mobile); }
}

@media (max-width: 544px) {
  :root { --costasol-gutter: 14px; }
}