/* V5 / reason 01: alternating feature rows, using TOP's palette and type. */
.wf-video-features {
  padding: clamp(64px, 7vw, 104px) clamp(20px, 4vw, 48px);
  background: #fff;
  color: #2c1e46;
  scroll-margin-top: 105px;
}
.wf-video-features__inner { max-width: 1040px; margin-inline: auto; }
.wf-video-features__heading { text-align: center; margin-bottom: 56px; }
.wf-video-features__heading h2 {
  margin: 0 0 18px;
  font-size: 15px;
  line-height: 1.7;
  letter-spacing: .06em;
  color: #6c6372;
}
.wf-video-features__heading h3 {
  margin: 0;
  font-size: clamp(26px, 3vw, 38px);
  line-height: 1.65;
  letter-spacing: .02em;
}
.wf-video-features__heading h3 span { display: inline-block; }
.wf-video-features__heading::after {
  content: '';
  display: block;
  width: 120px;
  height: 4px;
  margin: 30px auto 0;
  background: #9162a8;
}
.wf-video-features__list { display: grid; gap: 80px; }
.wf-video-features__item {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 40px;
  align-items: center;
}
.wf-video-features__media {
  width: 100%;
  min-width: 0;
  aspect-ratio: 5 / 3;
}
.wf-video-features__copy { min-width: 0; }
.wf-video-features__item:nth-child(even) .wf-video-features__media { grid-column: 2; grid-row: 1; }
.wf-video-features__item:nth-child(even) .wf-video-features__copy { grid-column: 1; grid-row: 1; }
.wf-video-features__point {
  display: block;
  margin-bottom: 24px;
  color: #9162a8;
  font: 700 clamp(36px, 4.8vw, 64px)/1.1 var(--en);
  letter-spacing: -.025em;
}
/* The same dot-ink and sliced purple signal used by the site's display titles. */
.wf-video-glitch-label .im-glitch {
  font-weight: 700;
  white-space: nowrap;
  animation: video-headline-idle-twitch 3.8s -3.2s steps(1, end) infinite;
}
.wf-video-glitch-label .im-glitch::before,
.wf-video-glitch-label .im-glitch::after { animation-delay: -3.2s; }
.wf-video-glitch-label[data-point-visible="false"] .im-glitch,
.wf-video-glitch-label[data-point-visible="false"] .im-glitch::before,
.wf-video-glitch-label[data-point-visible="false"] .im-glitch::after { animation-play-state: paused; }
.motion-off .wf-video-glitch-label .im-glitch { animation: none; }
.motion-off .wf-video-glitch-label .im-glitch::before,
.motion-off .wf-video-glitch-label .im-glitch::after { display: none; }
@media (prefers-reduced-motion: reduce) {
  .wf-video-glitch-label .im-glitch { animation: none; }
  .wf-video-glitch-label .im-glitch::before,
  .wf-video-glitch-label .im-glitch::after { display: none; }
}
.wf-video-features__kicker { margin: 6px 0 0; font-size: 14px; line-height: 1.8; color: #6c6372; }
.wf-video-features__copy h4 {
  margin: 0;
  font-size: clamp(23px, 2.35vw, 30px);
  line-height: 1.6;
  font-weight: 600;
  color: #2c1e46;
  overflow-wrap: anywhere;
}
.wf-video-features__body { margin: 24px 0 0; font-size: 15px; line-height: 2; color: #28232d; }
@media (max-width: 760px) {
  .wf-video-features { scroll-margin-top: 90px; }
  .wf-video-features__heading { margin-bottom: 40px; }
  .wf-video-features__heading h2 { font-size: 13px; letter-spacing: .02em; }
  .wf-video-features__heading h3 { letter-spacing: 0; }
  .wf-video-features__heading::after { width: 88px; margin-top: 24px; }
  .wf-video-features__list { gap: 52px; }
  .wf-video-features__item { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .wf-video-features__item:nth-child(n) .wf-video-features__media,
  .wf-video-features__item:nth-child(n) .wf-video-features__copy { grid-column: auto; grid-row: auto; }
  .wf-video-features__point { margin-bottom: 14px; }
  .wf-video-features__body { margin-top: 16px; }
}

/* Approved Japanese feature headings share the TOP hero serif. */
.wf-page .wf-video-reason-title { font-family: "Shippori Mincho", serif; font-weight: 500 !important; }

/* Fixed original glyphs reserve the same space throughout the brief reveal. */
:is(.wf-video-reason-title, .wf-video-reason-copy) .wf-reason-unit { display: inline-block; white-space: nowrap; }
:is(.wf-video-reason-title, .wf-video-reason-copy) .wf-reason-glyph { position: relative; display: inline-block; white-space: pre; vertical-align: baseline; }
:is(.wf-video-reason-title, .wf-video-reason-copy) .wf-reason-metric { visibility: hidden; }
:is(.wf-video-reason-title, .wf-video-reason-copy) .wf-reason-glyph::after { content: attr(data-glyph); position: absolute; inset: 0; white-space: pre; color: inherit; pointer-events: none; }
/* Same two purple slices, 320 ms reveal beats and 3.8 s idle cadence as TOP. */
:is(.wf-video-reason-title, .wf-video-reason-copy) .wf-reason-glyph::before { content: attr(data-glyph); position: absolute; inset: 0; z-index: 1; white-space: pre; pointer-events: none; color: #f1e5fa; text-shadow: -3px 0 #9162a8, 2px 0 #c6a0da; opacity: 0; clip-path: inset(22% 0 52% 0); }
:is(.wf-video-reason-title, .wf-video-reason-copy)[data-reason-reveal="revealing"] .wf-reason-glyph::before { animation: hero-headline-signal 320ms steps(1, end) infinite; }
:is(.wf-video-reason-title, .wf-video-reason-copy)[data-reason-reveal="revealing"] .wf-reason-glyph::after { animation: hero-headline-twitch 320ms steps(1, end) infinite; }
:is(.wf-video-reason-title, .wf-video-reason-copy)[data-reason-reveal="revealing"] .wf-reason-unit:nth-child(3n) .wf-reason-glyph::before { animation-delay: -80ms; }
:is(.wf-video-reason-title, .wf-video-reason-copy)[data-reason-reveal="complete"] .wf-reason-glyph::before { animation: hero-headline-idle-signal 3.8s steps(1, end) infinite; }
:is(.wf-video-reason-title, .wf-video-reason-copy)[data-reason-reveal="complete"] .wf-reason-glyph::after { animation: hero-headline-idle-twitch 3.8s steps(1, end) infinite; }
:is(.wf-video-reason-title, .wf-video-reason-copy)[data-reason-visible="false"] .wf-reason-glyph::before,
:is(.wf-video-reason-title, .wf-video-reason-copy)[data-reason-visible="false"] .wf-reason-glyph::after { animation-play-state: paused; }
@keyframes hero-headline-signal{0%,15%,40%,57%,82%,100%{opacity:0;transform:translateX(0)}16%,23%{opacity:.95;transform:translateX(5px);clip-path:inset(19% 0 48% 0)}24%,39%{opacity:.8;transform:translateX(-4px);clip-path:inset(59% 0 19% 0)}58%,68%{opacity:.9;transform:translateX(-5px);clip-path:inset(34% 0 41% 0)}69%,81%{opacity:.75;transform:translateX(3px);clip-path:inset(72% 0 11% 0)}}
@keyframes hero-headline-twitch{0%,17%,30%,61%,73%,100%{transform:translateX(0);text-shadow:none}18%,29%{transform:translateX(-2px);text-shadow:2px 0 #9162a8}62%,72%{transform:translateX(2px);text-shadow:-2px 0 #c6a0da}}
@keyframes hero-headline-idle-signal{0%,91%,95%,99%,100%{opacity:0;transform:translateX(0)}92%,93%{opacity:.95;transform:translateX(5px);clip-path:inset(19% 0 48% 0)}94%{opacity:.8;transform:translateX(-4px);clip-path:inset(59% 0 19% 0)}96%,97%{opacity:.9;transform:translateX(-5px);clip-path:inset(34% 0 41% 0)}98%{opacity:.75;transform:translateX(3px);clip-path:inset(72% 0 11% 0)}}
@keyframes hero-headline-idle-twitch{0%,91%,95%,99%,100%{transform:translateX(0);text-shadow:none}92%,94%{transform:translateX(-2px);text-shadow:2px 0 #9162a8}96%,98%{transform:translateX(2px);text-shadow:-2px 0 #c6a0da}}
@media (prefers-reduced-motion: reduce) {
  :is(.wf-video-reason-title, .wf-video-reason-copy) .wf-reason-metric { visibility: visible; }
  :is(.wf-video-reason-title, .wf-video-reason-copy) .wf-reason-glyph::before,
  :is(.wf-video-reason-title, .wf-video-reason-copy) .wf-reason-glyph::after { display: none; animation: none; }
}

/* English titles pair a strong signal texture with the existing Japanese serif. */
.wf-video-reason-heading,
.wf-video-team__heading.wf-video-reason-heading {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 14px;
  scroll-margin-top: 120px;
}
.wf-video-reason-en {
  display: block;
  max-width: 100%;
  color: #dcc2e8;
  font: 700 clamp(36px, 4.8vw, 64px)/1.1 var(--en);
  letter-spacing: -.025em;
}
@media (min-width: 1025px) {
  .wf-video-reason-heading,
  .wf-video-team__heading.wf-video-reason-heading {
    flex-direction: row;
    align-items: center;
    gap: clamp(24px, 3vw, 40px);
  }
  .wf-video-reason-heading > .wf-video-reason-en { flex-shrink: 0; }
  .wf-video-reason-heading > .wf-video-reason-title { min-width: 0; }
}
.wf-reason-readable {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip-path: inset(50%);
  white-space: nowrap !important;
}
.motion-off :is(.wf-video-reason-title, .wf-video-reason-copy) .wf-reason-metric { visibility: visible; }
.motion-off :is(.wf-video-reason-title, .wf-video-reason-copy) .wf-reason-glyph::before,
.motion-off :is(.wf-video-reason-title, .wf-video-reason-copy) .wf-reason-glyph::after { display: none; animation: none; }
