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

:root{
    --azul:#10206b;
    --azul-profundo:#08143f;
    --naranja:#e99714;
    --naranja-vivo:#ff8a00;
    --blanco:#fff;
}

html{
    scroll-behavior:smooth;
}

body{
    width:100%;
    overflow-x:hidden;
    font-family:'Open Sans',sans-serif;
}

img{
    display:block;
    max-width:100%;
}

.contenedor{
    width:90%;
    max-width:1200px;
    margin:auto;
    padding:60px 0;
}

.titulo{
    color:#fff;
    font-size:35px;
    text-align:center;
    margin-bottom:50px;
}

/* =========================
           HEADER NUEVO
========================= */

.hero{
    height:420px;
    position:relative;
    overflow:hidden;
    background:

linear-gradient(
180deg,
rgba(0,0,0,.82) 0%,
rgba(0,0,0,.60) 45%,
rgba(0,0,0,.35) 100%
),

linear-gradient(
90deg,
rgba(255,138,0,.40) 0%,
rgba(255,138,0,.22) 40%,
rgba(255,138,0,.10) 65%,
transparent 100%
),

url("../img/portada.jpg") center/cover no-repeat;
}

.navbar{
    width:min(92%,1500px);
    height:115px;
    margin:auto;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:28px;
    position:relative;
    z-index:10;
}

.marca{
    display:flex;
    align-items:center;
    gap:16px;
    color:#fff;
    text-decoration:none;
}

.marca img{
    width:110px;
    height:auto;
    object-fit:contain;
    flex-shrink:0;
}

.marca-texto{
    display:flex;
    flex-direction:column;
    line-height:1;
}

.marca-texto span{
    font-size:15px;
    font-weight:700;
}

.marca-texto strong{
    margin:4px 0;
    font-size:38px;
}

.marca-texto small{
    color:var(--naranja-vivo);
    font-size:13px;
    font-weight:800;
}

.nav-links{
    display:flex;
    align-items:center;
    gap:30px;
}

.nav-links a{
    color:#fff;
    font-size:16px;
    font-weight:700;
    text-decoration:none;
    white-space:nowrap;
    position:relative;
}

.nav-links a:not(.btn-cotiza)::after{
    content:"";
    position:absolute;
    left:0;
    bottom:-11px;
    width:0;
    height:3px;
    background:var(--naranja-vivo);
    transition:.25s;
}

.nav-links a:hover,
.nav-links a:focus-visible{
    color:var(--naranja-vivo);
}

.nav-links a:hover::after,
.nav-links a:focus-visible::after{
    width:100%;
}

.btn-cotiza{
    padding:15px 27px;
    border:0;
    border-radius:8px;
    background:var(--naranja-vivo);
    color:#fff;
    font:inherit;
    font-weight:800;
    white-space:nowrap;
    cursor:pointer;
    box-shadow:0 9px 24px rgba(255,138,0,.24);
    transition:transform .25s,background .25s,box-shadow .25s;
}

.btn-cotiza:hover,
.btn-cotiza:focus-visible{
    background:#e97900;
    transform:translateY(-2px);
    box-shadow:0 12px 28px rgba(255,138,0,.32);
}

.menu-toggle{
    display:none;
    border:0;
    background:transparent;
    color:#fff;
    font-size:30px;
    cursor:pointer;
}

.onda{
    position:absolute;
    left:0;
    bottom:-1px;
    width:100%;
    height:150px;
    line-height:0;
}

.onda svg{
    display:block;
    width:100%;
    height:100%;
}

/* =========================
       QUIÉNES SOMOS PREMIUM
========================= */

.sobre-nosotros{
    width:100%;
    min-height:760px;
    margin-top:-1px;
    padding:65px 0 90px;
    color:#fff;

    background:
        radial-gradient(
            circle at 38% 38%,
            rgba(26,83,190,.16),
            transparent 34%
        ),
        linear-gradient(
            135deg,
            #061538 0%,
            #071943 45%,
            #0a2055 100%
        );
}

.acerca-layout-premium{
    width:min(94%,1660px);
    margin:auto;
    display:grid;
    grid-template-columns:minmax(280px,.66fr) minmax(420px,1fr) minmax(560px,1.22fr);
    grid-template-areas:
        "intro visual contenido"
        "stats visual contenido";
    align-items:center;
    column-gap:42px;
    row-gap:18px;
}

.quienes-presentacion{grid-area:intro;}
.visual-industrial{grid-area:visual;}
.quienes-estadisticas{grid-area:stats;}
.columna-contenido-premium{grid-area:contenido;}


.quienes-presentacion{
    min-width:0;
    position:relative;
    z-index:3;
}

.eyebrow{
    margin-bottom:14px;
    color:var(--naranja-vivo);
    font-size:15px;
    font-weight:800;
    letter-spacing:.13em;
}

.quienes-presentacion h1{
    color:#fff;
    font-size:clamp(58px,5vw,88px);
    line-height:.96;
    letter-spacing:-.035em;
}

.linea{
    display:block;
    width:82px;
    height:5px;
    margin:27px 0 33px;
    border-radius:20px;
    background:var(--naranja-vivo);
    box-shadow:0 0 18px rgba(255,138,0,.28);
}

.quienes-resumen{
    max-width:330px;
    color:rgba(255,255,255,.86);
    font-size:18px;
    line-height:1.72;
}

.btn-conoce-mas{
    width:max-content;
    margin-top:29px;
    padding:12px 20px;
    display:inline-flex;
    align-items:center;
    gap:11px;
    border:2px solid var(--naranja-vivo);
    border-radius:5px;
    color:#fff;
    font-size:13px;
    font-weight:800;
    letter-spacing:.05em;
    text-decoration:none;
    transition:background .25s ease,transform .25s ease,box-shadow .25s ease;
}

.btn-play{
    width:28px;
    height:28px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:var(--naranja-vivo);
    color:#fff;
    font-size:10px;
}

.btn-conoce-mas:hover{
    background:rgba(255,138,0,.12);
    transform:translateY(-2px);
    box-shadow:0 10px 28px rgba(255,138,0,.16);
}

.quienes-estadisticas{
    margin-top:52px;
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:0;
}

.estadistica-item{
    min-height:132px;
    padding:0 20px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    border-right:1px solid rgba(255,255,255,.16);
}

.estadistica-item:first-child{
    padding-left:0;
}

.estadistica-item:last-child{
    border-right:0;
}

.estadistica-icono{
    margin-bottom:7px;
    color:var(--naranja-vivo);
    font-size:27px;
    line-height:1;
}

.estadistica-item strong{
    color:#fff;
    font-size:34px;
    line-height:1;
}

.estadistica-item small{
    margin-top:9px;
    color:rgba(255,255,255,.72);
    font-size:10px;
    font-weight:700;
    line-height:1.35;
    letter-spacing:.055em;
}

.visual-industrial{
    width:min(100%,600px);
    aspect-ratio:1 / 1;
    position:relative;
    display:grid;
    place-items:center;
    justify-self:center;
    isolation:isolate;
}

