:root{--brand:#0b5ed7}
.btn-success{background-color:#25D366;border-color:#25D366}
.btn-success:hover{filter:brightness(.95)}
.card img{object-fit:cover}
/* HERO con imagen de fondo + overlay azul */
.hero-short{
  position: relative;
  color: #fff;
  min-height: 420px;            /* ajusta la altura si quieres más/menos */
  display: flex; align-items: center;
  overflow: hidden;
}
.hero-short::before{
  content: "";
  position: absolute; inset: 0;
  background:
    linear-gradient(to bottom, rgba(11,94,215,.70), rgba(11,94,215,.70)),
    url("../assets/hero.jpg") center/cover no-repeat;  /* si tu archivo es .png, cámbialo aquí */
  z-index: 0;
}
.hero-short > .container{ position: relative; z-index: 1; }
.hero-short .lead { opacity: .95; }
/* Tamaño fijo de logos de marcas */
#marcas img.brand-logo{
  height: 36px;             /* cámbialo a 28–48px a gusto */
  width: auto !important;   /* evita que se estiren a 100% */
  max-width: none !important;
  object-fit: contain;
  filter: grayscale(100%);
  opacity: .9;
  transition: filter .2s ease, opacity .2s ease;
}
#marcas img.brand-logo:hover{ filter:none; opacity:1 }

/* Centrado vertical/horizontal en cada celda */
#marcas .col-4, #marcas .col-md-2{
  display: flex; align-items: center; justify-content: center;
}

/* En móvil, un poco más chicos */
@media (max-width: 576px){
  #marcas img.brand-logo{ height: 28px; }
}
/* ---- Franja de logos ---- */
#marcas .brands{
  display:flex;
  flex-wrap:wrap;
  gap:20px 24px;
  align-items:center;
  justify-content:center;
}

#marcas .brand{
  flex: 0 0 auto;
  width: 140px;              /* ancho del “bloque” del logo */
  height: 64px;              /* alto del bloque */
  display:flex;
  align-items:center;
  justify-content:center;
  background:#fff;
  border:1px solid #e9ecef;
  border-radius:12px;
}

#marcas .brand img{
  height: 32px;              /* <-- tamaño real del logo */
  width: auto !important;    /* evita estirarlo */
  max-width: 120px;          /* por si el logo es muy apaisado */
  object-fit: contain;
  filter: grayscale(100%);
  opacity: .9;
  transition: filter .2s, opacity .2s;
}
#marcas .brand img:hover{ filter:none; opacity:1; }

@media (max-width: 576px){
  #marcas .brand{ width:120px; height:56px; }
  #marcas .brand img{ height:28px; max-width:100px; }
}
/* ---- Franja horizontal de marcas ---- */
.brands-strip .brands-track{
  display:flex;
  gap: 28px;                   /* separación entre logos */
  align-items:center;
  justify-content:center;      /* centrado en desktop */
  flex-wrap:wrap;              /* que bajen de línea si no caben */
}

.brands-strip img{
  height: 36px;                /* tamaño del logo */
  width:auto;
  object-fit:contain;
  filter: grayscale(100%);
  opacity:.9;
  transition: filter .2s, opacity .2s;
}
.brands-strip img:hover{ filter:none; opacity:1 }

/* En móvil: fila con desplazamiento horizontal */
@media (max-width: 768px){
  .brands-strip .brands-track{
    overflow-x:auto;
    flex-wrap:nowrap;          /* todo en una sola fila */
    justify-content:flex-start;
    padding-bottom: 6px;
  }
  .brands-strip img{ height: 28px; }
}
.card-img-top{
  height: 160px;          /* prueba 160–200px */
  object-fit: cover;
  background: #f1f3f5;
}
.brands-strip img{ height: 30px; }   /* antes 36px */
@media (max-width:768px){ .brands-strip img{ height: 24px; } }
/* ---- Ticker de opiniones ---- */
.opiniones-ticker{
  background:#fff;
  border-top:1px solid #e9ecef;
  border-bottom:1px solid #e9ecef;
}
.opiniones-ticker .marquee{ overflow:hidden; }
.opiniones-ticker .marquee__inner{
  display:inline-flex;
  gap:16px;
  padding:10px 0;
  white-space:nowrap;
  animation:opiniones-scroll 35s linear infinite; /* velocidad */
}
.opiniones-ticker:hover .marquee__inner{ animation-play-state:paused; } /* pausa al pasar el mouse */

.opiniones-ticker .pill{
  display:inline-flex; align-items:center; gap:8px;
  background:#f8f9fa;
  border:1px solid #e9ecef;
  border-radius:999px;
  padding:6px 12px;
  font-size:.95rem;
  white-space:nowrap;
}
.opiniones-ticker .pill i{ opacity:.6; }

