/* /it-managed-services-v3 — layered over css/managed-it-service-provider.css
   (reference) and css/managed-it-services-lp.css (shared deltas for the
   managed-it-services LPs). This page is an OLDER build of the template: its
   post CSS (post-30860.css) differs from the reference on most shared ids, so
   every value here was read off live /it-managed-services-v3 (computed styles,
   1440 + 1920 + 375). Scoped under .zab-mlp3 (the page wrapper). */

/* ---------------------------------------------------------------- nav */
/* 81f184b: inline icon-list, 16px w500 #141414, items 30px apart
   (margin-inline 15px); hidden <=1024 with NO burger on live. */
.zab-mlp3 .zab-lpnav-menu { gap: 30px; }
.zab-mlp3 .zab-lpnav-menu a { font-size: 16px; line-height: 26.4px; font-weight: 500; color: #141414; }
@media (max-width: 1024px) {
    .zab-mlp3 .zab-lpnav-menu, .zab-mlp3 .zab-lpnav-burger { display: none !important; }
}

/* ------------------------------------------------------------ coverage */
/* e7af5b3: no top padding, 80px margin below, gap 40. Rows 112px:
   padding 15px 25px, gap 20; number 9139bfe 15px wide, 10px drop, 16px/16
   rgba(20,20,43,.5); title 38px/49.4 w700 #141414 (reference: w600). */
.zab-mlp3 .zab-cov { padding: 0; margin-bottom: 80px; }
.zab-mlp3 .zab-cov > .zab-msp-h { padding-top: 0; }
.zab-mlp3 .zab-cov-row .zab-cov-n,
.zab-mlp3 .zab-cov-row:nth-child(n) .zab-cov-n { flex-basis: 15px; padding-top: 10px; color: rgba(20, 20, 43, .5); }
.zab-mlp3 .zab-cov-row h3 { font-weight: 700; }

/* --------------------------------------------------------- testimonials */
/* d01dec3: quote 498 wide (not 75%), author 280 at +20 */
.zab-mlp3 .zab-testi-q { flex: 0 0 498px; }
.zab-mlp3 .zab-testi-who { flex: 0 1 280px; }

/* ---------------------------------------------------------- comparison */
/* 68fd1a3 columns 174 / 305 / 320 in the 798 column. Head cells white-backed
   80px (e3ad71c / 6078f3b), the After head "After" + Zazz-Logo-black.svg 20px
   tall, -5px lift, 4px gap. After cells d2f84ab...: padding 20px 30px 20px 50px,
   tick (teenyicons_tick-circle-solid.svg, 20x20) absolute at left 20 / 40%,
   text 16px/20.8. */
.zab-mlp3 .zab-cmp-table { grid-template-columns: minmax(0, 174fr) minmax(0, 305fr) minmax(0, 320fr); }
.zab-mlp3 .zab-cmp-head-cell:not(.zab-cmp-c3) { background: #fff; }
.zab-mlp3 .zab-cmp-logo { display: inline-block; height: 20px; width: auto; margin: -5px 0 0 4px; vertical-align: middle; }
.zab-mlp3 .zab-cmp-c3 .zab-cmp-box { position: relative; padding: 20px 30px 20px 50px; align-items: flex-start; }
.zab-mlp3 .zab-cmp-c3 .zab-cmp-box .zab-cmp-tick { position: absolute; left: 20px; top: 40%; transform: translateY(-50%); width: 20px; height: 20px; }
.zab-mlp3 .zab-cmp-c3 .zab-cmp-box h3 { line-height: 20.8px; }
.zab-mlp3 .zab-cmpacc { display: none; }

/* --------------------------------------------------------------- FAQ */
/* v3's FAQ band keeps the reference geometry (885 at 1440 with 6 items) */

/* ---------------------------------------------------------- form rail */
/* 245d625: padding 20px 25px 20px 20px, heading 0161989 18px/23.4 w600 */
.zab-mlp3 .zab-msp-side .zab-msp-formcard { padding: 20px 25px 20px 20px; }
.zab-mlp3 .zab-msp-side .zab-msp-formcard h2 { font-size: 18px; line-height: 23.4px; }

/* ------------------------------------------------- growth CTA band 686eefc */
/* depth-0 band after the body: background image
   091dd213...-1-1.png cover/centre, padding 40px 0 0 (the house gutter keeps
   the sides). Inner 28172d0 is a 64% row of two 50% columns: copy 57df342
   centred vertically (h2 30px/39 w600 #fff; b349601 80% wide white, 14px/14
   w500 #000, padding 16px 30px, radius 0; 3a49a03 transparent with 1px #f2f7ff,
   same metrics; note 14px #fff; gaps 20) and figure da6c9d2 (458x498 png at
   width 100% x 500px cover, margin-top -20% so it overhangs the band top;
   band height = 40 + the 423 row). */
.zab-v3cta {
    padding: 40px 0 0;
    background: url("https://dahqbtk1vlskk.cloudfront.net/wp-content/uploads/2025/05/18072810/091dd213d514fe9befc2913ba644c8e3251de5a8-1-1.png") center / cover no-repeat;
}
.zab-v3cta .z-container { padding-top: 0; padding-bottom: 0; }
.zab-v3cta-inner { display: flex; gap: 20px; width: 64%; }
.zab-v3cta-copy {
    flex: 1 1 0; min-width: 0; align-self: center;
    display: flex; flex-direction: column; align-items: flex-start; gap: 20px;
}
.zmit .zab-v3cta-copy h2 { font-size: 30px; line-height: 39px; font-weight: 600; color: #fff; margin: 0; letter-spacing: normal; }
.zab-v3cta-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 10px; width: 80%;
    background: #fff; color: #000; border: 0; border-radius: 0; text-decoration: none;
    font-size: 14px; font-weight: 500; line-height: 14px; padding: 16px 30px;
}
.zab-v3cta-btn svg { width: 8px; height: 12px; }
.zab-v3cta-btn svg path { stroke: currentColor; }
.zmit a.zab-v3cta-btn { color: #000; }
.zmit a.zab-v3cta-ghost { background: transparent; color: #f2f7ff; border: 1px solid #f2f7ff; }
.zab-v3cta-note { font-size: 14px; line-height: 14px; color: #fff; margin: 0; }
.zab-v3cta-fig { flex: 1 1 0; min-width: 0; }
.zab-v3cta-fig img { display: block; width: 100%; height: 500px; object-fit: cover; margin-top: -20%; }

/* ------------------------------------------------------------ footer */
/* b443571: the three items are plain text, 14px #868686, underlined, 40 apart */
.zab-mlp3 .zab-lpfoot li span { font-size: 14px; line-height: 23.1px; color: #868686; text-decoration: underline; }

/* ------------------------------------------------ pricing popup 31319 */
/* Elementor popup (dark backdrop, white dialog) with the four blurred plans and
   no unlock/form; close is Elementor's own small circled x at top right. */
.zab-mlp3 .zab-pricegate { background: rgba(0, 0, 0, .8); padding: 0; }
.zab-mlp3 .zab-pricegate .zab-pricepop-box {
    max-width: 1368px; margin: 0 auto; min-height: 100vh; background: #fff;
    padding: 110px 30px 80px; border-radius: 0;
}
.zab-mlp3 .zab-pricegate .zab-pricepop-close { position: absolute; top: 20px; right: 20px; color: #141414; }
.zab-mlp3 .zab-pricegate .zab-pricepop-close svg { width: 30px; height: 30px; }
.zab-mlp3 .zab-pricegate .zab-plans { margin-top: 30px; }

/* band heading insets: v3 has none (reference pads seccov 40 / cmp 50 above
   the heading); the FAQ band closes with live's 80px bottom padding because no
   growth band is nested inside it on v3 */
.zab-mlp3 .zab-seccov > .zab-msp-h, .zab-mlp3 .zab-cmp > .zab-msp-h { padding-top: 0; }
.zab-mlp3 .zab-faq { padding-bottom: 80px; }
/* head cells e3ad71c / 6078f3b / 0604e02: 80px with 20px 0 padding */
.zab-mlp3 .zab-cmp-head-cell { padding-top: 20px; padding-bottom: 20px; }

/* ================================================================ 375 pass */
/* read off live /it-managed-services-v3 at 375 (the house 30px mobile gutter
   is kept; live runs 20px). v3 hides the form rail on mobile and, unlike v5/v6,
   has NO second embed - so there is no form below 768 on live either. */
@media (max-width: 767px) {
    /* nav: 67 tall, padding 0 20; no link row, no burger; CTA 35f4f20 shown,
       12px/15.6 w500, padding 10px 14px, radius 5, no icon */
    .zab-mlp3 .zab-lpnav { height: 67px; }
    .zab-mlp3 .zab-lpnav-logo svg { width: 101px; height: 23px; }
    .zab-mlp3 .zab-lpnav-cta { display: inline-flex; margin-left: auto; font-size: 12px; line-height: 15.6px; padding: 10px 14px; animation: none; }
    .zab-mlp3 .zab-lpnav-cta svg { display: none; }

    /* hero: padding 30 0 0, gap 24; headline 28px/36.4 LEFT-aligned; sub
       14.592px/24.08 centred; dd78c31 full width, #0161ff / #fff, padding
       20px 0 15px, radius 0; nothing under it */
    .zab-mlp3 .zab-msp-hero .z-container { padding-top: 30px; padding-bottom: 0; gap: 24px; }
    .zmit.zab-mlp3 .zab-mlp-h1 { font-size: 28px; line-height: 36.4px; text-align: left; align-self: stretch; }
    .zab-mlp3 .zab-msp-hero-sub { font-size: 14.592px; line-height: 24.08px; }
    .zab-mlp3 .zab-msp-hero-cta { width: 100%; }
    .zab-mlp3 .zab-msp-btn-ghost { width: 100%; justify-content: center; background: #0161ff; border-color: #0161ff; color: #fff; padding: 20px 0 15px; border-radius: 0; font-size: 14px; }

    /* marquee 67px strip with 100x67 logos; video margin 20 0 30 */
    .zab-mlp3 .zmit-trust-band { padding: 0; }
    .zab-mlp3 .zmit-trust-track { gap: 5px; }
    .zab-mlp3 .zmit-trust-chip { width: 100px; height: 67px; }
    .zab-mlp3 .zmit-trust-chip img { max-width: 100px; max-height: 67px; }
    .zab-mlp3 .zab-msp-video { margin: 20px 0 30px; }

    /* band headings: coverage 18px/23.4, the rest 20px/26 */
    .zmit.zab-mlp3 .zab-msp-h { font-size: 20px; line-height: 26px; }
    .zmit.zab-mlp3 .zab-cov > .zab-msp-h { font-size: 18px; line-height: 23.4px; }

    /* coverage: margin-bottom 50, gap 20; rows padding 15, gap 26, no top rule
       after the first; number 7px wide 3px drop; title 24px/31.2 w700;
       description 14px/18.2 w300 */
    .zab-mlp3 .zab-cov { padding: 0; margin-bottom: 50px; gap: 20px; }
    .zab-mlp3 .zab-cov-row { padding: 15px; gap: 26px; }
    .zab-mlp3 .zab-cov-row + .zab-cov-row { border-top-width: 0; }
    .zab-mlp3 .zab-cov-row .zab-cov-n,
    .zab-mlp3 .zab-cov-row:nth-child(n) .zab-cov-n { flex-basis: 7px; padding-top: 3px; font-size: 14.592px; line-height: 24.08px; }
    .zab-mlp3 .zab-cov-row h3 { font-size: 24px; line-height: 31.2px; }
    .zab-mlp3 .zab-cov-row p { font-size: 14px; line-height: 18.2px; }

    /* security: padding 50 0, gap 40; grid gap 20; 50px icon, 23px gap,
       titles 16px/20.8 */
    .zab-mlp3 .zab-seccov { padding: 50px 0; gap: 40px; }
    .zab-mlp3 .zab-seccov-grid { gap: 20px; }
    .zab-mlp3 .zab-seccov-item { gap: 23px; }
    .zab-mlp3 .zab-seccov-item h3 { font-size: 16px; line-height: 20.8px; }

    /* certs: padding 50 0 70, gap 40; grid gap 20; cards padding 14, 59px
       logo, copy at +20; title 16px/20.8, description 12px/14.4 */
    .zab-mlp3 .zab-certs { padding: 50px 0 70px; gap: 40px; }
    .zab-mlp3 .zab-certs-grid { gap: 20px; }
    .zab-mlp3 .zab-cert-fig { flex-basis: 59px; width: 59px; margin: 0; }
    .zab-mlp3 .zab-cert-fig img { width: 59px; height: 59px; }
    .zab-mlp3 .zab-cert h3 { font-size: 16px; line-height: 20.8px; }
    .zab-mlp3 .zab-cert p { font-size: 12px; line-height: 14.4px; }

    /* testimonials: padding 50 0 70, gap 40; cards 30 apart; quote 10px down,
       no rule; name 20px/33, role 14px/16.8 italic, 20px foot */
    .zab-mlp3 .zab-testi { padding: 50px 0 70px; gap: 40px; }
    .zab-mlp3 .zab-testi-list { gap: 30px; }
    .zab-mlp3 .zab-testi-card { gap: 10px; padding-top: 10px; }
    .zab-mlp3 .zab-testi-q { flex: 0 0 auto; margin: 0; padding-bottom: 0; border-bottom: 0; }
    .zab-mlp3 .zab-testi-who { padding-bottom: 20px; }
    .zab-mlp3 .zab-testi-who strong { font-size: 20px; line-height: 33px; }
    .zab-mlp3 .zab-testi-who span { font-size: 14px; line-height: 16.8px; }

    /* comparison: padding 50 0, gap 40; the table is hidden and live's
       accordion 3f18121 shows: items 15 apart; summary padding 20, 1px
       rgba(20,20,43,.12), radius 10 (10 10 0 0 when open), 16px/26.4 w600
       #1f2124; body 1px rule (no top), radius 0 0 10 10; "Before" box #f9fcff
       padding 20 with 22px icon, 18px/23.4 w500 #ff3737 label, 12px/19.8 copy;
       "After Zazz" box #14142b, white */
    .zab-mlp3 .zab-cmp { padding: 50px 0; gap: 40px; }
    .zab-mlp3 .zab-cmp-table { display: none; }
    .zab-mlp3 .zab-cmpacc { display: block; }
    .zab-mlp3 .zab-cmpacc-item { margin: 0 0 15px; }
    .zab-mlp3 .zab-cmpacc-item > summary {
        display: flex; align-items: center; justify-content: space-between; gap: 10px;
        padding: 20px; border: 1px solid rgba(20, 20, 43, .12); border-radius: 10px;
        font-size: 16px; line-height: 26.4px; font-weight: 600; color: #1f2124;
        cursor: pointer; list-style: none;
    }
    .zab-mlp3 .zab-cmpacc-item > summary::-webkit-details-marker { display: none; }
    .zab-mlp3 .zab-cmpacc-item[open] > summary { border-radius: 10px 10px 0 0; }
    .zab-mlp3 .zab-cmpacc-item .zab-faq-ico { color: #1f2124; flex-basis: 13px; width: 13px; height: 15px; }
    .zab-mlp3 .zab-cmpacc-item .zab-faq-ico svg { fill: currentColor; width: 13px; height: 15px; }
    .zab-mlp3 .zab-cmpacc-item .zab-faq-open { display: none; }
    .zab-mlp3 .zab-cmpacc-item[open] .zab-faq-open { display: block; }
    .zab-mlp3 .zab-cmpacc-item[open] .zab-faq-shut { display: none; }
    .zab-mlp3 .zab-cmpacc-body { border: 1px solid rgba(20, 20, 43, .12); border-top: 0; border-radius: 0 0 10px 10px; overflow: hidden; }
    .zab-mlp3 .zab-cmpacc-box { display: flex; gap: 15px; padding: 20px; }
    .zab-mlp3 .zab-cmpacc-before { background: #f9fcff; }
    .zab-mlp3 .zab-cmpacc-after { background: #14142b; }
    .zab-mlp3 .zab-cmpacc-ico { flex: 0 0 22px; }
    .zab-mlp3 .zab-cmpacc-ico svg { width: 22px; height: 22px; }
    .zmit.zab-mlp3 .zab-cmpacc-box h3 { font-size: 18px; line-height: 23.4px; font-weight: 500; margin: 0 0 2px; color: #ff3737; }
    .zmit.zab-mlp3 .zab-cmpacc-after h3 { color: #fff; }
    .zab-mlp3 .zab-cmpacc-box p { font-size: 12px; line-height: 19.8px; color: #000; margin: 0; }
    .zab-mlp3 .zab-cmpacc-after p { color: #fff; }

    /* FAQ: padding 50 0, gap 40; summary padding 25, text 14px/21; answer
       14px/22.4, padding 0 20 20 */
    .zab-mlp3 .zab-faq { padding: 50px 0; gap: 40px; }
    .zab-mlp3 .zab-faq-item > summary { padding: 25px; font-size: 14px; line-height: 21px; }
    .zab-mlp3 .zab-faq-a { padding: 0 20px 20px; }
    .zab-mlp3 .zab-faq-a p { font-size: 14px; line-height: 22.4px; margin: 0; }

    /* growth band 686eefc: padding 50 0 0; one full-width column, gap 20;
       h2 26px/33.8; both buttons full width; figure 335x290 with no overhang */
    .zab-v3cta { padding: 50px 0 0; }
    .zab-v3cta-inner { flex-direction: column; width: 100%; gap: 20px; }
    .zab-v3cta-copy { align-self: stretch; }
    .zmit .zab-v3cta-copy h2 { font-size: 26px; line-height: 33.8px; }
    .zab-v3cta-btn { width: 100%; }
    .zab-v3cta-fig img { height: 290px; margin-top: 0; object-fit: contain; object-position: bottom; }

    /* footer: 102 tall, column, centred; items 11px/18.15 with 7px sides */
    .zab-mlp3 .zab-lpfoot .z-container { flex-direction: column; gap: 20px; padding-top: 20px; padding-bottom: 20px; }
    .zab-mlp3 .zab-lpfoot-copy { line-height: 24px; }
    .zab-mlp3 .zab-lpfoot ul { gap: 0; justify-content: center; }
    .zab-mlp3 .zab-lpfoot li { padding: 0 7px; line-height: 18.15px; }
    .zab-mlp3 .zab-lpfoot li span { font-size: 11px; line-height: 18.15px; }
}
@media (max-width: 767px) {
    /* c265999 is elementor-hidden-mobile on v3 too */
    .zab-mlp3 .zab-mlp-deskonly { display: none; }
    /* the desktop 498 / 280 flex bases must not become heights in the stacked card */
    .zab-mlp3 .zab-testi-who { flex: 0 0 auto; }
}

/* Growth band vs live (2026-09-29): the photo overhangs the band top by ~50px, so the band
   must paint above the FAQ band (which is position:relative + isolate); and the sticky form
   rail stops level with the last FAQ row - the FAQ's 80px bottom padding is light space
   below both columns, not rail height. */
.zab-mlp3 .zab-v3cta { position: relative; z-index: 1; }
@media (min-width: 1081px) { .zab-mlp3 .zab-msp-side { margin-bottom: 80px; } }