.collage-industrial{
    width:72%;
    height:72%;
    position:relative;
    z-index:3;
    overflow:hidden;
    border-radius:50%;
    background:#08143f;
    box-shadow:
        0 30px 55px rgba(0,0,0,.38),
        inset 0 0 0 2px rgba(99,154,255,.25),
        0 0 45px rgba(25,87,207,.23);
    animation:flotar-collage 5s ease-in-out infinite;
}

.collage-panel{
    position:absolute;
    inset:0;
    overflow:hidden;
    background:#08143f;
}

.collage-panel img{
    width:100%;
    height:100%;
    object-fit:cover;
    filter:saturate(.88) contrast(1.07) brightness(.88);
    transition:transform 1.2s ease,filter .6s ease;
}

.collage-panel-1{
    clip-path:polygon(0 0,58% 0,50% 52%,0 82%);
}

.collage-panel-1 img{
    object-position:38% center;
}

.collage-panel-2{
    clip-path:polygon(58% 0,100% 0,100% 68%,50% 52%);
}

.collage-panel-2 img{
    object-position:55% center;
}

.collage-panel-3{
    clip-path:polygon(0 82%,50% 52%,100% 68%,100% 100%,0 100%);
}

.collage-panel-3 img{
    object-position:center 58%;
}

.visual-industrial:hover .collage-panel img{
    transform:scale(1.055);
    filter:saturate(1.03) contrast(1.08) brightness(.96);
}

.orbita{
    position:absolute;
    border-radius:50%;
    pointer-events:none;
}

.orbita-1{
    width:83%;
    height:83%;
    z-index:2;
    border:3px solid rgba(40,116,244,.65);
    border-right-color:rgba(255,138,0,.82);
    border-bottom-color:rgba(255,138,0,.36);
    box-shadow:0 0 24px rgba(26,89,220,.32);
    animation:girar-orbita 19s linear infinite;
}

.orbita-2{
    width:91%;
    height:91%;
    z-index:1;
    border:2px solid rgba(64,128,242,.42);
    border-top-color:transparent;
    border-left-color:rgba(255,138,0,.48);
    animation:girar-orbita-inversa 25s linear infinite;
}

.orbita-3{
    width:99%;
    height:99%;
    z-index:0;
    border:1px solid rgba(59,121,236,.22);
    border-bottom:3px solid rgba(255,138,0,.85);
    filter:drop-shadow(0 0 13px rgba(255,138,0,.4));
    animation:respirar-orbita 4s ease-in-out infinite;
}

.visual-industrial::after{
    content:"";
    position:absolute;
    left:16%;
    bottom:4%;
    width:70%;
    height:17%;
    z-index:-1;
    border-radius:50%;
    background:rgba(255,138,0,.30);
    filter:blur(34px);
    animation:resplandor-industrial 3.2s ease-in-out infinite;
}

.chispa{
    position:absolute;
    z-index:5;
    width:5px;
    height:5px;
    border-radius:50%;
    background:var(--naranja-vivo);
    box-shadow:0 0 8px var(--naranja-vivo),0 0 16px rgba(255,138,0,.85);
    animation:chispear 2.2s ease-in-out infinite;
}

.chispa-1{left:8%;bottom:28%;}
.chispa-2{right:10%;top:26%;animation-delay:.7s;}
.chispa-3{right:15%;bottom:15%;animation-delay:1.35s;}

.columna-contenido-premium{
    min-width:0;
    padding-left:52px;
    border-left:1px solid rgba(255,255,255,.15);
}

.bloque-premium{
    display:grid;
    grid-template-columns:48px minmax(0,1fr);
    gap:18px;
    padding:22px 0;
    border-bottom:1px solid rgba(255,255,255,.17);
}

.bloque-premium:first-child{padding-top:0;}
.bloque-premium:last-child{padding-bottom:0;border-bottom:0;}

.numero{
    width:44px;
    height:44px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:var(--naranja-vivo);
    color:#fff;
    font-size:21px;
    font-weight:800;
    box-shadow:0 0 20px rgba(255,138,0,.20);
}

.bloque-cuerpo{min-width:0;}

.bloque-titulo-fila{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
}

.bloque-premium h2{
    margin:0;
    color:#fff;
    font-size:clamp(23px,1.8vw,31px);
    line-height:1.2;
}

.mini-linea{
    width:40px;
    height:3px;
    display:block;
    margin:9px 0 12px;
    border-radius:10px;
    background:var(--naranja-vivo);
}

.bloque-premium p{
    max-width:650px;
    color:rgba(255,255,255,.86);
    font-size:15px;
    line-height:1.72;
}

.bloque-icono{
    width:72px;
    height:72px;
    flex:0 0 72px;
    display:grid;
    place-items:center;
    border:1px solid rgba(255,138,0,.55);
    border-radius:50%;
    color:#fff;
    font-size:28px;
    box-shadow:0 0 20px rgba(255,138,0,.11);
}

.valores-premium{
    margin-top:15px;
    display:grid;
    grid-template-columns:repeat(3,minmax(110px,1fr));
    gap:13px 22px;
    list-style:none;
}

.valores-premium li{
    display:flex;
    align-items:center;
    gap:9px;
    color:#fff;
    font-size:14px;
}

.valores-premium li::before{
    content:"✓";
    width:26px;
    height:26px;
    flex:0 0 26px;
    display:grid;
    place-items:center;
    border:2px solid var(--naranja-vivo);
    border-radius:50%;
    color:var(--naranja-vivo);
    font-weight:800;
}

@keyframes girar-orbita{
    to{transform:rotate(360deg);}
}

@keyframes girar-orbita-inversa{
    to{transform:rotate(-360deg);}
}

@keyframes flotar-collage{
    0%,100%{transform:translateY(0);}
    50%{transform:translateY(-8px);}
}

@keyframes respirar-orbita{
    0%,100%{transform:scale(.985);opacity:.68;}
    50%{transform:scale(1.015);opacity:1;}
}

@keyframes resplandor-industrial{
    0%,100%{opacity:.45;transform:scale(.92);}
    50%{opacity:.9;transform:scale(1.08);}
}

@keyframes chispear{
    0%,100%{opacity:.25;transform:scale(.7);}
    50%{opacity:1;transform:scale(1.4);}
}

@media(max-width:1320px){
    .acerca-layout-premium{
        grid-template-columns:minmax(260px,.65fr) minmax(370px,.9fr) minmax(500px,1.15fr);
        gap:28px;
    }

    .columna-contenido-premium{padding-left:35px;}
    .quienes-presentacion h1{font-size:clamp(54px,5vw,74px);}
    .quienes-resumen{font-size:16px;}
    .bloque-icono{width:60px;height:60px;flex-basis:60px;}
}

@media(max-width:1050px){
    .acerca-layout-premium{
        grid-template-columns:1fr 1fr;
        align-items:start;
        gap:45px;
    }

    .quienes-presentacion{
        padding-top:35px;
    }

    .visual-industrial{
        grid-column:2;
        grid-row:1;
        width:min(100%,520px);
    }

    .columna-contenido-premium{
        grid-column:1/-1;
        padding-left:0;
        border-left:0;
        display:grid;
        grid-template-columns:1fr 1fr;
        gap:0 35px;
        border-top:1px solid rgba(255,255,255,.13);
        padding-top:20px;
    }

    .bloque-premium:nth-child(odd){border-right:1px solid rgba(255,255,255,.12);padding-right:28px;}
    .bloque-premium:nth-child(even){padding-left:10px;}
}

