.page-id-17 .brian-about-v3 {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

.page-id-17 .brian-about-v3 .brian-about-statement {
  max-width: 1280px;
  color: #777777;
  text-transform: uppercase;
  text-wrap: balance;
}

.page-id-17 .brian-about-v3 .brian-about-statement .brian-word {
  color: #777777;
  transition: color .24s ease-out;
}

.page-id-17 .brian-about-v3 .brian-about-statement .brian-word.is-lit {
  color: #FAFAFA;
}

.page-id-17 .brian-about-v3 .brian-about-gallery {
  --brian-drift: 0px;
  display: flex;
  align-items: center;
  gap: clamp(12px, 1.5vw, 22px);
  width: max-content !important;
  max-width: none !important;
  height: clamp(350px, 38vw, 570px);
  margin: 0 0 0 50% !important;
  transform: translate3d(calc(-50% + var(--brian-drift)), 0, 0);
  will-change: transform;
}

.page-id-17 .brian-about-v3 .brian-about-frame {
  flex: 0 0 auto;
  margin: 0;
  overflow: hidden;
  border-radius: 12px;
  aspect-ratio: 4 / 5;
  background: #101010;
  box-shadow: 0 18px 38px rgb(0 0 0 / 25%);
}

.page-id-17 .brian-about-v3 .brian-about-frame img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.page-id-17 .brian-about-v3 .brian-about-frame-1,
.page-id-17 .brian-about-v3 .brian-about-frame-6 {
  width: clamp(240px, 29vw, 430px);
}
.page-id-17 .brian-about-v3 .brian-about-frame-2,
.page-id-17 .brian-about-v3 .brian-about-frame-5 {
  width: clamp(165px, 20vw, 290px);
}
.page-id-17 .brian-about-v3 .brian-about-frame-3,
.page-id-17 .brian-about-v3 .brian-about-frame-4 {
  width: clamp(125px, 14vw, 215px);
}

.page-id-17 .brian-about-v3 .brian-about-frame-1 { transform: translateY(-16px) rotate(-2.5deg); }
.page-id-17 .brian-about-v3 .brian-about-frame-2 { transform: translateY(24px) rotate(1.8deg); }
.page-id-17 .brian-about-v3 .brian-about-frame-3 { transform: translateY(-23px) rotate(-1.5deg); }
.page-id-17 .brian-about-v3 .brian-about-frame-4 { transform: translateY(17px) rotate(1.5deg); }
.page-id-17 .brian-about-v3 .brian-about-frame-5 { transform: translateY(-13px) rotate(-1.7deg); }
.page-id-17 .brian-about-v3 .brian-about-frame-6 { transform: translateY(14px) rotate(2.5deg); }

.page-id-17 .brian-about-v3 .brian-about-caption {
  text-align: center;
}

@media (max-width: 781px) {
  .page-id-17 .brian-about-v3 { padding-block: 72px 64px !important; }
  .page-id-17 .brian-about-v3 .brian-about-statement {
    margin-bottom: 52px !important;
    font-size: clamp(33px, 7.5vw, 52px) !important;
    line-height: 1.08 !important;
  }
  .page-id-17 .brian-about-v3 .brian-about-gallery {
    height: 330px;
    gap: 11px;
  }
  .page-id-17 .brian-about-v3 .brian-about-frame-1,
  .page-id-17 .brian-about-v3 .brian-about-frame-6 { width: 190px; }
  .page-id-17 .brian-about-v3 .brian-about-frame-2,
  .page-id-17 .brian-about-v3 .brian-about-frame-5 { width: 145px; }
  .page-id-17 .brian-about-v3 .brian-about-frame-3,
  .page-id-17 .brian-about-v3 .brian-about-frame-4 { width: 118px; }
}

@media (prefers-reduced-motion: reduce) {
  .page-id-17 .brian-about-v3 .brian-about-statement .brian-word { transition: none; }
  .page-id-17 .brian-about-v3 .brian-about-gallery { transform: translate3d(-50%, 0, 0); }
}