.about-main {
  overflow: hidden;
  background: var(--white);
}

.about-intro {
  background: var(--green);
  color: var(--white);
}

.about-intro__header {
  display: flex;
  flex-direction: column;
  margin-bottom: var(--section-label-gap);
}

.about-intro__header .eyebrow {
  margin: var(--section-label-gap) 0 0;
}

.about-intro__header h1 {
  order: -1;
  color: var(--white);
  text-align: center;
}

.about-intro__gallery {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: calc(var(--edge) / 2);
}

.about-intro__gallery figure,
.about-video,
.about-history__slide figure,
.about-facility,
.about-why__group figure,
.about-team__image,
.about-closing-image {
  overflow: hidden;
  margin: 0;
}

.about-intro__gallery figure {
  aspect-ratio: 304 / 436;
}

.about-intro__gallery img,
.about-video img,
.about-history__slide img,
.about-facility > img,
.about-why__group figure img,
.about-team__image img,
.about-closing-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.about-intro__statement {
  margin-top: var(--section-cta-gap);
  font-family: "jaf-lapture", Georgia, serif;
  font-size: 38px;
  font-weight: 400;
  line-height: 1.32;
}

.about-intro__statement p + p {
  margin-top: var(--section-label-gap);
}

.about-intro__highlights {
  display: grid;
  margin-top: var(--section-pad-bottom);
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--section-label-gap);
}

.about-highlight {
  min-width: 0;
}

.about-highlight__value {
  color: var(--mid-green);
}

.about-highlight > p:last-child {
  color: var(--white);
}

.about-video {
  margin-top: var(--section-cta-gap);
  aspect-ratio: 16 / 9;
}

.about-video__open {
  position: relative;
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}

.about-video__open::after {
  position: absolute;
  inset: 0;
  background: rgb(var(--black-rgb) / 0.12);
  content: "";
  transition: background var(--ease);
}

.about-video__open:hover::after,
.about-video__open:focus-visible::after {
  background: rgb(var(--black-rgb) / 0.24);
}

.about-video__open:focus-visible {
  outline: 2px solid var(--lime);
  outline-offset: 4px;
}

.about-video .play-button {
  z-index: 1;
}

.about-history {
  background: var(--white);
}

.about-history__header {
  display: grid;
  margin-bottom: var(--section-pad-top);
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: var(--section-cta-gap);
}

.about-history__controls {
  display: flex;
  justify-content: flex-end;
  margin-bottom: var(--section-label-gap);
  gap: 10px;
}

.about-history__intro {
  grid-column: 2;
  grid-row: 1 / 3;
}

.about-round-control {
  display: grid;
  width: 48px;
  height: 48px;
  padding: 0;
  place-items: center;
  border: 1px solid var(--black);
  border-radius: 50%;
  background: transparent;
  color: var(--black);
  cursor: pointer;
  transition: background var(--ease), color var(--ease), opacity var(--ease);
}

.about-round-control svg {
  width: 17px;
  height: 17px;
}

.about-round-control:hover,
.about-round-control:focus-visible {
  background: var(--black);
  color: var(--white);
  outline: 0;
}

.about-round-control:focus-visible {
  box-shadow: 0 0 0 2px var(--white), 0 0 0 3px var(--lime);
}

.about-round-control.swiper-button-disabled,
.about-round-control:disabled {
  opacity: 0.3;
  pointer-events: none;
}

.about-history__prev svg,
.about-facilities__prev svg {
  transform: rotate(180deg);
}

.about-history__intro {
  padding-top: var(--section-label-gap);
}

.about-history__intro p + p {
  margin-top: var(--section-label-gap);
}

.about-history__swiper {
  --history-gap: 32px;
  container-type: inline-size;
  overflow: visible;
  cursor: grab;
}

.about-history__swiper:active { cursor: grabbing; }

@media (max-width: 767px) {
  .about-history__swiper { --history-gap: 16px; }
}

.about-history__slide {
  width: min(400px, 60%);
  height: auto;
}

.about-history__slide.swiper-slide-active,
.about-history__slide--measure {
  width: min(640px, 80%);
}

.about-history__slide--measure {
  position: absolute;
  top: 0;
  visibility: hidden;
  pointer-events: none;
}

.about-history__swiper.is-ready .about-history__slide {
  transition: width var(--ease);
}

@media (prefers-reduced-motion: reduce) {
  .about-history__swiper.is-ready .about-history__slide {
    transition: none;
  }
}

.about-history__slide header {
  position: relative;
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-bottom: var(--section-label-gap);
}