@media(max-width:760px){
    .sobre-nosotros{padding:58px 0 68px;}

    .acerca-layout-premium{
        width:88%;
        grid-template-columns:1fr;
        gap:35px;
    }

    .quienes-presentacion{
        padding-top:0;
        text-align:center;
    }

    .quienes-presentacion h1{font-size:clamp(48px,13vw,66px);}
    .linea{margin-left:auto;margin-right:auto;}
    .quienes-resumen{margin:auto;}
    .btn-conoce-mas{margin-left:auto;margin-right:auto;}

    .quienes-estadisticas{
        margin-top:38px;
    }

    .estadistica-item{padding:0 9px;}
    .estadistica-item strong{font-size:28px;}
    .estadistica-item small{font-size:8.5px;}

    .visual-industrial{
        grid-column:1;
        grid-row:auto;
        width:min(100%,500px);
    }

    .columna-contenido-premium{
        grid-column:1;
        display:block;
        padding-top:5px;
        border-top:0;
    }

    .bloque-premium,
    .bloque-premium:nth-child(odd),
    .bloque-premium:nth-child(even){
        padding:21px 0;
        border-right:0;
    }

    .bloque-icono{width:52px;height:52px;flex-basis:52px;font-size:22px;}
    .valores-premium{grid-template-columns:repeat(2,minmax(120px,1fr));}
}

@media(max-width:480px){
    .quienes-estadisticas{grid-template-columns:1fr;gap:15px;}
    .estadistica-item{min-height:90px;border-right:0;border-bottom:1px solid rgba(255,255,255,.12);}
    .estadistica-item:last-child{border-bottom:0;}
    .visual-industrial{width:108%;margin-left:-4%;}
    .bloque-premium{grid-template-columns:38px 1fr;gap:12px;}
    .numero{width:36px;height:36px;font-size:17px;}
    .bloque-titulo-fila{gap:10px;}
    .bloque-icono{width:44px;height:44px;flex-basis:44px;font-size:19px;}
    .valores-premium{grid-template-columns:1fr;}
}

/* =========================
          PRODUCTOS
========================= */

.portafolio{
    width:100%;
    padding:85px 0 95px;
    background:
        radial-gradient(
            circle at 10% 20%,
            rgba(255,138,0,.11),
            transparent 25%
        ),
        #f3f5f9;
}

.encabezado-productos{
    max-width:760px;
    margin:0 auto 48px;
    text-align:center;
}

.productos-etiqueta{
    margin-bottom:9px;
    color:var(--naranja-vivo);
    font-size:14px;
    font-weight:800;
    letter-spacing:.12em;
}

.portafolio .titulo{
    margin-bottom:15px;
    color:var(--azul-profundo);
    font-size:clamp(37px,4vw,52px);
}

.productos-intro{
    color:#626a7d;
    font-size:17px;
    line-height:1.75;
}

.galeria-port{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:24px;
}

.imagen-port{
    width:100%;
    height:380px;
    position:relative;
    overflow:hidden;
    border-radius:15px;
    background:var(--azul-profundo);
    box-shadow:0 15px 35px rgba(8,20,63,.15);
    cursor:default;
    isolation:isolate;
    transition:
        transform .35s ease,
        box-shadow .35s ease;
}

.imagen-port::after{
    content:"";
    position:absolute;
    inset:0;
    z-index:1;
    background:
        linear-gradient(
            180deg,
            transparent 20%,
            rgba(5,12,39,.3) 48%,
            rgba(5,12,39,.96) 100%
        );
    transition:background .35s ease;
}

.imagen-port > img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:
        transform .55s ease,
        filter .35s ease;
}

.hover-galeria{
    position:absolute;
    inset:auto 0 0;
    z-index:2;
    min-height:175px;
    padding:24px;
    display:flex;
    align-items:flex-start;
    justify-content:flex-end;
    flex-direction:column;
    background:transparent;
    transform:none;
    transition:transform .35s ease;
}

.numero-producto{
    margin-bottom:8px;
    color:var(--naranja-vivo);
    font-size:13px;
    font-weight:800;
    letter-spacing:.12em;
}

.hover-galeria h3{
    margin-bottom:7px;
    color:#fff;
    font-size:21px;
    line-height:1.25;
}

.hover-galeria p{
    margin:0;
    color:rgba(255,255,255,.75);
    font-size:14px;
    line-height:1.6;
}

.btn-producto{
    max-height:0;
    margin-top:0;
    padding:0;
    overflow:hidden;
    border:0;
    border-radius:7px;
    background:var(--naranja-vivo);
    color:#fff;
    font:inherit;
    font-size:13px;
    font-weight:800;
    opacity:0;
    cursor:pointer;
    transition:
        max-height .35s ease,
        margin-top .35s ease,
        padding .35s ease,
        opacity .25s ease,
        background .25s ease;
}

.imagen-port:hover{
    transform:translateY(-7px);
    box-shadow:0 22px 45px rgba(8,20,63,.24);
}

.imagen-port:hover::after{
    background:
        linear-gradient(
            180deg,
            rgba(8,20,63,.08) 5%,
            rgba(8,20,63,.55) 48%,
            rgba(8,20,63,.98) 100%
        );
}

.imagen-port:hover > img{
    transform:scale(1.08);
    filter:saturate(1.08);
}

.imagen-port:hover .hover-galeria{
    transform:translateY(-4px);
}

.imagen-port:hover .btn-producto{
    max-height:45px;
    margin-top:16px;
    padding:11px 15px;
    opacity:1;
}

.btn-producto:hover{
    background:#e97900;
}


/* =========================
   BANNER - MÁS ALLÁ DEL CATÁLOGO
========================= */

.banner-catalogo{
    width:100%;
    position:relative;
    overflow:hidden;
    padding:74px 5%;
    background:
        radial-gradient(
            circle at 87% 45%,
            rgba(255,138,0,.20),
            transparent 24%
        ),
        radial-gradient(
            circle at 10% 15%,
            rgba(54,103,231,.16),
            transparent 26%
        ),
        linear-gradient(
            120deg,
            #061538 0%,
            #0a1d55 58%,
            #10206b 100%
        );
    color:#fff;
}

.banner-catalogo::before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    width:100%;
    height:3px;
    background:linear-gradient(
        90deg,
        transparent,
        var(--naranja-vivo) 18%,
        var(--naranja-vivo) 82%,
        transparent
    );
}

.banner-catalogo-inner{
    width:min(100%,1400px);
    margin:auto;
    display:grid;
    grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr);
    align-items:center;
    gap:70px;
}

.banner-catalogo-copy{
    position:relative;
    z-index:2;
    max-width:900px;
}

.banner-catalogo-eyebrow{
    margin-bottom:12px;
    color:var(--naranja-vivo);
    font-size:13px;
    font-weight:800;
    letter-spacing:.14em;
}

.banner-catalogo h2{
    max-width:920px;
    color:#fff;
    font-size:clamp(34px,4vw,56px);
    line-height:1.12;
    letter-spacing:-.025em;
}

