/* DevSuite Demo Frontend Override */

:root{
  --ds-primary: #1f67ff;
  --ds-primary-dark: #0b1f5f;
  --ds-primary-soft: #eef4ff;
  --ds-accent: #5aaeff;
  --ds-text: #081b4b;
  --ds-text-soft: #5f718f;
  --ds-border: #d8e3f2;
  --ds-bg: #ffffff;
  --ds-bg-soft: #f8fbff;
  --ds-shadow: 0 14px 34px rgba(31,103,255,.14);
}

/* Base */
html, body{
  background: var(--ds-bg) !important;
  color: var(--ds-text) !important;
}

body{
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

a{
  color: var(--ds-primary);
}

a:hover,
a:focus{
  color: var(--ds-primary-dark);
}

/* Header / navegación */
header,
.header-area,
.main-header,
.header-navigation,
.menu-area,
.navbar-area,
.sticky-header{
  background: linear-gradient(90deg, #ffffff 0%, #f8fbff 100%) !important;
  border-bottom: 1px solid var(--ds-border) !important;
}

/* Logo: reducir aprox 40% vs estado actual */
header .logo img,
header .navbar-brand img,
.header-area .logo img,
.header-area .navbar-brand img,
.main-header .logo img,
.header-navigation .logo img,
.menu-area .logo img,
.navbar-area .logo img,
.sticky-header .logo img{
  max-height: 78px !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
}

header .logo,
header .navbar-brand,
.header-area .logo,
.header-area .navbar-brand,
.main-header .logo,
.header-navigation .logo,
.menu-area .logo{
  display: flex !important;
  align-items: center !important;
  padding-top: 8px !important;
  padding-bottom: 8px !important;
}

@media (max-width: 991px){
  header .logo img,
  header .navbar-brand img,
  .header-area .logo img,
  .header-area .navbar-brand img,
  .main-header .logo img,
  .header-navigation .logo img,
  .menu-area .logo img,
  .navbar-area .logo img,
  .sticky-header .logo img{
    max-height: 56px !important;
  }
}

/* Menú */
.main-menu li a,
.main-menu a,
.navbar-nav .nav-link,
header .menu li a,
header ul li a{
  color: var(--ds-text) !important;
  font-weight: 700 !important;
}

.main-menu li a:hover,
.main-menu li.active > a,
.main-menu .active > a,
.navbar-nav .nav-link:hover,
.navbar-nav .active > .nav-link,
header .menu li a:hover,
header ul li a:hover{
  color: var(--ds-primary) !important;
}

/* Títulos */
h1, h2, h3, h4, h5, h6,
.hero-content h1,
.hero-content h2,
.banner-content h1,
.banner-content h2,
.section-title h2,
.page-title h2{
  color: var(--ds-text) !important;
}

/* Subtítulos y textos suaves */
p,
.hero-content p,
.banner-content p,
.section-title p,
.text-muted{
  color: var(--ds-text-soft) !important;
}

.subtitle,
.sub-title,
.section-title span,
.hero-content span,
.banner-content span{
  color: var(--ds-primary) !important;
}

/* Botones primarios */
.btn,
.btn-primary,
.theme-btn,
.main-btn,
button[type="submit"],
input[type="submit"],
a.btn,
a.theme-btn{
  background: var(--ds-primary) !important;
  border-color: var(--ds-primary) !important;
  color: #ffffff !important;
  box-shadow: var(--ds-shadow) !important;
}

.btn:hover,
.btn:focus,
.btn-primary:hover,
.btn-primary:focus,
.theme-btn:hover,
.theme-btn:focus,
.main-btn:hover,
.main-btn:focus,
button[type="submit"]:hover,
input[type="submit"]:hover{
  background: var(--ds-primary-dark) !important;
  border-color: var(--ds-primary-dark) !important;
  color: #ffffff !important;
}

/* Botones outline / secundarios */
.btn-outline,
.btn-outline-primary,
.outline-btn,
.bordered-btn,
a.btn-outline,
a.outline-btn{
  background: #ffffff !important;
  color: var(--ds-primary) !important;
  border: 1px solid var(--ds-primary) !important;
  box-shadow: none !important;
}

.btn-outline:hover,
.btn-outline-primary:hover,
.outline-btn:hover,
.bordered-btn:hover{
  background: var(--ds-primary) !important;
  color: #ffffff !important;
}

/* Inputs / selects */
input,
textarea,
select,
.nice-select{
  border-color: var(--ds-border) !important;
  color: var(--ds-text) !important;
}

input:focus,
textarea:focus,
select:focus,
.nice-select:focus,
.nice-select.open{
  border-color: var(--ds-primary) !important;
  box-shadow: 0 0 0 .2rem rgba(31,103,255,.12) !important;
}

/* Badges / chips */
.badge,
.tag,
.property-status,
.listing-badge,
.status-badge{
  background: var(--ds-primary-soft) !important;
  color: var(--ds-primary) !important;
  border: 1px solid rgba(31,103,255,.20) !important;
}

/* Paginación */
.pagination .page-item.active .page-link,
.pagination .active span,
.pagination .active a{
  background: var(--ds-primary) !important;
  border-color: var(--ds-primary) !important;
  color: #fff !important;
}

/* Cards */
.card,
.property-item,
.single-property,
.single-feature,
.single-blog,
.single-counter{
  border-color: rgba(8,27,75,.06) !important;
  box-shadow: 0 10px 26px rgba(8,27,75,.05) !important;
}

/* Footer público */
footer,
.footer-area{
  background: #ffffff !important;
  border-top: 1px solid var(--ds-border) !important;
}

footer a,
.footer-area a{
  color: var(--ds-text) !important;
}

footer a:hover,
.footer-area a:hover{
  color: var(--ds-primary) !important;
}

/* ==========================================================================
   DevSuite — preloader y colores residuales
   ========================================================================== */

:root{
  --ds-blue: #1267ff;
  --ds-blue-dark: #0b1f5f;
  --ds-blue-soft: #eaf2ff;
  --ds-navy: #081b4b;
}

/* --------------------------------------------------------------------------
   PRELOADER
   Reemplaza iconos/casas del loader por logo DevSuite
   -------------------------------------------------------------------------- */

.preloader,
.loader,
.page-loader,
#preloader,
.preloader-area,
.preloader-wrapper{
  background: #ffffff !important;
}

.preloader i,
.loader i,
.page-loader i,
#preloader i,
.preloader-area i,
.preloader-wrapper i,
.preloader .fa,
.loader .fa,
.preloader .fas,
.loader .fas{
  display: none !important;
}

.preloader::after,
.loader::after,
.page-loader::after,
#preloader::after,
.preloader-area::after,
.preloader-wrapper::after{
  content: "" !important;
  display: block !important;
  width: 150px !important;
  height: 52px !important;
  background-image: url('/assets/img/devsuite-preloader.png') !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  animation: devsuitePulse 1.2s ease-in-out infinite !important;
}

@keyframes devsuitePulse{
  0%,100%{
    opacity:.65;
    transform:scale(.96);
  }
  50%{
    opacity:1;
    transform:scale(1);
  }
}

/* --------------------------------------------------------------------------
   NARANJA → AZUL DEVSUITE
   -------------------------------------------------------------------------- */

.text-primary,
.text-theme,
.text-orange,
.text-warning{
  color: var(--ds-blue) !important;
}

.bg-primary,
.bg-theme,
.bg-orange{
  background-color: var(--ds-blue) !important;
}

.border-primary,
.border-theme,
.border-orange{
  border-color: var(--ds-blue) !important;
}

/* botones */
.btn-primary,
.theme-btn,
.main-btn,
.primary-btn,
button[type="submit"],
input[type="submit"]{
  background: var(--ds-blue) !important;
  border-color: var(--ds-blue) !important;
  color:#fff !important;
}

.btn-primary:hover,
.theme-btn:hover,
.main-btn:hover,
.primary-btn:hover,
button[type="submit"]:hover,
input[type="submit"]:hover{
  background: var(--ds-blue-dark) !important;
  border-color: var(--ds-blue-dark) !important;
}

/* flechas / carruseles */
.slick-arrow,
.owl-nav button,
.swiper-button-next,
.swiper-button-prev,
.slider-btn,
.testimonial-slider .slick-arrow,
.testimonial-area .slick-arrow,
.hero-slider .slick-arrow{
  background: var(--ds-blue) !important;
  border-color: var(--ds-blue) !important;
  color:#fff !important;
}

.slick-arrow:hover,
.owl-nav button:hover,
.swiper-button-next:hover,
.swiper-button-prev:hover,
.slider-btn:hover{
  background: var(--ds-blue-dark) !important;
  border-color: var(--ds-blue-dark) !important;
}

/* bordes decorativos */
.testimonial-item,
.testimonial-card,
.single-testimonial,
.testimonial-area .item,
.testimonial-area .single-item{
  border-color: var(--ds-blue) !important;
}

.testimonial-item::before,
.testimonial-item::after,
.single-testimonial::before,
.single-testimonial::after{
  border-color: var(--ds-blue) !important;
}

/* enlaces y estados activos */
a:hover,
a:focus,
.menu li.active > a,
.navbar-nav .active > .nav-link{
  color: var(--ds-blue) !important;
}

/* paginación */
.pagination .page-item.active .page-link,
.pagination .active > a,
.pagination .active > span{
  background: var(--ds-blue) !important;
  border-color: var(--ds-blue) !important;
  color:#fff !important;
}

/* iconos decorativos */
.icon,
.feature-icon,
.service-icon,
.property-icon,
.testimonial-icon{
  color: var(--ds-blue) !important;
}

/* volver arriba */
.back-to-top,
.scroll-top,
.scroll-to-top,
#scrollUp{
  background: var(--ds-blue) !important;
  border-color: var(--ds-blue) !important;
  color:#fff !important;
}

.back-to-top:hover,
.scroll-top:hover,
.scroll-to-top:hover,
#scrollUp:hover{
  background: var(--ds-blue-dark) !important;
}

