@import url('https://fonts.googleapis.com/css2?family=Exo:wght@700&family=Roboto:wght@400&display=swap');

.ag-steps-benefits-widget,
.ag-steps-benefits-widget *{
  box-sizing:border-box !important;
}

.ag-steps-benefits-widget{
  --ag-yellow:#EAAA04;
  --ag-black:#000000;
  --ag-white:#FFFFFF;
  --ag-text:#D7D7D7;
  --ag-card:#1F1F1F;

  width:100% !important;

  margin:0 !important;

  padding:
    90px
    0
    100px !important;

  background:#000000 !important;

  overflow:hidden !important;
}

/* =========================================================
   CONTENEDOR
========================================================= */

.ag-steps-benefits-widget .ag-steps-benefits__inner{
  width:min(1280px,calc(100% - 60px)) !important;

  margin:0 auto !important;

  padding:0 !important;
}

/* =========================================================
   TÍTULO PRINCIPAL
========================================================= */

.ag-steps-benefits-widget .ag-steps-benefits__title{
  width:100% !important;

  margin:
    0
    0
    54px !important;

  padding:0 !important;

  font-family:"Exo",sans-serif !important;

  font-weight:700 !important;

  font-style:normal !important;

  font-size:50px !important;

  line-height:65px !important;

  letter-spacing:0 !important;

  text-align:center !important;

  text-transform:none !important;

  color:var(--ag-white) !important;
}

.ag-steps-benefits-widget .ag-yellow{
  color:var(--ag-yellow) !important;
}

/* =========================================================
   GRID
========================================================= */

.ag-steps-benefits-widget .ag-steps-benefits__grid{
  width:100% !important;

  display:grid !important;

  grid-template-columns:
    repeat(4,minmax(0,1fr)) !important;

  gap:20px !important;

  align-items:stretch !important;
}

/* =========================================================
   TARJETAS
========================================================= */

.ag-steps-benefits-widget .ag-steps-benefits__card{
  width:100% !important;

  min-width:0 !important;

  min-height:390px !important;

  margin:0 !important;

  padding:
    31px
    28px
    32px !important;

  display:flex !important;

  flex-direction:column !important;

  align-items:flex-start !important;

  justify-content:flex-start !important;

  background:var(--ag-card) !important;

  border-radius:4px !important;
}

/* =========================================================
   ICONOS
========================================================= */

.ag-steps-benefits-widget .ag-steps-benefits__icon{
  display:block !important;

  width:54px !important;

  height:54px !important;

  min-width:54px !important;

  margin:
    0
    0
    27px !important;

  padding:0 !important;

  object-fit:contain !important;

  object-position:left center !important;

  flex:0 0 54px !important;
}

/* =========================================================
   TÍTULOS TARJETAS
========================================================= */

.ag-steps-benefits-widget .ag-steps-benefits__card-title{
  width:100% !important;

  margin:
    0
    0
    17px !important;

  padding:0 !important;

  font-family:"Exo",sans-serif !important;

  font-weight:700 !important;

  font-style:normal !important;

  font-size:20px !important;

  line-height:25px !important;

  letter-spacing:0 !important;

  text-align:left !important;

  text-transform:none !important;

  color:var(--ag-yellow) !important;
}

.ag-steps-benefits-widget .ag-steps-benefits__title-line{
  display:block !important;

  width:100% !important;

  white-space:normal !important;
}

/* =========================================================
   TEXTO TARJETAS
========================================================= */

.ag-steps-benefits-widget .ag-steps-benefits__text{
  width:100% !important;

  margin:0 !important;

  padding:0 !important;

  font-family:"Roboto",sans-serif !important;

  font-weight:400 !important;

  font-style:normal !important;

  font-size:18px !important;

  line-height:28px !important;

  letter-spacing:0 !important;

  text-align:left !important;

  color:var(--ag-text) !important;

  overflow-wrap:break-word !important;
}

/* =========================================================
   LAPTOP
========================================================= */

@media (max-width:1200px) and (min-width:901px){

  .ag-steps-benefits-widget .ag-steps-benefits__inner{
    width:calc(100% - 60px) !important;
  }

  .ag-steps-benefits-widget .ag-steps-benefits__grid{
    gap:16px !important;
  }

  .ag-steps-benefits-widget .ag-steps-benefits__card{
    min-height:390px !important;

    padding:
      28px
      22px
      30px !important;
  }

  .ag-steps-benefits-widget .ag-steps-benefits__card-title{
    font-size:18px !important;

    line-height:24px !important;
  }

  .ag-steps-benefits-widget .ag-steps-benefits__text{
    font-size:16px !important;

    line-height:25px !important;
  }
}

/* =========================================================
   TABLET
========================================================= */

@media (max-width:900px){

  .ag-steps-benefits-widget{
    padding:
      70px
      0
      80px !important;
  }

  .ag-steps-benefits-widget .ag-steps-benefits__inner{
    width:calc(100% - 40px) !important;
  }

  .ag-steps-benefits-widget .ag-steps-benefits__title{
    margin-bottom:40px !important;

    font-size:42px !important;

    line-height:52px !important;
  }

  .ag-steps-benefits-widget .ag-steps-benefits__grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr)) !important;

    gap:18px !important;
  }

  .ag-steps-benefits-widget .ag-steps-benefits__card{
    min-height:360px !important;

    padding:
      28px
      25px
      30px !important;
  }

  .ag-steps-benefits-widget .ag-steps-benefits__card-title{
    font-size:19px !important;

    line-height:25px !important;
  }

  .ag-steps-benefits-widget .ag-steps-benefits__text{
    font-size:17px !important;

    line-height:27px !important;
  }
}

/* =========================================================
   MÓVIL
========================================================= */

@media (max-width:560px){

  .ag-steps-benefits-widget{
    padding:
      55px
      0
      65px !important;
  }

  .ag-steps-benefits-widget .ag-steps-benefits__inner{
    width:calc(100% - 28px) !important;
  }

  .ag-steps-benefits-widget .ag-steps-benefits__title{
    margin-bottom:30px !important;

    font-size:32px !important;

    line-height:40px !important;
  }

  .ag-steps-benefits-widget .ag-steps-benefits__grid{
    grid-template-columns:1fr !important;

    gap:16px !important;
  }

  .ag-steps-benefits-widget .ag-steps-benefits__card{
    min-height:auto !important;

    padding:
      25px
      22px
      28px !important;
  }

  .ag-steps-benefits-widget .ag-steps-benefits__icon{
    width:48px !important;

    height:48px !important;

    min-width:48px !important;

    flex-basis:48px !important;

    margin-bottom:20px !important;
  }

  .ag-steps-benefits-widget .ag-steps-benefits__card-title{
    margin-bottom:14px !important;

    font-size:18px !important;

    line-height:24px !important;
  }

  .ag-steps-benefits-widget .ag-steps-benefits__text{
    font-size:16px !important;

    line-height:25px !important;
  }
}