.banner-catalogo h2 span{
    display:block;
    color:var(--naranja-vivo);
}

.banner-catalogo-texto{
    max-width:760px;
    margin-top:20px;
    color:rgba(255,255,255,.78);
    font-size:16px;
    line-height:1.75;
}

.btn-banner-catalogo{
    margin-top:28px;
    min-height:50px;
    padding:0 23px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:13px;
    border:0;
    border-radius:9px;
    background:var(--naranja-vivo);
    color:#fff;
    font:inherit;
    font-weight:800;
    cursor:pointer;
    box-shadow:0 12px 30px rgba(255,138,0,.25);
    transition:
        transform .25s ease,
        background .25s ease,
        box-shadow .25s ease;
}

.btn-banner-catalogo span{
    font-size:20px;
    line-height:1;
    transition:transform .25s ease;
}

.btn-banner-catalogo:hover,
.btn-banner-catalogo:focus-visible{
    background:#e97900;
    transform:translateY(-3px);
    box-shadow:0 17px 36px rgba(255,138,0,.34);
}

.btn-banner-catalogo:hover span{
    transform:translateX(4px);
}

/* Visual decorativo */

.banner-catalogo-visual{
    width:min(100%,360px);
    aspect-ratio:1 / 1;
    position:relative;
    justify-self:end;
    display:grid;
    place-items:center;
    isolation:isolate;
}

.catalogo-icono{
    width:145px;
    height:145px;
    z-index:3;
    display:grid;
    place-items:center;
    border:1px solid rgba(255,138,0,.52);
    border-radius:50%;
    background:
        radial-gradient(
            circle at 35% 30%,
            rgba(255,255,255,.10),
            transparent 35%
        ),
        rgba(5,13,46,.72);
    box-shadow:
        0 0 0 12px rgba(255,138,0,.035),
        0 0 42px rgba(255,138,0,.18);
    animation:catalogo-flotar 4s ease-in-out infinite;
}

.catalogo-icono svg{
    width:67px;
    height:67px;
    fill:none;
    stroke:var(--naranja-vivo);
    stroke-width:3;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.catalogo-orbita{
    position:absolute;
    border-radius:50%;
    pointer-events:none;
}

.catalogo-orbita-1{
    width:76%;
    height:76%;
    border:2px solid rgba(255,138,0,.42);
    border-left-color:transparent;
    animation:catalogo-girar 15s linear infinite;
}

.catalogo-orbita-2{
    width:96%;
    height:96%;
    border:1px solid rgba(88,132,255,.28);
    border-top-color:transparent;
    border-right-color:rgba(255,138,0,.38);
    animation:catalogo-girar-inverso 22s linear infinite;
}

.catalogo-particula{
    position:absolute;
    width:7px;
    height:7px;
    border-radius:50%;
    background:var(--naranja-vivo);
    box-shadow:0 0 15px rgba(255,138,0,.9);
    animation:catalogo-pulso 2.4s ease-in-out infinite;
}

.particula-1{top:14%;left:18%;}
.particula-2{right:7%;top:43%;animation-delay:.8s;}
.particula-3{left:15%;bottom:13%;animation-delay:1.5s;}

@keyframes catalogo-girar{
    to{transform:rotate(360deg);}
}

@keyframes catalogo-girar-inverso{
    to{transform:rotate(-360deg);}
}

@keyframes catalogo-flotar{
    0%,100%{transform:translateY(0);}
    50%{transform:translateY(-8px);}
}

@keyframes catalogo-pulso{
    0%,100%{opacity:.28;transform:scale(.72);}
    50%{opacity:1;transform:scale(1.35);}
}

@media(max-width:900px){
    .banner-catalogo{
        padding:64px 6%;
    }

    .banner-catalogo-inner{
        grid-template-columns:1fr;
        gap:38px;
    }

    .banner-catalogo-copy{
        text-align:center;
        margin:auto;
    }

    .banner-catalogo-texto{
        margin-left:auto;
        margin-right:auto;
    }

    .banner-catalogo-visual{
        width:min(72vw,320px);
        justify-self:center;
        grid-row:1;
    }

    .btn-banner-catalogo{
        margin-left:auto;
        margin-right:auto;
    }
}

@media(max-width:500px){
    .banner-catalogo{
        padding:54px 7%;
    }

    .banner-catalogo-inner{
        gap:30px;
    }

    .banner-catalogo h2{
        font-size:34px;
    }

    .banner-catalogo-texto{
        font-size:15px;
    }

    .banner-catalogo-visual{
        width:min(76vw,280px);
    }

    .catalogo-icono{
        width:118px;
        height:118px;
    }

    .catalogo-icono svg{
        width:56px;
        height:56px;
    }

    .btn-banner-catalogo{
        width:100%;
    }
}

/* =========================
      MARCAS COMERCIALIZADAS
========================= */

.marcas{
    width:100%;
    padding:70px 0 80px;
    background:
        radial-gradient(
            circle at 12% 25%,
            rgba(73,105,202,.18),
            transparent 28%
        ),
        linear-gradient(
            135deg,
            var(--azul-profundo),
            var(--azul)
        );
}

.marcas-contenedor{
    padding-top:0;
    padding-bottom:0;
}

.encabezado-marcas{
    max-width:800px;
    margin:0 auto 50px;
    text-align:center;
}

.marcas-etiqueta{
    margin-bottom:10px;
    color:var(--naranja-vivo);
    font-size:14px;
    font-weight:800;
    letter-spacing:.12em;
}

.marcas .titulo{
    margin-bottom:16px;
    color:#fff;
    font-size:clamp(36px,4vw,52px);
    line-height:1.15;
}

.marcas-intro{
    color:rgba(255,255,255,.78);
    font-size:17px;
    line-height:1.75;
}

.marcas-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
}

.marca-card{
    height:120px;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:12px 20px;
    background:#fff;
    border-radius:10px;
    overflow:hidden;
}

.marca-card img{
    width:200px;
    height:75px;
    object-fit:contain;
    display:block;
    margin:auto;
}

.marca-card:hover img{
    transform:scale(1.07);
}

.marcas-nota{
    max-width:780px;
    margin:42px auto 22px;
    color:rgba(255,255,255,.72);
    font-size:15px;
    line-height:1.7;
    text-align:center;
}

.btn-marcas-cotizar{
    display:block;
    margin:0 auto;
    padding:15px 27px;
    border:0;
    border-radius:9px;
    background:var(--naranja-vivo);
    color:#fff;
    font:inherit;
    font-weight:800;
    cursor:pointer;
    box-shadow:0 10px 26px rgba(255,138,0,.25);
    transition:
        transform .25s ease,
        background .25s ease,
        box-shadow .25s ease;
}

.btn-marcas-cotizar:hover,
.btn-marcas-cotizar:focus-visible{
    background:#e97900;
    transform:translateY(-2px);
    box-shadow:0 14px 32px rgba(255,138,0,.34);
}

/* =========================
           SERVICIOS
========================= */

.about-services{
    width:100%;
    padding:90px 0 100px;
    background:
        radial-gradient(
            circle at 90% 20%,
            rgba(255,255,255,.16),
            transparent 25%
        ),
        linear-gradient(
            135deg,
            #f2a021,
            var(--naranja)
        );
}

