/* ============================================================
   /identity-and-access-management - page stylesheet.
   Loads AFTER css/it-managed-services-zazz.css. $zmit_css_v: iam1001a - bump
   on every edit to a token no other page in the repo uses.

   Reference: identity-and-access-management/okta-services.php (Family A);
   .zab-stack + .zab-flip blocks from css/nearshore-software-development.css;
   hero OWNER deviation + HubSpot single-box fields from
   css/application-management-services.css / enterprise-software-development-company.css.
   Every number below was read off LIVE at 1440 with the band in view
   (.scratch/b13iam/probe.js, probe2.js). House 1340 box is NOT widened
   (CLAUDE.md), so live's 1380-wide rows reflow into 1340 here.
   ============================================================ */

.zmit {
    --zab-ink: #14142b;
    --zab-fill: #eff0f7;
    --zab-dark: #262338;
}

/* Shared arrow for live's "text + ->" buttons */
.zmit .iam-arrow-btn { display: inline-flex; align-items: center; gap: 12px; }
.zmit .iam-arrow-btn::after {
    content: ""; width: 16px; height: 10px; flex: 0 0 16px;
    background: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 11'%3E%3Cpath d='M15.8975 5.15622L10.7549 0.0136719L9.28562 1.46002L11.9487 4.12312L0.103516 4.14608V6.21228L11.9487 6.18933L9.28562 8.85243L10.7549 10.3217L15.8975 5.15622Z'/%3E%3C/svg%3E") center/contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 11'%3E%3Cpath d='M15.8975 5.15622L10.7549 0.0136719L9.28562 1.46002L11.9487 4.12312L0.103516 4.14608V6.21228L11.9487 6.18933L9.28562 8.85243L10.7549 10.3217L15.8975 5.15622Z'/%3E%3C/svg%3E") center/contain no-repeat;
}

/* ============================================================
   HERO (9e1c7de). Live at 1440: banner t100 h645 (img 1440x645, ml-mp-banner),
   copy column 766 wide at x30, card t140 h702 w514 padding 20 25 20 20,
   2px rgba(93,100,129,.2) border, radius 8, overhang 97 into the 70px logo
   strip (strip t760 = banner bottom + 15).
   ============================================================ */
.zmit-hero::before {
    background: url('https://dahqbtk1vlskk.cloudfront.net/wp-content/uploads/2025/06/18072503/ml-mp-banner-banner-768x240.webp') center/cover no-repeat;
    background-color: #05070f;
}
@media (min-width: 768px) {
    .zmit-hero::before {
        background: url('https://dahqbtk1vlskk.cloudfront.net/wp-content/uploads/2025/06/18072503/ml-mp-banner-banner.webp') center/100% 100% no-repeat;
        background-color: #05070f;
    }
}
.zmit .zmit-form-card > script,
.zmit .zmit-form-card > style { display: none !important; }