/* estrellas se mantienen amarillas por semántica */
.rating i,
.star-rating i,
.fa-star{
  color:#ffc107 !important;
}



/* ==========================================================================
   DevSuite — Footer corporativo Byonixs
   ========================================================================== */

.ds-footer{
    position:relative;
    background:#ffffff !important;
    color:#081B4B !important;
    border-top:1px solid #dce7f7 !important;
    margin:0 !important;
    padding:0 !important;
}

.ds-footer::before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:3px;
    background:linear-gradient(
        90deg,
        #1267FF 0%,
        #58A6FF 45%,
        #1267FF 100%
    );
}

.ds-footer-main{
    padding:58px 0 46px;
    background:#ffffff;
}

.ds-footer-grid{
    display:grid;
    grid-template-columns:minmax(320px,1.8fr) 1fr 1.1fr 1fr;
    gap:58px;
    align-items:start;
}

.ds-footer-brand{
    max-width:460px;
}

.ds-footer-logo{
    display:inline-block;
    margin-bottom:22px;
}

.ds-footer-logo img{
    display:block;
    width:auto;
    height:auto;
    max-width:285px;
    max-height:88px;
    object-fit:contain;
}

.ds-footer-description{
    margin:0 0 18px !important;
    max-width:445px;
    color:#5f718f !important;
    font-size:15px !important;
    line-height:1.75 !important;
    font-weight:400 !important;
}