.encabezado-servicios{
    max-width:780px;
    margin:0 auto 50px;
    text-align:center;
}

.servicios-etiqueta{
    margin-bottom:10px;
    color:var(--azul-profundo);
    font-size:14px;
    font-weight:800;
    letter-spacing:.12em;
}

.about-services .titulo{
    margin-bottom:16px;
    color:var(--azul-profundo);
    font-size:clamp(36px,4vw,52px);
    line-height:1.15;
}

.servicios-intro{
    color:#473916;
    font-size:17px;
    line-height:1.75;
}

.servicio-cont{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:28px;
}

.servicio-ind{
    width:100%;
    overflow:hidden;
    border:1px solid rgba(8,20,63,.08);
    border-radius:17px;
    background:#fff;
    text-align:left;
    box-shadow:0 17px 38px rgba(8,20,63,.15);
    transition:
        transform .35s ease,
        box-shadow .35s ease;
}

.servicio-ind:hover{
    transform:translateY(-8px);
    box-shadow:0 25px 48px rgba(8,20,63,.24);
}

.servicio-imagen{
    height:240px;
    position:relative;
    overflow:hidden;
    background:var(--azul-profundo);
}

.servicio-imagen::after{
    content:"";
    position:absolute;
    inset:0;
    background:
        linear-gradient(
            180deg,
            transparent 45%,
            rgba(8,20,63,.42) 100%
        );
}

.servicio-imagen img{
    width:100%;
    height:100%;
    margin:0;
    object-fit:cover;
    object-position:center;
    transition:transform .5s ease;
}

.servicio-ind:hover .servicio-imagen img{
    transform:scale(1.07);
}

.servicio-numero{
    position:absolute;
    left:22px;
    bottom:18px;
    z-index:2;
    color:#fff;
    font-size:15px;
    font-weight:800;
    letter-spacing:.12em;
}

.servicio-contenido{
    padding:28px;
}

.servicio-ind h3{
    margin-bottom:13px;
    color:var(--azul-profundo);
    font-size:23px;
    line-height:1.3;
}

.servicio-ind p{
    min-height:105px;
    color:#626a7d;
    font-size:15px;
    line-height:1.75;
    text-align:left;
}

.btn-servicio{
    margin-top:20px;
    padding:12px 17px;
    border:1px solid var(--azul);
    border-radius:8px;
    background:transparent;
    color:var(--azul);
    font:inherit;
    font-size:14px;
    font-weight:800;
    cursor:pointer;
    transition:
        color .25s ease,
        background .25s ease,
        border-color .25s ease,
        transform .25s ease;
}

.btn-servicio:hover,
.btn-servicio:focus-visible{
    border-color:var(--naranja-vivo);
    background:var(--naranja-vivo);
    color:#fff;
    transform:translateY(-2px);
}


/* =========================
        CLIENTES ACTUALES
========================= */

.clientes-actuales{
    width:100%;
    padding:90px 0 100px;
    background:
        radial-gradient(circle at 88% 18%,rgba(255,138,0,.10),transparent 26%),
        #f3f5f9;
}

.clientes-contenedor{
    padding-top:0;
    padding-bottom:0;
}

.encabezado-clientes{
    max-width:820px;
    margin:0 auto 50px;
    text-align:center;
}

.clientes-etiqueta{
    margin-bottom:10px;
    color:var(--naranja-vivo);
    font-size:14px;
    font-weight:800;
    letter-spacing:.12em;
}

.titulo-clientes{
    margin-bottom:16px;
    color:var(--azul-profundo);
    font-size:clamp(36px,4vw,52px);
    line-height:1.15;
}

.clientes-intro{
    color:#626a7d;
    font-size:17px;
    line-height:1.75;
}

.clientes-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:22px;
}

.cliente-card{
    min-height:145px;
    padding:25px;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
    border:1px solid #e0e4ed;
    border-radius:15px;
    background:#fff;
    box-shadow:0 14px 32px rgba(8,20,63,.09);
    transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease;
}

.cliente-card img{
    width:auto;
    max-width:100%;
    max-height:75px;
    object-fit:contain;
    filter:grayscale(1);
    opacity:.72;
    transition:transform .3s ease,filter .3s ease,opacity .3s ease;
}

.cliente-card:hover{
    transform:translateY(-6px);
    border-color:var(--naranja-vivo);
    box-shadow:0 22px 42px rgba(8,20,63,.17);
}

.cliente-card:hover img{
    transform:scale(1.06);
    filter:grayscale(0);
    opacity:1;
}

.clientes-sectores{
    max-width:1050px;
    margin:50px auto 0;
    padding:30px;
    border-radius:15px;
    background:
        radial-gradient(circle at 10% 20%,rgba(73,105,202,.18),transparent 28%),
        linear-gradient(135deg,var(--azul-profundo),var(--azul));
    color:#fff;
    text-align:center;
    box-shadow:0 16px 38px rgba(8,20,63,.18);
}

