/* =========================================================================
 * Home page redesign 2026-10-21 — the rules shared by the new blocks.
 *
 *   - the tokens the reused service-page components expect (--lmx-ms-font,
 *     --lmx-ms-display, --lmx-ms-accent…): on the service pages they are
 *     declared on .lmx-ms, on the home page the frame is .lmx-home;
 *   - the buttons of the new blocks: one teal language (solid / outline) with
 *     the shared .lmx-btn-fx response, only the colours live here.
 * ====================================================================== */

.lmx-home{--lmx-ms-accent:#52C7C6;--lmx-ms-accent-hi:#83DAD9;--lmx-ms-on-accent:#04211F;--lmx-ms-ink:#15181d;
  --lmx-ms-display:'Outfit','Poppins',sans-serif;--lmx-ms-font:'Hanken Grotesk',Helvetica,Arial,sans-serif;
  --lmx-v2-teal:#52C7C6;--lmx-v2-teal-hi:#83DAD9;--lmx-v2-on-teal:#04211F}

/* The side padding of the sections on narrow screens — the same 28px the
   service-page frame uses (assets/css/mxdr-service/page.css): the reused
   components (recognition wall, slider, steps on a line) and the new blocks
   read --lmx-section-padding-x, which the home frame keeps at 140px. The hero
   sets its own 24px below 768px; the legacy blocks are hidden. */
@media (max-width:1024px){.lmx-home{--lmx-section-padding-x:28px}}

/* --- buttons ------------------------------------------------------------- */
.lmx-svc-btn,.lmx-inc-btn,.lmx-cus-btn,.lmx-ai-btn,.lmx-prb-btn,.lmx-int-cta,.lmx-fin-btn,.lmx-b10-cta{
  display:inline-flex;align-items:center;justify-content:center;gap:12px;box-sizing:border-box;
  height:max(44px,calc(52px * var(--lmx-v2-scale,1)));padding:0 max(18px,calc(28px * var(--lmx-v2-scale,1)));
  font-family:'Hanken Grotesk',Helvetica,Arial,sans-serif;font-size:max(12px,calc(14px * var(--lmx-v2-scale,1))) !important;font-weight:600;
  letter-spacing:.04em;line-height:1;text-decoration:none !important;white-space:nowrap;cursor:pointer;
  border:1px solid var(--lmx-v2-teal);border-radius:4px;color:var(--lmx-v2-teal) !important;background:rgba(82,199,198,.05);
  transition:background .25s ease,border-color .25s ease,color .25s ease}
.lmx-svc-btn:hover,.lmx-inc-btn:hover,.lmx-cus-btn:hover,.lmx-ai-btn:hover,.lmx-prb-btn:hover,.lmx-int-cta:hover,.lmx-fin-btn--outline:hover,.lmx-b10-cta:hover{background:rgba(82,199,198,.16)}
.lmx-fin-btn--solid,.lmx-prb-btn{background:var(--lmx-v2-teal) !important;color:var(--lmx-v2-on-teal) !important;border-color:var(--lmx-v2-teal)}
.lmx-fin-btn--solid:hover,.lmx-prb-btn:hover{background:var(--lmx-v2-teal-hi) !important;border-color:var(--lmx-v2-teal-hi)}
.lmx-svc-btn-arrow,.lmx-inc-btn-arrow,.lmx-cus-btn-arrow,.lmx-int-cta-arrow{width:18px;height:18px;flex:0 0 auto}
/* Uppercase, tracked variants (the mock-ups of The Integrations and The Response). */
.lmx-int-cta,.lmx-b10-cta{text-transform:uppercase;letter-spacing:.16em;font-size:max(11px,calc(13px * var(--lmx-v2-scale,1))) !important;border-radius:3px}

/* --- eyebrows / small caps ------------------------------------------------ */
.lmx-v2-eyebrow{display:block;color:var(--lmx-v2-teal);font-family:'Hanken Grotesk',Helvetica,Arial,sans-serif;font-size:max(10px,calc(12.5px * var(--lmx-v2-scale,1)));font-weight:600;letter-spacing:.3em;text-transform:uppercase;line-height:1.3}

@media (max-width:600px){
.lmx-svc-btn,.lmx-inc-btn,.lmx-cus-btn,.lmx-ai-btn,.lmx-prb-btn,.lmx-int-cta,.lmx-fin-btn,.lmx-b10-cta{white-space:normal;text-align:center;height:auto;min-height:46px;padding:11px 18px;line-height:1.25}
}