:root {
    --bg:#030313;
    --text:#ffffff;
    --muted:rgba(255,255,255,.62);
    --line:rgba(255,255,255,.10);
    --glass:rgba(16,16,46,.42);
    --purple:#8509be;
    --violet:#9264bc;
    --pink:#ce0969;
    --brand-red:#dc092c;
    --brand-pink:#ce0969;
    --brand-purple:#8509be;
    --brand-blue:#112786;
    --brand-magenta:#ac2177;
    --brand-cornflower:#3e64be;
    --brand-lilac:#9264bc;
    --brand-slate:#8ea4c0;
    --brand-light:#edebee;
    --brand-gray:#8c8c8c;
    --header-h:92px;
    --content-w:1400px;
}

* {
    margin:0;
    padding:0;
    box-sizing:border-box
}

html {
    scroll-behavior:smooth
}

body {
    margin:0;
    font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;
    background-image:url("../images/Fondo_2.png.png");
    background-repeat:no-repeat;
    background-position:center;
    background-size:cover;
    background-attachment:fixed;
    background-color:var(--bg);
    color:var(--text);
    overflow:hidden;
}

a {
    color:inherit
}

button,input,textarea {
    font:inherit
}


/*=============================================PARTICULAS=============================================*/
#particles-js {
    position:fixed;
    inset:0;
    width:100%;
    height:100%;
    z-index:0;
    pointer-events:none;
}


/*=============================================NAVBAR=============================================*/
.header {
    position:fixed;
    top:0;
    left:0;
    width:100%;
    z-index:1000;
    padding:14px 20px;
    background:linear-gradient(180deg,rgba(7,12,47,.82),rgba(7,12,47,.40));
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
}

.header_inner {
    width:min(var(--content-w),100%);
    margin:0 auto;
    display:grid;
    grid-template-columns:1fr auto 1fr;
    align-items:center;
    min-height:62px;
    gap:24px;
}

.logo {
    justify-self:start;
    display:inline-flex;
    align-items:center;
    text-decoration:none;
}

.meta {
    width:100px;
    height:auto;
    display:block
}

.navbar {
    justify-self:center;
    padding:8px;
    border:1px solid rgba(255,255,255,.08);
    border-radius:999px;
    background:rgba(17,39,134,.34);
    box-shadow:0 15px 35px rgba(0,0,0,.28);
}

.navbar ul {
    display:flex;
    align-items:center;
    gap:4px;
    list-style:none;
}

.navbar a {
    position:relative;
    display:block;
    padding:11px 20px;
    border-radius:999px;
    text-decoration:none;
    color:#fff;
    font-size:.92rem;
    font-weight:600;
    letter-spacing:.03em;
    transition:transform .3s ease,background .3s ease,color .3s ease;
}

.navbar a:hover {
    transform:translateY(-2px);
    background:rgba(255,255,255,.08);
}

.navbar a.active {
    background:linear-gradient(135deg,rgba(133,9,190,.88),rgba(206,9,105,.78));
    box-shadow:0 8px 24px rgba(133,9,190,.24);
}

.header_actions {
    justify-self:end;
    display:flex;
    align-items:center;
    gap:10px;
}


/*=============================================BOTON IDIOMA=============================================*/
.idioma_selector {
    position: relative;
}

.idioma {
    min-width: 92px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 8px 12px;
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 999px;
    background: rgba(255,255,255,.05);
    color: #fff;
    cursor: pointer;
    transition: background .3s ease, border-color .3s ease, box-shadow .3s ease;
}

.idioma:hover, .idioma_selector .abierto .idioma {
    background: rgba(255,255,255,.09);
    border-color: rgba(198,156,255,.35);
    box-shadow: 0 8px 25px rgba(139,44,255,.12);
}

.idioma_bandera {
    width: 25px;
    height: 18px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 5px;
    background: rgba(255,255,255,.06);
}

.idioma_bandera img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.idioma_codigo {
    font-size: .82rem;
    font-weight: 700;
}

.idioma_flecha {
    color: rgba(255,255,255,.55);
    font-size: .8rem;
    transition: transform .3s ease;
}

.idioma_selector.abierto .idioma_flecha {
    transform: rotate(180deg);
}

.idioma_menu {
    position: absolute;
    top: calc(100% + 12px);
    right: 0;
    width: 190px;
    padding: 8px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 18px;
    background: linear-gradient(145deg, rgba(28,25,60,.96), rgba(8,8,28,.96));
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    box-shadow: 0 20px 50px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.05);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-8px) scale(.97);
    transform-origin: top right;
    transition: opacity .25s ease, visibility .25s ease, transform .25s ease;
}

.idioma_selector.abierto .idioma_menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0) scale(1);
}

.idioma_opcion {
    width: 100%;
    display: grid;
    grid-template-columns: 27px 1fr 18px;
    align-items: center;
    gap: 10px;
    padding: 10px;
    border: 0;
    border-radius: 12px;
    background: transparent;
    color: #fff;
    text-align: left;
    cursor: pointer;
    transition: background .25s ease, transform .25s ease;
}

.idioma_opcion:hover {
    background: rgba(255,255,255,.065);
    transform: translateX(2px);
}

