/* SS Performance · web con el diseño nuevo (14-oct-2026, las 16 diapositivas): negro, amarillo y oro, titulares en Playfair Display y texto en Outfit. */
@font-face{font-family:"TSP Titulo";font-weight:700;font-display:swap;src:url(fuentes/playfair-display-latin-700-normal.woff2?v=1) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212,U+FEFF}
@font-face{font-family:"TSP Titulo";font-weight:800;font-display:swap;src:url(fuentes/playfair-display-latin-800-normal.woff2?v=1) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212,U+FEFF}
@font-face{font-family:"TSP Titulo";font-weight:900;font-display:swap;src:url(fuentes/playfair-display-latin-900-normal.woff2?v=1) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212,U+FEFF}
@font-face{font-family:"TSP Cuerpo";font-weight:300;font-display:swap;src:url(fuentes/outfit-latin-300-normal.woff2?v=1) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212,U+FEFF}
@font-face{font-family:"TSP Cuerpo";font-weight:400;font-display:swap;src:url(fuentes/outfit-latin-400-normal.woff2?v=1) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212,U+FEFF}
@font-face{font-family:"TSP Cuerpo";font-weight:500;font-display:swap;src:url(fuentes/outfit-latin-500-normal.woff2?v=1) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212,U+FEFF}
@font-face{font-family:"TSP Cuerpo";font-weight:600;font-display:swap;src:url(fuentes/outfit-latin-600-normal.woff2?v=1) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212,U+FEFF}

