/**
 * Navayro marketing site — Figma Desktop -18 prototype alignment.
 * Loaded after site.css; overrides tokens and layout for prototype fidelity.
 */

:root {
  --proto-bg: #050508;
  --proto-surface: #242424;
  --proto-surface-alt: #2d2d2d;
  --proto-blue: #48a5f7;
  --proto-teal: #1fb0cb;
  --proto-blue-bright: #49a6f8;
  --proto-green: #34c759;
  --proto-gradient: linear-gradient(105deg, var(--proto-teal), var(--proto-blue-bright));
  --proto-gradient-text: linear-gradient(90deg, var(--proto-blue), var(--proto-teal));
  --proto-gradient-soft: linear-gradient(
    180deg,
    rgba(72, 165, 247, 0.11) 0%,
    rgba(31, 176, 203, 0.11) 100%
  );
  --proto-glow: radial-gradient(ellipse 60% 40% at 50% 0%, rgba(72, 165, 247, 0.22), transparent 70%);
}

body.prototype-v2 {
  background: var(--proto-bg);
  font-family: 'Istok Web', ui-sans-serif, system-ui, sans-serif;
}

body.prototype-v2::before {
  background: var(--proto-glow);
}

/* ── Typography ── */
body.prototype-v2 .hero-cinematic-inner h1 {
  font-size: clamp(2.25rem, 5.5vw, 4rem);
  font-weight: 700;
  letter-spacing: -0.02em;
}

body.prototype-v2 .section-head h2,
body.prototype-v2 .section-head-tight h2 {
  font-size: clamp(1.75rem, 3vw, 2rem);
  font-weight: 700;
}

body.prototype-v2 .section-head p,
body.prototype-v2 .hero-cinematic-lead {
  font-size: clamp(1.05rem, 2vw, 1.5rem);
}

/* ── Buttons ── */
body.prototype-v2 .btn-primary,
body.prototype-v2 .btn-header-cta {
  background: linear-gradient(105deg, rgba(31, 176, 203, 0.66), var(--proto-blue-bright));
  border: 1px solid var(--proto-blue);
  color: #fff;
  border-radius: 24px;
  box-shadow: 0 8px 32px rgba(72, 165, 247, 0.28);
}

body.prototype-v2 .btn-outline {
  background: transparent;
  border: 1px solid var(--proto-blue);
  color: #fff;
  border-radius: 24px;
}

body.prototype-v2 .btn-ghost {
  border: 1px solid rgba(255, 255, 255, 0.35);
  border-radius: 24px;
  color: #fff;
}

/* ── Hero carousel (3 slides) ── */
body.prototype-v2 .hero-carousel-slide img {
  object-fit: contain;
  padding: 8%;
  background: radial-gradient(ellipse 80% 70% at 50% 50%, rgba(72, 165, 247, 0.1), transparent);
}

/* ── How it works — route orbit (Option A) ── */
#how-it-works .section-head {
  margin-bottom: clamp(24px, 4vw, 40px);
}

#how-it-works .hiw-orbit {
  display: grid;
  grid-template-columns: 1fr minmax(200px, 420px) 1fr;
  grid-template-rows: auto auto auto;
  gap: clamp(16px, 3vw, 28px);
  align-items: center;
  max-width: 1100px;
  margin: 0 auto clamp(24px, 4vw, 48px);
  padding-inline: clamp(16px, 5vw, 80px);
  box-sizing: border-box;
}

#how-it-works .hiw-card {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(72, 165, 247, 0.28);
  border-radius: 16px;
  padding: clamp(18px, 2.5vw, 28px);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.18);
}

#how-it-works .hiw-card h3 {
  margin: 0 0 8px;
  font-size: clamp(1.05rem, 1.8vw, 1.25rem);
  font-weight: 700;
  color: #fff;
}

#how-it-works .hiw-card p {
  margin: 0;
  font-size: 0.95rem;
  color: rgba(255, 255, 255, 0.72);
  line-height: 1.45;
}

#how-it-works .hiw-card-icon {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 12px;
  color: #48a5f7;
  background: rgba(72, 165, 247, 0.12);
  border: 1px solid rgba(72, 165, 247, 0.35);
}

