/* =========================================================================
 * Our Story — the page frame.
 *
 * 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): the page uses the same
 * .lmx-ms / .lmx-msec / .lmx-msec-inner classes and the same --ms-scale
 * variable. 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 “Company” parent in the header
 * (the file is only loaded on 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--os1,
.lmx-msec--os2,
.lmx-msec--os4,
.lmx-msec--os5,
.lmx-msec--os7,
.lmx-msec--os8,
.lmx-msec--empty{background-color:#000}
.lmx-msec--os3{background-color:#eef0f3}
/* Comparison: the light theme is the base layer, the dark one on top is clipped by the slider. */
.lmx-msec--os6{background-color:#e8edf0}

/* Scale bridges: the home components work off their own variables while this
   page's engine writes --ms-scale. */
.lmx-os .lmx-siem-inner{--siem-scale:var(--ms-scale,1)}
.lmx-os .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-cap-inner,
.lmx-ms > .lmx-msec[data-tall] > .lmx-ex-inner,
.lmx-ms > .lmx-msec[data-tall] > .lmx-ec-inner,
.lmx-ms > .lmx-msec[data-tall] > .lmx-ab-inner,
.lmx-ms > .lmx-msec[data-tall] > .lmx-mi-inner,
.lmx-ms > .lmx-msec[data-tall] > .lmx-siem-inner{display:block;height:auto;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 .lmx-siem-main{height:auto}
.lmx-ms > .lmx-msec[data-tall] > .lmx-ic-inner{height:auto}
}

/* The “Company” 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)}
