/* ==========================================================================
   it-managed-services-v4 - loaded AFTER it-managed-services-zazz.css and the
   sibling's css/it-managed-services.css (both as-is). Only the bands v4 adds:
   hero (7cf52a9), pain list (05e9f46), pricing (03c31d3), delivery models
   (daaa92d), trusted across industries (d3764ba), plus the tech stack being
   hidden <=767 like live. The hero / pain / pricing rules are the same
   components the pentest landing variants use (css/penetration-testing-services-v3.css),
   duplicated here so each page's sheet versions independently (CLAUDE.md s5).
   Width stays the house .z-container (1340 content) - live runs these bands
   1380 / full-bleed. Owner deviation: hero headline 42px/52px above 767px (live 54px).
   ========================================================================== */

.zmit .zab-lp-btn {
    display: inline-flex; align-items: center; gap: 16px;
    padding: 15px 30px; border-radius: 5px;
    background: #0161ff; color: #f2f7ff;
    font-size: 15.38px; line-height: 16px; font-weight: 600;
    transition: background .2s ease;
}
.zmit .zab-lp-btn:hover { background: #141414; color: #f2f7ff; }
.zmit .zab-lp-btn svg { width: 16px; height: 10px; flex: none; fill: currentColor; }
.zmit .zab-lp-btn--light {
    gap: 20px; padding: 13px 35px; border-radius: 8px;
    background: #f2f7ff; color: #0161ff; font-size: 16px; font-weight: 500;
}
.zmit .zab-lp-btn--light:hover { background: #0161ff; color: #fff; }
.zmit .zab-lp-h2 {
    margin: 0; font-size: 33.05px; line-height: 1.3; font-weight: 600;
    letter-spacing: normal; color: #14142b;
}

/* ---------------- hero (7b01685) ---------------- */
.zmit .zab-lphero {
    position: relative; display: flex; flex-direction: column; justify-content: center;
    min-height: 630px; padding: 0 0 100px;
    background: #0b0616 center / cover no-repeat;
    color: #fff; overflow: hidden;
}
.zmit .zab-lphero .z-container { width: 100%; position: relative; z-index: 1; }
.zmit .zab-lphero-copy {
    width: 48%; display: flex; flex-direction: column; align-items: flex-start; gap: 25px;
}
.zmit .zab-lphero h2 {
    margin: 0; font-size: 42px; line-height: 52px; font-weight: 600; letter-spacing: normal; color: #fff;
}
.zmit .zab-lphero h2 span { font-weight: 400; }
.zmit .zab-lphero-sub { padding: 0 0 10px; font-size: 16px; line-height: 26.4px; color: #fff; }
.zmit .zab-lphero-sub p { margin: 0; }
.zmit .zab-lphero-sub strong { font-weight: 700; }
.zmit .zab-lphero-shape {
    position: absolute; left: 0; right: 0; bottom: -1px; height: 130px; z-index: 0;
    line-height: 0; pointer-events: none;
}
.zmit .zab-lphero-shape svg { display: block; width: 100%; height: 100%; fill: #fff; }

/* ---------------- pain list (a29799b) ---------------- */
.zmit .zab-pain { padding: 80px 0; background: #fff; }
.zmit .zab-pain .z-container { display: flex; flex-direction: column; align-items: center; gap: 30px; }
.zmit .zab-pain .zab-lp-h2 { text-align: center; }
.zmit .zab-pain-lists { display: flex; justify-content: center; gap: 0 60px; padding: 20px 0; width: 100%; }
.zmit .zab-pain-lists ul { flex: 0 1 auto; min-width: 0; margin: 0; padding: 0; list-style: none; }
.zmit .zab-pain-lists li {
    display: flex; align-items: center; padding: 0 0 7.5px;
    font-size: 18px; line-height: 29.7px; font-weight: 500; color: #000;
}
.zmit .zab-pain-lists li + li { margin-top: 7.5px; }
.zmit .zab-pain-lists li:last-child { padding-bottom: 0; }
.zmit .zab-pain-lists li svg { flex: none; width: 22px; height: 22px; margin-right: 5.5px; fill: #046bd2; }
.zmit .zab-pain-lists li span { padding-left: 5px; }
.zmit .zab-pain-answer {
    margin: 0; padding: 0 0 15px; width: 100%; text-align: center;
    font-size: 24px; line-height: 43.2px; font-weight: 400; letter-spacing: normal; color: #14142b;
}

/* ---------------- pricing (91eba2a / 03c31d3) ---------------- */
.zmit .zab-price { padding: 40px 0 0; background: #fff; }
.zmit .zab-price .zab-lp-h2 { text-align: center; margin-bottom: 50px; }
.zmit .zab-price-grid { display: flex; align-items: stretch; }
.zmit .zab-price-col { flex: 1 1 0; min-width: 0; padding: 10px; display: flex; }
.zmit .zab-plan {
    position: relative; flex: 1; display: flex; flex-direction: column;
    background: #fff; border: 1px solid #000; border-radius: 10px; overflow: hidden;
    font-size: 16px; line-height: 26.4px;
}
.zmit .zab-plan-badge {
    position: absolute; top: 16px; left: -70px; width: 200px; z-index: 2;
    padding: 5px 0; transform: rotate(-45deg);
    background: #4300ff; color: #fff; font-size: 10px; line-height: 10px; text-align: center;
}
.zmit .zab-plan-top { display: flex; flex-direction: column; align-items: center; padding: 20px; }
.zmit .zab-plan-ico {
    display: flex; align-items: center; justify-content: center;
    width: 80px; height: 80px; border-radius: 100px; background: #f4f4f4;
    font-size: 20px; line-height: 20px; color: #000;
}
.zmit .zab-plan-ico svg { width: 20px; height: 20px; fill: #000; }
.zmit .zab-plan-title { margin-top: 5px; font-size: 18px; line-height: 29.7px; color: #000; text-align: center; }
.zmit .zab-plan-sub { margin-top: 5px; color: #878787; }
.zmit .zab-plan-head { padding: 20px; background: #000; text-align: center; }
.zmit .zab-plan-price { margin-top: 5px; font-size: 35px; line-height: 57.75px; color: #fff; }
.zmit .zab-plan-price small { display: inline-block; font-size: 15px; line-height: 24.75px; }
.zmit .zab-plan-main { flex: 1; padding: 20px; min-height: 100px; }
.zmit .zab-plan-list { margin: 20px 0 0; padding: 0; list-style: none; color: #8a8a8a; }
.zmit .zab-plan-list li { display: flex; align-items: center; padding: 10px; }
.zmit .zab-plan-list li svg { flex: none; width: 13px; height: 15px; margin-right: 10px; fill: #000; }
.zmit .zab-plan-foot { padding: 20px; background: #efefef; text-align: center; }
.zmit .zab-plan-btn {
    display: inline-block; padding: 10px 20px; border-radius: 100px;
    background: #000; color: #fff; font-size: 16px; line-height: 26.4px;
}
.zmit .zab-plan-btn:hover { color: #fff; opacity: .85; }
.zmit .zab-plan-note { margin-top: 10px; color: #9a9a9a; }

/* ---------------- hero: v4 geometry (post-40371 7cf52a9 / f1cfea9) ---------------- */
.zmit .zab-lphero--v4 .zab-lphero-copy { width: 45.853%; }

/* ---------------- delivery models (daaa92d) ---------------- */
.zmit .zab-models { padding: 72px 0 0; min-height: 500px; background: #fff; }
.zmit .zab-models-eyebrow { margin: 0 0 10px; font-size: 16.31px; line-height: 25.2px; font-weight: 700; letter-spacing: normal; color: #14142b; }
.zmit .zab-models-heading { margin: 0 0 52px; font-size: 34.7px; line-height: 43px; font-weight: 400; color: #14142b; }
.zmit .zab-models-panel { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0 10px; border-radius: 15px; background: #262338; overflow: hidden; }
.zmit .zab-models-cell { display: flex; flex-direction: column; gap: 20px; padding: 32px 25px; border-right: 1px solid #fff; }
.zmit .zab-models-cell:last-child { border-right: 0; }
.zmit .zab-models-cell h3 { margin: 0; font-size: 18px; line-height: 28px; font-weight: 600; letter-spacing: normal; color: #f7f7fc; }
.zmit .zab-models-cell p { margin: 0; padding: 12px 0 0; max-width: 206px; font-size: 14px; line-height: 24px; color: #f7f7fc; }

/* ---------------- trusted across industries (d3764ba) ---------------- */
.zmit .zab-inds { padding: 100px 0 0; margin: 0 0 80px; background: #fff; }
.zmit .zab-inds-inner { max-width: 1042px; margin: 0 auto; display: flex; flex-direction: column; gap: 40px; }
.zmit .zab-inds h2 { margin: 0; font-size: 34px; line-height: 34px; font-weight: 400; letter-spacing: normal; color: #141414; }
.zmit .zab-inds-list { display: grid; gap: 10px; }
.zmit .zab-inds-row { display: flex; align-items: flex-start; gap: 18px; padding: 0 0 10px; border-bottom: 1px solid rgba(51, 65, 85, .55); }
.zmit .zab-inds-row:last-child { border-bottom: 0; }
.zmit .zab-inds-ico { flex: none; width: 24px; height: 24px; line-height: 0; }
.zmit .zab-inds-ico svg { width: 24px; height: 24px; }
.zmit .zab-inds-row h3 { margin: 0 0 6px; font-size: 22px; line-height: 28.6px; font-weight: 600; letter-spacing: normal; color: #141414; }
.zmit .zab-inds-row p { margin: 0; font-size: 18px; line-height: 29.7px; color: #141414; }
.zmit .zab-inds-quote { padding: 20px; border-radius: 8px; background: #f7f7fc; }
.zmit .zab-inds-quote blockquote { position: relative; margin: 0; padding: 0 20px 0 40px; color: #3f444b; }
.zmit .zab-inds-quote blockquote::before {
    content: "\201C"; position: absolute; left: 0; top: -12px;
    font-size: 60px; line-height: 1; font-family: Georgia, serif; color: #cfd6e4;
}
.zmit .zab-inds-quote p { margin: 0; font-size: 18px; line-height: 18px; font-weight: 600; font-style: italic; color: #2251ff; }
.zmit .zab-inds-quote cite { display: block; margin-top: 15px; font-size: 14px; line-height: 1px; font-style: normal; color: rgba(32, 32, 32, .698); }

/* ==================== tablet ==================== */
@media (max-width: 1024px) {
    .zmit .zab-lphero { min-height: 520px; padding: 50px 0; }
    .zmit .zab-lphero-copy, .zmit .zab-lphero--v4 .zab-lphero-copy { width: 100%; }
    .zmit .zab-lphero-shape { height: 43px; }
    .zmit .zab-price-grid { flex-wrap: wrap; }
    .zmit .zab-price-col { flex: 0 0 50%; }
    .zmit .zab-models-panel { grid-template-columns: 1fr; }
    .zmit .zab-models-cell { border-right: 0; border-bottom: 1px solid #fff; }
    .zmit .zab-models-cell:last-child { border-bottom: 0; }
}
@media (min-width: 1025px) and (max-width: 1366px) { .zmit .zab-lphero-shape { height: 80px; } }
@media (min-width: 1025px) and (max-width: 1200px) { .zmit .zab-lphero-shape { height: 71px; } }

/* ==================== mobile (live <=767) ==================== */
@media (max-width: 767px) {
    .zmit .zab-hide-mobile { display: none; }
    .zmit .zab-lp-h2 { font-size: 26px; line-height: 33.8px; }
    .zmit .zab-lp-btn { font-size: 13px; }
    .zmit .zab-lp-btn--light { width: 100%; justify-content: center; padding: 12px 24px; font-size: 12px; line-height: 12px; }

    .zmit .zab-lphero { min-height: 540px; padding: 20px 0 60px; }
    .zmit .zab-lphero-shape { height: 44px; }
    .zmit .zab-lphero h2 { font-size: 34px; line-height: 1.2; text-align: center; }
    .zmit .zab-lphero-sub { font-size: 14px; line-height: 23.1px; text-align: center; }
    .zmit .zab-lphero--v4 .zab-lp-btn { width: 100%; justify-content: center; line-height: 16px; }

    .zmit .zab-pain { padding: 60px 0 70px; }
    .zmit .zab-pain-lists { flex-direction: column; gap: 25px 0; padding: 10px 0; }
    .zmit .zab-pain-lists ul { max-width: none; }
    .zmit .zab-pain-lists li { align-items: flex-start; padding-bottom: 9px; font-size: 15px; line-height: 22.5px; }
    .zmit .zab-pain-lists li + li { margin-top: 9px; }
    .zmit .zab-pain-answer { font-size: 20px; line-height: 34px; }

    .zmit .zab-price-col { flex: 0 0 100%; padding: 10px 0; }

    .zmit .zab-models { padding: 30px 0; min-height: 0; }
    .zmit .zab-models-eyebrow, .zmit .zab-models-heading { text-align: center; }
    .zmit .zab-models-cell { text-align: center; }
    .zmit .zab-models-cell p { max-width: none; }

    .zmit .zab-inds { padding: 20px 0; margin: 0 0 50px; }
    .zmit .zab-inds h2 { padding: 20px; font-size: 22px; line-height: 26.4px; text-align: center; }
    .zmit .zab-inds-row { padding: 10px 0; }
    .zmit .zab-inds-row h3 { font-size: 18px; line-height: 23.4px; }
    .zmit .zab-inds-row p { font-size: 14px; line-height: 23.1px; }
    .zmit .zab-inds-quote p { font-size: 16px; line-height: 20.8px; }
    .zmit .zab-inds-quote cite { margin-top: 22px; font-size: 12px; }
}
@media (max-width: 544px) {
    .zmit .zab-lphero h2 { font-size: 31px; }
}

/* Consultant (final) band on PHONES = the reference layout (managed-it-services-portland,
   vanta-support-services, tier-2-it-support at 390; owner 2026-10-22): 30px / 20px inside the
   card, copy 14/25.2, a 13px full-width button, then the photo across the FULL card width at
   its OWN proportions (never cropped - owner 2026-10-22), 8px under the button and flush with the card's
   bottom edge. Phones only - tablet and desktop unchanged. */
@media (max-width: 680.98px) {
    body .zmit section.zmit-final .zmit-final-banner { min-height: 0; padding: 30px 20px 0; row-gap: 0; }
    body .zmit section.zmit-final .zmit-final-copy { max-width: 100%; margin-bottom: 0; padding-bottom: 0; }
    body .zmit section.zmit-final .zmit-final-copy p { font-size: 14px; line-height: 25.2px; max-width: none; }
    body .zmit section.zmit-final .zmit-final-copy a.zab-btn { font-size: 13px; width: 100%; justify-content: center; }
    body .zmit section.zmit-final .zmit-final-media { margin: 0; padding: 0; }
    body .zmit section.zmit-final .zmit-final-media img { position: static; display: block; width: calc(100% + 40px); max-width: none; height: auto; max-height: none; aspect-ratio: 528 / 582; object-fit: contain; object-position: center bottom; margin: 8px -20px 0; }
}