.ds-footer-by{
    color:#70819c;
    font-size:13px;
    letter-spacing:.02em;
}

.ds-footer-by strong{
    color:#1267FF;
    font-weight:700;
}

.ds-footer-column{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:12px;
}

.ds-footer-column h4{
    margin:5px 0 10px !important;
    padding:0 !important;
    color:#081B4B !important;
    font-size:16px !important;
    line-height:1.3 !important;
    font-weight:700 !important;
    letter-spacing:.01em;
}

.ds-footer-column a,
.ds-footer-column span{
    display:block;
    margin:0;
    padding:0;
    color:#5f718f !important;
    font-size:14px !important;
    line-height:1.5 !important;
    text-decoration:none !important;
    transition:
        color .2s ease,
        transform .2s ease;
}

.ds-footer-column a:hover{
    color:#1267FF !important;
    transform:translateX(2px);
}

.ds-footer-contact a{
    color:#1267FF !important;
    font-weight:600;
}

.ds-footer-bottom{
    background:#f8fbff !important;
    border-top:1px solid #e3ebf7;
}

.ds-footer-bottom-inner{
    min-height:66px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    color:#71829d;
    font-size:13px;
}

.ds-footer-byonixs{
    color:#081B4B;
    font-weight:600;
}


/* --------------------------------------------------------------------------
   Eliminar cualquier estilo heredado del footer anterior
   -------------------------------------------------------------------------- */

.ds-footer .footer-widget,
.ds-footer .footer-widget-area,
.ds-footer .social-link,
.ds-footer .newsletter-form{
    all:unset;
}


/* --------------------------------------------------------------------------
   Tablet
   -------------------------------------------------------------------------- */

@media (max-width:1199px){

    .ds-footer-grid{
        grid-template-columns:1.5fr 1fr 1fr;
        gap:42px;
    }

    .ds-footer-contact{
        grid-column:2 / 4;
    }

}


/* --------------------------------------------------------------------------
   Mobile
   -------------------------------------------------------------------------- */

@media (max-width:767px){

    .ds-footer-main{
        padding:42px 0 30px;
    }

    .ds-footer-grid{
        grid-template-columns:1fr;
        gap:30px;
    }

    .ds-footer-brand{
        max-width:none;
    }

    .ds-footer-logo img{
        max-width:230px;
        max-height:70px;
    }

    .ds-footer-description{
        max-width:none;
    }

    .ds-footer-contact{
        grid-column:auto;
    }

    .ds-footer-bottom-inner{
        min-height:auto;
        padding:20px 0;
        flex-direction:column;
        align-items:flex-start;
        gap:6px;
    }

}


/* --------------------------------------------------------------------------
   Ocultar restos de footer anterior si quedaron fuera del partial
   -------------------------------------------------------------------------- */

.footer-area:not(.ds-footer),
.footer-v1:not(.ds-footer),
.footer-v2:not(.ds-footer),
.footer-v3:not(.ds-footer){
    border-color:#dce7f7;
}

/* DEVSUITE_FOOTER_MINIMAL_START */
.devsuite-footer-minimal{
    background:#ffffff;
    border-top:1px solid rgba(8,27,75,.08);
    padding:32px 16px 28px;
}
.devsuite-footer-minimal__inner{
    max-width:1180px;
    margin:0 auto;
    display:flex;
    justify-content:center;
    align-items:center;
}
.devsuite-footer-minimal__brand{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    text-decoration:none;
    line-height:0;
}
.devsuite-footer-minimal__brand img{
    display:block;
    width:100%;
    max-width:min(320px,70vw);
    height:auto;
}
@media (max-width: 768px){
    .devsuite-footer-minimal{
        padding:24px 14px 22px;
    }
    .devsuite-footer-minimal__brand img{
        max-width:min(250px,76vw);
    }
}
/* DEVSUITE_FOOTER_MINIMAL_END */

/* DEVSUITE_AGENCY_FEATURES_START */

.ds-agency-features{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
    width:100%;
    margin-top:24px;
}

.ds-agency-feature{
    min-height:78px;
    display:flex;
    align-items:center;
    gap:14px;
    padding:14px 16px;
    background:#fff;
    border:1px solid #e3eaf5;
    border-radius:12px;
    box-shadow:0 5px 16px rgba(8,27,75,.035);
    overflow:hidden;
    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}

.ds-agency-feature:hover{
    transform:translateY(-2px);
    border-color:rgba(18,103,255,.32);
    box-shadow:0 9px 22px rgba(18,103,255,.075);
}

.ds-agency-feature-icon{
    flex:0 0 44px;
    width:44px;
    height:44px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:11px;
    background:#f0f5ff;
    color:#1267FF;
    font-size:19px;
}

