/* Ajustes visuales finales: menus, cotizadores y texto sobre imagenes. */

@font-face {
    font-family: 'rtmicon';
    src: url('../font/rtmicon/rtmicon.eot?spwgs3');
    src: url('../font/rtmicon/rtmicon.eot?spwgs3#iefix') format('embedded-opentype'),
        url('../font/rtmicon/rtmicon.ttf?spwgs3') format('truetype'),
        url('../font/rtmicon/rtmicon.woff?spwgs3') format('woff'),
        url('../font/rtmicon/rtmicon.svg?spwgs3#rtmicon') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Font Awesome 6 Free';
    font-style: normal;
    font-weight: 900;
    font-display: swap;
    src: url('../font/fa-solid-900.woff2') format('woff2'),
        url('../font/fa-solid-900.ttf') format('truetype');
}

@font-face {
    font-family: 'Font Awesome 6 Brands';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('../font/fa-brands-400.woff2') format('woff2'),
        url('../font/fa-brands-400.ttf') format('truetype');
}

@font-face {
    font-family: 'Font Awesome 6 Free';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('../font/fa-regular-400.woff2') format('woff2'),
        url('../font/fa-regular-400.ttf') format('truetype');
}

.fa,
.fa-solid,
.fas {
    font-family: 'Font Awesome 6 Free' !important;
    font-weight: 900 !important;
}

.fa-regular,
.far {
    font-family: 'Font Awesome 6 Free' !important;
    font-weight: 400 !important;
}

.fa-brands,
.fab {
    font-family: 'Font Awesome 6 Brands' !important;
    font-weight: 400 !important;
}

.fa-whatsapp::before {
    content: "\f232";
}

.rtmicon {
    font-family: 'rtmicon' !important;
    font-weight: normal !important;
}

#header .nav-link {
    position: relative;
    transition: color .25s ease, transform .25s ease;
}

#header .nav-link:hover,
#header .nav-link:focus-visible {
    transform: translateY(-2px);
}

#header .dropdown-menu {
    animation: komoni-menu-enter .24s ease both;
    transform-origin: top center;
}

#header .servicios-dropdown .dropdown-item {
    gap: 8px;
    transition: background-color .24s ease, color .24s ease, padding-left .24s ease;
}

#header .servicios-dropdown .dropdown-item:hover,
#header .servicios-dropdown .dropdown-item:focus-visible {
    padding-left: 20px;
}

#header .servicios-dropdown .dropdown-item i {
    width: 20px;
    text-align: center;
    transition: transform .25s ease, color .25s ease;
}

#header .servicios-dropdown .dropdown-item:hover i,
#header .servicios-dropdown .dropdown-item:focus-visible i {
    transform: translateY(-1px) scale(1.08);
}

@keyframes komoni-menu-enter {
    from { opacity: 0; transform: translateY(8px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

.banner-komoni::before,
.banner-nosotros::before,
.index-hero::before,
.position-relative:has(> img):has(> .bg-accent-primary.position-absolute)::before,
.fideicomisos-page .komoni-image-overlay-card::before {
    display: none !important;
    content: none !important;
}

.bg-overlay-2 {
    background: transparent !important;
}

.banner-komoni h1,
.banner-komoni h2,
.banner-nosotros h1,
.banner-nosotros h2,
.banner-komoni nav,
.banner-nosotros nav,
.index-hero .accent-primary,
.index-hero .banner-text-clean,
.fideicomisos-page .komoni-image-overlay-content,
.position-relative:has(> img) > .bg-accent-primary.position-absolute {
    width: fit-content;
    max-width: min(92%, 980px);
    padding: clamp(12px, 1.7vw, 22px) clamp(16px, 2.2vw, 30px) !important;
    border-radius: 22px;
    background: rgba(0, 0, 0, .14) !important;
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
}

.contact-image-text {
    width: fit-content;
    max-width: min(92%, 720px);
    padding: clamp(14px, 2vw, 24px) !important;
    border-radius: 22px;
    background: rgba(0, 0, 0, .14) !important;
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
}

/* CTA final de preguntas frecuentes alineado al extremo derecho. */
.section:has(.accordion) .w-max-content.mt-4 {
    align-self: flex-end !important;
    margin-left: auto !important;
    margin-right: 0 !important;
}

.section:has(.accordion) .w-max-content.mt-4 .btn {
    justify-content: center;
}

/* Los banners muestran solo su titulo, centrado en el ultimo cuarto. */
.banner-komoni nav,
.banner-nosotros nav {
    display: none !important;
}

.banner-komoni .r-container > .d-flex,
.banner-nosotros .r-container > .d-flex {
    justify-content: flex-end !important;
    align-items: center !important;
    height: 100% !important;
    padding-bottom: clamp(38px, 7vh, 76px);
    text-align: center !important;
}

.banner-komoni > .r-container,
.banner-nosotros > .r-container {
    height: 100% !important;
    padding-block: 0 !important;
}

.banner-komoni.section,
.banner-nosotros.section {
    padding-block: 0 !important;
}

.banner-komoni h1,
.banner-komoni h2,
.banner-nosotros h1,
.banner-nosotros h2 {
    margin-inline: auto !important;
    text-align: center !important;
}

.index-hero .banner-text-clean {
    height: auto !important;
}

.index-hero .index-hero-content {
    inset: auto 0 0 0 !important;
    margin-inline: clamp(16px, 4vw, 64px) !important;
}

.index-hero .index-hero-content > .d-flex {
    align-items: flex-end !important;
    padding-bottom: clamp(24px, 4vw, 58px) !important;
}

.index-hero .index-hero-content .col:last-child {
    display: flex;
    justify-content: flex-end;
    transform: none !important;
}

@media (min-width: 1200px) {
    .index-hero .index-hero-content > .d-flex > .col {
        flex: 0 0 50%;
        max-width: 50%;
    }
}

.index-hero .banner-text-clean {
    align-items: flex-end !important;
    margin-left: auto;
    text-align: right !important;
}

@media (max-width: 1199px) {
    .index-hero .index-hero-content > .d-flex > .col {
        width: 100%;
        max-width: 100%;
    }

    .index-hero .banner-text-clean {
        align-items: center !important;
        margin-inline: auto;
        text-align: center !important;
    }
}

.fideicomisos-page .komoni-image-overlay-content {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
}

.loan-widget,
#loanWizard {
    --credit-primary: #3072ac !important;
    --credit-dark: #002639 !important;
    --credit-detail: #6d9e88 !important;
    --credit-soft-panel: #174f70 !important;
}

/* El inicio necesita jerarquia propia antes de elegir un perfil. */
#loanWizard .loan-box-quote {
    background: #002639 !important;
    border: 2px solid #6d9e88 !important;
}

#loanWizard {
    background: transparent !important;
    background-image: none !important;
}

#loanWizard .cotizador-intro {
    padding: clamp(20px, 3vw, 34px);
    border-radius: 22px;
    background: #174f70 !important;
    border: 1px solid #6d9e88;
}

#loanWizard .cotizador-steps {
    gap: clamp(12px, 2vw, 26px);
}

#loanWizard .cotizador-step {
    background: #002639 !important;
    border: 2px solid #6d9e88 !important;
    box-shadow: 0 10px 22px rgba(0, 38, 57, .22) !important;
}

#loanWizard .cotizador-step span {
    background: #3072ac !important;
    color: #fff !important;
    border: 2px solid #fff;
}

#loanWizard .cotizador-step p,
#loanWizard .cotizador-step-arrow,
#loanWizard .cotizador-step-arrow i {
    color: #fff !important;
}

#loanWizard .cotizador-step.is-active,
#loanWizard .cotizador-step.is-done {
    background: #3072ac !important;
    border-color: #6d9e88 !important;
}

.loan-widget.loan-theme-particular,
#loanWizard.loan-theme-particular,
#cotizador-garantia,
#cotizador-vivienda,
#cotizador-particular,
#cotizador-credito-garantia,
#cotizador-credito-vivienda {
    --credit-primary: #0a8b52 !important;
    --credit-dark: #076b40 !important;
    --credit-detail: #6d9e88 !important;
    --credit-soft-panel: #087946 !important;
}

.loan-widget .loan-box,
.loan-widget .loan-box-table,
#loanWizard .loan-box,
#loanWizard .loan-box-table {
    background: var(--credit-dark) !important;
    background-image: none !important;
    border: 1px solid var(--credit-detail) !important;
    box-shadow: 0 18px 38px rgba(0, 38, 57, .20), 0 0 0 3px color-mix(in srgb, var(--credit-detail) 20%, transparent) !important;
}

.loan-widget .loan-fields-inner,
.loan-widget .loan-box-contact,
#loanWizard .loan-fields-inner,
#loanWizard .loan-box-contact {
    background: var(--credit-soft-panel) !important;
    background-image: none !important;
    border: 1px solid color-mix(in srgb, var(--credit-detail) 70%, white) !important;
    box-shadow: none !important;
}

.loan-widget .loan-box-results,
.loan-widget .loan-results-inner,
.loan-widget .loan-results-inner.bg-accent-primary,
#loanWizard .loan-box-results,
#loanWizard .loan-results-inner,
#loanWizard .loan-results-inner.bg-accent-primary {
    background: var(--credit-primary) !important;
    background-image: none !important;
    border: 2px solid var(--credit-detail) !important;
    box-shadow: 0 14px 28px rgba(0, 38, 57, .22) !important;
}

.loan-widget *,
#loanWizard * {
    color: #fff !important;
    text-shadow: none !important;
}

.loan-widget .sub-heading::after,
#loanWizard .sub-heading::after {
    background: var(--credit-detail) !important;
    background-image: none !important;
}

.loan-widget .loan-input,
.loan-widget .loan-contact-form input,
#loanWizard .loan-input,
#loanWizard .loan-contact-form input {
    background: rgba(0, 38, 57, .34) !important;
    background-image: none !important;
    border: 1px solid rgba(255, 255, 255, .62) !important;
    color: #fff !important;
}

.loan-widget .loan-term-btn,
.loan-widget .loan-back-btn,
#loanWizard .loan-term-btn,
#loanWizard .loan-back-btn,
#loanWizard #creditOptions .loan-option-card {
    background: transparent !important;
    background-image: none !important;
    border: 2px solid var(--credit-detail) !important;
    color: #fff !important;
}

.loan-widget .loan-term-btn:hover,
.loan-widget .loan-term-btn.active,
.loan-widget .loan-back-btn:hover,
#loanWizard .loan-term-btn:hover,
#loanWizard .loan-term-btn.active,
#loanWizard .loan-back-btn:hover,
#loanWizard #creditOptions .loan-option-card:hover,
#loanWizard #creditOptions .loan-option-card.active {
    background: var(--credit-detail) !important;
    background-image: none !important;
    border-color: #fff !important;
}

.loan-widget .loan-results > div,
#loanWizard .loan-results > div {
    background: rgba(0, 38, 57, .20) !important;
    border-left: 5px solid var(--credit-detail) !important;
}

.loan-widget .loan-table-wrapper th,
#loanWizard .loan-table-wrapper th {
    background: var(--credit-primary) !important;
    background-image: none !important;
    border-bottom: 4px solid var(--credit-detail) !important;
}

.loan-widget .loan-table-wrapper td,
#loanWizard .loan-table-wrapper td {
    background: var(--credit-dark) !important;
    background-image: none !important;
    border-color: rgba(255, 255, 255, .16) !important;
}

.loan-widget .loan-table-wrapper tbody tr:nth-child(even) td,
#loanWizard .loan-table-wrapper tbody tr:nth-child(even) td {
    background: var(--credit-soft-panel) !important;
    background-image: none !important;
}

#profileOptions .loan-option-card[data-profile="empresa"],
#profileOptions .loan-option-card[data-profile="particular"] {
    background-image: none !important;
    border: 2px solid #6d9e88 !important;
    box-shadow: 0 12px 24px rgba(0, 38, 57, .18) !important;
}

#profileOptions .loan-option-card[data-profile="empresa"] {
    background: #3072ac !important;
}

#profileOptions .loan-option-card[data-profile="particular"] {
    background: #0a8b52 !important;
}

/* Cotizador del inicio: contraste especifico por perfil. */
#loanWizard.loan-theme-empresa {
    --credit-primary: #3072ac !important;
    --credit-dark: #002639 !important;
    --credit-detail: #0a8b52 !important;
    --credit-soft-panel: #174f70 !important;
}

#loanWizard.loan-theme-empresa .loan-box,
#loanWizard.loan-theme-empresa .loan-fields-inner,
#loanWizard.loan-theme-empresa .loan-box-results,
#loanWizard.loan-theme-empresa .loan-box-contact,
#loanWizard.loan-theme-empresa .loan-box-table {
    border-color: #0a8b52 !important;
    box-shadow: 0 0 0 2px rgba(109, 158, 136, .42), 0 14px 30px rgba(0, 38, 57, .18) !important;
}

#loanWizard.loan-theme-empresa .cotizador-label h6,
#loanWizard.loan-theme-empresa .sub-heading h6,
#loanWizard.loan-theme-empresa .loan-field label,
#loanWizard.loan-theme-empresa .loan-table-header h3,
#loanWizard.loan-theme-empresa .loan-table-actions,
#loanWizard.loan-theme-empresa .loan-table-actions * {
    color: #fff !important;
}

#loanWizard.loan-theme-empresa .loan-selected-pill,
#loanWizard.loan-theme-empresa .loan-secure-icon {
    background: #0a8b52 !important;
    border: 2px solid #fff !important;
    color: #fff !important;
}

#loanWizard.loan-theme-empresa .loan-selected-pill i,
#loanWizard.loan-theme-empresa .loan-secure-icon i {
    color: #fff !important;
}

#loanWizard.loan-theme-empresa .loan-selected-pill i {
    display: inline-grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border: 2px solid #fff;
    border-radius: 50%;
}

#loanWizard.loan-theme-empresa #creditOptions .loan-option-card {
    border-color: #0a8b52 !important;
    box-shadow: 0 0 0 2px rgba(109, 158, 136, .38) !important;
}

#loanWizard.loan-theme-empresa #creditOptions .loan-option-card i {
    color: #fff !important;
    border: 2px solid #fff;
}

#loanWizard.loan-theme-empresa #creditOptions .loan-option-card:hover,
#loanWizard.loan-theme-empresa #creditOptions .loan-option-card.active {
    background: #3072ac !important;
    border-color: #0a8b52 !important;
}

#loanWizard.loan-theme-empresa #creditOptions .loan-option-card:hover i,
#loanWizard.loan-theme-empresa #creditOptions .loan-option-card.active i {
    color: #002639 !important;
    border-color: #002639 !important;
}

#loanWizard.loan-theme-empresa input[type="range"] {
    accent-color: #002639 !important;
}

#loanWizard.loan-theme-empresa input[type="range"]::-webkit-slider-runnable-track {
    background: #002639 !important;
}

#loanWizard.loan-theme-particular {
    --credit-primary: #0a8b52 !important;
    --credit-dark: #076b40 !important;
    --credit-detail: #3072ac !important;
    --credit-soft-panel: #087946 !important;
}

#loanWizard.loan-theme-particular .loan-box,
#loanWizard.loan-theme-particular .loan-fields-inner,
#loanWizard.loan-theme-particular .loan-box-results,
#loanWizard.loan-theme-particular .loan-box-contact,
#loanWizard.loan-theme-particular .loan-box-table {
    border-color: #002639 !important;
    box-shadow: 0 0 0 2px rgba(48, 114, 172, .58), 0 14px 30px rgba(0, 38, 57, .18) !important;
}