@keyframes opiniones-scroll{
  from{ transform:translateX(0); }
  to{   transform:translateX(-50%); } /* recorre la mitad porque duplicamos los ítems */
}
/* Trust badges */
.badge-card{background:#fff;border:1px solid #e9ecef;border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:4px}
.badge-card i{font-size:22px;opacity:.8}
.badge-card b{font-size:.98rem}
.badge-card span{font-size:.9rem;opacity:.8}
:root{ --brand:#0b5ed7; }
.navbar .btn-whatsapp{ border-radius:999px; }
.navbar .brand-logo{ height:28px; width:auto; display:block; }
@media (max-width:576px){ .navbar .brand-logo{ height:24px } }

/* HERO: imagen + overlay azul (usa assets/hero.jpg) */
.hero-short{ position:relative; color:#fff; min-height:420px; display:flex; align-items:center; overflow:hidden; }
.hero-short::before{
  content:""; position:absolute; inset:0;
  background:
    linear-gradient(to bottom, rgba(11,94,215,.70), rgba(11,94,215,.70)),
    url("../assets/hero.jpg") center/cover no-repeat;
  z-index:0;
}
.hero-short>.container{ position:relative; z-index:1; }
.hero-short .lead{ opacity:.95 }

/* MARCAS */
.brands-strip .brands-track{ display:flex; gap:28px; align-items:center; justify-content:center; flex-wrap:wrap; }
.brands-strip img{ height:30px; width:auto; object-fit:contain; filter:grayscale(100%); opacity:.9; transition:filter .2s, opacity .2s; }
.brands-strip img:hover{ filter:none; opacity:1 }
@media (max-width:768px){
  .brands-strip .brands-track{ overflow-x:auto; flex-wrap:nowrap; justify-content:flex-start; padding-bottom:6px; }
  .brands-strip img{ height:24px }
}

/* Cards categorías */
.card-img-top{ height:160px; object-fit:cover; background:#f1f3f5 }

/* Ticker opiniones */
.opiniones-ticker{ background:#fff; border-top:1px solid #e9ecef; border-bottom:1px solid #e9ecef; }
.opiniones-ticker .marquee{ overflow:hidden; }
.opiniones-ticker .marquee__inner{
  display:inline-flex; gap:16px; padding:10px 0; white-space:nowrap;
  animation:opiniones-scroll 35s linear infinite;
}
.opiniones-ticker:hover .marquee__inner{ animation-play-state:paused; }
.opiniones-ticker .pill{
  display:inline-flex; align-items:center; gap:8px;
  background:#f8f9fa; border:1px solid #e9ecef; border-radius:999px;
  padding:6px 12px; font-size:.95rem; white-space:nowrap;
}
.opiniones-ticker .pill i{ opacity:.6; }
@keyframes opiniones-scroll{ from{transform:translateX(0)} to{transform:translateX(-50%)} }
:root{ --brand:#0b5ed7; }
.navbar .btn-whatsapp{ border-radius:999px; }
.navbar .brand-logo{ height:28px; width:auto; display:block; }
@media (max-width:576px){ .navbar .brand-logo{ height:24px } }

/* HERO: imagen + overlay azul (usa assets/hero.jpg) */
.hero-short{ position:relative; color:#fff; min-height:420px; display:flex; align-items:center; overflow:hidden; }
.hero-short::before{
  content:""; position:absolute; inset:0;
  background:
    linear-gradient(to bottom, rgba(11,94,215,.70), rgba(11,94,215,.70)),
    url("../assets/hero.jpg") center/cover no-repeat;
  z-index:0;
}
.hero-short>.container{ position:relative; z-index:1; }
.hero-short .lead{ opacity:.95 }

/* MARCAS */
.brands-strip .brands-track{ display:flex; gap:28px; align-items:center; justify-content:center; flex-wrap:wrap; }
.brands-strip img{ height:30px; width:auto; object-fit:contain; filter:grayscale(100%); opacity:.9; transition:filter .2s, opacity .2s; }
.brands-strip img:hover{ filter:none; opacity:1 }
@media (max-width:768px){
  .brands-strip .brands-track{ overflow-x:auto; flex-wrap:nowrap; justify-content:flex-start; padding-bottom:6px; }
  .brands-strip img{ height:24px }
}

/* Cards categorías */
.card-img-top{ height:160px; object-fit:cover; background:#f1f3f5 }

/* Ticker opiniones */
.opiniones-ticker{ background:#fff; border-top:1px solid #e9ecef; border-bottom:1px solid #e9ecef; }
.opiniones-ticker .marquee{ overflow:hidden; }
.opiniones-ticker .marquee__inner{
  display:inline-flex; gap:16px; padding:10px 0; white-space:nowrap;
  animation:opiniones-scroll 35s linear infinite;
}
.opiniones-ticker:hover .marquee__inner{ animation-play-state:paused; }
.opiniones-ticker .pill{
  display:inline-flex; align-items:center; gap:8px;
  background:#f8f9fa; border:1px solid #e9ecef; border-radius:999px;
  padding:6px 12px; font-size:.95rem; white-space:nowrap;
}
.opiniones-ticker .pill i{ opacity:.6; }
@keyframes opiniones-scroll{ from{transform:translateX(0)} to{transform:translateX(-50%)} }
/* Blog cards */
.blog-thumb{ height:160px; object-fit:cover; background:#f1f3f5 }
.blog-card h2{ line-height:1.25 }
.shipping-logos img{
  object-fit: contain;
  opacity:.95;
  transition: filter .2s ease, opacity .2s ease;
}
.shipping-logos img:hover{ opacity:1; filter:none; }

#kpis .counter { letter-spacing: .5px; }
#kpis .card { border: 0; }

/* Carrusel vertical */
.v-carousel{
  height: 420px;          /* alto visible; ajusta a gusto */
  overflow: hidden;
}
.v-carousel-track{
  display: flex;
  flex-direction: column;
  gap: .75rem;
  transition: transform .6s ease;
  will-change: transform;
}

/* Tarjeta compacta */
.v-card{
  display: flex;
  align-items: center;
  gap: .75rem;
  padding: .65rem .75rem;
  border: 1px solid var(--bs-border-color);
  border-radius: .75rem;
  background: var(--bs-body-bg);
}
.v-card:hover{ background: rgba(0,0,0,.03); }
.v-card img{
  width: 84px; height: 58px;
  border-radius: .5rem;
  object-fit: cover;
  flex: 0 0 auto;
}
.v-title{ color: var(--bs-body-color); }

/* Botones */
.v-nav{ z-index: 2; }
/* Consejos como tarjetas no clickeables */
.v-card { cursor: default; }
.v-card img { width: 84px; height: 84px; object-fit: cover; }
/* Recuadros informativos */
.info-card{
  background:#fff;
  border:1px solid rgba(0,0,0,.06);
  border-left:6px solid var(--brand, #0b5ed7);
  border-radius:14px;
  box-shadow:0 .4rem 1.2rem rgba(0,0,0,.06);
}

/* Detalle de iconos y encabezados */
.info-card h3{ font-weight:700; }
.info-card .bi{ vertical-align:middle; }
/* Modal VIN */
.vin-where img{
  width:100%;
  height:220px;
  object-fit:cover;
  border-top-left-radius: .5rem;
  border-top-right-radius: .5rem;
}
.vin-where .card{ border-radius:.5rem; }
/* ===== Glass Ticker ===== */
.glass-ticker-wrap { margin-top: 1.5rem; margin-bottom: 1.25rem; }

.glass-ticker {
  position: relative;
  overflow: hidden;
  border-radius: 16px;
  /* efecto vidrio */
  background: linear-gradient(90deg, rgba(255,255,255,.55), rgba(255,255,255,.48));
  backdrop-filter: blur(8px) saturate(115%);
  -webkit-backdrop-filter: blur(8px) saturate(115%);
  border: 1px solid rgba(255,255,255,.6);
  box-shadow: 0 8px 24px rgba(13, 110, 253, .08); /* suave y limpio */
  padding-block: 10px;
}

.glass-ticker .track {
  display: inline-flex;
  gap: 12px;
  white-space: nowrap;
  padding-inline: 20px;
  animation: ticker-scroll 32s linear infinite;
}

.glass-ticker .track:nth-child(2) {
  /* arranca a mitad de camino para loop continuo */
  animation-delay: -16s;
}

@keyframes ticker-scroll {
  from { transform: translateX(0); }
  to   { transform: translateX(-100%); }
}

/* Chip estilo “píldora” */
.chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  border-radius: 999px;
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(0,0,0,.06);
  box-shadow: 0 6px 18px rgba(0,0,0,.06);
  font-weight: 600;
  color: #0b5ed7; /* combina con tu header azul */
}

.chip img {
  width: 22px; height: 22px; object-fit: contain;
  filter: drop-shadow(0 1px 1px rgba(0,0,0,.1));
}

/* Pausa al pasar el mouse (desktop) */
.glass-ticker:hover .track { animation-play-state: paused; }

/* Accesibilidad: respeta reducir movimientos */
@media (prefers-reduced-motion: reduce) {
  .glass-ticker .track { animation: none; }
}
.glass-ticker { padding-block: 8px; }
.chip { padding: 7px 12px; }