/* Reviews page: equal-weight cards, alternating brand colour and direction. */
.rv-proof {
  overflow: hidden;
}

.rv-grid[data-review-grid] {
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
  gap: clamp(1.35rem, 3vw, 2.4rem);
}

.rv-grid[data-review-grid] .rv-card {
  width: min(86%, 52rem);
  min-height: 0;
  padding: clamp(1.45rem, 2.8vw, 2.2rem);
  border-radius: clamp(1rem, 1.6vw, 1.35rem);
  position: relative;
  isolation: isolate;
  overflow: hidden;
  box-shadow: 0 1.4rem 3.8rem rgb(3 42 64 / .12);
  transition:
    opacity 700ms ease var(--rv-reveal-delay, 0ms),
    transform 850ms var(--ease-out) var(--rv-reveal-delay, 0ms),
    background-color 300ms ease,
    border-color 300ms ease,
    box-shadow 350ms var(--ease-out);
}

.rv-grid[data-review-grid] .rv-card::before {
  content: "";
  z-index: 1;
  width: 3px;
  background: linear-gradient(180deg, var(--soft-aqua), #fff, #ffd166);
  pointer-events: none;
  position: absolute;
  inset: 0 auto 0 0;
}

.rv-grid[data-review-grid] .rv-card.rv-card--from-left,
html:not(.rv-review-colours) .rv-grid[data-review-grid] .rv-card:nth-child(odd) {
  --rv-enter-x: clamp(-5.5rem, -7vw, -2.5rem);
  justify-self: start;
}

.rv-grid[data-review-grid] .rv-card.rv-card--from-right,
html:not(.rv-review-colours) .rv-grid[data-review-grid] .rv-card:nth-child(even) {
  --rv-enter-x: clamp(2.5rem, 7vw, 5.5rem);
  justify-self: end;
}

.rv-grid[data-review-grid] .rv-card.rv-card--from-right::before,
html:not(.rv-review-colours) .rv-grid[data-review-grid] .rv-card:nth-child(even)::before {
  inset: 0 0 0 auto;
}

.rv-grid[data-review-grid] .rv-card.rv-card--blue,
html:not(.rv-review-colours) .rv-grid[data-review-grid] .rv-card:nth-child(odd) {
  border-color: rgb(120 208 231 / .45);
  background:
    radial-gradient(circle at 92% 8%, rgb(120 208 231 / .2), transparent 15rem),
    linear-gradient(145deg, #075473, var(--deep-blue) 60%, var(--dark-blue));
  color: var(--white);
  box-shadow: 0 1.6rem 4.1rem rgb(3 42 64 / .2);
}

.rv-grid[data-review-grid] .rv-card.rv-card--white,
html:not(.rv-review-colours) .rv-grid[data-review-grid] .rv-card:nth-child(even) {
  border-color: rgb(0 125 204 / .2);
  background:
    radial-gradient(circle at 92% 8%, rgb(120 208 231 / .15), transparent 14rem),
    linear-gradient(145deg, #fff, #f1f8fb);
  color: var(--deep-blue);
}

.rv-grid[data-review-grid] .rv-card.rv-card--white::before,
html:not(.rv-review-colours) .rv-grid[data-review-grid] .rv-card:nth-child(even)::before {
  background: linear-gradient(180deg, var(--brand-blue), var(--soft-aqua), #ffd166);
}

.rv-grid[data-review-grid] .rv-card--blue h3,
html:not(.rv-review-colours) .rv-grid[data-review-grid] .rv-card:nth-child(odd) h3 {
  color: var(--white);
}

.rv-grid[data-review-grid] .rv-card--blue .rv-card__top p,
html:not(.rv-review-colours) .rv-grid[data-review-grid] .rv-card:nth-child(odd) .rv-card__top p {
  color: rgb(255 255 255 / .66);
}

.rv-grid[data-review-grid] .rv-card--blue .rv-card__copy,
html:not(.rv-review-colours) .rv-grid[data-review-grid] .rv-card:nth-child(odd) .rv-card__copy {
  color: rgb(255 255 255 / .9);
}

.rv-grid[data-review-grid] .rv-card--blue .rv-avatar,
html:not(.rv-review-colours) .rv-grid[data-review-grid] .rv-card:nth-child(odd) .rv-avatar {
  border-color: rgb(255 255 255 / .22);
  background: rgb(255 255 255 / .09);
  color: var(--white);
}

.rv-grid[data-review-grid] .rv-card--blue .rv-source,
html:not(.rv-review-colours) .rv-grid[data-review-grid] .rv-card:nth-child(odd) .rv-source {
  background: var(--soft-aqua);
  color: var(--deep-blue);
}

.rv-grid[data-review-grid] .rv-card--blue .rv-read-more,
html:not(.rv-review-colours) .rv-grid[data-review-grid] .rv-card:nth-child(odd) .rv-read-more {
  border-color: rgb(169 237 247 / .56);
  color: #d9f6ff;
}

.rv-grid[data-review-grid] .rv-stars {
  color: #f2bb4d;
  text-shadow: none;
}

.rv-grid[data-review-grid] .rv-card__copy {
  max-width: 64ch;
  font-size: clamp(.97rem, 1.1vw, 1.08rem);
  line-height: 1.72;
  text-wrap: pretty;
}

.rv-grid[data-review-grid] .rv-read-more {
  position: relative;
  z-index: 2;
}

html.rv-review-motion .rv-grid[data-review-grid] .rv-card.is-review-pending {
  opacity: 0;
  transform: translate3d(var(--rv-enter-x), 1rem, 0) scale(.985);
}

html.rv-review-motion .rv-grid[data-review-grid] .rv-card.is-review-visible {
  opacity: 1;
  transform: translate3d(0, 0, 0) scale(1);
}

@media (hover: hover) and (pointer: fine) {
  html.rv-review-motion .rv-grid[data-review-grid] .rv-card.is-review-visible:hover,
  html:not(.rv-review-motion) .rv-grid[data-review-grid] .rv-card:hover {
    transform: translateY(-4px);
    border-color: rgb(120 208 231 / .78);
    box-shadow: 0 2rem 5rem rgb(3 42 64 / .2);
  }
}

@media (max-width: 700px) {
  .rv-grid[data-review-grid] {
    gap: 1.2rem;
  }

  .rv-grid[data-review-grid] .rv-card {
    width: calc(100% - .8rem);
    padding: 1.4rem;
    border-radius: 1rem;
  }

  .rv-grid[data-review-grid] .rv-card__copy {
    font-size: .96rem;
  }
}

@media (max-width: 390px) {
  .rv-grid[data-review-grid] .rv-card {
    width: calc(100% - .45rem);
  }
}

@media (prefers-reduced-motion: reduce) {
  .rv-grid[data-review-grid] .rv-card,
  html.rv-review-motion .rv-grid[data-review-grid] .rv-card.is-review-pending,
  html.rv-review-motion .rv-grid[data-review-grid] .rv-card.is-review-visible {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}