.ds-agency-feature h4{
    margin:0 !important;
    padding:0 !important;
    color:#081B4B !important;
    font-size:16px !important;
    line-height:1.35 !important;
    font-weight:700 !important;
    text-transform:none !important;
    overflow-wrap:normal !important;
    word-break:normal !important;
}

.ds-agency-feature p{
    display:none !important;
}

/*
 * Reducimos únicamente el gran encabezado de la sección que contiene
 * nuestros features, sin afectar otros títulos del sitio.
 */
section:has(.ds-agency-features) .section-title .title,
section:has(.ds-agency-features) .section-title h2,
section:has(.ds-agency-features) h2.title{
    font-size:clamp(36px,3.3vw,52px) !important;
    line-height:1.12 !important;
    letter-spacing:-1px !important;
    max-width:620px;
}

@media (max-width:1199px){

    .ds-agency-feature{
        min-height:76px;
    }

    .ds-agency-feature h4{
        font-size:15px !important;
    }
}

@media (max-width:767px){

    .ds-agency-features{
        grid-template-columns:1fr;
        gap:10px;
        margin-top:20px;
    }

    .ds-agency-feature{
        min-height:68px;
        padding:12px 14px;
    }

    .ds-agency-feature-icon{
        flex-basis:40px;
        width:40px;
        height:40px;
        font-size:18px;
    }

    .ds-agency-feature h4{
        font-size:15px !important;
    }

    section:has(.ds-agency-features) .section-title .title,
    section:has(.ds-agency-features) .section-title h2,
    section:has(.ds-agency-features) h2.title{
        font-size:34px !important;
        line-height:1.12 !important;
    }
}

/* DEVSUITE_AGENCY_FEATURES_END */

/* DEVSUITE_NATURAL_CASE_START */

/*
 * DevSuite:
 * respetar exactamente la capitalización escrita en el contenido.
 * No convertir automáticamente cada palabra a mayúscula inicial.
 */

body,
body a,
body button,
body input,
body select,
body textarea,
body label,
body span,
body p,
body li,
body h1,
body h2,
body h3,
body h4,
body h5,
body h6,
.title,
.subtitle,
.sub-title,
.section-title,
.section-title h1,
.section-title h2,
.section-title h3,
.nav-link,
.main-menu a,
.breadcrumb-item,
.btn,
.theme-btn,
.ds-agency-feature h4{
    text-transform:none !important;
}

/* DEVSUITE_NATURAL_CASE_END */

/* DEVSUITE_POPUP24_START */

/*
 * Popup 24 — Email Popup
 * Ajuste aislado DevSuite.
 */

/* El wrapper sigue cubriendo la pantalla para conservar el overlay */
#modal-popup-24{
    box-sizing:border-box !important;
    padding:20px !important;
}

/*
 * Cualquiera de las variantes internas del componente.
 * Solo aplica dentro del popup id 24.
 */
#modal-popup-24 .popup-one,
#modal-popup-24 .popup-two,
#modal-popup-24 .popup-three,
#modal-popup-24 .popup-four,
#modal-popup-24 .popup-five,
#modal-popup-24 .popup-six{
    width:min(560px,92vw) !important;
    max-width:560px !important;
    max-height:88vh !important;
    margin:auto !important;
    overflow:auto !important;
    border-radius:14px !important;
    box-shadow:0 22px 60px rgba(8,27,75,.24) !important;
}

/* Imagen: nunca deformar */
#modal-popup-24 img{
    display:block !important;
    width:100% !important;
    height:210px !important;
    max-height:210px !important;
    object-fit:cover !important;
    object-position:center !important;
}

/* Contenido */
#modal-popup-24 .popup_main-content{
    padding:24px 26px 26px !important;
}

/* Título */
#modal-popup-24 .popup_main-content h1{
    margin:0 0 10px !important;
    font-size:25px !important;
    line-height:1.25 !important;
    text-align:center !important;
    color:#081B4B !important;
    text-transform:none !important;
}

/* Texto */
#modal-popup-24 .popup_main-content p{
    margin:0 0 18px !important;
    font-size:15px !important;
    line-height:1.55 !important;
    text-align:center !important;
}

/* Input */
#modal-popup-24 input[type="email"],
#modal-popup-24 input[type="text"]{
    width:100% !important;
    height:48px !important;
    min-height:48px !important;
    padding:0 16px !important;
    font-size:15px !important;
    border-radius:9px !important;
}

/* Botón */
#modal-popup-24 .popup-main-btn{
    width:100% !important;
    min-height:48px !important;
    padding:12px 18px !important;
    margin-top:12px !important;
    border-radius:9px !important;
    font-size:15px !important;
    line-height:1.3 !important;
}

/* X siempre accesible */
#modal-popup-24 .popup-close,
#modal-popup-24 .mfp-close,
#modal-popup-24 button[class*="close"]{
    position:absolute !important;
    top:10px !important;
    right:10px !important;
    z-index:50 !important;
}