html,body{background:#000!important;margin:0}
.tsp{--fondo:#000;--oro:#ffb020;--amarillo:#ffd60a;--eyebrow:#ffd60a;--texto:#fff;--suave:#e4e4e4;--borde-oro:#d9a21b;--linea:color-mix(in srgb,var(--amarillo) 45%,transparent);--lado:clamp(18px,5.4vw,120px);--alto-cab:clamp(64px,5.3vw,90px);
  /* Dorados (D-PERF dorado, 20-oct): todos los oros de la marca, en un solo bloque; cada página los ajusta a su diapositiva en el bloque de abajo. */
  --oro-claro:#ffb54a;--boton-alto:#f8b95a;--boton-bajo:#e68f2f;--boton-borde:#ffd34d;--boton-fondo:linear-gradient(180deg,var(--boton-alto),var(--boton-bajo));--acento:#ffb020;--separador-apagado:rgb(137,129,92);
  --ficha-oro:#d9c34f;--ficha-claim:#f1c232;--ficha-boton-alto:#ecc66d;--ficha-boton-bajo:#dcae4f;--ficha-raya:#d9b45a;--ficha-lateral:#e6d8b6;--ficha-casilla:#e3c03c;--ficha-punto:#dcc13a;
  --venta-oro-alto:#ffd777;--venta-oro-bajo:#ffa21f;--etapa-oro:#ffc20e;--etapa-borde:#e3a31b;--dubai-oro:#f7d68c;
  --titulo:"TSP Titulo","Playfair Display",Georgia,serif;--cuerpo:"TSP Cuerpo",Outfit,"Segoe UI",Arial,sans-serif;--peso-titulo:900;
  background:var(--fondo);color:var(--texto);font:400 clamp(15px,1.2vw,20px)/1.4 var(--cuerpo);min-height:100vh;overflow-x:clip;-webkit-font-smoothing:antialiased}
/* Las pantallas de la segunda mitad de las diapositivas (11 a 16): titulares más finos y el oro más claro. */
.tsp-p-dubai,.tsp-p-config,.tsp-p-galeria,.tsp-p-venta4,.tsp-p-venta2,.tsp-p-prensa,.tsp-p-contacto{--peso-titulo:700;--oro:var(--oro-claro);--eyebrow:#f4a63c}
/* Dorado igualado a cada diapositiva (paso 2; medidas en 02-copias/v6-perf-dorado/MEDIDAS.md). Inicio (1-3), Configurador (13) y Venta (14) ya coinciden; Dubái sigue a la diapositiva 11 (números 01-04 y botón liso; la 12 lleva el botón 7° más amarillo).
   La gama (10): botones oro liso más amarillo; Prensa (15) y Contacto (16): botones con brillo horizontal (bordes más naranjas, centro claro) y eyebrow y etiquetas en el oro amarillo de la diapositiva (51-56°). */
.tsp-p-brand{--oro:#fabd0a}
.tsp-p-range{--oro:#f9b508;--boton-fondo:#e4c14b;--boton-borde:#e8c44b}
.tsp-p-dubai{--oro:#f2b466;--boton-fondo:#ffad5c}
.tsp-p-prensa{--oro:#f8bf41;--eyebrow:#e0cb58;--boton-fondo:linear-gradient(90deg,#f49f18,#ffc853 50%,#f8a61b)}
.tsp-p-contacto{--oro:#f8cd51;--eyebrow:#e0cb58;--boton-fondo:linear-gradient(90deg,#f4a615,#ffd25b 50%,#f9b11c)}
.tsp *,.tsp *::before,.tsp *::after{box-sizing:border-box}
:where(.tsp) img{max-width:100%;display:block}
:where(.tsp) a{color:inherit;text-decoration:none}
.tsp button{font:inherit;color:inherit;background:none;border:0;border-radius:0;box-shadow:none;cursor:pointer;padding:0;margin:0;min-height:0;width:auto;text-transform:inherit;letter-spacing:inherit;line-height:inherit;text-shadow:none}
.tsp button:hover,.tsp button:focus{background:none;color:inherit;border-color:transparent}
.tsp :focus-visible{outline:3px solid var(--amarillo);outline-offset:3px}
:where(.tsp) :where(p,h1,h2,h3,ul,ol,figure,dl){margin:0;padding:0}
:where(.tsp) :where(ul,ol){list-style:none}
.tsp-oculto,.tsp-etiqueta-oculta{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.tsp-icono{width:1.5em;height:1.5em;flex:none}
.tsp-trampa{position:absolute!important;left:-9999px;width:1px;height:1px;opacity:0}

/* Cabecera: barra negra, logo que sobresale, menú, botón y idioma */
.tsp-cabecera{position:sticky;top:0;z-index:50;display:flex;align-items:center;height:var(--alto-cab);padding:0 var(--lado);background:#000;border-bottom:1px solid color-mix(in srgb,var(--amarillo) 28%,transparent)}
.tsp-marca{position:absolute;left:calc(var(--lado) - 8px);top:0;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:0 14px;background:#000;z-index:2}
.tsp-marca img{width:auto;height:calc(var(--alto-cab) * .54)}
/* «PERFORMANCE.EU» con la letra del logo del cliente, debajo de la S y unas tres veces más ancho, como en las diapositivas. */
.tsp-marca .tsp-marca-texto{width:clamp(76px,10.2vw,180px);height:auto;margin-top:clamp(3px,.35vw,6px)}
.tsp-menu{display:flex;align-items:center;gap:clamp(12px,1.6vw,30px);margin-left:auto}
.tsp .tsp-menu ul{display:flex;gap:clamp(13px,2.3vw,42px)}
.tsp .tsp-menu ul a{display:block;font:400 clamp(11.5px,.97vw,15.5px)/1 var(--cuerpo);letter-spacing:.01em;text-transform:uppercase;padding:9px 0;border-bottom:2px solid transparent;white-space:nowrap}
.tsp .tsp-menu ul a:hover,.tsp .tsp-menu ul a[aria-current]{color:var(--amarillo);border-bottom-color:var(--amarillo)}
.tsp-idioma{display:flex;align-items:center;gap:8px;font:500 clamp(12px,1vw,16px)/1 var(--cuerpo);padding:8px 0 8px clamp(14px,1.6vw,28px);border-left:2px solid var(--amarillo)}
.tsp-p-dubai .tsp-idioma,.tsp-p-config .tsp-idioma,.tsp-p-galeria .tsp-idioma,.tsp-p-venta4 .tsp-idioma,.tsp-p-venta2 .tsp-idioma,.tsp-p-prensa .tsp-idioma,.tsp-p-contacto .tsp-idioma{border-left:1px solid rgba(255,255,255,.7)}
.tsp-idioma .tsp-icono{width:1.9em;height:1.9em}
.tsp-idioma-movil{display:none}
.tsp .tsp-menu-boton{display:none;margin-left:auto;width:48px;height:48px;flex-direction:column;justify-content:center;gap:6px;align-items:center}
.tsp .tsp-menu-boton span{display:block;width:26px;height:2px;background:#fff;transition:transform .2s}

/* Botones */
.tsp .tsp-boton{display:inline-flex;align-items:center;justify-content:center;gap:clamp(12px,1.4vw,22px);min-height:clamp(46px,3.7vw,62px);padding:clamp(10px,1vw,16px) clamp(18px,1.9vw,32px);background:var(--boton-fondo);border:1px solid var(--boton-borde);color:#14100a!important;font:500 clamp(13px,1.2vw,20px)/1.15 var(--cuerpo);letter-spacing:.005em;text-transform:uppercase;text-align:center;border-radius:0;transition:filter .2s}
.tsp .tsp-boton:hover,.tsp .tsp-boton:focus{filter:brightness(1.1);background:var(--boton-fondo);color:#14100a}
.tsp .tsp-boton .tsp-icono{width:1.35em;height:1.35em}
.tsp-flecha{display:inline-flex}
.tsp .tsp-boton-cabecera{min-height:0;padding:clamp(9px,.9vw,14px) clamp(14px,1.5vw,26px);font-size:clamp(11.5px,.97vw,15.5px);font-weight:500}
.tsp .tsp-boton-grande{font-size:clamp(14px,1.25vw,20px);padding:clamp(12px,1.2vw,18px) clamp(20px,2.4vw,40px)}
.tsp-botones{display:flex;flex-wrap:wrap;gap:clamp(10px,1vw,16px);margin-top:clamp(20px,2.2vw,36px)}

/* Tipografía */
.tsp-eyebrow{color:var(--eyebrow);font:500 clamp(11px,.95vw,16px)/1.3 var(--cuerpo);letter-spacing:.3em;text-transform:uppercase;margin:0 0 clamp(10px,1.2vw,20px)}
.tsp-titular{font:var(--peso-titulo) clamp(32px,4.3vw,76px)/.96 var(--titulo);text-transform:uppercase;letter-spacing:-.02em;color:#fff}
.tsp-titular span{display:block}
.tsp-oro{color:var(--oro)}
.tsp-slide-a .tsp-titular .tsp-oro{letter-spacing:.01em}
/* D-PERF-358 (W99r en-390): con el interletraje de -.02em las palabras del titular del hero salían pegadas («BUILTTO GO»): hueco 0,15 em frente a 0,2 em del resto; +.08 em de espacio entre palabras (≥0,2 em), solo en móvil (≤560: ahí se mide el titular; 1440/1920 no cambian, puente 1802). */
@media (max-width:560px){.tsp-slide-a .tsp-titular{word-spacing:.08em}}
.tsp-intro{max-width:34em;margin-top:clamp(14px,1.5vw,24px);font-size:clamp(15px,1.2vw,20px);line-height:1.38;color:#fff}
.tsp-slide-texto .tsp-titular::after,.tsp-etapa-texto .tsp-titular::after,.tsp-hero-texto .tsp-titular::after,.tsp-range-cab .tsp-titular::after,.tsp-ad-texto .tsp-titular::after{content:"";display:block;width:clamp(44px,4.2vw,74px);height:2px;background:var(--amarillo);margin-top:clamp(12px,1.4vw,24px)}
.tsp-tag{margin-top:clamp(14px,1.5vw,24px);font:400 clamp(11px,.95vw,16px)/1.6 var(--cuerpo);letter-spacing:.34em;text-transform:uppercase;color:#fff}
.tsp-tag-menor{font-size:clamp(11px,.8vw,13px)}
.tsp-sub{margin-top:14px;font:500 clamp(11px,.9vw,14px)/1.5 var(--cuerpo);letter-spacing:.3em;text-transform:uppercase}
.tsp-lateral{position:absolute;right:var(--lado);top:clamp(20px,3vw,48px);z-index:2;max-width:13em;font:400 clamp(11px,.95vw,16px)/1.45 var(--cuerpo);letter-spacing:.02em;text-transform:uppercase;color:#fff;text-shadow:0 1px 8px #000}
.tsp-lateral::after{content:"";display:block;width:clamp(30px,3vw,52px);height:2px;background:var(--oro);margin-top:clamp(10px,1.1vw,16px)}
.tsp-lateral-alto{right:auto;left:clamp(46%,52vw,56%);top:clamp(16px,2.4vw,40px);transform:rotate(-7deg);transform-origin:left;letter-spacing:.14em;border-left:1px solid rgba(255,255,255,.5);padding-left:14px}
.tsp-lateral-alto::after{display:none}

/* Pantallas con foto de fondo: inicio (3 diapositivas), Dubái, viaje, configurador, venta, prensa y contacto */
.tsp-slide,.tsp-hero-dubai,.tsp-prensa,.tsp-contacto{position:relative;display:flex;align-items:center;isolation:isolate;overflow:hidden}
.tsp-slide picture,.tsp-hero-dubai>picture,.tsp-prensa>picture,.tsp-contacto>picture{position:absolute;inset:0;z-index:-2;display:block}
.tsp-fondo{width:100%;height:100%;object-fit:cover}
.tsp-slide::before,.tsp-hero-dubai::before,.tsp-prensa::before,.tsp-contacto::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(0,0,0,.86) 0,rgba(0,0,0,.55) 34%,rgba(0,0,0,0) 62%)}
.tsp-slide{min-height:clamp(560px,47vw,820px);flex-direction:column;align-items:flex-start;justify-content:space-between}
.tsp-slide>.tsp-slide-texto{margin-block:auto}
.tsp-slide-texto{position:relative;width:min(100%,62%);padding:clamp(28px,4vw,70px) var(--lado)}
.tsp-slide-a .tsp-titular{font-size:clamp(34px,4.05vw,74px)}
.tsp-slide-a .tsp-intro{max-width:27em}
.tsp-slide-a picture{inset:0 0 0 auto;width:76%;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 30%);mask-image:linear-gradient(90deg,transparent 0,#000 30%)}
.tsp-slide-a .tsp-fondo{object-position:25% 50%}
.tsp-slide-a::before{background:linear-gradient(90deg,rgba(0,0,0,.55) 0,rgba(0,0,0,.2) 40%,rgba(0,0,0,0) 62%)}
.tsp-slide-b{align-items:flex-end}
.tsp-slide-b picture{inset:0 auto 0 0;width:70%;-webkit-mask-image:linear-gradient(270deg,transparent 0,#000 36%);mask-image:linear-gradient(270deg,transparent 0,#000 36%)}
.tsp-slide-b .tsp-intro{font-size:clamp(15px,1.4vw,24px);max-width:26em}
.tsp-slide-b::before{background:linear-gradient(270deg,#000 3%,rgba(0,0,0,.7) 24%,rgba(0,0,0,0) 48%)}
.tsp-slide-b .tsp-slide-texto{width:min(100%,44%);padding-left:0}
.tsp-slide-b .tsp-fondo{object-position:left center}
.tsp-slide-b .tsp-titular{font-size:clamp(34px,4.5vw,80px)}
.tsp-slide-c .tsp-fondo{object-position:center 60%}
.tsp-slide-c .tsp-slide-texto{width:100%}
.tsp-slide-c .tsp-intro{max-width:25em}
.tsp-iconos3{display:flex;margin-top:clamp(18px,2vw,32px)}
.tsp-iconos3 li{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;padding:0 clamp(8px,1.4vw,26px);font:400 clamp(11px,.95vw,16px)/1.2 var(--cuerpo);text-transform:uppercase;text-align:center}
.tsp-iconos3 li+li{border-left:2px solid var(--amarillo)}
.tsp-iconos3 .tsp-icono{width:clamp(30px,2.9vw,50px);height:clamp(30px,2.9vw,50px);color:var(--amarillo)}
.tsp-pasos{display:flex;flex-wrap:nowrap;align-items:center;width:min(100%,86%);margin-top:clamp(20px,2.4vw,40px)}
.tsp-pasos li{display:flex;align-items:center;gap:clamp(8px,.9vw,14px);font:400 clamp(11px,1.05vw,18px)/1 var(--cuerpo);text-transform:uppercase;white-space:nowrap}
.tsp-pasos li:not(:last-child){flex:1}
.tsp-pasos li:not(:last-child)::after{content:"";flex:1;min-width:10px;height:2px;background:var(--amarillo);margin:0 clamp(6px,1vw,18px)}

.tsp-pasos b{display:grid;place-items:center;flex:none;width:clamp(30px,2.8vw,48px);aspect-ratio:1;border:2px solid var(--amarillo);border-radius:50%;color:var(--amarillo);font-weight:400}

/* Franja de ventajas y destinos (diapositivas 1 a 10) */
.tsp-ventajas{display:flex;align-items:center;justify-content:space-between;gap:20px 30px;flex-wrap:wrap;padding:clamp(14px,1.6vw,26px) var(--lado);background:#000;border-top:1px solid color-mix(in srgb,var(--amarillo) 20%,transparent)}
.tsp-ventajas ul{display:flex;flex-wrap:wrap;gap:14px 0}
.tsp-ventajas li{display:flex;align-items:center;gap:clamp(8px,.9vw,14px);padding:0 clamp(12px,1.6vw,26px);font:400 clamp(11px,.9vw,15px)/1.25 var(--cuerpo);text-transform:uppercase}
.tsp-ventajas li:first-child{padding-left:0}
.tsp-ventajas li+li{border-left:1px solid var(--separador-apagado)}
.tsp-ventajas .tsp-icono{color:var(--amarillo);width:clamp(30px,2.6vw,44px);height:clamp(30px,2.6vw,44px)}
.tsp-destinos{display:flex;align-items:center;font:400 clamp(11px,.95vw,16px)/1 var(--cuerpo);text-transform:uppercase;padding-left:clamp(14px,2vw,34px);border-left:3px solid var(--amarillo)}
.tsp-destinos span+span::before{content:"/";color:var(--amarillo);margin:0 clamp(8px,1vw,16px)}

/* Pie: franja con el lema */
.tsp-pie{display:grid;grid-template-columns:1.15fr 1fr;align-items:center;gap:10px clamp(16px,3vw,60px);padding:clamp(22px,2.6vw,40px) var(--lado) 10px;border-top:2px solid var(--amarillo);background:#000}
.tsp-p-dubai .tsp-pie,.tsp-p-config .tsp-pie,.tsp-p-galeria .tsp-pie,.tsp-p-venta4 .tsp-pie,.tsp-p-venta2 .tsp-pie,.tsp-p-prensa .tsp-pie,.tsp-p-contacto .tsp-pie{border-top-width:1px;border-top-color:var(--oro)}
.tsp-pie-lema,.tsp-pie-der{display:flex;align-items:center;gap:clamp(12px,1.6vw,26px);font:400 clamp(11px,.95vw,16px)/1.6 var(--cuerpo);text-transform:uppercase;white-space:nowrap}
.tsp-pie-lema{justify-content:center;color:var(--amarillo);letter-spacing:.5em}
.tsp-p-dubai .tsp-pie-lema,.tsp-p-config .tsp-pie-lema,.tsp-p-galeria .tsp-pie-lema,.tsp-p-venta4 .tsp-pie-lema,.tsp-p-venta2 .tsp-pie-lema,.tsp-p-prensa .tsp-pie-lema,.tsp-p-contacto .tsp-pie-lema{color:var(--oro)}
.tsp-pie-lema span,.tsp-pie-der span{flex:1;min-width:20px;height:1px;background:currentColor;opacity:.9}
.tsp-pie-der{letter-spacing:.3em;color:#fff}
.tsp-pie-der span{color:var(--oro)}
.tsp-pie-lema img{height:1.9em;width:auto}
.tsp-pie-legal{grid-column:1/-1;margin-top:clamp(8px,1vw,16px);padding-bottom:12px;font-size:12px;color:#b9b9b9;text-align:center}
.tsp-pie-legal a:hover{color:var(--amarillo)}
/* Cada «·» va pegado al enlace que le sigue: al partir la línea nunca se queda colgando al final (D-PERF-012). */
.tsp-pie-legal span{white-space:nowrap}
.tsp-pie-legal a{display:inline-block;padding:5px 0;margin:-5px 0;text-decoration:underline;text-underline-offset:2px}
.tsp .tsp-pie-legal a,.tsp .tsp-volver a,.tsp .tsp-consentimiento a{font:inherit;letter-spacing:inherit;text-transform:inherit}
.tsp .tsp-consentimiento a{text-decoration:underline}

/* La marca: seis diapositivas seguidas */
.tsp-etapa{position:relative;display:grid;grid-template-columns:minmax(0,34%) minmax(0,1fr) clamp(110px,10.5vw,190px);grid-template-rows:auto auto;column-gap:clamp(14px,2.4vw,40px);padding:clamp(28px,3.4vw,56px) var(--lado) clamp(24px,2.6vw,42px);background:#000;border-top:1px solid color-mix(in srgb,var(--amarillo) 14%,transparent)}
.tsp-etapa-texto{grid-column:1;grid-row:1;position:relative;z-index:2;padding-top:clamp(16px,2.6vw,46px)}
.tsp-etapa-texto .tsp-titular{font-size:clamp(34px,4.35vw,78px)}
.tsp-etapa-texto .tsp-titular span{white-space:nowrap}
.tsp-etapa-foto{grid-column:2;grid-row:1;position:relative}
.tsp-etapa-foto img{width:100%;height:auto;aspect-ratio:2.2/1;object-fit:cover}
.tsp-etiqueta-foto{position:absolute;left:0;top:calc(-1 * clamp(26px,2.4vw,40px));z-index:2;padding:6px 20px;background:var(--boton-fondo);border:1px solid var(--boton-borde);color:#14100a;font:500 clamp(11px,1vw,17px)/1.2 var(--cuerpo);text-transform:uppercase}
.tsp-etapa-cards{grid-row:2;grid-column:1/3;display:grid;gap:clamp(6px,.8vw,12px);margin:clamp(14px,1.4vw,22px) 0 0 clamp(0px,17vw,300px)}
.tsp-etapa-cards li{border:1px solid var(--borde-oro);background:#000;padding:0 3px 3px}
.tsp-etapa-cards p{padding:clamp(8px,1vw,16px) 4px clamp(8px,.9vw,12px);font:400 clamp(11px,1vw,17px)/1.1 var(--cuerpo);text-transform:uppercase;text-align:center;position:relative}
.tsp-etapa-cards p::after{content:"";display:block;width:clamp(20px,2vw,32px);height:2px;background:var(--oro);margin:clamp(6px,.6vw,9px) auto 0}
.tsp-etapa-cards img{width:100%;aspect-ratio:1/1.05;object-fit:cover}
.tsp-etapa-cards-3{grid-column:2;margin-left:0}
.tsp-etapa-cards-3 li{padding:0;border:0}
.tsp-etapa-cards-3{grid-template-columns:repeat(3,1fr)}
.tsp-etapa-cards-3 img{aspect-ratio:1.14/1}
/* D-PERF-310/312 (diapositiva 4): la 3.ª miniatura de la etapa 01 enseña el volante, que está a la izquierda de la foto (centrada salía la pantalla) */
.tsp-etapa-cards-3 li:nth-child(3) img{object-position:0 50%}
.tsp-etapa-cards-4{grid-template-columns:repeat(4,1fr)}
.tsp-etapa-cards-6{grid-template-columns:repeat(6,1fr)}
.tsp-etapas{grid-column:3;grid-row:1/3;position:relative;justify-self:end;align-self:start;display:flex;flex-direction:column;gap:clamp(20px,2.8vw,48px);margin-top:clamp(0px,.4vw,8px)}
.tsp-etapas::before{content:"";position:absolute;left:clamp(16px,1.2vw,21px);top:-20px;bottom:0;width:2px;background:rgba(255,255,255,.35)}
.tsp-etapas a{position:relative;display:flex;align-items:center;gap:clamp(10px,1vw,16px);font:400 clamp(11px,.95vw,16px)/1 var(--cuerpo);text-transform:uppercase;color:#fff}
.tsp-etapas b{display:grid;place-items:center;flex:none;width:clamp(34px,2.5vw,44px);aspect-ratio:1;background:#000;border:2px solid #fff;border-radius:50%;font-weight:400;font-size:clamp(12px,.95vw,16px)}
.tsp-etapas li:first-child::before{content:none}

.tsp-etapas .tsp-etapa-activa a,.tsp-etapas a:hover{color:var(--amarillo)}
.tsp-etapas .tsp-etapa-activa b,.tsp-etapas a:hover b{border-color:var(--amarillo);color:var(--amarillo)}
.tsp-checks{display:grid;grid-template-columns:repeat(3,auto);justify-content:start;gap:clamp(14px,1.6vw,26px) clamp(16px,2.6vw,48px);margin-top:clamp(18px,2vw,34px)}
.tsp-checks li{display:flex;align-items:center;gap:clamp(8px,.9vw,14px);font:400 clamp(12px,1.05vw,18px)/1 var(--cuerpo);text-transform:uppercase}
.tsp-checks .tsp-icono{width:clamp(30px,2.8vw,46px);height:clamp(30px,2.8vw,46px);color:var(--amarillo)}

/* Antes y después (diapositiva 9) */
.tsp-antes-despues{position:relative;display:grid;min-height:max(clamp(620px,54vw,880px),41vw);isolation:isolate;overflow:hidden;--v:.63;border-top:1px solid color-mix(in srgb,var(--amarillo) 14%,transparent)}
.tsp-ad-comparador{position:absolute;inset:0;z-index:-1}
.tsp-ad-comparador picture,.tsp-ad-comparador img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.tsp-ad-despues{position:absolute;inset:0;clip-path:inset(0 0 0 calc(26px + (100% - 52px) * var(--v)))}
.tsp-ad-despues::before{content:"";position:absolute;top:0;bottom:0;left:calc(26px + (100% - 52px) * var(--v));width:3px;margin-left:-1px;background:var(--amarillo);z-index:2}
.tsp-antes-despues::before{content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(90deg,rgba(0,0,0,.88) 0,rgba(0,0,0,.6) 30%,rgba(0,0,0,0) 56%);pointer-events:none}
.tsp-ad-etiqueta{position:absolute;top:clamp(18px,2vw,34px);padding:6px clamp(14px,1.8vw,30px);font:500 clamp(14px,1.45vw,24px)/1.2 var(--cuerpo);text-transform:uppercase;z-index:3}
.tsp-ad-e-antes{left:38%;background:#000;color:#fff}
.tsp-ad-e-despues{right:3%;background:var(--oro);color:#14100a}
.tsp-ad-asa{position:absolute;top:42%;left:calc(26px + (100% - 52px) * var(--v));z-index:3;display:grid;place-items:center;width:52px;height:52px;margin:-26px 0 0 -26px;border:3px solid var(--amarillo);border-radius:50%;background:rgba(0,0,0,.65);color:#fff;pointer-events:none}
.tsp-ad-asa svg{width:26px;height:26px}
.tsp-ad-control{position:absolute;left:0;top:42%;z-index:4;width:100%;height:60px;margin:-30px 0 0;-webkit-appearance:none;appearance:none;background:transparent;cursor:ew-resize}
.tsp-ad-control::-webkit-slider-runnable-track{height:60px;background:transparent}
.tsp-ad-control::-moz-range-track{height:60px;background:transparent}
.tsp-ad-control::-webkit-slider-thumb{-webkit-appearance:none;width:52px;height:60px;border-radius:50%;background:transparent;border:0}
.tsp-ad-control::-moz-range-thumb{width:52px;height:60px;border-radius:50%;background:transparent;border:0}
.tsp-ad-control:focus-visible{outline:none}
.tsp-ad-control:focus-visible~.tsp-ad-asa,.tsp-ad-comparador:has(.tsp-ad-control:focus-visible) .tsp-ad-asa{box-shadow:0 0 0 4px #000,0 0 0 7px var(--amarillo)}
.tsp-ad-texto{position:relative;z-index:5;align-self:center;max-width:min(36%,960px);padding:clamp(34px,4vw,70px) 0 clamp(190px,16vw,260px) var(--lado);pointer-events:none}
.tsp-ad-texto>*{pointer-events:auto}
.tsp-ad-texto .tsp-titular{font-size:clamp(30px,3.5vw,110px)}
.tsp-ad-texto .tsp-titular span:first-child{color:#fff}
.tsp-ad-texto .tsp-titular .tsp-oro{color:var(--oro);margin-top:.12em}
/* «ORIGINAL A» (W7, como la D-PERF-358): con el interletraje de -.02em se leía «ORIGINALA» (hueco 0,16 em); +.08 em entre palabras (≥0,2 em). */
.tsp-ad-texto .tsp-titular{word-spacing:.08em}
.tsp-ad-features{position:absolute;left:24%;right:22%;bottom:clamp(86px,7.6vw,130px);z-index:5;display:flex;justify-content:space-between;gap:12px}
.tsp-ad-features li{display:flex;align-items:center;gap:clamp(6px,.7vw,12px);font:400 clamp(11px,.98vw,26px)/1.15 var(--cuerpo);text-transform:uppercase;text-shadow:0 1px 6px #000}
.tsp-ad-features li+li{padding-left:clamp(10px,1.4vw,24px);border-left:1px solid color-mix(in srgb,var(--amarillo) 80%,transparent)}
/* D-PERF-346 (V7 262): de 1200 a 1439 las ventajas de «Antes · Después» quedaban a 5 px de la fila de ventajas (a 1440, 27): la fila de iconos sube a 108 px del borde (≥12 px de aire) */
@media (min-width:1200px) and (max-width:1439.98px){
  .tsp-ad-features{bottom:max(108px,7.6vw)}
}
.tsp-ad-features .tsp-icono{color:var(--amarillo);width:clamp(28px,2.6vw,66px);height:clamp(28px,2.6vw,66px)}
.tsp-ad-asiento{position:absolute;right:3%;bottom:clamp(92px,8vw,136px);z-index:5;width:clamp(120px,15.6vw,400px);border:2px solid var(--amarillo)}
.tsp-ad-asiento img{width:100%;height:auto;aspect-ratio:1/.72;object-fit:cover}
/* D-PERF-149/150 (diapositiva 9): las fotos «antes» y «después» con su medida de la diapositiva (desde x 29,2 %, 0,7vw por encima de la
   sección: a 1440 desde x 420, por correlación con los originales; 972 de ancho en la diapositiva, aquí hasta el borde, 1020, para no dejar franja negra), la «antes» fundida por la izquierda: el coche queda a la
   derecha del texto y no ampliado (antes, a toda la sección, la parrilla caía bajo el párrafo). El recuadro del interior, 224×190 a 1440 y a
   16 px del borde (antes 221×159 y a 45). */
@media (min-width:901px){
  .tsp-ad-comparador img.tsp-ad-antes,.tsp-ad-despues img{inset:auto;left:29.2vw;top:-.7vw;width:70.8vw;height:auto;object-fit:fill}
  .tsp-ad-comparador img.tsp-ad-antes{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 12%);mask-image:linear-gradient(90deg,transparent 0,#000 12%)}
  .tsp-ad-asiento{right:1.1vw}
  .tsp-ad-asiento img{aspect-ratio:1/.85}
}

/* La gama (diapositiva 10) */
.tsp-range{padding:clamp(18px,2vw,34px) clamp(14px,1.6vw,26px) clamp(14px,1.6vw,26px)}
.tsp-range-cab{padding:0 calc(var(--lado) - clamp(14px,1.6vw,26px)) clamp(12px,1.2vw,20px)}
.tsp-range-cab .tsp-titular{font-size:clamp(32px,3.6vw,62px)}
.tsp-range-cab .tsp-titular span:first-child{color:#fff}
.tsp-range-cab .tsp-intro{max-width:none;margin-top:clamp(10px,1vw,16px);font-size:clamp(14px,1.15vw,19px)}
.tsp-modelos{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(8px,.9vw,14px)}
.tsp-modelo{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:clamp(400px,29.5vw,540px);border:1px solid var(--borde-oro);overflow:hidden;isolation:isolate}
.tsp-modelo picture,.tsp-modelo>img{position:absolute;inset:0 0 auto 0;z-index:-2;display:block;width:100%}
.tsp-modelo img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}
.tsp-modelo::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(0,0,0,0) 36%,rgba(0,0,0,.92) 62%,#000 78%)}
.tsp-modelo-pie{display:flex;flex-direction:column;align-items:center;gap:clamp(8px,.9vw,14px);padding:0 clamp(14px,2vw,32px) clamp(16px,1.6vw,26px);text-align:center}
.tsp-modelo h2{font:var(--peso-titulo) clamp(30px,3.2vw,56px)/1 var(--titulo);text-transform:uppercase;letter-spacing:-.01em}
.tsp-modelo h2::after{content:"";display:block;width:clamp(30px,3vw,52px);height:2px;background:var(--amarillo);margin:clamp(6px,.6vw,10px) auto 0}
.tsp-modelo-lema{font:400 clamp(13px,1.3vw,22px)/1.2 var(--cuerpo);text-transform:uppercase}
.tsp-modelo .tsp-boton{margin-top:clamp(8px,1.2vw,22px);min-width:min(100%,20em)}

/* Dubái y logística (diapositivas 11 y 12), configurador (13), venta (14) */
.tsp-hero-dubai{min-height:clamp(420px,28.5vw,540px)}
.tsp-hero-dubai .tsp-slide-texto{width:min(100%,48%);padding-top:clamp(34px,4vw,72px);padding-bottom:clamp(34px,4vw,72px)}
.tsp-hero-dubai .tsp-titular{font-size:clamp(32px,3.9vw,70px)}
.tsp-hero-dubai .tsp-titular-menor{font-size:.56em;line-height:1.04;margin-top:.14em}
.tsp-hero-dubai .tsp-intro{font-size:clamp(14px,1.1vw,18px);max-width:26em}
.tsp-hero-dubai>picture{inset:0 0 0 auto;width:76%;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 30%);mask-image:linear-gradient(90deg,transparent 0,#000 30%)}
.tsp-hero-dubai::before{background:linear-gradient(90deg,rgba(0,0,0,.55) 0,rgba(0,0,0,.2) 40%,rgba(0,0,0,0) 62%)}
.tsp-hero-dubai .tsp-fondo{object-position:center 60%}
.tsp-hero-viaje{min-height:clamp(520px,34vw,640px);align-items:flex-start}
.tsp-hero-viaje .tsp-slide-texto{width:min(100%,42%)}
.tsp-hero-viaje .tsp-titular{font-size:clamp(36px,4.8vw,86px)}
.tsp-hero-viaje .tsp-fondo{object-position:center 45%}
.tsp-hero-viaje .tsp-tag{margin-top:clamp(10px,1.2vw,20px)}
.tsp-viaje{position:absolute;left:var(--lado);right:var(--lado);bottom:clamp(14px,2vw,34px);display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
.tsp-viaje li{display:flex;align-items:center;gap:clamp(8px,.9vw,14px);position:relative}
.tsp-viaje li:not(:last-child)::after{content:"→";color:var(--amarillo);font-size:clamp(16px,1.5vw,24px);margin-left:auto;padding-right:6px}
.tsp-viaje .tsp-icono{width:clamp(48px,4.7vw,80px);height:clamp(48px,4.7vw,80px);padding:clamp(11px,1.1vw,18px);border:2px solid var(--amarillo);border-radius:50%;color:var(--amarillo);background:rgba(0,0,0,.4)}
.tsp-viaje span{display:flex;flex-direction:column;gap:2px}
.tsp-viaje i{font:400 clamp(11px,.9vw,15px)/1 var(--cuerpo);font-style:normal;color:var(--amarillo)}
.tsp-viaje b{font:400 clamp(13px,1.15vw,19px)/1.1 var(--cuerpo);text-transform:uppercase}
.tsp-viaje small{font:300 clamp(11px,.95vw,16px)/1.2 var(--cuerpo)}
.tsp-cols{display:grid;gap:0;padding:clamp(14px,1.6vw,26px) clamp(14px,1.6vw,26px) clamp(16px,1.6vw,26px);background:#000}
.tsp-cols-4{grid-template-columns:repeat(4,1fr)}
.tsp-cols-9{grid-template-columns:repeat(9,1fr);padding-top:clamp(14px,1.6vw,26px)}
.tsp-cols li{padding:0 clamp(8px,1.4vw,24px)}
.tsp-cols li+li{border-left:1px solid var(--oro)}
.tsp-cols h2{display:flex;align-items:baseline;gap:clamp(8px,.9vw,14px);margin-bottom:clamp(8px,.9vw,14px);font:400 clamp(13px,1.35vw,23px)/1.1 var(--cuerpo);text-transform:uppercase}
.tsp-cols h2 b{font:var(--peso-titulo) clamp(26px,2.9vw,50px)/1 var(--titulo);color:var(--oro)}
.tsp-cols img{width:100%;aspect-ratio:2.1/1;object-fit:cover}
.tsp-cols p{margin-top:clamp(8px,.9vw,14px);font:400 clamp(12px,1.02vw,17px)/1.3 var(--cuerpo)}
.tsp-cols-9{gap:0}
.tsp-cols-9 li{padding:0 clamp(5px,.7vw,12px)}
.tsp-cols-9 h2{flex-direction:column;align-items:flex-start;gap:2px;font-size:clamp(11px,1.05vw,17px)}
.tsp-cols-9 h2 b{font-size:clamp(24px,2.5vw,42px)}
.tsp-cols-9 img{aspect-ratio:1/.9}
.tsp-cols-9 p{font-size:clamp(11.5px,1.05vw,17px);position:relative;padding-bottom:12px}
.tsp-cols-9 p::after{content:"";display:block;width:26px;height:2px;background:var(--oro);margin-top:10px}
.tsp-cols-logistica li{padding-top:clamp(6px,.8vw,12px)}
.tsp-cols-logistica img{aspect-ratio:2.7/1}
.tsp-cols-logistica h2{margin:clamp(8px,.9vw,14px) 0 0;color:var(--oro);font-weight:600;font-size:clamp(14px,1.45vw,24px)}
.tsp-cols-logistica .tsp-cols-sub{margin-top:4px;font:400 clamp(11px,.9vw,15px)/1.3 var(--cuerpo);letter-spacing:.3em;text-transform:uppercase}
.tsp-cols-logistica .tsp-cols-sub+p{margin-top:clamp(6px,.7vw,12px)}
.tsp-acciones{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:clamp(10px,1.2vw,22px) clamp(14px,2vw,34px);padding:clamp(18px,2.2vw,38px) var(--lado) clamp(24px,2.6vw,44px)}
.tsp-acciones .tsp-boton{gap:clamp(10px,1vw,16px)}
.tsp-acciones-nota{max-width:23em;padding-left:clamp(14px,1.8vw,30px);border-left:2px solid var(--oro);font:400 clamp(11px,.95vw,15px)/1.8 var(--cuerpo);letter-spacing:.26em;text-transform:uppercase}
.tsp-hero-config{min-height:clamp(380px,25vw,460px)}
.tsp-hero-config .tsp-fondo{object-position:center 62%}
.tsp-hero-config .tsp-slide-texto{width:min(100%,56%)}
.tsp-hero-config .tsp-titular{font-size:clamp(32px,4.6vw,118px)}
/* D-PERF-213 / 074 (diapositiva 13): sin la raya dorada bajo el titular ni bajo el lateral, el lateral pegado a la derecha, botón de cabecera naranja plano y línea a los dos lados del lema del pie */
.tsp-hero-config .tsp-titular::after,.tsp-hero-config .tsp-lateral::after{display:none}
.tsp-hero-config .tsp-lateral{right:2.2vw}
.tsp-p-config .tsp-boton-cabecera,.tsp-p-config .tsp-boton-cabecera:hover,.tsp-p-config .tsp-boton-cabecera:focus{background:#fbac45}
@media (min-width:901px){.tsp-p-config .tsp-acciones .tsp-boton-grande{padding:1.04vw 2.5vw}.tsp-p-config .tsp-acciones-nota{max-width:27em}}
/* D-PERF-073: botones de 325×54 y 357×54 y nota en 3 líneas, como la diapositiva 13 a 1440 */
@media (min-width:901px){.tsp-p-config .tsp-pie-der::before{content:"";flex:1;min-width:20px;height:1px;background:currentColor;opacity:.9}}
.tsp-hero-venta{min-height:clamp(440px,33vw,600px)}
.tsp-hero-venta .tsp-fondo{object-position:center 82%}
.tsp-hero-venta .tsp-titular{font-size:clamp(36px,4.5vw,80px)}
.tsp-hero-venta .tsp-slide-texto{width:min(100%,56%)}
@media(min-width:900px){.tsp-hero-venta .tsp-slide-texto{padding-bottom:calc(clamp(34px,4vw,72px) + 3vw)}}
.tsp-hero-venta .tsp-titular span{white-space:nowrap}
.tsp-hero-venta .tsp-titular .tsp-oro{background:linear-gradient(180deg,var(--venta-oro-alto),var(--venta-oro-bajo));-webkit-background-clip:text;background-clip:text;color:transparent}
.tsp-vehiculos{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(10px,1.2vw,20px);padding:clamp(14px,1.6vw,26px) clamp(14px,1.6vw,26px) clamp(16px,1.8vw,30px);background:#000;border-top:1px solid var(--borde-oro)}
.tsp-vehiculos li{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--borde-oro);background:#000}
.tsp-vehiculos picture,.tsp-vehiculos img{display:block;width:100%;height:100%;object-fit:cover}
.tsp-vehiculo-datos{display:flex;flex-direction:column;justify-content:center;gap:clamp(10px,1.2vw,20px);padding:clamp(12px,1.6vw,28px)}
.tsp-vehiculo-datos h2{font:800 clamp(16px,1.55vw,28px)/1.15 var(--titulo);text-transform:uppercase;letter-spacing:-.01em}
/* D-PERF-075/167/254/260: en la diapositiva 14 no hay raya bajo «ELIGE TU ICONO. HAZLO TUYO.» ni bajo «ADVENTURE · N PUERTAS». */
.tsp-hero-venta .tsp-titular::after{display:none}
/* D-PERF-093/161/231/246/276/281: a ≥901 px el texto del héroe de Venta crece con el ancho como en la diapositiva 14 (titular 4,5vw sin tope:
   86 px a 1920; entradilla 1,53vw = 22 px a 1440, en sus 3 líneas «…Jeep Wrangler / …conoce / sus detalles…»; antetítulo 1,34vw); antes se quedaban
   en 80/18/16 px desde 1920 y la entradilla a 0,23 del titular. */
@media (min-width:901px){
  .tsp-hero-venta .tsp-titular{font-size:4.5vw}
  .tsp-hero-venta .tsp-slide-texto .tsp-intro{font-size:1.53vw;line-height:1.14;max-width:32vw}   /* con .tsp-slide-texto: desde 1301 el 25,5em de «.tsp-slide-texto .tsp-intro» ganaba (562 px a 1440, «sus detalles» subía a la 2.ª línea) */
  .tsp-hero-venta .tsp-eyebrow{font-size:1.34vw}
}
.tsp-vehiculo-datos p{font:400 clamp(14px,1.3vw,22px)/1.2 var(--cuerpo)}
/* D-PERF-077/094/095/160/166/258/282 (diapositiva 14): a ≥901 px cada tarjeta mide 11,7vw de alto (168 a 1440, 225 a 1920; mínimo 160 para que quepa
   el texto entre 901 y 1367) con la foto al 54 % y apaisada (≈2,2:1, recortada sin estirar), y en Venta la franja del pie entra en la pantalla
   (lema del pie ≤810 a 1440×810; la página cabe en 1920×1080). De 561 a 900, las dos fotos a 3:2: las dos tarjetas, iguales. */
@media (min-width:901px){
  .tsp-vehiculos li{grid-template-columns:54% 1fr;grid-template-rows:minmax(0,1fr);height:max(160px,11.7vw)}
  .tsp-vehiculos picture{min-height:0;overflow:hidden}
  .tsp-vehiculo-datos{gap:.7vw;padding:.9vw 1.6vw}
  .tsp-vehiculo-datos p{font-size:clamp(13px,1.18vw,22px)}
  .tsp-vehiculo-datos .tsp-boton{min-height:max(40px,2.9vw);padding-block:0}
  .tsp-p-galeria .tsp-vehiculos{padding:.6vw 1.6vw .3vw}  /* menos aire: desde 1700 la cabecera mide 5,3vw (D-PERF-286) y a 1920×1080 la página medía 1091 */
  .tsp-p-galeria .tsp-pie{padding-top:.7vw}
  .tsp-p-galeria .tsp-pie-legal{margin-top:.3vw;padding-bottom:.4vw}
}
@media (min-width:561px) and (max-width:900px){.tsp-vehiculos img{aspect-ratio:3/2}}

/* Cada vehículo en venta */
.tsp-vehiculo{display:grid;grid-template-columns:minmax(0,1fr) clamp(300px,27vw,470px);gap:clamp(16px,2.2vw,40px);padding:clamp(26px,3.2vw,56px) var(--lado) clamp(20px,2.2vw,36px);background:#000 radial-gradient(120% 60% at 40% 0,#3b2a1b 0,#000 70%)}
.tsp-titular-vehiculo{font-size:clamp(32px,4.6vw,84px)}
.tsp-titular-vehiculo span{display:inline-block;margin-right:.2em}
.tsp-precio-caja{padding:.05em .28em;border:2px solid var(--oro);font:var(--peso-titulo) .56em/1.2 var(--titulo);color:var(--oro);vertical-align:.18em;letter-spacing:0}
.tsp-datos{display:flex;flex-wrap:wrap;gap:4px 0;padding-left:0;margin-top:clamp(10px,1.2vw,18px);color:var(--oro);font:400 clamp(14px,1.35vw,22px)/1.3 var(--cuerpo)}
.tsp-datos span:not(:last-child)::after{content:"•";margin:0 .7em}
.tsp-vehiculo-info .tsp-intro{max-width:40em}
.tsp-vehiculo-foto{margin-top:clamp(14px,1.6vw,26px);border:1px solid var(--borde-oro)}
.tsp-vehiculo-foto img{width:100%;height:auto;aspect-ratio:1.8/1;object-fit:cover}
.tsp-vehiculo-botones{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr));gap:clamp(8px,.9vw,14px);margin-top:clamp(10px,1.1vw,18px)}
.tsp-vehiculo-botones .tsp-boton{min-height:clamp(52px,4.4vw,72px);justify-content:flex-start;gap:clamp(10px,1vw,18px);text-align:left}
.tsp-vehiculo-botones .tsp-icono{width:clamp(28px,2.4vw,40px);height:clamp(28px,2.4vw,40px)}
.tsp-anuncios{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin-top:clamp(10px,1.1vw,18px);font:400 clamp(14px,1.3vw,22px)/1 var(--cuerpo);text-transform:uppercase;color:var(--oro)}
.tsp-anuncios a{display:inline-flex;align-items:center;gap:10px;padding:10px 20px;border:1px solid var(--borde-oro);color:#fff;text-transform:none;font-weight:500}
.tsp-vehiculo-form{align-self:start;border:2px solid var(--borde-oro);background:rgba(0,0,0,.92);padding:clamp(16px,1.8vw,30px)}
.tsp-vehiculo-form .tsp-titular{font-size:clamp(24px,2.5vw,42px);line-height:1}
.tsp-vehiculo-form .tsp-titular>span>span{display:inline}
.tsp-vehiculo-form .tsp-intro{font-size:clamp(14px,1.1vw,18px);margin-top:10px}
.tsp-obligatorios{margin-top:12px;font-size:13px}
.tsp-tecnica{padding:clamp(24px,3vw,52px) var(--lado);background:#000;border-top:1px solid var(--borde-oro)}
.tsp-tecnica .tsp-titular,.tsp-fotos .tsp-titular{font-size:clamp(26px,3vw,50px)}
.tsp-tecnica .tsp-titular span,.tsp-fotos .tsp-titular span{display:inline;margin-right:.3em}
.tsp-hojas{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(10px,1.4vw,24px);margin-top:clamp(14px,1.6vw,26px)}
.tsp-hojas a{position:relative;display:block;border:1px solid var(--borde-oro)}
.tsp-hojas img{width:100%;height:auto}
.tsp-lupa-icono{position:absolute;right:10px;bottom:10px;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:rgba(0,0,0,.78);border:1px solid var(--amarillo);color:var(--amarillo)}
.tsp-tecnica-pdf{margin-top:clamp(14px,1.6vw,26px)}
.tsp-fotos{padding:clamp(24px,3vw,52px) var(--lado);background:#000;border-top:1px solid var(--borde-oro)}
.tsp-miniaturas{display:grid;grid-template-columns:repeat(auto-fill,minmax(clamp(110px,11vw,190px),1fr));gap:clamp(6px,.7vw,12px);margin-top:clamp(14px,1.6vw,26px)}
.tsp-miniaturas a{display:block;border:1px solid color-mix(in srgb,var(--oro-claro) 45%,transparent)}
.tsp-miniaturas a:hover{border-color:var(--amarillo)}
.tsp-miniaturas img{width:100%;aspect-ratio:4/3;object-fit:cover}
.tsp-volver-venta,.tsp-volver{padding:clamp(18px,2vw,32px) var(--lado);font:400 clamp(13px,1.1vw,18px)/1 var(--cuerpo);text-transform:uppercase;letter-spacing:.1em}
.tsp-volver a:hover{color:var(--amarillo)}

/* Prensa (diapositiva 15) y contacto (16) */
.tsp-prensa{min-height:clamp(560px,47.5vw,820px);align-items:center}
.tsp-prensa>picture{inset:0 0 0 auto;width:68%;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 22%);mask-image:linear-gradient(90deg,transparent 0,#000 22%)}
.tsp-prensa .tsp-fondo{object-position:right center}
.tsp-prensa .tsp-slide-texto{width:min(100%,38%)}
.tsp-prensa .tsp-titular span,.tsp-contacto .tsp-titular span{white-space:nowrap}
.tsp-prensa .tsp-titular{font-size:clamp(34px,4.3vw,78px)}
.tsp-prensa .tsp-intro{font-size:clamp(14px,1.1vw,18px);max-width:25em}
/* Prensa a 601–900 (tableta): una sola columna bajo la revista; con 25 em los párrafos dejaban vacía la mitad derecha */
@media (min-width:601px) and (max-width:900px){.tsp-prensa .tsp-intro{max-width:38em}}
.tsp-prensa .tsp-intro+.tsp-intro{margin-top:clamp(12px,1.2vw,20px)}
.tsp-prensa .tsp-tag{color:var(--eyebrow);letter-spacing:.2em}
/* D-PERF-356: el oro de la diapositiva sobre las vetas claras del mármol, con una sombra negra suave que no cambia el tono (≥4,5 junto a las letras; como el logo en la 707) */
.tsp-p-prensa .tsp-prensa .tsp-eyebrow,.tsp-p-prensa .tsp-prensa .tsp-tag{text-shadow:0 0 4px rgba(0,0,0,.6)}
.tsp-prensa .tsp-titular::after{content:"";display:block;width:clamp(44px,4.2vw,74px);height:2px;background:var(--oro);margin-top:clamp(12px,1.4vw,24px)}
.tsp-pie-foto{position:absolute;right:clamp(14px,6vw,120px);bottom:clamp(10px,1.4vw,24px);font:400 clamp(11px,.78vw,13px)/1.4 var(--cuerpo);letter-spacing:.14em;text-transform:uppercase}
/* D-PERF-205/194/223/142/080: el formulario de Contacto a 2,2 % del borde derecho, como la diapositiva 16 (32 px a 1440), no al margen común */
.tsp-contacto{--cto-der:2.2vw;min-height:clamp(600px,47.5vw,820px);justify-content:space-between;padding-right:var(--cto-der)}
.tsp-contacto>picture{inset:0 auto 0 12%;width:78%;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 26%,#000 74%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 26%,#000 74%,transparent 100%)}
.tsp-contacto .tsp-fondo{object-position:center 60%}
.tsp-contacto .tsp-slide-texto{width:min(100%,50%);padding-right:0}
/* D-PERF-195: el texto arriba, bajo la cabecera, como el formulario y la diapositiva 16 (centrado en el alto quedaba ≈110 px más abajo). */
.tsp-contacto>.tsp-slide-texto{align-self:flex-start}
/* D-PERF-064/065/193: la foto (4:3) no da para ir a sangre sin cortar el Jeep: franja con el Jeep ENTERO entre el texto y el formulario, como
   la diapositiva 16. Sin estirar ni recortar (caja 4:3), acaba en el borde del formulario y el Jeep (del 27 % al 100 % de la foto) empieza
   en el 33 % del ancho; fundida a negro por la izquierda, arriba y abajo. */
@media (min-width:901px){
  .tsp-contacto>picture{inset:auto;top:50%;right:calc(var(--cto-der) + clamp(300px,28vw,480px));width:calc((100% - var(--cto-der) - clamp(300px,28vw,480px) - 33%) / .73);aspect-ratio:4/3;transform:translateY(-50%);-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 22%),linear-gradient(180deg,transparent 0,#000 14%,#000 86%,transparent 100%);-webkit-mask-composite:source-in;mask-image:linear-gradient(90deg,transparent 0,#000 22%),linear-gradient(180deg,transparent 0,#000 14%,#000 86%,transparent 100%);mask-composite:intersect}
}
/* D-PERF-202 (diapositiva 16): desde 1301 px la foto va como en la diapositiva, grande y clara: el Jeep del 32 al 78 % del ancho (pasa bajo el
   formulario) y de y 28 a 91 %; caja 4:3 de 1039 u desde x 260 u (el faro derecho, al 86 % de la foto, queda a la izquierda del formulario), y 78 u bajo la cabecera. El degradado negro se queda detrás del texto (hasta el 36 %)
   y ya no oscurece el Jeep (antes 0,55 de negro en el 34 %: luminosidad 38 frente a 55 de la diapositiva). */
/* 364c (D-PERF-228 a 1024): entre 901 y 1300 la caja 4:3 dejaba bandas negras arriba y abajo (luz del Jeep 29,7/32,3). Detrás va el mismo fondo
   desenfocado de la 364; la foto nítida no cambia (4:3 entera hasta el formulario, D-PERF-064) */
@media (min-width:901px) and (max-width:1300.98px){
  .tsp-contacto::after{content:"";position:absolute;inset:0;z-index:-3;background:var(--cto-fondo-borroso) 62% 45%/cover no-repeat}
}
@media (min-width:1301px){
  .tsp-contacto>picture{left:calc(260 * 100vw / 1672);right:auto;top:calc(78 * 100vw / 1672);width:calc(1039 * 100vw / 1672);transform:none;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 16%);mask-image:linear-gradient(90deg,transparent 0,#000 16%)}
  .tsp-contacto::before{background:linear-gradient(90deg,rgba(0,0,0,.86) 0,rgba(0,0,0,.6) 20%,rgba(0,0,0,0) 36%)}
  /* el panel del formulario, translúcido como en la diapositiva (puente: el valor más bajo del barrido 0,9-0,5 con todo lo que va sobre él ≥4,5; los campos siguen opacos) */
  .tsp-contacto .tsp-contacto-form{background:rgba(0,0,0,.5)}
  /* velo local detrás del bloque de texto (como el del Ejemplo, 849/850): la entradilla y el lema se leen sobre la foto sin oscurecer el Jeep */
  /* D-PERF-204 (diapositiva 16 ×1,6 a 1440): el bloque de texto empieza en x 69 (80 u; antes 78 = --lado) y la entradilla va a 21 px con paso ≈29 (24,4 u; antes 17,3 / 23,8) */
  .tsp-contacto>.tsp-slide-texto{position:relative;margin-left:calc(80 * 100vw / 1672 - var(--lado))}
  .tsp-contacto>.tsp-slide-texto .tsp-intro{font-size:calc(24.4 * 100vw / 1672)}
  /* en inglés la dorada («a character of its own.») acababa al 60 % del ancho, sobre el Jeep (es: 45 %): en dos líneas equilibradas, sin <br>; el corte sale del ancho (puente, 364/204) */
  .tsp-contacto .tsp-titular .tsp-oro:lang(en){white-space:normal;text-wrap:balance;max-width:7.5em}
  .tsp-contacto>.tsp-slide-texto::before{content:"";position:absolute;inset:-14% -8% -16% -12%;z-index:-1;pointer-events:none;background:radial-gradient(ellipse 60% 62% at 34% 62%,rgba(0,0,0,.8) 0,rgba(0,0,0,.55) 50%,rgba(0,0,0,0) 100%)}
  /* y un velo pegado al lema, del ancho de sus letras: «INTERNACIONAL» (es) pasa del velo del bloque y cae sobre las flores amarillas (2,75 con solo D) */
  /* y otro pegado a la entradilla, que en inglés es más larga y se sale del velo del bloque (3,6 frente a 4,5) */
  .tsp-contacto .tsp-intro{position:relative}
  .tsp-contacto .tsp-intro::before{content:"";position:absolute;inset:-18% -10% -18% -8%;z-index:-1;pointer-events:none;background:radial-gradient(ellipse 55% 55% at 50% 50%,rgba(0,0,0,.8) 0,rgba(0,0,0,.65) 60%,rgba(0,0,0,0) 100%)}
  .tsp-contacto .tsp-tag{position:relative;width:fit-content}
  .tsp-contacto .tsp-tag::before{content:"";position:absolute;inset:-70% -16% -70% -8%;z-index:-1;pointer-events:none;background:radial-gradient(ellipse 50% 50% at 48% 50%,rgba(0,0,0,.88) 0,rgba(0,0,0,.75) 65%,rgba(0,0,0,0) 100%)}
  /* D-PERF-364 (diapositiva 16: la foto a sangre, bajo el formulario y hasta la cabecera): solo hay la foto 4:3, así que detrás va la misma foto ampliada,
     desenfocada y oscurecida, que llena la sección entera; la foto nítida no se mueve (faro y matrícula en su sitio) y se funde por arriba, por la derecha (desde el 88 %; el faro está al 86 %) y por abajo, sin costura */
  .tsp-contacto::after{content:"";position:absolute;inset:0;z-index:-3;background:var(--cto-fondo-borroso) 62% 45%/cover no-repeat}
  .tsp-contacto>picture{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 16%,#000 88%,transparent 100%),linear-gradient(180deg,transparent 0,#000 10%,#000 78%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 16%,#000 88%,transparent 100%),linear-gradient(180deg,transparent 0,#000 10%,#000 78%,transparent 100%);-webkit-mask-composite:source-in;mask-composite:intersect}
}
.tsp-contacto .tsp-titular{font-size:clamp(34px,4.2vw,76px)}
/* D-PERF-081/229/299: en la diapositiva 16 las líneas blancas son ≈16 % más grandes que la dorada (blanca/dorada 0,745; aquí 0,64) */
@media (min-width:901px){.tsp-contacto .tsp-titular span:not(.tsp-oro){font-size:1.16em}}
.tsp-contacto .tsp-intro{font-size:clamp(14px,1.2vw,20px);max-width:25em}
.tsp-contacto .tsp-tag{color:var(--eyebrow)}
.tsp-contacto-form{width:clamp(300px,28vw,480px);border:2px solid var(--amarillo);background:rgba(0,0,0,.9);padding:clamp(18px,2vw,34px);margin:clamp(20px,2.4vw,40px) 0}

/* Formularios en línea y en ventana */
.tsp-campos{display:grid;gap:clamp(10px,1vw,16px)}
.tsp-fila{display:grid;grid-template-columns:1fr 1fr;gap:clamp(8px,.8vw,12px)}
.tsp-campo{display:block;position:relative}
.tsp-etiqueta{display:block;margin-bottom:6px;font:400 clamp(11px,.9vw,14px)/1.2 var(--cuerpo);letter-spacing:.14em;text-transform:uppercase}
.tsp-form input:not([type=checkbox]),.tsp-form select,.tsp-form textarea{display:block;width:100%;min-height:50px;padding:12px 16px;background:#000;border:1px solid rgba(255,255,255,.85);border-radius:0;color:#fff;font:400 clamp(14px,1.05vw,16px)/1.3 var(--cuerpo);box-shadow:none}
.tsp-form textarea{min-height:110px;resize:vertical}
.tsp-form input::placeholder,.tsp-form textarea::placeholder{color:#e9e9e9;opacity:1;letter-spacing:.14em;text-transform:uppercase;font-size:.84em}
.tsp-form select{-webkit-appearance:none;appearance:none;padding-right:44px;color:#fff;letter-spacing:.14em;text-transform:uppercase;font-size:clamp(12px,.9vw,14px)}
.tsp-form select option{background:#000;color:#fff;text-transform:none;letter-spacing:0}
.tsp-chevron{position:absolute;right:14px;bottom:13px;pointer-events:none}
.tsp-chevron .tsp-icono{width:24px;height:24px}
.tsp-form input:focus-visible,.tsp-form select:focus-visible,.tsp-form textarea:focus-visible{outline:3px solid var(--amarillo);outline-offset:2px}
.tsp-form [aria-invalid=true]{border-color:#ff8a7a}
.tsp-aviso{display:block;margin-top:5px;color:#ff9d8f;font:400 13px/1.3 var(--cuerpo)}
.tsp-error{margin-top:12px;color:#ff9d8f;font-size:14px}
.tsp-consentimiento{display:flex;gap:12px;align-items:flex-start;font:300 13px/1.4 var(--cuerpo);color:#fff}
.tsp-form .tsp-consentimiento input{flex:none;width:22px;height:22px;min-height:0;margin-top:1px;accent-color:var(--acento);-webkit-appearance:none;appearance:none;display:grid;place-content:center;background:#000;border:1px solid rgba(255,255,255,.85);border-radius:0;padding:0}
.tsp-form .tsp-consentimiento input::before{content:"";width:12px;height:12px;background:var(--amarillo);transform:scale(0);transition:transform .12s}
.tsp-form .tsp-consentimiento input:checked::before{transform:scale(1)}
.tsp-consentimiento .tsp-aviso{flex-basis:100%}
.tsp-consentimiento{flex-wrap:wrap}
.tsp .tsp-enviar{width:100%;margin-top:clamp(12px,1.2vw,20px);min-height:56px}
/* D-PERF-241: en Contacto el texto del botón en una línea y con aire (diapositiva 16: ≈70 % del botón); el cuerpo se queda en 18 px por encima de 1500 */
.tsp .tsp-contacto-form .tsp-enviar{white-space:nowrap;font-size:clamp(13px,1.2vw,18px)}
.tsp-dominio{display:flex;align-items:center;gap:14px;margin-top:clamp(14px,1.4vw,22px);font:400 clamp(11px,.95vw,15px)/1 var(--cuerpo);letter-spacing:.3em;color:var(--amarillo)}
.tsp-dominio span{flex:1;height:1px;background:var(--amarillo)}
.tsp-gracias[hidden]{display:none}
.tsp-gracias{display:flex;flex-direction:column;align-items:center;gap:14px;padding:30px 10px;text-align:center}
.tsp-gracias .tsp-icono{width:56px;height:56px;color:var(--amarillo)}
.tsp .tsp-gracias .tsp-form-titulo{font:500 clamp(18px,1.6vw,24px)/1.3 var(--cuerpo);text-transform:none;letter-spacing:0}
/* Contacto: como en la diapositiva, el nombre del campo es su texto de relleno; el rótulo va oculto (sigue ahí para el lector de pantalla). */
.tsp-form-contacto .tsp-etiqueta{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;margin:0}
.tsp-form-contacto .tsp-campo-select .tsp-etiqueta{position:absolute}
.tsp-form-vehiculo .tsp-form-cuerpo{margin-top:clamp(10px,1.2vw,18px)}
.tsp-form-vehiculo .tsp-campos{gap:clamp(8px,.9vw,14px)}
.tsp-form-vehiculo .tsp-form input:not([type=checkbox]){min-height:44px}
.tsp-form-vehiculo input:not([type=checkbox]){min-height:44px}
.tsp-form-vehiculo input::placeholder{opacity:0}
/* La ventana de la consulta privada */
.tsp-dialogo{width:min(640px,calc(100vw - 24px));max-height:calc(100vh - 24px);padding:0;background:#000;color:#fff;border:2px solid var(--amarillo);overflow:auto}
.tsp-dialogo::backdrop{background:rgba(0,0,0,.78)}
.tsp-dialogo .tsp-form{padding:clamp(22px,3vw,40px);position:relative}
.tsp-dialogo .tsp-campos{grid-template-columns:1fr 1fr}
.tsp-dialogo .tsp-ancho{grid-column:1/-1}
.tsp-dialogo label>span:first-child{display:block;margin-bottom:6px;font:400 12px/1.2 var(--cuerpo);letter-spacing:.14em;text-transform:uppercase}
.tsp-dialogo label em{font-style:normal;opacity:.8}
.tsp-form-titulo{font:var(--peso-titulo) clamp(24px,2.6vw,38px)/1.05 var(--titulo);text-transform:uppercase;margin-bottom:6px}
.tsp-dialogo .tsp-intro{margin:6px 0 18px;font-size:15px}
.tsp-dialogo .tsp-consentimiento{margin-top:4px}
.tsp-cerrar{position:absolute;top:8px;right:10px;z-index:3;width:44px;height:44px;font-size:32px;line-height:1;color:#fff}
.tsp-cerrar:hover{color:var(--amarillo)}

/* Ampliar fotos y fichas */
.tsp-lupa{width:100vw;max-width:100vw;height:100vh;max-height:100vh;margin:0;padding:0;background:rgba(0,0,0,.94);color:#fff;border:0;overflow:hidden}
.tsp-lupa::backdrop{background:#000}
.tsp-lupa[open]{display:grid;grid-template-columns:clamp(48px,6vw,90px) 1fr clamp(48px,6vw,90px);align-items:center}
/* La foto y su pie, siempre dentro de la pantalla (V21, 19-oct: a 390 la foto no se veía y a 1440 el pie quedaba debajo): la figura mide el alto
   de la pantalla, la foto ocupa lo que deja el pie (flex 1 1 0, alto definido) y el ancho de su columna. */
.tsp-lupa figure{grid-column:2;grid-row:1;display:flex;flex-direction:column;align-items:center;gap:10px;width:100%;height:100vh;box-sizing:border-box;padding:clamp(40px,5vh,60px) 0 14px;margin:0;min-width:0;min-height:0}
.tsp-lupa picture{display:flex;justify-content:center;align-items:center;flex:1 1 0;width:100%;min-width:0;min-height:0}
.tsp-lupa img{display:block;max-width:100%;max-height:100%;width:auto;height:auto;min-width:0;min-height:0;object-fit:contain}
.tsp-lupa img{transform-origin:50% 50%;touch-action:none;cursor:zoom-in;user-select:none;-webkit-user-drag:none}
.tsp-zoom-activo img{cursor:grab}
.tsp-lupa picture{overflow:visible}
.tsp-lupa figcaption{flex:none;font:400 14px/1.3 var(--cuerpo);text-align:center;color:#ddd}
.tsp-zoom{position:absolute;top:8px;right:60px;z-index:3;display:flex;gap:6px}
.tsp-zoom button{min-width:44px;height:44px;padding:0 8px;font:400 24px/1 var(--cuerpo);color:#fff;background:rgba(0,0,0,.55);border:1px solid rgba(255,255,255,.35)}
.tsp-zoom button:hover{color:var(--amarillo);border-color:var(--amarillo)}
.tsp-zoom [hidden]{display:none}
.tsp-zoom-normal{font-size:14px!important;letter-spacing:.06em}
.tsp-lupa-nav{height:100%;font-size:clamp(40px,5vw,72px);color:#fff}
.tsp-lupa-nav:hover{color:var(--amarillo)}
.tsp-lupa-ant{grid-column:1;grid-row:1}
.tsp-lupa-sig{grid-column:3;grid-row:1}
.tsp-lupa-sola .tsp-lupa-nav{visibility:hidden}

/* Fichas de los modelos (Urban, Adventure, Expedition) */
.tsp-hero{position:relative;display:flex;align-items:center;min-height:clamp(420px,40vw,660px);isolation:isolate;overflow:hidden}
.tsp-hero-foto{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover}
.tsp-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(0,0,0,.9) 0,rgba(0,0,0,.55) 38%,rgba(0,0,0,0) 66%)}
.tsp-hero-texto{width:min(100%,50%);padding:clamp(30px,4vw,70px) var(--lado)}
.tsp-titular-modelo{font-size:clamp(46px,6.4vw,112px)}
.tsp-claim{margin-top:14px;font:400 clamp(16px,1.6vw,26px)/1.25 var(--titulo);font-style:italic;color:var(--oro)}
.tsp-precio{color:var(--oro)}
.tsp-video-marca{padding:clamp(16px,2.4vw,40px) var(--lado);background:#000}
.tsp-video-marca>video{display:block;width:100%;height:auto;background:#000}
.tsp-glance,.tsp-detalles{padding:clamp(24px,3vw,52px) var(--lado);background:#000;border-top:1px solid var(--borde-oro)}
.tsp-glance-cab{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:clamp(14px,1.6vw,26px);font:400 clamp(12px,1vw,16px)/1.3 var(--cuerpo);letter-spacing:.3em;text-transform:uppercase;color:var(--eyebrow)}
.tsp-glance ul{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:clamp(10px,1.4vw,24px)}
.tsp-glance li{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:14px 0 0;border-top:2px solid var(--amarillo)}
.tsp-glance .tsp-icono{width:34px;height:34px;color:var(--amarillo)}
.tsp-glance b{font:700 clamp(20px,2vw,32px)/1 var(--titulo)}
.tsp-glance li span{font:400 13px/1.3 var(--cuerpo);letter-spacing:.14em;text-transform:uppercase;color:var(--suave)}
.tsp-bloque{position:relative;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:clamp(16px,3vw,56px);padding:clamp(24px,3vw,52px) var(--lado);background:#000;border-top:1px solid var(--borde-oro)}
.tsp-bloque-foto{grid-column:2;grid-row:1;width:100%;height:auto;max-height:560px;object-fit:cover}
.tsp-bloque-texto{grid-column:1;grid-row:1}
.tsp-bloque .tsp-titular{font-size:clamp(28px,3.2vw,56px)}
.tsp-bloque .tsp-lateral{position:static;margin-top:10px;grid-column:1}
.tsp-lista{margin-top:clamp(14px,1.6vw,26px);display:grid;gap:8px}
.tsp-lista li{position:relative;padding-left:22px;font-size:clamp(14px,1.1vw,18px)}
.tsp-lista li::before{content:"";position:absolute;left:0;top:.62em;width:10px;height:2px;background:var(--amarillo)}
.tsp-detalles ol{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(12px,1.6vw,26px)}
.tsp-detalles li{display:flex;flex-direction:column;gap:8px}
.tsp-det-ancho{grid-column:span 2}
.tsp-det-foto{position:relative}
.tsp-det-foto img{width:100%;aspect-ratio:1.5/1;object-fit:cover}
.tsp-det-foto b{position:absolute;left:8px;top:8px;display:grid;place-items:center;min-width:34px;height:34px;padding:0 6px;background:#000;border:1px solid var(--amarillo);color:var(--amarillo);font:400 14px/1 var(--cuerpo)}
.tsp-detalles h3{font:400 clamp(14px,1.2vw,19px)/1.2 var(--cuerpo);text-transform:uppercase;color:var(--oro)}
.tsp-detalles li p{font-size:clamp(13px,1vw,16px);color:var(--suave)}
.tsp-cierre-ficha{display:flex;flex-direction:column;align-items:flex-start;gap:clamp(8px,1vw,16px);padding:clamp(28px,3.4vw,60px) var(--lado);background:#000;border-top:1px solid var(--borde-oro)}
.tsp-cierre-ficha .tsp-acciones{justify-content:flex-start;padding:0}
.tsp-valores{display:flex;flex-wrap:wrap;gap:12px 28px;margin-top:10px}
.tsp-valores li{display:flex;align-items:center;gap:10px;font:400 clamp(11px,.95vw,15px)/1.2 var(--cuerpo);text-transform:uppercase}
.tsp-valores .tsp-icono{color:var(--amarillo);width:30px;height:30px}
.tsp-p-expedition .tsp-cabecera{border-bottom-color:color-mix(in srgb,var(--amarillo) 28%,transparent)}

/* La franja de ventajas va dentro de cada diapositiva, abajo, y la banda del pie debajo (diapositivas 1 a 10) */
.tsp-ventajas-dentro{position:relative;z-index:2;border-top:0;padding-top:clamp(26px,3vw,48px);background:linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.8) 48%)}
.tsp-slide>.tsp-ventajas-dentro{align-self:stretch;width:100%}
.tsp-etapa>.tsp-ventajas-dentro{grid-column:1/-1;grid-row:3;margin:clamp(14px,1.6vw,24px) calc(-1 * var(--lado)) calc(-1 * clamp(24px,2.6vw,42px));padding-left:var(--lado);padding-right:var(--lado);padding-top:clamp(14px,1.6vw,24px);background:#000}
.tsp-range>.tsp-ventajas-dentro{margin:clamp(14px,1.6vw,26px) calc(-1 * clamp(14px,1.6vw,26px)) calc(-1 * clamp(14px,1.6vw,26px));background:#000;padding-top:clamp(14px,1.6vw,24px)}
.tsp-antes-despues>.tsp-ventajas-dentro{position:absolute;left:0;right:0;bottom:0;z-index:6}
.tsp-banda{display:grid;grid-template-columns:1.15fr 1fr;align-items:center;gap:10px clamp(16px,3vw,60px);padding:clamp(14px,1.8vw,28px) var(--lado);border-top:2px solid var(--amarillo);background:#000}
.tsp-pie-lema,.tsp-pie-der{min-width:0}
.tsp-p-dubai .tsp-banda{border-top-width:1px;border-top-color:var(--oro)}
.tsp-titulo-marca{white-space:nowrap}
.tsp-titulo-marca img{display:inline-block;height:.82em;width:auto;margin-right:.18em;vertical-align:-.04em}

@media (prefers-reduced-motion:reduce){.tsp *{transition:none!important}}
body.admin-bar .tsp-cabecera{top:32px}
@media (max-width:782px){body.admin-bar .tsp-cabecera{top:0}}

/* Intermedio: menos aire */
@media (max-width:1300px){
  .tsp .tsp-menu ul{gap:14px}
}
/* Tableta y móvil: menú en panel y cada diapositiva en columna (foto arriba, texto debajo) */
@media (max-width:1100px){
  .tsp .tsp-menu-boton{display:flex}
  .tsp-menu{position:fixed;inset:var(--alto-cab) 0 0 0;flex-direction:column;align-items:stretch;gap:18px;padding:20px var(--lado) 28px;background:#000;border-bottom:2px solid var(--amarillo);transform:translateY(-120%);visibility:hidden;transition:transform .25s,visibility .25s;max-height:calc(100vh - var(--alto-cab));overflow:auto;margin:0}
  .tsp-menu.tsp-abierto{transform:none;visibility:visible}
  /* D-PERF-383/384: con el menú abierto la página de debajo no se mueve (el panel va a toda la altura y lo de debajo, inert). */
  html.tsp-menu-abierto{overflow:hidden}   /* solo en html (pasa a la ventana): en body lo volvía contenedor de scroll y la cabecera sticky se iba con la página */
  html.tsp-menu-abierto .aviso-cookies{z-index:40}   /* bajo la cabecera (50) y su panel: inert mientras, como en SS AI */
  .tsp .tsp-menu ul{flex-direction:column;gap:0}
  .tsp .tsp-menu ul a{width:100%;padding:15px 0;font-size:15px;border-bottom:1px solid rgba(255,255,255,.14)}
  .tsp-idioma{border-left:0!important;padding-left:0}
  .tsp-idioma-menu{display:none}
  .tsp .tsp-idioma-movil{display:flex;margin-left:auto;padding:8px 4px;font-size:14px}
  .tsp .tsp-idioma-movil + .tsp-menu-boton{margin-left:6px}
  .tsp .tsp-abierto-boton span:nth-child(1){transform:translateY(8px) rotate(45deg)}
  .tsp .tsp-abierto-boton span:nth-child(2){opacity:0}
  .tsp .tsp-abierto-boton span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
  .tsp-marca{left:calc(var(--lado) - 8px)}
}
/* Las nueve tarjetas del Configurador van en UNA fila hasta 1201 px de ancho (diapositiva 13; D-PERF-069/070); por debajo, 5+4. */
@media (max-width:1200px){
  .tsp-cols-9{grid-template-columns:repeat(5,1fr);row-gap:22px}
  .tsp-cols-9 li:nth-child(5n+1){border-left:0}
}
@media (max-width:900px){
  .tsp-slide,.tsp-hero-dubai,.tsp-prensa,.tsp-contacto,.tsp-hero,.tsp-hero-viaje,.tsp-hero-config,.tsp-hero-venta{display:block;min-height:0}
  .tsp-slide-c .tsp-slide-texto{width:auto}
  .tsp-pasos{width:100%}
  .tsp-slide picture,.tsp-hero-dubai>picture,.tsp-prensa>picture,.tsp-contacto>picture{position:relative;inset:auto;z-index:0}
  .tsp-prensa .tsp-titular span,.tsp-contacto .tsp-titular span,.tsp-hero-venta .tsp-titular span{white-space:normal}
  .tsp-slide-a picture,.tsp-slide-b picture,.tsp-hero-dubai>picture,.tsp-prensa>picture,.tsp-contacto>picture{width:auto;-webkit-mask-image:none;mask-image:none;inset:auto}
  .tsp-fondo,.tsp-hero-foto{position:static;height:auto;aspect-ratio:4/3;max-height:75vw;-webkit-mask-image:linear-gradient(180deg,#000 72%,transparent);mask-image:linear-gradient(180deg,#000 72%,transparent)}
  .tsp-slide::before,.tsp-hero-dubai::before,.tsp-prensa::before,.tsp-contacto::before,.tsp-hero::before,.tsp-antes-despues::before{display:none}
  .tsp-etapa-texto .tsp-titular span{white-space:normal}
  .tsp-slide-texto,.tsp-slide-b .tsp-slide-texto,.tsp-hero-dubai .tsp-slide-texto,.tsp-hero-viaje .tsp-slide-texto,.tsp-prensa .tsp-slide-texto,.tsp-contacto .tsp-slide-texto,.tsp-hero-texto{width:auto;margin-top:-6vw;padding:0 var(--lado) clamp(24px,5vw,40px)}
  .tsp-slide-b .tsp-slide-texto{padding-left:var(--lado)}
  .tsp-slide-b{justify-content:flex-start}
  .tsp-lateral,.tsp-lateral-alto{position:static;transform:none;margin:0 var(--lado) 18px;border:0;padding:0;max-width:none}
  .tsp-hero-config .tsp-lateral{position:absolute;top:clamp(12px,2.6vw,22px);right:var(--lado);margin:0;max-width:10em;text-align:right}   /* D-PERF-191: el lema va sobre la foto, arriba a la derecha, como la diapositiva 13 */
  .tsp-prensa .tsp-fondo{object-position:center;aspect-ratio:16/9;max-height:none}
  .tsp-prensa .tsp-pie-foto{position:static;padding:0 var(--lado) 22px}
  .tsp-contacto{padding-right:0}
  .tsp-contacto-form{width:auto;margin:0 var(--lado) 28px}
  .tsp-viaje{position:static;grid-template-columns:1fr;gap:14px;padding:0 var(--lado) 24px}
  .tsp-viaje li:not(:last-child)::after{display:none}
  .tsp-hero-viaje .tsp-viaje{margin-top:0}
  .tsp-etapa{display:block;padding:0 0 28px}
  .tsp-etapa-texto{padding:22px var(--lado) 0}
  .tsp-etapa-foto{margin-top:22px;padding:0 var(--lado)}
  .tsp-etiqueta-foto{position:static;display:inline-block;margin-bottom:8px}
  .tsp-etapa-cards{margin:16px var(--lado) 0}
  .tsp-etapa-cards-4,.tsp-etapa-cards-6{grid-template-columns:repeat(2,1fr)}
  .tsp-etapas{flex-direction:row;flex-wrap:wrap;justify-content:center;gap:10px 14px;margin:22px var(--lado) 0}
  .tsp-etapas::before{display:none}
  .tsp-etapas span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .tsp-etapas .tsp-etapa-activa span{position:static;width:auto;height:auto;clip:auto}
  .tsp-checks{grid-template-columns:repeat(2,auto)}
  .tsp-antes-despues{display:block;min-height:0}
  .tsp-ad-comparador{position:relative;inset:auto;z-index:0;height:clamp(260px,72vw,520px)}
  .tsp-ad-e-antes{left:3%}
  .tsp-ad-texto{max-width:none;padding:22px var(--lado) 14px}
  .tsp-ad-features{position:static;display:grid;grid-template-columns:repeat(2,1fr);gap:14px;padding:6px var(--lado) 18px}
  .tsp-ad-features li+li{border-left:0;padding-left:0}
  .tsp-ad-asiento{position:static;margin:0 var(--lado) 24px;width:auto}   /* D-PERF-352: al ancho de la columna, como las demás fotos (a 390 era 230 px pegada a la izquierda) */
  .tsp-ad-asiento img{aspect-ratio:auto}   /* D-PERF-352: entera, con su proporción (16:9) */
  .tsp-modelos{grid-template-columns:1fr}
  .tsp-modelo{min-height:clamp(380px,100vw,560px)}
  .tsp-cols-4{grid-template-columns:repeat(2,1fr);row-gap:22px}
  .tsp-cols-4 li:nth-child(odd){border-left:0}
  .tsp-cols-9{grid-template-columns:repeat(3,1fr)}
  .tsp-cols-9 li:nth-child(5n+1){border-left:1px solid var(--oro)}
  .tsp-cols-9 li:nth-child(3n+1){border-left:0}
  .tsp-vehiculos{grid-template-columns:1fr}
  .tsp-vehiculo{grid-template-columns:1fr}
  .tsp-hojas{grid-template-columns:1fr 1fr 1fr}
  .tsp-bloque{grid-template-columns:1fr}
  .tsp-bloque-foto,.tsp-bloque-texto{grid-column:1;grid-row:auto}
  .tsp-detalles ol{grid-template-columns:repeat(2,1fr)}
  .tsp-pie{grid-template-columns:1fr}
  .tsp-pie-lema,.tsp-pie-der{white-space:normal}
  .tsp-ventajas ul{display:grid;grid-template-columns:repeat(2,1fr);gap:14px 8px;width:100%}
  .tsp-ventajas li,.tsp-ventajas li:first-child{padding:0}
  .tsp-ventajas li+li{border-left:0}
  .tsp-destinos{padding-left:14px}
  .tsp-ventajas-dentro,.tsp-etapa>.tsp-ventajas-dentro,.tsp-range>.tsp-ventajas-dentro,.tsp-antes-despues>.tsp-ventajas-dentro{position:static;background:#000;border-top:1px solid color-mix(in srgb,var(--amarillo) 30%,transparent);padding:18px var(--lado)}
  .tsp-etapa>.tsp-ventajas-dentro{margin:22px 0 -28px}
  .tsp-range>.tsp-ventajas-dentro{margin:14px calc(-1 * clamp(14px,1.6vw,26px)) calc(-1 * clamp(14px,1.6vw,26px))}
  .tsp-banda{grid-template-columns:1fr;padding:16px var(--lado)}
  .tsp-ventajas-dentro .tsp-destinos{width:100%}
  .tsp-slide>.tsp-slide-texto{margin-top:-6vw;margin-bottom:0}
}
@media (max-width:560px){
  .tsp-cols-4{grid-template-columns:1fr}
  .tsp-cols-4 li{border-left:0!important;padding-bottom:12px;border-bottom:1px solid var(--oro)}
  .tsp-cols-9{grid-template-columns:repeat(2,1fr)}
  .tsp-cols-9 li:nth-child(3n+1){border-left:1px solid var(--oro)}
  .tsp-cols-9 li:nth-child(odd){border-left:0}
  .tsp-vehiculos li{grid-template-columns:1fr}
  .tsp-vehiculos picture,.tsp-vehiculos img{aspect-ratio:16/10}
  .tsp-hojas{grid-template-columns:1fr}
  .tsp-fila{grid-template-columns:1fr}
  .tsp-dialogo .tsp-campos{grid-template-columns:1fr}
  .tsp-etapa-cards-3{grid-template-columns:repeat(3,1fr)}
  .tsp-iconos3 li{padding:0 6px}
  .tsp-pasos li:not(:last-child)::after{min-width:6px;margin:0 4px}
  .tsp-pasos li span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .tsp-acciones-nota{padding-left:12px}
  .tsp-detalles ol{grid-template-columns:1fr}
  .tsp-det-ancho{grid-column:auto}
  .tsp-checks{gap:12px 16px}
  .tsp-pie-lema{letter-spacing:.3em}
  /* D-PERF-362: a 390 las cabeceras «Performance at a glance» y «Detalles que definen» llevan titular serif blanco como el resto de bloques, y la frase de la derecha pasa a etiqueta dorada debajo. */
  .tsp-glance-cab{display:block;border:0;padding:0}
  .tsp-glance-cab span:first-child{display:block;font:var(--peso-titulo) 32px/.96 var(--titulo);letter-spacing:-.02em;color:#fff;margin-bottom:12px}
  .tsp-glance-cab span:last-child{display:block;font-size:12px;letter-spacing:.2em}
}

/* Fidelidad con las diapositivas (14-oct-2026, 1672 px de ancho): medidas tomadas de las diapositivas; solo escritorio ancho, el móvil queda como estaba. */
@media (min-width:1301px){
  /* Cabecera: menú y botón algo más pequeños; el idioma termina a 106 px del borde */
  .tsp-cabecera{padding-right:6.35vw}
  .tsp .tsp-menu ul a{font-size:.88vw}
  .tsp-idioma{font-size:.93vw}
  /* Franja de ventajas y destinos */
  .tsp-ventajas{padding:1.3vw calc(var(--lado) - .4vw) 1.3vw var(--lado)}
  .tsp-ventajas li{padding:0 1.2vw;font-size:.84vw;line-height:1.55}
  .tsp-ventajas li+li{border-left:0;position:relative}
  /* D-PERF-103: los separadores de la franja, finos y apagados como en las diapositivas 1-3 (≈ var(--separador-apagado)), no amarillo pleno. */
  .tsp-ventajas li+li::before{content:"";position:absolute;left:0;top:50%;height:1.8vw;width:1px;background:var(--separador-apagado);transform:translateY(-50%)}
  .tsp-ventajas .tsp-icono{width:2.7vw;height:2.7vw}
  /* D-PERF-102: el bloque de destinos, con el ancho del español (24,8vw = 357 px a 1440): en inglés el texto es más corto y la barra se iba a la derecha (1049 en vez de 1011-1014 a 1440). */
  .tsp-destinos{border-left:0;padding-left:0;font-size:.89vw;min-width:24.8vw}
  .tsp-destinos::before{content:"";width:3px;height:2.1vw;background:var(--amarillo);margin-right:6.6vw}
  /* Banda y pie con el lema */
  .tsp-banda,.tsp-pie{grid-template-columns:63% auto;justify-content:space-between;column-gap:0}
  .tsp-banda{height:5.5vw;padding-block:0}
  .tsp-pie-lema{gap:5vw}
  .tsp-banda{padding-top:.3vw}
  .tsp-pie-lema span,.tsp-pie-der span{height:2px;opacity:1}
  .tsp-destinos span{position:relative;top:.55vw}
  .tsp-pie-lema span:first-child{flex:1.7}
  .tsp-pie-lema span:last-child{flex:1}
  .tsp-pie-der{gap:.7vw;font-size:max(11px,.78vw);letter-spacing:.23em}
  .tsp-pie-der span{flex:none;width:3.9vw;min-width:0}
  /* Botones: los de las diapositivas son más compactos */
  .tsp .tsp-boton{font-size:1.09vw;padding-inline:1.5vw;gap:1.3vw}
  .tsp .tsp-boton.tsp-boton-cabecera{font-size:.88vw;padding:.75vw 1.3vw}
  .tsp-slide{min-height:45.5vw}
  .tsp-slide>.tsp-slide-texto{margin-block:0;padding-top:4.6vw;padding-bottom:1vw}
  .tsp-slide-texto .tsp-eyebrow{margin-bottom:.6vw}
  .tsp-slide-texto .tsp-titular::after{width:3.7vw;margin-top:1vw}
  .tsp-slide-texto .tsp-intro{margin-top:1.1vw;font-weight:300;max-width:25.5em}
  .tsp-intro br{display:inline}
  /* Diapositiva 1 */
  .tsp-slide-a .tsp-titular{font-size:4.16vw}
  .tsp-slide-a .tsp-intro{font-size:1.27vw;line-height:1.26}
  .tsp-slide-a picture{inset:0 -4.2vw 0 auto}
  .tsp-slide-a .tsp-fondo{object-position:25% 37%}
}
/* D-PERF-115: la diapositiva 2 desde 1101 (antes solo ≥1301): a 1280 el texto iba en una columna de 717-1280 con el botón y los iconos a la
   izquierda; la diapositiva los lleva en la columna de la derecha (titular desde x≈805) con el botón centrado en ella (875-1159). */
@media (min-width:1101px){
  /* Diapositiva 2: el texto en la columna de la derecha; iconos y botón centrados en ella */
  .tsp-slide-b .tsp-slide-texto{width:37.2vw;padding-right:3.1vw}
  .tsp-slide-b .tsp-titular{font-size:4.75vw;line-height:.9}
  .tsp-slide-b .tsp-intro{font-size:1.41vw;max-width:25em;line-height:1.29}
  .tsp-slide-b picture{inset:0 auto 0 -2.7vw;width:72%}
  .tsp-slide-b .tsp-fondo{object-position:left 84%}
  .tsp-slide-b .tsp-iconos3{margin-top:1.6vw}
  .tsp-slide-b .tsp-iconos3 li{padding:0 2.4vw;font-size:1.06vw;gap:.4vw;justify-content:flex-start;white-space:nowrap}
  .tsp-slide-b .tsp-iconos3 li+li{border-left:0;position:relative}
  .tsp-slide-b .tsp-iconos3 li+li::before{content:"";position:absolute;left:0;top:0;height:4.3vw;width:2px;background:var(--amarillo)}
  .tsp-slide-b .tsp-iconos3 .tsp-icono{width:3vw;height:3vw}
  /* Con las etiquetas en una línea, los tres iconos caben en su caja (D-PERF-012: a 1440 «CRAFTSMANSHIP» llegaba al borde; medido con
     Outfit 400 a 1,06vw: en 360 px de texto y es 306 en 491 de caja): hueco de 1,4vw en inglés y 2,1vw en español. */
  .tsp-slide-b .tsp-iconos3 li{padding:0 2.1vw}
  :lang(en) .tsp-slide-b .tsp-iconos3 li{padding:0 1.4vw}
  /* D-PERF-104: la fila de tres iconos, del ancho de la de la diapositiva 2 (906-1352 a 1440 = 31vw), con las etiquetas en una línea: antes ocupaba
     la columna entera (hasta 1395) y la última etiqueta quedaba sin el margen de 88 px de la diapositiva. */
  .tsp-slide-b .tsp-iconos3{width:31vw}
  .tsp-slide-b .tsp-iconos3 li{flex:1 1 auto;padding:0 1.5vw}
  :lang(en) .tsp-slide-b .tsp-iconos3 li{padding:0 .8vw}
  /* D-PERF-297 (puente, 20-oct): como la diapositiva 2, la primera etiqueta en dos líneas («Diseño / exclusivo», «Exclusive / design»); las otras dos, en una. */
  .tsp-slide-b .tsp-iconos3 li:first-child span{white-space:normal;width:min-content;text-align:center}
  .tsp-slide-b .tsp-botones{justify-content:center;margin-top:1.2vw}
  .tsp-slide-b .tsp-boton{font-size:1.23vw;padding-inline:2.15vw;min-height:3.35vw}
}
@media (min-width:1301px){
  /* Diapositiva 3 */
  .tsp-slide-c .tsp-titular{font-size:4.77vw}
  .tsp-slide-c .tsp-intro{font-size:1.32vw;max-width:24em;line-height:1.24}
  .tsp-slide-c picture{inset:0 -6vw 0 2vw}
  .tsp-slide-c .tsp-fondo{object-position:center 84%}
  .tsp-slide-c .tsp-pasos{width:97%;margin-top:2.9vw;justify-content:space-between}
  .tsp-slide-c .tsp-pasos li{gap:1.4vw}
  .tsp-slide-c .tsp-pasos li{text-shadow:0 0 4px #000,0 1px 8px #000}
  .tsp-slide-c .tsp-pasos li:not(:last-child){flex:none}
  .tsp-slide-c .tsp-pasos li:not(:last-child)::after{flex:none;width:5.7vw;margin:0}
  .tsp-slide-c .tsp-botones{margin-top:1.45vw}
}
.tsp-icono-ancho{width:2.3em!important;height:1.3em!important;stroke-width:.8}
@media (min-width:1301px){.tsp-ventajas .tsp-icono-ancho{width:4vw!important;height:2.3vw!important}}

/* Páginas de modelo (Urban, Adventure, Expedition) como sus diseños aprobados: bandas de foto a todo el ancho, casillas amarillas, prestaciones centradas, cierre con dos botones anchos. */
.tsp-hero-ficha .tsp-sub{font:400 clamp(16px,2.1vw,34px)/1.15 var(--cuerpo);letter-spacing:0;max-width:14em;margin-top:.8em}
.tsp-hero-ficha .tsp-claim{font:400 clamp(15px,1.9vw,32px)/1.2 var(--cuerpo);font-style:normal;text-transform:uppercase;color:var(--ficha-claim);letter-spacing:.01em;margin-top:.9em}
.tsp-hero-ficha .tsp-hero-texto .tsp-titular::after{display:none}
.tsp-hero-ficha .tsp-boton{background:linear-gradient(180deg,var(--ficha-boton-alto),var(--ficha-boton-bajo));border:0;font-weight:600}
.tsp-hero-ficha .tsp-lateral{max-width:8em;padding-left:1.2vw;border-left:1px solid var(--ficha-raya);color:var(--ficha-lateral);text-shadow:none}
.tsp-hero-ficha .tsp-lateral::after,.tsp-bloque .tsp-lateral::after{display:none}
.tsp-cierre-ficha .tsp-boton{background:linear-gradient(180deg,var(--ficha-boton-alto),var(--ficha-boton-bajo));border:0;font-weight:600}
.tsp-lista li::before{width:1.1em;height:1.1em;top:.12em;background:var(--ficha-casilla);content:"\2713";color:#000;font:700 .8em/1.1em var(--cuerpo);text-align:center}
.tsp-lista li{padding-left:1.9em}
.tsp-bloque .tsp-eyebrow{letter-spacing:.04em;font-weight:500;color:var(--ficha-claim)}
.tsp-bloque .tsp-titular .tsp-oro{color:var(--ficha-oro)}
@media (min-width:901px){
  .tsp-hero-ficha{min-height:var(--alto,49vw)}
  .tsp-hero-ficha .tsp-hero-foto{inset:0 0 auto auto;width:var(--foto,62vw);height:var(--alto,49vw);object-fit:cover;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 16%);mask-image:linear-gradient(90deg,transparent 0,#000 16%)}
  .tsp-hero-ficha .tsp-hero-texto{width:46%}
  .tsp-hero-ficha .tsp-intro{font-size:1.3vw;max-width:21em}
  .tsp-hero-ficha .tsp-boton{font-size:max(11px,.95vw);min-height:3.2vw;padding-inline:1.7vw}
  .tsp-hero-ficha .tsp-lateral{right:6vw;top:4.6vw;font-size:1vw}
  .tsp-glance,.tsp-detalles{padding:1.8vw var(--lado) 2.2vw}
  .tsp-glance-cab{letter-spacing:.05em;font-size:1.15vw;padding-bottom:1vw;border-bottom:1px solid color-mix(in srgb,var(--borde-oro) 45%,transparent);margin-bottom:1.6vw}
  .tsp-glance-cab span:last-child{color:#fff;font-size:max(11px,.8vw);letter-spacing:.05em}
  .tsp-glance ul{grid-template-columns:repeat(5,1fr);gap:0}
  .tsp-glance li{align-items:center;text-align:center;border-top:0;padding:0 1vw;gap:.45vw}
  .tsp-glance li+li{border-left:1px solid color-mix(in srgb,var(--borde-oro) 70%,transparent)}
  .tsp-glance .tsp-icono{width:3vw;height:3vw}
  .tsp-glance b{font:700 1.3vw/1.2 var(--cuerpo)}
  .tsp-glance li span{font-size:max(11px,.8vw);letter-spacing:.04em}
  .tsp-bloque{display:block;min-height:var(--alto,44vw);padding:2.4vw var(--lado);isolation:isolate;overflow:hidden}
  .tsp-bloque-foto{position:absolute;inset:0 0 auto auto;z-index:-2;width:var(--foto,62vw);height:var(--alto,44vw);max-height:none;object-fit:cover;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 16%);mask-image:linear-gradient(90deg,transparent 0,#000 16%)}
  .tsp-bloque::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(0,0,0,.92) 0,rgba(0,0,0,.72) 32%,rgba(0,0,0,0) 62%)}
  .tsp-bloque-texto{max-width:40%}
  .tsp-bloque .tsp-eyebrow{font-size:1.1vw}
  .tsp-bloque .tsp-titular{font-size:3.1vw;line-height:1.05}
  .tsp-bloque-extra .tsp-titular{font-size:2.6vw}
  .tsp-bloque .tsp-intro{font-size:1.1vw;max-width:26em}
  .tsp-lista{gap:.45vw;margin-top:1.1vw}
  .tsp-lista li{font-size:1.15vw}
  /* Las frases laterales ya van dentro de las fotos del diseño: aquí solo para quien lee con lector de pantalla. */
  .tsp-hero-ficha .tsp-lateral,.tsp-bloque .tsp-lateral{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;padding:0;margin:0}
  .tsp-det-foto img{aspect-ratio:1.68/1;border:1px solid var(--borde-oro)}
  .tsp-det-foto b{left:.5vw;top:auto;bottom:-1.2vw;z-index:2;width:2.4vw;height:2.4vw;min-width:0;padding:0;border:0;border-radius:50%;background:var(--ficha-punto);color:#000;font-weight:600;font-size:max(11px,.95vw)}
  .tsp-detalles h3{color:#fff;font-weight:700;font-size:max(11px,1vw);padding-left:2.9vw;margin-top:.5vw}
  .tsp-detalles li p{padding-left:2.9vw;font-size:max(11px,.95vw)}
  .tsp-cierre-ficha{align-items:stretch}
  .tsp-cierre-ficha .tsp-titular{font-size:3vw}
  .tsp-cierre-ficha .tsp-acciones{display:grid;grid-template-columns:1fr 1fr;gap:1.5vw;margin-top:1vw}
  .tsp-cierre-ficha .tsp-boton{min-height:4vw;font-size:max(11px,1.05vw)}
  .tsp-cierre-ficha .tsp-valores{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:1.4vw;padding:1.2vw 0;border-top:1px solid color-mix(in srgb,var(--borde-oro) 60%,transparent);border-bottom:1px solid color-mix(in srgb,var(--borde-oro) 60%,transparent)}
  .tsp-cierre-ficha .tsp-valores li{justify-content:center;font-size:max(11px,.85vw)}
  .tsp-cierre-ficha .tsp-valores li+li{border-left:1px solid color-mix(in srgb,var(--borde-oro) 60%,transparent)}
}
/* Expedition: fondo dorado oscuro, como su diseño aprobado */
.tsp-p-expedition .tsp-glance,.tsp-p-expedition .tsp-detalles,.tsp-p-expedition .tsp-cierre-ficha{background:linear-gradient(180deg,#1a1207,#3b2a10 55%,#140e05)}
@media (min-width:901px){.tsp-p-expedition .tsp-bloque-texto{max-width:46%}}
/* Venta (diapositiva 14): la foto de la masía a escala menor, desplazada a la derecha y con la izquierda fundida en negro, para que el Jeep se vea entero delante de la casa */
@media (min-width:901px){
  .tsp-hero-venta>picture{inset:0 0 0 auto;width:64%;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 24%);mask-image:linear-gradient(90deg,transparent 0,#000 24%)}
  .tsp-hero-venta .tsp-fondo{object-position:center 100%}
  .tsp-hero-venta::before{background:linear-gradient(90deg,rgba(0,0,0,.5) 0,rgba(0,0,0,.3) 30%,rgba(0,0,0,0) 52%)}
}
/* Dubái y logística (diapositiva 12): foto a escala de la diapositiva, fila de pasos sobre la parte oscura con su degradado */
.tsp-hero-viaje .tsp-intro br{display:none}
@media (min-width:901px){
  .tsp-hero-viaje .tsp-intro br{display:inline}
  .tsp-hero-viaje{min-height:29.55vw}
  .tsp-hero-viaje>picture{inset:0 0 0 auto;width:68%;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 16%,#000 100%);mask-image:linear-gradient(90deg,transparent 0,#000 16%,#000 100%)}
  .tsp-hero-viaje .tsp-fondo{object-position:center 85%}
  .tsp-hero-viaje::before{background:linear-gradient(0deg,rgba(0,0,0,.94) 0,rgba(0,0,0,.7) 16%,rgba(0,0,0,0) 40%),linear-gradient(90deg,rgba(0,0,0,.65) 0,rgba(0,0,0,0) 40%)}
  .tsp-hero-viaje .tsp-slide-texto{width:46%;padding-top:2.9vw;padding-bottom:0}
  .tsp-hero-viaje .tsp-eyebrow{margin-bottom:.5vw}
  .tsp-hero-viaje .tsp-titular{font-size:5.4vw;line-height:.82}
  .tsp-hero-viaje .tsp-titular::after{display:none}
  .tsp-hero-viaje .tsp-tag{margin-top:.8vw;font-size:.96vw;letter-spacing:.3em}
  .tsp-hero-viaje .tsp-tag::after{content:"";display:block;width:2.9vw;height:2px;background:var(--amarillo);margin-top:.55vw}
  .tsp-hero-viaje .tsp-intro{margin-top:.8vw;font-size:1.05vw;line-height:1.3;max-width:none}
  .tsp-hero-viaje .tsp-viaje{left:5.4vw;right:1vw;bottom:.9vw;grid-template-columns:16.2vw 16.75vw 16.57vw 17.88vw auto;gap:0}
  .tsp-hero-viaje .tsp-viaje li{gap:1.2vw;white-space:nowrap}
  .tsp-hero-viaje .tsp-viaje li:not(:last-child)::after{position:absolute;right:.2vw;top:50%;transform:translateY(-50%);margin:0;padding:0;font-size:1.2vw}
  .tsp-hero-viaje .tsp-viaje .tsp-icono{width:4.2vw;height:4.2vw;padding:1vw;flex:none}
  .tsp-hero-viaje .tsp-viaje i{font-size:max(11px,.8vw)}
  .tsp-hero-viaje .tsp-viaje b{font-size:.96vw}
  .tsp-hero-viaje .tsp-viaje small{font-size:max(11px,.8vw)}
  .tsp-cols-logistica{padding-top:.6vw}
  .tsp-cols-logistica li>h2{font-size:1.3vw}
  .tsp-cols-logistica p{font-size:.87vw}
  .tsp-cols-logistica li:nth-child(1)>p:last-child{max-width:16vw}
  .tsp-cols-logistica li:nth-child(2)>p:last-child{max-width:18vw}
  .tsp-cols-logistica li:nth-child(3)>p:last-child{max-width:22vw}
  .tsp-cols-logistica li:nth-child(4)>p:last-child{max-width:23vw}
  .tsp-cols-logistica .tsp-cols-sub{font-size:max(11px,.85vw);max-width:none}
}
/* La marca (diapositivas 4 a 8): cada etapa sobre un lienzo de 1672 px de ancho (el de la diapositiva) que escala con la ventana; --u es 1 px de la diapositiva. */
.tsp-etapa-texto .tsp-intro br{display:none}
@media (min-width:1200px){
  .tsp-etapa{--u:calc(100vw / 1672);display:block;position:relative;height:calc(769 * var(--u));padding:0;overflow:hidden;border-top:0;background:#000}
  .tsp-etapa-texto{position:absolute;left:calc(80 * var(--u));top:calc(74 * var(--u));width:calc(570 * var(--u));padding:0;z-index:4}
  .tsp-etapa-texto .tsp-eyebrow{font-size:calc(18.4 * var(--u));line-height:1.3;margin:0 0 calc(12 * var(--u))}
  .tsp-etapa-texto .tsp-titular{font-size:calc(80 * var(--u));line-height:calc(78 * var(--u));font-weight:800;margin-top:calc(-3 * var(--u))}
  .tsp-etapa-texto .tsp-titular span{display:block}
  .tsp-etapa-texto .tsp-titular .tsp-oro{font-weight:800;letter-spacing:-.012em;color:var(--etapa-oro)}
  .tsp-etapa-5 .tsp-titular{font-size:calc(93 * var(--u));letter-spacing:-.02em}
  .tsp-etapa-texto .tsp-titular::after{width:calc(72 * var(--u));margin-top:calc(14 * var(--u))}
  .tsp-etapa-texto .tsp-intro{margin-top:calc(24 * var(--u));font-size:calc(22.7 * var(--u));line-height:calc(28 * var(--u));font-weight:300;max-width:calc(520 * var(--u))}
  .tsp-etapa-texto .tsp-intro br{display:inline}
  .tsp-etapa-1 .tsp-intro{font-size:calc(21.45 * var(--u));max-width:calc(500 * var(--u))}
  .tsp-etapa-4 .tsp-titular::after,.tsp-etapa-5 .tsp-titular::after{margin-top:calc(7 * var(--u))}
  .tsp-etapa-4 .tsp-intro,.tsp-etapa-5 .tsp-intro{margin-top:calc(17 * var(--u))}
  .tsp-etapa-2 .tsp-intro{font-size:calc(23.08 * var(--u))}
  .tsp-etapa-4 .tsp-intro{font-size:calc(22.97 * var(--u))}
  .tsp-etapa-texto .tsp-botones{position:absolute;left:calc(3 * var(--u));top:calc(432 * var(--u));margin:0}
  .tsp-etapa-texto .tsp-boton{min-height:calc(58 * var(--u));width:calc(282 * var(--u));justify-content:space-between;padding-inline:calc(17 * var(--u));gap:calc(8 * var(--u));font-size:calc(18.4 * var(--u));white-space:nowrap}
  .tsp-etapa-5 .tsp-etapa-texto .tsp-boton{font-size:calc(15 * var(--u));padding-inline:calc(12 * var(--u));gap:calc(6 * var(--u))}
  .tsp-checks{position:absolute;left:calc(2 * var(--u));top:calc(425 * var(--u));margin:0;grid-template-columns:repeat(3,calc(167 * var(--u)));gap:calc(40 * var(--u)) 0}
  .tsp-checks li{gap:calc(16 * var(--u));font-size:calc(16.6 * var(--u))}
  .tsp-checks .tsp-icono{width:calc(40 * var(--u));height:calc(40 * var(--u))}
  /* Foto grande: cada diapositiva con su caja */
  .tsp-etapa-foto{position:absolute;left:calc(633 * var(--u));width:calc(844 * var(--u));top:calc(48 * var(--u));height:calc(387 * var(--u));padding:0;margin:0}
  .tsp-etapa-foto picture,.tsp-etapa-foto img{display:block;width:100%;height:100%;aspect-ratio:auto;object-fit:cover}
  .tsp-etapa-1 .tsp-etapa-foto{left:calc(635 * var(--u));width:calc(842 * var(--u));height:calc(384 * var(--u))}
  .tsp-etapa-3 .tsp-etapa-foto{top:calc(37 * var(--u));height:calc(403 * var(--u))}
  .tsp-etapa-4 .tsp-etapa-foto{top:calc(29 * var(--u));height:calc(411 * var(--u))}
  .tsp-etapa-5 .tsp-etapa-foto{left:calc(500 * var(--u));width:calc(977 * var(--u));top:0;height:calc(441 * var(--u));-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 14%);mask-image:linear-gradient(90deg,transparent 0,#000 14%)}
  .tsp-etiqueta-foto{left:0;top:calc(-36 * var(--u));width:calc(357 * var(--u));padding:0;font-size:calc(17.5 * var(--u));line-height:calc(32 * var(--u));text-align:center}
  /* Miniaturas de la etapa 1 */
  .tsp-etapa-cards-3{position:absolute;left:calc(635 * var(--u));top:calc(439 * var(--u));width:calc(976 * var(--u));height:calc(252 * var(--u));margin:0;grid-template-columns:285fr 327fr 340fr;gap:0 calc(13 * var(--u))}
  .tsp-etapa-cards-3 li,.tsp-etapa-cards-3 picture,.tsp-etapa-cards-3 img{display:block;height:100%;width:100%;aspect-ratio:auto;object-fit:cover}
  /* Tarjetas de las etapas 2 a 5, con la etiqueta dentro */
  .tsp-etapa-cards-4,.tsp-etapa-cards-6{position:absolute;left:calc(380 * var(--u));top:calc(454 * var(--u));width:calc(1205 * var(--u));height:calc(231 * var(--u));margin:0;gap:0 calc(12 * var(--u));grid-template-columns:284fr 284fr 292fr 309fr}
  .tsp-etapa-cards-6{gap:0 calc(11 * var(--u));grid-template-columns:189fr 180fr 175fr 175fr 176fr 255fr}
  .tsp-etapa-cards-4 li,.tsp-etapa-cards-6 li{display:flex;flex-direction:column;min-height:0;padding:calc(2 * var(--u));border:calc(1.5 * var(--u)) solid var(--etapa-borde);background:#000}
  .tsp-etapa-cards-4 p,.tsp-etapa-cards-6 p{flex:none;height:calc(58 * var(--u));padding:calc(16 * var(--u)) 0 0;font-size:calc(17.5 * var(--u));line-height:1.1;white-space:nowrap}
  .tsp-etapa-cards-4 p::after,.tsp-etapa-cards-6 p::after{width:calc(36 * var(--u));margin-top:calc(9 * var(--u))}
  .tsp-etapa-cards-6 li:last-child p{padding-right:calc(88 * var(--u))}
  .tsp-etapa-cards-4 li:last-child p{padding-right:calc(10 * var(--u))}
  .tsp-etapa-cards-4 picture,.tsp-etapa-cards-6 picture{flex:1;min-height:0;display:block}
  .tsp-etapa-cards-4 img,.tsp-etapa-cards-6 img{width:100%;height:100%;aspect-ratio:auto;object-fit:cover}
  /* Panel de pasos de la derecha: negro, con la esquina inferior izquierda redondeada */
  .tsp-etapas{position:absolute;left:calc(1477 * var(--u));right:0;top:0;height:calc(478 * var(--u));margin:0;padding:calc(67 * var(--u)) 0 0 calc(16 * var(--u));gap:calc(47 * var(--u));background:#000;border-bottom-left-radius:calc(24 * var(--u));z-index:5;justify-self:auto}
  .tsp-etapa-1 .tsp-etapas{height:calc(448 * var(--u))}
  .tsp-etapas::before{left:calc(36 * var(--u));top:calc(14 * var(--u));bottom:auto;height:calc(437 * var(--u));width:2px;background:linear-gradient(180deg,var(--amarillo) 0,var(--amarillo) calc(var(--a) * 87 * var(--u) + 20 * var(--u)),rgba(255,255,255,.35) 0)}
  .tsp-etapa-1{--a:1}.tsp-etapa-2{--a:2}.tsp-etapa-3{--a:3}.tsp-etapa-4{--a:4}.tsp-etapa-5{--a:5}
  .tsp .tsp-etapas a{gap:calc(16 * var(--u));font-size:calc(16 * var(--u))}
  .tsp-etapas b{width:calc(40 * var(--u));font-size:calc(15 * var(--u))}
  .tsp .tsp-etapas li:nth-child(4) a{font-size:max(11px,calc(14 * var(--u)))}
  .tsp-etapas li:nth-child(4) span{font-size:max(11px,calc(14 * var(--u)));letter-spacing:-.04em;white-space:nowrap}
  /* Franja de ventajas: 68 px */
  .tsp-etapa>.tsp-ventajas-dentro{position:absolute;left:0;right:0;bottom:0;height:calc(68 * var(--u));margin:0;padding-block:0;border-top:1px solid color-mix(in srgb,var(--amarillo) 20%,transparent);flex-wrap:nowrap;z-index:6}
  .tsp-etapa + .tsp-banda{height:4.96vw}
}
/* Prensa (diapositiva 15): mármol oscuro de fondo, la portada de Ferrari detrás y la doble página recortada delante; solo en escritorio ancho */
.tsp-prensa-marmol,.tsp-prensa-portada{display:none}
/* En móvil (carta del cliente, 15-oct-2026: «en el móvil no se ve la revista Ferrari»): la misma composición, en columna:
   mármol arriba, la portada de Ferrari asomando a la derecha y la doble página recortada delante. */
@media (max-width:900px){
  .tsp-prensa-marmol{display:block;position:absolute;left:0;top:0;width:100%;height:calc(100vw * .9);object-fit:cover;z-index:-4;-webkit-mask-image:linear-gradient(180deg,#000 62%,transparent);mask-image:linear-gradient(180deg,#000 62%,transparent)}
  .tsp-prensa-portada{display:block;position:absolute;right:-7vw;top:2vw;width:46vw;height:auto;z-index:-3;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 12%);mask-image:linear-gradient(90deg,transparent 0,#000 12%)}
  .tsp .tsp-prensa>picture{margin-top:16vw;clip-path:polygon(15.7% 6.2%,33.5% 7.2%,51.6% 10.1%,71.8% 12.5%,95.1% 15.9%,98.8% 53%,98.8% 97%,77% 94.5%,45.8% 90.5%,24% 87%,1.5% 82%,7.8% 42%)}
  .tsp .tsp-prensa .tsp-fondo{object-fit:fill}
}
@media (min-width:1301px){
  .tsp-prensa{--u:calc(100vw / 1672);height:calc(791 * var(--u));min-height:0;align-items:flex-start}
  .tsp-prensa-marmol{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-4}
  .tsp-prensa-portada{display:block;position:absolute;left:calc(1150 * var(--u));top:calc(-86 * var(--u));width:calc(618 * var(--u));height:auto;z-index:-3;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 12%);mask-image:linear-gradient(90deg,transparent 0,#000 12%)}
  .tsp-prensa>picture{inset:auto;left:calc(508 * var(--u));top:calc(139 * var(--u));width:calc(1120 * var(--u));height:calc(630 * var(--u));-webkit-mask-image:none;mask-image:none;clip-path:polygon(15.7% 6.2%,33.5% 7.2%,51.6% 10.1%,71.8% 12.5%,95.1% 15.9%,98.8% 53%,98.8% 97%,77% 94.5%,45.8% 90.5%,24% 87%,1.5% 82%,7.8% 42%)}
  .tsp-prensa .tsp-fondo{object-fit:fill;object-position:center}
  .tsp-prensa::before{background:linear-gradient(90deg,rgba(0,0,0,.55) 0,rgba(0,0,0,.25) 38%,rgba(0,0,0,0) 55%)}
  .tsp-prensa .tsp-slide-texto{width:calc(620 * var(--u));padding:calc(50 * var(--u)) 0 0 calc(80 * var(--u))}
  .tsp-prensa .tsp-eyebrow{font-size:calc(17 * var(--u));margin-bottom:calc(10 * var(--u))}
  .tsp-prensa .tsp-titular{font-size:calc(75.4 * var(--u));line-height:calc(74 * var(--u))}
  /* El texto no pisa la revista (empieza en ~525u) en ningún idioma: el tope del inglés, para todos (16-oct, «España...» la tocaba en castellano) */
  /* D-PERF-164/217/234: la columna de párrafos de la diapositiva 15 parte 3+4+4 con 470 u (con 440 u, 4+4+4) */
  .tsp-prensa .tsp-intro{font-size:calc(19.4 * var(--u));line-height:calc(24 * var(--u));max-width:calc(470 * var(--u))}
  /* En inglés (sin diapositiva propia) los renglones son más largos y pisaban la revista: se queda en 440 u */
  html[lang|="en"] .tsp-prensa .tsp-intro{max-width:calc(440 * var(--u))}
  .tsp-prensa .tsp-tag{font-size:calc(16.6 * var(--u));letter-spacing:.14em;white-space:normal;max-width:calc(440 * var(--u))}
  .tsp-prensa .tsp-pie-foto{font-size:max(11px,calc(13.5 * var(--u)));left:calc(1025 * var(--u));right:auto;top:calc(768 * var(--u));bottom:auto}
}
/* D-PERF-164/217/234: desde 1673 px la columna de 470 u pisa la revista (5/41/108 px a 1800/1920/2400): vuelve a 440 u (puente, opción a) */
@media (min-width:1673px){.tsp-prensa .tsp-intro{max-width:calc(440 * var(--u))}}
/* Los titulares de La marca caben en su columna y no pisan la foto (Víctor, 14-oct: en la diapositiva invaden la foto; en la web tapan la imagen). */
@media (min-width:1200px){
  .tsp-etapa-1 .tsp-etapa-texto .tsp-titular{font-size:calc(55 * var(--u));line-height:calc(55 * var(--u))}
  .tsp-etapa-2 .tsp-etapa-texto .tsp-titular,.tsp-etapa-3 .tsp-etapa-texto .tsp-titular{font-size:calc(70 * var(--u));line-height:calc(69 * var(--u))}
  .tsp-etapa-4 .tsp-etapa-texto .tsp-titular{font-size:calc(73 * var(--u));line-height:calc(72 * var(--u))}
}
/* D-PERF-124 (VS 20-oct) y fila nueva (puente 20-oct, criterio de Víctor 845a45923): «WITHOUT LIMITS.» (etapa 3 en inglés) a 70u pisaba la foto 54-64 px desde 1200 hasta 1440+: de 60u. */
@media (min-width:1200px){
  :lang(en) .tsp-etapa-3 .tsp-etapa-texto .tsp-titular{font-size:calc(60 * var(--u));line-height:calc(60 * var(--u))}
}
/* D-PERF-125/126 (V16, medida sobre lo servido): el titular de la etapa 5 EN pisaba la foto 1 px desde 1200 (93u a 90u) */
@media (min-width:1200px){
  :lang(en) .tsp-etapa-5 .tsp-titular{font-size:calc(90 * var(--u))}
}
/* Antes · Después: la fila de ventajas sobre un degradado oscuro (legible) y sin pisar el asiento (Víctor, 14-oct). */
@media (min-width:901px){
  .tsp-antes-despues::after{content:"";position:absolute;left:0;right:0;bottom:0;height:46%;z-index:1;pointer-events:none;background:linear-gradient(0deg,rgba(0,0,0,.94) 0,rgba(0,0,0,.8) 40%,rgba(0,0,0,0) 100%)}
  .tsp-ad-features{left:5%;right:22%;gap:clamp(8px,1vw,18px)}
  .tsp-ad-features li{min-width:0}
}
/* D-PERF-130 (diapositiva 9, 1920): «ANTES · DESPUÉS» en una línea, entradilla de ~26 px, las cuatro ventajas a ~21 px repartidas de 337 a 1563
   (17,5 % a 81,4 %: acaban donde empieza el asiento, que sigue sin pisarse) y el asiento a la proporción de la diapositiva (299×254). Desde 1200; debajo, como estaba. */
@media (min-width:1200px){
  .tsp-ad-texto .tsp-titular span:first-child{white-space:nowrap}
  .tsp-ad-texto .tsp-intro{font-size:1.354vw;min-height:calc(6em * 1.38)}   /* D-PERF-348: 6 renglones como en español; en inglés son 5 y, con el bloque centrado, el título bajaba ≈14 px (110 a 1440×900) */
  .tsp-ad-features{left:17.5%;right:18.6%}
  .tsp-ad-features li{font-size:1.1vw}
  .tsp-ad-asiento img{aspect-ratio:1/.85}
}
/* Las fotos de fondo llenan su caja y respetan su encuadre (object-position): «.web img{height:auto}» de sistema.css
   las dejaba con su proporción, más altas que la sección, y solo se veía la parte de arriba (sin el Jeep). */
@media (min-width:901px){img.tsp-fondo{height:100%}}
/* Panel de etapas de La marca: aire a la derecha (los rótulos llegaban al borde) y, en la etapa 1, sin pisar la tercera miniatura. */
@media (min-width:1200px){
  .tsp .tsp-etapas a{gap:calc(12 * var(--u));font-size:max(11px,calc(14 * var(--u)))}
  .tsp .tsp-etapas li:nth-child(4) a,.tsp-etapas li:nth-child(4) span{font-size:calc(12.5 * var(--u))}
  .tsp-etapa-1 .tsp-etapas{height:calc(434 * var(--u));gap:calc(40 * var(--u))}
}
@media (min-width:1200px){.tsp-etapa:not(.tsp-etapa-1) .tsp-etapas{height:calc(450 * var(--u));gap:calc(44 * var(--u))}}
@media (min-width:1200px) and (max-width:1439.98px){.tsp .tsp-etapas li:nth-child(4) a,.tsp .tsp-etapas li:nth-child(4) span{font-size:max(11px,calc(12.5 * var(--u)))}}   /* D-PERF-320: suelo 11 px por debajo de 1440; a 1440 manda la diapositiva (10,77 px) */
/* D-PERF-124: a 1200-1300 el rótulo «Transformación» (11 px) se salía de la ventana (1200) o llegaba a 4 px del borde (1280): círculo, hueco y margen del panel algo menores */
@media (min-width:1200px) and (max-width:1300px){
  .tsp .tsp-etapas{padding-left:calc(8 * var(--u))}
  .tsp .tsp-etapas b{width:calc(34 * var(--u));font-size:max(11px,calc(14 * var(--u)))}   /* D-PERF-349: suelo 11 px (a 1280 daba 10,72) */
  .tsp .tsp-etapas a{gap:calc(8 * var(--u))}
}
/* Revisión a 1920 (14-oct): textos laterales legibles sobre fotos claras, círculos de pasos con fondo y el letrero de Dubái entero. */
.tsp-lateral{text-shadow:0 1px 3px rgba(0,0,0,.95),0 0 16px rgba(0,0,0,.8)}
.tsp-pasos b{background:rgba(0,0,0,.6)}
@media (min-width:901px){.tsp-hero-dubai .tsp-fondo{object-position:center 16%}}
@media (min-width:901px){.tsp-hero-venta.tsp-hero-dubai .tsp-fondo{object-position:center 100%}}
@media (min-width:901px){.tsp-hero-config.tsp-hero-dubai .tsp-fondo{object-position:center 72%}}
/* Configurador (diapositiva 13; D-PERF-061/062/071): foto de perfil del Jeep Rubicon con los caballos, ya no a todo el ancho con 614 px negros a la
   izquierda: ocupa el 64 % del ancho, pegada a la derecha, el coche recortado por las ruedas como en la maqueta; el alto crece con el ancho (cabe en 2560×1080). */
@media (min-width:901px){
  .tsp-hero-config{background:#000;min-height:clamp(300px,24vw,640px)}
  .tsp-hero-config .tsp-titular{font-size:4.6vw}   /* «JEEP PERFECTO.» ≈36 % del ancho como en la maqueta (D-PERF-186), sin tope a 2560 */
  .tsp-hero-config .tsp-intro{font-size:1.1vw;line-height:1.25;max-width:25em;margin-top:.8vw}
  .tsp-hero-config .tsp-slide-texto{padding-top:2vw;padding-bottom:1vw}
  .tsp-hero-config .tsp-tag{margin-top:.8vw}
  .tsp-hero-config .tsp-titular{line-height:.8}
  .tsp-hero-config .tsp-eyebrow{margin-bottom:.8vw}
  .tsp-hero-config .tsp-titular::after{margin-top:.8vw}
  .tsp-hero-config>picture{inset:-3vw 0 auto auto;width:64vw;height:auto;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 24%);mask-image:linear-gradient(90deg,transparent 0,#000 24%)}
  .tsp-hero-config.tsp-hero-dubai .tsp-fondo{height:auto;object-fit:fill}
}
/* D-PERF-366 (W46t65 en-1440; es igual): la diapositiva 13 lleva el paisaje (árboles y prado, atenuados) hasta x≈0 bajo el titular; la foto,
   al 64 % y pegada a la derecha, dejaba negro liso el 36 % de la izquierda. Debajo de ella, la misma foto ampliada por su esquina de árboles,
   desenfocada y oscurecida, llena la izquierda sin agrandar el Jeep ni repetirlo; se funde con la foto por su máscara. */
@media (min-width:901px){
  /* ?v= a mano (en CSS no hay asset()): si cambia config-hero-1280.webp, sube el número (VersionDeMediosEnMarcasTest, regresión de la 366) */
  .tsp-hero-config::after{content:"";position:absolute;inset:0 auto 0 0;width:58vw;z-index:-3;pointer-events:none;background:url(web/config-hero-1280.webp?v=1) 0 18%/150vw auto no-repeat;filter:blur(6px) brightness(.55);-webkit-mask-image:linear-gradient(90deg,#000 70%,transparent);mask-image:linear-gradient(90deg,#000 70%,transparent)}
}
/* Configurador (diapositiva 13; D-PERF-063): las miniaturas son planos cerrados (manijas, motor con «Jeep», llanta, neumático con «BFGoodrich», amortiguador, parrilla, asiento, logo), no el coche entero: se amplían dentro de su marco. */
.tsp-cols-9 picture{display:block;overflow:hidden}
.tsp-cols-9 li:nth-child(1) img{transform:scale(1.55);transform-origin:45% 50%}
.tsp-cols-9 li:nth-child(2) img{transform:scale(1.7);transform-origin:50% 45%}
.tsp-cols-9 li:nth-child(4) img{transform:scale(1.6);transform-origin:35% 55%}
.tsp-cols-9 li:nth-child(5) img{transform:scale(1.7);transform-origin:62% 40%}
.tsp-cols-9 li:nth-child(6) img{transform:scale(1.5);transform-origin:50% 45%}
.tsp-cols-9 li:nth-child(7) img{transform:scale(1.55);transform-origin:40% 50%}
.tsp-cols-9 li:nth-child(8) img{transform:scale(1.3);transform-origin:50% 60%}
.tsp-cols-9 li:nth-child(9) img{transform:scale(1.35);transform-origin:55% 45%}
/* Selector de idioma del Configurador (diapositiva 13; D-PERF-239): «ES» del tamaño del menú y en regular, globo de ~20 px. */
@media (min-width:1101px){.tsp-p-config .tsp-idioma{font-weight:400;font-size:clamp(11.5px,.97vw,15.5px)}.tsp-p-config .tsp-idioma .tsp-icono{width:1.6em;height:1.6em}}
@media (min-width:901px){.tsp-hero-dubai .tsp-lateral-alto{left:40%}}
/* Fichas de modelo: las fotos ya no llevan texto pintado (limpias el 14-oct), así que las frases salen como texto de la web, en su idioma, donde las pone el diseño. */
@media (min-width:901px){
  .tsp-hero-ficha .tsp-lateral,.tsp-bloque .tsp-lateral{position:absolute!important;width:auto;height:auto;overflow:visible;clip:auto;white-space:normal;margin:0;z-index:3;font:400 clamp(12px,1vw,18px)/1.38 var(--cuerpo);letter-spacing:.06em;text-transform:uppercase;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.9),0 0 18px rgba(0,0,0,.7)}
  .tsp-hero-ficha .tsp-lateral{left:auto;right:2.4vw;top:2.4vw;bottom:auto;max-width:15em;padding-left:1vw;border-left:1px solid var(--ficha-raya)}
  .tsp-hero-ficha .tsp-lateral-abajo{top:auto;bottom:2.4vw;padding-left:0;border-left:0;text-align:right}
  .tsp-bloque .tsp-lateral{left:auto;right:2.6vw;top:auto;bottom:2.4vw;max-width:14em;padding:0;border:0;text-align:right;letter-spacing:.14em;font-size:clamp(11px,.9vw,16px)}
}
@media (min-width:901px){.tsp-hero-ficha .tsp-lateral{font-size:clamp(13px,1.15vw,22px)}}
/* D-PERF-353: en Expedition el lema va como en la ficha aprobada, a la derecha en 3 líneas estrechas y por encima de la baca (con 15em y 2,4vw tapaba el 4.º foco). */
@media (min-width:901px){.tsp-hero-expedition .tsp-lateral:not(.tsp-lateral-abajo){top:1.2vw;max-width:11em;font-size:clamp(12px,1vw,18px);text-align:right}}
/* D-PERF-375: el segundo lateral («Explore without limits.») en una sola línea, sin la viuda «LIMITS.» que dejaba el max-width heredado */
@media (min-width:901px){.tsp-hero-expedition .tsp-lateral-abajo{max-width:none;white-space:nowrap}}
/* Detalle ancho de Expedition (14): la foto es una tira de 6:1 con los dos Jeep; en su casilla ancha entera, sin recortar los coches, con el cielo y el suelo de la propia foto a los lados. */
/* D-PERF-360: sin bandas pintadas; en su casilla doble, 3,45:1 (iguala la fila; recorta 25 px de suelo por lado), y en una columna con su proporción (1448×405). */
.tsp-det-ancho .tsp-det-foto img{object-fit:cover;aspect-ratio:3.45/1}
@media (max-width:560px){.tsp-det-ancho{grid-column:auto}.tsp-det-ancho .tsp-det-foto img{aspect-ratio:1448/405}}
.tsp .tsp-pie-legal a{text-decoration:underline;text-underline-offset:2px;text-decoration-thickness:1px}
/* Ficha técnica del vehículo en texto (en el idioma de la página), con el estilo de la ficha en imagen del cliente. */
.tsp-ficha-datos{margin-top:clamp(14px,1.6vw,26px);padding:clamp(18px,2.4vw,40px);border:1px solid var(--borde-oro);background:linear-gradient(180deg,#0b0b0b,#000);display:grid;gap:clamp(16px,1.8vw,28px)}
.tsp-fd-marca{font:700 clamp(18px,1.8vw,30px)/1.1 var(--titulo);letter-spacing:.04em}
.tsp-fd-marca span:last-child{display:block;margin-top:.3em;font:400 clamp(13px,1.1vw,18px)/1.3 var(--cuerpo);font-style:italic;color:var(--oro)}
.tsp-fd-base{margin-top:clamp(8px,1vw,14px);font-size:clamp(11px,.85vw,14px);letter-spacing:.08em;color:var(--suave)}
.tsp-fd-base span{display:block}
.tsp-fd-base b{color:var(--oro);font-weight:500}
.tsp-fd-cab h3{margin-top:clamp(10px,1.2vw,18px);font:500 clamp(13px,1.1vw,18px)/1.3 var(--cuerpo);letter-spacing:.06em;text-transform:uppercase;color:var(--oro)}
.tsp-fd-cab>p:last-child{margin-top:6px;font-size:clamp(13px,1vw,16px);color:var(--suave)}
.tsp-fd-spec{display:grid;gap:clamp(8px,.9vw,14px)}
.tsp-fd-spec-5{grid-template-columns:repeat(5,1fr)}
.tsp-fd-spec-4{grid-template-columns:repeat(4,1fr)}
.tsp-fd-spec div{padding:clamp(8px,.9vw,14px);border:1px solid var(--borde-oro)}
.tsp-fd-spec dt{font-size:clamp(10px,.75vw,12px);letter-spacing:.12em;text-transform:uppercase;color:var(--oro)}
.tsp-fd-spec dd{margin:4px 0 0;font:500 clamp(13px,1.05vw,17px)/1.25 var(--cuerpo);color:#fff}
.tsp-fd-listas{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2.4vw,40px)}
.tsp-fd-listas h3,.tsp-fd-titulo-det{font:500 clamp(12px,.95vw,15px)/1.2 var(--cuerpo);letter-spacing:.1em;text-transform:uppercase;color:var(--oro);padding-bottom:8px;border-bottom:1px solid var(--borde-oro)}
.tsp-fd-listas ul{display:grid;gap:7px;margin-top:10px}
.tsp-fd-listas li{position:relative;padding-left:16px;font-size:clamp(13px,1vw,16px);line-height:1.35;color:#fff}
.tsp-fd-listas li::before{content:"";position:absolute;left:2px;top:.55em;width:5px;height:5px;border-radius:50%;background:var(--oro)}
.tsp-fd-pie{display:grid;grid-template-columns:1fr auto;gap:clamp(14px,2vw,32px);align-items:center}
.tsp-fd-garantia{display:grid;gap:10px}
.tsp-fd-garantia p{padding:clamp(10px,1vw,16px);border:1px solid var(--borde-oro);font-size:clamp(12px,.95vw,15px);line-height:1.4;color:var(--suave)}
.tsp-fd-garantia b{color:#fff;letter-spacing:.06em;text-transform:uppercase}
.tsp-fd-precio{display:grid;place-items:center;align-content:center;width:clamp(120px,10vw,168px);aspect-ratio:1;border:3px solid var(--oro);border-radius:50%;text-align:center}
.tsp-fd-precio small{font-size:clamp(9px,.7vw,11px);letter-spacing:.14em;text-transform:uppercase;color:var(--suave)}
@media (max-width:1439.98px){.tsp-fd-spec dt,.tsp-fd-precio small{font-size:11px}}   /* suelo 11 px por debajo de 1440; a 1440 como la diapositiva (puente 1435.) */
.tsp-fd-precio strong{font:700 clamp(17px,1.5vw,24px)/1.1 var(--cuerpo);color:#fff}
.tsp-fd-detalles{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(10px,1.2vw,20px)}
.tsp-fd-detalles li{display:flex;gap:12px;padding:clamp(10px,1vw,16px);border:1px solid var(--borde-oro)}
.tsp-fd-detalles b{flex:none;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--ficha-punto);color:#000;font:600 13px/1 var(--cuerpo)}
.tsp-fd-detalles h4{margin:0;font:500 clamp(12px,.95vw,15px)/1.25 var(--cuerpo);letter-spacing:.04em;text-transform:uppercase;color:#fff}
.tsp-fd-detalles p{margin:4px 0 0;font-size:clamp(12px,.9vw,14px);line-height:1.4;color:var(--suave)}
.tsp-fd-cierre{text-align:center;font:italic 700 clamp(13px,1.2vw,19px)/1.3 var(--titulo);letter-spacing:.06em;text-transform:uppercase;color:var(--oro)}
@media (max-width:900px){.tsp-fd-spec-5{grid-template-columns:repeat(3,1fr)}.tsp-fd-spec-4{grid-template-columns:repeat(2,1fr)}.tsp-fd-detalles{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.tsp-fd-spec-5,.tsp-fd-spec-4,.tsp-fd-listas,.tsp-fd-detalles{grid-template-columns:1fr}.tsp-fd-pie{grid-template-columns:1fr;justify-items:center}.tsp-fd-spec-5{grid-template-columns:1fr 1fr}.tsp-fd-spec-4{grid-template-columns:1fr 1fr}}
@media (max-width:900px){.tsp-intro br{display:none}}
/* Inicio a 901-1300 (W7, 19-oct: el párrafo del héroe pisaba la parrilla y la matrícula del Jeep, y «en Dubái» se quedaba solo): la foto empieza
   más a la derecha, el párrafo es más estrecho y sin el salto fijo (el de la diapositiva a 1440). */
@media (min-width:901px) and (max-width:1199.98px){
  /* D-PERF-172/275/283: el indicador de etapas tiene su columna a su medida (no pisa la foto) y letra de 12 px como en la maqueta */
  .tsp-etapa{grid-template-columns:minmax(0,34%) minmax(0,1fr) max-content}
  .tsp .tsp-etapas a{font-size:12px}
  .tsp-etapa-texto .tsp-titular{font-size:3.3vw}
  .tsp-etapas b{width:30px;font-size:12px}
}
@media (min-width:901px) and (max-width:1300px){
  .tsp-slide-a picture{width:62%}
  .tsp-slide-a .tsp-intro{max-width:22em}
  .tsp-slide-a .tsp-intro br{display:none}
  /* D-PERF-316: las seis tarjetas de la etapa 02 llegan, como en la diapositiva, hasta el borde derecho (por debajo del indicador de etapas): ≥145 px cada una a 1280 */
  .tsp-etapa-2 .tsp-etapas{grid-row:1}
  .tsp-etapa-cards-6{grid-column:1/-1;gap:0 8px}
}
/* D-PERF-117 (diapositiva 1): de 1101 a 1300 la foto del héroe con la medida de la diapositiva (70,8 % del ancho desde x≈394 a 1280, encuadre al 54 %):
   con el 62 % de arriba el Jeep salía 0,88 veces el de la diapositiva y 90 px más a la derecha. Medido: 0 px de Jeep bajo las líneas del titular,
   el párrafo y los botones a 1101/1200/1280/1300 es/en. */
@media (min-width:1101px) and (max-width:1300px){.tsp-slide-a picture{width:70.8vw;inset:0 -1.6vw 0 auto}.tsp-slide-a .tsp-fondo{object-position:25% 54%}}
@media (max-width:900px){.tsp-glance b{font:600 clamp(16px,4.6vw,22px)/1.2 var(--cuerpo);font-variant-numeric:lining-nums}.tsp-hero-ficha .tsp-lateral{max-width:20em}}
@media (max-width:900px){.tsp-titular span{text-wrap:balance}}
@media (max-width:560px){.tsp-acciones .tsp-boton-grande{width:100%;justify-content:center}}

/* Área privada · Clientes (diapositiva 17): los datos para el contrato, con el enlace privado del cliente */
.tsp-contrato .tsp-slide-texto{width:min(100%,46%)}
.tsp-contrato .tsp-titular{font-size:clamp(34px,4.7vw,84px)}
.tsp-contrato .tsp-titular::after{content:"";display:block;width:clamp(44px,4.2vw,74px);height:2px;background:var(--oro);margin-top:clamp(12px,1.4vw,24px)}
.tsp-contrato .tsp-intro{font-size:clamp(14px,1.2vw,20px);max-width:24em;margin-top:clamp(14px,1.6vw,26px)}
.tsp-pasos-v{display:grid;gap:clamp(12px,1.2vw,20px);margin:clamp(18px,2vw,32px) 0}
.tsp-pasos-v li{display:flex;align-items:center;gap:clamp(14px,1.6vw,26px);font:400 clamp(12px,1.05vw,18px)/1.2 var(--cuerpo);letter-spacing:.14em;text-transform:uppercase}
.tsp-pasos-v b{display:grid;place-items:center;flex:none;width:clamp(34px,3.3vw,56px);aspect-ratio:1;border:2px solid var(--amarillo);border-radius:50%;background:rgba(0,0,0,.6);color:var(--amarillo);font:400 clamp(13px,1.3vw,22px)/1 var(--cuerpo);letter-spacing:.04em}
.tsp-contrato .tsp-recibiras{margin-top:0;max-width:20em}
.tsp-invitacion{display:flex;align-items:center;gap:clamp(12px,1.2vw,20px);margin-top:clamp(18px,2vw,34px);font:400 clamp(13px,1.1vw,18px)/1.3 var(--cuerpo)}
.tsp-invitacion .tsp-icono{width:clamp(26px,2.4vw,40px);height:clamp(26px,2.4vw,40px);color:var(--oro);padding-right:clamp(12px,1.2vw,20px);box-sizing:content-box;border-right:1px solid var(--linea)}
.tsp-contrato .tsp-contacto-form{width:clamp(320px,41vw,720px);padding:clamp(18px,2.2vw,38px);margin:clamp(20px,2.4vw,40px) 0}
.tsp-contrato .tsp-form-titulo{font-size:clamp(22px,2.4vw,44px);line-height:1;margin-bottom:clamp(6px,.8vw,12px)}
.tsp-contrato>picture{inset:0 auto 0 0;width:100%;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 30%);mask-image:linear-gradient(90deg,transparent 0,#000 30%)}
.tsp-contrato::before{background:linear-gradient(90deg,rgba(0,0,0,.82) 0,rgba(0,0,0,.45) 36%,rgba(0,0,0,0) 62%)}
.tsp-form-contrato .tsp-consentimiento-texto{flex:1;min-width:0}
.tsp-form-sub{color:var(--eyebrow);font:400 clamp(11px,1vw,17px)/1.3 var(--cuerpo);letter-spacing:.22em;text-transform:uppercase;margin:0 0 clamp(14px,1.6vw,26px)}
.tsp-conmutador{display:grid;grid-template-columns:1fr 1fr;gap:clamp(8px,.8vw,12px);border:0;padding:0;margin:0 0 clamp(10px,1vw,16px);min-width:0}
.tsp-conmutador label{position:relative;display:grid;place-items:center;min-height:clamp(44px,3.6vw,58px);border:1px solid var(--borde-oro);font:400 clamp(13px,1.15vw,19px)/1 var(--cuerpo);text-transform:uppercase;cursor:pointer}
.tsp-conmutador input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer}
.tsp-conmutador label:has(input:checked){background:var(--boton-fondo);border-color:var(--boton-borde);color:#14100a}
.tsp-conmutador label:has(input:focus-visible){outline:3px solid var(--amarillo);outline-offset:3px}
.tsp-form-contrato .tsp-campos{gap:clamp(8px,.9vw,14px)}
.tsp-form-contrato .tsp-campo{position:relative}
.tsp-form-contrato .tsp-caja{display:block;position:relative}
.tsp-form-contrato .tsp-etiqueta{position:absolute;left:clamp(14px,1.3vw,20px);top:50%;transform:translateY(-50%);margin:0;max-width:calc(100% - 28px);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;pointer-events:none;color:#e9e9e9;font:400 clamp(11px,.9vw,14px)/1 var(--cuerpo);letter-spacing:.14em;transition:top .12s,font-size .12s}
.tsp-form-contrato .tsp-campo:has(input:focus) .tsp-etiqueta,.tsp-form-contrato .tsp-campo:has(input:not(:placeholder-shown)) .tsp-etiqueta{top:10px;transform:none;font-size:10px;color:var(--eyebrow)}
.tsp-form-contrato input:not([type=checkbox]):not([type=radio]){min-height:clamp(44px,3.6vw,56px);padding:clamp(17px,1.4vw,21px) clamp(14px,1.3vw,20px) 5px}
.tsp-form-contrato .tsp-fila{gap:clamp(8px,.9vw,14px)}
.tsp-form-contrato input[aria-invalid=true]:not([type=checkbox]){border-color:#ff8a7a}
.tsp-form-contrato input[type=checkbox][aria-invalid=true]{border-color:#ff8a7a}
.tsp-solo-empresa{display:none}
.tsp-form-contrato:has(input[value=empresa]:checked) .tsp-solo-particular{display:none}
.tsp-form-contrato:has(input[value=empresa]:checked) div.tsp-solo-empresa{display:grid;gap:clamp(8px,.9vw,14px)}
.tsp-form-contrato:has(input[value=empresa]:checked) span.tsp-solo-empresa{display:inline}
.tsp-referencia{display:flex;align-items:center;gap:clamp(10px,1vw,16px);min-height:clamp(42px,3.4vw,52px);padding:0 clamp(12px,1.1vw,18px);margin-top:clamp(4px,.6vw,10px);border:1px solid rgba(255,255,255,.55);background:rgba(255,255,255,.04);font:400 clamp(11px,.9vw,14px)/1.3 var(--cuerpo);letter-spacing:.12em;text-transform:uppercase}
.tsp-referencia .tsp-icono{width:20px;height:20px;color:var(--oro)}
.tsp-referencia b{color:var(--amarillo);font-weight:500}
.tsp-nota{margin-top:clamp(10px,1vw,16px);font:300 clamp(11px,.9vw,14px)/1.4 var(--cuerpo);color:#e4e4e4}
.tsp-devuelto{margin:0 0 clamp(10px,1vw,16px);padding:10px 14px;border-left:3px solid var(--oro);background:color-mix(in srgb,var(--oro-claro) 9%,transparent);font-size:14px}
.tsp-contrato-estado{display:flex;flex-direction:column;align-items:flex-start;gap:clamp(12px,1.2vw,20px);padding:clamp(8px,1vw,16px) 0}
.tsp-contrato-estado .tsp-icono{width:clamp(44px,4vw,64px);height:clamp(44px,4vw,64px);color:var(--amarillo)}
@media (max-width:900px){
  .tsp-contrato .tsp-contacto-form{width:auto;margin:0 var(--lado) 28px}
  .tsp-contrato .tsp-slide-texto{width:auto}
  .tsp-contrato .tsp-titular{font-size:clamp(34px,10vw,56px)}
  .tsp-contrato>picture{inset:auto;width:auto;-webkit-mask-image:none;mask-image:none}
  .tsp-contrato::before{display:none}
  .tsp-pasos-v li{letter-spacing:.1em}
}

/* Textos legales (aviso legal, privacidad, cookies) dentro de la web de SS Performance */
.tsp-legal{width:100%;max-width:860px;margin:0 auto;padding:clamp(32px,5vw,80px) var(--lado) clamp(40px,6vw,100px);line-height:1.65}
.tsp-legal h1{font-size:clamp(28px,3.4vw,52px);line-height:1.1;margin:0 0 .7em;color:var(--amarillo)}
.tsp-legal h2{font-size:clamp(20px,1.7vw,28px);margin:1.6em 0 .5em;color:var(--amarillo)}
.tsp-legal p,.tsp-legal li{font-size:clamp(15px,1.05vw,18px);color:var(--suave)}
.tsp-legal .cookies-cambiar{margin:1.2em 0 0}
.tsp-legal .cookies-cambiar button{min-height:44px;padding:0 1.4rem;border:1px solid var(--amarillo);background:transparent;color:var(--amarillo);font-weight:600;font-size:clamp(14px,1vw,16px);line-height:1;font-family:inherit;cursor:pointer}
.tsp-legal .cookies-cambiar button:hover{background:color-mix(in srgb,var(--amarillo) 12%,transparent)}
.tsp-legal a{color:var(--amarillo);overflow-wrap:anywhere}
/* D-PERF-321: la tabla «Cookies que usa esta web», en móvil, una ficha por cookie (cada dato con su rótulo), como en SS AI y Filmbase:
   a 390 medía 492 px y el body la recortaba (no se veían «Duración» entera ni «Tipo»). En escritorio se queda como estaba. */
@media (max-width:600px){
  .tsp-legal .cookies-lista table,.tsp-legal .cookies-lista tbody{display:block;width:100%;min-width:0}
  .tsp-legal .cookies-lista thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .tsp-legal .cookies-lista tr{display:block;margin:0 0 1rem;padding:0 0 .8rem;border-bottom:1px solid color-mix(in srgb,var(--amarillo) 25%,transparent)}
  .tsp-legal .cookies-lista th[scope=row],.tsp-legal .cookies-lista td{display:block;text-align:left;padding:.15rem 0;overflow-wrap:anywhere}
  .tsp-legal .cookies-lista td::before{content:attr(data-label) ": ";font-weight:600;color:var(--amarillo)}
}
/* Página de error de la marca (templates/publico/performance/error.html.twig): el texto legal con el código sobre el título y alto mínimo. */   /* V9 form-performance-contrato: solo la página de error; el aviso «Revisa los campos marcados.» del formulario también es .tsp-error y heredaba los 540 px */
.tsp-legal.tsp-error{min-height:min(60vh,560px)}
.tsp-legal.tsp-error .tsp-error-codigo{margin:0 0 .6em;font-size:clamp(14px,1.1vw,18px);letter-spacing:.18em;color:var(--suave)}
/* Con el aviso de cookies abierto, el pie (y sus enlaces legales) se puede alcanzar: el aviso es fijo y no los tapa. */
body:has(.aviso-cookies){padding-bottom:90px}
@media (max-width:1100px){body:has(.aviso-cookies){padding-bottom:130px}}
@media (max-width:700px){body:has(.aviso-cookies){padding-bottom:190px}}
/* D-PERF-343 (V15): entre 701 y 1300 el texto del aviso va en su fila y Configurar/Aceptar/Rechazar juntos debajo (a 1024 «Reject» caía solo
   en la 2.ª fila); de 1101 a 1300 el aviso pasa a dos filas, así que el pie deja el mismo hueco que hasta 1100. */
@media (min-width:701px) and (max-width:1300px){body:has(.tsp) .aviso-cookies p{flex:1 1 100%;max-width:none;text-align:center}}
@media (min-width:1101px) and (max-width:1300px){body:has(.aviso-cookies){padding-bottom:130px}}
/* El enlace «Política de cookies» del aviso, del tamaño de su frase (D-PERF-052: salía a 20px junto a un texto de 14px). */
.aviso-cookies p a{font:inherit;letter-spacing:inherit}
/* Con el aviso abierto, el menú del móvil (y el apaisado) se puede desplazar hasta su último botón por encima del aviso (D-PERF-053). */
@media (max-width:1100px){body:has(.aviso-cookies) .tsp-menu{padding-bottom:calc(28px + 130px)}}
@media (max-width:700px){body:has(.aviso-cookies) .tsp-menu{padding-bottom:calc(28px + 190px)}}

/* La Marca en el móvil estrecho: los cinco números y el nombre de la etapa activa en una sola fila (a 390, «04 TRANSFORMACIÓN 05» bajaba a otra línea). */
@media (max-width:420px){
  .tsp-etapas{flex-wrap:nowrap;gap:10px 8px}
  .tsp .tsp-etapas a{gap:7px}
  .tsp-etapas b{width:32px}
  .tsp-etapas .tsp-etapa-activa span{font-size:11px;letter-spacing:0;white-space:nowrap}
  .tsp-pie-foto{text-wrap:balance}   /* a 11 px el pie de /press ya no cabe en una línea: dos equilibradas, sin palabra sola (puente, D-PERF-320) */
}

/* Contacto (diapositiva 16) y Prensa (15, D-PERF-111/118/120): en su página, «Contacto» o «Prensa» del menú es un botón dorado junto a «Consulta privada». */
@media (min-width:1101px){
  .tsp-p-contacto .tsp-menu ul a[aria-current],.tsp-p-prensa .tsp-menu ul a[aria-current]{padding:clamp(9px,.9vw,14px) clamp(12px,1.2vw,22px);background:var(--boton-fondo);border:1px solid var(--boton-borde);color:#14100a;font-weight:500;margin:-1px 0}
  .tsp-p-contacto .tsp-menu ul a[aria-current]:hover,.tsp-p-prensa .tsp-menu ul a[aria-current]:hover{color:#14100a;filter:brightness(1.1)}
  .tsp-p-contacto .tsp-menu,.tsp-p-prensa .tsp-menu{gap:clamp(6px,.45vw,10px)}
  .tsp-p-contacto .tsp-idioma,.tsp-p-prensa .tsp-idioma{margin-left:clamp(6px,1.1vw,20px)}
}
@media (min-width:1301px){.tsp-p-contacto .tsp-menu ul a[aria-current],.tsp-p-prensa .tsp-menu ul a[aria-current]{padding:.75vw 1.1vw}}
/* Revisión de las fichas (994., V7, 19-oct): los rótulos sobre foto (solo el Expedition los lleva en su maqueta del 16-oct), con un
   velo detrás para que se lean sobre el cielo claro. */
@media (min-width:901px){
  .tsp-hero-ficha .tsp-lateral,.tsp-bloque .tsp-lateral{background:linear-gradient(90deg,rgba(0,0,0,.6),rgba(0,0,0,.42));padding:.45em .75em;font-weight:500}
}
/* Revisión cruzada p15d del Inicio (19-oct, V9 decide): (3) hasta 900 px las etapas del proceso, en vertical con número y nombre
   (a 768 se recortaban y a 390 solo quedaban 01-05); (2) a 390 el titular sin «CREADO» huérfano; (4) a 1440 las etapas sobre la
   foto, con el velo de los rótulos de las fichas; (5) entre 901 y 1300 el párrafo del héroe sin pisar la parrilla del Jeep. */
@media (max-width:900px){
  .tsp-pasos{flex-direction:column;align-items:flex-start;gap:12px;width:100%}
  .tsp-pasos li,.tsp-pasos li:not(:last-child){flex:none;white-space:normal}
  .tsp-pasos li:not(:last-child)::after{display:none}
  .tsp-pasos li span{position:static;width:auto;height:auto;overflow:visible;clip:auto}
}
@media (max-width:560px){.tsp-slide-a .tsp-titular{font-size:clamp(24px,7.4vw,34px)}}
/* D-PERF-368: desde 1715 px (donde topaban los clamp de 18 px y 48 px) el rótulo y el círculo de los pasos de «Nuestro proceso» siguen creciendo
   con el ancho como el párrafo (1,32vw): a 2560 la misma proporción que a 1440 y la diapositiva 3 (rótulo 0,8 del párrafo), antes 18 frente a 33,8 px; 1,07vw y no 1,05vw porque 26,9/33,8 = 0,795 quedaba bajo el 0,8 pedido. */
@media (min-width:1715px){.tsp-slide-c .tsp-pasos li{font-size:1.07vw}.tsp-slide-c .tsp-pasos b{width:2.8vw}}
@media (min-width:1301px){.tsp-slide-c .tsp-pasos li span{background:linear-gradient(90deg,rgba(0,0,0,.6),rgba(0,0,0,.42));padding:.35em .55em}}
/* D-PERF-318/319: de 1101 a 1300 la 3.ª diapositiva también encuadra el Jeep a center 84 % (la fila de pasos sobre las ruedas, como la diapositiva 3 y como
   desde 1301) y los pasos llevan el mismo fondo; con center 60 % la fila caía sobre el techo claro del coche a 1280. */
@media (min-width:1101px) and (max-width:1300px){.tsp-slide-c .tsp-fondo{object-position:center 84%}.tsp-slide-c .tsp-pasos li span{background:linear-gradient(90deg,rgba(0,0,0,.6),rgba(0,0,0,.42));padding:.35em .55em}}
@media (min-width:901px) and (max-width:1300px){.tsp-slide-a .tsp-intro{max-width:34vw}}
/* Revisión móvil de la V7 (19-oct, 02-copias/webs-revision/performance/movil/): (1) el «×» y las flechas de la lupa, de 44×44 como poco
   (.tsp button les ponía width:auto: el «×» medía 8 px de ancho); (3) el pie, legible y con enlaces de 44 px de alto; (4) el idioma, 44 px;
   (5) el texto de las tarjetas de detalle de las fichas, de cuerpo (14 px). */
/* 19-oct (W8): .tsp button{font:inherit} (0,1,1) ganaba al font-size de .tsp-cerrar y .tsp-lupa-nav (0,1,0): el «×» y las flechas salían a 16 px. */
.tsp .tsp-cerrar{display:grid;place-items:center;width:44px;height:44px;font-size:32px}
.tsp .tsp-lupa-nav{display:grid;place-items:center;width:100%;min-width:44px;min-height:44px;font-size:clamp(40px,5vw,72px)}
@media (max-width:900px){
  .tsp-pie-lema,.tsp-pie-der{font-size:12px}
  .tsp-pie-legal{font-size:13px}
  .tsp .tsp-pie-legal a{display:inline-block;min-height:44px;line-height:44px;padding:0 4px}
  /* D-PERF-106: con los enlaces en inline-block el renglón se partía entre el «·» y su enlace, y quedaba un punto suelto al principio o al final de la línea (es 320-430, en 320-430). En móvil y tableta: el © en su línea y los tres enlaces separados por aire, sin puntos (siguen en el HTML, de ancho 0); desde 901 px, como antes. */
  .tsp-pie-legal span{display:inline-block}
  .tsp-pie-legal .tsp-pie-copy{display:block}
  .tsp-pie-legal .tsp-pie-sep{display:inline-block;width:0;overflow:hidden;visibility:hidden}
  .tsp-pie-legal span:not(.tsp-pie-copy){margin:0 .45em}
  .tsp-idioma{min-height:44px}
  .tsp-detalles li p{font-size:14px}
}
/* D-PERF-329: a ≤480 px el lema de la derecha del pie («Conduce con un estándar superior» en las fichas) partía en 2 líneas a 360-414 y el filete
   quedaba colgado con 20 px: con el espaciado a .13em (la letra se queda en 12 px, el mínimo del pie en móvil) cabe en una línea desde 360 con su filete. */
@media (max-width:480px){
  .tsp-pie-der{letter-spacing:.13em}
}
/* El aviso de cookies usa la letra de la marca (Outfit): con la de la web principal (Proxima Nova) el navegador bajaba proximanova_regular.ttf (181 KB) solo para él. */
body .aviso-cookies,body .aviso-cookies a,body .aviso-cookies button{font-family:"TSP Cuerpo",Outfit,"Segoe UI",Arial,sans-serif}
/* D-PERF-322: el enlace del aviso lleva la letra de su párrafo (el «.elementor-kit-7 a{font-size:20px}» de la web antigua lo subía a 20 px y abría hueco entre las líneas a 390). */
body .aviso-cookies a{font-size:inherit;line-height:inherit}

/* D-PERF-308 (diapositiva 15): el lema de Prensa se partía en dos líneas y dejaba un «·» colgado («PERSONALIZACIÓN ·» / «INGENIERÍA»).
   Cada parte va entera; bajo 1440 se parte entre partes, sin punto (queda en el HTML, de ancho 0). Desde 1440, en UNA línea como la
   diapositiva: acaba junto a la esquina de la doble página sin pisar su parte visible (clip-path; medido es/en 1440, 1672, 1920 y 2400). */
.tsp-prensa .tsp-tag>span{display:inline-block;white-space:nowrap}
.tsp-prensa .tsp-tag>.tsp-tag-sep{display:inline-block;width:0;overflow:hidden;visibility:hidden}
.tsp-prensa .tsp-tag>span:not(:last-child){margin-right:.9em}
@media (min-width:1440px){
  .tsp-prensa .tsp-tag{white-space:nowrap;max-width:none}
  .tsp-prensa .tsp-tag>.tsp-tag-sep{display:inline;width:auto;overflow:visible;visibility:visible}
  .tsp-prensa .tsp-tag>span:not(:last-child){margin-right:0}
}

/* Dubái, D-PERF-087 (V15): el título de cada columna cabe en UNA línea a 1440 y 1024 (diapositiva 11), así las cuatro imágenes empiezan a la misma altura */
@media (min-width:901px){
  ol.tsp-cols-4 li{container-type:inline-size}
  ol.tsp-cols-4 h2{white-space:nowrap;font-size:clamp(9px,4.4cqi,23px)}
  ol.tsp-cols-4 h2 b{font-size:1.9em}
}
/* Dubái, D-PERF-088 (V15, solo la página Dubái, no Venta ni Configurador): rótulo del edificio plano en 3 líneas y la foto con las ruedas del coche dentro (diapositiva 11) */
@media (min-width:901px){
  .tsp-hero-dubai:not(.tsp-hero-venta):not(.tsp-hero-config):not(.tsp-hero-viaje) .tsp-lateral-alto{transform:none;white-space:nowrap;max-width:none}
  .tsp-hero-dubai:not(.tsp-hero-venta):not(.tsp-hero-config):not(.tsp-hero-viaje) .tsp-fondo{object-position:center 65%}
}
/* Dubái, D-PERF-089 (V15; solo la página Dubái, columnas y banda de la diapositiva 11; el hero se queda: las ruedas del coche mandan, 088) */
@media (min-width:901px){
  .tsp-p-dubai ol.tsp-cols-4{padding-top:clamp(12px,1.2vw,20px);padding-bottom:clamp(12px,1.2vw,20px)}
  .tsp-p-dubai ol.tsp-cols-4 img{aspect-ratio:2.6/1}
  .tsp-p-dubai ol.tsp-cols-4 p{margin-top:clamp(6px,.7vw,11px)}
  .tsp-p-dubai .tsp-banda{padding-top:clamp(10px,1.2vw,18px);padding-bottom:clamp(10px,1.2vw,18px)}
}
/* Dubái, D-PERF-090 (V15): rayas doradas largas a los lados del lema y tras «Eleva tu forma de conducir», sin pisar el texto a 1024 */
@media (min-width:901px){
  .tsp-p-dubai .tsp-banda{grid-template-columns:1.4fr 1fr}
  .tsp-p-dubai .tsp-banda .tsp-pie-lema{letter-spacing:.16em;gap:1.6vw}
  .tsp-p-dubai .tsp-banda .tsp-pie-der{letter-spacing:.2em}
}
/* Dubái, D-PERF-091 (V15; solo la diapositiva 12 de Dubái): títulos de tarjeta, «04. Creado en Dubái» y el «SS Performance» del pie en AMARILLO, «Global.» en dorado claro */
.tsp-p-dubai .tsp-cols-logistica h2,.tsp-p-dubai .tsp-hero-viaje .tsp-eyebrow,.tsp-p-dubai .tsp-pie .tsp-pie-lema{color:var(--amarillo)}
.tsp-p-dubai .tsp-hero-viaje .tsp-titular .tsp-oro{color:var(--dubai-oro)}
/* Dubái, D-PERF-085 (V15): ningún texto de «Un viaje global» por debajo de 11 px y el cuerpo de las tarjetas ≥13 px (≥14 a 1440), sin pisar los pasos a 1024 */
.tsp-p-dubai .tsp-cols-logistica p{font-size:max(13px,.98vw)}
.tsp-p-dubai .tsp-cols-logistica .tsp-cols-sub{font-size:max(11px,.9vw)}
@media (min-width:901px){
  .tsp-p-dubai .tsp-hero-viaje .tsp-tag{font-size:max(11px,.96vw)}
  .tsp-p-dubai .tsp-hero-viaje .tsp-intro{font-size:max(12px,1.05vw)}
}
@media (min-width:901px) and (max-width:1300px){
  .tsp-p-dubai .tsp-hero-viaje .tsp-viaje li{white-space:normal}
}
@media (min-width:901px){
  .tsp-p-dubai .tsp-hero-viaje .tsp-viaje i,.tsp-p-dubai .tsp-hero-viaje .tsp-viaje small{font-size:max(11px,.8vw)}
  .tsp-p-dubai .tsp-hero-viaje .tsp-viaje b{font-size:max(12px,.96vw)}
}
@media (min-width:1301px){.tsp-p-dubai .tsp-banda{height:4.5vw}}   /* la regla general de la banda (5,5 vw) mide 79 px a 1440; la diapositiva 11 pide ≈64 */

/* La gama (diapositiva 10, D-PERF-107..110 131..134 152..154 174..177 207..209 263..272): cabecera, tarjetas y franja a la escala de la diapositiva (900 px = 100vw), todo en una pantalla */
@media (min-width:901px){
  .tsp-range{padding-top:1vw}
  .tsp-range-cab{padding-bottom:0}
  .tsp-modelos{margin-top:.4vw}   /* D-PERF-335 (V15): con -1vw las tarjetas tapaban la 2.ª línea de la entradilla; en la diapositiva 10 empiezan justo debajo */
  .tsp-range>.tsp-ventajas-dentro{margin-top:1vw}
  .tsp-range-cab .tsp-titular{font-size:4.05vw;line-height:.85}
  .tsp-range-cab .tsp-titular::after{margin-top:.6vw}
  .tsp-range-cab .tsp-intro{max-width:86.7vw;margin:.4vw 0 0;font-size:1.52vw;line-height:1.3}   /* D-PERF-109/377: diapositiva 10, 2 líneas de ≈27 px a 1000 de alto, blancas, alineadas a la izquierda con el título en ≈780/900 del ancho */
  .tsp-modelo{min-height:29vw}
  .tsp-modelo h2{font-size:2.455vw}
  .tsp-modelo-lema{font-size:.88vw}
  .tsp .tsp-modelo .tsp-boton{min-width:19.3vw;min-height:2.78vw;padding-block:0}
}

/* D-PERF-286/287/288/289: por encima de 1700 px los topes de los clamp() (cabecera 90 px, letra 16 px) dejaban la web más pequeña que la
   diapositiva a 2560 (136 px de cabecera, logo de 262 px, «Jeep Wrangler Elevated» de 482 px, lema de 367 px, botón de 94 px): ahí todo
   sigue a la pantalla en vw, empalmando con el tope en 1700 px (5,3vw = 90 px; .95vw = 16 px). */
@media (min-width:1700px){
  .tsp{--alto-cab:5.3vw}
  .tsp-marca img{height:3.9vw}
  .tsp-marca .tsp-marca-texto{width:10.2vw;height:auto;margin-top:.35vw}
  .tsp-eyebrow{font-size:.94vw}
  .tsp-pie-lema{font-size:.94vw}
  .tsp .tsp-boton{min-height:3.67vw}
  .tsp .tsp-boton.tsp-boton-cabecera{min-height:0}   /* D-PERF-340 (V15): el 3,67vw es del botón del héroe (288); el de la cabecera sigue la diapositiva (≈42 px a 1440) */
}
/* D-PERF-158 (cabecera a 1440 como la diapositiva): globo de ≈21 px, «ES» de ≈15,5 px, separador a x≈1269 y botón de ≈172×42. */
@media (min-width:1301px){
  .tsp .tsp-cabecera .tsp-idioma{font-size:1.08vw;padding-left:2.15vw}
  .tsp .tsp-cabecera .tsp-idioma .tsp-icono{width:1.46vw;height:1.46vw}
  .tsp .tsp-boton.tsp-boton-cabecera{padding:.88vw 1.5vw}
  .tsp-p-prensa .tsp-menu ul a[aria-current],.tsp-p-contacto .tsp-menu ul a[aria-current]{padding-block:.88vw;line-height:1.15}   /* D-PERF-340 (V15): el mismo alto que «Consulta privada» (diapositivas 15 y 16) */
}
/* D-PERF-261: entre 901 y 1150 px la fila de ventajas se parte en dos y sube sobre las features de «Antes · Después» (22 px de choque
   a 1024): las features suben 26 px para dejar ≥ 12 px de hueco. */
@media (min-width:901px) and (max-width:1150px){
  .tsp-ad-features{bottom:calc(clamp(86px,7.6vw,130px) + 26px)}
}
/* D-PERF-262: a 1200 px o más «Antes · Después» cabe en la pantalla entre la cabecera y la banda (a 1440×810 medía 777 px y la
   diapositiva ≈605: cabecera 76 + sección 777 + banda 79 no cabían). */
@media (min-width:1200px){
  .tsp-antes-despues{min-height:max(560px,calc(100svh - var(--alto-cab) - 5.5vw))}
}
/* D-PERF-262 (2.ª parte): en pantallas bajas el bloque de texto reservaba abajo 16vw (230 px a 1440) para features y ventajas y, con la entradilla
   en español, empujaba la sección a 685 px a 1440×810 (tope 660): basta con 13,5vw (≈194, features y ventajas ocupan ≈147 desde abajo).
   Desde 1301: a 1200-1300 la sección ya la fija su alto mínimo y bajar la reserva solo bajaba el título 11-16 px (puente 1640). */
@media (min-width:1301px) and (max-height:860px){
  .tsp-ad-texto{padding-bottom:clamp(170px,13.5vw,230px)}
}
/* D-PERF-220 (convive con la 262): a 2200 px o más la sección vuelve a la proporción de la diapositiva (≥ ancho/2,45) para que el coche no se recorte; en esas pantallas cabe. */
@media (min-width:2200px){
  .tsp-antes-despues{min-height:41vw}
}
/* D-PERF-315 (diapositiva 9): a 1301 px o más las etiquetas «Antes» y «Después» crecen con el lienzo de la diapositiva (25 px de 1672: ≈38 px a 2560;
   antes se quedaban en 24 px desde 1660; «Antes» en x 35,3 % como la diapositiva, antes 38 %); el titular, la entradilla, las ventajas y las fotos ya escalan (D-PERF-149/150). */
@media (min-width:1301px){
  .tsp-ad-etiqueta{top:calc(100vw * 28 / 1672);padding:calc(100vw * 5 / 1672) calc(100vw * 30 / 1672);font-size:calc(100vw * 25 / 1672)}
  .tsp-ad-e-antes{left:calc(100vw * 590 / 1672)}
}
/* D-PERF-112: la portada de Ferrari entra entera por la derecha (x 1305–1905 a 1920, ≈608 px) y empieza bajo la cabecera, como la
   diapositiva; antes medía 710 px, sobresalía 111 px y la cabecera la tapaba por arriba. */
@media (min-width:1301px){
  /* D-PERF-311: las letras FERRARI a la altura de la diapositiva 15 (y 115–221 u); con top 12 u quedaban ≈69 u más bajas y la revista tapaba el coche (14 % a la vista; ahora ≈51 %) */
  .tsp-prensa-portada{left:calc(1137 * var(--u));top:calc(-57 * var(--u));width:calc(530 * var(--u))}
}
/* D-PERF-119/123: a 901–1300 px (1024 de la diapositiva) la revista se recortaba a la página derecha y la izquierda quedaba bajo el
   texto («Jeep verde fantasma»); ahora la composición del escritorio ancho (mármol, portada de Ferrari y doble página entera) a escala,
   con las letras con suelo para que se lean y la sección creciendo si el texto pide más alto. */
@media (min-width:901px) and (max-width:1300px){
  .tsp-prensa{--u:calc(100vw / 1672);height:auto;min-height:calc(791 * var(--u));align-items:flex-start}
  .tsp-prensa-marmol{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-4}
  .tsp-prensa-portada{display:block;position:absolute;left:calc(1137 * var(--u));top:calc(12 * var(--u));width:calc(530 * var(--u));height:auto;z-index:-3;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 12%);mask-image:linear-gradient(90deg,transparent 0,#000 12%)}
  .tsp-prensa>picture{inset:auto;left:calc(508 * var(--u));top:calc(139 * var(--u));width:calc(1120 * var(--u));height:calc(630 * var(--u));-webkit-mask-image:none;mask-image:none;clip-path:polygon(15.7% 6.2%,33.5% 7.2%,51.6% 10.1%,71.8% 12.5%,95.1% 15.9%,98.8% 53%,98.8% 97%,77% 94.5%,45.8% 90.5%,24% 87%,1.5% 82%,7.8% 42%)}
  .tsp-prensa .tsp-fondo{object-fit:fill;object-position:center}
  .tsp-prensa::before{background:linear-gradient(90deg,rgba(0,0,0,.55) 0,rgba(0,0,0,.25) 38%,rgba(0,0,0,0) 55%)}
  .tsp-prensa .tsp-slide-texto{width:calc(620 * var(--u));padding:calc(50 * var(--u)) 0 calc(60 * var(--u)) calc(80 * var(--u))}
  .tsp-prensa .tsp-eyebrow{font-size:max(11px,calc(17 * var(--u)))}
  .tsp-prensa .tsp-intro{font-size:max(13.5px,calc(19.4 * var(--u)));line-height:1.3;max-width:calc(440 * var(--u))}
  .tsp-prensa .tsp-tag{font-size:max(11px,calc(16.6 * var(--u)));letter-spacing:.14em;max-width:calc(440 * var(--u))}
  .tsp-prensa .tsp-pie-foto{font-size:max(11px,calc(13.5 * var(--u)));left:calc(1025 * var(--u));right:auto;top:auto;bottom:calc(12 * var(--u))}
}
/* D-PERF-123: a 390 px el eyebrow tocaba el borde inferior de la imagen de la revista y pisaba su URL: baja unos píxeles. */
@media (max-width:900px){.tsp-prensa .tsp-slide-texto{margin-top:3.5vw}}

/* Dubái, pieza 2 (V15, D-PERF-243/244/247/248, diapositiva 11; solo la página Dubái): el rótulo del edificio sobre la fachada oscura a ≈73 % del ancho
   y más pequeño, el rótulo «Dubái. / Un centro global…» estrecho y pegado al borde derecho, y en la banda «Eleva tu forma de conducir.» a la derecha
   con su raya corta detrás (en la diapositiva va de 73 % a 94 %, no pegado al lema). */
@media (min-width:1301px){
  .tsp-hero-dubai:not(.tsp-hero-venta):not(.tsp-hero-config):not(.tsp-hero-viaje) .tsp-lateral-alto{left:72.5vw;font-size:.78vw;letter-spacing:.12em;padding-left:.8vw}
  .tsp-hero-dubai:not(.tsp-hero-venta):not(.tsp-hero-config):not(.tsp-hero-viaje) .tsp-lateral-der{right:1.2vw;top:.5vw;max-width:9vw;font-size:.8vw;line-height:1.3}   /* encima del logo S de la fachada, no sobre él */
  .tsp-p-dubai .tsp-banda .tsp-pie-der{justify-content:flex-end}
  .tsp-p-dubai .tsp-banda .tsp-pie-der span{flex:0 0 4vw}
}
/* Dubái, pieza 3 (V15, D-PERF-250/251/252). 250: en la diapositiva 12 los subtítulos de los pasos miden ≈0,9 vw (a 1920 «Transporte internacional»
   ocupa el 9,7 % del ancho; con 0,8 vw, el 8,7 %); los títulos ya coinciden. 252: el héroe de la diapositiva 11 crece con la pantalla: sin los
   topes de 70 px del titular y 18 px de la entradilla, que a 2560 lo dejaban en el 63-76 % de la diapositiva. */
@media (min-width:1301px){
  .tsp-p-dubai .tsp-hero-viaje .tsp-viaje small{font-size:.9vw}
  .tsp-hero-dubai:not(.tsp-hero-venta):not(.tsp-hero-config):not(.tsp-hero-viaje) .tsp-titular{font-size:3.9vw}
  .tsp-hero-dubai:not(.tsp-hero-venta):not(.tsp-hero-config):not(.tsp-hero-viaje) .tsp-intro{font-size:1.1vw}
  /* 251: el alto del héroe en proporción de 1440 (478 px = 33,2 vw): a 2560 se quedaba en 28 vw y la foto salía cortada por arriba */
  .tsp-hero-dubai:not(.tsp-hero-venta):not(.tsp-hero-config):not(.tsp-hero-viaje){min-height:33.2vw}
}
/* D-PERF-101 (diapositiva 1, sobre D-PERF-158): la barra dorada del idioma mide ≈32 px de alto a 1440 (antes 37) y, en Inicio, menú, botón y globo
   van al 54 % del alto de la cabecera, como en la diapositiva (y≈41 de 76 a 1440; antes centrados, en 38). */
@media (min-width:1301px){
  .tsp .tsp-cabecera .tsp-idioma-menu{padding-top:.35vw;padding-bottom:.35vw}
  .tsp.tsp-p-inicio .tsp-cabecera{padding-top:.5vw}
}
/* D-PERF-318/319, 2.ª pieza (V15): de 1101 a 1300 la 3.ª diapositiva con las medidas de desde 1301 (en vw): a 1280 el texto iba pegado arriba
   (antetítulo al 3 % de la sección) y la fila de pasos cruzaba el Jeep por los faros; en la diapositiva 3 va sobre las ruedas (≈71 %). */
@media (min-width:1101px) and (max-width:1300px){
  .tsp-slide-c .tsp-titular{font-size:4.77vw}
  .tsp-slide-c .tsp-intro{font-size:1.32vw;max-width:24em;line-height:1.24}
  .tsp-slide-c picture{inset:0 -6vw 0 2vw}
  .tsp-slide-c .tsp-pasos{width:97%;margin-top:2.9vw;justify-content:space-between}
  .tsp-slide-c .tsp-pasos li{gap:1.4vw;text-shadow:0 0 4px #000,0 1px 8px #000}
  .tsp-slide-c .tsp-pasos li:not(:last-child){flex:none}
  .tsp-slide-c .tsp-pasos li:not(:last-child)::after{flex:none;width:5.7vw;margin:0}
  .tsp-slide-c .tsp-botones{margin-top:1.45vw}
  .tsp-slide.tsp-slide-c{min-height:45.5vw}
  .tsp-slide-c>.tsp-slide-texto{margin-block:0;padding-top:5.4vw;padding-bottom:1vw}   /* 5,4 y no 4,6: la franja de ventajas, con su suelo de 11 px, es más alta que en vw */
  .tsp-slide-c .tsp-eyebrow{margin-bottom:.6vw}
  .tsp-slide-c .tsp-titular::after{width:3.7vw;margin-top:1vw}
  .tsp-slide-c .tsp-intro{margin-top:1.1vw}
}
/* D-PERF-331 (V15): de 901 a 1100 la fila de pasos de la 3.ª diapositiva cae sobre el techo claro del Jeep: cada paso con su fondo oscuro, como de 1101 a 1300 */
@media (min-width:901px) and (max-width:1100px){.tsp-slide-c .tsp-pasos li span{background:linear-gradient(90deg,rgba(0,0,0,.6),rgba(0,0,0,.42));padding:.35em .55em}}

/* D-PERF-325 (W8, puente 1435.): suelo de 11 px por debajo de 1440 en lo que queda de Dubái; a ≥1440 igual que la diapositiva. Los títulos de las
   columnas (D-PERF-087 de V15) siguen en UNA línea: solo sube el mínimo de la letra (9 → 11 px); los rótulos laterales del héroe, de 1301 a 1409 px. */
@media (min-width:901px) and (max-width:1439.98px){
  ol.tsp-cols-4 h2{font-size:clamp(11px,4.4cqi,23px)}
}
@media (min-width:1301px) and (max-width:1439.98px){
  .tsp-hero-dubai:not(.tsp-hero-venta):not(.tsp-hero-config):not(.tsp-hero-viaje) .tsp-lateral-alto{font-size:max(11px,.78vw)}
  .tsp-hero-dubai:not(.tsp-hero-venta):not(.tsp-hero-config):not(.tsp-hero-viaje) .tsp-lateral-der{font-size:max(11px,.8vw)}
}
/* D-PERF-291 (V15): en pantallas ultrapanorámicas (21:9 y más, desde 2,2:1) la diapositiva 1 y su banda se escalan para caber en el alto, como
   en la diapositiva. Medido a 2560: cabecera ≈5,2 vw (≥1700 px es 5,3 vw) + héroe y banda ≈51,2 vw. Cada escalón lleva el zoom que cabe en su
   extremo más apaisado, con 1 % de margen: 0,74 hasta 2,3:1, 0,69 hasta 2,45, 0,645 hasta 2,6, 0,59 hasta 2,8 y 0,54 desde ahí (hasta 3:1).
   Por debajo de 2,2:1 (1920×900-1080, 2560×1200…) no se toca: allí las medidas de las diapositivas valen tal cual.
   LÍMITE (puente 1605): por encima de 3:1 sigue el 0,54 y la banda ya no cabe (5120×1440, 3,56:1: queda bajo el pliegue, medido 20-oct); sin escalón nuevo. */
@media (min-width:1301px) and (min-aspect-ratio:11/5){.tsp-slide-a,.tsp-slide-a+.tsp-banda{--z:.74}}
@media (min-width:1301px) and (min-aspect-ratio:23/10){.tsp-slide-a,.tsp-slide-a+.tsp-banda{--z:.69}}
@media (min-width:1301px) and (min-aspect-ratio:49/20){.tsp-slide-a,.tsp-slide-a+.tsp-banda{--z:.645}}
@media (min-width:1301px) and (min-aspect-ratio:13/5){.tsp-slide-a,.tsp-slide-a+.tsp-banda{--z:.59}}
@media (min-width:1301px) and (min-aspect-ratio:14/5){.tsp-slide-a,.tsp-slide-a+.tsp-banda{--z:.54}}
/* D-PERF-344 (W8): el zoom también escalaba el margen lateral (120 → 83 px a 2560×1080) y el héroe y su banda no empezaban donde el resto de
   pantallas, como en la diapositiva. Dentro del zoom, --lado (el mismo clamp de .tsp) se divide por él y vuelve a medir lo de fuera. */
@media (min-width:1301px) and (min-aspect-ratio:11/5){.tsp-slide-a,.tsp-slide-a+.tsp-banda{zoom:var(--z);--lado:calc(clamp(18px,5.4vw,120px) / var(--z))}}

/* D-PERF-339 (W8): el lema de cada modelo de La gama no baja de 12 px de 901 a 1439 (a 1024 medía 9,0); desde 1440 queda en .88vw, como la diapositiva. */
@media (min-width:901px) and (max-width:1439.98px){.tsp-modelo-lema{font-size:max(12px,.88vw)}}
/* D-PERF-199 (V15): por encima de 1700 px Contacto se quedaba en los topes de sus clamp() (titular 76 px, formulario 480 px = 19 % a 2560,
   letra de 14-20 px) y a 2560 el bloque salía pequeño y vacío frente a la diapositiva 16 (formulario ≈28 % del ancho). Como la 286: desde 1700
   cada medida sigue a la pantalla en vw, empalmando con lo que valía en 1700 (tope/17 vw si ya lo había tocado; si no, su mismo vw). */
@media (min-width:1700px){
  /* D-PERF-198: en pantallas muy anchas (2560×1080) la caja 4:3 pasaba del alto de la ventana (acababa en y 1223): el ancho lo limita también el alto, descontada la cabecera (la caja cuelga de la sección, bajo --alto-cab) */
  /* 364b: la caja sigue siendo la de 1301-1699 (1039 u desde x 260 u, D-PERF-202); la fórmula vieja de la 199 ((100% − der − 28vw − 33%)/.73)
     la dejaba en el 50 % del ancho a 1920 (Jeep al 37 %, luz 40-42) */
  .tsp-contacto>picture{--cto-ancho:min(calc(1039 * 100vw / 1672),calc((100vh - var(--alto-cab) - 78 * 100vw / 1672) * 4 / 3));width:var(--cto-ancho)}
  /* Contacto en ventanas bajas (1920×800, 2560×1080): si el alto encoge la foto, se arrima al formulario (su 90 % acaba en él, el faro del 86 %
     sigue a la izquierda) en vez de quedarse en x 260 u con el Jeep detrás del titular; a 1920×1080 y 2560×1440 no se mueve */
  .tsp-contacto>picture{left:max(calc(260 * 100vw / 1672),calc(69.8vw - var(--cto-ancho) * .9))}
  .tsp-contacto .tsp-titular{font-size:4.2vw}
  .tsp-contacto .tsp-intro{font-size:calc(24.4 * 100vw / 1672)}
  .tsp-contacto-form{width:28vw;padding:2vw;margin:2.353vw 0}
  .tsp-contacto-form .tsp-campos{gap:.941vw}
  .tsp-contacto-form .tsp-fila{gap:.706vw}
  .tsp-contacto-form .tsp-etiqueta{margin-bottom:.353vw;font-size:.824vw}
  .tsp-contacto-form input:not([type=checkbox]),.tsp-contacto-form textarea{min-height:2.941vw;padding:.706vw .941vw;font-size:.941vw}
  .tsp-contacto-form select{min-height:2.941vw;padding:.706vw 2.588vw .706vw .941vw;font-size:.824vw}
  .tsp .tsp-contacto-form .tsp-enviar{min-height:3.294vw;margin-top:1.176vw;font-size:1.059vw}
}


/* D-PERF-108: tarjeta de La gama a la relación 1,13 de la diapositiva 10 (coche arriba, base oscura con URBAN, lema y botón) desde 1101 px, donde el pie cabe sin pisar el coche; por debajo se queda el alto anterior. Desde 1440 es la medida de la diapositiva. */
@media (min-width:1101px){
  .tsp-modelo{min-height:0;aspect-ratio:1.13}
  .tsp-modelo picture,.tsp-modelo>img{height:57%;inset:0 0 auto 0}
  .tsp-modelo img{height:100%;aspect-ratio:auto}
  .tsp-modelo::before{background:linear-gradient(180deg,rgba(0,0,0,0) 38%,rgba(0,0,0,.92) 56%,#000 62%)}
  .tsp-modelo-pie{gap:.5vw;padding-bottom:1.1vw}
}

/* La marca, etapa 1 entre 901 y 1199 px: el texto ocupa las dos filas y la columna se estrecha, para que la foto crezca hacia la izquierda y las miniaturas queden pegadas a ella (sin hueco);
   la columna del indicador de etapas, fija en 150 px (lo que mide), para que la foto no entre en él. */
@media (min-width:901px) and (max-width:1199.98px){
  .tsp-etapa-1{grid-template-columns:minmax(0,28%) minmax(0,1fr) 150px;grid-template-rows:auto 1fr}
  .tsp-etapa-1 .tsp-etapa-texto{grid-row:1/3}
  .tsp-etapa-1 .tsp-titular{font-size:clamp(24px,2.5vw,36px)}
  .tsp-etapa-1 .tsp-checks{grid-template-columns:repeat(2,auto);gap:12px 20px}
}
/* D-PERF-354 (W8): los 4 pasos de Dubái, como en la diapositiva 11 (a 1440: título de 17,8 px = 1,235 vw, «PREPARACIÓN A MEDIDA» de 207 px,
   fotos de 2,05:1 y 153 px de alto; la web los daba un 30 % más pequeños). El título sigue en UNA línea (087): el vw de la diapositiva con tope
   en lo que cabe en la columna (el más largo, «Ingeniería y rendimiento», cabe hasta 6,2 cqi; en inglés «Engineering and performance», 5,1) y
   el suelo de 11 px de la 325. Con relleno de .4vw arriba y 0 abajo y fotos de 2,1:1 (diapositiva: 313-321×153) la fila queda en ≈299 px a 1440 (089: ≤300; con .9vw/.3vw y 2,05:1 daba 314). */
@media (min-width:901px){
  ol.tsp-cols-4 h2{font-size:max(11px,min(1.235vw,6cqi))}
  /* en: al ≥90 % de la diapositiva (1803; con 5cqi daba 86 %): 5,3cqi y, para que «Engineering and performance» siga en una línea, menos hueco tras el número */
  :lang(en) ol.tsp-cols-4 h2{font-size:max(11px,min(1.235vw,5.3cqi));gap:.35em;letter-spacing:-.01em}
  :lang(en) ol.tsp-cols-4 h2 b{font-size:1.8em}
  .tsp-p-dubai ol.tsp-cols-4{padding-top:.4vw;padding-bottom:0}
  .tsp-p-dubai ol.tsp-cols-4 h2{margin-bottom:.42vw}
  .tsp-p-dubai ol.tsp-cols-4 img{aspect-ratio:2.1/1}
  .tsp-p-dubai ol.tsp-cols-4 p{margin-top:.5vw}
}
/* D-PERF-354 (puente 1858): en inglés de 901 a 1023 el suelo de 11 px hacía rebosar «Engineering and performance» 12 px; ahí manda 5,3cqi (que escala con el número y el hueco), hasta 10 px */
@media (min-width:901px) and (max-width:1023.98px){:lang(en) ol.tsp-cols-4 h2{font-size:max(10px,min(1.235vw,5.3cqi))}}
/* D-PERF-359 (W99r es-2560): en ultrapanorámicas el picture del hero no se sale por la derecha (el -4.2vw de ≥1301) y se acota al 40 % del ancho: la foto 4:3 enseña el coche entero (≥80 % del alto de la foto a 2560×800); el degradado de la izquierda llega a opaco en el 7 % (la rueda delantera izquierda del Jeep está en el 8-20 % de la foto y con el 30 % de antes salía desvaída) y deja 2vw de margen a la derecha (el guardabarros trasero está al 99 % de la foto: margen ≥20 px, criterio de V12). */
@media (min-width:1301px) and (min-aspect-ratio:11/5){.tsp-slide-a picture{inset:0 2vw 0 auto;width:40%}.tsp-slide-a .tsp-fondo{object-position:25% 40%}.tsp-slide-a picture{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 7%);mask-image:linear-gradient(90deg,transparent 0,#000 7%)}}
@media (min-width:1301px) and (min-aspect-ratio:11/5) and (max-aspect-ratio:13/5){.tsp-slide-a picture{width:50%}}   /* D-PERF-385: hasta 13/5 (1920×800, 2560×1080) el Jeep cabe al 50 % (foto visible ≥83 % del alto) y el negro entre texto y foto baja de ~400 a ~210 px; a 2560×800 (3,2) se queda el 40 % de la 359 */
/* D-PERF-357: Proceso a 901-1100 px: la diapositiva 3 deja el Jeep libre debajo de la fila 01…05; con la caja de 560 px la fila se escribía sobre el techo. Más alta (680, creciendo con el ancho hasta ~726 a 1100) y foto centrada: techo bajo la fila, ruedas sobre la tira inferior */
@media (min-width:901px) and (max-width:1100px){.tsp-slide.tsp-slide-c{min-height:max(680px,calc(680px + (100vw - 1024px) * .6))}.tsp-slide-c .tsp-fondo{object-position:center 20%}.tsp-slide-c .tsp-intro{max-width:34em}}
/* Revisión de maqueta (W7, DECIDIDO 5527; medido en vivo sobre lo servido, es y en): la tira de 9 opciones del Configurador a la medida de la diapositiva 13 desde 1201 px (en una fila). Rótulo y texto iban a 1,05vw con tope de 17 px (a 2356, 17 frente a 22,6 de la diapositiva) y los rellenos dejaban la página a 1015 px a 1440 (cuerpo 799 frente a ≈697). Medidas de la diapositiva en vw (1 px = .0598vw): rótulo y texto .96vw, número 1.86vw, foto-texto .66vw, raya 2.4vw. Queda: cuerpo 729 a 1440 y 1149 a 2356 (≈1140), sin desborde. */
@media (min-width:1201px){
  .tsp-cols-9{padding-top:1.5vw;padding-bottom:.3vw}
  .tsp-cols-9 h2{font-size:max(11px,.96vw);margin-bottom:.48vw}
  .tsp-cols-9 h2 b{font-size:max(24px,1.86vw)}
  .tsp-cols-9 p{margin-top:.66vw;font-size:max(11.5px,.96vw);line-height:1.37;padding-bottom:0}
  .tsp-cols-9 p::after{width:2.4vw;margin-top:.5vw}
  .tsp-p-config .tsp-acciones{padding-top:1.2vw}
}
/* Revisión de maqueta (W7, 5527; medido en vivo sobre lo servido): en Dubái, el texto de las 4 columnas («Cada vehículo se prepara…») quedaba en el tope de 17 px desde 1673 (a 2356, 17 frente a ≈23,5 de la diapositiva 11, que lo lleva a ≈1vw y en 3 líneas); el número y el rótulo ya escalaban. Desde 1673, 1.02vw (17 px a 1672): 24 px y 3 líneas a 2356. */
@media (min-width:1673px){
  .tsp-p-dubai ol.tsp-cols-4 p{font-size:1.02vw}
}
/* Revisión de maqueta (W7, 5527, diapositiva 17; medido en la copia local con un contrato ficticio, es y en): el Área privada lleva las clases de Contacto (tsp-contacto tsp-contrato) y, desde 1700, «.tsp-contacto .tsp-titular{4.2vw}» alcanzaba también al título del formulario: a 2356, 99 px en 3 líneas («DATOS PARA / EL / CONTRATO») dentro de una caja topada en 720 px (30 % del ancho; la diapositiva, 41 % y el título en una línea); los pasos 01-03, en su tope de 18 px. Desde 1700, las medidas de la diapositiva en vw: caja 41vw, título 2.4vw (56,5 px a 2356), pasos 1.05vw. */
@media (min-width:1700px){
  .tsp-contrato .tsp-contacto-form{width:41vw;padding:2.2vw;margin:2.4vw 0}
  .tsp-contrato .tsp-form-titulo{font-size:2.4vw}
  .tsp-pasos-v{gap:1.2vw;margin:2vw 0}
  .tsp-pasos-v li{gap:1.6vw;font-size:1.05vw}
  .tsp-pasos-v b{width:3.3vw;font-size:1.3vw}
}