
:root{
  --verde:#2E7D32; --verde-osc:#1E5A22; --hoja:#43A047; --hoja-clara:#E6F2E6;
  --tinta:#122019; --tinta-2:#1A2C22; --papel:#F4F7F3; --blanco:#fff;
  --linea:#DCE4DD; --gris:#56655C;
  --display:"Outfit", "Arial Black", system-ui, sans-serif;
  --texto:"Figtree", "Segoe UI", system-ui, -apple-system, sans-serif;
  --r-l:30px; --r-m:20px; --r-s:12px;
  --ancho:min(1220px, calc(100% - 40px));
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
}
*,*::before,*::after{box-sizing:inherit}
html{scroll-behavior:smooth; scroll-padding-top:calc(90px + env(safe-area-inset-top,0px)); -webkit-text-size-adjust:100%}
body{margin:0; background:var(--papel); color:var(--tinta); font-family:var(--texto); font-size:17px; line-height:1.6; overflow-x:hidden}
img,svg,video{max-width:100%; display:block}
a{color:inherit}
h1,h2,h3{font-family:var(--display); margin:0; line-height:1.02; letter-spacing:-.02em}
p{margin:0}
.wrap{width:var(--ancho); margin-inline:auto}
:focus-visible{outline:3px solid var(--hoja); outline-offset:3px; border-radius:6px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ico{width:1.2em;height:1.2em;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ico-fill{fill:currentColor;stroke:none}

/* ---------- Botones ---------- */
.btn{display:inline-flex; align-items:center; gap:.6em; padding:.95em 1.5em; border-radius:999px; font-family:var(--display); font-weight:700; font-size:1rem; text-decoration:none; border:2px solid transparent; cursor:pointer; transition:transform .25s ease, background .25s, color .25s, box-shadow .25s; white-space:nowrap}
.btn:hover{transform:translateY(-2px)}
.btn-verde{background:var(--verde); color:#fff; box-shadow:0 12px 30px -12px rgba(46,125,50,.8)}
.btn-verde:hover{background:var(--hoja)}
.btn-borde{border-color:rgba(255,255,255,.55); color:#fff}
.btn-borde:hover{background:#fff; color:var(--tinta)}
.btn-blanco{background:#fff; color:var(--verde-osc)}
.btn-tinta{background:var(--tinta); color:#fff}
.btn-tinta:hover{background:var(--verde)}
.btn-linea{border-color:var(--linea); color:var(--tinta); background:#fff}
.btn-linea:hover{border-color:var(--verde); color:var(--verde)}

/* ---------- Barra de progreso ---------- */
#progreso{position:fixed; top:0; left:0; height:3px; width:100%; background:var(--hoja); transform-origin:0 50%; transform:scaleX(0); z-index:80}

/* ---------- Cabecera ---------- */
.cab{position:fixed; top:0; left:0; right:0; z-index:60; padding-top:env(safe-area-inset-top,0px); transition:background .35s, box-shadow .35s, color .35s; color:#fff}
.cab .topbar{max-height:40px; overflow:hidden; transition:max-height .35s, opacity .35s; border-bottom:1px solid rgba(255,255,255,.12); font-size:.84rem}
.topbar .wrap{display:flex; justify-content:space-between; align-items:center; height:40px; gap:20px}
.topbar a{text-decoration:none; display:inline-flex; align-items:center; gap:.45em; opacity:.9}
.topbar a:hover{opacity:1; color:var(--hoja)}
.topbar-izq,.topbar-der{display:flex; gap:22px; align-items:center}
.estado{display:inline-flex; align-items:center; gap:.5em; font-weight:600}
.estado i{width:8px; height:8px; border-radius:50%; background:#9aa59f}
.estado.abierto i{background:#4ade80; box-shadow:0 0 0 0 rgba(74,222,128,.7); animation:latido 2s infinite}
@keyframes latido{70%{box-shadow:0 0 0 8px rgba(74,222,128,0)}100%{box-shadow:0 0 0 0 rgba(74,222,128,0)}}
.nav{display:flex; align-items:center; justify-content:space-between; height:84px; gap:24px; transition:height .35s}
.marca{display:block; height:74px; transition:height .35s}
.marca img{height:100%; width:auto}
.marca .logo-color{display:none}
.menu{display:flex; align-items:center; gap:30px; list-style:none; margin:0; padding:0}
.menu a{text-decoration:none; font-family:var(--display); font-weight:600; font-size:1rem; position:relative; padding:6px 0}
.menu a::after{content:""; position:absolute; left:0; right:0; bottom:0; height:2px; background:var(--hoja); transform:scaleX(0); transform-origin:left; transition:transform .3s}
.menu a:hover::after{transform:scaleX(1)}
.nav-der{display:flex; align-items:center; gap:14px}
.idioma{display:flex; border:1.5px solid currentColor; border-radius:999px; overflow:hidden; font-family:var(--display); font-weight:700; font-size:.8rem; opacity:.85}
.idioma button{background:none; border:0; color:inherit; padding:.35em .75em; cursor:pointer; font:inherit}
.idioma button[aria-pressed="true"]{background:var(--verde); color:#fff}
.nav .btn{padding:.7em 1.2em; font-size:.95rem}
.hamb{display:none; background:none; border:0; color:inherit; width:44px; height:44px; cursor:pointer; padding:0}
.hamb span{display:block; width:26px; height:2.5px; background:currentColor; margin:6px auto; border-radius:2px; transition:transform .3s, opacity .3s}
.cab.solida{background:rgba(255,255,255,.96); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); color:var(--tinta); box-shadow:0 10px 30px -20px rgba(18,32,25,.5)}
.cab.solida .topbar{max-height:0; opacity:0; border:0}
.cab.solida .nav{height:70px}
.cab.solida .marca{height:54px}
.cab.solida .logo-blanco{display:none}
.cab.solida .logo-color{display:block}

/* Menú móvil */
.menu-movil{position:fixed; inset:0; z-index:70; background:var(--tinta); color:#fff; display:flex; flex-direction:column; justify-content:center; padding:40px 28px calc(40px + env(safe-area-inset-bottom,0px)); transform:translateY(-100%); transition:transform .45s cubic-bezier(.7,0,.2,1); visibility:hidden}
.menu-movil.abierto{transform:none; visibility:visible}
.menu-movil ul{list-style:none; padding:0; margin:0 0 34px}
.menu-movil li a{display:block; font-family:var(--display); font-size:2.1rem; font-weight:800; text-decoration:none; padding:.25em 0; border-bottom:1px solid rgba(255,255,255,.1)}
.menu-movil .cerrar{position:absolute; top:calc(18px + env(safe-area-inset-top,0px)); right:20px; background:none; border:0; color:#fff; font-size:2.4rem; cursor:pointer; line-height:1; width:48px; height:48px}

/* ---------- Portada ---------- */
.hero{position:relative; min-height:100svh; display:flex; align-items:center; background:var(--tinta); color:#fff; overflow:hidden; isolation:isolate}
.hero-medio{position:absolute; inset:0; z-index:-2; background:
  radial-gradient(60% 70% at 78% 45%, #2b4a36 0%, transparent 70%),
  radial-gradient(40% 50% at 95% 90%, #1f5a24 0%, transparent 70%),
  linear-gradient(180deg,#0f1a14,#16261d)}
.hero-medio video{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transition:opacity 1s}
.hero-medio video.listo{opacity:1}
.estela{position:absolute; height:2px; border-radius:2px; background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent); filter:blur(.5px); animation:estela linear infinite; opacity:.7}
.estela.v{background:linear-gradient(90deg,transparent,rgba(67,160,71,.9),transparent); height:3px}
@keyframes estela{from{transform:translateX(110vw)} to{transform:translateX(-60vw)}}
.hero-sombra{position:absolute; inset:0; z-index:-1; background:
  linear-gradient(90deg, rgba(12,20,15,.94) 0%, rgba(12,20,15,.78) 38%, rgba(12,20,15,.25) 75%, rgba(12,20,15,.1) 100%),
  linear-gradient(0deg, rgba(12,20,15,.85) 0%, transparent 35%)}
.hero-cont{padding:170px 0 120px; max-width:760px}
.pastilla{display:inline-flex; align-items:center; gap:.55em; padding:.5em 1em; border:1.5px solid rgba(255,255,255,.35); border-radius:999px; font-weight:600; font-size:.92rem; background:rgba(255,255,255,.06); backdrop-filter:blur(6px)}
.pastilla svg{color:var(--hoja)}
.hero h1{font-size:clamp(2.6rem, 6.4vw, 5.3rem); font-weight:900; text-transform:uppercase; line-height:.98; margin:26px 0 24px; letter-spacing:-.025em}
.hero h1 .linea{display:block}
.velocidad{display:inline-flex; flex-direction:column; gap:.1em; vertical-align:middle; margin-left:.18em; width:.7em}
.velocidad i{display:block; height:.1em; border-radius:1em; background:var(--hoja)}
.velocidad i:nth-child(2){width:80%; margin-left:20%}
.velocidad i:nth-child(3){width:55%; margin-left:45%}
.hero-sub{font-size:clamp(1.05rem,1.6vw,1.25rem); max-width:560px; color:rgba(255,255,255,.85)}
.hero-acc{display:flex; flex-wrap:wrap; gap:14px; margin-top:36px}
.hero-google{display:inline-flex; align-items:center; gap:.7em; margin-top:34px; text-decoration:none; font-size:.95rem; color:rgba(255,255,255,.85)}
.hero-google strong{font-family:var(--display); font-size:1.15rem; color:#fff}
.estrellas{display:inline-flex; gap:2px; color:#FBBC04}
.estrellas svg{width:17px; height:17px}
.aviso-foto{position:absolute; right:24px; bottom:26px; font-size:.78rem; padding:.45em .9em; border:1px dashed rgba(255,255,255,.4); border-radius:999px; color:rgba(255,255,255,.7); display:flex; gap:.5em; align-items:center}
/* Secuencia de entrada de la portada */
.js .hero-cont > *{opacity:0; transform:translateY(26px)}
.cargado .hero-cont > *{opacity:1; transform:none; transition:opacity .8s ease, transform .8s cubic-bezier(.2,.7,.2,1)}
.cargado .hero-cont > *:nth-child(2){transition-delay:.12s}
.cargado .hero-cont > *:nth-child(3){transition-delay:.26s}
.cargado .hero-cont > *:nth-child(4){transition-delay:.4s}
.cargado .hero-cont > *:nth-child(5){transition-delay:.52s}

/* ---------- Cinta ---------- */
.cinta{background:var(--verde); color:#fff; overflow:hidden; padding:16px 0; font-family:var(--display); font-weight:700; font-size:1.05rem}
.cinta-pista{display:flex; width:max-content; animation:desliza 38s linear infinite}
.cinta-pista span{display:inline-flex; align-items:center; gap:22px; padding-right:22px; white-space:nowrap}
.cinta svg{width:18px; height:18px; color:#b9e3bb}
@keyframes desliza{to{transform:translateX(-50%)}}

/* ---------- Secciones ---------- */
.sec{padding:clamp(80px,10vw,130px) 0}
.sec-blanca{background:#fff}
.cabeza{display:grid; grid-template-columns:1.1fr .9fr; gap:40px; align-items:end; margin-bottom:54px}
.cabeza h2, .h2{font-size:clamp(2.1rem,4.6vw,3.6rem); font-weight:800}
.cabeza p, .entrada{color:var(--gris); font-size:1.1rem; max-width:52ch}

/* Servicios */
.servicios{display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:minmax(270px,auto); gap:18px}
.tile{position:relative; border-radius:var(--r-l); overflow:hidden; color:#fff; text-decoration:none; display:flex; flex-direction:column; justify-content:flex-end; padding:28px; isolation:isolate; transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)); transition:transform .25s ease, box-shadow .35s; box-shadow:0 0 0 0 transparent}
.tile:hover{box-shadow:0 0 0 2px var(--hoja), 0 30px 60px -28px rgba(46,125,50,.75)}
.tile-grande{grid-column:span 2; grid-row:span 2; padding:38px}
.tile-ancha{grid-column:span 2}
.tile-foto{position:absolute; inset:0; z-index:-2; background:linear-gradient(140deg,#24402f,#101b15); transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.tile:hover .tile-foto{transform:scale(1.06)}
.tile-foto img{width:100%; height:100%; object-fit:cover}
.tile::after{content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(0deg, rgba(12,20,15,.92) 0%, rgba(12,20,15,.35) 55%, rgba(12,20,15,.05) 100%)}
.falta-foto{position:absolute; top:18px; left:18px; font-size:.74rem; padding:.35em .8em; border:1px dashed rgba(255,255,255,.35); border-radius:999px; color:rgba(255,255,255,.7); background:rgba(0,0,0,.2)}
.tile .ico-srv{width:50px; height:50px; border-radius:15px; background:var(--verde); display:grid; place-items:center; margin-bottom:18px}
.tile .ico-srv svg{width:26px; height:26px}
.tile h3{font-size:1.55rem; font-weight:800; margin-bottom:8px}
.tile-grande h3{font-size:clamp(2rem,3.4vw,2.8rem)}
.tile p{color:rgba(255,255,255,.82); font-size:.98rem; max-width:40ch}
.tile .mas{margin-top:16px; font-family:var(--display); font-weight:700; font-size:.95rem; display:inline-flex; align-items:center; gap:.4em; color:#b9e3bb}
.tile .mas svg{transition:transform .3s}
.tile:hover .mas svg{transform:translateX(5px)}
.etiqueta-multi{display:inline-flex; align-self:flex-start; gap:.5em; align-items:center; background:#fff; color:var(--verde-osc); font-weight:700; font-size:.85rem; padding:.45em .9em; border-radius:999px; margin-bottom:18px}
.tile-movilidad{grid-column:1 / -1; min-height:230px; background:var(--hoja-clara); color:var(--tinta); flex-direction:row; align-items:center; justify-content:space-between; gap:30px}
.tile-movilidad::after{display:none}
.tile-movilidad p{color:var(--gris); font-size:1.05rem; max-width:58ch}
.tile-movilidad h3{font-size:clamp(1.6rem,3vw,2.3rem)}
.tile-movilidad .mas{color:var(--verde)}
.tile-movilidad .btn{flex:none}

/* Multimarca */
.multi{background:#fff; overflow:hidden}
.multi-gr{display:grid; grid-template-columns:1.2fr .8fr; gap:50px; align-items:center}
.multi h2{font-size:clamp(2.4rem,5.6vw,4.6rem); font-weight:900}
.multi h2 .gris{color:#b7c3bb; display:block}
.multi p{color:var(--gris); font-size:1.1rem}
.multi-lista{list-style:none; padding:0; margin:22px 0 0; display:grid; gap:12px}
.multi-lista li{display:flex; gap:.7em; align-items:flex-start; font-weight:600}
.multi-lista svg{color:var(--verde); margin-top:.2em}
.marcas{margin-top:70px; overflow:hidden; mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent); -webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.marcas-pista{display:flex; width:max-content; animation:desliza 45s linear infinite}
.marcas-pista span{font-family:var(--display); font-weight:900; font-size:clamp(2.4rem,6vw,4.4rem); text-transform:uppercase; padding:0 .55em; color:transparent; -webkit-text-stroke:1.5px #b7c3bb; white-space:nowrap; transition:color .3s}
.marcas-pista span:hover{color:var(--verde); -webkit-text-stroke-color:var(--verde)}
.marcas-nota{text-align:center; color:var(--gris); margin-top:18px; font-size:.95rem}

/* Contadores */
.numeros{background:var(--tinta); color:#fff; position:relative; overflow:hidden}
.numeros::before{content:""; position:absolute; inset:0; background:repeating-linear-gradient(90deg, rgba(255,255,255,.03) 0 1px, transparent 1px 120px); pointer-events:none}
.numeros .wrap{position:relative}
.numeros-cab{display:flex; justify-content:space-between; align-items:end; gap:30px; margin-bottom:56px; flex-wrap:wrap}
.numeros-cab h2{font-size:clamp(1.9rem,3.6vw,2.8rem); font-weight:800; max-width:16ch}
.numeros-cab p{color:rgba(255,255,255,.7); max-width:42ch}
.contadores{display:grid; grid-template-columns:repeat(3,1fr); gap:0}
.contador{padding:10px 34px 10px 0; border-left:1px solid rgba(255,255,255,.14); padding-left:34px}
.contador:first-child{border-left:0; padding-left:0}
.contador .cifra{font-family:var(--display); font-weight:900; font-size:clamp(3.2rem,7.4vw,6.2rem); line-height:1; letter-spacing:-.03em; font-variant-numeric:tabular-nums}
.contador .cifra b{color:var(--hoja); font-weight:900}
.contador .que{margin-top:12px; font-size:1.1rem; color:rgba(255,255,255,.82); font-weight:500}
.barra-g{margin-top:60px; padding-top:28px; border-top:1px solid rgba(255,255,255,.14); display:flex; align-items:center; gap:16px; flex-wrap:wrap}
.barra-g a{color:#b9e3bb; font-weight:600}

/* Ventajas */
.ventajas{display:grid; grid-template-columns:repeat(4,1fr); gap:34px}
.ventaja .circ{width:62px; height:62px; border-radius:50%; background:var(--hoja-clara); color:var(--verde); display:grid; place-items:center; margin-bottom:20px; transition:background .3s, color .3s, transform .3s}
.ventaja:hover .circ{background:var(--verde); color:#fff; transform:rotate(-8deg)}
.ventaja .circ svg{width:28px; height:28px}
.ventaja h3{font-size:1.35rem; font-weight:700; margin-bottom:8px; letter-spacing:-.01em}
.ventaja p{color:var(--gris)}

/* Matriculación */
.matri-gr{display:grid; grid-template-columns:.85fr 1.15fr; gap:56px; align-items:start}
.matri-izq .h2{margin-bottom:22px}
.matri-izq .entrada{margin-bottom:28px}
.dato-dgt{display:flex; gap:16px; align-items:center; background:#fff; border:1px solid var(--linea); border-radius:var(--r-m); padding:18px 20px}
.dato-dgt .circ{width:48px; height:48px; border-radius:14px; background:var(--verde); color:#fff; display:grid; place-items:center; flex:none}
.dato-dgt strong{font-family:var(--display); display:block; font-size:1.1rem}
.dato-dgt span{color:var(--gris); font-size:.95rem}
.packs{display:grid; grid-template-columns:1fr 1fr; gap:18px; align-items:start}
.pack{background:#fff; border:1px solid var(--linea); border-radius:var(--r-l); padding:34px 30px; display:flex; flex-direction:column}
.pack-top{background:var(--tinta); color:#fff; border-color:var(--tinta); position:relative}
.pack .tipo{font-weight:700; color:var(--verde); font-size:.95rem}
.pack-top .tipo{color:#b9e3bb}
.pack h3{font-size:1.85rem; font-weight:800; margin:6px 0 12px}
.pack .desc{color:var(--gris); margin-bottom:22px}
.pack-top .desc{color:rgba(255,255,255,.75)}
.pack h4{font-family:var(--display); font-size:1rem; margin:0 0 10px; font-weight:700}
.pack ul{list-style:none; padding:0; margin:0 0 22px; display:grid; gap:9px}
.pack li{display:flex; gap:.6em; align-items:flex-start; font-size:.98rem}
.pack li svg{color:var(--hoja); margin-top:.22em; width:1.05em; height:1.05em}
.pack .traer{background:var(--papel); border-radius:var(--r-s); padding:16px 18px; margin-bottom:24px}
.pack-top .traer{background:rgba(255,255,255,.07)}
.pack .btn{margin-top:auto; justify-content:center}

/* Envíos */
.envio{background:var(--verde); color:#fff; position:relative; overflow:hidden}
.envio::before{content:""; position:absolute; width:760px; height:760px; right:-220px; top:-260px; border-radius:50%; background:radial-gradient(circle, rgba(255,255,255,.14), transparent 65%)}
.envio-gr{display:grid; grid-template-columns:1.05fr .95fr; gap:60px; align-items:center; position:relative}
.envio h2{font-size:clamp(2.3rem,5vw,4rem); font-weight:900}
.envio p{font-size:1.15rem; color:rgba(255,255,255,.88); margin:22px 0 32px; max-width:48ch}
.envio .rayas{display:flex; flex-direction:column; gap:10px; margin-bottom:26px}
.envio .rayas i{display:block; height:10px; border-radius:9px; background:rgba(255,255,255,.85)}
.envio .rayas i:nth-child(1){width:70px}.envio .rayas i:nth-child(2){width:52px; margin-left:18px}.envio .rayas i:nth-child(3){width:34px; margin-left:36px}
.envio-foto{aspect-ratio:4/3.4; border-radius:var(--r-l); background:linear-gradient(150deg,#1E5A22,#123a17); position:relative; overflow:hidden; display:grid; place-items:center}
.envio-foto svg.gran{width:46%; height:auto; color:rgba(255,255,255,.22); stroke-width:1.2}
.envio-sello{position:absolute; left:22px; bottom:22px; background:#fff; color:var(--tinta); border-radius:var(--r-m); padding:14px 18px; display:flex; gap:12px; align-items:center; font-weight:600; box-shadow:0 20px 40px -20px rgba(0,0,0,.5)}
.envio-sello svg{color:var(--verde); width:28px; height:28px}

/* Redes */
.redes-cab{display:grid; grid-template-columns:1fr auto; gap:40px; align-items:end; margin-bottom:46px}
.redes-datos{display:flex; gap:16px; flex-wrap:wrap}
.red{border:1px solid var(--linea); border-radius:var(--r-m); padding:20px 24px; min-width:220px; text-decoration:none; background:#fff; transition:border-color .3s, transform .3s}
.red:hover{border-color:var(--verde); transform:translateY(-3px)}
.red-top{display:flex; align-items:center; gap:.6em; font-weight:700; margin-bottom:6px}
.red-top svg{width:22px; height:22px}
.red .n{font-family:var(--display); font-size:2.2rem; font-weight:800; line-height:1.1}
.red .s{color:var(--gris); font-size:.92rem}
.red .seguir{display:inline-block; margin-top:10px; color:var(--verde); font-weight:700; font-size:.92rem}
.videos{display:flex; gap:16px; overflow-x:auto; scroll-snap-type:x mandatory; padding:4px 20px 20px; margin:0 -20px; scrollbar-width:thin; scrollbar-color:var(--linea) transparent}
.video{flex:0 0 clamp(200px,22vw,250px); aspect-ratio:9/16; border-radius:var(--r-m); scroll-snap-align:start; position:relative; overflow:hidden; text-decoration:none; color:#fff; background:linear-gradient(165deg,#24402f,#0f1a14); display:flex; flex-direction:column; justify-content:flex-end; padding:18px; isolation:isolate}
.video:nth-child(3n+2){background:linear-gradient(165deg,#2E7D32,#123a17)}
.video:nth-child(3n){background:linear-gradient(165deg,#33443a,#141f19)}
.video .play{position:absolute; inset:0; margin:auto; width:64px; height:64px; border-radius:50%; background:rgba(255,255,255,.16); backdrop-filter:blur(6px); display:grid; place-items:center; transition:transform .3s, background .3s}
.video:hover .play{transform:scale(1.12); background:var(--verde)}
.video .play svg{width:24px; height:24px; margin-left:4px}
.video .tt{display:flex; align-items:center; gap:.5em; font-weight:700; font-size:.92rem}
.video .tt svg{width:18px; height:18px}
.video small{color:rgba(255,255,255,.65); font-size:.8rem}
.nota{font-size:.88rem; color:var(--gris); margin-top:10px}

/* Reseñas */
.resenas-cab{display:grid; grid-template-columns:auto 1fr; gap:60px; align-items:center; margin-bottom:50px}
.nota-g{display:flex; align-items:center; gap:20px}
.nota-g .grande{font-family:var(--display); font-weight:900; font-size:clamp(4.5rem,9vw,7.5rem); line-height:.9; letter-spacing:-.04em}
.nota-g .estrellas svg{width:26px; height:26px}
.nota-g .cuantas{color:var(--gris); margin-top:6px; font-weight:600}
.resenas-der{display:flex; justify-content:space-between; align-items:end; gap:24px; flex-wrap:wrap}
.resenas-botones{display:flex; gap:12px; flex-wrap:wrap}
.carrusel{position:relative}
.pista{display:flex; gap:18px; overflow-x:auto; scroll-snap-type:x mandatory; scroll-behavior:smooth; padding:4px 2px 24px; scrollbar-width:none}
.pista::-webkit-scrollbar{display:none}
.resena{flex:0 0 clamp(280px,31%,380px); scroll-snap-align:start; background:#fff; border:1px solid var(--linea); border-radius:var(--r-m); padding:28px; display:flex; flex-direction:column; gap:18px}
.resena blockquote{margin:0; font-size:1.02rem; line-height:1.6; flex:1}
.autor{display:flex; align-items:center; gap:12px}
.autor .ini{width:42px; height:42px; border-radius:50%; background:var(--hoja-clara); color:var(--verde); font-family:var(--display); font-weight:800; display:grid; place-items:center}
.autor strong{display:block; font-size:.98rem}
.autor span{font-size:.84rem; color:var(--gris)}
.flechas{display:flex; gap:10px}
.flecha{width:50px; height:50px; border-radius:50%; border:1.5px solid var(--linea); background:#fff; display:grid; place-items:center; cursor:pointer; color:var(--tinta); transition:background .25s, color .25s, border-color .25s}
.flecha:hover{background:var(--tinta); color:#fff; border-color:var(--tinta)}

/* Contacto */
.contacto-gr{display:grid; grid-template-columns:.9fr 1.1fr; gap:50px; align-items:stretch}
.contacto-gr .h2{margin:16px 0 26px}
.estado-g{display:inline-flex; align-items:center; gap:.55em; font-weight:700; padding:.5em 1em; border-radius:999px; background:var(--papel); font-size:.95rem}
.estado-g i{width:9px; height:9px; border-radius:50%; background:#9aa59f}
.estado-g.abierto{background:#e3f6e4; color:var(--verde-osc)}
.estado-g.abierto i{background:#22c55e; animation:latido 2s infinite}
.datos{list-style:none; padding:0; margin:0 0 26px; display:grid; gap:4px}
.datos li > a{display:flex; gap:14px; align-items:flex-start; padding:12px 0; text-decoration:none; border-bottom:1px solid var(--linea)}
.datos li a:hover strong{color:var(--verde)}
.datos svg{color:var(--verde); width:22px; height:22px; margin-top:2px}
.datos strong{display:block; font-family:var(--display); font-size:1.08rem; transition:color .25s}
.datos span{color:var(--gris); font-size:.95rem}
.horario{width:100%; border-collapse:collapse; font-size:.96rem}
.horario td{padding:6px 0}
.horario td:last-child{text-align:right; color:var(--gris)}
.horario tr.hoy td{font-weight:700; color:var(--verde)}
.zona{margin-top:26px}
.zona h3{font-size:1.1rem; font-weight:700; margin-bottom:12px}
.chips{display:flex; flex-wrap:wrap; gap:8px}
.chips span{border:1px solid var(--linea); border-radius:999px; padding:.35em .9em; font-size:.9rem; background:#fff}
.chips span.casa{background:var(--verde); color:#fff; border-color:var(--verde)}
.mapa{border-radius:var(--r-l); overflow:hidden; min-height:480px; background:
  linear-gradient(rgba(244,247,243,.55),rgba(244,247,243,.55)),
  repeating-linear-gradient(0deg,#e3e9e3 0 2px,transparent 2px 64px),
  repeating-linear-gradient(90deg,#e3e9e3 0 2px,transparent 2px 64px),#eef2ee; position:relative; display:grid; place-items:center; text-align:center; padding:30px}
.mapa iframe{position:absolute; inset:0; width:100%; height:100%; border:0}
.mapa .pin{width:64px; height:64px; border-radius:50% 50% 50% 0; transform:rotate(-45deg); background:var(--verde); display:grid; place-items:center; margin:0 auto 22px; box-shadow:0 16px 30px -12px rgba(46,125,50,.8)}
.mapa .pin svg{transform:rotate(45deg); color:#fff; width:28px; height:28px}
.mapa p{color:var(--gris); max-width:36ch; margin:8px auto 20px; font-size:.95rem}
.mapa .btns{display:flex; gap:10px; justify-content:center; flex-wrap:wrap}

/* Pie */
.pie{background:var(--tinta); color:rgba(255,255,255,.75); padding:80px 0 calc(34px + env(safe-area-inset-bottom,0px)); font-size:.95rem}
.pie-gr{display:grid; grid-template-columns:1.3fr 1fr 1fr 1fr; gap:40px; padding-bottom:50px; border-bottom:1px solid rgba(255,255,255,.12)}
.pie img{height:110px; width:auto; margin-bottom:18px}
.pie h3{font-size:1.05rem; color:#fff; margin-bottom:14px; font-weight:700; letter-spacing:0}
.pie ul{list-style:none; padding:0; margin:0; display:grid; gap:8px}
.pie a{text-decoration:none}
.pie a:hover{color:var(--hoja)}
.pie-redes{display:flex; gap:10px; margin-top:18px}
.pie-redes a{width:42px; height:42px; border-radius:50%; border:1px solid rgba(255,255,255,.2); display:grid; place-items:center; transition:background .25s, border-color .25s}
.pie-redes a:hover{background:var(--verde); border-color:var(--verde); color:#fff}
.pie-redes svg{width:19px; height:19px}
.legal{display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap; padding-top:26px; font-size:.85rem; color:rgba(255,255,255,.55)}
.legal nav{display:flex; gap:18px; flex-wrap:wrap}
.legal button{background:none; border:0; color:inherit; font:inherit; cursor:pointer; padding:0}
.legal button:hover{color:var(--hoja)}

/* WhatsApp flotante */
.wa-flot{position:fixed; right:22px; bottom:calc(22px + env(safe-area-inset-bottom,0px)); z-index:55; display:flex; align-items:center; gap:12px}
.wa-btn{width:64px; height:64px; border-radius:50%; background:#25D366; color:#fff; display:grid; place-items:center; box-shadow:0 14px 30px -10px rgba(37,211,102,.8); position:relative; transition:transform .25s}
.wa-btn:hover{transform:scale(1.08)}
.wa-btn::before{content:""; position:absolute; inset:0; border-radius:50%; border:2px solid #25D366; animation:onda 2.4s ease-out infinite}
@keyframes onda{from{transform:scale(1); opacity:.8} to{transform:scale(1.6); opacity:0}}
.wa-btn svg{width:32px; height:32px}
.wa-globo{background:#fff; color:var(--tinta); padding:10px 14px 10px 16px; border-radius:16px 16px 4px 16px; box-shadow:0 14px 30px -14px rgba(0,0,0,.35); font-weight:600; font-size:.93rem; display:flex; align-items:center; gap:10px; opacity:0; transform:translateX(12px); pointer-events:none; transition:opacity .4s, transform .4s}
.wa-globo.ver{opacity:1; transform:none; pointer-events:auto}
.wa-globo button{background:none; border:0; cursor:pointer; color:var(--gris); font-size:1.1rem; line-height:1; padding:2px}

/* Barra inferior móvil */
.barra-movil{display:none}

/* Cookies */
.cookies{position:fixed; left:20px; bottom:calc(20px + env(safe-area-inset-bottom,0px)); z-index:90; max-width:460px; background:#fff; border-radius:var(--r-m); box-shadow:0 30px 60px -20px rgba(18,32,25,.45); border:1px solid var(--linea); padding:24px; display:none}
.cookies.ver{display:block}
.cookies h3{font-size:1.15rem; margin-bottom:8px; letter-spacing:0}
.cookies p{font-size:.9rem; color:var(--gris)}
.cookies .fila{display:flex; gap:8px; margin-top:16px; flex-wrap:wrap}
.cookies .btn{padding:.65em 1.1em; font-size:.9rem; flex:1; justify-content:center}
.cookies .opciones{display:none; margin-top:14px; border-top:1px solid var(--linea); padding-top:12px}
.cookies .opciones.ver{display:grid; gap:10px}
.cookies label{display:flex; justify-content:space-between; gap:12px; align-items:center; font-size:.9rem}
.cookies label small{display:block; color:var(--gris)}
.cookies input{width:20px; height:20px; accent-color:var(--verde)}

/* Aviso */
.toast{position:fixed; left:50%; top:calc(100px + env(safe-area-inset-top,0px)); transform:translate(-50%,-20px); background:var(--tinta); color:#fff; padding:12px 20px; border-radius:999px; font-size:.92rem; z-index:95; opacity:0; pointer-events:none; transition:opacity .3s, transform .3s; max-width:calc(100% - 40px); text-align:center}
.toast.ver{opacity:1; transform:translate(-50%,0)}

/* Pantalla de carga */
#carga{position:fixed; inset:0; z-index:100; background:#fff; display:grid; place-items:center; transition:opacity .5s, visibility .5s}
#carga img{width:130px; animation:aparece .8s ease both}
@keyframes aparece{from{opacity:0; transform:scale(.9)}}
.cargado #carga{opacity:0; visibility:hidden}

/* Aparición al hacer scroll */
.js [data-rev]{opacity:0; transform:translateY(28px); transition:opacity .8s ease, transform .8s cubic-bezier(.2,.7,.2,1)}
.js [data-rev].in{opacity:1; transform:none}

/* ---------- Responsive ---------- */
@media (max-width:1080px){
  .menu{display:none}
  .hamb{display:block}
  .nav .btn-wa-nav{display:none}
  .servicios{grid-template-columns:1fr 1fr}
  .tile-grande{grid-column:1 / -1; grid-row:auto; min-height:420px}
  .tile-ancha{grid-column:span 1}
  .ventajas{grid-template-columns:1fr 1fr}
  .matri-gr,.envio-gr,.contacto-gr,.multi-gr{grid-template-columns:1fr}
  .pie-gr{grid-template-columns:1fr 1fr}
  .redes-cab,.resenas-cab,.cabeza{grid-template-columns:1fr; gap:24px}
}
@media (max-width:720px){
  body{font-size:16px; padding-bottom:calc(70px + env(safe-area-inset-bottom,0px))}
  .topbar{display:none}
  .nav{height:70px}
  .marca{height:54px}
  .cab.solida .marca{height:48px}
  .cab.solida .nav{height:62px}
  .idioma{font-size:.75rem}
  .hero{align-items:flex-end}
  .hero-cont{padding:130px 0 70px}
  .hero-sombra{background:linear-gradient(0deg, rgba(12,20,15,.96) 0%, rgba(12,20,15,.75) 50%, rgba(12,20,15,.35) 100%)}
  .hero-acc .btn{flex:1 1 100%; justify-content:center; white-space:normal; text-align:center}
  .aviso-foto{top:88px; bottom:auto; right:14px}
  .servicios{grid-template-columns:1fr; grid-auto-rows:minmax(240px,auto)}
  .tile-grande{min-height:380px; padding:28px}
  .tile-ancha{grid-column:auto}
  .tile-movilidad{flex-direction:column; align-items:flex-start}
  .contadores{grid-template-columns:1fr; gap:30px}
  .contador,.contador:first-child{border-left:0; padding:0 0 26px; border-bottom:1px solid rgba(255,255,255,.14)}
  .ventajas{grid-template-columns:1fr; gap:30px}
  .packs{grid-template-columns:1fr}
  .red{flex:1 1 100%}
  .resena{flex-basis:86%}
  .nota-g{gap:14px}
  .pie-gr{grid-template-columns:1fr}
  .mapa{min-height:360px}
  .wa-flot{display:none}
  .barra-movil{display:grid; grid-template-columns:1fr 1.3fr 1fr; position:fixed; left:0; right:0; bottom:0; z-index:58; background:#fff; border-top:1px solid var(--linea); padding:8px 10px calc(8px + env(safe-area-inset-bottom,0px)); gap:8px; box-shadow:0 -10px 30px -20px rgba(0,0,0,.35)}
  .barra-movil a{display:flex; flex-direction:column; align-items:center; gap:3px; text-decoration:none; font-size:.76rem; font-weight:700; padding:6px 4px; border-radius:14px; color:var(--tinta)}
  .barra-movil a svg{width:22px; height:22px}
  .barra-movil a.wa{background:#25D366; color:#fff; flex-direction:row; justify-content:center; font-size:.95rem; font-family:var(--display); gap:8px}
  .cookies{left:10px; right:10px; bottom:calc(84px + env(safe-area-inset-bottom,0px)); max-width:none}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none !important; transition:none !important; scroll-behavior:auto !important}
  .js [data-rev],.js .hero-cont > *{opacity:1; transform:none}
  .estela{display:none}
}

/* ================= Añadidos: páginas interiores ================= */
.pagina{display:none}
.pagina.activa{display:block}

/* Submenú Servicios */
.menu > li{position:relative}
.menu .con-sub > a{display:inline-flex; align-items:center; gap:.3em}
.menu .con-sub > a svg{width:14px; height:14px; transition:transform .3s}
.menu .con-sub:hover > a svg,.menu .con-sub:focus-within > a svg{transform:rotate(180deg)}
.sub{position:absolute; top:100%; left:-24px; padding-top:16px; opacity:0; visibility:hidden; transform:translateY(8px); transition:opacity .25s, transform .25s, visibility .25s}
.con-sub:hover .sub,.con-sub:focus-within .sub{opacity:1; visibility:visible; transform:none}
.sub ul{list-style:none; margin:0; padding:10px; background:#fff; color:var(--tinta); border-radius:20px; box-shadow:0 30px 60px -20px rgba(18,32,25,.45); min-width:320px; display:grid; gap:2px}
.menu .sub a{display:flex; gap:14px; align-items:center; padding:11px 14px; border-radius:14px; font-weight:600}
.menu .sub a::after{display:none}
.menu .sub a:hover{background:var(--papel); color:var(--verde)}
.sub .mini{width:38px; height:38px; border-radius:11px; background:var(--hoja-clara); color:var(--verde); display:grid; place-items:center; flex:none}
.sub .mini svg{width:20px; height:20px}
.menu-movil .grupo{font-size:.85rem; color:rgba(255,255,255,.5); margin:10px 0 2px; font-weight:600}
.menu-movil li.peq a{font-size:1.35rem; font-weight:700; padding:.3em 0 .3em .8em; border-bottom:0}
.menu-movil{overflow-y:auto; justify-content:flex-start; padding-top:calc(90px + env(safe-area-inset-top,0px))}

/* Portada de la home: vídeo */
.hero-medio video{position:absolute; inset:0; width:100%; height:100%; object-fit:cover}
.hero-medio .poster{position:absolute; inset:0; width:100%; height:100%; object-fit:cover}

/* Hero de páginas interiores */
.phero{position:relative; min-height:78svh; display:flex; align-items:flex-end; background:var(--tinta); color:#fff; overflow:hidden; isolation:isolate}
.phero-img{position:absolute; inset:0; z-index:-2}
.phero-img img{width:100%; height:100%; object-fit:cover; transform:scale(1.04); animation:acerca 14s ease-out both}
@keyframes acerca{from{transform:scale(1.14)}}
.phero-cont{padding:170px 0 84px; max-width:800px}
.phero h1{font-size:clamp(2.3rem,5.4vw,4.5rem); font-weight:900; text-transform:uppercase; line-height:.98; margin:22px 0 20px; letter-spacing:-.02em}
.pagina.activa .phero-cont > *{animation:sube .8s cubic-bezier(.2,.7,.2,1) both}
.pagina.activa .phero-cont > *:nth-child(2){animation-delay:.08s}
.pagina.activa .phero-cont > *:nth-child(3){animation-delay:.16s}
.pagina.activa .phero-cont > *:nth-child(4){animation-delay:.26s}
.pagina.activa .phero-cont > *:nth-child(5){animation-delay:.36s}
@keyframes sube{from{opacity:0; transform:translateY(24px)}}
.migas{font-size:.9rem; color:rgba(255,255,255,.7); display:flex; gap:.55em; flex-wrap:wrap; align-items:center}
.migas a{text-decoration:none}
.migas a:hover{color:#fff}
.migas svg{width:14px; height:14px}
.phero-sola{min-height:52svh; background:radial-gradient(60% 80% at 85% 20%, #24452f 0%, transparent 70%), var(--tinta)}

/* Intro a dos columnas */
.intro{display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center}
.intro.invertida > :first-child{order:2}
.intro .h2{margin-bottom:22px}
.intro .texto p{color:var(--gris); font-size:1.08rem; max-width:56ch}
.intro .texto p + p{margin-top:14px}
.intro .texto .btn{margin-top:28px}
.foto-r{border-radius:var(--r-l); overflow:hidden; aspect-ratio:4/5; position:relative; background:var(--linea)}
.foto-r img{width:100%; height:100%; object-fit:cover}
.foto-r.ancha{aspect-ratio:16/10}
.etq-foto{position:absolute; left:20px; bottom:20px; right:20px; width:fit-content; background:#fff; color:var(--tinta); border-radius:var(--r-m); padding:14px 18px; display:flex; gap:12px; align-items:center; font-weight:600; box-shadow:0 20px 40px -20px rgba(0,0,0,.5)}
.etq-foto svg{color:var(--verde); width:26px; height:26px; flex:none}

/* Rejilla de elementos */
.items{display:grid; grid-template-columns:repeat(4,1fr); gap:16px}
.items.tres{grid-template-columns:repeat(3,1fr)}
.items.dos{grid-template-columns:repeat(2,1fr)}
.item{background:#fff; border:1px solid var(--linea); border-radius:var(--r-m); padding:28px 26px; transition:border-color .3s, transform .3s}
.sec-blanca .item{background:var(--papel); border-color:transparent}
.item:hover{border-color:var(--verde); transform:translateY(-4px)}
.item .circ{width:54px; height:54px; border-radius:16px; background:var(--hoja-clara); color:var(--verde); display:grid; place-items:center; transition:background .3s, color .3s}
.sec-blanca .item .circ{background:#fff}
.item:hover .circ{background:var(--verde); color:#fff}
.item .circ svg{width:26px; height:26px}
.item h3{font-size:1.22rem; font-weight:700; margin:18px 0 8px; letter-spacing:-.01em; line-height:1.15}
.item p{color:var(--gris); font-size:.98rem}

/* Pasos (secuencia real) */
.pasos{display:grid; grid-template-columns:repeat(4,1fr); counter-reset:paso; border-top:2px solid var(--linea)}
.pasos.tres{grid-template-columns:repeat(3,1fr)}
.paso{padding:34px 30px 0 0; position:relative}
.paso::after{content:""; position:absolute; top:-7px; left:0; width:12px; height:12px; border-radius:50%; background:var(--verde); box-shadow:0 0 0 5px var(--papel)}
.sec-blanca .paso::after{box-shadow:0 0 0 5px #fff}
.paso::before{counter-increment:paso; content:counter(paso); font-family:var(--display); font-weight:900; font-size:3.6rem; color:var(--verde); line-height:1; display:block; margin-bottom:14px; letter-spacing:-.04em}
.paso h3{font-size:1.3rem; font-weight:700; margin-bottom:8px; letter-spacing:-.01em}
.paso p{color:var(--gris)}

/* Caja destacada */
.destacado{display:grid; grid-template-columns:auto 1fr auto; gap:30px; align-items:center; background:var(--tinta); color:#fff; border-radius:var(--r-l); padding:38px 42px; position:relative; overflow:hidden}
.destacado .circ{width:72px; height:72px; border-radius:22px; background:var(--verde); display:grid; place-items:center; color:#fff}
.destacado .circ svg{width:34px; height:34px}
.destacado h3{font-size:clamp(1.4rem,2.4vw,1.8rem); font-weight:800; margin-bottom:8px}
.destacado p{color:rgba(255,255,255,.78); max-width:62ch}
.destacado.claro{background:var(--hoja-clara); color:var(--tinta)}
.destacado.claro p{color:var(--gris)}
.destacado.alerta{background:#FFF4E0; color:#4a3100}
.destacado.alerta .circ{background:#E59A13}
.destacado.alerta p{color:#6f5114}
.destacado small{display:block; margin-top:10px; opacity:.75; font-size:.85rem}

/* Tarjeta de sellos */
.sellos-gr{display:grid; grid-template-columns:1fr auto; gap:60px; align-items:center}
.tarjeta{width:min(380px,100%); background:#fff; border-radius:24px; padding:26px; box-shadow:0 40px 70px -30px rgba(18,32,25,.45); transform:rotate(-3deg); border:1px solid var(--linea)}
.tarjeta-top{display:flex; justify-content:space-between; align-items:center; margin-bottom:18px}
.tarjeta-top img{height:52px; width:auto}
.tarjeta-top span{font-family:var(--display); font-weight:700; color:var(--gris); font-size:.9rem}
.puntos{display:grid; grid-template-columns:repeat(5,1fr); gap:10px}
.puntos i{aspect-ratio:1; border-radius:50%; border:2px dashed #b7c3bb; display:grid; place-items:center; color:#fff}
.puntos i.lleno{background:var(--verde); border:2px solid var(--verde)}
.puntos i.lleno svg{width:55%; height:55%}
.puntos i.premio{border:2px solid var(--hoja); background:var(--hoja-clara); color:var(--verde); font-family:var(--display); font-weight:900; font-size:.62rem; text-align:center; line-height:1}

/* Chips de marcas grandes */
.chips.grandes span{font-family:var(--display); font-weight:700; font-size:1.05rem; padding:.5em 1.1em}
.chips.grandes span.mas{background:var(--tinta); color:#fff; border-color:var(--tinta)}

/* Preguntas frecuentes */
.faq-gr{display:grid; grid-template-columns:.75fr 1.25fr; gap:64px; align-items:start}
.faq-gr .h2{position:sticky; top:120px}
.faq details{border-bottom:1px solid var(--linea)}
.faq details:first-child{border-top:1px solid var(--linea)}
.faq summary{list-style:none; cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:20px; padding:22px 0; font-family:var(--display); font-weight:700; font-size:1.18rem; line-height:1.25}
.faq summary::-webkit-details-marker{display:none}
.faq summary:hover{color:var(--verde)}
.faq .mas-ico{width:36px; height:36px; border-radius:50%; background:var(--papel); display:grid; place-items:center; flex:none; transition:transform .3s, background .3s, color .3s; font-size:1.4rem; font-weight:400; line-height:1}
.sec-blanca .faq .mas-ico{background:var(--papel)}
.faq details[open] .mas-ico{transform:rotate(45deg); background:var(--verde); color:#fff}
.faq details p{padding:0 50px 24px 0; color:var(--gris); max-width:68ch}

/* Banda final de contacto */
.cta{background:var(--tinta); color:#fff; border-radius:var(--r-l); padding:clamp(40px,6vw,72px); display:grid; grid-template-columns:1fr auto; gap:36px; align-items:center; position:relative; overflow:hidden; isolation:isolate}
.cta::before{content:""; position:absolute; width:560px; height:560px; right:-180px; top:-240px; border-radius:50%; background:radial-gradient(circle, rgba(67,160,71,.35), transparent 65%); z-index:-1}
.cta h2{font-size:clamp(1.9rem,3.6vw,2.9rem); font-weight:800; max-width:20ch}
.cta p{color:rgba(255,255,255,.75); margin-top:12px; max-width:52ch}
.cta .btns{display:flex; gap:12px; flex-wrap:wrap}

/* Fotos a dos */
.duo{display:grid; grid-template-columns:1.25fr .75fr; gap:18px}
.duo .foto-r{aspect-ratio:auto; min-height:460px}

/* Página de contacto */
.contacto-wa{display:flex; align-items:center; gap:18px; background:#25D366; color:#fff; border-radius:var(--r-l); padding:26px 28px; text-decoration:none; margin-bottom:26px; transition:transform .25s, box-shadow .25s}
.contacto-wa:hover{transform:translateY(-3px); box-shadow:0 24px 40px -20px rgba(37,211,102,.9)}
.contacto-wa svg{width:44px; height:44px; flex:none}
.contacto-wa strong{display:block; font-family:var(--display); font-size:1.5rem}
.contacto-wa span{opacity:.9}

/* Movilidad reducida: lectura más cómoda */
.calma{font-size:19px}
.calma .item p,.calma .entrada,.calma .intro .texto p,.calma .faq details p{font-size:1.1rem}
.calma .item h3{font-size:1.35rem}
.tel-xl{display:inline-flex; align-items:center; gap:14px; font-family:var(--display); font-weight:800; font-size:clamp(1.5rem,3vw,2rem); text-decoration:none; color:var(--verde)}
.tel-xl svg{width:34px; height:34px}

/* Textos legales */
.legal-txt{max-width:780px}
.legal-txt h2{font-size:1.45rem; font-weight:800; margin:44px 0 12px; letter-spacing:-.01em}
.legal-txt h2:first-child{margin-top:0}
.legal-txt p,.legal-txt li{color:var(--gris)}
.legal-txt p + p{margin-top:12px}
.legal-txt ul{padding-left:1.2em; margin:10px 0}
.legal-txt li{margin:6px 0}
.legal-txt table{width:100%; border-collapse:collapse; margin:14px 0; font-size:.95rem}
.legal-txt th,.legal-txt td{border-bottom:1px solid var(--linea); text-align:left; padding:10px 8px; vertical-align:top}
.legal-txt th{font-family:var(--display)}
.tabla-scroll{overflow-x:auto}

/* Home: tarjeta de movilidad con foto */
.tile-movilidad{display:grid; grid-template-columns:1fr 280px; padding:0; overflow:hidden}
.tile-movilidad .mov-txt{padding:40px}
.tile-movilidad .mov-txt .btn{margin-top:24px}
.tile-movilidad .mov-img{height:100%; min-height:260px}
.tile-movilidad .mov-img img{width:100%; height:100%; object-fit:cover}
.envio-foto img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover}
.envio-foto{display:block}
.multi-fotos{display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:60px}
.multi-fotos .foto-r{aspect-ratio:4/3}

@media (max-width:1080px){
  .intro,.faq-gr,.sellos-gr,.duo{grid-template-columns:1fr; gap:36px}
  .intro.invertida > :first-child{order:0}
  .faq-gr .h2{position:static}
  .items,.items.tres{grid-template-columns:1fr 1fr}
  .pasos,.pasos.tres{grid-template-columns:1fr 1fr; row-gap:10px}
  .destacado{grid-template-columns:auto 1fr}
  .destacado .btn{grid-column:1 / -1; justify-self:start}
  .cta{grid-template-columns:1fr}
  .tarjeta{justify-self:center}
}
@media (max-width:720px){
  .phero{min-height:70svh}
  .phero-cont{padding:120px 0 56px}
  .items,.items.tres,.items.dos,.pasos,.pasos.tres{grid-template-columns:1fr}
  .paso{padding-right:0}
  .destacado{grid-template-columns:1fr; padding:30px 26px; gap:18px}
  .tile-movilidad{grid-template-columns:1fr}
  .tile-movilidad .mov-txt{padding:28px}
  .tile-movilidad .mov-img{min-height:240px; order:-1}
  .multi-fotos{grid-template-columns:1fr}
  .duo .foto-r{min-height:320px}
  .faq details p{padding-right:0}
  .calma{font-size:18px}
}
@media (prefers-reduced-motion:reduce){
  .phero-img img{animation:none; transform:none}
  .pagina.activa .phero-cont > *{animation:none}
}

.migas{margin-bottom:18px}
.tile::after{background:linear-gradient(0deg, rgba(12,20,15,.95) 0%, rgba(12,20,15,.72) 50%, rgba(12,20,15,.3) 100%)}

.menu a.actual::after{transform:scaleX(1)}
.pie img{height:110px}

/* ===== Añadidos: idioma, precios, portadas TikTok ===== */
.idioma a{color:inherit; text-decoration:none; padding:.35em .75em; display:block}
.idioma a[aria-current]{background:var(--verde); color:#fff}
.idioma a:not([aria-current]):hover{background:rgba(67,160,71,.18)}
.menu-movil .idioma-m{display:flex; gap:10px; margin:0 0 22px}
.menu-movil .idioma-m a{font-family:var(--display); font-weight:700; text-decoration:none; border:1.5px solid rgba(255,255,255,.35); border-radius:999px; padding:.35em 1em; font-size:.95rem}
.menu-movil .idioma-m a[aria-current]{background:var(--verde); border-color:var(--verde)}
.pack .precio{display:flex; align-items:baseline; flex-wrap:wrap; gap:.25em .7em; margin:0 0 14px}
.pack .precio strong{font-family:var(--display); font-weight:900; font-size:clamp(2.6rem,5vw,3.2rem); line-height:1; letter-spacing:-.03em; color:var(--verde)}
.pack-top .precio strong{color:#fff}
.pack .precio span{font-size:.9rem; font-weight:600; color:var(--gris)}
.pack-top .precio span{color:#b9e3bb}
.video{padding:0; justify-content:flex-end}
.video img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2; transition:transform .5s ease}
.video::after{content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg,rgba(0,0,0,0) 45%,rgba(10,20,14,.85) 100%)}
.video:hover img{transform:scale(1.05)}
.video .pie-v{padding:18px; display:flex; flex-direction:column; gap:2px}
@media (prefers-reduced-motion: reduce){.video img{transition:none}.video:hover img{transform:none}}


/* Portadas interiores: sin zoom y, en pantallas anchas, foto a la derecha para no recortar las fotos verticales */
.phero-img img{transform:none; animation:fundido 1.2s ease both}
@keyframes fundido{from{opacity:0}}
@media (min-width:1000px){
  .phero-img{left:auto; right:0; width:54%}
  .phero-img{-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 38%); mask-image:linear-gradient(90deg,transparent 0%,#000 38%)}
  .phero .hero-sombra{background:linear-gradient(90deg, rgba(18,32,25,.35) 45%, rgba(18,32,25,0) 75%), linear-gradient(0deg, rgba(18,32,25,.45) 0%, rgba(18,32,25,0) 35%)}
  .phero-cont{max-width:min(640px, 48vw)}
}
@media (prefers-reduced-motion: reduce){.phero-img img{animation:none}}
