@font-face {
  font-family: "Roboto";
  src:
    url("../fonts/roboto-v29-latin-300.woff2") format("woff2"),
    url("../fonts/roboto-v29-latin-300.woff") format("woff");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Roboto";
  src:
    url("../fonts/roboto-v29-latin-regular.woff2") format("woff2"),
    url("../fonts/roboto-v29-latin-regular.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Roboto";
  src:
    url("../fonts/roboto-v29-latin-500.woff2") format("woff2"),
    url("../fonts/roboto-v29-latin-500.woff") format("woff");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Roboto";
  src:
    url("../fonts/roboto-v29-latin-700.woff2") format("woff2"),
    url("../fonts/roboto-v29-latin-700.woff") format("woff");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Roboto";
  src:
    url("../fonts/roboto-v29-latin-900.woff2") format("woff2"),
    url("../fonts/roboto-v29-latin-900.woff") format("woff");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}
:root {
  --color-text: #212529;
  --color-black: #000000;
  --color-white: #ffffff;
  --color-yellow: #fdc82f;
  --color-yellow-hover: #e7b92c;
  --color-grey: #7b868c;
  --font-primary: "Roboto", sans-serif;
  --header-offset: 96px;
}
html {
  font-size: 62.5%;
}
body {
  margin: 0;
  padding-top: var(--header-offset);
  font-family: var(--font-primary);
  color: var(--color-text);
  background-color: var(--color-white);
}
img {
  display: block;
  max-width: 100%;
  height: auto;
}
a {
  color: inherit;
  text-decoration: none;
} /* Utilidades globales mínimas */
.only-phone {
  display: none !important;
}
.img-phone {
  display: none;
}
.img-phone > img {
  width: 100%;
  height: 260px;
  object-fit: cover;
  object-position: center;
}
@media (max-width: 978px) {
  html {
    font-size: 45%;
  }
  :root {
    --header-offset: 76px;
  }
  .only-phone {
    display: flex !important;
  }
  .img-phone {
    display: block;
  }
}
@media (max-width: 360px) {
  html {
    font-size: 50%;
  }
}
body.home {
  padding-top: 0 !important;
}