.clientes-sectores-titulo{
    margin-bottom:20px;
    color:var(--naranja-vivo);
    font-size:15px;
    font-weight:800;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.clientes-sectores ul{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:14px 24px;
    list-style:none;
}

.clientes-sectores li{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    color:rgba(255,255,255,.90);
    font-size:15px;
}

.clientes-sectores li::before{
    content:"✓";
    color:var(--naranja-vivo);
    font-weight:800;
}

.clientes-nota{
    max-width:720px;
    margin:25px auto 20px;
    color:#838a9c;
    font-size:13px;
    line-height:1.7;
    text-align:center;
}

.btn-clientes-cotizar{
    display:block;
    margin:0 auto;
    padding:15px 27px;
    border:0;
    border-radius:9px;
    background:var(--naranja-vivo);
    color:#fff;
    font:inherit;
    font-weight:800;
    cursor:pointer;
    box-shadow:0 10px 26px rgba(255,138,0,.25);
    transition:transform .25s ease,background .25s ease,box-shadow .25s ease;
}

.btn-clientes-cotizar:hover,
.btn-clientes-cotizar:focus-visible{
    background:#e97900;
    transform:translateY(-2px);
    box-shadow:0 14px 32px rgba(255,138,0,.34);
}

/* =========================
           CTA FINAL
========================= */

.cta-footer{
    width:100%;
    padding:62px 5%;
    background:
        radial-gradient(
            circle at 12% 30%,
            rgba(255,255,255,.13),
            transparent 25%
        ),
        linear-gradient(
            120deg,
            #f39b12,
            var(--naranja-vivo)
        );
}

.cta-footer-contenido{
    width:min(100%,1400px);
    margin:auto;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:45px;
}

.cta-footer-etiqueta{
    margin-bottom:9px;
    color:var(--azul-profundo);
    font-size:13px;
    font-weight:800;
    letter-spacing:.12em;
}

.cta-footer h2{
    max-width:760px;
    margin-bottom:12px;
    color:var(--azul-profundo);
    font-size:clamp(28px,3vw,43px);
    line-height:1.18;
}

.cta-footer-contenido > div:first-child > p:last-child{
    max-width:800px;
    color:#49330f;
    font-size:16px;
    line-height:1.7;
}

.cta-footer-acciones{
    display:flex;
    align-items:center;
    gap:13px;
    flex:0 0 auto;
}

.btn-footer-cotizar,
.btn-footer-whatsapp{
    min-height:49px;
    padding:0 23px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:9px;
    font:inherit;
    font-weight:800;
    text-decoration:none;
    cursor:pointer;
    transition:
        transform .25s ease,
        background .25s ease,
        border-color .25s ease,
        box-shadow .25s ease;
}

.btn-footer-cotizar{
    border:0;
    background:var(--azul-profundo);
    color:#fff;
    box-shadow:0 11px 28px rgba(8,20,63,.23);
}

.btn-footer-whatsapp{
    border:1px solid rgba(8,20,63,.32);
    background:rgba(255,255,255,.18);
    color:var(--azul-profundo);
}

.btn-footer-cotizar:hover,
.btn-footer-whatsapp:hover{
    transform:translateY(-3px);
}

.btn-footer-cotizar:hover{
    background:#050d2e;
    box-shadow:0 15px 34px rgba(8,20,63,.31);
}

.btn-footer-whatsapp:hover{
    border-color:var(--azul-profundo);
    background:#fff;
}

/* =========================
          FOOTER 2.0
========================= */

footer{
    width:100%;
    padding:72px 5% 25px;
    background:
        radial-gradient(
            circle at 7% 15%,
            rgba(52,83,177,.16),
            transparent 25%
        ),
        linear-gradient(
            135deg,
            #060d2d,
            #101957
        );
    color:#fff;
}

.footer-principal{
    width:min(100%,1400px);
    margin:auto;
    display:grid;
    grid-template-columns:1.35fr .72fr .85fr 1.25fr;
    gap:55px;
    padding-bottom:52px;
}

.footer-marca h3{
    max-width:320px;
    margin:18px 0 13px;
    color:#fff;
    font-size:22px;
    line-height:1.3;
}

.footer-logo{
    display:inline-block;
}

.footer-logo img{
    width:145px;
    max-height:82px;
    object-fit:contain;
    object-position:left center;
    filter:drop-shadow(0 7px 16px rgba(0,0,0,.28));
}

.footer-marca > p{
    max-width:370px;
    color:rgba(255,255,255,.68);
    font-size:14px;
    line-height:1.75;
}

.footer-social{
    margin-top:22px;
    display:flex;
    gap:10px;
}

.footer-social a{
    width:40px;
    height:40px;
    display:grid;
    place-items:center;
    border:1px solid rgba(255,255,255,.17);
    border-radius:9px;
    background:rgba(255,255,255,.06);
    color:#fff;
    font-size:13px;
    font-weight:800;
    text-decoration:none;
    transition:.25s ease;
}

.footer-social a:hover{
    border-color:var(--naranja-vivo);
    background:var(--naranja-vivo);
    transform:translateY(-3px);
}

.footer-columna h4{
    display:inline-block;
    margin-bottom:22px;
    padding-bottom:9px;
    border-bottom:3px solid var(--naranja-vivo);
    color:#fff;
    font-size:16px;
}

.footer-enlaces{
    display:flex;
    flex-direction:column;
    gap:12px;
    list-style:none;
}

.footer-enlaces a{
    color:rgba(255,255,255,.67);
    font-size:14px;
    line-height:1.45;
    text-decoration:none;
    transition:
        color .2s ease,
        padding-left .2s ease;
}

.footer-enlaces a:hover{
    padding-left:5px;
    color:var(--naranja-vivo);
}

.footer-contacto address{
    display:flex;
    flex-direction:column;
    gap:14px;
    font-style:normal;
}

.footer-contacto address p{
    display:grid;
    grid-template-columns:24px minmax(0,1fr);
    align-items:start;
    gap:8px;
    color:rgba(255,255,255,.70);
    font-size:14px;
    line-height:1.55;
}

.footer-contacto a{
    color:rgba(255,255,255,.70);
    overflow-wrap:anywhere;
    text-decoration:none;
    transition:color .2s ease;
}

.footer-contacto a:hover{
    color:var(--naranja-vivo);
}

.footer-icono{
    width:24px;
    height:24px;

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

    color:var(--naranja-vivo);

    flex-shrink:0;
}

.footer-icono svg{
    width:17px;
    height:17px;

    display:block;

    fill:#ff8a00 !important;
    color:#ff8a00 !important;
}
.footer-horario{
    margin-top:22px;
    padding:15px 17px;
    display:flex;
    flex-direction:column;
    gap:5px;
    border-left:3px solid var(--naranja-vivo);
    border-radius:0 8px 8px 0;
    background:rgba(255,255,255,.06);
}

.footer-horario strong{
    color:#fff;
    font-size:13px;
}

.footer-horario span{
    color:rgba(255,255,255,.62);
    font-size:12px;
    line-height:1.5;
}

.footer-inferior{
    width:min(100%,1400px);
    margin:auto;
    padding-top:23px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:25px;
    border-top:1px solid rgba(255,255,255,.13);
}

.footer-inferior p,
.footer-inferior a{
    color:rgba(255,255,255,.50);
    font-size:12px;
    line-height:1.6;
}

.footer-inferior a{
    color:var(--naranja-vivo);
    font-weight:700;
    text-decoration:none;
    white-space:nowrap;
}


/* BOTÓN */

#btn-regresar-arriba{
    position:fixed;
    right:24px;
    bottom:24px;
    width:50px;
    height:50px;
    z-index:100;
    border:0;
    border-radius:50%;
    background:var(--naranja-vivo);
    color:#fff;
    font-size:24px;
    cursor:pointer;
    opacity:0;
    visibility:hidden;
    transform:translateY(10px);
    transition:.25s;
}

#btn-regresar-arriba.visible{
    opacity:1;
    visibility:visible;
    transform:translateY(0);
}


/* =========================
       AJUSTES DEL ENCABEZADO
========================= */

.navbar::after{
    content:"";
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    height:1px;
    background:rgba(255,255,255,.08);
}

.marca img{
    filter:drop-shadow(0 4px 8px rgba(0,0,0,.28));
}

.nav-links{
    margin-left:auto;
}

#contacto{
    scroll-margin-top:20px;
}

/* =========================
            COTIZADOR
========================= */

body.modal-abierto{
    overflow:hidden;
}

.modal-cotizador{
    position:fixed;
    inset:0;
    z-index:1000;
    display:grid;
    place-items:center;
    padding:24px;
    opacity:0;
    visibility:hidden;
    transition:opacity .25s ease,visibility .25s ease;
}

.modal-cotizador.abierto{
    opacity:1;
    visibility:visible;
}

.modal-fondo{
    position:absolute;
    inset:0;
    background:rgba(4,9,31,.78);
    backdrop-filter:blur(5px);
}