.about-history__slide header::before {
  box-sizing: border-box;
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  align-self: center;
  padding: 2px;
  border: 2px solid color-mix(in srgb, var(--muted) 25%, var(--white));
  border-radius: 50%;
  background-color: color-mix(in srgb, var(--muted) 25%, var(--white));
  background-clip: content-box;
  content: "";
}

.about-history__slide:not(:last-child) header::after {
  position: absolute;
  left: 8px;
  bottom: calc(-1 * var(--section-label-gap) / 2);
  width: calc(100% + var(--history-gap));
  height: 1px;
  background: color-mix(in srgb, var(--muted) 30%, var(--white));
  pointer-events: none;
  content: "";
}

.about-history__slide.swiper-slide-active header::before {
  background-color: var(--lime);
}

.about-history__slide header p {
  color: var(--muted);
}

.about-history__slide figure {
  aspect-ratio: 640 / 390;
  background: var(--white);
}

.about-history__slide-copy {
  display: none;
  width: min(640px, 80cqw);
  padding-top: var(--section-label-gap);
}

.about-history__swiper.is-ready .swiper-slide-active .about-history__slide-copy {
  animation: about-history-copy-in 240ms ease-out 180ms both;
}

@keyframes about-history-copy-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .about-history__swiper.is-ready .swiper-slide-active .about-history__slide-copy {
    animation: none;
  }
}

.about-history__slide.swiper-slide-active .about-history__slide-copy,
.about-history__slide--measure .about-history__slide-copy {
  display: block;
}

.about-facilities {
  background: var(--white);
}

.about-facilities__swiper {
  position: relative;
}

.about-facility {
  position: relative;
  aspect-ratio: 16 / 9;
  background: var(--green);
}

.about-facility::after {
  position: absolute;
  inset: 0;
  background: rgb(var(--black-rgb) / 0.2);
  content: "";
}

.about-facility h2 {
  position: absolute;
  z-index: 1;
  top: 50%;
  right: calc(var(--edge) + 52px);
  left: calc(var(--edge) + 52px);
  transform: translateY(-50%);
  text-align: center;
  color: var(--white);
}

.about-facilities__prev,
.about-facilities__next {
  position: absolute;
  z-index: 2;
  top: 50%;
  border-color: var(--white);
  color: var(--white);
  transform: translateY(-50%);
}

.about-facilities__prev {
  left: var(--edge);
}

.about-facilities__next {
  right: var(--edge);
}

.about-facilities__prev:hover,
.about-facilities__prev:focus-visible,
.about-facilities__next:hover,
.about-facilities__next:focus-visible {
  background: var(--white);
  color: var(--black);
}

.about-facilities__pagination {
  position: absolute;
  z-index: 2;
  right: var(--edge) !important;
  bottom: var(--edge) !important;
  left: auto !important;
  width: auto !important;
}

.about-why {
  background: var(--white);
}

.about-why__header {
  margin-bottom: var(--section-label-gap);
}

.about-why__groups {
  display: flex;
  flex-direction: column;
  gap: var(--section-pad-top);
}

.about-why__group {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  align-items: center;
}

.about-why__group--reverse {
  grid-template-columns: repeat(12, minmax(0, 1fr));
}

.about-why__group figure {
  min-height: 0;
  aspect-ratio: 732 / 776;
  grid-column: 6 / -1;
  grid-row: 1;
}

.about-why__group--reverse figure {
  grid-column: 1 / 8;
}

.about-why__points {
  position: relative;
  z-index: 1;
  padding: var(--section-pad-top) var(--section-cta-gap);
  grid-column: 1 / 7;
  grid-row: 1;
  background: var(--off-white);
}

.about-why__group--reverse .about-why__points {
  grid-column: 7 / -1;
}

.about-why__point + .about-why__point {
  margin-top: var(--section-cta-gap);
}

.about-why__number {
  margin-bottom: calc(var(--section-label-gap) / 2);
  color: var(--muted);
}

.about-why__point h3 {
  margin-bottom: calc(var(--section-label-gap) / 2);
}

.about-team {
  background: var(--off-white);
}

.about-team > .shell {
  width: min(calc(100% - 2 * var(--edge)), var(--shell-wide));
}

.about-team__header {
  display: grid;
  max-width: var(--shell);
  margin: 0 auto var(--section-cta-gap);
  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
  gap: var(--section-cta-gap);
}

.about-team__roles {
  display: grid;
  padding-top: var(--section-label-gap);
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 4px 28px;
}

.about-team__gallery {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--section-label-gap);
}

.about-team__image {
  aspect-ratio: 414 / 500;
}