#loanWizard.loan-theme-particular .loan-selected-pill,
#loanWizard.loan-theme-particular .loan-secure-icon {
    background: #3072ac !important;
    border: 2px solid #a6a6a6 !important;
    color: #fff !important;
}

#loanWizard.loan-theme-particular .loan-selected-pill i,
#loanWizard.loan-theme-particular .loan-secure-icon i,
#loanWizard.loan-theme-particular #creditOptions .loan-option-card i {
    color: #fff !important;
}

#loanWizard.loan-theme-particular .loan-selected-pill i {
    display: inline-grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border: 2px solid #a6a6a6;
    border-radius: 50%;
}

#loanWizard.loan-theme-particular #creditOptions .loan-option-card {
    border-color: #002639 !important;
    box-shadow: 0 0 0 2px #a6a6a6 !important;
}

#loanWizard.loan-theme-particular #creditOptions .loan-option-card i {
    border: 2px solid #002639;
}

#loanWizard.loan-theme-particular .loan-table-header h3,
#loanWizard.loan-theme-particular .loan-table-actions,
#loanWizard.loan-theme-particular .loan-table-actions * {
    color: #fff !important;
}

#loanWizard.loan-theme-empresa .loan-box-table > *,
#loanWizard.loan-theme-particular .loan-box-table > *,
#loanWizard.loan-theme-empresa .loan-box-table h3,
#loanWizard.loan-theme-particular .loan-box-table h3,
#loanWizard.loan-theme-empresa .loan-box-table button,
#loanWizard.loan-theme-particular .loan-box-table button {
    color: #fff !important;
}

#loanWizard.loan-theme-particular .sub-heading::after {
    background: #a6a6a6 !important;
}

/* Sin desenfoque en ningun bloque de texto sobre imagen. */
.banner-komoni h1,
.banner-komoni h2,
.banner-nosotros h1,
.banner-nosotros h2,
.index-hero .accent-primary,
.index-hero .banner-text-clean,
.contact-image-text,
.fideicomisos-page .komoni-image-overlay-content,
.position-relative:has(> img) > .bg-accent-primary.position-absolute {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

/* Navegacion fluida y linea activa. */
@view-transition {
    navigation: auto;
}

::view-transition-old(root) {
    animation: komoni-page-out .18s ease both;
}

::view-transition-new(root) {
    animation: komoni-page-in .32s ease both;
}

@keyframes komoni-page-out {
    to { opacity: .35; transform: translateY(-5px); }
}

@keyframes komoni-page-in {
    from { opacity: .35; transform: translateY(7px); }
}

#header .navbar {
    view-transition-name: komoni-header;
}

#header .nav-link::before {
    content: "";
    position: absolute;
    left: 14%;
    right: 14%;
    bottom: 2px;
    height: 3px;
    border-radius: 999px;
    background: #0a8b52;
    transform: scaleX(0);
    transform-origin: center;
    transition: transform .3s ease;
}

#header .nav-link.active::before,
#header .nav-link.is-navigating::before {
    transform: scaleX(1);
}

/* Las tarjetas de asesoria no usan imagen: fondo corporativo verde plano. */
.accent-primary.bg-attach-cover:has(.btn-contact-komoni) {
    background: #0a8b52 !important;
    background-image: none !important;
    border: 1px solid #6d9e88;
    box-shadow: 0 14px 30px rgba(0, 38, 57, .16);
}

.accent-primary.bg-attach-cover:has(.btn-contact-komoni) .bg-overlay-2 {
    display: none !important;
}

/* Beneficios empresariales restantes: cuatro columnas equilibradas. */
.pyme-exclusive-benefits .card-service {
    padding: clamp(22px, 2.5vw, 34px);
}

@media (prefers-reduced-motion: reduce) {
    #header .dropdown-menu { animation: none; }
    #header .nav-link,
    #header .servicios-dropdown .dropdown-item,
    #header .servicios-dropdown .dropdown-item i { transition: none; }
}

/* Legales: descripcion fuera del banner y CTA con contraste invertido. */
.legal-hero h2 {
    margin-bottom: clamp(34px, 6vh, 70px) !important;
}

.legal-hero-summary {
    max-width: 1816px;
    margin: -1px auto 0;
    padding: clamp(18px, 2.5vw, 30px);
    background: #002639;
    border-radius: 0 0 22px 22px;
    text-align: center;
}

.legal-hero-summary p,
.legal-contact-cta p {
    color: #fff !important;
}

.legal-contact-cta .legal-more-info-btn {
    background: #fff !important;
    background-image: none !important;
    border-color: #0a8b52 !important;
    color: #0a8b52 !important;
    box-shadow: 0 12px 26px rgba(0, 38, 57, .18) !important;
}

.legal-contact-cta .legal-more-info-btn span,
.legal-contact-cta .legal-more-info-btn i {
    color: #0a8b52 !important;
}

.legal-contact-cta .legal-more-info-btn:hover {
    background: #0a8b52 !important;
    border-color: #fff !important;
}

.legal-contact-cta .legal-more-info-btn:hover span,
.legal-contact-cta .legal-more-info-btn:hover i {
    color: #fff !important;
}

/* Gama de Informacion clave aplicada a la iconografia general. */
.icon-box:not(.link),
.icon-box-2,
.compliance-mini-icon,
.contact-credit-icon,
.legal-download-icon {
    background: #0a8b52 !important;
    background-image: none !important;
    border: 1px solid rgba(255, 255, 255, .32) !important;
    color: #fff !important;
    box-shadow: 0 12px 24px rgba(10, 139, 82, .22) !important;
}

.col:nth-child(even) > .card-service .icon-box:not(.link),
.contact-credit-card:nth-child(even) .contact-credit-icon,
.compliance-mini-card:nth-child(even) .compliance-mini-icon {
    background: #3072ac !important;
    box-shadow: 0 12px 24px rgba(48, 114, 172, .24) !important;
}

.icon-box:not(.link) i,
.icon-box-2 i,
.compliance-mini-icon i,
.contact-credit-icon i,
.legal-download-icon i {
    color: #fff !important;
}

.icon-box:not(.link):hover,
.icon-box-2:hover,
.compliance-mini-card:hover .compliance-mini-icon,
.contact-credit-card:hover .contact-credit-icon,
.legal-download-card:hover .legal-download-icon {
    background: #002639 !important;
    border-color: #6d9e88 !important;
    box-shadow: 0 16px 30px rgba(0, 38, 57, .24) !important;
}

/* =========================
   Cotizadores: cierre visual
========================= */

/* Regla estandar de contraste, incluidos textos generados y placeholders. */
.loan-widget *,
#loanWizard *,
.loan-widget .loan-secure-note::before,
.loan-widget .loan-secure-note::after,
#loanWizard .loan-secure-note::before,
#loanWizard .loan-secure-note::after {
    color: #ffffff !important;
}

html body .loan-widget.loan-theme-empresa *,
html body .loan-widget.loan-theme-particular *,
html body #cotizador-pyme .loan-widget *,
html body #cotizador-hipotecario .loan-widget *,
html body #cotizador-garantia .loan-widget *,
html body #cotizador-vivienda .loan-widget *,
html body #loanWizard * {
    color: #ffffff !important;
}

.loan-widget input::placeholder,
#loanWizard input::placeholder {
    color: #ffffff !important;
    opacity: .82;
}

/* Particular replica la profundidad del tema azul con la paleta verde. */
.loan-widget.loan-theme-particular,
#loanWizard.loan-theme-particular,
#cotizador-garantia,
#cotizador-vivienda,
#cotizador-particular,
#cotizador-credito-garantia,
#cotizador-credito-vivienda {
    --credit-primary: #6d9e88 !important;
    --credit-dark: #0a8b52 !important;
    --credit-detail: #6d9e88 !important;
    --credit-soft-panel: #087946 !important;
}

.loan-widget.loan-theme-particular .loan-box,
#loanWizard.loan-theme-particular .loan-box {
    background: linear-gradient(145deg, #0a8b52 0%, #076b40 100%) !important;
    border-color: #6d9e88 !important;
}

.loan-widget.loan-theme-particular .loan-fields-inner,
.loan-widget.loan-theme-particular .loan-box-contact,
#loanWizard.loan-theme-particular .loan-fields-inner,
#loanWizard.loan-theme-particular .loan-box-contact {
    background: linear-gradient(145deg, #6d9e88 0%, #0a8b52 100%) !important;
    border-color: rgba(255, 255, 255, .42) !important;
}

.loan-widget.loan-theme-particular .loan-box-results,
.loan-widget.loan-theme-particular .loan-results-inner,
.loan-widget.loan-theme-particular .loan-results-inner.bg-accent-primary,
#loanWizard.loan-theme-particular .loan-box-results,
#loanWizard.loan-theme-particular .loan-results-inner,
#loanWizard.loan-theme-particular .loan-results-inner.bg-accent-primary,
#cotizador-garantia .loan-box-results,
#cotizador-garantia .loan-results-inner,
#cotizador-vivienda .loan-box-results,
#cotizador-vivienda .loan-results-inner {
    background: linear-gradient(145deg, #6d9e88 0%, #0a8b52 78%) !important;
    background-image: linear-gradient(145deg, #6d9e88 0%, #0a8b52 78%) !important;
    border-color: #6d9e88 !important;
}

/* Bordes claros para todas las celdas de las tablas de amortizacion. */
.loan-widget .loan-table-wrapper,
#loanWizard .loan-table-wrapper {
    border-color: #3072ac !important;
}

.loan-widget .loan-table-wrapper th,
#loanWizard .loan-table-wrapper th {
    border: 1px solid #3072ac !important;
    border-bottom: 2px solid #3072ac !important;
}

.loan-widget .loan-table-wrapper td,
#loanWizard .loan-table-wrapper td {
    border: 1px solid #a6a6a6 !important;
}

html body #loanWizard.loan-theme-empresa .loan-table-wrapper th,
html body #loanWizard.loan-theme-particular .loan-table-wrapper th,
html body #cotizador-pyme .loan-table-wrapper th,
html body #cotizador-hipotecario .loan-table-wrapper th,
html body #cotizador-garantia .loan-table-wrapper th,
html body #cotizador-vivienda .loan-table-wrapper th {
    border-color: #3072ac !important;
    border-bottom-color: #3072ac !important;
}

/* Aviso protegido de Empresa/Pyme, tambien al elegir Empresa en index. */
#cotizador-pyme .loan-secure-note,
#cotizador-hipotecario .loan-secure-note,
#loanWizard.loan-theme-empresa .loan-secure-note {
    border: 2px solid #0a8b52 !important;
}

/* Particular: el estado azul pasa a ser normal y el verde queda para hover. */
html body #cotizador-garantia .loan-contact-form .btn,
html body #cotizador-vivienda .loan-contact-form .btn,
html body #loanWizard.loan-theme-particular .loan-contact-form .btn {
    background: linear-gradient(135deg, #3072ac 0%, #002639 100%) !important;
    background-image: linear-gradient(135deg, #3072ac 0%, #002639 100%) !important;
    box-shadow: 0 12px 26px rgba(0, 38, 57, .24) !important;
}

html body #cotizador-garantia .loan-contact-form .btn:hover,
html body #cotizador-vivienda .loan-contact-form .btn:hover,
html body #loanWizard.loan-theme-particular .loan-contact-form .btn:hover {
    background: linear-gradient(135deg, #0a8b52 0%, #076b40 100%) !important;
    background-image: linear-gradient(135deg, #0a8b52 0%, #076b40 100%) !important;
    box-shadow: 0 18px 36px rgba(10, 139, 82, .28) !important;
}

/* Index: iconos limpios, sin contornos decorativos innecesarios. */
#loanWizard .loan-option-card i,
#loanWizard .loan-selected-pill i,
#loanWizard .loan-secure-icon,
#loanWizard .loan-secure-icon i {
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
}

html body #loanWizard.loan-theme-empresa .loan-secure-icon,
html body #loanWizard.loan-theme-particular .loan-secure-icon {
    border: 0 !important;
}

/* =========================
   Rediseño cotizadores 2026
========================= */

/* Particular: verdes afines a Komoni, sin #6d9e88. */
.loan-widget.loan-theme-particular,
#cotizador-garantia,
#cotizador-vivienda,
#cotizador-particular,
#cotizador-credito-garantia,
#cotizador-credito-vivienda {
    --credit-primary: #0a8b52 !important;
    --credit-dark: #065f39 !important;
    --credit-detail: #12a866 !important;
    --credit-soft-panel: #087647 !important;
}

.loan-widget.loan-theme-particular .loan-box {
    background: linear-gradient(145deg, #0a8b52 0%, #065f39 100%) !important;
    border-color: #12a866 !important;
    box-shadow: 0 20px 42px rgba(6, 95, 57, .27), 0 0 0 1px rgba(18, 168, 102, .30) !important;
}

.loan-widget.loan-theme-particular .loan-fields-inner,
.loan-widget.loan-theme-particular .loan-box-contact {
    background: linear-gradient(145deg, #0a8b52 0%, #087647 100%) !important;
    border-color: #12a866 !important;
}

.loan-widget.loan-theme-particular .loan-box-results,
.loan-widget.loan-theme-particular .loan-results-inner,
.loan-widget.loan-theme-particular .loan-results-inner.bg-accent-primary,
#cotizador-garantia .loan-box-results,
#cotizador-garantia .loan-results-inner,
#cotizador-vivienda .loan-box-results,
#cotizador-vivienda .loan-results-inner {
    background: linear-gradient(145deg, #12a866 0%, #0a8b52 42%, #065f39 100%) !important;
    background-image: linear-gradient(145deg, #12a866 0%, #0a8b52 42%, #065f39 100%) !important;
    border-color: #12a866 !important;
}

.loan-widget.loan-theme-particular .loan-secure-note,
#cotizador-garantia .loan-secure-note,
#cotizador-vivienda .loan-secure-note {
    background: rgba(6, 95, 57, .38) !important;
    border: 2px solid #12a866 !important;
}

/* Index: sistema visual limitado a la paleta de marca solicitada. */
#loanWizard {
    --index-green: #0a8b52;
    --index-gray: #a6a6a6;
    --index-blue: #3072ac;
    --index-navy: #002639;
    --wizard-primary: var(--index-blue);
    --wizard-accent: var(--index-green);
    --wizard-panel: var(--index-navy);
    --wizard-soft: rgba(48, 114, 172, .28);
    --wizard-border: rgba(166, 166, 166, .72);
    isolation: isolate;
}

#loanWizard .loan-box-quote {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(circle at 100% 0%, rgba(48, 114, 172, .42), transparent 36%),
        linear-gradient(145deg, #002639 0%, #002639 56%, #0a8b52 145%) !important;
    border: 1px solid rgba(166, 166, 166, .72) !important;
    border-top: 7px solid var(--wizard-accent) !important;
    box-shadow: 0 24px 55px rgba(0, 38, 57, .30) !important;
}

#loanWizard:not(.loan-theme-empresa):not(.loan-theme-particular) .loan-box-quote {
    background-image:
        radial-gradient(circle at 100% 0%, rgba(48, 114, 172, .42), transparent 36%),
        linear-gradient(145deg, #002639 0%, #002639 56%, #0a8b52 145%) !important;
}

#loanWizard .cotizador-intro {
    background: linear-gradient(135deg, rgba(48, 114, 172, .52), rgba(0, 38, 57, .86)) !important;
    border: 1px solid rgba(166, 166, 166, .62) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .10) !important;
}