.cotizador-panel{
    position:relative;
    z-index:1;
    width:min(94vw,760px);
    max-height:92vh;
    overflow:auto;
    padding:38px;
    border:1px solid rgba(255,255,255,.12);
    border-radius:20px;
    background:
        radial-gradient(circle at 100% 0,rgba(42,75,177,.24),transparent 32%),
        linear-gradient(145deg,#0b1746,#111f66);
    color:#fff;
    box-shadow:0 28px 80px rgba(0,0,0,.45);
    transform:translateY(18px) scale(.98);
    transition:transform .25s ease;
}

.modal-cotizador.abierto .cotizador-panel{
    transform:translateY(0) scale(1);
}

.cerrar-cotizador{
    position:absolute;
    top:16px;
    right:18px;
    width:38px;
    height:38px;
    border:0;
    border-radius:50%;
    background:rgba(255,255,255,.1);
    color:#fff;
    font-size:27px;
    line-height:1;
    cursor:pointer;
}

.cerrar-cotizador:hover{
    background:var(--naranja-vivo);
}

.cotizador-etiqueta{
    margin-bottom:8px;
    color:var(--naranja-vivo);
    font-size:13px;
    font-weight:800;
    letter-spacing:.1em;
}

.cotizador-panel h2{
    margin-bottom:9px;
    font-size:32px;
}

.cotizador-intro{
    margin-bottom:27px;
    color:rgba(255,255,255,.78);
    line-height:1.65;
}

.cotizador-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:18px;
}

.cotizador-grid label{
    display:flex;
    flex-direction:column;
    gap:8px;
    color:#fff;
    font-size:14px;
    font-weight:700;
}

.campo-completo{
    grid-column:1/-1;
}

.cotizador-grid input,
.cotizador-grid select,
.cotizador-grid textarea{
    width:100%;
    border:1px solid rgba(255,255,255,.17);
    border-radius:9px;
    outline:0;
    padding:13px 14px;
    background:rgba(255,255,255,.08);
    color:#fff;
    font:inherit;
    transition:border-color .2s,background .2s,box-shadow .2s;
}

.cotizador-grid select option{
    color:#111;
}

.cotizador-grid textarea{
    resize:vertical;
}

.cotizador-grid input::placeholder,
.cotizador-grid textarea::placeholder{
    color:rgba(255,255,255,.48);
}

.cotizador-grid input:focus,
.cotizador-grid select:focus,
.cotizador-grid textarea:focus{
    border-color:var(--naranja-vivo);
    background:rgba(255,255,255,.12);
    box-shadow:0 0 0 3px rgba(255,138,0,.13);
}

.cotizador-acciones{
    margin-top:26px;
    display:flex;
    justify-content:flex-end;
    gap:12px;
}

.cotizador-acciones button{
    min-height:45px;
    padding:0 20px;
    border-radius:9px;
    font:inherit;
    font-weight:800;
    cursor:pointer;
}

.btn-secundario{
    border:1px solid rgba(255,255,255,.24);
    background:transparent;
    color:#fff;
}

.btn-enviar-cotizacion{
    border:0;
    background:var(--naranja-vivo);
    color:#fff;
}

.btn-enviar-cotizacion:hover{
    background:#e97900;
}

.nota-cotizador{
    margin-top:17px;
    color:rgba(255,255,255,.57);
    font-size:12px;
    text-align:center;
}

/* RESPONSIVE */

