/*
 * Customer Moments wall
 * The fallbacks reproduce the supplied 10 x 3 composition; admin values are
 * injected through the custom properties below.
 */

.pa-customers-page {
  --pa-customers-wall-deep: #292e2e;
  --pa-customers-wall: #3a4040;
  --pa-customers-wall-light: #555a58;
  --pa-customers-paper: #c8c5be;
  --pa-customers-gap-x: clamp(13px, 1.75vw, 24px);
  --pa-customers-gap-y: clamp(19px, 2vw, 27px);
  --pa-customers-ease: cubic-bezier(.2, .72, .18, 1);
  --pa-customers-columns: 10;
  --pa-customers-rows: 3;
  --pa-customers-tablet-columns: 4;
  --pa-customers-mobile-columns: 2;
  --pa-customers-statement-row: 2;
  --pa-customers-statement-start: 4;
  --pa-customers-statement-span: 4;
  --pa-customers-light-x: 50%;
  --pa-customers-light-y: 42%;
  position: relative;
  isolation: isolate;
  display: grid;
  min-width: 0;
  min-height: 100vh;
  min-height: 100svh;
  min-height: 100dvh;
  place-items: center;
  overflow: hidden;
  padding:
    max(70px, env(safe-area-inset-top))
    max(28px, env(safe-area-inset-right))
    max(38px, env(safe-area-inset-bottom))
    max(28px, env(safe-area-inset-left));
  color: #efeee9;
  background:
    radial-gradient(circle 360px at var(--pa-customers-light-x) var(--pa-customers-light-y), rgba(235, 236, 226, .11), transparent 72%),
    radial-gradient(ellipse at 50% -22%, rgba(255, 255, 255, .13), transparent 58%),
    linear-gradient(96deg, rgba(0, 0, 0, .22), transparent 20%, rgba(255, 255, 255, .035) 52%, transparent 76%, rgba(0, 0, 0, .14)),
    linear-gradient(180deg, #454a49 0%, #3c4241 53%, #333939 100%);
}

.pa-customers-page::before {
  position: absolute;
  z-index: -2;
  inset: 0;
  content: "";
  pointer-events: none;
  opacity: .46;
  background:
    linear-gradient(90deg, transparent calc(50% - 1px), rgba(8, 12, 12, .13) 50%, rgba(255, 255, 255, .035) calc(50% + 1px), transparent calc(50% + 2px)),
    linear-gradient(0deg, transparent calc(34% - 1px), rgba(8, 12, 12, .12) 34%, rgba(255, 255, 255, .03) calc(34% + 1px), transparent calc(34% + 2px)),
    linear-gradient(0deg, transparent calc(68% - 1px), rgba(8, 12, 12, .11) 68%, rgba(255, 255, 255, .026) calc(68% + 1px), transparent calc(68% + 2px)),
    repeating-linear-gradient(0deg, transparent 0 31px, rgba(255, 255, 255, .018) 32px, transparent 33px),
    repeating-linear-gradient(90deg, transparent 0 54px, rgba(0, 0, 0, .018) 55px, transparent 57px),
    radial-gradient(circle at 12% 14%, rgba(255, 255, 255, .055) 0 1px, transparent 1.7px),
    radial-gradient(circle at 74% 68%, rgba(0, 0, 0, .08) 0 1px, transparent 1.8px);
  background-size: auto, auto, auto, auto, auto, 19px 23px, 27px 31px;
  mix-blend-mode: soft-light;
}

.pa-customers-page::after {
  position: absolute;
  z-index: 10;
  inset: 0;
  content: "";
  pointer-events: none;
  box-shadow: inset 0 0 145px 24px rgba(4, 9, 9, .53);
}

.pa-customers-page__inner {
  position: relative;
  z-index: 1;
  width: min(1120px, calc(100vw - 64px));
  max-width: none;
  min-width: 0;
  margin-inline: auto;
  padding: 0;
}

.pa-customers-page__breadcrumb {
  display: none !important;
}

/* Compact floating controls; the old hero selector is a migration fallback. */
.pa-customers-toolbar,
.pa-customers-page__hero {
  position: absolute;
  z-index: 12;
  inset-block-start: -56px;
  inset-inline-end: 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  width: auto;
  max-width: min(100%, 520px);
  min-height: 44px;
  margin: 0;
  padding: 0;
  border: 0;
}

.pa-customers-page__hero > div {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.pa-customers-toolbar button,
.pa-customers-toolbar a,
.pa-customers-page__hero button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-width: 44px;
  min-height: 44px;
  margin: 0;
  padding: 0 14px;
  border: 1px solid rgba(241, 238, 228, .25);
  border-radius: 7px;
  color: #f1eee4;
  background: rgba(14, 20, 20, .55);
  box-shadow: 0 5px 16px rgba(2, 6, 6, .16), inset 0 1px 0 rgba(255, 255, 255, .06);
  font: inherit;
  font-size: 11px;
  font-weight: 850;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  transition: border-color .2s ease, background-color .2s ease, opacity .2s ease;
}

.pa-customers-toolbar button:hover,
.pa-customers-toolbar a:hover,
.pa-customers-page__hero button:hover {
  border-color: rgba(241, 238, 228, .42);
  color: #fff;
  background: rgba(14, 20, 20, .68);
}

.pa-customers-toolbar button:disabled,
.pa-customers-page__hero button:disabled {
  opacity: .56;
  cursor: wait;
}

.pa-customers-toolbar [hidden],
.pa-customers-page__hero [hidden] {
  display: none !important;
}

.pa-customers-toolbar button:focus-visible,
.pa-customers-toolbar a:focus-visible,
.pa-customers-page__hero button:focus-visible,
.pa-customer-moment--photo a:focus-visible {
  outline: 3px solid rgba(255, 255, 255, .62);
  outline-offset: 3px;
}

/* Concrete baseline values precede the editable custom-property layer so
 * older engines and upgraded installations retain the reference geometry. */
.pa-customers-statement {
  grid-column: 4 / 8;
}

.pa-customers-gallery {
  position: relative;
  z-index: 1;
  display: grid;
  direction: ltr;
  width: 100%;
  min-width: 0;
  grid-template-columns: repeat(10, minmax(0, 1fr));
  grid-template-columns: repeat(var(--pa-customers-columns, 10), minmax(0, 1fr));
  grid-template-rows: repeat(var(--pa-customers-rows, 3), auto);
  column-gap: var(--pa-customers-gap-x);
  row-gap: var(--pa-customers-gap-y);
  align-items: start;
  perspective: 1200px;
  transition: opacity .18s ease;
}

.pa-customers-gallery.is-shuffling {
  opacity: .64;
}

.pa-customer-moment {
  --pa-customer-ratio-resolved: var(--pa-customer-ratio, var(--ratio, .78));
  position: relative;
  isolation: isolate;
  direction: rtl;
  align-self: start;
  width: 100%;
  min-width: 0;
  height: auto;
  aspect-ratio: var(--pa-customer-ratio-resolved);
  margin: 0;
  padding: 0;
  overflow: visible;
  border: 0;
  border-radius: 0;
  color: #deddd5;
  background: transparent;
  transform: rotate(var(--pa-customer-tilt, 0deg));
  transform-origin: 50% 55%;
  box-shadow:
    .7px 1px .8px rgba(3, 7, 7, .78),
    1.7px 2.6px 1.8px -1px rgba(3, 7, 7, .62),
    3.8px 5.8px 6.5px -2.5px rgba(3, 7, 7, .5),
    7px 10.5px 14px -7px rgba(2, 5, 5, .5);
  transition: filter .22s ease, opacity .22s ease, box-shadow .22s ease;
}

.pa-customer-moment::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  content: "";
  pointer-events: none;
  transform: translate3d(1.05px, 1.65px, -1px);
  background: linear-gradient(138deg, #777b77 0%, #3c4240 17%, #171d1c 62%, #0a0f0f 100%);
  box-shadow:
    0 .55px 0 rgba(255, 255, 255, .09) inset,
    -.5px 0 0 rgba(255, 255, 255, .04) inset,
    .65px 0 0 rgba(0, 0, 0, .72),
    0 .7px 0 rgba(0, 0, 0, .78);
}

.pa-customer-moment::after {
  position: absolute;
  z-index: 4;
  inset: 0;
  content: "";
  pointer-events: none;
  opacity: .2;
  background:
    radial-gradient(circle at 24% 17%, rgba(255, 255, 255, .16) 0, rgba(255, 255, 255, .045) 13%, transparent 35%),
    linear-gradient(128deg, rgba(255, 255, 255, .09), transparent 18%, transparent 76%, rgba(255, 255, 255, .018)),
    linear-gradient(180deg, rgba(255, 255, 255, .035), transparent 25%, transparent 78%, rgba(0, 0, 0, .075));
  transition: opacity .2s ease;
}

@media (hover: hover) and (pointer: fine) {
  .pa-customer-moment:hover {
    filter: brightness(1.012);
  }

  .pa-customer-moment:hover::after {
    opacity: .27;
  }
}

.pa-customer-moment--photo {
  background: #777c79;
  box-shadow:
    .7px 1px .8px rgba(3, 7, 7, .78),
    1.7px 2.6px 1.8px -1px rgba(3, 7, 7, .62),
    3.8px 5.8px 6.5px -2.5px rgba(3, 7, 7, .5),
    7px 10.5px 14px -7px rgba(2, 5, 5, .5),
    inset 0 .45px .2px rgba(255, 255, 255, .22),
    inset .4px 0 .2px rgba(255, 255, 255, .08),
    inset 0 -.55px .25px rgba(0, 0, 0, .43),
    inset -.5px 0 .2px rgba(0, 0, 0, .26);
}

.pa-customer-moment--photo > a,
.pa-customer-moment--photo > a > img,
.pa-customer-moment--photo > img {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100%;
  min-width: 0;
}

.pa-customer-moment--photo > a {
  overflow: hidden;
  color: inherit;
  background: #777c79;
  text-decoration: none;
}

.pa-customer-moment--photo > a > img,
.pa-customer-moment--photo > img {
  object-fit: cover;
  object-position: var(--pa-customer-focal-x, 50%) var(--pa-customer-focal-y, 50%);
  filter: grayscale(1) sepia(.035) saturate(.24) contrast(1.17) brightness(.91);
  transform: none;
}

.pa-customer-moment__placeholder {
  position: absolute;
  z-index: 0;
  inset: 0;
  display: grid;
  overflow: hidden;
  place-items: center;
  padding: 22%;
  background:
    radial-gradient(circle at 50% 42%, rgba(255, 255, 255, .09), transparent 61%),
    linear-gradient(145deg, #222a29, #141a1a);
  box-shadow:
    inset 0 .45px .2px rgba(255, 255, 255, .15),
    inset 0 -.55px .25px rgba(0, 0, 0, .4);
}

.pa-customer-moment__placeholder::after {
  position: absolute;
  inset: 0;
  content: "";
  pointer-events: none;
  opacity: .16;
  background: repeating-linear-gradient(0deg, rgba(255, 255, 255, .045) 0 1px, transparent 1px 3px);
  mix-blend-mode: overlay;
}

.pa-customer-moment__placeholder img {
  position: relative;
  z-index: 1;
  display: block;
  width: min(100%, 74px);
  max-height: 68%;
  height: auto;
  object-fit: contain;
  opacity: .68;
  filter: grayscale(1) brightness(1.72) contrast(1.04);
}

.pa-customer-moment--photo.is-empty .pa-customer-moment__placeholder,
.pa-customer-moment--photo.is-filler .pa-customer-moment__placeholder {
  z-index: 2;
}

.pa-customer-moment--placard {
  display: grid;
  place-items: center;
  padding: clamp(9px, 1vw, 15px) clamp(7px, .8vw, 12px);
  overflow: visible;
  text-align: center;
}

.pa-customer-moment--placard.is-dark {
  color: #deddd5;
  background:
    linear-gradient(104deg, transparent 0 41%, rgba(255, 255, 255, .022) 48%, transparent 56%),
    radial-gradient(circle at 45% 18%, rgba(255, 255, 255, .055), transparent 31%),
    linear-gradient(145deg, #192020, #0c1212 52%, #222b2a);
}

.pa-customer-moment--placard.is-light {
  color: #565b59;
  background:
    linear-gradient(105deg, transparent 0 38%, rgba(255, 255, 255, .16) 48%, transparent 57%),
    radial-gradient(circle at 42% 22%, rgba(255, 255, 255, .46), transparent 32%),
    linear-gradient(150deg, #d4d0c9, #aaa9a4 58%, var(--pa-customers-paper));
}

.pa-customer-moment--placard > img {
  position: absolute;
  z-index: 2;
  inset-block-end: clamp(5px, .65vw, 9px);
  inset-inline-start: 50%;
  display: block;
  width: clamp(18px, 1.55vw, 23px);
  height: clamp(18px, 1.55vw, 23px);
  object-fit: contain;
  opacity: .74;
  transform: translateX(-50%);
  filter: grayscale(1) contrast(1.08);
  pointer-events: none;
}

[dir="rtl"] .pa-customer-moment--placard > img {
  transform: translateX(50%);
}

.pa-customer-moment--placard.is-dark > img {
  filter: grayscale(1) brightness(1.72) contrast(1.04);
}

.pa-customer-moment--placard p {
  position: relative;
  z-index: 1;
  max-width: 11.5em;
  margin: 0 0 clamp(14px, 1.3vw, 20px);
  color: inherit;
  font-size: clamp(.54rem, .66vw, .72rem);
  font-weight: 800;
  line-height: 1.65;
  letter-spacing: -.02em;
  text-wrap: balance;
  text-shadow: 0 1px 0 rgba(4, 8, 8, .52), 0 -1px 0 rgba(255, 255, 255, .08);
}

.pa-customer-moment--placard.is-light p {
  text-shadow: 0 1px 0 rgba(255, 255, 255, .58);
}

.pa-customers-statement {
  position: relative;
  isolation: isolate;
  display: grid;
  direction: rtl;
  grid-column: var(--pa-customers-statement-start, var(--statement-start, 4)) / span var(--pa-customers-statement-span, var(--statement-span, 4));
  grid-row: var(--pa-customers-statement-row, var(--statement-row, 2));
  place-items: center;
  align-self: stretch;
  width: 100%;
  min-width: 0;
  min-height: 0;
  margin: 0;
  padding: 10px 4px;
  overflow: visible;
  border: 0;
  border-radius: 0;
  color: #f1eee4;
  background: transparent;
  box-shadow: none;
  text-align: center;
}

.pa-customers-statement::before {
  position: absolute;
  z-index: -1;
  inset: 8% -12% 6%;
  content: "";
  pointer-events: none;
  opacity: .7;
  background:
    radial-gradient(ellipse at 50% 45%, rgba(242, 239, 223, .1), transparent 61%),
    radial-gradient(ellipse at 50% 66%, rgba(4, 8, 8, .18), transparent 70%);
  filter: blur(10px);
}

.pa-customers-statement__mirror,
.pa-customers-statement__glint,
.pa-customers-statement__title,
.pa-customers-statement > div > strong {
  margin: 0;
  white-space: normal;
  font-size: clamp(1.6rem, 3vw, 2.28rem);
  font-weight: 900;
  line-height: 1.15;
  letter-spacing: -.035em;
  text-wrap: balance;
}

.pa-customers-statement__mirror,
.pa-customers-statement > div > strong {
  position: relative;
  z-index: 1;
  display: block;
  color: transparent;
  background:
    linear-gradient(180deg, #fffef5 0%, #d9d8cf 13%, #777d7b 27%, #f2efe3 43%, #747a79 50%, #f8f5e8 53%, #b4b4ad 71%, #eceae0 86%, #747a78 100%);
  background-size: 100% 165%;
  background-position: 50% 46%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-stroke: .38px rgba(250, 249, 239, .42);
  filter:
    drop-shadow(-.45px -.5px 0 rgba(255, 255, 255, .32))
    drop-shadow(1px 1.35px 0 rgba(75, 80, 78, .84))
    drop-shadow(2.1px 3px 1.5px rgba(15, 20, 19, .48))
    drop-shadow(4px 6px 5px rgba(7, 11, 11, .28));
}

.pa-customers-statement__title {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

.pa-customers-statement__glint {
  position: absolute;
  z-index: 2;
  inset: 50% auto auto 50%;
  width: 100%;
  color: transparent;
  background:
    radial-gradient(ellipse 25% 145% at var(--pa-customers-mirror-x, 50%) var(--pa-customers-mirror-y, 44%), rgba(255, 255, 255, .72) 0, rgba(255, 255, 255, .28) 19%, rgba(255, 255, 255, .075) 38%, transparent 67%),
    linear-gradient(106deg, transparent 0 40%, rgba(255, 255, 255, .18) 49%, transparent 58% 100%);
  -webkit-background-clip: text;
  background-clip: text;
  opacity: .145;
  transform: translate(-50%, -50%);
  filter: brightness(var(--pa-customers-mirror-brightness, 1)) blur(.16px);
  mix-blend-mode: screen;
  pointer-events: none;
}

.pa-customers-statement > img,
.pa-customers-statement > div > span {
  display: none;
}

.pa-customers-statement > div {
  display: grid;
  width: 100%;
  place-items: center;
}

.pa-customers-page__empty {
  display: grid;
  width: min(100%, 720px);
  min-height: 300px;
  margin-inline: auto;
  padding: 26px;
  place-items: center;
  gap: 12px;
  border: 1px solid rgba(255, 255, 255, .12);
  color: #d0d7d7;
  background: rgba(19, 25, 25, .18);
  text-align: center;
}

.pa-customers-page__empty-frames {
  display: grid;
  width: 100%;
  grid-template-columns: repeat(3, minmax(0, 92px));
  justify-content: center;
  gap: 12px;
}

.pa-customers-page__empty-frames span {
  display: grid;
  aspect-ratio: .78;
  padding: 22%;
  place-items: center;
  background: #1b2222;
  box-shadow: 1px 2px 2px rgba(3, 6, 6, .42), 4px 7px 12px rgba(3, 6, 6, .2);
}

.pa-customers-page__empty-frames img {
  display: block;
  width: 100%;
  height: auto;
  opacity: .7;
  filter: grayscale(1) brightness(1.72);
}

.pa-customers-page__empty strong {
  font-size: 16px;
}

.pa-customers-page__empty small {
  max-width: 480px;
  color: #aeb8b9;
  font-size: 11px;
  line-height: 1.8;
}

@media (max-width: 1023px) {
  .pa-customers-page {
    display: block;
    min-height: 100svh;
    min-height: 100dvh;
    padding:
      max(70px, env(safe-area-inset-top))
      max(20px, env(safe-area-inset-right))
      max(38px, env(safe-area-inset-bottom))
      max(20px, env(safe-area-inset-left));
    overflow: visible;
  }

  .pa-customers-page::after {
    position: absolute;
    box-shadow: inset 0 0 76px 7px rgba(4, 9, 9, .46);
  }

  .pa-customers-page__inner {
    width: min(720px, 100%);
  }

  .pa-customers-toolbar,
  .pa-customers-page__hero {
    inset-block-start: -54px;
  }

  .pa-customers-gallery {
    grid-template-columns: repeat(var(--pa-customers-tablet-columns, 4), minmax(0, 1fr));
    grid-template-rows: none;
    grid-auto-rows: auto;
    column-gap: 14px;
    row-gap: 14px;
    align-items: start;
  }

  .is-pa-customers-masonry .pa-customers-gallery {
    grid-auto-rows: 8px;
  }

  .pa-customer-moment {
    order: 2;
    grid-column: auto;
    grid-row: auto;
    box-shadow:
      .9px 1.3px 1px rgba(3, 7, 7, .76),
      2.1px 3.2px 2.2px -1px rgba(3, 7, 7, .6),
      4.6px 7px 8px -3px rgba(3, 7, 7, .5),
      8.5px 13px 17px -8px rgba(2, 5, 5, .5);
  }

  /* The reference places its full-width statement after the first four
   * panels in compact layouts. Since the statement is the first DOM child,
   * grid ordering recreates that visual sequence without harming semantics. */
  .pa-customer-moment:nth-child(n + 2):nth-child(-n + 5) {
    order: 0;
  }

  .pa-customer-moment::before {
    transform: translate3d(1.35px, 2.1px, -1px);
  }

  .pa-customers-statement {
    order: 1;
    grid-column: 1 / -1;
    grid-row: auto;
    min-height: clamp(118px, 24vw, 160px);
    padding: 24px 10px;
  }

  .pa-customers-statement__mirror,
  .pa-customers-statement__glint,
  .pa-customers-statement__title,
  .pa-customers-statement > div > strong {
    font-size: clamp(2.05rem, 7.1vw, 3.35rem);
  }

  .pa-customer-moment--placard > img {
    width: clamp(22px, 4vw, 28px);
    height: clamp(22px, 4vw, 28px);
  }

  .pa-customer-moment--placard p {
    font-size: clamp(.63rem, 1.55vw, .78rem);
  }
}

@media (max-width: 599px) {
  .pa-customers-page {
    --pa-customers-gap-x: 12px;
    --pa-customers-gap-y: 12px;
    padding-right: max(13px, env(safe-area-inset-right));
    padding-left: max(13px, env(safe-area-inset-left));
  }

  .pa-customers-gallery {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-columns: repeat(var(--pa-customers-mobile-columns, 2), minmax(0, 1fr));
    column-gap: var(--pa-customers-gap-x);
    row-gap: var(--pa-customers-gap-y);
  }

  .pa-customers-toolbar,
  .pa-customers-page__hero {
    inset-inline: 0;
    justify-content: flex-end;
    max-width: 100%;
  }

  .pa-customers-toolbar button,
  .pa-customers-toolbar a,
  .pa-customers-page__hero button {
    max-width: 100%;
    padding-inline: 12px;
  }

  .pa-customers-statement {
    min-height: clamp(112px, 33vw, 148px);
  }

  .pa-customers-statement__mirror,
  .pa-customers-statement__glint,
  .pa-customers-statement__title,
  .pa-customers-statement > div > strong {
    font-size: clamp(1.45rem, 7.8vw, 2.65rem);
  }

  .pa-customer-moment--placard p {
    font-size: clamp(.61rem, 2.65vw, .78rem);
  }
}

@media (max-width: 460px) {
  .pa-customers-page {
    --pa-customers-gap-x: 11px;
    --pa-customers-gap-y: 11px;
    padding-top: max(66px, env(safe-area-inset-top));
    padding-right: max(12px, env(safe-area-inset-right));
    padding-bottom: max(28px, env(safe-area-inset-bottom));
    padding-left: max(12px, env(safe-area-inset-left));
  }

  .pa-customers-toolbar,
  .pa-customers-page__hero {
    inset-block-start: -50px;
  }

  .pa-customers-toolbar button,
  .pa-customers-toolbar a,
  .pa-customers-page__hero button {
    min-height: 44px;
    font-size: 10.5px;
  }

  .pa-customers-statement {
    min-height: clamp(104px, 31vw, 132px);
    padding: 18px 2px;
  }

  .pa-customers-page__empty {
    min-height: 270px;
    padding-inline: 12px;
  }

  .pa-customers-page__empty-frames {
    grid-template-columns: repeat(3, minmax(0, 76px));
    gap: 7px;
  }
}

@media (max-width: 374px) {
  .pa-customers-page {
    --pa-customers-gap-x: 9px;
    --pa-customers-gap-y: 10px;
  }

  .pa-customers-statement__mirror,
  .pa-customers-statement__glint,
  .pa-customers-statement__title,
  .pa-customers-statement > div > strong {
    font-size: clamp(1.42rem, 7.7vw, 1.8rem);
  }
}

@media (orientation: landscape) and (max-height: 500px) and (max-width: 1023px) {
  .pa-customers-page {
    padding-top: max(58px, env(safe-area-inset-top));
    padding-right: max(20px, env(safe-area-inset-right));
    padding-bottom: max(16px, env(safe-area-inset-bottom));
    padding-left: max(20px, env(safe-area-inset-left));
  }

  .pa-customers-page__inner {
    width: min(760px, 100%);
  }

  .pa-customers-toolbar,
  .pa-customers-page__hero {
    inset-block-start: -48px;
  }

  .pa-customers-gallery {
    grid-template-columns: repeat(var(--pa-customers-tablet-columns, 4), minmax(0, 1fr));
  }

  .pa-customers-statement {
    min-height: 94px;
    padding: 14px 6px;
  }

  .pa-customers-statement__mirror,
  .pa-customers-statement__glint,
  .pa-customers-statement__title,
  .pa-customers-statement > div > strong {
    font-size: clamp(1.9rem, 5.3vw, 3.2rem);
  }
}

@supports (-webkit-touch-callout: none) {
  .pa-customers-page {
    min-height: -webkit-fill-available;
  }
}

@supports not ((-webkit-background-clip: text) or (background-clip: text)) {
  .pa-customers-statement__mirror,
  .pa-customers-statement > div > strong {
    color: #e7e5dc;
    background: none;
    -webkit-text-stroke: 0;
  }
}

@media (forced-colors: active) {
  .pa-customers-toolbar button,
  .pa-customers-toolbar a,
  .pa-customers-page__hero button,
  .pa-customer-moment,
  .pa-customers-page__empty {
    border: 1px solid CanvasText;
  }

  .pa-customers-statement__mirror,
  .pa-customers-statement > div > strong {
    color: CanvasText;
    background: none;
    -webkit-text-stroke: 0;
    filter: none;
  }

  .pa-customers-statement__glint,
  .pa-customer-moment::after {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .pa-customers-gallery,
  .pa-customer-moment,
  .pa-customer-moment::after,
  .pa-customers-toolbar button,
  .pa-customers-toolbar a,
  .pa-customers-page__hero button {
    transition: none !important;
  }

  .pa-customer-moment {
    transform: none !important;
  }
}

@media print {
  @page {
    size: landscape;
    margin: 0;
  }

  .pa-customers-page {
    min-height: 100vh;
    padding: 28px;
    background: #3b4140;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  .pa-customers-page__inner {
    width: 96vw;
  }

  .pa-customers-toolbar,
  .pa-customers-page__hero {
    display: none !important;
  }
}

/* v41.49.29 — fixed premium reference wall. The compatibility renderer above
 * remains available when the administrator selects the custom legacy layout. */
@font-face {
  font-family: "Mirror Narrow";
  src: url("../fonts/mirror-narrow.otf") format("opentype");
  font-display: swap;
  font-style: normal;
  font-weight: 700;
}

.pa-customers-page.is-reference-wall {
  --pa-customer-ease: cubic-bezier(.2, .72, .18, 1);
  --pa-customers-tablet-columns: 4;
  --pa-customers-mobile-columns: 2;
  padding:
    max(38px, env(safe-area-inset-top))
    max(32px, env(safe-area-inset-right))
    max(38px, env(safe-area-inset-bottom))
    max(32px, env(safe-area-inset-left));
}

.pa-customers-page.is-reference-wall .pa-customers-toolbar {
  position: fixed;
  inset-block-start: auto;
  inset-block-end: max(18px, env(safe-area-inset-bottom));
  inset-inline-start: auto;
  inset-inline-end: max(18px, env(safe-area-inset-right));
  pointer-events: none;
}

.pa-customers-page.is-reference-wall .pa-customers-toolbar .pa-customers-shuffle {
  width: 44px;
  min-width: 44px;
  height: 44px;
  min-height: 44px;
  padding: 0;
  border-radius: 50%;
  border-color: rgba(241, 238, 228, .24);
  background: rgba(13, 19, 19, .58);
  box-shadow: 0 5px 16px rgba(2, 6, 6, .19), inset 0 1px 0 rgba(255, 255, 255, .07);
  pointer-events: auto;
}

.pa-customers-page.is-reference-wall .pa-customers-shuffle svg {
  width: 19px;
  height: 19px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.65;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform .46s var(--pa-customer-ease);
}

.pa-customers-page.is-reference-wall .pa-customers-shuffle:hover svg,
.pa-customers-page.is-reference-wall .pa-customers-shuffle:focus-visible svg {
  transform: rotate(14deg);
}

.pa-customers-page.is-reference-wall .pa-customers-shuffle:disabled svg {
  animation: pa-customers-shuffle-spin .72s linear infinite;
}

@keyframes pa-customers-shuffle-spin {
  to { transform: rotate(360deg); }
}

.pa-customers-page.is-reference-wall .pa-customers-gallery--reference {
  grid-template-columns: repeat(10, minmax(0, 1fr));
  grid-template-rows: repeat(3, auto);
  align-items: start;
}

.pa-customers-page.is-reference-wall .pa-customer-moment {
  --pa-customer-rx: 0deg;
  --pa-customer-ry: 0deg;
  --pa-customer-lift: 0px;
  grid-column: var(--pa-customer-col);
  grid-row: var(--pa-customer-row);
  aspect-ratio: .78;
  transform:
    perspective(1100px)
    translate3d(0, var(--pa-customer-lift), 0)
    rotateX(var(--pa-customer-rx))
    rotateY(var(--pa-customer-ry))
    rotate(var(--pa-customer-tilt));
  transform-style: preserve-3d;
  backface-visibility: hidden;
  opacity: 1;
  transition:
    transform .48s var(--pa-customer-ease),
    box-shadow .48s var(--pa-customer-ease),
    filter .48s var(--pa-customer-ease),
    opacity .34s var(--pa-customer-ease);
}

.pa-customers-page.is-reference-wall .pa-customer-moment__glint {
  position: absolute;
  z-index: 4;
  inset: 0;
  pointer-events: none;
  opacity: .08;
  background:
    radial-gradient(circle at var(--pa-customer-glint-x, 24%) var(--pa-customer-glint-y, 17%), rgba(255, 255, 255, .4), transparent 34%),
    linear-gradient(128deg, rgba(255, 255, 255, .09), transparent 18%, transparent 76%, rgba(255, 255, 255, .018)),
    linear-gradient(180deg, rgba(255, 255, 255, .035), transparent 25%, transparent 78%, rgba(0, 0, 0, .075));
  mix-blend-mode: soft-light;
  transition: opacity .35s ease;
}

@media (hover: hover) and (pointer: fine) {
  .pa-customers-page.is-reference-wall .pa-customer-moment:hover,
  .pa-customers-page.is-reference-wall .pa-customer-moment:focus-within {
    --pa-customer-lift: -2.5px;
    z-index: 8;
    filter: brightness(1.025);
    box-shadow:
      1px 1.5px 1px rgba(3, 7, 7, .74),
      2.5px 3.8px 3px -1px rgba(3, 7, 7, .56),
      5.5px 8.5px 10px -4px rgba(3, 7, 7, .52),
      10px 15px 20px -9px rgba(2, 5, 5, .54),
      inset 0 .45px .2px rgba(255, 255, 255, .22),
      inset .4px 0 .2px rgba(255, 255, 255, .08),
      inset 0 -.55px .25px rgba(0, 0, 0, .43),
      inset -.5px 0 .2px rgba(0, 0, 0, .26);
  }

  .pa-customers-page.is-reference-wall .pa-customer-moment:hover .pa-customer-moment__glint,
  .pa-customers-page.is-reference-wall .pa-customer-moment:focus-within .pa-customer-moment__glint {
    opacity: .24;
  }
}

.pa-customers-page.is-reference-wall .pa-customer-moment--photo {
  overflow: visible;
}

.pa-customers-page.is-reference-wall .pa-customer-moment::after {
  display: none;
}

.pa-customers-page.is-reference-wall .pa-customer-moment__trigger {
  position: absolute;
  z-index: 2;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  color: inherit;
  background: #777c79;
  cursor: zoom-in;
  opacity: 0;
  transition: opacity .42s var(--pa-customer-ease) var(--pa-customer-stagger, 0ms), filter .25s ease;
}

.pa-customers-page.is-reference-wall .pa-customer-moment__trigger[hidden] {
  display: none !important;
}

.pa-customers-page.is-reference-wall .pa-customer-moment__trigger:disabled {
  cursor: default;
}

.pa-customers-page.is-reference-wall[data-pa-customers-lightbox="0"] .pa-customer-moment__trigger {
  cursor: default;
}

.pa-customers-page.is-reference-wall .pa-customer-moment.is-loaded .pa-customer-moment__trigger {
  opacity: 1;
}

.pa-customers-page.is-reference-wall .pa-customer-moment__trigger:focus-visible {
  outline: 3px solid rgba(255, 255, 255, .88);
  outline-offset: -4px;
}

.pa-customers-page.is-reference-wall .pa-customer-moment__trigger > img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  filter: grayscale(1) sepia(.035) saturate(.24) contrast(1.17) brightness(.91);
  transform: none !important;
  transition: filter .55s var(--pa-customer-ease);
}

.pa-customers-page.is-reference-wall .pa-customer-moment.is-css-grayscale .pa-customer-moment__trigger > img {
  filter: grayscale(1) sepia(.035) saturate(.24) contrast(1.15) brightness(.92);
}

@media (hover: hover) and (pointer: fine) {
  .pa-customers-page.is-reference-wall .pa-customer-moment__trigger:hover > img,
  .pa-customers-page.is-reference-wall .pa-customer-moment__trigger:focus-visible > img {
    filter: grayscale(.96) sepia(.025) saturate(.27) contrast(1.14) brightness(.965);
    transform: none !important;
  }
}

.pa-customers-page.is-reference-wall .pa-customer-moment__placeholder {
  padding: 18%;
}

.pa-customers-page.is-reference-wall .pa-customer-moment__placeholder img {
  width: min(100%, 68px);
  max-height: 74%;
  opacity: .7;
  filter: grayscale(1) brightness(1.72) contrast(1.04);
}

.pa-customers-page.is-reference-wall .pa-customer-moment--placard {
  grid-column: var(--pa-customer-col);
  grid-row: var(--pa-customer-row);
  overflow: visible;
  padding: clamp(9px, 1vw, 15px) clamp(7px, .8vw, 12px);
  box-shadow:
    .7px 1px .8px rgba(3, 7, 7, .78),
    1.7px 2.6px 1.8px -1px rgba(3, 7, 7, .62),
    3.8px 5.8px 6.5px -2.5px rgba(3, 7, 7, .5),
    7px 10.5px 14px -7px rgba(2, 5, 5, .5),
    inset 0 .45px .2px rgba(255, 255, 255, .2),
    inset .4px 0 .2px rgba(255, 255, 255, .07),
    inset 0 -.55px .25px rgba(0, 0, 0, .43),
    inset -.5px 0 .2px rgba(0, 0, 0, .26);
}

.pa-customers-page.is-reference-wall .pa-customer-moment--placard p {
  max-width: 11.5em;
  margin: 0 0 clamp(14px, 1.3vw, 20px);
  font-family: "Arial Narrow", "Roboto Condensed", Arial, sans-serif;
  font-size: clamp(.46rem, .64vw, .69rem);
  font-weight: 700;
  line-height: 1.16;
  letter-spacing: -.025em;
  text-transform: uppercase;
  text-wrap: balance;
}

.pa-customers-page.is-reference-wall .pa-customer-moment--placard.is-script p {
  max-width: 8.7em;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(.5rem, .7vw, .76rem);
  font-style: italic;
  font-weight: 400;
  line-height: 1.24;
  letter-spacing: -.02em;
  text-transform: none;
}

.pa-customers-page.is-reference-wall .pa-customer-moment--placard.is-dark p {
  color: #deddd5;
  text-shadow: 0 1px 0 #060909, 0 -1px 0 rgba(255, 255, 255, .12);
}

.pa-customers-page.is-reference-wall .pa-customer-moment--placard.is-light p {
  color: transparent;
  background: linear-gradient(#777a77, #4e5250);
  -webkit-background-clip: text;
  background-clip: text;
  filter: drop-shadow(0 1px 0 rgba(255, 255, 255, .7));
  text-shadow: none;
}

.pa-customers-page.is-reference-wall .pa-customer-moment--placard > .pa-customer-moment__brand {
  position: absolute;
  z-index: 3;
  inset-block-end: clamp(5px, .65vw, 9px);
  inset-inline-start: 50%;
  width: clamp(18px, 1.55vw, 23px);
  height: clamp(18px, 1.55vw, 23px);
  max-height: none;
  opacity: .74;
  transform: translateX(-50%);
  filter: drop-shadow(0 .6px 0 rgba(255, 255, 255, .14));
  pointer-events: none;
}

.pa-customers-page.is-reference-wall .pa-customer-moment--placard > .pa-customer-moment__brand::before {
  position: absolute;
  inset: 0;
  content: "";
  background: currentColor;
  -webkit-mask-image: var(--pa-customer-brand-logo);
  mask-image: var(--pa-customer-brand-logo);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
}

[dir="rtl"] .pa-customers-page.is-reference-wall .pa-customer-moment--placard > .pa-customer-moment__brand {
  transform: translateX(50%);
}

.pa-customers-page.is-reference-wall .pa-customer-moment--placard.is-dark > .pa-customer-moment__brand {
  color: #deddd5;
}

.pa-customers-page.is-reference-wall .pa-customer-moment--placard.is-light > .pa-customer-moment__brand {
  color: #666a68;
}

.pa-customers-page.is-reference-wall .pa-customers-statement {
  order: initial;
  grid-column: 4 / 8;
  grid-row: 2;
  min-height: 0;
  padding: 10px 4px;
  font-size: clamp(1.6rem, 3vw, 2.28rem);
  direction: inherit;
}

.pa-customers-page.is-reference-wall .pa-customers-statement::before {
  display: none;
}

.pa-customers-page.is-reference-wall .pa-customers-statement[dir="ltr"] {
  direction: ltr;
}

.pa-customers-page.is-reference-wall .pa-customers-statement[dir="rtl"] {
  direction: rtl;
}

.pa-customers-page.is-reference-wall .pa-customers-statement__mirror,
.pa-customers-page.is-reference-wall .pa-customers-statement__glint {
  font-family: "Mirror Narrow", "Arial Narrow", sans-serif;
  font-size: 1em;
  font-stretch: condensed;
  font-weight: 700;
  line-height: .96;
  letter-spacing: 0;
  white-space: nowrap;
}

.pa-customers-page.is-reference-wall .pa-customers-statement.is-long-copy {
  font-size: clamp(1.22rem, 2.35vw, 1.86rem);
}

.pa-customers-page.is-reference-wall .pa-customers-statement.is-long-copy .pa-customers-statement__mirror,
.pa-customers-page.is-reference-wall .pa-customers-statement.is-long-copy .pa-customers-statement__glint {
  width: 100%;
  max-width: 100%;
  padding-inline: 4px;
  white-space: normal;
  overflow-wrap: anywhere;
  text-wrap: balance;
}

.pa-customers-page.is-reference-wall .pa-customers-statement.is-rtl-copy .pa-customers-statement__mirror,
.pa-customers-page.is-reference-wall .pa-customers-statement.is-rtl-copy .pa-customers-statement__glint {
  font-family: var(--pa-font, Tahoma, Arial, sans-serif);
  font-weight: 900;
}

.pa-customers-page.is-reference-wall .pa-customers-statement__mirror {
  position: absolute;
  z-index: 1;
  inset: 50% auto auto 50%;
  width: max-content;
  max-width: 100%;
  color: transparent;
  background-image: url("../images/customers/brand/mirror-texture.webp");
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: 105.6% auto;
  -webkit-background-clip: text;
  background-clip: text;
  transform: translate3d(-50%, -50%, 0);
  -webkit-text-stroke: 0;
  filter:
    grayscale(.04)
    saturate(.78)
    contrast(1.035)
    drop-shadow(-.45px -.5px 0 rgba(255, 255, 255, .32))
    drop-shadow(1px 1.35px 0 rgba(75, 80, 78, .84))
    drop-shadow(2.1px 3px 1.5px rgba(15, 20, 19, .48))
    drop-shadow(4px 6px 5px rgba(7, 11, 11, .28));
}

.pa-customers-page.is-reference-wall .pa-customers-statement__glint {
  width: max-content;
  max-width: 100%;
}

.pa-customers-gallery--reference.is-shuffling-out .pa-customer-moment--photo {
  opacity: .18;
  filter: blur(1.3px) brightness(.92);
}

.pa-customers-gallery--reference.is-shuffling-in .pa-customer-moment--photo {
  animation: pa-customer-photo-in .46s var(--pa-customer-ease) both;
  animation-delay: var(--pa-customer-stagger, 0ms);
}

@keyframes pa-customer-photo-in {
  from { opacity: .18; filter: blur(1.4px) brightness(.92); }
  to { opacity: 1; filter: none; }
}

/* Premium, single-instance lightbox. */
.pa-customers-lightbox[hidden] {
  display: none !important;
}

.pa-customers-lightbox {
  position: fixed;
  z-index: 999999;
  inset: 0;
  display: grid;
  width: auto;
  max-width: none;
  height: auto;
  max-height: none;
  margin: 0;
  place-items: center;
  padding: max(18px, env(safe-area-inset-top)) max(18px, env(safe-area-inset-right)) max(18px, env(safe-area-inset-bottom)) max(18px, env(safe-area-inset-left));
  border: 0;
  color: inherit;
  background: transparent;
  opacity: 0;
  transition: opacity .22s ease;
}

.pa-customers-lightbox::backdrop {
  background: transparent;
}

.pa-customers-lightbox.is-open {
  opacity: 1;
}

.pa-customers-lightbox__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(5, 9, 10, .88);
  -webkit-backdrop-filter: blur(14px) saturate(.75);
  backdrop-filter: blur(14px) saturate(.75);
  cursor: zoom-out;
}

.pa-customers-lightbox__panel {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) 48px;
  align-items: center;
  width: min(1040px, 100%);
  max-height: calc(100dvh - 36px);
  border: 1px solid rgba(255, 255, 255, .12);
  background: rgba(15, 21, 21, .78);
  box-shadow: 0 28px 80px rgba(0, 0, 0, .52), inset 0 1px 0 rgba(255, 255, 255, .06);
  transform: translateY(8px);
  transition: transform .3s var(--pa-customer-ease);
}

.pa-customers-lightbox.is-open .pa-customers-lightbox__panel {
  transform: translateY(0);
}

.pa-customers-lightbox figure {
  position: relative;
  display: grid;
  max-height: calc(100dvh - 70px);
  margin: 0;
  padding: 12px 0 0;
  place-items: center;
  overflow: hidden;
}

.pa-customers-lightbox figure > img {
  display: block;
  width: auto;
  max-width: 100%;
  height: auto;
  max-height: calc(100dvh - 132px);
  object-fit: contain;
  filter: grayscale(1) contrast(1.06) brightness(.96);
  opacity: 1;
  transition: opacity .2s ease;
}

.pa-customers-lightbox.is-loading figure > img {
  opacity: .2;
}

.pa-customers-lightbox.is-error figure > img {
  opacity: 0;
}

.pa-customers-lightbox__loader {
  position: absolute;
  z-index: 2;
  inset: 50% auto auto 50%;
  width: 30px;
  height: 30px;
  margin: -15px;
  border: 2px solid rgba(255, 255, 255, .18);
  border-top-color: #fff;
  border-radius: 50%;
  opacity: 0;
  animation: pa-customers-shuffle-spin .78s linear infinite;
}

.pa-customers-lightbox.is-loading .pa-customers-lightbox__loader {
  opacity: 1;
}

.pa-customers-lightbox.is-error .pa-customers-lightbox__loader {
  opacity: 0;
}

.pa-customers-lightbox figcaption {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  width: 100%;
  min-height: 54px;
  padding: 10px 14px;
  color: #e7e8e3;
  font-size: 12px;
  line-height: 1.7;
}

.pa-customers-lightbox figcaption small {
  direction: ltr;
  flex: 0 0 auto;
  color: #aeb6b3;
  font-variant-numeric: tabular-nums;
}

.pa-customers-lightbox__close,
.pa-customers-lightbox__nav {
  display: grid;
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
  margin: 0;
  padding: 0;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 50%;
  color: #f7f7f2;
  background: rgba(5, 10, 10, .48);
  font: inherit;
  cursor: pointer;
  transition: border-color .2s ease, background-color .2s ease;
}

.pa-customers-lightbox__close:hover,
.pa-customers-lightbox__nav:hover,
.pa-customers-lightbox__close:focus-visible,
.pa-customers-lightbox__nav:focus-visible {
  border-color: rgba(255, 255, 255, .52);
  background: rgba(18, 25, 25, .86);
}

.pa-customers-lightbox__close:focus-visible,
.pa-customers-lightbox__nav:focus-visible {
  outline: 3px solid rgba(255, 255, 255, .86);
  outline-offset: 3px;
}

.pa-customers-lightbox__close {
  position: absolute;
  z-index: 4;
  inset-block-start: 10px;
  inset-inline-end: 10px;
  font-size: 27px;
  line-height: 1;
}

.pa-customers-lightbox__nav {
  position: relative;
  z-index: 3;
  justify-self: center;
  font-size: 32px;
  line-height: 1;
}

html.pa-customers-lightbox-open,
html.pa-customers-lightbox-open body {
  overflow: hidden;
}

html.pa-customers-lightbox-open body {
  position: fixed;
  right: 0;
  left: 0;
  width: 100%;
}

@media (max-width: 1023px) {
  .pa-customers-page.is-reference-wall {
    padding:
      max(26px, env(safe-area-inset-top))
      max(18px, env(safe-area-inset-right))
      max(28px, env(safe-area-inset-bottom))
      max(18px, env(safe-area-inset-left));
  }

  .pa-customers-page.is-reference-wall .pa-customers-gallery--reference {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    grid-template-rows: none;
    grid-auto-rows: auto;
  }

  .pa-customers-page.is-reference-wall .pa-customer-moment {
    order: 2;
    grid-column: auto !important;
    grid-row: auto !important;
    aspect-ratio: .78;
  }

  .pa-customers-page.is-reference-wall .pa-customers-gallery--reference > :nth-child(-n + 4) {
    order: 0;
  }

  .pa-customers-page.is-reference-wall .pa-customers-statement {
    order: 1;
    grid-column: 1 / -1 !important;
    grid-row: auto !important;
    min-height: clamp(118px, 24vw, 160px);
    padding: 24px 10px;
    font-size: clamp(2.05rem, 7.1vw, 3.35rem);
  }

  .pa-customers-page.is-reference-wall .pa-customers-statement.is-long-copy {
    font-size: clamp(1.35rem, 4.8vw, 2.45rem);
  }

  .pa-customers-page.is-reference-wall .pa-customer-moment--placard > .pa-customer-moment__brand {
    width: clamp(22px, 4vw, 28px);
    height: clamp(22px, 4vw, 28px);
    max-height: none;
  }

  .pa-customers-page.is-reference-wall .pa-customer-moment--placard p {
    font-size: clamp(.63rem, 1.55vw, .78rem);
  }

  .pa-customers-page.is-reference-wall .pa-customer-moment--placard.is-script p {
    font-size: clamp(.68rem, 1.75vw, .86rem);
  }
}

@media (max-width: 599px) {
  .pa-customers-page.is-reference-wall {
    padding:
      max(18px, env(safe-area-inset-top))
      max(13px, env(safe-area-inset-right))
      max(28px, env(safe-area-inset-bottom))
      max(13px, env(safe-area-inset-left));
  }

  .pa-customers-page.is-reference-wall .pa-customers-gallery--reference {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .pa-customers-page.is-reference-wall .pa-customers-statement {
    min-height: clamp(112px, 33vw, 148px);
    font-size: clamp(1.45rem, 7.8vw, 2.65rem);
  }

  .pa-customers-page.is-reference-wall .pa-customers-statement.is-long-copy {
    font-size: clamp(1.02rem, 5.2vw, 1.8rem);
  }

  .pa-customers-page.is-reference-wall .pa-customer-moment--placard p {
    font-size: clamp(.61rem, 2.65vw, .78rem);
  }

  .pa-customers-page.is-reference-wall .pa-customer-moment--placard.is-script p {
    font-size: clamp(.68rem, 2.9vw, .88rem);
  }

  .pa-customers-lightbox {
    padding: max(10px, env(safe-area-inset-top)) max(8px, env(safe-area-inset-right)) max(10px, env(safe-area-inset-bottom)) max(8px, env(safe-area-inset-left));
  }

  .pa-customers-lightbox__panel {
    grid-template-columns: 44px minmax(0, 1fr) 44px;
    max-height: calc(100dvh - 20px);
  }

  .pa-customers-lightbox figure > img {
    max-height: calc(100dvh - 112px);
  }

  .pa-customers-lightbox__nav {
    width: 44px;
    min-width: 44px;
    height: 48px;
    border-radius: 8px;
  }

  .pa-customers-lightbox figcaption {
    align-items: flex-start;
    flex-direction: column;
    gap: 2px;
    min-height: 64px;
    padding-inline: 8px;
  }
}

@media (max-width: 374px) {
  .pa-customers-page.is-reference-wall {
    padding:
      max(12px, env(safe-area-inset-top))
      max(10px, env(safe-area-inset-right))
      max(24px, env(safe-area-inset-bottom))
      max(10px, env(safe-area-inset-left));
  }

  .pa-customers-page.is-reference-wall .pa-customers-statement {
    font-size: clamp(1.42rem, 7.7vw, 1.8rem);
  }
}

@media (orientation: landscape) and (max-height: 500px) and (max-width: 1023px) {
  .pa-customers-page.is-reference-wall .pa-customers-gallery--reference {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .pa-customers-page.is-reference-wall .pa-customers-statement {
    min-height: 94px;
    padding: 14px 6px;
    font-size: clamp(1.9rem, 5.3vw, 3.2rem);
  }
}

@media (prefers-reduced-motion: reduce) {
  .pa-customers-page.is-reference-wall .pa-customer-moment,
  .pa-customers-page.is-reference-wall .pa-customer-moment__trigger,
  .pa-customers-lightbox,
  .pa-customers-lightbox__panel,
  .pa-customers-lightbox figure > img {
    transition: none !important;
    animation: none !important;
  }

  .pa-customers-page.is-reference-wall .pa-customer-moment {
    --pa-customer-rx: 0deg !important;
    --pa-customer-ry: 0deg !important;
    --pa-customer-lift: 0px !important;
  }
}

@media (forced-colors: active) {
  .pa-customers-lightbox__panel,
  .pa-customers-lightbox__close,
  .pa-customers-lightbox__nav,
  .pa-customers-page.is-reference-wall .pa-customer-moment__trigger {
    border: 1px solid CanvasText;
  }
}