#loanWizard .cotizador-step {
    background: rgba(0, 38, 57, .76) !important;
    border: 1px solid rgba(166, 166, 166, .58) !important;
    box-shadow: none !important;
}

#loanWizard .cotizador-step span {
    background: var(--wizard-primary) !important;
    border: 0 !important;
    box-shadow: 0 0 0 5px rgba(166, 166, 166, .20) !important;
}

#loanWizard .cotizador-step.is-active,
#loanWizard .cotizador-step.is-done {
    background: linear-gradient(135deg, var(--wizard-primary), var(--index-navy)) !important;
    border-color: var(--wizard-accent) !important;
    box-shadow: 0 12px 25px rgba(0, 38, 57, .22) !important;
}

#loanWizard .loan-option-card {
    position: relative;
    min-height: 170px;
    overflow: hidden;
    border: 1px solid rgba(166, 166, 166, .72) !important;
    border-top: 5px solid var(--card-accent, var(--wizard-accent)) !important;
    border-radius: 24px !important;
    box-shadow: 0 16px 32px rgba(0, 38, 57, .24) !important;
    transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease, background .28s ease !important;
}

#profileOptions .loan-option-card[data-profile="empresa"] {
    --card-accent: #3072ac;
    background: linear-gradient(145deg, #3072ac 0%, #002639 100%) !important;
}

#profileOptions .loan-option-card[data-profile="particular"] {
    --card-accent: #0a8b52;
    background: linear-gradient(145deg, #0a8b52 0%, #002639 125%) !important;
}

#loanWizard #profileOptions .loan-option-card[data-profile="empresa"],
#loanWizard #profileOptions .loan-option-card[data-profile="particular"] {
    border-color: rgba(166, 166, 166, .72) !important;
}

#loanWizard .loan-option-card i {
    display: grid;
    place-items: center;
    width: 72px;
    height: 72px;
    border: 0 !important;
    border-radius: 20px;
    background: rgba(0, 38, 57, .52) !important;
    color: #ffffff !important;
    box-shadow: inset 0 0 0 1px rgba(166, 166, 166, .50), 0 12px 24px rgba(0, 38, 57, .22) !important;
    transition: background .28s ease, transform .28s ease, box-shadow .28s ease !important;
}

#loanWizard .loan-option-card:hover,
#loanWizard .loan-option-card.active {
    transform: translateY(-6px);
    border-color: var(--card-accent, var(--wizard-accent)) !important;
    box-shadow: 0 22px 42px rgba(0, 38, 57, .34) !important;
}

#loanWizard .loan-option-card:hover i,
#loanWizard .loan-option-card.active i {
    background: var(--card-accent, var(--wizard-accent)) !important;
    transform: translateY(-3px) scale(1.04);
    box-shadow: 0 0 0 5px rgba(166, 166, 166, .20), 0 14px 28px rgba(0, 38, 57, .24) !important;
}

#loanWizard.loan-theme-empresa {
    --wizard-primary: #3072ac;
    --wizard-accent: #0a8b52;
    --wizard-panel: #002639;
    --wizard-soft: rgba(48, 114, 172, .34);
}

#loanWizard.loan-theme-particular {
    --wizard-primary: #0a8b52;
    --wizard-accent: #3072ac;
    --wizard-panel: #002639;
    --wizard-soft: rgba(10, 139, 82, .38);
}

#loanWizard.loan-theme-empresa .loan-box-quote {
    background:
        radial-gradient(circle at 100% 0%, rgba(10, 139, 82, .30), transparent 36%),
        linear-gradient(145deg, #3072ac 0%, #002639 76%) !important;
}

#loanWizard.loan-theme-particular .loan-box-quote {
    background:
        radial-gradient(circle at 100% 0%, rgba(48, 114, 172, .32), transparent 36%),
        linear-gradient(145deg, #0a8b52 0%, #002639 88%) !important;
}

#loanWizard.loan-theme-empresa .loan-box,
#loanWizard.loan-theme-particular .loan-box {
    border: 1px solid rgba(166, 166, 166, .72) !important;
}

#loanWizard.loan-theme-empresa .loan-box-quote {
    border-top: 7px solid #0a8b52 !important;
}

#loanWizard.loan-theme-particular .loan-box-quote {
    border-top: 7px solid #3072ac !important;
}

#loanWizard.loan-theme-empresa .loan-fields-inner,
#loanWizard.loan-theme-empresa .loan-box-contact {
    background: linear-gradient(145deg, rgba(48, 114, 172, .72), #002639 92%) !important;
    background-image: linear-gradient(145deg, rgba(48, 114, 172, .72), #002639 92%) !important;
    border-color: rgba(166, 166, 166, .72) !important;
}

#loanWizard.loan-theme-particular .loan-fields-inner,
#loanWizard.loan-theme-particular .loan-box-contact {
    background: linear-gradient(145deg, rgba(10, 139, 82, .82), #002639 98%) !important;
    background-image: linear-gradient(145deg, rgba(10, 139, 82, .82), #002639 98%) !important;
    border-color: rgba(166, 166, 166, .72) !important;
}

#loanWizard.loan-theme-empresa .loan-box-results,
#loanWizard.loan-theme-empresa .loan-results-inner,
#loanWizard.loan-theme-empresa .loan-results-inner.bg-accent-primary {
    background: linear-gradient(145deg, #3072ac, #002639 86%) !important;
    background-image: linear-gradient(145deg, #3072ac, #002639 86%) !important;
    border-color: #0a8b52 !important;
}

#loanWizard.loan-theme-particular .loan-box-results,
#loanWizard.loan-theme-particular .loan-results-inner,
#loanWizard.loan-theme-particular .loan-results-inner.bg-accent-primary {
    background: linear-gradient(145deg, #0a8b52, #002639 88%) !important;
    background-image: linear-gradient(145deg, #0a8b52, #002639 88%) !important;
    border-color: #3072ac !important;
}

#loanWizard.loan-theme-empresa #creditOptions .loan-option-card,
#loanWizard.loan-theme-particular #creditOptions .loan-option-card {
    --card-accent: var(--wizard-accent);
    background: linear-gradient(145deg, var(--wizard-primary), #002639) !important;
    border-color: rgba(166, 166, 166, .72) !important;
    box-shadow: 0 16px 32px rgba(0, 38, 57, .24) !important;
}

#loanWizard.loan-theme-empresa #creditOptions .loan-option-card:hover,
#loanWizard.loan-theme-empresa #creditOptions .loan-option-card.active,
#loanWizard.loan-theme-particular #creditOptions .loan-option-card:hover,
#loanWizard.loan-theme-particular #creditOptions .loan-option-card.active {
    background: linear-gradient(145deg, var(--wizard-primary), var(--wizard-accent)) !important;
    border-color: #a6a6a6 !important;
}

#loanWizard .loan-back-btn {
    background: rgba(0, 38, 57, .62) !important;
    border: 1px solid rgba(166, 166, 166, .72) !important;
    box-shadow: none !important;
}

#loanWizard .loan-back-btn:hover {
    background: var(--wizard-primary) !important;
    border-color: #a6a6a6 !important;
    box-shadow: 0 10px 22px rgba(0, 38, 57, .24) !important;
}

#loanWizard .loan-selected-pill {
    background: var(--wizard-primary) !important;
    border: 1px solid #a6a6a6 !important;
    box-shadow: 0 8px 18px rgba(0, 38, 57, .20) !important;
}

#loanWizard .loan-selected-pill.secondary {
    background: var(--wizard-accent) !important;
}

#loanWizard.loan-theme-empresa .loan-selected-pill,
#loanWizard.loan-theme-particular .loan-selected-pill {
    border: 1px solid #a6a6a6 !important;
}

#loanWizard.loan-theme-empresa .loan-selected-pill i,
#loanWizard.loan-theme-particular .loan-selected-pill i {
    display: inline-grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border: 0 !important;
    border-radius: 10px;
    background: rgba(0, 38, 57, .52) !important;
    box-shadow: inset 0 0 0 1px rgba(166, 166, 166, .42) !important;
}

#loanWizard .loan-fields-inner,
#loanWizard .loan-box-contact {
    background:
        linear-gradient(145deg, var(--wizard-soft), rgba(0, 38, 57, .90)),
        #002639 !important;
    border: 1px solid rgba(166, 166, 166, .72) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 16px 34px rgba(0, 38, 57, .20) !important;
}

#loanWizard .loan-box-results,
#loanWizard .loan-results-inner,
#loanWizard .loan-results-inner.bg-accent-primary {
    background: linear-gradient(145deg, var(--wizard-primary), #002639 86%) !important;
    background-image: linear-gradient(145deg, var(--wizard-primary), #002639 86%) !important;
    border: 1px solid var(--wizard-accent) !important;
    box-shadow: 0 18px 38px rgba(0, 38, 57, .26) !important;
}

#loanWizard .loan-results > div {
    background: rgba(0, 38, 57, .42) !important;
    border: 1px solid rgba(166, 166, 166, .54) !important;
    border-left: 5px solid var(--wizard-accent) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08) !important;
}

#loanWizard .loan-input,
#loanWizard .loan-contact-form input {
    background: rgba(0, 38, 57, .62) !important;
    border: 1px solid rgba(166, 166, 166, .82) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06) !important;
}

#loanWizard .loan-input:focus,
#loanWizard .loan-contact-form input:focus {
    border-color: var(--wizard-accent) !important;
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--wizard-accent) 30%, transparent) !important;
}

#loanWizard .loan-term-btn {
    background: rgba(0, 38, 57, .64) !important;
    border: 1px solid rgba(166, 166, 166, .72) !important;
}

#loanWizard .loan-term-btn:hover,
#loanWizard .loan-term-btn.active {
    background: var(--wizard-primary) !important;
    border-color: var(--wizard-accent) !important;
    box-shadow: 0 10px 22px rgba(0, 38, 57, .24) !important;
}

#loanWizard .loan-box-table {
    background: linear-gradient(145deg, #002639, color-mix(in srgb, var(--wizard-primary) 38%, #002639)) !important;
    border: 1px solid rgba(166, 166, 166, .72) !important;
    box-shadow: 0 18px 38px rgba(0, 38, 57, .24) !important;
}

#loanWizard .loan-table-wrapper {
    border: 1px solid #3072ac !important;
}

#loanWizard .loan-table-wrapper th {
    background: #3072ac !important;
    border-color: #3072ac !important;
}

#loanWizard .loan-table-wrapper td,
#loanWizard .loan-table-wrapper tbody tr:nth-child(even) td {
    background: #002639 !important;
    border-color: #a6a6a6 !important;
}

#loanWizard .loan-expand-btn {
    background: var(--wizard-primary) !important;
    border: 1px solid #a6a6a6 !important;
    box-shadow: 0 10px 22px rgba(0, 38, 57, .22) !important;
}

#loanWizard .loan-expand-btn:hover {
    background: var(--wizard-accent) !important;
    border-color: #a6a6a6 !important;
}

#loanWizard .loan-secure-note {
    background: rgba(0, 38, 57, .48) !important;
    border: 2px solid var(--wizard-accent) !important;
    box-shadow: none !important;
}

#loanWizard.loan-theme-empresa .loan-secure-note {
    background: rgba(0, 38, 57, .48) !important;
    border: 2px solid #0a8b52 !important;
}

#loanWizard.loan-theme-particular .loan-secure-note {
    background: rgba(0, 38, 57, .48) !important;
    border: 2px solid #3072ac !important;
}

#loanWizard .loan-secure-icon {
    background: var(--wizard-accent) !important;
    border: 0 !important;
    box-shadow: 0 0 0 5px rgba(166, 166, 166, .16) !important;
}

#loanWizard.loan-theme-empresa .loan-secure-icon,
#loanWizard.loan-theme-particular .loan-secure-icon,
#loanWizard.loan-theme-empresa #creditOptions .loan-option-card i,
#loanWizard.loan-theme-particular #creditOptions .loan-option-card i {
    border: 0 !important;
}

#loanWizard .loan-contact-form .btn {
    background: linear-gradient(135deg, var(--wizard-primary), #002639) !important;
    background-image: linear-gradient(135deg, var(--wizard-primary), #002639) !important;
    border: 1px solid #a6a6a6 !important;
}

#loanWizard .loan-contact-form .btn:hover {
    background: linear-gradient(135deg, var(--wizard-accent), var(--wizard-primary)) !important;
    background-image: linear-gradient(135deg, var(--wizard-accent), var(--wizard-primary)) !important;
}

#loanWizard *,
#loanWizard *::before,
#loanWizard *::after {
    color: #ffffff !important;
}

html body #loanWizard.loan-theme-empresa *,
html body #loanWizard.loan-theme-empresa *::before,
html body #loanWizard.loan-theme-empresa *::after,
html body #loanWizard.loan-theme-particular *,
html body #loanWizard.loan-theme-particular *::before,
html body #loanWizard.loan-theme-particular *::after {
    color: #ffffff !important;
}

html body #loanWizard .cotizador-label h6,
html body #loanWizard .cotizador-intro h3,
html body #loanWizard .cotizador-intro p,
html body #loanWizard .cotizador-step p,
html body #loanWizard .cotizador-step-arrow i,
html body #loanWizard .loan-option-card,
html body #loanWizard .loan-option-card span,
html body #loanWizard .loan-option-card i,
html body #loanWizard .loan-back-btn,
html body #loanWizard .loan-back-btn span,
html body #loanWizard .loan-back-btn i,
html body #loanWizard .loan-selected-pill,
html body #loanWizard .loan-selected-pill i,
html body #loanWizard .sub-heading h6,
html body #loanWizard .loan-field label,
html body #loanWizard .loan-limits,
html body #loanWizard .loan-limits span,
html body #loanWizard .loan-results span,
html body #loanWizard .loan-results strong,
html body #loanWizard .loan-table-header h3,
html body #loanWizard .loan-table-wrapper th,
html body #loanWizard .loan-table-wrapper td,
html body #loanWizard .loan-table-actions,
html body #loanWizard .loan-table-actions button,
html body #loanWizard .loan-box-contact h3,
html body #loanWizard .loan-box-contact p,
html body #loanWizard .loan-contact-form input,
html body #loanWizard .loan-contact-form input::placeholder,
html body #loanWizard .loan-contact-form button,
html body #loanWizard .loan-contact-form button span,
html body #loanWizard .loan-contact-form button i,
html body #loanWizard .loan-secure-note,
html body #loanWizard .loan-secure-note strong,
html body #loanWizard .loan-secure-note span,
html body #loanWizard .loan-secure-note i {
    color: #ffffff !important;
    opacity: 1;
}

/* Evita interpolar colores heredados al cambiar de perfil. */
#loanWizard * {
    transition: none !important;
}

#loanWizard .loan-option-card,
#loanWizard .loan-option-card i,
#loanWizard .loan-back-btn,
#loanWizard .loan-term-btn,
#loanWizard .loan-expand-btn,
#loanWizard .loan-contact-form .btn,
#loanWizard .loan-contact-form .btn i {
    transition: transform .28s ease, background .28s ease, border-color .28s ease, box-shadow .28s ease !important;
}

html body #loanWizard.loan-theme-empresa .cotizador-step.is-active,
html body #loanWizard.loan-theme-empresa .cotizador-step.is-done {
    background: linear-gradient(135deg, #3072ac, #002639) !important;
    border-color: #0a8b52 !important;
}

html body #loanWizard.loan-theme-particular .cotizador-step.is-active,
html body #loanWizard.loan-theme-particular .cotizador-step.is-done {
    background: linear-gradient(135deg, #0a8b52, #002639) !important;
    border-color: #3072ac !important;
}

