.team-members {
  padding-bottom: 80px;
}
.team-members.grid-primary {
  overflow: hidden;
  --line-offset: calc(var(--pm) / 2);
  --line-thickness: 1px;
  --line-color: var(--strokePrimary);
  row-gap: calc(var(--pm) * 2);
}
.team-members article.person {
  grid-column: span 3;
  position: relative;
  cursor: pointer;
}
.team-members article.person .aspectholder {
  overflow: hidden;
  border-radius: 8px;
  height: 436px;
  min-height: 54svh;
  margin-bottom: 16px;
}
.team-members article.person .aspectholder img {
  height: 100%;
  object-fit: cover;
}
.team-members article.person .more-btn {
  padding-top: 80px;
}
.team-members article.person::before {
  content: "";
  position: absolute;
  background-color: var(--line-color);
  z-index: 1;
  inline-size: var(--line-thickness);
  block-size: 100%;
  inset-inline-start: calc(var(--line-offset) * -1);
}
.team-members article.person h4,
.team-members article.person h5,
.team-members article.person p {
  transition: var(--transPrimary);
}
.team-members article.person:hover h4,
.team-members article.person:hover h5,
.team-members article.person:hover p {
  opacity: 0.4;
}
@media (max-width: 960px) {
  .team-members.grid-primary {
    column-gap: 32px;
    --line-offset: 16px;
  }
  .team-members article.person {
    grid-column: span 4;
  }
  .team-members article.person .aspectholder {
    height: 50vw;
    min-height: 216px;
  }
  .team-members article.person .more-btn {
    padding-top: 32px;
  }
}

.team-modal {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000;
  width: 100vw;
  height: 100vh;
  pointer-events: none;
}
.team-modal .backdrop-close-btn {
  z-index: 1010;
  background-color: rgba(0, 0, 0, 0.153);
  opacity: 0;
  cursor: pointer;
}
.team-modal button.close-btn-inner {
  position: absolute;
  top: 16px;
  left: var(--pm);
  opacity: 0;
  z-index: 1030;
}
.team-modal .modal-content {
  z-index: 1020;
  height: 100%;
  position: relative;
  background-color: var(--white);
  width: 50vw;
  right: 100%;
  overflow-y: scroll;
}
.team-modal .modal-content .content-inner {
  padding-top: 16px;
  opacity: 0;
}
.team-modal .modal-content .content-inner .row-1 {
  padding-top: 120px;
  display: flex;
}
.team-modal .modal-content .content-inner .row-1 .left,
.team-modal .modal-content .content-inner .row-1 .right {
  width: 50%;
}
.team-modal .modal-content .content-inner .row-1 .left {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.team-modal .modal-content .content-inner .row-1 .left a {
  opacity: 40%;
  transition: var(--transPrimary);
  text-decoration: none;
}
.team-modal .modal-content .content-inner .row-1 .left a:hover {
  opacity: 1;
}
.team-modal .modal-content .content-inner .row-1 .aspectholder {
  overflow: hidden;
  border-radius: 8px;
  width: 100%;
}
.team-modal .modal-content .content-inner .row-1 .aspectholder img {
  width: 100%;
  height: 100%;
}
.team-modal .modal-content .content-inner .row-2 {
  padding-top: 80px;
  padding-bottom: 80px;
}
@media (max-width: 960px) {
  .team-modal .modal-content {
    width: 100%;
  }
  .team-modal .modal-content .content-inner .row-1 {
    flex-wrap: wrap;
    flex-direction: column-reverse;
  }
  .team-modal .modal-content .content-inner .row-1 .left,
  .team-modal .modal-content .content-inner .row-1 .right {
    width: 100%;
  }
  .team-modal .modal-content .content-inner .row-1 .left {
    padding-top: 16px;
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    grid-auto-rows: minmax(min-content, max-content);
    column-gap: var(--pm);
    row-gap: var(--pm);
    width: 100%;
  }
  .team-modal .modal-content .content-inner .row-1 .left .top {
    grid-column: 1/4;
  }
  .team-modal .modal-content .content-inner .row-1 .left .btm {
    grid-column: 4/7;
    --line-offset: calc(var(--pm) / 2);
    --line-thickness: 1px;
    --line-color: var(--strokePrimary);
    position: relative;
    padding-left: var(--pm);
  }
  .team-modal .modal-content .content-inner .row-1 .left .btm a {
    text-decoration: none;
  }
  .team-modal .modal-content .content-inner .row-1 .left .btm::before {
    content: "";
    position: absolute;
    background-color: var(--line-color);
    z-index: 1;
    inline-size: var(--line-thickness);
    block-size: 100%;
    inset-inline-start: calc(var(--line-offset) * -1);
  }
  .team-modal .modal-content .content-inner .row-2 {
    padding-top: 64px;
  }
}

.p-title {
  padding-bottom: 48px;
}

.hr-primary {
  margin: 0 var(--pmNeg);
}

.blurb {
  padding: 24px 0 80px;
}
.blurb .content {
  grid-column: 1/7;
}

.body {
  padding-bottom: 160px;
}
.body .contact-info {
  grid-column: 1/7;
}
.body .contact-info .tel {
  padding-bottom: 16px;
}
.body .contact-info .address-wrap {
  padding-bottom: 32px;
}
.body .contact-info .socials {
  display: flex;
  flex-direction: column;
}
.body .form-wrap {
  grid-column: 7/13;
}

.key-contacts .team-title-wrap {
  display: flex;
  justify-content: space-between;
  align-items: end;
  padding: 24px 0 80px;
}
.key-contacts .team-title-wrap a {
  transition: var(--transPrimary);
}
.key-contacts .team-title-wrap a:hover {
  opacity: 40%;
}
.key-contacts .team-members {
  padding-bottom: 160px;
}

form {
  display: grid;
  grid-template-columns: repeat(8, 1fr);
  grid-auto-rows: minmax(min-content, max-content);
  column-gap: 24px;
  row-gap: 32px;
  width: 100%;
}
form .field-wrap {
  grid-column: 1/-1;
}
form .field-wrap.half {
  grid-column: span 4;
}
form label {
  padding-bottom: 8px;
  display: block;
}
form input,
form textarea,
form select {
  padding: 24px;
  background-color: var(--grey100);
  border-radius: 8px !important;
}
form input::placeholder,
form textarea::placeholder,
form select::placeholder {
  opacity: 40%;
}
form select:invalid {
  color: rgba(0, 0, 0, 0.4);
}
form .btn-wrap {
  padding-top: 15px;
}
form .btn-wrap button {
  border-color: white;
}
form .field-wrap:has(.checkbox) {
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
  gap: 15px;
  justify-content: flex-end;
}
form .field-wrap:has(.checkbox) input {
  width: unset;
  padding: 15px;
  cursor: pointer;
  appearance: none;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
form .field-wrap:has(.checkbox) input:checked::after {
  content: "";
  width: 55%;
  height: 55%;
  background-color: var(--grey500);
  border-radius: 3px;
  position: absolute;
}

@media (max-width: 960px) {
  .p-title {
    padding-bottom: 32px;
  }
  .blurb {
    padding: 24px 0 48px;
  }
  .blurb .content {
    grid-column: 1/-1;
  }
  .body {
    padding-bottom: 80px;
  }
  .body .contact-info,
  .body .form-wrap {
    grid-column: 1/-1;
  }
  form {
    padding-top: 48px;
  }
  form .field-wrap.half {
    grid-column: 1/-1;
  }
  .key-contacts .team-members {
    padding-bottom: 80px;
  }
}