/* Стилі, унікальні для produkty/evercore.html (секція «Для яких об'єктів»);
   решта секцій перевикористовує produkt-kategoriya.css. Docs: docs/pages/evercore.md */

.use-cases {
  display: grid;
  grid-template-columns: 1fr 1fr;
  background-color: var(--background-secondary);
}

/* img усередині абсолютний, щоб не тягнути висоту grid-рядка власним aspect-ratio */
.use-cases__photo-frame {
  position: relative;
  min-width: 0;
  overflow: hidden;
  box-shadow: 0 24px 56px -16px rgba(23, 33, 41, 0.18);
}

.use-cases__photo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.use-cases__copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-32);
  padding-block: 100px;
  padding-left: var(--space-64);
  padding-right: max(var(--container-gutter), calc((100vw - var(--container-max)) / 2 + var(--container-gutter)));
}

.use-cases__title {
  color: var(--text-primary);
}

.use-cases__description {
  font-size: var(--font-size-18);
  line-height: var(--line-height-30);
  color: var(--text-primary);
}

@media (max-width: 1024px) {
  .use-cases {
    grid-template-columns: 1fr;
  }

  .use-cases__copy {
    padding: var(--space-64) var(--container-gutter);
  }

  .use-cases__photo-frame {
    height: 420px;
  }
}

@media (max-width: 767px) {
  .use-cases__copy {
    gap: var(--space-24);
    padding: var(--space-48) var(--container-gutter);
  }

  .use-cases__cta {
    width: 100%;
  }

  .use-cases__photo-frame {
    height: 320px;
  }
}