@media (min-width: 1081px) {
    .zmit .zmit-hero-crumb, .zmit .zmit-hero-crumb a { font-size: 12px; line-height: 14.4px; }
    .zmit .zmit-hero-crumb { color: rgba(255, 255, 255, .76); padding-top: 20px; margin-bottom: 22px; }
    .zmit .zmit-hero-crumb a { color: #fff; }
    .zmit .zmit-hero-crumb .sep { margin: 0 3px; }
    /* 766 | 60 | 514 of the 1340 box */
    .zmit .zmit-hero-grid { grid-template-columns: 57.1642% 38.3582%; gap: 4.4776%; padding: 28px 0 0; }
    .zmit .zmit-hero .zmit-hero-pill { margin: 0 0 20px; }
    /* OWNER deviation (2026-09-28): headline 42/52 where live is 54/64.8. */
    .zmit .zmit-hero .zmit-hero-headline { font-size: 42px; line-height: 52px; font-weight: 600; margin: 0 0 20px; }
    .zmit .zmit-hero .zmit-hero-sub { max-width: 766px; color: #fff; font-size: 16px; line-height: 26.4px; margin: 0 0 20px; }
    .zmit .zmit-hero-cta { margin-bottom: 0; }
    .zmit .zmit-hero .zmit-hero-cta-btn {
        font-size: 16px; line-height: 16px; font-weight: 400; min-height: 42px;
        padding: 13px 35px; gap: 20px; background: #f2f7ff; border: 0; border-radius: 8px;
    }
    .zmit .zmit-hero .zmit-hero-cta-btn:hover { background: #e2ecff; }
    /* OWNER deviation: banner sized by the COPY column (>=60 under the CTA),
       card sized by its content (never stretched), card keeps live's ~96px
       overhang into the logo strip. Mechanism as css/application-management-services.css. */
    .zmit .zmit-hero { min-height: 0; }
    .zmit .zmit-hero .zmit-hero-left { padding-bottom: 60px; align-self: start; }
    .zmit .zmit-hero .zmit-hero-right { align-self: start; margin: -44px 0 -96.59px; }
    .zmit .zmit-hero .zmit-form-card {
        display: flex; flex-direction: column; justify-content: flex-start; gap: 20px;
        height: auto; min-height: 0; margin: 0; transform: none; padding: 20px 25px 20px 20px;
    }
    .zmit .zmit-hero .zmit-form-card > * { flex: 0 0 auto; margin: 0 !important; }
    .zmit .zmit-hero .zmit-form-card h3 { font-size: 20px; line-height: 27px; font-weight: 600; }
    .zmit .zmit-form-card .zmit-hsform { min-height: 0; }
    /* tuning value that holds the overhang at ~96 (see report) */
    .zmit .zmit-hero .zmit-form-card .zmit-form-note { margin-top: 30px !important; }
}
/* Scroll cue: live's bare 30px chevron */
.zmit-hero .zmit-hero-scroll {
    left: 50%; bottom: 18px; width: 30px; height: 30px; border: 0; border-radius: 0;
    background: none; -webkit-backdrop-filter: none; backdrop-filter: none;
    color: rgba(255, 255, 255, .66); animation: iam-float 3s ease-in-out infinite;
}
@keyframes iam-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(5px); } }
@media (prefers-reduced-motion: reduce) { .zmit-hero .zmit-hero-scroll { animation: none; } }
.zmit-hero .zmit-hero-scroll svg { width: 30px; height: 30px; }
.zmit-hero .zmit-hero-scroll:hover { background: none; color: #fff; }

/* Trust strip: 15 above a 70px row, 40 below; window 792 wide */
.zmit .zmit-trust-band { padding: 15px 0 40px; }
.zmit .zmit-trust { width: min(792px, 100%); max-width: 792px; margin: 0; }
.zmit .zmit-trust-track { gap: 50px; }
.zmit .zmit-trust-chip { width: 148px; height: 70px; padding: 0; }
.zmit .zmit-trust-chip img { height: auto; width: auto; max-height: 62px; max-width: 148px; object-fit: contain; }

/* HubSpot fields: live's filled single boxes. INNER inputs only - never the
   .hsfc-DropdownInput / .hsfc-PhoneInput wrappers (that draws a box in a box). */
.zmit :is(.zmit-form-card, .zmit-contact-form) .zmit-hsform .hsfc-Row { margin: 0 0 20px !important; }
.zmit :is(.zmit-form-card, .zmit-contact-form) .zmit-hsform label,
.zmit :is(.zmit-form-card, .zmit-contact-form) .zmit-hsform .hsfc-Label,
.zmit :is(.zmit-form-card, .zmit-contact-form) .zmit-hsform label span { font-size: 14px !important; line-height: 20px !important; font-weight: 500 !important; color: #212d3a !important; margin-bottom: 0 !important; }
.zmit :is(.zmit-form-card, .zmit-contact-form) .zmit-hsform .hsfc-FieldLabel { margin: 0 0 10px !important; }
.zmit :is(.zmit-form-card, .zmit-contact-form) .zmit-hsform label span.hsfc-FieldLabel__RequiredIndicator { color: #e51520 !important; }
.zmit :is(.zmit-form-card, .zmit-contact-form) .zmit-hsform input:not([type="hidden"]):not([type="submit"]),
.zmit :is(.zmit-form-card, .zmit-contact-form) .zmit-hsform textarea,
.zmit :is(.zmit-form-card, .zmit-contact-form) .zmit-hsform .hsfc-TextInput,
.zmit :is(.zmit-form-card, .zmit-contact-form) .zmit-hsform .hsfc-TextareaInput {
    border: 0 !important; border-radius: 5px !important; background: #eff0f7 !important;
    font-size: 16px !important; line-height: 24px !important; padding: 8px 20px !important;
    color: #212d3a !important; min-height: 40px;
}
.zmit :is(.zmit-form-card, .zmit-contact-form) .zmit-hsform .hsfc-TextareaInput { min-height: 68px !important; }
.zmit :is(.zmit-form-card, .zmit-contact-form) .zmit-hsform .hsfc-PhoneInput__FlagAndCaret { border: 0 !important; background: #eff0f7 !important; border-radius: 5px 0 0 5px !important; }
.zmit :is(.zmit-form-card, .zmit-contact-form) .zmit-hsform .hsfc-PhoneInput .hsfc-TextInput { border-radius: 0 5px 5px 0 !important; }
.zmit :is(.zmit-form-card, .zmit-contact-form) .zmit-hsform .hsfc-NavigationRow { margin: 0 !important; padding-top: 0; }
.zmit :is(.zmit-form-card, .zmit-contact-form) .zmit-hsform .hsfc-Button { font-size: 16px !important; line-height: 16px !important; font-weight: 700 !important; padding: 13px !important; border-radius: 3px !important; }

/* ============================================================
   SERVICES (a14a9a0) - live 996: heading 34.7/43/400 at +15, cards at +79,
   3-up 438 wide 32 apart, 30px padding, rows 405 / 448 33 apart, 31 below.
   Live's cards are flat #eff0f7 with no radius; the HOUSE grid card (fill,
   hairline, radius) stays (CLAUDE.md services rule). Live links none.
   ============================================================ */
.zmit .zmit-services.z-section { padding: 15px 0 31px; }
.zmit .zmit-services-head { margin-bottom: 21px; }
.zmit .zmit-services-head h2 { font-size: 34.7px; line-height: 43px; font-weight: 400; color: var(--zab-ink); margin: 0; }
.zmit .zmit-services-grid { grid-template-columns: repeat(3, 1fr); gap: 33px 30px; }
.zmit .zmit-services-grid .zmit-svc-card { padding: 30px; }
.zmit .zmit-services-grid .zmit-svc-card h3 { font-size: 18px; line-height: 23.4px; font-weight: 700; color: var(--zab-ink); margin: 0 0 20px; }
.zmit .zmit-services-grid .zmit-svc-card .iam-svc-lead { font-size: 14px; line-height: 23.1px; color: var(--zab-ink); margin: 0 0 22.4px; }
.zmit .zmit-services-grid .zmit-svc-card ul { margin: 0 0 10px; padding: 0; list-style: none; }
.zmit .zmit-services-grid .zmit-svc-card li { font-size: 12px; line-height: 19.8px; color: var(--zab-ink); margin: 0; }

/* ============================================================
   STATS x2 (8f630cb 365 / 9d19ee4 429) - #262338, copy column 443 wide,
   50 gap, three 266-wide counters 45 apart, vertically centred. Band #1 pads
   30, band #2 40. Number 57/57/600 #76aaff over label 14/21 #fcfcfc, 18 apart.
   Number LEFT-aligned with its label (owner deviation from live's centre).
   ============================================================ */
.zmit .zmit-stats { background: var(--zab-dark); }
.zmit .zmit-stats.z-section { padding: 30px 0; margin: 0; }
.zmit .zmit-articles + .zmit-stats.z-section { padding: 40px 0; }   /* band #2 */
.zmit .zmit-stats-copy h2 { font-size: 34px; line-height: 44.2px; font-weight: 400; color: #fcfcfc; margin: 0 0 20px; }
.zmit .zmit-stats-copy p { font-size: 16px; line-height: 26.4px; color: #fcfcfc; margin: 0 0 25.6px; }
.zmit .zmit-stats-copy .z-btn { margin-top: 50px; background: #f2f7ff; color: #0161ff; padding: 13px 35px; border-radius: 8px; font-size: 16px; line-height: 16px; font-weight: 400; }
.zmit .zmit-stats-copy .z-btn:hover { background: #e2ecff; color: #0161ff; }
.zmit .zmit-stat .big { font-size: 57px; line-height: 57px; font-weight: 600; color: #76aaff; text-align: left; margin: 0 0 18px; }
.zmit .zmit-stat p { font-size: 14px; line-height: 21px; color: #fcfcfc; text-align: left; margin: 0; }
@media (min-width: 1081px) {
    .zmit .zmit-stats-layout { grid-template-columns: 443px 1fr; gap: 50px; align-items: center; }
    .zmit .zmit-stats-grid { grid-template-columns: repeat(3, 1fr); gap: 45px; align-items: start; }
    .zmit .zmit-stats-copy { max-width: 443px; }
}

/* ============================================================
   PROCESS (38d3b3b) - live 595 on #f7f7fc: 30 pad, two 665 columns 50 apart.
   Copy h2 34/44.2/400, 20 gap, paragraphs 16/24 with live's 24px spacer.
   Accordion rows #262338 radius 5, summary padding 25 16/26.4 #fcfcfc,
   7px apart; open body 0 20 20, 16/25.6 #d9dbe9. One open at a time.
   ============================================================ */
.zmit .zmit-approach.z-section { background: #f7f7fc; padding: 30px 0; }
.zmit .zmit-approach-layout { grid-template-columns: 1fr 1fr; gap: 50px; }
.zmit .zmit-approach-copy h2 { font-size: 34px; line-height: 44.2px; font-weight: 400; color: var(--zab-ink); margin: 0 0 20px; }
.zmit .zmit-approach-copy p { font-size: 16px; line-height: 24px; color: var(--zab-ink); margin: 0 0 24px; }
.zmit .zmit-approach-copy p:last-child { margin-bottom: 0; }
.zmit .zmit-approach-acc { gap: 7px; }
.zmit .zmit-acc-item { background: var(--zab-dark); border-radius: 5px; }
.zmit .zmit-acc-q { padding: 25px; font-size: 16px; line-height: 26.4px; font-weight: 400; color: #fcfcfc; background: var(--zab-dark); }
.zmit .zmit-acc-q .sign { position: relative; width: 16px; height: 16px; flex: 0 0 16px; font-size: 0; transform: none !important; }
.zmit .zmit-acc-q .sign::before,
.zmit .zmit-acc-q .sign::after { content: ""; position: absolute; background: #0161ff; }
.zmit .zmit-acc-q .sign::before { top: 7px; left: 0; right: 0; height: 2px; }
.zmit .zmit-acc-q .sign::after  { top: 0; left: 7px; width: 2px; height: 16px; }
.zmit .zmit-acc-item.open .zmit-acc-q .sign::after { display: none; }
.zmit .zmit-acc-a { background: var(--zab-dark); }
.zmit .zmit-acc-a-inner { padding: 0 20px 20px; }
.zmit .zmit-acc-a-inner p { font-size: 16px; line-height: 25.6px; color: #d9dbe9; margin: 0 0 25.6px; }

/* ============================================================
   PLATFORM TABS (69c0353) - live 684: 30 pad; h 34.7/45.11/400 #141414,
   lead 16/24 #000; hairline 30 under; rail 284 (tabs 284x56, padding 20,
   radius 5, 10 apart; active #0161ff/#fff); cards 2-up 15 apart, #eff0f7,
   radius 8, padding 15, icon 52, title 18/23.4/400 #141414.
   From css/nearshore-software-development.css (.zab-stack), re-measured here.
   ============================================================ */
.zmit .zab-stack.z-section { background: #fff; padding: 30px 0 28px; }
.zmit .zab-stack h2 { font-size: 34.7px; font-weight: 400; line-height: 45.11px; color: #141414; margin: 0; }
.zmit .zab-stack-lead { font-size: 16px; font-weight: 400; line-height: 24px; color: #000; margin: 0 0 30px; }
.zmit .zab-stack-layout { display: flex; align-items: stretch; border-top: 1px solid #e4e7f1; padding-top: 0; }
.zmit .zab-stack-rail { display: flex; flex-direction: column; gap: 10px; flex: 0 0 305px;
    border-right: 1px solid #e4e7f1; padding: 50px 20px 0 0; }
.zmit .zab-stack-tab { width: 284px; min-height: 56px; padding: 20px; border: 0; border-radius: 5px;
    background: #fff; color: #141414; font-size: 16px; font-weight: 400; line-height: 16px;
    text-align: left; cursor: pointer; font-family: inherit; transition: background .2s, color .2s; }
.zmit .zab-stack-tab:hover { background: #eff0f7; }
.zmit .zab-stack-tab.is-active { background: #0161ff; color: #fff; }
.zmit .zab-stack-panels { flex: 1 1 auto; padding: 50px 0 0 50px; }
.zmit .zab-stack-panel { display: grid; grid-template-columns: repeat(2, 1fr); gap: 15px; align-content: start; }
.zmit .zab-stack-panel[hidden] { display: none; }
.zmit .zab-stack-card { display: flex; align-items: center; gap: 27px; background: #eff0f7; border-radius: 8px; padding: 15px; }
.zmit .zab-stack-card img { width: 52px; height: 52px; object-fit: contain; flex: 0 0 52px; display: block; }
.zmit .zab-stack-card h3 { font-size: 18px; font-weight: 400; line-height: 23.4px; color: #141414; margin: 0; }
.zmit .zab-stack-card h3 a { color: inherit; text-decoration: none; }
.zmit .zab-stack-card h3 a:hover { color: #0161ff; }

/* ============================================================
   RECOGNIZED (f6fae33) - live 387 = 30 + 327 + 30. Box #141414 radius 10,
   padding 40; h2 30/42/300 #fff; copy 16/26.4/300 #f2f7ff 20 below; logos
   70 tall, butted (130/181/241 wide), 20 below; CTA #f2f7ff/#141414
   padding 20 30 radius 8, centred right.
   ============================================================ */
.zmit .zmit-recognized.z-section { padding: 30px 0; margin: 0; }
.zmit .zmit-recognized-band { background: #141414; border-radius: 10px; padding: 40px; display: flex; align-items: center; justify-content: space-between; gap: 40px; }
.zmit .zmit-recognized-copy h2 { font-size: 30px; line-height: 42px; font-weight: 300; color: #fff; margin: 0 0 20px; max-width: 845px; }
.zmit .zmit-recognized-copy p { font-size: 16px; line-height: 26.4px; font-weight: 300; color: #f2f7ff; max-width: 845px; margin: 0 0 20px; }
.zmit .zmit-recognized-logos { gap: 0; }
.zmit .zmit-recognized-logos img { height: 70px; width: auto; }
.zmit .zmit-recognized-cta .z-btn { background: #f2f7ff; color: #141414; border-radius: 8px; padding: 20px 30px; font-size: 16px; line-height: 16px; font-weight: 400; }
.zmit .zmit-recognized-cta .z-btn:hover { background: #b3d0ff; color: #141414; }

/* ============================================================
   WHY (67fe616 235 + 411244f 644) - white. h2 34/44.2/400 at +10, copy
   16/26.4 #000 with 25.6 spacing; grid 4-up 330 boxes 20 apart, padding 20,
   rows 20 apart; icon 50, 15 above the 20/24/700 #141414 title, 12 above the
   16/24 #14142b body; 30 below.
   ============================================================ */
.zmit .zmit-why.z-section { background: #fff; padding: 10px 0 30px; margin: 0; }
.zmit .zmit-why-head { margin: 0 0 30px; }
.zmit .zmit-why-head h2 { font-size: 34px; line-height: 44.2px; font-weight: 400; color: var(--zab-ink); margin: 0 0 20px; }
.zmit .zmit-why-head p { font-size: 16px; line-height: 26.4px; color: #000; margin: 0 0 25.6px; }
.zmit .zmit-why-head p:last-child { margin-bottom: 0; }
.zmit .zmit-why-grid { grid-template-columns: repeat(4, 1fr); gap: 20px; }
.zmit .zmit-why-card { background: transparent; padding: 20px; text-align: left; border: 0; box-shadow: none; }
.zmit .zmit-why-ic { width: 50px; height: 50px; margin: 0 0 15px; }
.zmit .zmit-why-ic svg { width: 50px; height: 50px; }
.zmit .zmit-why-card h3 { font-size: 20px; line-height: 24px; font-weight: 700; color: #141414; margin: 0 0 12px; }
.zmit .zmit-why-card p { font-size: 16px; line-height: 24px; color: var(--zab-ink); margin: 0; }

/* ============================================================
   BOOK A FREE CONSULTATION (92c5dac) - live 910: h2 30/39/400 centred at
   +30, lead 16/26.4 10 below, calendar 40 below, 764 tall, flush bottom.
   ============================================================ */
.zmit .zmit-bookcal.z-section { padding: 30px 0 0; }
.zmit .zmit-bookcal h2 { font-size: 30px; line-height: 39px; font-weight: 400; color: var(--zab-ink); text-align: center; margin: 0 0 10px; }
.zmit .zmit-bookcal p { font-size: 16px; line-height: 26.4px; color: var(--zab-ink); text-align: center; margin: 0 0 40px; }
.zmit .zmit-bookcal-embed { min-height: 764px; margin: 0; }

/* ============================================================
   SUCCESS STORIES (d36ddcb) - h2 34/44.2/300 flush top, cards 20 below:
   3-up 440 wide 30 apart, #eff0f7 radius 5, 576 tall; image 250; body
   20 25; logo 50; title 18/25.2/700; body 14/23.1; 30 below.
   ============================================================ */
.zmit .zmit-stories.z-section { padding: 0 0 30px; }
.zmit .zmit-stories h2 { font-size: 34px; line-height: 44.2px; font-weight: 300; color: var(--zab-ink); margin: 0 0 20px; }
.zmit .zmit-stories-grid { gap: 30px; }
.zmit .zmit-story { background: #eff0f7; border-radius: 5px; overflow: hidden; text-decoration: none; }
.zmit .zmit-story-img { border-radius: 0; }
.zmit .zmit-story-img img { height: 250px; }
.zmit .zmit-story .body { padding: 20px 25px 20px; }
.zmit .zmit-story .body .zmit-story-logos { min-height: 50px; margin: 0 0 20px; display: flex; align-items: center; }
.zmit .zmit-story .body .zmit-story-logo { display: block; height: 50px; width: auto; max-width: 150px; object-fit: contain; object-position: left center; }
.zmit .zmit-story h3 { font-size: 18px; line-height: 25.2px; font-weight: 700; color: var(--zab-ink); margin: 0 0 20px; }
.zmit .zmit-story p { font-size: 14px; line-height: 23.1px; color: var(--zab-ink); }

/* ============================================================
   ARTICLES (3d65cd2) - live 540: h2 29/43.5/300 #141414 at +10, "Explore"
   16px underlined; cards 31 below: 440 wide 30 apart, image 270 (radius 0),
   date 14/23.1/500 #0161ff 10 in, title 24/28.8/600; 86 below.
   ============================================================ */
.zmit .zmit-articles.z-section { padding: 10px 0 86px; }
.zmit .zmit-articles-head { margin-bottom: 31px; }
.zmit .zmit-articles-head h2 { font-size: 29px; line-height: 43.5px; font-weight: 300; color: #141414; }
.zmit .zmit-articles-more { font-size: 16px; font-weight: 500; color: #141414; padding-bottom: 5px; border-bottom: 1px solid #141414; }
.zmit .zmit-article { text-decoration: none; }
.zmit .zmit-article-img { border-radius: 0; }
.zmit .zmit-article-img img { height: 270px; }
.zmit .zmit-article .body { padding: 10px 10px 0; }
.zmit .zmit-article .date { font-size: 14px; line-height: 23.1px; font-weight: 500; color: #0161ff; margin: 0 0 8px; }
.zmit .zmit-article h3 { font-size: 24px; line-height: 28.8px; font-weight: 600; color: #141414; }

/* ============================================================
   WHO WE WORK WITH (2db7135) - live 607 on #f7f7fc, padding 70 0: h2
   34.7/400 centred in a 56 box, lead 15.5/25 728 wide centred, cards
   260x270 15 apart (5 in one row; shrunk to fit the 1340 box), front
   #f1f1f7 radius 10 padding 12 27, icon 75, title 16/19.2/600 #111
   left; back white padding 11, 12/19.8 #111. From css/nearshore-...css.
   ============================================================ */
.zmit .zab-flip.z-section { background: #f7f7fc; padding: 70px 0; }
.zmit .zab-flip h2 { font-size: 34.7px; font-weight: 400; line-height: 56px; color: #1f1f1f; text-align: center; margin: 0; }
.zmit .zab-flip-lead { font-size: 15.5px; line-height: 25px; color: #000; text-align: center; max-width: 728px; margin: 0 auto; padding: 0 0 66px; }
.zmit .zab-flip-wrap { display: flex; flex-wrap: nowrap; gap: 15px; justify-content: center; }
.zmit .zab-flip-card { flex: 0 1 260px; height: 270px; perspective: 1000px; }
.zmit .zab-flip-card:focus-visible { outline: 2px solid #0161ff; outline-offset: 3px; }
.zmit .zab-flip-inner { position: relative; width: 100%; height: 100%; transition: transform .6s; transform-style: preserve-3d; }
.zmit .zab-flip-card:hover .zab-flip-inner,
.zmit .zab-flip-card:focus-within .zab-flip-inner { transform: rotateY(180deg); }
.zmit .zab-flip-front,
.zmit .zab-flip-back { position: absolute; inset: 0; backface-visibility: hidden; -webkit-backface-visibility: hidden;
    border-radius: 10px; display: flex; flex-direction: column; justify-content: center; }
.zmit .zab-flip-front { background: #f1f1f7; padding: 12px 27px; align-items: flex-start; gap: 26px; }
.zmit .zab-flip-front img { width: 75px; height: 75px; object-fit: contain; display: block; }
.zmit .zab-flip-front h3 { font-size: 16px; font-weight: 600; line-height: 19.2px; color: #111; text-align: left; margin: 0; }
.zmit .zab-flip-back { background: #fff; padding: 11px; transform: rotateY(180deg); overflow: auto; }
.zmit .zab-flip-back p { font-size: 12px; line-height: 19.8px; color: #111; text-align: left; margin: 0; }
@media (prefers-reduced-motion: reduce) { .zmit .zab-flip-inner { transition: none; } }

/* ============================================================
   TESTIMONIALS (65e1765) - live 636: h2 34/44.2/300 at +80, card 50 below:
   1380x382 gradient, radius 5, padding 80; role 22/28.6/600, rule, company
   34/47.6/600, quote 18/29.7 (first sentence bold); 38px #e9eaf2 arrows
   straddling the card edges; 80 below.
   ============================================================ */
.zmit .zmit-testi.z-section { padding: 80px 0; }
.zmit .zmit-testi h2 { font-size: 34px; line-height: 44.2px; font-weight: 300; color: var(--zab-ink); margin: 0 0 50px; }
.zmit .zmit-testi-carousel { position: relative; display: block; }
.zmit .zmit-testi-card {
    background: linear-gradient(102.29deg, #ecf1eb 8.75%, #aec8fd 45.11%, #84c3fc 81.46%);
    border-radius: 5px; padding: 80px; min-height: 382px; box-shadow: none; border: 0;
}
.zmit .zmit-testi-role { font-size: 22px; line-height: 28.6px; font-weight: 600; color: var(--zab-ink); margin: 0 0 8px; }
.zmit .zmit-testi-rule { width: 18px; height: 2px; background: var(--zab-ink); margin: 0 0 8px; }
.zmit .zmit-testi-lead { font-size: 34px; line-height: 47.6px; font-weight: 600; color: var(--zab-ink); margin: 0 0 10px; }
.zmit .zmit-testi-quote { font-size: 18px; line-height: 29.7px; color: var(--zab-ink); margin: 0; }
.zmit .zmit-testi-nav { position: absolute; top: 50%; transform: translateY(-50%); z-index: 2; width: 38px; height: 38px;
    background: #e9eaf2; color: #14142b; border: 0; border-radius: 0; font-size: 22px; line-height: 1; }
.zmit .zmit-testi-nav.prev { left: -28px; }
.zmit .zmit-testi-nav.next { right: -28px; }

/* ============================================================
   FAQ (1ad22e1) - live 1198 on #eff0f7: 30 pad, h2 34/44.2/400, 33 to two
   accordions (10 | 10) 30 apart; rows #262338, summary padding 25 16/26.4
   #fcfcfc, 7 apart; open body 16/25.6 #d9dbe9.
   ============================================================ */
.zmit .zmit-faq.z-section { background: #eff0f7; padding: 30px 0; }
.zmit .zmit-faq h2 { font-size: 34px; line-height: 44.2px; font-weight: 400; color: var(--zab-ink); margin: 0 0 33px; }
.zmit .zmit-faq-list { column-count: 2; column-gap: 30px; }
.zmit .zmit-faq-item { background: var(--zab-dark); border-radius: 0; margin: 0 0 7px; }
.zmit .zmit-faq-item:nth-child(10) { break-after: column; }
.zmit .zmit-faq-q { padding: 25px 22px; font-size: 16px; line-height: 26.4px; font-weight: 400; color: #fcfcfc; }
.zmit .zmit-faq-a-inner { padding: 0 22px 20px; }
.zmit .zmit-faq-a-inner p { font-size: 16px; line-height: 25.6px; color: #d9dbe9; margin: 0; }

/* ============================================================
   FINAL CTA (6a5fefe) - live 668: row 150 below the band top, 438 tall,
   gradient radius 5; copy column 690 padding 50, h2 33.05/42.965/600, copy
   17.16/25.2, button #0161ff/#f2f7ff 15 30 radius 5; figure 500x576
   bottom-aligned, overhangs the row top by 138 (not the band); 80 below.
   ============================================================ */
.zmit .zmit-final.z-section { padding: 150px 0 80px; margin: 0; }
.zmit .zmit-final-banner {
    position: relative; display: flex; align-items: stretch; justify-content: space-between;
    background: linear-gradient(102.29deg, #ecf1eb 8.75%, #aec8fd 45.11%, #84c3fc 81.46%);
    border-radius: 5px; padding: 0; min-height: 438px; overflow: visible;
}
.zmit .zmit-final-copy { flex: 0 1 690px; max-width: 690px; padding: 50px; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; }
.zmit .zmit-final-copy h2 { font-size: 33.05px; line-height: 42.965px; font-weight: 600; color: var(--zab-ink); margin: 0 0 22px; }
.zmit .zmit-final-copy p { font-size: 17.16px; line-height: 25.2px; color: var(--zab-ink); max-width: 590px; margin: 0 0 18px; }
.zmit .zmit-final-copy .z-btn { background: #0161ff; color: #f2f7ff; padding: 15px 30px; border-radius: 5px; font-size: 15.38px; line-height: 16px; font-weight: 600; }
.zmit .zmit-final-media { position: relative; flex: 0 0 500px; align-self: flex-end; margin: -138px 0 0; }
.zmit .zmit-final-media img { position: static; display: block; width: 500px; height: 576px; aspect-ratio: 500 / 576; object-fit: fill; }

/* ============================================================
   CONTACT (d349ed9) - live 830 on the blue art: h2 33.89/43/300 #fcfcfc
   centred at +50, copy 16/26.4 #fcfcfc 22 below, card 18 below: 966 wide,
   padding 30, radius 8; "Contact now" 25/32.5/400 #6e7191; 50 below.
   ============================================================ */
.zmit .zmit-contact {
    background: url('https://dahqbtk1vlskk.cloudfront.net/wp-content/uploads/2025/05/18073038/0c4197f8712a54f098181b432285586af102e42d.webp') center/cover no-repeat;
    background-color: #1f4fd6;
}
.zmit .zmit-contact.z-section { padding: 50px 0; }
.zmit .zmit-contact .zmit-contact-head { max-width: 1242px; margin: 0 auto 18px; text-align: center; }
.zmit .zmit-contact-head h2 { font-size: 33.89px; line-height: 43px; font-weight: 300; color: #fcfcfc; margin: 0 0 22px; }
.zmit .zmit-contact-head p { font-size: 16px; line-height: 26.4px; color: #fcfcfc; margin: 0; }
.zmit .zmit-contact-form { max-width: 966px; padding: 30px; border-radius: 8px; box-shadow: none; }
.zmit .zmit-contact-form h3 { font-size: 25px; line-height: 32.5px; font-weight: 400; color: #6e7191; margin: 0 0 20px; }
.zmit .zmit-contact-form .zmit-hsform { min-height: 0; }

/* ============================================================
   BELOW 1081 - stack, keep type legible, no horizontal overflow.
   ============================================================ */
@media (max-width: 1080px) {
    .zmit .zmit-services-grid { grid-template-columns: repeat(2, 1fr); gap: 20px; }
    .zmit .zmit-stats-layout { grid-template-columns: 1fr; gap: 30px; }
    .zmit .zmit-stats-grid { grid-template-columns: repeat(3, 1fr); gap: 20px; }
    .zmit .zmit-stats-copy .z-btn { margin-top: 10px; }
    .zmit .zmit-approach-layout { grid-template-columns: 1fr; gap: 28px; }
    .zmit .zab-stack h2 { font-size: 27px; line-height: 1.3; }
    .zmit .zab-stack-layout { display: block; border-top: 0; }
    .zmit .zab-stack-rail { flex-direction: row; flex-wrap: wrap; border-right: 0; padding: 0 0 20px; }
    .zmit .zab-stack-tab { width: auto; min-height: 0; padding: 12px 16px; background: #eff0f7; }
    .zmit .zab-stack-panels { padding: 0; }
    .zmit .zmit-recognized-band { flex-direction: column; align-items: flex-start; }
    .zmit .zmit-why-grid { grid-template-columns: repeat(2, 1fr); }
    .zmit .zab-flip-wrap { flex-wrap: wrap; }
    .zmit .zab-flip-card { flex: 0 0 260px; }
    .zmit .zmit-testi-card { padding: 40px; }
    .zmit .zmit-testi-lead { font-size: 26px; line-height: 1.35; }
    .zmit .zmit-final.z-section { padding: 40px 0; }
    .zmit .zmit-final-banner { flex-direction: column; min-height: 0; }
    .zmit .zmit-final-copy { flex: none; max-width: none; padding: 30px; }
    .zmit .zmit-final-media { flex: none; align-self: center; margin: 0; width: 100%; max-width: 360px; }
    .zmit .zmit-final-media img { width: 100%; height: auto; }
}
@media (max-width: 767px) {
    .zmit .zmit-services-head h2, .zmit .zmit-stats-copy h2, .zmit .zmit-approach-copy h2,
    .zmit .zmit-why-head h2, .zmit .zmit-stories h2, .zmit .zmit-testi h2, .zmit .zmit-faq h2,
    .zmit .zab-flip h2, .zmit .zab-stack h2 { font-size: 24px; line-height: 1.3; }
    .zmit .zmit-final-copy h2, .zmit .zmit-contact-head h2, .zmit .zmit-recognized-copy h2 { font-size: 22.91px; line-height: 29.78px; }
    .zmit .zmit-services-grid, .zmit .zmit-why-grid, .zmit .zab-stack-panel { grid-template-columns: 1fr; }
    .zmit .zmit-stats-grid { grid-template-columns: 1fr; gap: 24px; }
    .zmit .zmit-stat .big { font-size: 44px; line-height: 44px; }
    .zmit .zmit-recognized-band { padding: 30px 20px; }
    .zmit .zmit-recognized-logos { flex-wrap: wrap; }
    .zmit .zmit-recognized-logos img { height: auto; max-width: 100%; }
    .zmit .zmit-recognized-cta .z-btn { white-space: normal; }
    .zmit .zab-flip.z-section { padding: 40px 0; }
    .zmit .zab-flip-lead { padding-bottom: 30px; }
    .zmit .zab-flip-card { flex: 0 0 100%; }
    .zmit .zmit-testi-card { padding: 30px 24px; min-height: 0; }
    .zmit .zmit-testi-lead { font-size: 22px; }
    .zmit .zmit-testi-quote { font-size: 15px; line-height: 1.6; }
    .zmit .zmit-testi-nav.prev { left: -10px; }
    .zmit .zmit-testi-nav.next { right: -10px; }
    .zmit .zmit-faq-list { column-count: 1; }
    .zmit .zmit-faq-item:nth-child(10) { break-after: auto; }
    .zmit .zmit-articles-grid, .zmit .zmit-stories-grid { grid-template-columns: 1fr; }
    .zmit .zmit-article h3 { font-size: 20px; line-height: 1.3; }
    .zmit .zmit-contact-form { padding: 20px; }
}

/* The shared sheet turns .zmit-why into a head-left / 2x2-right grid; live
   stacks the head above a 4-up grid. */
.zmit .zmit-why .z-container { display: block; }
.zmit .zmit-why .zmit-why-grid { grid-template-columns: repeat(4, 1fr); gap: 20px; }
@media (max-width: 1080px) { .zmit .zmit-why .zmit-why-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 767px)  { .zmit .zmit-why .zmit-why-grid { grid-template-columns: 1fr; } }

/* BOOKCAL: the shared sheet caps the lead at 760 and the embed box narrower;
   live runs both full width. */
.zmit .zmit-bookcal p { max-width: none; }
.zmit .zmit-bookcal-embed { max-width: none; width: 100%; }

/* FAQ: live's question text stops ~70px short of the row edge (the icon cell),
   so the longer questions wrap to two lines (104 rows) - reproduce the reserve.
   Horizontal padding restated (FAQ padding trap, CLAUDE.md 7). */
.zmit .zmit-faq-q { padding: 25px 25px; }
.zmit .zmit-faq-q span:first-child { padding-right: 62px; }
.zmit .zmit-faq-a-inner { padding: 0 25px 20px; }

/* HubSpot: live leaves 50px (hero) / 88px (contact) above the Submit row. */
.zmit .zmit-form-card .zmit-hsform .hsfc-NavigationRow { margin-top: 22px !important; }
.zmit .zmit-contact-form .zmit-hsform .hsfc-NavigationRow { margin-top: 90px !important; }

/* INSIGHTS (051f21c) - live: 80 pad, 287x64 logo, 20 gap + 2px rule to the
   28/28 title, copy 20/28 #fff 770 wide; buttons 280 wide. Owner rule: band
   hugs its content (no dead space) - live pads the copy with empty blocks. */
.zmit-insights-copy p.zmit-insights-title { font-weight: 400; border-left: 2px solid #fff; }
.zmit-insights-copy p:not(.zmit-insights-title) { font-weight: 400; color: #fff; }
.zmit-insights-btns a { background: #fff; color: #000; border: 1px solid #fff; border-radius: 5px; font-size: 16px; font-weight: 500; line-height: 24px; justify-content: center; }
.zmit-insights-btns a:last-child { background: transparent; color: #fff; }
.zmit-insights-btns a:hover { background: #b3d0ff; color: #000; border-color: #b3d0ff; }
@media (min-width: 1081px) {
    .zmit .zmit-insights.z-section { padding: 80px 0; }
    .zmit-insights-grid { grid-template-columns: 770px 280px; justify-content: space-between; gap: 0; align-items: start; }
    .zmit-insights-copy { grid-template-columns: 287px 1fr; column-gap: 20px; row-gap: 20px; align-items: center; }
    .zmit .zmit-insights-logo { height: 64px; width: 287px; object-fit: contain; object-position: left center; }
    .zmit-insights-copy p.zmit-insights-title { font-size: 28px; line-height: 28px; padding-left: 20px; margin-left: 0; max-width: none; }
    .zmit-insights-copy p:not(.zmit-insights-title) { font-size: 20px; line-height: 28px; max-width: 770px; margin: 0; }
    .zmit-insights-btns { gap: 20px; }
    .zmit-insights-btns a { padding: 16px 30px; width: 280px; }
}