/* =========================================================================
 * Use Case — the page frame (one for all ten pages).
 *
 * The scroll container, the sections, the dots, the scale and the .lmx-ms-btn
 * buttons come from the shared service-page frame
 * (assets/css/mxdr-service/page.css, handle lmx-ms). Here: the section
 * backgrounds, the scale bridges to the home components, the spacing of “grown”
 * sections (data-tall from data-fit="grow") and the highlight of the “Use
 * Cases” parent in the top header row (the file is only loaded on pages of this
 * template, so the header rules do not touch the rest of the site).
 * ====================================================================== */

/* The section background is in place before the block CSS loads — no white flash. */
.lmx-msec--u1,
.lmx-msec--u3,
.lmx-msec--u5,
.lmx-msec--empty{background-color:#000}
.lmx-msec--u2{background-color:#eef0f3}
.lmx-msec--u4{background-color:#f1f2f5}

/* Scale bridges: the home components work off their own variables while this
   page's engine writes --ms-scale. */
.lmx-uc .lmx-siem-inner{--siem-scale:var(--ms-scale,1)}
.lmx-uc .lmx-b11-inner{--block11-scale:var(--ms-scale,1)}
.lmx-uc .lmx-b2-trusted{--block2-scale:var(--ms-scale,1)}

/* A section that has grown with its content (data-fit="grow" → data-tall): the
   text is at scale 1 and the section scrolls inside the page — it needs air
   above and below, which a centred layout does not provide. */
@media (min-width:1025px){
.lmx-ms > .lmx-msec[data-tall] > .lmx-ex-inner,
.lmx-ms > .lmx-msec[data-tall] > .lmx-siem-inner{padding-top:max(40px,calc(64px * var(--ms-scale,1)));padding-bottom:max(40px,calc(64px * var(--ms-scale,1)))}
.lmx-ms > .lmx-msec[data-tall] > .lmx-siem-inner{display:block}
.lmx-ms > .lmx-msec[data-tall] > .lmx-siem-inner .lmx-siem-main{height:auto}
}

/* The “Use Cases” parent is active while one of its child pages is open:
   nav-render adds the *-child-current class from the menu data; the styles live
   here only — on other pages the header is unchanged. */
.lmx-header .lmx-nav__link.lmx-nav__link--child-current{color:var(--lmx-teal)}
.lmx-drawer .lmx-drawer__toggle.lmx-drawer__toggle--child-current{color:var(--lmx-teal)}
