/* ───── KARAFT video (Prestige Allure clone) ─────
   Full-bleed poster with dark scrim, centered eyebrow + heading, circular
   play button. Click swaps poster for an iframe/video embed. */

.kf-video { padding: var(--section-gap, 96px) 0; }

.kf-video__stage {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 8;
  overflow: hidden;
  background: var(--color-placeholder);
}

.kf-video__poster,
.kf-video__placeholder,
.kf-video__embed {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.kf-video__poster { object-fit: cover; }
.kf-video__placeholder { background: var(--color-placeholder); }
.kf-video__embed { border: 0; z-index: 3; }

.kf-video__scrim {
  position: absolute;
  inset: 0;
  background: #000;
  z-index: 1;
  pointer-events: none;
}

.kf-video__content {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: var(--color-dark-fg);
  padding: 0 24px;
}
.kf-video__eyebrow { color: var(--color-dark-fg); margin-bottom: 14px; }
.kf-video__heading {
  font-family: var(--font-heading);
  font-size: clamp(30px, 5vw, 64px);
  font-weight: 400;
  letter-spacing: var(--track-heading, 0.16em);
  color: var(--color-dark-fg);
  margin: 0;
}

.kf-video__play {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
  width: 84px;
  height: 84px;
  border-radius: 50%;
  border: 0;
  background: rgba(255, 255, 255, 0.92);
  color: var(--color-dark);
  display: grid;
  place-items: center;
  cursor: pointer;
  transition: transform 0.25s ease, background 0.25s ease;
}
.kf-video__play:hover { transform: translate(-50%, -50%) scale(1.08); background: #fff; }
.kf-video__play-icon { display: grid; place-items: center; margin-left: 3px; }

.kf-video__stage.is-playing .kf-video__poster,
.kf-video__stage.is-playing .kf-video__placeholder,
.kf-video__stage.is-playing .kf-video__scrim,
.kf-video__stage.is-playing .kf-video__content,
.kf-video__stage.is-playing .kf-video__play { display: none; }

/* ── Responsive ───────────────────────────────────────────────────────── */
@media (max-width: 768px) {
  .kf-video__stage { aspect-ratio: 16 / 10; }
  .kf-video__play { width: 68px; height: 68px; }
}
@media (max-width: 375px) {
  .kf-video { padding: 64px 0; }
  .kf-video__stage { aspect-ratio: 4 / 5; }
  .kf-video__play { width: 60px; height: 60px; }
}