.idioma_texto {
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.idioma_texto strong {
    color: rgba(255,255,255,.9);
    font-size: .78rem;
}

.idioma_texto small {
    color: rgba(255,255,255,.38);
    font-size: .65rem;
}

.idioma_check {
    color: #c69cff;
    font-size: .75rem;
    opacity: 0;
    transform: scale(.7);
    transition: opacity .25s ease, transform .25s ease;
}

.idioma_opcion.activa .idioma_check {
    opacity: 1;
    transform: scale(1);
}

.idioma_opcion.activa {
    background: linear-gradient(135deg, rgba(139,44,255,.14), rgba(255,75,121,.07));
}

.menu_toggle {
    display:none;
    width:44px;
    height:44px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:50%;
    background:rgba(255,255,255,.05);
    color:#fff;
    cursor:pointer;
    font-size:1.1rem;
}


/*=============================================SCROLL=============================================*/
.page_scroll {
    position:relative;
    z-index:1;
    width:100%;
    height:100dvh;
    overflow-y:auto;
    overflow-x:hidden;
    scroll-snap-type:y mandatory;
    scroll-behavior:smooth;
    overscroll-behavior-y:contain;
}

.pantalla {
    width:100%;
    min-height:100dvh;
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:calc(var(--header-h) + 28px) 6% 34px;
    background:rgba(3,3,19,.34);
    scroll-snap-align:start;
    scroll-snap-stop:always;
    isolation:isolate;
    overflow:hidden;
    transition:background .55s ease,color .55s ease;
}


/*=============================================ANIMACION CAMBIO SECCION=============================================*/
.pantalla .section_inner, .pantalla .hero, .pantalla .team_shell, .pantalla .contact_wrap {
    opacity: 0;
    transform: translateY(45px) scale(.97);
    filter: blur(5px);
    transition: opacity .75s cubic-bezier(.22, 1, .36, 1), transform .85s cubic-bezier(.22, 1, .36, 1), filter .75s ease;
}

.pantalla.seccion_visible .section_inner,
.pantalla.seccion_visible .hero,
.pantalla.seccion_visible .team_shell,
.pantalla.seccion_visible .contact_wrap {

    opacity: 1;

    transform:
        translateY(0)
        scale(1);

    filter: blur(0);
}

.section_inner{
    width:min(var(--content-w),100%);
    margin:0 auto;
}
.section_head{
    max-width:850px;
    margin:0 auto 34px;
    text-align:center;
}
.eyebrow{
    display:inline-block;
    margin-bottom:9px;
    color:var(--violet);
    font-size:.72rem;
    font-weight:800;
    letter-spacing:.19em;
    text-transform:uppercase;
}
.section_head h2{
    color:#fff;
    font-size:clamp(2rem,3.1vw,3.45rem);
    line-height:1.08;
    margin-bottom:12px;
}
.section_head p{
    color:var(--muted);
    line-height:1.6;
    font-size:1rem;
}


/*=============================================PLACEHOLDER=============================================*/
.media_placeholder{
    position:relative;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    min-height:220px;
    overflow:hidden;
    border:1px dashed rgba(198,156,255,.42);
    border-radius:24px;
    background:
        radial-gradient(circle at 50% 40%,rgba(139,44,255,.11),transparent 55%),
        rgba(255,255,255,.025);
    color:rgba(255,255,255,.38);
    text-align:center;
}

.media_placeholder::before,
.media_placeholder::after{
    content:"";
    position:absolute;
    width:46px;
    height:46px;
    border-color:rgba(255,255,255,.12);
}

.media_placeholder::before{
    left:12px;top:12px;
    border-left:1px solid;
    border-top:1px solid;
}

.media_placeholder::after{
    right:12px;bottom:12px;
    border-right:1px solid;
    border-bottom:1px solid;
}

.placeholder_size{
    color:rgba(255,255,255,.55);
    font-weight:700;
    letter-spacing:.08em;
    font-size:.9rem;
}

.placeholder_hint{
    margin-top:6px;
    font-size:.74rem;
    color:rgba(255,255,255,.26);
}


/*=============================================CONFIG GENERAL BOTONES=============================================*/
.btn_primary,
.btn_secondary{
    display:inline-flex;
    justify-content:center;
    align-items:center;
    text-decoration:none;
    border-radius:999px;
    transition:transform .3s ease,box-shadow .3s ease,background .3s ease;
}

.btn_primary{
    padding:14px 26px;
    background:linear-gradient(135deg,var(--purple),var(--pink));
    color:#fff;
    font-size:.82rem;
    font-weight:800;
    letter-spacing:.04em;
    box-shadow:0 12px 34px rgba(139,44,255,.23);
}

.btn_primary:hover{transform:translateY(-3px);box-shadow:0 16px 42px rgba(139,44,255,.38)}
.btn_secondary{
    padding:13px 24px;
    border:1px solid rgba(255,255,255,.2);
    background:rgba(255,255,255,.045);
    color:#fff;
    font-size:.82rem;
    font-weight:700;
}

.btn_secondary:hover{transform:translateY(-3px);background:rgba(255,255,255,.09)}


/*=============================================HOME / HERO=============================================*/
.home_hero{flex-direction:column;text-align:center}
.hero{position:relative;z-index:2}
.hero::before{
    content:"";
    position:absolute;
    width:min(680px,90vw);
    height:420px;
    left:50%;top:50%;
    transform:translate(-50%,-50%);
    background:radial-gradient(circle,rgba(105,62,255,.18),rgba(255,64,130,.06) 45%,transparent 70%);
    filter:blur(22px);
    z-index:-1;
    pointer-events:none;
}

.company_name{
    display:block;
    font-size:clamp(4.4rem,9vw,9rem);
    font-weight:800;
    line-height:.95;
    letter-spacing:-.05em;
    background:linear-gradient(90deg,#fff 10%,#9ebcff 38%,#c69cff 60%,#ff8aa9 90%);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
    text-shadow:0 0 40px rgba(125,76,255,.18);
}

.home_hero h1{
    max-width:1100px;
    margin:22px auto 0;
    font-size:clamp(1.1rem,2.2vw,2.2rem);
    font-weight:400;
    line-height:1.2;
    color:rgba(210,205,215,.82);
}

.hero_cta{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;margin-top:30px}


/*=============================================HOME / SISTEMAS=============================================*/
.feature_grid{
    display:grid;
    grid-template-columns:1.05fr .95fr;
    gap:42px;
    align-items:center;
}

.feature_copy h2{
    font-size:clamp(2.1rem,3.5vw,3.7rem);
    line-height:1.05;
    margin-bottom:16px;
}

.feature_copy p{
    max-width:650px;
    color:var(--muted);
    line-height:1.65;
    margin-bottom:24px;
}

.feature_points{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:10px;
    margin:22px 0 28px;
}

.feature_point{
    padding:13px 15px;
    border:1px solid rgba(255,255,255,.08);
    border-radius:14px;
    background:rgba(255,255,255,.035);
    color:rgba(255,255,255,.76);
    font-size:.86rem;
    display: flex;
    align-items: center;
    gap: 10px;
}

.feature_icon{
    width:30px;
    height:30px;
    flex:0 0 30px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:9px;
    background: linear-gradient(135deg, rgba(133,9,190,.12), rgba(206,9,105,.09));
    color:var(--purple);
    font-size:.82rem;
    transition: transform .3s ease, background .3s ease, color .3s ease;
}

.feature_point:hover .feature_icon{
    transform:scale(1.08);
    background: linear-gradient(135deg, var(--purple), var(--pink));
    color:#fff;
}

.systems_visual{
    position:relative;
    width:100%;
    display:flex;
    flex-direction:column;
    align-items:center;
}

.systems_image_slider{
    position:relative;
    width:100%;
    aspect-ratio:1150 / 900;
    overflow:hidden;
    border-radius:28px;
    background:linear-gradient(145deg, rgba(255,255,255,.88), rgba(237,235,238,.92));
    border:1px solid rgba(17,39,134,.10);
    box-shadow: 0 28px 65px rgba(17,39,134,.14);
}

.systems_slide{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    display:block;
    object-fit:contain;
    opacity:0;
    transform:scale(1.035);
    animation: systemsSlider 18s infinite ease-in-out;
}

.systems_slide_1{
    animation-delay:0s;
}

.systems_slide_2{
    animation-delay:6s;
}

.systems_slide_3{
    animation-delay:12s;
}

@keyframes systemsSlider{

    0%{
        opacity:0;
        transform:scale(1.035);
    }

    6%{
        opacity:1;
    }

    27%{
        opacity:1;
        transform:scale(1);
    }

    33%{
        opacity:0;
        transform:scale(1);
    }

    100%{
        opacity:0;
    }

}

.systems_slider_indicators{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:8px;
    margin-top:14px;
}


.systems_slider_indicators span{
    width:7px;
    height:7px;
    border-radius:50%;
    background:rgba(17, 39, 134, .20);
}


.systems_slider_indicators span:first-child{
    background: linear-gradient(135deg, var(--purple), var(--pink));
}


/*=============================================HOME / MOBILE=============================================*/
.mobile_showcase{
    display:grid;
    grid-template-columns:.82fr 1.18fr;
    gap:70px;
    align-items:center;
}

.mobile_visual{
    width:100%;
    display:flex;
    justify-content:center;
    align-items:center;
    position: relative;
}


.mobile_image_frame{
    position:relative;
    width: clamp(230px, 25vw, 370px);
    max-height: 68vh;
    overflow:hidden;
    border-radius:36px;
    background: rgba(255, 255, 255, .06);
    border: 1px solid rgba(255, 255, 255, .15);
    box-shadow: 0 32px 75px rgba(0, 0, 0, .34);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    z-index: -1;
}

.mobile_system_image{
    width:100%;
    height:auto;
    display:block;
    object-fit:contain;
}

.mobile_visual::before{
    content:"";
    position:absolute;
    width:420px;
    height:420px;
    border-radius:50%;
    background: radial-gradient(circle, rgba(133,9,190,.30), rgba(206,9,105,.12) 45%, transparent 70%);
    filter: blur(15px);
    pointer-events:none;
}

.mobile_copy h2{font-size:clamp(2.1rem,3.6vw,3.8rem);line-height:1.05;margin-bottom:16px}
.mobile_copy p{color:var(--muted);line-height:1.65;max-width:690px;margin-bottom:25px}
.mobile_badges{display:flex;gap:10px;flex-wrap:wrap}
.mobile_badge{
    padding:10px 14px;
    border-radius:999px;
    border:1px solid rgba(255,255,255,.1);
    background:rgba(255,255,255,.04);
    color:rgba(255,255,255,.72);
    font-size:.78rem;
}


/*=============================================HOME / CLIENTES=============================================*/
.clients_carousel {
    position: relative;

    width: 100%;

    overflow: hidden;

    padding: 10px 0;

    mask-image: linear-gradient(
        to right,
        transparent 0,
        #000 7%,
        #000 93%,
        transparent 100%
    );

    -webkit-mask-image: linear-gradient(
        to right,
        transparent 0,
        #000 7%,
        #000 93%,
        transparent 100%
    );
}


.clients_track {
    display: flex;

    width: max-content;

    gap: 18px;

    animation:
        clientesScroll
        90s
        linear
        infinite;

    will-change: transform;
}


.clients_carousel:hover .clients_track {
    animation-play-state: paused;
}


.client_banner {
    flex: 0 0 clamp(240px, 22vw, 330px);
    aspect-ratio: 1416 / 1111;
    position: relative;
    overflow: hidden;
    border-radius: 20px;
    background: #fff;
    border: 1px solid rgba(17,39,134,.10);
    box-shadow: 0 14px 35px rgba(17,39,134,.10);
    transition: transform .35s ease, border-color .35s ease, box-shadow .35s ease;
}

.client_banner img{
    transition: transform .5s cubic-bezier(.22,1,.36,1), filter .4s ease;
}

.client_banner:hover img{
    transform:scale(1.025);
    filter: saturate(1.05)contrast(1.02);
}

.client_banner::before{
    content:"";
    position:absolute;
    inset:-1px;
    z-index:2;
    border-radius:inherit;
    padding:2px;
    background: linear-gradient(
            135deg,
            transparent 15%,
            var(--purple),
            var(--pink),
            var(--brand-blue),
            transparent 85%
        );
    opacity:0;
    pointer-events:none;
    transition: opacity .35s ease;
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite:xor;
    mask-composite:exclude;
}

.client_banner:hover {
    transform: translateY(-5px) scale(1.015);
    border-color: rgba(133, 9, 190, .32);
    box-shadow: 0 18px 40px rgba(17,39,134,.18) 0 0 28px rgba(133,9,190,.12);
}

.client_banner:hover::before {
    opacity: 1;
}

.client_banner img {
    width: 100%;

    height: 100%;

    display: block;

    object-fit: cover;
}


@keyframes clientesScroll {

    from {
        transform:
            translateX(0);
    }

    to {
        transform:
            translateX(-50%);
    }

}


.clients_cta {
    margin-top: 28px;

    text-align: center;
}


.clients_cta p {
    color: var(--muted);

    margin-bottom: 16px;
}


/*=============================================NOSOTROS=============================================*/
.about_story_section{
    padding:calc(var(--header-h) + 22px) 4.5% 28px;
    background:#0b102e;
}


.about_story_slider{
    position:relative;
    width:min(var(--content-w),100%);
    height:min(76vh,720px);
    min-height:590px;
    margin:0 auto;
    overflow:hidden;
    border:1px solid rgba(255,255,255,.10);
    border-radius:30px;
    background:#112786;
    box-shadow:0 32px 80px rgba(17,39,134,.28);
    isolation:isolate;
}


.about_story_slide{
    position:absolute;
    inset:0;
    z-index:1;

    background-position:center;
    background-size:cover;

    opacity:0;
    visibility:hidden;

    transform:scale(1.045);

    transition:
        opacity .75s ease,
        visibility .75s ease,
        transform 1.2s cubic-bezier(.22,1,.36,1);
}


.about_story_slide.activa{
    opacity:1;
    visibility:visible;

    transform:scale(1);

    z-index:2;
}


.about_story_overlay{
    position:absolute;
    inset:0;

    background:
        linear-gradient(
            90deg,
            rgba(5,8,29,.94) 0%,
            rgba(17,39,134,.78) 32%,
            rgba(133,9,190,.28) 63%,
            rgba(0,0,0,.12) 100%
        ),
        linear-gradient(
            0deg,
            rgba(3,3,19,.55),
            transparent 52%
        );
}


.about_story_content{
    position:absolute;
    z-index:3;

    top:50%;
    left:clamp(34px,6vw,92px);

    width:min(560px,43%);

    transform:translateY(-50%);

    color:#fff;
}


.about_story_content > *{
    opacity:0;

    transform:translateY(42px);

    filter:blur(10px);
}


.about_story_slide.activa
.about_story_content > *{
    animation:
        aboutStoryReveal
        .78s
        cubic-bezier(.22,1,.36,1)
        forwards;
}


.about_story_slide.activa
.about_story_content > *:nth-child(2){
    animation-delay:.08s;
}


.about_story_slide.activa
.about_story_content > *:nth-child(3){
    animation-delay:.16s;
}


.about_story_slide.activa
.about_story_content > *:nth-child(4){
    animation-delay:.24s;
}


.about_story_slide.activa
.about_story_content > *:nth-child(5){
    animation-delay:.32s;
}


.about_story_slide.activa
.about_story_content > *:nth-child(6){
    animation-delay:.40s;
}


@keyframes aboutStoryReveal{

    to{
        opacity:1;

        transform:translateY(0);

        filter:blur(0);
    }

}


.about_story_number{
    display:block;

    margin-bottom:8px;

    color:rgba(255,255,255,.34);

    font-size:.78rem;

    font-weight:800;

    letter-spacing:.18em;
}


.about_story_content .eyebrow{
    color:#e7cfff;
}


.about_story_content h2{
    max-width:720px;

    margin:5px 0 16px;

    font-size:
        clamp(
            2.8rem,
            5.4vw,
            5.7rem
        );

    line-height:.94;

    letter-spacing:-.045em;

    color:#fff;
}


.about_story_content > p{
    color:rgba(255,255,255,.82);

    font-size:
        clamp(
            .95rem,
            1.15vw,
            1.08rem
        );

    line-height:1.65;
}


.about_story_extra{
    margin-top:14px;

    color:
        rgba(
            255,
            255,
            255,
            .62
        ) !important;

    font-size:.9rem !important;
}


.about_story_previews{
    position:absolute;

    z-index:5;

    right:34px;
    bottom:86px;

    display:flex;

    gap:12px;
}


.about_story_preview{
    position:relative;

    width:142px;
    height:190px;

    padding:0;

    overflow:hidden;

    border:
        1px solid
        rgba(255,255,255,.18);

    border-radius:18px;

    background-position:center;
    background-size:cover;

    color:#fff;

    cursor:pointer;

    box-shadow:
        0 18px 38px
        rgba(0,0,0,.28);

    transform:
        translateY(0);

    transition:
        transform .35s ease,
        border-color .35s ease,
        opacity .35s ease;
}


.about_story_preview::before{
    content:"";

    position:absolute;

    inset:0;

    background:
        linear-gradient(
            0deg,
            rgba(4,5,25,.92),
            rgba(17,39,134,.12) 72%
        );
}


.about_story_preview span,
.about_story_preview strong{
    position:absolute;

    z-index:2;

    left:14px;
}


.about_story_preview span{
    top:13px;

    font-size:.68rem;

    color:
        rgba(
            255,
            255,
            255,
            .66
        );
}


.about_story_preview strong{
    right:12px;
    bottom:13px;

    font-size:.76rem;

    line-height:1.2;

    text-align:left;
}


.about_story_preview:hover,
.about_story_preview.activa{
    transform:
        translateY(-8px);

    border-color:
        rgba(
            255,
            255,
            255,
            .55
        );
}


.about_story_preview.activa{
    box-shadow:
        0 20px 44px
        rgba(206,9,105,.22);
}


.about_story_controls{
    position:absolute;

    z-index:6;

    right:34px;
    bottom:25px;

    display:flex;

    align-items:center;

    gap:10px;
}


.about_story_arrow{
    width:42px;
    height:42px;

    display:grid;

    place-items:center;

    border:
        1px solid
        rgba(255,255,255,.22);

    border-radius:50%;

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

    color:#fff;

    cursor:pointer;

    backdrop-filter:
        blur(12px);

    transition:
        transform .3s ease,
        background .3s ease,
        border-color .3s ease;
}


.about_story_arrow:hover{
    transform:
        translateY(-3px);

    background:
        linear-gradient(
            135deg,
            rgba(133,9,190,.72),
            rgba(206,9,105,.72)
        );

    border-color:
        rgba(
            255,
            255,
            255,
            .34
        );
}


.about_story_counter{
    min-width:74px;

    display:flex;

    justify-content:center;

    gap:7px;

    color:
        rgba(
            255,
            255,
            255,
            .55
        );

    font-size:.76rem;

    font-weight:700;

    letter-spacing:.08em;
}


.about_story_counter
[data-about-current]{
    color:#fff;
}


.about_story_content_why{
    width:min(680px,52%);
}


.about_story_slide_why
.about_story_content h2{
    font-size:
        clamp(
            2.5rem,
            4vw,
            4.25rem
        );
}

.about_story_metrics{
    display:grid;

    grid-template-columns:
        repeat(
            2,
            minmax(0,1fr)
        );

    gap:10px;

    margin-top:20px;
}

.about_story_metric{
    padding:13px 15px;

    border:
        1px solid
        rgba(255,255,255,.13);

    border-radius:14px;

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

    backdrop-filter:
        blur(12px);
}


.about_story_metric strong{
    display:block;

    margin-bottom:2px;

    font-size:1.35rem;

    background:
        linear-gradient(
            135deg,
            #fff,
            #e7cfff,
            #ff8bb2
        );

    -webkit-background-clip:text;

    background-clip:text;

    color:transparent;
}


.about_story_metric span{
    color:
        rgba(
            255,
            255,
            255,
            .68
        );

    font-size:.75rem;
}


.about_story_capabilities{
    display:flex;

    flex-wrap:wrap;

    gap:7px;

    margin-top:12px;
}


.about_story_capabilities span{
    padding:7px 10px;

    border:
        1px solid
        rgba(255,255,255,.10);

    border-radius:999px;

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

    color:
        rgba(
            255,
            255,
            255,
            .72
        );

    font-size:.69rem;
}


@media(max-width:1100px){

    .about_story_slider{
        height:min(78vh,700px);

        min-height:600px;
    }


    .about_story_content{
        width:min(580px,58%);

        left:42px;
    }


    .about_story_previews{
        right:24px;

        bottom:82px;
    }


    .about_story_preview{
        width:105px;

        height:145px;
    }


    .about_story_controls{
        right:24px;
    }

}


@media(max-width:768px){

    .about_story_section{
        padding:
            calc(
                var(--header-h) + 14px
            )
            14px
            18px;
    }


    .about_story_slider{
        height:
            calc(
                100svh -
                var(--header-h) -
                34px
            );

        min-height:610px;

        border-radius:22px;
    }


    .about_story_overlay{
        background:
            linear-gradient(
                0deg,
                rgba(4,5,25,.97) 0%,
                rgba(17,39,134,.75) 45%,
                rgba(133,9,190,.18) 100%
            );
    }


    .about_story_content,
    .about_story_content_why{
        top:auto;

        left:22px;
        right:22px;

        bottom:126px;

        width:auto;

        transform:none;
    }


    .about_story_content h2,
    .about_story_slide_why
    .about_story_content h2{

        margin-bottom:10px;

        font-size:
            clamp(
                2.2rem,
                10vw,
                3.2rem
            );
    }


    .about_story_content > p{
        font-size:.9rem;

        line-height:1.5;
    }


    .about_story_extra{
        font-size:.8rem !important;

        display:-webkit-box;

        -webkit-line-clamp:3;

        -webkit-box-orient:vertical;

        overflow:hidden;
    }


    /* MINIATURAS */

    .about_story_previews{
        left:18px;
        right:18px;

        bottom:66px;

        gap:8px;

        overflow-x:auto;

        scrollbar-width:none;
    }


    .about_story_previews::-webkit-scrollbar{
        display:none;
    }


    .about_story_preview{
        flex:0 0 76px;

        width:76px;
        height:48px;

        border-radius:11px;
    }


    .about_story_preview span{
        display:none;
    }


    .about_story_preview strong{
        left:8px;
        right:8px;

        bottom:8px;

        font-size:.57rem;
    }


    .about_story_preview:hover,
    .about_story_preview.activa{
        transform:none;
    }


    /* CONTROLES */

    .about_story_controls{
        left:18px;
        right:auto;

        bottom:14px;
    }


    .about_story_arrow{
        width:38px;
        height:38px;
    }


    /* MÉTRICAS */

    .about_story_metrics{
        grid-template-columns:
            repeat(2,1fr);

        gap:6px;

        margin-top:10px;
    }


    .about_story_metric{
        padding:8px 9px;
    }


    .about_story_metric strong{
        font-size:1rem;
    }


    .about_story_metric span{
        font-size:.6rem;
    }

    .about_story_capabilities{
        display:none;
    }

}


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

    .about_story_slide,
    .about_story_content > *{
        transition:none;

        animation:none !important;
    }


    .about_story_slide.activa
    .about_story_content > *{
        opacity:1;

        transform:none;

        filter:none;
    }

}


/*=============================================TEAM=============================================*/
.team_shell{width:min(1350px,100%)}
.team_toolbar{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:18px;
}

.team_toolbar p{color:var(--muted);font-size:.9rem}
.team_controls{display:flex;gap:8px}
.team_arrow{
    width:46px;height:46px;
    border-radius:50%;
    border:1px solid rgba(255,255,255,.13);
    background:rgba(255,255,255,.045);
    color:#fff;
    cursor:pointer;
    transition:background .3s ease,transform .3s ease;
}

.team_arrow:hover{background:rgba(255,255,255,.1);transform:translateY(-2px)}
.team_carousel{
    display:grid;
    grid-auto-flow:column;
    grid-auto-columns:minmax(250px,1fr);
    gap:16px;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    scroll-behavior:smooth;
    scrollbar-width:none;
    padding:6px 2px 12px;
}

.team_carousel::-webkit-scrollbar{display:none}
.team_card{
    scroll-snap-align:start;
    padding:12px;
    border:1px solid rgba(255,255,255,.09);
    border-radius:24px;
    background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.018));
}