@media(max-width:1180px){
    .marca-texto{
        display:none;
    }

    .nav-links{
        gap:18px;
    }

    .acerca-layout{
        grid-template-columns:1fr 1fr;
        gap:55px;
    }

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

@media(max-width:900px){

    /* Permite que el menú salga del área del header */
    .hero{
        overflow:visible;
    }

    .menu-toggle{
        display:block;
        position:relative;
        z-index:10001;
    }

    .nav-links{
        display:none;

        position:fixed;
        top:84px;
        right:4%;

        width:min(92vw,360px);

        /* IMPORTANTE */
        max-height:calc(100vh - 105px);
        overflow-y:auto;
        overscroll-behavior:contain;

        padding:20px;

        flex-direction:column;
        align-items:stretch;
        gap:8px;

        border:1px solid rgba(255,255,255,.08);
        border-radius:14px;

        background:
            linear-gradient(
                145deg,
                rgba(7,14,42,.99),
                rgba(16,32,107,.99)
            );

        box-shadow:
            0 20px 50px rgba(0,0,0,.45);

        z-index:10000;
    }

    .nav-links.abierto{
        display:flex;
    }

    .nav-links a{
        width:100%;
        padding:13px 12px;

        color:#fff;

        border-radius:7px;
    }

    .nav-links a:hover{
        color:var(--naranja-vivo);
        background:rgba(255,255,255,.05);
    }

    .nav-links a::after{
        display:none;
    }

    /* Botón cotizar también ocupa todo el ancho */
    .nav-links .btn-cotiza{
        width:100%;
        margin-top:6px;
        text-align:center;
    }
    .nav-links::-webkit-scrollbar{
    width:5px;
}

.nav-links::-webkit-scrollbar-track{
    background:transparent;
}

.nav-links::-webkit-scrollbar-thumb{
    background:rgba(255,138,0,.65);
    border-radius:10px;
}

.nav-links::-webkit-scrollbar-thumb:hover{
    background:var(--naranja-vivo);
}

      .btn-producto{
        width:100%;
        min-height:44px;

        max-height:none;
        margin-top:14px;
        padding:12px 15px;

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

        opacity:1;

        background:var(--naranja-vivo);
        color:#fff;

        border-radius:8px;

        font-size:14px;
        font-weight:800;
    }

    .hover-galeria{
        transform:none;
    }

    .imagen-port:hover .hover-galeria{
        transform:none;
    }

}

@media(max-width:500px){
    .clientes-actuales{padding:70px 0 80px;}
    .clientes-grid{grid-template-columns:1fr;gap:15px;}
    .cliente-card{min-height:120px;}
    .cliente-card img{max-height:62px;}
    .clientes-sectores{padding:25px 20px;}
    .clientes-sectores ul{grid-template-columns:1fr;}
    .btn-clientes-cotizar{width:100%;}

    .contenedor{
        width:90%;
        padding:40px 0;
    }

    .hero{
        height:245px;
    }

    .navbar{
        height:84px;
    }

    .marca img{
        width:55px;
        height:55px;
    }

    .onda{
        height:108px;
    }

    .sobre-nosotros{
        padding:55px 0 70px;
    }

    .acerca-layout{
        width:88%;
        gap:45px;
    }

    .columna-visual h1{
        font-size:42px;
    }

    .bloque{
        grid-template-columns:40px 1fr;
        gap:13px;
    }

    .numero{
        width:36px;
        height:36px;
        font-size:18px;
    }

    .bloque h2{
        font-size:23px;
    }

    .bloque p{
        font-size:15px;
    }

    .valores{
        grid-template-columns:1fr;
    }

    .imagen-port{
        width:100%;
    }

    .cards .card{
        width:100%;
        flex-direction:column;
        text-align:center;
    }

    .contenido-texto-card{
        width:100%;
        margin:20px 0 0;
    }

    .servicio-ind{
        width:100%;
    }
    .about-services{
    padding:70px 0 80px;
    }

    .servicio-imagen{
    height:230px;
    }

    .servicio-contenido{
    padding:23px 20px;
    }

    .servicio-ind h3{
    font-size:21px;
    }

    .btn-servicio{
    width:100%;
    text-align:center;
    }
    .contenedor-footer{
        flex-direction:column;
        border-bottom:none;
    }
    
}


@media(max-width:600px){
    .cotizador-panel{
        padding:30px 20px 24px;
    }

    .cotizador-panel h2{
        padding-right:30px;
        font-size:25px;
    }

    .cotizador-grid{
        grid-template-columns:1fr;
    }

    .campo-completo{
        grid-column:auto;
    }

    .cotizador-acciones{
        flex-direction:column-reverse;
    }

    .cotizador-acciones button{
        width:100%;
    }
}

@media(max-width:370px){
    .marcas-grid{
        grid-template-columns:1fr;
    }
}

@media(max-width:1050px){
    .cta-footer-contenido{
        align-items:flex-start;
        flex-direction:column;
    }

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

@media(max-width:650px){
    .cta-footer{
        padding:52px 6%;
    }

    .cta-footer-acciones{
        width:100%;
        align-items:stretch;
        flex-direction:column;
    }

    .btn-footer-cotizar,
    .btn-footer-whatsapp{
        width:100%;
    }

    footer{
        padding:58px 6% 24px;
    }

    .footer-principal{
        grid-template-columns:1fr;
        gap:38px;
    }

    .footer-inferior{
        align-items:flex-start;
        flex-direction:column;
    }
}


/* ==================================================
   RESPONSIVE DEFINITIVO - QUIÉNES SOMOS PREMIUM
================================================== */

@media(max-width:1100px){
    .sobre-nosotros{overflow:visible;}

    .acerca-layout-premium{
        width:min(90%,1050px);
        grid-template-columns:minmax(0,.9fr) minmax(330px,1.1fr);
        grid-template-areas:
            "intro visual"
            "stats visual"
            "contenido contenido";
        align-items:center;
        column-gap:42px;
        row-gap:34px;
    }

    .quienes-presentacion{grid-area:intro;padding-top:0;}
    .visual-industrial{grid-area:visual;width:min(100%,500px);justify-self:center;}
    .quienes-estadisticas{grid-area:stats;margin-top:18px;}

    .columna-contenido-premium{
        grid-area:contenido;
        padding:30px 0 0;
        border-left:0;
        border-top:1px solid rgba(255,255,255,.14);
        display:grid;
        grid-template-columns:1fr 1fr;
        gap:0 34px;
    }
}

@media(max-width:760px){
    .sobre-nosotros{padding:50px 0 68px;overflow:visible;}

    .acerca-layout-premium{
        width:88%;
        grid-template-columns:minmax(0,1fr);
        grid-template-areas:
            "intro"
            "visual"
            "stats"
            "contenido";
        gap:32px;
    }

    .quienes-presentacion{text-align:center;}
    .quienes-presentacion h1{font-size:clamp(46px,13vw,64px);line-height:.98;}
    .linea{margin-left:auto;margin-right:auto;}
    .quienes-resumen{max-width:500px;margin-left:auto;margin-right:auto;font-size:16px;}
    .btn-conoce-mas{margin-left:auto;margin-right:auto;}

    .visual-industrial{
        width:min(94vw,500px);
        max-width:100%;
        margin:0 auto;
    }

    .quienes-estadisticas{
        width:100%;
        margin-top:0;
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .estadistica-item{min-height:105px;padding:0 8px;}
    .estadistica-item strong{font-size:28px;}
    .estadistica-item small{font-size:8.5px;}

    .columna-contenido-premium{
        display:block;
        padding:10px 0 0;
        border-top:1px solid rgba(255,255,255,.13);
    }

    .bloque-premium,
    .bloque-premium:nth-child(odd),
    .bloque-premium:nth-child(even){
        padding:22px 0;
        border-right:0;
    }
}

@media(max-width:480px){
    .acerca-layout-premium{width:90%;gap:27px;}
    .quienes-presentacion h1{font-size:clamp(44px,15vw,58px);}
    .quienes-resumen{font-size:15px;line-height:1.65;}

    .visual-industrial{width:100%;max-width:390px;margin:0 auto;}

    .quienes-estadisticas{
        grid-template-columns:repeat(3,minmax(0,1fr));
        gap:0;
    }

    .estadistica-item{min-height:92px;padding:0 5px;}
    .estadistica-icono{font-size:21px;}
    .estadistica-item strong{font-size:25px;}
    .estadistica-item small{font-size:7.5px;letter-spacing:.02em;}

    .bloque-premium{grid-template-columns:36px minmax(0,1fr);gap:11px;}
    .numero{width:34px;height:34px;font-size:16px;}
    .bloque-titulo-fila{gap:8px;}
    .bloque-icono{width:42px;height:42px;flex-basis:42px;font-size:18px;}
    .bloque-premium h2{font-size:22px;}
    .bloque-premium p{font-size:14px;}
    .valores-premium{grid-template-columns:1fr;}

    /* ==================================================
   RESPONSIVE DEFINITIVO - SERVICIOS
   COLOCAR AL FINAL DEL CSS
================================================== */

/* TABLETS Y PANTALLAS MEDIANAS */
@media(max-width:1100px){

    .servicio-cont{
        display:grid;
        grid-template-columns:repeat(2, minmax(0,1fr));
        gap:24px;
    }

    .servicio-ind{
        width:100%;
        min-width:0;
    }

    .servicio-ind p{
        min-height:auto;
    }

}


/* TABLETS PEQUEÑAS Y MÓVILES */
@media(max-width:700px){

    .about-services{
        padding:65px 0 75px;
    }

    .servicio-cont{
        display:grid;
        grid-template-columns:1fr;
        gap:24px;
    }

    .servicio-ind{
        width:100%;
        max-width:520px;
        margin:0 auto;
    }

    .servicio-imagen{
        width:100%;
        height:260px;
    }

    .servicio-imagen img{
        width:100%;
        height:100%;
        object-fit:cover;
    }

    .servicio-contenido{
        padding:25px 22px;
    }

    .servicio-ind h3{
        font-size:23px;
        line-height:1.25;
    }

    .servicio-ind p{
        min-height:auto;
        font-size:15px;
        line-height:1.7;
    }

    .btn-servicio{
        width:100%;
        margin-top:20px;
        padding:13px 16px;

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

        white-space:normal;
        text-align:center;
    }

}


/* TELÉFONOS PEQUEÑOS */
@media(max-width:450px){

    .about-services{
        padding:55px 0 65px;
    }

    .encabezado-servicios{
        margin-bottom:35px;
    }

    .about-services .titulo{
        font-size:34px;
    }

    .servicios-intro{
        font-size:15px;
    }

    .servicio-cont{
        gap:20px;
    }

    .servicio-ind{
        width:100%;
        border-radius:14px;
    }

    .servicio-imagen{
        height:235px;
    }

    .servicio-contenido{
        padding:23px 20px 25px;
    }

    .servicio-ind h3{
        font-size:22px;
    }

    .servicio-ind p{
        font-size:15px;
        line-height:1.65;
    }

}
}

/* Refuerzo para SVG de contacto en hosting */
.footer-contacto .footer-icono svg,
.footer-contacto .footer-icono svg path{
    fill:#ff8a00 !important;
    color:#ff8a00 !important;
}