#how-it-works .hiw-card-icon svg {
  width: 20px;
  height: 20px;
}

#how-it-works .hiw-orbit-chip--tl {
  grid-column: 1;
  grid-row: 1;
  justify-self: end;
  max-width: 280px;
}

#how-it-works .hiw-orbit-chip--tr {
  grid-column: 3;
  grid-row: 1;
  justify-self: start;
  max-width: 280px;
}

#how-it-works .hiw-orbit-center {
  grid-column: 2;
  grid-row: 1 / 4;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: clamp(12px, 2vw, 24px);
  border-radius: 20px;
  background: linear-gradient(165deg, rgba(72, 165, 247, 0.08), rgba(31, 176, 203, 0.05));
  border: 1px solid rgba(72, 165, 247, 0.2);
}

#how-it-works .hiw-orbit-center img {
  width: 100%;
  max-width: 380px;
  height: auto;
  object-fit: contain;
  filter: drop-shadow(0 12px 32px rgba(0, 0, 0, 0.35));
}

#how-it-works .hiw-orbit-chip--bl {
  grid-column: 1;
  grid-row: 3;
  justify-self: end;
  max-width: 280px;
}

#how-it-works .hiw-orbit-chip--br {
  grid-column: 3;
  grid-row: 3;
  justify-self: start;
  max-width: 280px;
}

#how-it-works .hiw-orbit-connector {
  grid-column: 1 / 4;
  grid-row: 2;
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(72, 165, 247, 0.25) 20%,
    rgba(31, 176, 203, 0.25) 80%,
    transparent
  );
  margin: 0 clamp(40px, 8vw, 120px);
}

@media (max-width: 900px) {
  #how-it-works .hiw-orbit {
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    padding-inline: clamp(16px, 5vw, 24px);
  }

  #how-it-works .hiw-orbit-chip--tl,
  #how-it-works .hiw-orbit-chip--tr,
  #how-it-works .hiw-orbit-chip--bl,
  #how-it-works .hiw-orbit-chip--br {
    grid-column: 1;
    grid-row: auto;
    justify-self: stretch;
    max-width: none;
  }

  #how-it-works .hiw-orbit-center {
    grid-column: 1;
    grid-row: auto;
    order: -1;
  }

  #how-it-works .hiw-orbit-connector {
    display: none;
  }
}

/* ── See it in action — screenshot marquee ── */
.action-marquee {
  width: 100%;
  overflow: hidden;
  padding: 16px 0 8px;
  mask-image: linear-gradient(
    90deg,
    transparent 0%,
    #000 8%,
    #000 92%,
    transparent 100%
  );
  -webkit-mask-image: linear-gradient(
    90deg,
    transparent 0%,
    #000 8%,
    #000 92%,
    transparent 100%
  );
}

.action-marquee-track {
  display: flex;
  align-items: flex-start;
  gap: clamp(20px, 3vw, 36px);
  width: max-content;
  padding: 8px clamp(16px, 4vw, 40px) 20px;
  animation: action-marquee-scroll 48s linear infinite;
  will-change: transform;
}

.action-marquee:hover .action-marquee-track {
  animation-play-state: paused;
}

@keyframes action-marquee-scroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}

.action-shot {
  flex: 0 0 auto;
  margin: 0;
  text-align: center;
  width: clamp(200px, 22vw, 280px);
}

.action-shot-frame {
  border-radius: 32px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.12);
  box-shadow: 0 32px 80px rgba(0, 0, 0, 0.5);
  background: rgba(255, 255, 255, 0.02);
  aspect-ratio: 9 / 19.5;
}

.action-shot-frame img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top center;
  display: block;
}

.action-shot-caption {
  margin: 14px 0 0;
  font-size: clamp(0.9rem, 1.5vw, 1.05rem);
  font-weight: 700;
  color: rgba(255, 255, 255, 0.88);
  letter-spacing: -0.01em;
}

@media (prefers-reduced-motion: reduce) {
  .action-marquee {
    mask-image: none;
    -webkit-mask-image: none;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    overscroll-behavior-x: contain;
  }

  .action-marquee-track {
    animation: none;
    width: auto;
    padding-bottom: 12px;
  }

  .action-shot[aria-hidden='true'] {
    display: none;
  }

  .action-shot {
    scroll-snap-align: center;
  }
}