/* TABLET */
@media (max-width:767px){

    #modal-popup-24{
        padding:14px !important;
    }

    #modal-popup-24 .popup-one,
    #modal-popup-24 .popup-two,
    #modal-popup-24 .popup-three,
    #modal-popup-24 .popup-four,
    #modal-popup-24 .popup-five,
    #modal-popup-24 .popup-six{
        width:min(380px,92vw) !important;
        max-width:380px !important;
        max-height:86vh !important;
        border-radius:12px !important;
    }

    #modal-popup-24 img{
        height:150px !important;
        max-height:150px !important;
        object-fit:cover !important;
        object-position:center !important;
    }

    #modal-popup-24 .popup_main-content{
        padding:20px 18px 20px !important;
    }

    #modal-popup-24 .popup_main-content h1{
        font-size:21px !important;
        line-height:1.25 !important;
        margin-bottom:8px !important;
    }

    #modal-popup-24 .popup_main-content p{
        font-size:14px !important;
        line-height:1.45 !important;
        margin-bottom:15px !important;
    }

    #modal-popup-24 input[type="email"],
    #modal-popup-24 input[type="text"]{
        height:44px !important;
        min-height:44px !important;
        font-size:14px !important;
    }

    #modal-popup-24 .popup-main-btn{
        min-height:44px !important;
        padding:10px 15px !important;
        font-size:14px !important;
        margin-top:10px !important;
    }
}

/* MÓVILES PEQUEÑOS */
@media (max-width:430px){

    #modal-popup-24{
        padding:10px !important;
    }

    #modal-popup-24 .popup-one,
    #modal-popup-24 .popup-two,
    #modal-popup-24 .popup-three,
    #modal-popup-24 .popup-four,
    #modal-popup-24 .popup-five,
    #modal-popup-24 .popup-six{
        width:min(350px,94vw) !important;
        max-width:350px !important;
        max-height:84vh !important;
    }

    #modal-popup-24 img{
        height:125px !important;
        max-height:125px !important;
    }

    #modal-popup-24 .popup_main-content{
        padding:17px 15px 18px !important;
    }

    #modal-popup-24 .popup_main-content h1{
        font-size:19px !important;
    }
}

/* DEVSUITE_POPUP24_END */

/* DEVSUITE_PRELOADER_SINGLE_START */

/*
 * El HTML nativo ya contiene:
 *   #preLoader .loader .icon img
 *
 * Por tanto eliminamos cualquier segundo logo creado
 * mediante pseudo-elementos del override anterior.
 */

#preLoader .loader::before,
#preLoader .loader::after,
#preLoader::before,
#preLoader::after{
    background-image:none !important;
}

#preLoader .loader::after{
    content:none !important;
    display:none !important;
}

/* Un único logo real dentro del loader */
#preLoader .loader .icon{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    position:absolute !important;
    inset:0 !important;
    margin:auto !important;
    z-index:2 !important;
    pointer-events:none !important;
}

#preLoader .loader .icon img{
    display:block !important;
    width:120px !important;
    max-width:120px !important;
    height:auto !important;
    object-fit:contain !important;
}

/* Móvil */
@media (max-width:767px){
    #preLoader .loader .icon img{
        width:105px !important;
        max-width:105px !important;
    }
}

/* DEVSUITE_PRELOADER_SINGLE_END */

/* DEVSUITE_TECH_ORBITS_START */

/* ================================================================
   DevSuite — fondo tecnológico orbital
   ================================================================ */

.site-tech-background{
    position:fixed !important;
    inset:0 !important;
    width:100% !important;
    height:100% !important;

    overflow:hidden !important;
    pointer-events:none !important;
    user-select:none !important;

    z-index:8 !important;

    contain:layout paint;
}


/*
   Los elementos del sitio continúan siendo interactivos.
   La capa tecnológica nunca captura clicks.
*/

.site-tech-background,
.site-tech-background *{
    pointer-events:none !important;
}


/* ------------------------------------------------
   PUNTOS DE FONDO
   ------------------------------------------------ */

.site-tech-background .tech-dots{
    position:absolute !important;
    inset:0 !important;

    opacity:.25 !important;

    background-image:
        radial-gradient(
            circle,
            rgba(18,103,255,.25) 1px,
            transparent 1.4px
        ) !important;

    background-size:
        34px 34px !important;

    mask-image:
        linear-gradient(
            to bottom,
            transparent 0%,
            #000 12%,
            #000 88%,
            transparent 100%
        );

    -webkit-mask-image:
        linear-gradient(
            to bottom,
            transparent 0%,
            #000 12%,
            #000 88%,
            transparent 100%
        );
}


/* ------------------------------------------------
   GLOWS
   ------------------------------------------------ */

.site-tech-background .tech-glow{
    position:absolute !important;

    border-radius:50% !important;

    filter:blur(45px) !important;

    opacity:.10 !important;

    background:
        radial-gradient(
            circle,
            rgba(18,103,255,.75) 0%,
            rgba(18,103,255,.20) 45%,
            transparent 72%
        ) !important;
}

.site-tech-background .glow-a{
    width:420px !important;
    height:420px !important;

    right:-120px !important;
    top:5% !important;
}

.site-tech-background .glow-b{
    width:520px !important;
    height:520px !important;

    left:-250px !important;
    top:40% !important;
}

.site-tech-background .glow-c{
    width:360px !important;
    height:360px !important;

    right:4% !important;
    bottom:-110px !important;
}


/* ------------------------------------------------
   ÓRBITAS
   ------------------------------------------------ */

