/**
 * Design tokens — extraídos 1:1 de la paleta/tipografía usada en caece-cms
 * (resources/js/Layouts + Components/Carreras), para que esta landing de
 * backup luzca consistente con el sitio principal cuando vuelva a estar arriba.
 */
:root {
  /* Color */
  --color-primary: #036a74; /* caece-teal-deep */
  --color-primary-light: #33a8b8; /* caece-teal-medium */
  --color-text: #58595b;
  --color-text-soft: rgba(88, 89, 91, 0.75);
  --color-bg: #ffffff;
  --color-bg-alt: #f7f7f7;
  --color-border: #e5e5e5;
  --color-white: #ffffff;
  --color-overlay-scrim-top: rgba(0, 0, 0, 0.5);
  --color-overlay-scrim-mid: rgba(0, 0, 0, 0.1);
  --color-overlay-scrim-bottom: rgba(0, 0, 0, 0.45);

  /* Tipografía */
  --font-heading: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --font-body: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;

  /* Layout */
  --max-width: 1200px;
  --max-width-wide: 1760px;
  --max-width-narrow: 900px;
  --gutter: clamp(20px, 4vw, 28px);
  --header-height: 84px;

  /* Motion */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --transition-fast: 0.2s ease;
  --transition-base: 0.3s ease;

  /* Elevation */
  --shadow-md: 0 10px 30px rgba(0, 0, 0, 0.12);
  --shadow-lg: 0 20px 45px rgba(0, 0, 0, 0.18);

  --radius-sm: 8px;
  --radius-md: 16px;
  --radius-lg: 24px;
}