/* =========================================================
   NEXT V2 — Tutomile-style community CTA (index2 only)
   3 full photo rows (no clip) + centered copy + dual CTAs
   ========================================================= */

.next-v2 {
  --next-v2-shot-h: clamp(6.25rem, 10.5vw, 7.75rem);
  --next-v2-gap: 0.65rem;
  --next-v2-rows-h: calc(
    (3 * var(--next-v2-shot-h)) + (2 * var(--next-v2-gap))
  );
  position: relative;
  z-index: 2;
  isolation: isolate;
  display: grid;
  place-items: center;
  min-height: calc(
    var(--next-v2-rows-h) + clamp(5.5rem, 10vh, 7.5rem)
  );
  margin-bottom: 0;
  padding: clamp(3.75rem, 7vh, 5.25rem) clamp(1.25rem, 4vw, 3rem)
    clamp(2.75rem, 5.5vh, 4rem);
  overflow: hidden;
  color: var(--white);
  background: var(--navy-dark);
}

.faq + .next-v2 {
  padding-top: clamp(3.75rem, 7vh, 5.25rem);
}

.next-v2__marquee {
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  z-index: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: var(--next-v2-gap);
  height: var(--next-v2-rows-h);
  margin: 0;
  padding: 0;
  transform: translateY(-50%);
  pointer-events: none;
  overflow: hidden;
}

.next-v2__row {
  overflow: hidden;
  flex-shrink: 0;
  width: 100%;
  height: var(--next-v2-shot-h);
}

.next-v2__track {
  display: flex;
  width: max-content;
  height: 100%;
  will-change: transform;
  animation: nextV2MarqueeLtr var(--row-dur, 42s) linear infinite;
}

.next-v2__row--rtl .next-v2__track {
  animation-name: nextV2MarqueeRtl;
}

.next-v2__group {
  display: flex;
  flex-shrink: 0;
  align-items: stretch;
  gap: var(--next-v2-gap);
  height: 100%;
  padding-right: var(--next-v2-gap);
}

.next-v2__shot {
  display: block;
  width: clamp(10.5rem, 16.5vw, 14.25rem);
  height: 100%;
  object-fit: cover;
  object-position: center center;
  border-radius: var(--radius-lg, 1.25rem);
  opacity: 0.88;
  filter: saturate(0.82) brightness(0.9);
}

.next-v2__veil {
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(
      180deg,
      var(--navy-dark) 0%,
      transparent 22%,
      transparent 62%,
      rgba(21, 17, 62, 0.72) 94%,
      var(--navy-dark) 100%
    ),
    radial-gradient(
      circle at 50% 46%,
      rgba(21, 17, 62, 0.12) 0%,
      rgba(21, 17, 62, 0.4) 48%,
      rgba(21, 17, 62, 0.7) 100%
    );
  pointer-events: none;
}

.next-v2__content {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.95rem;
  width: min(42rem, 100%);
  text-align: center;
}

.next-v2__eyebrow,
.next-v2 .eyebrow,
.next-v2 .eyebrow-lockup {
  margin: 0;
  color: var(--brand-gold, var(--gold));
  justify-content: center;
}

.next-v2__title {
  margin: 0;
  max-width: 16ch;
  color: var(--white);
  font-family: var(--font-primary);
  font-size: clamp(2.15rem, 4.6vw, 3.45rem);
  font-weight: var(--font-primary-weight, 400);
  letter-spacing: -0.02em;
  line-height: 1.08;
  text-wrap: balance;
}

.next-v2__lede {
  margin: 0;
  max-width: 36rem;
  color: rgba(255, 255, 255, 0.88);
  font-size: clamp(1.02rem, 1.45vw, 1.2rem);
  line-height: 1.5;
}

.next-v2__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  margin-top: 0.55rem;
}

.next-v2__actions .btn {
  min-width: 10rem;
}

@keyframes nextV2MarqueeLtr {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

@keyframes nextV2MarqueeRtl {
  from { transform: translateX(-50%); }
  to { transform: translateX(0); }
}

@media (prefers-reduced-motion: reduce) {
  .next-v2__track {
    animation: none;
  }
}

@media (max-width: 900px) {
  .next-v2 {
    --next-v2-shot-h: 5.5rem;
    --next-v2-gap: 0.5rem;
    min-height: calc(var(--next-v2-rows-h) + 6.5rem);
    padding: clamp(3rem, 7vh, 4rem) 1.25rem clamp(2.75rem, 6vh, 3.5rem);
  }

  .next-v2__shot {
    width: clamp(8.75rem, 24vw, 11rem);
  }

  .next-v2__veil {
    background:
      linear-gradient(
        180deg,
        var(--navy-dark) 0%,
        transparent 18%,
        transparent 64%,
        rgba(21, 17, 62, 0.75) 92%,
        var(--navy-dark) 100%
      ),
      radial-gradient(
        circle at 50% 44%,
        rgba(21, 17, 62, 0.18) 0%,
        rgba(21, 17, 62, 0.48) 52%,
        rgba(21, 17, 62, 0.78) 100%
      );
  }

  .next-v2__actions {
    width: 100%;
    flex-direction: column;
    align-items: stretch;
    gap: 0.65rem;
  }

  .next-v2__actions .btn {
    width: 100%;
    min-width: 0;
    justify-content: center;
  }
}

@media (max-width: 600px) {
  .next-v2 {
    --next-v2-shot-h: 4.85rem;
    --next-v2-gap: 0.45rem;
    min-height: calc(var(--next-v2-rows-h) + 7.25rem);
    padding: 2.85rem 1.1rem 3rem;
  }

  .next-v2__shot {
    width: 8.25rem;
    border-radius: var(--radius-md, 0.5rem);
  }

  .next-v2__content {
    gap: 0.8rem;
    width: 100%;
  }

  .next-v2__title {
    max-width: 14ch;
    font-size: clamp(1.9rem, 8.2vw, 2.35rem);
  }

  .next-v2__lede {
    font-size: 0.98rem;
    line-height: 1.45;
  }

  .next-v2__actions {
    margin-top: 0.35rem;
  }
}