/*
=============== 
Hero
===============
*/
.hero {
    min-height: 100vh;
    background: var(--clr-primary-55);
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .hero-banner {
    text-align: center;
    color: var(--clr-white);
    padding: 0 3rem;
  }
  .hero-banner h1 {
    text-transform: uppercase;
  }
  .hero-banner p {
    max-width: 35rem;
    margin-left: auto;
    margin-right: auto;
    color: var(--clr-white);
    letter-spacing: var(--spacing);
  }
  .hero-btn {
    padding: 0.9rem 1.6rem;
    font-size: 1.25rem;
    background: var(--clr-white);
    color: var(--clr-primary-5);
  }
  .hero-btn:hover {
    background: transparent;
    color: var(--clr-white);
    border-color: var(--clr-white);
  }
  @media screen and (min-width: 768px) {
    .hero {
      background: linear-gradient(rgb(44, 174, 186, 0.7), rgba(0, 0, 0, 0.7)),
        url("../images/aeropuerto.jpg") center/cover no-repeat;
    }
    .hero-banner {
      padding: 0;
    }
    .hero-banner p {
      max-width: 45rem;
    }
  }