/* ==========================================================================
   Minyeti — CSS principal (diferido). Below-the-fold y componentes.
   ========================================================================== */

/* [hidden] debe ganar a cualquier display de componente
   (ej. .vrc-btn{display:inline-flex}). Único !important
   del proyecto: es intención del HTML, no presentación. */
[hidden]{display:none !important}

/* --- Layout general --- */
.vrc-seccion{padding-block:clamp(40px,8vw,72px)}
.vrc-seccion--fondo{background:var(--vrc-superficie)}
.vrc-titulo-seccion{margin-bottom:.6em}
.vrc-lead{color:var(--vrc-gris);max-width:60ch}

/* --- Nav desktop --- */
@media (min-width:900px){
  .vrc-nav__toggle{display:none}
  .vrc-drawer__overlay{display:none}
  .vrc-nav{position:static;height:auto;width:auto;transform:none;visibility:visible;background:transparent;border-radius:0;padding:0;box-shadow:none;overflow:visible;display:flex;flex-direction:row;align-items:center;gap:8px;margin-left:auto;margin-right:8px}
  .vrc-nav__head{display:none}
  .vrc-nav__cta{display:none}
  .vrc-nav__lista{flex-direction:row;align-items:center;gap:4px}
  .vrc-nav__lista a{min-height:auto;gap:0;padding:10px 14px;border-radius:8px}
  .vrc-nav__lista a .vrc-nav__ico{display:none}
  .vrc-nav__lista a:hover{background:var(--vrc-fondo);text-decoration:none}
}

/* --- Contacto: rejilla --- */
.vrc-contacto{display:grid;gap:var(--vrc-gap)}
@media (min-width:900px){
  .vrc-contacto{grid-template-columns:1.15fr .85fr;align-items:start}
}

/* Los tres canales. Panel = 20px (--r-panel), NO el radio de tarjeta: el token
   compartido --vrc-radio lo usan .vrc-card y .vrc-ficha__media, cambiarlo ahi
   les cambiaria el radio a todas. */
.vrc-canales{background:var(--vrc-superficie);border:1px solid var(--c-borde);border-radius:var(--r-panel);padding:clamp(20px,4vw,32px)}
.vrc-canales__titulo{margin-bottom:.6rem}

/* El claim del 24/7. Lleva la crema de las tarjetas de dato del Home para tener
   peso propio sin gastar el naranja, que en este bloque es la accion (el boton).
   Por eso el icono va en tinta y no en --c-naranja-icono. */