@media (max-width: 640px) {
  .action-shot {
    width: min(240px, 72vw);
  }

  .action-marquee-track {
    animation-duration: 36s;
  }
}

/* ── Why — designer cards + scroll deck ── */
.why-love-section {
  padding-bottom: 0;
  overflow: visible;
  overflow-x: visible;
}

.why-love-scroller {
  --why-card-count: 6;
  --why-sticky-offset: 80px;
  --why-scroll-lead: 30vh;
  --why-scroll-step: 52vh;
  --why-scroll-tail: 0vh;
  height: calc(
    (100vh - var(--why-sticky-offset) - 12px) + var(--why-scroll-lead) +
      (var(--why-card-count) - 1) * var(--why-scroll-step) + var(--why-scroll-tail)
  );
  position: relative;
  overflow: visible;
}

.why-love-pin-host {
  position: relative;
  width: 100%;
}

.why-love-viewport {
  position: relative;
  top: auto;
  height: calc(100vh - var(--why-sticky-offset) - 12px);
  min-height: 440px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 16px;
  padding: 8px max(12px, 8vw) 0;
  overflow: hidden;
  box-sizing: border-box;
}

.why-love-viewport.is-fixed {
  position: fixed;
  top: var(--why-sticky-offset);
  z-index: 40;
}

.why-love-stage {
  --card-stack-step: 20px;
  --why-card-face-width: 80vw;
  --why-card-face-height: min(85vh, calc(80vw * 577 / 1024), 820px);
  position: relative;
  width: calc(
    var(--why-card-face-width) + (var(--why-card-count, 6) - 1) * var(--card-stack-step)
  );
  height: calc(
    var(--why-card-face-height) + (var(--why-card-count, 6) - 1) * var(--card-stack-step)
  );
  overflow: visible;
  isolation: isolate;
  flex-shrink: 0;
  box-sizing: border-box;
}

.why-love-card {
  --card-y: 0%;
  position: absolute;
  margin: 0;
  width: var(--why-card-face-width);
  height: var(--why-card-face-height);
  border-radius: 16px;
  overflow: hidden;
  border: 2px solid rgba(255, 255, 255, 0.62);
  box-shadow: 0 32px 80px rgba(0, 0, 0, 0.55);
  background: #0a0a0c;
  will-change: transform;
  pointer-events: none;
  backface-visibility: hidden;
  box-sizing: border-box;
}

.why-love-card.is-front {
  left: calc(var(--card-index, 0) * var(--card-stack-step, 20px));
  top: calc(var(--card-index, 0) * var(--card-stack-step, 20px));
  right: auto;
  bottom: auto;
  transform: translate3d(0, var(--card-y), 0);
  opacity: 1;
  z-index: calc(30 + var(--card-index, 0));
  pointer-events: auto;
  visibility: visible;
}

.why-love-card.is-stacked {
  left: calc(var(--card-index, 0) * var(--card-stack-step, 20px));
  top: calc(var(--card-index, 0) * var(--card-stack-step, 20px));
  right: auto;
  bottom: auto;
  transform: translate3d(0, 0, 0);
  opacity: 1;
  z-index: calc(10 + var(--card-index, 0));
  visibility: visible;
  pointer-events: none;
}

.why-love-card.is-passed,
.why-love-card.is-behind,
.why-love-card.is-strip {
  display: none;
}

.why-love-card.is-below {
  left: calc(var(--card-index, 0) * var(--card-stack-step, 20px));
  top: calc(var(--card-index, 0) * var(--card-stack-step, 20px));
  right: auto;
  bottom: auto;
  transform: translate3d(0, 100%, 0);
  opacity: 1;
  z-index: 5;
  visibility: hidden;
  pointer-events: none;
}

.why-love-progress {
  display: flex;
  align-items: baseline;
  gap: 12px;
  margin: 0;
  padding: 0 4px;
  font-size: 0.88rem;
  color: rgba(255, 255, 255, 0.55);
}

.why-love-progress__label {
  font-weight: 700;
  color: rgba(255, 255, 255, 0.88);
  letter-spacing: -0.01em;
}

