/* apply a natural box layout model to all elements, but allowing components to change */
html {
    box-sizing: border-box;
    font-size: 62.5%;
    /** Reset para REMS - 62.5% = 10px de 16px **/
    scroll-behavior: smooth;
  }
  *,
  *:before,
  *:after {
    box-sizing: inherit;
  }

  body {
    font-family: "DM Sans", sans-serif;
    color: var(--color-negro);
  }
/*Variables*/

:root{
    --color-blanco: #fff;
    --color-negro: #121212;
    --color-plomo: #80817C;
    --color-rojo: #ED1C24;
    --color-verde: #0ABB5F;
    --color-plomo-claro: #FAFAFA;
}

html h1 {
  font-size: 3.4rem;
}

html h2 {
  font-size: 3rem;
}

html h3 {
  font-size: 2.4rem;
}

html h4 {
  font-size: 1.4rem;
}

p {
  font-size: 1.6rem;
  line-height: 1.5;
}

img {
  max-width: 100%;
}
figure{
  margin: 0;
  padding: 0;
}


/*Globales*/

.contenedor{
    max-width: 1200px;
    width: 95%;
    margin: 0 auto;
    overflow: visible;
}
/*UTILIDADES*/
.display-bloc{display: block;}

/*Botones*/
.boton{
  background-color: var(--color-rojo);
  color: var(--color-blanco);
  padding: 8px 35px;
  background-position: 10px 8px;
  font-size: 1.8rem;
  border-radius: 10px;
  text-decoration: none;
  border: none;
  font-weight: 600;
}

.boton-rastrear{
  background-image: url(../img/iconos/buscar.svg);
  background-size: 20px;
  background-color: var(--color-rojo);
  color: var(--color-blanco) !important;
  padding: 10px 25px 10px 50px;
  background-position: 22px 10px;
  background-repeat: no-repeat;
  font-size: 1.8rem;
  font-weight: 600;
  border-radius: 10px;
  text-decoration: none;
  border: none;
  cursor: pointer;
  position: relative;
  display: inline-block;
}
.boton-cliente{
  background-image: url(../img/iconos/cliente.svg);
  background-size: 18px;
  background-color: var(--color-rojo);
  color: var(--color-blanco) !important;
  padding: 10px 25px 10px 50px;
  background-position: 22px 10px;
  background-repeat: no-repeat;
  font-size: 1.8rem;
  font-weight: 600;
  border-radius: 10px;
  text-decoration: none;
  border: none;
  cursor: pointer;
  position: relative;
  display: inline-block;
}
.boton-cliente:hover{
  scale: 1.05;
}
.boton-rastrear:hover{
  scale: 1.05;
}
/*BOTONES SLIDER*/

.swiper-pagination-bullet-active {
  background-color: var(--color-rojo) !important;
}

.swiper-button-prev, .swiper-button-next{
  background-color: var(--color-blanco)!important;
  border-radius: 100%;
  color: var(--color-negro) !important;
  box-shadow: 1px 1px 5px 0px rgba(0, 0, 0, 0.35);
  width: 45px !important;
  height: 45px !important;
 
}
.swiper-button-next:after,
.swiper-button-prev:after {
  font-size: 25px !important;
}