/* importar tipografias montse y popins*/
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;600&family=Poppins:wght@700&display=swap');

/* varibales con la paleta de colorea q quiero */
:root {
  --rojo-tomate: #E64A3B;
  --naranja-pimenton: #F29F05;
  --crema-claro: #FFF6E8;
  --verde-cilantro: #4EA26A;
  --marron-cacao: #3A2F2F;
  --negro-suave: #2B2626;
}

/* poner la tipografia*/
body {
  font-family: 'Montserrat', sans-serif;
  background-color: var(--crema-claro);
  color: var(--negro-suave);
}

h1, h2, h3, h4, h5, h6, .navbar-brand {
  font-family: 'Poppins', sans-serif;
  color: var(--marron-cacao);
}

/* forzar a boots q use mi paleta de colroes ->  !important */
.bg-primary {
  background-color: var(--verde-cilantro) !important;
}

.bg-light {
  background-color: var(--crema-claro) !important;
}

.btn-primary {
  background-color: var(--verde-cilantro);
  border-color: var(--verde-cilantro);
}
.btn-primary:hover {
  background-color: #3d8255;
  border-color: #3d8255;
}

.btn-success {
  background-color: var(--verde-cilantro);
  border-color: var(--verde-cilantro);
}
.btn-success:hover {
  background-color: #3d8255;
  border-color: #3d8255;
}

.btn-danger {
  background-color: var(--rojo-tomate);
  border-color: var(--rojo-tomate);
}
.btn-danger:hover {
  background-color: #d03c2f;
  border-color: #d03c2f;
}

.text-primary {
  color: var(--verde-cilantro) !important;
}

.text-dark {
  color: var(--negro-suave) !important;
}

/* el nav bar */
.navbar-dark {
  background-color: var(--marron-cacao) !important;
}
.navbar-dark .navbar-nav .nav-link {
  color: rgba(255, 246, 232, .8);
}

.navbar-dark .navbar-nav .nav-link:hover {
  color: var(--naranja-pimenton);
}

.navbar-dark .navbar-brand {
  color: var(--crema-claro) !important;
}

.navbar-dark .navbar-brand:hover {
  color: var(--naranja-pimenton) !important;
}

/* carrusel */
.carousel-img {
  height: 1000px;
  background-size: cover;
  background-position: center;
  padding: 50px 0;
}

@media (max-width: 576px) {
  .carousel-img {
    display: none;
  }
}

/* botones */
.btn-tomate {
  background-color: var(--rojo-tomate);
  color: #fff;
  border: none;
}
.btn-tomate:hover {
  background-color: #d03c2f;
  color: #fff;
}

.btn-pimenton {
  background-color: var(--naranja-pimenton);
  color: #fff;
  border: none;
}
.btn-pimenton:hover {
  background-color: #d98e04;
  color: #fff;
}

/* el footer */
footer {
  background-color: var(--marron-cacao);
  color: var(--crema-claro);
}

.border-cilantro {
  border-color: var(--verde-cilantro) !important;
}
.shadow-suave {
  box-shadow: 0 .5rem 1rem rgba(43, 38, 38, 0.15);
}