.team_photo{
    aspect-ratio:4/5;
    min-height:auto;
    border-radius:18px;
}

.team_meta{padding:16px 8px 10px;text-align:center}
.team_meta h3{font-size:1.05rem;margin-bottom:5px}
.team_meta span{font-size:.72rem;color:var(--violet);font-weight:800;letter-spacing:.12em}


/*=============================================CONTACTO=============================================*/
.contact_wrap{width:min(1250px,100%)}
.contact_grid{
    display:grid;
    grid-template-columns:.85fr 1.15fr;
    gap:20px;
}

.contact_info,
.contact_form{
    border:1px solid rgba(255,255,255,.09);
    border-radius:28px;
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
}

.contact_info{
    position:relative;
    padding:38px;
    overflow:hidden;
    background:linear-gradient(145deg,rgba(116,73,255,.10),rgba(255,75,145,.035));
}

.contact_info h3{font-size:clamp(1.7rem,2.5vw,2.5rem);line-height:1.08;margin:10px 0 15px}
.contact_info>p{color:var(--muted);line-height:1.55;margin-bottom:26px}
.contact_data{display:flex;flex-direction:column;gap:10px}
.contact_item{
    display:flex;
    gap:13px;
    align-items:center;
    padding:12px;
    border:1px solid rgba(255,255,255,.07);
    border-radius:15px;
    background:rgba(255,255,255,.025);
    text-decoration:none;
}

