/* MktOps — o problema (Figma 8425:4174 · mobile 8695:3456) */

/* 8425:4174: px 32 · py 120 · gap 32 · strokes gray-900 em cima e embaixo, sobre o conteúdo */
.mk-problema {
  padding-block: var(--section-py);
  background: var(--black-200);
  box-shadow: inset 0 1px 0 var(--gray-900), inset 0 -1px 0 var(--gray-900);
}
.mk-problema__inner { display: flex; flex-direction: column; gap: 32px; }
/* Frame 90 8502:4254: título (704) | texto (672), colados */
.mk-problema__row { display: flex; }
.mk-problema__title { flex: 1 1 0; min-width: 0; align-self: flex-start; }
/* 8425:4178 · Cabin 18/1.5 gray-300, parágrafos com 16 (caixa 124 = 54 + 16 + 54) */
.mk-problema__text { flex: 0 1 672px; min-width: 0; display: flex; flex-direction: column; gap: 16px; }
.mk-problema__text p { font-size: 18px; line-height: 1.5; color: var(--gray-300); }
/* Rectangle 15 8502:4257: 1376×570 — block para o recorte da entrada (data-wipe) valer na caixa da foto */
.mk-problema__img { display: block; }
.mk-problema__img img { width: 100%; height: auto; aspect-ratio: 1376 / 570; object-fit: cover; }

@media (max-width: 1023px) {
  .mk-problema__row { flex-direction: column; gap: 16px; }
  .mk-problema__title { flex: none; align-self: stretch; }
  .mk-problema__text { flex: none; }
}

/* Mobile 8695:3456 (375×671): py 60 · título Exo 28 (caixa 34) · texto 16 abaixo · foto 343×264 */
@media (max-width: 767px) {
  .mk-problema__title { font-size: 28px; line-height: 34px; }
  .mk-problema__img img { aspect-ratio: 343 / 264; }
}
