#hero picture {
  display: flex;
  justify-content: center;
  align-items: center;
  border-bottom: 0.1rem solid var(--cyan-primary);
}

#hero img {
  width: 100%;
  height: 100%;
  min-height: 55rem;
  max-height: 800px;
  object-fit: cover;
}

#transformacao {
  padding: 8rem 5%;
  background-image: url("../../images/hbu/hbu-transformacao-bg.png");
  background-position: right top;
  border-bottom: .1rem solid var(--cyan-primary);
}
#transformacao .container {
  text-align: center;
  max-width: 68rem;
  margin: auto;
}
#transformacao .container > h2 {
  font-size: 2rem;
  line-height: 2.8rem;
  margin-bottom: 4rem;
  color: var(--cyan-primary);
}
#transformacao .container > p {
  line-height: 2.4rem;
}
@media (width >= 425px) {
  #transformacao .container > h2 {
    font-size: 2.6rem;
    line-height: 3.2rem;
  }
}

@media (width >= 768px) {
  #transformacao .container > h2 {
    font-size: 3.2rem;
    line-height: 4rem;
  }
  #transformacao .container > p {
    line-height: 3.2rem;
    font-size: 2rem;
  }
}

@media (width >= 1024px) {
  #transformacao {
    padding: 20rem 15%;
  }
  #transformacao .container > h2 {
    font-size: 4.8rem;
    line-height: 5.6rem;
  }
}

@media (width >= 1440px) {
  #transformacao {
    padding: 10rem 15% 30rem;
    background-image: url("../../images/hbu/hbu-transformacao-bg.png");
    background-position: -20rem top;
  }
  #transformacao .container {
    text-align: start;
    margin: 0;
    margin-left: auto;
  }
}

@media (width >= 1600px) {
  #transformacao {
    padding: 14rem 15% 30rem;
    background-position: center top;
  }
  #transformacao .container {
    max-width: 78rem;
  }
  #transformacao .container > p {
    line-height: 4rem;
    font-size: 2.4rem;
  }
}

#hospital-hbu {
  padding: 8rem 5%;
  background-image: url("../../images/hospital-hbu-bg.png");
  background-position: center;
  background-size: cover;
  background-attachment: fixed;
}
#hospital-hbu .container {
  display: grid;
  grid-template-columns: 100%;
  gap: 4rem;
}
#hospital-hbu .hospital-text h2 {
  color: var(--cyan-primary);
  font-size: 3.2rem;
}

#hospital-hbu .hospital-text h3 {
  font-size: 1.8rem;
  font-weight: 500;
  margin-bottom: 4rem;
}
#hospital-hbu .hospital-text h3 + p {
  margin-bottom: 4rem;
}
#hospital-hbu .hospital-text p {
  line-height: 2.4rem;
}

#hospital-hbu .hospital-video {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 60rem;
  max-height: 40rem;
  border-radius: 0.8rem;
  overflow: clip;
  margin: auto;
  box-shadow: 0 0 2.4rem #00000040;
  border: .1rem solid var(--cyan-primary);
}

#hospital-hbu .hospital-video img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

#hospital-hbu .hospital-video iframe {
  display: none;
}

@media (width >= 425px) {
  #hospital-hbu .hospital-text h2 {
    font-size: 4.8rem;
  }
  #hospital-hbu .hospital-text h3 {
    font-size: 2rem;
  }
}
@media (width >= 560px) {
  #hospital-hbu .container {
    gap: 8rem;
  }
}
@media (width >= 920px) {
  #hospital-hbu .container {
    gap: 4rem;
    grid-template-columns: 1fr 1fr;
  }
  #hospital-hbu .hospital-video {
    margin: 0 auto;
    position: sticky;
    top: 14rem;
  }
}
@media (width >= 1440px) {
  #hospital-hbu {
    padding: 8rem 10%;
  }
  #hospital-hbu .hospital-text p {
    line-height: 3.2rem;
    font-size: 2rem;
  }
}