.contact_icon{
    width:42px;height:42px;flex-shrink:0;
    display:flex;align-items:center;justify-content:center;
    border-radius:12px;
    background:linear-gradient(135deg,rgba(139,44,255,.22),rgba(255,75,121,.14));
}

.contact_item small{display:block;color:rgba(255,255,255,.38);font-size:.61rem;letter-spacing:.11em;margin-bottom:2px}
.contact_item strong{font-size:.86rem;font-weight:500;color:rgba(255,255,255,.86)}

.contact_form{
    padding:30px;
    background:linear-gradient(145deg,rgba(255,255,255,.065),rgba(255,255,255,.02));
}

.form_intro{margin-bottom:20px}
.form_intro p{color:rgba(255,255,255,.5);font-size:.82rem;margin-top:5px}
.form_row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form_group{margin-bottom:14px}
.form_group label{display:block;margin-bottom:6px;color:rgba(255,255,255,.75);font-size:.78rem;font-weight:600}
.form_group input,.form_group textarea{
    width:100%;
    padding:11px 13px;
    border:1px solid rgba(255,255,255,.10);
    border-radius:12px;
    outline:none;
    background:rgba(3,3,19,.35);
    color:#fff;
    resize:none;
    transition:border-color .3s ease,box-shadow .3s ease,background .3s ease;
}