.site-tech-background .tech-orbit{
    position:absolute !important;

    border-radius:50% !important;

    border:
        2px solid
        rgba(18,103,255,.13) !important;

    box-shadow:
        0 0 28px rgba(39,128,255,.06),
        inset 0 0 28px rgba(39,128,255,.035) !important;

    opacity:.82 !important;

    will-change:transform;

    background:
        radial-gradient(
            circle at center,
            transparent 0 55%,
            rgba(33,125,255,.04) 56%,
            transparent 58%
        ),

        conic-gradient(
            from 25deg,

            transparent 0deg 18deg,
            rgba(18,104,255,.24) 18deg 38deg,
            transparent 38deg 108deg,

            rgba(79,177,255,.24) 108deg 126deg,
            transparent 126deg 206deg,

            rgba(18,104,255,.20) 206deg 224deg,
            transparent 224deg 308deg,

            rgba(70,165,255,.20) 308deg 326deg,
            transparent 326deg 360deg
        ) !important;

    outline:
        1px solid
        rgba(31,117,255,.12) !important;
}


/* anillo interior */

.site-tech-background .tech-orbit::before{
    content:"" !important;

    position:absolute !important;
    inset:9% !important;

    border-radius:50% !important;

    border:
        1.5px dashed
        rgba(38,139,255,.25) !important;

    animation:
        devsuiteDemoRingRotate
        20s linear infinite !important;
}


/* punto orbital */

.site-tech-background .tech-orbit::after{
    content:"" !important;

    position:absolute !important;

    width:11px !important;
    height:11px !important;

    top:8% !important;
    left:50% !important;

    transform:
        translateX(-50%) !important;

    border-radius:50% !important;

    background:
        radial-gradient(
            circle,
            #ffffff 0 18%,
            #47a3ff 22% 48%,
            #0764ff 52% 100%
        ) !important;

    box-shadow:
        0 0 10px rgba(38,143,255,.90),
        0 0 24px rgba(38,143,255,.45) !important;
}


/* ------------------------------------------------
   POSICIONES
   ------------------------------------------------ */

.site-tech-background .orbit-one{
    width:430px !important;
    height:430px !important;

    right:-115px !important;
    top:7% !important;

    animation:
        devsuiteDemoOrbitA
        18s ease-in-out infinite !important;
}


.site-tech-background .orbit-two{
    width:620px !important;
    height:620px !important;

    left:-300px !important;
    top:42% !important;

    animation:
        devsuiteDemoOrbitB
        24s ease-in-out infinite !important;
}


.site-tech-background .orbit-three{
    width:340px !important;
    height:340px !important;

    right:7% !important;
    bottom:-90px !important;

    animation:
        devsuiteDemoOrbitC
        21s ease-in-out infinite !important;
}


/* ------------------------------------------------
   ANIMACIONES
   ------------------------------------------------ */

@keyframes devsuiteDemoRingRotate{
    from{
        transform:rotate(0deg);
    }

    to{
        transform:rotate(360deg);
    }
}


@keyframes devsuiteDemoOrbitA{
    0%,
    100%{
        transform:
            translate3d(0,0,0)
            rotate(0deg);
    }

    50%{
        transform:
            translate3d(-12px,24px,0)
            rotate(4deg);
    }
}


@keyframes devsuiteDemoOrbitB{
    0%,
    100%{
        transform:
            translate3d(0,0,0)
            rotate(0deg);
    }

    50%{
        transform:
            translate3d(26px,-22px,0)
            rotate(-4deg);
    }
}


@keyframes devsuiteDemoOrbitC{
    0%,
    100%{
        transform:
            translate3d(0,0,0)
            rotate(0deg);
    }

    50%{
        transform:
            translate3d(-18px,-16px,0)
            rotate(5deg);
    }
}


/* ------------------------------------------------
   MOBILE
   ------------------------------------------------ */

@media(max-width:760px){

    .site-tech-background .tech-dots{
        opacity:.18 !important;
        background-size:28px 28px !important;
    }

    .site-tech-background .orbit-one{
        width:270px !important;
        height:270px !important;

        right:-135px !important;
        top:9% !important;
    }

    .site-tech-background .orbit-two{
        width:380px !important;
        height:380px !important;

        left:-230px !important;
        top:45% !important;
    }

    .site-tech-background .orbit-three{
        width:220px !important;
        height:220px !important;

        right:-100px !important;
        bottom:3% !important;
    }

    .site-tech-background .tech-orbit{
        opacity:.62 !important;
    }

    .site-tech-background .tech-orbit::after{
        width:8px !important;
        height:8px !important;
    }
}


/* ------------------------------------------------
   ACCESIBILIDAD
   ------------------------------------------------ */

@media(prefers-reduced-motion:reduce){

    .site-tech-background .tech-orbit,
    .site-tech-background .tech-orbit::before{
        animation:none !important;
    }
}

/* DEVSUITE_TECH_ORBITS_END */

/* DEVSUITE_MENU_DESKTOP_1_START */

/*
 * Selector de idioma compacto.
 * En escritorio únicamente se muestra el globo.
 */
.devsuite-language {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.devsuite-language-trigger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
    font-size: 21px;
    line-height: 1;
}

.devsuite-language-trigger i {
    margin: 0 !important;
}

.devsuite-language-menu {
    min-width: 150px;
}

.devsuite-language-menu .dropdown-item {
    white-space: nowrap;
}

/*
 * El menú principal ahora tiene solo seis elementos.
 * Evitamos saltos de línea innecesarios en escritorio.
 */