.why-love-progress__count {
  font-variant-numeric: tabular-nums;
  color: rgba(72, 165, 247, 0.9);
}

.why-love-card__bg-layer {
  position: absolute;
  inset: 0;
  z-index: 0;
  background: #0a0a0c;
}

.why-love-card__bg {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  filter: brightness(0.48) saturate(0.85);
}

.why-love-card__scrim {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    118deg,
    rgba(5, 5, 8, 0.82) 0%,
    rgba(5, 5, 8, 0.5) 38%,
    rgba(5, 5, 8, 0.25) 62%,
    rgba(5, 5, 8, 0.42) 100%
  );
}

.why-love-card__layout {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 40%);
  grid-template-rows: auto auto;
  align-content: space-between;
  gap: clamp(12px, 2vw, 20px);
  height: 100%;
  padding: clamp(22px, 3.5vw, 36px);
  box-sizing: border-box;
}

.why-love-card__copy {
  grid-column: 1;
  grid-row: 1;
  align-self: start;
  margin: 0;
  max-width: 420px;
}

.why-love-card__copy h3 {
  margin: 0 0 10px;
  font-size: clamp(1.35rem, 2.8vw, 2rem);
  font-weight: 700;
  line-height: 1.12;
  letter-spacing: -0.02em;
  color: #fff;
}

.why-love-card__copy p {
  margin: 0;
  font-size: clamp(0.9rem, 1.6vw, 1.08rem);
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.86);
}

.why-love-card__hero {
  grid-column: 2;
  grid-row: 1;
  margin: 0;
  align-self: start;
  border-radius: 14px;
  overflow: hidden;
  border: 2px solid rgba(255, 255, 255, 0.58);
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.45);
  aspect-ratio: 4 / 3;
  width: 100%;
  max-height: min(42vh, 280px);
}

.why-love-card__hero img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

.why-love-card__thumbs {
  grid-column: 1 / -1;
  grid-row: 2;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(10px, 1.8vw, 16px);
  align-self: end;
}

.why-love-card__thumb {
  margin: 0;
  border-radius: 12px;
  overflow: hidden;
  border: 2px solid rgba(255, 255, 255, 0.58);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.38);
  aspect-ratio: 16 / 10;
}

.why-love-card__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.why-love-card__thumb:nth-child(1) img {
  object-position: 18% 22%;
}

.why-love-card__thumb:nth-child(2) img {
  object-position: 50% 45%;
}

.why-love-card__thumb:nth-child(3) img {
  object-position: 72% 68%;
}

/* Card 1 — Save More (perfume) */
.why-love-card--save .why-love-card__bg {
  object-position: center;
}

/* Card 2 — Discover More (Hermès) */
.why-love-card--discover .why-love-card__bg {
  object-position: 38% 48%;
  transform: scale(1.35);
  transform-origin: 40% 45%;
}

.why-love-card--discover.is-strip .why-love-card__bg {
  transform: none;
}

.why-love-card--discover .why-love-card__hero img {
  object-position: 52% 38%;
}

.why-love-card--discover .why-love-card__thumb:nth-child(1) img {
  object-position: 50% 14%;
}

.why-love-card--discover .why-love-card__thumb:nth-child(2) img {
  object-position: 48% 52%;
}

.why-love-card--discover .why-love-card__thumb:nth-child(3) img {
  object-position: 62% 88%;
}

/* Card 3 — Shop Smarter (Rolex) */
.why-love-card--shop .why-love-card__bg {
  object-position: 48% 42%;
  transform: scale(1.28);
  transform-origin: 50% 40%;
}

.why-love-card--shop.is-strip .why-love-card__bg {
  transform: none;
}

.why-love-card--shop .why-love-card__hero img {
  object-position: 50% 38%;
}

.why-love-card--shop .why-love-card__thumb:nth-child(1) img {
  object-position: 18% 62%;
}

.why-love-card--shop .why-love-card__thumb:nth-child(2) img {
  object-position: 50% 42%;
}

.why-love-card--shop .why-love-card__thumb:nth-child(3) img {
  object-position: 72% 58%;
}