.form_group input:focus,.form_group textarea:focus{
    border-color:rgba(170,110,255,.65);
    background:rgba(20,15,45,.55);
    box-shadow:0 0 0 3px rgba(139,44,255,.08);
}

.form_error{display:none;margin-top:5px;color:#ff7d9c;font-size:.68rem}
.form_group.error input,.form_group.error textarea{border-color:rgba(255,90,130,.65)}
.form_group.error .form_error{display:block}
.contact_submit{
    width:100%;
    display:flex;
    justify-content:center;
    align-items:center;
    gap:10px;
    padding:13px 20px;
    border:0;
    border-radius:999px;
    cursor:pointer;
    background:linear-gradient(135deg,var(--purple),var(--pink));
    color:#fff;
    font-size:.76rem;
    font-weight:800;
    letter-spacing:.06em;
    box-shadow:0 10px 30px rgba(139,44,255,.20);
    transition:transform .3s ease,box-shadow .3s ease;
}

.contact_submit:hover{transform:translateY(-3px);box-shadow:0 15px 40px rgba(139,44,255,.35)}

/*=============================================GOOGLE MAPS=============================================*/
.pantalla_ubicacion {

    padding:
        calc(var(--header-h) + 24px)
        6%
        28px;

}

.ubicacion_contenedor {

    width: min(1400px, 100%);

    height: 100%;

    margin: 0 auto;

    display: flex;

    flex-direction: column;

    justify-content: center;

}

.ubicacion_encabezado {

    margin-bottom: 22px;

    text-align: center;

}

.ubicacion_encabezado h2 {

    margin-bottom: 12px;

    color: #fff;

    font-size: clamp(
        2rem,
        3vw,
        3.2rem
    );

    line-height: 1.08;

}

.ubicacion_direccion {

    display: flex;

    justify-content: center;

    align-items: center;

    gap: 9px;

    color: rgba(
        255,
        255,
        255,
        .62
    );

    font-size: .95rem;

}

.ubicacion_direccion i {

    color: #c69cff;

    font-size: 1.1rem;

}

.mapa_contenedor {

    position: relative;

    width: 100%;

    height: min(
        60vh,
        600px
    );

    min-height: 420px;

    overflow: hidden;

    border:

        1px solid
        rgba(255,255,255,.10);

    border-radius: 28px;

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

    box-shadow:

        0 25px 70px
        rgba(0,0,0,.30),

        0 0 60px
        rgba(139,44,255,.07);

}

.mapa_contenedor iframe {

    width: 100%;

    height: 100%;

    display: block;

    border: 0;

}


/*=============================================FOOTER=============================================*/
.site_footer{
    position:relative;
    z-index:2;
    min-height:auto;
    scroll-snap-align:end;
    background:
        radial-gradient(circle at 12% 0%,rgba(133,9,190,.18),transparent 32%),
        linear-gradient(135deg,#07103a 0%,#101a55 45%,#2b125e 100%);
    border-top:1px solid rgba(255,255,255,.09);
}

.footer_inner{
    width:min(var(--content-w),calc(100% - 40px));
    margin:0 auto;
    display:grid;
    grid-template-columns:1.2fr .8fr .8fr;
    gap:45px;
    padding:42px 0 24px;
}

.footer_brand h3{font-size:1.2rem;margin-bottom:8px}
.footer_brand p{max-width:470px;color:rgba(255,255,255,.48);font-size:.86rem;line-height:1.55}
.footer_col h4{font-size:.72rem;color:#cbb2df;letter-spacing:.14em;margin-bottom:12px}
.footer_links{display:flex;flex-direction:column;gap:8px}
.footer_links a,.footer_links span{color:rgba(255,255,255,.58);text-decoration:none;font-size:.83rem}
.footer_links a:hover{color:#fff}
.footer_bottom{
    width:min(var(--content-w),calc(100% - 40px));
    margin:0 auto;
    padding:16px 0 22px;
    border-top:1px solid rgba(255,255,255,.06);
    color:rgba(255,255,255,.34);
    font-size:.74rem;
    text-align:center;
}


/*=============================================RESPONSIVE=============================================*/
@media (max-width:980px){
    :root{--header-h:78px}
    .header{padding:10px 16px}
    .header_inner{grid-template-columns:1fr auto}
    .navbar{
        position:fixed;
        top:78px;
        right:16px;
        width:min(320px,calc(100% - 32px));
        padding:10px;
        border-radius:22px;
        opacity:0;
        visibility:hidden;
        transform:translateY(-10px);
        transition:.28s ease;
    }
    .navbar.open{opacity:1;visibility:visible;transform:none}
    .navbar ul{flex-direction:column;align-items:stretch}
    .navbar a{text-align:center}
    .header_actions{grid-column:2}
    .menu_toggle{display:inline-grid;place-items:center}
    .feature_grid,.mobile_showcase,.contact_grid{grid-template-columns:1fr;gap:28px}
    .feature_copy,.mobile_copy{text-align:center}
    .feature_copy p,.mobile_copy p{margin-left:auto;margin-right:auto}
    .feature_points{max-width:680px;margin-left:auto;margin-right:auto}
    .mobile_showcase .phone_placeholder{width:min(260px,65vw)}
    .footer_inner{grid-template-columns:1fr 1fr}
    .footer_brand{grid-column:1/-1}
}

@media (max-width:680px){
    body{background-attachment:scroll}
    .page_scroll{scroll-snap-type:y proximity}
    .pantalla{min-height:100svh;padding:calc(var(--header-h) + 24px) 18px 28px}
    .company_name{font-size:clamp(3.6rem,19vw,5.2rem)}
    .home_hero h1{font-size:1.05rem}
    .hero_cta{flex-direction:column;align-items:center}
    .feature_points{grid-template-columns:1fr}
    .section_head{margin-bottom:24px}
    .team_carousel{grid-auto-columns:minmax(78vw,1fr)}
    .form_row{grid-template-columns:1fr}
    .contact_info,.contact_form{padding:24px}
    .footer_inner{grid-template-columns:1fr;gap:26px}
    .footer_brand{grid-column:auto}
    .idioma{padding:9px 11px}
}

@media (max-width: 768px) {

    .pantalla_ubicacion {

        padding:
            calc(var(--header-h) + 20px)
            18px
            24px;

    }


    .ubicacion_encabezado {

        margin-bottom: 18px;

    }


    .ubicacion_direccion {

        max-width: 330px;

        margin: 0 auto;

        font-size: .84rem;

        line-height: 1.45;

    }


    .mapa_contenedor {

        height: 55vh;

        min-height: 360px;

        border-radius: 20px;

    }

}

@media(max-width:768px){

    .systems_image_slider{
        border-radius:20px;
    }


    .systems_visual{
        width:100%;
    }


    .mobile_image_frame{
        width:
            clamp(
                210px,
                58vw,
                300px
            );

        max-height:none;

        border-radius:28px;
    }


    .mobile_visual::before{
        width:300px;
        height:300px;
    }

}

@media(max-width:768px){

    .feature_icon{
        width:28px;
        height:28px;

        flex-basis:28px;

        font-size:.76rem;
    }


    .client_banner:hover{
        transform:none;
    }


    .client_banner:hover img{
        transform:none;
    }

}


.pantalla > *{
    position:relative;
    z-index:2;
}

/* Fondo original: Hero y formulario de contacto */
.theme_particles{
    background:
        radial-gradient(circle at 18% 24%,rgba(133,9,190,.13),transparent 32%),
        radial-gradient(circle at 82% 72%,rgba(206,9,105,.10),transparent 34%),
        rgba(3,3,19,.34);
    color:#fff;
}

/* Fondo claro principal */
.theme_light{
    background:
        radial-gradient(circle at 8% 18%,rgba(146,100,188,.20),transparent 27%),
        radial-gradient(circle at 94% 82%,rgba(62,100,190,.15),transparent 29%),
        linear-gradient(135deg,#f7f5f8 0%,var(--brand-light) 52%,#e4e9f1 100%);
    color:var(--brand-blue);
}

/* Fondo claro / medio con azul grisáceo */
.theme_soft{
    background:
        radial-gradient(circle at 84% 16%,rgba(133,9,190,.13),transparent 29%),
        radial-gradient(circle at 12% 84%,rgba(62,100,190,.13),transparent 30%),
        linear-gradient(145deg,#f4f2f5 0%,#e3e6ec 48%,#d7e0eb 100%);
    color:var(--brand-blue);
}

/* Fondo oscuro tecnológico sin partículas */
.theme_deep{
    background:
        radial-gradient(circle at 22% 30%,rgba(206,9,105,.24),transparent 33%),
        radial-gradient(circle at 80% 68%,rgba(146,100,188,.25),transparent 34%),
        linear-gradient(135deg,#0b174f 0%,var(--brand-blue) 42%,#40126e 72%,#6d126f 100%);
    color:#fff;
}

/* Fondo del mapa: reposo visual antes del footer */
.theme_map{
    background:
        radial-gradient(circle at 12% 18%,rgba(146,100,188,.16),transparent 27%),
        radial-gradient(circle at 88% 82%,rgba(62,100,190,.17),transparent 30%),
        linear-gradient(145deg,#f4f3f5 0%,var(--brand-light) 48%,#dce4ed 100%);
    color:var(--brand-blue);
}

/* Detalle decorativo común en secciones sin partículas */
.theme_light::before,
.theme_soft::before,
.theme_deep::before,
.theme_map::before{
    content:"";
    position:absolute;
    width:440px;
    height:440px;
    border-radius:50%;
    right:-220px;
    top:-220px;
    border:1px solid currentColor;
    opacity:.055;
    pointer-events:none;
    z-index:0;
}

.theme_light::after,
.theme_soft::after,
.theme_deep::after,
.theme_map::after{
    content:"";
    position:absolute;
    width:260px;
    height:260px;
    border-radius:50%;
    left:-145px;
    bottom:-145px;
    border:1px solid currentColor;
    opacity:.05;
    pointer-events:none;
    z-index:0;
}

/* =====================================================
   TIPOGRAFÍA PARA SECCIONES CLARAS
===================================================== */
.theme_light .section_head h2,
.theme_soft .section_head h2,
.theme_map .ubicacion_encabezado h2,
.theme_light .feature_copy h2,
.theme_soft .feature_copy h2,
.theme_light .mobile_copy h2,
.theme_soft .mobile_copy h2,
.theme_light .team_meta h3,
.theme_soft .team_meta h3{
    color:#17265f;
}

.theme_light .section_head p,
.theme_soft .section_head p,
.theme_light .feature_copy p,
.theme_soft .feature_copy p,
.theme_light .mobile_copy p,
.theme_soft .mobile_copy p,
.theme_light .team_toolbar p,
.theme_soft .team_toolbar p,
.theme_map .ubicacion_direccion,
.theme_light .clients_cta p,
.theme_soft .clients_cta p{
    color:rgba(23,38,95,.68);
}

.theme_light .eyebrow,
.theme_soft .eyebrow,
.theme_map .eyebrow{
    color:var(--brand-purple);
}

/* =====================================================
   HOME / SISTEMAS - CLARO
===================================================== */
.systems_section .feature_copy h2{
    color:var(--brand-blue);
}

.systems_section .feature_point{
    border-color:rgba(17,39,134,.10);
    background:rgba(255,255,255,.57);
    color:rgba(17,39,134,.78);
    box-shadow:0 12px 32px rgba(17,39,134,.05);
}

.systems_section .media_placeholder{
    border-color:rgba(133,9,190,.24);
    background:
        radial-gradient(circle at 48% 38%,rgba(133,9,190,.09),transparent 54%),
        rgba(255,255,255,.48);
    box-shadow:0 28px 70px rgba(17,39,134,.09);
}

.systems_section .placeholder_size{
    color:rgba(17,39,134,.55);
}

.systems_section .placeholder_hint{
    color:rgba(17,39,134,.42);
}

.systems_section .media_placeholder::before,
.systems_section .media_placeholder::after{
    border-color:rgba(17,39,134,.15);
}

/* =====================================================
   HOME / MÓVIL - OSCURO DIFERENTE AL HERO
===================================================== */
.mobile_section .phone_placeholder{
    border-color:rgba(255,255,255,.18);
    background:
        radial-gradient(circle at 50% 30%,rgba(206,9,105,.22),transparent 47%),
        rgba(255,255,255,.055);
    box-shadow:0 32px 80px rgba(2,7,35,.32),0 0 70px rgba(133,9,190,.14);
}

.mobile_section .mobile_badge{
    border-color:rgba(255,255,255,.16);
    background:rgba(255,255,255,.08);
    color:rgba(255,255,255,.84);
}

.mobile_section .eyebrow{
    color:#d8b7ef;
}

/* =====================================================
   HOME / CLIENTES - CLARO SUAVE
===================================================== */
.clients_section .placeholder_size{
    color:rgba(17,39,134,.48);
}

.clients_section .media_placeholder::before,
.clients_section .media_placeholder::after{
    border-color:rgba(17,39,134,.13);
}

/* =====================================================
   TEAM - CLARO
===================================================== */
.team_section .team_card{
    border-color:rgba(17,39,134,.10);
    background:linear-gradient(145deg,rgba(255,255,255,.78),rgba(255,255,255,.45));
    box-shadow:0 16px 40px rgba(17,39,134,.065);
}

.team_section .team_photo{
    border-color:rgba(133,9,190,.19);
    background:
        radial-gradient(circle at 50% 38%,rgba(146,100,188,.11),transparent 55%),
        rgba(255,255,255,.44);
}

.team_section .team_photo .placeholder_size{
    color:rgba(17,39,134,.54);
}

.team_section .team_photo .placeholder_hint{
    color:rgba(17,39,134,.40);
}

.team_section .team_photo::before,
.team_section .team_photo::after{
    border-color:rgba(17,39,134,.13);
}

.team_section .team_arrow{
    border-color:rgba(17,39,134,.14);
    background:rgba(255,255,255,.62);
    color:var(--brand-blue);
    box-shadow:0 8px 22px rgba(17,39,134,.06);
}

.team_section .team_arrow:hover{
    background:#fff;
}

.team_section .team_meta span{
    color:var(--brand-purple);
}

/* =====================================================
   CONTACTO - FONDO ORIGINAL + PARTÍCULAS
===================================================== */
.contact_section .contact_info,
.contact_section .contact_form{
    box-shadow:0 22px 60px rgba(0,0,0,.18);
}

.contact_section .contact_info{
    background:linear-gradient(145deg,rgba(133,9,190,.14),rgba(206,9,105,.055));
}

.contact_section .contact_form{
    background:linear-gradient(145deg,rgba(255,255,255,.075),rgba(255,255,255,.025));
}

/* =====================================================
   MAPA - CLARO
===================================================== */
.theme_map .ubicacion_encabezado h2{
    color:var(--brand-blue);
}

.theme_map .ubicacion_direccion{
    color:rgba(17,39,134,.68);
}

.theme_map .ubicacion_direccion i{
    color:var(--brand-purple);
}

.theme_map .mapa_contenedor{
    border-color:rgba(17,39,134,.12);
    background:#fff;
    box-shadow:0 28px 65px rgba(17,39,134,.13),0 0 0 7px rgba(255,255,255,.35);
}

/* =====================================================
   BOTONES AJUSTADOS A LA PALETA
===================================================== */
.btn_primary,
.contact_submit{
    background:linear-gradient(135deg,var(--brand-purple),var(--brand-pink));
    box-shadow:0 12px 34px rgba(133,9,190,.23);
}

.btn_primary:hover,
.contact_submit:hover{
    box-shadow:0 17px 44px rgba(133,9,190,.34);
}

/* =====================================================
   RESPONSIVE - ATMÓSFERAS MÁS LIGERAS EN MÓVIL
===================================================== */
@media(max-width:768px){
    .theme_light,
    .theme_soft,
    .theme_map{
        background-size:auto;
    }

    .theme_light::before,
    .theme_soft::before,
    .theme_deep::before,
    .theme_map::before{
        width:300px;
        height:300px;
        right:-190px;
        top:-165px;
    }
    .systems_section .feature_point,
    .team_section .team_card{
        backdrop-filter:none;
        -webkit-backdrop-filter:none;
    }
}


@media (max-width: 768px) {

    .clients_carousel {
        margin-inline:-18px;
        width:calc(100% + 36px);
        mask-image:linear-gradient(to right,transparent 0,#000 3%,#000 97%,transparent 100%);
        -webkit-mask-image:linear-gradient(to right,transparent 0,#000 3%,#000 97%,transparent 100%);
    }


    .clients_track {
        gap: 12px;

        animation-duration:
            42s;
    }


    .client_banner {
        flex-basis: 230px;

        border-radius: 16px;
    }
}