html body #loanWizard.loan-theme-empresa .cotizador-step.is-active span,
html body #loanWizard.loan-theme-empresa .cotizador-step.is-done span {
    background: #3072ac !important;
}

html body #loanWizard.loan-theme-particular .cotizador-step.is-active span,
html body #loanWizard.loan-theme-particular .cotizador-step.is-done span {
    background: #0a8b52 !important;
}

html body #loanWizard.loan-theme-empresa .loan-back-btn,
html body #loanWizard.loan-theme-particular .loan-back-btn {
    background: rgba(0, 38, 57, .62) !important;
    border-color: #a6a6a6 !important;
}

html body #loanWizard.loan-theme-empresa .loan-selected-pill {
    background: #3072ac !important;
    border-color: #a6a6a6 !important;
}

html body #loanWizard.loan-theme-empresa .loan-selected-pill.secondary {
    background: #0a8b52 !important;
}

html body #loanWizard.loan-theme-particular .loan-selected-pill {
    background: #0a8b52 !important;
    border-color: #a6a6a6 !important;
}

html body #loanWizard.loan-theme-particular .loan-selected-pill.secondary {
    background: #3072ac !important;
}

html body #loanWizard.loan-theme-empresa .loan-selected-pill.secondary,
html body #loanWizard.loan-theme-particular .loan-selected-pill.secondary {
    border-color: #a6a6a6 !important;
}

html body #loanWizard.loan-theme-empresa .loan-table-wrapper th,
html body #loanWizard.loan-theme-particular .loan-table-wrapper th {
    background: #3072ac !important;
    background-image: none !important;
    border-color: #3072ac !important;
}

html body #loanWizard.loan-theme-empresa .loan-expand-btn {
    background: #3072ac !important;
    border-color: #a6a6a6 !important;
}

html body #loanWizard.loan-theme-particular .loan-expand-btn {
    background: #0a8b52 !important;
    border-color: #a6a6a6 !important;
}

html body #loanWizard.loan-theme-empresa .loan-contact-form .btn {
    background: linear-gradient(135deg, #3072ac, #002639) !important;
    background-image: linear-gradient(135deg, #3072ac, #002639) !important;
    border-color: #a6a6a6 !important;
}

html body #loanWizard.loan-theme-particular .loan-contact-form .btn {
    background: linear-gradient(135deg, #0a8b52, #002639) !important;
    background-image: linear-gradient(135deg, #0a8b52, #002639) !important;
    border-color: #a6a6a6 !important;
}

html body #loanWizard.loan-theme-empresa .cotizador-label h6,
html body #loanWizard.loan-theme-particular .cotizador-label h6,
html body #loanWizard.loan-theme-empresa .sub-heading h6,
html body #loanWizard.loan-theme-particular .sub-heading h6,
html body #loanWizard.loan-theme-empresa .loan-field label,
html body #loanWizard.loan-theme-particular .loan-field label,
html body #loanWizard.loan-theme-empresa .loan-back-btn i,
html body #loanWizard.loan-theme-particular .loan-back-btn i,
html body #loanWizard.loan-theme-empresa .loan-secure-content strong,
html body #loanWizard.loan-theme-particular .loan-secure-content strong {
    color: #ffffff !important;
}

@media (max-width: 767px) {
    #loanWizard .loan-option-card {
        min-height: 135px;
    }

    #loanWizard .loan-option-card i {
        width: 60px;
        height: 60px;
        border-radius: 17px;
    }
}

/* =========================
   Ajustes finales de banners y carruseles
========================= */

/* Difuminado natural hacia afuera en los cuatro lados del bloque. */
.banner-komoni h1,
.banner-komoni h2,
.banner-nosotros h1,
.banner-nosotros h2,
.index-hero .accent-primary {
    box-shadow:
        0 0 18px 10px rgba(0, 0, 0, .22),
        0 0 42px 22px rgba(0, 0, 0, .12) !important;
}

/* Inicio: titulo centrado al pie de la imagen. */
.index-hero .index-hero-content > .d-flex {
    justify-content: center !important;
}

.index-hero .index-hero-content {
    margin-inline: 0 !important;
}

/* =========================
   Responsive global definitivo
========================= */

html,
body {
    max-width: 100%;
    overflow-x: hidden;
}

@media (max-width: 1199px) {
    #header {
        inset: 0 0 auto !important;
        width: 100% !important;
        padding: 8px 12px 0;
    }

    #header .navbar {
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    #header .navbar .container-fluid {
        width: 100% !important;
        margin: 0 !important;
        padding: 8px 10px !important;
        gap: 10px !important;
        border-radius: 18px !important;
        background: #ffffff;
        box-shadow: 0 12px 32px rgba(0, 38, 57, .14);
    }

    #header .logo-container {
        flex: 0 0 58px;
        max-width: 58px !important;
        padding: 5px !important;
    }

    #header .navbar-toggler {
        display: grid;
        place-items: center;
        width: 44px;
        height: 44px;
        padding: 0 !important;
        border: 1px solid rgba(10, 139, 82, .22);
        border-radius: 13px;
        background: #f4f8f6;
        color: #0a8b52;
        box-shadow: none !important;
    }

    #header .navbar-toggler i {
        color: #0a8b52 !important;
        font-size: 20px;
    }

    #header .navbar-collapse {
        flex-basis: 100%;
        width: 100%;
        max-height: calc(100svh - 92px);
        margin-top: 8px;
        padding: 8px;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        border-top: 1px solid rgba(10, 139, 82, .14);
    }

    #header .navbar-nav,
    #header .nav-item,
    #header .dropdown {
        width: 100%;
    }

    #header .navbar-nav {
        gap: 4px !important;
        margin: 0 !important;
    }

    #header .nav-link {
        width: 100%;
        padding: 11px 14px !important;
        border-radius: 11px;
        text-align: left !important;
        font-size: 15px !important;
    }

    #header .nav-link:hover,
    #header .nav-link:focus-visible,
    #header .nav-link.show {
        transform: none;
        background: #f4f8f6;
    }

    #header .nav-link::before {
        left: 14px;
        right: auto;
        bottom: 5px;
        width: 34px;
        transform-origin: left;
    }

    #header .dropdown-menu,
    #header .servicios-dropdown,
    #header .educacion-dropdown,
    #header .dropdown-submenu > .dropdown-menu {
        position: static !important;
        inset: auto !important;
        transform: none !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        margin: 3px 0 7px !important;
        padding: 5px !important;
        border: 0;
        border-radius: 12px;
        box-shadow: none !important;
        background: #002639 !important;
    }

    #header .servicios-dropdown .dropdown-item,
    #header .educacion-dropdown .dropdown-item,
    #header .dropdown-submenu > .dropdown-menu .dropdown-item {
        justify-content: flex-start !important;
        width: 100%;
        padding: 10px 12px !important;
        text-align: left !important;
        white-space: normal;
        line-height: 1.25;
    }

    #header .dropdown-submenu > .dropdown-menu {
        margin-top: 3px !important;
        background: #07394d !important;
    }

    #header .dropdown-submenu > .dropdown-menu .dropdown-item {
        padding-left: 18px !important;
        font-size: 13px !important;
    }

    main .section {
        padding-inline: clamp(16px, 4vw, 32px);
    }

    .banner-komoni,
    .banner-nosotros {
        width: calc(100% - 24px) !important;
        height: min(60svh, 520px) !important;
        min-height: 390px !important;
        margin: 92px 12px 0 !important;
        padding: 0 !important;
        background-attachment: scroll !important;
    }

    .banner-komoni h1,
    .banner-komoni h2,
    .banner-nosotros h1,
    .banner-nosotros h2 {
        width: min(92%, 900px) !important;
        max-width: 900px !important;
        padding: 14px 18px !important;
        font-size: clamp(28px, 6vw, 46px) !important;
        line-height: 1.1 !important;
        white-space: normal;
    }

    .index-hero {
        margin-top: 92px !important;
        padding: 0 12px !important;
    }

    .index-hero > .mx-auto {
        width: 100%;
    }

    .index-hero > .mx-auto > img {
        width: 100%;
        height: min(68svh, 560px) !important;
        min-height: 430px;
        object-fit: cover;
        object-position: center;
    }

    .index-hero .index-hero-content {
        inset: auto 12px 18px !important;
    }

    .index-hero .index-hero-content > .d-flex {
        padding-bottom: 0 !important;
    }

    .index-hero .index-hero-content > .d-flex > .col {
        flex: 0 1 auto !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
    }

    .index-hero .index-hero-copy {
        height: auto !important;
        padding: 0 !important;
    }

    .index-hero .accent-primary {
        width: min(94%, 900px) !important;
        padding: 14px 18px !important;
        font-size: clamp(30px, 7vw, 50px) !important;
        line-height: 1.08 !important;
    }

    .index-hero-after {
        gap: 16px;
        padding: 28px 18px 36px;
    }

    .index-hero-after p {
        font-size: clamp(16px, 3.4vw, 21px);
    }

    .fideicomisos-page .komoni-image-overlay-card,
    .fideicomisos-page .komoni-image-overlay-card img {
        min-height: 340px;
    }

    .fideicomisos-page .komoni-image-overlay-content,
    .position-relative:has(> img) > .bg-accent-primary.position-absolute,
    .contact-image-text {
        padding: 54px 18px 18px !important;
    }
}

@media (max-width: 575px) {
    #header {
        padding-inline: 8px;
    }

    #header .navbar .container-fluid {
        padding: 7px 8px !important;
        border-radius: 15px !important;
    }

    #header .navbar-collapse {
        max-height: calc(100svh - 82px);
        padding-inline: 3px;
    }

    main .section {
        padding: 3rem 1rem;
    }

    .banner-komoni,
    .banner-nosotros {
        width: calc(100% - 16px) !important;
        height: min(56svh, 470px) !important;
        min-height: 370px !important;
        margin: 82px 8px 0 !important;
        border-radius: 20px !important;
    }

    .banner-komoni .r-container > .d-flex,
    .banner-nosotros .r-container > .d-flex {
        padding-bottom: 20px !important;
    }

    .banner-komoni h1,
    .banner-komoni h2,
    .banner-nosotros h1,
    .banner-nosotros h2 {
        width: 92% !important;
        padding: 12px 14px !important;
        border-radius: 16px;
        font-size: clamp(25px, 7.5vw, 34px) !important;
    }

    .index-hero {
        margin-top: 82px !important;
        padding-inline: 8px !important;
    }

    .index-hero > .mx-auto > img {
        height: min(62svh, 500px) !important;
        min-height: 410px;
        border-radius: 20px !important;
    }

    .index-hero .index-hero-content {
        inset: auto 8px 16px !important;
    }

    .index-hero .accent-primary {
        width: 94% !important;
        padding: 12px 14px !important;
        border-radius: 16px !important;
        font-size: clamp(27px, 8vw, 36px) !important;
    }

    .index-hero-after .btn,
    .index-hero-after .w-max-content,
    main .w-max-content {
        width: 100%;
        max-width: 100%;
    }

    .index-hero-after .btn {
        justify-content: center;
    }

    .fideicomisos-page .komoni-image-overlay-card,
    .fideicomisos-page .komoni-image-overlay-card img {
        min-height: 320px;
        border-radius: 20px;
    }

    .fideicomisos-page .komoni-image-overlay-content,
    .position-relative:has(> img) > .bg-accent-primary.position-absolute,
    .contact-image-text {
        padding: 48px 15px 15px !important;
    }

    .fideicomisos-page .komoni-image-overlay-content h1,
    .fideicomisos-page .komoni-image-overlay-content h3,
    .position-relative:has(> img) > .bg-accent-primary.position-absolute h5,
    .contact-image-text h3 {
        font-size: clamp(20px, 6vw, 27px) !important;
    }

    .fideicomisos-page .komoni-image-overlay-content p,
    .contact-image-text p {
        font-size: 13px !important;
        line-height: 1.35 !important;
    }

    .card-service,
    .loan-box,
    .loan-fields-inner,
    .loan-box-results,
    .loan-box-contact,
    .loan-box-table {
        border-radius: 18px !important;
    }
}

/* Fideicomisos conserva el mismo acabado visual que los demas servicios. */
.fideicomisos-page .section .position-relative:has(> img.rounded-4) {
    overflow: hidden;
    border-radius: 24px;
    box-shadow: 0 18px 42px rgba(0, 38, 57, .14);
}

.fideicomisos-page .section .position-relative:has(> img.rounded-4) > img {
    display: block;
    object-fit: cover;
}

@media (max-width: 575px) {
    .fideicomisos-page .section .position-relative:has(> img.rounded-4) {
        border-radius: 20px;
    }
}

.index-hero .index-hero-copy {
    padding-inline: 3rem !important;
}

html body .bg-accent a.btn.btn-contact-komoni.about-solutions-button {
    background: #ffffff !important;
    background-image: none !important;
    border-color: #ffffff !important;
    color: #0a8b52 !important;
}

html body .bg-accent a.btn.btn-contact-komoni.about-solutions-button span,
html body .bg-accent a.btn.btn-contact-komoni.about-solutions-button i {
    color: #0a8b52 !important;
}

html body .bg-accent a.btn.btn-contact-komoni.about-solutions-button:hover {
    background: #0a8b52 !important;
    background-image: none !important;
    color: #ffffff !important;
}

html body .bg-accent a.btn.btn-contact-komoni.about-solutions-button:hover span,
html body .bg-accent a.btn.btn-contact-komoni.about-solutions-button:hover i {
    color: #ffffff !important;
}

.index-hero .index-hero-content > .d-flex > .col {
    flex: 0 1 1180px !important;
    max-width: 1180px !important;
}

.index-hero .index-hero-copy {
    align-items: center !important;
    text-align: center !important;
}

.index-hero .accent-primary {
    width: min(92%, 1120px) !important;
    max-width: 1120px !important;
    text-align: center !important;
}

/* Texto secundario del inicio fuera de la foto. */
.index-hero-after {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
    padding: clamp(28px, 4vw, 48px) clamp(20px, 5vw, 72px);
    text-align: center;
    background: #f4f8f6;
}

.index-hero-after p {
    max-width: 980px;
    margin: 0;
    color: #002639;
    font-size: clamp(18px, 1.8vw, 25px);
    font-weight: 600;
    line-height: 1.45;
}

/* Nosotros: una sola linea en escritorio. */
@media (min-width: 992px) {
    .banner-nosotros h1,
    .banner-nosotros h2 {
        width: min(94%, 1180px) !important;
        max-width: 1180px !important;
        white-space: nowrap;
        font-size: clamp(34px, 3.55vw, 52px) !important;
    }
}

html body a.about-solutions-button {
    background: #ffffff !important;
    background-image: none !important;
    border-color: #ffffff !important;
    color: #0a8b52 !important;
}

html body a.about-solutions-button span,
html body a.about-solutions-button i {
    color: #0a8b52 !important;
}

html body a.about-solutions-button:hover {
    background: #0a8b52 !important;
    background-image: none !important;
    border-color: #ffffff !important;
    color: #ffffff !important;
}

html body a.about-solutions-button:hover span,
html body a.about-solutions-button:hover i {
    color: #ffffff !important;
}

/* Boton de Soluciones Financieras con colores invertidos. */
.about-solutions-button {
    background: #ffffff !important;
    background-image: none !important;
    border-color: #ffffff !important;
}

.about-solutions-button,
.about-solutions-button span,
.about-solutions-button i {
    color: #0a8b52 !important;
}

.about-solutions-button:hover {
    background: #0a8b52 !important;
    border-color: #ffffff !important;
}

