/* ============================================================
   KNPZ SUPPLEMENTAL STYLES
   Elementor Canvas overrides, section wrappers, shared utils
   ============================================================ */

/* Elementor canvas — ensure full width sections */
.elementor-location-archive .elementor-section-wrap,
.elementor-template-canvas .elementor,
.e-con-inner { max-width: 100% !important; }

/* Remove default Elementor padding on outermost containers */
.elementor-element .elementor-widget-wrap { padding: 0; }

/* Ensure html widget fills parent */
.elementor-widget-html { width: 100%; }

/* ── HOMEPAGE: products section max-width centering ── */
#products-section .elementor-widget-html,
#industries-section .elementor-widget-html,
#process-section .elementor-widget-html,
#certs-section .elementor-widget-html,
#cta-section .elementor-widget-html,
#footer-section .elementor-widget-html { width: 100%; }

/* ── STAT bar alignment fix ── */
#stats-inner {
    align-items: stretch !important;
    justify-content: center !important;
}
#stat-1 {
    border-right: 1px solid rgba(255,255,255,0.12);
    text-align: center;
    align-items: center;
}

/* ── WHY CARDS: border-left accent via CSS since per-element styles may not render ── */
#why-c1, #why-c2, #why-c3,
#why-c4, #why-c5, #why-c6 {
    background: #ffffff;
    border: 1px solid #E2EAF4;
    border-left: 4px solid #4988C4;
    border-radius: 12px;
    padding: 32px 32px 32px 36px;
    transition: box-shadow .2s, transform .2s;
    min-width: 260px;
}
#why-c1:hover, #why-c2:hover, #why-c3:hover,
#why-c4:hover, #why-c5:hover, #why-c6:hover {
    box-shadow: 0 8px 32px rgba(15,40,84,.1);
    transform: translateY(-3px);
}

/* Why card headings */
#why-c1 h3, #why-c2 h3, #why-c3 h3,
#why-c4 h3, #why-c5 h3, #why-c6 h3,
#why-c1 .e-heading, #why-c2 .e-heading, #why-c3 .e-heading,
#why-c4 .e-heading, #why-c5 .e-heading, #why-c6 .e-heading {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    color: #0F2854 !important;
    margin: 0 0 8px !important;
    line-height: 1.3 !important;
}

/* Why card paragraphs */
#why-c1 p, #why-c2 p, #why-c3 p,
#why-c4 p, #why-c5 p, #why-c6 p,
#why-c1 .e-paragraph, #why-c2 .e-paragraph, #why-c3 .e-paragraph,
#why-c4 .e-paragraph, #why-c5 .e-paragraph, #why-c6 .e-paragraph {
    font-family: 'Inter', sans-serif !important;
    font-size: 14px !important;
    color: #6B7280 !important;
    line-height: 1.65 !important;
    margin: 0 !important;
}

/* ── ABOUT left column headings ── */
#about-kicker .e-heading {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    color: #4988C4 !important;
    letter-spacing: 2.5px !important;
    text-transform: uppercase !important;
}
#about-h2 .e-heading {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 38px !important;
    font-weight: 700 !important;
    color: #0F2854 !important;
    line-height: 1.25 !important;
}
#about-para .e-paragraph {
    font-family: 'Inter', sans-serif !important;
    font-size: 16px !important;
    color: #4A5568 !important;
    line-height: 1.75 !important;
}

/* ── Products section kicker ── */
#products-kicker .e-heading {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    color: #4988C4 !important;
    letter-spacing: 2.5px !important;
    text-transform: uppercase !important;
}
#products-h2 .e-heading {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 40px !important;
    font-weight: 700 !important;
    color: #0F2854 !important;
    line-height: 1.2 !important;
}
#products-sub .e-paragraph {
    font-family: 'Inter', sans-serif !important;
    font-size: 17px !important;
    color: #6B7280 !important;
    line-height: 1.7 !important;
    max-width: 600px;
}

/* ── Why header headings ── */
#why-kicker .e-heading {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    color: #4988C4 !important;
    letter-spacing: 2.5px !important;
    text-transform: uppercase !important;
    text-align: center !important;
}
#why-h2 .e-heading {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 38px !important;
    font-weight: 700 !important;
    color: #0F2854 !important;
    line-height: 1.25 !important;
    text-align: center !important;
}

