@font-face{font-family:'Barlow';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/barlow-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Barlow';font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/barlow-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Barlow';font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/barlow-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Barlow';font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/barlow-latin-700-normal.woff2) format('woff2')}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/barlow-condensed-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/barlow-condensed-latin-700-normal.woff2) format('woff2')}
/* Paleta de marca Rumbo Sur (Adobe Color del cliente) · Barlow Condensed en títulos, Barlow en texto
   Composición: inicio a pantalla completa, secciones en bandas de crema y navy, fotos con esquinas redondeadas */
:root{
  --navy:#31414F; --navy-deep:#263540; --tan:#C1A077; --olive:#808C56; --tan-light:#CFA073; --terracotta:#81331D;
  --cream:#F7F2E9; --cream-deep:#F0E8DA; --tan-tint:#F3E9DA; --olive-tint:#EDEFE4; --white:#FFFFFF;
  --ink:#263540; --muted:#55636A; --green:#294F2F;
  --display:"Barlow Condensed","Arial Narrow",Arial,sans-serif;
  --text:"Barlow",system-ui,-apple-system,"Segoe UI",sans-serif;
  --fs-body:clamp(1.0625rem,1rem + 0.2vw,1.125rem);
  --fs-lead:clamp(1.25rem,1.1rem + 0.5vw,1.5rem);
  --fs-h3:clamp(1.625rem,1.3rem + 1vw,2.125rem);
  --fs-h2:clamp(2.75rem,1.7rem + 3.6vw,5rem);
  --m:32px; --r:20px; --r-sm:12px;
  --ease-out:cubic-bezier(0.22,1,0.36,1);
  --ease-expo:cubic-bezier(0.16,1,0.3,1);
  --ease-soft:cubic-bezier(0.33,1,0.68,1);
  color-scheme:light;
}
@media (max-width:760px){:root{--m:20px;--r:16px}}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);font-family:var(--text);font-size:var(--fs-body);line-height:1.6;overflow-x:hidden}
img{display:block;max-width:100%}
h1,h2,h3{margin:0;text-wrap:balance}
h2{font-family:var(--display);font-weight:700;font-size:var(--fs-h2);line-height:0.92;letter-spacing:-0.01em;text-transform:uppercase}
h3{font-family:var(--display);font-weight:700;font-size:var(--fs-h3);line-height:1;text-transform:uppercase}
p{margin:0}
a{color:inherit}
:focus-visible{outline:3px solid var(--tan-light);outline-offset:3px}
.sr-input{position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}
.wrap{max-width:1280px;margin:0 auto;padding-left:var(--m);padding-right:var(--m)}