/* Card 4 — Built for your route (Rose Impériale) */
.why-love-card--route .why-love-card__copy h3 {
  font-size: clamp(1.2rem, 2.4vw, 1.75rem);
  line-height: 1.18;
}

.why-love-card--route .why-love-card__bg {
  object-position: 42% 45%;
  transform: scale(1.32);
  transform-origin: 44% 42%;
}

.why-love-card--route.is-strip .why-love-card__bg {
  transform: none;
}

.why-love-card--route .why-love-card__hero img {
  object-position: 50% 40%;
}

.why-love-card--route .why-love-card__thumb:nth-child(1) img {
  object-position: 48% 52%;
}

.why-love-card--route .why-love-card__thumb:nth-child(2) img {
  object-position: 50% 18%;
}

.why-love-card--route .why-love-card__thumb:nth-child(3) img {
  object-position: 58% 78%;
}

/* Card 5 — Gets smarter (YSL) */
.why-love-card--smarter .why-love-card__bg {
  object-position: 50% 42%;
  transform: scale(1.3);
  transform-origin: 52% 40%;
}

.why-love-card--smarter.is-strip .why-love-card__bg {
  transform: none;
}

.why-love-card--smarter .why-love-card__hero img {
  object-position: 52% 38%;
}

.why-love-card--smarter .why-love-card__thumb:nth-child(1) img {
  object-position: 42% 48%;
}

.why-love-card--smarter .why-love-card__thumb:nth-child(2) img {
  object-position: 50% 55%;
}

.why-love-card--smarter .why-love-card__thumb:nth-child(3) img {
  object-position: 62% 42%;
}

/* Card 6 — Your Travel Concierge (Nyro / LV) */
.why-love-card--concierge .why-love-card__bg {
  object-position: center 42%;
  transform: scale(1.28);
  transform-origin: 50% 40%;
}

.why-love-card--concierge.is-strip .why-love-card__bg {
  transform: none;
}

.why-love-card--concierge .why-love-card__hero img {
  object-position: 52% 38%;
}

.why-love-card--concierge .why-love-card__thumb:nth-child(1) img {
  object-position: 22% 32%;
}

.why-love-card--concierge .why-love-card__thumb:nth-child(2) img {
  object-position: 50% 45%;
}

.why-love-card--concierge .why-love-card__thumb:nth-child(3) img {
  object-position: 78% 58%;
}

@media (prefers-reduced-motion: reduce) {
  .why-love-scroller {
    height: auto;
  }

  .why-love-viewport {
    position: relative;
    top: auto;
    height: auto;
    padding-bottom: 48px;
  }

  .why-love-stage {
    aspect-ratio: auto;
    max-height: none;
    display: flex;
    flex-direction: column;
    gap: 24px;
    --deck-offset: 0px !important;
  }

  .why-love-card,
  .why-love-card.is-front,
  .why-love-card.is-stacked,
  .why-love-card.is-below {
    position: relative;
    inset: auto;
    left: auto !important;
    top: auto !important;
    right: auto;
    width: 100%;
    height: auto;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    aspect-ratio: 1024 / 577;
    max-height: 520px;
    pointer-events: auto;
  }

  .why-love-card--discover .why-love-card__bg {
    transform: none;
  }

  .why-love-card--shop .why-love-card__bg {
    transform: none;
  }

  .why-love-card--route .why-love-card__bg {
    transform: none;
  }

  .why-love-card--smarter .why-love-card__bg {
    transform: none;
  }

  .why-love-card--concierge .why-love-card__bg {
    transform: none;
  }
}

@media (max-width: 768px) {
  .why-love-scroller {
    --why-scroll-lead: 26vh;
    --why-scroll-step: 48vh;
    --why-scroll-tail: 0vh;
  }

  .why-love-stage {
    --why-card-face-width: 80vw;
    --why-card-face-height: min(70vh, calc(80vw * 577 / 1024), 560px);
    width: calc(
      var(--why-card-face-width) + (var(--why-card-count, 6) - 1) * var(--card-stack-step)
    );
    height: calc(
      var(--why-card-face-height) + (var(--why-card-count, 6) - 1) * var(--card-stack-step)
    );
  }

  .why-love-card {
    width: var(--why-card-face-width);
    height: var(--why-card-face-height);
    aspect-ratio: auto;
    max-height: none;
    min-height: 0;
  }

  .why-love-card__layout {
    grid-template-columns: 1fr 44%;
    padding: 20px;
  }

  .why-love-card__copy h3 {
    font-size: 1.2rem;
  }

  .why-love-card__copy p {
    font-size: 0.85rem;
  }

  .why-love-card__thumb {
    border-radius: 10px;
  }
}

