/* ============================================
   REPAS - Tema industrial oscuro
   Inspirado en el mail CAMARCO 2026
   Se carga DESPUES de style.css para sobreescribir
   ============================================ */

:root{
  --repas-black: #0a0a0a;
  --repas-black-2: #0f0f0f;
  --repas-black-3: #161616;
  --repas-red: #cc1a1a;
  --repas-red-bright: #ff2222;
  --repas-gray: #cccccc;
  --repas-gray-dark: #888888;
  --repas-border: #2a2a2a;
}

html, body{
  background-color:var(--repas-black) !important;
}
body{
  font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;
  color:var(--repas-gray) !important;
}

h1, h2, h3, h4, h5, h6{
  font-family:'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  font-weight:900 !important;
  text-transform:uppercase;
  letter-spacing:1.5px;
  color:#ffffff !important;
}

p, li, blockquote, label, span, td, th, .text-muted{
  color:var(--repas-gray) !important;
}

hr{
  border-color:var(--repas-border) !important;
}

/* ---- NAVBAR ---- */
.navbar.main-nav{
  background-color:var(--repas-black) !important;
  border-bottom:3px solid var(--repas-red);
}
.navbar.main-nav .nav-link{
  color:#ffffff !important;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:1.5px;
  font-size:13px;
}
.navbar.main-nav .nav-link:hover,
.navbar.main-nav .nav-link:focus,
.navbar.main-nav .nav-link.active{
  color:var(--repas-red-bright) !important;
}
.navbar.main-nav .dropdown-menu{
  background-color:var(--repas-black-2);
  border:1px solid var(--repas-border);
}
.navbar.main-nav .dropdown-item{
  color:#ffffff;
  text-transform:uppercase;
  font-size:12px;
  letter-spacing:1px;
  background-color:transparent;
}
.navbar.main-nav .dropdown-item:hover,
.main-nav .dropdown .dropdown-menu .dropdown-item:hover,
.main-nav .dropdown .dropdown-menu .dropdown-item:focus,
.main-nav .dropdown .dropdown-menu .dropdown-item.active{
  background-color:var(--repas-black-2) !important;
  color:var(--repas-red-bright) !important;
}
.navbar-toggler{
  border-color:var(--repas-red) !important;
}
.navbar-toggler-icon{
  filter:invert(1);
}

/* ---- BOTONES ---- */
.btn, a.btn, button.btn, .btn-rounded-icon{
  background-color:var(--repas-red) !important;
  border-color:var(--repas-red) !important;
  color:#ffffff !important;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:2px;
  border-radius:4px !important;
  transition:transform .25s ease, box-shadow .25s ease, background-color .25s ease;
}
.btn:hover, a.btn:hover, button.btn:hover{
  background-color:var(--repas-red-bright) !important;
  border-color:var(--repas-red-bright) !important;
  color:#ffffff !important;
  transform:scale(1.05);
  box-shadow:0 0 25px rgba(204,26,26,0.6);
}

/* ---- HOVER GENERAL (tarjetas, imagenes, iconos) ---- */
a, .card, [class*="card"], .icon-box, .service-item, .team-item,
.navbar-brand, [class*="item"] img, a img{
  transition:transform .3s ease, box-shadow .3s ease, color .2s ease;
}
.card:hover, [class*="card"]:hover,
.icon-box:hover, .service-item:hover, .team-item:hover{
  transform:scale(1.04);
  box-shadow:0 0 30px rgba(204,26,26,0.5);
}

/* ---- HERO / TITULO PRINCIPAL HOME ---- */
h1.text-center.mt-4{
  font-size:44px;
}

/* ---- LINKS ---- */
a{ color:var(--repas-red); }
a:hover{ color:var(--repas-red-bright); }

/* ---- FORMULARIOS ---- */
.form-control, input, textarea, select{
  background-color:var(--repas-black-2) !important;
  border:1px solid var(--repas-border) !important;
  color:#ffffff !important;
}
.form-control:focus, input:focus, textarea:focus, select:focus{
  border-color:var(--repas-red) !important;
  box-shadow:0 0 0 0.2rem rgba(204,26,26,0.25) !important;
}

/* ---- MODALES / LIGHTBOX ---- */
.modal-content{
  background-color:var(--repas-black-2) !important;
  color:var(--repas-gray) !important;
}

