/* ============================================================================
 * MBSGuru marketing design system — 2026-09-22 (Design 2 foundation)
 * ----------------------------------------------------------------------------
 * Replaces the ~1,560 lines of inline CSS that lived in
 * resources/views/frontend/home/main/index.blade.php. Loaded by
 * frontend/layouts/styles.blade.php on the public layout. Every rule is
 * namespaced (.mbs-*) or scoped to the marketing hero, so dashboard and
 * coach-site pages are unaffected.
 *
 * Tokens = Design 2 palette (navy / sky / warm accent) that the live site
 * already uses. Do not introduce the Design 1 indigo/teal/pink palette.
 * ========================================================================== */
:root {
    --mbs-navy: #1a2e5a;
    --mbs-navy-2: #243f7a;
    --mbs-navy-deep: #0d1d3e;
    --mbs-sky: #3a7bd5;
    --mbs-sky-2: #5b9af5;
    --mbs-sky-text: #2b62b3; /* AA on white for small text (≈5.6:1); --mbs-sky is for fills/icons */
    --mbs-accent: #e87c2b;
    --mbs-accent-2: #f5a040;
    --mbs-green: #27a96c;
    --mbs-text: #0d1d3e;
    --mbs-muted: #5b6885;
    --mbs-line: #e4eaf5;
    --mbs-off: #f7f9fc;
    --mbs-white: #fff;
    --mbs-radius: 16px;
    --mbs-shadow: 0 2px 20px rgba(26, 46, 90, 0.06);
    --mbs-shadow-lg: 0 18px 52px rgba(26, 46, 90, 0.14);
    --mbs-font-display: 'Playfair Display', 'MBS Playfair Fallback', Georgia, 'Times New Roman', serif;
    --mbs-container: 1160px;
}

/* Metric-matched fallback for the theme font (Plus Jakarta Sans, loaded with display=swap by
   mbs-typography.css). Measured width ratio Jakarta/Arial = 1.042, so text set in the fallback
   wraps at the same points and the swap no longer moves the hero / strip (CLS). */
@font-face {
    font-family: 'MBS Jakarta Fallback';
    src: local('Arial'), local('Helvetica Neue'), local('Helvetica');
    size-adjust: 104.2%;
}
:root { --mbs-font-sans: 'Plus Jakarta Sans', 'MBS Jakarta Fallback', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif; }
/* The theme's main.min.css re-assigns p → Inter and headings/nav → Poppins (two more late-loading
   web fonts, each causing a swap shift). The marketing surface uses the platform typography
   (Plus Jakarta Sans, preloaded, metric-matched fallback) for body text, nav and card headings;
   display headings use Playfair (metric-matched fallback). Element selectors are included so these
   rules beat the theme's `p {}` / `h3 {}` rules. */
.mbs-hero__content, .mbs-hero p, .mbs-hero li, .mbs-hero a, .mbs-hero span,
.mbs-strip, .mbs-strip li,
.mbs-nav, .mbs-nav > li > a, .mbs-nav .sub-menu a, .mbs-nav .sub-menu small, .mbs-nav-right, .mbs-nav-right a, .mbs-mobile-cta,
.tgmobile__menu .mbs-drawer-cta a,
.mbs-section p, .mbs-section li, .mbs-section a, .mbs-section span, .mbs-section b, .mbs-section small, .mbs-section td, .mbs-section th, .mbs-section summary, .mbs-section h3, .mbs-section h4,
.mbs-final p, .mbs-final a, .mbs-page-hero p, .mbs-page-hero li, .mbs-page-hero a,
.mbs-footer, .mbs-footer p, .mbs-footer a, .mbs-footer li, .mbs-footer span, .mbs-footer h2, .mbs-footer div {
    font-family: var(--mbs-font-sans);
}

/* Metric-matched fallback for the display font (Playfair Display, display=optional). Measured
   width ratio Playfair 900 / Georgia 700 = 0.90, so headings wrap identically before and after
   the font arrives and the hero height does not change (CLS). */
@font-face {
    font-family: 'MBS Playfair Fallback';
    src: local('Georgia');
    size-adjust: 90%;
}