/* botones: píldora en toda la página */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:0 26px;border:2px solid transparent;border-radius:999px;font-family:var(--text);font-weight:600;font-size:16px;text-decoration:none;cursor:pointer;transition:transform 140ms var(--ease-out),background-color 180ms ease,color 180ms ease,border-color 180ms ease}
.btn:active{transform:scale(0.97)}
.btn-accent{background:var(--terracotta);color:#fff}
.btn-accent:hover{background:var(--navy)}
.btn-linea{border-color:var(--navy);color:var(--navy);background:transparent}
.btn-linea:hover{background:var(--navy);color:var(--cream)}
.link{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:2px;transition:color 180ms ease}
.link:hover{color:var(--terracotta)}

/* ---------- ENCABEZADO ---------- */
.cabecera{position:sticky;top:env(safe-area-inset-top,0px);z-index:40;background:rgba(247,242,233,.94);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:1px solid var(--cream-deep)}
.cabecera .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:76px}
.marca{display:flex;flex-direction:column;line-height:1.05;text-decoration:none;color:var(--navy)}
.marca strong{font-family:var(--display);font-weight:700;font-size:24px;letter-spacing:.05em}
.marca span{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#5E6A38;font-weight:600}
.cabecera nav{display:flex;gap:32px}
.cabecera nav a{color:var(--navy);text-decoration:none;font-size:15px;font-weight:500;transition:color 180ms ease}
.cabecera nav a:hover{color:var(--terracotta)}
.btn-verde{background:var(--green);color:#fff;min-height:44px;padding:0 22px;font-size:16px;letter-spacing:.02em}
.btn-verde:hover{background:var(--navy)}
.cabecera .btn-verde{white-space:nowrap}
@media (max-width:480px){.cabecera .wrap{gap:12px}.cabecera .btn-verde{padding:0 14px;font-size:15px;min-height:42px}.marca strong{font-size:21px}.marca span{font-size:10px;letter-spacing:.05em;white-space:nowrap}}
@media (max-width:359px){.marca span{display:none}}

/* ---------- INICIO ---------- */
.hero{position:relative;min-height:680px;display:flex;align-items:center;justify-content:center;overflow:hidden;background:#1b2224;color:#fff}
.hero .foto{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;transition:opacity 700ms var(--ease-out),transform 1400ms var(--ease-expo)}
.hero .noche{object-position:50% 32%}
.hero .dia{opacity:0;transform:scale(1.05);object-position:50% 52%}
.hero:has(#modo-dia:checked) .dia{opacity:1;transform:none}
.hero:has(#modo-dia:checked) .noche{opacity:0}
.hero .velo{position:absolute;inset:0;background:radial-gradient(ellipse 70% 60% at 50% 50%,rgba(18,24,26,.45) 0%,rgba(18,24,26,0) 100%),linear-gradient(180deg,rgba(20,26,28,.40) 0%,rgba(20,26,28,.48) 50%,rgba(20,26,28,.62) 100%)}
.hero-body{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:22px;text-align:center;max-width:880px;padding:72px var(--m)}
.hero h1{font-family:var(--text);font-weight:700;font-size:clamp(36px,4.8vw,62px);line-height:1.05;letter-spacing:-0.015em;color:#fff}
.hero .eyebrow{font-size:13px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;color:var(--tan-light)}
.hero .botones{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;margin-top:6px}
.btn-borde{border-color:#fff;color:#fff;background:rgba(255,255,255,.08)}
.btn-borde:hover{background:#fff;color:var(--navy)}
.modos{display:inline-flex;margin-top:8px;background:rgba(0,0,0,.32);border-radius:999px;padding:4px}
.modos label{display:inline-flex;align-items:center;min-height:40px;padding:0 18px;border-radius:999px;font-size:14px;font-weight:600;cursor:pointer;color:#fff;transition:background-color 180ms ease,color 180ms ease}
.modos label:hover{background:rgba(255,255,255,.12)}
#modo-noche:checked ~ .hero-body label[for=modo-noche],
#modo-dia:checked ~ .hero-body label[for=modo-dia]{background:var(--cream);color:var(--navy)}
#modo-noche:focus-visible ~ .hero-body label[for=modo-noche],
#modo-dia:focus-visible ~ .hero-body label[for=modo-dia]{outline:3px solid var(--tan-light);outline-offset:2px}

/* ---------- UN AUTO, DOS MODOS ---------- */
.intro{position:relative;isolation:isolate;overflow:hidden;padding:140px 0 130px}
.intro .fondo-mapa{position:absolute;inset:0 auto 0 2%;z-index:-1;width:58%;height:100%;max-width:none;object-fit:cover;object-position:50% 24%;opacity:.5;pointer-events:none;-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 14%,#000 50%,transparent 100%),linear-gradient(180deg,transparent 0%,#000 22%,#000 78%,transparent 100%);-webkit-mask-composite:source-in;mask-image:linear-gradient(90deg,transparent 0%,#000 14%,#000 50%,transparent 100%),linear-gradient(180deg,transparent 0%,#000 22%,#000 78%,transparent 100%);mask-composite:intersect}
@media (max-width:760px){.intro .fondo-mapa{inset:0;width:100%;object-position:50% 10%;-webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 16%,#000 45%,transparent 100%);mask-image:linear-gradient(180deg,transparent 0%,#000 16%,#000 45%,transparent 100%)}}
.intro .wrap{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;row-gap:48px;align-items:center}
.intro .wrap{align-items:start}
.intro h2{grid-column:1 / span 5}
.intro .col{grid-column:7 / span 6;display:flex;flex-direction:column;gap:20px}
.intro .col p:first-of-type{font-weight:600;font-size:var(--fs-lead);line-height:1.4;color:var(--navy)}
.intro .col p{color:var(--muted)}
.intro .cta-intro{margin-top:6px}
@media (max-width:760px){.intro .cta-intro .btn{width:100%}}

/* ---------- MODELOS (tarjetas que cruzan una foto fija) ---------- */
.modelos{position:relative;background:var(--navy);color:var(--cream)}
.modelos .stage{position:relative;overflow:hidden}
.modelos .fondo{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;filter:brightness(0.55)}
.modelos h2{position:relative;z-index:1;padding:80px var(--m) 14px;max-width:16ch}
.modelos .bajada{position:relative;z-index:1;padding:0 var(--m);max-width:40ch;font-size:var(--fs-lead);color:var(--cream-deep)}
.track{position:relative;z-index:1;display:flex;gap:40px;padding:44px var(--m) 80px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.track::-webkit-scrollbar{display:none}
.card{flex:0 0 min(640px,82vw);height:min(560px,64svh);display:flex;flex-direction:column;scroll-snap-align:start;color:var(--ink);text-decoration:none;border-radius:var(--r);overflow:hidden}
.card .foto{flex:1 1 auto;min-height:0;overflow:hidden;background:var(--cream-deep)}
.card .foto img{width:100%;height:100%;object-fit:cover;transition:transform 600ms var(--ease-soft)}
.card:hover .foto img{transform:scale(1.04)}
.card .panel{flex:none;display:flex;align-items:flex-end;justify-content:space-between;gap:24px;padding:26px 28px}
.card h3{font-size:clamp(2.5rem,1.8rem + 2.2vw,3.75rem);line-height:.9}
.card .desc{text-align:right;font-size:16px;line-height:1.45;max-width:30ch}
.card .desc strong{display:block;font-weight:700;font-size:18px}
.c1 .panel{background:var(--tan-tint)} .c2 .panel{background:var(--tan)} .c3 .panel{background:var(--olive-tint)} .c4 .panel{background:var(--white)}
.card .foto.solo{display:flex;flex-direction:column;justify-content:center;padding:28px 40px;background:var(--olive);color:#fff;gap:8px}
.card .foto.solo p{font-family:var(--display);font-weight:700;font-size:clamp(2.75rem,2rem + 2.4vw,4.25rem);line-height:.92;text-transform:uppercase}
.card .foto.solo span{font-size:17px}
@media (min-width:900px) and (prefers-reduced-motion:no-preference){
  .js .modelos.pin{height:200svh}
  .js .modelos.pin .stage{position:sticky;top:0;height:100svh;display:flex;flex-direction:column}
  .js .modelos.pin .track{overflow:visible;flex:1;min-height:0;align-items:center;padding-top:20px;padding-bottom:28px;will-change:transform;transition:transform 700ms var(--ease-expo)}
  .js .modelos.pin .card{flex-basis:calc((100vw - 2*var(--m) - 40px) / 2);height:clamp(300px, calc(100svh - 290px), 560px)}
  .js .modelos.pin h2{padding-top:104px;max-width:none;font-size:clamp(2.5rem,1.5rem + 2.6vw,4rem)}
}

/* ---------- UN BAÚL, TRES POSICIONES ---------- */
.usos{padding:150px 0 130px}
.usos .cab{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;flex-wrap:wrap;margin-bottom:48px}
.usos .cab p{max-width:36ch;color:var(--muted);font-size:var(--fs-lead);line-height:1.4}
.usos .grilla{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.uso{display:flex;flex-direction:column;gap:18px}
.uso .ficha{position:relative;aspect-ratio:4/5;border-radius:var(--r);overflow:hidden;background:var(--cream-deep)}
.uso .ficha img{width:100%;height:100%;object-fit:cover;transition:transform 700ms var(--ease-soft)}
.uso:hover .ficha img{transform:scale(1.04)}
.uso h3{position:absolute;left:16px;top:16px;background:var(--cream);color:var(--navy);border-radius:999px;padding:9px 18px 7px;font-size:22px;line-height:1}
.uso p{color:var(--muted);max-width:34ch}

/* ---------- COMPATIBILIDAD ---------- */
.compat{position:relative;min-height:100svh;overflow:hidden;display:flex;align-items:flex-start}
.compat > img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:30% 60%}
.ficha-compat{position:relative;z-index:1;margin:64px var(--m) 64px auto;width:420px;max-width:calc(100% - 2*var(--m));background:var(--white);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column}
.ficha-compat .dentro{padding:32px;display:flex;flex-direction:column;gap:18px}
.ficha-compat h2{font-size:clamp(2.25rem,1.8rem + 1.4vw,3rem)}
.ficha-compat .intro-f{color:var(--muted);font-size:16px;line-height:1.45}
.campo{display:flex;flex-direction:column;gap:6px;min-width:0}
.campo label{font-size:14px;font-weight:600;color:var(--navy)}
.campo input{font:inherit;font-size:16px;padding:11px 14px;border:1.5px solid var(--cream-deep);border-radius:var(--r-sm);background:var(--cream);color:var(--ink);min-height:48px;width:100%;min-width:0;transition:border-color 180ms ease}
.campo input:focus-visible{outline:none;border-color:var(--terracotta)}
.dos{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.canales{display:flex;flex-direction:column;gap:4px;font-size:14px;color:var(--muted)}
.ficha-compat .btn{width:100%;border-radius:0;min-height:58px}

/* ---------- EN LA RUTA (collage simétrico) ---------- */
.ruta{padding:140px 0 130px;background:var(--cream-deep)}
.ruta .cab{text-align:center;display:flex;flex-direction:column;align-items:center;gap:18px;margin-bottom:56px}
.ruta .cab p{max-width:46ch;color:var(--muted);font-size:var(--fs-lead);line-height:1.4}
.collage{display:grid;grid-template-columns:1fr 1.35fr 1fr 1.35fr 1fr;grid-template-rows:290px 290px;gap:14px}
.collage figure{margin:0;border-radius:var(--r);overflow:hidden;background:var(--tan-tint)}
.collage img{width:100%;height:100%;object-fit:cover;transition:transform 700ms var(--ease-soft)}
.collage figure:hover img{transform:scale(1.05)}
.collage .alta{grid-row:span 2}

/* ---------- HECHO A MANO ---------- */
.taller{padding:0 var(--m) 130px;background:var(--cream-deep)}
.taller .panel{max-width:1280px;margin:0 auto;background:var(--navy);color:var(--cream);border-radius:28px;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;row-gap:48px;padding:72px 64px;align-items:center}
.taller .fotos{grid-column:1 / span 6;position:relative;padding:0 48px 48px 0}
.taller .fotos .grande{aspect-ratio:1;border-radius:var(--r);overflow:hidden}
.taller .fotos .grande img{width:100%;height:100%;object-fit:cover}
.taller .fotos .chica{position:absolute;right:0;bottom:0;width:44%;aspect-ratio:3/4;border-radius:var(--r);overflow:hidden;border:8px solid var(--navy)}
.taller .fotos .chica img{width:100%;height:100%;object-fit:cover}
.taller .textos{grid-column:8 / span 5;display:flex;flex-direction:column;gap:36px}
.taller h2{color:var(--tan-light)}
.taller .bloque{display:flex;flex-direction:column;gap:10px}
.taller .bloque p{color:#D8DDDF}
.taller .btn{align-self:flex-start}

/* ---------- PREGUNTAS ---------- */
.faq{padding:150px 0 140px}
.faq .wrap{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;row-gap:40px;align-items:start}
.faq .lado{grid-column:1 / span 4;position:sticky;top:120px;display:flex;flex-direction:column;gap:22px}
.faq .lado p{color:var(--muted)}
.faq .lado .btn{align-self:flex-start}
.faq .lista{grid-column:6 / span 7;display:flex;flex-direction:column;gap:12px}
.faq details{background:var(--tan-tint);border-radius:var(--r);padding:6px 24px;transition:background-color 180ms ease}
.faq details[open]{background:var(--white)}
.faq summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:24px;cursor:pointer;font-size:19px;font-weight:600;color:var(--navy);line-height:1.3;padding:16px 0;min-height:44px}
.faq summary::-webkit-details-marker{display:none}
.faq summary .flecha{flex-shrink:0;width:34px;height:34px;border-radius:50%;background:var(--cream);display:grid;place-items:center;transition:transform 180ms var(--ease-out),background-color 180ms ease}
.faq details[open] summary .flecha{transform:rotate(180deg);background:var(--terracotta);color:#fff}
.faq details p{max-width:56ch;padding:0 0 20px;color:var(--muted)}

/* ---------- PIE ---------- */
.pie{background:var(--navy-deep);color:#C9D2D6;padding:64px 0 28px}
.pie .arriba{display:grid;grid-template-columns:2fr 1fr 1fr;gap:40px}
.pie .marca-pie strong{display:block;font-family:var(--display);font-weight:700;font-size:40px;letter-spacing:.04em;color:var(--cream);line-height:1}
.pie .marca-pie span{display:block;margin-top:10px;max-width:34ch;font-size:15px}
.pie h3{font-family:var(--text);font-size:13px;letter-spacing:.12em;color:var(--tan-light);margin-bottom:14px}
.pie ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;font-size:15px}
.pie a{text-decoration:none;transition:color 180ms ease}
.pie a:hover{color:var(--cream)}
.pie .legal{margin-top:48px;padding-top:20px;border-top:1px solid rgba(255,255,255,.12);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:13px;color:#A9B4BA}

/* ---------- ENTRADAS ---------- */
.js [data-r]{opacity:.35;transform:translateY(24px);transition:opacity 800ms var(--ease-expo),transform 800ms var(--ease-expo);transition-delay:calc(var(--i,0) * 80ms)}
.js .in [data-r],.js [data-r].in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:1ms!important;animation:none!important}
  .js [data-r]{opacity:1;transform:none}
  html{scroll-behavior:auto}
}

/* ---------- TABLET ---------- */
@media (max-width:1100px){
  .intro h2,.intro .col{grid-column:1 / -1}
  .taller .panel{padding:56px 40px}
  .taller .fotos{grid-column:1 / span 6;padding:0 32px 32px 0}
  .taller .textos{grid-column:7 / span 6}
  .faq .lado{grid-column:1 / -1;position:static}
  .faq .lista{grid-column:1 / -1}
  .collage{grid-template-rows:220px 220px}
}
@media (max-width:860px){.cabecera nav{display:none}}

/* ---------- TELÉFONO ---------- */
@media (max-width:760px){
  .hero{min-height:620px}
  .hero-body{padding:48px var(--m)}
  .botones .btn{width:100%}
  .intro{padding:88px 0}
  .modelos h2{padding-top:64px}
  .track{flex-direction:column;overflow:visible;padding:32px var(--m) 56px;gap:24px}
  .card{flex:none;height:auto;width:100%}
  .card .foto{flex:none;height:auto;aspect-ratio:4/3}
  .card .panel{flex-direction:column;align-items:flex-start;gap:10px}
  .card .desc{text-align:left}
  .usos{padding:96px 0}
  .usos .grilla{grid-template-columns:1fr;gap:32px}
  .uso .ficha{aspect-ratio:4/3}
  .compat{min-height:auto;flex-direction:column}
  .compat > img{position:relative;height:60svh}
  .ficha-compat{margin:-72px var(--m) 48px;width:auto}
  .ruta{padding:96px 0}
  .collage{grid-template-columns:1fr 1fr;grid-template-rows:none;grid-auto-rows:44vw;gap:10px}
  .collage .alta{grid-row:auto}
  .taller{padding:0 10px 96px}
  .taller .panel{grid-template-columns:1fr;padding:32px 20px 40px;border-radius:22px}
  .taller .fotos,.taller .textos{grid-column:1}
  .taller .fotos{padding:0 24px 24px 0}
  .faq{padding:96px 0}
  .faq details{padding:4px 18px}
  .faq summary{font-size:17px}
  .pie .arriba{grid-template-columns:1fr 1fr}
  .pie .marca-pie{grid-column:1 / -1}
}

/* ---------- TARJETAS DE MODELO CLICKEABLES ---------- */
a.card{color:var(--ink)}
.card .ver{display:inline-flex;align-items:center;gap:6px;margin-top:10px;font-weight:700;font-size:15px;color:var(--terracotta)}
.card:hover .ver{text-decoration:underline;text-underline-offset:4px}

/* ---------- WHATSAPP FLOTANTE ---------- */
.wa-flotante{position:fixed;z-index:60;right:calc(20px + env(safe-area-inset-right,0px));bottom:calc(20px + env(safe-area-inset-bottom,0px));display:block;width:52px;height:52px;border-radius:50%;filter:drop-shadow(0 8px 16px rgba(20,30,35,.30));transition:transform 180ms var(--ease-out)}
.wa-flotante img{display:block;width:100%;height:100%}
.wa-flotante:hover{transform:translateY(-3px) scale(1.04)}
.wa-flotante:active{transform:scale(.94)}
.wa-flotante:focus-visible{outline:3px solid var(--terracotta);outline-offset:4px}
@media (max-width:760px){.wa-flotante{width:48px;height:48px;right:calc(16px + env(safe-area-inset-right,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px))}}

/* ---------- PÁGINA DE MODELO ---------- */
.migas{font-size:14px;color:var(--muted);padding-top:28px}
.migas ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.migas li+li::before{content:"›";margin-right:8px;color:var(--tan)}
.migas a{text-decoration:none}
.migas a:hover{color:var(--terracotta)}
.modelo-top{padding:28px 0 110px}
.modelo-top .wrap{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;row-gap:40px;align-items:start}
.galeria{grid-column:1 / span 7;display:flex;flex-direction:column;gap:12px}
.galeria .principal{aspect-ratio:4/5;border-radius:var(--r);overflow:hidden;background:var(--cream-deep)}
.galeria .principal img{width:100%;height:100%;object-fit:cover}
.miniaturas{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.miniaturas button{padding:0;border:3px solid transparent;border-radius:var(--r-sm);overflow:hidden;aspect-ratio:1;cursor:pointer;background:var(--cream-deep);transition:border-color 180ms ease,transform 140ms var(--ease-out)}
.miniaturas button:hover{transform:translateY(-2px)}
.miniaturas button[aria-pressed="true"]{border-color:var(--terracotta)}
.miniaturas img{width:100%;height:100%;object-fit:cover}
.info{grid-column:9 / span 4;position:sticky;top:104px;display:flex;flex-direction:column;gap:22px}
.info h1{font-family:var(--display);font-weight:700;font-size:var(--fs-h2);line-height:.9;text-transform:uppercase;color:var(--navy)}
.info h1 small{display:block;font-size:.36em;letter-spacing:.06em;color:#5E6A38;margin-bottom:10px}
.info .tag{font-size:var(--fs-lead);line-height:1.35;color:var(--navy);font-weight:600}
.info .precio{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.info .precio span{font-size:15px;color:var(--muted)}
.info .precio strong{font-family:var(--display);font-weight:700;font-size:clamp(2.5rem,2rem + 1.6vw,3.5rem);line-height:1;color:var(--terracotta)}
.info dl{margin:0;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.info dl div{background:var(--tan-tint);border-radius:var(--r-sm);padding:14px 16px}
.info dt{font-size:13px;color:var(--muted)}
.info dd{margin:2px 0 0;font-weight:700;color:var(--navy);font-size:17px;line-height:1.3}
.info .ctas{display:flex;flex-direction:column;gap:10px}
.info .ctas .btn{width:100%;min-height:56px;font-size:17px}
.info .nota{font-size:14px;color:var(--muted)}
.bloque-texto{padding:120px 0;background:var(--cream-deep)}
.bloque-texto .wrap{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;row-gap:32px;align-items:start}
.bloque-texto h2{grid-column:1 / span 5}
.bloque-texto .col{grid-column:7 / span 6;display:flex;flex-direction:column;gap:18px;color:var(--muted)}
.bloque-texto .col p:first-child{font-size:var(--fs-lead);line-height:1.4;font-weight:600;color:var(--navy)}
.ficha-tec{padding:120px 0}
.ficha-tec .wrap{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;row-gap:40px}
.ficha-tec h2{grid-column:1 / span 4}
.ficha-tec .tabla{grid-column:6 / span 7;overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:17px}
th,td{text-align:left;padding:16px 14px;border-bottom:1px solid var(--cream-deep);vertical-align:top}
th{font-weight:600;color:var(--muted);width:38%}
td{color:var(--navy);font-weight:600}
.comparativa{padding:120px 0;background:var(--cream-deep)}
.comparativa h2{margin-bottom:40px}
.comparativa .tabla{overflow-x:auto;background:var(--white);border-radius:var(--r);padding:8px 8px}
.comparativa table{min-width:620px}
.comparativa thead th{font-family:var(--display);font-size:28px;text-transform:uppercase;color:var(--navy);width:auto;border-bottom:2px solid var(--cream-deep)}
.comparativa thead th:first-child{font-family:var(--text);font-size:15px;color:var(--muted)}
.comparativa tbody th{width:22%}
.comparativa .actual{background:var(--tan-tint)}
.comparativa td a{color:var(--terracotta);font-weight:700}
@media (max-width:1100px){
  .galeria,.info{grid-column:1 / -1}
  .info{position:static}
  .bloque-texto h2,.bloque-texto .col,.ficha-tec h2,.ficha-tec .tabla{grid-column:1 / -1}
}
@media (max-width:760px){
  .modelo-top{padding-bottom:72px}
  .galeria .principal{aspect-ratio:4/4.4}
  .bloque-texto,.ficha-tec,.comparativa{padding:80px 0}
  .info dl{grid-template-columns:1fr 1fr}
}

/* ---------- CATÁLOGO ---------- */
.card .foto.plano,.galeria .principal.plano{background:#fff}
.card .foto.plano img{object-fit:contain;padding:18px 28px}
.galeria .principal.plano img{object-fit:contain;padding:32px}
.miniaturas{grid-template-columns:repeat(var(--cols,6),minmax(0,1fr))}
.miniaturas button.plano{background:#fff}
.miniaturas button.plano img{object-fit:contain;padding:6px}
.porque{padding:110px 0;background:var(--cream-deep)}
.porque .wrap{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;row-gap:36px;align-items:start}
.porque h2{grid-column:1 / span 4}
.lista-check{grid-column:6 / span 7;list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:14px}
.lista-check li{display:flex;gap:14px;align-items:flex-start;background:var(--white);border-radius:var(--r);padding:20px 22px;font-weight:600;color:var(--navy);line-height:1.35}
.lista-check svg{flex-shrink:0;color:#fff;background:var(--olive);border-radius:50%;padding:4px;width:28px;height:28px}
.ficha-tec .wrap{align-items:start}
.cab-ficha{grid-column:1 / span 6;display:flex;flex-direction:column;gap:32px}
.plano-grande{margin:0;background:#fff;border-radius:var(--r);padding:28px;display:flex;justify-content:center}
.plano-grande img{width:100%;height:auto;max-height:420px;object-fit:contain}
.tablas{grid-column:8 / span 5;display:flex;flex-direction:column;gap:36px}
.tablas h3{margin-bottom:10px;color:var(--navy)}
.tablas th{width:55%}
.equipo ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.equipo li{padding:14px 14px;border-bottom:1px solid var(--cream-deep);font-weight:600;color:var(--navy)}
@media (max-width:1100px){
  .porque h2,.lista-check,.cab-ficha,.tablas{grid-column:1 / -1}
}
@media (max-width:760px){
  .porque{padding:80px 0}
  .lista-check{grid-template-columns:1fr}
  .miniaturas{grid-template-columns:repeat(var(--cols-m,4),minmax(0,1fr))}
  .plano-grande{padding:18px}
}

/* ---------- POPUP GUÍA DE PATAGONIA ---------- */
.guia{border:0;padding:0;margin:auto;width:min(780px,calc(100% - 32px));max-height:calc(100svh - 32px);border-radius:var(--r);background:var(--cream);color:var(--ink);box-shadow:0 30px 80px rgba(20,28,36,.35);overflow:auto}
.guia[open]{display:grid;grid-template-columns:5fr 6fr}
.guia::backdrop{background:rgba(23,31,38,.55)}
.guia .foto{position:relative;min-height:420px;background:var(--cream-deep)}
.guia .foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.guia .cuerpo{position:relative;padding:44px 40px 30px}
.guia .paso-form,.guia .paso-listo{display:flex;flex-direction:column;gap:14px}
.guia .paso-listo,.guia.enviado .paso-form{display:none}
.guia.enviado .paso-listo{display:flex}
.guia .etiqueta{font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--terracotta)}
.guia h2{font-size:clamp(2rem,1.6rem + 1.3vw,2.75rem);color:var(--navy);padding-right:28px}
.guia p{color:var(--muted);font-size:16px;line-height:1.45;margin:0}
.guia form{display:flex;flex-direction:column;gap:10px;margin-top:4px}
.guia input[type=email]{min-height:52px;border:1.5px solid #D6CBB8;border-radius:999px;padding:0 22px;font:inherit;font-size:16px;color:var(--ink);background:#fff}
.guia input[type=email]:focus-visible{outline:2px solid var(--terracotta);outline-offset:2px;border-color:transparent}
.guia .btn{width:100%}
.guia .nota{font-size:13px}
.guia .error{color:var(--terracotta);font-size:14px}
.guia .cerrar{position:absolute;top:14px;right:14px;width:40px;height:40px;border:0;border-radius:50%;background:var(--cream-deep);color:var(--navy);display:grid;place-items:center;cursor:pointer}
.guia .cerrar:hover{background:var(--tan-light);color:#fff}
.guia .ahora-no{align-self:center;background:none;border:0;padding:6px;color:var(--muted);font:inherit;font-size:14px;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.guia .oculto,.guia .trampa{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;padding:0;margin:-1px}
.guia.hoja{position:fixed;z-index:90;inset:auto 12px calc(12px + env(safe-area-inset-bottom,0px)) 12px;width:auto;margin:0;max-height:calc(100svh - 24px)}
@media (max-width:760px){
  .guia[open]{grid-template-columns:1fr}
  .guia .foto{display:none}
  .guia .cuerpo{padding:20px 18px 10px}
  .guia .paso-form,.guia .paso-listo{gap:10px}
  .guia h2{font-size:1.75rem}
  .guia p{font-size:15px}
  .guia .nota{font-size:12px}
  .guia .cerrar{top:10px;right:10px;width:36px;height:36px}
}
@media (prefers-reduced-motion:no-preference){
  .guia[open]{animation:guia-in 380ms var(--ease-out)}
  @keyframes guia-in{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
}

/* ---------- POPUP ¿ENTRA EN TU AUTO? ---------- */
.compat-dlg{border:0;padding:0;margin:auto;width:min(560px,calc(100% - 24px));max-height:calc(100svh - 24px);border-radius:var(--r);background:var(--cream);color:var(--ink);box-shadow:0 30px 80px rgba(20,28,36,.35);overflow:auto}
.compat-dlg::backdrop{background:rgba(23,31,38,.55)}
.compat-dlg .cuerpo{position:relative;padding:40px 36px 28px}
.compat-dlg [data-paso]{display:flex;flex-direction:column;gap:14px}
.compat-dlg [data-paso][hidden]{display:none}
.compat-dlg .etiqueta{font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--terracotta)}
.compat-dlg h2{font-size:clamp(2rem,1.6rem + 1.3vw,2.6rem);color:var(--navy);padding-right:36px}
.compat-dlg p{margin:0;color:var(--muted);font-size:16px;line-height:1.45}
.compat-dlg p strong{color:var(--ink)}
.compat-dlg form{display:flex;flex-direction:column;gap:10px;margin-top:4px}
.compat-dlg input[type=text]{min-height:52px;border:1.5px solid #D6CBB8;border-radius:999px;padding:0 22px;font:inherit;font-size:16px;color:var(--ink);background:#fff}
.compat-dlg input[type=text]:focus-visible{outline:2px solid var(--terracotta);outline-offset:2px;border-color:transparent}
.compat-dlg .btn{width:100%}
.compat-dlg .cerrar{position:absolute;top:14px;right:14px;width:40px;height:40px;border:0;border-radius:50%;background:var(--cream-deep);color:var(--navy);display:grid;place-items:center;cursor:pointer}
.compat-dlg .cerrar:hover{background:var(--tan-light);color:#fff}
.compat-dlg .oculto{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;padding:0;margin:-1px}
.compat-dlg .sello{display:flex;align-items:center;gap:8px;color:var(--olive);font-weight:600;font-size:15px}
.compat-dlg .sello::before{content:"";width:18px;height:18px;flex:none;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/contain no-repeat}
.compat-dlg .kits{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.compat-dlg .kits a{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 18px;border-radius:14px;background:#fff;border:1.5px solid var(--cream-deep);text-decoration:none;color:var(--ink);transition:border-color 160ms ease}
.compat-dlg .kits a:hover{border-color:var(--terracotta)}
.compat-dlg .kits b{display:block;font-family:var(--display);font-weight:700;font-size:26px;line-height:1;text-transform:uppercase;color:var(--navy)}
.compat-dlg .kits small{font-size:14px;color:var(--muted)}
.compat-dlg .kits em{font-style:normal;font-weight:600;font-size:14px;color:var(--terracotta);white-space:nowrap}
.compat-dlg .otro{align-self:center;background:none;border:0;padding:6px;color:var(--muted);font:inherit;font-size:14px;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.card{position:relative}
.card .sello-entra{position:absolute;top:14px;left:14px;z-index:2;display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:999px;background:var(--olive);color:#fff;font-size:14px;font-weight:600;box-shadow:0 6px 16px rgba(20,30,35,.25)}
@media (max-width:760px){
  .compat-dlg .cuerpo{padding:26px 20px 18px}
  .compat-dlg h2{font-size:2rem}
  .compat-dlg .kits em{display:none}
}
@media (prefers-reduced-motion:no-preference){
  .compat-dlg[open]{animation:guia-in 320ms var(--ease-out)}
}
@media (max-width:760px){#modelos{scroll-margin-top:56px}}

/* ---------- ¿ENTRA EN TU AUTO? (páginas de modelo) ---------- */
.entra{padding:0 0 120px}
#compatibilidad{scroll-margin-top:90px}
.entra .entra-panel{background:var(--navy);color:var(--cream);border-radius:28px;padding:56px 60px;display:grid;grid-template-columns:5fr 7fr;gap:56px;align-items:center}
.entra .etiqueta{font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#E2C29E}
.entra h2{color:var(--cream);margin:12px 0 14px;font-size:clamp(2.25rem,1.6rem + 1.8vw,3.4rem)}
.entra p{margin:0;color:#D8DDDF;line-height:1.45}
.entra .fila{display:flex;gap:10px}
.entra input[type=text]{flex:1;min-width:0;min-height:56px;border:0;border-radius:999px;padding:0 24px;font:inherit;font-size:16px;color:var(--ink);background:#fff}
.entra input[type=text]:focus-visible{outline:3px solid var(--tan-light);outline-offset:2px}
.entra .fila .btn{min-height:56px;white-space:nowrap}
.entra .oculto{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;padding:0;margin:-1px}
.entra-res{margin-top:16px;padding:22px 24px;border-radius:18px;background:rgba(255,255,255,.08);display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.entra-res[hidden]{display:none}
.entra-res .titulo{font-weight:700;font-size:20px;line-height:1.3;color:#fff}
.entra-res.si .titulo{color:#D6E6B5}
.entra-res a:not(.btn){color:var(--tan-light);font-weight:600;text-underline-offset:3px}
.entra-res .btn{margin-top:4px}
.entra-res .alt{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.entra-res .alt a{display:inline-flex;padding:9px 16px;border-radius:999px;background:rgba(255,255,255,.12);color:#fff;text-decoration:none;font-weight:600}
.entra-res .alt a:hover{background:rgba(255,255,255,.2)}
@media (max-width:900px){.entra .entra-panel{grid-template-columns:1fr;gap:24px;padding:36px 28px}}
@media (max-width:760px){.entra{padding:0 0 90px}.entra .entra-panel{border-radius:22px;padding:30px 20px}}
@media (max-width:480px){.entra .fila{flex-direction:column}.entra .fila .btn,.entra-res .btn{width:100%}}
.entra .btn-accent:hover{background:#A2452A}

.card.c2 .ver{color:#5A2212}