/* ==========================================================================
   KOBIL — Company — Section: "Inside KOBIL" / Powered by KOBIL technology
   Figma D-Company 5882:51152 (1280x523 — "Inside KOBIL" lockup, 60 gap, H2
   40/50, 90 gap, one 7-logo row 54 tall, closed by a 1px --navy-40 hairline) ·
   M-Company 5882:51449 (345x361 — same stack at phone scale, logos in 2 rows).
   The Aug-2026 frame renames the block from "KOBIL Ventures" to "Inside
   KOBIL", so the badge SVG gives way to a text + wordmark lockup.
   ========================================================================== */

.sec-company-ventures-logos {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--w90);
  /* 120 at the bottom incl. the hairline — the section still measures 523 */
  padding: var(--w120) var(--w40) var(--w119);
  background: var(--white);
  border-bottom: 1px solid var(--navy-40);
}

/* ---- Header: lockup + headline ------------------------------------------ */

.sec-company-ventures-logos .cvl-top {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--w60);
  max-width: var(--w696);
}

/* Figma measures the lockup at the wordmark's own 29px height — "Inside" is
   cap-trimmed there, so its line box is capped to match instead of adding
   the font's leading to the block. */
.sec-company-ventures-logos .cvl-lockup {
  display: flex;
  align-items: center;
  gap: var(--w7);
  height: var(--w29);
}

.sec-company-ventures-logos .cvl-lockup__word {
  font-family: var(--font-sans);
  font-size: var(--w38);
  font-weight: 500;
  line-height: var(--w29);
  color: #a0a5b0;
}

.sec-company-ventures-logos .cvl-lockup__mark {
  display: block;
  width: var(--w98);
  height: var(--w29);
}

.sec-company-ventures-logos .cvl-title {
  margin: 0;
  font-family: var(--font-sans);
  font-size: var(--w40);
  font-weight: 700;
  line-height: var(--w50);
  color: var(--navy);
  text-align: center;
}

/* ---- Logo row ---------------------------------------------------------- */

.sec-company-ventures-logos .cvl-logos {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: var(--w40) var(--w72);
  width: 100%;
  min-height: var(--w54);
}

.sec-company-ventures-logos .cvl-logo {
  display: flex;
}

.sec-company-ventures-logos .cvl-logo img {
  display: block;
}

/* Exact Figma dimensions (bounding boxes of the vectors) */
.sec-company-ventures-logos .cvl-logo--forbes img { width: var(--w107); height: var(--w27); }
.sec-company-ventures-logos .cvl-logo--esapp  img { width: var(--w158); height: var(--w25); }
.sec-company-ventures-logos .cvl-logo--spark  img { width: var(--w103); height: var(--w48); }
.sec-company-ventures-logos .cvl-logo--caree  img { width: var(--w109); height: var(--w53); }
.sec-company-ventures-logos .cvl-logo--mercan img { width: var(--w55);  height: var(--w48); }
.sec-company-ventures-logos .cvl-logo--skor   img { width: var(--w98);  height: var(--w36); }
.sec-company-ventures-logos .cvl-logo--paw    img { width: var(--w50);  height: var(--w45); }

/* ---- Phone (Figma 5882:51449: 60/16 padding, 48 gap, H2 28/36) ---- */

@media (max-width: 768px) {
  .sec-company-ventures-logos {
    gap: var(--m48);
    padding: var(--m60) var(--m16) var(--m59);
  }

  .sec-company-ventures-logos .cvl-top {
    gap: var(--m24);
    max-width: var(--m313);
  }

  .sec-company-ventures-logos .cvl-lockup {
    gap: var(--m4);
    height: var(--m17);
  }

  .sec-company-ventures-logos .cvl-lockup__word {
    font-size: var(--m21);
    line-height: var(--m17);
  }

  .sec-company-ventures-logos .cvl-lockup__mark {
    width: var(--m55);
    height: var(--m17);
  }

  .sec-company-ventures-logos .cvl-title {
    font-size: var(--m28);
    line-height: var(--m36);
  }

  .sec-company-ventures-logos .cvl-logos {
    max-width: var(--m345);
    gap: var(--m20) var(--m32);
    min-height: 0;
  }

  .sec-company-ventures-logos .cvl-logo--forbes img { width: var(--m61);  height: var(--m16); }
  .sec-company-ventures-logos .cvl-logo--esapp  img { width: var(--m103); height: var(--m17); }
  .sec-company-ventures-logos .cvl-logo--spark  img { width: var(--m61);  height: var(--m29); }
  .sec-company-ventures-logos .cvl-logo--caree  img { width: var(--m66);  height: var(--m32); }
  .sec-company-ventures-logos .cvl-logo--mercan img { width: var(--m28);  height: var(--m25); }
  .sec-company-ventures-logos .cvl-logo--skor   img { width: var(--m54);  height: var(--m20); }
  .sec-company-ventures-logos .cvl-logo--paw    img { width: var(--m27);  height: var(--m24); }
}