@media (min-width: 992px) {
    header .nav-link {
        white-space: nowrap;
    }

    .devsuite-language-trigger {
        flex: 0 0 42px;
    }
}

/* DEVSUITE_MENU_DESKTOP_1_END */

/* DEVSUITE_DEMO_AUTOLOGIN_START
 *
 * EXCLUSIVO DEL SITIO DEMO.
 * RETIRAR COMPLETAMENTE AL GENERAR INSTANCIAS NO-DEMO.
 */

body input[readonly][name="username"],
body input[readonly][name="password"] {
    cursor: not-allowed;
    user-select: none;
    pointer-events: none;
    opacity: .72;
}

body form[action*="/demo-access/"] button[type="submit"] {
    min-height: 62px;
    font-weight: 700;
    letter-spacing: .01em;
    box-shadow: 0 12px 28px rgba(18, 103, 255, .20);
}

body form[action*="/demo-access/"] button[type="submit"]:before {
    content: "\f2f6";
    font-family: "Font Awesome 5 Pro";
    margin-right: 10px;
    font-weight: 400;
}

/* DEVSUITE_DEMO_AUTOLOGIN_END */

/* DEVSUITE_DEMO_AUTOLOGIN_UI2_START
 *
 * EXCLUSIVO DEL DEMO.
 * Retirar junto con el autologin en instancias NO-DEMO.
 */

.devsuite-demo-access-box {
    display: flex;
    align-items: flex-start;
    gap: 18px;
    margin: 8px 0 28px;
    padding: 22px 24px;
    border: 1px solid rgba(18, 103, 255, .18);
    border-radius: 14px;
    background: rgba(18, 103, 255, .055);
}

.devsuite-demo-access-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: #1267ff;
    color: #fff;
    font-size: 22px;
}

.devsuite-demo-access-copy {
    flex: 1 1 auto;
}

.devsuite-demo-access-copy h4 {
    margin: 0 0 7px;
    font-size: 21px;
    line-height: 1.25;
    font-weight: 700;
    color: #081b4b;
}

.devsuite-demo-access-copy p {
    margin: 0;
    font-size: 15px;
    line-height: 1.55;
    color: #475569;
}

/*
 * El autologin no necesita campos ni enlaces propios
 * de un login convencional.
 */
form[action*="/demo-access/"] .form-group:has(
    input[name="username"]
),
form[action*="/demo-access/"] .form-group:has(
    input[name="password"]
) {
    display: none !important;
}

form[action*="/demo-access/"] a {
    display: none !important;
}

form[action*="/demo-access/"] button[type="submit"] {
    width: 100%;
    min-height: 64px;
    margin-top: 4px;
    border-radius: 12px;
    font-size: 17px;
    font-weight: 700;
    cursor: pointer;
    box-shadow: 0 12px 28px rgba(18, 103, 255, .22);
}

form[action*="/demo-access/"] button[type="submit"]:hover {
    transform: translateY(-1px);
}

@media (max-width: 767px) {
    .devsuite-demo-access-box {
        gap: 14px;
        padding: 18px;
    }

    .devsuite-demo-access-icon {
        flex-basis: 42px;
        width: 42px;
        height: 42px;
        font-size: 19px;
    }

    .devsuite-demo-access-copy h4 {
        font-size: 19px;
    }

    form[action*="/demo-access/"] button[type="submit"] {
        min-height: 58px;
        font-size: 16px;
    }
}

/* DEVSUITE_DEMO_AUTOLOGIN_UI2_END */


/* DEVSUITE_POPUP32_MOBILE_V4_START */

/*
|--------------------------------------------------------------------------
| DevSuite Demo — Popup 32
|--------------------------------------------------------------------------
|
| Tamaño móvil REAL.
| No se utiliza transform:scale.
| Todo el componente cabe dentro del viewport.
|
*/

