.business-bd {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  height: 100%;
  width: 100vw;
  background-image: url('../assets/images/supremecourt.jpg');
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

@supports (background-image: url("image.avif")) {
  .business-bd {
    background-image: url('../assets/images/supremecourt.avif');
  }
}

.section-one {
  display: flex;
  justify-self: center;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 500px;
  font-family: 'Inter', sans-serif;
  font-size: 25px;
  font-weight: 300;
  letter-spacing: 1.2px;
  padding: 20px;
  position: relative;
}

.section-one::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 0;
  background: linear-gradient(135deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.25))
}

.section-one-box {
  z-index: 1;
}

.section-one-text {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 20px;
}

.section-one-text h2 {
  font-size: 80px;
  text-align: center;
  letter-spacing: 1.2px;
  color: whitesmoke;
}

#page-title {
  height: fit-content;
  border-bottom: 2px solid #dcdcdc;
  padding-bottom: 35px;
}

.section-one-text p {
  font-family: 'Noto Serif', serif;
  font-size: 25px;
  font-weight: 500;
  white-space: nowrap;
  letter-spacing: 1.5px;
  font-style: italic;
  color: whitesmoke;
}


.section-two,
.section-three,
.section-four {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 500px;
  width: 100vw;
  background-color: #333;
  font-family: 'Inter', sans-serif;
}

.section-two-icon,
.section-three-icon,
.section-four-icon {
  display: flex;
  justify-content: center;
  align-items: center;
  flex: 1;
  align-self: stretch;
}

.section-two-icon svg,
.section-three-icon svg,
.section-four-icon svg {
  height: 105px;
  fill: whitesmoke;
}

.big-txt {
  font-size: 25px;
}

.section-three-icon svg {
  fill: #333;
}

.section-two-text,
.section-three-text,
.section-four-text {
  color: whitesmoke;
  flex: 2;
  line-height: 30px;
  font-size: 20px;
  font-weight: 300;
  padding: 30px;
  align-self: stretch;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.section-two-text p,
.section-three-text p,
.section-four-text p {
  margin: 15px 0;
}

.section-two-text h2,
.section-three-text h2,
.section-four-text h2 {
  margin: 0;
  padding: 20px;
  font-size: 40px;
  border-left: 2px solid whitesmoke;
  line-height: 40px;
}

.section-three-text h2 {
  border-left: 2px solid #333;
}

.section-three {
  background-color: whitesmoke;
}

.section-three-text {
  color: #333;
}

.section-three-text .color,
.section-three-text .specialties li {
  color: #333;
  list-style: decimal;
}

.section-three-text .specialties li::marker {
  color: #333;
  font-weight: 500;
}

.specialties li h3 {
  font-style: normal;
  color: #333;
}

@media (min-width: 768px) and (max-width: 1199px) {

  #page-title {
    font-size: clamp(45px, 6vw, 80px);
  }

  .section-one-text p {
    font-size: clamp(18px, 2.5vw, 32px);
    white-space: normal;
    text-align: center;
  }

  .section-two-text, .section-three-text, .section-four-text {
    flex: 3;
  }

  .section-two-icon svg, .section-three-icon svg, .section-four-icon svg {
    width: 100px;
  }

}

@media (max-width: 767px) {

  #page-title {
    font-size: clamp(38px, 6vw, 80px);
  }

  .section-one {
    height: 350px;
  }

  .section-one-text p {
    font-size: clamp(18px, 2.5vw, 32px);
    white-space: normal;
    text-align: center;
  }

  .section-two, .section-three, .section-four {
    flex-direction: column;
    max-height: fit-content;
  }

  .section-two-text, .section-three-text, .section-four-text {
    height: fit-content;
    flex: none;
    padding: 15px;
  }

  .section-two-icon svg, .section-three-icon svg, .section-four-icon svg {
    width: 75px;
    height: 75px;
  }

  .section-two-icon, .section-three-icon, .section-four-icon {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 150px;
    align-self: normal;
    flex: none;
  }
}