/* FONTS POPPINS */

@font-face {
  font-family: "Poppins";
  src: url("Poppins-Bold.woff2") format("woff2"),
    url("Poppins-Bold.woff") format("woff");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("Poppins-ExtraBold.woff2") format("woff2"),
    url("Poppins-ExtraBold.woff") format("woff");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("Poppins-ExtraBoldItalic.woff2") format("woff2"),
    url("Poppins-ExtraBoldItalic.woff") format("woff");
  font-weight: bold;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("Poppins-BlackItalic.woff2") format("woff2"),
    url("Poppins-BlackItalic.woff") format("woff");
  font-weight: 900;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("Poppins-Black.woff2") format("woff2"),
    url("Poppins-Black.woff") format("woff");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("Poppins-BoldItalic.woff2") format("woff2"),
    url("Poppins-BoldItalic.woff") format("woff");
  font-weight: bold;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("Poppins-MediumItalic.woff2") format("woff2"),
    url("Poppins-MediumItalic.woff") format("woff");
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("Poppins-Medium.woff2") format("woff2"),
    url("Poppins-Medium.woff") format("woff");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("Poppins-LightItalic.woff2") format("woff2"),
    url("Poppins-LightItalic.woff") format("woff");
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("Poppins-ExtraLightItalic.woff2") format("woff2"),
    url("Poppins-ExtraLightItalic.woff") format("woff");
  font-weight: 200;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("Poppins-Regular.woff2") format("woff2"),
    url("Poppins-Regular.woff") format("woff");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("Poppins-ExtraLight.woff2") format("woff2"),
    url("Poppins-ExtraLight.woff") format("woff");
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("Poppins-Italic.woff2") format("woff2"),
    url("Poppins-Italic.woff") format("woff");
  font-weight: normal;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("Poppins-Light.woff2") format("woff2"),
    url("Poppins-Light.woff") format("woff");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("Poppins-Thin.woff2") format("woff2"),
    url("Poppins-Thin.woff") format("woff");
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("Poppins-ThinItalic.woff2") format("woff2"),
    url("Poppins-ThinItalic.woff") format("woff");
  font-weight: 100;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("Poppins-SemiBoldItalic.woff2") format("woff2"),
    url("Poppins-SemiBoldItalic.woff") format("woff");
  font-weight: 600;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("Poppins-SemiBold.woff2") format("woff2"),
    url("Poppins-SemiBold.woff") format("woff");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

/* FONTS POPPINS END */

:root {
  --color-gris: #1f2425;
  --color-amarillo: #ffef06;
  --color-naranja: #b22d09;
}

body {
  font-family: "Poppins";
  text-transform: uppercase;
}

.navbar {
  background-color: #1f2425;
}
.navbar-brand img {
  height: 50px;
}
.nav-link {
  color: white !important;
  font-weight: 700;
}
.nav-link:hover {
  color: var(--color-gris) !important;
  background-color: var(--color-amarillo) !important;
  font-weight: 700;
  border-radius: 5px;
  padding: 10px 15px;
  transition: background-color 0.3s ease, color 0.3s ease;
}

.navbar-toggler {
  background-color: var(
    --color-amarillo
  ) !important; /* Color de la hamburguesa */
}
.carousel-item img {
  width: 100%;
  object-fit: cover;
}
.valores-section {
  background-image: url("/assets/img/fondo_valores.png"); /* Reemplaza con la URL de tu imagen */
  background-size: cover; /* Ajusta la imagen para cubrir toda la sección */
  background-position: center; /* Centra la imagen */
  background-repeat: no-repeat; /* Evita que la imagen se repita */
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100vh;
  color: white;
}
.text-valores {
  font-size: 5rem;
  color: var(--color-amarillo);
  font-weight: bold;
  text-align: center;
  margin-bottom: 20px;
}
.valores-hover:hover {
  cursor: pointer;
  opacity: 0.8;
}

.hechos-section {
  background-image: url("/assets/img/inicio_testimonio_01.png"); /* Reemplaza con la URL de tu imagen */
  background-size: cover; /* Ajusta la imagen para cubrir toda la sección */
  background-position: center; /* Centra la imagen */
  background-repeat: no-repeat; /* Evita que la imagen se repita */
  display: flex;
  width: 100%;
  height: 100vh;
}

.conocenos-section {
  background-image: url("/assets/img/inicio_nosotros.png"); /* Reemplaza con la URL de tu imagen */
  background-size: cover; /* Ajusta la imagen para cubrir toda la sección */
  background-position: center; /* Centra la imagen */
  background-repeat: no-repeat; /* Evita que la imagen se repita */
  display: flex;
  width: 100%;
  height: 100vh;
  color: white;
}

.galeria-section {
  background-image: url("/assets/img/fondo_valores.png"); /* Reemplaza con la URL de tu imagen */
  background-size: cover; /* Ajusta la imagen para cubrir toda la sección */
  background-position: center; /* Centra la imagen */
  display: flex;
  min-height: 100vh; /* Cambia la altura mínima a 100vh */
}
.portfolio-section {
  background-image: url("/assets/img/fondo_general.png"); /* Reemplaza con la URL de tu imagen */
  background-size: cover; /* Ajusta la imagen para cubrir toda la sección */
  background-position: center; /* Centra la imagen */
  background-repeat: no-repeat; /* Evita que la imagen se repita */
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100vh; /* Cambia la altura mínima a 100vh */
}
.mision-text {
  font-size: 3rem;
  color: var(--color-amarillo);
  font-weight: bold;
  text-align: center;
  margin-bottom: 20px;
}

.strong-text {
  font-family: "Poppins", sans-serif;
  font-weight: 700;
}

.flex-footer {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.btn-galeria {
  background-color: var(--color-amarillo);
  color: var(--color-gris);
  font-weight: 700;
  padding: 10px 20px;
  border-radius: 5px;
  text-decoration: none;
}
.modal-img {
  width: 100%;
}
.click-p {
  cursor: pointer;
}
.select:hover {
  cursor: pointer;
  scale: 1.3;
  transition: all 0.3s ease;
}
.whatsapp-button {
  position: fixed;
  bottom: 20px;
  right: 20px;
  background-color: #25D366;
  color: white;
  border-radius: 50%;
  width: 60px;
  height: 60px;
  display: flex;
  justify-content: center;
  align-items: center;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  text-decoration: none;
  z-index: 1000;
}
.whatsapp-button img {
  width: 40px;
  height: 40px;
}

@media (max-width: 767px) {
  .text-valores {
    font-size: 3rem; /* Cambia el tamaño de fuente para pantallas pequeñas */
  }
  .valores-section {
    height: auto; /* Cambia la altura para pantallas pequeñas */
    padding: 20px; /* Agrega un poco de relleno */
  }
  .hechos-section {
    background-size: contain;
  }
  .conocenos-section {
    display: flex;
  }
  .portfolio-section {
    display: flex;
  }
  .strong-text {
    font-family: "Poppins", sans-serif;
    font-weight: 700;
  }
}
