/* RESET BASICO*/
*{
  margin: 0;
  padding: 0;
  box-sizing: 0;  
}

html, body {
    height: 100%;
    font-family: "Inter", system-ui, -apple-system, sans-serif;
    letter-spacing: 0.2px;
    -webkit-font-smoothing: antialiased;
    background-color: #629FAD;
    color: #fff;
    scroll-behavior: smooth;
}

/* Botones */

.btn{
    display: inline-block;
    padding: 12px 26px;
    border-radius: 30px;
    background: #fff;
    color: #000;
    text-decoration: none;
    font-weight: 600;
    font-size: 14px;
    transition: all .25s ease;
}

.btn:hover {
    background: #e6e6e6;
    transform: translateY(-1px);
}

/* IMÁGENES */

.panel.shop {
  background-image: url("../assets/images/shop-hero.jpg");
}

.panel.donate {
  background-image: url("../assets/images/donate-hero.jpg");
}

.panel.partner {
  background-image: url("../assets/images/panel-partner.jpg");
}

/* RESPONSIVE */
@media (max-width: 900px) {
  .hero {
    flex-direction: column;
  }

  .panel {
    height: 33.33vh;
  }

  .panel:hover {
    flex: 1;
  }
}