.about-solutions-button:hover,
.about-solutions-button:hover span,
.about-solutions-button:hover i {
    color: #ffffff !important;
}

/* Carruseles automaticos: sin flechas ni puntos de seleccion. */
.swiper-button-next,
.swiper-button-prev,
.swiper-pagination,
.komoni-service-next,
.komoni-service-prev,
.compliance-carousel-nav {
    display: none !important;
}

/* =========================
   Cierre visual de imagenes y secciones
========================= */

main {
    background-color: #f4f8f6;
}

main > .section:not(.banner-komoni):not(.banner-nosotros):not(.index-hero),
.komoni-soft-section,
.komoni-section-divider {
    background-color: #f4f8f6 !important;
}

/* Separadores verdes sin modificar su grosor. */
.komoni-section-divider::before {
    background: #0a8b52 !important;
    opacity: 1 !important;
}

.komoni-section-divider::after {
    display: none !important;
}

/* Banners: titulo al pie, sombra 15% mas oscura y difuminado ligero. */
.banner-komoni,
.banner-nosotros {
    height: 70vh !important;
    max-width: 1816px;
    background-position: center;
    background-size: cover;
}

.banner-komoni .r-container > .d-flex,
.banner-nosotros .r-container > .d-flex {
    justify-content: flex-end !important;
    padding-bottom: clamp(28px, 5vh, 58px) !important;
}

.banner-komoni h1,
.banner-komoni h2,
.banner-nosotros h1,
.banner-nosotros h2 {
    width: min(92%, 1050px) !important;
    max-width: 1050px !important;
    padding: clamp(14px, 1.7vw, 22px) clamp(18px, 2.2vw, 30px) !important;
    border-radius: 22px;
    background: rgba(0, 0, 0, .29) !important;
    backdrop-filter: blur(3px) !important;
    -webkit-backdrop-filter: blur(3px) !important;
    font-size: clamp(30px, 4vw, 58px) !important;
    line-height: 1.08 !important;
    text-wrap: balance;
}

/* Inicio: ambos textos quedan juntos, a la izquierda y al pie de la foto. */
.index-hero .index-hero-content > .d-flex {
    justify-content: flex-start !important;
}

.index-hero .index-hero-content > .d-flex > .col {
    flex: 0 1 1050px !important;
    max-width: 1050px !important;
}

.index-hero .index-hero-copy {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: clamp(12px, 1.5vw, 20px);
}

.index-hero .accent-primary,
.index-hero .banner-text-clean {
    width: min(100%, 980px) !important;
    max-width: 980px !important;
    margin: 0 !important;
    padding: clamp(14px, 1.7vw, 22px) clamp(18px, 2.2vw, 30px) !important;
    border-radius: 22px !important;
    background: rgba(0, 0, 0, .29) !important;
    backdrop-filter: blur(3px) !important;
    -webkit-backdrop-filter: blur(3px) !important;
    text-align: left !important;
    align-items: flex-start !important;
}

.index-hero .accent-primary {
    font-size: clamp(34px, 4.2vw, 66px) !important;
    line-height: 1.04 !important;
    text-wrap: balance;
}

.index-hero .banner-text-clean p {
    max-width: 900px;
    font-size: clamp(16px, 1.35vw, 22px) !important;
    line-height: 1.35 !important;
}

/* Fotos del cuerpo: franja completa en el pie, no apariencia de boton. */
.fideicomisos-page .komoni-image-overlay-content,
.position-relative:has(> img) > .bg-accent-primary.position-absolute,
.contact-image-text {
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: clamp(52px, 7vw, 92px) clamp(16px, 2.4vw, 28px) clamp(16px, 2.4vw, 28px) !important;
    border-radius: 0 !important;
    background: linear-gradient(
        to top,
        rgba(0, 0, 0, .48) 0%,
        rgba(0, 0, 0, .35) 42%,
        rgba(0, 0, 0, .14) 76%,
        transparent 100%
    ) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    color: #fff !important;
}

.fideicomisos-page .komoni-image-overlay-content h1,
.fideicomisos-page .komoni-image-overlay-content h3,
.position-relative:has(> img) > .bg-accent-primary.position-absolute h5,
.contact-image-text h3 {
    margin: 0 !important;
    color: #fff !important;
    font-size: clamp(22px, 2.5vw, 36px) !important;
    line-height: 1.14 !important;
    text-wrap: balance;
}

.fideicomisos-page .komoni-image-overlay-content p,
.contact-image-text p {
    max-width: 1050px !important;
    margin: 8px 0 0 !important;
    color: #fff !important;
    font-size: clamp(14px, 1.3vw, 18px) !important;
    line-height: 1.4 !important;
}

.position-relative:has(> img) > .bg-accent-primary.position-absolute .rtmicon {
    font-size: clamp(44px, 5vw, 66px) !important;
}

@media (max-width: 1199px) {
    .index-hero .index-hero-copy {
        align-items: center;
        padding-inline: 1rem !important;
        text-align: center !important;
    }

    .index-hero .accent-primary,
    .index-hero .banner-text-clean {
        text-align: center !important;
        align-items: center !important;
    }
}

@media (max-width: 767px) {
    .banner-komoni,
    .banner-nosotros {
        height: 56vh !important;
        min-height: 420px;
    }

    .banner-komoni h1,
    .banner-komoni h2,
    .banner-nosotros h1,
    .banner-nosotros h2 {
        font-size: clamp(27px, 8vw, 40px) !important;
    }

    .index-hero .accent-primary {
        font-size: clamp(29px, 8.5vw, 44px) !important;
    }

    .index-hero .banner-text-clean p {
        font-size: 15px !important;
    }
}

/* Prioridad final para los ajustes solicitados en esta revision. */
.index-hero .index-hero-content > .d-flex {
    justify-content: center !important;
}

.index-hero .index-hero-content > .d-flex > .col {
    flex: 0 1 1180px !important;
    max-width: 1180px !important;
}

.index-hero .index-hero-copy {
    align-items: center !important;
    text-align: center !important;
}

.index-hero .accent-primary {
    width: min(92%, 1120px) !important;
    max-width: 1120px !important;
    text-align: center !important;
}

@media (min-width: 992px) {
    .banner-nosotros h1,
    .banner-nosotros h2 {
        width: min(94%, 1180px) !important;
        max-width: 1180px !important;
        white-space: nowrap;
        font-size: clamp(32px, 3.5vw, 50px) !important;
    }
}

.index-hero .index-hero-content {
    margin-inline: 0 !important;
}

/* Ultima prioridad responsive para neutralizar reglas historicas del hero. */
@media (max-width: 1199px) {
    .banner-komoni,
    .banner-nosotros {
        width: calc(100% - 24px) !important;
        height: min(60svh, 520px) !important;
        min-height: 390px !important;
        margin: 92px 12px 0 !important;
        padding: 0 !important;
    }

    .index-hero .index-hero-content {
        inset: auto 12px 18px !important;
        height: auto !important;
    }

    .index-hero .index-hero-content > .d-flex {
        height: auto !important;
        padding-bottom: 0 !important;
    }

    .index-hero .index-hero-content > .d-flex > .col {
        flex: 0 1 auto !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        margin: 0 !important;
    }

    .index-hero .index-hero-copy {
        width: 100% !important;
        height: auto !important;
        padding: 0 !important;
    }
}

@media (max-width: 575px) {
    .banner-komoni,
    .banner-nosotros {
        width: calc(100% - 16px) !important;
        height: min(56svh, 470px) !important;
        min-height: 370px !important;
        margin: 82px 8px 0 !important;
    }

    .index-hero .index-hero-content {
        inset: auto 8px 16px !important;
    }

    .index-hero .accent-primary {
        width: 94% !important;
        max-width: 94% !important;
        padding: 12px 14px !important;
        font-size: clamp(27px, 8vw, 36px) !important;
    }
}

/* Portafolio: botones de acceso limpios y acordes al color de cada tarjeta. */
.swiperService .card-service {
    --portfolio-arrow-color: #087646;
    --portfolio-arrow-border: rgba(8, 118, 70, .28);
    --portfolio-arrow-shadow: rgba(0, 73, 43, .25);
}

.swiperService .portfolio-card-blue {
    --portfolio-arrow-color: #3072ac;
    --portfolio-arrow-border: rgba(48, 114, 172, .32);
    --portfolio-arrow-shadow: rgba(0, 38, 57, .28);
}

.swiperService .card-service .custom-border-2,
.swiperService .card-service:hover .custom-border-2,
.swiperService .swiper-slide-active .card-service .custom-border-2 {
    right: 14px !important;
    bottom: 14px !important;
    width: 56px;
    height: 56px;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 17px !important;
    background: transparent !important;
}

.swiperService .card-service .custom-border-2 > .d-flex {
    width: 100%;
    height: 100%;
}

.swiperService .card-service .icon-box.link,
.swiperService .portfolio-card-blue .icon-box.link {
    width: 56px;
    min-width: 56px;
    height: 56px;
    padding: 0 !important;
    border: 1px solid var(--portfolio-arrow-border) !important;
    border-radius: 17px !important;
    background: rgba(255, 255, 255, .94) !important;
    color: var(--portfolio-arrow-color) !important;
    box-shadow:
        0 10px 24px var(--portfolio-arrow-shadow),
        inset 0 1px 0 rgba(255, 255, 255, .9);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    transition:
        transform .25s ease,
        background-color .25s ease,
        border-color .25s ease,
        box-shadow .25s ease;
}

.swiperService .card-service .icon-box.link i,
.swiperService .portfolio-card-blue .icon-box.link i {
    color: var(--portfolio-arrow-color) !important;
    font-size: 20px;
    transition: transform .25s ease, color .25s ease;
}

.swiperService .card-service:hover .icon-box.link,
.swiperService .card-service .icon-box.link:hover,
.swiperService .card-service .icon-box.link:focus-visible,
.swiperService .portfolio-card-blue:hover .icon-box.link {
    border-color: var(--portfolio-arrow-color) !important;
    background: var(--portfolio-arrow-color) !important;
    color: #ffffff !important;
    box-shadow: 0 14px 28px var(--portfolio-arrow-shadow);
    transform: translateY(-3px);
}

.swiperService .card-service:hover .icon-box.link i,
.swiperService .card-service .icon-box.link:hover i,
.swiperService .card-service .icon-box.link:focus-visible i,
.swiperService .portfolio-card-blue:hover .icon-box.link i {
    color: #ffffff !important;
    transform: translate(2px, -2px);
}

.swiperService .card-service .icon-box.link:focus-visible {
    outline: 3px solid rgba(255, 255, 255, .9);
    outline-offset: 3px;
}

@media (max-width: 575px) {
    .swiperService .card-service .custom-border-2,
    .swiperService .card-service:hover .custom-border-2,
    .swiperService .swiper-slide-active .card-service .custom-border-2 {
        right: 10px !important;
        bottom: 10px !important;
        width: 50px;
        height: 50px;
        border-radius: 15px !important;
    }

    .swiperService .card-service .icon-box.link,
    .swiperService .portfolio-card-blue .icon-box.link {
        width: 50px;
        min-width: 50px;
        height: 50px;
        border-radius: 15px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .swiperService .card-service .icon-box.link,
    .swiperService .card-service .icon-box.link i {
        transition: none;
    }
}

/* =========================
   Menú móvil refinado
========================= */

.mobile-menu-backdrop {
    display: none;
}

@media (max-width: 1199px) {
    body.mobile-menu-open {
        overflow: hidden !important;
    }

    #header {
        z-index: 1055 !important;
    }

    #header .navbar {
        position: relative;
        z-index: 4;
    }

    #header .navbar .container-fluid {
        position: relative;
        z-index: 2;
        border: 1px solid rgba(0, 38, 57, .08);
        border-radius: 20px !important;
        box-shadow: 0 14px 34px rgba(0, 38, 57, .16);
    }

    #header .navbar-toggler {
        width: 48px;
        height: 48px;
        border-radius: 15px;
        background: rgba(10, 139, 82, .08);
        transition: background-color .25s ease, transform .25s ease;
    }

    #header .navbar-toggler[aria-expanded="true"] {
        background: #0a8b52;
        transform: rotate(90deg);
    }

    #header .navbar-toggler[aria-expanded="true"] i {
        color: #ffffff !important;
    }

    #header .navbar-collapse {
        position: fixed;
        z-index: 3;
        top: 82px;
        left: 12px;
        right: 12px;
        width: auto;
        max-height: calc(100svh - 100px);
        margin: 0 !important;
        padding: 14px !important;
        overflow-y: auto !important;
        border: 1px solid rgba(0, 38, 57, .10);
        border-radius: 22px;
        background: rgba(255, 255, 255, .98);
        box-shadow: 0 24px 60px rgba(0, 38, 57, .28);
        scrollbar-width: thin;
        scrollbar-color: #0a8b52 transparent;
    }

    #header .navbar-collapse.collapsing {
        height: auto !important;
        opacity: 0;
        transform: translateY(-10px);
        transition: opacity .2s ease, transform .2s ease;
    }

    #header .navbar-collapse.show {
        opacity: 1;
        transform: translateY(0);
    }

    #header .navbar-nav {
        gap: 7px !important;
    }

    #header .nav-link {
        display: flex;
        align-items: center;
        justify-content: space-between;
        min-height: 50px;
        padding: 12px 15px !important;
        border: 1px solid transparent;
        border-radius: 14px;
        background: #f4f8f6;
        color: #002639;
        font-size: 15px !important;
    }

    #header .nav-link.active,
    #header .nav-link.show,
    #header .nav-link:hover,
    #header .nav-link:focus-visible {
        border-color: rgba(10, 139, 82, .20);
        background: rgba(10, 139, 82, .10);
        color: #087646 !important;
    }

    #header .nav-link::before {
        display: none !important;
    }

    #header .nav-link.dropdown-toggle::after {
        margin-left: auto;
        transition: transform .25s ease;
    }

    #header .nav-link.dropdown-toggle.show::after {
        transform: rotate(180deg);
    }

    #header .dropdown-menu,
    #header .servicios-dropdown,
    #header .educacion-dropdown {
        margin: 7px 0 3px !important;
        padding: 8px !important;
        border: 1px solid rgba(48, 114, 172, .20) !important;
        border-radius: 16px !important;
        background: #002639 !important;
    }

    #header .dropdown-submenu > .dropdown-menu {
        margin: 6px 0 2px !important;
        padding: 6px !important;
        border: 1px solid rgba(255, 255, 255, .10) !important;
        background: #07394d !important;
    }

    #header .servicios-dropdown .dropdown-item,
    #header .educacion-dropdown .dropdown-item,
    #header .dropdown-submenu > .dropdown-menu .dropdown-item {
        min-height: 44px;
        padding: 11px 12px !important;
        border-radius: 11px;
        background: transparent !important;
        color: rgba(255, 255, 255, .90) !important;
        font-size: 13px !important;
    }

    #header .servicios-dropdown .dropdown-item:hover,
    #header .servicios-dropdown .dropdown-item:focus-visible,
    #header .servicios-dropdown .dropdown-item.active {
        padding-left: 12px !important;
        background: rgba(255, 255, 255, .10) !important;
        color: #ffffff !important;
    }

    #header .servicios-dropdown .dropdown-item i,
    #header .educacion-dropdown .dropdown-item i {
        color: #6d9e88 !important;
    }

    .mobile-menu-backdrop {
        position: fixed;
        z-index: 2;
        inset: 0;
        display: block;
        border: 0;
        background: rgba(0, 38, 57, .56);
        opacity: 0;
        visibility: hidden;
        transition: opacity .25s ease, visibility .25s ease;
    }

    body.mobile-menu-open .mobile-menu-backdrop {
        opacity: 1;
        visibility: visible;
    }
}

