/* ==========================================================================
   Perforaciones Buenavista — hoja de estilo única
   Paleta industrial azul-agua
   ========================================================================== */

:root{
  --azul-900:#0A2347;
  --azul-800:#0F2F5C;
  --azul-700:#1B3A6B;
  --azul-500:#1B7BA8;
  --azul-300:#7FC4E8;
  --azul-100:#E3F1F9;
  --ambar:#F2A007;
  --ambar-osc:#C97F00;
  --verde-wa:#25D366;
  --carbon:#1E2A32;
  --gris:#5B6B78;
  --gris-claro:#E4E9ED;
  --hueso:#F7F9FA;
  --blanco:#FFFFFF;

  --radio:14px;
  --radio-sm:9px;
  --sombra:0 2px 8px rgba(10,35,71,.07), 0 12px 32px rgba(10,35,71,.09);
  --sombra-sm:0 1px 3px rgba(10,35,71,.10), 0 4px 12px rgba(10,35,71,.07);
  --ancho:1180px;
  --header-h:74px;
  --trans:.22s cubic-bezier(.4,0,.2,1);
}

*,*::before,*::after{box-sizing:border-box;}

html{scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + 16px);-webkit-text-size-adjust:100%;}

body{
  margin:0;
  font-family:"Segoe UI",Roboto,-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;
  font-size:17px;
  line-height:1.68;
  color:var(--carbon);
  background:var(--blanco);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

img,video{max-width:100%;display:block;}

h1,h2,h3,h4{
  font-family:Georgia,"Times New Roman",serif;
  color:var(--azul-900);
  line-height:1.18;
  margin:0 0 .5em;
  font-weight:700;
  letter-spacing:-.012em;
}
h1{font-size:clamp(2.05rem,5vw,3.35rem);}
h2{font-size:clamp(1.65rem,3.6vw,2.5rem);}
h3{font-size:clamp(1.2rem,2.2vw,1.5rem);}
h4{font-size:1.06rem;}
p{margin:0 0 1.1em;}
a{color:var(--azul-500);text-decoration:none;transition:color var(--trans);}
a:hover{color:var(--azul-900);}

:focus-visible{outline:3px solid var(--ambar);outline-offset:3px;border-radius:4px;}

.saltar{position:absolute;left:-9999px;top:0;background:var(--azul-900);color:#fff;padding:12px 20px;z-index:999;}
.saltar:focus{left:12px;top:12px;color:#fff;}

/* ---------- utilidades ---------- */
.contenedor{width:100%;max-width:var(--ancho);margin:0 auto;padding:0 22px;}
.seccion{padding:clamp(52px,7vw,92px) 0;}
.seccion--gris{background:var(--hueso);}
.seccion--azul{background:var(--azul-900);color:#D8E5F0;}
.seccion--azul h2,.seccion--azul h3{color:#fff;}
.centrado{text-align:center;}
.limite{max-width:720px;}
.centrado .limite{margin-left:auto;margin-right:auto;}

.etiqueta{
  display:inline-block;font-size:.74rem;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;color:var(--azul-500);margin-bottom:.65rem;
  font-family:"Segoe UI",sans-serif;
}
.seccion--azul .etiqueta{color:var(--ambar);}
.entradilla{font-size:1.09rem;color:var(--gris);}
.seccion--azul .entradilla{color:#B9CCDD;}

/* ---------- botones ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.55em;
  padding:.86em 1.65em;border-radius:var(--radio-sm);border:2px solid transparent;
  font-size:1rem;font-weight:700;font-family:"Segoe UI",sans-serif;
  cursor:pointer;transition:all var(--trans);text-align:center;line-height:1.25;
}
.btn svg{width:1.15em;height:1.15em;flex-shrink:0;}
.btn--primario{background:var(--ambar);color:var(--azul-900);border-color:var(--ambar);}
.btn--primario:hover{background:var(--ambar-osc);border-color:var(--ambar-osc);color:#fff;transform:translateY(-2px);box-shadow:var(--sombra-sm);}
.btn--secundario{background:transparent;color:var(--azul-900);border-color:var(--azul-700);}
.btn--secundario:hover{background:var(--azul-900);color:#fff;transform:translateY(-2px);}
.seccion--azul .btn--secundario{color:#fff;border-color:rgba(255,255,255,.5);}
.seccion--azul .btn--secundario:hover{background:#fff;color:var(--azul-900);}
.btn--wa{background:var(--verde-wa);color:#06301A;border-color:var(--verde-wa);}
.btn--wa:hover{background:#1BB553;border-color:#1BB553;color:#fff;transform:translateY(-2px);}
.btn--correo{background:transparent;color:var(--azul-800);border-color:var(--gris-claro);margin-top:10px;}
.btn--correo svg{fill:var(--azul-500);transition:fill var(--trans);}
.btn--correo:hover{background:var(--azul-900);color:#fff;border-color:var(--azul-900);transform:translateY(-2px);}
.btn--correo:hover svg{fill:#fff;}
.grupo-btn{display:flex;flex-wrap:wrap;gap:14px;}
.centrado .grupo-btn{justify-content:center;}

/* ---------- encabezado ---------- */
.encabezado{
  position:sticky;top:0;z-index:100;background:rgba(255,255,255,.97);
  backdrop-filter:saturate(180%) blur(10px);
  border-bottom:1px solid var(--gris-claro);
}
.encabezado__fila{display:flex;align-items:center;gap:22px;height:var(--header-h);}
.marca{display:flex;align-items:center;flex-shrink:0;}
.marca img{height:50px;width:auto;}
.nav{margin-left:auto;}
.nav ul{display:flex;gap:4px;list-style:none;margin:0;padding:0;}
.nav a{
  display:block;padding:.55em .85em;border-radius:7px;font-size:.95rem;
  font-weight:600;color:var(--azul-900);
}
.nav a:hover{background:var(--azul-100);}
.nav a[aria-current="page"]{color:var(--azul-500);background:var(--azul-100);}
.encabezado__tel{
  display:inline-flex;align-items:center;gap:.45em;font-weight:700;
  color:var(--azul-900);white-space:nowrap;font-size:.97rem;
}
.encabezado__tel svg{width:17px;height:17px;fill:var(--azul-500);}
.hamburguesa{
  display:none;background:none;border:0;padding:9px;cursor:pointer;margin-left:auto;
}
.hamburguesa span{display:block;width:25px;height:2.5px;background:var(--azul-900);border-radius:2px;margin:5px 0;transition:all var(--trans);}
.hamburguesa[aria-expanded="true"] span:nth-child(1){transform:translateY(7.5px) rotate(45deg);}
.hamburguesa[aria-expanded="true"] span:nth-child(2){opacity:0;}
.hamburguesa[aria-expanded="true"] span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg);}

@media(max-width:1000px){
  .hamburguesa{display:block;}
  .encabezado__tel{display:none;}
  .nav{
    position:absolute;top:var(--header-h);left:0;right:0;background:#fff;
    border-bottom:1px solid var(--gris-claro);box-shadow:var(--sombra);
    max-height:0;overflow:hidden;transition:max-height .3s ease;margin:0;
  }
  .nav.abierto{max-height:80vh;overflow-y:auto;}
  .nav ul{flex-direction:column;padding:10px 22px 22px;gap:0;}
  .nav a{padding:.85em .5em;border-bottom:1px solid var(--gris-claro);border-radius:0;}
}

/* ---------- portada con video ---------- */
.portada{position:relative;min-height:clamp(500px,84vh,760px);display:flex;align-items:center;overflow:hidden;background:var(--azul-900);}
.portada__media{position:absolute;inset:0;}
.portada__media video,.portada__media img{width:100%;height:100%;object-fit:cover;}
.portada__velo{
  position:absolute;inset:0;
  background:linear-gradient(105deg,rgba(10,35,71,.94) 0%,rgba(10,35,71,.80) 42%,rgba(10,35,71,.42) 100%);
}
.portada__cuerpo{position:relative;z-index:2;padding:70px 0;max-width:730px;}
.portada h1{color:#fff;text-shadow:0 2px 22px rgba(0,0,0,.35);}
.portada h1 em{font-style:normal;color:var(--ambar);}
.portada__texto{font-size:clamp(1.04rem,2vw,1.22rem);color:#D5E4F1;margin-bottom:1.7em;}
.portada__datos{display:flex;flex-wrap:wrap;gap:10px 26px;margin-top:2.2em;list-style:none;padding:0;}
.portada__datos li{display:flex;align-items:center;gap:.5em;color:#BDD3E5;font-size:.93rem;font-weight:600;}
.portada__datos svg{width:16px;height:16px;fill:var(--ambar);flex-shrink:0;}
.sonido{
  position:absolute;right:20px;bottom:20px;z-index:3;
  background:rgba(10,35,71,.66);border:1.5px solid rgba(255,255,255,.4);
  color:#fff;border-radius:50%;width:46px;height:46px;cursor:pointer;
  display:flex;align-items:center;justify-content:center;transition:all var(--trans);
}
.sonido:hover{background:var(--ambar);border-color:var(--ambar);color:var(--azul-900);}
.sonido svg{width:20px;height:20px;fill:currentColor;}

/* portada corta para páginas internas */
.portada-int{background:var(--azul-900);color:#fff;padding:clamp(48px,7vw,82px) 0;position:relative;overflow:hidden;}
.portada-int::after{
  content:"";position:absolute;right:-90px;top:-90px;width:340px;height:340px;
  border-radius:50%;background:radial-gradient(circle,rgba(27,123,168,.34),transparent 70%);
}
.portada-int h1{color:#fff;margin-bottom:.35em;position:relative;z-index:1;}
.portada-int p{color:#B9CCDD;max-width:660px;margin:0;position:relative;z-index:1;font-size:1.07rem;}
.miga{font-size:.87rem;color:#8FAAC4;margin-bottom:1.1em;position:relative;z-index:1;}
.miga a{color:#8FAAC4;}
.miga a:hover{color:#fff;}

/* ---------- franja de cifras ---------- */
.cifras{background:var(--azul-700);color:#fff;}
.cifras__rejilla{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:6px 30px;padding:34px 0;}
.cifra{text-align:center;padding:12px;}
.cifra__n{font-family:Georgia,serif;font-size:clamp(1.9rem,4vw,2.7rem);font-weight:700;color:var(--ambar);line-height:1.05;display:block;}
.cifra__t{font-size:.88rem;color:#C6D8E8;letter-spacing:.03em;margin-top:.35em;display:block;}

/* ---------- rejillas y tarjetas ---------- */
.rejilla{display:grid;gap:26px;}
.rejilla--2{grid-template-columns:repeat(auto-fit,minmax(310px,1fr));}
.rejilla--3{grid-template-columns:repeat(auto-fit,minmax(285px,1fr));}
.rejilla--4{grid-template-columns:repeat(auto-fit,minmax(228px,1fr));}

.tarjeta{
  background:#fff;border:1px solid var(--gris-claro);border-radius:var(--radio);
  overflow:hidden;display:flex;flex-direction:column;transition:all var(--trans);
}
.tarjeta:hover{transform:translateY(-4px);box-shadow:var(--sombra);border-color:var(--azul-300);}
.tarjeta__img{aspect-ratio:16/10;overflow:hidden;background:var(--azul-100);}
.tarjeta__img img{width:100%;height:100%;object-fit:cover;transition:transform .45s ease;}
.tarjeta:hover .tarjeta__img img{transform:scale(1.06);}
.tarjeta__cuerpo{padding:24px;flex:1;display:flex;flex-direction:column;}
.tarjeta__cuerpo h3{margin-bottom:.42em;}
.tarjeta__cuerpo p{color:var(--gris);font-size:.97rem;margin-bottom:1em;}
.tarjeta__pie{margin-top:auto;padding-top:.3em;font-weight:700;font-size:.95rem;color:var(--azul-500);display:inline-flex;align-items:center;gap:.4em;}
.tarjeta:hover .tarjeta__pie{gap:.75em;}

.tarjeta-icono{background:#fff;border:1px solid var(--gris-claro);border-radius:var(--radio);padding:28px 24px;transition:all var(--trans);}
.tarjeta-icono:hover{border-color:var(--azul-300);box-shadow:var(--sombra-sm);transform:translateY(-3px);}
.tarjeta-icono__ico{
  width:52px;height:52px;border-radius:12px;background:var(--azul-100);
  display:flex;align-items:center;justify-content:center;margin-bottom:16px;
}
.tarjeta-icono__ico svg{width:26px;height:26px;fill:var(--azul-500);}
.tarjeta-icono h3{font-size:1.13rem;margin-bottom:.35em;}
.tarjeta-icono p{color:var(--gris);font-size:.95rem;margin:0;}

/* ---------- lista con palomas ---------- */
.lista-check{list-style:none;padding:0;margin:0 0 1.4em;}
.lista-check li{position:relative;padding-left:2em;margin-bottom:.72em;color:var(--carbon);}
.lista-check li::before{
  content:"";position:absolute;left:0;top:.42em;width:1.25em;height:1.25em;border-radius:50%;
  background:var(--azul-500) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z'/%3E%3C/svg%3E") center/.82em no-repeat;
}
.seccion--azul .lista-check li{color:#D8E5F0;}
.seccion--azul .lista-check li::before{background-color:var(--ambar);}

/* ---------- bloque dividido texto/imagen ---------- */
.dividido{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,64px);align-items:center;}
.dividido--inv .dividido__media{order:-1;}
.dividido__media img,.dividido__media video{border-radius:var(--radio);box-shadow:var(--sombra);width:100%;}
@media(max-width:860px){
  .dividido{grid-template-columns:1fr;}
  .dividido--inv .dividido__media{order:0;}
}

/* ---------- proceso numerado ---------- */
.pasos{counter-reset:paso;display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:28px;}
.paso{position:relative;padding-top:56px;}
.paso::before{
  counter-increment:paso;content:counter(paso);
  position:absolute;top:0;left:0;width:44px;height:44px;border-radius:50%;
  background:var(--azul-900);color:var(--ambar);font-family:Georgia,serif;font-weight:700;
  font-size:1.25rem;display:flex;align-items:center;justify-content:center;
}
.paso h3{font-size:1.1rem;margin-bottom:.3em;}
.paso p{color:var(--gris);font-size:.95rem;margin:0;}

/* ---------- galería ---------- */
.filtros{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-bottom:34px;}
.filtro{
  padding:.55em 1.25em;border-radius:99px;border:1.5px solid var(--gris-claro);
  background:#fff;color:var(--azul-900);font-weight:600;font-size:.93rem;cursor:pointer;
  transition:all var(--trans);font-family:inherit;
}
.filtro:hover{border-color:var(--azul-500);}
.filtro[aria-pressed="true"]{background:var(--azul-900);color:#fff;border-color:var(--azul-900);}

.mosaico{
  column-count:3;column-gap:16px;
}
@media(max-width:900px){.mosaico{column-count:2;}}
@media(max-width:520px){.mosaico{column-count:1;}}
.mosaico figure{
  break-inside:avoid;margin:0 0 16px;border-radius:var(--radio-sm);overflow:hidden;
  cursor:pointer;position:relative;background:var(--azul-100);
}
.mosaico img{width:100%;transition:transform .45s ease,filter .3s ease;}
.mosaico figure:hover img{transform:scale(1.05);filter:brightness(1.06);}
.mosaico figure::after{
  content:"";position:absolute;inset:0;border:2.5px solid transparent;
  border-radius:var(--radio-sm);transition:border-color var(--trans);pointer-events:none;
}
.mosaico figure:hover::after{border-color:var(--ambar);}
.mosaico figure[hidden]{display:none;}

/* visor */
.visor{
  position:fixed;inset:0;background:rgba(6,20,38,.96);z-index:200;
  display:none;align-items:center;justify-content:center;padding:22px;
}
.visor[open],.visor.activo{display:flex;}
.visor img{max-width:94vw;max-height:84vh;object-fit:contain;border-radius:6px;}
.visor__pie{position:absolute;bottom:22px;left:0;right:0;text-align:center;color:#C6D8E8;font-size:.93rem;padding:0 60px;}
.visor__btn{
  position:absolute;background:rgba(255,255,255,.11);border:1.5px solid rgba(255,255,255,.28);
  color:#fff;width:50px;height:50px;border-radius:50%;cursor:pointer;
  display:flex;align-items:center;justify-content:center;transition:all var(--trans);
}
.visor__btn:hover{background:var(--ambar);border-color:var(--ambar);color:var(--azul-900);}
.visor__btn svg{width:22px;height:22px;fill:currentColor;}
.visor__cerrar{top:20px;right:20px;}
.visor__ant{left:18px;top:50%;transform:translateY(-50%);}
.visor__sig{right:18px;top:50%;transform:translateY(-50%);}

/* ---------- videos ---------- */
.videos{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:24px;}
.video-tarjeta{
  background:#fff;border:1px solid var(--gris-claro);border-radius:var(--radio);
  overflow:hidden;transition:all var(--trans);
}
.video-tarjeta:hover{box-shadow:var(--sombra);border-color:var(--azul-300);transform:translateY(-3px);}
.video-tarjeta video{width:100%;background:#0A1520;display:block;}
.video-tarjeta--v video{aspect-ratio:9/16;object-fit:cover;}
.video-tarjeta--h video{aspect-ratio:16/9;object-fit:cover;}
.video-tarjeta__cuerpo{padding:18px 20px;}
.video-tarjeta__cuerpo h3{font-size:1.04rem;margin-bottom:.25em;}
.video-tarjeta__cuerpo p{font-size:.9rem;color:var(--gris);margin:0;}

/* ---------- testimonios ---------- */
.testimonio{
  background:#fff;border:1px solid var(--gris-claro);border-left:4px solid var(--ambar);
  border-radius:var(--radio-sm);padding:26px 26px 22px;
}
.testimonio blockquote{margin:0 0 1em;font-size:1.03rem;color:var(--carbon);font-style:italic;}
.testimonio cite{font-style:normal;font-weight:700;color:var(--azul-900);font-size:.94rem;display:block;}
.testimonio span{font-size:.86rem;color:var(--gris);}

/* ---------- tabla ---------- */
.tabla-envoltura{overflow-x:auto;border:1px solid var(--gris-claro);border-radius:var(--radio);}
table{border-collapse:collapse;width:100%;min-width:560px;font-size:.95rem;background:#fff;}
th,td{padding:.85em 1.1em;text-align:left;border-bottom:1px solid var(--gris-claro);}
thead th{background:var(--azul-900);color:#fff;font-weight:700;font-size:.9rem;letter-spacing:.02em;}
tbody tr:nth-child(even){background:var(--hueso);}
tbody tr:last-child td{border-bottom:0;}

/* ---------- acordeón ---------- */
.acordeon{border:1px solid var(--gris-claro);border-radius:var(--radio);overflow:hidden;background:#fff;}
.acordeon details{border-bottom:1px solid var(--gris-claro);}
.acordeon details:last-child{border-bottom:0;}
.acordeon summary{
  padding:1.05em 1.3em;cursor:pointer;font-weight:700;color:var(--azul-900);
  list-style:none;display:flex;justify-content:space-between;align-items:center;gap:1em;
  transition:background var(--trans);
}
.acordeon summary::-webkit-details-marker{display:none;}
.acordeon summary:hover{background:var(--hueso);}
.acordeon summary::after{content:"+";font-size:1.5rem;color:var(--azul-500);font-weight:400;line-height:1;}
.acordeon details[open] summary::after{content:"−";}
.acordeon details > *:not(summary){padding:0 1.3em 1.2em;margin:0;color:var(--gris);font-size:.97rem;}

/* ---------- formulario ---------- */
.formulario{background:#fff;border:1px solid var(--gris-claro);border-radius:var(--radio);padding:clamp(24px,4vw,38px);}
.campo{margin-bottom:18px;}
.campo label{display:block;font-weight:700;font-size:.93rem;color:var(--azul-900);margin-bottom:.4em;}
.campo .req{color:#C0392B;}
.campo input,.campo select,.campo textarea{
  width:100%;padding:.78em .95em;border:1.5px solid var(--gris-claro);border-radius:var(--radio-sm);
  font-family:inherit;font-size:1rem;color:var(--carbon);background:#fff;transition:border-color var(--trans);
}
.campo input:focus,.campo select:focus,.campo textarea:focus{outline:none;border-color:var(--azul-500);box-shadow:0 0 0 3px rgba(27,123,168,.13);}
.campo textarea{resize:vertical;min-height:120px;}
.campo small{display:block;color:var(--gris);font-size:.84rem;margin-top:.35em;}
.campos-2{display:grid;grid-template-columns:1fr 1fr;gap:0 18px;}
@media(max-width:600px){.campos-2{grid-template-columns:1fr;}}
.aviso-form{font-size:.86rem;color:var(--gris);margin-top:1em;}

/* ---------- bloque de contacto ---------- */
.contacto-item{display:flex;gap:16px;margin-bottom:24px;align-items:flex-start;}
.contacto-item__ico{
  width:44px;height:44px;flex-shrink:0;border-radius:11px;background:var(--azul-100);
  display:flex;align-items:center;justify-content:center;
}
.contacto-item__ico svg{width:21px;height:21px;fill:var(--azul-500);}
.contacto-item h3{font-size:1.02rem;margin-bottom:.15em;}
.contacto-item p,.contacto-item address{margin:0;color:var(--gris);font-size:.96rem;font-style:normal;line-height:1.55;}
.contacto-item a{font-weight:600;}

/* ---------- llamada final ---------- */
.cta-final{background:linear-gradient(135deg,var(--azul-900) 0%,var(--azul-700) 100%);color:#fff;text-align:center;}
.cta-final h2{color:#fff;}
.cta-final p{color:#C6D8E8;max-width:620px;margin:0 auto 1.8em;}

/* ---------- pie ---------- */
.pie{background:#071A33;color:#93AAC2;padding:56px 0 0;font-size:.94rem;}
.pie h4{color:#fff;font-family:"Segoe UI",sans-serif;font-size:.82rem;letter-spacing:.13em;text-transform:uppercase;margin-bottom:1.05em;}
.pie a{color:#93AAC2;}
.pie a:hover{color:var(--ambar);}
.pie ul{list-style:none;padding:0;margin:0;}
.pie li{margin-bottom:.55em;}
.pie__rejilla{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.3fr;gap:38px;padding-bottom:44px;}
@media(max-width:880px){.pie__rejilla{grid-template-columns:1fr 1fr;gap:32px;}}
@media(max-width:520px){.pie__rejilla{grid-template-columns:1fr;}}
.pie__logo{background:#fff;border-radius:10px;padding:9px 12px;display:inline-block;margin-bottom:16px;}
.pie__logo img{height:52px;}
.pie__legal{border-top:1px solid rgba(255,255,255,.12);padding:20px 0;font-size:.85rem;display:flex;flex-wrap:wrap;gap:10px 22px;justify-content:space-between;}
.pie li a[href^="mailto:"]{word-break:break-word;}
.pie__red{
  display:inline-flex;align-items:center;gap:.6em;margin-top:1.15em;
  padding:.62em 1.1em;border-radius:999px;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);
  color:#fff;font-size:.88rem;font-weight:600;transition:all var(--trans);
}
.pie__red svg{width:1.25em;height:1.25em;fill:currentColor;flex-shrink:0;}
.pie__red:hover{background:#1877F2;border-color:#1877F2;color:#fff;transform:translateY(-2px);}

/* ---------- WhatsApp flotante ---------- */
.wa{position:fixed;right:20px;bottom:20px;z-index:150;}
.wa__btn{
  width:60px;height:60px;border-radius:50%;background:var(--verde-wa);border:0;cursor:pointer;
  box-shadow:0 4px 18px rgba(37,211,102,.45);display:flex;align-items:center;justify-content:center;
  transition:transform var(--trans);
}
.wa__btn:hover{transform:scale(1.08);}
.wa__btn svg{width:33px;height:33px;fill:#fff;}
.wa__panel{
  position:absolute;bottom:74px;right:0;width:270px;background:#fff;border-radius:var(--radio);
  box-shadow:var(--sombra);padding:18px;display:none;border:1px solid var(--gris-claro);
}
.wa__panel.abierto{display:block;}
.wa__panel p{font-size:.9rem;color:var(--gris);margin:0 0 .9em;line-height:1.45;}
.wa__panel strong{color:var(--azul-900);display:block;font-size:.98rem;margin-bottom:.3em;}
.wa__opcion{
  display:flex;align-items:center;gap:11px;padding:.7em .8em;border-radius:var(--radio-sm);
  background:var(--hueso);margin-bottom:8px;transition:all var(--trans);border:1px solid transparent;
}
.wa__opcion:hover{background:var(--azul-100);border-color:var(--azul-300);}
.wa__opcion svg{width:21px;height:21px;fill:var(--verde-wa);flex-shrink:0;}
.wa__opcion b{display:block;font-size:.93rem;color:var(--azul-900);line-height:1.3;}
.wa__opcion span{font-size:.81rem;color:var(--gris);}

/* ---------- barra móvil ---------- */
.barra-movil{
  display:none;position:fixed;bottom:0;left:0;right:0;z-index:140;
  background:#fff;border-top:1px solid var(--gris-claro);box-shadow:0 -2px 14px rgba(10,35,71,.10);
}
.barra-movil a{
  flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;
  padding:9px 4px;font-size:.74rem;font-weight:700;color:var(--azul-900);
}
.barra-movil svg{width:20px;height:20px;fill:var(--azul-500);}
@media(max-width:700px){
  .barra-movil{display:flex;}
  body{padding-bottom:60px;}
  .wa{bottom:74px;right:14px;}
  .wa__btn{width:54px;height:54px;}
  .wa__btn svg{width:29px;height:29px;}
}

/* ---------- nota de pendientes (solo borrador) ---------- */
.pendiente{
  background:#FFF8E1;border:1.5px dashed #E6A200;border-radius:var(--radio-sm);
  padding:.9em 1.1em;margin:1.1em 0;font-size:.9rem;color:#7A5600;
}
.pendiente strong{color:#5C4100;}
.pendiente::before{content:"⚠ Pendiente por confirmar — ";font-weight:700;}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important;}
}

/* ==========================================================================
   CAPA DE MOVIMIENTO
   Principio: la animación sirve para jerarquizar y guiar la lectura,
   no para lucirse. Todo respeta prefers-reduced-motion.
   ========================================================================== */

/* ---------- revelado al hacer scroll ---------- */
[data-reveal]{
  opacity:0;
  transform:translateY(26px);
  transition:opacity .72s cubic-bezier(.16,1,.3,1), transform .72s cubic-bezier(.16,1,.3,1);
  transition-delay:var(--d,0ms);
  will-change:opacity,transform;
}
[data-reveal="izq"]{transform:translateX(-34px);}
[data-reveal="der"]{transform:translateX(34px);}
[data-reveal="escala"]{transform:scale(.94);}
[data-reveal="mascara"]{opacity:1;transform:none;clip-path:inset(0 100% 0 0);transition:clip-path .9s cubic-bezier(.76,0,.24,1);transition-delay:var(--d,0ms);}
[data-reveal].visible{opacity:1;transform:none;clip-path:inset(0 0 0 0);}

/* ---------- entrada de la portada ---------- */
@keyframes surgir{from{opacity:0;transform:translateY(30px);}to{opacity:1;transform:none;}}
@keyframes anchoLinea{from{transform:scaleX(0);}to{transform:scaleX(1);}}
@keyframes kenburns{from{transform:scale(1.06);}to{transform:scale(1.16);}}
@keyframes flotar{0%,100%{transform:translateY(0);}50%{transform:translateY(7px);}}
@keyframes gota{
  0%{transform:translateY(-6px) scale(.9);opacity:0;}
  22%{opacity:1;}
  70%{transform:translateY(13px) scale(1);opacity:1;}
  100%{transform:translateY(20px) scale(.5);opacity:0;}
}
@keyframes onda{from{transform:translateX(0);}to{transform:translateX(-50%);}}
@keyframes brillo{from{background-position:-260% 0;}to{background-position:260% 0;}}

.portada__cuerpo > *{opacity:0;animation:surgir .95s cubic-bezier(.16,1,.3,1) forwards;}
.portada__cuerpo > *:nth-child(1){animation-delay:.15s}
.portada__cuerpo > *:nth-child(2){animation-delay:.28s}
.portada__cuerpo > *:nth-child(3){animation-delay:.41s}
.portada__cuerpo > *:nth-child(4){animation-delay:.54s}
.portada__cuerpo > *:nth-child(5){animation-delay:.67s}

.portada__media video,.portada__media img{
  animation:kenburns 22s ease-out forwards;
  transform-origin:center 58%;
}

/* subrayado animado bajo el titular */
.portada h1::after{
  content:"";display:block;width:110px;height:4px;margin-top:.42em;
  background:linear-gradient(90deg,var(--ambar),transparent);
  transform-origin:left;transform:scaleX(0);
  animation:anchoLinea .9s cubic-bezier(.16,1,.3,1) .8s forwards;
}

/* indicador de desplazamiento */
.baja{
  position:absolute;left:50%;bottom:22px;transform:translateX(-50%);z-index:3;
  display:flex;flex-direction:column;align-items:center;gap:7px;
  color:#9FBBD4;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;
  animation:flotar 2.6s ease-in-out infinite;
}
.baja__tubo{
  width:23px;height:37px;border:2px solid rgba(255,255,255,.42);border-radius:13px;position:relative;
}
.baja__tubo::after{
  content:"";position:absolute;left:50%;top:6px;margin-left:-3px;
  width:6px;height:6px;border-radius:50%;background:var(--azul-300);
  animation:gota 2.1s ease-in-out infinite;
}
@media(max-width:700px){.baja{display:none;}}

/* ---------- barra de progreso de lectura ---------- */
.progreso{
  position:fixed;top:0;left:0;height:3px;z-index:120;width:100%;
  background:linear-gradient(90deg,var(--azul-500),var(--ambar));
  /* se anima con transform, no con width: así el navegador no rehace la maquetación en cada cuadro */
  transform:scaleX(0);transform-origin:0 50%;
  transition:transform .1s linear;will-change:transform;
}

/* encabezado que se compacta */
.encabezado{transition:box-shadow .3s ease,background .3s ease;}
.encabezado.compacto{box-shadow:0 2px 18px rgba(10,35,71,.12);}
.encabezado.compacto .marca img{height:42px;}
.marca img{transition:height .3s ease;}

/* ---------- separadores de agua ---------- */
.onda{position:relative;line-height:0;overflow:hidden;}
.onda svg{width:200%;height:52px;display:block;animation:onda 22s linear infinite;}
.onda--arriba{transform:rotate(180deg);}
@media(max-width:700px){.onda svg{height:32px;}}

/* ---------- tarjetas con elevación e imagen que respira ---------- */
.tarjeta,.tarjeta-icono,.video-tarjeta{transition:transform .38s cubic-bezier(.16,1,.3,1),box-shadow .38s ease,border-color .3s ease;}
.tarjeta:hover,.video-tarjeta:hover{transform:translateY(-7px);}
.tarjeta-icono:hover{transform:translateY(-5px);}
.tarjeta-icono__ico{transition:transform .38s cubic-bezier(.34,1.56,.64,1),background .3s ease;}
.tarjeta-icono:hover .tarjeta-icono__ico{transform:scale(1.09) rotate(-5deg);background:var(--ambar);}
.tarjeta-icono:hover .tarjeta-icono__ico svg{fill:var(--azul-900);}
.tarjeta-icono__ico svg{transition:fill .3s ease;}
.tarjeta__pie{transition:gap .28s ease,color .28s ease;}
.tarjeta__pie svg{transition:transform .28s ease;}
.tarjeta:hover .tarjeta__pie svg{transform:translateX(4px);}

/* botones con barrido de luz */
.btn{position:relative;overflow:hidden;}
.btn--primario::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(100deg,transparent 32%,rgba(255,255,255,.5) 50%,transparent 68%);
  background-size:260% 100%;background-position:-260% 0;
}
.btn--primario:hover::before{animation:brillo .85s ease;}

/* ---------- contadores ---------- */
.cifra{transition:transform .35s cubic-bezier(.16,1,.3,1);}
.cifra:hover{transform:translateY(-4px);}
.cifra__n{display:block;}

/* ---------- pasos con línea de avance ---------- */
.pasos{position:relative;}
.paso::after{
  content:"";position:absolute;top:21px;left:52px;right:-14px;height:2px;
  background:linear-gradient(90deg,var(--azul-300),transparent);
  transform-origin:left;transform:scaleX(0);
  transition:transform .8s cubic-bezier(.16,1,.3,1);transition-delay:var(--d,0ms);
}
.paso.visible::after{transform:scaleX(1);}
.paso:last-child::after{display:none;}
@media(max-width:820px){.paso::after{display:none;}}
.paso::before{transition:transform .4s cubic-bezier(.34,1.56,.64,1),background .3s ease;}
.paso:hover::before{transform:scale(1.1);background:var(--ambar);color:var(--azul-900);}

/* ---------- reproductor destacado de video ---------- */
.reproductor{display:grid;grid-template-columns:1fr 320px;gap:26px;align-items:start;}
@media(max-width:940px){.reproductor{grid-template-columns:1fr;}}

.reproductor__escenario{
  position:relative;border-radius:var(--radio);overflow:hidden;background:#061426;
  box-shadow:0 18px 50px rgba(0,0,0,.3);
}
.reproductor__escenario video{width:100%;display:block;max-height:74vh;object-fit:contain;background:#061426;}
.reproductor__pie{padding:18px 22px;background:rgba(255,255,255,.05);}
.reproductor__pie h3{margin-bottom:.2em;color:#fff;font-size:1.15rem;}
.reproductor__pie p{margin:0;color:#B9CCDD;font-size:.94rem;}

.riel{display:flex;flex-direction:column;gap:11px;max-height:74vh;overflow-y:auto;padding-right:5px;}
@media(max-width:940px){.riel{flex-direction:row;overflow-x:auto;max-height:none;padding-bottom:8px;}}
.riel::-webkit-scrollbar{width:6px;height:6px;}
.riel::-webkit-scrollbar-thumb{background:rgba(255,255,255,.22);border-radius:3px;}

.riel__item{
  display:flex;gap:12px;align-items:center;padding:9px;border-radius:11px;cursor:pointer;
  background:rgba(255,255,255,.05);border:1.5px solid transparent;text-align:left;
  transition:all .3s ease;flex-shrink:0;font-family:inherit;color:inherit;width:100%;
}
@media(max-width:940px){.riel__item{width:250px;}}
.riel__item:hover{background:rgba(255,255,255,.1);}
.riel__item[aria-current="true"]{border-color:var(--ambar);background:rgba(242,160,7,.12);}
.riel__item img{width:62px;height:62px;object-fit:cover;border-radius:8px;flex-shrink:0;}
.riel__item b{display:block;font-size:.9rem;color:#fff;line-height:1.3;margin-bottom:.15em;}
.riel__item span{font-size:.78rem;color:#9FBBD4;line-height:1.35;display:block;}
.riel__item .dur{
  display:inline-block;margin-top:.3em;font-size:.7rem;color:var(--ambar);
  font-weight:700;letter-spacing:.04em;
}

/* ---------- galería: revelado escalonado ---------- */
.mosaico figure{transition:transform .4s cubic-bezier(.16,1,.3,1),opacity .5s ease;}
.mosaico figure:hover{transform:translateY(-5px);}
.mosaico figure::before{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(to top,rgba(10,35,71,.6),transparent 45%);
  opacity:0;transition:opacity .35s ease;
}
.mosaico figure:hover::before{opacity:1;}
.mosaico .lupa{
  position:absolute;right:12px;bottom:12px;z-index:2;width:36px;height:36px;border-radius:50%;
  background:var(--ambar);display:flex;align-items:center;justify-content:center;
  opacity:0;transform:scale(.7);transition:all .35s cubic-bezier(.34,1.56,.64,1);pointer-events:none;
}
.mosaico figure:hover .lupa{opacity:1;transform:scale(1);}
.mosaico .lupa svg{width:17px;height:17px;fill:var(--azul-900);}

/* visor con entrada suave */
.visor{opacity:0;transition:opacity .3s ease;}
.visor.activo{opacity:1;}
.visor img{transform:scale(.94);transition:transform .4s cubic-bezier(.16,1,.3,1);}
.visor.activo img{transform:scale(1);}

/* ---------- filtros ---------- */
.filtro{position:relative;overflow:hidden;}
.filtro::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--ambar);
  transform:scaleX(0);transform-origin:center;transition:transform .3s ease;
}
.filtro:hover::after{transform:scaleX(1);}

/* ---------- columna pegajosa en servicios ---------- */
@media(min-width:861px){
  .dividido__media--fija{position:sticky;top:calc(var(--header-h) + 26px);}
}
.dividido__media img{transition:transform .6s cubic-bezier(.16,1,.3,1);}
.dividido__media:hover img{transform:scale(1.02);}

/* marco de teléfono para video vertical */
.marco-v{
  max-width:300px;margin:0 auto;border-radius:24px;overflow:hidden;
  border:8px solid var(--azul-900);box-shadow:var(--sombra);background:#061426;
}
.marco-v video{aspect-ratio:9/16;object-fit:cover;width:100%;display:block;}

/* ---------- respeto absoluto a la preferencia del sistema ---------- */
@media(prefers-reduced-motion:reduce){
  [data-reveal],[data-reveal].visible{opacity:1!important;transform:none!important;clip-path:none!important;}
  .portada__cuerpo > *{opacity:1!important;animation:none!important;}
  .portada__media video,.portada__media img{animation:none!important;}
  .portada h1::after{animation:none!important;transform:scaleX(1)!important;}
  .onda svg{animation:none!important;}
  .baja{animation:none!important;}
  .baja__tubo::after{animation:none!important;}
  .paso::after{transform:scaleX(1)!important;}
}

/* ==========================================================================
   REFINAMIENTO EDITORIAL
   Tomado del lenguaje visual de los sitios de referencia:
   tipografía editorial, media a sangre y carga progresiva de imagen.
   ========================================================================== */

/* ---------- acento en cursiva serif dentro del titular ---------- */
.acento{
  font-family:Georgia,"Times New Roman",serif;
  font-style:italic;font-weight:400;
  color:var(--ambar);
  letter-spacing:-.005em;
}
.portada h1 em,.portada h1 .acento{
  font-style:italic;font-weight:400;color:var(--ambar);
}
h2 .acento{color:var(--azul-500);}
.seccion--azul h2 .acento,.cta-final h2 .acento{color:var(--ambar);}

/* titulares un punto más grandes y más ceñidos */
.portada h1{font-size:clamp(2.3rem,6vw,4.1rem);line-height:1.06;letter-spacing:-.022em;}
.portada__cuerpo{max-width:820px;}

/* ---------- carga progresiva de imagen ---------- */
img[data-cargando]{
  opacity:0;transform:scale(1.02);filter:blur(8px);
  transition:opacity .7s ease,transform .8s cubic-bezier(.16,1,.3,1),filter .7s ease;
}
img.cargada{opacity:1;transform:none;filter:none;}
.tarjeta__img,.mosaico figure,.dividido__media{background:linear-gradient(110deg,#DCE8F1 8%,#EDF4F9 18%,#DCE8F1 33%);background-size:220% 100%;animation:cargando 1.5s linear infinite;}
.tarjeta__img.listo,.mosaico figure.listo,.dividido__media.listo{animation:none;background:none;}
@keyframes cargando{to{background-position:-220% 0;}}

/* ---------- banda a sangre con foto y texto encima ---------- */
.banda{
  position:relative;min-height:clamp(420px,62vh,620px);display:flex;align-items:center;
  overflow:hidden;background:var(--azul-900);
}
.banda__media{position:absolute;inset:0;}
.banda__media img{width:100%;height:100%;object-fit:cover;}
.banda__velo{
  position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(10,35,71,.93) 0%,rgba(10,35,71,.72) 45%,rgba(10,35,71,.25) 100%);
}
.banda__cuerpo{position:relative;z-index:2;max-width:640px;padding:64px 0;color:#D8E5F0;}
.banda h2{color:#fff;font-size:clamp(1.9rem,4.4vw,3rem);}
.banda p{color:#C6D8E8;font-size:1.06rem;}
.banda .lista-check li{color:#D8E5F0;}
.banda .lista-check li::before{background-color:var(--ambar);}
@media(max-width:760px){
  .banda__velo{background:linear-gradient(180deg,rgba(10,35,71,.82) 0%,rgba(10,35,71,.93) 100%);}
  .banda__cuerpo{max-width:none;}
}

/* ---------- foco que sigue al cursor en las tarjetas ---------- */
.tarjeta,.tarjeta-icono{position:relative;isolation:isolate;}
.tarjeta::before,.tarjeta-icono::before{
  content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;opacity:0;
  background:radial-gradient(340px circle at var(--mx,50%) var(--my,50%),rgba(27,123,168,.12),transparent 62%);
  transition:opacity .35s ease;
}
.tarjeta:hover::before,.tarjeta-icono:hover::before{opacity:1;}

/* ---------- pastilla de categoría sobre la foto ---------- */
.tarjeta__img{position:relative;}
.pastilla{
  position:absolute;left:12px;top:12px;z-index:2;
  background:rgba(10,35,71,.82);color:#fff;font-size:.7rem;font-weight:700;
  letter-spacing:.09em;text-transform:uppercase;padding:.34em .8em;border-radius:99px;
  backdrop-filter:blur(6px);
}

/* ---------- galería: primera foto a doble tamaño ---------- */
.mosaico figure.destacada{column-span:all;}
@media(min-width:901px){
  .mosaico{column-count:3;}
}

@media(prefers-reduced-motion:reduce){
  img[data-cargando]{opacity:1!important;transform:none!important;filter:none!important;}
  .tarjeta__img,.mosaico figure,.dividido__media{animation:none!important;background:none!important;}
}

/* ==========================================================================
   MEDALLÓN DEL LOGO — a caballo entre la portada y la sección siguiente
   ========================================================================== */
.medallon{
  position:relative;z-index:5;margin:-62px auto 0;width:max-content;
  background:#fff;border-radius:18px;padding:14px 26px;
  box-shadow:0 10px 34px rgba(10,35,71,.20), 0 2px 8px rgba(10,35,71,.10);
  border:1px solid var(--gris-claro);
  animation:surgir .9s cubic-bezier(.16,1,.3,1) .85s both;
}
.medallon img{height:74px;width:auto;display:block;}
@media(max-width:700px){
  .medallon{margin-top:-44px;padding:10px 16px;border-radius:14px;}
  .medallon img{height:52px;}
}
.tras-medallon{padding-top:34px;}

/* ==========================================================================
   CARRUSEL
   ========================================================================== */
.carrusel{position:relative;}
.carrusel__pista{
  display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;
  scroll-behavior:smooth;padding:6px 2px 20px;
  scrollbar-width:none;-ms-overflow-style:none;
}
.carrusel__pista::-webkit-scrollbar{display:none;}

.diapo{
  flex:0 0 auto;scroll-snap-align:center;position:relative;
  width:min(74vw,880px);border-radius:var(--radio);overflow:hidden;
  background:var(--azul-900);box-shadow:var(--sombra);
  transition:transform .5s cubic-bezier(.16,1,.3,1),box-shadow .5s ease,opacity .5s ease;
}
@media(max-width:820px){.diapo{width:88vw;}}
.diapo img{width:100%;aspect-ratio:16/10;object-fit:cover;display:block;}
@media(max-width:600px){.diapo img{aspect-ratio:4/3;}}
.diapo__texto{
  position:absolute;left:0;right:0;bottom:0;padding:56px 26px 22px;color:#fff;
  background:linear-gradient(to top,rgba(6,20,38,.93) 8%,rgba(6,20,38,.55) 55%,transparent 100%);
}
.diapo__texto h3{color:#fff;margin-bottom:.18em;font-size:clamp(1.1rem,2.3vw,1.5rem);}
.diapo__texto p{margin:0;color:#C6D8E8;font-size:.95rem;max-width:56ch;}
.diapo__marca{
  position:absolute;left:16px;top:16px;z-index:2;
  background:rgba(242,160,7,.94);color:var(--azul-900);
  font-size:.7rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;
  padding:.36em .85em;border-radius:99px;
}
/* la diapositiva que no está centrada se atenúa un poco */
.diapo:not(.activa){opacity:.55;transform:scale(.955);}
.diapo.activa{opacity:1;}

.carrusel__mandos{
  display:flex;align-items:center;justify-content:center;gap:16px;margin-top:6px;
}
.carrusel__btn{
  width:48px;height:48px;border-radius:50%;flex-shrink:0;cursor:pointer;
  background:#fff;border:1.5px solid var(--gris-claro);color:var(--azul-900);
  display:flex;align-items:center;justify-content:center;transition:all var(--trans);
}
.carrusel__btn:hover{background:var(--azul-900);border-color:var(--azul-900);color:#fff;transform:scale(1.06);}
.carrusel__btn:disabled{opacity:.35;cursor:default;transform:none;}
.carrusel__ant,.carrusel__sig{/* ganchos de JS; el estilo lo da .carrusel__btn */}
.carrusel__btn svg{width:21px;height:21px;fill:currentColor;}
.seccion--azul .carrusel__btn{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.28);color:#fff;}
.seccion--azul .carrusel__btn:hover{background:var(--ambar);border-color:var(--ambar);color:var(--azul-900);}

.carrusel__puntos{display:flex;gap:8px;align-items:center;}
.carrusel__punto{
  width:9px;height:9px;border-radius:99px;border:0;padding:0;cursor:pointer;
  background:var(--gris-claro);transition:all .3s ease;
}
.carrusel__punto[aria-current="true"]{width:30px;background:var(--ambar);}
.seccion--azul .carrusel__punto{background:rgba(255,255,255,.28);}
.seccion--azul .carrusel__punto[aria-current="true"]{background:var(--ambar);}

/* barra de avance del autoplay */
.carrusel__tiempo{
  height:2px;background:var(--gris-claro);border-radius:2px;overflow:hidden;
  max-width:260px;margin:14px auto 0;
}
.carrusel__tiempo i{display:block;height:100%;width:0;background:var(--ambar);}
.seccion--azul .carrusel__tiempo{background:rgba(255,255,255,.2);}

/* ==========================================================================
   ESTRUCTURA MÁS RICA
   ========================================================================== */
/* cinta de logros / palabras clave que se desplaza */
.cinta{
  background:var(--azul-900);color:#fff;overflow:hidden;padding:15px 0;
  border-top:1px solid rgba(255,255,255,.09);border-bottom:1px solid rgba(255,255,255,.09);
}
.cinta__pista{display:flex;gap:0;width:max-content;animation:deslizar 38s linear infinite;}
.cinta:hover .cinta__pista{animation-play-state:paused;}
.cinta span{
  display:inline-flex;align-items:center;gap:.6em;padding:0 26px;white-space:nowrap;
  font-weight:600;font-size:.95rem;color:#C6D8E8;letter-spacing:.01em;
}
.cinta span::after{content:"";width:5px;height:5px;border-radius:50%;background:var(--ambar);}
@keyframes deslizar{from{transform:translateX(0);}to{transform:translateX(-50%);}}

/* rejilla asimétrica tipo mosaico editorial */
.mosaico-edit{
  display:grid;gap:16px;
  grid-template-columns:repeat(4,1fr);
  grid-auto-rows:170px;
}
.mosaico-edit figure{
  margin:0;position:relative;border-radius:var(--radio);overflow:hidden;
  background:var(--azul-100);cursor:pointer;
}
.mosaico-edit img{width:100%;height:100%;object-fit:cover;transition:transform .55s cubic-bezier(.16,1,.3,1);}
.mosaico-edit figure:hover img{transform:scale(1.06);}
.mosaico-edit figure::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(to top,rgba(10,35,71,.55),transparent 48%);
  opacity:0;transition:opacity .35s ease;
}
.mosaico-edit figure:hover::after{opacity:1;}
.mosaico-edit .g2x2{grid-column:span 2;grid-row:span 2;}
.mosaico-edit .g2x1{grid-column:span 2;}
.mosaico-edit .g1x2{grid-row:span 2;}
@media(max-width:900px){
  .mosaico-edit{grid-template-columns:repeat(2,1fr);grid-auto-rows:150px;}
  .mosaico-edit .g2x2{grid-column:span 2;grid-row:span 2;}
}
@media(max-width:520px){
  .mosaico-edit{grid-template-columns:1fr 1fr;grid-auto-rows:118px;}
}

/* franja de dos columnas con dato grande */
.dato-par{display:grid;grid-template-columns:auto 1fr;gap:22px;align-items:center;
  padding:22px 24px;background:#fff;border:1px solid var(--gris-claro);border-radius:var(--radio);}
.dato-par b{font-family:Georgia,serif;font-size:2.5rem;color:var(--azul-500);line-height:1;}
.dato-par span{color:var(--gris);font-size:.95rem;}

@media(prefers-reduced-motion:reduce){
  .cinta__pista{animation:none!important;}
  .medallon{animation:none!important;}
  .diapo:not(.activa){opacity:1;transform:none;}
  .carrusel__pista{scroll-behavior:auto;}
}

/* ========================================================================== 
   DIRECCIÓN VISUAL 2026 — INDUSTRIAL EDITORIAL
   Alto contraste, superficies profundas y componentes tipo bento.
   ========================================================================== */
:root{
  --azul-950:#041426;
  --azul-900:#071B33;
  --azul-800:#0B294A;
  --azul-700:#123D67;
  --azul-500:#1787B8;
  --azul-100:#E6F3F8;
  --ambar:#FFAE19;
  --ambar-osc:#D98800;
  --hueso:#F3F6F8;
  --gris-claro:#D8E1E7;
  --radio:22px;
  --radio-sm:12px;
  --sombra:0 18px 55px rgba(4,20,38,.11),0 2px 8px rgba(4,20,38,.06);
  --ancho:1240px;
}

body{background:var(--hueso);}
h1,h2{font-family:"Arial Narrow","Roboto Condensed","Segoe UI",Arial,sans-serif;font-weight:800;letter-spacing:-.045em;}
h3,h4{font-family:"Segoe UI",Arial,sans-serif;letter-spacing:-.02em;}
.seccion{position:relative;}
.seccion:not(.seccion--gris):not(.seccion--azul):not(.cta-final){background:#fff;}
.etiqueta{
  padding:.48rem .78rem;border:1px solid currentColor;border-radius:999px;
  letter-spacing:.12em;line-height:1;background:rgba(255,255,255,.04);
}

/* navegación oscura y translúcida */
.encabezado{
  background:rgba(4,20,38,.91);border-bottom:1px solid rgba(255,255,255,.1);
  box-shadow:none;backdrop-filter:saturate(150%) blur(18px);
}
.encabezado.compacto{background:rgba(4,20,38,.96);box-shadow:0 12px 38px rgba(4,20,38,.2);}
.marca img{height:52px;background:#fff;border-radius:10px;padding:4px 8px;box-shadow:0 5px 18px rgba(0,0,0,.16);}
.nav a{color:#DCE8F1;border:1px solid transparent;border-radius:999px;padding:.5em .9em;}
.nav a:hover{color:#fff;background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.08);}
.nav a[aria-current="page"]{color:var(--azul-950);background:var(--ambar);border-color:var(--ambar);}
.encabezado__tel{color:#fff;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);padding:.5em .8em;border-radius:999px;}
.encabezado__tel:hover{color:var(--ambar);}
.encabezado__tel svg{fill:var(--ambar);}
.hamburguesa span{background:#fff;}

/* portada cinematográfica */
.portada{min-height:clamp(620px,88vh,850px);isolation:isolate;}
.portada::before{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:
    radial-gradient(circle at 82% 18%,rgba(23,135,184,.28),transparent 31%),
    linear-gradient(90deg,rgba(4,20,38,.98) 0%,rgba(4,20,38,.84) 43%,rgba(4,20,38,.22) 78%,rgba(4,20,38,.4) 100%);
}
.portada__velo{background:linear-gradient(0deg,rgba(4,20,38,.64),transparent 48%);z-index:1;}
.portada__cuerpo{padding:clamp(90px,12vh,140px) 0 150px;max-width:790px;}
.portada__cuerpo .etiqueta{border-color:rgba(255,174,25,.55);background:rgba(4,20,38,.35);backdrop-filter:blur(8px);}
.portada h1{font-size:clamp(3rem,6.4vw,5.5rem);line-height:.96;text-wrap:balance;text-shadow:0 8px 30px rgba(0,0,0,.35);}
.portada h1::after{width:150px;height:5px;border-radius:4px;}
.portada__texto{max-width:690px;color:#DCE9F3;font-size:clamp(1.05rem,1.6vw,1.24rem);}
.portada__datos{gap:10px;margin-top:2rem;}
.portada__datos li{padding:.5rem .7rem;border:1px solid rgba(255,255,255,.13);border-radius:999px;background:rgba(4,20,38,.28);backdrop-filter:blur(7px);}
.sonido{background:rgba(4,20,38,.62);border-color:rgba(255,255,255,.3);backdrop-filter:blur(8px);}

/* controles y superficies */
.btn{border-radius:999px;padding:.92em 1.7em;letter-spacing:-.01em;}
.btn--primario{box-shadow:0 10px 28px rgba(255,174,25,.24);}
.btn--wa{box-shadow:0 10px 28px rgba(37,211,102,.18);}
.medallon{border-radius:999px;padding:11px 24px;border:1px solid rgba(4,20,38,.1);}
.medallon img{height:62px;}
.cifras{background:linear-gradient(115deg,var(--azul-950),var(--azul-800));}
.cifras__rejilla{gap:0;padding:38px 0;}
.cifra{border-right:1px solid rgba(255,255,255,.12);padding:12px 24px;}
.cifra:last-child{border-right:0;}
.cifra__n{font-family:"Arial Narrow","Segoe UI",sans-serif;text-transform:uppercase;font-size:clamp(1.65rem,3vw,2.45rem);letter-spacing:-.04em;}
.cifra__t{max-width:230px;margin:.45rem auto 0;line-height:1.4;}
.cinta{background:#020D19;padding:13px 0;}

.tarjeta{
  border:1px solid var(--gris-claro);border-radius:var(--radio);background:#fff;
  box-shadow:0 1px 0 rgba(4,20,38,.04);overflow:hidden;
}
.tarjeta:hover{border-color:rgba(23,135,184,.5);box-shadow:var(--sombra);transform:translateY(-9px);}
.tarjeta__img{min-height:240px;}
.tarjeta__cuerpo{padding:24px;}
.tarjeta__cuerpo h3{font-size:1.28rem;}
.pastilla{left:16px;top:16px;padding:.5em .9em;background:rgba(4,20,38,.82);border:1px solid rgba(255,255,255,.16);}
.tarjeta-icono{border-radius:var(--radio);border-color:var(--gris-claro);box-shadow:0 1px 0 rgba(4,20,38,.04);}
.tarjeta-icono:hover{box-shadow:var(--sombra);border-color:rgba(23,135,184,.42);}

/* cabeceras interiores con fotografía real */
.portada-int{min-height:410px;display:flex;align-items:end;padding:95px 0 72px;background:var(--azul-950);isolation:isolate;}
.portada-int::before{content:"";position:absolute;inset:0;z-index:-2;background-size:cover;background-position:center;filter:saturate(.82);transform:scale(1.015);}
.portada-int::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(4,20,38,.97) 0%,rgba(4,20,38,.83) 50%,rgba(4,20,38,.35) 100%);border-radius:0;transform:none;width:auto;height:auto;right:0;top:0;}
.portada-int--servicios::before{background-image:url('../img/detalle-ademe-tuberia-lg.webp');background-position:center 54%;}
.portada-int--proyectos::before{background-image:url('../img/perforadora-entre-agaves-xl.webp');}
.portada-int--galeria::before{background-image:url('../img/torre-atardecer-xl.webp');}
.portada-int--nosotros::before{background-image:url('../img/cuadrilla-equipo-completo-xl.webp');}
.portada-int--contacto::before{background-image:url('../img/camion-perforadora-atardecer-xl.webp');}
.portada-int--privacidad::before{background-image:url('../img/torre-perforacion-cielo-azul-lg.webp');}
.portada-int .contenedor{width:100%;}
.portada-int h1{font-size:clamp(2.6rem,5.5vw,4.8rem);max-width:900px;text-wrap:balance;}
.portada-int p:not(.miga){font-size:1.12rem;color:#D4E2ED;max-width:720px;}
.miga{display:inline-flex!important;padding:.38rem .68rem;border:1px solid rgba(255,255,255,.18);border-radius:999px;background:rgba(4,20,38,.28);font-size:.86rem!important;backdrop-filter:blur(8px);}
.miga a{color:var(--ambar);}

/* proyectos incompletos permanecen en el código, pero no se publican */
.pendiente,.borrador{display:none!important;}
.nota-segura{margin-top:14px;padding:13px 16px;border-radius:14px;background:var(--azul-100);color:var(--azul-800);font-size:.88rem;border:1px solid rgba(23,135,184,.2);}
.formulario{border-radius:var(--radio);border-color:var(--gris-claro);box-shadow:var(--sombra);}
.campo input,.campo select,.campo textarea{border-radius:12px;background:#FAFCFD;border-color:#C9D5DE;}
.campo input:focus,.campo select:focus,.campo textarea:focus{box-shadow:0 0 0 4px rgba(23,135,184,.12);}

/* carrusel: pausa visible y objetivos táctiles amplios */
.carrusel__pausa{
  width:48px;height:48px;border-radius:50%;border:1.5px solid var(--gris-claro);
  background:#fff;color:var(--azul-900);font:700 1rem/1 "Segoe UI",sans-serif;cursor:pointer;
  transition:all var(--trans);display:flex;align-items:center;justify-content:center;
}
.carrusel__pausa:hover,.carrusel__pausa[aria-pressed="true"]{background:var(--ambar);border-color:var(--ambar);transform:scale(1.05);}
.carrusel__punto{width:28px;height:28px;background:transparent!important;position:relative;}
.carrusel__punto::before{content:"";position:absolute;width:8px;height:8px;left:50%;top:50%;transform:translate(-50%,-50%);border-radius:99px;background:#BCC8D1;transition:all .3s ease;}
.carrusel__punto[aria-current="true"]{width:34px;}
.carrusel__punto[aria-current="true"]::before{width:26px;background:var(--ambar);}
.seccion--azul .carrusel__punto::before{background:rgba(255,255,255,.34);}
.seccion--azul .carrusel__punto[aria-current="true"]::before{background:var(--ambar);}

.cta-final{background:radial-gradient(circle at 15% 20%,rgba(23,135,184,.26),transparent 30%),linear-gradient(135deg,var(--azul-950),var(--azul-800));overflow:hidden;}
.cta-final::after{content:"";position:absolute;width:360px;height:360px;border:1px solid rgba(255,255,255,.08);border-radius:50%;right:-110px;top:-180px;box-shadow:0 0 0 55px rgba(255,255,255,.025),0 0 0 110px rgba(255,255,255,.018);}
.cta-final .contenedor{position:relative;z-index:1;}
.pie{background:#020D19;}
.pie__logo img{background:#fff;border-radius:12px;padding:7px 10px;}

@media(max-width:1000px){
  .nav{background:rgba(4,20,38,.98);border-bottom-color:rgba(255,255,255,.1);}
  .nav a{border-radius:12px;color:#DCE8F1;}
  .nav a:hover{background:rgba(255,255,255,.08);}
}
@media(max-width:760px){
  .portada{min-height:770px;align-items:flex-start;}
  .portada::before{background:linear-gradient(180deg,rgba(4,20,38,.78) 0%,rgba(4,20,38,.93) 68%,rgba(4,20,38,.98) 100%);}
  .portada__media video,.portada__media img{object-position:56% center;}
  .portada__cuerpo{padding:58px 0 110px;}
  .portada h1{font-size:clamp(2.6rem,13vw,4rem);}
  .portada__datos{display:none;}
  .portada .grupo-btn{display:grid;grid-template-columns:1fr;}
  .portada .btn{width:100%;}
  .medallon{margin-top:-36px;}
  .cifras__rejilla{grid-template-columns:1fr 1fr;padding:28px 0;}
  .cifra{border-right:0;border-bottom:1px solid rgba(255,255,255,.1);padding:18px 12px;}
  .cifra:nth-last-child(-n+2){border-bottom:0;}
  .portada-int{min-height:370px;padding:105px 0 56px;}
  .portada-int::after{background:linear-gradient(180deg,rgba(4,20,38,.58),rgba(4,20,38,.96));}
  .portada-int h1{font-size:clamp(2.4rem,12vw,3.7rem);}
  .tarjeta__img{min-height:220px;}
  .seccion{padding:58px 0;}
  .barra-movil{background:rgba(255,255,255,.94);backdrop-filter:blur(16px);border-top:1px solid rgba(4,20,38,.1);box-shadow:0 -8px 30px rgba(4,20,38,.1);}
}

@media(prefers-reduced-motion:reduce){
  .portada-int::before{transform:none!important;}
  .carrusel__pausa{display:none;}
}

/* ========================================================================
   Portada fotográfica y videos compactos — refinamiento cinematográfico
   ======================================================================== */
.marca--texto{
  min-width:172px;display:grid;gap:0;color:#fff;text-decoration:none;line-height:1;
  letter-spacing:.02em;
}
.marca--texto span{
  color:var(--ambar);font-size:.64rem;font-weight:800;letter-spacing:.28em;text-transform:uppercase;
}
.marca--texto strong{
  margin-top:5px;color:#fff;font-family:"Arial Narrow","Segoe UI",sans-serif;
  font-size:1.12rem;font-weight:900;letter-spacing:.055em;text-transform:uppercase;
}
.encabezado.compacto .marca--texto strong{font-size:1.04rem;}

.portada{isolation:isolate;}
.portada__media.portada-slider{inset:0;transform:none!important;overflow:hidden;background:#041426;}
.portada-slide{
  position:absolute;inset:0;display:block;opacity:0;visibility:hidden;
  transition:opacity 1.15s cubic-bezier(.22,.61,.36,1),visibility 1.15s;
  will-change:opacity;
}
.portada-slide.activa{opacity:1;visibility:visible;z-index:1;}
.portada-slide img{
  width:100%;height:100%;object-fit:cover;filter:saturate(.9) contrast(1.07) brightness(.88);
  transform:scale(1.025);will-change:transform;
}
.portada-slide.activa img{animation:portada-zoom 7s cubic-bezier(.2,.58,.36,1) both;}
.portada-slide:nth-child(1) img{object-position:62% 58%;}
.portada-slide:nth-child(2) img{object-position:58% 54%;}
.portada-slide:nth-child(3) img{object-position:64% 52%;}
.portada-slide:nth-child(4) img{object-position:63% 52%;}
@keyframes portada-zoom{from{transform:scale(1.025)}to{transform:scale(1.105)}}
.portada::before{
  background:
    linear-gradient(90deg,rgba(4,20,38,.98) 0%,rgba(4,20,38,.9) 34%,rgba(4,20,38,.48) 63%,rgba(4,20,38,.16) 100%),
    linear-gradient(0deg,rgba(4,20,38,.68),transparent 45%);
}
.portada__velo{
  background:radial-gradient(circle at 76% 47%,transparent 0 18%,rgba(4,20,38,.12) 55%,rgba(4,20,38,.35) 100%);
}
.portada .contenedor,.portada-mandos,.portada .baja{z-index:3;}
.portada-mandos{
  position:absolute;right:max(28px,calc((100vw - 1180px)/2));bottom:78px;
  display:grid;grid-template-columns:42px auto 42px 42px;align-items:center;gap:8px;
  padding:8px;border:1px solid rgba(255,255,255,.16);border-radius:999px;
  background:rgba(4,20,38,.6);box-shadow:0 18px 55px rgba(0,0,0,.25);
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
}
.portada-mandos button{font-family:inherit;}
.portada-mandos__flecha,.portada-mandos__pausa{
  width:42px;height:42px;display:grid;place-items:center;border:0;border-radius:50%;
  background:rgba(255,255,255,.08);color:#fff;font-size:1.12rem;cursor:pointer;
  transition:transform .25s ease,background .25s ease,color .25s ease;
}
.portada-mandos__flecha:hover,.portada-mandos__pausa:hover,
.portada-mandos__pausa[aria-pressed="true"]{background:var(--ambar);color:var(--azul-950);transform:scale(1.06);}
.portada-mandos__puntos{display:flex;align-items:center;gap:2px;padding:0 4px;}
.portada-mandos__puntos button{width:28px;height:38px;border:0;background:transparent;position:relative;cursor:pointer;}
.portada-mandos__puntos button::before{
  content:"";position:absolute;left:50%;top:50%;width:7px;height:7px;border-radius:99px;
  background:rgba(255,255,255,.48);transform:translate(-50%,-50%);transition:.3s ease;
}
.portada-mandos__puntos button[aria-current="true"]::before{width:23px;background:var(--ambar);}
.portada-mandos__tiempo{
  grid-column:1/-1;height:2px;margin:0 8px 3px;border-radius:9px;background:rgba(255,255,255,.13);overflow:hidden;
}
.portada-mandos__tiempo i{display:block;width:0;height:100%;border-radius:inherit;background:var(--ambar);}
.cifras{border-top:1px solid rgba(255,255,255,.08);}

/* Los clips conservan su tamaño y se apoyan en un fondo desenfocado del propio fotograma. */
.reproductor{
  --video-poster:url('../video/hero-agua-brotando.jpg');
  display:block;max-width:940px;margin-inline:auto;
}
.reproductor__escenario{
  max-width:780px;margin-inline:auto;position:relative;isolation:isolate;overflow:hidden;
  border:1px solid rgba(255,255,255,.14);border-radius:24px;
  background:#041426;box-shadow:0 30px 80px rgba(0,0,0,.28);
}
.reproductor__escenario::before{
  content:"";position:absolute;inset:-45px;z-index:-2;background-image:var(--video-poster);
  background-size:cover;background-position:center;filter:blur(28px) saturate(.82) brightness(.46);
  transform:scale(1.18);opacity:.92;transition:background-image .25s ease;
}
.reproductor__escenario::after{
  content:"";position:absolute;inset:0;z-index:2;pointer-events:none;opacity:.075;
  background:repeating-linear-gradient(0deg,rgba(255,255,255,.32) 0 1px,transparent 1px 3px);
  mix-blend-mode:soft-light;
}
.reproductor__escenario video{
  position:relative;z-index:1;width:min(100%,720px);height:clamp(260px,40vw,400px);margin-inline:auto;
  display:block;object-fit:contain;background:rgba(4,20,38,.3);border-radius:18px 18px 0 0;
  filter:contrast(1.07) saturate(.92) brightness(.96);transition:opacity .22s ease,width .3s ease;
}
.reproductor__escenario.es-vertical video{width:min(280px,58vw);}
.reproductor__pie{position:relative;z-index:3;padding:17px 22px 19px;background:rgba(4,20,38,.82);backdrop-filter:blur(12px);}
.reproductor__pie p{max-width:680px;}
.riel{
  display:flex;flex-direction:row;gap:11px;max-width:900px;max-height:none;margin:18px auto 0;
  padding:3px 3px 11px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;scrollbar-width:thin;
}
.riel__item{
  flex:0 0 218px;min-height:86px;scroll-snap-align:start;border-radius:15px;
  background:rgba(255,255,255,.055);border-color:rgba(255,255,255,.13);
}
.riel__item[aria-current="true"]{transform:translateY(-2px);box-shadow:0 10px 30px rgba(242,160,7,.12);}
.riel__item img{width:66px;height:66px;}
.video-auto{
  display:grid;grid-template-columns:40px auto 1fr;align-items:center;gap:12px;max-width:780px;
  margin:7px auto 0;color:#9FBBD4;font-size:.75rem;letter-spacing:.05em;text-transform:uppercase;
}
.video-auto__pausa{
  width:40px;height:40px;display:grid;place-items:center;border-radius:50%;border:1px solid rgba(255,255,255,.18);
  color:#fff;background:rgba(255,255,255,.06);cursor:pointer;transition:.25s ease;
}
.video-auto__pausa:hover,.video-auto__pausa[aria-pressed="true"]{background:var(--ambar);border-color:var(--ambar);color:var(--azul-950);}
.video-auto__progreso{height:3px;border-radius:9px;background:rgba(255,255,255,.13);overflow:hidden;}
.video-auto__progreso i{display:block;width:0;height:100%;background:linear-gradient(90deg,var(--ambar),#FFD45A);border-radius:inherit;}

@media(max-width:760px){
  .marca--texto{min-width:144px;}
  .marca--texto span{font-size:.54rem;}
  .marca--texto strong{font-size:.98rem;}
  .portada{min-height:790px;}
  .portada::before{background:linear-gradient(180deg,rgba(4,20,38,.36) 0%,rgba(4,20,38,.78) 43%,rgba(4,20,38,.98) 78%);}
  .portada-slide:nth-child(n) img{object-position:64% center;}
  .portada__cuerpo{padding-bottom:170px;}
  .portada-mandos{left:20px;right:auto;bottom:73px;grid-template-columns:38px auto 38px 38px;max-width:calc(100% - 40px);}
  .portada-mandos__flecha,.portada-mandos__pausa{width:38px;height:38px;}
  .portada-mandos__puntos button{width:22px;}
  .reproductor__escenario{border-radius:18px;}
  .reproductor__escenario video{height:clamp(220px,68vw,320px);}
  .reproductor__escenario.es-vertical video{width:min(230px,68vw);}
  .riel__item{flex-basis:190px;}
  .video-auto{grid-template-columns:40px 1fr;}
  .video-auto__texto{font-size:.67rem;}
  .video-auto__progreso{grid-column:1/-1;}
}

@media(prefers-reduced-motion:reduce){
  .portada-slide,.portada-slide img{transition:none!important;animation:none!important;}
  .portada-mandos__tiempo,.video-auto__progreso{display:none;}
}

/* ========================================================================
   Sistema visual industrial 2026 — navegación, tarjetas e imagen editorial
   ======================================================================== */
@media(min-width:1001px){
  .encabezado__fila{
    display:grid;grid-template-columns:168px minmax(570px,1fr) 168px;
    gap:8px;height:78px;
  }
  .marca--texto{min-width:0;width:168px;}
  .nav{margin:0;justify-self:center;}
  .nav ul{gap:2px;}
  .nav a{padding:.5em .72em;font-size:.89rem;}
  .encabezado__tel{justify-self:end;font-size:.9rem;padding:.48em .68em;}
}

/* Los cuatro datos dejan de parecer una barra de menú y pasan a ser pruebas de confianza. */
.cifras{padding:22px 0;background:linear-gradient(125deg,#031323,#0A315A);}
.cifras__rejilla{grid-template-columns:repeat(4,1fr);gap:12px;padding:0;}
.cifra{
  min-height:132px;display:flex;flex-direction:column;justify-content:center;
  padding:20px 18px!important;border:1px solid rgba(255,255,255,.1)!important;border-radius:16px;
  background:linear-gradient(145deg,rgba(255,255,255,.075),rgba(255,255,255,.025));
  box-shadow:inset 0 1px rgba(255,255,255,.07),0 14px 34px rgba(0,0,0,.1);
}
.cifra__n{font-size:clamp(1.45rem,2.25vw,2rem);letter-spacing:-.025em;}
.cifra__t{font-size:.82rem;max-width:250px;}

/* Baraja de servicios: se presenta compacta y se abre al entrar en pantalla. */
.servicios-cartas{perspective:1500px;isolation:isolate;}
.servicios-cartas .tarjeta{
  position:relative;will-change:transform,opacity;
  transition:transform 1.05s cubic-bezier(.16,1,.3,1),opacity .7s ease,box-shadow .38s ease,border-color .3s ease;
}
@media(min-width:1001px){
  .servicios-cartas:not(.desplegadas) .tarjeta{opacity:.72;box-shadow:0 20px 55px rgba(4,20,38,.2);}
  .servicios-cartas:not(.desplegadas) .tarjeta:nth-child(1){transform:translateX(156%) translateY(18px) rotate(-7deg) scale(.86);z-index:1;}
  .servicios-cartas:not(.desplegadas) .tarjeta:nth-child(2){transform:translateX(52%) translateY(7px) rotate(-2.3deg) scale(.91);z-index:2;}
  .servicios-cartas:not(.desplegadas) .tarjeta:nth-child(3){transform:translateX(-52%) translateY(7px) rotate(2.3deg) scale(.91);z-index:3;}
  .servicios-cartas:not(.desplegadas) .tarjeta:nth-child(4){transform:translateX(-156%) translateY(18px) rotate(7deg) scale(.86);z-index:4;}
  .servicios-cartas.desplegadas .tarjeta{transform:none;opacity:1;}
  .servicios-cartas.desplegadas .tarjeta:nth-child(1){transition-delay:0ms;}
  .servicios-cartas.desplegadas .tarjeta:nth-child(2){transition-delay:70ms;}
  .servicios-cartas.desplegadas .tarjeta:nth-child(3){transition-delay:140ms;}
  .servicios-cartas.desplegadas .tarjeta:nth-child(4){transition-delay:210ms;}
}

/* Imagen más compacta, con encuadre constante y película que disimula material desigual. */
.tarjeta__img,.dividido__media,.mosaico figure,.mosaico-edit figure,.diapo{isolation:isolate;}
.tarjeta__img{position:relative;aspect-ratio:4/3;min-height:0;height:auto;}
.tarjeta__img::after,.dividido__media::after{
  content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  background:linear-gradient(155deg,rgba(2,12,22,.05),rgba(2,12,22,.27)),radial-gradient(circle at 50% 42%,transparent 38%,rgba(2,12,22,.19));
  mix-blend-mode:multiply;
}
.tarjeta__img img,.dividido__media img,.mosaico img,.mosaico-edit img,.diapo img{
  filter:saturate(.86) contrast(1.065) brightness(.96);
}
.pastilla{z-index:3;}
.tarjeta__cuerpo{padding:21px;}
.tarjeta__cuerpo h3{font-size:1.16rem;line-height:1.18;}
.tarjeta__cuerpo p{font-size:.91rem;line-height:1.55;}

/* Botón industrial: sólido, formal y sin iconos sobredimensionados. */
.tarjeta__pie{
  width:100%;min-height:46px;margin-top:auto;padding:0 15px!important;justify-content:space-between;gap:14px!important;
  border:1px solid #173C61;border-left:4px solid var(--ambar);border-radius:7px;
  background:linear-gradient(105deg,#061B30,#0B3155);color:#fff!important;
  font-size:.77rem;font-weight:800;letter-spacing:.075em;text-transform:uppercase;
  box-shadow:inset 0 1px rgba(255,255,255,.08);clip-path:polygon(0 0,calc(100% - 11px) 0,100% 11px,100% 100%,0 100%);
}
.tarjeta__pie svg{display:none!important;}
.tarjeta__pie b{font:700 .7rem/1 "Segoe UI",sans-serif;color:var(--ambar);letter-spacing:.12em;}
.tarjeta__pie:hover{background:linear-gradient(105deg,#0B3155,#104A77);border-color:#2C638D;transform:translateY(-1px);}

/* Las páginas interiores dejan de usar fotografías altas como bloques dominantes. */
.portada-int{min-height:340px;padding:88px 0 50px;}
.portada-int::before{filter:saturate(.76) contrast(1.05) brightness(.84);}
.portada-int::after{background:linear-gradient(90deg,rgba(4,20,38,.98),rgba(4,20,38,.88) 52%,rgba(4,20,38,.53));}
.portada-int h1{font-size:clamp(2.35rem,4.7vw,4.05rem);max-width:820px;}
.portada-int p:not(.miga){font-size:1.03rem;max-width:690px;}
.dividido{grid-template-columns:minmax(0,1.08fr) minmax(330px,.78fr);gap:clamp(30px,4vw,54px);}
.dividido__media{
  position:relative;width:100%;max-width:470px;aspect-ratio:4/3;justify-self:center;
  border-radius:18px;overflow:hidden;box-shadow:0 20px 55px rgba(4,20,38,.16);
}
.dividido__media img,.dividido__media video{width:100%;height:100%;object-fit:cover;border-radius:0;box-shadow:none;}
.dividido__media:hover img{transform:scale(1.035);}

/* Galería editorial uniforme: elimina fotografías excesivamente largas. */
.mosaico{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;column-count:auto;}
.mosaico figure{height:235px;margin:0;border-radius:14px;}
.mosaico img{width:100%;height:100%;object-fit:cover;}
.mosaico figure::before{opacity:.18;background:linear-gradient(155deg,transparent 25%,rgba(2,12,22,.5));}
.mosaico-edit figure::after{opacity:.2;background:linear-gradient(155deg,transparent 28%,rgba(2,12,22,.52));}
.mosaico-edit figure:hover::after{opacity:.34;}
.diapo::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(to top,rgba(2,12,22,.62),rgba(2,12,22,.04) 58%);}
.diapo__texto,.diapo__marca{z-index:2;}

/* Mandos de carrusel discretos; las imágenes conservan el protagonismo. */
.carrusel__btn,.visor__btn{width:42px;height:42px;border-radius:10px;}
.carrusel__btn svg,.visor__btn svg{width:18px;height:18px;}

@media(max-width:1000px){
  .encabezado__fila{gap:10px;}
  .cifras__rejilla{grid-template-columns:1fr 1fr;}
  .servicios-cartas .tarjeta{opacity:1;transform:none;}
  .dividido{grid-template-columns:1fr;}
  .dividido--inv .dividido__media{order:0;}
  .dividido__media{max-width:620px;aspect-ratio:16/10;position:relative;top:auto;}
}
@media(max-width:700px){
  .cifras{padding:14px 0;}
  .cifras__rejilla{gap:8px;}
  .cifra{min-height:116px;padding:16px 12px!important;}
  .cifra__t{font-size:.74rem;}
  .mosaico{grid-template-columns:1fr 1fr;gap:9px;}
  .mosaico figure{height:170px;}
  .portada-int{min-height:315px;padding:92px 0 42px;}
  .tarjeta__img{aspect-ratio:16/10;}
}
@media(max-width:480px){
  .mosaico{grid-template-columns:1fr;}
  .mosaico figure{height:225px;}
}
@media(prefers-reduced-motion:reduce){
  .servicios-cartas .tarjeta{transform:none!important;opacity:1!important;transition:none!important;}
}

/* ========================================================================
   Firma de marca y carrusel tridimensional de trabajos
   ======================================================================== */
.seccion--servicios{padding-top:30px;}
.servicios-sello{
  position:relative;z-index:4;display:grid;place-items:center;
  width:min(214px,72vw);margin:0 auto 20px;padding:7px 10px;
  border:1px solid #C8D6E0;border-radius:14px;
  background:linear-gradient(145deg,#FFFFFF,#EEF4F8);
  box-shadow:0 14px 35px rgba(4,20,38,.12),inset 0 1px rgba(255,255,255,.9);
}
.servicios-sello::after{
  content:"";position:absolute;left:28px;right:28px;bottom:-1px;height:3px;
  border-radius:4px;background:var(--ambar);
}
.servicios-sello img{display:block;width:100%;height:auto;}

.seccion--trabajos{overflow:hidden;}
.carrusel--3d{
  --ancho-diapo:min(52vw,560px);
  max-width:1120px;margin-inline:auto;perspective:1500px;
}
.carrusel--3d .carrusel__pista{
  gap:22px;align-items:center;
  padding:24px calc((100% - var(--ancho-diapo))/2) 32px;
  perspective:1500px;scroll-padding-inline:calc((100% - var(--ancho-diapo))/2);
}
.carrusel--3d .diapo{
  flex:0 0 var(--ancho-diapo);width:var(--ancho-diapo);
  display:flex;flex-direction:column;border-radius:18px;border:1px solid rgba(255,255,255,.16);
  background:#071B2E;box-shadow:0 22px 48px rgba(4,20,38,.22);
  transform-style:preserve-3d;cursor:pointer;opacity:.52;
  transition:transform .72s cubic-bezier(.16,1,.3,1),opacity .5s ease,box-shadow .6s ease;
}
.carrusel--3d .diapo::before{
  content:"";position:absolute;z-index:0;inset:0 0 96px;
  background-image:linear-gradient(rgba(3,15,27,.32),rgba(3,15,27,.42)),var(--fondo-diapo);
  background-size:cover;background-position:center;filter:blur(15px) saturate(.72);
  transform:scale(1.09);opacity:.86;
}
.carrusel--3d .diapo::after{
  inset:0 0 96px;z-index:2;
  background:linear-gradient(145deg,rgba(3,15,27,.08),rgba(3,15,27,.3));
}
.carrusel--3d .diapo[data-lado="izq"]{
  transform:perspective(1100px) rotateY(20deg) scale(.84);transform-origin:right center;
}
.carrusel--3d .diapo[data-lado="der"]{
  transform:perspective(1100px) rotateY(-20deg) scale(.84);transform-origin:left center;
}
.carrusel--3d .diapo.activa{
  opacity:1;transform:perspective(1100px) rotateY(0) translateZ(18px) scale(1);
  box-shadow:0 28px 65px rgba(4,20,38,.3);
}
.carrusel--3d .diapo>img{
  position:relative;z-index:1;width:100%;height:clamp(285px,32vw,390px);
  aspect-ratio:auto;object-fit:contain;background:transparent;
  filter:saturate(.91) contrast(1.045) brightness(.96);
}
.carrusel--3d .diapo__marca{z-index:4;box-shadow:0 6px 18px rgba(4,20,38,.2);}
.carrusel--3d .diapo__texto{
  position:relative;z-index:4;left:auto;right:auto;bottom:auto;
  min-height:96px;margin-top:auto;padding:16px 20px 17px;
  border-top:1px solid rgba(255,255,255,.12);
  background:linear-gradient(110deg,#06182A,#0B3153);
}
.carrusel--3d .diapo__texto h3{font-size:1.08rem;margin-bottom:4px;}
.carrusel--3d .diapo__texto p{font-size:.83rem;line-height:1.45;color:#C9D8E5;}
.carrusel--3d .carrusel__mandos{margin-top:0;}
.carrusel--3d .carrusel__tiempo{max-width:190px;}

@media(max-width:760px){
  .seccion--servicios{padding-top:22px;}
  .servicios-sello{width:min(194px,68vw);margin-bottom:16px;}
  .carrusel--3d{--ancho-diapo:min(78vw,430px);}
  .carrusel--3d .carrusel__pista{gap:14px;padding-top:14px;}
  .carrusel--3d .diapo[data-lado="izq"]{transform:perspective(900px) rotateY(12deg) scale(.9);}
  .carrusel--3d .diapo[data-lado="der"]{transform:perspective(900px) rotateY(-12deg) scale(.9);}
  .carrusel--3d .diapo>img{height:clamp(275px,82vw,350px);}
  .carrusel--3d .diapo__texto{min-height:104px;padding:14px 16px 15px;}
}
@media(max-width:480px){
  .carrusel--3d{--ancho-diapo:84vw;}
  .carrusel--3d .diapo>img{height:76vw;max-height:330px;}
  .carrusel--3d .carrusel__mandos{gap:7px;}
}
@media(prefers-reduced-motion:reduce){
  .carrusel--3d .diapo,.carrusel--3d .diapo[data-lado]{transform:none!important;transition:none!important;}
}

/* ========================================================================
   Corte geológico animado — del equipo de perforación al acuífero
   ======================================================================== */
.servicios-sello{
  width:min(414px,88vw);margin-bottom:26px;padding:10px 14px;border-radius:18px;
  box-shadow:0 18px 46px rgba(4,20,38,.15),inset 0 1px rgba(255,255,255,.95);
}
.servicios-sello::after{left:54px;right:54px;height:4px;}

.corte-geologico{
  position:relative;isolation:isolate;min-height:clamp(330px,38vw,500px);
  overflow:hidden;background:#071724;border-block:1px solid rgba(242,160,7,.24);
}
.corte-geologico::before{
  content:"";position:absolute;inset:-3%;z-index:-3;
  background:url('../img/corte-geologico-acuifero.webp') 30% 50%/cover no-repeat;
  animation:estratosVivos 15s ease-in-out infinite alternate;
  will-change:transform;
}
.corte-geologico::after{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:
    linear-gradient(90deg,rgba(4,16,28,.08) 0%,transparent 45%,rgba(4,16,28,.48) 100%),
    linear-gradient(180deg,rgba(4,16,28,.08),transparent 44%,rgba(0,20,36,.17));
}
.corte-geologico__velo{
  position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.18;
  background:repeating-linear-gradient(0deg,transparent 0 47px,rgba(255,255,255,.075) 47px 48px);
  mix-blend-mode:soft-light;
}
.corte-geologico__pulso{
  position:absolute;z-index:2;left:30.55%;top:38%;bottom:10%;width:4px;
  border-radius:6px;transform-origin:top;
  background:linear-gradient(180deg,#F2A007 0%,#FFE49A 34%,#39C8F3 100%);
  box-shadow:0 0 10px rgba(242,160,7,.75),0 0 22px rgba(45,197,240,.58);
  animation:barrenoActivo 4.2s cubic-bezier(.45,0,.2,1) infinite;
}
.corte-geologico__pulso::before{
  content:"";position:absolute;left:50%;top:0;width:14px;height:72px;transform:translateX(-50%);
  border-radius:50%;background:linear-gradient(180deg,transparent,rgba(255,255,255,.95),transparent);
  filter:blur(2px);animation:luzDescendente 2.8s ease-in-out infinite;
}
.corte-geologico__pulso::after{
  content:"";position:absolute;left:50%;bottom:-7px;width:54px;height:18px;
  border:2px solid rgba(91,218,255,.86);border-radius:50%;
  transform:translateX(-50%);animation:ecoAgua 2.5s ease-out infinite;
}
.corte-geologico__mensaje{
  position:absolute;z-index:3;right:clamp(18px,5vw,76px);top:clamp(22px,5vw,62px);
  display:flex;flex-direction:column;gap:3px;max-width:330px;padding:16px 20px 17px;
  border:1px solid rgba(255,255,255,.2);border-left:4px solid var(--ambar);border-radius:10px;
  background:rgba(4,20,38,.76);color:#fff;box-shadow:0 16px 42px rgba(0,0,0,.25);
  backdrop-filter:blur(12px);
}
.corte-geologico__mensaje span{
  color:var(--ambar);font-size:.68rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
}
.corte-geologico__mensaje strong{font-family:var(--fuente-titulo);font-size:clamp(1.2rem,2vw,1.72rem);line-height:1.12;}
.seccion--videos{border-top:0;}
.seccion--videos .dur{display:none;}

@keyframes estratosVivos{
  0%{transform:scale(1.01) translate3d(0,0,0);filter:saturate(.9) contrast(1.03);}
  100%{transform:scale(1.045) translate3d(-.45%,-.6%,0);filter:saturate(1) contrast(1.07);}
}
@keyframes barrenoActivo{
  0%,12%{transform:scaleY(.06);opacity:.18;}
  58%,86%{transform:scaleY(1);opacity:.95;}
  100%{transform:scaleY(1);opacity:.22;}
}
@keyframes luzDescendente{
  0%{top:-5%;opacity:0;}
  18%{opacity:1;}
  82%{opacity:1;}
  100%{top:88%;opacity:0;}
}
@keyframes ecoAgua{
  0%{transform:translateX(-50%) scale(.35);opacity:.9;}
  100%{transform:translateX(-50%) scale(1.9);opacity:0;}
}

@media(max-width:760px){
  .servicios-sello{width:min(360px,88vw);margin-bottom:20px;padding:9px 12px;}
  .servicios-sello::after{left:42px;right:42px;}
  .corte-geologico{min-height:360px;}
  .corte-geologico::before{background-position:30% 50%;}
  .corte-geologico__mensaje{right:15px;top:16px;max-width:230px;padding:12px 14px;}
  .corte-geologico__mensaje strong{font-size:1.2rem;}
}
@media(prefers-reduced-motion:reduce){
  .corte-geologico::before,.corte-geologico__pulso,.corte-geologico__pulso::before,.corte-geologico__pulso::after{
    animation:none!important;
  }
  .corte-geologico__pulso{transform:scaleY(1);opacity:.72;}
}

/* ========================================================================
   Escena integrada — subsuelo realista + carrusel de video 3D infinito
   ======================================================================== */
.seccion--videos{
  position:relative;isolation:isolate;min-height:clamp(690px,61vw,820px);
  padding:48px 0 54px;overflow:hidden;background:#071724;
  border-block:1px solid rgba(242,160,7,.25);
}
.seccion--videos::before{
  content:"";position:absolute;inset:-3%;z-index:-3;
  background:url('../img/corte-geologico-acuifero-v2.webp') 30% 50%/cover no-repeat;
  animation:estratosVivos 16s ease-in-out infinite alternate;will-change:transform;
}
.seccion--videos::after{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:
    linear-gradient(90deg,rgba(3,13,23,.04) 0%,rgba(3,13,23,.08) 34%,rgba(3,16,29,.66) 52%,rgba(3,16,29,.9) 100%),
    linear-gradient(180deg,rgba(3,13,23,.05),transparent 36%,rgba(3,13,23,.22));
}
.seccion--videos>.contenedor{
  position:relative;z-index:4;width:min(760px,55vw);max-width:none;
  margin-left:auto;margin-right:clamp(22px,4vw,68px);padding-inline:0;
}
.seccion--videos .centrado{text-align:left;margin-bottom:22px!important;}
.seccion--videos .centrado .limite{margin-left:0;max-width:620px;color:#D6E2EB;}
.seccion--videos .centrado h2{font-size:clamp(2rem,3.7vw,3.25rem);margin-bottom:.28em;color:#fff;}
.seccion--videos .etiqueta{color:var(--ambar);border-color:rgba(242,160,7,.72);}
.seccion--videos .corte-geologico__pulso{left:29.75%;top:39%;bottom:8%;}

.reproductor--3d{
  --video-poster:url('../video/hero-agua-brotando.jpg');
  position:relative;isolation:isolate;max-width:720px;min-height:500px;margin:0;
  padding:16px 82px 72px;perspective:1500px;
}
.reproductor--3d::before{
  content:"";position:absolute;z-index:-1;inset:10% 5% 18%;border-radius:46%;
  background-image:var(--video-poster);background-size:cover;background-position:center;
  filter:blur(48px) saturate(.72) brightness(.38);opacity:.58;transform:scale(1.05);
  transition:background-image .25s ease;
}
.reproductor--3d>div:first-child{position:relative;z-index:4;transform-style:preserve-3d;}
.reproductor--3d .reproductor__escenario{
  width:min(100%,440px);height:410px;margin-inline:auto;border-radius:22px;
  border:1px solid rgba(255,255,255,.3);outline:1px solid rgba(242,160,7,.18);
  box-shadow:0 28px 70px rgba(0,0,0,.44),0 0 38px rgba(34,153,204,.12);
  transform:translateZ(44px);transition:transform .6s cubic-bezier(.16,1,.3,1),box-shadow .5s ease;
}
.reproductor--3d .reproductor__escenario::before{inset:-36px;filter:blur(30px) saturate(.8) brightness(.4);}
.reproductor--3d .reproductor__escenario::after{
  opacity:.12;background:linear-gradient(115deg,rgba(255,255,255,.16),transparent 38%),repeating-linear-gradient(0deg,rgba(255,255,255,.2) 0 1px,transparent 1px 4px);
}
.reproductor--3d .reproductor__escenario video{
  width:100%;height:318px;border-radius:21px 21px 0 0;object-fit:contain;
  background:rgba(2,12,22,.44);
}
.reproductor--3d .reproductor__escenario.es-vertical video{width:min(230px,56%);height:318px;}
.reproductor--3d .reproductor__pie{
  min-height:91px;padding:14px 18px 16px;background:linear-gradient(110deg,rgba(3,17,30,.96),rgba(8,43,70,.94));
}
.reproductor--3d .reproductor__pie h3{font-size:1.03rem;}
.reproductor--3d .reproductor__pie p{font-size:.79rem;line-height:1.4;}

.reproductor--3d .riel{
  position:absolute;z-index:2;inset:28px 0 100px;display:block;max-width:none;max-height:none;
  margin:0;padding:0;overflow:visible;pointer-events:none;perspective:1300px;
}
.reproductor--3d .riel__item{
  position:absolute;top:50%;left:50%;display:block;width:220px;height:320px;min-height:0;
  padding:9px;border:1px solid rgba(255,255,255,.25);border-radius:19px;overflow:hidden;
  background:linear-gradient(145deg,rgba(9,39,64,.91),rgba(3,17,30,.96));
  box-shadow:0 24px 54px rgba(0,0,0,.38);opacity:0;pointer-events:none;
  transform:translate(-50%,-50%) scale(.64);transform-style:preserve-3d;
  transition:transform .72s cubic-bezier(.16,1,.3,1),opacity .45s ease,filter .45s ease;
}
.reproductor--3d .riel__item::after{
  content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;
  background:linear-gradient(120deg,rgba(255,255,255,.13),transparent 38%,rgba(2,12,22,.38));
}
.reproductor--3d .riel__item[data-posicion="anterior"]{
  z-index:1;opacity:.62;pointer-events:auto;cursor:pointer;
  transform:translate(-108%,-50%) rotateY(34deg) scale(.78);transform-origin:right center;
  filter:saturate(.74) brightness(.78);
}
.reproductor--3d .riel__item[data-posicion="siguiente"]{
  z-index:1;opacity:.62;pointer-events:auto;cursor:pointer;
  transform:translate(8%,-50%) rotateY(-34deg) scale(.78);transform-origin:left center;
  filter:saturate(.74) brightness(.78);
}
.reproductor--3d .riel__item[data-posicion="anterior"]:hover,
.reproductor--3d .riel__item[data-posicion="siguiente"]:hover{opacity:.88;filter:saturate(.94) brightness(.92);}
.reproductor--3d .riel__item[data-posicion="activo"],
.reproductor--3d .riel__item[data-posicion="oculto"]{visibility:hidden;}
.reproductor--3d .riel__item img{width:100%;height:205px;border-radius:12px;object-fit:cover;filter:contrast(1.06) saturate(.83);}
.reproductor--3d .riel__item>span{position:relative;z-index:2;display:block;padding:11px 7px 5px;text-align:left;}
.reproductor--3d .riel__item b{display:block;margin-bottom:5px;font-size:.83rem;line-height:1.22;color:#fff;}
.reproductor--3d .riel__item b+span{display:block;font-size:.68rem;line-height:1.35;color:#B8CBDA;}

.reproductor--3d .video-auto{
  position:absolute;z-index:6;left:50%;bottom:4px;transform:translateX(-50%);
  width:min(100%,530px);display:grid;grid-template-columns:40px 40px auto minmax(90px,1fr) 40px;
  gap:9px;margin:0;padding:8px 10px;border:1px solid rgba(255,255,255,.15);border-radius:14px;
  background:rgba(3,17,30,.72);backdrop-filter:blur(14px);box-shadow:0 12px 32px rgba(0,0,0,.24);
}
.video-auto__flecha{
  width:40px;height:40px;display:grid;place-items:center;border-radius:9px;
  border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.06);color:#fff;
  font:700 1rem/1 Arial,sans-serif;cursor:pointer;transition:.25s ease;
}
.video-auto__flecha:hover{background:var(--ambar);border-color:var(--ambar);color:var(--azul-950);transform:translateY(-1px);}
.reproductor--3d .video-auto__progreso{grid-column:auto;}

@media(max-width:940px){
  .seccion--videos{min-height:920px;padding:230px 0 48px;}
  .seccion--videos::before{background-position:27% 50%;}
  .seccion--videos::after{background:linear-gradient(180deg,rgba(3,13,23,.02) 0%,rgba(3,13,23,.14) 25%,rgba(3,16,29,.82) 46%,rgba(3,16,29,.96) 100%);}
  .seccion--videos>.contenedor{width:calc(100% - 28px);margin-inline:auto;}
  .seccion--videos .centrado{text-align:center;}
  .seccion--videos .centrado .limite{margin-inline:auto;}
  .seccion--videos .corte-geologico__pulso{left:27%;}
  .reproductor--3d{margin-inline:auto;}
}
@media(max-width:600px){
  .seccion--videos{min-height:850px;padding-top:210px;}
  .reproductor--3d{min-height:466px;padding:12px 34px 70px;}
  .reproductor--3d .reproductor__escenario{width:min(82vw,360px);height:356px;}
  .reproductor--3d .reproductor__escenario video{height:268px;}
  .reproductor--3d .reproductor__escenario.es-vertical video{width:min(185px,55%);height:268px;}
  .reproductor--3d .reproductor__pie{min-height:87px;padding:12px 14px;}
  .reproductor--3d .reproductor__pie p{display:none;}
  .reproductor--3d .riel{inset:22px 0 96px;}
  .reproductor--3d .riel__item{width:155px;height:254px;padding:7px;}
  .reproductor--3d .riel__item img{height:160px;}
  .reproductor--3d .riel__item b+span{display:none;}
  .reproductor--3d .riel__item[data-posicion="anterior"]{transform:translate(-104%,-50%) rotateY(28deg) scale(.72);}
  .reproductor--3d .riel__item[data-posicion="siguiente"]{transform:translate(4%,-50%) rotateY(-28deg) scale(.72);}
  .reproductor--3d .video-auto{width:min(94vw,430px);grid-template-columns:38px 38px 1fr 38px;}
  .reproductor--3d .video-auto__texto{display:none;}
  .reproductor--3d .video-auto__progreso{grid-column:auto;}
  .video-auto__flecha,.reproductor--3d .video-auto__pausa{width:38px;height:38px;}
}
@media(prefers-reduced-motion:reduce){
  .seccion--videos::before,.seccion--videos .corte-geologico__pulso,.seccion--videos .corte-geologico__pulso::before,.seccion--videos .corte-geologico__pulso::after{
    animation:none!important;
  }
  .reproductor--3d .riel__item{transition:none!important;}
}

/* Carrusel de videos con la misma lectura tridimensional que Trabajos realizados. */
.video-carrusel{position:relative;max-width:720px;min-height:535px;margin-inline:auto;perspective:1500px;}
.video-carrusel__escena{position:relative;height:430px;perspective:1500px;transform-style:preserve-3d;}
.video-diapo{
  position:absolute;left:50%;top:50%;width:min(62%,430px);height:360px;margin:0;
  opacity:0;visibility:hidden;pointer-events:none;transform:translate(-50%,-50%) scale(.66);
  transform-style:preserve-3d;transition:transform .72s cubic-bezier(.16,1,.3,1),opacity .48s ease,filter .48s ease;
}
.video-diapo[data-posicion="activo"]{
  z-index:4;opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,-50%) translateZ(42px) scale(1);
}
.video-diapo[data-posicion="anterior"]{
  z-index:2;opacity:.57;visibility:visible;pointer-events:auto;cursor:pointer;
  transform:translate(-108%,-50%) rotateY(34deg) scale(.78);transform-origin:right center;filter:saturate(.72) brightness(.74);
}
.video-diapo[data-posicion="siguiente"]{
  z-index:2;opacity:.57;visibility:visible;pointer-events:auto;cursor:pointer;
  transform:translate(8%,-50%) rotateY(-34deg) scale(.78);transform-origin:left center;filter:saturate(.72) brightness(.74);
}
.video-diapo[data-posicion="anterior"]:hover,.video-diapo[data-posicion="siguiente"]:hover{opacity:.82;filter:saturate(.9) brightness(.88);}
.video-diapo__marco{
  position:relative;isolation:isolate;width:100%;height:100%;overflow:hidden;border-radius:22px;
  border:1px solid rgba(231,244,255,.7);outline:1px solid rgba(242,160,7,.18);
  background:rgba(3,17,31,.08);box-shadow:0 24px 62px rgba(0,0,0,.44),0 0 34px rgba(73,191,232,.16);
  -webkit-box-reflect:below 12px linear-gradient(transparent 72%,rgba(216,241,255,.13));
}
.video-diapo[data-posicion="activo"] .video-diapo__marco{
  border-color:rgba(255,255,255,.84);outline-color:rgba(242,160,7,.48);
  box-shadow:0 30px 72px rgba(0,0,0,.48),0 0 42px rgba(67,190,232,.22);
}
.video-diapo__marco::before{
  content:"";position:absolute;inset:-34px;z-index:0;background-image:var(--poster);
  background-size:cover;background-position:center;filter:blur(27px) saturate(.95) brightness(.7);
  transform:scale(1.2);opacity:1;
}
.video-diapo__marco::after{
  content:"";position:absolute;inset:0;z-index:2;pointer-events:none;border-radius:inherit;
  background:radial-gradient(circle at 50% 46%,transparent 48%,rgba(1,10,18,.28) 100%),linear-gradient(120deg,rgba(255,255,255,.1),transparent 34%);
  box-shadow:inset 0 0 25px rgba(176,225,246,.12);
}
.video-diapo video{
  position:relative;z-index:1;display:block;width:100%;height:100%;object-fit:contain;
  background:transparent;filter:contrast(1.055) saturate(.91) brightness(.97);
}
.video-carrusel__mandos{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:15px;}
.video-carrusel__flecha,.video-carrusel__pausa{
  width:42px;height:42px;display:grid;place-items:center;flex:0 0 auto;border-radius:50%;
  border:1px solid rgba(235,247,255,.48);background:rgba(4,20,38,.26);color:#fff;
  font:700 .92rem/1 Arial,sans-serif;cursor:pointer;backdrop-filter:blur(9px);
  box-shadow:0 7px 20px rgba(0,0,0,.2);transition:.25s ease;
}
.video-carrusel__flecha:hover,.video-carrusel__pausa:hover,.video-carrusel__pausa[aria-pressed="true"]{
  background:var(--ambar);border-color:var(--ambar);color:var(--azul-950);transform:translateY(-2px);
}
.video-carrusel__puntos{display:flex;align-items:center;gap:5px;}
.video-carrusel__puntos button{
  position:relative;width:25px;height:30px;padding:0;border:0;background:transparent;cursor:pointer;
}
.video-carrusel__puntos button::before{
  content:"";position:absolute;left:50%;top:50%;width:7px;height:7px;border-radius:20px;
  transform:translate(-50%,-50%);background:rgba(230,243,252,.48);transition:.28s ease;
}
.video-carrusel__puntos button[aria-current="true"]::before{width:23px;background:var(--ambar);}
.video-carrusel__progreso{width:min(260px,52%);height:2px;margin:11px auto 0;border-radius:4px;background:rgba(255,255,255,.2);overflow:hidden;}
.video-carrusel__progreso i{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--ambar),#FDE298);}
.video-carrusel__estado{
  position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;
  overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;
}

@media(max-width:600px){
  .video-carrusel{min-height:455px;}
  .video-carrusel__escena{height:354px;}
  .video-diapo{width:min(78vw,330px);height:300px;}
  .video-diapo[data-posicion="anterior"]{transform:translate(-93%,-50%) rotateY(26deg) scale(.7);}
  .video-diapo[data-posicion="siguiente"]{transform:translate(-7%,-50%) rotateY(-26deg) scale(.7);}
  .video-diapo__marco{border-radius:17px;-webkit-box-reflect:below 8px linear-gradient(transparent 78%,rgba(216,241,255,.1));}
  .video-carrusel__mandos{gap:7px;}
  .video-carrusel__flecha,.video-carrusel__pausa{width:38px;height:38px;}
  .video-carrusel__puntos{gap:1px;}
  .video-carrusel__puntos button{width:18px;}
}
@media(prefers-reduced-motion:reduce){
  .video-diapo{transition:none!important;}
  .video-carrusel__progreso{display:none;}
}

/* Profundidad final: laterales parciales y movimiento ambiental por capas. */
.video-carrusel{max-width:min(720px,100%);contain:layout paint;}
.video-carrusel__escena{
  overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 9%,#000 91%,transparent 100%);
  mask-image:linear-gradient(90deg,transparent 0,#000 9%,#000 91%,transparent 100%);
}
.video-diapo[data-posicion="anterior"]{
  z-index:1;opacity:.3;transform:translate(-137%,-50%) rotateY(38deg) scale(.68);
  filter:saturate(.58) brightness(.58) blur(.7px);
}
.video-diapo[data-posicion="siguiente"]{
  z-index:1;opacity:.3;transform:translate(37%,-50%) rotateY(-38deg) scale(.68);
  filter:saturate(.58) brightness(.58) blur(.7px);
}
.video-diapo[data-posicion="anterior"]:hover,.video-diapo[data-posicion="siguiente"]:hover{
  opacity:.48;filter:saturate(.72) brightness(.7) blur(.35px);
}
.video-diapo[data-posicion="activo"]{z-index:5;}

.corte-geologico__nubes{
  position:absolute;z-index:0;left:-12%;right:-12%;top:0;height:39%;pointer-events:none;
  opacity:.7;filter:blur(9px);mix-blend-mode:screen;
  background:
    radial-gradient(ellipse at 12% 55%,rgba(225,241,250,.18) 0 7%,transparent 24%),
    radial-gradient(ellipse at 38% 42%,rgba(225,241,250,.12) 0 9%,transparent 25%),
    radial-gradient(ellipse at 68% 56%,rgba(225,241,250,.13) 0 8%,transparent 24%),
    radial-gradient(ellipse at 91% 34%,rgba(255,226,172,.1) 0 6%,transparent 20%);
  animation:nubesDeriva 20s ease-in-out infinite alternate;
}
.corte-geologico__nubes::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(105deg,transparent 10%,rgba(201,233,249,.12) 38%,transparent 60%);
  transform:translateX(-38%);animation:luzCielo 11s ease-in-out infinite;
}
.corte-geologico__actividad{
  position:absolute;z-index:1;left:24%;top:22%;width:17%;height:19%;pointer-events:none;
}
.corte-geologico__actividad::before{
  content:"";position:absolute;left:4%;right:4%;bottom:-5%;height:34%;border-radius:50%;
  background:radial-gradient(ellipse,rgba(209,184,139,.24),rgba(154,125,81,.1) 48%,transparent 72%);
  filter:blur(7px);animation:polvoEquipo 4.8s ease-in-out infinite;
}
.corte-geologico__actividad::after{
  content:"";position:absolute;right:20%;bottom:27%;width:13px;height:13px;border-radius:50%;
  background:#F2A007;box-shadow:0 0 9px #F2A007,0 0 22px rgba(242,160,7,.68);
  animation:maquinaTrabajando 1.35s ease-in-out infinite;
}
.corte-geologico__actividad i{
  position:absolute;right:17%;bottom:17%;width:2px;height:18px;border-radius:5px;
  background:rgba(255,226,153,.72);box-shadow:5px 2px rgba(255,226,153,.32),-5px -1px rgba(255,226,153,.28);
  transform-origin:bottom;animation:vibracionEquipo .42s linear infinite alternate;
}
.seccion--videos .corte-geologico__pulso{left:37.1%;top:39%;bottom:9%;}

.corte-geologico__agua{
  position:absolute;z-index:1;left:0;right:0;bottom:0;height:44%;overflow:hidden;pointer-events:none;
  opacity:.92;mix-blend-mode:screen;
  -webkit-mask-image:linear-gradient(180deg,transparent 0,rgba(0,0,0,.42) 22%,#000 55%);
  mask-image:linear-gradient(180deg,transparent 0,rgba(0,0,0,.42) 22%,#000 55%);
}
.corte-geologico__agua::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(100deg,transparent 0 18%,rgba(36,189,237,.06) 28%,rgba(87,224,255,.4) 44%,rgba(47,185,229,.08) 56%,transparent 68%);
  background-size:58% 100%;filter:blur(5px);animation:flujoSubterraneo 7.5s linear infinite;
}
.corte-geologico__agua::after{
  content:"";position:absolute;left:3%;right:2%;bottom:-18%;height:58%;
  border-radius:50%;background:radial-gradient(ellipse,rgba(80,220,255,.35),rgba(31,174,223,.1) 45%,transparent 72%);
  filter:blur(13px);animation:acuiferoRespira 3.8s ease-in-out infinite;
}
.vena-agua{
  position:absolute;height:4px;border-radius:999px;
  background:linear-gradient(90deg,transparent,rgba(67,211,251,.48),#A7EFFF,rgba(41,190,235,.52),transparent);
  background-size:220% 100%;filter:blur(.35px) drop-shadow(0 0 5px rgba(75,215,255,.78));
  animation:venaFluye 4.4s linear infinite,venaBrilla 3.2s ease-in-out infinite;
}
.vena-agua--1{left:5%;top:58%;width:28%;transform:rotate(13deg);animation-delay:0s,-.6s;}
.vena-agua--2{left:22%;top:72%;width:35%;transform:rotate(-8deg);animation-delay:-1.4s,-1.7s;}
.vena-agua--3{left:51%;top:55%;width:28%;transform:rotate(-12deg);animation-delay:-2.6s,-.9s;}
.vena-agua--4{left:70%;top:76%;width:27%;transform:rotate(7deg);animation-delay:-3.3s,-2.1s;}

@keyframes nubesDeriva{
  0%{transform:translate3d(-1.5%,0,0) scale(1);opacity:.5;}
  100%{transform:translate3d(2.2%,1.2%,0) scale(1.035);opacity:.78;}
}
@keyframes luzCielo{
  0%,15%{transform:translateX(-42%);opacity:0;}
  45%{opacity:.85;}
  78%,100%{transform:translateX(52%);opacity:0;}
}
@keyframes polvoEquipo{
  0%,100%{transform:translate3d(-2%,2px,0) scale(.88);opacity:.18;}
  50%{transform:translate3d(5%,-3px,0) scale(1.12);opacity:.58;}
}
@keyframes maquinaTrabajando{
  0%,100%{transform:scale(.72);opacity:.35;}
  45%{transform:scale(1.16);opacity:.9;}
}
@keyframes vibracionEquipo{
  from{transform:translateX(-1px) rotate(-2deg);opacity:.42;}
  to{transform:translateX(1px) rotate(2deg);opacity:.86;}
}
@keyframes flujoSubterraneo{
  from{background-position:-75% 0;}
  to{background-position:175% 0;}
}
@keyframes acuiferoRespira{
  0%,100%{transform:scale(.96);opacity:.4;}
  50%{transform:scale(1.06);opacity:.9;}
}
@keyframes venaFluye{
  from{background-position:210% 0;}
  to{background-position:-20% 0;}
}
@keyframes venaBrilla{
  0%,100%{opacity:.28;box-shadow:0 0 3px rgba(65,208,248,.28);}
  48%{opacity:.9;box-shadow:0 0 14px rgba(91,225,255,.82);}
}

@media(max-width:940px){
  .seccion--videos .corte-geologico__pulso{left:31%;}
  .corte-geologico__actividad{left:18%;top:14%;width:25%;height:17%;}
  .corte-geologico__agua{height:42%;}
}
@media(max-width:600px){
  .video-carrusel__escena{-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);}
  .video-diapo[data-posicion="anterior"]{transform:translate(-117%,-50%) rotateY(30deg) scale(.63);opacity:.24;}
  .video-diapo[data-posicion="siguiente"]{transform:translate(17%,-50%) rotateY(-30deg) scale(.63);opacity:.24;}
  .corte-geologico__nubes{height:31%;}
  .corte-geologico__actividad{left:14%;top:12%;width:32%;}
  .corte-geologico__agua{height:38%;}
}
@media(prefers-reduced-motion:reduce){
  .corte-geologico__nubes,.corte-geologico__nubes::after,.corte-geologico__actividad::before,
  .corte-geologico__actividad::after,.corte-geologico__actividad i,.corte-geologico__agua::before,
  .corte-geologico__agua::after,.vena-agua{animation:none!important;}
}

/* Movimiento realista: la fotografía permanece registrada y sólo se animan sus píxeles. */
.seccion--videos::before{
  inset:0;
  animation:none;
  will-change:auto;
}
.corte-geologico__velo{display:none;}
.corte-geologico__nubes-reales,
.corte-geologico__maquina-real,
.corte-geologico__agua-real{
  position:absolute;
  inset:0;
  pointer-events:none;
  background:url('../img/corte-geologico-acuifero-v2.webp') 30% 50%/cover no-repeat;
}
.corte-geologico__nubes-reales{
  z-index:0;
  opacity:.13;
  mix-blend-mode:screen;
  filter:blur(1.1px) saturate(.8) brightness(1.08);
  clip-path:polygon(35% 0,100% 0,100% 39%,35% 39%);
  animation:nubesFotograficas 24s ease-in-out infinite alternate;
  will-change:transform,opacity;
}
.corte-geologico__maquina-real{
  z-index:1;
  opacity:.78;
  filter:contrast(1.035) brightness(1.035);
  clip-path:polygon(25% 0,33% 0,34% 23%,36% 23%,36% 42%,9% 42%,9% 25%,24% 25%);
  transform-origin:27% 32%;
  animation:perforadoraReal .46s steps(2,end) infinite alternate;
  will-change:transform,filter;
}
.corte-geologico__agua-real{
  z-index:1;
  opacity:.2;
  mix-blend-mode:screen;
  filter:saturate(2.35) contrast(1.13) brightness(1.18);
  -webkit-mask-image:linear-gradient(180deg,transparent 0 54%,rgba(0,0,0,.44) 63%,#000 78%);
  mask-image:linear-gradient(180deg,transparent 0 54%,rgba(0,0,0,.44) 63%,#000 78%);
  animation:venasRealesRespiran 4.6s ease-in-out infinite;
  will-change:opacity,filter;
}
.corte-geologico__agua-real::after{
  content:"";
  position:absolute;
  inset:0;
  background:url('../img/corte-geologico-acuifero-v2.webp') 30% 50%/cover no-repeat;
  opacity:0;
  mix-blend-mode:color-dodge;
  filter:saturate(3.4) contrast(1.22) brightness(1.24) hue-rotate(-4deg);
  clip-path:inset(0 100% 0 0);
  animation:flujoEnVenasReales 7.6s cubic-bezier(.42,0,.2,1) infinite;
}
@keyframes nubesFotograficas{
  0%{transform:translate3d(-.35%,0,0) scale(1.004);opacity:.08;}
  100%{transform:translate3d(1.15%,.15%,0) scale(1.012);opacity:.2;}
}
@keyframes perforadoraReal{
  0%{transform:translate3d(-.55px,0,0) rotate(-.018deg);filter:contrast(1.025) brightness(1.02);}
  100%{transform:translate3d(.55px,-.35px,0) rotate(.018deg);filter:contrast(1.045) brightness(1.055);}
}
@keyframes venasRealesRespiran{
  0%,100%{opacity:.13;filter:saturate(2.05) contrast(1.08) brightness(1.08);}
  48%{opacity:.33;filter:saturate(2.8) contrast(1.18) brightness(1.3);}
}
@keyframes flujoEnVenasReales{
  0%{clip-path:inset(0 100% 0 0);opacity:0;}
  13%{opacity:.2;}
  72%{clip-path:inset(0 0 0 0);opacity:.28;}
  100%{clip-path:inset(0 0 0 0);opacity:0;}
}

/* El propio fotograma rellena los laterales: espejo desenfocado, sin franjas negras. */
.video-diapo__marco{background:rgba(6,25,40,.06);}
.video-diapo__marco::before{
  z-index:0;
  filter:blur(24px) saturate(1.08) brightness(.83);
  transform:scaleX(-1) scale(1.23);
  opacity:1;
}
.video-diapo__marco::after{
  background:radial-gradient(circle at 50% 46%,transparent 55%,rgba(1,10,18,.09) 100%),linear-gradient(120deg,rgba(255,255,255,.09),transparent 34%);
}

@media(max-width:940px){
  .corte-geologico__nubes-reales,
  .corte-geologico__maquina-real,
  .corte-geologico__agua-real,
  .corte-geologico__agua-real::after{background-position:27% 50%;}
  .corte-geologico__maquina-real{clip-path:polygon(20% 0,36% 0,39% 35%,8% 35%,8% 18%,19% 18%);opacity:.64;}
}
@media(max-width:600px){
  .corte-geologico__nubes-reales{clip-path:polygon(31% 0,100% 0,100% 31%,31% 31%);}
  .corte-geologico__maquina-real{opacity:.52;}
  .corte-geologico__agua-real{
    -webkit-mask-image:linear-gradient(180deg,transparent 0 59%,rgba(0,0,0,.46) 68%,#000 84%);
    mask-image:linear-gradient(180deg,transparent 0 59%,rgba(0,0,0,.46) 68%,#000 84%);
  }
}
@media(prefers-reduced-motion:reduce){
  .corte-geologico__nubes-reales,.corte-geologico__maquina-real,
  .corte-geologico__agua-real,.corte-geologico__agua-real::after{animation:none!important;}
}

/* ==========================================================================
   Optimización para celular — fluidez de las animaciones
   ========================================================================== */

/* --- 1. Pausa automática fuera de pantalla ---------------------------------
   El JavaScript marca con data-fuera los bloques que salieron del área visible.
   Una animación pausada no consume CPU ni GPU, y al volver retoma donde iba.
   Aplica en todas las pantallas: es la mejora más grande y no cambia nada visual. */
[data-fuera],
[data-fuera] *,
[data-fuera]::before,
[data-fuera]::after,
[data-fuera] *::before,
[data-fuera] *::after{
  animation-play-state:paused!important;
}

/* --- 2. En celular, congelar las capas decorativas más caras ---------------
   Se conservan las capas y su aspecto; sólo se detiene el movimiento de las que
   llevan desenfoque. Un blur animado obliga al teléfono a recalcular el
   desenfoque en cada cuadro, y es lo que provoca el tirón al hacer scroll. */
@media(max-width:820px){
  .corte-geologico__nubes,
  .corte-geologico__nubes::after,
  .corte-geologico__actividad::before,
  .corte-geologico__agua::before,
  .corte-geologico__agua::after,
  .corte-geologico__nubes-reales,
  .corte-geologico__agua-real{
    animation:none!important;
    will-change:auto;
  }

  /* las vetas de agua conservan el brillo, pierden la sombra proyectada
     (drop-shadow es el filtro más costoso de todos) */
  .vena-agua{
    filter:none;
    animation:venaFluye 4.4s linear infinite;
  }

  /* la chispa de la máquina y su vibración sí se quedan: son baratas
     (sólo opacidad y transform) y dan vida a la escena */

  /* menos capas compuestas simultáneas al desplazar */
  .banda__media{will-change:auto;}
  .corte-geologico__maquina-real{will-change:transform;}
}

/* --- 3. Pantallas chicas o equipos modestos: reducir sombras ---------------
   Una sombra de 55px de difuminado sobre un elemento que se mueve se
   recalcula en cada cuadro. En celular basta con la mitad. */
@media(max-width:600px){
  .tarjeta,.tarjeta-icono,.contacto-item{box-shadow:var(--sombra-sm);}
  .wa__btn{box-shadow:0 3px 10px rgba(37,211,102,.4);}
}

/* --- 4. Respeto a quien pide menos movimiento ------------------------------
   Complementa el bloque que ya existía: detiene también lo agregado arriba. */
@media(prefers-reduced-motion:reduce){
  .corte-geologico__nubes-reales,
  .corte-geologico__maquina-real,
  .corte-geologico__agua-real,
  .cinta__pista,
  .onda svg{animation:none!important;}
  .progreso{transition:none;}
}
