/* ============================================================
   FIDELY · Sistema de marca (landing)
   Tokens espejo de plataforma/css/fidely-brand.css para que la
   landing y la aplicación se lean como una sola marca.
   Los hex están muestreados del PDF original de Illustrator.
   ============================================================ */

/* ── Tipografía: Axiforma ──
   Los .otf pesan ~40 KB cada uno. Al pasar a producción conviene
   convertirlos a .woff2 (≈60 % menos) y añadirlos antes del otf
   en cada src. Ver ASSETS-PENDIENTES.md. */
@font-face {
  font-family: 'Axiforma';
  src: url('../assets/fonts/axiforma/Axiforma-Light.otf') format('opentype');
  font-weight: 300; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Axiforma';
  src: url('../assets/fonts/axiforma/Axiforma-Book.otf') format('opentype');
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Axiforma';
  src: url('../assets/fonts/axiforma/Axiforma-Medium.otf') format('opentype');
  font-weight: 500; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Axiforma';
  src: url('../assets/fonts/axiforma/Axiforma-SemiBold.otf') format('opentype');
  font-weight: 600; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Axiforma';
  src: url('../assets/fonts/axiforma/Axiforma-Bold.otf') format('opentype');
  font-weight: 700; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Axiforma';
  src: url('../assets/fonts/axiforma/Axiforma-ExtraBold.otf') format('opentype');
  font-weight: 800; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Axiforma';
  src: url('../assets/fonts/axiforma/Axiforma-Black.otf') format('opentype');
  font-weight: 900; font-style: normal; font-display: swap;
}

:root {
  /* ── Color ── */
  --azul:       #0044DB; /* principal: CTAs, acentos, paneles */
  --azul-dark:  #0036B0; /* hover */
  --azul-soft:  #C9D6F5; /* superficies azul claro */
  --verde:      #01362E; /* títulos grandes y fondos profundos */
  --verde-mid:  #0A4A40; /* hover sobre verde */
  --crema:      #F7F9E8; /* fondos suaves y tarjetas */
  --lima:       #D9ED66; /* acento, números, destacados */
  --menta:      #B3E0D7; /* secciones de apoyo */
  --blanco:     #FFFFFF;

  --texto:      #01362E;
  --texto-suave: #3A5B54;

  /* ── Tipografía ── */
  --font: 'Axiforma', 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;

  /* Escala fluida. El diseño original está a 1920 px de ancho;
     los clamp() lo bajan a móvil sin romper la jerarquía. */
  --t-hero:  clamp(2.5rem, 6.2vw, 5.25rem);
  --t-h2:    clamp(2rem, 4.6vw, 3.9rem);
  --t-h3:    clamp(1.5rem, 2.6vw, 2.4rem);
  --t-card:  clamp(1.15rem, 1.5vw, 1.5rem);
  --t-body:  clamp(1rem, 1.05vw, 1.125rem);
  --t-small: 0.9375rem;

  /* ── Espaciado y forma ── */
  --ancho:      1320px;
  --nav-h:      70px;   /* alto de la barra pegajosa; descuenta el snap */
  --gutter:     clamp(1.25rem, 4vw, 4rem);
  --seccion-y:  clamp(4rem, 9vw, 8.5rem);
  --r-card:     22px;
  --r-pill:     999px;

  --sombra-card: 0 18px 45px rgba(1, 54, 46, .10);
  --sombra-alta: 0 26px 70px rgba(1, 54, 46, .16);

  --ease: cubic-bezier(.22, .61, .36, 1);
}