/* ===== JBG Bento – Split Block (Frontend) ===== */
.jbg-bento-split-block{
  --gap: 36px;
  --radius: 0px;
  --blue-width: 96px;    /* vertical tile width */
  --bar-width: 85%;      /* of the left column */
  --bar-height: 56px;

  /* 50/50 split */
  --col-left: 1fr;
  --col-right: 1fr;
}

/* Top area */
.jbgbs__top{ text-align:center; margin-bottom: clamp(28px, 5vw, 56px); }
.jbgbs__eyebrow{ margin:0 0 12px; letter-spacing:.12em; text-transform:uppercase; opacity:.85; font-size:12px; }
.jbgbs__headline{ margin:0 0 18px; font-size: clamp(28px, 4.4vw, 44px); line-height:1.15; }
.jbgbs__logos{ display:flex; gap: clamp(18px, 3.5vw, 56px); align-items:center; justify-content:center; flex-wrap:wrap; }

/* Grid */
.jbgbs__grid{
  display:grid;
  grid-template-columns: var(--col-left) var(--col-right);
  gap: var(--gap);
  align-items:start;
}

/* LEFT column */
.jbgbs__left{ display:flex; flex-direction:column; gap: var(--gap);height:100%; }
.jbgbs__leftLarge .jbgbs__image-figure{ aspect-ratio: 16 / 10; }
.jbgbs__bar{ width: var(--bar-width); height: var(--bar-height); }

/* RIGHT column */
.jbgbs__right{ display:flex; flex-direction:column; gap: var(--gap); }
.jbgbs__rightTop .jbgbs__image-figure{ aspect-ratio: 16 / 9; }
.jbgbs__rightBottomRow{
  display:grid;
  grid-template-columns: 1fr var(--blue-width);
  gap: var(--gap);
  align-items:stretch;
}
.jbgbs__rightBottom .jbgbs__image-figure{ aspect-ratio: 16 / 9; }
.jbgbs__blue{ width:100%; height:auto; border-radius: var(--radius); }

/* Generic tile */
.jbgbs__tile{ position:relative; overflow:hidden; border-radius:var(--radius); background:#0b0b0b;min-height:88%; }
.jbgbs__image-figure,
.jbgbs__image-figure img{ width:100%; height:100%; display:block; }
.jbgbs__image-figure{ margin:0; }
.jbgbs__image-figure img{ object-fit:cover; }

/* Responsive */
@media (max-width: 1100px){
  .jbgbs__grid{ grid-template-columns: 1fr; }
  .jbgbs__bar{ width: 100%; }
}