.about-team__image:nth-child(6n + 1),
.about-team__image:nth-child(6n) {
  grid-column: span 2;
  aspect-ratio: 880 / 500;
}

.about-team__image.is-rounded {
  border-radius: var(--media-radius);
}

.about-closing-image {
  height: min(62vw, 760px);
  min-height: 480px;
}

.about-video-dialog {
  position: fixed;
  z-index: 120;
  inset: 0;
  display: grid;
  padding: 32px;
  place-items: center;
}

.about-video-dialog__backdrop {
  position: absolute;
  inset: 0;
  background: rgb(var(--black-rgb) / 0.82);
  opacity: 0;
  transition: opacity var(--ease);
}

.about-video-dialog__content {
  position: relative;
  z-index: 1;
  width: min(1180px, 100%);
  opacity: 0;
  transform: translateY(18px) scale(0.98);
  transition: opacity var(--ease), transform var(--ease);
}

.about-video-dialog[data-state="open"] .about-video-dialog__backdrop,
.about-video-dialog[data-state="open"] .about-video-dialog__content {
  opacity: 1;
  transform: none;
}

.about-video-dialog__frame {
  aspect-ratio: 16 / 9;
  background: var(--black);
}

.about-video-dialog__frame iframe {
  width: 100%;
  height: 100%;
  border: 0;
}

.about-video-dialog__close {
  position: absolute;
  z-index: 2;
  top: -50px;
  right: 0;
  color: var(--white);
}

body.about-video-open {
  overflow: hidden;
}

@media (max-width: 900px) {
  .about-history__controls,
  .about-history__intro {
    grid-column: auto;
    grid-row: auto;
  }

  .about-history__header,
  .about-team__header {
    grid-template-columns: 1fr;
    gap: var(--section-cta-gap);
  }

  .about-history__intro,
  .about-team__roles {
    padding-top: 0;
  }

}

@media (max-width: 767px) {
  .about-intro__header {
    margin-bottom: var(--section-cta-gap);
  }

  .about-intro__header .eyebrow {
    margin: 0 0 var(--section-label-gap);
  }

  .about-intro__header h1 {
    order: 0;
    text-align: left;
  }

  .about-intro__gallery {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: calc(var(--section-label-gap) / 2);
  }

  .about-intro__gallery figure {
    aspect-ratio: 174 / 246;
  }

  .about-intro__statement {
    margin-top: var(--section-cta-gap);
    font-size: 23px;
    line-height: 1.35;
  }

  .about-intro__highlights {
    margin-top: var(--section-cta-gap);
    grid-template-columns: 1fr;
    gap: var(--section-label-gap);
  }

  .about-video {
    margin-top: var(--section-cta-gap);
    aspect-ratio: 1;
  }

  .about-history__header,
  .about-why__header,
  .about-team__header {
    margin-bottom: var(--section-cta-gap);
  }

  .about-why {
    padding-bottom: 0;
  }

  .about-history__slide,
  .about-history__slide.swiper-slide-active,
  .about-history__slide--measure {
    width: 82%;
  }

  .about-history__swiper.is-ready .about-history__slide {
    transition: none;
  }

  .about-history__slide-copy {
    width: 100%;
  }

  .about-facility {
    aspect-ratio: 1;
  }

  .about-facility h2 {
    right: var(--edge);
    left: var(--edge);
    overflow-wrap: anywhere;
  }

  .about-facilities__prev,
  .about-facilities__next {
    display: none;
  }

  .about-why__groups {
    gap: var(--section-pad-top);
  }

  .about-why__group,
  .about-why__group--reverse {
    display: flex;
    flex-direction: column;
  }

  .about-why__points,
  .about-why__group--reverse .about-why__points {
    width: 100%;
    margin-bottom: calc(-1 * var(--section-pad-top));
    padding: var(--section-cta-gap);
    transform: none;
  }

  .about-why__group figure {
    width: calc(100% + 2 * var(--edge));
    min-height: 0;
    aspect-ratio: 0.95;
  }

  .about-why__point + .about-why__point {
    margin-top: var(--section-cta-gap);
  }

  .about-team__roles {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 4px 16px;
  }

  .about-team__gallery {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--section-label-gap);
  }

  .about-team__image:nth-child(n) {
    grid-column: span 1;
    aspect-ratio: 174 / 246;
  }

  .about-team__image:nth-child(3n + 1) {
    grid-column: 1 / -1;
    aspect-ratio: 361 / 246;
  }

  .about-closing-image {
    height: 82vw;
    min-height: 360px;
  }

  .about-video-dialog {
    padding: 16px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .about-video-dialog__backdrop,
  .about-video-dialog__content {
    transition: none;
  }
}