/* ---------- utilities ---------- */
.mbs-visually-hidden {
    position: absolute !important;
    width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
.mbs-skip-link {
    position: absolute; left: 12px; top: -60px; z-index: 2000;
    background: var(--mbs-navy); color: #fff; padding: 10px 16px; border-radius: 10px;
    font-weight: 700; text-decoration: none; transition: top .15s;
}
.mbs-skip-link:focus { top: 12px; outline: 3px solid var(--mbs-accent-2); }
.mbs-container { max-width: var(--mbs-container); margin: 0 auto; padding: 0 16px; }
.mbs-section { padding: 72px 0; }
.mbs-section--tight { padding: 44px 0; }
.mbs-section--off { background: var(--mbs-off); }
.mbs-section--navy { background: linear-gradient(135deg, #0f2f66, #1a2e5a 60%, #243f7a); color: #fff; }
.mbs-section--navy .mbs-sec-hd h2, .mbs-section--navy .mbs-sec-hd p { color: #fff; }
.mbs-section--navy .mbs-sec-hd p { color: rgba(255, 255, 255, 0.78); }
.mbs-ico { flex-shrink: 0; }

/* focus: one visible ring everywhere in the marketing surface */
.mbs-btn:focus-visible, .mbs-nav a:focus-visible, .mbs-footer a:focus-visible, .mbs-container .mbs-faq summary:focus-visible, .mbs-container .mbs-plan a:focus-visible, .mbs-link:focus-visible, .mbs-mobile-cta:focus-visible {
    outline: 3px solid var(--mbs-accent-2); outline-offset: 3px; border-radius: 10px;
}

/* ---------- headings ---------- */
.mbs-sec-hd { text-align: center; max-width: 720px; margin: 0 auto 40px; }
.mbs-sec-hd .mbs-eyebrow, .mbs-eyebrow {
    display: inline-block; font-size: 0.74rem; font-weight: 700; letter-spacing: 0.1em;
    text-transform: uppercase; color: var(--mbs-sky-text); margin-bottom: 12px;
}
.mbs-sec-hd h2, .mbs-h2 {
    font-family: var(--mbs-font-display); font-size: clamp(1.7rem, 3.2vw, 2.4rem); font-weight: 800;
    color: var(--mbs-navy); line-height: 1.18; margin: 0 0 14px; letter-spacing: -0.01em;
}
.mbs-sec-hd p { color: var(--mbs-muted); font-size: 1.02rem; line-height: 1.7; margin: 0; }
.mbs-sec-hd--left { text-align: left; margin-left: 0; }

/* ---------- buttons ---------- */
.mbs-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    min-height: 46px; padding: 10px 22px; border-radius: 12px; font-weight: 700; font-size: 0.95rem;
    text-decoration: none; border: 1.5px solid transparent; transition: transform .18s, box-shadow .18s, background .18s, color .18s;
    cursor: pointer; line-height: 1.2;
}
.mbs-btn:hover { text-decoration: none; transform: translateY(-1px); }
.mbs-btn--primary {
    color: #fff; background: linear-gradient(135deg, var(--mbs-accent), var(--mbs-accent-2));
    box-shadow: 0 6px 20px rgba(232, 124, 43, 0.35);
}
.mbs-btn--primary:hover { color: #fff; box-shadow: 0 10px 26px rgba(232, 124, 43, 0.45); }
.mbs-btn--ghost { color: var(--mbs-navy); border-color: #cfd8ea; background: #fff; }
.mbs-btn--ghost:hover { color: var(--mbs-sky); border-color: var(--mbs-sky); background: #f3f7fd; }
.mbs-btn--light { color: #fff; border-color: rgba(255, 255, 255, 0.45); background: rgba(255, 255, 255, 0.06); }
.mbs-btn--light:hover { color: #fff; background: rgba(255, 255, 255, 0.14); border-color: #fff; }
.mbs-btn--navy { color: #fff; background: var(--mbs-navy); }
.mbs-btn--navy:hover { color: #fff; background: var(--mbs-navy-2); }
.mbs-btn--sm { min-height: 40px; padding: 8px 16px; font-size: 0.88rem; border-radius: 10px; }
.mbs-btn--block { width: 100%; }
.mbs-cta-row { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.mbs-cta-note { font-size: 0.84rem; color: var(--mbs-muted); margin: 10px 0 0; }
.mbs-link { color: var(--mbs-sky-text); font-weight: 700; text-decoration: none; }
.mbs-link:hover { color: var(--mbs-navy); text-decoration: underline; }

/* ============================================================================
 * HEADER (platform host only — see header.blade.php)
 * ========================================================================== */
.logo a .mbs-wordmark { display: inline-block; font-size: 1.55rem; font-weight: 800; color: #fff; letter-spacing: -0.02em; line-height: 1; }
.sticky-menu .logo a .mbs-wordmark { color: var(--mbs-navy); }
.logo a .mbs-logo-img { max-height: 44px; width: auto; display: block; }
.mbs-nav { display: flex; align-items: center; gap: 4px; margin: 0; padding: 0; list-style: none; }
.mbs-nav > li { position: relative; }
/* 2026-09-26 — the theme's `.tgmenu__navbar-wrap ul` gap (25px) overrode the 4px
   above; with six items the row needed 708px of the 706px available in the 1110px
   container and "Company" wrapped onto the hero. Keep the desktop row on one line. */
.tgmenu__navbar-wrap .navigation.mbs-nav { gap: 12px; flex-wrap: nowrap; }
.mbs-nav > li > a {
    display: inline-flex; align-items: center; gap: 6px; padding: 22px 9px !important; color: #fff; font-weight: 600; font-size: 0.9rem;
    text-decoration: none; border-radius: 8px; white-space: nowrap;
}
/* keep logo · nav · actions on one row at ≥1200px (the theme let the action block wrap under the menu) */
.tgmenu__nav { flex-wrap: nowrap; }
.tgmenu__nav .tgmenu__action { flex-shrink: 0; }
.tgmenu__navbar-wrap.tgmenu__main-menu { flex: 1 1 auto; min-width: 0; }
.mbs-nav > li > a .mbs-caret { width: 10px; height: 10px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg) translateY(-3px); opacity: .8; }
.sticky-menu .mbs-nav > li > a { color: var(--mbs-navy); }
.mbs-nav > li > a:hover, .mbs-nav > li.is-open > a { color: var(--mbs-accent-2); }
.sticky-menu .mbs-nav > li > a:hover, .sticky-menu .mbs-nav > li.is-open > a { color: var(--mbs-sky); }
.tgmenu__navbar-wrap .mbs-nav .sub-menu, .mbs-nav .sub-menu {
    position: absolute; left: 0; top: 100%; min-width: 260px; background: #fff; border: 1px solid var(--mbs-line);
    border-radius: 14px; box-shadow: var(--mbs-shadow-lg); padding: 10px; margin: 0; list-style: none; z-index: 60;
    display: none; opacity: 1; visibility: visible; transform: none; transition: none;
}
.mbs-nav > li:hover > .sub-menu, .mbs-nav > li.is-open > .sub-menu { display: block; }
.mbs-nav .sub-menu li { margin: 0; padding: 0; }
.mbs-nav .sub-menu a {
    display: block; padding: 9px 12px !important; border-radius: 9px; color: var(--mbs-navy) !important; font-weight: 600; font-size: 0.9rem; text-decoration: none;
}
.mbs-nav .sub-menu a small { display: block; font-weight: 400; color: var(--mbs-muted); font-size: 0.78rem; margin-top: 1px; }
.mbs-nav .sub-menu a:hover, .mbs-nav .sub-menu a:focus-visible { background: #f0f5fd; color: var(--mbs-sky) !important; }
.mbs-nav .sub-menu--wide { min-width: 520px; display: none; grid-template-columns: 1fr 1fr; }
.mbs-nav > li:hover > .sub-menu--wide, .mbs-nav > li.is-open > .sub-menu--wide { display: grid; }
.mbs-nav .sub-menu__hd { padding: 6px 12px 4px; font-size: 0.7rem; letter-spacing: .08em; text-transform: uppercase; color: var(--mbs-muted); font-weight: 700; }
.mbs-nav-right { display: flex; align-items: center; gap: 8px; white-space: nowrap; }
.mbs-nav-right .mbs-btn--sm { min-height: 38px; padding: 7px 14px; font-size: 0.85rem; }
.mbs-nav-right .mbs-login { color: #fff; font-weight: 600; font-size: 0.9rem; text-decoration: none; padding: 8px 8px; }
.sticky-menu .mbs-nav-right .mbs-login { color: var(--mbs-navy); }
/* 2026-09-26 — the theme draws the hamburger white (for the dark hero); on the white
   sticky bar it disappeared. Same navy as the other sticky header items. */
.sticky-menu .mbs-mobile-cta + .mobile-nav-toggler, .sticky-menu .mbs-mobile-cta + .mobile-nav-toggler i { color: var(--mbs-navy); }
.mbs-nav-right .mbs-login:hover { color: var(--mbs-accent-2); }
.mbs-mobile-cta { display: none; }
/* 992–1199px: the theme still shows .tgmenu__action (Login / Book a Demo / Start Free), so no extra CTA there */
@media (max-width: 991px) {
    .mbs-mobile-cta {
        display: inline-flex; align-items: center; min-height: 38px; padding: 6px 14px; margin-left: auto; margin-right: 14px; border-radius: 10px;
        color: #fff; background: linear-gradient(135deg, var(--mbs-accent), var(--mbs-accent-2)); font-weight: 700; font-size: 0.85rem; text-decoration: none;
        box-shadow: 0 4px 14px rgba(232, 124, 43, 0.35); white-space: nowrap;
    }
    .mbs-mobile-cta:hover { color: #fff; }
    .tgmenu__nav { align-items: center; }
    .tgmenu__nav .mobile-nav-toggler { margin-left: 0; flex-shrink: 0; }
    /* platform host only (.mbs-mobile-cta precedes the toggler): reserve the icon box so the
       icon font loading later cannot change the header height (CLS) */
    .mbs-mobile-cta + .mobile-nav-toggler { width: 40px; height: 40px; display: inline-flex; align-items: center; justify-content: center; line-height: 1; }
    .mbs-mobile-cta + .mobile-nav-toggler i { display: block; line-height: 1; width: 24px; height: 24px; font-size: 24px; overflow: hidden; }
    .tgmenu__nav .logo { margin-right: 12px; }
    .inner-banner-con .mbs-inner-title { margin-top: 0; font-size: 1.6rem; }
    /* 2026-09-26 — the theme banner image is only ~106px tall on phones, so the H1 sat
       under the 63px header. Taller banner, content aligned to its bottom edge. Only
       banners that carry the marketing H1 (platform About / Contact) are affected. */
    .inner-banner-img:has(.mbs-inner-title) > img { height: 220px; object-fit: cover; }
    .inner-banner-main:has(.mbs-inner-title) { display: flex; align-items: flex-end; padding-bottom: 20px; }
    .inner-banner-main:has(.mbs-inner-title) > .container { width: 100%; }
}
/* mobile drawer clone of the marketing nav */
.tgmobile__menu .mbs-nav { display: block; }
.tgmobile__menu .mbs-nav > li > a { color: var(--mbs-navy); padding: 12px 56px 12px 16px !important; display: flex; justify-content: space-between; }
/* 2026-09-26 — the theme title-cases drawer sub-menu links; keep the sentence case used on desktop. */
.tgmobile__menu .mbs-nav .sub-menu a, .tgmobile__menu .mbs-nav .sub-menu a small { text-transform: none; }
.tgmobile__menu .mbs-nav .sub-menu { position: static; box-shadow: none; border: 0; padding: 0 0 8px 12px; min-width: 0; display: none; }
.tgmobile__menu .mbs-nav > li.is-open > .sub-menu { display: block; }
.tgmobile__menu .mbs-nav .sub-menu--wide { grid-template-columns: 1fr; }
.tgmobile__menu .mbs-nav > li.is-open > .sub-menu--wide { display: block; }
.tgmobile__menu .mbs-nav .sub-menu__hd { padding-left: 0; }
.tgmobile__menu .mbs-drawer-cta { display: flex; flex-direction: column; gap: 10px; margin: 14px 0 6px; width: 100%; list-style: none; }
.tgmobile__menu .mbs-drawer-cta .mbs-btn { width: 100%; }

/* ============================================================================
 * HERO
 * ========================================================================== */
.mbs-hero {
    position: relative; overflow: hidden; color: #fff;
    background: linear-gradient(135deg, #08132a, #163878 55%, #3070c8);
    padding: 132px 0 120px;
}
.mbs-hero__atmo {
    position: absolute; inset: 0; pointer-events: none;
    background:
        radial-gradient(ellipse 1000px 600px at 50% 120%, rgba(100, 170, 255, 0.28) 0%, transparent 55%),
        radial-gradient(ellipse 700px 400px at 10% 80%, rgba(70, 120, 220, 0.18) 0%, transparent 60%),
        radial-gradient(ellipse 500px 300px at 90% 40%, rgba(232, 124, 43, 0.10) 0%, transparent 50%);
}
.mbs-hero__grid { display: grid; grid-template-columns: 1.05fr 1fr; gap: 48px; align-items: start; position: relative; z-index: 2; }
.mbs-hero__grid > .mbs-stage { margin-top: 28px; }
.mbs-hero__grid > * { min-width: 0; } /* grid items must be allowed to shrink below the mock-up's intrinsic width */
.mbs-hero__eyebrow { max-width: 100%; white-space: normal; }
.mbs-laptop, .mbs-scr__main { min-width: 0; }
.mbs-hero__eyebrow {
    display: inline-flex; align-items: center; gap: 8px; background: rgba(255, 255, 255, 0.1); border: 1px solid rgba(255, 255, 255, 0.22);
    color: rgba(255, 255, 255, 0.92); font-size: 0.74rem; font-weight: 700; letter-spacing: 0.09em; text-transform: uppercase;
    padding: 7px 16px; border-radius: 40px; margin-bottom: 20px;
}
.mbs-hero__eyebrow .dot { width: 7px; height: 7px; border-radius: 50%; background: var(--mbs-accent); box-shadow: 0 0 8px var(--mbs-accent); }
.mbs-hero h1 {
    font-family: var(--mbs-font-display); font-size: clamp(2rem, 4.2vw, 3.3rem); font-weight: 900; color: #fff; line-height: 1.12;
    margin: 0 0 18px; text-shadow: 0 2px 32px rgba(0, 0, 0, 0.3);
}
.mbs-hero h1 .acc { color: var(--mbs-accent-2); }
.mbs-hero__sub { color: rgba(255, 255, 255, 0.82); font-size: clamp(0.98rem, 1.6vw, 1.12rem); line-height: 1.7; max-width: 560px; margin: 0 0 26px; }
.mbs-hero__sub em { color: #fff; font-style: italic; font-weight: 600; }
.mbs-hero .mbs-cta-note { color: rgba(255, 255, 255, 0.72); }
.mbs-hero__facts { display: flex; flex-wrap: wrap; gap: 8px 22px; margin: 26px 0 0; padding: 0; list-style: none; }
.mbs-hero__facts li { display: inline-flex; align-items: center; gap: 7px; font-size: 0.86rem; color: rgba(255, 255, 255, 0.85); }
.mbs-hero__facts .mbs-ico { color: var(--mbs-accent-2); }

/* device mock-up (CSS only, no fabricated figures) */
.mbs-stage { position: relative; display: flex; align-items: flex-end; justify-content: center; min-height: 380px; }
.mbs-stage__glow { position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%); width: 80%; height: 90px; background: radial-gradient(ellipse, rgba(58, 123, 213, 0.45) 0%, transparent 65%); filter: blur(24px); pointer-events: none; }
.mbs-laptop { position: relative; z-index: 2; width: 100%; max-width: 560px; }
.mbs-laptop__frame { background: #181818; border-radius: 14px 14px 0 0; border: 7px solid #242424; box-shadow: 0 0 0 1px #333, 0 30px 80px rgba(0, 0, 0, 0.6); overflow: hidden; }
.mbs-laptop__base { height: 12px; margin: 0 -4%; background: linear-gradient(180deg, #2b2b2b, #111); border-radius: 0 0 14px 14px; }
.mbs-laptop__bezel { height: 14px; background: #181818; display: flex; align-items: center; justify-content: center; }
.mbs-laptop__cam { width: 6px; height: 6px; border-radius: 50%; background: #0f0f0f; border: 1px solid #2c2c2c; }
.mbs-scr { background: #f4f6fb; color: var(--mbs-navy); font-size: 0.6rem; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif; }
.mbs-scr__top { background: var(--mbs-navy); color: #fff; padding: 9px 12px; display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.mbs-scr__brand { display: flex; align-items: center; gap: 6px; font-weight: 800; font-size: 0.7rem; }
.mbs-scr__brand i { width: 18px; height: 18px; border-radius: 5px; background: var(--mbs-accent); display: inline-block; }
.mbs-scr__tabs { display: flex; gap: 5px; }
.mbs-scr__tabs span { background: rgba(255, 255, 255, 0.14); border-radius: 6px; padding: 3px 9px; font-size: 0.56rem; color: rgba(255, 255, 255, 0.85); }
.mbs-scr__tabs span.on { background: rgba(255, 255, 255, 0.3); color: #fff; font-weight: 700; }
.mbs-scr__cta { background: #b9520f; color: #fff; font-weight: 800; font-size: 0.56rem; padding: 4px 10px; border-radius: 6px; }
.mbs-scr__body { display: flex; min-height: 230px; }
.mbs-scr__side { width: 150px; flex-shrink: 0; background: #fff; border-right: 1px solid #e8eef8; padding: 12px; }
.mbs-scr__side b { display: block; font-size: 0.66rem; margin-bottom: 2px; }
.mbs-scr__side small { display: block; color: var(--mbs-muted); font-size: 0.54rem; margin-bottom: 10px; }
.mbs-scr__side span { display: flex; align-items: center; gap: 6px; padding: 6px 8px; border-radius: 8px; margin-bottom: 2px; font-size: 0.58rem; }
.mbs-scr__side span.on { background: #e3ecfb; color: var(--mbs-navy); font-weight: 700; }
.mbs-scr__side span i { width: 14px; height: 14px; border-radius: 4px; background: #e4ecfb; display: inline-block; }
.mbs-scr__main { flex: 1; padding: 12px; }
.mbs-scr__banner { background: linear-gradient(135deg, var(--mbs-navy), var(--mbs-sky-2)); color: #fff; border-radius: 10px; padding: 11px 13px; margin-bottom: 9px; }
.mbs-scr__banner b { display: block; font-size: 0.68rem; margin-bottom: 2px; }
.mbs-scr__banner span { font-size: 0.55rem; opacity: .85; }
.mbs-scr__tiles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; margin-bottom: 9px; }
.mbs-scr__tile { background: #fff; border: 1px solid #e8eef8; border-radius: 9px; padding: 8px; }
.mbs-scr__tile small { display: block; color: var(--mbs-muted); font-size: 0.52rem; margin-bottom: 5px; }
.mbs-scr__tile i { display: block; height: 5px; border-radius: 3px; background: linear-gradient(90deg, var(--mbs-sky), var(--mbs-sky-2)); }
.mbs-scr__tile i.w2 { width: 70%; background: linear-gradient(90deg, var(--mbs-green), #3dd68c); }
.mbs-scr__tile i.w3 { width: 55%; background: linear-gradient(90deg, var(--mbs-accent), var(--mbs-accent-2)); }
.mbs-scr__cards { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.mbs-scr__card { background: #fff; border: 1px solid #e8eef8; border-radius: 9px; overflow: hidden; }
.mbs-scr__card i { display: block; height: 34px; background: linear-gradient(135deg, #18906a, #1a72c0); }
.mbs-scr__card i.c2 { background: linear-gradient(135deg, #8a28e0, #3a68d0); }
.mbs-scr__card b { display: block; padding: 6px 8px 3px; font-size: 0.56rem; }
.mbs-scr__card span { display: block; margin: 0 8px 8px; height: 4px; border-radius: 2px; background: #e8eef8; position: relative; overflow: hidden; }
.mbs-scr__card span::after { content: ''; position: absolute; inset: 0; width: 60%; background: var(--mbs-sky); }
.mbs-phone { position: absolute; left: 0; bottom: -8px; z-index: 3; width: 168px; transform: rotate(-6deg); }
.mbs-phone__frame { background: #0a0a0a; border-radius: 30px; border: 6px solid #1c1c1e; box-shadow: 0 0 0 1px #2c2c2e, 0 28px 60px rgba(0, 0, 0, 0.7); overflow: hidden; }
.mbs-phone__notch { height: 20px; display: flex; align-items: center; justify-content: center; }
.mbs-phone__notch i { width: 56px; height: 7px; background: #161618; border-radius: 4px; }
.mbs-phone__scr { background: linear-gradient(155deg, #0e1e4a, #1a3a8a, #2456b8); padding: 10px 10px 14px; color: #fff; font-size: 0.58rem; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif; }
.mbs-phone__hdr { display: flex; align-items: center; gap: 7px; margin-bottom: 10px; }
.mbs-phone__hdr i { width: 28px; height: 28px; border-radius: 50%; background: linear-gradient(135deg, var(--mbs-accent), var(--mbs-accent-2)); flex-shrink: 0; }
.mbs-phone__hdr b { display: block; font-size: 0.62rem; }
.mbs-phone__hdr small { color: rgba(255, 255, 255, 0.6); font-size: 0.5rem; }
.mbs-phone__card { background: rgba(255, 255, 255, 0.1); border: 1px solid rgba(255, 255, 255, 0.14); border-radius: 12px; padding: 9px; margin-bottom: 8px; }
.mbs-phone__thumb { height: 58px; border-radius: 9px; background: linear-gradient(135deg, #15906a, #1280b8); margin-bottom: 7px; display: flex; align-items: center; justify-content: center; }
.mbs-phone__thumb i { width: 26px; height: 26px; border-radius: 50%; background: rgba(255, 255, 255, 0.25); border: 1px solid rgba(255, 255, 255, 0.4); position: relative; }
.mbs-phone__thumb i::after { content: ''; position: absolute; left: 10px; top: 7px; border-left: 8px solid #fff; border-top: 5px solid transparent; border-bottom: 5px solid transparent; }
.mbs-phone__card b { display: block; font-size: 0.6rem; margin-bottom: 7px; }
.mbs-phone__btn { background: linear-gradient(135deg, var(--mbs-accent), var(--mbs-accent-2)); border-radius: 8px; text-align: center; padding: 7px; font-weight: 800; font-size: 0.58rem; }
.mbs-phone__mini { display: flex; align-items: center; gap: 8px; background: rgba(255, 255, 255, 0.08); border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 10px; padding: 8px 9px; }
.mbs-phone__mini i { width: 24px; height: 24px; border-radius: 50%; background: linear-gradient(135deg, var(--mbs-sky-2), var(--mbs-green)); flex-shrink: 0; }
.mbs-phone__mini span { line-height: 1.4; color: rgba(255, 255, 255, 0.85); }
.mbs-stage__caption { position: absolute; right: 0; bottom: -34px; font-size: 0.7rem; color: rgba(255, 255, 255, 0.5); }
.mbs-hero__wave { position: absolute; left: 0; right: 0; bottom: -2px; line-height: 0; z-index: 1; }
.mbs-hero__wave svg { display: block; width: 100%; height: 90px; }

/* ============================================================================
 * CAPABILITY STRIP
 * ========================================================================== */
.mbs-strip { background: #fff; border-bottom: 1px solid var(--mbs-line); }
.mbs-strip__list { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 28px; list-style: none; margin: 0; padding: 18px 0; }
.mbs-strip__list li { display: inline-flex; align-items: center; gap: 8px; font-size: 0.88rem; font-weight: 600; color: var(--mbs-navy); }
.mbs-strip__list .mbs-ico { color: var(--mbs-sky); }

/* ============================================================================
 * PILLARS / FEATURE COLUMNS
 * ========================================================================== */
.mbs-pillars { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; }
.mbs-pillar { padding: 8px 36px 8px 0; margin-right: 36px; border-right: 1px solid var(--mbs-line); }
.mbs-pillar:last-child { border-right: 0; margin-right: 0; padding-right: 0; }
.mbs-pillar__icon {
    width: 56px; height: 56px; border-radius: 14px; display: flex; align-items: center; justify-content: center; color: #fff; margin-bottom: 16px;
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.09);
}
.mbs-pillar__icon--b { background: linear-gradient(135deg, var(--mbs-sky), var(--mbs-sky-2)); }
.mbs-pillar__icon--o { background: linear-gradient(135deg, var(--mbs-accent), var(--mbs-accent-2)); }
.mbs-pillar__icon--g { background: linear-gradient(135deg, var(--mbs-green), #3dd68c); }
.mbs-pillar h3 { font-size: 1.08rem; font-weight: 800; color: var(--mbs-navy); margin: 0 0 8px; }
.mbs-pillar p { font-size: 0.92rem; color: var(--mbs-muted); line-height: 1.68; margin: 0 0 10px; }
.mbs-pillar ul { margin: 0; padding: 0; list-style: none; }
.mbs-pillar li { font-size: 0.86rem; color: var(--mbs-text); padding: 3px 0 3px 22px; position: relative; }
.mbs-pillar li::before { content: ''; position: absolute; left: 2px; top: 9px; width: 10px; height: 6px; border-left: 2px solid var(--mbs-green); border-bottom: 2px solid var(--mbs-green); transform: rotate(-45deg); }

/* ============================================================================
 * ECOSYSTEM FLOW
 * ========================================================================== */
.mbs-flow { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; list-style: none; margin: 0; padding: 0; counter-reset: flow; }
.mbs-flow li {
    position: relative; background: #fff; border: 1px solid var(--mbs-line); border-radius: 14px; padding: 16px 14px 14px; box-shadow: var(--mbs-shadow); counter-increment: flow;
}
.mbs-flow li::before { content: counter(flow, decimal-leading-zero); position: absolute; top: 10px; right: 12px; font-size: 0.66rem; font-weight: 800; color: #b8c4dc; letter-spacing: .06em; }
.mbs-flow li::after { content: ''; position: absolute; right: -11px; top: 50%; width: 8px; height: 8px; border-top: 2px solid #b8c4dc; border-right: 2px solid #b8c4dc; transform: translateY(-50%) rotate(45deg); }
.mbs-flow li:nth-child(5n)::after, .mbs-flow li:last-child::after { display: none; }
.mbs-flow .mbs-ico { color: var(--mbs-sky); margin-bottom: 10px; }
.mbs-flow b { display: block; font-size: 0.92rem; color: var(--mbs-navy); margin-bottom: 4px; }
.mbs-flow span { font-size: 0.8rem; color: var(--mbs-muted); line-height: 1.5; display: block; }

/* ============================================================================
 * SPLIT (white-label, CRM, automation, migration)
 * ========================================================================== */
.mbs-split { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; }
.mbs-split--rev > :first-child { order: 2; }
.mbs-split h2 { text-align: left; }
.mbs-split p.lead { color: var(--mbs-muted); font-size: 1rem; line-height: 1.7; margin: 0 0 18px; }
.mbs-checklist { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 20px; margin: 0 0 22px; padding: 0; list-style: none; }
.mbs-checklist li { display: flex; align-items: flex-start; gap: 9px; font-size: 0.9rem; color: var(--mbs-text); line-height: 1.5; }
.mbs-checklist .mbs-ico { color: var(--mbs-green); margin-top: 2px; }
.mbs-checklist--one { grid-template-columns: 1fr; }
.mbs-panel { background: #fff; border: 1px solid var(--mbs-line); border-radius: 20px; box-shadow: var(--mbs-shadow); padding: 26px; }
.mbs-panel--navy { background: linear-gradient(150deg, #0f2f66, #243f7a); color: #fff; border: 0; }
.mbs-panel h3 { font-size: 1.05rem; font-weight: 800; margin: 0 0 12px; color: inherit; }
.mbs-brand-demo { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.mbs-brand-demo__item { background: rgba(255, 255, 255, 0.08); border: 1px solid rgba(255, 255, 255, 0.14); border-radius: 12px; padding: 12px 14px; }
.mbs-brand-demo__item small { display: block; font-size: 0.68rem; text-transform: uppercase; letter-spacing: .06em; color: rgba(255, 255, 255, 0.6); margin-bottom: 4px; }
.mbs-brand-demo__item b { font-size: 0.9rem; }
.mbs-brand-demo__swatches { display: flex; gap: 6px; margin-top: 6px; }
.mbs-brand-demo__swatches i { width: 18px; height: 18px; border-radius: 6px; display: inline-block; border: 1px solid rgba(255, 255, 255, 0.35); }
.mbs-status { display: inline-block; font-size: 0.68rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; padding: 3px 9px; border-radius: 30px; margin-left: 8px; vertical-align: middle; }
.mbs-status--now { background: #e6f6ee; color: #0d5c34; }
.mbs-status--dep { background: #fff3e6; color: #8a3f05; }
.mbs-status--soon { background: #eef2fa; color: #3a4a6e; }
.mbs-steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.mbs-steps li { display: flex; gap: 12px; align-items: flex-start; background: #fff; border: 1px solid var(--mbs-line); border-radius: 12px; padding: 12px 14px; }
.mbs-steps li b { display: block; font-size: 0.92rem; color: var(--mbs-navy); }
.mbs-steps li span { font-size: 0.84rem; color: var(--mbs-muted); }
.mbs-steps li i { width: 28px; height: 28px; border-radius: 50%; background: var(--mbs-navy); color: #fff; font-style: normal; font-weight: 800; font-size: 0.78rem; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }

/* ============================================================================
 * PRODUCT CARDS (Design 2 mock-up cards) + FEATURE GRID
 * ========================================================================== */
.mbs-plat-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.mbs-pc { background: #fff; border-radius: 20px; overflow: hidden; box-shadow: var(--mbs-shadow); border: 1px solid rgba(26, 46, 90, 0.05); transition: transform .25s, box-shadow .25s; }
.mbs-pc:hover { transform: translateY(-6px); box-shadow: var(--mbs-shadow-lg); }
.mbs-pc__top { height: 190px; display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden; }
.mbs-pc__top--1 { background: linear-gradient(150deg, #d8e8fd, #b8d0fa, #e0ecfe); }
.mbs-pc__top--2 { background: linear-gradient(150deg, #cce8f8, #a8d8f4, #d5eefa); }
.mbs-pc__top--3 { background: linear-gradient(150deg, #fde8c8, #f8d8a0, #fef0d8); }
.mbs-pc__foot { padding: 18px 20px 22px; }
.mbs-pc__foot h3 { font-size: 1.04rem; font-weight: 800; color: var(--mbs-navy); margin: 0 0 6px; }
.mbs-pc__foot p { font-size: 0.86rem; color: var(--mbs-muted); line-height: 1.62; margin: 0; }
/* course mock */
.csm { width: 84%; max-width: 280px; background: #fff; border-radius: 12px; overflow: hidden; box-shadow: 0 8px 30px rgba(0, 0, 0, 0.14); }
.csm-tp { background: var(--mbs-navy); padding: 7px 11px; display: flex; align-items: center; justify-content: space-between; color: #fff; font-size: 0.6rem; font-weight: 700; }
.csm-ds { display: flex; gap: 4px; } .csm-ds span { width: 6px; height: 6px; border-radius: 50%; background: rgba(255, 255, 255, 0.3); }
.csm-bd { padding: 10px 11px; }
.csm-r { height: 8px; background: var(--mbs-line); border-radius: 3px; margin-bottom: 6px; }
.csm-r.w7 { width: 70%; } .csm-r.w5 { width: 50%; }
.csm-r.h1 { background: linear-gradient(90deg, var(--mbs-sky), var(--mbs-sky-2)); }
.csm-r.h2 { background: linear-gradient(90deg, var(--mbs-accent), var(--mbs-accent-2)); width: 65%; margin-top: 8px; }
.csm-cg { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin-top: 8px; }
.csm-mc { background: var(--mbs-off); border-radius: 7px; padding: 6px; border: 1px solid var(--mbs-line); }
.csm-mi { height: 24px; border-radius: 5px; margin-bottom: 5px; background: linear-gradient(135deg, #27a96c, #2a7ad5); }
.csm-mi.m2 { background: linear-gradient(135deg, #9a3ae8, #4a7ad5); }
.csm-ml { height: 4px; background: var(--mbs-line); border-radius: 2px; margin-bottom: 3px; } .csm-ml.ms { width: 60%; }
/* live mock */
.cmk { width: 84%; max-width: 260px; background: #111; border-radius: 12px; overflow: hidden; box-shadow: 0 8px 30px rgba(0, 0, 0, 0.28); }
.cm-vid { height: 118px; background: linear-gradient(135deg, #0c1e52, #1a4898, #2460c0); display: flex; align-items: center; justify-content: center; position: relative; }
.cm-vg { position: absolute; inset: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 2px; opacity: .45; }
.cm-vg div { background: linear-gradient(135deg, #162a60, #1a4880); }
.cm-pl { width: 42px; height: 42px; border-radius: 50%; z-index: 2; background: rgba(255, 255, 255, 0.22); border: 2px solid rgba(255, 255, 255, 0.4); position: relative; }
.cm-pl::after { content: ''; position: absolute; left: 16px; top: 12px; border-left: 12px solid #fff; border-top: 7px solid transparent; border-bottom: 7px solid transparent; }
.cm-ctrl { background: #1a1a1a; padding: 9px 11px; display: flex; align-items: center; gap: 7px; }
.cm-btn { width: 26px; height: 26px; border-radius: 50%; } .cb-r { background: #e74c3c; } .cb-g { background: #27a96c; } .cb-b { background: var(--mbs-sky); }
.cm-t { color: rgba(255, 255, 255, 0.5); font-size: 0.56rem; margin-left: auto; font-weight: 600; }
.cm-ppl { background: #141414; padding: 6px 11px; display: flex; gap: 5px; }
.cm-chip { background: #222; border-radius: 20px; padding: 3px 9px; font-size: 0.54rem; color: rgba(255, 255, 255, 0.65); }
/* certificate mock */
.crt { width: 78%; max-width: 230px; background: #fff; border-radius: 12px; box-shadow: 0 8px 30px rgba(0, 0, 0, 0.13); border: 2px solid #d4a84a; padding: 14px; }
.crt-in { border: 1.5px dashed #c8a040; border-radius: 9px; padding: 12px; text-align: center; }
.crt-lbl { font-size: 0.56rem; color: var(--mbs-accent); font-weight: 800; letter-spacing: .1em; text-transform: uppercase; margin-bottom: 6px; }
.crt-seal { width: 40px; height: 40px; border-radius: 50%; background: linear-gradient(135deg, #f5c840, #e8a020); margin: 0 auto 8px; box-shadow: 0 3px 12px rgba(232, 160, 32, 0.38); }
.crt-tt { font-family: var(--mbs-font-display); font-size: 0.72rem; color: var(--mbs-navy); font-weight: 800; margin-bottom: 4px; line-height: 1.3; }
.crt-div { height: 1px; background: linear-gradient(90deg, transparent, #d4a84a, transparent); margin: 7px 0; }
.crt-nm { font-size: 0.66rem; color: var(--mbs-navy); font-weight: 700; }
.crt-sb { font-size: 0.54rem; color: var(--mbs-muted); }
.crt-sig { margin-top: 8px; padding-top: 7px; border-top: 1px solid #eed8a0; font-family: var(--mbs-font-display); font-size: 0.6rem; color: var(--mbs-navy); opacity: .55; font-style: italic; }

.mbs-feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 28px; }
.mbs-feature { background: #fff; border: 1px solid var(--mbs-line); border-radius: 14px; padding: 18px 18px 16px; }
.mbs-feature .mbs-ico { color: var(--mbs-sky); margin-bottom: 10px; }
.mbs-feature h3 { font-size: 0.98rem; font-weight: 800; color: var(--mbs-navy); margin: 0 0 6px; }
.mbs-feature p { font-size: 0.85rem; color: var(--mbs-muted); line-height: 1.6; margin: 0; }

/* ============================================================================
 * SOLUTIONS (who it is for)
 * ========================================================================== */
.mbs-solutions { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.mbs-solution { background: #fff; border-radius: 18px; padding: 24px; border: 1px solid var(--mbs-line); box-shadow: var(--mbs-shadow); }
.mbs-solution .mbs-ico { color: var(--mbs-accent); margin-bottom: 12px; }
.mbs-solution h3 { font-size: 1.04rem; font-weight: 800; color: var(--mbs-navy); margin: 0 0 8px; }
.mbs-solution p { font-size: 0.88rem; color: var(--mbs-muted); line-height: 1.62; margin: 0 0 10px; }
.mbs-solution ul { margin: 0; padding: 0 0 0 16px; font-size: 0.85rem; color: var(--mbs-text); line-height: 1.7; }

/* ============================================================================
 * COMPARISON TABLE (why MBSGuru)
 * ========================================================================== */
.mbs-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; border: 1px solid var(--mbs-line); border-radius: 16px; background: #fff; box-shadow: var(--mbs-shadow); }
.mbs-table { width: 100%; border-collapse: collapse; min-width: 640px; font-size: 0.9rem; }
.mbs-table th, .mbs-table td { padding: 13px 16px; border-bottom: 1px solid var(--mbs-line); text-align: left; vertical-align: top; }
.mbs-table thead th { background: var(--mbs-navy); color: #fff; font-weight: 700; font-size: 0.84rem; letter-spacing: .02em; }
.mbs-table thead th:first-child { border-top-left-radius: 16px; } .mbs-table thead th:last-child { border-top-right-radius: 16px; }
.mbs-table tbody tr:last-child td { border-bottom: 0; }
.mbs-table td.is-us { background: #f3f8ff; font-weight: 600; color: var(--mbs-navy); }
.mbs-table td .mbs-ico { color: var(--mbs-green); vertical-align: -5px; margin-right: 5px; }
.mbs-table__note { font-size: 0.8rem; color: var(--mbs-muted); margin: 12px 0 0; }

/* ============================================================================
 * PRICING
 * ========================================================================== */
.mbs-container .mbs-plans { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; align-items: stretch; }
.mbs-container .mbs-plan { position: relative; background: #fff; border: 1px solid var(--mbs-line); border-radius: 20px; padding: 26px 24px 24px; display: flex; flex-direction: column; box-shadow: var(--mbs-shadow); }
.mbs-container .mbs-plan--featured { border: 2px solid var(--mbs-sky); box-shadow: 0 18px 44px -14px rgba(58, 123, 213, 0.35); }
.mbs-container .mbs-plan__badge { position: absolute; top: -12px; left: 24px; background: linear-gradient(90deg, var(--mbs-sky), var(--mbs-sky-2)); color: #fff; font-size: 0.68rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; padding: 4px 12px; border-radius: 999px; }
.mbs-container .mbs-plan__name { font-size: 1.1rem; font-weight: 800; color: var(--mbs-navy); margin: 0 0 4px; }
.mbs-container .mbs-plan__who { font-size: 0.84rem; color: var(--mbs-muted); margin: 0 0 16px; min-height: 2.6em; }
.mbs-container .mbs-plan__price { display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; margin-bottom: 4px; }
.mbs-container .mbs-plan__amt { font-size: 2rem; font-weight: 800; color: var(--mbs-navy); letter-spacing: -0.02em; line-height: 1; }
.mbs-container .mbs-plan__amt--contact { font-size: 1.4rem; }
.mbs-container .mbs-plan__per { font-size: 0.84rem; color: var(--mbs-muted); }
.mbs-container .mbs-plan__setup { font-size: 0.82rem; color: var(--mbs-muted); margin: 0 0 16px; }
.mbs-container .mbs-plan__rows { list-style: none; margin: 0 0 16px; padding: 14px 0 0; border-top: 1px solid var(--mbs-line); display: grid; gap: 8px; }
.mbs-container .mbs-plan__rows li { display: flex; justify-content: space-between; gap: 12px; font-size: 0.86rem; }
.mbs-container .mbs-plan__rows li span { color: var(--mbs-muted); }
.mbs-container .mbs-plan__rows li b { color: var(--mbs-navy); text-align: right; }
.mbs-container .mbs-plan__feats { list-style: none; margin: 0 0 20px; padding: 0; flex: 1; }
.mbs-container .mbs-plan__feats li { display: flex; gap: 8px; align-items: flex-start; font-size: 0.86rem; color: var(--mbs-text); padding: 4px 0; line-height: 1.45; }
.mbs-container .mbs-plan__feats .mbs-ico { color: var(--mbs-green); margin-top: 2px; }
.mbs-container .mbs-plan .mbs-btn { width: 100%; }
.mbs-container .mbs-plan__foot { font-size: 0.76rem; color: var(--mbs-muted); text-align: center; margin: 10px 0 0; }
.mbs-pricing__note { text-align: center; font-size: 0.86rem; color: var(--mbs-muted); margin: 22px auto 0; max-width: 760px; line-height: 1.6; }
.mbs-pricing__note strong { color: var(--mbs-navy); }
.mbs-container .mbs-compare { margin-top: 34px; }
.mbs-container .mbs-compare .mbs-table { min-width: 560px; }
.mbs-container .mbs-compare .mbs-table td { text-align: center; }
.mbs-container .mbs-compare .mbs-table td:first-child, .mbs-container .mbs-compare .mbs-table tbody th:first-child { text-align: left; color: var(--mbs-muted); font-weight: 600; }
.mbs-container .mbs-compare .mbs-table thead th:first-child { text-align: left; }
.mbs-container .mbs-compare .mbs-table th { text-align: center; }
.mbs-container .mbs-compare .mbs-table th.is-feat, .mbs-container .mbs-compare .mbs-table td.is-feat { background: #f3f8ff; }
.mbs-container .mbs-compare .mbs-table thead th.is-feat { background: var(--mbs-navy-2); }

/* ============================================================================
 * SECURITY / TRUST
 * ========================================================================== */
.mbs-trust-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.mbs-trust { background: rgba(255, 255, 255, 0.06); border: 1px solid rgba(255, 255, 255, 0.14); border-radius: 14px; padding: 18px; }
.mbs-trust .mbs-ico { color: var(--mbs-accent-2); margin-bottom: 10px; }
.mbs-trust b { display: block; font-size: 0.94rem; margin-bottom: 4px; }
.mbs-trust span { font-size: 0.82rem; color: rgba(255, 255, 255, 0.72); line-height: 1.55; display: block; }
.mbs-logos { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 14px; margin: 26px 0 0; padding: 0; list-style: none; }
.mbs-logos li { font-size: 0.78rem; font-weight: 700; color: rgba(255, 255, 255, 0.75); border: 1px solid rgba(255, 255, 255, 0.2); border-radius: 30px; padding: 5px 12px; }
.mbs-logos__lbl { text-align: center; font-size: 0.74rem; letter-spacing: .08em; text-transform: uppercase; color: rgba(255, 255, 255, 0.5); margin: 28px 0 0; }

/* ============================================================================
 * FAQ (native <details>, crawlable)
 * ========================================================================== */
.mbs-container .mbs-faq { max-width: 860px; margin: 0 auto; }
.mbs-container .mbs-faq details { background: #fff; border: 1px solid var(--mbs-line); border-radius: 14px; margin-bottom: 10px; padding: 0 20px; box-shadow: var(--mbs-shadow); }
.mbs-container .mbs-faq details[open] { border-color: #c9d8f2; }
.mbs-container .mbs-faq summary { list-style: none; cursor: pointer; padding: 16px 32px 16px 0; font-weight: 700; color: var(--mbs-navy); font-size: 0.98rem; position: relative; }
.mbs-container .mbs-faq summary::-webkit-details-marker { display: none; }
.mbs-container .mbs-faq summary::after { content: ''; position: absolute; right: 4px; top: 20px; width: 9px; height: 9px; border-right: 2px solid var(--mbs-sky); border-bottom: 2px solid var(--mbs-sky); transform: rotate(45deg); transition: transform .2s; }
.mbs-container .mbs-faq details[open] summary::after { transform: rotate(225deg); top: 24px; }
.mbs-container .mbs-faq .mbs-faq__a { padding: 0 0 18px; color: var(--mbs-muted); font-size: 0.92rem; line-height: 1.7; }
.mbs-container .mbs-faq .mbs-faq__a p { margin: 0 0 8px; } .mbs-container .mbs-faq .mbs-faq__a p:last-child { margin: 0; }

/* ============================================================================
 * FINAL CTA
 * ========================================================================== */
.mbs-final { position: relative; overflow: hidden; background: linear-gradient(135deg, #08132a, #163878 55%, #3070c8); color: #fff; padding: 72px 0; text-align: center; }
.mbs-final h2 { font-family: var(--mbs-font-display); font-size: clamp(1.7rem, 3.4vw, 2.5rem); font-weight: 900; color: #fff; margin: 0 0 12px; }
.mbs-final p { color: rgba(255, 255, 255, 0.8); max-width: 560px; margin: 0 auto 26px; font-size: 1rem; line-height: 1.7; }
.mbs-final .mbs-cta-row { justify-content: center; }
.mbs-final .mbs-cta-note { color: rgba(255, 255, 255, 0.7); }

/* ============================================================================
 * ENTERPRISE FOOTER (platform host only)
 * ========================================================================== */
.mbs-footer { background: var(--mbs-navy-deep); color: #c6d0e4; padding: 56px 0 24px; }
.mbs-footer p, .mbs-footer li, .mbs-footer span { color: #c6d0e4; }
.mbs-footer__grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1fr; gap: 36px; margin-bottom: 36px; }
.mbs-footer__brand .mbs-wordmark { color: #fff; font-size: 1.5rem; font-weight: 800; text-decoration: none; letter-spacing: -0.02em; display: inline-block; margin-bottom: 12px; }
.mbs-footer__brand p { font-size: 0.88rem; line-height: 1.65; margin: 0 0 16px; max-width: 360px; color: #c6d0e4; }
.mbs-footer__contact { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; font-size: 0.86rem; }
.mbs-footer__contact li { display: flex; gap: 8px; align-items: flex-start; }
.mbs-footer__contact .mbs-ico { color: var(--mbs-accent-2); margin-top: 1px; }
.mbs-footer__contact a { color: #e6ecf7; text-decoration: none; }
.mbs-footer__contact a:hover { color: #fff; text-decoration: underline; }
.mbs-footer h2 { font-size: 0.78rem; letter-spacing: .1em; text-transform: uppercase; color: #fff; font-weight: 700; margin: 0 0 14px; }
.mbs-footer ul.mbs-footer__links { list-style: none; margin: 0; padding: 0; display: grid; gap: 9px; }
.mbs-footer__links a { color: #c6d0e4; text-decoration: none; font-size: 0.9rem; }
.mbs-footer__links a:hover { color: #fff; text-decoration: underline; }
.mbs-footer__cta { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
.mbs-footer__bottom { border-top: 1px solid rgba(255, 255, 255, 0.12); padding-top: 20px; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px; font-size: 0.82rem; color: #9fb0cf; }
.mbs-footer__legal { display: flex; flex-wrap: wrap; gap: 6px 18px; list-style: none; margin: 0; padding: 0; }
.mbs-footer__legal a { color: #c6d0e4; text-decoration: none; }
.mbs-footer__legal a:hover { color: #fff; }
.mbs-footer__social { display: flex; gap: 8px; list-style: none; margin: 0; padding: 0; }
.mbs-footer__social a { width: 36px; height: 36px; border-radius: 10px; border: 1px solid rgba(255, 255, 255, 0.18); display: inline-flex; align-items: center; justify-content: center; color: #e6ecf7; text-decoration: none; }
.mbs-footer__social a:hover { background: rgba(255, 255, 255, 0.1); color: #fff; }

/* ============================================================================
 * INNER PAGE HERO (pricing page etc.) + inner banner title
 * ========================================================================== */
.mbs-page-hero { background: linear-gradient(135deg, #08132a, #163878 55%, #3070c8); color: #fff; padding: 140px 0 60px; text-align: center; }
.mbs-page-hero h1 { font-family: var(--mbs-font-display); font-size: clamp(1.9rem, 3.6vw, 2.8rem); font-weight: 900; color: #fff; margin: 0 0 12px; }
.mbs-page-hero p { color: rgba(255, 255, 255, 0.82); max-width: 640px; margin: 0 auto; font-size: 1.02rem; line-height: 1.7; }
.mbs-container .mbs-breadcrumb { display: flex; justify-content: center; gap: 8px; list-style: none; margin: 0 0 14px; padding: 0; font-size: 0.8rem; color: rgba(255, 255, 255, 0.65); }
.mbs-container .mbs-breadcrumb a { color: rgba(255, 255, 255, 0.85); text-decoration: none; }
.mbs-container .mbs-breadcrumb li + li::before { content: '/'; margin-right: 8px; opacity: .5; }
.inner-banner-con .mbs-inner-title { color: #fff; font-family: var(--mbs-font-display); font-size: clamp(1.7rem, 3.2vw, 2.4rem); font-weight: 900; margin: 0 0 8px; }

.contact-item-content a, .contact-item-content p { overflow-wrap: anywhere; word-break: break-word; }

/* ============================================================================
 * REVEAL + MOTION
 * ========================================================================== */
.mbs-reveal { opacity: 0; transform: translateY(22px); transition: opacity .6s ease, transform .6s ease; }
.mbs-reveal.is-visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
    .mbs-reveal { opacity: 1; transform: none; transition: none; }
    .mbs-btn, .mbs-pc, .mbs-container .mbs-plan { transition: none; }
    .mbs-btn:hover, .mbs-pc:hover { transform: none; }
}

/* ============================================================================
 * RESPONSIVE
 * ========================================================================== */
@media (min-width: 1200px) {
    .mbs-hero { padding-top: 150px; }
}
@media (max-width: 1199px) {
    .mbs-hero { padding-top: 110px; }
}
@media (max-width: 991px) {
    .mbs-hero { padding: 96px 0 90px; }
    .mbs-hero__grid { grid-template-columns: 1fr; gap: 36px; }
    .mbs-hero__sub { max-width: none; }
    .mbs-stage { min-height: 0; }
    .mbs-hero__grid > .mbs-stage { margin-top: 10px; }
    .mbs-laptop { max-width: 520px; }
    .mbs-phone { display: none; } /* the phone overlaps the laptop screen on tablets */
    .mbs-pillars { grid-template-columns: 1fr; }
    .mbs-pillar { border-right: 0; margin-right: 0; padding: 0 0 22px; border-bottom: 1px solid var(--mbs-line); margin-bottom: 22px; }
    .mbs-pillar:last-child { border-bottom: 0; margin-bottom: 0; padding-bottom: 0; }
    .mbs-flow { grid-template-columns: repeat(2, 1fr); }
    .mbs-flow li::after { display: none; }
    .mbs-split { grid-template-columns: 1fr; gap: 28px; }
    .mbs-split--rev > :first-child { order: 0; }
    .mbs-plat-grid, .mbs-feature-grid, .mbs-solutions, .mbs-container .mbs-plans { grid-template-columns: 1fr; max-width: 520px; margin-left: auto; margin-right: auto; }
    .mbs-trust-grid { grid-template-columns: repeat(2, 1fr); }
    .mbs-footer__grid { grid-template-columns: 1fr 1fr; }
    .mbs-section { padding: 56px 0; }
    .mbs-container .mbs-compare { display: none; } /* pricing = cards only below tablet landscape */
}
@media (max-width: 767px) {
    .mbs-hero { padding: 88px 0 80px; }
    .mbs-hero h1 { font-size: clamp(1.75rem, 7vw, 2.3rem); }
    .mbs-phone { display: none; }
    .mbs-laptop__base { margin: 0; }
    .mbs-stage__caption { position: static; text-align: center; margin-top: 10px; }
    .mbs-checklist { grid-template-columns: 1fr; }
    .mbs-brand-demo { grid-template-columns: 1fr; }
    .mbs-flow { grid-template-columns: 1fr; }
    .mbs-trust-grid { grid-template-columns: 1fr; }
    .mbs-footer__grid { grid-template-columns: 1fr; gap: 26px; }
    .mbs-footer__bottom { flex-direction: column; align-items: flex-start; }
    .mbs-section { padding: 48px 0; }
    .mbs-cta-row .mbs-btn { flex: 1 1 100%; }
    .mbs-strip__list { gap: 8px 16px; padding: 14px 0; }
    .mbs-strip__list li { font-size: 0.82rem; }
    .mbs-panel { padding: 20px; }
    .mbs-table { min-width: 520px; }
}
@media (max-width: 480px) {
    .mbs-scr__side { width: 118px; padding: 10px 8px; }
    .mbs-scr__tabs { display: none; }
    .mbs-scr__tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 5px; }
    .mbs-scr__cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .mbs-scr__main { padding: 9px; }
    .mbs-scr__body { min-height: 200px; }
}
@media (max-width: 400px) {
    .mbs-hero { padding-top: 80px; }
    .mbs-container .mbs-plan { padding: 22px 18px 20px; }
    .mbs-container .mbs-plan__amt { font-size: 1.7rem; }
}

/* 2026-09-26 — the theme capitalises every word of drawer links
   ("Book A Demo"); keep drawer CTA labels exactly as written. */
.tgmobile__menu .mobile_menu_login .mbs-drawer-cta > a.mbs-btn { text-transform: none; }
/* The theme styles every `.mobile_menu_login li a` as a pale pill, which
   overrode the drawer CTA colours; restore the design-system variants. */
.tgmobile__menu .mobile_menu_login .mbs-drawer-cta > a.mbs-btn--primary {
    color: #fff; background: linear-gradient(135deg, var(--mbs-accent), var(--mbs-accent-2)); border-color: transparent;
}
.tgmobile__menu .mobile_menu_login .mbs-drawer-cta > a.mbs-btn--ghost { color: var(--mbs-navy); border-color: #cfd8ea; background: #fff; }
/* The theme clones the desktop menu into the drawer; the desktop caret would
   sit next to the drawer's own +/- toggle and overflow the panel edge. */
.tgmobile__menu .mbs-caret { display: none; }
/* Drawer sub-menus open only through the toggle state, never on hover
   (desktop hover rules would otherwise leak into the drawer on touch/mouse). */
.tgmobile__menu .mbs-nav > li:not(.is-open) > .sub-menu { display: none; }
.tgmobile__menu .mbs-nav > li.is-open > .sub-menu { display: block; }

/* ==========================================================================
   2026-09-29 — enterprise mega menu (platform host only; markup in
   header.blade.php inside the MarketingHost::isPlatform() branch)
   ========================================================================== */
@keyframes mbsMegaIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@media (min-width: 1200px) {
    .tgmenu__nav { position: relative; }
    /* every panel is positioned against the header row, so none can run past the container edge */
    .mbs-nav > li.mbs-mega-item { position: static; }
    .tgmenu__navbar-wrap .mbs-nav .sub-menu.mbs-mega {
        display: none; gap: 0; padding: 22px; margin: 0; border-radius: 16px; border: 1px solid var(--mbs-line);
        box-shadow: 0 24px 60px rgba(13, 29, 62, 0.18); background: #fff; min-width: 0;
    }
    /* invisible bridge so the pointer can travel from the label to the panel */
    .tgmenu__navbar-wrap .mbs-nav .sub-menu.mbs-mega::before { content: ""; position: absolute; left: 0; right: 0; top: -16px; height: 16px; }
    .mbs-nav > li.mbs-mega-item:hover > .sub-menu.mbs-mega,
    .mbs-nav > li.mbs-mega-item.is-open > .sub-menu.mbs-mega { display: grid; animation: mbsMegaIn .16s ease-out; }
    .mbs-nav .mbs-mega--platform, .mbs-nav .mbs-mega--solutions { left: 0; right: 0; top: 100%; }
    .mbs-nav .mbs-mega--platform { grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(230px, 0.95fr); }
    .mbs-nav .mbs-mega--solutions { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr) minmax(230px, 0.8fr); }
    .tgmenu__navbar-wrap .mbs-nav .sub-menu.mbs-mega--resources, .tgmenu__navbar-wrap .mbs-nav .sub-menu.mbs-mega--company { left: auto; right: 0; top: 100%; }
    .mbs-nav .mbs-mega--resources { width: 600px; grid-template-columns: minmax(0, 1fr) 230px; }
    .mbs-nav .mbs-mega--company { width: 520px; grid-template-columns: 1fr 1fr; }
    .mbs-nav .mbs-mega__col, .tgmenu__navbar-wrap ul li .sub-menu.mbs-mega li.mbs-mega__col { display: flex; flex-direction: column; gap: 2px; padding: 0 10px; border-right: 1px solid var(--mbs-line); }
    .mbs-nav .mbs-mega__col:first-child { padding-left: 0; }
    .tgmenu__navbar-wrap ul li .sub-menu.mbs-mega li.mbs-mega__col:last-child,
    .tgmenu__navbar-wrap ul li .sub-menu.mbs-mega.has-card li.mbs-mega__col:nth-last-child(2) { border-right: 0; }
    .mbs-nav .mbs-mega__card { margin-left: 10px; }
}
.mbs-nav .mbs-mega__hd {
    display: block; padding: 0 12px 10px; font-size: 0.7rem; font-weight: 700; letter-spacing: .09em;
    text-transform: uppercase; color: var(--mbs-muted);
}
.tgmenu__navbar-wrap .mbs-nav .mbs-mega a.mbs-mega__link, .mbs-nav .mbs-mega a.mbs-mega__link {
    display: flex; align-items: flex-start; gap: 12px; padding: 10px 12px !important; border-radius: 12px;
    color: var(--mbs-navy) !important; font-weight: 700; font-size: 0.92rem; line-height: 1.3; text-transform: none; white-space: normal;
}
.mbs-nav .mbs-mega__ico {
    width: 34px; height: 34px; border-radius: 10px; background: #eef4ff; color: var(--mbs-sky);
    display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; transition: background .15s, color .15s;
}
.mbs-nav .mbs-mega__txt { display: block; min-width: 0; }
.mbs-nav .mbs-mega__txt small { display: block; margin-top: 3px; font-weight: 400; font-size: 0.8rem; line-height: 1.4; color: var(--mbs-muted); }
.mbs-nav .mbs-mega a.mbs-mega__link:hover, .mbs-nav .mbs-mega a.mbs-mega__link:focus-visible { background: #f3f7fd; color: var(--mbs-navy) !important; }
.mbs-nav .mbs-mega a.mbs-mega__link:hover .mbs-mega__ico, .mbs-nav .mbs-mega a.mbs-mega__link:focus-visible .mbs-mega__ico { background: var(--mbs-navy); color: #fff; }
.mbs-nav .mbs-mega__card, .tgmenu__navbar-wrap ul li .sub-menu.mbs-mega li.mbs-mega__card {
    display: flex; flex-direction: column; gap: 10px; padding: 22px; border-radius: 14px; color: #dbe5f7;
    background: linear-gradient(150deg, var(--mbs-navy-deep), var(--mbs-navy-2));
}
.mbs-nav .mbs-mega__card-title, .mbs-nav .mbs-mega__card-text { display: block; }
.mbs-nav .mbs-mega__card-title { font-size: 1.02rem; font-weight: 800; color: #fff; line-height: 1.3; }
.mbs-nav .mbs-mega__card-text { font-size: 0.85rem; line-height: 1.5; }
.tgmenu__navbar-wrap .mbs-nav .mbs-mega a.mbs-mega__card-cta, .mbs-nav .mbs-mega a.mbs-mega__card-cta {
    margin-top: auto; display: inline-flex; align-items: center; justify-content: center; gap: 8px; align-self: flex-start;
    padding: 9px 16px !important; border-radius: 10px; font-weight: 700; font-size: 0.86rem; text-transform: none;
    color: #fff !important; background: linear-gradient(135deg, var(--mbs-accent), var(--mbs-accent-2));
}
.mbs-nav .mbs-mega a.mbs-mega__card-cta:hover { color: #fff !important; filter: brightness(1.06); }
.mbs-nav .mbs-mega a.mbs-mega__card-cta:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) {
    .mbs-nav > li.mbs-mega-item:hover > .sub-menu.mbs-mega, .mbs-nav > li.mbs-mega-item.is-open > .sub-menu.mbs-mega { animation: none; }
}
/* drawer (the theme clones the desktop menu into .tgmobile__menu): stacked groups, no card */
.tgmobile__menu .mbs-nav .sub-menu.mbs-mega { padding: 4px 12px 12px 16px; }
.tgmobile__menu .mbs-nav .mbs-mega__col { border-top: 0; padding-top: 8px; }
.tgmobile__menu .mbs-nav .mbs-mega__hd { padding: 4px 0 6px; }
.tgmobile__menu .mbs-nav .mbs-mega a.mbs-mega__link { margin: 0 !important; padding: 8px 6px !important; font-size: 0.92rem; }
.tgmobile__menu .mbs-nav .mbs-mega a.mbs-mega__link::before { display: none; }
.tgmobile__menu .mbs-nav .mbs-mega__ico { width: 30px; height: 30px; border-radius: 8px; }
.tgmobile__menu .mbs-nav .mbs-mega__card { display: none; }

/* ==========================================================================
   2026-09-29 — enterprise footer (platform host only; markup in
   footer.blade.php inside the MarketingHost::isPlatform() branch).
   Overrides the 2026-09-22 footer rules above; nothing above was removed.
   ========================================================================== */
.mbs-prefooter { position: relative; z-index: 2; margin-bottom: -84px; padding: 0 0 0; }
.mbs-prefooter__card {
    display: flex; align-items: center; justify-content: space-between; gap: 28px; flex-wrap: wrap;
    padding: 36px 44px; border-radius: 20px; color: #dbe5f7;
    background: radial-gradient(120% 140% at 100% 0%, rgba(58, 123, 213, 0.55) 0%, rgba(58, 123, 213, 0) 55%), linear-gradient(135deg, var(--mbs-navy-deep), var(--mbs-navy-2));
    box-shadow: 0 24px 60px rgba(13, 29, 62, 0.28);
}
.mbs-prefooter__copy { flex: 1 1 380px; min-width: 0; }
.mbs-prefooter h2 { font-size: 1.6rem; font-weight: 800; line-height: 1.25; color: #fff; margin: 0 0 8px; letter-spacing: -0.01em; }
.mbs-prefooter p { margin: 0; font-size: 0.95rem; line-height: 1.6; color: #c9d6ee; max-width: 560px; }
.mbs-prefooter__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.mbs-prefooter__note { flex-basis: 100%; font-size: 0.8rem; color: #9fb0cf; }

.mbs-footer {
    padding: 72px 0 26px;
    background: radial-gradient(70% 60% at 85% 0%, rgba(58, 123, 213, 0.18) 0%, rgba(58, 123, 213, 0) 70%), var(--mbs-navy-deep);
}
.mbs-footer.has-band { padding-top: 148px; }
.mbs-footer__grid { grid-template-columns: minmax(0, 1.7fr) repeat(4, minmax(0, 1fr)); gap: 40px; margin-bottom: 40px; }
.mbs-footer__brand p { max-width: 380px; }
.mbs-footer__ci { width: 28px; height: 28px; border-radius: 8px; background: rgba(255, 255, 255, 0.07); display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.mbs-footer__contact { gap: 10px; }
.mbs-footer__contact li { align-items: center; }
.mbs-footer__contact .mbs-ico { margin-top: 0; }
.mbs-footer__brand .mbs-footer__social { margin-top: 20px; }
.mbs-footer h2 { font-size: 0.74rem; letter-spacing: .12em; margin-bottom: 16px; color: #fff; }
.mbs-footer ul.mbs-footer__links { gap: 11px; }
.mbs-footer__links a { font-size: 0.9rem; transition: color .15s; }
.mbs-footer__links a:hover { text-decoration: none; color: #fff; }

.mbs-footer__trust {
    display: flex; align-items: center; gap: 12px 18px; flex-wrap: wrap; padding: 18px 0; margin-bottom: 22px;
    border-top: 1px solid rgba(255, 255, 255, 0.1); border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.mbs-footer .mbs-footer__trust-hd { font-size: 0.7rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #9fb0cf; }
.mbs-footer__trust ul { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0; padding: 0; }
.mbs-footer__trust a {
    display: inline-flex; align-items: center; gap: 7px; padding: 6px 12px; border-radius: 999px; font-size: 0.8rem; font-weight: 600;
    color: #dbe5f7; text-decoration: none; border: 1px solid rgba(255, 255, 255, 0.14); background: rgba(255, 255, 255, 0.03); transition: background .15s, border-color .15s;
}
.mbs-footer__trust a .mbs-ico { color: var(--mbs-accent-2); }
.mbs-footer__trust a:hover { background: rgba(255, 255, 255, 0.08); border-color: rgba(255, 255, 255, 0.26); color: #fff; }

.mbs-footer__bottom { border-top: 0; padding-top: 0; display: grid; grid-template-columns: 1fr auto auto; gap: 12px 28px; }
.mbs-footer .mbs-footer__copy { color: #9fb0cf; }
.mbs-footer a.mbs-footer__top { display: inline-flex; align-items: center; gap: 6px; color: #c6d0e4; text-decoration: none; font-weight: 600; white-space: nowrap; }
.mbs-footer a.mbs-footer__top:hover { color: #fff; }
.mbs-footer__top-ico { transform: rotate(-90deg); }

@media (max-width: 1199px) {
    .mbs-footer__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px 28px; }
    .mbs-footer__grid > .mbs-footer__brand { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 8px 40px; align-items: start; }
    .mbs-footer__brand > .mbs-wordmark, .mbs-footer__brand > p { grid-column: 1; }
    .mbs-footer__brand > .mbs-footer__contact { grid-column: 2; grid-row: 1 / span 2; }
    .mbs-footer__brand > .mbs-footer__social { grid-column: 1; margin-top: 4px; }
}
@media (max-width: 991px) {
    .mbs-prefooter__card { padding: 30px 28px; }
    .mbs-footer__bottom { grid-template-columns: 1fr auto; }
    .mbs-footer__bottom .mbs-footer__legal { grid-column: 1 / -1; grid-row: 2; }
}
@media (max-width: 767px) {
    .mbs-prefooter { margin-bottom: -60px; }
    .mbs-prefooter__card { padding: 26px 22px; border-radius: 16px; }
    .mbs-prefooter h2 { font-size: 1.3rem; }
    .mbs-prefooter__actions { width: 100%; }
    .mbs-prefooter__actions .mbs-btn { flex: 1 1 160px; }
    .mbs-footer { padding-top: 56px; }
    .mbs-footer.has-band { padding-top: 108px; }
    .mbs-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 30px 20px; }
    .mbs-footer__grid > .mbs-footer__brand { display: block; }
    .mbs-footer__brand > .mbs-footer__social { margin-top: 18px; }
    .mbs-footer__trust { align-items: flex-start; flex-direction: column; }
    .mbs-footer__bottom { display: flex; flex-direction: column; align-items: flex-start; }
}
@media (max-width: 359px) {
    .mbs-footer__grid { grid-template-columns: 1fr; }
}

/* ==========================================================================
   2026-09-29 — enterprise hero (home page). Overrides the 2026-09-22 hero
   rules above; nothing above was removed.
   ========================================================================== */
.mbs-hero { padding-bottom: 170px; background: linear-gradient(140deg, #060f24 0%, #10275a 45%, #1d4a9a 80%, #2f6fc6 100%); }
.mbs-hero__lines {
    position: absolute; inset: 0; pointer-events: none; opacity: .55;
    background-image: linear-gradient(rgba(255, 255, 255, 0.06) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.06) 1px, transparent 1px);
    background-size: 56px 56px;
    -webkit-mask-image: radial-gradient(ellipse 75% 70% at 70% 35%, #000 20%, transparent 75%);
    mask-image: radial-gradient(ellipse 75% 70% at 70% 35%, #000 20%, transparent 75%);
}
.mbs-hero__grid { align-items: center; }
@media (min-width: 992px) { .mbs-hero__grid { grid-template-columns: minmax(0, 1.12fr) minmax(0, 0.88fr); } }
.mbs-hero__grid > .mbs-stage { margin-top: 0; }

/* eyebrow: a link pill into the platform overview */
.mbs-hero a.mbs-hero__eyebrow {
    display: inline-flex; align-items: center; gap: 10px; padding: 5px 14px 5px 5px; margin-bottom: 22px; border-radius: 999px;
    background: rgba(255, 255, 255, 0.08); border: 1px solid rgba(255, 255, 255, 0.18); text-transform: none; letter-spacing: 0;
    font-size: 0.86rem; font-weight: 600; color: rgba(255, 255, 255, 0.92); text-decoration: none; transition: background .15s, border-color .15s;
}
.mbs-hero a.mbs-hero__eyebrow:hover { background: rgba(255, 255, 255, 0.14); border-color: rgba(255, 255, 255, 0.3); color: #fff; }
.mbs-hero .mbs-hero__eyebrow-tag {
    padding: 4px 10px; border-radius: 999px; font-size: 0.7rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; flex-shrink: 0;
    color: #1a1204; background: linear-gradient(135deg, var(--mbs-accent), var(--mbs-accent-2));
}
.mbs-hero__eyebrow-ico { opacity: .8; transition: transform .15s; }
.mbs-hero a.mbs-hero__eyebrow:hover .mbs-hero__eyebrow-ico { transform: translateX(2px); }

/* main.min.css (theme, shared) forces `.hero h1 { font-size: 32px !important }` and 23px on
   phones; this more specific rule has to be !important as well to win. */
.mbs-hero .mbs-hero__content h1#hero-title {
    font-size: clamp(2.2rem, 3.3vw, 3rem) !important; line-height: 1.1; letter-spacing: -0.02em; margin: 0 0 20px !important;
}
.mbs-hero .mbs-hero__sub { font-size: clamp(1rem, 1.5vw, 1.15rem); max-width: 540px; margin-bottom: 30px; }
.mbs-hero .mbs-cta-row .mbs-btn { min-height: 52px; padding: 12px 28px; font-size: 1rem; border-radius: 12px; }
.mbs-hero .mbs-cta-row .mbs-btn--primary { box-shadow: 0 10px 30px rgba(232, 124, 43, 0.38); }
.mbs-hero .mbs-hero__facts { margin-top: 22px; }

/* "Built for" audiences */
.mbs-hero__for { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 26px; padding-top: 22px; border-top: 1px solid rgba(255, 255, 255, 0.12); max-width: 540px; }
.mbs-hero .mbs-hero__for-hd { margin-right: 6px; font-size: 0.7rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: rgba(255, 255, 255, 0.55); }
.mbs-hero .mbs-hero__for a {
    font-size: 0.84rem; font-weight: 600; color: rgba(255, 255, 255, 0.9); text-decoration: none;
    padding: 5px 12px; border-radius: 999px; border: 1px solid rgba(255, 255, 255, 0.18); background: rgba(255, 255, 255, 0.04); transition: background .15s, border-color .15s;
}
.mbs-hero .mbs-hero__for a:hover { color: #fff; background: rgba(255, 255, 255, 0.1); border-color: rgba(255, 255, 255, 0.32); }

/* floating product moments (illustration only, aria-hidden) */
@keyframes mbsFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
.mbs-float {
    position: absolute; z-index: 5; display: flex; align-items: center; gap: 10px; padding: 10px 16px 10px 10px; border-radius: 14px;
    background: rgba(255, 255, 255, 0.97); color: var(--mbs-navy); box-shadow: 0 18px 44px rgba(4, 12, 32, 0.38), 0 0 0 1px rgba(255, 255, 255, 0.6);
    animation: mbsFloat 6s ease-in-out infinite; white-space: nowrap;
}
.mbs-float--pay { top: 0; right: -8px; }
.mbs-float--lead { top: 12%; left: -10px; animation-delay: -2s; }
.mbs-float--cert { bottom: 9%; right: 4%; animation-delay: -4s; }
.mbs-float__ico { width: 34px; height: 34px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.mbs-float__ico.is-green { background: #e5f7ee; color: #148a55; }
.mbs-float__ico.is-blue { background: #e8f0fd; color: var(--mbs-sky); }
.mbs-float__ico.is-amber { background: #fdf1e3; color: #b9520f; }
.mbs-hero .mbs-float__txt b { display: block; font-size: 0.82rem; font-weight: 800; color: var(--mbs-navy); line-height: 1.25; }
.mbs-hero .mbs-float__txt small { display: block; font-size: 0.72rem; color: var(--mbs-muted); line-height: 1.3; }
@media (prefers-reduced-motion: reduce) { .mbs-float { animation: none; } }

/* capability strip: floating card over the wave */
.mbs-strip { position: relative; z-index: 3; margin-top: -64px; background: transparent; border-bottom: 0; }
.mbs-strip__card {
    display: flex; align-items: center; gap: 14px 30px; padding: 20px 28px; border-radius: 18px; background: #fff;
    border: 1px solid var(--mbs-line); box-shadow: 0 20px 50px rgba(13, 29, 62, 0.12);
}
.mbs-strip .mbs-strip__hd { flex-shrink: 0; font-size: 0.7rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--mbs-muted); padding-right: 28px; border-right: 1px solid var(--mbs-line); }
.mbs-strip .mbs-strip__list { justify-content: flex-start; padding: 0; gap: 10px 26px; }

@media (max-width: 1199px) {
    .mbs-float--lead { left: 0; }
    .mbs-float--pay { right: 0; }
}
@media (max-width: 991px) {
    .mbs-hero { padding-bottom: 130px; }
    .mbs-hero__for { max-width: none; }
    .mbs-stage { padding-top: 26px; }
    .mbs-float--pay { top: 0; right: 4%; }
    .mbs-float--lead { top: 14%; left: 2%; }
    .mbs-float--cert { bottom: 6%; right: 4%; }
    .mbs-strip__card { flex-direction: column; align-items: flex-start; }
    .mbs-strip .mbs-strip__hd { border-right: 0; padding-right: 0; }
}
@media (max-width: 767px) {
    .mbs-hero { padding-bottom: 110px; }
    .mbs-hero .mbs-hero__content h1#hero-title { font-size: clamp(1.9rem, 8.2vw, 2.5rem) !important; }
    .mbs-float { padding: 8px 12px 8px 8px; gap: 8px; }
    .mbs-float__ico { width: 28px; height: 28px; border-radius: 8px; }
    .mbs-float--lead { display: none; }
    .mbs-strip { margin-top: -48px; }
    .mbs-strip__card { padding: 18px 18px; border-radius: 16px; }
}
@media (max-width: 480px) {
    .mbs-float--cert { display: none; }
    .mbs-float--pay { top: 0; right: 0; }
    .mbs-hero a.mbs-hero__eyebrow { font-size: 0.8rem; }
}

/* ==========================================================================
   2026-09-29 — enterprise features (bento). Markup: #features in
   home/main/index.blade.php. Reuses the .csm / .cmk / .crt mock-ups.
   ========================================================================== */
.mbs-fx { background: linear-gradient(180deg, #f6f9fe 0%, #fff 100%); }
.mbs-fx__hd { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px 40px; flex-wrap: wrap; margin-bottom: 36px; }
.mbs-fx__hd > div { max-width: 680px; }
.mbs-section .mbs-fx__hd h2 { margin: 0 0 10px; }
.mbs-section .mbs-fx__hd p { margin: 0; color: var(--mbs-muted); font-size: 1.02rem; line-height: 1.7; }
.mbs-section a.mbs-fx__link {
    display: inline-flex; align-items: center; gap: 8px; padding: 10px 18px; border-radius: 12px; font-weight: 700; font-size: 0.92rem;
    color: var(--mbs-navy); text-decoration: none; background: #fff; border: 1px solid #cfd8ea; white-space: nowrap; transition: border-color .15s, box-shadow .15s;
}
.mbs-section a.mbs-fx__link:hover { border-color: var(--mbs-sky); box-shadow: 0 6px 18px rgba(58, 123, 213, 0.15); }

.mbs-bento { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.mbs-bx {
    position: relative; display: flex; flex-direction: column; min-width: 0; overflow: hidden; border-radius: 20px; background: #fff;
    border: 1px solid var(--mbs-line); box-shadow: 0 1px 2px rgba(13, 29, 62, 0.04), 0 12px 32px rgba(13, 29, 62, 0.06);
    transition: box-shadow .25s, border-color .25s;
}
.mbs-bx:hover { border-color: #cddcf3; box-shadow: 0 1px 2px rgba(13, 29, 62, 0.04), 0 20px 44px rgba(13, 29, 62, 0.11); }
.mbs-bx__art { height: 210px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; position: relative; overflow: hidden; }
.mbs-bx__art::after { content: ""; position: absolute; inset: 0; background: radial-gradient(ellipse at 50% 120%, rgba(255, 255, 255, 0.55), transparent 60%); pointer-events: none; }
.mbs-bx__body { padding: 22px 24px 24px; display: flex; flex-direction: column; flex: 1; }
.mbs-section .mbs-bx__tag {
    align-self: flex-start; display: inline-flex; align-items: center; gap: 6px; margin-bottom: 12px; padding: 4px 10px; border-radius: 999px;
    font-size: 0.7rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--mbs-sky); background: #eef4ff;
}
.mbs-section .mbs-bx h3 { font-size: 1.15rem; font-weight: 800; color: var(--mbs-navy); margin: 0 0 8px; line-height: 1.3; }
.mbs-section .mbs-bx__body > p { font-size: 0.9rem; color: var(--mbs-muted); line-height: 1.65; margin: 0; }
.mbs-bx__chips { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; margin: 16px 0 0; padding: 0; }
.mbs-section .mbs-bx__chips li {
    font-size: 0.76rem; font-weight: 600; color: var(--mbs-navy); padding: 4px 10px; border-radius: 8px; background: #f3f6fb; border: 1px solid var(--mbs-line);
}

/* "Run the business" panel */
.mbs-bx--more { padding: 26px 26px 12px; background: linear-gradient(160deg, var(--mbs-navy-deep), var(--mbs-navy-2)); border-color: transparent; color: #dbe5f7; }
.mbs-bx--more:hover { border-color: transparent; }
.mbs-section .mbs-bx--more .mbs-bx__tag { color: #ffd9b0; background: rgba(245, 160, 64, 0.16); }
.mbs-section .mbs-bx__more-title { font-family: var(--mbs-font-display); font-size: 1.35rem; font-weight: 800; color: #fff; margin: 0 0 14px; line-height: 1.25; }
.mbs-more { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 28px; list-style: none; margin: 0; padding: 0; }
.mbs-more__item { display: flex; gap: 14px; align-items: flex-start; padding: 16px 0; border-top: 1px solid rgba(255, 255, 255, 0.1); }
.mbs-more__ico { width: 38px; height: 38px; border-radius: 11px; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; color: #fff; background: rgba(255, 255, 255, 0.1); border: 1px solid rgba(255, 255, 255, 0.14); }
.mbs-section .mbs-bx--more h3 { font-size: 0.96rem; color: #fff; margin: 0 0 4px; }
.mbs-section .mbs-more__item p { font-size: 0.82rem; color: #b9c7e2; line-height: 1.55; margin: 0; }

@media (min-width: 992px) {
    .mbs-bx--courses { grid-column: 1 / span 2; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    .mbs-bx--courses .mbs-bx__art { height: auto; min-height: 300px; }
    .mbs-bx--courses .csm { max-width: 320px; transform: scale(1.08); }
    .mbs-bx--courses .mbs-bx__body { padding: 30px 30px; justify-content: center; }
    .mbs-section .mbs-bx--courses h3 { font-size: 1.4rem; }
    .mbs-bx--more { grid-column: 2 / span 2; }
}
@media (min-width: 768px) and (max-width: 991px) {
    .mbs-bento { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .mbs-bx--courses, .mbs-bx--more { grid-column: 1 / -1; }
}
@media (max-width: 767px) {
    .mbs-bento { grid-template-columns: 1fr; gap: 16px; }
    .mbs-bx__art { height: 180px; }
    .mbs-bx__body { padding: 20px; }
    .mbs-more { grid-template-columns: 1fr; }
    .mbs-bx--more { padding: 22px 20px 6px; }
    .mbs-section a.mbs-fx__link { width: 100%; justify-content: center; }
}

/* ==========================================================================
   2026-09-29 — enterprise pricing (home #pricing + /pricing). Same data and
   wording; scoped to .mbs-container .mbs-plan--x so the in-app /membership
   page (which also uses .mbs-plan) is never affected.
   ========================================================================== */
.mbs-container .mbs-plans { gap: 22px; align-items: stretch; }
.mbs-container .mbs-plan--x {
    padding: 0; overflow: hidden; border-radius: 22px; border: 1px solid var(--mbs-line);
    box-shadow: 0 1px 2px rgba(13, 29, 62, 0.04), 0 14px 36px rgba(13, 29, 62, 0.07); transition: box-shadow .25s, transform .25s;
}
.mbs-container .mbs-plan--x:hover { box-shadow: 0 1px 2px rgba(13, 29, 62, 0.04), 0 22px 48px rgba(13, 29, 62, 0.12); transform: translateY(-3px); }
.mbs-container .mbs-plan--x .mbs-plan__head { padding: 28px 26px 22px; display: flex; flex-direction: column; }
.mbs-container .mbs-plan--x .mbs-plan__title-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 4px; }
.mbs-container .mbs-plan--x .mbs-plan__name { font-size: 1.2rem; margin: 0; }
.mbs-container .mbs-plan--x .mbs-plan__badge {
    position: static; display: inline-flex; padding: 5px 11px; border-radius: 999px; font-size: 0.68rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase;
    color: #1a1204; background: linear-gradient(135deg, var(--mbs-accent), var(--mbs-accent-2)); box-shadow: none;
}
.mbs-container .mbs-plan--x .mbs-plan__who { min-height: 2.8em; margin-bottom: 18px; line-height: 1.45; }
.mbs-container .mbs-plan--x .mbs-plan__amt { font-size: 2.5rem; letter-spacing: -0.03em; }
.mbs-container .mbs-plan--x .mbs-plan__amt--contact { font-size: 1.6rem; letter-spacing: -0.01em; }
.mbs-container .mbs-plan--x .mbs-plan__price { min-height: 48px; align-items: flex-end; }
.mbs-container .mbs-plan--x .mbs-plan__setup { margin: 4px 0 0; }
.mbs-container .mbs-plan--x .mbs-plan__head > .mbs-btn { margin-top: 20px; min-height: 48px; }
.mbs-container .mbs-plan--x .mbs-plan__foot { margin-top: 10px; min-height: 1.2em; }

.mbs-container .mbs-plan--x .mbs-plan__body { flex: 1; padding: 22px 26px 26px; background: #f8fafd; border-top: 1px solid var(--mbs-line); }
.mbs-container .mbs-plan--x .mbs-plan__sub { margin: 0 0 12px; font-size: 0.7rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--mbs-muted); }
.mbs-container .mbs-plan--x .mbs-plan__rows { border-top: 0; padding: 0; margin: 0; gap: 12px; }
.mbs-container .mbs-plan--x .mbs-plan__rows li {
    display: grid; grid-template-columns: 30px minmax(0, 1fr); column-gap: 10px; row-gap: 1px; align-items: start; justify-content: stretch;
}
.mbs-container .mbs-plan--x .mbs-plan__rows li i {
    grid-row: 1 / span 2; width: 30px; height: 30px; border-radius: 9px; display: inline-flex; align-items: center; justify-content: center;
    background: #eaf1fd; color: var(--mbs-sky); font-style: normal;
}
.mbs-container .mbs-plan--x .mbs-plan__rows li span { font-size: 0.74rem; font-weight: 600; letter-spacing: .02em; }
.mbs-container .mbs-plan--x .mbs-plan__rows li b { text-align: left; font-size: 0.9rem; line-height: 1.4; }
.mbs-container .mbs-plan--x .mbs-plan__feats { margin: 16px 0 0; padding-top: 14px; border-top: 1px dashed #d6e0f0; }

/* recommended plan: dark card */
.mbs-container .mbs-plan--x.mbs-plan--featured {
    border: 0; color: #dbe5f7; transform: translateY(-8px);
    background: linear-gradient(165deg, var(--mbs-navy-deep) 0%, #16336d 60%, var(--mbs-navy-2) 100%);
    box-shadow: 0 30px 60px -18px rgba(13, 29, 62, 0.55);
}
.mbs-container .mbs-plan--x.mbs-plan--featured:hover { transform: translateY(-11px); }
.mbs-container .mbs-plan--x.mbs-plan--featured .mbs-plan__name,
.mbs-container .mbs-plan--x.mbs-plan--featured .mbs-plan__amt,
.mbs-container .mbs-plan--x.mbs-plan--featured .mbs-plan__rows li b { color: #fff; }
.mbs-container .mbs-plan--x.mbs-plan--featured .mbs-plan__who,
.mbs-container .mbs-plan--x.mbs-plan--featured .mbs-plan__per,
.mbs-container .mbs-plan--x.mbs-plan--featured .mbs-plan__setup,
.mbs-container .mbs-plan--x.mbs-plan--featured .mbs-plan__foot,
.mbs-container .mbs-plan--x.mbs-plan--featured .mbs-plan__sub,
.mbs-container .mbs-plan--x.mbs-plan--featured .mbs-plan__rows li span { color: #b9c7e2; }
.mbs-container .mbs-plan--x.mbs-plan--featured .mbs-plan__body { background: rgba(255, 255, 255, 0.04); border-top-color: rgba(255, 255, 255, 0.1); }
.mbs-container .mbs-plan--x.mbs-plan--featured .mbs-plan__rows li i { background: rgba(255, 255, 255, 0.1); color: #fff; }
.mbs-container .mbs-plan--x.mbs-plan--featured .mbs-plan__feats { border-top-color: rgba(255, 255, 255, 0.16); }
.mbs-container .mbs-plan--x.mbs-plan--featured .mbs-plan__feats li { color: #dbe5f7; }
.mbs-container .mbs-plan--x.mbs-plan--featured a.mbs-btn:focus-visible { outline-color: #fff; }

/* enterprise plan: navy accent line */
.mbs-container .mbs-plan--x.mbs-plan--ent { border-top: 4px solid var(--mbs-navy); }

/* trust / billing note */
.mbs-pricing__note.mbs-pricing__note--x {
    display: flex; gap: 14px; align-items: flex-start; text-align: left; max-width: 900px; margin-top: 30px; padding: 18px 22px;
    border-radius: 16px; background: #fff; border: 1px solid var(--mbs-line);
}
.mbs-pricing__note-ico { width: 36px; height: 36px; border-radius: 10px; flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; background: #e5f7ee; color: #148a55; }

/* compare table (/pricing) */
.mbs-container .mbs-compare--x { margin-top: 44px; }
.mbs-container .mbs-compare--x .mbs-table-wrap { border-radius: 18px; border: 1px solid var(--mbs-line); box-shadow: 0 12px 32px rgba(13, 29, 62, 0.06); background: #fff; }
.mbs-container .mbs-compare--x .mbs-table { border-collapse: separate; border-spacing: 0; }
.mbs-container .mbs-compare--x .mbs-table thead th { position: sticky; top: 0; z-index: 1; padding: 16px 14px; font-size: 0.92rem; }
.mbs-container .mbs-compare--x .mbs-table tbody tr:nth-child(even) th, .mbs-container .mbs-compare--x .mbs-table tbody tr:nth-child(even) td { background: #f8fafd; }
.mbs-container .mbs-compare--x .mbs-table tbody tr:nth-child(even) td.is-feat { background: #eaf2ff; }
.mbs-container .mbs-compare--x .mbs-table td, .mbs-container .mbs-compare--x .mbs-table tbody th { padding: 13px 14px; border-top: 1px solid var(--mbs-line); }
.mbs-container .mbs-compare--x .mbs-yes { display: inline-flex; width: 26px; height: 26px; border-radius: 50%; align-items: center; justify-content: center; background: #e5f7ee; color: #148a55; }

@media (max-width: 991px) {
    .mbs-container .mbs-plan--x.mbs-plan--featured, .mbs-container .mbs-plan--x.mbs-plan--featured:hover { transform: none; }
    .mbs-container .mbs-plan--x:hover { transform: none; }
}
@media (max-width: 480px) {
    .mbs-container .mbs-plan--x .mbs-plan__head { padding: 24px 20px 20px; }
    .mbs-container .mbs-plan--x .mbs-plan__body { padding: 20px; }
    .mbs-container .mbs-plan--x .mbs-plan__amt { font-size: 2.1rem; }
    .mbs-pricing__note.mbs-pricing__note--x { padding: 16px; }
}

/* ==========================================================================
   2026-09-29 — enterprise FAQ. Accordion styling applies wherever
   partials/faq renders (home + /pricing); the two-column layout is home only.
   Numbers come from a CSS counter so the question text (used by the
   faq_expand event and the FAQPage schema) is unchanged.
   ========================================================================== */
.mbs-container .mbs-faq { counter-reset: mbsfaq; }
.mbs-container .mbs-faq details {
    counter-increment: mbsfaq; position: relative; margin-bottom: 12px; padding: 0 22px 0 24px; border-radius: 16px;
    border: 1px solid var(--mbs-line); box-shadow: 0 1px 2px rgba(13, 29, 62, 0.04); transition: border-color .2s, box-shadow .2s;
}
.mbs-container .mbs-faq details:hover { border-color: #cddcf3; }
.mbs-container .mbs-faq details[open] { border-color: #bcd1f1; box-shadow: 0 16px 36px rgba(13, 29, 62, 0.08); }
.mbs-container .mbs-faq details[open]::before { content: ""; position: absolute; left: -1px; top: 16px; bottom: 16px; width: 3px; border-radius: 3px; background: linear-gradient(180deg, var(--mbs-sky), var(--mbs-sky-2)); }
.mbs-container .mbs-faq summary { display: flex; align-items: center; gap: 16px; padding: 19px 44px 19px 0; font-size: 1rem; line-height: 1.45; }
.mbs-container .mbs-faq summary::before {
    content: counter(mbsfaq, decimal-leading-zero); flex-shrink: 0; width: 34px; height: 34px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center;
    font-size: 0.78rem; font-weight: 800; color: var(--mbs-sky); background: #eef4ff; letter-spacing: .02em;
}
.mbs-container .mbs-faq details[open] summary::before { color: #fff; background: var(--mbs-navy); }
/* plus / minus in a circle instead of the chevron */
.mbs-container .mbs-faq summary::after {
    content: "+"; top: 50%; right: 0; width: 30px; height: 30px; margin-top: -15px; border: 1px solid #cfd8ea; border-radius: 50%; transform: none;
    display: inline-flex; align-items: center; justify-content: center; font-size: 1.15rem; font-weight: 500; line-height: 1; color: var(--mbs-navy);
}
.mbs-container .mbs-faq details[open] summary::after { content: "–"; top: 50%; transform: none; color: #fff; background: var(--mbs-sky); border-color: var(--mbs-sky); }
.mbs-container .mbs-faq .mbs-faq__a { padding: 0 0 20px 50px; font-size: 0.94rem; }

/* home: intro + help card beside the list */
.mbs-faqx { background: linear-gradient(180deg, #fff 0%, #f6f9fe 100%); }
.mbs-faqx__grid { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.6fr); gap: 56px; align-items: start; }
.mbs-faqx__aside { position: sticky; top: 110px; }
.mbs-section .mbs-faqx__aside h2 { text-align: left; margin: 0 0 12px; }
.mbs-section .mbs-faqx__lead { margin: 0 0 26px; font-size: 1.02rem; line-height: 1.7; color: var(--mbs-muted); }
.mbs-faqx__help { padding: 24px; border-radius: 18px; color: #dbe5f7; background: linear-gradient(160deg, var(--mbs-navy-deep), var(--mbs-navy-2)); box-shadow: 0 20px 44px -16px rgba(13, 29, 62, 0.5); }
.mbs-faqx__help-ico { width: 42px; height: 42px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; margin-bottom: 14px; color: #fff; background: rgba(255, 255, 255, 0.12); }
.mbs-section .mbs-faqx__help-title { margin: 0 0 6px; font-size: 1.1rem; font-weight: 800; color: #fff; }
.mbs-section .mbs-faqx__help-text { margin: 0 0 18px; font-size: 0.9rem; line-height: 1.6; color: #c3d0e8; }
.mbs-faqx__help-cta { display: flex; flex-wrap: wrap; gap: 10px; }
.mbs-section .mbs-faqx__help-cta .mbs-btn--ghost { color: #fff; background: transparent; border-color: rgba(255, 255, 255, 0.35); }
.mbs-section .mbs-faqx__help-cta .mbs-btn--ghost:hover { background: rgba(255, 255, 255, 0.1); color: #fff; }
.mbs-faqx__list .mbs-faq { max-width: none; margin: 0; }

@media (max-width: 991px) {
    .mbs-faqx__grid { grid-template-columns: 1fr; gap: 32px; }
    .mbs-faqx__aside { position: static; }
}
@media (max-width: 480px) {
    .mbs-container .mbs-faq details { padding: 0 16px; }
    .mbs-container .mbs-faq summary { gap: 12px; padding: 16px 40px 16px 0; font-size: 0.95rem; }
    .mbs-container .mbs-faq summary::before { width: 30px; height: 30px; }
    .mbs-container .mbs-faq .mbs-faq__a { padding-left: 0; }
    .mbs-faqx__help-cta .mbs-btn { flex: 1 1 140px; }
}

/* ==========================================================================
   2026-09-29 — enterprise testimonials (#customers). Renders only when
   Admin → Testimonials has active entries; see index.blade.php.
   ========================================================================== */
.mbs-tx { background: #fff; }
.mbs-tx__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.mbs-tx__card {
    position: relative; display: flex; flex-direction: column; margin: 0; padding: 26px; border-radius: 20px; background: #fff;
    border: 1px solid var(--mbs-line); box-shadow: 0 1px 2px rgba(13, 29, 62, 0.04), 0 12px 32px rgba(13, 29, 62, 0.06);
}
.mbs-tx__card--lead {
    grid-column: span 2; grid-row: span 2; padding: 38px 40px; overflow: hidden; border: 0; color: #dbe5f7;
    background: radial-gradient(120% 120% at 100% 0%, rgba(58, 123, 213, 0.45) 0%, rgba(58, 123, 213, 0) 55%), linear-gradient(160deg, var(--mbs-navy-deep), var(--mbs-navy-2));
    box-shadow: 0 30px 60px -20px rgba(13, 29, 62, 0.5);
}
.mbs-tx__grid.is-single .mbs-tx__card--lead { grid-column: 1 / -1; grid-row: auto; }
.mbs-tx__mark { position: absolute; top: -18px; right: 26px; font-family: Georgia, serif; font-size: 11rem; line-height: 1; color: rgba(255, 255, 255, 0.08); pointer-events: none; }
.mbs-tx__stars { display: flex; gap: 3px; margin-bottom: 14px; color: #d6dce8; }
.mbs-tx__stars svg.on { color: #f5a623; }
.mbs-section .mbs-tx__quote { margin: 0 0 22px; flex: 1; }
.mbs-section .mbs-tx__quote p { margin: 0; font-size: 0.98rem; line-height: 1.7; color: var(--mbs-text); }
.mbs-section .mbs-tx__card--lead .mbs-tx__quote p { font-family: var(--mbs-font-display); font-size: 1.45rem; line-height: 1.5; color: #fff; }
.mbs-tx__who { display: flex; align-items: center; gap: 12px; padding-top: 18px; border-top: 1px solid var(--mbs-line); }
.mbs-tx__card--lead .mbs-tx__who { border-top-color: rgba(255, 255, 255, 0.14); }
.mbs-tx__avatar { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; flex-shrink: 0; border: 2px solid #fff; box-shadow: 0 4px 12px rgba(13, 29, 62, 0.15); }
.mbs-section .mbs-tx__avatar--initials { display: inline-flex; align-items: center; justify-content: center; font-size: 0.9rem; font-weight: 800; color: #fff; background: linear-gradient(135deg, var(--mbs-sky), var(--mbs-navy-2)); }
.mbs-section .mbs-tx__meta b { display: block; font-size: 0.95rem; font-weight: 800; color: var(--mbs-navy); }
.mbs-section .mbs-tx__meta small { display: block; font-size: 0.8rem; color: var(--mbs-muted); margin-top: 2px; }
.mbs-section .mbs-tx__card--lead .mbs-tx__meta b { color: #fff; }
.mbs-section .mbs-tx__card--lead .mbs-tx__meta small { color: #b9c7e2; }

@media (max-width: 991px) {
    .mbs-tx__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .mbs-tx__card--lead { grid-column: 1 / -1; grid-row: auto; }
}
@media (max-width: 767px) {
    .mbs-tx__grid { grid-template-columns: 1fr; gap: 16px; }
    .mbs-tx__card, .mbs-tx__card--lead { padding: 24px 20px; }
    .mbs-section .mbs-tx__card--lead .mbs-tx__quote p { font-size: 1.2rem; }
    .mbs-tx__mark { font-size: 8rem; }
}
/* the theme styles every <blockquote> (tinted box, left border, italic, quote glyph) */
.mbs-section .mbs-tx__card blockquote.mbs-tx__quote { background: none; border: 0; padding: 0; margin: 0 0 22px; font-style: normal; box-shadow: none; }
.mbs-section .mbs-tx__card blockquote.mbs-tx__quote::before, .mbs-section .mbs-tx__card blockquote.mbs-tx__quote::after { content: none; display: none; }
.mbs-section .mbs-tx__card blockquote.mbs-tx__quote p { font-style: normal; }
/* grid shapes by count (see index.blade.php): pair = lead 2 cols + 1; wide = lead full row + rows of 3 */
.mbs-tx__grid.is-pair .mbs-tx__card--lead { grid-row: auto; }
.mbs-tx__grid.is-wide .mbs-tx__card--lead { grid-column: 1 / -1; grid-row: auto; }
@media (max-width: 991px) {
    .mbs-tx__grid.is-wide { grid-template-columns: 1fr; }
}

/* ==========================================================================
   2026-09-29 — enterprise "Why MBSGuru" comparison (#why). Desktop: table
   with a raised MBSGuru column. ≤767px: every row becomes a card.
   ========================================================================== */
.mbs-why { background: linear-gradient(180deg, #f6f9fe 0%, #fff 100%); }
.mbs-why__wrap { padding-top: 14px; }
.mbs-why__table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 0.92rem; }
.mbs-why__table th, .mbs-why__table td { padding: 18px 18px; text-align: left; vertical-align: middle; border-bottom: 1px solid var(--mbs-line); background: #fff; }
.mbs-why__table thead th { font-size: 0.74rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--mbs-muted); background: transparent; border-bottom: 2px solid var(--mbs-line); padding-top: 22px; }
.mbs-why__table tbody tr:first-child th, .mbs-why__table tbody tr:first-child td { border-top: 0; }
.mbs-why__table tbody th.mbs-why__lbl { font-weight: 700; color: var(--mbs-navy); width: 30%; }
.mbs-why__table tbody th.mbs-why__lbl { display: table-cell; }
.mbs-why__lbl > span:last-child { vertical-align: middle; display: inline-block; max-width: calc(100% - 50px); line-height: 1.4; }
.mbs-why__ico { display: inline-flex; width: 34px; height: 34px; margin-right: 12px; border-radius: 10px; align-items: center; justify-content: center; vertical-align: middle; color: var(--mbs-sky); background: #eef4ff; }
.mbs-why__table td { color: var(--mbs-muted); }
.mbs-why__table td > span { vertical-align: middle; }
/* keep wrapped cell text aligned beside its mark */
.mbs-why__table td .mbs-why__txt { display: inline-block; max-width: calc(100% - 36px); line-height: 1.45; }
.mbs-why__mark { display: inline-flex; width: 22px; height: 22px; margin-right: 10px; border-radius: 50%; align-items: center; justify-content: center; vertical-align: middle; flex-shrink: 0; }
.mbs-why__mark.is-no { color: #b4424a; background: #fbecee; }
.mbs-why__mark.is-part { color: #a86b12; background: #fdf3e2; }
.mbs-why__mark.is-yes { color: #148a55; background: #e2f6ec; }
/* the MBSGuru column: raised, tinted, with a navy header */
.mbs-why__table th.is-us, .mbs-why__table td.is-us { background: #f2f7ff; border-left: 2px solid var(--mbs-sky); border-right: 2px solid var(--mbs-sky); color: var(--mbs-navy); font-weight: 700; }
.mbs-why__table thead th.is-us { background: linear-gradient(160deg, var(--mbs-navy-deep), var(--mbs-navy-2)); border-color: var(--mbs-navy-2); border-radius: 16px 16px 0 0; color: #fff; padding: 22px 18px; }
.mbs-why__us-name { font-size: 1rem; letter-spacing: 0; text-transform: none; font-weight: 800; }
.mbs-why__table tbody tr:last-child td.is-us { border-bottom: 2px solid var(--mbs-sky); border-radius: 0 0 16px 16px; }
.mbs-why__table tbody tr:last-child th, .mbs-why__table tbody tr:last-child td:not(.is-us) { border-bottom: 0; }
.mbs-why__table td.is-us .mbs-why__mark.is-yes { color: #fff; background: #1f9d63; }
.mbs-why__table tbody tr:hover th:not(.is-us), .mbs-why__table tbody tr:hover td:not(.is-us) { background: #fafcff; }

@media (max-width: 991px) {
    .mbs-why__table th, .mbs-why__table td { padding: 14px 12px; }
    .mbs-why__ico { display: none; }
}
@media (max-width: 767px) {
    .mbs-why__table, .mbs-why__table tbody, .mbs-why__table tr, .mbs-why__table th, .mbs-why__table td { display: block; width: auto; }
    .mbs-why__table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
    .mbs-why__table tbody tr { margin-bottom: 14px; border-radius: 16px; overflow: hidden; border: 1px solid var(--mbs-line); background: #fff; box-shadow: 0 8px 22px rgba(13, 29, 62, 0.06); }
    .mbs-why__table tbody th.mbs-why__lbl { display: flex; align-items: center; width: auto; padding: 16px 16px 10px; border: 0; font-size: 0.98rem; }
    .mbs-why__ico { display: inline-flex; width: 30px; height: 30px; margin-right: 10px; }
    .mbs-why__table td { display: flex; align-items: flex-start; gap: 0; padding: 8px 16px; border: 0; font-size: 0.88rem; }
    .mbs-why__table td::before { content: attr(data-col); flex: 0 0 42%; font-size: 0.72rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--mbs-muted); padding-top: 3px; }
    .mbs-why__table td .mbs-why__mark { margin-top: 1px; }
    .mbs-why__table td .mbs-why__txt { flex: 1; max-width: none; }
    .mbs-why__lbl > span:last-child { max-width: none; }
    .mbs-why__table td.is-us, .mbs-why__table tbody tr:last-child td.is-us { margin-top: 6px; padding: 12px 16px 14px; border: 0; border-top: 1px solid #d6e4f8; border-radius: 0; }
    .mbs-why__table td.is-us::before { color: var(--mbs-sky); }
    .mbs-why__table tbody tr:hover th:not(.is-us), .mbs-why__table tbody tr:hover td:not(.is-us) { background: #fff; }
}

/* ==========================================================================
   2026-09-29 — enterprise security & trust (#security): three grouped
   panels + integrations panel on the navy section.
   ========================================================================== */
.mbs-sec { position: relative; overflow: hidden; background: linear-gradient(150deg, #071433 0%, #0f2656 55%, #1b3f82 100%); }
.mbs-sec__glow {
    position: absolute; inset: 0; pointer-events: none; opacity: .5;
    background-image: linear-gradient(rgba(255, 255, 255, 0.05) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px);
    background-size: 56px 56px;
    -webkit-mask-image: radial-gradient(ellipse 60% 70% at 85% 10%, #000 10%, transparent 70%);
    mask-image: radial-gradient(ellipse 60% 70% at 85% 10%, #000 10%, transparent 70%);
}
.mbs-sec .mbs-container { position: relative; }
.mbs-section.mbs-sec .mbs-fx__hd h2 { color: #fff; }
.mbs-section.mbs-sec .mbs-fx__hd p { color: rgba(255, 255, 255, 0.78); }
.mbs-section .mbs-sec__badge {
    display: inline-flex; align-items: center; gap: 8px; padding: 9px 16px; border-radius: 999px; white-space: nowrap;
    font-size: 0.86rem; font-weight: 700; color: #fff; background: rgba(31, 157, 99, 0.18); border: 1px solid rgba(61, 214, 140, 0.4);
}
.mbs-sec__badge .mbs-ico { color: #3dd68c; }

.mbs-sec__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.mbs-sec__group--1 { grid-row: span 2; }
.mbs-sec__group {
    padding: 26px 26px 10px; border-radius: 20px; background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.12); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}
.mbs-sec__group-hd { display: flex; align-items: center; gap: 12px; padding-bottom: 16px; margin-bottom: 4px; border-bottom: 1px solid rgba(255, 255, 255, 0.12); }
.mbs-sec__group-ico { width: 42px; height: 42px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; color: #1a1204; background: linear-gradient(135deg, var(--mbs-accent), var(--mbs-accent-2)); flex-shrink: 0; }
.mbs-section.mbs-sec .mbs-sec__group-hd h3 { margin: 0; font-size: 1.1rem; font-weight: 800; color: #fff; }
.mbs-sec__list { list-style: none; margin: 0; padding: 0; }
.mbs-sec__list li { display: flex; gap: 14px; align-items: flex-start; padding: 16px 0; border-bottom: 1px solid rgba(255, 255, 255, 0.08); }
.mbs-sec__list li:last-child { border-bottom: 0; }
.mbs-sec__ico { width: 34px; height: 34px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; color: #9ec2ff; background: rgba(158, 194, 255, 0.12); }
.mbs-section.mbs-sec .mbs-sec__list b { display: block; font-size: 0.95rem; font-weight: 800; color: #fff; margin-bottom: 3px; }
.mbs-section.mbs-sec .mbs-sec__list li > div > span { display: block; font-size: 0.86rem; line-height: 1.55; color: rgba(255, 255, 255, 0.72); }

.mbs-sec__int { margin-top: 26px; padding: 20px 24px; border-radius: 18px; background: rgba(255, 255, 255, 0.04); border: 1px solid rgba(255, 255, 255, 0.1); display: flex; align-items: center; gap: 14px 24px; flex-wrap: wrap; }
.mbs-section.mbs-sec .mbs-sec__int .mbs-logos__lbl { margin: 0; flex-shrink: 0; font-size: 0.72rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: rgba(255, 255, 255, 0.6); text-align: left; }
.mbs-section.mbs-sec .mbs-sec__int .mbs-logos { margin: 0; justify-content: flex-start; flex: 1; gap: 8px; }
.mbs-section.mbs-sec .mbs-sec__int .mbs-logos li { padding: 6px 12px; border-radius: 999px; font-size: 0.8rem; font-weight: 600; color: #dbe5f7; background: rgba(255, 255, 255, 0.06); border: 1px solid rgba(255, 255, 255, 0.14); }

@media (max-width: 991px) {
    .mbs-sec__grid { grid-template-columns: 1fr; }
    .mbs-sec__group--1 { grid-row: auto; }
}
@media (max-width: 480px) {
    .mbs-sec__group { padding: 22px 18px 6px; }
    .mbs-sec__int { padding: 18px; }
}

/* ==========================================================================
   2026-09-29 — enterprise migration (#migration): intro + 4-step process on
   the left, coverage tiles on the right.
   ========================================================================== */
.mbs-mig__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 56px; align-items: center; }
.mbs-mig__intro .mbs-h2 { text-align: left; }
.mbs-section .mbs-mig__intro p.lead { color: var(--mbs-muted); font-size: 1.02rem; line-height: 1.7; margin: 0 0 26px; }
.mbs-mig__steps { list-style: none; margin: 0 0 28px; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; position: relative; counter-reset: none; }
.mbs-mig__steps::before { content: ""; position: absolute; left: 18px; right: calc(25% - 18px); top: 17px; height: 2px; background: linear-gradient(90deg, var(--mbs-sky), #cfdcf2); }
.mbs-mig__steps li { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 10px; padding-right: 10px; }
.mbs-mig__n {
    position: relative; z-index: 1; width: 36px; height: 36px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center;
    font-weight: 800; font-size: 0.9rem; color: #fff; background: var(--mbs-navy); box-shadow: 0 0 0 5px #f4f7fc;
}
.mbs-mig__steps li:last-child .mbs-mig__n { background: linear-gradient(135deg, var(--mbs-accent), var(--mbs-accent-2)); color: #1a1204; }
.mbs-section .mbs-mig__step { font-size: 0.86rem; font-weight: 700; color: var(--mbs-navy); line-height: 1.35; }

.mbs-mig__panel { padding: 28px; border-radius: 22px; background: #fff; border: 1px solid var(--mbs-line); box-shadow: 0 1px 2px rgba(13, 29, 62, 0.04), 0 20px 48px rgba(13, 29, 62, 0.09); }
.mbs-mig__panel-hd { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; }
.mbs-mig__panel-ico { width: 42px; height: 42px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; color: #fff; background: linear-gradient(135deg, var(--mbs-navy-deep), var(--mbs-navy-2)); flex-shrink: 0; }
.mbs-section .mbs-mig__panel-hd h3 { margin: 0; font-size: 1.1rem; font-weight: 800; color: var(--mbs-navy); }
.mbs-mig__items { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.mbs-mig__items li { display: flex; gap: 12px; align-items: flex-start; padding: 16px; border-radius: 14px; background: #f7f9fd; border: 1px solid var(--mbs-line); transition: border-color .2s, background .2s; }
.mbs-mig__items li:hover { border-color: #c7d8f3; background: #f2f7ff; }
.mbs-mig__ico { width: 34px; height: 34px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; color: var(--mbs-sky); background: #e8f0fd; }
.mbs-section .mbs-mig__txt { font-size: 0.88rem; line-height: 1.5; color: var(--mbs-text); padding-top: 6px; }

@media (max-width: 991px) {
    .mbs-mig__grid { grid-template-columns: 1fr; gap: 32px; }
}
@media (max-width: 575px) {
    .mbs-mig__items { grid-template-columns: 1fr; }
    .mbs-mig__steps { grid-template-columns: 1fr; gap: 14px; }
    .mbs-mig__steps::before { left: 17px; right: auto; top: 18px; bottom: 18px; width: 2px; height: auto; background: linear-gradient(180deg, var(--mbs-sky), #cfdcf2); }
    .mbs-mig__steps li { flex-direction: row; align-items: center; }
    .mbs-mig__panel { padding: 22px 18px; }
}

/* ==========================================================================
   2026-09-29 — enterprise CRM (#crm): lead-board illustration (real stage
   names/colours), 4-step flow, feature chips.
   ========================================================================== */
.mbs-crm__board-wrap {
    position: relative; margin-bottom: 34px; border-radius: 22px; overflow: hidden; background: #fff;
    border: 1px solid var(--mbs-line); box-shadow: 0 1px 2px rgba(13, 29, 62, 0.04), 0 26px 60px rgba(13, 29, 62, 0.1);
}
.mbs-crm__bar { display: flex; align-items: center; gap: 12px; padding: 14px 20px; background: var(--mbs-navy); color: #fff; font-size: 0.86rem; }
.mbs-crm__dots { display: inline-flex; gap: 6px; margin-right: 6px; }
.mbs-crm__dots i { width: 10px; height: 10px; border-radius: 50%; background: rgba(255, 255, 255, 0.28); }
.mbs-section .mbs-crm__bar b { font-weight: 800; margin-right: auto; }
.mbs-section .mbs-crm__pill { padding: 4px 10px; border-radius: 999px; font-size: 0.74rem; color: rgba(255, 255, 255, 0.85); background: rgba(255, 255, 255, 0.12); }
.mbs-crm__board { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 12px; padding: 18px; background: #f5f8fd; }
.mbs-crm__col { min-width: 0; padding: 10px; border-radius: 14px; background: #edf2fa; border-top: 3px solid var(--stage); }
.mbs-section .mbs-crm__col-hd { display: flex; align-items: center; gap: 7px; margin-bottom: 10px; font-size: 0.76rem; font-weight: 800; color: var(--mbs-navy); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mbs-crm__col-hd i { width: 8px; height: 8px; border-radius: 50%; background: var(--stage); flex-shrink: 0; }
.mbs-crm__card { padding: 10px; margin-bottom: 8px; border-radius: 10px; background: #fff; border: 1px solid #e3eaf5; box-shadow: 0 2px 6px rgba(13, 29, 62, 0.05); }
.mbs-crm__line { display: block; height: 7px; border-radius: 4px; background: #dde6f3; margin-bottom: 6px; }
.mbs-crm__line.w1 { width: 85%; background: #cbd8ec; } .mbs-crm__line.w2 { width: 60%; }
.mbs-crm__meta { display: flex; align-items: center; justify-content: space-between; gap: 6px; margin-top: 8px; }
.mbs-section .mbs-crm__src { font-size: 0.64rem; font-weight: 700; padding: 2px 7px; border-radius: 6px; color: var(--stage); background: color-mix(in srgb, var(--stage) 12%, #fff); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mbs-crm__av { width: 18px; height: 18px; border-radius: 50%; flex-shrink: 0; background: linear-gradient(135deg, #c5d4ec, #9fb5d8); }
.mbs-crm__empty { height: 60px; border: 2px dashed #d3ddec; border-radius: 10px; }
.mbs-section .mbs-crm__cap { position: absolute; right: 16px; bottom: 8px; font-size: 0.66rem; color: var(--mbs-muted); opacity: .8; }

.mbs-section .mbs-crm__steps-hd { margin: 0 0 14px; font-size: 0.72rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--mbs-muted); }
.mbs-crm__steps { list-style: none; margin: 0 0 26px; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.mbs-crm__steps li { position: relative; padding: 22px; border-radius: 18px; background: #fff; border: 1px solid var(--mbs-line); box-shadow: 0 1px 2px rgba(13, 29, 62, 0.04); }
.mbs-crm__steps li:not(:last-child)::after { content: ""; position: absolute; top: 40px; right: -13px; width: 10px; height: 10px; border-top: 2px solid #b9c9e3; border-right: 2px solid #b9c9e3; transform: rotate(45deg); z-index: 1; }
.mbs-crm__step-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.mbs-crm__step-ico { width: 38px; height: 38px; border-radius: 11px; display: inline-flex; align-items: center; justify-content: center; color: #fff; background: linear-gradient(135deg, var(--mbs-navy-deep), var(--mbs-navy-2)); }
.mbs-section .mbs-crm__step-n { font-size: 0.8rem; font-weight: 800; color: #b9c9e3; letter-spacing: .04em; }
.mbs-section .mbs-crm__steps h3 { margin: 0 0 6px; font-size: 1.02rem; font-weight: 800; color: var(--mbs-navy); }
.mbs-section .mbs-crm__steps p { margin: 0; font-size: 0.86rem; line-height: 1.6; color: var(--mbs-muted); }
.mbs-crm__feats { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.mbs-section .mbs-crm__feats li { display: inline-flex; align-items: center; gap: 7px; padding: 8px 14px; border-radius: 999px; font-size: 0.86rem; font-weight: 600; color: var(--mbs-navy); background: #fff; border: 1px solid var(--mbs-line); }
.mbs-crm__feats .mbs-ico { color: var(--mbs-green); }

@media (max-width: 1199px) {
    .mbs-crm__board { grid-template-columns: repeat(5, minmax(0, 1fr)); }
    .mbs-crm__col--4, .mbs-crm__col--7 { display: none; }
}
@media (max-width: 991px) {
    .mbs-crm__steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .mbs-crm__steps li:nth-child(2)::after { display: none; }
}
@media (max-width: 767px) {
    .mbs-crm__board { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; padding: 12px; }
    .mbs-crm__col--2, .mbs-crm__col--5 { display: none; }
    .mbs-crm__bar .mbs-crm__pill:last-child { display: none; }
    .mbs-crm__steps { grid-template-columns: 1fr; }
    .mbs-crm__steps li::after { display: none; }
}
@media (max-width: 400px) {
    .mbs-crm__bar .mbs-crm__pill { display: none; }
}
/* chip gets the full card width; the avatar sits in the card's top-right corner */
.mbs-crm__card { position: relative; padding-right: 30px; }
.mbs-crm__av { position: absolute; top: 9px; right: 8px; width: 16px; height: 16px; }
.mbs-crm__meta { justify-content: flex-start; }
@media (max-width: 767px) {
    .mbs-section .mbs-crm__src { font-size: 0.6rem; padding: 2px 5px; }
}
.mbs-section .mbs-crm__src { white-space: normal; overflow: visible; text-overflow: clip; line-height: 1.3; }

/* ==========================================================================
   2026-09-29 — enterprise automation (#automation): workflow panel (trigger
   + four automatic actions) beside the status list.
   ========================================================================== */
.mbs-auto__grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 28px; align-items: start; }
.mbs-auto__flow {
    position: relative; padding: 28px; border-radius: 22px; overflow: hidden; color: #dbe5f7;
    background: radial-gradient(120% 90% at 100% 0%, rgba(58, 123, 213, 0.35) 0%, rgba(58, 123, 213, 0) 55%), linear-gradient(160deg, var(--mbs-navy-deep), var(--mbs-navy-2));
    box-shadow: 0 30px 60px -22px rgba(13, 29, 62, 0.55);
}
.mbs-section .mbs-auto__flow-title { margin: 0 0 18px; font-size: 0.74rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: rgba(255, 255, 255, 0.6); }
.mbs-auto__trigger { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-radius: 14px; background: rgba(245, 160, 64, 0.14); border: 1px solid rgba(245, 160, 64, 0.45); }
.mbs-auto__trigger-ico { width: 38px; height: 38px; border-radius: 11px; display: inline-flex; align-items: center; justify-content: center; color: #1a1204; background: linear-gradient(135deg, var(--mbs-accent), var(--mbs-accent-2)); flex-shrink: 0; }
.mbs-section .mbs-auto__trigger small { display: block; font-size: 0.66rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: #ffd9b0; }
.mbs-section .mbs-auto__trigger b { display: block; font-size: 1rem; font-weight: 800; color: #fff; }
.mbs-auto__steps { list-style: none; margin: 0; padding: 0 0 0 18px; position: relative; }
.mbs-auto__steps::before { content: ""; position: absolute; left: 52px; top: 0; bottom: 30px; width: 2px; background: repeating-linear-gradient(180deg, rgba(158, 194, 255, 0.55) 0 6px, transparent 6px 11px); }
.mbs-auto__steps li { position: relative; display: flex; align-items: flex-start; gap: 14px; margin-top: 14px; padding: 14px 16px; border-radius: 14px; background: rgba(255, 255, 255, 0.06); border: 1px solid rgba(255, 255, 255, 0.12); }
.mbs-auto__node { width: 38px; height: 38px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; color: #fff; background: #1d3f7e; border: 2px solid rgba(158, 194, 255, 0.55); position: relative; z-index: 1; }
.mbs-section .mbs-auto__steps b { display: block; font-size: 0.95rem; font-weight: 800; color: #fff; margin-bottom: 2px; }
.mbs-section .mbs-auto__steps li > div > span { display: block; font-size: 0.84rem; line-height: 1.5; color: rgba(255, 255, 255, 0.72); }
.mbs-section .mbs-auto__auto { margin-left: auto; align-self: center; flex-shrink: 0; padding: 3px 9px; border-radius: 999px; font-size: 0.66rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: #3dd68c; background: rgba(61, 214, 140, 0.12); }

.mbs-auto__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.mbs-auto__list li { display: flex; align-items: center; gap: 14px; padding: 15px 16px; border-radius: 16px; background: #fff; border: 1px solid var(--mbs-line); box-shadow: 0 1px 2px rgba(13, 29, 62, 0.04); transition: border-color .2s, box-shadow .2s; }
.mbs-auto__list li:hover { border-color: #cddcf3; box-shadow: 0 10px 26px rgba(13, 29, 62, 0.07); }
.mbs-auto__ico { width: 38px; height: 38px; border-radius: 11px; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; color: var(--mbs-sky); background: #eef4ff; }
.mbs-section .mbs-auto__txt { flex: 1; font-size: 0.92rem; font-weight: 600; color: var(--mbs-navy); line-height: 1.45; }
.mbs-auto__list .mbs-status { margin-left: 0; flex-shrink: 0; }
.mbs-auto__list li.is-soon { background: #f8fafd; border-style: dashed; }
.mbs-auto__list li.is-soon .mbs-auto__ico { color: #8a97b3; background: #eef1f6; }
.mbs-auto__list li.is-soon .mbs-auto__txt { color: var(--mbs-muted); }

@media (max-width: 991px) {
    .mbs-auto__grid { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
    .mbs-auto__flow { padding: 22px 16px; }
    .mbs-auto__steps { padding-left: 0; }
    .mbs-auto__steps::before { left: 34px; }
    .mbs-section .mbs-auto__auto { display: none; }
}
@media (max-width: 575px) {
    .mbs-auto__list li { flex-wrap: wrap; row-gap: 6px; }
    .mbs-section .mbs-auto__txt { flex: 1 1 calc(100% - 52px); }
    .mbs-auto__list .mbs-status { margin-left: 52px; }
}

/* ==========================================================================
   2026-09-29 — enterprise white-label (#white-label): brand studio
   illustration (settings + student-facing preview) and a capability grid.
   ========================================================================== */
.mbs-wl__cta { align-items: center; margin: 0; }
.mbs-wl__studio {
    position: relative; display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.5fr); gap: 0; margin-bottom: 30px; overflow: hidden;
    border-radius: 22px; border: 1px solid var(--mbs-line); background: #fff; box-shadow: 0 1px 2px rgba(13, 29, 62, 0.04), 0 26px 60px rgba(13, 29, 62, 0.1);
}
.mbs-wl__settings { padding: 24px; color: #dbe5f7; background: linear-gradient(165deg, var(--mbs-navy-deep), var(--mbs-navy-2)); }
.mbs-section .mbs-wl__settings-hd { margin: 0 0 16px; font-size: 0.72rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: rgba(255, 255, 255, 0.6); }
.mbs-wl__field { padding: 11px 13px; margin-bottom: 9px; border-radius: 12px; background: rgba(255, 255, 255, 0.07); border: 1px solid rgba(255, 255, 255, 0.13); }
.mbs-section .mbs-wl__field small { display: block; margin-bottom: 4px; font-size: 0.64rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: rgba(255, 255, 255, 0.55); }
.mbs-section .mbs-wl__field b { font-size: 0.86rem; font-weight: 700; color: #fff; word-break: break-all; }
.mbs-wl__logo { display: inline-flex; align-items: center; gap: 7px; font-weight: 800; font-size: 0.86rem; color: #fff; }
.mbs-wl__logo i { width: 20px; height: 20px; border-radius: 6px; background: linear-gradient(135deg, #e87c2b, #f5a040); display: inline-block; }
.mbs-wl__swatches { display: flex; gap: 7px; }
.mbs-wl__swatches i { width: 22px; height: 22px; border-radius: 7px; display: inline-block; border: 2px solid rgba(255, 255, 255, 0.35); }

.mbs-wl__preview { padding: 22px 22px 26px; background: #eef3fb; display: flex; flex-direction: column; }
.mbs-wl__chrome { display: flex; align-items: center; gap: 12px; padding: 9px 12px; border-radius: 12px 12px 0 0; background: #dde5f2; }
.mbs-wl__dots { display: inline-flex; gap: 5px; }
.mbs-wl__dots i { width: 9px; height: 9px; border-radius: 50%; background: #b7c4d9; }
.mbs-section .mbs-wl__url { flex: 1; display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border-radius: 8px; background: #fff; font-size: 0.74rem; font-weight: 700; color: #1d7a4c; }
.mbs-wl__url .mbs-ico { color: #1f9d63; }
.mbs-wl__site { flex: 1; padding: 14px; border-radius: 0 0 12px 12px; background: #fff; border: 1px solid #dde5f2; border-top: 0; }
.mbs-wl__site s { display: block; text-decoration: none; height: 8px; border-radius: 4px; background: #e3e9f3; }
.mbs-wl__nav { display: flex; align-items: center; gap: 14px; padding-bottom: 12px; border-bottom: 1px solid #edf1f7; }
.mbs-wl__nav .mbs-wl__logo { color: #1a2e5a; }
.mbs-wl__links { flex: 1; display: flex; gap: 10px; justify-content: center; }
.mbs-wl__links s { width: 40px; }
.mbs-wl__btn { width: 64px; height: 24px; border-radius: 7px; background: #e87c2b; display: inline-block; }
.mbs-wl__btn--lg { width: 110px; height: 30px; margin-top: 14px; }
.mbs-wl__hero { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 16px; align-items: center; padding: 18px 4px 14px; }
.mbs-wl__hero-txt .l1 { width: 90%; height: 14px; background: #1a2e5a; opacity: .85; margin-bottom: 8px; }
.mbs-wl__hero-txt .l2 { width: 70%; height: 14px; background: #3a7bd5; margin-bottom: 12px; }
.mbs-wl__hero-txt .l3 { width: 80%; }
.mbs-wl__cert { position: relative; padding: 12px 12px 10px; border-radius: 10px; border: 2px solid #d4a84a; background: #fffdf7; text-align: center; box-shadow: 0 8px 20px rgba(13, 29, 62, 0.1); }
.mbs-wl__cert-seal { display: block; width: 22px; height: 22px; margin: 0 auto 4px; border-radius: 50%; background: linear-gradient(135deg, #f5c542, #d4a84a); }
.mbs-section .mbs-wl__cert-hd { display: block; font-size: 0.62rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: #b9520f; margin-bottom: 6px; }
.mbs-wl__cert .c1 { width: 80%; margin: 0 auto 5px; } .mbs-wl__cert .c2 { width: 55%; margin: 0 auto 8px; }
.mbs-section .mbs-wl__cert-sig { display: block; font-family: Georgia, serif; font-style: italic; font-size: 0.66rem; color: #1a2e5a; opacity: .7; }
.mbs-wl__cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.mbs-wl__cards span { height: 46px; border-radius: 9px; background: linear-gradient(135deg, #27a96c, #3a7bd5); opacity: .8; }
.mbs-wl__cards span:nth-child(2) { background: linear-gradient(135deg, #e87c2b, #f5a040); }
.mbs-wl__cards span:nth-child(3) { background: linear-gradient(135deg, #1a2e5a, #3a7bd5); }
.mbs-section .mbs-wl__cap { position: absolute; right: 14px; bottom: 6px; font-size: 0.66rem; color: var(--mbs-muted); }

.mbs-wl__grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.mbs-wl__grid li { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-radius: 16px; background: #fff; border: 1px solid var(--mbs-line); font-size: 0.9rem; font-weight: 600; color: var(--mbs-navy); line-height: 1.4; }
.mbs-wl__grid li.is-wide { grid-column: span 2; }
.mbs-wl__ico { width: 36px; height: 36px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; color: var(--mbs-sky); background: #eef4ff; }

@media (max-width: 1199px) {
    .mbs-wl__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 991px) {
    .mbs-wl__studio { grid-template-columns: 1fr; }
    .mbs-wl__settings { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
    .mbs-wl__settings-hd { grid-column: 1 / -1; }
    .mbs-wl__field { margin: 0; }
}
@media (max-width: 575px) {
    .mbs-wl__settings { grid-template-columns: 1fr; padding: 18px; }
    .mbs-wl__preview { padding: 14px 14px 22px; }
    .mbs-wl__links { display: none; }
    .mbs-wl__nav { justify-content: space-between; }
    .mbs-wl__grid { grid-template-columns: 1fr; }
    .mbs-wl__grid li.is-wide { grid-column: auto; }
}

/* preview: lesson rows fill the browser window */
.mbs-wl__rows { display: grid; gap: 8px; margin-top: 12px; }
.mbs-wl__rows span { display: flex; align-items: center; gap: 10px; padding: 9px 10px; border-radius: 9px; border: 1px solid #edf1f7; }
.mbs-wl__rows i { width: 18px; height: 18px; border-radius: 50%; background: #e87c2b; opacity: .85; flex-shrink: 0; }
.mbs-wl__rows s { flex: 0 0 35%; } .mbs-wl__rows s.w { flex: 0 0 20%; margin-left: auto; }
@media (max-width: 575px) { .mbs-wl__rows span:nth-child(3) { display: none; } }

/* ==========================================================================
   2026-09-29 — enterprise solutions (#solutions): three audience cards with
   a coloured band, checklist and one CTA each.
   ========================================================================== */
.mbs-sol__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.mbs-sol__card {
    display: flex; flex-direction: column; overflow: hidden; border-radius: 22px; background: #fff; border: 1px solid var(--mbs-line);
    box-shadow: 0 1px 2px rgba(13, 29, 62, 0.04), 0 14px 36px rgba(13, 29, 62, 0.07); transition: transform .25s, box-shadow .25s;
}
.mbs-sol__card:hover { transform: translateY(-4px); box-shadow: 0 1px 2px rgba(13, 29, 62, 0.04), 0 24px 50px rgba(13, 29, 62, 0.12); }
.mbs-sol__band { position: relative; display: flex; align-items: center; justify-content: space-between; height: 120px; padding: 0 24px; overflow: hidden; }
.mbs-sol__band::after { content: ""; position: absolute; right: -40px; bottom: -60px; width: 180px; height: 180px; border-radius: 50%; background: rgba(255, 255, 255, 0.14); }
.mbs-sol__card--coach .mbs-sol__band { background: linear-gradient(135deg, #2b6fd6, #56a0f5); }
.mbs-sol__card--academy .mbs-sol__band { background: linear-gradient(135deg, #e0701f, #f5a040); }
.mbs-sol__card--institute .mbs-sol__band { background: linear-gradient(135deg, var(--mbs-navy-deep), var(--mbs-navy-2)); }
.mbs-sol__ico { position: relative; z-index: 1; width: 56px; height: 56px; border-radius: 16px; display: inline-flex; align-items: center; justify-content: center; color: #fff; background: rgba(255, 255, 255, 0.2); border: 1px solid rgba(255, 255, 255, 0.35); }
.mbs-section .mbs-sol__tag { position: relative; z-index: 1; padding: 5px 12px; border-radius: 999px; font-size: 0.72rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: #fff; background: rgba(0, 0, 0, 0.18); }
.mbs-sol__body { flex: 1; display: flex; flex-direction: column; padding: 24px 24px 22px; }
.mbs-section .mbs-sol__body h3 { margin: 0 0 8px; font-size: 1.14rem; font-weight: 800; color: var(--mbs-navy); line-height: 1.3; }
.mbs-section .mbs-sol__body > p { margin: 0 0 16px; font-size: 0.9rem; line-height: 1.62; color: var(--mbs-muted); }
.mbs-sol__body ul { list-style: none; margin: 0 0 20px; padding: 16px 0 0; border-top: 1px solid var(--mbs-line); display: grid; gap: 10px; flex: 1; }
.mbs-section .mbs-sol__body li { display: flex; align-items: flex-start; gap: 9px; font-size: 0.88rem; line-height: 1.45; color: var(--mbs-text); }
.mbs-sol__body li .mbs-ico { color: var(--mbs-green); margin-top: 1px; flex-shrink: 0; }
.mbs-section a.mbs-sol__cta {
    align-self: flex-start; display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px; border-radius: 11px; font-weight: 700; font-size: 0.9rem;
    color: var(--mbs-navy); text-decoration: none; background: #f3f6fb; border: 1px solid var(--mbs-line); transition: background .15s, color .15s, border-color .15s;
}
.mbs-section a.mbs-sol__cta:hover { color: #fff; background: var(--mbs-navy); border-color: var(--mbs-navy); }
.mbs-sol__card--institute a.mbs-sol__cta { color: #fff; background: var(--mbs-navy); border-color: var(--mbs-navy); }
.mbs-sol__card--institute a.mbs-sol__cta:hover { background: var(--mbs-navy-2); }

@media (max-width: 991px) {
    .mbs-sol__grid { grid-template-columns: 1fr; max-width: 560px; margin: 0 auto; }
    .mbs-sol__card:hover { transform: none; }
    .mbs-sol__band { height: 96px; }
}

/* ==========================================================================
   2026-09-29 — enterprise platform flow (#platform): ten parts grouped into
   four journey phases, joined by a connector (vertical timeline on phones).
   ========================================================================== */
.mbs-pf__phases { list-style: none; margin: 0; padding: 26px 0 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; position: relative; }
.mbs-pf__phases::before { content: ""; position: absolute; left: 20px; right: 20px; top: 44px; height: 3px; border-radius: 3px; background: linear-gradient(90deg, #3a7bd5, #f5a040 40%, #1f9d63 70%, #1a2e5a); opacity: .45; }
.mbs-pf__phase { --pc: #3a7bd5; --pc-soft: #eaf1fd; position: relative; }
.mbs-pf__phase--orange { --pc: #e0701f; --pc-soft: #fdf0e3; }
.mbs-pf__phase--green { --pc: #1f9d63; --pc-soft: #e4f6ec; }
.mbs-pf__phase--navy { --pc: #1a2e5a; --pc-soft: #e7ebf3; }
.mbs-pf__phase-hd { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; position: relative; z-index: 1; }
.mbs-pf__dot { width: 38px; height: 38px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; font-weight: 800; font-size: 0.95rem; color: #fff; background: var(--pc); box-shadow: 0 0 0 6px #f4f7fc, 0 6px 16px rgba(13, 29, 62, 0.18); }
.mbs-section .mbs-pf__phase-name { font-size: 0.8rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--pc); background: #f4f7fc; padding-right: 8px; }
.mbs-pf__tools {
    list-style: none; margin: 0; padding: 8px; display: grid; gap: 8px; border-radius: 20px; background: #fff; border: 1px solid var(--mbs-line);
    border-top: 3px solid var(--pc); box-shadow: 0 1px 2px rgba(13, 29, 62, 0.04), 0 14px 34px rgba(13, 29, 62, 0.07);
}
.mbs-pf__tools li { display: flex; align-items: flex-start; gap: 12px; padding: 14px; border-radius: 14px; transition: background .15s; }
.mbs-pf__tools li:hover { background: var(--pc-soft); }
.mbs-pf__tools li + li { border-top: 1px solid #eef2f8; border-radius: 0 0 14px 14px; }
.mbs-pf__ico { width: 38px; height: 38px; border-radius: 11px; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; color: var(--pc); background: var(--pc-soft); }
.mbs-section .mbs-pf__tools b { display: block; font-size: 0.95rem; font-weight: 800; color: var(--mbs-navy); margin-bottom: 3px; line-height: 1.3; }
.mbs-section .mbs-pf__n { font-size: 0.72rem; font-weight: 800; color: #9fb0cf; margin-right: 4px; }
.mbs-section .mbs-pf__tools li > div > span { display: block; font-size: 0.84rem; line-height: 1.5; color: var(--mbs-muted); }

@media (max-width: 1199px) {
    .mbs-pf__phases { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 30px; }
    .mbs-pf__phases::before { display: none; }
}
@media (max-width: 767px) {
    .mbs-pf__phases { grid-template-columns: 1fr; padding-top: 6px; row-gap: 22px; }
    .mbs-pf__phases::before { display: block; left: 18px; right: auto; top: 20px; bottom: 20px; width: 3px; height: auto; background: linear-gradient(180deg, #3a7bd5, #f5a040 40%, #1f9d63 70%, #1a2e5a); }
    .mbs-pf__phase { padding-left: 0; }
    .mbs-pf__tools { margin-left: 50px; }
}
/* equal-height phase cards in each row */
.mbs-pf__phase { display: flex; flex-direction: column; }
.mbs-pf__tools { flex: 1; align-content: start; }

/* ==========================================================================
   2026-09-29 — home platform teaser (#platform on /) linking to /platform,
   and page spacing for the moved four-phase overview.
   ========================================================================== */
.mbs-pft { padding-top: 40px; padding-bottom: 40px; }
.mbs-pft__card {
    display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 36px; align-items: center; padding: 38px 42px; border-radius: 24px;
    background: radial-gradient(90% 120% at 100% 0%, #e7f0ff 0%, rgba(231, 240, 255, 0) 60%), #fff;
    border: 1px solid var(--mbs-line); box-shadow: 0 1px 2px rgba(13, 29, 62, 0.04), 0 18px 44px rgba(13, 29, 62, 0.08);
}
.mbs-section .mbs-pft__copy h2 { margin: 0 0 10px; text-align: left; }
.mbs-section .mbs-pft__copy p { margin: 0 0 22px; color: var(--mbs-muted); font-size: 1rem; line-height: 1.7; }
.mbs-pft__copy .mbs-btn { display: inline-flex; align-items: center; gap: 8px; }
.mbs-pft__track ol { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); position: relative; }
.mbs-pft__track ol::before { content: ""; position: absolute; left: 12%; right: 12%; top: 21px; height: 3px; border-radius: 3px; background: linear-gradient(90deg, #3a7bd5, #f5a040 40%, #1f9d63 70%, #1a2e5a); opacity: .5; }
.mbs-pft__track li { position: relative; display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center; }
.mbs-pft__track i { width: 44px; height: 44px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-style: normal; font-weight: 800; color: #fff; box-shadow: 0 0 0 6px #fff, 0 8px 18px rgba(13, 29, 62, 0.16); }
.mbs-pft__track .c1 i { background: #3a7bd5; } .mbs-pft__track .c2 i { background: #e0701f; } .mbs-pft__track .c3 i { background: #1f9d63; } .mbs-pft__track .c4 i { background: #1a2e5a; }
.mbs-section .mbs-pft__track span { font-size: 0.78rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; color: var(--mbs-navy); line-height: 1.3; }
.mbs-section .mbs-pft__count { margin: 18px 0 0; text-align: center; font-size: 0.86rem; font-weight: 600; color: var(--mbs-muted); }
.mbs-pf--page { padding-top: 48px; }
@media (max-width: 991px) {
    .mbs-pft__card { grid-template-columns: 1fr; padding: 30px 26px; }
}
@media (max-width: 575px) {
    .mbs-pft__card { padding: 24px 18px; }
    .mbs-pft__copy .mbs-btn { width: 100%; justify-content: center; }
    .mbs-section .mbs-pft__track span { font-size: 0.66rem; }
    .mbs-pft__track i { width: 38px; height: 38px; }
    .mbs-pft__track ol::before { top: 18px; }
}

/* ==========================================================================
   2026-09-29 — benefits: home teaser tiles (#benefits on /) and the /benefits
   page (zig-zag pillar rows with small UI illustrations).
   ========================================================================== */
.mbs-bnt__tiles { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.mbs-bnt__tiles li { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; padding: 18px 16px; border-radius: 16px; color: #fff; min-height: 128px; justify-content: space-between; box-shadow: 0 10px 24px rgba(13, 29, 62, 0.14); }
.mbs-bnt__tiles li.b { background: linear-gradient(145deg, #2b6fd6, #56a0f5); }
.mbs-bnt__tiles li.o { background: linear-gradient(145deg, #e0701f, #f5a040); }
.mbs-bnt__tiles li.g { background: linear-gradient(145deg, #148a55, #3dd68c); }
.mbs-section .mbs-bnt__tiles span { font-size: 0.9rem; font-weight: 800; line-height: 1.3; color: #fff; }
@media (max-width: 575px) {
    .mbs-bnt__tiles { gap: 8px; }
    .mbs-bnt__tiles li { padding: 14px 10px; min-height: 110px; }
    .mbs-section .mbs-bnt__tiles span { font-size: 0.74rem; }
}

.mbs-bn { padding-top: 64px; }
.mbs-bn__row { --bc: #2b6fd6; --bc2: #56a0f5; --bsoft: #eaf1fd; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 56px; align-items: center; padding: 34px 0; }
.mbs-bn__row + .mbs-bn__row { border-top: 1px solid var(--mbs-line); }
.mbs-bn__row--teach { --bc: #e0701f; --bc2: #f5a040; --bsoft: #fdf0e3; }
.mbs-bn__row--grow { --bc: #148a55; --bc2: #3dd68c; --bsoft: #e4f6ec; }
.mbs-bn__row.is-rev .mbs-bn__copy { order: 2; }
.mbs-bn__copy { position: relative; }
.mbs-section .mbs-bn__num { position: absolute; top: -18px; right: 0; font-size: 4.5rem; font-weight: 900; line-height: 1; color: var(--bsoft); z-index: 0; }
.mbs-bn__ico { position: relative; z-index: 1; width: 52px; height: 52px; border-radius: 15px; display: inline-flex; align-items: center; justify-content: center; margin-bottom: 18px; color: #fff; background: linear-gradient(135deg, var(--bc), var(--bc2)); box-shadow: 0 10px 22px rgba(13, 29, 62, 0.16); }
.mbs-section .mbs-bn__copy h3 { position: relative; margin: 0 0 10px; font-size: 1.7rem; font-weight: 800; color: var(--mbs-navy); line-height: 1.2; }
.mbs-section .mbs-bn__copy > p { margin: 0 0 20px; font-size: 1.02rem; line-height: 1.7; color: var(--mbs-muted); }
.mbs-bn__copy ul { list-style: none; margin: 0 0 24px; padding: 0; display: grid; gap: 10px; }
.mbs-section .mbs-bn__copy li { display: flex; align-items: flex-start; gap: 10px; font-size: 0.95rem; color: var(--mbs-text); line-height: 1.45; }
.mbs-bn__copy li .mbs-ico { flex-shrink: 0; margin-top: 2px; padding: 3px; width: 22px; height: 22px; border-radius: 50%; color: var(--bc); background: var(--bsoft); }
.mbs-section a.mbs-bn__link { display: inline-flex; align-items: center; gap: 8px; font-weight: 800; font-size: 0.95rem; color: var(--bc); text-decoration: none; }
.mbs-section a.mbs-bn__link:hover { text-decoration: underline; text-underline-offset: 4px; }

.mbs-bn__art { position: relative; min-height: 320px; border-radius: 26px; padding: 38px; display: flex; align-items: center; justify-content: center; background: radial-gradient(120% 120% at 0% 0%, var(--bsoft) 0%, #fff 70%); border: 1px solid var(--mbs-line); overflow: hidden; }
.mbs-bn__art::before { content: ""; position: absolute; width: 260px; height: 260px; right: -70px; bottom: -90px; border-radius: 50%; background: linear-gradient(135deg, var(--bc), var(--bc2)); opacity: .12; }
.mbs-bn__art s { display: block; text-decoration: none; height: 8px; border-radius: 4px; background: #e3e9f3; }
.bn-chip { position: absolute; display: inline-flex; align-items: center; gap: 7px; padding: 9px 14px; border-radius: 12px; font-size: 0.78rem; font-weight: 700; color: var(--mbs-navy); background: #fff; box-shadow: 0 14px 30px rgba(13, 29, 62, 0.16); z-index: 2; }
.bn-chip .mbs-ico { color: var(--bc); }
.bn-chip--mail { left: 26px; bottom: 26px; }
.bn-chip--pay { right: 26px; bottom: 30px; }
.bn-chip--rem { left: 26px; top: 26px; }

.bn-win { position: relative; z-index: 1; width: 100%; max-width: 380px; border-radius: 14px; overflow: hidden; background: #fff; border: 1px solid #dde5f2; box-shadow: 0 20px 44px rgba(13, 29, 62, 0.14); }
.bn-win__bar { display: flex; align-items: center; gap: 5px; padding: 9px 12px; background: #eef2f8; }
.bn-win__bar i { width: 8px; height: 8px; border-radius: 50%; background: #c2cddf; }
.bn-win__bar span { margin-left: 8px; flex: 1; display: inline-flex; align-items: center; gap: 5px; padding: 4px 9px; border-radius: 7px; background: #fff; font-size: 0.72rem; font-weight: 700; color: #1d7a4c; }
.bn-win__body { padding: 16px; }
.bn-logo { display: inline-flex; align-items: center; gap: 7px; font-weight: 800; font-size: 0.86rem; color: var(--mbs-navy); margin-bottom: 14px; }
.bn-logo i { width: 20px; height: 20px; border-radius: 6px; background: linear-gradient(135deg, #e87c2b, #f5a040); }
.bn-win__body .l1 { width: 85%; height: 12px; background: #1a2e5a; opacity: .8; margin-bottom: 8px; }
.bn-win__body .l2 { width: 60%; margin-bottom: 16px; }
.bn-cert { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 10px; border: 2px solid #d4a84a; background: #fffdf7; }
.bn-cert .seal { width: 22px; height: 22px; border-radius: 50%; background: linear-gradient(135deg, #f5c542, #d4a84a); flex-shrink: 0; }
.mbs-section .bn-cert b { font-size: 0.72rem; letter-spacing: .08em; text-transform: uppercase; color: #b9520f; }
.bn-cert s { flex: 1; }

.bn-course { position: relative; z-index: 1; width: 100%; max-width: 320px; padding: 14px; border-radius: 16px; background: #fff; border: 1px solid #e3eaf5; box-shadow: 0 20px 44px rgba(13, 29, 62, 0.14); }
.bn-course__thumb { height: 120px; border-radius: 12px; margin-bottom: 12px; display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, #15906a, #1280b8); }
.bn-course__thumb .play { width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, 0.28); border: 1px solid rgba(255, 255, 255, 0.5); position: relative; }
.bn-course__thumb .play::after { content: ""; position: absolute; left: 15px; top: 11px; border-left: 11px solid #fff; border-top: 7px solid transparent; border-bottom: 7px solid transparent; }
.mbs-section .bn-course b { display: block; font-size: 0.86rem; color: var(--mbs-navy); margin-bottom: 8px; }
.bn-progress { height: 6px; border-radius: 3px; background: #e8eef8; overflow: hidden; margin-bottom: 12px; }
.bn-progress span { display: block; width: 60%; height: 100%; background: linear-gradient(90deg, var(--bc), var(--bc2)); }
.bn-course__row { display: flex; gap: 6px; }
.mbs-section .bn-tag { padding: 4px 9px; border-radius: 7px; font-size: 0.68rem; font-weight: 700; color: var(--bc); background: var(--bsoft); }

.bn-dash { position: relative; z-index: 1; width: 100%; max-width: 380px; padding: 16px; border-radius: 16px; background: #fff; border: 1px solid #e3eaf5; box-shadow: 0 20px 44px rgba(13, 29, 62, 0.14); }
.bn-dash__cols { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 14px; }
.bn-dash__cols > div { padding: 8px; border-radius: 10px; background: #f3f6fb; border-top: 3px solid var(--c, #3b82f6); }
.mbs-section .bn-dash__cols em { display: block; font-style: normal; font-size: 0.68rem; font-weight: 800; color: var(--mbs-navy); margin-bottom: 6px; }
.bn-dash__cols s { height: 22px; border-radius: 6px; background: #fff; border: 1px solid #e3eaf5; margin-bottom: 5px; }
.bn-bars { display: flex; align-items: flex-end; gap: 8px; height: 90px; padding: 10px 10px 0; border-radius: 10px; background: #f7f9fd; }
.bn-bars span { flex: 1; border-radius: 6px 6px 0 0; background: linear-gradient(180deg, var(--bc2), var(--bc)); }

@media (max-width: 991px) {
    .mbs-bn__row { grid-template-columns: 1fr; gap: 26px; }
    .mbs-bn__row.is-rev .mbs-bn__copy { order: 0; }
    .mbs-bn__art { min-height: 260px; padding: 28px; }
}
@media (max-width: 575px) {
    .mbs-section .mbs-bn__copy h3 { font-size: 1.4rem; }
    .mbs-bn__art { padding: 22px 16px 70px; }
    .bn-chip--mail, .bn-chip--pay { left: 16px; right: auto; bottom: 18px; }
    .bn-chip--rem { top: auto; bottom: 18px; left: 16px; }
    .mbs-section .mbs-bn__num { font-size: 3.4rem; }
}
.bn-dash__cols > div:nth-child(1) { --c: #3b82f6; }
.bn-dash__cols > div:nth-child(2) { --c: #0ea5e9; }
.bn-dash__cols > div:nth-child(3) { --c: #10b981; }

/* ==========================================================================
   2026-09-29 — enterprise final CTA (home): contained dark card with the
   hero facts beside the buttons.
   ========================================================================== */
.mbs-final.mbs-final--x { background: #fff; color: inherit; padding: 40px 0 72px; text-align: left; overflow: visible; }
.mbs-final__card {
    position: relative; overflow: hidden; display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 40px; align-items: center;
    padding: 56px 56px; border-radius: 28px; color: #fff;
    background: linear-gradient(140deg, #060f24 0%, #10275a 50%, #1d4a9a 100%);
    box-shadow: 0 40px 80px -30px rgba(13, 29, 62, 0.6);
}
.mbs-final__card::before {
    content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .5;
    background-image: linear-gradient(rgba(255, 255, 255, 0.06) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.06) 1px, transparent 1px);
    background-size: 48px 48px;
    -webkit-mask-image: radial-gradient(ellipse 70% 90% at 90% 20%, #000 10%, transparent 70%);
    mask-image: radial-gradient(ellipse 70% 90% at 90% 20%, #000 10%, transparent 70%);
}
.mbs-final__glow { position: absolute; width: 420px; height: 420px; right: -120px; top: -160px; border-radius: 50%; background: radial-gradient(circle, rgba(245, 160, 64, 0.35) 0%, rgba(245, 160, 64, 0) 65%); pointer-events: none; }
.mbs-final__copy, .mbs-final__facts { position: relative; z-index: 1; }
.mbs-final.mbs-final--x h2 { text-align: left; margin: 0 0 14px; font-size: clamp(1.8rem, 3.2vw, 2.6rem); line-height: 1.15; }
.mbs-final.mbs-final--x .mbs-final__copy > p:not(.mbs-cta-note) { margin: 0 0 28px; max-width: 540px; }
.mbs-final.mbs-final--x .mbs-cta-row { justify-content: flex-start; }
.mbs-final.mbs-final--x .mbs-cta-row .mbs-btn { min-height: 52px; padding: 12px 28px; font-size: 1rem; }
.mbs-final.mbs-final--x .mbs-cta-note { margin: 14px 0 0; }
.mbs-final__facts { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.mbs-final.mbs-final--x .mbs-final__facts li {
    display: flex; align-items: center; gap: 14px; padding: 16px 18px; border-radius: 16px; font-size: 0.98rem; font-weight: 700; color: #fff;
    background: rgba(255, 255, 255, 0.07); border: 1px solid rgba(255, 255, 255, 0.14); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}
.mbs-final__ico { width: 38px; height: 38px; border-radius: 11px; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; color: #1a1204; background: linear-gradient(135deg, var(--mbs-accent), var(--mbs-accent-2)); }

@media (max-width: 991px) {
    .mbs-final__card { grid-template-columns: 1fr; padding: 40px 32px; gap: 28px; }
}
@media (max-width: 575px) {
    .mbs-final.mbs-final--x { padding: 24px 0 48px; }
    .mbs-final__card { padding: 30px 20px; border-radius: 22px; }
    .mbs-final.mbs-final--x .mbs-cta-row .mbs-btn { flex: 1 1 100%; }
}

/* ==========================================================================
   2026-09-29 — enterprise About page (platform host). Text from Admin →
   About Section, read into story / principles / mission cards.
   ========================================================================== */
.mbs-page-hero.mbs-ab-hero { padding-bottom: 72px; }
.mbs-page-hero.mbs-ab-hero .mbs-inner-title { margin-top: 0; }
.mbs-page-hero .mbs-ab-hero__lead { font-size: clamp(1.1rem, 2vw, 1.4rem); font-weight: 600; color: rgba(255, 255, 255, 0.9); max-width: 720px; }
.mbs-page-hero .mbs-ab-hero__lead span { color: var(--mbs-accent-2); }

.mbs-ab-story__grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 56px; align-items: center; }
.mbs-section .mbs-ab-story__copy h2 { text-align: left; margin: 0 0 16px; }
.mbs-section .mbs-ab-story__copy > p { margin: 0 0 16px; font-size: 1.04rem; line-height: 1.75; color: var(--mbs-text); }
.mbs-ab-story__copy .mbs-cta-row { margin-top: 26px; align-items: center; }
.mbs-section .mbs-ab-raw p { margin: 0 0 14px; line-height: 1.7; }

.mbs-ab-art { position: relative; display: grid; grid-template-columns: minmax(0, 0.8fr) auto minmax(0, 1.2fr); gap: 16px; align-items: center; padding: 30px; border-radius: 26px; background: radial-gradient(120% 120% at 0% 0%, #eaf1fd 0%, #fff 70%); border: 1px solid var(--mbs-line); box-shadow: 0 20px 50px rgba(13, 29, 62, 0.08); }
.mbs-section .mbs-ab-art__lbl { display: block; margin-bottom: 10px; font-size: 0.68rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--mbs-muted); }
.mbs-ab-art__tools { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.mbs-ab-art__tools i { display: inline-flex; align-items: center; justify-content: center; height: 54px; border-radius: 12px; color: #8a97b3; background: #fff; border: 1px dashed #c9d4e6; transform: rotate(-4deg); }
.mbs-ab-art__tools i:nth-child(2) { transform: rotate(5deg); } .mbs-ab-art__tools i:nth-child(3) { transform: rotate(3deg); } .mbs-ab-art__tools i:nth-child(4) { transform: rotate(-6deg); }
.mbs-ab-art__arrow { color: var(--mbs-accent); }
.mbs-ab-art__one { padding: 14px; border-radius: 16px; background: #fff; border: 1px solid #dde5f2; box-shadow: 0 16px 34px rgba(13, 29, 62, 0.12); }
.mbs-ab-art__brand { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; font-weight: 800; font-size: 0.86rem; color: var(--mbs-navy); }
.mbs-ab-art__brand i { width: 20px; height: 20px; border-radius: 6px; background: linear-gradient(135deg, #e87c2b, #f5a040); }
.mbs-ab-art__row { display: flex; align-items: center; gap: 10px; padding: 8px 0; border-top: 1px solid #eef2f8; }
.mbs-ab-art__row span { width: 28px; height: 28px; border-radius: 8px; display: inline-flex; align-items: center; justify-content: center; color: var(--mbs-sky); background: #eaf1fd; flex-shrink: 0; }
.mbs-ab-art__row s { flex: 1; height: 8px; border-radius: 4px; background: #e3e9f3; text-decoration: none; display: block; }
.mbs-ab-art__row:nth-child(3) s { width: 70%; flex: 0 0 70%; } .mbs-ab-art__row:nth-child(5) s { flex: 0 0 55%; }

.mbs-ab-accent { color: var(--mbs-sky); }
.mbs-ab-principles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin-bottom: 22px; }
.mbs-ab-card { padding: 26px; border-radius: 20px; background: #fff; border: 1px solid var(--mbs-line); box-shadow: 0 1px 2px rgba(13, 29, 62, 0.04), 0 14px 34px rgba(13, 29, 62, 0.06); }
.mbs-ab-card__ico { width: 46px; height: 46px; border-radius: 13px; display: inline-flex; align-items: center; justify-content: center; margin-bottom: 16px; color: var(--mbs-sky); background: #eaf1fd; }
.mbs-section .mbs-ab-card h3, .mbs-section .mbs-ab-mcard h3 { margin: 0 0 8px; font-size: 1.1rem; font-weight: 800; color: var(--mbs-navy); line-height: 1.3; }
.mbs-section .mbs-ab-card p { margin: 0; font-size: 0.94rem; line-height: 1.65; color: var(--mbs-muted); }
.mbs-ab-mission { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.mbs-ab-mcard { position: relative; overflow: hidden; padding: 28px; border-radius: 20px; color: #dbe5f7; background: linear-gradient(160deg, var(--mbs-navy-deep), var(--mbs-navy-2)); box-shadow: 0 24px 50px -20px rgba(13, 29, 62, 0.5); }
.mbs-ab-mcard::after { content: ""; position: absolute; right: -50px; bottom: -70px; width: 170px; height: 170px; border-radius: 50%; background: rgba(255, 255, 255, 0.06); }
.mbs-ab-mcard__ico { width: 46px; height: 46px; border-radius: 13px; display: inline-flex; align-items: center; justify-content: center; margin-bottom: 16px; color: #1a1204; background: linear-gradient(135deg, var(--mbs-accent), var(--mbs-accent-2)); }
.mbs-section .mbs-ab-mcard h3 { color: #fff; }
.mbs-section .mbs-ab-mcard p { position: relative; margin: 0; font-size: 0.98rem; line-height: 1.65; color: rgba(255, 255, 255, 0.82); }

@media (max-width: 991px) {
    .mbs-ab-story__grid { grid-template-columns: 1fr; gap: 32px; }
    .mbs-ab-principles, .mbs-ab-mission { grid-template-columns: 1fr; max-width: 560px; }
}
@media (max-width: 575px) {
    .mbs-ab-art { grid-template-columns: 1fr; padding: 22px 16px; }
    .mbs-ab-art__arrow { transform: rotate(90deg); justify-self: center; }
}

/* ==========================================================================
   2026-09-29 — enterprise Contact page (platform host): intent cards, dark
   info panel with admin contact details, labelled form card.
   ========================================================================== */
.mbs-page-hero.mbs-ct-hero { padding-bottom: 110px; }
.mbs-page-hero.mbs-ct-hero .mbs-inner-title { margin-top: 0; }
.mbs-ct { padding-top: 0; }
.mbs-ct__routes { position: relative; z-index: 2; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin: -64px 0 40px; }
.mbs-section a.mbs-ct__route {
    display: flex; align-items: flex-start; gap: 14px; padding: 20px; border-radius: 18px; background: #fff; text-decoration: none;
    border: 1px solid var(--mbs-line); box-shadow: 0 18px 44px rgba(13, 29, 62, 0.12); transition: transform .2s, border-color .2s, box-shadow .2s;
}
.mbs-section a.mbs-ct__route:hover, .mbs-section a.mbs-ct__route.is-active { transform: translateY(-3px); border-color: var(--mbs-sky); box-shadow: 0 22px 50px rgba(13, 29, 62, 0.16); }
.mbs-ct__route-ico { width: 44px; height: 44px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; color: #fff; background: linear-gradient(135deg, var(--mbs-navy-deep), var(--mbs-navy-2)); }
.mbs-ct__route:first-child .mbs-ct__route-ico { color: #1a1204; background: linear-gradient(135deg, var(--mbs-accent), var(--mbs-accent-2)); }
.mbs-ct__route-txt { flex: 1; min-width: 0; }
.mbs-section .mbs-ct__route-txt b { display: block; font-size: 1rem; font-weight: 800; color: var(--mbs-navy); margin-bottom: 3px; }
.mbs-section .mbs-ct__route-txt small { display: block; font-size: 0.84rem; line-height: 1.5; color: var(--mbs-muted); }
.mbs-ct__route-go { align-self: center; color: var(--mbs-sky); }

.mbs-ct__grid { display: grid; grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr); gap: 28px; align-items: stretch; }
.mbs-ct__info { position: relative; overflow: hidden; padding: 34px; border-radius: 24px; color: #dbe5f7; background: linear-gradient(160deg, var(--mbs-navy-deep), var(--mbs-navy-2)); box-shadow: 0 30px 60px -24px rgba(13, 29, 62, 0.55); }
.mbs-ct__info::after { content: ""; position: absolute; right: -80px; bottom: -110px; width: 260px; height: 260px; border-radius: 50%; background: rgba(255, 255, 255, 0.06); }
.mbs-section .mbs-ct__info h2 { position: relative; margin: 0 0 22px; font-size: 1.6rem; color: #fff; text-align: left; line-height: 1.25; }
.mbs-ct__list { position: relative; list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.mbs-ct__list li { display: flex; align-items: center; gap: 14px; padding: 14px 16px; border-radius: 14px; background: rgba(255, 255, 255, 0.06); border: 1px solid rgba(255, 255, 255, 0.12); }
.mbs-ct__ico { width: 40px; height: 40px; border-radius: 11px; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; color: #1a1204; background: linear-gradient(135deg, var(--mbs-accent), var(--mbs-accent-2)); }
.mbs-section .mbs-ct__list small { display: block; font-size: 0.68rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: rgba(255, 255, 255, 0.55); margin-bottom: 2px; }
.mbs-section .mbs-ct__list a, .mbs-section .mbs-ct__list li > div > span { display: block; font-size: 0.98rem; font-weight: 700; color: #fff; text-decoration: none; word-break: break-word; }
.mbs-section .mbs-ct__list a:hover { text-decoration: underline; }
.mbs-ct__social { position: relative; margin-top: 22px; }
.mbs-section .mbs-ct__social small { display: block; margin-bottom: 10px; font-size: 0.68rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: rgba(255, 255, 255, 0.55); }
.mbs-ct__social ul { list-style: none; margin: 0; padding: 0; display: flex; gap: 8px; }
.mbs-section .mbs-ct__social a { width: 40px; height: 40px; border-radius: 11px; display: inline-flex; align-items: center; justify-content: center; color: #fff; text-decoration: none; border: 1px solid rgba(255, 255, 255, 0.2); }
.mbs-section .mbs-ct__social a:hover { background: rgba(255, 255, 255, 0.12); }

.mbs-ct__form { padding: 34px; border-radius: 24px; background: #fff; border: 1px solid var(--mbs-line); box-shadow: 0 1px 2px rgba(13, 29, 62, 0.04), 0 20px 50px rgba(13, 29, 62, 0.08); scroll-margin-top: 110px; }
.mbs-section .mbs-ct__form h2 { margin: 0 0 8px; font-size: 1.6rem; text-align: left; }
.mbs-section .mbs-ct__form-lead { margin: 0 0 24px; font-size: 0.95rem; line-height: 1.6; color: var(--mbs-muted); }
.mbs-ct__fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-bottom: 22px; }
.mbs-ct__field--full { grid-column: 1 / -1; }
.mbs-section .mbs-ct__field label { display: block; margin-bottom: 6px; font-size: 0.82rem; font-weight: 700; color: var(--mbs-navy); }
.mbs-ct__field label em { font-style: normal; color: #c2410c; }
.mbs-section .mbs-ct__field .form-control { width: 100%; height: auto; min-height: 48px; padding: 12px 14px; border-radius: 12px; border: 1px solid #cfd8ea; background: #f8fafd; font-size: 0.95rem; color: var(--mbs-navy); box-shadow: none; transition: border-color .15s, background .15s, box-shadow .15s; }
.mbs-section .mbs-ct__field textarea.form-control { min-height: 130px; resize: vertical; }
.mbs-section .mbs-ct__field .form-control:focus { outline: none; background: #fff; border-color: var(--mbs-sky); box-shadow: 0 0 0 4px rgba(58, 123, 213, 0.15); }
.mbs-ct__submit { min-height: 52px; padding: 12px 30px; font-size: 1rem; }

@media (max-width: 991px) {
    .mbs-ct__routes { grid-template-columns: 1fr; }
    .mbs-ct__grid { grid-template-columns: 1fr; }
}
@media (max-width: 575px) {
    .mbs-ct__fields { grid-template-columns: 1fr; }
    .mbs-ct__info, .mbs-ct__form { padding: 24px 18px; }
    .mbs-ct__submit { width: 100%; }
}

/* ==========================================================================
   2026-09-29 — enterprise blog listing + article pages (platform host).
   ========================================================================== */
.mbs-page-hero.mbs-bg-hero, .mbs-page-hero.mbs-at-hero { padding-bottom: 64px; }
.mbs-page-hero.mbs-bg-hero .mbs-inner-title, .mbs-page-hero.mbs-at-hero .mbs-inner-title { margin-top: 0; }
.mbs-page-hero.mbs-at-hero .mbs-inner-title { max-width: 900px; margin-left: auto; margin-right: auto; line-height: 1.2; }
.mbs-page-hero .mbs-at-meta { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 10px; font-size: 0.92rem; color: rgba(255, 255, 255, 0.78); }

.mbs-bg__chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 30px; }
.mbs-section .mbs-bg__chips a {
    display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 999px; font-size: 0.88rem; font-weight: 700;
    color: var(--mbs-navy); text-decoration: none; background: #fff; border: 1px solid var(--mbs-line); transition: border-color .15s, background .15s;
}
.mbs-section .mbs-bg__chips a span { font-size: 0.74rem; font-weight: 800; padding: 1px 7px; border-radius: 999px; background: #eef2f8; color: var(--mbs-muted); }
.mbs-section .mbs-bg__chips a:hover { border-color: var(--mbs-sky); }
.mbs-section .mbs-bg__chips a.is-active { color: #fff; background: var(--mbs-navy); border-color: var(--mbs-navy); }
.mbs-section .mbs-bg__chips a.is-active span { background: rgba(255, 255, 255, 0.18); color: #fff; }

.mbs-bg__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.mbs-bg__card { display: flex; flex-direction: column; overflow: hidden; border-radius: 18px; background: #fff; border: 1px solid var(--mbs-line); box-shadow: 0 1px 2px rgba(13, 29, 62, 0.04), 0 12px 30px rgba(13, 29, 62, 0.06); transition: transform .2s, box-shadow .2s; }
.mbs-bg__card:hover { transform: translateY(-3px); box-shadow: 0 1px 2px rgba(13, 29, 62, 0.04), 0 20px 44px rgba(13, 29, 62, 0.11); }
.mbs-bg__img { display: block; aspect-ratio: 1200 / 630; overflow: hidden; background: #0d1d3e; }
.mbs-bg__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mbs-bg__body { flex: 1; display: flex; flex-direction: column; padding: 20px 22px 22px; }
.mbs-bg__meta { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 10px; font-size: 0.8rem; color: var(--mbs-muted); }
.mbs-section a.mbs-bg__cat { font-weight: 800; font-size: 0.72rem; letter-spacing: .06em; text-transform: uppercase; color: var(--mbs-sky); text-decoration: none; }
.mbs-section .mbs-bg__title { margin: 0 0 10px; font-size: 1.12rem; font-weight: 800; line-height: 1.35; text-align: left; font-family: var(--mbs-font-sans); }
.mbs-section .mbs-bg__title a { color: var(--mbs-navy); text-decoration: none; }
.mbs-section .mbs-bg__title a:hover { color: var(--mbs-sky); }
.mbs-section .mbs-bg__excerpt { margin: 0 0 16px; font-size: 0.9rem; line-height: 1.6; color: var(--mbs-muted); flex: 1; }
.mbs-section a.mbs-bg__more { align-self: flex-start; display: inline-flex; align-items: center; gap: 6px; font-weight: 800; font-size: 0.9rem; color: var(--mbs-navy); text-decoration: none; }
.mbs-section a.mbs-bg__more:hover { color: var(--mbs-sky); }
.mbs-bg__card.is-lead { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); }
.mbs-bg__card.is-lead .mbs-bg__img { aspect-ratio: auto; height: 100%; min-height: 300px; }
.mbs-bg__card.is-lead .mbs-bg__body { justify-content: center; padding: 34px; }
.mbs-section .mbs-bg__card.is-lead .mbs-bg__title { font-size: 1.6rem; }
.mbs-bg__pages { margin-top: 36px; display: flex; justify-content: center; }
.mbs-section .mbs-bg__empty { text-align: center; color: var(--mbs-muted); }

.mbs-at__grid { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 44px; align-items: start; }
.mbs-at__cover { width: 100%; height: auto; border-radius: 18px; margin-bottom: 28px; display: block; box-shadow: 0 16px 40px rgba(13, 29, 62, 0.14); }
.mbs-prose { max-width: 720px; font-size: 1.06rem; line-height: 1.8; color: #1f2a44; }
.mbs-section .mbs-prose p { margin: 0 0 18px; font-size: 1.06rem; line-height: 1.8; color: #1f2a44; }
.mbs-section .mbs-prose p:has(> strong:only-child) { margin: 34px 0 12px; }
.mbs-section .mbs-prose p > strong:only-child { display: block; font-family: var(--mbs-font-sans); font-size: 1.35rem; font-weight: 800; line-height: 1.3; color: var(--mbs-navy); }
.mbs-section .mbs-prose p:first-child { font-size: 1.16rem; color: #33405e; }
.mbs-section .mbs-prose ul, .mbs-section .mbs-prose ol { margin: 0 0 20px; padding-left: 24px; }
.mbs-section .mbs-prose ul li { list-style: disc; margin: 0 0 8px; padding-left: 4px; line-height: 1.7; color: #1f2a44; }
.mbs-section .mbs-prose ol li { list-style: decimal; margin: 0 0 8px; padding-left: 4px; line-height: 1.7; color: #1f2a44; }
.mbs-section .mbs-prose li::marker { color: var(--mbs-sky); font-weight: 800; }
.mbs-section .mbs-prose a { color: var(--mbs-sky); text-decoration: underline; text-underline-offset: 3px; font-weight: 600; }
.mbs-at__tags { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 30px 0 0; padding: 22px 0 0; border-top: 1px solid var(--mbs-line); max-width: 720px; }
.mbs-section .mbs-at__tags li { padding: 5px 12px; border-radius: 999px; font-size: 0.8rem; font-weight: 700; color: var(--mbs-navy); background: #f1f5fb; border: 1px solid var(--mbs-line); }
.mbs-at__side { position: sticky; top: 110px; display: grid; gap: 18px; }
.mbs-at__cta { padding: 24px; border-radius: 18px; color: #dbe5f7; background: linear-gradient(160deg, var(--mbs-navy-deep), var(--mbs-navy-2)); box-shadow: 0 20px 44px -18px rgba(13, 29, 62, 0.5); display: grid; gap: 10px; }
.mbs-section .mbs-at__cta-title { margin: 0; font-size: 1.1rem; font-weight: 800; color: #fff; line-height: 1.35; }
.mbs-section .mbs-at__cta p { margin: 0 0 6px; font-size: 0.9rem; line-height: 1.55; color: #c3d0e8; }
.mbs-at__cta .mbs-btn { width: 100%; justify-content: center; }
.mbs-at__box { padding: 20px 22px; border-radius: 18px; background: #fff; border: 1px solid var(--mbs-line); }
.mbs-section .mbs-at__box-title { margin: 0 0 10px; font-size: 0.72rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--mbs-muted); }
.mbs-at__box ul { list-style: none; margin: 0; padding: 0; }
.mbs-section .mbs-at__box li a { display: flex; justify-content: space-between; gap: 10px; padding: 9px 0; border-top: 1px solid #eef2f8; font-size: 0.92rem; font-weight: 600; color: var(--mbs-navy); text-decoration: none; }
.mbs-section .mbs-at__box li:first-child a { border-top: 0; }
.mbs-section .mbs-at__box li a span { color: var(--mbs-muted); font-weight: 700; }
.mbs-section .mbs-at__box li a:hover { color: var(--mbs-sky); }
.mbs-at__related { margin-top: 64px; padding-top: 40px; border-top: 1px solid var(--mbs-line); }
.mbs-section .mbs-at__related h2 { text-align: left; margin: 0 0 24px; font-size: 1.6rem; }

@media (max-width: 991px) {
    .mbs-bg__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .mbs-bg__card.is-lead { grid-template-columns: 1fr; }
    .mbs-bg__card.is-lead .mbs-bg__img { aspect-ratio: 1200 / 630; min-height: 0; }
    .mbs-at__grid { grid-template-columns: 1fr; }
    .mbs-at__side { position: static; }
}
@media (max-width: 575px) {
    .mbs-bg__grid { grid-template-columns: 1fr; }
    .mbs-section .mbs-bg__card.is-lead .mbs-bg__title { font-size: 1.25rem; }
    .mbs-bg__card.is-lead .mbs-bg__body { padding: 22px; }
    .mbs-prose, .mbs-section .mbs-prose p { font-size: 1rem; }
    .mbs-section .mbs-prose p > strong:only-child { font-size: 1.2rem; }
}

/* 2026-09-29 — Resources mega menu gains a "Blog topics" column (two link columns + card). */
@media (min-width: 1200px) {
    .mbs-nav .mbs-mega--resources:has(> .mbs-mega__col:nth-of-type(2)) { width: 820px; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 240px; }
}
.mbs-nav .mbs-mega--resources .mbs-mega__card-text { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

/* 2026-09-29 — home "From the blog" teaser (reuses the .mbs-bg__card grid). */
.mbs-hblog__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 32px; }
.mbs-section .mbs-hblog__head h2 { text-align: left; margin: 8px 0 8px; }
.mbs-section .mbs-hblog__head p { margin: 0; max-width: 560px; color: var(--mbs-muted); }
.mbs-hblog__head .mbs-fx__link { flex-shrink: 0; margin: 0; }
@media (max-width: 767px) {
    .mbs-hblog__head { flex-direction: column; align-items: flex-start; }
}

/* 2026-09-30 — blog QA: category labels and in-article links need 4.5:1 on white (#3a7bd5 was ~4.1). */
.mbs-section a.mbs-bg__cat { color: #1f5fb4; }
.mbs-section .mbs-prose a { color: #1f5fb4; }
.mbs-section .mbs-prose a:hover { color: var(--mbs-navy); }