/* ── CARDS SECTION ── */
.cards-scroll-zone {
  height: 200vh;
  margin-top: clamp(10rem, 32vh, 22rem);
  position: relative;
}

.cards-viewport {
  position: sticky;
  top: 0;
  height: 100vh;
  display: flex;
  align-items: flex-start;
  padding-top: 15vh;
  justify-content: center;
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
}

.card-stack {
  position: relative;
  width: 38vw;
  max-width: 32rem;
  aspect-ratio: 3 / 4;
}
@media (max-width: 768px) {
  .card-stack { width: 65vw; aspect-ratio: 3 / 4; }
}

.card {
  position: absolute;
  inset: 0;
  border-radius: 24px;
  background: #fff;
  border: 1px solid #e7e5e4;
  padding: 48px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  transform-origin: bottom left;
  will-change: transform, opacity;
  box-shadow:
    3px 4px 11px rgba(28, 25, 23, 0.10),
    11px 15px 19px rgba(28, 25, 23, 0.08),
    25px 35px 26px rgba(28, 25, 23, 0.04),
    45px 62px 31px rgba(28, 25, 23, 0.01);
}
.card:last-child { background: #f5f5f4; }
@media (max-width: 768px) { .card { padding: 28px; } }

.card-keyword {
  font-size: clamp(48px, 8vw, 96px);
  line-height: 0.9;
  letter-spacing: -0.03em;
  font-weight: 400;
}

.card-text {
  margin-top: 20px;
  font-size: clamp(15px, 1.6vw, 20px);
  line-height: 1.55;
  color: #44403c;
  max-width: 32rem;
}