/* ============================================================
   Tenerife Pools - hoja de estilos principal
   Paleta "Marca real" (elegida por el cliente 2026-07-25):
   sacada del propio logo -> azul #004F8E + negro #040404
   Radios: tarjetas/fotos 12px, botones píldora, inputs 10px
   ============================================================ */

:root{
  --tinta:#0E1C2B;         /* azul casi negro: texto y fondos densos */
  --tinta-suave:#4b5f74;   /* texto secundario */
  --papel:#F8FAFC;         /* fondo base, blanco frío */
  --agua:#E6EFF7;          /* tinte de sección, agua clara */
  --terracota:#004F8E;     /* acento único = azul del logo */
  --terracota-oscuro:#003c6e;
  --linea:#d8e3ec;
  --oro:#E0A437;           /* estrellas y sello del plan destacado */
  --blanco:#fdfdfc;

  /* alias con nombre honesto; los --terracota se conservan porque los usan
     las 3 páginas de servicio y renombrarlos ahí es otro cambio */
  --acento:#004F8E;
  /* Luz del agua: segundo acento, solo en la portada de la home.
     ⚠️ NUEVO fuera de la paleta original (que era solo el azul del logo).
     Pendiente de OK del cliente. Alternativa sobria ya probada: #5AA6DE,
     un aclarado del propio #004F8E. Cambiar solo estas dos líneas. */
  --agua-luz:#2CC5D6;
  --agua-luz-clara:#8fe6f2;
  --acento-oscuro:#003c6e;

  --fuente-titulos:'Bricolage Grotesque', 'Avenir Next', sans-serif;
  --fuente-texto:'Instrument Sans', -apple-system, 'Segoe UI', sans-serif;

  --radio-caja:12px;
  --radio-input:10px;

  --ancho-max:1180px;
  --espacio-seccion:clamp(4rem, 3rem + 4vw, 7rem);
}
.cta-final{padding-top:clamp(3rem,7vw,6rem);padding-bottom:clamp(3rem,7vw,6rem)}
.cta-final-caja{display:flex;align-items:center;justify-content:space-between;gap:2rem;padding:clamp(2rem,5vw,4rem);border-radius:1.5rem;background:var(--navy,#0e1c2b);color:#fff}
.cta-final-caja h2{margin:0 0 .5rem;color:#fff}.cta-final-caja p{margin:0;color:rgba(255,255,255,.72)}
.nav-cta{white-space:nowrap;min-width:max-content}
@media(max-width:860px){.cta-final-caja{display:block}.cta-final-caja .boton{margin-top:1.5rem;width:100%}}

*{margin:0;padding:0;box-sizing:border-box}
/* La cabecera va fija/sticky: sin esto, al saltar a un ancla la sección
   aterriza por debajo de ella y se come el titular. */
html{scroll-behavior:smooth;scroll-padding-top:76px}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
}

body{
  font-family:var(--fuente-texto);
  color:var(--tinta);
  background:var(--papel);
  line-height:1.6;
  font-size:1.0625rem;
  -webkit-font-smoothing:antialiased;
}

img{max-width:100%;height:auto;display:block}

.contenedor{max-width:var(--ancho-max);margin:0 auto;padding:0 clamp(1.1rem, 4vw, 2rem)}

h1,h2,h3{font-family:var(--fuente-titulos);line-height:1.08;letter-spacing:-0.02em}
h2{font-size:clamp(1.9rem, 1.4rem + 2vw, 2.9rem);font-weight:700;margin-bottom:clamp(1.6rem, 4vw, 2.6rem)}
h3{font-size:1.25rem;font-weight:600}
p{max-width:62ch}

/* ---------- botones y enlaces ---------- */
.boton{
  display:inline-flex;align-items:center;gap:.55em;
  font-family:var(--fuente-titulos);font-weight:600;font-size:1rem;
  padding:.8em 1.5em;border-radius:999px;text-decoration:none;
  transition:transform .18s ease, background-color .18s ease, box-shadow .18s ease;
}
.boton:active{transform:translateY(1px) scale(.99)}
.boton-primario{
  background:var(--terracota);color:var(--blanco);
  box-shadow:0 6px 18px color-mix(in srgb,var(--terracota) 30%,transparent);
}
.boton-primario:hover{background:var(--terracota-oscuro)}
.boton-grande{font-size:1.1rem;padding:.9em 1.7em}
.boton-pequeno{font-size:.9rem;padding:.55em 1.05em}
.boton-secundario{
  background:transparent;color:var(--terracota);
  box-shadow:inset 0 0 0 1.5px var(--terracota);
}
.boton-secundario:hover{background:var(--terracota);color:var(--blanco)}
.ico{width:1.2em;height:1.2em;flex:none}
.seccion-intro{color:var(--tinta-suave);font-size:1.1rem;max-width:52ch;margin:-1rem 0 2.4rem}
.enlace-suave{
  color:var(--tinta);font-weight:500;text-decoration:none;
  border-bottom:2px solid var(--linea);padding-bottom:2px;
  transition:border-color .18s ease;
}
.enlace-suave:hover{border-color:var(--terracota)}
.enlace-claro{color:var(--blanco);font-weight:500;text-underline-offset:4px}

/* ---------- cabecera ---------- */
.cabecera{
  position:sticky;top:0;z-index:40;
  background:color-mix(in srgb, var(--papel) 88%, transparent);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--linea);
}
.cabecera-fila{display:flex;align-items:center;justify-content:flex-start;gap:clamp(2rem,5vw,5rem);height:68px;min-width:0}
/* logo real (PNG con transparencia derivado del original del cliente).
   Se dimensiona por altura: el ancho lo pone la proporción del archivo. */
.marca{display:flex;align-items:center;text-decoration:none;flex:none}
.marca img{height:30px;width:auto}
.nav-principal{display:flex;align-items:center;gap:clamp(.7rem, 1.25vw, 1.2rem);min-width:0;white-space:nowrap}
.nav-principal a:not(.boton){
  color:var(--tinta);text-decoration:none;font-weight:500;font-size:.98rem;
}
.nav-principal a:not(.boton):hover{color:var(--terracota)}
.nav-tel{font-variant-numeric:tabular-nums;white-space:nowrap}
.nav-burger{display:none}
/* Con el logo real (166px) + "Tienda", la barra ya no cabe entre 861 y 1040px:
   el teléfono es lo primero que sobra porque está repetido en la barra móvil
   y en el CTA de WhatsApp. */
@media (max-width:1040px){
  .nav-principal{gap:1rem}
  .nav-tel{display:none}
}
@media (min-width:1101px) and (max-width:1700px){
  .nav-principal{gap:.75rem}
  .nav-principal a:not(.boton){font-size:.92rem}
  .nav-tel{display:none}
  .nav-cta{padding-inline:1.2rem}
}

/* La navegación completa ya no cabe de forma fiable en tablets apaisadas.
   Entre 861 y 1100 px usamos el mismo menú compacto que en móvil. */
@media (min-width:861px) and (max-width:1100px){
  .cabecera-fila{height:60px}
  .nav-burger{display:flex;flex-direction:column;justify-content:center;gap:5px;width:42px;height:42px;background:none;border:none;cursor:pointer;align-items:center}
  .nav-burger span{width:22px;height:2px;background:var(--tinta);transition:transform .2s ease}
  .nav-burger[aria-expanded="true"] span:first-child{transform:translateY(3.5px) rotate(45deg)}
  .nav-burger[aria-expanded="true"] span:last-child{transform:translateY(-3.5px) rotate(-45deg)}
  .nav-principal{display:none;position:absolute;top:60px;left:0;right:0;background:var(--papel);border-bottom:1px solid var(--linea);flex-direction:column;align-items:flex-start;padding:1.2rem clamp(1.1rem,4vw,2rem) 1.5rem;gap:1rem}
  .nav-principal.abierto{display:flex}
  .nav-cta{margin-top:.3rem}
  /* en móvil la nav es una columna: la barra vertical sobra y las banderas se agrandan */
  .nav-idioma{padding-left:0;border-left:0;gap:.9rem}
  .nav-idioma a:not(.boton){width:2.9rem;height:2.2rem}
  .nav-idioma a::after{font-size:2rem}
  .menu{width:100%}
  .menu-panel{position:static;width:auto;opacity:1;visibility:visible;transform:none;box-shadow:none;padding:.4rem 0 0;display:none}
  .menu-panel[data-abierto="si"]{display:block}
  .menu-panel::before{display:none}
  .cabecera-portada .nav-principal{background:rgba(6,32,58,.96);backdrop-filter:blur(12px);border-bottom-color:rgba(255,255,255,.14)}
  .cabecera-portada .nav-cta{align-self:stretch;justify-content:center}
}

/* ---------- hero ---------- */
.hero{padding:clamp(2.5rem, 5vw, 5rem) 0 clamp(2.5rem, 4vw, 4rem)}
.hero-grid{
  display:grid;grid-template-columns:minmax(0, 10fr) minmax(0, 9fr);
  gap:clamp(2rem, 4vw, 4rem);align-items:center;
}
.hero h1{
  font-size:clamp(2.3rem, 1.5rem + 3.4vw, 4rem);
  font-weight:700;margin-bottom:1.2rem;
}
.acento-subrayado{
  font-style:normal;color:var(--terracota);
  background:linear-gradient(to top, var(--agua) 30%, transparent 30%);
}
.hero-sub{color:var(--tinta-suave);font-size:1.15rem;margin-bottom:1.8rem;max-width:34rem}
.hero-acciones{display:flex;align-items:center;gap:1.4rem;flex-wrap:wrap}
.hero-foto img{border-radius:var(--radio-caja);box-shadow:0 18px 44px rgba(20,51,59,.16)}

/* ---------- portada (home): bajo la línea de flotación ----------
   La pantalla se parte en dos por una línea de agua viva: arriba el aire
   (foto, titular y CTA), abajo el agua (cáusticas, burbujas y prueba social).
   La cabecera va encima en transparente y se "sumerge" al cruzar la línea.

   ⚠️ Solo la home usa `.cabecera-portada`. Las páginas de servicio siguen
   con la cabecera clara de siempre, así que nada de esto las toca.
   Todo lo que se anima es `transform`, `opacity` o `height` de una capa
   aislada: nada dispara reflow. */
.portada{position:relative;overflow:hidden;background:var(--tinta)}

/* --- cabecera superpuesta (solo home) --- */
.cabecera-portada{
  position:fixed;left:0;right:0;top:0;
  background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;
  border-bottom-color:transparent;
  transition:background .35s ease,box-shadow .35s ease,border-color .35s ease;
}
.cabecera-portada .marca img{height:34px}
/* Solo los enlaces de primer nivel van en blanco. El `>` es importante:
   sin él, el blanco se cuela dentro de .menu-panel, que es una tarjeta
   blanca, y los títulos de los servicios desaparecen. */
.cabecera-portada .nav-principal > a:not(.boton),
.cabecera-portada .menu-btn{color:var(--blanco)}
.cabecera-portada .nav-principal > a:not(.boton):hover,
.cabecera-portada .menu-btn:hover,
.cabecera-portada .menu-btn[aria-expanded="true"]{color:var(--agua-luz)}
.cabecera-portada .nav-burger span{background:var(--blanco)}
/* Al pasar la línea de flotación, o con el menú móvil abierto, se vuelve
   sólida para que el texto siga legible sobre lo que haya debajo. */
.cabecera-portada.sumergido,
.cabecera-portada:has(.nav-principal.abierto){
  background:rgba(6,32,58,.88);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  box-shadow:0 1px 0 rgba(255,255,255,.12);
}
.cabecera-portada.sumergido .marca img{height:30px}

/* CTA de la cabecera: mismo lenguaje que el botón de la portada (esquinas
   + marea), en pequeño. Nada de píldora rellena. */
.cabecera-portada .nav-cta{
  position:relative;overflow:hidden;isolation:isolate;
  background:rgba(255,255,255,.08);color:var(--blanco);
  border-radius:0;padding:.62em 1.15em;
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  transition:color .3s cubic-bezier(.16,1,.3,1);
}
.cabecera-portada .nav-cta::before,
.cabecera-portada .nav-cta::after{
  content:"";position:absolute;z-index:3;width:12px;height:12px;
  border:2px solid var(--agua-luz);pointer-events:none;
  transition:width .34s cubic-bezier(.16,1,.3,1),height .34s cubic-bezier(.16,1,.3,1);
}
.cabecera-portada .nav-cta::before{top:0;left:0;border-right:0;border-bottom:0}
.cabecera-portada .nav-cta::after{bottom:0;right:0;border-left:0;border-top:0}
.cabecera-portada .nav-cta:hover::before,
.cabecera-portada .nav-cta:hover::after,
.cabecera-portada .nav-cta:focus-visible::before,
.cabecera-portada .nav-cta:focus-visible::after{width:100%;height:100%}
.cabecera-portada .nav-cta:hover,
.cabecera-portada .nav-cta:focus-visible{background:var(--agua-luz);color:#06222a}

/* --- mitad de arriba: el aire --- */
.portada-aire{
  position:relative;min-height:clamp(560px,86vh,780px);
  display:flex;align-items:flex-end;
}
.portada-foto{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;object-position:50% 38%;
}
.portada video.portada-foto{background:var(--tinta)}
.portada-velo{
  position:absolute;inset:0;pointer-events:none;
  background:
    linear-gradient(102deg,rgba(4,20,36,.78) 0%,rgba(4,20,36,.42) 42%,transparent 68%),
    linear-gradient(180deg,rgba(6,26,44,.7) 0%,rgba(6,26,44,.16) 38%,rgba(6,26,44,.5) 100%);
}
.portada-copy{
  position:relative;z-index:5;width:100%;
  padding-top:7rem;padding-bottom:clamp(3.4rem,7vw,5.6rem);
}
.portada-eyebrow{
  display:block;font-size:.74rem;font-weight:600;letter-spacing:.2em;
  text-transform:uppercase;color:var(--agua-luz-clara);
  margin-bottom:1rem;text-shadow:0 1px 12px rgba(0,20,40,.8);
}
.portada h1{
  font-family:var(--fuente-titulos);font-weight:700;color:var(--blanco);
  font-size:clamp(2.1rem,5vw,4.15rem);line-height:1.02;letter-spacing:-.032em;
  max-width:20ch;text-shadow:0 2px 30px rgba(0,20,40,.45);
}
.portada h1 em{font-style:normal;color:var(--agua-luz)}
.portada-sub{
  color:rgba(255,255,255,.9);font-size:clamp(1rem,1.5vw,1.16rem);line-height:1.55;
  max-width:46ch;margin-top:1.1rem;
}
.horario-estado{display:inline-flex;align-items:center;gap:.55rem;margin-top:1.15rem;color:rgba(255,255,255,.9);font-size:.88rem}
.horario-estado>span:last-child{display:flex;align-items:baseline;gap:.45rem;flex-wrap:wrap}
.horario-estado strong{font-family:var(--fuente-titulos);font-weight:600}
.horario-estado small{font-size:.82rem;color:rgba(255,255,255,.68)}
.horario-punto{width:9px;height:9px;border-radius:50%;background:#5bd49a;box-shadow:0 0 0 4px rgba(91,212,154,.16);flex:none}
.horario-estado.cerrado .horario-punto{background:#f1a36f;box-shadow:0 0 0 4px rgba(241,163,111,.16)}
.portada-acciones{display:flex;flex-wrap:wrap;align-items:center;gap:1.1rem 1.4rem;margin-top:2rem}

/* Botón principal: esquinas técnicas que se cierran + el agua que sube por
   dentro con cresta ondulada. Sustituye a la píldora rellena. */
.boton-marea{
  position:relative;overflow:hidden;isolation:isolate;
  display:inline-flex;align-items:center;gap:.7rem;text-decoration:none;
  font-family:var(--fuente-titulos);font-weight:600;font-size:1.06rem;
  color:var(--blanco);padding:.95rem 1.7rem;border-radius:0;
  background:rgba(255,255,255,.08);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  transition:color .3s cubic-bezier(.16,1,.3,1);
}
.boton-marea .ico{width:20px;height:20px;flex:none}
.boton-marea > span{position:relative;z-index:2;display:inline-flex;align-items:center;gap:.7rem}
.boton-marea::before,.boton-marea::after{
  content:"";position:absolute;z-index:3;width:16px;height:16px;
  border:2px solid var(--agua-luz);pointer-events:none;
  transition:width .38s cubic-bezier(.16,1,.3,1),height .38s cubic-bezier(.16,1,.3,1);
}
.boton-marea::before{top:0;left:0;border-right:0;border-bottom:0}
.boton-marea::after{bottom:0;right:0;border-left:0;border-top:0}
.boton-marea .marea{
  position:absolute;left:0;right:0;bottom:0;height:0;z-index:1;
  background:var(--agua-luz);
  transition:height .44s cubic-bezier(.16,1,.3,1);
}
.boton-marea .marea::before{
  content:"";position:absolute;left:-50%;right:-50%;top:-5px;height:11px;
  background:radial-gradient(ellipse 14px 5.5px at 50% 100%,var(--agua-luz) 99%,transparent 100%);
  background-size:28px 11px;background-repeat:repeat-x;
  animation:olita 2.2s linear infinite;
}
@keyframes olita{from{transform:translateX(0)}to{transform:translateX(28px)}}
.boton-marea:hover::before,.boton-marea:hover::after,
.boton-marea:focus-visible::before,.boton-marea:focus-visible::after{width:100%;height:100%}
.boton-marea:hover .marea,.boton-marea:focus-visible .marea{height:100%}
.boton-marea:hover,.boton-marea:focus-visible{color:#06222a}

/* Secundario: enlace con flecha y subrayado que se dibuja. Sin caja. */
.enlace-marea{
  position:relative;display:inline-flex;align-items:center;gap:.55rem;
  text-decoration:none;font-family:var(--fuente-titulos);font-weight:600;
  font-size:1.02rem;color:var(--blanco);
}
.enlace-marea i{font-style:normal;transition:transform .3s cubic-bezier(.16,1,.3,1)}
.enlace-marea:hover i{transform:translateX(5px)}
.enlace-marea::after{
  content:"";position:absolute;left:0;right:0;bottom:-5px;height:1.5px;background:currentColor;
  transform:scaleX(0);transform-origin:right;transition:transform .38s cubic-bezier(.16,1,.3,1);
}
.enlace-marea:hover::after{transform:scaleX(1);transform-origin:left}

/* --- la línea de flotación --- */
.portada-linea{position:relative;height:52px;margin-top:-52px;z-index:8;pointer-events:none}
.ola{position:absolute;left:0;bottom:0;width:200%;height:52px}
.ola-1{animation:corre-ola 11s linear infinite;opacity:.55}
.ola-1 path{fill:#0a5a86}
.ola-2{animation:corre-ola 7.5s linear infinite reverse;bottom:-6px}
.ola-2 path{fill:var(--terracota)}
@keyframes corre-ola{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
.brillo-agua{
  position:absolute;left:0;right:0;bottom:0;height:3px;z-index:9;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.85),transparent);
  background-size:42% 100%;background-repeat:no-repeat;
  animation:destello 6s ease-in-out infinite;
}
@keyframes destello{
  0%{background-position:-45% 0;opacity:.25}
  50%{opacity:.75}
  100%{background-position:140% 0;opacity:.25}
}

/* --- mitad de abajo: el agua --- */
.portada-agua{
  position:relative;overflow:hidden;
  background:linear-gradient(180deg,#0b6690 0%,#064a76 24%,#032b4d 64%,#07182a 100%);
  padding:clamp(2.6rem,5vw,4rem) 0;
  min-height:clamp(230px,26vh,300px);display:flex;align-items:center;
}
/* la luz que entra por la superficie, justo debajo de la línea */
.portada-agua::before{
  content:"";position:absolute;left:0;right:0;top:0;height:34%;pointer-events:none;z-index:2;
  background:linear-gradient(180deg,rgba(190,245,255,.2),transparent);
}
/* cáusticas: dos capas de manchas de luz girando en sentidos opuestos.
   Sin librerías ni imágenes: solo degradados, blur y transform. */
.caustica{position:absolute;inset:-45%;pointer-events:none;mix-blend-mode:screen;will-change:transform}
.caustica-1{
  background:
    radial-gradient(closest-side at 18% 22%,rgba(140,235,255,.55),transparent 72%),
    radial-gradient(closest-side at 62% 12%,rgba(120,220,255,.4),transparent 70%),
    radial-gradient(closest-side at 84% 44%,rgba(160,240,255,.5),transparent 72%),
    radial-gradient(closest-side at 34% 68%,rgba(120,215,255,.42),transparent 70%),
    radial-gradient(closest-side at 72% 84%,rgba(150,235,255,.36),transparent 72%);
  background-size:52% 46%;filter:blur(20px);opacity:.72;
  animation:deriva-a 26s linear infinite;
}
.caustica-2{
  background:
    radial-gradient(closest-side at 44% 30%,rgba(200,250,255,.42),transparent 68%),
    radial-gradient(closest-side at 12% 70%,rgba(130,225,255,.34),transparent 70%),
    radial-gradient(closest-side at 88% 66%,rgba(170,245,255,.4),transparent 70%);
  background-size:64% 58%;filter:blur(30px);opacity:.6;
  animation:deriva-b 34s linear infinite;
}
@keyframes deriva-a{from{transform:rotate(0deg) scale(1.05)}to{transform:rotate(360deg) scale(1.05)}}
@keyframes deriva-b{
  from{transform:rotate(360deg) scale(1.25) translate3d(2%,0,0)}
  to{transform:rotate(0deg) scale(1.25) translate3d(-2%,0,0)}
}
.burbuja{
  position:absolute;bottom:-24px;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle at 32% 28%,rgba(255,255,255,.9),rgba(255,255,255,.16) 62%,transparent 72%);
  animation:sube-burbuja linear infinite;
}
@keyframes sube-burbuja{
  0%{transform:translate3d(0,0,0) scale(.6);opacity:0}
  12%{opacity:.7}
  100%{transform:translate3d(14px,-330px,0) scale(1);opacity:0}
}

.portada-prueba{
  position:relative;z-index:5;
  display:grid;grid-template-columns:auto 1px 1fr auto;align-items:center;
  gap:clamp(1.2rem,3.4vw,2.8rem);
}
.prueba-nota{display:flex;align-items:center;gap:.9rem;color:var(--blanco);text-decoration:none}
.prueba-num{
  font-family:var(--fuente-titulos);font-weight:700;
  font-size:clamp(2.6rem,5.4vw,4rem);line-height:.85;letter-spacing:-.03em;
  transition:color .2s ease;
}
.prueba-nota:hover .prueba-num{color:var(--agua-luz)}
.prueba-txt{font-size:.86rem;line-height:1.4;color:rgba(255,255,255,.82)}
.prueba-txt .estrellas{display:block;font-size:1rem;margin:0 0 .15rem}
.prueba-div{background:rgba(255,255,255,.22);align-self:stretch}
.prueba-zonas{list-style:none;display:flex;flex-wrap:wrap;gap:.5rem .55rem}
.prueba-zonas li{
  font-size:.83rem;color:rgba(255,255,255,.9);
  border:1px solid rgba(255,255,255,.26);border-radius:999px;padding:.34rem .82rem;
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:rgba(255,255,255,.07);
}
.prueba-zonas li.on{background:var(--agua-luz);border-color:var(--agua-luz);color:#06222a;font-weight:600}
.prueba-anos{text-align:right;color:var(--blanco);line-height:1.2}
.prueba-anos b{
  display:block;font-family:var(--fuente-titulos);font-weight:700;
  font-size:clamp(1.5rem,2.6vw,2.1rem);letter-spacing:-.02em;
}
.prueba-anos small{font-size:.8rem;color:rgba(255,255,255,.72)}

@media (max-width:960px){
  .portada-prueba{grid-template-columns:auto 1fr;gap:1.2rem 1.6rem}
  .prueba-div{display:none}
  .prueba-anos{grid-column:2;text-align:left}
  .prueba-zonas{grid-column:1/-1}
}
figcaption{
  font-size:.88rem;color:var(--tinta-suave);font-style:italic;
  margin-top:.65rem;
}

/* ---------- franja google ---------- */
.franja-google{background:var(--tinta);color:var(--blanco);padding:1.1rem 0}
.franja-fila{
  display:flex;align-items:center;justify-content:space-between;
  gap:1rem;flex-wrap:wrap;
}
.franja-nota{max-width:none;font-size:1.02rem}
.estrellas{color:var(--oro);letter-spacing:.12em;margin-right:.35em}
.estrellas.grande{font-size:1.5rem;margin:0}

/* ---------- secciones ---------- */
.seccion{padding:var(--espacio-seccion) 0}
.seccion-tinta{background:var(--tinta);color:var(--blanco)}
.seccion-tinta h2,.seccion-tinta h3{color:var(--blanco)}
.seccion-agua{background:var(--agua)}

/* ---------- servicios: bento 1 grande + 2 apiladas ---------- */
.servicios-bento{
  display:grid;grid-template-columns:3fr 2fr;grid-template-rows:1fr 1fr;
  gap:1.3rem;
}
.servicio{
  background:var(--blanco);border:1px solid var(--linea);
  border-radius:var(--radio-caja);overflow:hidden;
  display:flex;flex-direction:column;
  transition:transform .2s ease, box-shadow .2s ease;
}
.servicio:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(20,51,59,.10)}
.servicio-grande{grid-row:1 / span 2}
.servicio img{width:100%;height:100%;object-fit:cover;flex:1;min-height:0}
.servicio-grande img{min-height:340px}
.servicio:not(.servicio-grande) img{max-height:170px}
.servicio-cuerpo{padding:1.2rem 1.4rem 1.4rem}
.servicio-cuerpo h3{margin-bottom:.4rem}
.servicio-cuerpo p{color:var(--tinta-suave);font-size:.98rem}

/* ---------- cómo trabajamos ---------- */
.como-grid{
  display:grid;grid-template-columns:minmax(0, 1fr) minmax(0, 1fr);
  gap:clamp(2rem, 5vw, 4.5rem);align-items:center;
}
.pasos{list-style:none;counter-reset:paso}
.pasos li{
  counter-increment:paso;position:relative;
  padding:0 0 1.6rem 3.4rem;
}
.pasos li:not(:last-child)::after{
  content:"";position:absolute;left:1.05rem;top:2.5rem;bottom:.4rem;
  width:2px;background:color-mix(in srgb, var(--blanco) 22%, transparent);
}
.pasos li::before{
  content:counter(paso);
  position:absolute;left:0;top:.1rem;
  width:2.15rem;height:2.15rem;border-radius:50%;
  background:var(--terracota);color:var(--blanco);
  font-family:var(--fuente-titulos);font-weight:600;
  display:flex;align-items:center;justify-content:center;
}
.pasos h3{margin-bottom:.3rem}
.pasos p{color:color-mix(in srgb, var(--blanco) 78%, var(--tinta));font-size:.99rem}
.como-foto img{border-radius:var(--radio-caja)}
.como-foto figcaption{color:color-mix(in srgb, var(--blanco) 65%, var(--tinta))}

/* ---------- opiniones ---------- */
.opiniones-grid{
  display:grid;grid-template-columns:auto 1fr 1fr;
  gap:1.3rem;align-items:stretch;
}
.opinion-nota{
  background:var(--tinta);color:var(--blanco);
  border-radius:var(--radio-caja);padding:1.8rem 2rem;
  display:flex;flex-direction:column;justify-content:center;gap:.3rem;
  min-width:215px;
}
.nota-numero{
  font-family:var(--fuente-titulos);font-weight:700;
  font-size:3.4rem;line-height:1;
}
.nota-detalle{font-size:.95rem;color:color-mix(in srgb, var(--blanco) 75%, var(--tinta))}
.opinion{
  background:var(--blanco);border:1px solid var(--linea);
  border-radius:var(--radio-caja);padding:1.8rem 2rem;
  display:flex;flex-direction:column;justify-content:space-between;gap:1.2rem;
}
.opinion p{font-size:1.08rem;line-height:1.55}
.opinion cite{font-style:normal;font-size:.92rem;color:var(--tinta-suave)}

/* ---------- galería ---------- */
.galeria{
  display:grid;grid-template-columns:5fr 3fr;grid-template-rows:auto auto;
  gap:1.3rem;
}
.galeria-item img{border-radius:var(--radio-caja);width:100%;object-fit:cover;height:100%}
.galeria-ancha{grid-row:1 / span 2}
.galeria-ancha img{min-height:420px}
.galeria-alta img{max-height:300px;object-position:center 60%}
.galeria-item:not(.galeria-ancha) img{max-height:300px}

/* ---------- calculadora ---------- */
.calc-grid{
  display:grid;grid-template-columns:minmax(0, 4fr) minmax(0, 5fr);
  gap:clamp(2rem, 5vw, 4rem);align-items:center;
}
.calc-texto p{color:var(--tinta-suave)}
.calc-caja{
  background:var(--blanco);border:1px solid var(--linea);
  border-radius:var(--radio-caja);padding:1.8rem;
}
.calc-campos{display:grid;grid-template-columns:1fr 1fr 1fr;gap:1rem}
.campo{display:flex;flex-direction:column;gap:.45rem}
.campo label{font-size:.9rem;font-weight:600}
/* "(opcional)" en el email: se ve, pero no compite con el nombre del campo */
.campo-opcional{font-weight:500;color:var(--tinta-suave);font-size:.85em}
.campo input{
  font:inherit;padding:.6em .8em;border:1.5px solid var(--linea);
  border-radius:var(--radio-input);background:var(--papel);color:var(--tinta);
  width:100%;
}
.campo input:focus{outline:2px solid var(--terracota);outline-offset:1px;border-color:var(--terracota)}
.calc-resultado{
  margin-top:1.3rem;font-family:var(--fuente-titulos);font-weight:600;
  font-size:1.15rem;max-width:none;
}
.calc-resultado strong{color:var(--terracota);font-size:1.5rem}

/* ---------- cierre / contacto ---------- */
.cierre{text-align:center}
.cierre-caja{display:flex;flex-direction:column;align-items:center}
.cierre-texto{
  color:color-mix(in srgb, var(--blanco) 80%, var(--tinta));
  font-size:1.12rem;margin:0 auto 2rem;max-width:36rem;
}
.cierre-acciones{display:flex;flex-direction:column;align-items:center;gap:1.4rem}
.cierre-datos{display:flex;gap:1.8rem;flex-wrap:wrap;justify-content:center}
.cierre-datos a{
  color:var(--blanco);text-decoration:none;font-weight:500;
  border-bottom:1.5px solid color-mix(in srgb, var(--blanco) 30%, transparent);
  padding-bottom:2px;
}
.cierre-datos a:hover{border-color:var(--terracota)}
.cierre-zona{
  margin:2.2rem auto 0;font-size:.95rem;
  color:color-mix(in srgb, var(--blanco) 62%, var(--tinta));
  max-width:34rem;
}

/* ---------- pie ---------- */
.pie{background:var(--papel);border-top:1px solid var(--linea);padding:2.6rem 0 1.4rem}
.horario-pie{background:var(--tinta);color:var(--blanco);margin:-2.6rem 0 2.6rem;padding:clamp(2.2rem,5vw,4rem) 0}
.horario-pie-cont{display:grid;grid-template-columns:minmax(220px,.8fr) minmax(360px,1.2fr);gap:clamp(2rem,8vw,7rem);align-items:start}
.horario-pie-kicker{color:var(--agua-luz);font-size:.78rem;font-weight:600;letter-spacing:.18em;margin-bottom:.8rem}
.horario-pie h2{font-family:var(--fuente-titulos);font-size:clamp(1.6rem,3vw,2.5rem);line-height:1.05;color:var(--blanco);max-width:12ch}
.horario-tabla p{display:grid;grid-template-columns:1fr auto;gap:1.5rem;padding:.85rem 0;margin:0;border-bottom:1px solid rgba(255,255,255,.13);color:rgba(255,255,255,.62)}
.horario-tabla p:first-child{padding-top:0}.horario-tabla p:last-child{border-bottom:0}
.horario-tabla strong{color:var(--blanco);font-family:var(--fuente-titulos);font-weight:500;font-size:1.15rem}
.pie-fila{display:flex;justify-content:space-between;gap:2rem;flex-wrap:wrap}
.marca-pie{height:26px;width:auto;margin-bottom:.6rem}
.pie-nota{color:var(--tinta-suave);font-size:.94rem;margin-top:.3rem}
.pie-nav{display:flex;gap:1.4rem;flex-wrap:wrap;align-items:center}
.pie-nav a{color:var(--tinta-suave);text-decoration:none;font-size:.95rem}
.pie-nav a:hover{color:var(--terracota)}
.pie-legal{margin-top:2rem;font-size:.85rem;color:var(--tinta-suave)}
.pie-enlaces{display:flex;gap:.9rem 1.2rem;flex-wrap:wrap;align-items:center}
.pie-enlaces a{color:var(--tinta-suave);text-decoration:none}
.pie-enlaces a:hover{color:var(--terracota)}

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

/* ---------- stats (bento cálido: nota grande + cifras en versalita) ---------- */
.seccion-compacta{padding:clamp(2.4rem,4vw,3.8rem) 0}
.stats-bento{
  list-style:none;display:grid;
  grid-template-columns:1.4fr 1fr 1fr;grid-template-rows:1fr 1fr;gap:1rem;
}
.stat-dest{
  grid-row:1 / 3;background:var(--terracota);color:var(--blanco);
  border-radius:var(--radio-caja);padding:1.9rem;
  display:flex;flex-direction:column;justify-content:center;
}
.stat-estrellas{color:#ffe1b0;letter-spacing:.14em;font-size:1.35rem}
.stat-dest-num{
  font-family:var(--fuente-titulos);font-weight:700;
  font-size:clamp(3rem,2rem+3vw,4.4rem);line-height:.95;margin:.2rem 0 .15rem;
}
.stat-dest-etq{font-size:.98rem;color:rgba(255,255,255,.85);max-width:22ch}
.stat-dest-link{
  margin-top:1.1rem;align-self:flex-start;
  color:var(--blanco);font-family:var(--fuente-titulos);font-weight:600;font-size:.92rem;
  text-decoration:none;border-bottom:1.5px solid rgba(255,255,255,.5);padding-bottom:2px;
}
.stat-dest-link:hover{border-color:var(--blanco)}
.stat-cel{
  background:var(--agua);border-radius:var(--radio-caja);padding:1.5rem 1.6rem;
  display:flex;flex-direction:column;justify-content:center;
}
.stat-num{
  font-family:var(--fuente-titulos);font-weight:700;
  font-size:clamp(2rem,1.4rem+1.6vw,2.7rem);line-height:1;color:var(--tinta);
}
.stat-etq{
  margin-top:.55rem;font-size:.78rem;letter-spacing:.07em;
  text-transform:uppercase;color:var(--tinta-suave);
}

/* ---------- planes ---------- */
.planes-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem;align-items:start}
.plan{
  background:var(--blanco);border:1px solid var(--linea);
  border-radius:var(--radio-caja);padding:2rem 1.8rem;position:relative;
  display:flex;flex-direction:column;gap:1rem;
}
/* relieve: luz arriba, sombra de contacto abajo */
.plan{box-shadow:inset 0 1px 0 #fff, inset 0 -1px 0 rgba(14,28,43,.05), 0 2px 4px rgba(14,28,43,.04)}

/* --- tarjeta destacada, dentro de su marco de color --- */
@property --giro{syntax:'<angle>';initial-value:0deg;inherits:false}
.plan-marco{display:flex;border-radius:calc(var(--radio-caja) + 4px);transition:box-shadow .3s ease;
  background-image:conic-gradient(from var(--giro),
    var(--oro) 0deg, var(--terracota) 90deg,
    color-mix(in oklab,var(--terracota) 55%,#fff) 165deg,
    var(--terracota-oscuro) 250deg, var(--oro) 360deg)}
/* solo gira con el ratón encima: en reposo el marco no se ve */
.plan-marco:hover{animation:gira 14s linear infinite;
  box-shadow:0 0 34px 1px color-mix(in oklab,var(--terracota) 34%,transparent)}
@keyframes gira{to{--giro:360deg}}
.plan-marco>.plan{flex:1;margin:0;box-shadow:none;
  transition:transform .25s cubic-bezier(.16,1,.3,1), border-radius .25s}
.plan-marco:hover>.plan{transform:scale(.977)}

.plan-destacado{background:linear-gradient(165deg,var(--tinta) 0%,color-mix(in oklab,var(--tinta) 78%,#000) 100%);
  color:var(--blanco);border-color:transparent;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16), inset 0 0 0 1px rgba(255,255,255,.05)}
.plan-destacado .plan-nombre,.plan-destacado .plan-consulta{color:var(--blanco)}

/* Sello: oscuro con filo de oro, no píldora dorada plana en mayúsculas */
.plan-flag{
  position:absolute;top:-.82rem;right:1.4rem;z-index:2;
  display:inline-flex;align-items:center;gap:.5em;overflow:hidden;
  font-family:var(--fuente-texto);font-size:.75rem;font-weight:600;
  color:color-mix(in oklab,var(--oro) 88%,#fff);
  background:linear-gradient(180deg,
    color-mix(in oklab,var(--oro) 15%,var(--tinta)) 0%,
    color-mix(in oklab,var(--tinta) 92%,#000) 100%);
  border:1px solid color-mix(in oklab,var(--oro) 42%,transparent);
  border-radius:9px;padding:.45em .8em .45em .7em;
  box-shadow:0 8px 20px -10px color-mix(in oklab,var(--oro) 75%,#000),
             inset 0 1px 0 color-mix(in oklab,var(--oro) 25%,transparent);
  transition:border-color .3s ease, box-shadow .3s ease, transform .3s cubic-bezier(.16,1,.3,1);
}
.plan-flag svg,.plan-flag span{position:relative;z-index:1;flex:none}
.plan-flag svg{color:var(--oro)}
/* destello que recorre el sello: cada 9 s, no en bucle continuo */
.plan-flag::before{content:"";position:absolute;top:6%;left:-18%;width:14px;height:88%;
  opacity:0;transform:skewX(-20deg);filter:blur(2.5px);
  background:linear-gradient(90deg,transparent,color-mix(in oklab,var(--oro) 55%,#fff),transparent);
  box-shadow:0 0 20px 9px color-mix(in oklab,var(--oro) 40%,#fff);
  animation:destello 9s linear infinite}
@keyframes destello{
  0%{left:-18%;opacity:0} 2%{opacity:.85} 9%{left:116%;opacity:0} 100%{left:116%;opacity:0}
}
.plan-destacado:hover .plan-flag::before{animation-duration:1.8s}
.plan-destacado:hover .plan-flag{transform:translateY(-2px);
  border-color:color-mix(in oklab,var(--oro) 72%,transparent)}

.plan-nombre{font-size:1.4rem;color:var(--tinta)}
/* sin precio público: lo pide el cliente para no dar pie a que la competencia lo baje */
.plan-consulta{font-family:var(--fuente-titulos);font-weight:700;font-size:1.5rem;
  color:var(--tinta);letter-spacing:-.02em;line-height:1.15}
.plan-consulta small{display:block;font-family:var(--fuente-texto);font-weight:400;
  font-size:.88rem;color:var(--tinta-suave);letter-spacing:0;margin-top:.25rem}
.plan-destacado .plan-consulta small{color:rgba(255,255,255,.6)}

.plan-inc{font-family:var(--fuente-texto);font-size:.68rem;letter-spacing:.18em;
  text-transform:uppercase;font-weight:700;color:var(--tinta-suave);
  display:flex;align-items:center;gap:.8rem}
.plan-inc::after{content:"";flex:1;height:1px;background:var(--linea)}
.plan-destacado .plan-inc{color:rgba(255,255,255,.45)}
.plan-destacado .plan-inc::after{background:rgba(255,255,255,.14)}

.plan-lista{list-style:none;display:flex;flex-direction:column;flex:1}
.plan-lista li{display:flex;gap:.85em;align-items:flex-start;padding:.72rem 0;
  border-bottom:1px solid var(--linea);font-size:.98rem;font-weight:500;color:var(--tinta)}
.plan-lista li:last-child{border-bottom:0}
.plan-destacado .plan-lista li{border-bottom-color:rgba(255,255,255,.1);color:rgba(255,255,255,.92)}
.plan-lista .tk{flex:0 0 22px;height:22px;border-radius:50%;margin-top:.06em;
  display:grid;place-items:center;transition:.22s cubic-bezier(.16,1,.3,1);
  background:color-mix(in oklab,var(--terracota) 14%,transparent);color:var(--terracota)}
.plan-destacado .plan-lista .tk{background:color-mix(in oklab,var(--oro) 22%,transparent);color:var(--oro)}
.plan-lista li:hover .tk{transform:scale(1.14) rotate(-8deg)}
.plan-lista .tk svg{width:13px;height:13px}
.plan-lista li b{font-weight:600}
.plan-lista li small{display:block;font-weight:400;font-size:.86rem;
  color:var(--tinta-suave);margin-top:.15rem;line-height:1.45}
.plan-destacado .plan-lista li small{color:rgba(255,255,255,.55)}
.plan .boton{justify-content:center;margin-top:auto}
.plan-pie{font-size:.82rem;color:var(--tinta-suave);text-align:center;margin-top:-.3rem}
.plan-destacado .plan-pie{color:rgba(255,255,255,.5)}

@media (prefers-reduced-motion: reduce){
  .plan-marco:hover{animation:none}
  .plan-marco:hover>.plan{transform:none}
  .plan-flag::before{animation:none;opacity:0}
  .plan-destacado:hover .plan-flag{transform:none}
}
.planes-pie{text-align:center;color:var(--tinta-suave);font-size:.92rem;margin:1.8rem auto 0}

/* ---------- opiniones carrusel ---------- */
.opiniones-cab{display:flex;justify-content:space-between;align-items:flex-end;gap:1rem;margin-bottom:1.6rem;flex-wrap:wrap}
.opiniones-cab h2{margin-bottom:.4rem}
.opiniones-sub{color:var(--tinta-suave);font-size:1rem}
.opiniones-sub strong{color:var(--tinta)}
.opiniones-aviso{display:flex;align-items:center;gap:.5em;font-size:.85rem;color:var(--tinta-suave)}

/* --- cinta continua: se pinta 2 veces y la animación recorre la mitad justa,
       así el último fotograma es idéntico al primero y la costura no se ve --- */
.cinta{position:relative;overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);
          mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}
.cinta-pista{display:flex;gap:1.3rem;width:max-content;animation:desliza var(--dur,56s) linear infinite}
.cinta:hover .cinta-pista,.cinta:focus-within .cinta-pista{animation-play-state:paused}
@keyframes desliza{from{transform:translate3d(0,0,0)}to{transform:translate3d(calc(-50% - .65rem),0,0)}}
@media (prefers-reduced-motion: reduce){
  .cinta-pista{animation:none}
  .cinta{overflow-x:auto;-webkit-mask-image:none;mask-image:none}
}

.resena{
  flex:0 0 clamp(280px,26vw,360px);box-sizing:border-box;
  background:var(--blanco);border:1px solid var(--linea);border-radius:22px;
  padding:2.2rem 1.8rem 1.5rem;display:flex;flex-direction:column;
  position:relative;overflow:hidden;
  box-shadow:0 28px 56px -38px rgba(14,28,43,.6);
}
.resena::before{content:"";position:absolute;inset:0 0 auto 0;height:4px;
  background:linear-gradient(90deg,var(--terracota),var(--oro))}
.resena-comilla{position:absolute;top:.4rem;right:1.4rem;font-family:Georgia,serif;
  font-size:7rem;line-height:1;color:var(--terracota);opacity:.07;
  pointer-events:none;user-select:none}
.resena-gbadge{position:absolute;top:1.5rem;right:1.7rem;display:flex;align-items:center;gap:.45em;
  font-size:.74rem;font-weight:600;color:var(--tinta-suave);
  background:var(--papel);border:1px solid var(--linea);border-radius:999px;padding:.34em .75em}
.resena-estrellas{color:var(--oro);letter-spacing:.14em;font-size:1.15rem;display:block}
.resena-texto{font-family:var(--fuente-titulos);font-weight:500;font-size:1.06rem;line-height:1.5;
  letter-spacing:-.01em;margin:.9rem 0 1.3rem;color:var(--tinta);max-width:none;
  display:-webkit-box;-webkit-line-clamp:8;-webkit-box-orient:vertical;overflow:hidden}
.resena-texto p+p{margin-top:.6em}
.resena-cab{display:flex;align-items:center;gap:.8rem;padding-top:1.1rem;
  border-top:1px solid var(--linea);margin-top:auto}
.resena-avatar{
  width:46px;height:46px;border-radius:50%;flex:none;color:#fff;
  font-family:var(--fuente-titulos);font-weight:700;font-size:1.05rem;
  display:flex;align-items:center;justify-content:center;
}
.resena-quien{font-family:var(--fuente-titulos);font-weight:600;font-size:1.02rem;
  display:flex;align-items:center;gap:.45em}
.resena-guia{font-family:var(--fuente-texto);font-size:.62rem;font-weight:700;letter-spacing:.09em;
  text-transform:uppercase;background:var(--agua);color:var(--tinta-suave);
  border-radius:999px;padding:.22em .55em}
.resena-meta{font-size:.85rem;color:var(--tinta-suave)}
.resena-pie{display:flex;align-items:center;gap:.7rem;flex-wrap:wrap;margin-top:1rem}
.resena-trad{display:inline-flex;align-items:center;gap:.4em;font:inherit;font-size:.8rem;
  font-weight:600;color:var(--terracota);background:transparent;border:1px solid var(--linea);
  border-radius:999px;padding:.38em .85em;cursor:pointer;transition:.2s cubic-bezier(.16,1,.3,1)}
.resena-trad:hover{border-color:var(--terracota);
  background:color-mix(in oklab,var(--terracota) 8%,transparent);transform:translateY(-1px)}
.resena-link{margin-left:auto;font-size:.8rem;font-weight:600;color:var(--tinta-suave);
  text-decoration:none;border-bottom:1px solid var(--linea);transition:.2s}
.resena-link:hover{color:var(--terracota);border-color:var(--terracota)}
.opiniones-pie{text-align:center;margin-top:1.8rem}

/* ---------- faq ---------- */
.faq-cont{max-width:820px}
.faq-lista{display:flex;flex-direction:column;gap:.8rem}
.faq-item{
  background:var(--blanco);border:1px solid var(--linea);border-radius:var(--radio-caja);
  overflow:hidden;
}
.faq-item summary{
  cursor:pointer;list-style:none;padding:1.1rem 1.4rem;
  font-family:var(--fuente-titulos);font-weight:600;font-size:1.05rem;
  display:flex;justify-content:space-between;align-items:center;gap:1rem;
}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+";color:var(--terracota);font-size:1.5rem;line-height:1;transition:transform .2s ease}
.faq-item[open] summary::after{transform:rotate(45deg)}
.faq-cuerpo{padding:0 1.4rem 1.2rem}
.faq-cuerpo p{color:var(--tinta-suave);font-size:.98rem}

/* ---------- contacto ---------- */
.contacto-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(2rem,5vw,4rem);align-items:start}
.contacto-intro{color:color-mix(in srgb,var(--blanco) 80%,var(--tinta));font-size:1.1rem;margin-bottom:1.6rem}
.contacto-datos{list-style:none;display:flex;flex-direction:column;gap:.7rem;margin-bottom:1.6rem}
.contacto-datos a{
  color:var(--blanco);text-decoration:none;font-weight:500;
  border-bottom:1.5px solid color-mix(in srgb,var(--blanco) 26%,transparent);padding-bottom:2px;
}
.contacto-datos a:hover{border-color:var(--terracota)}
.contacto-zona{font-size:.92rem;color:color-mix(in srgb,var(--blanco) 60%,var(--tinta));max-width:34rem}
.contacto-form{
  background:var(--blanco);border-radius:var(--radio-caja);padding:1.8rem;
  display:flex;flex-direction:column;gap:1rem;
}
.contacto-form .campo label{color:var(--tinta)}
.contacto-form input,.contacto-form textarea{
  font:inherit;padding:.65em .8em;border:1.5px solid var(--linea);
  border-radius:var(--radio-input);background:var(--papel);color:var(--tinta);width:100%;
  resize:vertical;
}
.contacto-form input:focus,.contacto-form textarea:focus{outline:2px solid var(--terracota);outline-offset:1px;border-color:var(--terracota)}
.contacto-form .boton{justify-content:center;margin-top:.3rem}
.hp-campo{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-estado{font-size:.92rem;min-height:1.2em;text-align:center;max-width:none}
.form-estado.ok{color:#2e7d5b}
.form-estado.error{color:var(--terracota)}
.form-legal{font-size:.84rem;line-height:1.45;color:var(--tinta-suave);margin-top:-.2rem}
.form-legal a{color:inherit;text-decoration-color:var(--terracota);text-underline-offset:.16em}

/* ---------- pie: botón cookies ---------- */
.pie-legal{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap}
.pie-cookies{background:none;border:none;color:var(--tinta-suave);font:inherit;font-size:.85rem;cursor:pointer;text-decoration:underline}
.pie-cookies:hover{color:var(--terracota)}

/* ---------- páginas de servicio ---------- */
.miga{padding:1.1rem 0 0;font-size:.9rem;color:var(--tinta-suave)}
.miga a{color:var(--tinta-suave);text-decoration:none}
.miga a:hover{color:var(--terracota)}
.svc-hero{padding:clamp(1.6rem,3vw,2.6rem) 0 clamp(2rem,4vw,3.5rem)}
.svc-hero .hero-sub{max-width:40rem}
.svc-body h2{margin-top:0}
.svc-body p{color:var(--tinta-suave)}
.svc-lista{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:.8rem 1.6rem;margin:1.4rem 0}
.svc-lista li{position:relative;padding-left:1.7rem;color:var(--tinta-suave)}
.svc-lista li::before{content:"✓";position:absolute;left:0;color:var(--terracota);font-weight:700}
.incluye-split{
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,4vw,3.5rem);
  align-items:start;margin:1.8rem 0;
}
.incluye-split figure{margin:0}
.incluye-split img{
  border-radius:var(--radio-caja);width:100%;
  box-shadow:0 14px 34px rgba(20,51,59,.12);
}
.incluye-lista{list-style:none}
.incluye-lista li{
  padding:.9rem 0;border-bottom:1px solid var(--linea);
  display:flex;justify-content:space-between;gap:1.5rem;align-items:baseline;
}
.incluye-lista li:first-child{padding-top:0}
.incluye-lista .k{font-family:var(--fuente-titulos);font-weight:600;font-size:1.05rem;color:var(--tinta)}
.incluye-lista .v{color:var(--tinta-suave);font-size:.9rem;text-align:right;max-width:22ch}
.incluye-nota{
  display:flex;align-items:center;gap:1.2rem;flex-wrap:wrap;
  background:var(--tinta);color:var(--blanco);border-radius:var(--radio-caja);
  padding:1.5rem 1.7rem;margin-top:2rem;
}
.incluye-nota p{margin:0;font-size:1.02rem;color:color-mix(in srgb,var(--blanco) 88%,var(--tinta))}
.incluye-nota strong{color:var(--blanco)}
.incluye-nota .boton{margin-left:auto;white-space:nowrap}

.cta-band{background:var(--terracota);color:var(--blanco);text-align:center;border-radius:var(--radio-caja);padding:2.4rem 1.5rem}
.cta-band h2{color:var(--blanco);margin-bottom:.6rem}
.cta-band p{color:color-mix(in srgb,var(--blanco) 88%,var(--terracota));margin:0 auto 1.4rem;max-width:40ch}
.cta-band .boton-primario{background:var(--blanco);color:var(--terracota);box-shadow:none}
.cta-band .boton-primario:hover{background:var(--tinta);color:var(--blanco)}
.otros-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem;margin-top:1.4rem}
.otro-svc{
  display:block;background:var(--blanco);border:1px solid var(--linea);
  border-radius:var(--radio-caja);padding:1.3rem 1.5rem;text-decoration:none;color:var(--tinta);
  transition:transform .18s ease,box-shadow .18s ease;
}
.otro-svc:hover{transform:translateY(-3px);box-shadow:0 12px 26px rgba(20,51,59,.1)}
.otro-svc h3{margin-bottom:.3rem}
.otro-svc span{color:var(--terracota);font-family:var(--fuente-titulos);font-weight:600;font-size:.92rem}

/* ---------- whatsapp float ---------- */
.wa-float{
  position:fixed;right:20px;bottom:24px;z-index:45;
  width:56px;height:56px;border-radius:50%;background:#25d366;color:#fff;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 8px 22px rgba(37,211,102,.4);transition:transform .18s ease;
}
.wa-float:hover{transform:scale(1.06)}
.wa-float svg{width:30px;height:30px}

/* ---------- chat asistente ---------- */
.chat{position:fixed;right:20px;bottom:92px;z-index:46}
.chat-toggle{
  width:56px;height:56px;border-radius:50%;border:none;cursor:pointer;
  background:var(--terracota);color:var(--blanco);font-size:1.5rem;
  box-shadow:0 8px 22px rgba(192,90,56,.4);transition:transform .18s ease;
}
.chat-toggle:hover{transform:scale(1.06)}
.chat-panel{
  position:absolute;right:0;bottom:70px;width:min(340px,calc(100vw - 40px));
  background:var(--blanco);border:1px solid var(--linea);border-radius:var(--radio-caja);
  box-shadow:0 18px 50px rgba(20,51,59,.28);overflow:hidden;
  display:flex;flex-direction:column;max-height:min(70vh,520px);
}
.chat-panel[hidden]{display:none}
.chat-cab{background:var(--tinta);color:var(--blanco);padding:.9rem 1.1rem;display:flex;justify-content:space-between;align-items:center}
.chat-titulo{font-family:var(--fuente-titulos);font-weight:600;max-width:none}
.chat-cerrar{background:none;border:none;color:var(--blanco);font-size:1.5rem;line-height:1;cursor:pointer}
.chat-log{padding:1rem;display:flex;flex-direction:column;gap:.7rem;overflow-y:auto;flex:1}
.chat-msg{padding:.6rem .85rem;border-radius:12px;font-size:.94rem;max-width:85%;line-height:1.5}
.chat-msg.bot{background:var(--agua);color:var(--tinta);align-self:flex-start;border-bottom-left-radius:3px}
.chat-msg.user{background:var(--terracota);color:var(--blanco);align-self:flex-end;border-bottom-right-radius:3px}
.chat-ops{padding:.4rem 1rem 1rem;display:flex;flex-wrap:wrap;gap:.5rem}
.chat-op{
  background:var(--blanco);border:1.5px solid var(--linea);border-radius:999px;
  padding:.4em .85em;font:inherit;font-size:.86rem;color:var(--tinta);cursor:pointer;
  transition:all .16s ease;
}
.chat-op:hover{border-color:var(--terracota);color:var(--terracota)}
.chat-teaser{
  position:absolute;right:0;bottom:68px;width:min(285px,calc(100vw - 36px));
  padding:.85rem 2.2rem .85rem 1rem;background:var(--blanco);color:var(--tinta);
  border:1px solid var(--linea);border-radius:14px 14px 4px 14px;
  box-shadow:0 12px 30px rgba(20,51,59,.2);font-size:.93rem;line-height:1.35;
  opacity:0;visibility:hidden;transform:translateY(8px) scale(.98);pointer-events:none;
  transition:opacity .24s ease,transform .24s ease,visibility .24s ease;
}
.chat-teaser::after{content:"";position:absolute;right:18px;bottom:-7px;width:13px;height:13px;background:var(--blanco);border-right:1px solid var(--linea);border-bottom:1px solid var(--linea);transform:rotate(45deg)}
.chat-teaser-visible{opacity:1;visibility:visible;transform:translateY(0) scale(1);pointer-events:auto;cursor:pointer}
.chat-teaser-cerrar{position:absolute;top:.38rem;right:.5rem;border:0;background:none;color:var(--tinta-suave);font-size:1.2rem;line-height:1;cursor:pointer;padding:.15rem}
.chat-teaser-cerrar:hover{color:var(--terracota)}

/* ---------- banner de cookies (RGPD) ---------- */
.cookie-bar{
  position:fixed;left:0;right:0;bottom:0;z-index:60;
  background:var(--tinta);color:var(--blanco);
  border-top:3px solid var(--terracota);
  box-shadow:0 -18px 40px -20px rgba(14,28,43,.75);
  animation:cookie-sube .38s cubic-bezier(.16,1,.3,1) both;
}
@keyframes cookie-sube{from{transform:translateY(100%)}to{transform:translateY(0)}}
.cookie-cont{
  max-width:var(--ancho-max);margin:0 auto;padding:1.35rem clamp(1.1rem,4vw,2rem);
  display:flex;align-items:center;gap:clamp(1.2rem,4vw,3rem);flex-wrap:wrap;
}
.cookie-texto{flex:1;min-width:min(300px,100%)}
.cookie-titulo{
  display:block;font-family:var(--fuente-titulos);font-weight:700;
  font-size:1.12rem;letter-spacing:-.02em;margin-bottom:.3rem;
}
.cookie-txt{
  max-width:64ch;margin:0;font-size:.93rem;line-height:1.6;
  color:color-mix(in srgb,var(--blanco) 72%,var(--tinta));
}
.cookie-txt a{color:var(--blanco);text-decoration:underline;text-underline-offset:.16em;
  text-decoration-color:var(--agua-luz)}
.cookie-txt a:hover{color:var(--agua-luz)}
.cookie-acciones{display:flex;gap:.6rem;margin-left:auto;flex-wrap:wrap;flex:none}
/* Los tres botones pesan distinto a propósito: rechazar y personalizar quedan
   al mismo nivel visual, sin esconder el rechazo detrás de un enlace gris. */
.cookie-bar .boton-secundario{color:var(--blanco);box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--blanco) 40%,transparent)}
.cookie-bar .boton-secundario:hover{background:var(--blanco);color:var(--tinta);box-shadow:inset 0 0 0 1.5px var(--blanco)}
.cookie-bar .cookie-personalizar{box-shadow:inset 0 0 0 1.5px var(--agua-luz);color:var(--agua-luz)}
.cookie-bar .cookie-personalizar:hover{background:var(--agua-luz);color:var(--tinta);box-shadow:inset 0 0 0 1.5px var(--agua-luz)}

/* ---------- modal de preferencias de cookies ---------- */
.cookie-modal{
  position:fixed;inset:0;z-index:70;display:flex;align-items:center;justify-content:center;
  padding:clamp(1rem,4vw,2rem);background:rgba(14,28,43,.62);backdrop-filter:blur(3px);
  animation:cookie-fade .2s ease both;
}
.cookie-modal[hidden]{display:none}
@keyframes cookie-fade{from{opacity:0}to{opacity:1}}
.cookie-caja{
  width:min(680px,100%);max-height:min(86vh,760px);display:flex;flex-direction:column;
  background:var(--papel);color:var(--tinta);border-radius:16px;overflow:hidden;
  border-top:3px solid var(--terracota);
  box-shadow:0 40px 80px -40px rgba(14,28,43,.7);
  animation:cookie-entra .3s cubic-bezier(.16,1,.3,1) both;
}
@keyframes cookie-entra{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
.cookie-caja-cab{padding:clamp(1.4rem,3vw,2rem) clamp(1.4rem,3.5vw,2.2rem) 1.1rem;border-bottom:1px solid var(--linea)}
.cookie-caja-cab h2{font-size:clamp(1.4rem,2.6vw,1.85rem);margin:0 0 .5rem}
.cookie-caja-cab p{margin:0;color:var(--tinta-suave);font-size:.94rem;line-height:1.6;max-width:58ch}
.cookie-caja-cuerpo{overflow-y:auto;padding:0 clamp(1.4rem,3.5vw,2.2rem)}
.cookie-fila{display:flex;align-items:flex-start;gap:1.5rem;padding:1.25rem 0;border-bottom:1px solid var(--linea)}
.cookie-fila:last-child{border-bottom:none}
.cookie-fila-info{flex:1}
.cookie-fila-info strong{display:block;font-family:var(--fuente-titulos);font-size:1.02rem;font-weight:600;margin-bottom:.25rem}
.cookie-fila-info p{margin:0;font-size:.9rem;line-height:1.6;color:var(--tinta-suave);max-width:none}
.cookie-siempre{
  flex:none;margin-top:.2rem;font-size:.7rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:var(--terracota);background:var(--agua);padding:.4rem .7rem;border-radius:999px;white-space:nowrap;
}
/* Interruptor: checkbox real (accesible por teclado) con la pastilla dibujada encima. */
.cookie-switch{position:relative;flex:none;width:52px;height:30px;margin-top:.15rem}
.cookie-switch input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.cookie-switch-pastilla{
  position:absolute;inset:0;border-radius:999px;background:#c3d2de;pointer-events:none;
  transition:background .22s ease;
}
.cookie-switch-pastilla::before{
  content:"";position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;
  background:var(--blanco);box-shadow:0 2px 6px rgba(14,28,43,.3);
  transition:transform .22s cubic-bezier(.16,1,.3,1);
}
.cookie-switch input:checked+.cookie-switch-pastilla{background:var(--terracota)}
.cookie-switch input:checked+.cookie-switch-pastilla::before{transform:translateX(22px)}
.cookie-switch input:focus-visible+.cookie-switch-pastilla{outline:2px solid var(--terracota);outline-offset:3px}
.cookie-caja-pie{
  display:flex;justify-content:flex-end;gap:.7rem;flex-wrap:wrap;
  padding:1.1rem clamp(1.4rem,3.5vw,2.2rem) clamp(1.3rem,3vw,1.6rem);
  border-top:1px solid var(--linea);background:color-mix(in srgb,var(--agua) 45%,var(--papel));
}
@media (max-width:860px){
  .horario-pie-cont{grid-template-columns:1fr;gap:1.5rem}
  .horario-pie h2{max-width:none}
  /* Las páginas legales no tienen menú hamburguesa propio: mantenemos su navegación
     visible y refluida para que no desaparezcan los enlaces en móvil. */
  .legal-cabecera .cabecera-fila{display:block;height:auto;padding-top:.75rem;padding-bottom:.75rem}
  .legal-cabecera .nav-principal{display:flex;position:static;flex-wrap:wrap;gap:.65rem .9rem;margin-top:.7rem;padding:0;background:transparent;border:0;overflow:visible}
  .legal-cabecera .nav-principal .nav-cta{margin-top:0}
  /* En móvil el banner no puede comerse media pantalla: texto más compacto y
     los tres botones en rejilla (rechazar | personalizar / aceptar a lo ancho). */
  .cookie-bar{padding-bottom:env(safe-area-inset-bottom,0)}
  .cookie-cont{align-items:stretch;padding:1rem clamp(1.1rem,4vw,2rem);gap:.85rem}
  .cookie-titulo{font-size:1.02rem}
  .cookie-txt{font-size:.86rem;line-height:1.5}
  .cookie-acciones{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin-left:0;width:100%}
  .cookie-acciones .boton{justify-content:center}
  .cookie-acciones .boton-primario{grid-column:1/-1}
  .cookie-caja-pie .boton{flex:1 1 100%;justify-content:center}
}
@media (max-width:560px){
  /* En pantallas estrechas el interruptor comprimía el título hasta partirlo:
     pasa a rejilla — título y control en la primera fila, descripción debajo. */
  .cookie-fila{display:grid;grid-template-columns:1fr auto;column-gap:1rem;row-gap:.3rem}
  .cookie-fila-info{display:contents}
  .cookie-fila-info strong{grid-column:1;grid-row:1;align-self:center}
  .cookie-fila-info p{grid-column:1/-1;grid-row:2}
  .cookie-siempre,.cookie-switch{grid-column:2;grid-row:1;justify-self:end;margin-top:0}
  .cookie-siempre{font-size:.62rem;padding:.35rem .6rem}
}
@media (prefers-reduced-motion:reduce){
  .cookie-bar,.cookie-modal,.cookie-caja{animation:none}
  .cookie-switch-pastilla,.cookie-switch-pastilla::before{transition:none}
}

/* ---------- páginas legales ---------- */
.legal-cabecera{position:relative;background:var(--papel);border-bottom:1px solid var(--linea)}
.legal-intro{padding:clamp(3.5rem,8vw,7rem) 0 clamp(2rem,5vw,4rem);background:var(--agua)}
.legal-intro h1{font-size:clamp(2.6rem,5.6vw,5.4rem);letter-spacing:-.06em;margin:0;max-width:12ch}
.legal-intro p{margin-top:1.2rem;color:var(--tinta-suave);max-width:58ch}
.legal-cuerpo{padding:clamp(3rem,7vw,6rem) 0;max-width:860px}
.legal-cuerpo h2{font-size:clamp(1.45rem,2vw,2rem);margin:2.8rem 0 .85rem}
.legal-cuerpo h2:first-child{margin-top:0}
.legal-cuerpo h3{font-size:1.08rem;margin:1.5rem 0 .45rem}
.legal-cuerpo p,.legal-cuerpo li{color:var(--tinta-suave);line-height:1.7}
.legal-cuerpo ul{padding-left:1.2rem;margin:.7rem 0 1.2rem}
.legal-cuerpo li+li{margin-top:.35rem}
.legal-cuerpo a{color:var(--tinta);text-decoration-color:var(--terracota);text-underline-offset:.16em}
.legal-ficha{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--linea);border:1px solid var(--linea);margin:1.4rem 0 2.2rem}
.legal-ficha div{background:var(--papel);padding:1rem 1.15rem}
.legal-ficha dt{font-size:.72rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--tinta-suave)}
.legal-ficha dd{margin:.35rem 0 0;color:var(--tinta);line-height:1.45}
.legal-tabla{width:100%;border-collapse:collapse;margin:1.2rem 0 2rem;font-size:.93rem}
.legal-tabla th,.legal-tabla td{text-align:left;vertical-align:top;padding:.85rem;border-bottom:1px solid var(--linea);color:var(--tinta-suave);line-height:1.5}
.legal-tabla th{color:var(--tinta);font-family:var(--fuente-titulos)}
@media(max-width:620px){.legal-ficha{grid-template-columns:1fr}.legal-tabla{font-size:.83rem}.legal-tabla th,.legal-tabla td{padding:.65rem .4rem}}

/* ---------- animación de entrada ---------- */
@media (prefers-reduced-motion: no-preference){
  .revelar{opacity:0;transform:translateY(18px);transition:opacity .6s ease, transform .6s ease}
  .revelar.visible{opacity:1;transform:none}
}

/* ============================================================
   MÓVIL (≤860px)
   ============================================================ */
@media (max-width:860px){
  .cabecera-fila{height:60px}
  .nav-burger{
    display:flex;flex-direction:column;justify-content:center;gap:5px;
    width:42px;height:42px;background:none;border:none;cursor:pointer;
    align-items:center;
  }
  .nav-burger span{width:22px;height:2px;background:var(--tinta);transition:transform .2s ease}
  .nav-burger[aria-expanded="true"] span:first-child{transform:translateY(3.5px) rotate(45deg)}
  .nav-burger[aria-expanded="true"] span:last-child{transform:translateY(-3.5px) rotate(-45deg)}
  .nav-principal{
    display:none;position:absolute;top:60px;left:0;right:0;
    background:var(--papel);border-bottom:1px solid var(--linea);
    flex-direction:column;align-items:flex-start;
    padding:1.2rem clamp(1.1rem, 4vw, 2rem) 1.5rem;gap:1rem;
  }
  .nav-principal.abierto{display:flex}
  .nav-cta{margin-top:.3rem}
  .marca img{height:26px}
  /* dentro del menú desplegado, el panel de servicios va en el flujo */
  .menu{width:100%}
  .menu-panel{position:static;width:auto;opacity:1;visibility:visible;transform:none;
    box-shadow:none;padding:.4rem 0 0;display:none}
  .menu-panel[data-abierto="si"]{display:block}

  .hero{padding-top:2rem}
  .hero-grid,.como-grid,.calc-grid{grid-template-columns:1fr;gap:2rem}
  .hero h1{font-size:clamp(2rem, 8.5vw, 2.6rem)}
  .hero-foto{order:2}

  /* portada: bajo la línea de flotación */
  .cabecera-portada .marca img{height:28px}
  .cabecera-portada.sumergido .marca img{height:26px}
  /* El panel del menú se abre sobre la foto: va oscuro para que los enlaces
     en blanco sigan leyéndose. Solo en la home. */
  .cabecera-portada .nav-principal{
    background:rgba(6,32,58,.96);
    -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
    border-bottom-color:rgba(255,255,255,.14);
  }
  .cabecera-portada .nav-cta{align-self:stretch;justify-content:center}
  .portada-aire{min-height:clamp(540px,88vh,700px)}
  .portada-copy{padding-top:5.5rem}
  .portada h1{font-size:clamp(2rem,8.4vw,2.7rem);max-width:100%}
  .portada-acciones .boton-marea{flex:1 1 100%;justify-content:center}
  /* A ancho completo solo quedan dos esquinas sueltas: un filete tenue
     ayuda a leerlo como zona pulsable. */
  .portada-acciones .boton-marea{box-shadow:inset 0 0 0 1px rgba(255,255,255,.24)}

  .servicios-bento{grid-template-columns:1fr;grid-template-rows:auto}
  .servicio-grande{grid-row:auto}
  .servicio img,.servicio-grande img,.servicio:not(.servicio-grande) img{
    max-height:200px;min-height:0;flex:none;
  }

  .opiniones-grid{grid-template-columns:1fr}
  .galeria{grid-template-columns:1fr}
  .galeria-ancha{grid-row:auto}
  .galeria-ancha img{min-height:0}

  .calc-campos{grid-template-columns:1fr}

  .franja-fila{justify-content:center;text-align:center}

  /* barra fija inferior */
  .barra-movil{
    display:flex;position:fixed;left:0;right:0;bottom:0;z-index:50;
    box-shadow:0 -4px 16px rgba(20,51,59,.14);
  }
  .barra-movil a{
    flex:1;text-align:center;padding:.95rem 0;
    font-family:var(--fuente-titulos);font-weight:600;font-size:1rem;
    text-decoration:none;
  }
  .barra-llamar{background:var(--tinta);color:var(--blanco)}
  .barra-wa{background:var(--terracota);color:var(--blanco)}
  body{padding-bottom:52px}
  .pie{padding-bottom:2rem}

  .stats-bento{grid-template-columns:1fr 1fr;grid-template-rows:auto;gap:.8rem}
  .stat-dest{grid-row:auto;grid-column:1 / 3}
  .stat-cel{padding:1.2rem 1.2rem}
  .planes-grid{grid-template-columns:1fr}
  .contacto-grid{grid-template-columns:1fr}
  .wa-float{bottom:66px;right:14px}
  .chat{bottom:132px;right:14px}
  .chat-teaser{bottom:68px;right:0;width:min(275px,calc(100vw - 28px))}
  .svc-lista{grid-template-columns:1fr}
  .otros-grid{grid-template-columns:1fr}
  .incluye-split{grid-template-columns:1fr;gap:1.6rem}
  .incluye-lista li{flex-direction:column;gap:.15rem;align-items:flex-start}
  .incluye-lista .v{text-align:left}
  .incluye-nota{flex-direction:column;align-items:flex-start;gap:1rem}
  .incluye-nota .boton{margin-left:0}
}

@media (max-width:380px){
  .stats-bento{grid-template-columns:1fr}
  .stat-dest{grid-column:auto}
}

/* ============================================================
   AÑADIDOS 2026-07-25 (muestrario aprobado por el cliente)
   ============================================================ */

/* ---------- enlaces de servicio con caja ---------- */
.enlace-servicio{
  display:inline-flex;align-items:center;gap:.6em;
  font-family:var(--fuente-titulos);font-weight:600;text-decoration:none;
  color:var(--tinta);background:var(--blanco);border:1px solid var(--linea);
  padding:.7em 1.15em;border-radius:12px;overflow:hidden;
  position:relative;isolation:isolate;transition:.22s cubic-bezier(.16,1,.3,1);
}
.enlace-servicio::before{content:"";position:absolute;inset:0;z-index:-1;
  background:var(--terracota);transform:translateX(-101%);
  transition:transform .32s cubic-bezier(.16,1,.3,1)}
.enlace-servicio:hover{color:var(--blanco);border-color:var(--terracota);transform:translateY(-2px);
  box-shadow:0 10px 22px -12px color-mix(in oklab,var(--terracota) 80%,#000)}
.enlace-servicio:hover::before{transform:translateX(0)}
.enlace-servicio .fl{transition:transform .28s cubic-bezier(.16,1,.3,1)}
.enlace-servicio:hover .fl{transform:translateX(5px)}

/* ---------- menú "Servicios" de la cabecera ---------- */
.menu{position:relative}
.menu-btn{font:inherit;font-size:inherit;color:inherit;background:transparent;border:0;cursor:pointer;
  padding:.4em .2em;display:flex;align-items:center;gap:.4em;transition:color .18s}
.menu-btn:hover,.menu-btn[aria-expanded="true"]{color:var(--terracota)}
.menu-signo{position:relative;width:12px;height:12px;margin-left:.15rem}
.menu-signo::before,.menu-signo::after{content:"";position:absolute;inset:50% 0 auto;height:1px;background:currentColor;transition:transform .2s}
.menu-signo::after{transform:rotate(90deg)}
.menu-btn[aria-expanded="true"] .menu-signo::after{transform:rotate(0)}

.menu-panel{position:absolute;top:calc(100% + 1rem);left:0;width:min(500px,88vw);
  background:var(--papel);border-radius:0;padding:1.35rem 1.5rem;z-index:60;
  border-top:3px solid var(--terracota);box-shadow:0 28px 55px -28px rgba(14,28,43,.45);
  opacity:0;visibility:hidden;transform:translateY(-8px);transform-origin:top left;
  transition:opacity .22s ease, transform .26s cubic-bezier(.16,1,.3,1), visibility .26s}
.menu-panel[data-abierto="si"]{opacity:1;visibility:visible;transform:translateY(0)}
.menu-panel::before{display:none}
.menu-tit{font-size:.7rem;letter-spacing:.17em;text-transform:uppercase;font-weight:700;
  color:var(--tinta-suave);padding:0 0 .75rem;max-width:none}
.menu-item{display:grid;grid-template-columns:2rem 1fr auto;align-items:center;gap:1rem;padding:1rem 0;
  border-top:1px solid var(--linea);text-decoration:none;color:inherit;transition:color .2s}
.menu-item::after{content:"→";color:var(--terracota);font-weight:700;transition:transform .2s}
.menu-item:hover{background:transparent;color:var(--terracota);transform:none}
.menu-item:hover::after{transform:translateX(5px)}
.menu-ico{width:auto;height:auto;border-radius:0;display:block;color:var(--terracota);
  font-size:.68rem;font-weight:700;letter-spacing:.12em;transition:none}
.menu-item:hover .menu-ico{transform:none}
.menu-ico-1,.menu-ico-2,.menu-ico-3{background:transparent;color:var(--terracota)}
.menu-item b{display:block;font-family:var(--fuente-titulos);font-weight:600;font-size:1.03rem;
  letter-spacing:-.01em}
.menu-item small{display:block;font-size:.88rem;color:var(--tinta-suave);margin-top:.1rem}
.menu-pie{margin-top:.5rem;padding-top:.85rem;border-top:1px solid var(--linea)}
.menu-pie a{display:flex;align-items:center;justify-content:space-between;gap:.5em;
  font-family:var(--fuente-titulos);font-weight:600;font-size:.93rem;color:var(--terracota);
  text-decoration:none;padding:.5rem .6rem;border-radius:10px;transition:.2s}
.menu-pie a:hover{background:color-mix(in oklab,var(--terracota) 9%,transparent)}
.menu-pie a .fl{transition:transform .25s cubic-bezier(.16,1,.3,1)}
.menu-pie a:hover .fl{transform:translateX(4px)}

.nav-tienda{display:inline-flex;align-items:center;gap:.4em}
.nav-idioma{display:flex;align-items:center;gap:.5rem;padding-left:.85rem;border-left:1px solid currentColor}
.nav-idioma a:not(.boton){display:inline-flex;align-items:center;justify-content:center;
  width:2.35rem;height:1.75rem;padding:0;border-radius:6px;text-decoration:none;color:inherit;
  font-size:0;line-height:1;opacity:.55;transition:opacity .2s ease, transform .2s ease}
.nav-idioma a::after{font-size:1.6rem;line-height:1}
.nav-idioma a[lang="es"]::after{content:"🇪🇸"}
.nav-idioma a[lang="en"]::after{content:"🇬🇧"}
.nav-idioma a:hover,.nav-idioma a:focus-visible{opacity:1;transform:translateY(-1px)}
.nav-idioma a.idioma-actual{opacity:1;box-shadow:inset 0 -2px 0 currentColor}

/* ---------- contacto: tarjeta de visita partida sobre foto de agua ---------- */
.ct-vis{display:grid;grid-template-columns:1fr 1fr;border-radius:20px;overflow:hidden;
  box-shadow:0 30px 60px -34px rgba(14,28,43,.5)}
.ct-vis-izq{color:var(--blanco);padding:clamp(1.8rem,3.5vw,2.6rem);
  display:flex;flex-direction:column;gap:1.1rem;position:relative;overflow:hidden;
  background:var(--tinta)}
/* la foto de agua va de fondo, oscurecida para que el texto blanco se lea */
.ct-vis-izq::before{content:"";position:absolute;inset:0;z-index:0;
  background-image:linear-gradient(165deg,
      color-mix(in srgb,var(--tinta) 88%,transparent),
      color-mix(in srgb,var(--tinta) 96%,transparent)),
    url("../imagenes/agua-fondo.webp");
  background-size:cover;background-position:center}
.ct-vis-izq>*{position:relative;z-index:1}
.ct-vis-marca{height:28px;width:auto;align-self:flex-start}
.ct-vis-claim{font-family:var(--fuente-titulos);font-weight:500;font-size:1.5rem;
  line-height:1.25;letter-spacing:-.02em;max-width:none}
.ct-vis-zona{font-size:.92rem;color:rgba(255,255,255,.7);max-width:none}
.ct-vis-izq .boton{margin-top:auto;justify-content:center}
.ct-vis-der{background:var(--blanco);padding:clamp(1.6rem,3.5vw,2.2rem);
  display:flex;flex-direction:column;justify-content:center}
.ct-vis-fila{display:flex;align-items:center;gap:.9rem;padding:.95rem 0;
  text-decoration:none;color:inherit}
.ct-vis-fila+.ct-vis-fila{border-top:1px solid var(--linea)}
.ct-vis-ico{flex:0 0 34px;height:34px;color:var(--terracota);display:grid;place-items:center;
  transition:transform .25s cubic-bezier(.16,1,.3,1)}
.ct-vis-fila:hover .ct-vis-ico{transform:scale(1.15)}
.ct-vis-k{display:block;font-size:.66rem;letter-spacing:.17em;text-transform:uppercase;
  color:var(--tinta-suave);font-weight:700}
.ct-vis-v{font-family:var(--fuente-titulos);font-weight:600;font-size:1.05rem;transition:color .2s}
.ct-vis-fila:hover .ct-vis-v{color:var(--terracota)}
.ct-vis-v small{display:block;font-family:var(--fuente-texto);font-weight:400;font-size:.87rem;
  color:var(--tinta-suave);margin-top:.15rem}

@media (max-width:860px){
  .ct-vis{grid-template-columns:1fr}
  /* el panel de servicios va en el flujo del menú hamburguesa: lo colocan
     las reglas de .nav-principal más arriba. Aquí solo quitamos el piquito. */
  .menu-panel::before{display:none}
}

/* ---------- contacto: datos + formulario en una sola tarjeta ---------- */
.ct-vis-wa{width:100%;justify-content:center}
.ct-datos{list-style:none;display:flex;flex-direction:column;margin-top:.4rem}
.ct-datos li+li{border-top:1px solid rgba(255,255,255,.12)}
.ct-dato{display:flex;align-items:center;gap:.85rem;padding:.8rem 0;
  text-decoration:none;color:inherit}
.ct-dato-ico{flex:0 0 32px;height:32px;border-radius:9px;display:grid;place-items:center;
  background:rgba(255,255,255,.08);color:color-mix(in oklab,var(--terracota) 45%,#fff);
  transition:transform .25s cubic-bezier(.16,1,.3,1), background .25s}
a.ct-dato:hover .ct-dato-ico{transform:scale(1.08);background:rgba(255,255,255,.16)}
.ct-dato-k{display:block;font-size:.64rem;letter-spacing:.17em;text-transform:uppercase;
  color:rgba(255,255,255,.5);font-weight:700}
.ct-dato-v{font-family:var(--fuente-titulos);font-weight:600;font-size:1rem;
  color:var(--blanco);transition:color .2s}
a.ct-dato:hover .ct-dato-v{color:color-mix(in oklab,var(--terracota) 45%,#fff)}

.ct-form-tit{font-size:1.6rem;margin-bottom:.4rem}
.ct-form-sub{color:var(--tinta-suave);font-size:.97rem;margin-bottom:1.4rem}
.ct-vis-der .contacto-form{display:flex;flex-direction:column;gap:1rem}
.ct-vis-der .contacto-form .boton{justify-content:center}

/* foto real del cliente cuando la haya; si no, la inicial de siempre */
img.resena-avatar{object-fit:cover;background:var(--agua)}
.resena-check{flex:none;vertical-align:middle}

/* ---------- página de servicio: mantenimiento ---------- */
.svc-eyebrow{font-size:.72rem;letter-spacing:.19em;text-transform:uppercase;font-weight:700;
  color:var(--terracota);margin-bottom:.9rem}
.svc-cierre{font-family:var(--fuente-titulos);font-weight:500;font-size:1.1rem;
  color:var(--tinta);letter-spacing:-.01em;margin:1.1rem 0 1.4rem}

/* tres ventajas */
.ventajas{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);border-block:1px solid var(--linea)}
.ventajas li{position:relative;padding:2rem clamp(1rem,3vw,2.5rem) 2.2rem 0}
.ventajas li+li{border-left:1px solid var(--linea);padding-left:clamp(1rem,3vw,2.5rem)}
.ventaja-num{display:block;color:var(--terracota);font-size:.68rem;font-weight:700;letter-spacing:.14em;margin-bottom:1.8rem}
.ventajas h2{font-size:clamp(1.4rem,2.2vw,2rem);margin-bottom:.65rem;letter-spacing:-.03em}
.ventajas p{color:var(--tinta-suave);font-size:1rem;max-width:30ch}

/* tarjeta con lista de checks */
.tarjeta-lista{background:transparent;border:0;border-left:1px solid var(--linea);
  border-radius:0;padding:0 0 0 clamp(1.5rem,4vw,4rem);box-shadow:none}
.tarjeta-lista-sobre{color:var(--terracota);font-size:.68rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;margin-bottom:.8rem}
.tarjeta-lista-tit{font-family:var(--fuente-titulos);font-weight:600;font-size:clamp(1.5rem,2.4vw,2.2rem);
  line-height:1.05;margin-bottom:1.5rem;max-width:18ch}
.lista-check{list-style:none;display:flex;flex-direction:column}
.lista-check li{display:grid;grid-template-columns:2rem 6.5rem 1fr;align-items:start;gap:.8em;padding:.85rem 0;
  border-bottom:1px solid var(--linea);font-size:.97rem}
.lista-check li:last-child{border-bottom:0}
.lista-check .tk{color:var(--terracota);font-size:.68rem;font-weight:700;letter-spacing:.1em}
.lista-check b{font-family:var(--fuente-titulos);font-weight:600}
.lista-check small{color:var(--tinta-suave);font-size:.9rem;line-height:1.4}

/* a quién servimos */
.lista-tipos{list-style:none;display:flex;flex-wrap:wrap;gap:.6rem;margin:1.2rem 0}
.lista-tipos li{display:inline-flex;align-items:center;gap:.55em;
  background:var(--blanco);border:1px solid var(--linea);border-radius:999px;
  padding:.5em 1em;font-family:var(--fuente-titulos);font-weight:600;font-size:.94rem}
.tipo-ico{color:var(--terracota);display:grid;place-items:center}

/* la variante invertida coloca la foto a la derecha en escritorio */
.incluye-split-inv figure{order:2}
@media (max-width:860px){
  .incluye-split-inv figure{order:0}
  .ventajas{grid-template-columns:1fr}
  .ventajas li{padding:1.5rem 0}
  .ventajas li+li{border-left:0;border-top:1px solid var(--linea);padding-left:0}
  .ventaja-num{margin-bottom:.8rem}
  .tarjeta-lista{border-left:0;border-top:1px solid var(--linea);padding:1.5rem 0 0}
  .lista-check li{grid-template-columns:2rem 1fr}
  .lista-check small{grid-column:2}
}

/* ============================================================
   EQUIPAMIENTO (página de reparación)
   ============================================================ */
.marcas-lista{margin:0 0 2.2rem}
.marcas-lista li{letter-spacing:.06em;text-transform:uppercase;font-size:.85rem;
  color:var(--tinta);padding:.5em 1.1em}

.equipos-grid{display:grid;gap:1.2rem;
  grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.equipo{background:var(--blanco);border:1px solid var(--linea);
  border-radius:var(--radio-caja);padding:1.5rem 1.4rem;
  transition:transform .25s ease, box-shadow .25s ease}
.equipo:hover{transform:translateY(-4px);box-shadow:0 22px 40px -26px rgba(14,28,43,.45)}
.equipo h3{font-size:1.08rem;letter-spacing:-.01em;margin-bottom:.5rem}
.equipo p{color:var(--tinta-suave);font-size:.96rem}
.equipo{padding:0;overflow:hidden;display:flex;flex-direction:column}
.equipo-foto{width:100%;height:190px;object-fit:cover;display:block;
  border-bottom:1px solid var(--linea)}
.equipo-foto-vacia{display:grid;place-items:center;
  background:linear-gradient(140deg,#dbe7f2,#c3d6e8);color:#8aa4bd}
.equipo-foto-vacia svg{width:52px;height:52px}
.equipo-cuerpo{padding:1.5rem 1.4rem 1.7rem}

/* ============================================================
   PÁGINA DE REPARACIÓN — hero editorial + síntomas
   ============================================================ */
.rep-hero{position:relative;min-height:min(76vh,620px);display:flex;align-items:flex-end;
  color:#fff;overflow:hidden}
.rep-hero-foto{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.rep-hero::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(14,28,43,.2) 0%,rgba(14,28,43,.58) 45%,rgba(14,28,43,.94) 100%)}
.rep-hero-cont{position:relative;z-index:2;width:100%;
  padding-bottom:clamp(2.2rem,5vw,4.2rem);padding-top:1rem}
.miga-clara,.miga-clara a{color:rgba(255,255,255,.68)}
.miga-clara a:hover{color:#fff}
.rep-kicker{display:inline-flex;align-items:center;gap:.6em;margin:1.6rem 0 1.1rem;
  font-size:.72rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:#8fc4f0}
.rep-kicker::before{content:"";width:26px;height:2px;background:#8fc4f0}
.rep-hero h1{font-size:clamp(2.3rem,6vw,5rem);color:#fff;max-width:16ch;line-height:1.03}
.rep-hero h1 em{font-style:normal;color:#8fc4f0}
.rep-hero-sub{margin-top:1.1rem;max-width:46ch;color:rgba(255,255,255,.82);font-size:1.08rem}
.rep-hero-acc{display:flex;flex-wrap:wrap;gap:.9rem;margin-top:2rem;align-items:center}
.boton-fantasma{background:transparent;border:1.5px solid rgba(255,255,255,.55);color:#fff}
.boton-fantasma:hover{background:rgba(255,255,255,.14);border-color:#fff}
.rep-dato{margin-left:auto;text-align:right;color:rgba(255,255,255,.72);
  font-size:.88rem;line-height:1.3}
.rep-dato b{display:block;font-family:var(--fuente-titulos);font-size:2rem;color:#fff;
  letter-spacing:-.03em}

.rep-lede{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);
  gap:clamp(1.6rem,5vw,4rem);align-items:start}
.rep-lede h2{font-size:clamp(1.9rem,3.6vw,3rem);max-width:14ch;margin:0}
.rep-lede p{color:var(--tinta-suave);font-size:1.08rem}
.rep-lede p + p{margin-top:.9rem}

.rep-sintomas{margin-top:3rem;border-top:1px solid var(--linea)}
.rep-sintoma{display:grid;grid-template-columns:4rem 1fr auto;gap:1.4rem;align-items:baseline;
  padding:1.7rem 0;border-bottom:1px solid var(--linea);text-decoration:none;color:inherit;
  transition:background .25s ease, padding .25s ease}
.rep-sintoma:hover{background:var(--blanco);padding-left:1.2rem;padding-right:1.2rem}
.rep-num{font-family:var(--fuente-titulos);font-size:1rem;color:var(--terracota);
  font-weight:700;letter-spacing:.06em}
.rep-sintoma-txt{display:block}
.rep-sintoma-tit{display:block;font-family:var(--fuente-titulos);font-weight:600;
  letter-spacing:-.02em;font-size:clamp(1.25rem,2.2vw,1.7rem);line-height:1.15;
  margin-bottom:.4rem;color:var(--tinta)}
.rep-sintoma-txt > span:last-child{color:var(--tinta-suave);max-width:62ch;display:block}
.rep-flecha{font-size:1.4rem;color:var(--terracota);opacity:0;transform:translateX(-8px);
  transition:opacity .25s ease, transform .25s ease}
.rep-sintoma:hover .rep-flecha,.rep-sintoma:focus-visible .rep-flecha{opacity:1;transform:translateX(0)}
.rep-nota{margin-top:1.8rem;color:var(--tinta-suave)}
.rep-nota a{color:var(--terracota);font-weight:600;text-decoration:none;white-space:nowrap}
.rep-nota a:hover{text-decoration:underline}

/* ---------- banda de marcas ---------- */
.marcas-banda{background:var(--tinta);color:#fff;border-radius:var(--radio-caja);
  padding:clamp(1.8rem,4vw,2.8rem);display:grid;gap:2rem;
  grid-template-columns:minmax(220px,.85fr) 2fr;align-items:center}
.marcas-banda h2{color:#fff;font-size:1.45rem;margin-bottom:.5rem}
.marcas-banda p{color:rgba(255,255,255,.62);font-size:.95rem}
/* rejilla 2x2: dos logos arriba y dos debajo, cada uno centrado en su celda,
   para que no quede una fila coja de tres y uno suelto */
.marcas-logos{display:grid;grid-template-columns:1fr 1fr;gap:1.8rem 2rem;
  align-items:center;justify-items:center}
.marcas-logos img{height:34px;width:auto;object-fit:contain;
  filter:brightness(0) invert(1);opacity:.8;
  transition:opacity .22s ease, filter .22s ease}
.marcas-logos img:hover{opacity:1;filter:none}
/* AstralPool: versión blanca en reposo y versión azul oficial al pasar el ratón */
.marcas-logos .marca-astral-wrap{position:relative;display:block;width:180px;height:28px}
.marcas-logos .marca-astral-wrap .marca-astral{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transition:opacity .22s ease}
.marcas-logos .marca-astral-white{filter:none;opacity:.9}
.marcas-logos .marca-astral-color{filter:none;opacity:0}
.marcas-logos .marca-astral-wrap:hover .marca-astral-white{opacity:0}
.marcas-logos .marca-astral-wrap:hover .marca-astral-color{opacity:1}

/* ============================================================
   COMPARADOR DE CUBIERTAS (manual / automática)
   Dos fotos del mismo encuadre; la de arriba se recorta con
   clip-path según el valor del range, que es el control real.
   ============================================================ */
.cub-cab{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);
  gap:clamp(1.2rem,4vw,3.5rem);align-items:end;margin-bottom:2rem}
.cub-cab h2{font-size:clamp(1.9rem,3.6vw,3rem);max-width:16ch}
.cub-cab > p{color:var(--tinta-suave);font-size:1.05rem}

.comparador{position:relative;border-radius:var(--radio-caja);overflow:hidden;
  aspect-ratio:3/2;background:var(--agua);user-select:none;touch-action:pan-y}
.comp-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.comp-capa{position:absolute;inset:0;
  clip-path:inset(0 calc(100% - var(--corte,55%)) 0 0);
  will-change:clip-path}
.comp-etiqueta{position:absolute;top:1rem;z-index:3;
  background:rgba(14,28,43,.72);color:#fff;backdrop-filter:blur(4px);
  font-size:.75rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  padding:.45em .9em;border-radius:999px;pointer-events:none}
.comp-etiqueta-a{left:1rem}
.comp-etiqueta-b{right:1rem}

.comp-barra{position:absolute;top:0;bottom:0;left:var(--corte,55%);width:3px;
  background:#fff;box-shadow:0 0 14px rgba(14,28,43,.5);z-index:4;
  transform:translateX(-50%);pointer-events:none}
.comp-tirador{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:46px;height:46px;border-radius:50%;background:#fff;color:var(--tinta);
  display:grid;place-items:center;box-shadow:0 6px 20px rgba(14,28,43,.45)}
.comp-tirador svg{width:24px;height:24px}

/* el range es el control de verdad: invisible pero accesible y arrastrable */
.comp-rango{position:absolute;inset:0;z-index:5;width:100%;height:100%;
  margin:0;opacity:0;cursor:ew-resize;-webkit-appearance:none;appearance:none;background:none}
.comp-rango::-webkit-slider-thumb{-webkit-appearance:none;width:56px;height:100%;cursor:ew-resize}
.comp-rango::-moz-range-thumb{width:56px;height:100%;border:0;cursor:ew-resize}
.comp-rango:focus-visible + .comp-barra .comp-tirador,
.comparador:focus-within .comp-tirador{outline:3px solid var(--terracota);outline-offset:3px}
.comp-rango-etq{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.comp-ayuda{margin-top:.8rem;font-size:.88rem;color:var(--tinta-suave)}

.cub-dos{display:grid;grid-template-columns:1fr 1fr;gap:1.6rem 2.4rem;margin:2.2rem 0}
.cub-dos h3{font-size:1.15rem;margin-bottom:.4rem}
.cub-dos p{color:var(--tinta-suave);font-size:.98rem}

/* ---------- foto de fondo de las tarjetas del carrusel ----------
   (la caja de .carr-item se define una sola vez, más abajo, junto al carrusel) */
.carr-foto{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  z-index:-2;transition:transform .5s ease}
.carr-item::after{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(10,22,34,.15) 0%,rgba(10,22,34,.62) 55%,rgba(10,22,34,.9) 100%);
  transition:background .25s ease}
.carr-item:hover{background:var(--tinta)}
.carr-item:hover .carr-foto{transform:scale(1.06)}
.carr-item:hover::after{background:linear-gradient(180deg,rgba(0,79,142,.2) 0%,rgba(10,22,34,.6) 55%,rgba(10,22,34,.88) 100%)}

@media (max-width:860px){
  .cub-cab{grid-template-columns:1fr;gap:1rem;align-items:start}
  .cub-dos{grid-template-columns:1fr;margin:1.8rem 0}
  .comparador{aspect-ratio:4/3}
  .comp-etiqueta{font-size:.68rem;padding:.4em .75em}
}
@media (prefers-reduced-motion: reduce){
  .comp-capa{will-change:auto}
  .carr-item:hover .carr-foto{transform:none}
}

@media (max-width:860px){
  .rep-hero{min-height:auto;padding-top:1.5rem}
  .rep-hero h1{font-size:clamp(2rem,8vw,2.8rem)}
  .rep-dato{margin-left:0;text-align:left;width:100%}
  .rep-hero-acc .boton{width:100%;justify-content:center}
  .rep-lede{grid-template-columns:1fr;gap:1.2rem}
  .rep-sintoma{grid-template-columns:2.4rem 1fr;gap:.9rem}
  .rep-flecha{display:none}
  .marcas-banda{grid-template-columns:1fr}
  .marcas-logos{gap:1.5rem 1.5rem}
}
@media (prefers-reduced-motion: reduce){
  .rep-sintoma:hover{padding-left:0;padding-right:0}
}

/* ============================================================
   TIENDA (carrusel de categorías)
   ============================================================ */
.tienda-caja{display:grid;gap:2.2rem;grid-template-columns:minmax(260px,.85fr) 1.6fr;
  align-items:center;background:var(--tinta);border-radius:var(--radio-caja);
  padding:clamp(1.6rem,3.5vw,2.8rem);overflow:hidden}
.tienda-texto h2{color:#fff;margin-bottom:.6rem}
.tienda-texto p{color:rgba(255,255,255,.68);margin-bottom:1.4rem}
.tienda-texto strong{color:#fff}
.tienda-texto .svc-eyebrow{color:rgba(255,255,255,.5)}

.tienda-carrusel{min-width:0}
.carr-pista{display:flex;gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;
  scroll-behavior:smooth;padding-bottom:.4rem;
  scrollbar-width:none;-ms-overflow-style:none}
.carr-pista::-webkit-scrollbar{display:none}
.carr-pista:focus-visible{outline:2px solid #fff;outline-offset:4px;border-radius:8px}

/* la tarjeta lleva foto de fondo: el texto se apoya abajo sobre el degradado.
   Definición única — antes había otra más arriba que esta pisaba. */
.carr-item{flex:0 0 190px;scroll-snap-align:start;text-decoration:none;
  position:relative;isolation:isolate;min-height:190px;overflow:hidden;
  background:var(--tinta);border:1px solid rgba(255,255,255,.18);
  border-radius:var(--radio-caja);padding:1.2rem 1.1rem;
  display:flex;flex-direction:column;justify-content:flex-end;gap:.4rem;
  transition:border-color .22s ease, transform .22s ease}
.carr-item:hover{border-color:rgba(255,255,255,.42);transform:translateY(-3px)}
.carr-item h3{font-size:1rem;color:#fff;letter-spacing:-.01em;
  text-shadow:0 1px 12px rgba(10,22,34,.5)}
.carr-mas{font-size:.82rem;color:rgba(255,255,255,.55);margin-top:auto;
  transition:color .22s ease}
.carr-item:hover .carr-mas{color:#fff}

.carr-mandos{display:flex;align-items:center;gap:.8rem;margin-top:1.2rem}
.carr-flecha{background:transparent;border:1px solid rgba(255,255,255,.28);color:#fff;
  width:36px;height:36px;border-radius:50%;display:grid;place-items:center;cursor:pointer;
  transition:background .2s ease, border-color .2s ease, opacity .2s ease}
.carr-flecha svg{width:16px;height:16px}
.carr-flecha:hover{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.5)}
.carr-flecha:disabled{opacity:.3;cursor:default}
.carr-puntos{display:flex;gap:.4rem;margin-left:auto}
.carr-punto{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.26);
  transition:background .2s ease, width .2s ease}
.carr-punto.activo{background:#fff;width:20px;border-radius:999px}

@media (max-width:860px){
  .tienda-caja{grid-template-columns:1fr;gap:1.6rem}
  .carr-item{flex-basis:172px}
  .tienda-texto .boton{width:100%;justify-content:center}
}
@media (prefers-reduced-motion: reduce){
  .carr-pista{scroll-behavior:auto}
  .carr-item:hover{transform:none}
}

/* ============================================================
   PRESUPUESTO EXPRÉS (página de construcción)
   Chips en vez de desplegables: un toque por respuesta.
   ============================================================ */
.pres-cont{max-width:820px}
.pres-form{background:var(--blanco);border:1px solid var(--linea);
  border-radius:var(--radio-caja);padding:clamp(1.4rem,3vw,2.2rem);
  display:flex;flex-direction:column;gap:1.6rem}

.pres-bloque{border:0}
.pres-bloque[hidden]{display:none}
.pres-bloque legend{font-family:var(--fuente-titulos);font-weight:600;
  font-size:1rem;margin-bottom:.75rem;color:var(--tinta)}

.chips{display:flex;flex-wrap:wrap;gap:.55rem}
.chip{position:relative;display:inline-flex}
.chip input{position:absolute;inset:0;opacity:0;cursor:pointer;margin:0}
.chip span{display:inline-flex;align-items:center;border:1px solid var(--linea);
  border-radius:999px;padding:.6em 1.15em;font-size:.95rem;font-weight:500;
  color:var(--tinta-suave);background:var(--papel);cursor:pointer;
  transition:border-color .2s ease, color .2s ease, background .2s ease}
.chip input:hover + span{border-color:var(--terracota)}
.chip input:focus-visible + span{outline:2px solid var(--terracota);outline-offset:2px}
.chip input:checked + span{background:var(--terracota);border-color:var(--terracota);
  color:#fff;font-weight:600}

.pres-datos{display:grid;gap:1rem;grid-template-columns:1fr 1fr}
.pres-datos .campo:last-child{grid-column:1 / -1}
.campo select,.campo textarea{
  border:1px solid var(--linea);border-radius:var(--radio-input);
  padding:.75em .9em;font:inherit;color:var(--tinta);background:var(--papel);width:100%}
.campo select:focus,.campo textarea:focus{outline:2px solid var(--terracota);
  outline-offset:1px;border-color:var(--terracota)}
.campo textarea{resize:vertical}

.pres-extras{border-top:1px solid var(--linea);padding-top:1.2rem}
.pres-extras summary{cursor:pointer;font-weight:600;color:var(--terracota);
  font-size:.95rem;list-style:none}
.pres-extras summary::-webkit-details-marker{display:none}
.pres-extras summary::before{content:"+ ";font-weight:700}
.pres-extras[open] summary::before{content:"– "}
.pres-extras-cuerpo{display:flex;flex-direction:column;gap:1.1rem;margin-top:1.2rem}
.pres-extras-tit{font-size:.9rem;font-weight:600;color:var(--tinta)}

.pres-rgpd{display:flex;gap:.65rem;align-items:flex-start;
  font-size:.9rem;color:var(--tinta-suave);line-height:1.5}
.pres-rgpd input{margin-top:.2rem;accent-color:var(--terracota);flex:none}

.pres-acciones{display:flex;flex-wrap:wrap;gap:.8rem;align-items:center}
.pres-aviso:empty{display:none}
.pres-aviso{font-size:.92rem;color:var(--terracota);font-weight:500}

.pres-progreso{display:grid;gap:.65rem;color:var(--tinta-suave);font-size:.78rem;
  font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.pres-progreso-via{height:3px;background:var(--agua);border-radius:999px;overflow:hidden}
.pres-progreso-via i{display:block;width:25%;height:100%;background:var(--terracota);
  transition:width .35s cubic-bezier(.16,1,.3,1)}
.pres-paso{display:flex;flex-direction:column;gap:1.6rem}
.pres-paso[hidden]{display:none}
.pres-bloque legend small{font-family:var(--fuente-texto);font-weight:400;color:var(--tinta-suave)}
.pres-ayuda{max-width:none;border-left:2px solid var(--terracota);padding-left:.85rem;
  color:var(--tinta-suave);font-size:.9rem}
.pres-nav{display:flex;align-items:center;justify-content:space-between;gap:.8rem;
  border-top:1px solid var(--linea);padding-top:1.4rem}
.pres-nav-final{align-items:flex-start}

@media (max-width:860px){
  .pres-datos{grid-template-columns:1fr}
  .pres-acciones .boton{width:100%;justify-content:center}
  .pres-nav{align-items:stretch;flex-direction:column-reverse}
  .pres-nav>span:empty{display:none}
  .pres-nav .boton{width:100%;justify-content:center}
  .pres-nav-final .pres-acciones{display:flex;flex-direction:column;width:100%}
}

/* ============================================================
   HOME — RECORRIDO EDITORIAL
   El contenido continúa el gesto de la portada: superficie limpia,
   profundidad y movimiento solo cuando ayuda a descubrir algo.
   ============================================================ */
.seccion-num{
  max-width:none;margin:0 0 1.15rem;color:var(--terracota);
  font-size:.7rem;font-weight:700;letter-spacing:.19em;text-transform:uppercase;
}
.seccion-num-claro{color:color-mix(in oklab,var(--terracota) 58%,#fff)}
.servicios-cab,.planes-cab{
  display:grid;grid-template-columns:minmax(150px,.45fr) minmax(0,1.45fr) minmax(260px,.8fr);
  gap:clamp(1.4rem,4vw,4.5rem);align-items:end;margin-bottom:clamp(2rem,5vw,4rem);
}
.servicios-cab .seccion-num{align-self:start;margin-top:.55rem}
.servicios-cab h2,.planes-cab h2{
  max-width:none;margin:0;font-size:clamp(2.15rem,4.5vw,4.35rem);line-height:.98;
  letter-spacing:-.055em;
}
.servicios-cab h2 em,.planes-cab h2 em,.como-texto h2 em{
  font-style:normal;color:var(--terracota);
}
.servicios-cab>p:last-child,.planes-cab>p:last-child{
  color:var(--tinta-suave);font-size:1.02rem;line-height:1.65;
}

#servicios{overflow:hidden}
#servicios .servicios-bento{
  display:flex;flex-direction:column;gap:0;background:var(--blanco);
  border:1px solid var(--linea);border-radius:var(--radio-caja);overflow:hidden;
}
#servicios .servicio{
  position:relative;border:0;border-radius:0;min-height:360px;
  display:grid;grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);
  background:var(--blanco);color:var(--tinta);box-shadow:none;
}
#servicios .servicio:hover{transform:none;box-shadow:none}
#servicios .servicio img{
  position:relative;inset:auto;z-index:auto;width:100%;height:100%;max-height:none;min-height:360px;
  object-fit:cover;filter:saturate(.88);transition:filter .45s ease;
}
#servicios .servicio:hover img{filter:saturate(1)}
#servicios .servicio+.servicio{border-top:1px solid var(--linea)}
#servicios .servicio:nth-child(even) img{order:2}
#servicios .servicio-grande{grid-row:auto;min-height:360px}
#servicios .servicio-cuerpo{
  position:relative;z-index:1;padding:clamp(2rem,4.5vw,4.5rem);
  display:flex;flex-direction:column;align-items:flex-start;justify-content:center;
}
#servicios .servicio-cuerpo h3{
  color:var(--tinta);font-size:clamp(1.8rem,3.3vw,3.25rem);line-height:1;
  letter-spacing:-.05em;margin:.65rem 0 .85rem;
}
#servicios .servicio-cuerpo p{color:var(--tinta-suave);max-width:42ch;font-size:1.03rem}
#servicios .enlace-servicio{color:var(--tinta);border-color:var(--linea);margin-top:1.5rem}
/* El texto va en blanco al pasar el ratón porque el ::before rellena la caja de
   azul; con color:var(--terracota) quedaba azul sobre azul y desaparecía. */
#servicios .enlace-servicio:hover{color:var(--blanco);border-color:var(--terracota)}
.servicio-tipo{
  color:var(--terracota);font-size:.7rem;font-weight:700;letter-spacing:.17em;
  text-transform:uppercase;
}
.servicio-num{
  position:absolute;z-index:2;top:1.35rem;left:1.5rem;color:var(--blanco);
  font-family:var(--fuente-titulos);font-size:.75rem;font-weight:600;letter-spacing:.15em;
  background:rgba(20,51,59,.82);backdrop-filter:blur(8px);
  border-radius:999px;padding:.48rem .7rem;
}

#planes{background:var(--agua)}
.planes-cab{grid-template-columns:minmax(0,1.5fr) minmax(260px,.65fr);align-items:end}
.planes-cab>div .seccion-num{margin-bottom:1.15rem}
#planes .planes-grid{position:relative;gap:0;align-items:stretch}
#planes .plan,#planes .plan-marco{border-radius:0}
#planes .plan{
  padding:clamp(1.6rem,3vw,2.6rem);box-shadow:none;border-color:var(--linea);
}
#planes .planes-grid>.plan{border-radius:var(--radio-caja) 0 0 var(--radio-caja)}
#planes .plan-marco{
  background:none;border:0;border-radius:0 var(--radio-caja) var(--radio-caja) 0;
}
#planes .plan-marco>.plan{
  border-radius:0 var(--radio-caja) var(--radio-caja) 0;transform:none;
}
#planes .plan-marco:hover{animation:none;box-shadow:none}
#planes .plan-marco:hover>.plan{transform:none}
#planes .plan-nombre{
  font-size:clamp(1.7rem,3vw,2.5rem);letter-spacing:-.04em;
}
#planes .plan-flag{top:1.5rem}
#planes .planes-pie{max-width:none}

.como-texto h2{
  font-size:clamp(2.2rem,4.7vw,4.6rem);line-height:.95;letter-spacing:-.055em;
  margin-bottom:2.2rem;
}
.como-foto{position:relative}
.como-foto::before{
  content:"";position:absolute;z-index:1;inset:1.2rem -1.2rem -1.2rem 1.2rem;
  border:1px solid rgba(255,255,255,.2);border-radius:var(--radio-caja);pointer-events:none;
}
.como-foto img{position:relative;z-index:2;aspect-ratio:4/3;object-fit:cover}
.como-foto figcaption{position:relative;z-index:2}

#opiniones{overflow:hidden}
#opiniones .opiniones-cab{margin-bottom:2.2rem}
#opiniones .opiniones-cab h2{
  font-size:clamp(2.2rem,5vw,4.7rem);line-height:1;letter-spacing:-.055em;
}
#opiniones .cinta{
  overflow-x:auto;overscroll-behavior-inline:contain;scroll-snap-type:x mandatory;
  scrollbar-width:thin;scrollbar-color:var(--terracota) var(--agua);
  -webkit-mask-image:none;mask-image:none;padding:0 0 1.2rem;
}
#opiniones .cinta-pista{width:max-content;animation:none;gap:1rem}
#opiniones .resena{
  scroll-snap-align:start;flex-basis:clamp(310px,38vw,520px);border-radius:var(--radio-caja);
  padding:2.4rem clamp(1.5rem,3vw,2.5rem) 1.7rem;box-shadow:none;
}
#opiniones .resena:nth-child(even){background:var(--agua)}
#opiniones .resena-texto{
  font-size:clamp(1.07rem,1.55vw,1.3rem);line-height:1.55;-webkit-line-clamp:9;
}

.faq-cont{max-width:1120px;display:grid;grid-template-columns:minmax(230px,.68fr) minmax(0,1.32fr);
  gap:clamp(2rem,6vw,6rem);align-items:start}
.faq-cab{position:sticky;top:7rem}
.faq-cab h2{font-size:clamp(2rem,3.7vw,3.4rem);line-height:1;letter-spacing:-.045em}
.faq-cab>p:last-child{margin-top:1rem;color:var(--tinta-suave)}
.faq-item{background:transparent;border-width:0 0 1px;border-radius:0}
.faq-item summary{padding:1.35rem .15rem;font-size:clamp(1.02rem,1.6vw,1.18rem)}
.faq-cuerpo{padding:0 2.8rem 1.4rem .15rem}

@media (max-width:860px){
  .servicios-cab,.planes-cab{grid-template-columns:1fr;gap:1rem;align-items:start}
  .servicios-cab .seccion-num{margin-top:0}
  .servicios-cab h2,.planes-cab h2{font-size:clamp(2rem,10vw,3.1rem)}
  #servicios .servicios-bento{display:flex;overflow:visible;background:var(--blanco);
    border:1px solid var(--linea);border-radius:var(--radio-caja);margin-right:0;padding-right:0;gap:0}
  #servicios .servicio,#servicios .servicio-grande{
    display:flex;flex-direction:column;min-height:0;border-radius:0}
  #servicios .servicio img,#servicios .servicio-grande img,
  #servicios .servicio:not(.servicio-grande) img{
    order:0;width:100%;height:230px;min-height:230px;max-height:230px}
  #servicios .servicio-cuerpo{order:1;padding:1.65rem}
  #servicios .servicio-cuerpo h3{font-size:clamp(1.75rem,8vw,2.4rem)}
  #planes .planes-grid{grid-template-columns:1fr;gap:.8rem}
  #planes .planes-grid>.plan,#planes .plan-marco,#planes .plan-marco>.plan{
    border-radius:var(--radio-caja)}
  .como-foto::before{inset:.75rem -.55rem -.75rem .55rem}
  .opiniones-escritorio{display:none}
  #opiniones .resena{flex-basis:min(86vw,390px)}
  .faq-cont{grid-template-columns:1fr;gap:1.3rem}
  .faq-cab{position:static}
}

@media (prefers-reduced-motion:reduce){
  #servicios .servicio:hover img{transform:none}
}

/* ============================================================
   REPARACIÓN — APERTURA Y CIERRE 2026-07-26
   Diagnóstico técnico: el primer pantallazo ayuda a reconocer
   el problema y el cierre reúne acción, dudas y siguientes pasos.
   ============================================================ */
.rep-page .cabecera-rep{
  position:absolute;inset:0 0 auto;z-index:40;background:transparent;
  border-bottom:1px solid rgba(255,255,255,.18);backdrop-filter:none;
}
.rep-page .cabecera-rep .nav-principal>a:not(.boton),
.rep-page .cabecera-rep .menu-btn{color:rgba(255,255,255,.86)}
.rep-page .cabecera-rep .nav-principal>a:not(.boton):hover,
.rep-page .cabecera-rep .menu-btn:hover{color:var(--blanco)}
.rep-page .cabecera-rep .nav-burger span{background:var(--blanco)}
.rep-page .cabecera-rep .nav-cta{
  background:transparent;color:var(--blanco);box-shadow:inset 0 0 0 1px rgba(255,255,255,.55);
}
.rep-page .cabecera-rep .nav-cta:hover{background:var(--blanco);color:var(--tinta)}

.rep-page .rep-hero{
  min-height:min(880px,100svh);align-items:stretch;background:var(--tinta);
}
.rep-page .rep-hero-foto{object-position:center 48%;filter:saturate(.72) contrast(1.04)}
.rep-page .rep-hero::after{
  background:
    linear-gradient(90deg,rgba(10,28,34,.96) 0%,rgba(10,28,34,.78) 48%,rgba(10,28,34,.3) 100%),
    linear-gradient(0deg,rgba(10,28,34,.96) 0%,transparent 42%);
}
.rep-page .rep-hero-cont{
  display:flex;flex-direction:column;padding-top:calc(68px + clamp(1.4rem,4vh,3.4rem));
  padding-bottom:0;
}
.rep-hero-grid{
  display:grid;grid-template-columns:minmax(0,1.25fr) minmax(290px,.62fr);
  gap:clamp(2rem,7vw,7rem);align-items:end;flex:1;padding:clamp(1.8rem,5vh,4rem) 0 2.5rem;
}
.rep-hero-copy{align-self:center}
.rep-page .rep-kicker{color:rgba(255,255,255,.62);margin:0 0 1.15rem}
.rep-page .rep-kicker::before{background:var(--terracota)}
.rep-page .rep-hero h1{
  max-width:13ch;font-size:clamp(3rem,6.2vw,6.1rem);line-height:.91;letter-spacing:-.058em;
}
.rep-page .rep-hero h1 em{color:var(--blanco);font-style:normal;position:relative}
.rep-page .rep-hero h1 em::after{
  content:"";position:absolute;left:0;right:0;bottom:.03em;height:.08em;background:var(--terracota);
}
.rep-page .rep-hero-sub{max-width:52ch;font-size:clamp(1rem,1.35vw,1.18rem);line-height:1.65}
.rep-page .rep-hero-acc{align-items:center}
.rep-hero-link{
  color:var(--blanco);text-decoration:none;font-weight:600;border-bottom:1px solid rgba(255,255,255,.38);
  padding:.35rem 0;display:inline-flex;gap:.7rem;align-items:center;
}
.rep-hero-link span{color:var(--terracota)}
.rep-diagnostico{
  align-self:end;color:var(--blanco);border-top:1px solid rgba(255,255,255,.5);
  border-bottom:1px solid rgba(255,255,255,.18);backdrop-filter:blur(7px);
  background:rgba(20,51,59,.32);
}
.rep-diagnostico-tit{
  max-width:none;padding:1rem 1.1rem .8rem;color:rgba(255,255,255,.56);
  font-size:.7rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
}
.rep-diagnostico a{
  display:grid;grid-template-columns:2rem 1fr auto;gap:.8rem;align-items:center;
  padding:1rem 1.1rem;color:var(--blanco);text-decoration:none;
  border-top:1px solid rgba(255,255,255,.12);font-family:var(--fuente-titulos);font-weight:600;
  transition:background .2s ease,padding .2s ease;
}
.rep-diagnostico a span{color:rgba(255,255,255,.45);font-size:.72rem;letter-spacing:.12em}
.rep-diagnostico a b{color:var(--terracota);font-size:1.1rem}
.rep-diagnostico a:hover{background:rgba(255,255,255,.1);padding-left:1.35rem}
.rep-diagnostico-pie{max-width:none;padding:1rem 1.1rem;color:rgba(255,255,255,.58);font-size:.83rem}
.rep-diagnostico-pie strong{color:var(--blanco)}
.rep-hero-prueba{
  display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid rgba(255,255,255,.2);
  min-height:86px;
}
.rep-hero-prueba p{
  max-width:none;display:flex;align-items:center;gap:.8rem;padding:1rem clamp(.7rem,2vw,1.6rem);
  color:rgba(255,255,255,.6);
}
.rep-hero-prueba p:first-child{padding-left:0}
.rep-hero-prueba p+p{border-left:1px solid rgba(255,255,255,.16)}
.rep-hero-prueba strong{
  color:var(--blanco);font-family:var(--fuente-titulos);font-size:1.35rem;white-space:nowrap;
}
.rep-hero-prueba span{font-size:.82rem;line-height:1.25}

.rep-page .equipos-grid{
  grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--linea);
  border:1px solid var(--linea);border-radius:var(--radio-caja);overflow:hidden;margin-top:2.5rem;
}
.rep-page .equipo{
  display:grid;grid-template-columns:minmax(170px,.78fr) minmax(0,1fr);
  min-height:315px;border:0;border-radius:0;box-shadow:none;
}
.rep-page .equipo:hover{transform:none;box-shadow:none}
.rep-page .equipo-foto{
  width:100%;height:100%;min-height:315px;border:0;transition:transform .5s ease,filter .4s ease;
  filter:saturate(.82);
}
.rep-page .equipo:hover .equipo-foto{transform:scale(1.025);filter:saturate(1)}
.rep-page .equipo-cuerpo{
  position:relative;z-index:1;background:var(--blanco);padding:clamp(1.35rem,2.5vw,2rem);
  display:flex;flex-direction:column;justify-content:center;
}
.rep-page .equipo h3{font-size:clamp(1.2rem,1.75vw,1.55rem);letter-spacing:-.025em}
.rep-page .equipo p{line-height:1.58}

.rep-cierre{background:var(--tinta);color:var(--blanco);padding-bottom:0}
.rep-cierre h2,.rep-cierre h3{color:var(--blanco)}
.rep-cierre-cta{
  display:grid;grid-template-columns:minmax(0,1.25fr) auto;gap:clamp(2rem,6vw,6rem);
  align-items:end;padding-bottom:clamp(3rem,7vw,6rem);border-bottom:1px solid rgba(255,255,255,.16);
}
.rep-cierre-cta h2{
  font-size:clamp(2.7rem,6.5vw,6.2rem);line-height:.88;letter-spacing:-.06em;margin-bottom:1.2rem;
}
.rep-cierre-cta>div>p:last-child{color:rgba(255,255,255,.65);max-width:55ch;font-size:1.05rem}
.rep-cierre-cta>.boton{white-space:nowrap;margin-bottom:.15rem}
.rep-cierre-faq{
  display:grid;grid-template-columns:minmax(240px,.7fr) minmax(0,1.3fr);
  gap:clamp(2rem,7vw,7rem);padding:clamp(3rem,7vw,6rem) 0;
  border-bottom:1px solid rgba(255,255,255,.16);
}
.rep-cierre-cab h2{
  max-width:10ch;font-size:clamp(2rem,4.2vw,4rem);line-height:.98;letter-spacing:-.05em;
}
.rep-cierre .faq-item{border-color:rgba(255,255,255,.16)}
.rep-cierre .faq-item summary{color:var(--blanco)}
.rep-cierre .faq-item summary::after{color:var(--terracota)}
.rep-cierre .faq-cuerpo p{color:rgba(255,255,255,.64)}
.rep-cierre .faq-cuerpo a{color:var(--blanco)}
.rep-otros{padding:2.2rem 0 2.8rem}
.rep-otros>p{
  max-width:none;color:rgba(255,255,255,.48);font-size:.7rem;font-weight:700;
  letter-spacing:.17em;text-transform:uppercase;margin-bottom:1rem;
}
.rep-otros .otros-grid{margin:0;gap:1px;background:rgba(255,255,255,.15)}
.rep-otros .otro-svc{
  border:0;border-radius:0;background:var(--tinta);color:var(--blanco);
  display:grid;grid-template-columns:2.5rem 1fr auto;gap:1rem;align-items:center;padding:1.5rem;
}
.rep-otros .otro-svc:hover{transform:none;background:var(--tinta);box-shadow:inset 0 -3px 0 var(--terracota)}
.rep-otros .otro-svc h3,.rep-otros .otro-svc b{transition:transform .22s ease,color .22s ease}
.rep-otros .otro-svc:hover h3,.rep-otros .otro-svc:hover b{transform:translateX(5px)}
.rep-otros .otro-svc>span{color:rgba(255,255,255,.4);font-size:.72rem;letter-spacing:.12em}
.rep-otros .otro-svc h3{margin:0;font-size:1.05rem}
.rep-otros .otro-svc b{color:var(--terracota);font-size:.84rem;white-space:nowrap}

@media (max-width:1050px){
  .rep-page .equipo{grid-template-columns:1fr}
  .rep-page .equipo-foto{height:220px;min-height:220px}
}
@media (max-width:860px){
  .rep-page .cabecera-rep{position:absolute}
  .rep-page .rep-hero{min-height:auto;padding-top:0}
  .rep-page .rep-hero::after{
    background:linear-gradient(0deg,rgba(10,28,34,.98) 8%,rgba(10,28,34,.72) 72%,rgba(10,28,34,.42));
  }
  .rep-page .rep-hero-cont{padding-top:calc(68px + 1.2rem)}
  .rep-hero-grid{grid-template-columns:1fr;padding:2rem 0 1.7rem;gap:2rem}
  .rep-page .rep-hero h1{font-size:clamp(2.7rem,13vw,4.3rem);line-height:.92}
  .rep-page .rep-hero-acc .boton{width:100%;justify-content:center}
  .rep-hero-link{width:100%;justify-content:center}
  .rep-diagnostico{display:none}
  .rep-hero-prueba{grid-template-columns:1fr 1fr;min-height:0}
  .rep-hero-prueba p{padding:.85rem .7rem}
  .rep-hero-prueba p:first-child{padding-left:0}
  .rep-hero-prueba p:nth-child(3){display:none}
  .rep-page .equipos-grid{grid-template-columns:1fr;margin-top:1.8rem}
  .rep-page .equipo{grid-template-columns:140px 1fr;min-height:245px}
  .rep-page .equipo-foto{height:100%;min-height:245px}
  .rep-page .equipo-cuerpo{padding:1.25rem}
  .rep-page .equipo p{font-size:.9rem}
  .rep-cierre-cta,.rep-cierre-faq{grid-template-columns:1fr;gap:1.5rem}
  .rep-cierre-cta>.boton{width:100%;justify-content:center}
  .rep-cierre-cab h2{max-width:12ch}
  .rep-otros .otros-grid{grid-template-columns:1fr}
  .rep-otros .otro-svc{grid-template-columns:2rem 1fr}
  .rep-otros .otro-svc b{grid-column:2;white-space:normal}
}
@media (max-width:520px){
  .rep-page .equipo{grid-template-columns:1fr}
  .rep-page .equipo-foto{height:210px;min-height:210px}
}
@media (prefers-reduced-motion:reduce){
  .rep-page .equipo:hover .equipo-foto{transform:none}
  .rep-diagnostico a:hover{padding-left:1.1rem}
}

/* ============================================================
   MANTENIMIENTO — SIEMPRE LISTA
   Misma familia editorial que reparación, con un ritmo más calmado:
   recurrencia, agua equilibrada y tranquilidad para el propietario.
   ============================================================ */
.mant-page .cabecera-mant{
  position:absolute;inset:0 0 auto;z-index:40;background:transparent;
  border-bottom:1px solid rgba(255,255,255,.2);backdrop-filter:none;
}
.mant-page .cabecera-mant .nav-principal>a:not(.boton),
.mant-page .cabecera-mant .menu-btn{color:rgba(255,255,255,.88)}
.mant-page .cabecera-mant .nav-principal>a:not(.boton):hover,
.mant-page .cabecera-mant .menu-btn:hover{color:var(--blanco)}
.mant-page .cabecera-mant .nav-burger span{background:var(--blanco)}
.mant-page .cabecera-mant .nav-cta{
  background:transparent;color:var(--blanco);box-shadow:inset 0 0 0 1px rgba(255,255,255,.55);
}
.mant-page .cabecera-mant .nav-cta:hover{background:var(--blanco);color:var(--tinta)}

.mant-hero{
  position:relative;min-height:min(860px,100svh);display:flex;color:var(--blanco);
  background:var(--tinta);overflow:hidden;
}
.mant-hero-foto{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 48%;
  filter:saturate(.8) contrast(1.02);
}
.mant-hero::after{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(90deg,rgba(10,28,34,.92) 0%,rgba(10,28,34,.62) 48%,rgba(10,28,34,.14) 100%),
    linear-gradient(0deg,rgba(10,28,34,.92) 0%,transparent 48%);
}
.mant-hero-cont{
  position:relative;z-index:2;display:flex;flex-direction:column;width:100%;
  padding-top:calc(68px + clamp(1.4rem,4vh,3.4rem));
}
.mant-hero-copy{margin:auto 0;padding:clamp(2rem,6vh,5rem) 0;max-width:790px}
.mant-kicker{
  max-width:none;display:flex;align-items:center;gap:.7rem;margin-bottom:1rem;
  color:rgba(255,255,255,.64);font-size:.72rem;font-weight:700;
  letter-spacing:.19em;text-transform:uppercase;
}
.mant-kicker::before{content:"";width:26px;height:2px;background:var(--terracota)}
.mant-hero h1{
  color:var(--blanco);font-size:clamp(3.1rem,7vw,6.7rem);line-height:.9;
  letter-spacing:-.06em;max-width:11ch;
}
.mant-hero h1 em{font-style:normal;color:var(--blanco);position:relative}
.mant-hero h1 em::after{
  content:"";position:absolute;left:0;right:0;bottom:.02em;height:.075em;background:var(--terracota);
}
.mant-hero-copy>p:not(.mant-kicker){
  margin-top:1.35rem;max-width:50ch;color:rgba(255,255,255,.78);
  font-size:clamp(1rem,1.4vw,1.2rem);line-height:1.65;
}
.mant-hero .hero-acciones{margin-top:2rem}
.mant-hero-link{
  display:inline-flex;gap:.7rem;align-items:center;color:var(--blanco);font-weight:600;
  text-decoration:none;border-bottom:1px solid rgba(255,255,255,.4);padding:.35rem 0;
}
.mant-hero-link span{color:var(--terracota)}
.mant-hero-prueba{
  display:grid;grid-template-columns:repeat(3,1fr);min-height:88px;
  border-top:1px solid rgba(255,255,255,.22);
}
.mant-hero-prueba p{
  max-width:none;display:flex;gap:.8rem;align-items:center;
  padding:1rem clamp(.8rem,2vw,1.7rem);color:rgba(255,255,255,.6);
}
.mant-hero-prueba p:first-child{padding-left:0}
.mant-hero-prueba p+p{border-left:1px solid rgba(255,255,255,.17)}
.mant-hero-prueba strong{
  color:var(--blanco);font-family:var(--fuente-titulos);font-size:1.3rem;white-space:nowrap;
}
.mant-hero-prueba span{font-size:.82rem;line-height:1.25}

.mant-page #privadas .incluye-split{align-items:center}
.mant-page #privadas h2,.mant-page #comunidades h2,.mant-page #paquetes> .contenedor>h2{
  font-size:clamp(2rem,4vw,3.8rem);letter-spacing:-.05em;line-height:1;
}
.mant-page #privadas .tarjeta-lista{box-shadow:none}
.mant-page #comunidades figure img{aspect-ratio:4/3;object-fit:cover}
.mant-page #paquetes{background:var(--papel)}
.mant-page #paquetes .planes-grid{align-items:stretch}
.mant-page #paquetes .plan{height:100%}

.mant-cierre{background:var(--tinta);color:var(--blanco);padding-bottom:0}
.mant-cierre h2,.mant-cierre h3{color:var(--blanco)}
.mant-cierre-cta{
  display:grid;grid-template-columns:minmax(0,1.3fr) auto;gap:clamp(2rem,6vw,6rem);
  align-items:end;padding-bottom:clamp(3rem,7vw,6rem);border-bottom:1px solid rgba(255,255,255,.16);
}
.mant-cierre-cta h2{
  max-width:13ch;font-size:clamp(2.6rem,5.8vw,5.7rem);line-height:.91;
  letter-spacing:-.058em;margin-bottom:1.2rem;
}
.mant-cierre-cta>div>p:last-child{color:rgba(255,255,255,.65);max-width:55ch}
.mant-cierre-cta>.boton{white-space:nowrap}
.mant-cierre-faq{
  display:grid;grid-template-columns:minmax(250px,.7fr) minmax(0,1.3fr);
  gap:clamp(2rem,7vw,7rem);padding:clamp(3rem,7vw,6rem) 0;
  border-bottom:1px solid rgba(255,255,255,.16);
}
.mant-cierre-faq>div:first-child h2{
  max-width:11ch;font-size:clamp(2rem,4vw,3.8rem);line-height:.98;letter-spacing:-.05em;
}
.mant-cierre .faq-item{border-color:rgba(255,255,255,.16)}
.mant-cierre .faq-item summary{color:var(--blanco)}
.mant-cierre .faq-item summary::after{color:var(--terracota)}
.mant-cierre .faq-cuerpo p{color:rgba(255,255,255,.64)}
.mant-otros{padding-top:2.2rem}

@media (max-width:860px){
  .mant-page .cabecera-mant{position:absolute}
  .mant-hero{min-height:auto}
  .mant-hero::after{
    background:linear-gradient(0deg,rgba(10,28,34,.97) 5%,rgba(10,28,34,.7) 74%,rgba(10,28,34,.4));
  }
  .mant-hero-cont{padding-top:calc(68px + 1.2rem)}
  .mant-hero-copy{padding:2.3rem 0}
  .mant-hero h1{font-size:clamp(2.8rem,13.2vw,4.4rem);line-height:.92}
  .mant-hero .hero-acciones{flex-direction:column;align-items:stretch;gap:1rem}
  .mant-hero .hero-acciones .boton{width:100%;justify-content:center}
  .mant-hero-link{justify-content:center}
  .mant-hero-prueba{grid-template-columns:1fr 1fr}
  .mant-hero-prueba p{padding:.85rem .65rem}
  .mant-hero-prueba p:first-child{padding-left:0}
  .mant-hero-prueba p:nth-child(3){display:none}
  .mant-cierre-cta,.mant-cierre-faq{grid-template-columns:1fr;gap:1.5rem}
  .mant-cierre-cta>.boton{width:100%;justify-content:center;white-space:normal;text-align:center}
}

/* Fichas de equipamiento: cuatro objetos independientes, menos catálogo y
   más lectura rápida. */
.rep-page .equipos-grid{
  gap:1.15rem;background:transparent;border:0;border-radius:0;
}
.rep-page .equipo{
  display:grid;grid-template-columns:1fr;min-height:0;border:1px solid var(--linea);
  border-radius:var(--radio-caja);overflow:hidden;background:var(--blanco);
}
.rep-page .equipo-foto{height:245px;min-height:245px}
.rep-page .equipo-cuerpo{
  min-height:205px;justify-content:flex-start;padding:1.7rem 1.8rem 1.9rem;
  border-top:1px solid var(--linea);
}
.rep-page .equipo-cuerpo::before{
  content:"";display:block;width:2.2rem;height:2px;background:var(--terracota);margin-bottom:1.1rem;
}
.rep-page .equipo h3{font-size:clamp(1.35rem,2vw,1.75rem);line-height:1.05;margin-bottom:.7rem}
.rep-page .equipo p{font-size:1rem;line-height:1.55;max-width:38ch}

/* ============================================================
   CONSTRUCCIÓN — DE LA IDEA AL PRIMER BAÑO
   ============================================================ */
.obra-page .cabecera-obra{
  position:absolute;inset:0 0 auto;z-index:40;background:transparent;
  border-bottom:1px solid rgba(255,255,255,.2);backdrop-filter:none;
}
.obra-page .cabecera-obra .nav-principal>a:not(.boton),
.obra-page .cabecera-obra .menu-btn{color:rgba(255,255,255,.88)}
.obra-page .cabecera-obra .nav-principal>a:not(.boton):hover,
.obra-page .cabecera-obra .menu-btn:hover{color:var(--blanco)}
.obra-page .cabecera-obra .nav-burger span{background:var(--blanco)}
.obra-page .cabecera-obra .nav-cta{
  background:transparent;color:var(--blanco);box-shadow:inset 0 0 0 1px rgba(255,255,255,.55);
}
.obra-page .cabecera-obra .nav-cta:hover{background:var(--blanco);color:var(--tinta)}
.obra-hero{
  position:relative;min-height:min(850px,100svh);display:flex;color:var(--blanco);
  background:var(--tinta);overflow:hidden;
}
.obra-hero-foto{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.74)}
.obra-hero::after{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(90deg,rgba(10,28,34,.94) 0%,rgba(10,28,34,.66) 52%,rgba(10,28,34,.18) 100%),
    linear-gradient(0deg,rgba(10,28,34,.92) 0%,transparent 46%);
}
.obra-hero-cont{
  position:relative;z-index:2;width:100%;display:flex;flex-direction:column;
  padding-top:calc(68px + clamp(1.4rem,4vh,3.4rem));
}
.obra-hero-copy{margin:auto 0;padding:clamp(2rem,6vh,5rem) 0;max-width:900px}
.obra-kicker{
  max-width:none;display:flex;align-items:center;gap:.7rem;margin-bottom:1rem;
  color:rgba(255,255,255,.62);font-size:.72rem;font-weight:700;letter-spacing:.19em;text-transform:uppercase;
}
.obra-kicker::before{content:"";width:26px;height:2px;background:var(--terracota)}
.obra-hero h1{
  color:var(--blanco);font-size:clamp(3rem,6.4vw,6.2rem);line-height:.91;
  letter-spacing:-.06em;max-width:14ch;
}
.obra-hero h1 em{font-style:normal;position:relative;color:var(--blanco)}
.obra-hero h1 em::after{
  content:"";position:absolute;left:0;right:0;bottom:.02em;height:.075em;background:var(--terracota);
}
.obra-hero-copy>p:not(.obra-kicker){
  margin-top:1.35rem;max-width:52ch;color:rgba(255,255,255,.78);font-size:1.12rem;line-height:1.65;
}
.obra-hero .hero-acciones{margin-top:2rem}
.obra-hero-link{
  color:var(--blanco);text-decoration:none;font-weight:600;display:inline-flex;align-items:center;
  gap:.7rem;border-bottom:1px solid rgba(255,255,255,.4);padding:.35rem 0;
}
.obra-hero-link span{color:var(--terracota)}
.obra-hero-prueba{
  display:grid;grid-template-columns:repeat(3,1fr);min-height:88px;border-top:1px solid rgba(255,255,255,.2);
}
.obra-hero-prueba p{max-width:none;padding:1rem 1.5rem;display:flex;gap:.75rem;align-items:center;color:rgba(255,255,255,.6)}
.obra-hero-prueba p:first-child{padding-left:0}
.obra-hero-prueba p+p{border-left:1px solid rgba(255,255,255,.16)}
.obra-hero-prueba strong{color:var(--blanco);font-family:var(--fuente-titulos);font-size:1.15rem;white-space:nowrap}
.obra-hero-prueba span{font-size:.82rem}
.obra-cab{
  display:grid;grid-template-columns:minmax(150px,.42fr) minmax(0,1.35fr) minmax(260px,.72fr);
  gap:clamp(1.5rem,4.5vw,4.5rem);align-items:end;margin-bottom:3rem;
}
.obra-cab h2{font-size:clamp(2.2rem,4.8vw,4.6rem);line-height:.96;letter-spacing:-.06em}
.obra-cab h2 em{font-style:normal;color:var(--terracota)}
.obra-cab>p:last-child{color:var(--tinta-suave);line-height:1.65}
.obra-rutas{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--linea);border:1px solid var(--linea);border-radius:var(--radio-caja);overflow:hidden}
.obra-rutas article{background:var(--blanco);padding:clamp(1.6rem,3.2vw,2.8rem)}
.obra-rutas article>span{color:var(--terracota);font-family:var(--fuente-titulos);font-weight:700;font-size:.76rem;letter-spacing:.14em}
.obra-rutas h3{font-size:clamp(1.6rem,2.8vw,2.5rem);margin:.8rem 0 .7rem;letter-spacing:-.04em}
.obra-rutas p{color:var(--tinta-suave);max-width:48ch}
.obra-rutas a{display:inline-block;margin-top:1.4rem;color:var(--terracota);font-weight:600;text-decoration:none}
.obra-pasos{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);margin-top:3rem;border-top:1px solid var(--linea)}
.obra-pasos li{padding:1.5rem 1.5rem 0 0}
.obra-pasos li+li{border-left:1px solid var(--linea);padding-left:1.5rem}
.obra-pasos span{display:block;color:var(--terracota);font-size:.72rem;font-weight:700;letter-spacing:.14em;margin-bottom:.7rem}
.obra-pasos strong{font-family:var(--fuente-titulos);font-size:1.15rem}
.obra-pasos p{color:var(--tinta-suave);font-size:.92rem;margin-top:.35rem}
.obra-page #presupuesto{background:var(--agua)}
.obra-page .pres-cont{max-width:940px}
.obra-page .pres-form{padding:clamp(1.5rem,4vw,3rem);gap:2rem;box-shadow:none}
.obra-page .pres-bloque legend{font-size:1.1rem}
.obra-page .pres-datos{padding-top:.2rem}
.obra-cierre{background:var(--tinta);color:var(--blanco);padding-bottom:0}
.obra-cierre h2,.obra-cierre h3{color:var(--blanco)}
.obra-cierre-faq{
  display:grid;grid-template-columns:minmax(250px,.7fr) minmax(0,1.3fr);
  gap:clamp(2rem,7vw,7rem);padding-bottom:clamp(3rem,7vw,6rem);border-bottom:1px solid rgba(255,255,255,.16);
}
.obra-cierre-faq>div:first-child h2{max-width:10ch;font-size:clamp(2rem,4vw,3.8rem);line-height:.98;letter-spacing:-.05em}
.obra-cierre .faq-item{border-color:rgba(255,255,255,.16)}
.obra-cierre .faq-item summary{color:var(--blanco)}
.obra-cierre .faq-cuerpo p{color:rgba(255,255,255,.64)}
.obra-otros{padding-top:2.2rem}
@media (max-width:860px){
  .rep-page .equipo-foto{height:210px;min-height:210px}
  .rep-page .equipo-cuerpo{min-height:0}
  .obra-page .cabecera-obra{position:absolute}
  .obra-hero{min-height:auto}
  .obra-hero::after{background:linear-gradient(0deg,rgba(10,28,34,.97) 5%,rgba(10,28,34,.72) 75%,rgba(10,28,34,.4))}
  .obra-hero-cont{padding-top:calc(68px + 1.2rem)}
  .obra-hero-copy{padding:2.3rem 0}
  .obra-hero h1{font-size:clamp(2.7rem,12vw,4.2rem)}
  .obra-hero .hero-acciones{flex-direction:column;align-items:stretch}
  .obra-hero .hero-acciones .boton{width:100%;justify-content:center}
  .obra-hero-link{justify-content:center}
  .obra-hero-prueba{grid-template-columns:1fr 1fr}
  .obra-hero-prueba p:nth-child(3){display:none}
  .obra-hero-prueba p{padding:.85rem .65rem}
  .obra-cab{grid-template-columns:1fr;gap:1rem;align-items:start}
  .obra-rutas,.obra-pasos{grid-template-columns:1fr}
  .obra-rutas{gap:.8rem;background:transparent;border:0}
  .obra-rutas article{border:1px solid var(--linea);border-radius:var(--radio-caja)}
  .obra-pasos li+li{border-left:0;border-top:1px solid var(--linea);padding-left:0}
  .obra-pasos li{padding:1.2rem 0}
  .obra-cierre-faq{grid-template-columns:1fr;gap:1.5rem}
}

/* ============================================================
   PORTADAS DE SERVICIO — TRABAJO REAL, 2026-07-26
   La fotografía deja de ser un fondo decorativo: cada apertura
   explica el servicio con una composición y una prueba concreta.
   ============================================================ */
.mant-page .cabecera-mant,
.rep-page .cabecera-rep,
.obra-page .cabecera-obra{
  position:absolute;background:rgba(247,248,247,.92);border-color:var(--linea);
  backdrop-filter:blur(12px);
}
.mant-page .cabecera-mant .nav-principal>a:not(.boton),
.mant-page .cabecera-mant .menu-btn,
.rep-page .cabecera-rep .nav-principal>a:not(.boton),
.rep-page .cabecera-rep .menu-btn,
.obra-page .cabecera-obra .nav-principal>a:not(.boton),
.obra-page .cabecera-obra .menu-btn{color:var(--tinta)}
.mant-page .cabecera-mant .nav-principal>a:not(.boton):hover,
.mant-page .cabecera-mant .menu-btn:hover,
.rep-page .cabecera-rep .nav-principal>a:not(.boton):hover,
.rep-page .cabecera-rep .menu-btn:hover,
.obra-page .cabecera-obra .nav-principal>a:not(.boton):hover,
.obra-page .cabecera-obra .menu-btn:hover{color:var(--terracota)}
.mant-page .cabecera-mant .nav-burger span,
.rep-page .cabecera-rep .nav-burger span,
.obra-page .cabecera-obra .nav-burger span{background:var(--tinta)}
.mant-page .cabecera-mant .nav-cta,
.rep-page .cabecera-rep .nav-cta,
.obra-page .cabecera-obra .nav-cta{
  background:var(--terracota);color:var(--blanco);box-shadow:none;
}
.mant-page .cabecera-mant .nav-cta:hover,
.rep-page .cabecera-rep .nav-cta:hover,
.obra-page .cabecera-obra .nav-cta:hover{background:var(--tinta);color:var(--blanco)}

/* 01 · mantenimiento: limpio, periódico y fácil de escanear */
.mant-hero{
  min-height:0;display:block;background:var(--papel);color:var(--tinta);
  padding-top:68px;overflow:hidden;
}
.mant-hero::after{display:none}
.mant-hero-cont{display:block;padding-top:clamp(1.2rem,3vw,2.3rem)}
.mant-hero .miga,.rep-hero .miga,.obra-hero .miga{color:var(--tinta-suave)}
.mant-hero .miga a,.rep-hero .miga a,.obra-hero .miga a{color:var(--tinta)}
.mant-portada-grid{
  display:grid;grid-template-columns:minmax(0,.88fr) minmax(440px,1.12fr);
  gap:clamp(2.5rem,6vw,6.5rem);align-items:center;padding:clamp(2.2rem,5vw,5.2rem) 0;
}
.mant-hero-copy{margin:0;padding:0;max-width:none}
.mant-kicker,.rep-page .rep-kicker,.obra-kicker{color:var(--terracota)}
.mant-hero h1{
  color:var(--tinta);font-size:clamp(3rem,5.7vw,5.8rem);line-height:.92;max-width:10ch;
}
.mant-hero h1 em{color:var(--tinta)}
.mant-hero h1 em::after,.rep-page .rep-hero h1 em::after,.obra-hero h1 em::after{display:none}
.mant-hero-copy>p:not(.mant-kicker){color:var(--tinta-suave);max-width:47ch}
.mant-servicio-resumen{list-style:none;margin:1.55rem 0 0;display:grid;gap:.55rem}
.mant-servicio-resumen li{
  display:flex;gap:.7rem;align-items:center;color:var(--tinta);font-weight:600;
}
.mant-servicio-resumen li::before{
  content:"✓";display:grid;place-items:center;width:1.35rem;height:1.35rem;border-radius:50%;
  background:var(--agua);color:var(--terracota);font-size:.75rem;font-weight:700;
}
.mant-hero-link{color:var(--tinta);border-color:var(--linea)}
.mant-portada-foto{position:relative;margin:0;padding:0 0 2.4rem 2.4rem}
.mant-portada-foto::before{
  content:"01";position:absolute;left:0;bottom:0;font-family:var(--fuente-titulos);
  font-size:clamp(4.5rem,9vw,8.5rem);font-weight:700;line-height:.8;color:var(--agua);
}
.mant-portada-foto .mant-hero-foto{
  position:relative;inset:auto;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;
  object-position:center;filter:none;border-radius:var(--radio-caja);
}
.mant-portada-foto figcaption{
  position:absolute;right:-1px;bottom:0;width:min(82%,420px);padding:1rem 1.25rem;
  background:var(--tinta);color:rgba(255,255,255,.72);font-size:.88rem;line-height:1.45;
}
.mant-portada-foto figcaption strong{display:block;color:var(--blanco);font-family:var(--fuente-titulos)}
.mant-hero-prueba{border-color:var(--linea)}
.mant-hero-prueba p{color:var(--tinta-suave)}
.mant-hero-prueba p+p{border-color:var(--linea)}
.mant-hero-prueba strong{color:var(--tinta)}

/* 02 · reparación: banco de diagnóstico y fotografía documental */
.rep-page .rep-hero{
  min-height:0;display:block;background:var(--agua);color:var(--tinta);padding-top:68px;
}
.rep-page .rep-hero::after{display:none}
.rep-page .rep-hero-cont{display:block;padding-top:clamp(1.2rem,3vw,2.3rem)}
.rep-hero-grid{
  grid-template-columns:minmax(0,.84fr) minmax(440px,1.16fr);align-items:center;
  gap:clamp(2.5rem,6vw,6.5rem);padding:clamp(2.2rem,5vw,4.6rem) 0 2rem;
}
.rep-hero-copy{align-self:auto}
.rep-page .rep-hero h1{
  color:var(--tinta);font-size:clamp(2.9rem,5.4vw,5.5rem);line-height:.94;max-width:12ch;
}
.rep-page .rep-hero h1 em{color:var(--tinta)}
.rep-page .rep-hero-sub{color:var(--tinta-suave)}
.rep-hero-link{color:var(--tinta);border-color:rgba(20,51,59,.25)}
.rep-portada-foto{position:relative;margin:0}
.rep-portada-foto::before{
  content:"REPARACIÓN / 02";position:absolute;z-index:2;left:-1.1rem;top:1.3rem;
  padding:.65rem .85rem;background:var(--terracota);color:var(--blanco);
  font-size:.67rem;font-weight:700;letter-spacing:.14em;
}
.rep-portada-foto .rep-hero-foto{
  position:relative;inset:auto;width:100%;height:auto;aspect-ratio:5/4;object-fit:cover;
  object-position:center;filter:none;border-radius:var(--radio-caja);
}
.rep-portada-foto figcaption{
  margin-top:.6rem;color:var(--tinta-suave);font-size:.78rem;text-align:right;
}
.rep-diagnostico{
  display:grid;grid-template-columns:auto repeat(3,minmax(0,1fr)) auto;align-items:stretch;
  color:var(--tinta);border:1px solid rgba(20,51,59,.16);background:rgba(255,255,255,.48);
  backdrop-filter:none;border-radius:var(--radio-caja);overflow:hidden;
}
.rep-diagnostico-tit,.rep-diagnostico-pie{display:flex;align-items:center;padding:.9rem 1rem;color:var(--tinta-suave)}
.rep-diagnostico a{
  grid-template-columns:auto 1fr auto;color:var(--tinta);padding:.9rem 1rem;
  border-top:0;border-left:1px solid rgba(20,51,59,.13);font-size:.9rem;
}
.rep-diagnostico a span{color:var(--terracota)}
.rep-diagnostico a b{color:var(--terracota)}
.rep-diagnostico-pie{border-left:1px solid rgba(20,51,59,.13);font-size:.78rem}
.rep-diagnostico-pie strong{color:var(--tinta)}
.rep-hero-prueba{border-color:rgba(20,51,59,.15)}
.rep-hero-prueba p{color:var(--tinta-suave)}
.rep-hero-prueba p+p{border-color:rgba(20,51,59,.13)}
.rep-hero-prueba strong{color:var(--tinta)}

/* 03 · construcción: la obra ocupa el primer plano */
.obra-hero{
  min-height:0;display:block;background:#efe7d8;color:var(--tinta);padding-top:68px;
}
.obra-hero::after{display:none}
.obra-hero-cont{display:block;padding-top:clamp(1.2rem,3vw,2.3rem)}
.obra-portada-grid{
  display:grid;grid-template-columns:minmax(460px,1.12fr) minmax(0,.88fr);
  gap:clamp(2.5rem,6vw,6.5rem);align-items:center;padding:clamp(2.2rem,5vw,5rem) 0;
}
.obra-portada-foto{position:relative;margin:0;padding-bottom:2.2rem}
.obra-portada-foto .obra-hero-foto{
  position:relative;inset:auto;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;
  filter:none;border-radius:var(--radio-caja);
}
.obra-portada-foto figcaption{
  position:absolute;left:1.5rem;right:1.5rem;bottom:0;padding:1rem 1.2rem;
  background:var(--blanco);color:var(--tinta-suave);font-size:.85rem;
  border-left:3px solid var(--terracota);box-shadow:0 12px 30px rgba(20,51,59,.1);
}
.obra-portada-foto figcaption span{
  display:block;color:var(--terracota);font-size:.66rem;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;margin-bottom:.25rem;
}
.obra-hero-copy{margin:0;padding:0;max-width:none}
.obra-hero h1{
  color:var(--tinta);font-size:clamp(2.9rem,5vw,5.2rem);line-height:.94;max-width:12ch;
}
.obra-hero h1 em{color:var(--tinta)}
.obra-hero-copy>p:not(.obra-kicker){color:var(--tinta-suave)}
.obra-rutas-rapidas{
  display:grid;grid-template-columns:1fr 1fr;margin-top:1.5rem;border-block:1px solid rgba(20,51,59,.18);
}
.obra-rutas-rapidas span{padding:.9rem 0;font-weight:600}
.obra-rutas-rapidas span+span{border-left:1px solid rgba(20,51,59,.18);padding-left:1rem}
.obra-rutas-rapidas b{color:var(--terracota);font-size:.7rem;letter-spacing:.1em;margin-right:.4rem}
.obra-hero-link{color:var(--tinta);border-color:rgba(20,51,59,.25)}
.obra-hero-prueba{border-color:rgba(20,51,59,.16)}
.obra-hero-prueba p{color:var(--tinta-suave)}
.obra-hero-prueba p+p{border-color:rgba(20,51,59,.14)}
.obra-hero-prueba strong{color:var(--tinta)}

@media (max-width:980px){
  .mant-portada-grid,.rep-hero-grid,.obra-portada-grid{
    grid-template-columns:1fr 1fr;gap:2.2rem;
  }
  .rep-diagnostico{grid-template-columns:repeat(3,1fr)}
  .rep-diagnostico-tit,.rep-diagnostico-pie{grid-column:1/-1}
  .rep-diagnostico a:first-of-type{border-left:0}
  .rep-diagnostico-pie{border-left:0;border-top:1px solid rgba(20,51,59,.13)}
}
@media (max-width:860px){
  .mant-page .cabecera-mant,.rep-page .cabecera-rep,.obra-page .cabecera-obra{position:absolute}
  .mant-hero,.rep-page .rep-hero,.obra-hero{padding-top:68px}
  .mant-hero-cont,.rep-page .rep-hero-cont,.obra-hero-cont{padding-top:1rem}
  .mant-portada-grid,.rep-hero-grid,.obra-portada-grid{grid-template-columns:1fr;padding:1.5rem 0 2rem;gap:2rem}
  .mant-portada-foto{padding:0 0 2rem 1.25rem}
  .mant-portada-foto .mant-hero-foto,.rep-portada-foto .rep-hero-foto,.obra-portada-foto .obra-hero-foto{aspect-ratio:4/3}
  .rep-portada-foto{order:-1}
  .obra-portada-foto{order:0}
  .obra-hero-copy{order:-1}
  .mant-hero h1,.rep-page .rep-hero h1,.obra-hero h1{font-size:clamp(2.65rem,12vw,4.1rem);line-height:.94}
  .mant-hero .hero-acciones,.rep-page .rep-hero-acc,.obra-hero .hero-acciones{flex-direction:column;align-items:stretch}
  .mant-hero .hero-acciones .boton,.rep-page .rep-hero-acc .boton,.obra-hero .hero-acciones .boton{width:100%;justify-content:center}
  .mant-hero-link,.rep-hero-link,.obra-hero-link{justify-content:center}
  .rep-diagnostico{display:grid;grid-template-columns:1fr}
  .rep-diagnostico-tit,.rep-diagnostico-pie{grid-column:auto}
  .rep-diagnostico a{border-left:0;border-top:1px solid rgba(20,51,59,.13)}
  .mant-hero-prueba,.rep-hero-prueba,.obra-hero-prueba{grid-template-columns:1fr 1fr}
  .mant-hero-prueba p:nth-child(3),.rep-hero-prueba p:nth-child(3),.obra-hero-prueba p:nth-child(3){display:none}
}
@media (max-width:520px){
  .mant-portada-foto figcaption{width:90%}
  .obra-rutas-rapidas{grid-template-columns:1fr}
  .obra-rutas-rapidas span+span{border-left:0;border-top:1px solid rgba(20,51,59,.18);padding-left:0}
}

/* GALERÍA — contenedor editorial preparado para trabajos reales */
.galeria-cabecera{position:relative;background:var(--papel);border-bottom:1px solid var(--linea)}
.galeria-portada{background:var(--papel);padding:2rem 0 clamp(4rem,9vw,8rem)}
.galeria-portada-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(280px,.55fr);gap:clamp(2rem,8vw,8rem);align-items:end;margin-top:clamp(3rem,8vw,7rem)}
.galeria-sobre{color:var(--terracota);font-size:.7rem;font-weight:700;letter-spacing:.17em;text-transform:uppercase;margin-bottom:1rem}
.galeria-portada h1{font-size:clamp(3.4rem,7vw,7rem);line-height:.88;letter-spacing:-.065em}
.galeria-portada h1 em{font-style:normal;color:var(--terracota)}
.galeria-portada-grid>p{color:var(--tinta-suave);font-size:1.08rem;line-height:1.65}
.galeria-proximamente{background:var(--blanco)}
.galeria-filtros{display:flex;gap:0;border-bottom:1px solid var(--linea);overflow-x:auto}
.galeria-filtros span{white-space:nowrap;padding:.85rem 1.25rem;color:var(--tinta-suave);font-weight:600}
.galeria-filtros span:first-child{padding-left:0}
.galeria-filtros .activo{color:var(--terracota)}
.galeria-espera{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:clamp(1.5rem,5vw,5rem);align-items:end;padding:clamp(3rem,7vw,6rem) 0;border-bottom:1px solid var(--linea)}
.galeria-espera-num{align-self:start;color:var(--terracota);font-weight:700;letter-spacing:.1em}
.galeria-espera h2{font-size:clamp(2.2rem,4.5vw,4.4rem);line-height:.94;letter-spacing:-.055em;margin-bottom:1rem}
.galeria-espera p{color:var(--tinta-suave);max-width:55ch}
.galeria-huecos{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--linea);margin-top:3rem;border:1px solid var(--linea)}
.galeria-huecos span{min-height:240px;background:var(--papel);padding:1.5rem;display:flex;flex-direction:column;justify-content:flex-end}
.galeria-huecos b{font-family:var(--fuente-titulos)}
.galeria-huecos small{color:var(--tinta-suave);margin-top:.25rem}
.galeria-real{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.25rem;margin-top:clamp(2rem,5vw,4rem)}
.galeria-proyecto{background:var(--papel);border:1px solid var(--linea);border-radius:var(--radio-caja);overflow:hidden;display:flex;flex-direction:column;min-height:100%}
.galeria-proyecto img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover}
.galeria-proyecto>div{padding:1.35rem 1.5rem 1.6rem}
.galeria-proyecto>div>span{color:var(--terracota);font-size:.7rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.galeria-proyecto h2{font-size:clamp(1.35rem,2.2vw,2rem);line-height:1;margin:.55rem 0 .65rem;letter-spacing:-.035em}
.galeria-proyecto p{color:var(--tinta-suave);font-size:.95rem;line-height:1.5;margin:0}
.galeria-proyecto-destacado{grid-column:1 / -1;display:grid;grid-template-columns:1.35fr .65fr;background:var(--tinta);color:var(--blanco)}
.galeria-proyecto-destacado img{height:100%;aspect-ratio:auto;min-height:360px}
.galeria-proyecto-destacado>div{display:flex;flex-direction:column;justify-content:end;padding:clamp(1.5rem,4vw,3.2rem)}
.galeria-proyecto-destacado h2{font-size:clamp(2rem,4vw,4rem)}
.galeria-proyecto-destacado p{color:rgba(255,255,255,.72)}
.galeria-proyecto-destacado>div>span,.galeria-proyecto-oscuro>div>span{color:var(--agua-luz)}
.galeria-proyecto-oscuro{background:var(--tinta);color:var(--blanco)}
.galeria-proyecto-oscuro p{color:rgba(255,255,255,.72)}
@media(max-width:860px){
  .galeria-portada-grid,.galeria-espera{grid-template-columns:1fr}
  .galeria-portada-grid{margin-top:3rem}
  .galeria-espera .boton{width:100%;justify-content:center}
  .galeria-huecos{grid-template-columns:1fr}
  .galeria-huecos span{min-height:150px}
  .galeria-real{grid-template-columns:1fr}
  .galeria-proyecto-destacado{grid-column:auto;display:flex}
  .galeria-proyecto-destacado img{height:auto;min-height:0;aspect-ratio:3/2}
}