#about-blurb {
  width: min((18ch + 1rem) * 5, 95%);
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}
#about-blurb > div {
  flex: 1 1 0;
  text-align: center;
}

#offer-showcase {
  height: fit-content;
}
#offer-showcase .col {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  container-type: inline-size;
}
#offer-showcase .offers {
  display: grid;
  grid-template-columns: repeat(4, minmax(min(25ch, 50%), 1fr));
}
#offer-showcase .offers > img {
  width: 100%;
  aspect-ratio: 1/1;
}
@container (width < calc(25ch * 4)) {
  #offer-showcase .offers {
    grid-template-columns: repeat(2, minmax(min(25ch, 50%), 1fr));
  }
}

#card-explainers {
  width: min((18ch + 1rem) * 5, 95%);
}
#card-explainers button {
  aspect-ratio: 1/1;
}
#card-explainers {
  text-align: center;
}
#card-explainers .card-grid {
  margin: auto;
  max-width: 100%;
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(auto-fit, minmax(min(18ch, 100%), 1fr));
}
@container (width < calc(18ch * 5)) {
  #card-explainers .card-grid {
    grid-template-columns: repeat(2, minmax(min(18ch, 50%), 1fr));
  }
}
@container (width < calc(18ch * 2)) {
  #card-explainers .card-grid {
    grid-template-columns: repeat(1, minmax(min(18ch, 50%), 1fr));
  }
}
#card-explainers .card.expandable {
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: inherit;
  interpolate-size: allow-keywords;
  transition: all 150ms ease;
}
#card-explainers .card.expandable > .expanded {
  display: none;
  transition-behavior: allow-discrete;
  transition-property: all;
  transition-duration: 150ms;
  transition-timing-function: ease;
}
#card-explainers .card.expandable > .expanded.active {
  display: block;
}

#bios {
  width: min((18ch + 1rem) * 5, 95%);
}
#bios img {
  height: auto;
  max-width: 33%;
  box-shadow: 0px 0px 16px -2px #303030;
}
#bios p {
  width: 67%;
  padding: 1rem;
}
#bios #as-bio,
#bios #dp-bio {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
#bios #as-bio span,
#bios #dp-bio span {
  color: #316e93;
}
#bios #as-bio {
  flex-direction: row-reverse;
}
#bios #dp-bio {
  flex-direction: row;
}

.social-showcase h3 {
  text-align: center;
}
.social-showcase .social-grid {
  margin: auto;
  width: min((18ch + 2rem) * 4, 100%);
  gap: 2rem;
  justify-content: center;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(16ch, 100%), 0.25fr));
  text-align: center;
  height: inherit;
}
.social-showcase .social-grid .social-card {
  height: inherit;
}
.social-showcase .social-grid .social-card:has(> a > img:not([src$=".svg"])) {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
}
.social-showcase .social-grid .social-card:has(> a > img:not([src$=".svg"])) p {
  position: relative;
  bottom: 0;
}
.social-showcase .social-grid a,
.social-showcase .social-grid img {
  max-width: 100%;
  height: inherit;
}
.social-showcase .social-grid p {
  bottom: 0;
}

@media (max-width: 991px) {
  #about-blurb {
    flex-direction: column;
  }
  #bios #as-bio,
  #bios #dp-bio {
    flex-direction: column;
  }
  #bios p {
    width: 100%;
  }
}

/*# sourceMappingURL=about.css.map */