/* ===== COMERCIO - PARTE 1 ===== */

.pagina-comercio{
    width:1100px;
    margin:30px auto;
    display:grid;
    grid-template-columns:1fr 250px;
    gap:25px;
}

.contenido-comercio{
    width:100%;
}

.cabecera-comercio{
    display:flex;
    justify-content:space-between;
    align-items:center;
    background:#0055aa;
    padding:8px 25px;
    margin-top:20px;
    margin-bottom:0;
}

.logo-comercio img{
    height:45px;
    display:block;
}

.menu-comercio{
    display:flex;
    gap:25px;
}

.menu-comercio a{
    color:white;
    text-decoration:none;
    font-weight:bold;
    font-size:14px;
}

.menu-comercio a:hover{
    text-decoration:underline;
}

.redes-cabecera{
    display:flex;
    gap:15px;
}

.redes-cabecera img{
    width:40px;
    height:40px;
    display:block;
}

.redes-cabecera img:hover{
    transform:scale(1.10);
}



.texto-portada{
    padding:20px;
    text-align:center;
    color:white;
}

.texto-portada h1{
    color:white;
    font-size:42px;
    margin:0 0 15px 0;
    text-shadow:2px 2px 6px rgba(0,0,0,0.80);
}

.texto-portada p{
    color:white;
    font-size:20px;
    max-width:1000px;
    margin:0 auto;
    text-shadow:2px 2px 6px rgba(0,0,0,0.80);
}

.descripcion-comercio,
.servicios-comercio,
.galeria-comercio,
.contacto-comercio{
    background:white;
    padding:25px;
    margin-bottom:25px;
    border-radius:10px;
    box-shadow:0 2px 10px rgba(0,0,0,0.20);
}

.descripcion-comercio h2,
.servicios-comercio h2,
.galeria-comercio h2,
.contacto-comercio h2{
    color:#0055aa;
    margin-top:0;
}

.servicios-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:15px;
}

.servicio{
    background:#0055aa;
    color:white;
    padding:15px;
    text-align:center;
    border-radius:6px;
}

.galeria-grid{
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:20px;
}

.galeria-grid img{
    width:100%;
    height:220px;
    object-fit:cover;
    border-radius:8px;
    cursor:pointer;
}

.contacto-comercio{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:30px;
}

.datos-contacto{
    font-size:16px;
}

.marcas-promos{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:20px;
    margin:35px 0;
}

.marcas-promos img{
    width:100%;
    aspect-ratio:5 / 2;
    object-fit:cover;
    border-radius:12px;
    display:block;
    transition:transform 0.30s ease, box-shadow 0.30s ease;
}

.marcas-promos img:hover{
    transform:scale(1.05);
    box-shadow:0 8px 20px rgba(0,0,0,0.30);
}

.redes-sociales{
    display:flex;
    gap:15px;
    margin-top:15px;
}

.redes-sociales a{
    background:none;
    padding:0;
}

.redes-sociales img{
    width:40px;
    height:40px;
    display:block;
}

.redes-sociales img:hover{
    transform:scale(1.10);
}
/* ===== COMERCIO - PARTE 2 ===== */

.portada-comercio{
    background:white;
    border-radius:0px;
    overflow:hidden;
    box-shadow:0 2px 10px rgba(0,0,0,0.20);
    margin-bottom:30px;
    height:430px;
    background-size:cover;
    background-position:center;
    display:flex;
    align-items:center;
    justify-content:center;
}

.portada-elh{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/ELH/ehl 1.jpg");
}

.portada-climameter{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/Climameter/frente3.jpg");
}

.portada-RAM{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/Ram/ram frente nuevo.jpg");
}

.portada-cia{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/CIA/frente.jpg");
}

.portada-radiadoreslaplata{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/Radiadores-La-Plata/Radiadores La Plata grande.jpg");
}

.portada-autocenter{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/Autocenter/Autocenter frente2.jpg");
}

.portada-sanjorge{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/Cerrajeria-San-Jorge/San Jorge frente.jpg");
}

.portada-neumaticos137{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/Neumaticos-137/frente.jpg");
}

.portada-autopartesvillaelisa{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/Autopartes-Villa-Elisa/AVE-frente.jpg");
}

.portada-encendido-olmos{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/Encendido-Olmos/Olmos\ frente.jpg");
}

.portada-vw-122{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/Vw-122/frente-portada.jpg?v=2");
}

.portada-repuestos-fabian{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/Repuestos-Fabian/frente.jpg");
}
.portada-dvr{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/DVR-Autopartes/frente-final.jpg");
}

.portada-el-pinguino{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/El-Pinguino/frente-portada.jpg");
}

.portada-bermudez-neumaticos{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/Bermudeez-Neumaticos/frente-portada2.jpg");
}

.portada-fbt-equipamientos{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/FBT-equipamientos/frente-portada.jpg");
}

.portada-xenon{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/Xenon-hid-LP/frente-portada.jpg");
}

.logo-xenon img{
    height:38px;
    width:auto;
}

.portada-andres{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/Andres/frente-portada2.jpg");
}

.portada-autopartes-ensenada{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/Autopartes-Ensenada/frente-portada.jpg");
}

.portada-circular{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/Circular/frente-portada.jpg");
}

.portada-taller31{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/Taller-31/frente-portada.jpg");
}