@media (max-width: 520px) {
  .why-love-card {
    min-height: 380px;
  }

  .why-love-card__layout {
    grid-template-columns: 1fr 46%;
    gap: 10px;
    padding: 16px;
  }

  .why-love-card__thumbs {
    gap: 8px;
  }
}

/* ── Meet Nyro (app screenshot) ── */
.section-nyro {
  position: relative;
  padding: clamp(40px, 7vw, 64px) 0 clamp(56px, 9vw, 80px);
  overflow: hidden;
}

.why-love-section + .section-nyro {
  padding-top: clamp(20px, 3.5vw, 36px);
}

.nyro-atmosphere {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(ellipse 70% 55% at 72% 45%, rgba(72, 165, 247, 0.12), transparent 68%),
    radial-gradient(ellipse 50% 40% at 20% 80%, rgba(31, 176, 203, 0.06), transparent 65%);
}

body.prototype-v2 .section-nyro-content {
  position: relative;
  z-index: 1;
  width: min(100% - clamp(24px, 4vw, 48px), 1080px);
}

.nyro-header {
  text-align: center;
  margin-bottom: clamp(32px, 5vw, 48px);
}

.meet-nyro-head {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
}

.meet-nyro-title {
  margin: 0;
  font-size: clamp(1.75rem, 3vw, 2rem);
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -0.02em;
  color: #fff;
}

.meet-nyro-title-rule {
  display: block;
  width: clamp(120px, 18vw, 168px);
  height: 3px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--proto-teal), var(--proto-blue-bright));
  box-shadow: 0 0 24px rgba(72, 165, 247, 0.45);
}

.nyro-feature {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(240px, 320px);
  gap: clamp(32px, 6vw, 64px);
  align-items: start;
}

.nyro-feature__eyebrow {
  margin: 0 0 12px;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(72, 165, 247, 0.85);
}

.nyro-feature__copy h3 {
  margin: 0 0 16px;
  font-size: clamp(1.5rem, 3vw, 2.25rem);
  font-weight: 700;
  line-height: 1.12;
  letter-spacing: -0.02em;
  color: #fff;
}

.nyro-feature__lead {
  margin: 0 0 16px;
  font-size: clamp(1rem, 1.8vw, 1.15rem);
  line-height: 1.55;
  color: rgba(255, 255, 255, 0.9);
  max-width: 520px;
}

.nyro-feature__body {
  margin: 0 0 clamp(24px, 4vw, 32px);
  max-width: 520px;
}

.nyro-feature__body p {
  margin: 0 0 14px;
  font-size: clamp(0.92rem, 1.5vw, 1.02rem);
  line-height: 1.65;
  color: rgba(255, 255, 255, 0.72);
}

.nyro-feature__body p:last-child {
  margin-bottom: 0;
}

.nyro-verdict {
  max-width: 460px;
  padding: clamp(18px, 3vw, 24px);
  border-radius: 20px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: linear-gradient(155deg, rgba(255, 255, 255, 0.05), rgba(72, 165, 247, 0.06));
  box-shadow: 0 20px 48px rgba(0, 0, 0, 0.28);
}

.nyro-verdict__route {
  margin: 0 0 16px;
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  font-size: 0.88rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: rgba(255, 255, 255, 0.82);
}

.nyro-verdict__quote {
  margin: 0;
  padding: 0 0 0 14px;
  border-left: 2px solid rgba(31, 176, 203, 0.55);
  font-size: clamp(0.92rem, 1.5vw, 1.02rem);
  font-style: italic;
  font-weight: 400;
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.86);
}

.nyro-verdict__quote strong {
  font-style: normal;
  font-weight: 700;
  color: var(--proto-blue-bright);
}

.nyro-verdict__label {
  display: block;
  margin-bottom: 10px;
  font-size: 0.72rem;
  font-weight: 700;
  font-style: normal;
  letter-spacing: 0.06em;
  color: var(--proto-blue-bright);
}