@media (max-width: 767px) {

    #modal-popup-32.popup-wrapper {
        position: fixed !important;

        inset: 0 !important;

        width: 100vw !important;
        height: 100dvh !important;
        min-height: 100dvh !important;

        padding:
            max(14px, env(safe-area-inset-top))
            14px
            max(14px, env(safe-area-inset-bottom))
            !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        box-sizing: border-box !important;

        overflow: hidden !important;
    }


    /*
    |--------------------------------------------------------------------------
    | Caja principal
    |--------------------------------------------------------------------------
    */

    #modal-popup-32 .popup-four {
        position: relative !important;

        width: min(88vw, 390px) !important;

        max-width: 390px !important;
        max-height: 78dvh !important;

        margin: 0 auto !important;

        transform: none !important;

        border-radius: 16px !important;

        overflow: hidden !important;

        background: #ffffff !important;

        box-shadow:
            0 24px 70px
            rgba(0, 0, 0, .28)
            !important;
    }


    /*
    |--------------------------------------------------------------------------
    | Contenido vertical
    |--------------------------------------------------------------------------
    */

    #modal-popup-32 .popup_main-content {
        display: flex !important;
        flex-direction: column !important;

        width: 100% !important;

        max-height: 78dvh !important;

        margin: 0 !important;
        padding: 0 !important;

        overflow-y: auto !important;
        overflow-x: hidden !important;

        background: #ffffff !important;

        scrollbar-width: thin;
    }


    /*
    |--------------------------------------------------------------------------
    | Imagen
    |--------------------------------------------------------------------------
    |
    | Completa, sin crop.
    |
    */

    #modal-popup-32 .left-bg {
        position: relative !important;

        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;

        flex: 0 0 auto !important;

        margin: 0 !important;
        padding: 0 !important;

        background: transparent !important;
    }

    #modal-popup-32 .left-bg img,
    #modal-popup-32 img.bg-img {
        position: relative !important;

        inset: auto !important;

        display: block !important;

        width: 100% !important;
        height: auto !important;

        max-width: 100% !important;
        max-height: 31dvh !important;

        margin: 0 auto !important;

        object-fit: contain !important;
        object-position: center center !important;
    }


    /*
    |--------------------------------------------------------------------------
    | Texto
    |--------------------------------------------------------------------------
    */

    #modal-popup-32 .right-content {
        width: 100% !important;

        flex: 0 0 auto !important;

        box-sizing: border-box !important;

        padding:
            15px 18px 17px
            !important;

        margin: 0 !important;

        text-align: center !important;
    }

    #modal-popup-32 .right-content h1 {
        margin:
            0 0 8px
            !important;

        font-size: 20px !important;
        line-height: 1.18 !important;

        font-weight: 700 !important;
    }

    #modal-popup-32 .right-content p {
        margin:
            0 0 12px
            !important;

        font-size: 12px !important;
        line-height: 1.45 !important;
    }


    /*
    |--------------------------------------------------------------------------
    | Formulario
    |--------------------------------------------------------------------------
    */

    #modal-popup-32 .subscribe-form {
        width: 100% !important;

        margin: 0 !important;
        padding: 0 !important;
    }

    #modal-popup-32 .subscriptionForm {
        width: 100% !important;

        margin: 0 !important;
        padding: 0 !important;
    }

    #modal-popup-32 .form_group {
        margin:
            0 0 8px
            !important;
    }

    #modal-popup-32 .form_group:last-child {
        margin-bottom: 0 !important;
    }

    #modal-popup-32 .form_control {
        width: 100% !important;

        height: 40px !important;
        min-height: 40px !important;

        padding:
            8px 11px
            !important;

        box-sizing: border-box !important;

        font-size: 12px !important;

        border-radius: 8px !important;
    }

    #modal-popup-32 .popup-main-btn {
        width: 100% !important;

        min-height: 40px !important;

        padding:
            9px 12px
            !important;

        font-size: 12px !important;
        font-weight: 700 !important;

        border-radius: 8px !important;
    }


    /*
    |--------------------------------------------------------------------------
    | X propia
    |--------------------------------------------------------------------------
    */

    #modal-popup-32 .devsuite-popup32-close {
        position: absolute !important;

        top: 9px !important;
        right: 9px !important;

        z-index: 999999 !important;

        width: 34px !important;
        height: 34px !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        margin: 0 !important;
        padding: 0 0 3px !important;

        border: 0 !important;
        border-radius: 50% !important;

        background:
            rgba(255, 255, 255, .96)
            !important;

        color: #081b4b !important;

        font-family:
            Arial,
            sans-serif
            !important;

        font-size: 27px !important;
        font-weight: 400 !important;
        line-height: 1 !important;

        cursor: pointer !important;

        box-shadow:
            0 3px 14px
            rgba(0, 0, 0, .22)
            !important;
    }

    #modal-popup-32 .devsuite-popup32-close:hover,
    #modal-popup-32 .devsuite-popup32-close:focus {
        background: #ffffff !important;
        color: #1267ff !important;
    }


    /*
    |--------------------------------------------------------------------------
    | Cierre generado por librería
    |--------------------------------------------------------------------------
    |
    | Evitamos tener dos X.
    |
    */

    body:has(#modal-popup-32) .mfp-close {
        display: none !important;
    }

}


@media (max-width: 430px) {

    #modal-popup-32 .popup-four {
        width: 88vw !important;
        max-height: 80dvh !important;
    }

    #modal-popup-32 .popup_main-content {
        max-height: 80dvh !important;
    }

    #modal-popup-32 .left-bg img,
    #modal-popup-32 img.bg-img {
        max-height: 30dvh !important;
    }

    #modal-popup-32 .right-content {
        padding:
            13px 16px 15px
            !important;
    }

    #modal-popup-32 .right-content h1 {
        font-size: 18px !important;
    }

}


/*
|--------------------------------------------------------------------------
| Desktop
|--------------------------------------------------------------------------
|
| Solo agregamos la X al popup 32.
| El diseño original permanece intacto.
|
*/

@media (min-width: 768px) {

    #modal-popup-32 .popup-four {
        position: relative;
    }

    #modal-popup-32 .devsuite-popup32-close {
        position: absolute;

        top: 12px;
        right: 12px;

        z-index: 999999;

        width: 36px;
        height: 36px;

        display: flex;
        align-items: center;
        justify-content: center;

        padding: 0 0 3px;

        border: 0;
        border-radius: 50%;

        background: rgba(255,255,255,.96);

        color: #081b4b;

        font-family: Arial, sans-serif;
        font-size: 28px;
        line-height: 1;

        cursor: pointer;

        box-shadow:
            0 3px 14px
            rgba(0,0,0,.20);
    }

}

/* DEVSUITE_POPUP32_MOBILE_V4_END */



/* DEVSUITE_POPUP32_CLOSE_FIX */

#modal-popup-32.devsuite-popup32-closed{
    display:none !important;
}

