/* Map Check-Ins — image-driven page, scoped under .mci.
   Five background "zones" (one per photo set the client supplied), each
   spanning one or more of the page's existing .band sections. A zone
   supplies the paint; every section inside it keeps using the ordinary
   .band--dark cascade for text colour, so nothing about how content reads
   had to be reinvented — only where the background paint comes from. */

.mci-zone{ position:relative; overflow:hidden; }
.mci-zone__bg{
  position:absolute; left:-4%; right:-4%; top:-2%; bottom:-2%; z-index:0;
  pointer-events:none;
  background-size:cover; background-repeat:no-repeat; background-position:center;
}
.mci-zone__overlay{
  position:absolute; inset:0; z-index:1; pointer-events:none;
  background:rgba(9,14,18,.62);
}
.mci-zone__content{ position:relative; z-index:2; }
/* The zone supplies the paint; individual sections inside it go transparent
   so that paint shows through. Every dark-band text rule still applies —
   this only removes .band--dark's own background-image/-color layer. */
.mci-zone__content .band,
.mci-zone__content .band--dark,
.mci-zone__content .band--panel{ background:transparent; }
.mci-zone__content .tickrule{ border-color:var(--rule-invert); opacity:.5; }

/* ---------- editorial split: text one side, image the other ---------- */
.mci-split{
  display:grid; grid-template-columns:1fr; gap:var(--s5); align-items:center;
}
@media (min-width:860px){
  .mci-split{ grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:var(--s7); }
}
@media (max-width:859px){
  .mci-split__body{ order:1; }
  .mci-split__figure{ order:2; }
}
.mci-split__figure{
  position:relative; overflow:hidden; border-radius:2px;
  border:1px solid var(--rule-invert);
  box-shadow:0 30px 70px rgba(0,0,0,.5), 0 0 60px -20px rgba(18,144,140,.35);
}
.mci-split__figure img{ display:block; width:100%; height:auto; }
.mci-split__figure figcaption{
  padding:.7rem 1rem; font-family:var(--mono); font-size:.7rem; letter-spacing:.02em;
  color:var(--ink-invert-soft); background:rgba(9,14,18,.85);
  border-top:1px solid var(--rule-invert);
}

/* ---------- hero: same split, own spacing (no top-of-page card shadow
   competing with the header) ---------- */
.mci-hero{ padding-block:var(--s7); }
.mci-hero .mci-split{ align-items:center; }
.mci-hero .mci-split__figure{ box-shadow:0 40px 90px rgba(0,0,0,.55), 0 0 80px -20px rgba(18,144,140,.4); }