/* ============================
   Fuentes: Poppins (local)
   Pesos: 400, 800, 900
   Rutas relativas a este archivo:
   ../fonts/*.woff2
   ../fonts/*.woff (opcional fallback)
   Recomendación: deja solo WOFF2 si tu soporte de navegadores es moderno.
   ============================ */

/* Poppins 400 - normal */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/poppins-400.woff2') format('woff2'),
       url('../fonts/poppins-400.woff') format('woff');
}

/* Poppins 800 - extra bold */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url('../fonts/poppins-800.woff2') format('woff2'),
       url('../fonts/poppins-800.woff') format('woff');
}

/* Poppins 900 - black */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url('../fonts/poppins-900.woff2') format('woff2'),
       url('../fonts/poppins-900.woff') format('woff');
}

/* ============================
   Lato (local)
   Pesos: 100, 300, 400, 700, 900
   Estilos: normal e italic
   Solo woff2 (si necesitas legacy, agrega .woff)
   ============================ */

@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 100;
  font-display: swap;
  src: url('../fonts/lato-normal-100.woff2') format('woff2');
}

@font-face {
  font-family: 'Lato';
  font-style: italic;
  font-weight: 100;
  font-display: swap;
  src: url('../fonts/lato-italic-100.woff2') format('woff2');
}

@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('../fonts/lato-normal-300.woff2') format('woff2');
}

@font-face {
  font-family: 'Lato';
  font-style: italic;
  font-weight: 300;
  font-display: swap;
  src: url('../fonts/lato-italic-300.woff2') format('woff2');
}

@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400; /* Regular */
  font-display: swap;
  src: url('../fonts/lato-normal-400.woff2') format('woff2');
}

@font-face {
  font-family: 'Lato';
  font-style: italic;
  font-weight: 400; /* Regular Italic */
  font-display: swap;
  src: url('../fonts/lato-italic-400.woff2') format('woff2');
}

@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 700; /* Bold */
  font-display: swap;
  src: url('../fonts/lato-normal-700.woff2') format('woff2');
}

@font-face {
  font-family: 'Lato';
  font-style: italic;
  font-weight: 700; /* Bold Italic */
  font-display: swap;
  src: url('../fonts/lato-italic-700.woff2') format('woff2');
}

@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 900; /* Black */
  font-display: swap;
  src: url('../fonts/lato-normal-900.woff2') format('woff2');
}

@font-face {
  font-family: 'Lato';
  font-style: italic;
  font-weight: 900; /* Black Italic */
  font-display: swap;
  src: url('../fonts/lato-italic-900.woff2') format('woff2');
}

/* ============================
   Variables y helpers (opcional)
   ============================ */
:root {
  /* Base del sitio con Poppins (como ya tienes) */
  --font-base: 'Poppins', system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', sans-serif;

  /* Segunda familia opcional para textos, UI o párrafos */
  --font-alt: 'Lato', system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', sans-serif;
}

/* Mantén Poppins como base global si así lo deseas */
html, body {
  font-family: var(--font-base);
  font-weight: 400;
}

/* Utilidades de Poppins */
.font-regular { font-weight: 400; }
.font-extrabold { font-weight: 800; }
.font-black { font-weight: 900; }

/* ============================
   Helpers Lato (si lo aplicas por secciones)
   ============================ */
.font-lato        { font-family: var(--font-alt); }
.font-lato-thin   { font-family: var(--font-alt); font-weight: 100; }
.font-lato-light  { font-family: var(--font-alt); font-weight: 300; }
.font-lato-regular{ font-family: var(--font-alt); font-weight: 400; }
.font-lato-bold   { font-family: var(--font-alt); font-weight: 700; }
.font-lato-black  { font-family: var(--font-alt); font-weight: 900; }