/* ── Hero title & subtitle ── */
#hero-title .e-heading {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 58px !important;
    font-weight: 800 !important;
    color: #ffffff !important;
    line-height: 1.15 !important;
    letter-spacing: -1px !important;
    text-align: center !important;
}
#hero-sub .e-paragraph {
    font-family: 'Inter', sans-serif !important;
    font-size: 19px !important;
    color: #BDE8F5 !important;
    line-height: 1.7 !important;
    text-align: center !important;
}

/* ── Hero buttons ── */
#hero-btn-primary .e-button {
    background: #4988C4 !important;
    color: #ffffff !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    padding: 18px 40px !important;
    border-radius: 6px !important;
}
#hero-btn-secondary .e-button {
    background: transparent !important;
    color: #ffffff !important;
    border: 2px solid rgba(189,232,245,.7) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    padding: 16px 40px !important;
    border-radius: 6px !important;
}

/* ── Stats section headings ── */
#stat-1-num .e-heading {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 56px !important;
    font-weight: 800 !important;
    color: #4988C4 !important;
    line-height: 1 !important;
    text-align: center !important;
}
#stat-1-label .e-paragraph {
    font-family: 'Inter', sans-serif !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #BDE8F5 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    text-align: center !important;
}

/* ── About CTA button ── */
#about-cta .e-button {
    background: #0F2854 !important;
    color: #ffffff !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    padding: 16px 32px !important;
    border-radius: 6px !important;
    align-self: flex-start;
}

/* ── Responsive ── */
@media (max-width: 768px) {
    #hero-title .e-heading { font-size: 34px !important; }
    #hero-sub .e-paragraph { font-size: 16px !important; }
    #about-h2 .e-heading { font-size: 28px !important; }
    #products-h2 .e-heading { font-size: 28px !important; }
    #why-h2 .e-heading { font-size: 26px !important; }
    #why-c1, #why-c2, #why-c3,
    #why-c4, #why-c5, #why-c6 {
        min-width: 100% !important;
        flex: 1 1 100% !important;
    }
}
/* ============================================================
   CTA BANNER — section wrapper reset
   Ensures the banner fills edge-to-edge on ALL pages
   ============================================================ */

/* Zero out padding on any Elementor section wrapping the CTA banner */
.elementor-element:has(> .elementor-widget-wrap > .elementor-element > #knpz-cta-banner),
.e-con:has(#knpz-cta-banner),
[id$="-cta"] {
    padding: 0 !important;
    background: transparent !important;
}

/* Ensure the banner itself is always full-width with correct colours */
#knpz-cta-banner {
    background: linear-gradient(135deg, #0F2854 0%, #1C4D8D 55%, #4988C4 100%) !important;
    padding: 80px 32px !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* Force text visibility inside the banner */
.kcta-h2 {
    color: #ffffff !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 36px !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    margin: 0 0 14px !important;
}
.kcta-sub {
    color: #BDE8F5 !important;
    font-family: 'Inter', sans-serif !important;
    font-size: 17px !important;
    line-height: 1.7 !important;
    margin: 0 0 36px !important;
}
.kcta-btns {
    display: flex !important;
    gap: 14px !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
}
.kcta-btn-primary {
    display: inline-block !important;
    background: #4988C4 !important;
    color: #ffffff !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    padding: 16px 40px !important;
    border-radius: 6px !important;
    text-decoration: none !important;
    transition: background .2s !important;
    cursor: pointer !important;
}
.kcta-btn-primary:hover {
    background: #ffffff !important;
    color: #0F2854 !important;
}
.kcta-btn-outline {
    display: inline-block !important;
    background: transparent !important;
    color: #ffffff !important;
    border: 2px solid rgba(189,232,245,.75) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    padding: 14px 40px !important;
    border-radius: 6px !important;
    text-decoration: none !important;
    transition: background .2s !important;
    cursor: pointer !important;
}
.kcta-btn-outline:hover {
    background: rgba(255,255,255,.15) !important;
}

/* Responsive */
@media (max-width: 600px) {
    #knpz-cta-banner { padding: 56px 20px !important; }
    .kcta-h2 { font-size: 26px !important; }
    .kcta-btn-primary, .kcta-btn-outline { padding: 14px 28px !important; width: 100%; text-align: center; }
}