/* ---- TABLAS DE FICHA TECNICA ---- */
table{
  border-color:var(--repas-border) !important;
}
table td, table th{
  border-color:var(--repas-border) !important;
}

/* ---- FOOTER ---- */
footer{
  background-color:var(--repas-black) !important;
  color:var(--repas-gray) !important;
}
footer h1, footer h2, footer h3, footer h4, footer h5{
  color:#ffffff !important;
}
footer a{
  color:var(--repas-gray) !important;
}
footer a:hover{
  color:var(--repas-red-bright) !important;
}
footer hr{
  border-color:var(--repas-border) !important;
}

/* ---- UTILIDADES BOOTSTRAP BG ---- */
.bg-white{
  background-color:var(--repas-black-2) !important;
}
.bg-light{
  background-color:var(--repas-black-3) !important;
}


/* ============================================
   TIPOGRAFIAS PERSONALIZADAS REPAS
   Titulos: Univers 75 Black
   Parrafos: Univers ATT Regular
   Numeros: FF Nort Regular
   Especificaciones tecnicas: Univers Condensed (57)
   ============================================ */

@font-face{
  font-family:'Univers 75 Black';
  src:url('repas-fonts/univers-75-black.ttf') format('truetype');
  font-weight:900;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:'Univers ATT Regular';
  src:url('repas-fonts/univers-att-regular-fixed.woff2') format('woff2'),
      url('repas-fonts/univers-att-regular-fixed.ttf') format('truetype');
  font-weight:400;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:'FF Nort Regular';
  src:url('repas-fonts/ff-nort-regular.ttf') format('truetype');
  font-weight:400;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:'Univers Condensed';
  src:url('repas-fonts/Univers-condensed.ttf') format('truetype');
  font-weight:400;
  font-style:normal;
  font-display:swap;
}

/* ---- TITULOS ---- */
h1, h2, h3, h4, h5, h6{
  font-family:'Univers 75 Black', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  letter-spacing:1.5px !important;
}

/* ---- PARRAFOS / TEXTO GENERAL ---- */
body, p, li, blockquote, label, td, th, .text-muted{
  font-family:'Univers ATT Regular', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
}

/* ---- NUMEROS (telefonos, precios, contadores) ---- */
a[href^="tel:"], .footer-main .block-2 li,
[class*="numero"], [class*="number"], [class*="precio"], [class*="price"], [class*="stat"], [class*="contador"],
.repas-numero{
  font-family:'FF Nort Regular', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
}

/* ---- ESPECIFICACIONES TECNICAS (fichas tecnicas) ---- */
table, table td, table th,
.ficha-tecnica, .ficha-tecnica *,
[class*="especificacion"], [class*="specs"], [class*="ficha"]{
  font-family:'Univers Condensed', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
}


/* ============================================
   AJUSTES ADICIONALES - Julio 2026
   Logo, tarjetas de equipos
   ============================================ */

/* ---- LOGO: sin sombra al hacer hover, tamaño reducido ---- */
.navbar-brand img{
  height:56px !important;
  width:auto !important;
}
.navbar-brand:hover img,
a.navbar-brand:hover img{
  box-shadow:none !important;
}

/* ---- TARJETAS DE EQUIPOS/MAQUINAS (listados de productos por categoria) ---- */
div[style*="border:1px solid"]{
  background-color:#ffffff !important;
  box-sizing:border-box !important;
}
div[style*="border:1px solid"] h1,
div[style*="border:1px solid"] h2,
div[style*="border:1px solid"] h3,
div[style*="border:1px solid"] h4,
div[style*="border:1px solid"] h5,
div[style*="border:1px solid"] h6,
div[style*="border:1px solid"] p,
div[style*="border:1px solid"] li,
div[style*="border:1px solid"] span,
div[style*="border:1px solid"] strong,
div[style*="border:1px solid"] td,
div[style*="border:1px solid"] th{
  color:#111111 !important;
}
div[style*="border:1px solid"] .btn,
div[style*="border:1px solid"] a.btn,
div[style*="border:1px solid"] .btn *{
  color:#ffffff !important;
}



/* ============================================
   AJUSTES ADICIONALES 2 - separacion entre filas de tarjetas
   y compactar espaciado label/valor dentro de la tarjeta
   ============================================ */
