/* ==========================================================================
   KOBIL — AI Trust — Section: Approach
   Figma: desktop 5501:34551 (1440x607 — copy 577 wide at x=80/y=184,
   diagram 651x524 at x=709/y=42) · mobile 6087:13960 (369x622 — copy 337 at
   y=60, diagram 369x330 below it).
   ========================================================================== */

.sec-ait-approach {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  min-height: var(--w607);
  padding: 0 var(--w80);
}

.ait-approach__copy {
  flex: none;
  display: flex;
  flex-direction: column;
  gap: var(--w24);
  width: var(--w577);
}

.ait-approach__head {
  display: flex;
  flex-direction: column;
  gap: var(--w16);
}

.ait-approach__title {
  display: flex;
  flex-direction: column;
  font-family: var(--font-serif);
  font-size: var(--w56);
  font-weight: 400;
  line-height: 1.3;
  color: var(--navy);
}

.ait-approach__title > span { display: block; }

.ait-approach__lead {
  font-family: var(--font-sans);
  font-size: var(--w16);
  font-weight: 400;
  line-height: var(--w23);
  color: var(--navy-70);
}

.ait-approach__visual {
  position: absolute;
  top: var(--w42);
  left: var(--w709);
  width: var(--w651);
  height: var(--w524);
  max-width: none;
  object-fit: contain;
}

@media (max-width: 768px) {
  .sec-ait-approach {
    flex-direction: column;
    align-items: stretch;
    min-height: 0;
    padding: var(--m60) var(--m28) var(--m26);
  }

  .ait-approach__copy { width: 100%; gap: var(--m16); }
  /* The phone frame runs the headline as one wrapped paragraph. */
  .ait-approach__title { display: block; }
  .ait-approach__title > span { display: inline; }
  .ait-approach__head { gap: var(--m8); }
  .ait-approach__title { font-size: var(--m34); line-height: 1.2; }
  .ait-approach__lead { font-size: var(--m14); line-height: var(--m20); }

  .ait-approach__visual {
    position: relative;
    top: auto;
    left: auto;
    width: calc(100% + var(--m56));
    height: var(--m330);
    margin: var(--m32) calc(-1 * var(--m28)) 0;
  }
}