/* =========================
   Footer de ancho completo
========================= */

footer {
    overflow: hidden;
    background: #0a8b52;
}

footer .footer-shell {
    padding: 0 !important;
    background: #0a8b52;
}

footer .footer-panel {
    width: min(100%, 1440px);
    margin: 0 auto;
    padding: clamp(48px, 6vw, 82px) clamp(24px, 5vw, 72px) clamp(30px, 4vw, 52px) !important;
    background: transparent !important;
}

footer .footer-top {
    padding-bottom: clamp(28px, 4vw, 46px);
    border-bottom: 1px solid rgba(255, 255, 255, .18);
}

footer .footer-top > a:first-child img {
    width: 100%;
    max-height: 100%;
    object-fit: contain;
    filter: none;
}

footer .footer-authorities {
    flex-direction: row !important;
    flex-wrap: wrap;
}

footer .partner-logo {
    min-height: 112px;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 20px;
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 14px 30px rgba(0, 38, 57, .16);
}

footer .footer-links {
    align-items: stretch !important;
}

footer .footer-links-primary {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 10px !important;
    width: 100%;
}

footer .footer-links-primary .link,
footer .footer-links-secondary .link {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 52px;
    padding: 12px 14px;
    border: 1px solid rgba(255, 255, 255, .15);
    border-radius: 14px;
    background: rgba(0, 38, 57, .12);
    color: rgba(255, 255, 255, .92) !important;
    text-align: center;
    transition: background-color .25s ease, border-color .25s ease, transform .25s ease;
}

footer .footer-links-primary .link:hover,
footer .footer-links-primary .link:focus-visible,
footer .footer-links-secondary .link:hover,
footer .footer-links-secondary .link:focus-visible {
    border-color: rgba(255, 255, 255, .45);
    background: rgba(0, 38, 57, .24);
    color: #ffffff !important;
    transform: translateY(-2px);
}

footer .footer-links-secondary,
footer .footer-links-secondary .link {
    width: 100%;
}

footer .footer-legal-disclaimer {
    padding: clamp(22px, 3vw, 34px);
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 18px;
    background: rgba(0, 38, 57, .12);
}

footer .footer-legal-disclaimer p {
    color: rgba(255, 255, 255, .88);
}

footer .footer-bottom {
    margin-top: 0;
    color: rgba(255, 255, 255, .90);
}

@media (max-width: 1199px) {
    footer .footer-top {
        align-items: center !important;
        text-align: center;
    }

    footer .footer-links-primary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575px) {
    footer .footer-panel {
        gap: 30px !important;
        padding: 42px 16px 28px !important;
    }

    footer .footer-authorities {
        display: grid !important;
        grid-template-columns: 1fr 1fr;
        gap: 10px !important;
        width: 100%;
    }

    footer .footer-authorities > a,
    footer .footer-authorities > button {
        width: 100%;
    }

    footer .partner-logo {
        width: 100%;
        min-height: 92px;
        padding: 12px;
    }

    footer .footer-links-primary {
        grid-template-columns: 1fr;
    }

    footer .footer-links-primary .link,
    footer .footer-links-secondary .link {
        min-height: 48px;
        font-size: 14px;
    }

    footer .footer-legal-disclaimer {
        padding: 20px 16px;
    }

footer .footer-bottom {
        text-align: center;
    }
}

/* =========================================================
   LEGALES - VISUAL SYSTEM
   ========================================================= */

.legales-page main {
    overflow: hidden;
    background:
        radial-gradient(circle at 100% 18%, rgba(48, 114, 172, .08), transparent 24rem),
        radial-gradient(circle at 0 68%, rgba(10, 139, 82, .07), transparent 26rem),
        #f7faf9;
    color: #002639;
}

.legales-page .legal-hero {
    isolation: isolate;
    min-height: clamp(400px, 52vw, 610px);
    border: 1px solid rgba(255, 255, 255, .3);
    box-shadow: 0 28px 60px rgba(0, 38, 57, .18);
    background-position: center 42% !important;
}

.legales-page .legal-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background:
        linear-gradient(180deg, rgba(0, 38, 57, .08) 15%, rgba(0, 38, 57, .32) 62%, rgba(0, 38, 57, .74) 100%),
        linear-gradient(110deg, rgba(48, 114, 172, .18), transparent 48%, rgba(10, 139, 82, .12));
    pointer-events: none;
}

.legales-page .legal-hero .r-container {
    z-index: 2 !important;
}

.legales-page .legal-hero h2 {
    max-width: 820px;
    padding: 15px 24px;
    border: 1px solid rgba(255, 255, 255, .24);
    border-radius: 18px;
    background: rgba(0, 38, 57, .72);
    box-shadow: 0 18px 40px rgba(0, 38, 57, .2);
    backdrop-filter: blur(8px);
}

.legales-page .legal-hero .p-banner {
    max-width: 760px;
    margin: 0;
    padding: 12px 20px;
    border-radius: 14px;
    background: rgba(0, 38, 57, .58);
    color: rgba(255, 255, 255, .94) !important;
    font-size: clamp(.94rem, 1.4vw, 1.08rem);
    line-height: 1.65;
    backdrop-filter: blur(7px);
}

.legales-page .legal-section {
    position: relative;
    background: transparent !important;
}

.legales-page .legal-section h3 {
    max-width: 820px;
    margin-bottom: 0;
    color: #002639 !important;
    letter-spacing: -.025em;
}

.legales-page .legal-section p {
    color: #425466;
    line-height: 1.75;
}

.legales-page .legal-section .sub-heading {
    padding: 8px 15px;
    border: 1px solid rgba(10, 139, 82, .2);
    border-radius: 999px;
    background: rgba(10, 139, 82, .09);
}

