/* ===========================
   BASE.CSS
   Variables, fuentes, reset, helpers
=========================== */

/* Fuentes del sistema Aquafondo */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;700&family=Baloo+2:wght@400;500;600;700&raleway=swap');

/* Variables globales */


:root{
  /* ==================================================
     TIPOGRAFÍAS (tokens base)
     ================================================== */
  --font-primary: 'Montserrat', sans-serif;
  --font-display: 'Baloo 2', cursive; 
  --font-roboto: 'Roboto', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-raleway: 'Raleway', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  --font-poppins: 'Poppins', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-heebo: 'Heebo', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;


  /* ==================================================
     COLORES PRINCIPALES (PDF)
     ================================================== */

  /* Verde principal */
  --verde-100: #5DA500;
  --verde-60:  #C1EF00;
  --verde-10:  #DAF566;

  /* Azul principal */
  --azul-100: #3391C4;
  --azul-60:  #85BDDC;
  --azul-10:  #EBF4FA;


  /* ==================================================
     COLORES SECUNDARIOS (PDF)
     ================================================== */

  /* Verde secundario (bloque resaltado en tu imagen) */
  --verde-secundario-100: #C1EF00;
  --verde-secundario-60:  #DAF566;
  --verde-secundario-10:  #F9FEE6;

  /* Verde oscuro */
  --verde-oscuro-100:#2A4C2B;
  --verde-oscuro-60: #7F9480;
  --verde-oscuro-10: #EAEEEA;

  /* Azul 2 */
  --azul2-100:#0069CF;
  --azul2-60: #66A5E2;
  --azul2-10: #E6F0FB;

  /* Azul oscuro */
  --azul-oscuro-100:#003B6B;
  --azul-oscuro-60: #6689A6;
  --azul-oscuro-10: #E6ECF1;

  /* Grises */
  --gris-100:#DEDEDE;
  --gris-60: #EEEEEE;
  --gris-10: #FCFCFC;


  /* ==================================================
     COLORES TERCIARIOS (PDF)
     ================================================== */

  --rosa-100:#EA0CC0;
  --rosa-60: #FDE7F9;
  --rosa-10: #F5F5F5;

  --naranja-100:#FF8606;
  --naranja-60: #FFB66A;
  --naranja-10: #FFF3E7;

  --amarillo-100:#F9DB03;
  --amarillo-60: #FBE968;
  --amarillo-10: #FFFCE6;


  /* ==================================================
     TEXTOS Y FONDOS (PDF)
     ================================================== */

  --texto-100:#414042;
  --texto-60: #8D8C8E;
  --texto-20: #D9D9D9;

  --bg-100:#FFFFFF;
  --bg-60: #EBEBEB;
  --bg-20: #F5F5F5;

/* colores sello ehr */
--bg-black:#000000;
--ehr-1:#B99644;
--ehr-2:#D1C097;
--ehr-3:#E0D9C9;


}


/* Reset simple */
*,
*::before,
*::after{ box-sizing: border-box; }
/*antes font-primary*/
body{
  margin:0;
  font-family: var(--font-poppins);
  font-size:15px;
  font-weight:400;
  color: var(--texto-100);
  line-height:1.5;
  background: var(--bg-20);
}

a{ text-decoration:none; color:inherit; }

/* Helpers básicos */
.container{
  width:1440px;
  max-width:90%;
  margin:0 auto;
}

.mt-10{
   margin-top: 10px;
}
.mt-20{
   margin-top: 20px;
}
.mt-40{
   margin-top: 40px;
}
.mt-60{
   margin-top: 60px;
}
.mt-80{
   margin-top: 80px;
}
.mt-100{
   margin-top: 100px;
}

.mb-10{
   margin-bottom: 10px;
}
.mb-20{
   margin-bottom: 20px;
}
.mb-40{
   margin-bottom: 40px;
}
.mb-60{
   margin-bottom: 60px;
}