/* css/future.css */

.future {
  background: var(--c-bg-soft);
  padding: var(--section-py) 0;
}

.future__card {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(32px, 4vw, 64px);
  align-items: center;
  background: var(--c-white);
  border-radius: 28px;
  padding: clamp(32px, 4vw, 64px);
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.06);
}

.future__text h2 {
  margin: 0 0 var(--space-5);
}

.future__text h2 .title-split__strong,
.future__text h2 .title-split__light { color: var(--c-ink); }

.future__text p {
  font-family: var(--f-body);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: var(--c-body-light);
  margin: 0 0 var(--space-4);
  max-width: var(--measure);
}

.future__media {
  aspect-ratio: 16 / 10;
  border-radius: 20px;
  overflow: hidden;
  background: var(--c-ph-bg);
  display: flex;
  align-items: center;
  justify-content: center;
}

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

.future__media-ph {
  font-family: var(--f-body);
  font-size: var(--fs-caption);
  color: var(--c-ph-text);
}

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