.nyro-feature__visual {
  position: relative;
  margin: 0;
  display: flex;
  justify-content: center;
}

.nyro-feature__glow {
  position: absolute;
  inset: 10% 0;
  background: radial-gradient(ellipse 70% 60% at 50% 50%, rgba(72, 165, 247, 0.28), transparent 70%);
  filter: blur(24px);
  pointer-events: none;
}

.nyro-feature__frame {
  position: relative;
  z-index: 1;
  width: min(100%, 300px);
  border-radius: 36px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.14);
  box-shadow:
    0 40px 100px rgba(0, 0, 0, 0.55),
    0 0 0 1px rgba(255, 255, 255, 0.04) inset;
  background: rgba(255, 255, 255, 0.02);
  aspect-ratio: 9 / 19.5;
}

.nyro-feature__frame img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top center;
  display: block;
}

@media (max-width: 820px) {
  .nyro-feature {
    grid-template-columns: 1fr;
    gap: 36px;
    text-align: center;
  }

  .nyro-feature__lead,
  .nyro-feature__body,
  .nyro-verdict {
    margin-inline: auto;
  }

  .nyro-feature__body {
    text-align: left;
  }

  .nyro-verdict__quote {
    text-align: left;
  }
}

@media (max-width: 520px) {
  .nyro-feature__frame {
    width: min(72vw, 260px);
    border-radius: 32px;
  }
}

/* ── Layover headline pill ── */
.text-pill {
  display: inline-block;
  padding: 2px 14px;
  border-radius: 999px;
  background: linear-gradient(105deg, rgba(72, 165, 247, 0.35), rgba(31, 176, 203, 0.35));
  border: 1px solid var(--proto-blue);
}

/* ── Figma deal cards ── */
.featured-deals-grid-figma {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
  gap: 20px;
}

.deal-card-figma {
  padding: 24px;
  border-radius: 24px;
  border: 1px solid rgba(255, 255, 255, 0.35);
  background: var(--proto-gradient-soft);
}

.deal-card-figma .deal-card-image {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  border-radius: 24px;
  margin-bottom: 16px;
}