.legales-page .legal-section .sub-heading h6 {
    color: #076b40 !important;
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.legales-page .legal-option-grid {
    gap: 18px;
    margin-top: .6rem;
}

.legales-page .legal-option-card {
    position: relative;
    isolation: isolate;
    min-height: 150px;
    overflow: hidden;
    border: 1px solid rgba(48, 114, 172, .16) !important;
    border-radius: 22px !important;
    background: rgba(255, 255, 255, .94) !important;
    box-shadow: 0 14px 34px rgba(0, 38, 57, .07);
    color: #002639 !important;
    font-weight: 750;
    transition: transform .3s ease, border-color .3s ease, box-shadow .3s ease, color .3s ease;
}

.legales-page .legal-option-card::after {
    content: "";
    position: absolute;
    inset: auto 0 0;
    z-index: -1;
    height: 4px;
    background: linear-gradient(90deg, #3072ac, #0a8b52);
    transition: height .3s ease;
}

.legales-page .legal-option-card i {
    display: grid;
    width: 62px;
    height: 62px;
    place-items: center;
    border: 1px solid rgba(48, 114, 172, .18);
    border-radius: 18px;
    background: rgba(48, 114, 172, .1);
    color: #3072ac !important;
    font-size: 1.6rem;
    box-shadow: 0 10px 22px rgba(48, 114, 172, .12);
    transition: transform .3s ease, color .3s ease, background .3s ease, border-color .3s ease;
}

.legales-page .legal-option-card:nth-child(even) i {
    border-color: rgba(10, 139, 82, .18);
    background: rgba(10, 139, 82, .1);
    color: #0a8b52 !important;
    box-shadow: 0 10px 22px rgba(10, 139, 82, .1);
}

.legales-page .legal-option-card:hover,
.legales-page .legal-option-card:focus-visible,
.legales-page .legal-option-card.active {
    transform: translateY(-6px);
    border-color: rgba(10, 139, 82, .42) !important;
    box-shadow: 0 22px 45px rgba(0, 38, 57, .14);
    color: #002639 !important;
}

.legales-page .legal-option-card:hover::after,
.legales-page .legal-option-card:focus-visible::after,
.legales-page .legal-option-card.active::after {
    height: 8px;
}

.legales-page .legal-option-card:hover i,
.legales-page .legal-option-card:focus-visible i,
.legales-page .legal-option-card.active i {
    border-color: transparent;
    background: #0a8b52;
    color: #ffffff !important;
    transform: translateY(-3px) rotate(-3deg);
}

.legales-page .legal-download-card {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: clamp(25px, 3vw, 34px);
    border: 1px solid rgba(48, 114, 172, .16);
    border-radius: 24px;
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 16px 38px rgba(0, 38, 57, .08);
    transition: transform .3s ease, border-color .3s ease, box-shadow .3s ease;
}

.legales-page .legal-download-card::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    z-index: -1;
    height: 5px;
    background: linear-gradient(90deg, #3072ac, #0a8b52);
}

.legales-page .legal-download-card:hover {
    transform: translateY(-7px);
    border-color: rgba(10, 139, 82, .38);
    box-shadow: 0 24px 48px rgba(0, 38, 57, .14);
}

.legales-page .legal-download-icon {
    width: 68px;
    height: 68px;
    border: 1px solid rgba(48, 114, 172, .16);
    border-radius: 19px;
    background: rgba(48, 114, 172, .1);
    box-shadow: 0 12px 24px rgba(48, 114, 172, .11);
    transition: transform .3s ease, background .3s ease;
}

.legales-page .col:nth-child(even) .legal-download-icon {
    border-color: rgba(10, 139, 82, .18);
    background: rgba(10, 139, 82, .1);
}

.legales-page .legal-download-icon i {
    color: #3072ac !important;
}

.legales-page .col:nth-child(even) .legal-download-icon i {
    color: #0a8b52 !important;
}

.legales-page .legal-download-card:hover .legal-download-icon {
    background: #0a8b52;
    transform: translateY(-3px) rotate(-4deg);
}

.legales-page .legal-download-card:hover .legal-download-icon i {
    color: #ffffff !important;
}

.legales-page .legal-download-card h5 {
    color: #002639 !important;
    line-height: 1.4;
}

.legales-page .legal-download-card p {
    color: #526474;
    line-height: 1.65;
}

.legales-page .legal-download-card .btn {
    width: 100%;
    justify-content: space-between;
    border: 1px solid #3072ac;
    border-radius: 999px;
    background: #3072ac;
    color: #ffffff !important;
    font-weight: 750;
    box-shadow: 0 10px 20px rgba(48, 114, 172, .2);
}

.legales-page .legal-download-card .btn i {
    color: #ffffff !important;
    transition: transform .25s ease;
}

.legales-page .legal-download-card .btn:hover {
    border-color: #0a8b52;
    background: #0a8b52;
    color: #ffffff !important;
    transform: translateY(-2px);
}

.legales-page .legal-download-card .btn:hover i {
    transform: translateY(2px);
}

.legales-page .legal-commission-box {
    padding: clamp(12px, 2vw, 22px);
    overflow: hidden;
    border: 1px solid rgba(48, 114, 172, .18);
    border-radius: 26px;
    background: #ffffff;
    box-shadow: 0 22px 50px rgba(0, 38, 57, .11);
}

.legales-page .legal-commission-box img {
    border: 1px solid rgba(0, 38, 57, .08);
    transition: transform .55s ease;
}

.legales-page .legal-commission-box:hover img {
    transform: scale(1.012);
}

.legales-page .compliance-back-btn {
    border: 1px solid #3072ac;
    background: #3072ac;
    color: #ffffff;
    box-shadow: 0 10px 22px rgba(48, 114, 172, .18);
}

.legales-page .compliance-back-btn i {
    color: #ffffff !important;
}

.legales-page .compliance-back-btn:hover {
    border-color: #0a8b52;
    background: #0a8b52;
    color: #ffffff;
    transform: translateY(-2px);
}

.legales-page .compliance-back-btn:hover i {
    color: #ffffff !important;
}

.legales-page .compliance-form-card,
.legales-page .compliance-form-box {
    border: 1px solid rgba(48, 114, 172, .18);
    border-top: 5px solid #3072ac;
    border-radius: 26px;
    background: #ffffff;
    box-shadow: 0 22px 48px rgba(0, 38, 57, .1);
}

.legales-page .compliance-form-card h4,
.legales-page .compliance-form-box h4,
.legales-page .compliance-field label {
    color: #002639 !important;
}

.legales-page .compliance-field input,
.legales-page .compliance-field select,
.legales-page .compliance-field textarea,
.legales-page .compliance-form-box input,
.legales-page .compliance-form-box select,
.legales-page .compliance-form-box textarea {
    border-color: rgba(0, 38, 57, .16);
    background: #f8fbfa;
    color: #002639;
}

.legales-page .compliance-field input:focus,
.legales-page .compliance-field select:focus,
.legales-page .compliance-field textarea:focus,
.legales-page .compliance-form-box input:focus,
.legales-page .compliance-form-box select:focus,
.legales-page .compliance-form-box textarea:focus {
    border-color: #3072ac;
    box-shadow: 0 0 0 4px rgba(48, 114, 172, .12);
}

.legales-page .compliance-note {
    border-left-color: #3072ac;
    background: rgba(48, 114, 172, .08);
}

.legales-page .compliance-note p {
    color: #29485b;
}

.legales-page .compliance-submit-btn,
.legales-page .compliance-form-actions .btn {
    border: 1px solid #0a8b52;
    background: #0a8b52;
    color: #ffffff !important;
    box-shadow: 0 10px 22px rgba(10, 139, 82, .18);
}

.legales-page .compliance-submit-btn:hover,
.legales-page .compliance-form-actions .btn:hover {
    border-color: #076b40;
    background: #076b40;
    color: #ffffff !important;
    transform: translateY(-2px);
}

.legales-page .compliance-form-actions .btn i {
    color: #ffffff !important;
}

.legales-page .legal-contact-cta {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .18);
    background: linear-gradient(115deg, #002639 0%, #064861 52%, #0a8b52 130%) !important;
    box-shadow: 0 24px 50px rgba(0, 38, 57, .2);
}

.legales-page .legal-contact-cta::after {
    content: "";
    position: absolute;
    width: 220px;
    height: 220px;
    right: -75px;
    bottom: -140px;
    z-index: -1;
    border: 34px solid rgba(255, 255, 255, .09);
    border-radius: 50%;
}

.legales-page .legal-contact-cta h3 {
    color: #ffffff !important;
}

.legales-page .legal-contact-cta .p-banner {
    color: rgba(255, 255, 255, .85) !important;
}

.legales-page .legal-contact-cta .btn-contact-komoni {
    min-width: 190px;
    justify-content: center;
    border: 1px solid rgba(255, 255, 255, .58);
    background: #ffffff;
    color: #002639 !important;
    box-shadow: 0 12px 25px rgba(0, 0, 0, .16);
    white-space: nowrap;
}

.legales-page .legal-contact-cta .btn-contact-komoni i {
    color: #0a8b52 !important;
}

.legales-page .legal-contact-cta .btn-contact-komoni:hover {
    border-color: #0a8b52;
    background: #0a8b52;
    color: #ffffff !important;
    transform: translateY(-3px);
}

.legales-page .legal-contact-cta .btn-contact-komoni:hover i {
    color: #ffffff !important;
}

@keyframes legal-card-enter {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.legales-page .legal-option-card,
.legales-page .legal-download-card,
.legales-page .legal-commission-box {
    animation: legal-card-enter .55s ease both;
}

.legales-page .legal-option-card:nth-child(2),
.legales-page .col:nth-child(2) .legal-download-card {
    animation-delay: .07s;
}

.legales-page .legal-option-card:nth-child(3),
.legales-page .col:nth-child(3) .legal-download-card {
    animation-delay: .14s;
}

.legales-page .legal-option-card:nth-child(4) {
    animation-delay: .21s;
}

@media (max-width: 1199px) {
    .legales-page .legal-section .sub-heading {
        align-self: center;
    }

    .legales-page .legal-option-card {
        min-height: 138px;
    }
}

@media (max-width: 767px) {
    .legales-page .legal-hero {
        min-height: 420px;
        background-position: 58% center !important;
    }

    .legales-page .legal-hero h2 {
        padding: 13px 16px;
        border-radius: 15px;
        font-size: clamp(1.8rem, 9vw, 2.45rem);
    }

    .legales-page .legal-hero .p-banner {
        padding: 11px 14px;
        line-height: 1.5;
    }

    .legales-page .legal-option-grid,
    .legales-page .compliance-option-grid.is-compact {
        grid-template-columns: 1fr !important;
        gap: 13px;
    }

    .legales-page .legal-option-card,
    .legales-page .compliance-option-grid.is-compact .compliance-option-card {
        min-height: 86px;
        padding: 15px 17px;
        border-radius: 18px !important;
        flex-direction: row;
        justify-content: flex-start;
        gap: 15px;
        text-align: left;
    }

    .legales-page .legal-option-card i,
    .legales-page .compliance-option-grid.is-compact .compliance-option-card i {
        width: 52px;
        height: 52px;
        flex: 0 0 52px;
        border-radius: 15px;
        font-size: 1.35rem;
    }

    .legales-page .legal-download-card {
        text-align: left;
    }

    .legales-page .legal-download-card .btn,
    .legales-page .compliance-back-btn,
    .legales-page .compliance-submit-btn,
    .legales-page .compliance-form-actions .btn {
        width: 100%;
        justify-content: center;
    }

    .legales-page .compliance-form-card,
    .legales-page .compliance-form-box {
        padding: 22px 16px;
        border-radius: 20px;
    }

    .legales-page .compliance-form-grid {
        grid-template-columns: 1fr;
    }

    .legales-page .legal-contact-cta {
        padding: 30px 20px !important;
    }

    .legales-page .legal-contact-cta .w-max-content,
    .legales-page .legal-contact-cta .btn-contact-komoni {
        width: 100%;
    }

    .legales-page .legal-contact-cta .btn-contact-komoni {
        justify-content: center;
    }
}

@media (prefers-reduced-motion: reduce) {
    .legales-page .legal-option-card,
    .legales-page .legal-download-card,
    .legales-page .legal-commission-box {
        animation: none;
    }
}

/* Autoridad final: legales e iconografia global. */
.legales-page .legal-hero h2 {
    margin-bottom: 0 !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

.legales-page .legal-hero .r-container > .d-flex {
    justify-content: flex-end !important;
    padding-bottom: clamp(20px, 4vh, 42px) !important;
}

.legales-page .legal-hero-summary {
    max-width: 1816px;
    margin: -1px auto 0;
    padding: clamp(18px, 2.5vw, 30px);
    background: #002639 !important;
    border-radius: 0 0 22px 22px;
    text-align: center;
}

.legales-page .legal-hero-summary p,
.legales-page .legal-contact-cta p {
    color: #fff !important;
}

.legales-page .legal-contact-cta .legal-more-info-btn {
    background: #fff !important;
    background-image: none !important;
    border-color: #0a8b52 !important;
    color: #0a8b52 !important;
}

.legales-page .legal-contact-cta .legal-more-info-btn span,
.legales-page .legal-contact-cta .legal-more-info-btn i {
    color: #0a8b52 !important;
}

.legales-page .legal-contact-cta .legal-more-info-btn:hover {
    background: #0a8b52 !important;
    border-color: #fff !important;
}

.legales-page .legal-contact-cta .legal-more-info-btn:hover span,
.legales-page .legal-contact-cta .legal-more-info-btn:hover i {
    color: #fff !important;
}

body .icon-box:not(.link),
body .icon-box-2,
body .compliance-mini-icon,
body .contact-credit-icon,
body .legal-download-icon {
    background: #0a8b52 !important;
    background-image: none !important;
    border-color: rgba(255, 255, 255, .32) !important;
    color: #fff !important;
}

body .col:nth-child(even) > .card-service .icon-box:not(.link),
body .contact-credit-card:nth-child(even) .contact-credit-icon,
body .legales-page .col:nth-child(even) .legal-download-icon,
body .legales-page .legal-option-card:nth-child(even) i,
body .legales-page .compliance-option-card:nth-child(even) i {
    background: #3072ac !important;
    background-image: none !important;
}

body .icon-box:not(.link) i,
body .icon-box-2 i,
body .compliance-mini-icon i,
body .contact-credit-icon i,
body .legal-download-icon i {
    color: #fff !important;
}

body .icon-box:not(.link):hover,
body .icon-box-2:hover,
body .compliance-mini-card:hover .compliance-mini-icon,
body .contact-credit-card:hover .contact-credit-icon,
body .legal-download-card:hover .legal-download-icon {
    background: #002639 !important;
    border-color: #6d9e88 !important;
}

/* CTA solicitados: verde corporativo con hover azul. */
.komoni-primary-cta,
.komoni-testimonial-cta .btn,
.section:has(.accordion) .w-max-content.mt-4 .btn {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    min-height: 50px;
    padding: 13px 26px !important;
    justify-content: center;
    border: 1px solid rgba(255, 255, 255, .34) !important;
    border-radius: 20px !important;
    background: linear-gradient(135deg, #0a8b52 0%, #076b40 100%) !important;
    color: #fff !important;
    box-shadow: 0 12px 26px rgba(10, 139, 82, .22) !important;
    transition: transform .28s ease, box-shadow .28s ease, background .28s ease, border-color .28s ease !important;
}

.komoni-primary-cta::before,
.komoni-testimonial-cta .btn::before,
.section:has(.accordion) .w-max-content.mt-4 .btn::before {
    content: "";
    position: absolute;
    inset: -50%;
    z-index: -1;
    background: linear-gradient(115deg, transparent 38%, rgba(255, 255, 255, .38) 50%, transparent 62%);
    transform: translateX(-75%) rotate(12deg);
    transition: transform .55s ease;
}

.komoni-primary-cta span,
.komoni-primary-cta i,
.komoni-testimonial-cta .btn span,
.komoni-testimonial-cta .btn i,
.section:has(.accordion) .w-max-content.mt-4 .btn span,
.section:has(.accordion) .w-max-content.mt-4 .btn i {
    color: #fff !important;
    transition: transform .28s ease !important;
}

.komoni-primary-cta:hover,
.komoni-testimonial-cta .btn:hover,
.section:has(.accordion) .w-max-content.mt-4 .btn:hover {
    transform: translateY(-4px);
    border-color: rgba(255, 255, 255, .5) !important;
    background: linear-gradient(135deg, #3072ac 0%, #174f70 100%) !important;
    box-shadow: 0 18px 36px rgba(0, 38, 57, .28) !important;
}

.komoni-primary-cta:hover::before,
.komoni-testimonial-cta .btn:hover::before,
.section:has(.accordion) .w-max-content.mt-4 .btn:hover::before {
    transform: translateX(75%) rotate(12deg);
}

.komoni-primary-cta:hover i,
.komoni-testimonial-cta .btn:hover i,
.section:has(.accordion) .w-max-content.mt-4 .btn:hover i {
    transform: translate(3px, -2px);
}

footer .footer-komoni-logo {
    width: 100%;
    max-height: 100%;
    object-fit: contain;
    filter: none !important;
}

footer .footer-komoni-logo-box {
    width: 360px;
    height: 112px;
    padding: 10px 0;
}

@media (max-width: 575px) {
    footer .footer-komoni-logo-box {
        width: 100%;
        height: 92px;
        padding-inline: 12px;
    }
}

/* Index: usa la misma distribucion y escala visual que el resto de banners. */
.index-documents-banner {
    height: 70vh !important;
    background-position: center !important;
}

.index-documents-banner .r-container > .d-flex {
    justify-content: flex-end !important;
    align-items: center !important;
    padding-top: 0 !important;
    padding-inline: 0 !important;
    padding-bottom: clamp(28px, 5vh, 58px) !important;
    text-align: center !important;
}

.index-documents-banner h1 {
    width: min(92%, 1050px) !important;
    max-width: 1050px !important;
    margin-inline: auto !important;
    text-align: center !important;
    font-size: clamp(30px, 4vw, 58px) !important;
    line-height: 1.12 !important;
    background: rgba(0, 0, 0, .29) !important;
    border: none;
}

@media (max-width: 767px) {
    .index-documents-banner {
        height: 56vh !important;
        min-height: 420px;
        background-position: center !important;
    }

    .index-documents-banner .r-container > .d-flex {
        justify-content: flex-end !important;
        align-items: center !important;
        padding-top: 0 !important;
        padding-inline: 0;
        padding-bottom: 20px !important;
        text-align: center !important;
    }

    .index-documents-banner h1 {
        width: 92% !important;
        margin-inline: auto !important;
        text-align: center !important;
        font-size: clamp(27px, 8vw, 40px) !important;
    }
}

/* Testimonios: mismas tarjetas en todos los carruseles, movimiento continuo. */
.swiperTestimonials .swiper-wrapper {
    transition-timing-function: linear !important;
}

.swiperPartner .swiper-wrapper,
.swiperService .swiper-wrapper {
    transition-timing-function: linear !important;
}

@keyframes komoni-marquee-x {
    from {
        transform: translate3d(0, 0, 0);
    }

    to {
        transform: translate3d(-50%, 0, 0);
    }
}

.swiperPartner[data-marquee-carousel="true"],
.swiperService[data-marquee-carousel="true"] {
    overflow: hidden;
}

.swiperPartner[data-marquee-carousel="true"] .swiper-wrapper,
.swiperService[data-marquee-carousel="true"] .swiper-wrapper {
    width: max-content;
    will-change: transform;
    animation: komoni-marquee-x var(--komoni-marquee-duration, 34s) linear infinite;
}

.swiperPartner[data-marquee-carousel="true"] .swiper-wrapper {
    gap: 10px;
    --komoni-marquee-duration: 26s;
}

.swiperService[data-marquee-carousel="true"] .swiper-wrapper {
    align-items: stretch !important;
    gap: 24px;
    --komoni-marquee-duration: 38s;
}

.swiperPartner[data-marquee-carousel="true"] .swiper-slide {
    width: auto !important;
    flex: 0 0 min(42vw, 170px);
}

.swiperService[data-marquee-carousel="true"] .swiper-slide {
    width: auto !important;
    height: auto !important;
    display: flex !important;
    align-items: stretch !important;
    flex: 0 0 min(86vw, 370px);
}

.swiperService[data-marquee-carousel="true"] .card-service {
    width: 100%;
}

.swiperPartner[data-marquee-carousel="true"]:hover .swiper-wrapper,
.swiperService[data-marquee-carousel="true"]:hover .swiper-wrapper {
    animation-play-state: running;
}

@media (min-width: 768px) {
    .swiperService[data-marquee-carousel="true"] .swiper-slide {
        flex-basis: min(44vw, 370px);
    }
}

@media (min-width: 1200px) {
    .swiperService[data-marquee-carousel="true"] .swiper-slide {
        flex-basis: 360px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .swiperPartner[data-marquee-carousel="true"] .swiper-wrapper,
    .swiperService[data-marquee-carousel="true"] .swiper-wrapper {
        animation: none;
        transform: none;
    }
}

.swiperTestimonials .testimonial-container {
    min-height: 455px !important;
}

.swiperTestimonials .komoni-testimonial-text {
    max-width: 760px;
}

.swiperTestimonials .komoni-testimonial-avatar {
    display: grid;
    width: 100%;
    height: 100%;
    place-items: center;
    border-radius: 15px;
    background: linear-gradient(145deg, #0a8b52 0%, #3072ac 100%);
    color: #ffffff !important;
    font-family: var(--font-2);
    font-size: 1.05rem;
    font-weight: 800;
    letter-spacing: .08em;
}

.swiperTestimonials .komoni-testimonial-company {
    color: #3072ac !important;
    font-family: var(--font-2);
    font-size: .76rem;
    font-weight: 800;
    letter-spacing: .14em;
    line-height: 1.2;
    text-transform: uppercase;
}

.swiperTestimonials .customer-logo-item {
    width: 96px;
    padding: 8px;
}

.swiperTestimonials .customer-logo-item img {
    border-radius: 12px;
    object-fit: contain;
}

@media (max-width: 767px) {
    .swiperTestimonials .testimonial-container {
        min-height: 470px !important;
        padding: 28px 22px !important;
    }
}

/* Legales: banner homologado y sistema visual institucional. */
.legales-page .legal-hero {
    height: 70vh !important;
    min-height: 0 !important;
    max-width: 1816px !important;
    background-position: center !important;
    background-size: cover !important;
    border: none !important;
    box-shadow: none !important;
}

.legales-page .legal-hero::after {
    display: none !important;
    content: none !important;
}

.legales-page .legal-hero .r-container > .d-flex {
    justify-content: flex-end !important;
    align-items: center !important;
    max-width: none !important;
    padding-bottom: clamp(28px, 5vh, 58px) !important;
}

.legales-page .legal-hero h2 {
    width: min(92%, 1050px) !important;
    max-width: 1050px !important;
    margin-inline: auto !important;
    padding: clamp(14px, 1.7vw, 22px) clamp(18px, 2.2vw, 30px) !important;
    border: none !important;
    border-radius: 22px !important;
    background: rgba(0, 0, 0, .29) !important;
    box-shadow:
        0 0 18px 10px rgba(0, 0, 0, .22),
        0 0 42px 22px rgba(0, 0, 0, .12) !important;
    font-size: clamp(30px, 4vw, 58px) !important;
    line-height: 1.12 !important;
    text-align: center !important;
}

.legales-page .legal-hero-summary {
    display: none !important;
}

.legales-page main {
    background:
        radial-gradient(circle at 100% 16%, rgba(48, 114, 172, .07), transparent 25rem),
        radial-gradient(circle at 0 78%, rgba(10, 139, 82, .06), transparent 27rem),
        linear-gradient(180deg, #f7faf9 0%, #ffffff 42%, #f4f8f6 100%) !important;
}

.legales-page .legal-section {
    background: transparent !important;
}

.legales-page .legal-section .sub-heading {
    border-color: rgba(48, 114, 172, .16) !important;
    background: #ffffff !important;
    box-shadow: 0 10px 22px rgba(0, 38, 57, .06);
}

.legales-page .legal-section .sub-heading h6 {
    color: #3072ac !important;
}

.legales-page .legal-section h3 {
    color: #002639 !important;
}

.legales-page .legal-section p {
    color: #526474 !important;
}

.legales-page .legal-option-grid {
    gap: 20px !important;
}

.legales-page .legal-option-card {
    min-height: 148px;
    padding: 24px !important;
    border: 1px solid rgba(0, 38, 57, .1) !important;
    border-radius: 24px !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(248, 251, 250, .95)) !important;
    box-shadow: 0 16px 34px rgba(0, 38, 57, .08) !important;
    color: #002639 !important;
}

.legales-page .legal-option-card::before {
    content: "";
    position: absolute;
    inset: 18px auto 18px 0;
    width: 5px;
    border-radius: 0 999px 999px 0;
    background: #3072ac;
    opacity: .72;
}

.legales-page .legal-option-card:nth-child(even)::before {
    background: #0a8b52;
}

.legales-page .legal-option-card::after {
    height: 0 !important;
}

.legales-page .legal-option-card i,
.legales-page .compliance-option-grid.is-compact .compliance-option-card i {
    display: grid !important;
    width: 62px;
    height: 62px;
    place-items: center;
    flex: 0 0 62px;
    border: 1px solid rgba(255, 255, 255, .46) !important;
    border-radius: 18px;
    background: #3072ac !important;
    color: #ffffff !important;
    font-size: 1.55rem;
    box-shadow: 0 12px 24px rgba(48, 114, 172, .22) !important;
}

.legales-page .legal-option-card:nth-child(even) i,
.legales-page .compliance-option-card:nth-child(even) i {
    background: #0a8b52 !important;
    color: #ffffff !important;
    box-shadow: 0 12px 24px rgba(10, 139, 82, .2) !important;
}

body .legales-page .legal-option-card:nth-child(even) i,
body .legales-page .compliance-option-card:nth-child(even) i {
    background: #0a8b52 !important;
    color: #ffffff !important;
}

.legales-page .legal-option-card span {
    color: #002639 !important;
    line-height: 1.35;
}

.legales-page .legal-option-card:hover,
.legales-page .legal-option-card:focus-visible,
.legales-page .legal-option-card.active {
    transform: translateY(-6px);
    border-color: rgba(48, 114, 172, .28) !important;
    box-shadow: 0 24px 48px rgba(0, 38, 57, .14) !important;
}

.legales-page .legal-option-card:hover i,
.legales-page .legal-option-card:focus-visible i,
.legales-page .legal-option-card.active i {
    background: #002639 !important;
    border-color: #6d9e88 !important;
    color: #ffffff !important;
    transform: translateY(-3px);
}

.legales-page .legal-download-card {
    border: 1px solid rgba(0, 38, 57, .1) !important;
    border-radius: 26px;
    background: #ffffff !important;
    box-shadow: 0 18px 38px rgba(0, 38, 57, .08) !important;
}

.legales-page .legal-download-card::before {
    background: linear-gradient(90deg, #3072ac, #0a8b52) !important;
}

.legales-page .legal-download-icon {
    display: grid;
    width: 68px;
    height: 68px;
    place-items: center;
    border: 1px solid rgba(0, 38, 57, .12) !important;
    border-radius: 20px;
    background: #eef2f4 !important;
    box-shadow: 0 12px 24px rgba(0, 38, 57, .08) !important;
}

.legales-page .legal-download-icon i {
    color: #6b7780 !important;
}

.legales-page .legal-download-card:hover .legal-download-icon {
    background: #3072ac !important;
    border-color: #3072ac !important;
    transform: translateY(-3px);
}

.legales-page .legal-download-card:hover .legal-download-icon i {
    color: #ffffff !important;
}

.legales-page .legal-download-card .btn,
.legales-page .compliance-back-btn,
.legales-page .compliance-submit-btn,
.legales-page .compliance-form-actions .btn {
    border-radius: 999px !important;
}

.legales-page .legal-commission-box,
.legales-page .compliance-form-card,
.legales-page .compliance-form-box {
    border-color: rgba(0, 38, 57, .1) !important;
    background: #ffffff !important;
    box-shadow: 0 20px 44px rgba(0, 38, 57, .09) !important;
}

.legales-page .compliance-mini-icon {
    background: #eef2f4 !important;
    border: 1px solid rgba(0, 38, 57, .12) !important;
    color: #6b7780 !important;
}

.legales-page .compliance-mini-icon i {
    color: #6b7780 !important;
}

.legales-page .compliance-mini-card:hover .compliance-mini-icon,
.legales-page .compliance-mini-card.active .compliance-mini-icon {
    background: #3072ac !important;
    border-color: #3072ac !important;
}

.legales-page .compliance-mini-card:nth-child(even):hover .compliance-mini-icon,
.legales-page .compliance-mini-card:nth-child(even).active .compliance-mini-icon {
    background: #0a8b52 !important;
    border-color: #0a8b52 !important;
}

.legales-page .compliance-mini-card:hover .compliance-mini-icon i,
.legales-page .compliance-mini-card.active .compliance-mini-icon i {
    color: #ffffff !important;
}

@media (max-width: 767px) {
    .legales-page .legal-hero {
        height: 56vh !important;
        min-height: 420px !important;
        background-position: center !important;
    }

    .legales-page .legal-hero .r-container > .d-flex {
        padding-bottom: 20px !important;
    }

    .legales-page .legal-hero h2 {
        width: 92% !important;
        font-size: clamp(27px, 8vw, 40px) !important;
    }

    .legales-page .legal-option-card,
    .legales-page .compliance-option-grid.is-compact .compliance-option-card {
        min-height: 92px;
        padding: 16px 18px !important;
    }

    .legales-page .legal-option-card i,
    .legales-page .compliance-option-grid.is-compact .compliance-option-card i {
        width: 52px;
        height: 52px;
        flex-basis: 52px;
        border-radius: 15px;
        font-size: 1.3rem;
    }
}

/* Barra ajustadora del cotizador principal */
#loanWizard .loan-field input[type="range"] {
    --range-progress: 0%;
    --range-fill: var(--wizard-primary, #3072ac);
    --range-thumb: var(--range-fill);
    --range-track: rgba(255, 255, 255, .92);
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    height: 12px;
    border-radius: 999px;
    background: linear-gradient(
        to right,
        var(--range-fill) 0%,
        var(--range-fill) var(--range-progress),
        var(--range-track) var(--range-progress),
        var(--range-track) 100%
    ) !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .34), 0 5px 14px rgba(0, 38, 57, .18);
    cursor: pointer;
    outline: none;
    accent-color: var(--range-fill) !important;
}

#loanWizard.loan-theme-empresa .loan-field input[type="range"] {
    --range-fill: #3072ac;
    --range-thumb: #3f83c5;
}

#loanWizard.loan-theme-particular .loan-field input[type="range"] {
    --range-fill: #0a8b52;
    --range-thumb: #15a866;
}

#loanWizard .loan-field input[type="range"]::-webkit-slider-runnable-track {
    height: 12px;
    border-radius: 999px;
    background: transparent !important;
}

#loanWizard .loan-field input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 24px;
    height: 24px;
    margin-top: -6px;
    border: 0;
    border-radius: 50%;
    background: var(--range-thumb) !important;
    box-shadow: 0 0 0 3px rgba(255, 255, 255, .14), 0 4px 10px rgba(0, 38, 57, .28);
    cursor: pointer;
}

#loanWizard .loan-field input[type="range"]::-moz-range-track {
    height: 12px;
    border: 0;
    border-radius: 999px;
    background: var(--range-track) !important;
}

#loanWizard .loan-field input[type="range"]::-moz-range-progress {
    height: 12px;
    border-radius: 999px;
    background: var(--range-fill) !important;
}

#loanWizard .loan-field input[type="range"]::-moz-range-thumb {
    width: 24px;
    height: 24px;
    border: 0;
    border-radius: 50%;
    background: var(--range-thumb) !important;
    box-shadow: 0 0 0 3px rgba(255, 255, 255, .14), 0 4px 10px rgba(0, 38, 57, .28);
    cursor: pointer;
}

.loan-calculator-component .loan-ratio-note,
#loanWizard .loan-ratio-note {
    display: block;
    margin-top: 9px;
    padding: 8px 10px;
    border: 1px solid rgba(255, 255, 255, .24);
    border-left: 3px solid #f6c453;
    border-radius: 10px;
    background: rgba(246, 196, 83, .14);
    color: #ffffff !important;
    font-size: .82rem;
    line-height: 1.35;
}

