/* Green Route Halloween 2026 + Popup H1. No afecta Turnstile. */
.gr-promo-modal[hidden]{display:none!important}
.gr-promo-modal{position:fixed;inset:0;z-index:30000;display:flex;justify-content:center;align-items:center;padding:18px;padding-top:max(18px,env(safe-area-inset-top));padding-bottom:max(18px,env(safe-area-inset-bottom))}
.gr-promo-backdrop{position:absolute;inset:0;background:rgba(7,13,15,.79);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.gr-promo-dialog{position:relative;z-index:1;display:flex;flex-direction:column;width:min(430px,94vw);max-height:90dvh;overflow:hidden;background:#fff;border-radius:17px;box-shadow:0 24px 80px rgba(0,0,0,.48);outline:0}
.gr-promo-link{display:block;max-height:calc(90dvh - 40px);min-height:0;overflow:auto;line-height:0}
.gr-promo-link img{display:block;width:100%;height:auto;max-height:calc(90dvh - 46px);object-fit:contain;object-position:top center}
.gr-promo-close{position:absolute;top:10px;right:10px;z-index:3;border:0;border-radius:50%;background:#101c1b;color:#fff;width:40px;height:40px;font-family:Arial,sans-serif;font-size:29px;line-height:35px;cursor:pointer;box-shadow:0 2px 13px #0009}
.gr-promo-close:hover{background:#ec690d}
.gr-promo-close:focus-visible,.gr-promo-link:focus-visible{outline:3px solid #f58226;outline-offset:-3px}
.gr-promo-note{font-size:11px;text-align:center;color:#475569;background:#fff;padding:8px 12px;margin:0;line-height:1.3}
.gr-promo-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
body.gr-halloween{--halloween-orange:#fd842a;--halloween-black:#121722}
body.gr-halloween header{border-bottom:3px solid #ef801c}
body.gr-halloween header .nav-menu a:hover{color:#d96b19}
body.gr-halloween .promotions .section-subtitle,body.gr-halloween .featured-cars .section-subtitle{color:#d86d13}
body.gr-halloween .gr-halloween-banner{display:flex}
.gr-halloween-banner{display:none;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;margin:95px auto 0;padding:14px 17px;background:linear-gradient(105deg,#152c1c,#1b1925 55%,#4a2d12);color:#fff;text-align:center;font:600 15px/1.4 Montserrat,Arial,sans-serif}
.gr-halloween-banner strong{color:#ffbd76}
.gr-halloween-banner a{display:inline-flex;align-items:center;justify-content:center;background:#fa8c2d;border-radius:999px;color:#121722;font-weight:800;padding:8px 16px;text-decoration:none}

/* Green Route - Halloween decorativo sin modificar secciones originales.
   Corregido 19/oct/2026: restaurar contacto, testimonios y CTA.
   Importante: NO añadir reglas globales con "section" ni cuadros blancos
   a .contact-form, .cta-content, .testimonial-card o .contact-info. */
body.gr-halloween {
  background-color:#f1efeb;
  background-image:url('img/halloween-user-pattern.webp');
  background-repeat:no-repeat;
  background-position:center top;
  background-size:cover;
  background-attachment:fixed;
}

/* Mantener el fondo temático solo en las secciones claras donde se eligió. */
body.gr-halloween .promotions,
body.gr-halloween .featured-cars,
body.gr-halloween .services,
body.gr-halloween .stats {
  background:transparent;
}
body.gr-halloween .promotions .section-subtitle,
body.gr-halloween .featured-cars .section-subtitle {
  color:#d86d13;
}

/* Restauradas: CTA con su imagen y overlay, testimonios blancos y
   contacto oscuro con formulario translúcido. Estas reglas son deliberadas
   para impedir que otro estilo temático invada las secciones. */
body.gr-halloween .cta {
  background-image:url('img/fly.jpg');
  background-position:center;
  background-size:cover;
  background-color:#151515;
  color:#fff;
}
body.gr-halloween .cta-overlay {
  background-color:#0e0e0ea4;
}
body.gr-halloween .cta-content {
  background:transparent;
  box-shadow:none;
  overflow:visible;
}
body.gr-halloween .cta-content::before {
  content:none;
}
body.gr-halloween .cta-title,
body.gr-halloween .cta-description {
  color:#fff;
}
body.gr-halloween .testimonials {
  background:#fff;
}
body.gr-halloween .testimonial-card {
  background:#fff url('img/cinta-tes.jpg') center/cover no-repeat;
  overflow:visible;
}
body.gr-halloween .testimonial-card::before {
  content:'"';
  background:none;
  position:absolute;
  inset:auto;
  top:20px;
  left:30px;
  font-size:5rem;
  color:rgba(39,174,96,.1);
  font-family:serif;
  line-height:1;
  z-index:0;
  opacity:1;
}
body.gr-halloween .contact {
  background:#071a0a;
  color:#fff;
}
body.gr-halloween .contact::before {
  content:'';
  position:absolute;
  inset:0;
  background:url('img/fondo-contact.webp') center/cover no-repeat;
  z-index:0;
}
body.gr-halloween .contact::after {
  content:'';
  position:absolute;
  inset:0;
  background:rgb(0 0 0 / 73%);
  z-index:1;
}
body.gr-halloween .contact-info {
  background:transparent;
  box-shadow:none;
  overflow:visible;
}
body.gr-halloween .contact-form {
  background:rgba(255,255,255,.05);
  box-shadow:none;
  overflow:visible;
}
body.gr-halloween .contact-form::before,
body.gr-halloween .contact-info::before {
  content:none;
}
body.gr-halloween .contact .form-label,
body.gr-halloween .contact h2,
body.gr-halloween .contact p,
body.gr-halloween .contact h4 {
  color:#fff;
}

/* Mantener el ajuste del carrusel de ofertas y el primer coche completo. */
body.gr-halloween .offers-carousel {padding:0 52px}
body.gr-halloween .offers-carousel-viewport {padding:0 6px}
body.gr-halloween .offers-carousel-track.fleet-card-grid {
  padding:12px 8px 28px;
  gap:24px;
  scroll-padding-inline:8px;
}
body.gr-halloween .offers-carousel-track .vehicle-card {
  flex:0 0 calc((100% - 48px) / 3);
  width:calc((100% - 48px) / 3);
}
body.gr-halloween .offers-carousel-btn {background:#111;color:#fff}

/* Sin marco de Halloween en ninguna de las cards. */
body.gr-halloween .vehicle-card::before,
body.gr-halloween .service-card::before,
body.gr-halloween .testimonial-card .halloween-frame,
body.gr-halloween .cta-content .halloween-frame {display:none}

body.gr-halloween .logo-slider-container,
body.gr-halloween .logo-slider-track,
body.gr-halloween .logo-item,
body.gr-halloween .logo-picture,
body.gr-halloween .logo-img {background:transparent}

@media(max-width:1000px) {
  body.gr-halloween .offers-carousel-track .vehicle-card {
    flex-basis:calc((100% - 24px) / 2);
    width:calc((100% - 24px) / 2);
  }
}
@media(max-width:768px) {
  body.gr-halloween .fleet-card-grid:not(.offers-carousel-track){grid-template-columns:1fr}
  body.gr-halloween .vehicle-photo {height:210px;padding:16px 18px 8px}
  body.gr-halloween .vehicle-photo>img {width:100%;height:100%;object-fit:contain}
  body.gr-halloween .vehicle-body {padding:12px 16px 20px}
  body.gr-halloween .offers-carousel {padding:0}
  body.gr-halloween .offers-carousel-viewport {padding:0 10px}
  body.gr-halloween .offers-carousel-track.fleet-card-grid {
    gap:16px;padding:8px 0 22px;scroll-padding-inline:0;
  }
  body.gr-halloween .offers-carousel-track .vehicle-card {
    flex:0 0 100%;width:100%;
  }
  body.gr-halloween .offers-carousel-btn {display:none}
  body.gr-halloween .testimonials-grid {
    display:flex;
    gap:18px;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    padding:4px 4px 14px;
    margin-top:34px;
    scrollbar-width:none;
  }
  body.gr-halloween .testimonials-grid::-webkit-scrollbar {display:none}
  body.gr-halloween .testimonial-card {
    flex:0 0 min(88%,340px);
    scroll-snap-align:start;
    padding:26px 20px;
  }
  body.gr-halloween .testimonial-text {font-size:1rem;line-height:1.72}
  body.gr-halloween .author-image {width:58px;height:58px;margin-right:14px}
}
@media(prefers-reduced-motion:reduce) {
  body.gr-halloween .testimonials-grid {scroll-behavior:auto}
}


@media (max-width: 768px) {
  body.gr-halloween {
    background-position:center top;
    background-size:cover;
    background-attachment:scroll;
  }
}


/* === Green Route: marco de Halloween exclusivamente para tarjetas de vehículos === */
/* Aplicación exclusiva a las tarjetas de autos, sin intervenir contacto, CTA o testimonios. */
body.gr-halloween .vehicle-card {
  position: relative;
  isolation: isolate;
  background: #fff;
  border-radius: 18px;
  overflow: hidden;
}
body.gr-halloween .vehicle-card::after {
  content: "";
  display: block;
  position: absolute;
  inset: 0;
  background-origin: border-box;
  z-index: 5;
  pointer-events: none;
  border-radius: inherit;
  background: url('img/halloween-auto-frame-cropped.webp?v=20261019-card-v2') center center / 100% 100% no-repeat;
}
/* Dejar espacio en la parte inferior para la calabaza y no tapar el botón. */
body.gr-halloween .vehicle-card .vehicle-body {
  padding-bottom: 76px;
}
/* Ajuste para 2 tarjetas por fila (tabletas). */
@media (min-width: 621px) and (max-width: 1000px) {
  body.gr-halloween .vehicle-card .vehicle-body {
    padding-inline: 28px;
    padding-bottom: 76px;
  }
}
/* Teléfonos: conservar una tarjeta completa por vez y decoración dentro de bordes. */
@media (max-width: 620px) {
  body.gr-halloween .vehicle-card {
    border-radius: 18px;
    max-width: 100%;
  }
  body.gr-halloween .vehicle-card .vehicle-body {
    padding-inline: 30px;
    padding-bottom: 72px;
  }
}


/* === Ajustes finos Halloween: encabezado de flota más legible === */
body.gr-halloween .featured-cars .section-header {
  max-width: 860px;
  margin: 0 auto 70px;
  padding: 22px 26px 28px;
  background: rgba(255,255,255,.76);
  border: 1px solid rgba(44, 125, 63, .14);
  border-radius: 24px;
  box-shadow: 0 10px 26px rgba(20, 35, 26, .08);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
}
body.gr-halloween .featured-cars .section-subtitle,
body.gr-halloween .promotions .section-subtitle {
  color: #2d9b4a;
}
body.gr-halloween .featured-cars .section-title {
  color: #181818;
  text-shadow: none;
}
body.gr-halloween .featured-cars .section-title::after {
  background: #2d9b4a;
}
body.gr-halloween .featured-cars .section-description {
  color: #2f2f2f;
  font-weight: 400;
}

/* === Ajustes finos Halloween: marco alineado con el borde de la card === */
body.gr-halloween .vehicle-card {
  background: transparent;
  border-radius: 26px;
  overflow: hidden;
  padding: 18px 18px 22px;
  box-shadow: 0 12px 28px rgba(22, 50, 35, .12);
}
body.gr-halloween .vehicle-card:hover {
  box-shadow: 0 16px 34px rgba(22, 50, 35, .16);
}
body.gr-halloween .vehicle-card::after {
  border-radius: 26px;
}
body.gr-halloween .vehicle-card .vehicle-photo {
  background: #fff;
  border-radius: 14px 14px 0 0;
  padding: 24px 24px 8px;
}
body.gr-halloween .vehicle-card .vehicle-body {
  background: #fff;
  border-radius: 0 0 14px 14px;
  padding: 14px 24px 76px;
}
body.gr-halloween .vehicle-card .vehicle-body h3 {
  color: #4a4a4a;
}

@media (min-width: 621px) and (max-width: 1000px) {
  body.gr-halloween .vehicle-card {
    padding: 16px 16px 20px;
    border-radius: 24px;
  }
  body.gr-halloween .vehicle-card::after {
    border-radius: 24px;
  }
  body.gr-halloween .vehicle-card .vehicle-photo {
    padding: 22px 20px 8px;
  }
  body.gr-halloween .vehicle-card .vehicle-body {
    padding: 14px 20px 74px;
  }
}

@media (max-width: 620px) {
  body.gr-halloween .featured-cars .section-header {
    margin-bottom: 42px;
    padding: 18px 18px 22px;
    border-radius: 20px;
  }
  body.gr-halloween .vehicle-card {
    padding: 14px 14px 18px;
    border-radius: 22px;
  }
  body.gr-halloween .vehicle-card::after {
    border-radius: 22px;
  }
  body.gr-halloween .vehicle-card .vehicle-photo {
    padding: 18px 16px 6px;
    border-radius: 12px 12px 0 0;
  }
  body.gr-halloween .vehicle-card .vehicle-body {
    padding: 12px 18px 70px;
    border-radius: 0 0 12px 12px;
  }
}


/* === Encabezados Halloween legibles: promociones y servicios === */
/* Se aplica el mismo acabado usado en "Nuestra colección completa".
   No altera las tarjetas, formularios ni otras secciones. */
body.gr-halloween .promotions .section-header,
body.gr-halloween .services .section-header {
  max-width: 860px;
  margin: 0 auto 70px;
  padding: 22px 26px 28px;
  background: rgba(255,255,255,.76);
  border: 1px solid rgba(44,125,63,.14);
  border-radius: 24px;
  box-shadow: 0 10px 26px rgba(20,35,26,.08);
  -webkit-backdrop-filter: blur(3px);
  backdrop-filter: blur(3px);
}
body.gr-halloween .promotions .section-subtitle,
body.gr-halloween .services .section-subtitle {
  color: #2d9b4a;
}
body.gr-halloween .promotions .section-title,
body.gr-halloween .services .section-title {
  color: #181818;
  text-shadow: none;
}
body.gr-halloween .promotions .section-title::after,
body.gr-halloween .services .section-title::after {
  background: #2d9b4a;
}
body.gr-halloween .promotions .section-description,
body.gr-halloween .services .section-description {
  color: #2f2f2f;
  font-weight: 400;
}
@media (max-width: 620px) {
  body.gr-halloween .promotions .section-header,
  body.gr-halloween .services .section-header {
    margin-bottom: 42px;
    padding: 18px 18px 22px;
    border-radius: 20px;
  }
}

/* === Corrección definitiva: solo cards de autos y carrusel === */
/* No existe borde ni placa blanca exteriores: la tarjeta sigue la silueta del marco. */
body.gr-halloween .vehicle-card,
body.gr-halloween .offers-carousel-track .vehicle-card,
body.gr-halloween .featured-cars .vehicle-card {
  box-sizing: border-box;
  position: relative;
  isolation: isolate;
  min-width: 0;
  border: 0;
  outline: 0;
  margin: 0;
  background: transparent;
  padding: 16px 16px 22px;
  overflow: hidden;
  border-radius: 26px;
  box-shadow: none;
}
body.gr-halloween .vehicle-card:hover,
body.gr-halloween .offers-carousel-track .vehicle-card:hover {
  box-shadow: none;
}
/* Placa blanca recortada DENTRO del contorno. Evita el doble borde sobresaliente. */
body.gr-halloween .vehicle-card::before,
body.gr-halloween .offers-carousel-track .vehicle-card::before,
body.gr-halloween .featured-cars .vehicle-card::before {
  content: '';
  display: block!important;
  position: absolute;
  inset: 2.5% 3.3% 2.0%;
  z-index: 0;
  background: #fff;
  border-radius: 20px;
  pointer-events: none;
  box-shadow: 0 8px 23px rgba(0,0,0,.09);
}
/* El marco se estira levemente para que su línea llegue al borde exterior real. */
body.gr-halloween .vehicle-card::after,
body.gr-halloween .offers-carousel-track .vehicle-card::after,
body.gr-halloween .featured-cars .vehicle-card::after {
  content: '';
  display: block;
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  border-radius: inherit;
  background: url('img/halloween-auto-frame-cropped.webp?v=20261019-final-mobile-2') center / 106% 106% no-repeat;
}
body.gr-halloween .vehicle-card .vehicle-photo,
body.gr-halloween .vehicle-card .vehicle-body {
  position: relative;
  z-index: 1;
  box-sizing: border-box;
  background: transparent;
  border-radius: 0;
}
body.gr-halloween .vehicle-card .vehicle-photo {
  padding: 26px 23px 8px;
}
body.gr-halloween .vehicle-card .vehicle-body {
  padding: 14px 21px 75px;
}
body.gr-halloween .vehicle-card .vehicle-cta {
  position: relative;
  z-index: 4;
}

@media (min-width: 621px) and (max-width: 1000px) {
  body.gr-halloween .vehicle-card,
  body.gr-halloween .offers-carousel-track .vehicle-card,
  body.gr-halloween .featured-cars .vehicle-card {
    padding: 14px 14px 20px;
    border-radius: 24px;
  }
  body.gr-halloween .vehicle-card .vehicle-photo { padding: 20px 20px 8px; }
  body.gr-halloween .vehicle-card .vehicle-body { padding: 14px 18px 74px; }
}

/* Móvil: una sola tarjeta 100% visible, Kia primero, controles sin cortes laterales. */
@media (max-width: 620px) {
  body.gr-halloween .offers-carousel {
    display: block;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    position: relative;
    padding: 0 31px;
    margin-inline: auto;
  }
  body.gr-halloween .offers-carousel-viewport {
    width: 100%;
    min-width: 0;
    overflow: hidden;
    padding: 0;
    box-sizing: border-box;
  }
  body.gr-halloween .offers-carousel-track.fleet-card-grid {
    display: flex;
    width: 100%;
    min-width: 0;
    overflow-x: auto;
    overflow-y: hidden;
    gap: 0;
    margin: 0;
    padding: 6px 0 17px;
    box-sizing: border-box;
    scroll-snap-type: x mandatory;
    scroll-padding-inline: 0;
    overscroll-behavior-inline: contain;
    scrollbar-width: none;
  }
  body.gr-halloween .offers-carousel-track .vehicle-card {
    display: flex;
    box-sizing: border-box;
    flex: 0 0 100%;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    margin: 0;
    padding: 10px 10px 17px;
    border-radius: 21px;
    scroll-snap-align: start;
    scroll-snap-stop: always;
  }
  body.gr-halloween .offers-carousel-track .vehicle-card .vehicle-photo {
    height: 197px;
    padding: 20px 15px 6px;
  }
  body.gr-halloween .offers-carousel-track .vehicle-card .vehicle-body {
    padding: 12px 15px 67px;
  }
  body.gr-halloween .offers-carousel-track .vehicle-card .vehicle-body h3 {
    font-size: 1.18rem;
    min-height: 2.4em;
  }
  body.gr-halloween .offers-carousel-track .vehicle-card .vehicle-spec { font-size: .68rem; }
  body.gr-halloween .offers-carousel-track .vehicle-card .vehicle-current-price strong { font-size: 1.5rem; }
  body.gr-halloween .offers-carousel-btn {
    display: flex;
    width: 36px;
    height: 36px;
    top: 48%;
    z-index: 10;
    border-radius: 50%;
    background: #151515;
    color: #fff;
  }
  body.gr-halloween .offers-carousel-btn--prev { left: -2px; }
  body.gr-halloween .offers-carousel-btn--next { right: -2px; }
  body.gr-halloween .featured-cars .vehicle-card { padding: 12px 12px 19px; }
  body.gr-halloween .featured-cars .vehicle-card .vehicle-photo { padding: 20px 16px 7px; }
  body.gr-halloween .featured-cars .vehicle-card .vehicle-body { padding: 13px 16px 69px; }
}

/* Fix real del recorte: un estilo previo centraba TODA la fila flex,
   dejando la primera tarjeta fuera del área desplazable. */
@media (max-width: 620px) {
  body.gr-halloween .offers-carousel-track.fleet-card-grid {
    justify-content: flex-start !important;
  }
}


/* === Ajuste fino final: el marco coincide con el borde blanco real, no con una sombra === */
body.gr-halloween .vehicle-card::before,
body.gr-halloween .offers-carousel-track .vehicle-card::before,
body.gr-halloween .featured-cars .vehicle-card::before {
  inset: 14px 14px 18px 14px;
  border-radius: 18px;
  box-shadow: none !important;
}
body.gr-halloween .vehicle-card::after,
body.gr-halloween .offers-carousel-track .vehicle-card::after,
body.gr-halloween .featured-cars .vehicle-card::after {
  background-size: 100% 100% !important;
  background-position: center center !important;
}

@media (min-width: 621px) and (max-width: 1000px) {
  body.gr-halloween .vehicle-card::before,
  body.gr-halloween .offers-carousel-track .vehicle-card::before,
  body.gr-halloween .featured-cars .vehicle-card::before {
    inset: 12px 12px 16px 12px;
    border-radius: 17px;
  }
}

@media (max-width: 620px) {
  body.gr-halloween .vehicle-card::before,
  body.gr-halloween .offers-carousel-track .vehicle-card::before,
  body.gr-halloween .featured-cars .vehicle-card::before {
    inset: 10px 10px 14px 10px;
    border-radius: 16px;
  }
  body.gr-halloween .offers-carousel-track .vehicle-card::after {
    border-radius: 21px;
  }
}