.deal-card-figma .featured-deal-airport {
  display: block;
  margin-bottom: 8px;
  font-weight: 700;
  background: var(--proto-gradient-text);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.deal-card-figma h3 {
  margin: 0 0 16px;
  font-size: 1.15rem;
  font-weight: 400;
}

.deal-card-figma h3 strong {
  font-weight: 700;
  background: var(--proto-gradient-text);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.deal-card-figma .featured-deal-details {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.deal-card-figma .featured-deal-details > div {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 1rem;
}

.deal-card-figma .featured-deal-details dd {
  margin: 0;
  font-weight: 700;
  background: var(--proto-gradient-text);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.deal-card-figma .deal-badge {
  padding: 4px 12px;
  border-radius: 999px;
  border: 1px solid var(--proto-blue);
  background: linear-gradient(180deg, rgba(72, 165, 247, 0.26), rgba(31, 176, 203, 0.26));
  font-size: 0.88rem;
  color: #fff;
}

.deal-card-figma .deal-savings {
  color: var(--proto-green);
  font-weight: 600;
}

/* ── Deals section width ── */
body.prototype-v2 .section-deals-content {
  width: min(100% - clamp(24px, 4vw, 48px), 1320px);
}

body.prototype-v2 .section-deals-collections-head {
  max-width: none;
  margin-bottom: 24px;
}

body.prototype-v2 .section-deals-collections-head .section-subhead-lg {
  font-size: clamp(1.35rem, 2.4vw, 2rem);
  max-width: 980px;
  margin-inline: auto;
  text-wrap: balance;
}

/* ── Vertical collection cards ── */
.collection-row {
  display: flex;
  gap: 16px;
  overflow-x: auto;
  padding-bottom: 8px;
  scroll-snap-type: x mandatory;
  justify-content: center;
}

.collection-card-vertical {
  flex: 0 0 244px;
  scroll-snap-align: start;
  border-radius: 24px;
  overflow: hidden;
  position: relative;
  background: var(--proto-surface);
}

@media (max-width: 1320px) {
  .collection-row {
    justify-content: flex-start;
  }
}

@media (max-width: 768px) {
  .collection-card-vertical {
    flex: 0 0 min(244px, 70vw);
  }
}

.collection-card-vertical img {
  width: 100%;
  height: 328px;
  object-fit: cover;
  display: block;
}

.collection-card-vertical span {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 86px;
  padding: 10px;
  background: var(--proto-surface);
  font-size: 1.25rem;
  font-weight: 700;
  text-align: center;
}

/* ── Investors (Figma Desktop -18) ── */
.investor-hero h2 .highlight {
  background: var(--proto-gradient-text);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.investor-globe img {
  border-radius: 0;
}

body.prototype-v2 .investor-card {
  background: linear-gradient(180deg, rgba(72, 165, 247, 0.08), rgba(31, 176, 203, 0.06));
  border: 1px solid rgba(72, 165, 247, 0.42);
  border-radius: 24px;
}

body.prototype-v2 .investor-card__icon {
  color: var(--proto-blue-bright);
}

body.prototype-v2 .investor-card h3 {
  background: var(--proto-gradient-text);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

body.prototype-v2 .investor-card p {
  color: rgba(255, 255, 255, 0.88);
}

body.prototype-v2 .investor-copy p {
  color: rgba(255, 255, 255, 0.82);
}

@media (max-width: 960px) {
  .investor-hero {
    grid-template-columns: 1fr;
  }

  .investor-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .investor-grid {
    grid-template-columns: 1fr;
  }
}

/* ── FAQ split ── */
.faq-split {
  display: grid;
  grid-template-columns: minmax(140px, 200px) min(680px, 100%);
  gap: clamp(24px, 6vw, 80px);
  align-items: start;
  justify-content: center;
}

.faq-split > .faq-brand,
.faq-split > .faq-list {
  min-width: 0;
}

.faq-brand img {
  width: 100%;
  max-width: 200px;
  filter: drop-shadow(0 12px 40px rgba(72, 165, 247, 0.2));
}

body.prototype-v2 .faq-list {
  width: min(680px, 100%);
  max-width: 100%;
  margin: 0 auto;
  border: 1px solid var(--proto-blue);
  border-radius: 24px;
  padding: 8px 24px;
  background: linear-gradient(180deg, rgba(72, 165, 247, 0.03), rgba(31, 176, 203, 0.03));
  box-sizing: border-box;
}

body.prototype-v2 .faq-item {
  width: 100%;
  min-width: 0;
}

body.prototype-v2 .faq-item summary {
  font-weight: 600;
  overflow-wrap: anywhere;
}

body.prototype-v2 .faq-item p {
  overflow-wrap: anywhere;
  word-break: break-word;
}

body.prototype-v2 .faq-item summary::after {
  color: var(--proto-blue);
}

/* ── Contact ── */
body.prototype-v2 .contact-form-final label {
  font-size: 0.95rem;
}

body.prototype-v2 .contact-form-final input,
body.prototype-v2 .contact-form-final select,
body.prototype-v2 .contact-form-final textarea {
  border: 1px solid rgba(72, 165, 247, 0.45);
  border-radius: 12px;
  background: rgba(0, 0, 0, 0.35);
  color: #fff;
}


body.prototype-v2 .nyro-prompt-list {
  padding: 0;
  margin: 0;
}

@media (max-width: 960px) {
  .investor-split,
  .faq-split {
    grid-template-columns: 1fr;
  }

  body.prototype-v2 .faq-list {
    width: 100%;
    max-width: 680px;
    margin: 0 auto;
  }
}

body.prototype-v2 .hero-cinematic-cta .btn-primary {
  background: linear-gradient(105deg, rgba(31, 176, 203, 0.66), var(--proto-blue-bright));
  border: 1px solid var(--proto-blue);
  color: #fff;
}

body.prototype-v2 .hero-cinematic-cta .btn-outline {
  background: transparent;
  border: 1px solid var(--proto-blue);
  color: #fff;
  box-shadow: none;
}

@media (max-width: 640px) {
  body.prototype-v2 .investor-grid {
    grid-template-columns: 1fr;
  }
}