.vrc-canales__claim{
  display:grid;grid-template-columns:auto 1fr;gap:.2rem .7rem;align-items:start;
  background:linear-gradient(160deg,#fdf4ee 0%,#f7e2d3 100%);
  border-radius:var(--r-tarjeta);padding:16px 18px;margin:0 0 1.4rem;
}
.vrc-canales__claim-ico{grid-row:1 / span 2;width:24px;height:24px;color:var(--c-texto);margin-top:2px}
.vrc-canales__claim strong{font-size:clamp(1.02rem,2.2vw,1.18rem);font-weight:var(--fw-medio);line-height:1.35;color:var(--c-texto)}
.vrc-canales__claim span{font-size:var(--fs-sm);color:var(--c-texto-suave)}

/* Cobertura: los 5 aeropuertos. Cierra el hueco que dejo el formulario y es el
   diferenciador que ningun competidor local anuncia. Sin naranja: el naranja de
   este bloque ya es la accion (el boton). El codigo IATA hace de ancla visual. */
.vrc-canales__cobertura{margin-top:1.6rem;padding-top:1.2rem;border-top:1px solid var(--c-borde)}
.vrc-canales__cobertura-tit{display:flex;align-items:center;gap:.5rem;margin:0 0 .9rem;font-size:var(--fs-sm);font-weight:var(--fw-medio);color:var(--c-texto)}
.vrc-canales__cobertura-tit .vrc-icono{width:17px;height:17px;color:var(--c-texto-suave)}
.vrc-aeropuertos{list-style:none;margin:0;padding:0;display:grid;gap:.55rem}
.vrc-aeropuertos li{display:grid;grid-template-columns:auto 1fr;gap:.7rem;align-items:baseline}
.vrc-aeropuertos__cod{
  font-weight:var(--fw-medio);font-size:.8rem;letter-spacing:.06em;color:var(--c-texto);
  background:var(--c-fondo-alt);border:1px solid var(--c-borde);border-radius:var(--r-boton);
  padding:2px 7px;min-width:44px;text-align:center;
}
.vrc-aeropuertos__nom{font-size:var(--fs-sm);color:var(--c-texto-suave);line-height:1.4}

/* Campos de formulario — los usa template-parts/reserva-form.php.
   .vrc-form* murio con el formulario de Contacto (5-ago-2026). */
.vrc-campo{margin-bottom:1rem}
.vrc-campo label{display:block;font-weight:var(--fw-medio);font-size:.9rem;margin-bottom:.35rem;color:var(--vrc-oscuro)}
.vrc-campo input,.vrc-campo textarea{
  width:100%;padding:12px 14px;border:1px solid var(--vrc-borde);border-radius:var(--vrc-radio-sm);
  font:inherit;color:var(--vrc-tinta);background:var(--vrc-fondo);
}
.vrc-campo input:focus,.vrc-campo textarea:focus{outline:none;border-color:var(--vrc-cta);background:#fff}
.vrc-campo textarea{min-height:120px;resize:vertical}

/* Tarjeta oscura de informacion. Panel = 20px, igual que .vrc-canales. */
.vrc-info{background:var(--vrc-oscuro);color:#fff;border-radius:var(--r-panel);padding:clamp(20px,4vw,32px)}
.vrc-info__titulo{color:#fff}
.vrc-info__lista{list-style:none;margin:0;padding:0;display:grid;gap:1.1rem}
.vrc-info__item{display:flex;gap:.85rem;align-items:flex-start}
/* Iconos DECORATIVOS: la etiqueta («Dirección», «Teléfono») va escrita al lado,
   el icono no carga informacion solo. Dejan de ser naranjas — el naranja de la
   pagina es la accion, y esta tarjeta no la tiene. */
.vrc-info__item .vrc-icono{width:22px;height:22px;color:rgba(255,255,255,.55);margin-top:2px}
.vrc-info__etq{display:block;font-weight:var(--fw-medio);font-size:.95rem}
.vrc-info__val{color:rgba(255,255,255,.8);font-size:.92rem}
.vrc-info__val a{color:rgba(255,255,255,.9)}
.vrc-info__val a:hover{color:#fff}
/* CTA secundario de 12px sobre fondo oscuro. NO reutiliza .vrc-card__accion:
   ese usa --c-texto-suave (#4a4a4a), que sobre --c-negro queda en ~2:1. Este es
   el mismo tratamiento que .site-footer__wa, que resuelve el caso en el pie. */
.vrc-info__accion{
  display:inline-flex;align-items:center;gap:5px;min-height:44px;margin-top:1.1rem;
  padding-top:10px;border-top:.5px solid rgba(255,255,255,.18);width:100%;
  color:rgba(255,255,255,.8);font-size:12px;font-weight:var(--fw-medio);
}
.vrc-info__accion:hover{color:#fff;text-decoration:none}
.vrc-info__accion .vrc-icono{width:15px;height:15px;color:currentColor}

/* CTA que cierra un bloque de tarjetas y necesita aire propio. Sin esto sale
   pegado a la tarjeta de arriba, montado sobre el bloque. El valor sigue el
   mismo clamp que el gap de las tarjetas para no inventar un ritmo nuevo. */
.vrc-cta-suelto{margin-top:clamp(16px,3vw,24px)}

/* Enlace tel: */
.vrc-tel{display:inline-flex;align-items:center;gap:.4em;min-height:44px;font-weight:var(--fw-medio);color:inherit}
.vrc-tel .vrc-icono{width:18px;height:18px}

/* --- «Lo que pagas de verdad»: el recibo real --- */
.vrc-pagas__wrap{max-width:760px}
.vrc-recibo-real{background:#fff;border:1px solid var(--c-borde);border-radius:var(--r-panel);padding:clamp(20px,4vw,30px);margin-top:1.4rem}
.vrc-recibo-real__lista{list-style:none;margin:0;padding:0}
.vrc-recibo-real__lista li{display:flex;flex-wrap:wrap;gap:.75rem;justify-content:space-between;align-items:baseline;padding:14px 0;border-bottom:1px solid var(--c-borde)}
.vrc-recibo-real__con{display:grid;gap:2px;min-width:0}
.vrc-recibo-real__et{font-size:15px;font-weight:var(--fw-medio);color:var(--c-texto)}
.vrc-recibo-real__nota{font-size:12px;color:var(--c-texto-suave);line-height:1.45}
.vrc-recibo-real__val{font-size:17px;font-weight:var(--fw-medio);color:var(--c-texto);white-space:nowrap}
.vrc-recibo-real__cero .vrc-recibo-real__val{color:var(--c-texto-suave)}
/* El total: la cifra que nadie del radar publica */
.vrc-recibo-real__total{display:flex;flex-wrap:wrap;gap:.75rem;justify-content:space-between;align-items:baseline;margin:18px 0 0;padding-top:18px;border-top:2px solid var(--c-negro)}
.vrc-recibo-real__total span{font-size:15px;font-weight:var(--fw-medio)}
.vrc-recibo-real__total strong{font-size:30px;font-weight:var(--fw-medio);letter-spacing:-.02em;line-height:1;color:var(--c-texto)}
/* Deposito: sobre la crema de las tarjetas de dato. Sin naranja — el unico
   naranja de la pagina es el CTA de la banda de cierre. */
.vrc-recibo-real__dep{background:linear-gradient(160deg,#fdf4ee 0%,#f7e2d3 100%);border-radius:var(--r-tarjeta);padding:16px 18px;margin-top:1.4rem}
.vrc-recibo-real__dep-h{margin:0;font-size:11px;font-weight:var(--fw-medio);letter-spacing:.06em;text-transform:uppercase;color:var(--c-texto-suave)}
.vrc-recibo-real__dep-v{margin:.15em 0 .3em;font-size:24px;font-weight:var(--fw-medio);line-height:1;color:var(--c-texto)}
.vrc-recibo-real__dep-n{margin:.7rem 0 0;font-size:13px;line-height:1.5;color:var(--c-texto-suave)}
/* Reparto del total en anticipo + balance. Va DENTRO de la caja del deposito
   para que se lea como un reparto y no como cargos nuevos (5-ago-2026). */
.vrc-recibo-real__split{list-style:none;margin:.6rem 0 0;padding:0}
.vrc-recibo-real__split li{display:flex;flex-wrap:wrap;gap:.75rem;justify-content:space-between;align-items:baseline;padding:10px 0;border-bottom:1px solid rgba(22,22,22,.12)}
.vrc-recibo-real__split li:last-child{border-bottom:0}
.vrc-recibo-real__split .vrc-recibo-real__val{font-size:19px}
.vrc-pagas__cierre{margin:1.4rem 0 0;font-size:15px;color:var(--c-texto)}
.vrc-pagas__wrap .vrc-titulo-seccion{margin-top:2rem}
.vrc-pagas__wrap .vrc-titulo-seccion:first-of-type{margin-top:0}
/* Enlace del deposito en la tarjeta: por encima del stretched-link del titulo */
.vrc-card__deposito a{position:relative;z-index:2;color:inherit;text-decoration:underline;text-underline-offset:2px;text-decoration-color:var(--c-borde)}
.vrc-card__deposito a:hover{text-decoration-color:var(--c-texto)}

/* --- Mapa (facade: imagen estatica + enlace, sin iframe) --- */
.vrc-mapa{position:relative;border-radius:var(--r-panel);overflow:hidden;border:1px solid var(--vrc-borde)}
.vrc-mapa__img{width:100%;height:auto;display:block}
.vrc-mapa__pie{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center;justify-content:space-between;padding:16px clamp(16px,3vw,24px);background:var(--vrc-superficie)}
.vrc-mapa__lugar{font-weight:var(--fw-medio)}
.vrc-mapa__lugar span{display:block;font-weight:400;color:var(--vrc-gris);font-size:.9rem}

/* --- Rating --- */
/* Sin naranja: vive dentro de .vrc-info, y esa tarjeta ya no lo lleva (el
   naranja de la pagina es la accion). Hereda el blanco del panel oscuro. */
.vrc-rating{display:inline-flex;align-items:center;gap:.35rem;color:inherit;font-weight:var(--fw-medio)}
.vrc-rating .vrc-icono{width:18px;height:18px}
/* Estaba en --vrc-gris (#4a4a4a) DENTRO de la tarjeta oscura: ~2:1, ilegible.
   Bug anterior al rediseno, corregido aqui por caer en este bloque. */
.vrc-rating__texto{color:rgba(255,255,255,.6);font-weight:400}

/* --- Footer --- */
.site-footer{background:var(--vrc-oscuro);color:rgba(255,255,255,.8);margin-top:clamp(40px,8vw,72px)}
/* El margen separa el pie del contenido CLARO. Si la pagina cierra con la banda
   CTA (oscura), ese margen se ve como una franja blanca entre dos bloques
   oscuros: se anula solo en ese caso. Medido: eran los 72px del margin-top.
   Sin soporte de :has() reaparece la franja — es cosmetico, no rompe nada. */
main:has(.vrc-cta-band:last-child) + .site-footer{margin-top:0}
.site-footer__grid{display:grid;gap:2rem;padding-block:clamp(36px,6vw,56px)}
@media (min-width:760px){.site-footer__grid{grid-template-columns:1.4fr 1fr 1.3fr}}
/* Variante BLANCA sobre el --c-negro del pie. Hereda el margen inferior del
   wordmark al que sustituye, para que el pie no se recomponga al aparecer. */
.site-footer__logo-img{display:block;width:200px;max-width:100%;height:auto;margin-bottom:.8rem}
.site-footer__marca{font-family:var(--vrc-fuente-titulo);font-weight:var(--fw-display);font-size:1.4rem;color:#fff;display:block;margin-bottom:.8rem}
.site-footer__marca span{color:var(--vrc-cta)}
.site-footer__desc{font-size:.92rem;max-width:38ch}
.site-footer__social{display:flex;gap:.6rem;margin-top:1rem}
.site-footer__social a{display:inline-flex;width:44px;height:44px;align-items:center;justify-content:center;border:1px solid rgba(255,255,255,.2);border-radius:50%;color:#fff}
.site-footer__social a:hover{background:var(--vrc-cta);border-color:var(--vrc-cta)}
.site-footer__titulo{font-size:.8rem;text-transform:uppercase;letter-spacing:.16em;color:#fff;margin-bottom:1rem}
.site-footer__lista{list-style:none;margin:0;padding:0;display:grid;gap:.6rem}
.site-footer__lista a{display:inline-flex;align-items:center;min-height:44px;color:rgba(255,255,255,.8)}
.site-footer__lista a:hover{color:#fff}
.site-footer__contacto{font-style:normal;display:grid;gap:.9rem}
.site-footer__dir{display:flex;gap:.5rem;font-size:.92rem}
.site-footer__dir .vrc-icono{color:var(--vrc-cta);flex-shrink:0}
.site-footer__tel{color:#fff}
/* WhatsApp del pie: enlace de CONTACTO, no accion. Deja de ser el boton verde
   (2026-08-05: el unico verde del sitio es el flotante). Mismo peso que el
   telefono de al lado; el naranja se reserva para la accion que va al motor. */
.site-footer__wa{display:inline-flex;align-items:center;gap:.5em;min-height:44px;color:rgba(255,255,255,.8);font-weight:var(--fw-medio);font-size:.92rem}
.site-footer__wa:hover{color:#fff}
.site-footer__wa .vrc-icono{width:18px;height:18px;color:currentColor}
.site-footer__legal{border-top:1px solid rgba(255,255,255,.12);font-size:.85rem}
.site-footer__legal p{margin:0;padding-block:18px}

/* --- Boton flotante --- */
/* Contenedor de flotantes multicanal (apilados, sin taparse) */
.vrc-flotantes{position:fixed;right:16px;bottom:16px;z-index:200;display:flex;flex-direction:column;gap:12px;align-items:flex-end}
/* EXCEPCION de radio: los flotantes usan 16px (radio de tarjeta), no los 6px de
   boton. Son piezas sueltas sobre el contenido, no botones dentro de un bloque.
   Sigue sin ser pildora. */
.vrc-flotante{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:56px;padding:14px 20px;border-radius:var(--r-tarjeta);color:#fff;font-weight:var(--fw-medio);text-decoration:none;box-shadow:0 6px 20px rgba(0,0,0,.25)}
.vrc-flotante:hover{color:#fff;text-decoration:none}
.vrc-flotante .vrc-btn__icono,.vrc-flotante .vrc-icono{width:24px;height:24px}
/* WhatsApp = verde (por defecto) · Llamada = naranja (diferenciado) */
.vrc-flotante{background:var(--c-wa)}
.vrc-flotante:hover{background:var(--c-wa-hover)}
.vrc-flotante--tel{background:var(--c-naranja)}
.vrc-flotante--tel:hover{background:var(--c-naranja-claro)}
@media (max-width:520px){
  .vrc-flotante span:not(.vrc-icono){position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .vrc-flotante{width:56px;height:56px;padding:0;border-radius:var(--r-tarjeta)}
}

/* --- Aviso de cookies (8-ago-2026) ---
   z-index 300: por ENCIMA de los flotantes (200). Es una decision que el
   visitante tiene que poder tomar; taparla con un boton de WhatsApp seria
   pedirle consentimiento y esconderle el boton de responder.
   🔴 Y lo que hace de verdad, comprobado en captura: con z 300 sobre los 200
   de los flotantes, MIENTRAS ESTA VISIBLE LOS TAPA POR COMPLETO. Es a
   proposito y es transitorio: se le esta pidiendo al visitante UNA decision, y
   desaparece en cuanto la toma. A diferencia de los flotantes sobre el CTA,
   esto no es permanente.
   (La primera version de este bloque reservaba 88px a la derecha -para que los
   flotantes no taparan el boton de aceptar-. Era falso: no pueden taparlo,
   estan debajo. El hueco solo estrechaba el texto, asi que fuera.) */
.vrc-cookies{position:fixed;left:0;right:0;bottom:0;z-index:300;background:var(--c-negro);color:#fff;padding:14px 16px calc(14px + env(safe-area-inset-bottom));display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;box-shadow:0 -6px 24px rgba(0,0,0,.28)}
.vrc-cookies__txt{margin:0;flex:1 1 260px;font-size:var(--fs-sm);line-height:1.5;color:rgba(255,255,255,.86)}
.vrc-cookies__txt a{color:#fff;text-decoration:underline}
.vrc-cookies__acciones{display:flex;gap:8px;flex-wrap:wrap;margin-left:auto}
.vrc-cookies .vrc-btn{min-height:44px}
/* El fantasma vive sobre fondo claro en el resto del sitio; aqui va sobre
   negro y necesita su propio borde y tinta, o desaparece. */
.vrc-cookies .vrc-btn--ghost{border-color:rgba(255,255,255,.45);color:#fff;background:transparent}
.vrc-cookies .vrc-btn--ghost:hover{background:rgba(255,255,255,.12);color:#fff}
@media (max-width:600px){
  .vrc-cookies__acciones{margin-left:0;width:100%}
  .vrc-cookies__acciones .vrc-btn{flex:1 1 0}
}

/* Respeta prefers-reduced-motion */
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001ms!important;transition-duration:.001ms!important}
}

/* ==========================================================================
   FLOTA (archive) y FICHA (single) — usan la paleta/tokens ya definidos.
   ========================================================================== */

.vrc-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.vrc-seccion--pt0{padding-top:0}

/* --- Breadcrumbs --- */
.vrc-breadcrumbs{padding:16px 0 0}
.vrc-breadcrumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:.4rem;margin:0;padding:0;font-size:.85rem;color:var(--vrc-gris)}
.vrc-breadcrumbs li+li::before{content:"/";margin-right:.4rem;color:var(--vrc-borde)}
.vrc-breadcrumbs a{color:var(--vrc-gris);display:inline-block;padding-block:12px;margin-block:-12px}
.vrc-breadcrumbs a:hover{color:var(--c-negro)}
.vrc-breadcrumbs [aria-current="page"]{color:var(--vrc-oscuro);font-weight:var(--fw-medio)}

/* --- Hero de Flota (degradado de la maqueta, igual que el del Home) --- */
/* Hero PLANO: degradado + texto, sin <img> ni capa de oscurecimiento. Es el
   patron del Home (decision 3) para paginas sin foto de cabecera.
   .vrc-flota-hero es el nombre historico del mismo componente; se conserva
   para no tocar /flota/ en esta tanda. Al proximo cambio de Flota, fundirlos. */
.vrc-flota-hero,
.vrc-hero-plano{background:linear-gradient(150deg,var(--c-negro) 0%,#2a1c12 55%,#3a2415 100%);color:#fff;padding-block:clamp(36px,7vw,64px)}
.vrc-flota-hero h1,
.vrc-hero-plano h1{color:#fff;margin:0 0 .3em}
.vrc-flota-hero__sub,
.vrc-hero-plano__sub{color:rgba(255,255,255,.85);max-width:52ch;margin:0}

/* --- Filtros de categoría ---
   Rectángulos de radio de BOTÓN, nunca píldoras. El estado activo va en NEGRO,
   no en naranja: el naranja está reservado a la acción principal (reservar) y
   justo debajo hay una rejilla llena de botones «Reservar ahora». Un filtro
   activo naranja competiría con ellos y el color dejaría de significar algo.
   Solo el nombre de la categoría: sin cifras (decisión 2026-08-05). */
.vrc-filtros{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:clamp(20px,4vw,32px)}
.vrc-chip{display:inline-flex;align-items:center;min-height:44px;padding:8px 14px;border-radius:var(--r-boton);border:1px solid var(--c-borde);background:var(--c-blanco);color:var(--c-texto);font-size:.875rem;font-weight:var(--fw-medio);white-space:nowrap}
.vrc-chip:hover{text-decoration:none;border-color:var(--c-texto-suave);background:var(--c-fondo-alt);color:var(--c-texto)}
.vrc-chip.is-activo{background:var(--c-negro);border-color:var(--c-negro);color:#fff}
.vrc-chip.is-estatico{background:var(--c-naranja);border-color:transparent;color:#fff;font-weight:var(--fw-medio);cursor:default}
/* En móvil, carril desplazable: 8 categorías apiladas empujaban la rejilla
   fuera de la pantalla antes del primer vehículo. */
@media (max-width:640px){
  .vrc-filtros{flex-wrap:nowrap;overflow-x:auto;padding-bottom:6px;scrollbar-width:thin;-webkit-overflow-scrolling:touch}
  .vrc-chip{flex:0 0 auto}
}

/* --- Rejilla de la flota --- */
/* Verde unico #25d366 (--c-wa en critical.css). El token --c-exito se elimino
   el 2026-08-05: dos verdes con el mismo significado era un error. */

.vrc-flota-grid{display:grid;grid-template-columns:1fr;gap:var(--vrc-gap);align-items:stretch}
@media (min-width:600px){.vrc-flota-grid{grid-template-columns:repeat(2,1fr)}}
@media (min-width:900px){.vrc-flota-grid{grid-template-columns:repeat(3,1fr)}}
/* Destacados del Home: 1 -> 2 (tablet) -> 3 (desktop) */
.vrc-flota-grid.vrc-flota-grid--destacados{grid-template-columns:1fr;align-items:stretch}
@media (min-width:600px){.vrc-flota-grid.vrc-flota-grid--destacados{grid-template-columns:repeat(2,1fr)}}
@media (min-width:900px){.vrc-flota-grid.vrc-flota-grid--destacados{grid-template-columns:repeat(3,1fr)}}

/* --- Tarjeta de vehiculo (sistema v2: 1 solo naranja, formas 12/8, sin pildoras) --- */
.vrc-card{position:relative;display:flex;flex-direction:column;background:var(--vrc-superficie);border:1px solid var(--vrc-borde);border-radius:var(--vrc-radio);overflow:hidden;transition:box-shadow .15s ease,transform .15s ease}
.vrc-card:hover{box-shadow:0 4px 12px rgba(0,0,0,.06);transform:translateY(-2px)}
/* Proporción 16:10 (sistema de diseño). Con foto real el <img> la rellena con
   object-fit:cover; sin foto, el placeholder ocupa el mismo hueco, así que
   cambiar placeholder por foto NO mueve la maquetación. */
.vrc-card__media{position:relative;display:block;aspect-ratio:16/10;background:var(--vrc-fondo);border-bottom:1px solid var(--c-borde)}
/* ARRUGA (b) — 8-ago-2026. El MAXUS D60 perdia media carroceria.
   El CSS NO estaba mal: la tarjeta es 16:10, que es lo que manda el sistema.
   El problema son los ORIGENES: r6c4.png es 1436x598 (ratio 2,40), una
   panoramica. Con object-fit:cover se le corta el 33%% del ancho, 16,5%% por
   lado. Se pasa a contain para que el vehiculo se vea ENTERO.
   TEMPORAL Y A PROPOSITO: en cuanto R1 re-encuadre los origenes a 16:10,
   esto vuelve a cover y desaparecen las bandas. El fichero no se toca aqui. */
.vrc-card__img{width:100%;height:100%;object-fit:contain;object-position:center;display:block;background:var(--vrc-fondo)}
/* Placeholder: bloque gris liso, SIN icono de carro. El sello se lee (7.2:1):
   un marcador de pendiente invisible no cumple su función. Desaparece solo
   en cuanto el vehículo tiene imagen destacada, porque entonces no se pinta. */
.vrc-card__placeholder{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:center;padding:0 0 8px;text-align:center;background:#e9e7e3}
.vrc-card__placeholder::after{content:"FOTO PENDIENTE";font-size:10px;letter-spacing:.12em;font-weight:var(--fw-medio);color:var(--c-texto-suave)}
.vrc-card__placeholder--grande{position:static;aspect-ratio:16/10;border-radius:var(--vrc-radio);align-items:center;padding:12px;font-family:var(--f-base);font-weight:var(--fw-medio);font-size:1.4rem;color:var(--c-texto-suave)}
.vrc-card__placeholder--grande::after{content:none}
.vrc-card__body{display:flex;flex-direction:column;gap:.5rem;padding:14px 16px 16px;flex:1}
.vrc-card__etiqueta{font-size:11px;text-transform:uppercase;letter-spacing:.06em;font-weight:var(--fw-medio);color:var(--c-texto-suave)}
.vrc-card__titulo{font-size:16px;font-weight:var(--fw-medio);margin:0}
.vrc-card__titulo a{color:var(--c-negro);text-decoration:none}
.vrc-card__titulo a::after{content:"";position:absolute;inset:0;z-index:1}   /* stretched-link: cubre toda la tarjeta, incl. la foto */
.vrc-card__specs{list-style:none;display:flex;flex-wrap:wrap;gap:.9rem;margin:0;padding:0;color:var(--c-texto-suave);font-size:13px}
.vrc-card__specs li{display:inline-flex;align-items:center;gap:.3rem}
.vrc-card__specs .vrc-icono{width:16px;height:16px;color:var(--c-naranja-icono)}
.vrc-card__pie{margin-top:auto;display:flex;flex-direction:column;gap:8px}
.vrc-card__precio{display:inline-flex;align-items:baseline;gap:4px;margin:0;color:var(--c-naranja-cifra);font-family:var(--f-base);font-weight:var(--fw-medio);font-size:26px;letter-spacing:-.02em;line-height:1}
.vrc-card__precio span{font-family:var(--f-base);font-weight:var(--fw-normal);font-size:13px;letter-spacing:0;color:var(--c-texto-suave)}
.vrc-card__precio .vrc-card__desde{font-size:12px;font-weight:var(--fw-medio);text-transform:uppercase;letter-spacing:.04em;margin-right:2px}
/* El ITBIS va DECLARADO junto al precio, nunca en letra pequena escondida: el
   importe publicado ya lo lleva dentro (decision del 6-ago-2026). Mismo cuerpo
   que los demas hechos de la tarjeta —12px sobre tinta suave—, no un asterisco. */
.vrc-card__itbis{margin:2px 0 0;font-size:12px;line-height:1.3;color:var(--c-texto-suave)}
/* El verde NO es admisible como texto sobre blanco (~2.1:1): texto en tinta,
   icono en verde. El escudo aporta el color, el texto la legibilidad. */
/* Los dos hechos que nos separan del mercado. El deposito estaba solo dentro
   del motor; desde el 5-ago va tambien aqui, que es donde se compara precio. */
.vrc-card__hechos{list-style:none;margin:0;padding:0;display:grid;gap:5px}
.vrc-card__seguro,.vrc-card__deposito{display:inline-flex;align-items:center;gap:6px;margin:0;font-size:12px;color:var(--c-texto)}
.vrc-card__seguro .vrc-icono{width:16px;height:16px;color:var(--c-wa)}
/* Icono NEUTRO a proposito: el verde esta reservado al escudo del Seguro de
   Ley. El peso lo lleva la cifra, no el color. */
.vrc-card__deposito .vrc-icono{width:16px;height:16px;color:var(--c-texto-suave)}
.vrc-card__deposito strong{font-weight:var(--fw-medio)}
/* --- Jerarquia A ---
   UN naranja por bloque y siempre es la accion principal (reserva por el motor).
   WhatsApp y Llamar son ENLACES secundarios: icono + texto en gris, nunca
   botones de color. El grupo va por encima del stretched-link del titulo. */
.vrc-card__acciones{display:flex;flex-direction:column;position:relative;z-index:2}
.vrc-card__reservar{width:100%;min-height:44px;border-radius:var(--r-boton);padding:0 16px}
.vrc-card__secundarias{display:flex;align-items:center;gap:20px;margin-top:10px;padding-top:8px;border-top:.5px solid var(--c-borde)}
.vrc-card__accion{display:inline-flex;align-items:center;gap:5px;min-height:44px;padding:0;border:0;background:transparent;color:var(--c-texto-suave);font-size:12px;font-weight:var(--fw-medio)}
.vrc-card__accion:hover{color:var(--c-texto);text-decoration:none}
.vrc-card__accion .vrc-icono{width:15px;height:15px;color:currentColor}

/* Boton fantasma (secundario) */
.vrc-btn--ghost{background:transparent;border:1px solid var(--c-borde);color:var(--c-texto)}
.vrc-btn--ghost:hover{background:var(--c-fondo-alt);color:var(--c-texto)}

/* --- Flota: cargar más (secundario, no píldora, sin naranja) --- */
.vrc-flota-mas{display:flex;justify-content:center;margin-top:32px}
.vrc-flota-mas__link,.vrc-flota-mas__btn{border-radius:8px}
.vrc-flota-mas__btn[disabled]{opacity:.6;cursor:progress;transform:none}
.vrc-flota-mas.is-error .vrc-flota-mas__btn{border-color:var(--c-texto)}

/* --- Paginacion --- */
.vrc-paginacion{margin-top:clamp(28px,5vw,44px)}
.vrc-paginacion .nav-links{display:flex;flex-wrap:wrap;gap:.4rem;justify-content:center}
.vrc-paginacion .page-numbers{display:inline-flex;min-width:42px;height:42px;align-items:center;justify-content:center;padding:0 12px;border:1px solid var(--vrc-borde);border-radius:10px;color:var(--vrc-oscuro);font-weight:var(--fw-medio)}
.vrc-paginacion .page-numbers.current{background:var(--vrc-primario);border-color:var(--vrc-primario);color:#fff}
.vrc-paginacion a.page-numbers:hover{border-color:var(--vrc-cta);text-decoration:none}

.vrc-vacio{text-align:center;padding-block:clamp(28px,6vw,56px);display:flex;flex-direction:column;align-items:center;gap:1rem}

/* --- Ficha (single) --- */
.vrc-ficha__top{display:grid;gap:var(--vrc-gap)}
@media (min-width:900px){.vrc-ficha__top{grid-template-columns:1.2fr 1fr;align-items:start}}
.vrc-ficha__media{border-radius:var(--vrc-radio);overflow:hidden;background:var(--vrc-fondo)}
.vrc-ficha__img{width:100%;height:auto;display:block;aspect-ratio:16/9;object-fit:cover}
.vrc-ficha__info{display:flex;flex-direction:column;gap:.9rem}
.vrc-ficha__titulo{margin:.2rem 0 0}
.vrc-ficha__precio{display:inline-flex;align-items:baseline;gap:.3rem;margin:0;font-family:var(--f-titulo);font-weight:var(--fw-display);font-size:var(--fs-2xl);line-height:1.05;color:var(--c-naranja-cifra)}
.vrc-ficha__precio span{font-family:var(--f-base);font-weight:var(--fw-medio);font-size:var(--fs-xs);color:var(--c-texto-suave)}
.vrc-ficha__chips{list-style:none;display:flex;flex-wrap:wrap;gap:1rem;margin:0;padding:0;color:var(--vrc-gris);font-size:.9rem}
.vrc-ficha__chips li{display:inline-flex;align-items:center;gap:.4rem}
.vrc-ficha__chips .vrc-icono{width:18px;height:18px;color:var(--c-naranja-icono)}
/* Jerarquia A en la ficha: CTA naranja de ancho completo + filete + secundarios. */
.vrc-ficha__acciones{display:flex;flex-direction:column;margin-top:.4rem}
.vrc-ficha__reservar{width:100%;min-height:48px}
.vrc-ficha__tel{border:1px solid var(--vrc-borde);border-radius:var(--r-boton);padding:12px 20px}
.vrc-ficha__tel:hover{border-color:var(--vrc-cta)}

/* Especificaciones */
.vrc-specs{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr;gap:.75rem}
@media (min-width:600px){.vrc-specs{grid-template-columns:repeat(2,1fr)}}
@media (min-width:900px){.vrc-specs{grid-template-columns:repeat(3,1fr)}}
.vrc-specs__item{display:flex;align-items:center;gap:.6rem;background:var(--vrc-superficie);border:1px solid var(--vrc-borde);border-radius:var(--vrc-radio-sm);padding:12px 14px}
.vrc-specs__item .vrc-icono{width:22px;height:22px;color:var(--c-naranja-icono);flex-shrink:0}
.vrc-specs__etq{color:var(--vrc-gris);font-size:.85rem}
.vrc-specs__val{margin-left:auto;font-weight:var(--fw-medio);color:var(--vrc-oscuro)}

/* Galeria */
.vrc-galeria{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--vrc-gap)}
@media (min-width:900px){.vrc-galeria{grid-template-columns:repeat(3,1fr)}}
.vrc-galeria__img{width:100%;height:100%;aspect-ratio:16/9;object-fit:cover;border-radius:var(--vrc-radio-sm);display:block}

.vrc-ficha__desc{max-width:70ch}

/* Banda CTA de cierre */
.vrc-cta-band{background:var(--vrc-oscuro);color:#fff}
.vrc-cta-band__inner{display:flex;flex-direction:column;gap:1.2rem;align-items:flex-start}
@media (min-width:760px){.vrc-cta-band__inner{flex-direction:row;align-items:center;justify-content:space-between}}
.vrc-cta-band h2{color:#fff;margin:0 0 .3em}
.vrc-cta-band__acciones{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center}
.vrc-cta-band__tel{min-height:48px;padding:0 20px;border:1px solid rgba(255,255,255,.45);border-radius:var(--r-boton);color:#fff}
.vrc-cta-band__tel:hover{background:rgba(255,255,255,.12);color:#fff}
/* Secundarios icon-only sobre fondo oscuro: borde fino, sin color de canal.
   El <span> queda accesible (lector de pantalla) pero no visible. */
.vrc-btn-icono-oscuro{position:relative;display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;min-height:48px;padding:0;border:1px solid #5f5e5a;border-radius:var(--r-boton);background:transparent;color:#fff}
.vrc-btn-icono-oscuro:hover{background:rgba(255,255,255,.12);color:#fff;text-decoration:none}
.vrc-btn-icono-oscuro .vrc-icono{width:20px;height:20px;color:currentColor}
.vrc-btn-icono-oscuro span:not(.vrc-icono){position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.vrc-cta-band p{color:rgba(255,255,255,.85);margin:0}

/* ==========================================================================
   RESERVACIONES — formulario guiado + contenido indexable.
   ========================================================================== */

.vrc-reserva__grid{display:grid;gap:var(--vrc-gap)}
.vrc-reserva__grid > *{min-width:0}
@media (min-width:900px){.vrc-reserva__grid{grid-template-columns:1.5fr .9fr;align-items:start}}

/* Formulario (contenedor, NO es <form>).
   `color` explicito: dentro del hero se hereda #fff y el <h2> del panel quedaba
   BLANCO SOBRE BLANCO (invisible). El panel fija su propia tinta. */
.vrc-reserva__form{background:var(--c-blanco);color:var(--c-texto);border:1px solid var(--c-borde);border-radius:var(--r-panel);padding:clamp(16px,4vw,32px);box-shadow:var(--s-1)}
.vrc-reserva__titulo{margin-bottom:.4rem}
.vrc-reserva__intro{color:var(--c-texto-suave);font-size:var(--fs-sm);margin-bottom:1.4rem}
/* 🔴 EJE VERTICAL — 8-ago. Ocho rondas se midio el ancho y el desborde era de
   ALTO: a 415px la tarjeta media 949px y el hero 1231px sobre 730 de pantalla,
   1,69 pantallas para un formulario. Presupuesto medido de esos 949:
     padding 40 · campos 704 · titulo+intro+error+CTA 205
   Dentro de `campos` habia DOBLE ESPACIADO: este grid ya pone `gap`, y ademas
   cada .vrc-campo traia su propio margin-bottom. Se paga dos veces por hueco.
   El margen se anula AQUI DENTRO y no en .vrc-campo, que se usa en mas sitios
   (Contacto) donde si es el separador legitimo. */
.vrc-reserva__campos{display:grid;gap:.75rem}
.vrc-reserva__campos > .vrc-campo{margin-bottom:0}
/* Un .vrc-campo vacio media 0px de alto y aun asi cobraba gap. Espacio muerto. */
.vrc-reserva__campos > .vrc-campo:empty{display:none}
/* BLINDAJE DEL SELECT — el riesgo latente de Safari/iOS, no cosmetica.
   La opcion mas larga ("Aeropuerto Internacional President...") pide 560px y la
   caja da 282 a 360px de ventana. `min-width:auto` es el valor inicial de un
   item de grid, asi que sin esto el select puede negarse a encoger y empujar la
   tarjeta entera a lo ancho. Con min-width:0 encoge, y el ellipsis hace que el
   recorte se LEA como recorte en vez de parecer texto cortado por un bug. */
.vrc-reserva__campos > *{min-width:0}
select.vrc-input{max-width:100%;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}
/* ARRUGA (a) — 4ª pasada, 8-ago-2026. Muere el corte magico por ancho de
   ventana: la condicion real es que quepa la COLUMNA, no que la ventana mida
   tanto. auto-fit apila solo cuando una columna no llega al suelo, y vuelve a
   dos en cuanto caben. Sin rangos huerfanos.

   El suelo esta MEDIDO sobre el beta vivo (Blink, Satoshi 17px), no elegido:
     input[type=date] intrinseco = 175,0px  ·  input[type=time] = 150,8px
   200px = 175 medido + 25 de margen.  Con el gap de 12px, dos columnas piden
   412px de contenedor; por debajo, una sola.

   Por que 200 y no mas: a 1200px de ventana el contenedor del hero da 462px,
   asi que cualquier suelo por encima de 225 dejaria el ESCRITORIO en una
   columna. Todo el margen disponible vive entre 175 y 225 — no hay mas sitio,
   y conviene saberlo antes de tocar este numero.

   Lo que la regla anterior hacia mal: miraba la VENTANA, y por eso protegia el
   lado equivocado. La columna mas estrecha no esta en el movil (a 360px el par
   ocupa 282px de una sola columna); esta en el escritorio ancho, donde median
   225px y ninguna media query llegaba. Medido: margen libre por ventana —
   360px:107  500px:233  700px:108  850px:179  1200px:50. */
.vrc-campo--par{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:.75rem}
.vrc-campo--par > div{min-width:0}

/* 🔴 EL SUELO BAJA DE 200 A 160 — 8-ago, 5ª pasada, y por que NO es aflojar.
   El 200 de la 4ª pasada salia de 175 "intrinseco" + margen. Ese 175 era el
   ancho POR DEFECTO del control (width:auto), NO su minimo: Blink comprime el
   campo bastante por debajo antes de romper nada. Medir el defecto no es medir
   el limite, y aqui se confundieron.

   El limite real se midio MIRANDO, con valores puestos (31/12/2026 · 22:45),
   que es el caso que rompe — el placeholder aguanta mas y por eso engaña:
     columna 164px -> "10:45 p. m." COMPLETO      ✅
     columna 139px -> "10:45 p. r"  AM/PM CORTADO 🔴
   Suelo 160 -> dos columnas desde 332px de contenedor. A 415px de ventana
   (contenedor 339) entra con 164 por columna; a 360px (contenedor 290) NO, y
   se queda apilado, que es lo correcto.

   ⚠️ Y el reparto va 1fr 1fr, NO desigual a favor de la fecha: la HORA es el
   campo que mas pide —"10:45 p. m." son 11 caracteres frente a los 10 de
   "31/12/2026"—, asi que quitarle ancho a la hora corta justo el AM/PM. Se
   probo 1.35fr/1fr y cortaba a 360 Y a 415. */
/* «Devuelvo en el mismo aeropuerto» — 8-ago-2026. Va pegado al selector de
   recogida, no separado como un campo mas: es una modificacion de ESE campo.
   Area de toque de 44px por la fila entera (es un <label>), no solo la caja. */
.vrc-campo__check{display:flex;align-items:center;gap:.55rem;min-height:44px;margin:.35rem 0 0;font-size:var(--fs-sm);color:var(--c-texto-suave);cursor:pointer;font-weight:var(--fw-normal)}
.vrc-campo__check input{width:18px;height:18px;flex-shrink:0;accent-color:var(--c-naranja);margin:0}
.vrc-input{width:100%;padding:12px 14px;border:1px solid var(--c-borde);border-radius:var(--r-sm);font:inherit;color:var(--c-texto);background:var(--c-fondo-alt)}
.vrc-input:focus{outline:none;border-color:var(--c-naranja);background:#fff}
select.vrc-input{appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--c-texto-suave) 50%),linear-gradient(135deg,var(--c-texto-suave) 50%,transparent 50%);background-position:calc(100% - 20px) center,calc(100% - 15px) center;background-size:5px 5px,5px 5px;background-repeat:no-repeat;padding-right:40px}

/* --- Safari iOS: los campos de fecha y hora (8-ago-2026) ---
   En iOS se pintaban como cajas blancas vacias y MAS ALTAS que los selects.
   En Chrome de escritorio se ven bien: es render nativo de WebKit, no un fallo
   de la maqueta. Cosmetica pura — ni se cambia el `type` ni entra JS.

   Altura pareja: se fija para TODOS los .vrc-input en vez de depender de que
   cada motor de render calcule lo mismo. box-sizing es border-box global, asi
   que incluye padding y borde.

   🔴 CORRECCION 8-ago (medida, 4ª pasada): con 54 esto NO igualaba nada, y el
   comentario anterior decia que si. Medido en Blink sobre el beta vivo, en los
   cinco anchos de la puerta:
     input date/time -> contenido 30px + padding 24 + borde 2 = 56px
     select          -> contenido 28px + padding 24 + borde 2 = 54px
   El suelo de 54 no llegaba a tocar al input (ya medía 56), asi que solo
   ataba al select: quedaban 2px de diferencia SIEMPRE.
   Se sube el suelo a 56 para que el select alcance al input. Se sube, nunca se
   baja: bajarlo recortaria la caja nativa del date/time, que es justo lo que
   este bloque vino a arreglar en iOS. */
.vrc-input{min-height:56px}

/* 🔴 LA CAUSA REAL DEL DESBORDE, 8-ago (9ª ronda) — y era INVISIBLE desde aqui.
   Evidencia: captura del iPhone de Yeison, navegacion privada. Los CUATRO
   inputs de fecha/hora acaban ~47px mas anchos que los selects y rompen el
   borde derecho de la tarjeta; las esquinas quedan flotando sobre el hero.
   Selects, categoria y CTA: dentro. Solo date/time: fuera.

   Por que solo ellos: `select.vrc-input` ya llevaba `appearance:none` desde
   siempre. Los input date/time NO. Safari iOS los pinta como WIDGET NATIVO, y
   un widget nativo IGNORA `width:100%` y dicta su propio ancho. Blink no
   reproduce el defecto, asi que nueve rondas de sondas dieron verde midiendo
   un motor de render que no es donde vive el bug.

   `display:block` porque iOS los trata como inline por defecto, y un inline no
   obedece del todo al ancho de su caja.

   ⚠️ El `min-height:56px` de arriba los sigue sosteniendo: este reset quita el
   ASPECTO nativo, no la altura. Y NO puede tocar lo que arreglo el bloque de
   iOS mas abajo —color, alineacion y AM/PM del valor—, que vive en los
   pseudo-elementos y sobrevive al reset.

   🔴 ESTE ARREGLO NO SE PUDO VERIFICAR AQUI. En Chrome se comprobo que no
   cambia NADA (misma caja, misma altura, mismo valor, mismo icono). Que
   ARREGLE iOS solo lo dice el iPhone. Hasta esa firma, es una hipotesis
   desplegada, no un cierre. */
input[type="date"].vrc-input,
input[type="time"].vrc-input{
  -webkit-appearance:none;
  appearance:none;
  display:block;
}

/* iOS mete el valor en su propia caja con margen propio, y ahi es donde se iba
   la altura de mas. Ademas la alinea a la DERECHA por defecto dentro de un
   campo ancho, que es lo que hacia que pareciera vacia: el contenido quedaba
   fuera de la vista util. */
input[type="date"].vrc-input::-webkit-date-and-time-value,
input[type="time"].vrc-input::-webkit-date-and-time-value{
  text-align:left;margin:0;min-height:1.2em;
}
/* El color NO se hereda solo en estos pseudo-elementos: si queda sin declarar,
   iOS puede pintarlo transparente o en un gris invisible sobre el fondo claro.
   Es el sospechoso principal del «se ve en blanco». */
.vrc-input::-webkit-datetime-edit,
.vrc-input::-webkit-datetime-edit-fields-wrapper,
.vrc-input::-webkit-datetime-edit-text,
.vrc-input::-webkit-datetime-edit-day-field,
.vrc-input::-webkit-datetime-edit-month-field,
.vrc-input::-webkit-datetime-edit-year-field,
.vrc-input::-webkit-datetime-edit-hour-field,
.vrc-input::-webkit-datetime-edit-minute-field,
.vrc-input::-webkit-datetime-edit-ampm-field{
  color:var(--c-texto);opacity:1;-webkit-text-fill-color:var(--c-texto);
}
/* El icono del calendario/reloj tampoco se ve si hereda un color raro. */
.vrc-input::-webkit-calendar-picker-indicator{opacity:1}
.vrc-reserva__error{color:#c0392b;font-size:var(--fs-sm);font-weight:var(--fw-medio);margin:.9rem 0 0;min-height:1.2em}
.vrc-reserva__cta{width:100%;margin-top:1rem}

/* Aside: beneficios + ayuda */
.vrc-reserva__aside{display:flex;flex-direction:column;gap:var(--vrc-gap)}
.vrc-beneficios{list-style:none;margin:0;padding:0;display:grid;gap:1rem}
.vrc-beneficios li{display:flex;gap:.7rem;align-items:flex-start;font-size:var(--fs-sm);color:var(--c-texto)}
.vrc-beneficios .vrc-icono{width:22px;height:22px;color:var(--c-naranja);flex-shrink:0}
.vrc-ayuda{background:var(--c-negro);color:#fff;border-radius:var(--r-md);padding:clamp(20px,4vw,28px)}
.vrc-ayuda__titulo{color:#fff;font-size:var(--fs-lg)}
.vrc-ayuda p{color:rgba(255,255,255,.82);font-size:var(--fs-sm)}
.vrc-ayuda__wa{width:100%;margin-bottom:.6rem}
.vrc-ayuda__tel{display:inline-flex;justify-content:center;width:100%;gap:.4em;padding:12px 18px;border:1px solid rgba(255,255,255,.35);border-radius:var(--r-boton);color:#fff;font-weight:var(--fw-medio)}
.vrc-ayuda__tel:hover{border-color:#fff;text-decoration:none}
.vrc-ayuda__tel .vrc-icono{width:18px;height:18px}

/* Bloque B: prosa */
.vrc-prosa{max-width:75ch}
.vrc-prosa h2{margin-top:2rem}
.vrc-prosa h2:first-child{margin-top:0}
.vrc-prosa ul,.vrc-prosa ol{padding-left:1.2rem;color:var(--c-texto)}
.vrc-prosa li{margin-bottom:.5rem}
.vrc-pasos{list-style:decimal}
.vrc-pendiente{color:var(--c-texto-suave);font-style:italic;border-left:3px solid var(--c-borde);padding-left:1rem}

/* FAQ */
.vrc-faq{display:grid;gap:.6rem;margin-bottom:1.2rem}
.vrc-faq__item{border:1px solid var(--c-borde);border-radius:var(--r-sm);background:var(--c-blanco)}
.vrc-faq__item summary{cursor:pointer;list-style:none;padding:14px 18px}
.vrc-faq__item summary::-webkit-details-marker{display:none}
.vrc-faq__q{display:inline;font-size:var(--fs-base);font-weight:var(--fw-medio);margin:0}
.vrc-faq__item summary::after{content:"+";float:right;color:var(--c-naranja);font-weight:var(--fw-medio);margin-left:1rem}
.vrc-faq__item[open] summary::after{content:"\2212"}
.vrc-faq__a{padding:0 18px 16px;color:var(--c-texto-suave)}
.vrc-faq__a p{margin:0}

/* ==========================================================================
   HOME (front-page) — hero+form, destacados, valores, pasos, reseñas.
   ========================================================================== */

.vrc-hero--inicio{min-height:auto;align-items:center}
.vrc-hero__contenido--inicio{display:grid;gap:var(--vrc-gap);padding-block:clamp(32px,7vw,64px);width:100%}
@media (min-width:900px){.vrc-hero__contenido--inicio{grid-template-columns:1.05fr .95fr;align-items:center}}
.vrc-hero__texto,.vrc-hero__form{min-width:0}
.vrc-hero__texto h1{color:#fff}
.vrc-hero__cta{margin-top:1.3rem}
.vrc-hero__form .vrc-reserva__form{margin:0}

/* Cabecera de sección con enlace a la derecha */
.vrc-seccion__cabecera{display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;align-items:center;margin-bottom:clamp(20px,4vw,32px)}
.vrc-seccion__cabecera .vrc-titulo-seccion{margin:0}
.vrc-seccion__cabecera .vrc-btn{border-radius:8px}   /* "Ver flota": radio 8, no pildora */

/* Por qué Minyeti — tarjetas de DATO (cifra grande sobre crema).
   Dos naranjas distintos a proposito: icono de trazo fino en el tono medio,
   cifra de masa gruesa en el oscuro. NO unificar. */
.vrc-datos{list-style:none;margin:0;padding:0;display:grid;gap:var(--vrc-gap);grid-template-columns:1fr}
@media (min-width:600px){.vrc-datos{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1000px){.vrc-datos{grid-template-columns:repeat(4,1fr)}}
.vrc-dato{background:linear-gradient(160deg,#fdf4ee 0%,#f7e2d3 100%);border-radius:var(--r-tarjeta);padding:24px 22px}
.vrc-dato__icono{width:30px;height:30px;color:var(--c-naranja-icono);margin-bottom:.6rem}
.vrc-dato__cifra{font-family:var(--f-base);font-weight:var(--fw-medio);font-size:36px;line-height:1;letter-spacing:-.02em;color:var(--c-naranja-cifra);margin:0}
.vrc-dato__etiqueta{font-size:13px;font-weight:var(--fw-medio);color:var(--c-texto);margin:.25rem 0 .5rem}
.vrc-dato__cuerpo{font-size:13px;line-height:1.55;color:var(--c-texto-suave);margin:0}
/* Excepcion aprobada: la seccion no tiene boton, asi que el naranja puede ser fondo. */
.vrc-dato--destacada{background:linear-gradient(165deg,var(--c-naranja-grad-1) 0%,var(--c-naranja-grad-2) 45%,var(--c-naranja-grad-3) 100%)}
.vrc-dato--destacada .vrc-dato__icono,
.vrc-dato--destacada .vrc-dato__cifra,
.vrc-dato--destacada .vrc-dato__etiqueta{color:#fff}
.vrc-dato--destacada .vrc-dato__cuerpo{color:rgba(255,255,255,.92)}

/* Cómo funciona — numerales grandes 01/02/03, sin circulo naranja */
.vrc-pasos--home{list-style:none;padding:0;display:grid;gap:var(--vrc-gap);counter-reset:paso;margin:0}
@media (min-width:760px){.vrc-pasos--home{grid-template-columns:repeat(3,1fr)}}
.vrc-pasos--home li{counter-increment:paso;margin:0;padding:0;background:none;border:0}
/* Numeral en tinta, NO en el #e2ddd4 de la maqueta: alli vivia sobre crema y
   aqui la seccion es blanca (1.4:1, invisible). Medido el 2026-08-05. */
.vrc-pasos--home li::before{content:counter(paso,decimal-leading-zero);display:block;font-family:var(--f-base);font-weight:var(--fw-medio);font-size:44px;line-height:1;letter-spacing:-.02em;color:var(--c-negro);margin-bottom:.35rem}
.vrc-pasos--home li p{margin:0;color:var(--c-texto-suave);font-size:var(--fs-sm)}
.vrc-pasos--home li strong{color:var(--c-texto)}

/* Banner «Tu carro te espera» — panel naranja + tarjeta de recibo */
.vrc-banner{display:grid;gap:clamp(20px,4vw,32px);background:linear-gradient(110deg,var(--c-naranja-grad-4) 0%,var(--c-naranja) 42%,var(--c-naranja-grad-5) 100%);border-radius:var(--r-panel);padding:clamp(24px,5vw,40px);color:#fff}
@media (min-width:820px){.vrc-banner{grid-template-columns:1.15fr .85fr;align-items:center}}
.vrc-banner__encabezado{text-transform:uppercase;letter-spacing:.16em;font-size:12px;font-weight:var(--fw-medio);color:rgba(255,255,255,.85);margin:0 0 .5rem}
.vrc-banner h2{color:#fff;font-size:clamp(1.6rem,3.5vw,2rem);margin:0 0 .4rem}
.vrc-banner__bajada{color:rgba(255,255,255,.92);margin:0 0 1.2rem;max-width:46ch}
.vrc-banner__cta{display:inline-flex;align-items:center;justify-content:center;min-height:48px;background:#fff;color:var(--c-naranja-cta-texto);font-size:16px;font-weight:var(--fw-medio);padding:0 26px;border-radius:var(--r-boton)}
.vrc-banner__cta:hover{background:var(--c-fondo-alt);color:var(--c-naranja-cta-texto);text-decoration:none}
.vrc-recibo{background:#fff;color:var(--c-texto);border-radius:14px;padding:20px}
.vrc-recibo__titulo{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--c-texto-suave);margin:0 0 .5rem}
.vrc-recibo__modelo{font-weight:var(--fw-medio);font-size:16px;margin:0}
.vrc-recibo__fechas{font-size:13px;color:var(--c-texto-suave);margin:.15rem 0 0}
.vrc-recibo__fila{display:flex;justify-content:space-between;align-items:baseline;border-top:1px solid #eee6de;margin-top:.9rem;padding-top:.9rem}
.vrc-recibo__dias{font-size:13px;color:var(--c-texto-suave)}
.vrc-recibo__total{font-size:24px;font-weight:var(--fw-medio);letter-spacing:-.02em}
/* Verde solo en el icono: #25d366 sobre blanco no llega para texto. */
.vrc-recibo__seguro{display:inline-flex;align-items:center;gap:5px;font-size:12px;color:var(--c-texto);margin:.75rem 0 0}
.vrc-recibo__seguro .vrc-icono{width:14px;height:14px;color:var(--c-wa)}

/* Reseñas */
.vrc-resenas{text-align:center}
.vrc-resenas__nota{color:var(--c-texto-suave);margin-bottom:1rem}
.vrc-resenas__rating{display:inline-flex;flex-direction:column;align-items:center;gap:.4rem}
.vrc-resenas__num{font-family:var(--f-titulo);font-weight:var(--fw-display);font-size:var(--fs-3xl);line-height:1;color:var(--c-negro)}
.vrc-resenas__estrellas{display:inline-flex;gap:.15rem;color:var(--c-naranja)}
.vrc-resenas__estrellas .vrc-icono{width:26px;height:26px}
.vrc-resenas__conteo{color:var(--c-texto-suave);font-size:var(--fs-sm)}

/* ==========================================================================
   SEGUROS (template-seguros) — tarjetas del diseno elegido (5-ago-2026).
   Estructura: nombre 15/500 · bajada 12 · precio 26/500 NEGRO · caja de
   deducible en color (radio 8px) · «Cubre» · CTA. Un solo naranja por tarjeta
   y es el CTA. El Intermedio destaca por FORMA, no por color de texto.
   Sustituye al comparador .vrc-plan*, retirado con el diseno viejo.
   ========================================================================== */

.vrc-bloque-estrecho{max-width:760px;margin-inline:auto}

.vrc-sg{display:grid;gap:var(--vrc-gap);align-items:start}
@media (min-width:900px){
  .vrc-sg{grid-template-columns:repeat(3,1fr);padding-top:26px}
  .vrc-sg__card--dest{transform:translateY(-26px)}
}

.vrc-sg__card{position:relative;display:flex;flex-direction:column;height:100%;background:var(--c-blanco);border:1px solid var(--c-borde);border-radius:var(--r-tarjeta);padding:24px 22px}
.vrc-sg__card--dest{border:2px solid var(--c-naranja);padding:30px 22px 24px;box-shadow:var(--s-2)}

/* Badge centrado arriba, montado sobre el borde */
.vrc-sg__badge{position:absolute;top:0;left:50%;transform:translate(-50%,-50%);background:var(--c-naranja);color:#fff;font-size:11px;font-weight:var(--fw-medio);letter-spacing:.08em;text-transform:uppercase;padding:5px 12px;border-radius:var(--r-boton);white-space:nowrap}

.vrc-sg__n{margin:0;font-size:15px;font-weight:var(--fw-medio);line-height:1.3;color:var(--c-texto)}
.vrc-sg__baj{margin:.35em 0 1.1em;font-size:12px;line-height:1.45;color:var(--c-texto-suave)}
.vrc-sg__precio{margin:0 0 1.1em;font-size:26px;font-weight:var(--fw-medio);line-height:1;color:var(--c-texto)}
.vrc-sg__precio small{font-size:12px;font-weight:400;color:var(--c-texto-suave);margin-left:2px}

/* Caja de deducible — pesa mas que el precio, a proposito.
   Escala de riesgo COMPLETA desde el 5-ago-2026: coral expone → ambar medio →
   verde protege, sostenida por la escalera 10,000 → 2,500 → 1,000. */
.vrc-sg__ded{border-radius:8px;padding:12px 14px;margin:0 0 1.2em}
.vrc-sg__ded-h{margin:0 0 .3em;font-size:11px;font-weight:var(--fw-medio);letter-spacing:.04em;line-height:1.3}
.vrc-sg__ded-v{margin:0;font-size:19px;font-weight:var(--fw-medio);line-height:1.15}
/* Matiz de la cifra. Hereda el color de la caja: si se contara aparte, la nota
   quedaria en gris y el matiz pesaria menos que la cifra que corrige. */
.vrc-sg__ded-n{margin:.45em 0 0;font-size:12px;font-weight:var(--fw-medio);line-height:1.4}
/* coral — expone al cliente */
.vrc-sg__ded--alto{background:#fdecea;border:1px solid #f3bdb6}
.vrc-sg__ded--alto .vrc-sg__ded-h,.vrc-sg__ded--alto .vrc-sg__ded-n{color:#8c2f22}
.vrc-sg__ded--alto .vrc-sg__ded-v{color:#a3301f}
/* ambar — riesgo medio */
.vrc-sg__ded--medio{background:#fdf3d7;border:1px solid #e2c368}
.vrc-sg__ded--medio .vrc-sg__ded-h,.vrc-sg__ded--medio .vrc-sg__ded-n{color:#7a5c12}
.vrc-sg__ded--medio .vrc-sg__ded-v{color:#8a6a1f}
/* verde SEMANTICO de riesgo — protege. NO es #25d366 (ese es solo WhatsApp) */
.vrc-sg__ded--bajo{background:#e7f4ec;border:1px solid #9ecdb0}
.vrc-sg__ded--bajo .vrc-sg__ded-h,.vrc-sg__ded--bajo .vrc-sg__ded-n{color:#1f5b3a}
.vrc-sg__ded--bajo .vrc-sg__ded-v{color:#256b44}
/* neutro — sin dato. Ya no se usa; se queda por si vuelve a faltar uno. */
.vrc-sg__ded--pendiente{background:var(--c-fondo-alt);border:1px dashed var(--c-borde)}
.vrc-sg__ded--pendiente .vrc-sg__ded-h{color:var(--c-texto-suave)}
.vrc-sg__ded--pendiente .vrc-sg__ded-v{font-size:13px;font-weight:var(--fw-medio);color:var(--c-texto-suave)}

.vrc-sg__sub{margin:0 0 .5em;font-size:11px;font-weight:var(--fw-medio);letter-spacing:.06em;text-transform:uppercase;color:var(--c-texto-suave)}
.vrc-sg__lista{list-style:none;margin:0 0 1.4em;padding:0;display:grid;gap:.45em}
.vrc-sg__lista li{display:grid;grid-template-columns:auto 1fr;gap:.5em;align-items:start;font-size:13px;line-height:1.45;color:var(--c-texto)}
.vrc-sg__lista .vrc-icono{width:15px;height:15px;margin-top:2px;color:var(--c-texto)}

/* CTA al pie — el UNICO naranja de la tarjeta */
.vrc-sg__cta{margin-top:auto;width:100%;min-height:44px;border-radius:var(--r-boton);display:inline-flex;align-items:center;justify-content:center;font-size:14px}
.vrc-sg__cta--fantasma{background:transparent;border:1px solid var(--c-borde);color:var(--c-texto)}
.vrc-sg__cta--fantasma:hover{background:var(--c-fondo-alt);color:var(--c-texto);text-decoration:none}

/* Exclusiones comunes — VISIBLE, del tamano del resto, nunca letra pequena.
   Sin naranja (esta reservado a la accion) y sin fondo coral: la coral ya la
   gasta el deducible del Basico y dos rojos compiten. Peso por borde y tinta. */
.vrc-sg__no{margin-top:var(--vrc-gap);background:var(--c-blanco);border:1px solid var(--c-borde);border-left:4px solid #a3301f;border-radius:var(--r-tarjeta);padding:20px 22px}
.vrc-sg__no-t{margin:0 0 .7em;font-size:var(--fs-lg);line-height:1.25;color:var(--c-negro)}
.vrc-sg__no-lista{list-style:none;margin:0;padding:0;display:grid;gap:.5em}
@media (min-width:640px){.vrc-sg__no-lista{grid-template-columns:repeat(3,1fr)}}
.vrc-sg__no-lista li{display:grid;grid-template-columns:auto 1fr;gap:.5em;align-items:center;font-size:var(--fs-base);font-weight:var(--fw-medio);color:var(--c-texto)}
.vrc-sg__no-lista .vrc-icono{width:18px;height:18px;color:#a3301f}
.vrc-sg__no-n{margin:.9em 0 0;font-size:var(--fs-sm);color:var(--c-texto-suave)}

/* Marcador visible de contenido pendiente (no es contenido real) */
.vrc-pendiente{display:block;background:var(--c-fondo-alt);border:1px dashed var(--c-naranja);border-radius:var(--r-sm);padding:8px 12px;font-size:var(--fs-xs);color:var(--c-texto-suave);margin:.35rem 0}
.vrc-pendiente strong{color:var(--c-naranja);text-transform:uppercase;letter-spacing:.05em;margin-right:.35rem}

/* ===================================================================
   /reservaciones/ — el motor es el protagonista
   Los tres canales son regla de negocio (2-3 ago): motor + WhatsApp +
   llamada. El motor va primero y con mas peso visual; los otros dos
   acompanan. Ver SISTEMA-Diseno-Minyeti.md §6-ter y §«tres canales».
   =================================================================== */
.vrc-motor__titulo{margin:0 0 .25rem}
.vrc-motor__sub{margin:0 0 1.25rem;color:var(--c-texto-suave);max-width:60ch}
/* Caja del buscador: le da superficie propia para que se lea como «la
   accion principal» y no como un formulario mas de la pagina. */
.vrc-motor__caja{background:var(--c-blanco);border:1px solid var(--c-borde);
  border-radius:var(--r-panel);padding:clamp(1rem,3vw,1.75rem);overflow-x:auto}
.vrc-alt__titulo{margin:0 0 .25rem}
.vrc-alt__sub{margin:0 0 1.25rem;color:var(--c-texto-suave);max-width:60ch}

/* Los flotantes son position:fixed abajo a la derecha. En movil tapaban
   el ultimo elemento de la pagina: se reserva su altura al final del
   articulo en vez de tocar el body (que afectaria a todo el sitio). */
/* MEDIDO, no estimado: la pila son dos botones de 56px + 12px de hueco =
   124px, mas los 16px de `bottom`. La primera version reservaba 88px y la
   puerta la tumbo (flotante 124 > reserva 88). Margen de seguridad incluido. */
/* ARRUGA (c) — 8-ago-2026. La reserva ya existia pero era PARCIAL: solo por
   debajo de 860px y solo en dos paginas. Yeison lo vio en movil Y en desktop,
   con el flotante naranja tapando el CTA verde de contacto. Ahora se reserva en
   TODOS los anchos y en todo el sitio, y el numero sale de --h-flotantes para
   que viva en un solo sitio. El 164px de ese token es el MEDIDO de aqui. */
.site-footer{padding-bottom:var(--h-flotantes)}
.vrc-cta-band{padding-bottom:var(--h-flotantes)}
@media (max-width:860px){
  .page-reservaciones,
  .page-contacto{padding-bottom:var(--h-flotantes)}
}

/* Sin motor (el beta remoto no tiene VikRentCar): la caja dice la verdad y
   empuja a los otros dos canales. Nunca un shortcode en crudo. */
.vrc-motor__caja--sin-motor{display:flex;flex-direction:column;gap:.75rem;align-items:flex-start}
.vrc-motor__caja--sin-motor p{margin:0}