.portada-cr-repuestos{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/CR-Repuestos/frente-portada.jpg");
}

.portada-peugeot-guillermo{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/Peugeot-Guillermo/frente-portada.jpg");
}
.portada-baterplat{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/Baterplat/frente-portada.jpg?v=2");
}
.portada-baterias60{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/Baterias60/frente-portada.jpg");
}
.portada-mainetti{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/Mainetti/frente-portada.jpg");
}
.portada-bautista{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/Bautista/frente-portada.jpg");
}
.portada-nicorepuestos{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/Nico-Repuestos/frente-portada.jpeg");
}
.portada-cym72{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/C&M-72/frente-portada.jpg");
}

.portada-cajaloshornos{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/Caja-de-Cambios-Los-hornos/frente-portada.jpg");
}
.portada-jc-escapes{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/JC-Escapes/frente-portada.jpg");
}
.portada-fernando{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/Fernando/frente-portada.jpg");
}
.portada-galaxi{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/galaxi/frente-portada.jpg");
}
.portada-laclinica{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/La-clinica-del-paragolpe/frente-portada.jpeg");
}
.portada-jorgito{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/Taller-Jorgito/frente-portada.jpg");
}
.portada-elangel{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/El-Angel/frente-portada.jpg");
}
.portada-bumper{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/Bumper-Tuning/frente-portada.jpg");
}
.portada-chichi{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/Chichi/frente-portada.jpg");
}
.portada-mg-suspension{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/Suspension-MG/frente-portada.jpg");
}
.portada-la-loma{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/Embragues-La-Loma/frente-portada.jpg");
}
.portada-ruta66{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/Ruta-66/frente-portada.jpg");
}
.portada-teloresuelvoya{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/Te-lo-resuelvo-Ya/frente-portada.jpg");
}
.portada-f1{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/F1-Suspensiones/frente-portada.jpg");
}
.portada-autoclub{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/Auto-Club/frente-portada.jpg");
}
.portada-mvfrenos{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/MV-Frenos/frente-portada.jpg");
}
.portada-autogas{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/Autogas/frente-portada.jpg");
}
.portada-mjm{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/M-J-M/frente-portada.jpg");
}
.portada-lubricentro38{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/Lubricentro-38/frente-portada.jpg");
}
.portada-mussari{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/Mussari/frente-portada.jpg");
}
.portada-morales{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/Lubricentro-Morales/frente-portada.jpg");
}
.portada-centerlub{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/Center-lub/frente-portada.jpg");
}
.portada-monasterio{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/Lubricentro-Monasterio/frente-portada.jpg");
}
.portada-lubritato{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/Lubritato/frente-portada.jpg");
}
.portada-hector{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/Lubricentro-Hector/frente-portada.jpg");
}
.portada-lospalis{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/Los-Palis/frente-portada.jpg");
}
.portada-7oil{
    background-image:
        linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
        url("../imagenes/7-Oil/frente-portada.jpg");
}
.visor-foto{
    display:none;
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:rgba(0,0,0,0.90);
    z-index:9999;
    justify-content:center;
    align-items:center;
}

.visor-foto img{
    max-width:90%;
    max-height:90%;
    border-radius:10px;
}

.cerrar-foto{
    position:absolute;
    top:20px;
    right:30px;
    color:white;
    font-size:45px;
    cursor:pointer;
}

.anterior,
.siguiente{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    color:white;
    font-size:60px;
    cursor:pointer;
    user-select:none;
    padding:20px;
}

.anterior{
    left:20px;
}

.siguiente{
    right:20px;
}

.logo-climameter img{
    height:50px;
}

.logo-mg-suspension img{
    height:42px;
}

.logo-cia img{
    height:42px;
}

.logo-taller31 img{
    height:35px;
}

.logo-peugeot-guillermo img{
    height:30px;
}
.logo-la-loma img{
    height:30px;
}
.logo-ruta66 img{
    height:50px;
}
.logo-autogas img{
    height:42px;
}
.logo-autoensenada img{
    height:55px;
}
.banner-alto-especial{
    height:250px !important;
}
.contacto-comercio .boton-whatsapp{
    display:inline-block;
    background-color:#0bbf4f;
    color:white;
    text-decoration:none;
    padding:10px 18px;
    border-radius:6px;
    font-weight:bold;
    margin-top:10px;
}

.contacto-comercio .boton-whatsapp:hover{
    background-color:#099b40;
}
.contacto-comercio p{
    display:flex;
    align-items:center;
    gap:10px;
    margin:12px 0;
}

.contacto-comercio .icono-contacto{
    width:24px;
    height:24px;
    flex-shrink:0;
    display:block;
}
.quienes-somos{
    background:#fff;
    border-radius:10px;
    box-shadow:0 2px 10px rgba(0,0,0,.20);
    padding:35px;
    margin-bottom:25px;

    display:flex;
    align-items:flex-start;
    gap:40px;
}

.quienes-imagen{
    width:40%;
}

.quienes-imagen img{
    width:100%;
    display:block;
    border-radius:10px;
}

.quienes-texto{
    width:55%;
}

.quienes-texto h2{
    color:#0055aa;
    font-size:28px;
    margin:0 0 25px 0;
}

.quienes-texto p{
    font-size:18px;
    line-height:1.8;
    margin-bottom:18px;
}