.loan-calculator-component .loan-ratio-note.d-none,
#loanWizard .loan-ratio-note.d-none {
    display: none !important;
}

/* Performance/accessibility launch polish. Decorative labels keep their look without adding heading levels. */
.sub-heading p {
    margin: 0;
    color: inherit;
    font-family: var(--font-1);
    font-size: 18px;
    font-weight: 600;
    letter-spacing: inherit;
    line-height: inherit;
    text-transform: inherit;
}

#loanWizard .sub-heading p,
.loan-widget .sub-heading p,
#loanWizard.loan-theme-empresa .sub-heading p,
#loanWizard.loan-theme-particular .sub-heading p {
    color: #fff !important;
}

.section.bg-attach-cover .sub-heading p,
.komoni-soft-section .sub-heading p,
.section.bg-attach-cover .green,
.komoni-soft-section .green,
.accordion-button {
    color: #076b40 !important;
}

#header .nav-link {
    color: #545353 !important;
}

#header .nav-link.active,
#header .nav-link:hover,
#header .nav-link:focus-visible {
    color: #076b40 !important;
}

.komoni-feature-title,
.komoni-card-title,
.komoni-counter-label,
.komoni-testimonial-name,
.komoni-image-caption,
.komoni-section-title {
    margin: 0;
    font-family: var(--font-1);
    line-height: 1.25;
}

.komoni-section-title {
    color: inherit;
    font-size: 54px;
    font-weight: 500;
}

.komoni-feature-title {
    color: #076b40 !important;
    font-size: 24px;
    font-weight: 300;
}

.swiperService .card-service .komoni-card-title {
    color: inherit;
    font-size: 24px;
    font-weight: 300;
}

.komoni-counter-label {
    color: #fff !important;
    font-size: 24px;
    font-weight: 300;
    text-align: center;
}

.komoni-testimonial-name {
    color: inherit;
    font-size: 24px;
    font-weight: 300;
}

.komoni-image-caption {
    color: inherit;
    font-size: 24px;
    font-weight: 300;
}

.swiperService .portfolio-card-green {
    background: #076b40 !important;
}

@media (max-width: 767px) {
    .komoni-section-title {
        font-size: clamp(32px, 9vw, 42px);
        line-height: 1.16;
    }
}

/* Header flotante: logo independiente y menu centrado. */
#header.site-floating-header {
    inset: 0 0 auto 0 !important;
    width: 100%;
    height: 0;
    z-index: 1055 !important;
    overflow: visible !important;
    pointer-events: none;
    transition: none;
}

#header.site-floating-header .floating-logo,
#header.site-floating-header .floating-navigation {
    transition:
        width .3s ease,
        min-height .3s ease,
        padding .3s ease,
        top .3s ease,
        box-shadow .3s ease,
        border-radius .3s ease;
}

#header.site-floating-header .floating-logo {
    position: fixed;
    top: 24px;
    left: 28px;
    z-index: 1057;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 150px;
    min-height: 88px;
    padding: 12px 14px;
    border-radius: 16px;
    background: #0a8b52;
    box-shadow: 0 14px 34px rgba(0, 38, 57, .18);
    pointer-events: auto;
}

#header.site-floating-header .floating-logo img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
}

#header.site-floating-header .floating-navigation {
    position: fixed;
    top: 24px;
    left: 50%;
    z-index: 1056;
    width: auto;
    margin: 0 !important;
    padding: 0 !important;
    transform: translateX(-50%);
    pointer-events: none;
}

#header.site-floating-header .floating-navigation .container-fluid {
    width: auto !important;
    min-height: 64px;
    margin: 0 !important;
    padding: 6px 20px !important;
    border: 1px solid rgba(0, 38, 57, .06);
    border-radius: 16px !important;
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 14px 34px rgba(0, 38, 57, .12);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

#header.site-floating-header .floating-navigation .container-fluid,
#header.site-floating-header .floating-navigation .container-fluid *,
#header.site-floating-header .dropdown-menu,
#header.site-floating-header .dropdown-menu * {
    pointer-events: auto;
}

#header.site-floating-header.header-scrolled .floating-logo {
    top: 18px;
    width: 108px;
    min-height: 64px;
    padding: 8px 10px;
    border-radius: 14px;
    box-shadow: 0 12px 28px rgba(0, 38, 57, .16);
}

#header.site-floating-header.header-scrolled .floating-navigation {
    top: 18px;
}

#header.site-floating-header.header-scrolled .floating-navigation .container-fluid {
    min-height: 64px;
    padding-block: 4px !important;
}

@media (min-width: 1200px) {
    .komoni-notice-widget {
        top: 138px;
    }
}

@media (max-width: 1399px) and (min-width: 1200px) {
    #header.site-floating-header .floating-logo {
        left: 22px;
        width: 132px;
        min-height: 80px;
    }

    #header.site-floating-header .floating-navigation .container-fluid {
        padding-inline: 14px !important;
    }

    #header.site-floating-header .nav-link {
        padding-inline: .62rem !important;
        font-size: 14px !important;
    }

    #header.site-floating-header .navbar-nav {
        gap: .18rem !important;
    }
}

@media (max-width: 1199px) {
    #header.site-floating-header {
        height: auto;
        padding: 8px 12px 0;
    }

    #header.site-floating-header .floating-logo {
        position: absolute;
        top: 8px;
        left: 12px;
        width: 68px;
        min-height: 58px;
        padding: 5px;
        border-radius: 14px;
        box-shadow: 0 10px 24px rgba(0, 38, 57, .16);
    }

    #header.site-floating-header.header-scrolled .floating-logo {
        top: 8px;
        width: 58px;
        min-height: 52px;
        padding: 5px;
    }

    #header.site-floating-header .floating-navigation,
    #header.site-floating-header.header-scrolled .floating-navigation {
        position: relative;
        top: auto;
        left: auto;
        width: 100% !important;
        transform: none;
    }

    #header.site-floating-header .floating-navigation .container-fluid {
        width: 100% !important;
        min-height: 64px;
        padding: 8px 10px 8px 88px !important;
        justify-content: flex-end !important;
    }

    #header.site-floating-header.header-scrolled .floating-navigation .container-fluid {
        padding-left: 78px !important;
    }

    #header.site-floating-header .navbar-collapse {
        top: 82px;
    }
}

@media (max-width: 575px) {
    #header.site-floating-header {
        padding-inline: 8px;
    }

    #header.site-floating-header .floating-logo {
        left: 8px;
        width: 62px;
        min-height: 52px;
    }

    #header.site-floating-header.header-scrolled .floating-logo {
        width: 56px;
        min-height: 48px;
    }

    #header.site-floating-header .floating-navigation .container-fluid {
        min-height: 60px;
        padding-left: 76px !important;
    }

    #header.site-floating-header.header-scrolled .floating-navigation .container-fluid {
        padding-left: 70px !important;
    }

    #header.site-floating-header .navbar-collapse {
        top: 76px;
        max-height: calc(100svh - 86px);
    }
}

/* Boton flotante de WhatsApp global. */
.floating-whatsapp {
    position: fixed;
    right: 24px;
    bottom: calc(24px + env(safe-area-inset-bottom, 0px));
    z-index: 1040;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background-color: #25d366;
    color: #ffffff !important;
    font-size: 32px;
    line-height: 1;
    text-decoration: none;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .22);
    transition:
        transform .25s ease,
        box-shadow .25s ease,
        background-color .25s ease;
}

.floating-whatsapp i {
    color: #ffffff !important;
}

.floating-whatsapp:hover {
    transform: translateY(-3px) scale(1.06);
    background-color: #20bd5a;
    color: #ffffff !important;
    box-shadow: 0 12px 30px rgba(0, 0, 0, .28);
}

.floating-whatsapp:focus-visible {
    outline: 3px solid rgba(37, 211, 102, .4);
    outline-offset: 4px;
}

@media (max-width: 768px) {
    .floating-whatsapp {
        right: 16px;
        bottom: calc(16px + env(safe-area-inset-bottom, 0px));
        width: 54px;
        height: 54px;
        font-size: 29px;
    }
}