div[style*="border:1px solid"]{
  color:#111111 !important;
  margin-bottom:40px !important;
  line-height:1.25 !important;
}
div[style*="border:1px solid"] br{
  display:block !important;
  content:"" !important;
  margin-top:2px !important;
}
div[style*="border:1px solid"] br:has(+ strong),
div[style*="border:1px solid"] br:has(+ b){
  margin-top:14px !important;
}
div[style*="border:1px solid"] .btn{
  margin-top:8px !important;
  margin-bottom:0 !important;
}



/* ============================================
   FIX: banner duplicado en el home
   Las clases d-xs-show / d-md-show no tenian
   reglas que las oculten/muestren segun tamaño
   ============================================ */
.d-xs-show{ display:block !important; }
.d-md-show{ display:none !important; }
@media (min-width:768px){
  .d-xs-show{ display:none !important; }
  .d-md-show{ display:block !important; }
}



/* ============================================
   POPUP DE WHATSAPP - texto mas chico, una linea,
   y sin todo mayusculas
   ============================================ */
#WhatsappModal .btn{
  text-transform:none !important;
  font-size:13px !important;
  padding:10px 16px !important;
  letter-spacing:0.5px !important;
  white-space:nowrap !important;
}

.clients .client-logo{
  background:transparent !important;
}
.clients .client-logo img{
  filter:none !important;
}

.rounded.shadow.p-5.bg-white{
  box-shadow:none !important;
}

span[style*="background:white"],
span[style*="background: white"]{
  background:transparent !important;
  color:#f0f0f0 !important;
}


/* Quitar hover zoom + glow rojo en las 3 fotos circulares (venta/repuestos/postventa) */
a:hover img[src*="B-vtas"],
a:hover img[src*="B-reps"],
a:hover img[src*="B-pvta"]{
  transform:none !important;
  box-shadow:none !important;
}

/* Ocultar los indicadores (bolitas) del carrusel */
.carousel-indicators{
  display:none !important;
}

/* Mas aire en la seccion de inicio: carrusel -> texto -> logos -> fotos */
.section.pt-0.position-relative.pull-top{
  padding-top: 163px !important;
}
.pull-top > .container > h1.text-center.mt-4{
  margin-top: 20px !important;
}
.pull-top > .container > p.text-center.mb-4{
  margin-bottom: 113px !important; /* ~3cm de aire antes de los logos */
}
.pull-top > .container > #clients.clients{
  margin-bottom: 60px !important;
}

/* Titulo "En Repas estamos en todos los caminos" mas chico en celular */
@media (max-width: 576px){
  h1.text-center.mt-4{
    font-size: 26px !important;
    line-height: 1.3 !important;
  }
}
@media (min-width: 577px) and (max-width: 768px){
  h1.text-center.mt-4{
    font-size: 32px !important;
    line-height: 1.3 !important;
  }
}

/* Logo mas chico en celular (header y footer) */
@media (max-width: 576px){
  .navbar-brand img{
    height: 42px !important;
    width: auto !important;
  }
  footer img[src*="logo.png"], .block img[src*="logo.png"]{
    height: 32px !important;
    width: auto !important;
  }
}

/* Mas aire entre el logo y la linea roja del navbar (compu y celular) */
.navbar.main-nav{
  padding-top: 32px !important;
  padding-bottom: 32px !important;
}

/* Logo pegado al borde izquierdo de la pantalla, como en sitios de otras marcas */
@media (min-width: 992px){
  .navbar-brand{
    margin-left: calc(50% - 50vw) !important;
    padding-left: 40px !important;
  }
}

/* Centrar horizontalmente los links del menu (Equipos, Accesorios, etc) en toda la pagina */
@media (min-width: 992px){
  .navbar-nav{
    position: absolute !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
  }
}

/* Arreglo general de responsive en celular: titulos gigantes y submenus que se salen de pantalla */
@media (max-width: 767px){
  h1{
    font-size: 26px !important;
    line-height: 1.3 !important;
    word-break: break-word !important;
  }
  .dropdown-menu{
    width: calc(100vw - 20px) !important;
    max-width: calc(100vw - 20px) !important;
    white-space: normal !important;
  }
  body, html{
    overflow-x: hidden !important;
  }
}


