.hero-section:after {
    content: "";
    position: absolute;
    width: 100%;
    height: 0px;
    max-height: 14%;
    bottom: -1px;
    left: 0px;
    fill: var(--sppb-bg-color);
    background: var(--sppb-bg-color);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: right bottom;
    clip-path: none;
    z-index: 2;
}

#sp-bottom::after, #sp-footer::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    bottom: 0px;
    left: 0px;
    background: none;
    background-repeat: repeat;
    z-index: 0;
    opacity: .6;
}

#sp-main-body {
    padding: 50px 0;
}
.sp-page-title:after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    background-color: #323F58;
    mix-blend-mode: color;
    z-index: -1;
}
.sp-page-title .sp-page-title-heading {
    font-size: 50px;
    font-weight: 400;
    line-height: 120%;
    letter-spacing: -0.2px;
	text-align: center;
}

.sp-page-title .sp-page-title-heading, .sp-page-title .sp-page-title-sub-heading {
    margin: 0;
    padding: 0;
    color: #fff;
    text-align: center;
}

/* --- Estilo unificado para el logo en sticky (PC y Móvil) --- */
/* Partiendo de un logo original BLANCO */
#sp-header.header-sticky .logo-image,
#sp-header.header-sticky .logo-image-phone {
    /* 1. invert(1) : Convierte el logo blanco original a negro.
       2. El resto  : Convierte ese negro al color azul #173E5B.
    */
    filter: invert(1) invert(20%) sepia(21%) saturate(2975%) hue-rotate(166deg) brightness(93%) contrast(92%);
}

/* --- Tus ajustes de altura existentes --- */
@media (max-width: 576px) {
    #sp-header.header-sticky .logo-image-phone {
        height: 25px;
    }
}

@media (max-width: 992px) {
    #sp-header.header-sticky .logo-image-phone {
        height: 30px;
    }
}

.offcanvas-menu .offcanvas-inner .sp-contact-info, .offcanvas-menu .offcanvas-inner .social-icons {
    font-size: 16px;
}

#sp-bottom::after, #sp-footer::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    bottom: 0px;
    left: 0px;
    background: none;
    background-repeat: repeat;
    z-index: 0;
    opacity: .6;
}
#sp-bottom, #sp-footer {
    position: relative;
    background: #323f58 !important;
}
@media (max-width: 767px) {
    html.error-page .error-message {
        font-size: 20px;
        line-height: 28px;
        margin-bottom: 1.2rem;
        color: #fff !important;
    }
}
html.error-page .error-message {
    font-size: 28px !important;
    font-weight: 400;
    line-height: 52px;
    font-family: "IBM Plex Serif", sans-serif;
    letter-spacing: -0.2px;
    color: #fff !important;
    margin-bottom: 3rem;
}
html.error-page .error-code {
    font-size: 150px !important;
    font-weight: 500;
    line-height: 100%;
    letter-spacing: -0.2px;
    margin: 0 0 1rem;
    line-break: auto;
}