/* Logos de marcas: permitir que se agranden al pasar el mouse SIN que se corten
   (la caja tenia overflow:hidden fijo; ahora dejamos que el logo desborde libremente,
   hay espacio de sobra a los costados asi que no se pisa con el logo de al lado) */
.clients .client-logo{
  overflow: visible !important;
}

/* Mas separacion entre los logos de marcas para que al agrandarse (hover) no se tapen entre si */
.clients .client-logo{
  width: 156px !important;
  margin-left: 12px !important;
  margin-right: 12px !important;
}
.clients .client-logo:hover{
  position: relative !important;
  z-index: 5 !important;
}

/* Banners de categorias (Equipos: Excavadoras, Minicargadoras, etc) - quedaban muy bajos (200px)
   y se recortaba la imagen, ahora usamos el tama���o real pedido 1920x400 */
img[style*="max-height:200px"]{
  max-height: 400px !important;
  width: 100% !important;
  object-fit: cover !important;
}
/* =====================================================================
   TARJETAS NUEVAS - Excavadoras (piloto)
   (por ahora SOLO en la pagina de Excavadoras, ver
   el if en lista.php que separa esto del resto de
   categorias de Equipos)
   Foto a la izquierda, datos a la derecha, barra
   diagonal abajo con "Ver Catalogo" / "Solicitar Asesor"
   ===================================================================== */
  @font-face {
    font-family:'Univers Bold Condensed';
    src:url('repas-fonts/univers-condensed-bold.ttf') format('truetype');
    font-weight:700;
    font-style:normal;
    font-display:swap;
  }
  @font-face {
    font-family:'Univers Condensed';
    src:url('repas-fonts/Univers-condensed.ttf') format('truetype');
    font-weight:400;
    font-style:normal;
    font-display:swap;
  }
  /* igualar altura de tarjetas en la misma fila */
  .row > .col-md-6:has(.pcard){
    display:flex;
  }
  .row > .col-md-6 .pcard{
    flex:1 1 auto;
  }
  .pcard{
    background:#ffffff;
    border-radius:10px;
    overflow:hidden;
    box-shadow:0 10px 25px rgba(0,0,0,.4);
    display:flex;
    flex-direction:column;
    position:relative;
    text-align:left;
    margin:0 14px 44px;
  }
  .pcard-top{
    display:flex;
    flex:1;
  }
  .pcard-photo{
    flex:0 0 58%;
    max-width:58%;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:10px 8px 10px 14px;
    position:relative;
  }
  .pcard-photo img{width:100%;height:auto;display:block;object-fit:contain;}
  .pcard-body{
    flex:1;
    min-width:0;
    padding:14px 20px 6px 6px;
    display:flex;
    flex-direction:column;
    justify-content:center;
  }
  .pcard-body h2{
    font-family:'Univers Bold Condensed', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
    font-size:44px !important;
    font-weight:700 !important;
    color:#111 !important;
    text-transform:uppercase;
    letter-spacing:-2px !important;
    margin:0 0 18px;
    line-height:0.95;
  }
  .pcard-accent{width:34px;height:3px;background:#7B2130;margin-bottom:18px;}
  .pcard-specs div{margin-bottom:14px;}
  .pcard-note{font-family:'Univers Condensed', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;color:#333 !important;font-size:14px !important;line-height:1.4;margin:0 0 10px;}
  .pcard-specs .label{
    font-family:'Univers Bold Condensed', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
    display:block;font-weight:700 !important;color:#111 !important;font-size:15px !important;
    text-transform:uppercase;letter-spacing:0px;margin-bottom:2px;line-height:1.15;
  }
  .pcard-specs .value{font-family:'Univers Condensed', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;display:block;color:#333 !important;font-size:16px !important;line-height:1.15;}
  .pcard-footer{
    display:flex;
    height:56px;
    background:
      linear-gradient(118deg, rgba(255,255,255,.9) 0%, rgba(255,255,255,0) 70%),
      linear-gradient(118deg, #cfcfcf 0%, #cfcfcf 50%, #7B2130 50%, #7B2130 100%);
  }
  .pcard-footer > *{
    flex:1;
    display:flex;align-items:center;justify-content:center;gap:6px;
    font-family:'Univers Condensed', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    font-weight:400;font-size:13px;text-transform:uppercase;letter-spacing:0px;
    text-decoration:none;
    white-space:nowrap;
    position:relative;
    z-index:1;
  }
  .pcard-btn-catalog, .pcard-btn-catalog:link, .pcard-btn-catalog:visited{ color:#222 !important; }
  .pcard-btn-catalog svg{width:18px;height:18px;}
  .pcard-btn-asesor, .pcard-btn-asesor:link, .pcard-btn-asesor:visited{
  color:#fff !important;  }
.pcard-btn-asesor span{ color:#fff !important; }
.pcard-btn-asesor .arrow{
    display:inline-block;
    width:9px;
    height:9px;
    border-top:2px solid #fff;
    border-right:2px solid #fff;
    transform:rotate(45deg);
    margin-left:1px;
    flex-shrink:0;
  }

  /* neutralizar el hover-zoom generico ([class*="card"]:hover) sobre las tarjetas nuevas */
  .pcard:hover, .pcard *:hover {
    transform: none !important;
    box-shadow: none !important;
  }
  .pcard-btn-catalog:hover, .pcard-btn-asesor:hover {
    filter: brightness(1.12);
  }


  /* Version mobile: foto arriba, datos abajo (en vez de lado a lado) */
  @media (max-width:767px){
    .pcard{
      border-top:4px solid #7B2130;
    }
    .pcard-top{
      flex-direction:column;
    }
    .pcard-photo{
      flex:0 0 auto;
      max-width:100%;
      width:100%;
      padding:10px 14px 0 14px;
    }
    .pcard-photo img{
      max-height:280px;
    }
    .pcard-body{
      padding:6px 24px 16px 24px;
    }
    .pcard-body h2{
      font-size:34px !important;
      margin:0 0 10px !important;
    }
    .pcard-accent{
      margin-bottom:10px !important;
    }
    .pcard-specs div{
      margin-bottom:10px !important;
    }
    .pcard-footer{
      height:60px;
    }
  }

#overlay-ig {
  position: fixed;
  bottom: calc(20% - 75px);
  right: 13px;
  z-index: 2;
  cursor: pointer;
  transition: transform .15s ease;
}
#overlay-ig:hover {
  transform: scale(1.08);
}


/* ===== Repuestos: galeria, contacto y logos de marcas ===== */
.repuestos-gallery{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin:0 0 30px;
}
.repuestos-gallery-img{
  flex:1 1 260px;
  width:100%;
  max-width:100%;
  height:190px;
  object-fit:cover;
  border-radius:6px;
  display:block;
  border-top:3px solid #cc1a1a;
}
.repuestos-contact{
  margin-bottom:20px;
}
.repuestos-contact h3, .content-contact h3{
  font-family:'Univers 75 Black', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  color:#fff !important;
  font-size:19px;
  text-transform:uppercase;
  letter-spacing:1.5px;
  margin:24px 0 8px;
  border-left:4px solid var(--repas-red);
  padding-left:10px;
}
.repuestos-contact h3:first-child{ margin-top:0; }
.repuestos-contact p, .content-contact p{
  color:#ccc !important;
  font-size:15px;
  line-height:1.6;
  margin:0 0 4px;
}
.repuestos-contact a, .repuestos-contact a:link, .repuestos-contact a:visited{
  color:#cc1a1a !important;
  text-decoration:none;
}
.repuestos-logos{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  gap:16px;
  padding:26px 0 10px;
  border-top:1px solid rgba(255,255,255,.15);
}
.repuestos-logos img{
  height:36px;
  width:auto;
  max-width:150px;
  object-fit:contain;
  display:block;
  transition:transform 0.4s ease-in-out;
}
.repuestos-logos a{
  display:block;
  line-height:0;
}
.repuestos-logos a:hover img{
  transform:scale(1.2);
}

@media (max-width:767px){
  .repuestos-gallery{
    gap:10px;
    margin-bottom:22px;
  }
  .repuestos-gallery-img{
    flex:1 1 100%;
    height:200px;
  }
  .repuestos-contact h3{
    font-size:17px;
    margin:18px 0 6px;
  }
  .repuestos-contact p{
    font-size:14px;
  }
  .repuestos-logos{
    gap:20px;
    padding:20px 0 6px;
  }
  .repuestos-logos img{
    height:28px;
    max-width:120px;
  }
}


/* ===== Servicios / Alquiler: contenido general de paginas ===== */
.content-photo{
  max-width:100%;
  height:auto;
  border-radius:6px;
  display:block;
  margin:6px 0 26px;
  border-top:3px solid #f5b802;
}
.content-regions{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
  gap:18px;
  margin:18px 0 10px;
}
.content-region h4{
  font-family:'Univers Bold Condensed', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  color:#f5b802 !important;
  font-size:15px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:-0.3px;
  margin:0 0 6px;
}
.content-region p{
  color:#ccc !important;
  font-size:14px;
  line-height:1.6;
  margin:0;
}
.content-list{
  columns:2;
  column-gap:30px;
  margin:10px 0 26px;
  padding:0;
  list-style:none;
}
.content-list li{
  color:#ccc !important;
  font-size:14px;
  line-height:1.9;
  border-bottom:1px solid rgba(255,255,255,.08);
  padding:4px 0;
  break-inside:avoid;
}
.content-list li::before{
  content:"";
  display:inline-block;
  width:6px;
  height:6px;
  background:#f5b802;
  margin-right:8px;
  border-radius:50%;
}

@media (max-width:767px){
  .content-regions{ grid-template-columns:1fr; gap:14px; }
  .content-list{ columns:1; }
}


/* ===== Repuestos: seccion "por que elegir repuestos originales" + placeholders de borrador ===== */
.repuestos-why{
  display:flex;
  flex-wrap:wrap;
  gap:30px;
  align-items:center;
  margin:0 0 30px;
}
.repuestos-why-img-wrap{
  flex:1 1 320px;
  max-width:380px;
}
.repuestos-why-img{
  width:100%;
  height:auto;
  border-radius:8px;
  display:block;
  border-top:3px solid #cc1a1a;
}
.repuestos-why-text{
  flex:2 1 380px;
}
.repuestos-why-text h3{
  font-family:'Univers Bold Condensed', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  color:#fff !important;
  font-size:19px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:-0.5px;
  margin:0 0 12px;
  border-left:4px solid #cc1a1a;
  padding-left:10px;
}

.content-placeholder{
  background:repeating-linear-gradient(45deg, #161616, #161616 12px, #1f1f1f 12px, #1f1f1f 24px);
  border:2px dashed #f5b802;
  border-radius:8px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  color:#f5b802;
  font-family:'Univers Bold Condensed', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  text-transform:uppercase;
  font-size:13px;
  line-height:1.5;
  padding:16px;
}
.content-placeholder-wide{
  width:100%;
  height:280px;
  margin:0 0 30px;
}
.content-placeholder-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(180px,1fr));
  gap:16px;
  margin:0 0 30px;
}
.content-placeholder-grid .content-placeholder{
  aspect-ratio:1/1;
}
.content-placeholder-grid img{
  width:100%;
  aspect-ratio:1/1;
  object-fit:cover;
  border-radius:8px;
  display:block;
}

@media (max-width:767px){
  .content-placeholder-wide{ height:180px; }
  .repuestos-why{ gap:18px; }
  .repuestos-why-img-wrap{ max-width:100%; }
}


/* ===== Repuestos: hero + intro estilo "genuine parts" ===== */
.container:has(.repuestos-hero) > h2.mt-4,
.container:has(.repuestos-hero) > p.mb-4{
  display:none;
}
.repuestos-hero{
  position:relative;
  width:100vw;
  margin-left:calc(50% - 50vw);
  height:480px;
  background-image:linear-gradient(90deg, rgba(10,10,10,.92) 0%, rgba(10,10,10,.55) 45%, rgba(10,10,10,.15) 100%), url('https://repas.com.ar/images/deposito-repas.jpg');
  background-size:cover;
  background-position:center;
  display:flex;
  align-items:flex-end;
  margin-bottom:36px;
}
.repuestos-hero-overlay{
  max-width:1140px;
  width:100%;
  margin:0 auto;
  padding:0 15px 34px;
}
.repuestos-hero-eyebrow{
  display:block;
  font-family:'Univers 75 Black', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  color:#cc1a1a;
  font-size:13px;
  letter-spacing:1.5px;
  text-transform:uppercase;
  margin-bottom:6px;
}
.repuestos-hero-title{
  font-family:'Univers 75 Black', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  color:#fff;
  font-size:40px;
  text-transform:uppercase;
  letter-spacing:1.5px;
  margin:0;
}

.repuestos-intro{
  display:flex;
  flex-wrap:wrap;
  gap:40px;
  margin:0 0 34px;
}
.repuestos-intro-text, .repuestos-intro-list{
  flex:1 1 320px;
}
.repuestos-intro h3{
  font-family:'Univers 75 Black', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  color:#fff !important;
  font-size:18px;
  text-transform:uppercase;
  letter-spacing:1.5px;
  margin:0 0 12px;
  border-left:4px solid var(--repas-red);
  padding-left:10px;
}
.repuestos-intro-text p{
  color:#ccc;
  font-size:14px;
  line-height:1.8;
  margin:0;
}
.repuestos-intro-list .content-list{
  columns:1;
}

.repuestos-cta-row{
  display:flex;
  flex-wrap:wrap;
  gap:20px;
  margin:0 0 40px;
}
.repuestos-intro-list .content-list li::before{
  background:var(--repas-red) !important;
}
.repuestos-cta-photo{
  flex:1 1 260px;
  border-radius:8px;
  overflow:hidden;
  border-top:3px solid #cc1a1a;
  min-height:180px;
}
.repuestos-cta-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.repuestos-cta-card{
  flex:1 1 260px;
  background:#161616;
  border:1px solid #2a2a2a;
  border-top:3px solid #cc1a1a;
  border-radius:8px;
  padding:22px 24px;
  text-decoration:none;
  display:block;
  transition:transform .15s ease, border-color .15s ease;
}
.repuestos-cta-card:hover{
  transform:translateY(-3px);
  border-color:#cc1a1a;
  text-decoration:none;
}
.repuestos-cta-card h4{
  font-family:'Univers 75 Black', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  color:#cc1a1a !important;
  font-size:15px;
  text-transform:uppercase;
  letter-spacing:1.5px;
  margin:0 0 8px;
}
.repuestos-cta-card p{
  color:#ccc;
  font-size:13px;
  line-height:1.6;
  margin:0 0 10px;
}
.repuestos-cta-arrow{
  color:#cc1a1a !important;
  font-size:18px;
  font-weight:700;
}
.repuestos-banner-photo{
  border-top-color:#cc1a1a !important;
}

@media (max-width:767px){
  .repuestos-hero{ height:220px; }
  .repuestos-hero-title{ font-size:28px; }
  .repuestos-intro{ gap:24px; }
  .repuestos-cta-row{ gap:14px; }
}

body:has(.repuestos-hero) > img[alt="Repuestos"]{
  display:none !important;
}


/* Servicios - mapa interactivo */
.servicios-map-wrap {
  margin: 30px 0;
}
.servicios-map {
  width: 100%;
  height: 480px;
  border-radius: 10px;
  border: 2px solid #cc1a1a;
  box-shadow: 0 2px 10px rgba(0,0,0,0.5);
  z-index: 1;
  background: #e8e8e8;
}
.servicios-map .leaflet-tile-pane {
    filter: brightness(0.55) contrast(20) saturate(0) invert(1);
}
.servicios-map-legend {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 18px;
  padding: 18px;
  background: #0a0a0a;
  border-radius: 8px;
}
.servicios-map-legend-item {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.servicios-map-legend-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: #cc1a1a;
  color: #fff;
  font-weight: 900;
  font-size: 13px;
  font-style: normal;
  flex-shrink: 0;
}
.servicios-map-legend-name {
  color: #fff;
  font-weight: 700;
  font-size: 16px;
  margin-right: 2px;
}
.servicios-map-legend-info {
  color: #ddd;
  font-size: 15px;
}
.servicios-map-pin {
  background: transparent;
  border: none;
}
.servicios-map-pin span {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: #cc1a1a;
  border: 2px solid #fff;
  box-shadow: 0 1px 5px rgba(0,0,0,0.6);
  color: #fff;
  font-weight: 900;
  font-size: 12px;
}
.servicios-map .leaflet-popup-content-wrapper {
  background: #0a0a0a;
  color: #fff;
  border-radius: 6px;
  border: 1px solid #cc1a1a;
}
.servicios-map .leaflet-popup-content {
  font-size: 13px;
  line-height: 1.5;
  margin: 10px 12px;
}
.servicios-map .leaflet-popup-content strong {
  color: #ff3b3b;
}
.servicios-map .leaflet-popup-tip {
  background: #0a0a0a;
}
