@charset "UTF-8";
/* =============================================================================
   Palets Guadiana, S.L. — hoja de estilos única
   HTML5 + CSS + JS nativo. Sin frameworks, sin librerías, sin CDN.
   Método ARTEMOVIL · agosto 2026
   -----------------------------------------------------------------------------
   ÍNDICE
   01 Tokens                     11 Tipos de palets (pestañas + tarjetas)
   02 Reinicio y base            12 Cadena de suministro
   03 Utilidades y contenedores  13 Medio ambiente
   04 Botones y enlaces          14 Preguntas frecuentes
   05 Cabecera y navegación      15 Contacto y mapa
   06 Menú móvil                 16 Pie de página
   07 Hero / slideshow           17 Controles flotantes
   08 Separadores ondulados      18 Páginas legales y 404
   09 Secciones de contenido     19 Impresión
   10 Servicios                  20 Movimiento reducido
   ========================================================================== */

/* ============================ 01 · TOKENS ================================= */
:root{
  /* — Azules corporativos (medidos sobre el logotipo y el CSS original) — */
  --c-azul:            #0f6fc4;   /* azul principal (contraste AA sobre blanco) */
  --c-azul-luz:        #0096f4;   /* azul del logotipo, luminoso */
  --c-azul-osc:        #024885;   /* azul oscuro      */
  --c-marino:          #00447e;   /* azul marino      */
  --c-marino-prof:     #001527;   /* azul casi negro  */
  --c-noche:           #010538;   /* superposición del hero original */

  /* — Turquesa / verde del símbolo de reciclaje — */
  --c-turquesa:        #00757c;   /* turquesa del logotipo, oscurecido para AA */
  --c-turquesa-luz:    #40b0bf;
  --c-turquesa-marca:  #00878e;   /* turquesa exacto del símbolo, uso decorativo */
  --c-verde:           #005e49;

  /* — Neutros — */
  --c-blanco:          #ffffff;
  --c-fondo:           #ffffff;
  --c-fondo-2:         #f4f7fb;
  --c-fondo-3:         #e9f0ff;
  --c-texto:           #16202b;
  --c-texto-2:         #4a5a6a;
  --c-texto-inv:       #ffffff;
  --c-texto-inv-2:     #b9cbdf;
  --c-linea:           #dfe6ef;
  --c-linea-fuerte:    #c3d0df;
  --c-linea-inv:       rgba(255,255,255,.16);

  /* — Sombras — */
  --s-1: 0 1px 2px rgba(0,21,39,.06), 0 2px 8px rgba(0,21,39,.05);
  --s-2: 0 6px 18px rgba(0,21,39,.10);
  --s-3: 0 18px 44px rgba(0,21,39,.16);
  --s-inv: 0 20px 46px rgba(0,10,20,.42);

  /* — Radios — */
  --r-sm: 8px;
  --r-md: 14px;
  --r-lg: 22px;
  --r-pill: 999px;

  /* — Transición estándar — */
  --tr: .28s cubic-bezier(.25,.6,.3,1);

  /* — Ritmo — */
  --ancho: 1280px;
  --ancho-txt: 760px;
  --pad-x: clamp(1.1rem, .5rem + 2.4vw, 2.5rem);
  --sec-y: clamp(3.5rem, 2rem + 5vw, 6.5rem);
  --cab-h: 86px;

  /* — Tipografía: pila del sistema, alojada en el equipo del visitante — */
  --f-base: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue",
            Arial, "Noto Sans", sans-serif;
  --f-tit: var(--f-base);
}

/* ======================= 02 · REINICIO Y BASE ============================= */
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
body{
  margin:0;
  font-family:var(--f-base);
  font-size:clamp(1rem,.96rem + .15vw,1.06rem);
  line-height:1.68;
  color:var(--c-texto);
  background:var(--c-fondo);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img,svg,video{max-width:100%;height:auto;display:block;}
h1,h2,h3,h4,h5{
  font-family:var(--f-tit);
  line-height:1.16;
  margin:0 0 .6em;
  letter-spacing:-.015em;
  font-weight:800;
  color:var(--c-marino-prof);
}
h1{font-size:clamp(1.85rem,1.25rem + 2.7vw,3.5rem);}
h2{font-size:clamp(1.6rem,1.15rem + 1.9vw,2.6rem);}
h3{font-size:clamp(1.22rem,1.05rem + .7vw,1.6rem);}
h4{font-size:clamp(1.06rem,1rem + .3vw,1.2rem);}
p{margin:0 0 1.1em;}
ul,ol{margin:0 0 1.1em;padding-left:1.25rem;}
li{margin-bottom:.45em;}
a{color:var(--c-azul-osc);text-underline-offset:.18em;}
a:hover{color:var(--c-azul);}
strong{font-weight:700;}
hr{border:0;border-top:1px solid var(--c-linea);margin:2rem 0;}
:focus-visible{outline:3px solid var(--c-azul-luz);outline-offset:3px;border-radius:4px;}
::selection{background:var(--c-azul-luz);color:#fff;}

/* Saltar al contenido */
.saltar{
  position:absolute;left:.75rem;top:-100px;z-index:1200;
  background:var(--c-marino-prof);color:#fff;padding:.75rem 1.15rem;
  border-radius:0 0 var(--r-sm) var(--r-sm);font-weight:700;text-decoration:none;
  transition:top .2s ease;
}
.saltar:focus{top:0;color:#fff;}

/* ================= 03 · UTILIDADES Y CONTENEDORES ======================== */
.contenedor{width:100%;max-width:var(--ancho);margin-inline:auto;padding-inline:var(--pad-x);}
.contenedor--txt{max-width:var(--ancho-txt);}
.seccion{padding-block:var(--sec-y);position:relative;}
.seccion--claro{background:var(--c-fondo-2);}
.seccion--osc{background:var(--c-marino-prof);color:var(--c-texto-inv);}
.seccion--osc h2,.seccion--osc h3,.seccion--osc h4{color:#fff;}
.seccion--osc p{color:var(--c-texto-inv-2);}
.seccion--osc a{color:var(--c-turquesa-luz);}
/* Secciones con fondo oscuro propio: heredan el mismo tratamiento de texto */
.servicios,.ambiente,.contacto{color:var(--c-texto-inv);}
.servicios h2,.servicios h3,.servicios h4,
.ambiente h2,.ambiente h3,.ambiente h4,
.contacto h2,.contacto h3,.contacto h4{color:#fff;}
.servicios p,.ambiente p,.contacto p{color:var(--c-texto-inv-2);}
.servicios .eyebrow,.ambiente .eyebrow,.contacto .eyebrow{color:var(--c-turquesa-luz);}
.servicios .cabecera-seccion p,.ambiente .cabecera-seccion p,
.contacto .cabecera-seccion p{color:var(--c-texto-inv-2);}
.ambiente .check li{color:var(--c-texto-inv-2);}
.centro{text-align:center;}
.solo-lectores{
  position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;
}
.eyebrow{
  display:inline-flex;align-items:center;gap:.55rem;
  font-size:.78rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;
  color:var(--c-turquesa);margin:0 0 .85rem;
}
.eyebrow::before{content:"";width:26px;height:2px;background:currentColor;border-radius:2px;}
.seccion--osc .eyebrow{color:var(--c-turquesa-luz);}
.cabecera-seccion{max-width:800px;margin:0 0 clamp(2rem,1.2rem + 2vw,3.25rem);}
.cabecera-seccion.centro{margin-inline:auto;}
.cabecera-seccion p{color:var(--c-texto-2);font-size:1.06em;margin-bottom:0;}
.seccion--osc .cabecera-seccion p{color:var(--c-texto-inv-2);}

/* Aparición al entrar en pantalla */
.reveal{
  opacity:0;transform:translateY(18px);
  transition:opacity .7s ease, transform .7s cubic-bezier(.25,.6,.3,1);
}
.reveal.rx-l{transform:translateX(-22px);}
.reveal.rx-r{transform:translateX(22px);}
@media (max-width:1080px){.reveal.rx-l,.reveal.rx-r{transform:translateY(18px);}}
.reveal.is-in{opacity:1;transform:none;}
.no-js .reveal{opacity:1;transform:none;}

/* ==================== 04 · BOTONES Y ENLACES ============================= */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.6rem;
  padding:.9rem 1.6rem;min-height:48px;
  border:2px solid transparent;border-radius:var(--r-pill);
  font:inherit;font-weight:700;font-size:.96rem;line-height:1.2;
  text-decoration:none;cursor:pointer;
  transition:background var(--tr), color var(--tr), border-color var(--tr),
             transform var(--tr), box-shadow var(--tr);
}
.btn svg{width:1.1em;height:1.1em;flex:none;}
.btn--pri{background:var(--c-azul);color:#fff;box-shadow:0 8px 20px rgba(15,111,196,.30);}
.btn--pri:hover{background:var(--c-azul-osc);color:#fff;transform:translateY(-2px);
  box-shadow:0 12px 26px rgba(2,72,133,.34);}
.btn--sec{background:transparent;color:var(--c-marino);border-color:var(--c-linea-fuerte);}
.btn--sec:hover{border-color:var(--c-azul);color:var(--c-azul-osc);background:var(--c-fondo-3);}
.btn--inv{background:#fff;color:var(--c-marino-prof);}
.btn--inv:hover{background:var(--c-turquesa-luz);color:var(--c-marino-prof);transform:translateY(-2px);}
.btn--fant{background:transparent;color:#fff;border-color:var(--c-linea-inv);}
.btn--fant:hover{background:rgba(255,255,255,.12);color:#fff;border-color:#fff;}
.btn--verde{background:#25d366;color:#04310f;}
.btn--verde:hover{background:#1eb355;color:#04310f;transform:translateY(-2px);}
.btn--ancho{width:100%;}
.grupo-btn{display:flex;flex-wrap:wrap;gap:.85rem;}
.grupo-btn.centro{justify-content:center;}

.enlace-flecha{
  display:inline-flex;align-items:center;gap:.45rem;
  font-weight:700;text-decoration:none;color:var(--c-azul-osc);
}
.enlace-flecha::after{content:"→";transition:transform var(--tr);}
.enlace-flecha:hover::after{transform:translateX(5px);}

/* ================= 05 · CABECERA Y NAVEGACIÓN ============================ */
.cabecera{
  position:fixed;inset:0 0 auto;z-index:900;
  background:transparent;
  border-bottom:1px solid transparent;
  transition:background var(--tr), box-shadow var(--tr), border-color var(--tr);
}
.cabecera::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg, rgba(0,10,25,.62), rgba(0,10,25,0));
  transition:opacity var(--tr);
}
.cabecera.is-solida{
  background:rgba(255,255,255,.94);
  -webkit-backdrop-filter:saturate(180%) blur(12px);
  backdrop-filter:saturate(180%) blur(12px);
  border-bottom-color:var(--c-linea);
  box-shadow:0 6px 22px rgba(0,21,39,.08);
}
.cabecera.is-solida::before{opacity:0;}
/* Páginas interiores sin hero a sangre: cabecera sólida desde el inicio */
.cabecera--fija{background:rgba(255,255,255,.94);border-bottom-color:var(--c-linea);}
.cabecera--fija::before{opacity:0;}

.cabecera__inner{
  display:flex;align-items:center;gap:1rem;
  min-height:var(--cab-h);
  width:100%;max-width:var(--ancho);margin-inline:auto;padding-inline:var(--pad-x);
}
.marca{position:relative;display:flex;align-items:center;flex:none;text-decoration:none;}
.marca img{height:52px;width:auto;transition:height var(--tr);}
/* Sobre el hero se usa la versión blanca; con la cabecera sólida, la de color */
.marca__color{display:none;}
.cabecera.is-solida .marca__blanco,
.cabecera--fija .marca__blanco{display:none;}
.cabecera.is-solida .marca__color,
.cabecera--fija .marca__color{display:block;}
.marca__blanco img{filter:drop-shadow(0 2px 10px rgba(0,8,20,.55));}
@media(max-width:520px){.marca img{height:40px;}}

.nav{margin-left:auto;}
.nav__lista{display:flex;align-items:center;gap:.15rem;list-style:none;margin:0;padding:0;}
.nav__lista li{margin:0;}
.nav__enlace{
  position:relative;display:inline-flex;align-items:center;gap:.35rem;
  padding:.6rem .85rem;border-radius:var(--r-sm);
  font-weight:600;font-size:.95rem;text-decoration:none;white-space:nowrap;
  color:#fff;
  transition:color var(--tr), background var(--tr);
}
.cabecera.is-solida .nav__enlace,
.cabecera--fija .nav__enlace{color:var(--c-marino-prof);}
.nav__enlace::after{
  content:"";position:absolute;left:.85rem;right:.85rem;bottom:.32rem;height:2px;
  background:var(--c-turquesa-luz);border-radius:2px;
  transform:scaleX(0);transform-origin:left;transition:transform var(--tr);
}
.nav__enlace:hover::after,
.nav__enlace[aria-current]::after,
.nav__enlace.is-activo::after{transform:scaleX(1);}
.nav__enlace:hover{color:#fff;}
.cabecera.is-solida .nav__enlace:hover,
.cabecera--fija .nav__enlace:hover{color:var(--c-azul-osc);}
.nav__enlace[aria-current="page"]{font-weight:800;}

/* Desplegable de servicios */
.nav__item--desp{position:relative;}
/* Puente invisible que cubre el hueco entre el botón y el panel: sin él, el
   ratón sale del <li> al bajar y el desplegable se cierra antes de llegar. */
.nav__item--desp::after{
  content:"";position:absolute;top:100%;left:0;right:0;height:16px;
  display:none;
}
.nav__item--desp.is-abierto::after{display:block;}
.nav__desp-btn{
  font:inherit;font-weight:600;background:none;border:0;cursor:pointer;
}
.nav__flecha{width:.62em;height:.62em;border-right:2px solid currentColor;
  border-bottom:2px solid currentColor;transform:rotate(45deg);margin-top:-.22em;
  transition:transform var(--tr);}
.nav__desp-btn[aria-expanded="true"] .nav__flecha{transform:rotate(-135deg);margin-top:.12em;}
.nav__desp{
  position:absolute;top:calc(100% + 12px);left:0;min-width:300px;
  background:#fff;border:1px solid var(--c-linea);border-radius:var(--r-md);
  box-shadow:var(--s-3);padding:.5rem;margin:0;list-style:none;
  opacity:0;visibility:hidden;transform:translateY(-8px);
  transition:opacity var(--tr), transform var(--tr), visibility 0s linear var(--tr);
}
.nav__item--desp.is-abierto .nav__desp{
  opacity:1;visibility:visible;transform:none;transition-delay:0s;
}
.nav__desp a{
  display:flex;align-items:center;gap:.7rem;
  padding:.62rem .8rem;border-radius:var(--r-sm);
  color:var(--c-marino-prof);text-decoration:none;font-weight:600;font-size:.94rem;
  transition:background var(--tr), color var(--tr);
}
.nav__desp a:hover,.nav__desp a:focus-visible{background:var(--c-fondo-3);color:var(--c-azul-osc);}
.nav__desp a[aria-current="page"]{background:var(--c-fondo-3);color:var(--c-azul-osc);}
.nav__desp .num{
  width:24px;height:24px;flex:none;display:grid;place-items:center;
  border-radius:50%;background:var(--c-marino-prof);color:#fff;
  font-size:.72rem;font-weight:800;
}

.cab__acciones{display:flex;align-items:center;gap:.5rem;margin-left:.8rem;}
.cab__icono{
  display:grid;place-items:center;width:42px;height:42px;border-radius:50%;
  color:#fff;text-decoration:none;
  border:1px solid var(--c-linea-inv);
  transition:background var(--tr), color var(--tr), border-color var(--tr);
}
.cabecera.is-solida .cab__icono,
.cabecera--fija .cab__icono{color:var(--c-marino);border-color:var(--c-linea);}
.cab__icono:hover{background:var(--c-azul);color:#fff;border-color:var(--c-azul);}
.cab__icono svg{width:19px;height:19px;}
.cab__cta{padding:.7rem 1.25rem;min-height:44px;font-size:.92rem;}

/* ======================= 06 · MENÚ MÓVIL ================================= */
.hamburguesa{
  display:none;margin-left:auto;
  width:46px;height:46px;flex:none;
  background:transparent;border:1px solid var(--c-linea-inv);border-radius:var(--r-sm);
  cursor:pointer;padding:0;position:relative;
}
.cabecera.is-solida .hamburguesa,
.cabecera--fija .hamburguesa{border-color:var(--c-linea);}
.hamburguesa span{
  position:absolute;left:12px;right:12px;height:2px;border-radius:2px;
  background:#fff;transition:transform var(--tr), opacity .18s ease, background var(--tr);
}
.cabecera.is-solida .hamburguesa span,
.cabecera--fija .hamburguesa span{background:var(--c-marino-prof);}
.hamburguesa span:nth-child(1){top:15px;}
.hamburguesa span:nth-child(2){top:22px;}
.hamburguesa span:nth-child(3){top:29px;}
.hamburguesa[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.hamburguesa[aria-expanded="true"] span:nth-child(2){opacity:0;}
.hamburguesa[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

.velo{
  position:fixed;inset:0;z-index:880;background:rgba(0,12,25,.5);
  opacity:0;visibility:hidden;transition:opacity var(--tr), visibility 0s linear var(--tr);
}
body.menu-abierto .velo{opacity:1;visibility:visible;transition-delay:0s;}

@media (max-width:1080px){
  .hamburguesa{display:block;}
  .cab__acciones{display:none;}
  .nav{
    position:fixed;top:0;right:0;bottom:0;width:min(390px,88vw);z-index:890;
    background:#fff;box-shadow:-18px 0 46px rgba(0,21,39,.22);
    padding:calc(var(--cab-h) + 1rem) 1.35rem 2rem;
    overflow-y:auto;overscroll-behavior:contain;
    /* Cerrado NO se saca fuera del viewport: un panel desplazado a la derecha
       genera scroll horizontal a 360 px. Se oculta con opacidad + visibility
       y un desplazamiento corto, que además lo saca del orden de tabulación. */
    transform:translateX(26px);
    opacity:0;visibility:hidden;
    transition:transform .32s cubic-bezier(.25,.6,.3,1), opacity .26s ease,
               visibility 0s linear .32s;
    margin-left:0;
  }
  body.menu-abierto .nav{
    transform:none;opacity:1;visibility:visible;transition-delay:0s;
  }
  .nav__lista{flex-direction:column;align-items:stretch;gap:.1rem;}
  .nav__enlace,.nav__desp-btn{
    width:100%;justify-content:space-between;
    color:var(--c-marino-prof)!important;
    padding:.9rem .35rem;font-size:1.05rem;
    border-bottom:1px solid var(--c-linea);border-radius:0;
  }
  .nav__enlace::after{display:none;}
  .nav__enlace[aria-current="page"]{color:var(--c-azul-osc)!important;}
  .nav__desp{
    position:static;opacity:1;visibility:visible;transform:none;
    box-shadow:none;border:0;border-bottom:1px solid var(--c-linea);
    border-radius:0;padding:.35rem 0 .6rem .35rem;min-width:0;
    display:none;transition:none;
  }
  .nav__item--desp.is-abierto .nav__desp{display:block;}
  .nav__movil-cta{margin-top:1.4rem;display:grid;gap:.6rem;}
  .nav__movil-datos{
    margin-top:1.5rem;padding-top:1.2rem;border-top:1px solid var(--c-linea);
    font-size:.92rem;color:var(--c-texto-2);
  }
  .nav__movil-datos a{display:block;padding:.3rem 0;color:var(--c-marino);text-decoration:none;font-weight:600;}
}
@media (min-width:1081px){
  .nav__movil-cta,.nav__movil-datos{display:none;}
}

/* ==================== 07 · HERO / SLIDESHOW ============================== */
.hero{
  --salto: clamp(44px, 8.5vw, 158px);  /* cuánto baja la carretilla sobre la onda */
  position:relative;z-index:1;isolation:isolate;overflow:visible;
  min-height:min(100svh,860px);
  display:flex;align-items:flex-end;
  padding-top:calc(var(--cab-h) + clamp(2rem,6vw,5rem));
  padding-bottom:clamp(3rem,2rem + 4vw,6rem);
  background:var(--c-noche);
}
.hero__media{position:absolute;inset:0;z-index:-3;overflow:hidden;}
.hero__slide{position:absolute;inset:0;opacity:0;transition:opacity 1.4s ease;overflow:hidden;}
.hero__slide.is-on{opacity:1;}
.hero__slide img{width:100%;height:100%;object-fit:cover;transform:scale(1.03);}
.hero__slide.is-on img{animation:kenburns 12s ease-out forwards;}
.hero__slide:nth-child(even).is-on img{animation-name:kenburns-alt;}
.no-js .hero__slide:first-child{opacity:1;}
@keyframes kenburns{
  from{transform:scale(1.03) translate3d(0,0,0);}
  to  {transform:scale(1.14) translate3d(-1.4%,-1.2%,0);}
}
@keyframes kenburns-alt{
  from{transform:scale(1.14) translate3d(1.2%,-1%,0);}
  to  {transform:scale(1.03) translate3d(0,0,0);}
}
.hero__velo{
  position:absolute;inset:0;z-index:-2;
  background:
    linear-gradient(180deg, rgba(1,5,56,.78) 0%, rgba(1,5,56,.62) 42%, rgba(0,21,39,.9) 100%),
    radial-gradient(120% 90% at 78% 22%, rgba(0,135,142,.30), transparent 60%);
}

/* Motivo gráfico: trama de puntos + rutas logísticas (SVG, sin JS) */
.hero__trama{
  position:absolute;inset:0;z-index:-1;pointer-events:none;
  background-image:radial-gradient(rgba(255,255,255,.16) 1px, transparent 1px);
  background-size:28px 28px;
  -webkit-mask-image:radial-gradient(78% 72% at 32% 42%, #000 6%, transparent 76%);
  mask-image:radial-gradient(78% 72% at 32% 42%, #000 6%, transparent 76%);
}
.hero__trazado{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden;}
.hero__trazado svg{width:100%;height:100%;display:block;}

.rail{
  fill:none;stroke:rgba(255,255,255,.20);stroke-width:1.2;
  stroke-dasharray:6 8;vector-effect:non-scaling-stroke;
}
.flujo{
  fill:none;stroke:var(--c-turquesa-luz);stroke-width:1.8;stroke-linecap:round;
  vector-effect:non-scaling-stroke;
  filter:drop-shadow(0 0 6px rgba(64,176,191,.9));
  stroke-dasharray:22 978;stroke-dashoffset:1000;
  animation:flujo 9s linear infinite;
}
@keyframes flujo{to{stroke-dashoffset:-22;}}
/* Ciclos primos entre sí para que los recorridos no coincidan nunca */
.fl-a{animation-duration:7s;}
.fl-b{animation-duration:11s;animation-delay:-3s;}
.fl-c{animation-duration:13s;animation-delay:-6s;}
.fl-d{animation-duration:17s;animation-delay:-2s;}

.nodo{
  fill:none;stroke:rgba(255,255,255,.28);stroke-width:1.2;
  vector-effect:non-scaling-stroke;
}
.nodo--on{fill:rgba(64,176,191,.16);stroke:rgba(64,176,191,.75);
  animation:nodoPulso 5.3s ease-in-out infinite;}
.n-a{animation-duration:5.3s;}
.n-b{animation-duration:7.1s;animation-delay:-2s;}
.n-c{animation-duration:9.7s;animation-delay:-5s;}
@keyframes nodoPulso{0%,100%{opacity:.35;}50%{opacity:1;}}
@media (max-width:900px){
  .hero__trama{background-size:22px 22px;}
}

/* Ondulación blanca sobre la imagen del hero */
.hero__onda{
  position:absolute;left:0;right:0;bottom:-1px;z-index:1;
  height:clamp(42px,5.6vw,88px);line-height:0;pointer-events:none;
}
.hero__onda svg{width:100%;height:100%;display:block;}

/* Ondulación blanca sobre una sección con imagen de fondo */
.onda-sup{
  position:absolute;left:0;right:0;top:-1px;z-index:2;
  height:clamp(42px,5.6vw,88px);line-height:0;pointer-events:none;
}
.onda-sup svg{width:100%;height:100%;display:block;transform:scaleY(-1);}
.con-onda{padding-top:calc(var(--sec-y) + clamp(30px,4vw,60px));}

.hero__inner{
  position:relative;z-index:2;width:100%;max-width:var(--ancho);
  margin-inline:auto;padding-inline:var(--pad-x);
  display:grid;grid-template-columns:minmax(0,1.06fr) minmax(0,.94fr);
  gap:clamp(1.5rem,1rem + 3vw,3.5rem);align-items:end;
}
.hero__texto{color:#fff;max-width:640px;}
.hero__texto .eyebrow{color:var(--c-turquesa-luz);}
.hero h1{color:#fff;text-shadow:0 2px 24px rgba(0,10,30,.45);margin-bottom:.5em;}
.hero h1 em{font-style:normal;color:var(--c-turquesa-luz);}
.hero__sub{
  color:#dbe7f5;font-size:clamp(1.02rem,.96rem + .45vw,1.24rem);
  max-width:37ch;margin-bottom:1.9rem;
}
.hero__datos{
  display:flex;flex-wrap:wrap;gap:.5rem 1.6rem;margin-top:2rem;
  padding-top:1.4rem;border-top:1px solid var(--c-linea-inv);
  font-size:.88rem;color:var(--c-texto-inv-2);
}
.hero__datos b{display:block;color:#fff;font-size:1.02rem;}
.hero__figura{position:relative;z-index:3;justify-self:end;align-self:end;
  margin-bottom:calc(-1 * var(--salto));}
.hero__figura img{
  width:min(100%,540px);height:auto;
  filter:drop-shadow(0 26px 18px rgba(0,10,24,.42))
         drop-shadow(0 6px 8px rgba(0,10,24,.30));
}
@media (max-width:980px){
  .hero__inner{grid-template-columns:1fr;}
  .hero__figura{justify-self:center;margin-top:1rem;}
  .hero__figura img{width:min(84%,420px);}
  .hero__sub{max-width:none;}
}
@media (max-width:980px){
  .hero{--salto:clamp(28px,6vw,84px);}
}
@media (max-width:560px){
  .hero{min-height:auto;--salto:0px;padding-bottom:clamp(3.5rem,10vw,5rem);}
  .hero__figura{display:none;}
}

/* Numeración vertical + barra de avance */
.hero__nums{
  position:absolute;right:clamp(.7rem,2.2vw,2.2rem);top:50%;transform:translateY(-45%);
  z-index:3;display:flex;flex-direction:column;gap:.55rem;
  margin:0;padding:0;
}
.hero__num{
  display:flex;align-items:center;gap:.6rem;
  background:none;border:0;padding:.28rem .2rem;cursor:pointer;
  color:rgba(255,255,255,.6);font:inherit;
  transition:color var(--tr);
}
.hero__num:hover{color:#fff;}
.hero__num-n{
  font-size:1.05rem;font-weight:800;font-variant-numeric:tabular-nums;
  transition:font-size .45s cubic-bezier(.34,1.4,.64,1), color var(--tr);
}
.hero__num-track{
  display:block;width:2px;height:16px;border-radius:2px;
  background:rgba(255,255,255,.25);overflow:hidden;
  transition:height .45s cubic-bezier(.34,1.4,.64,1);
}
.hero__num-fill{display:block;width:100%;height:0;background:var(--c-turquesa-luz);}
.hero__num[aria-selected="true"]{color:#fff;}
.hero__num[aria-selected="true"] .hero__num-n{font-size:2.1rem;animation:numEntra .5s ease both;}
.hero__num[aria-selected="true"] .hero__num-track{height:48px;}
.hero__num[aria-selected="true"] .hero__num-fill{animation:numAvance 6.8s linear forwards;}
.hero__nums.is-paused .hero__num[aria-selected="true"] .hero__num-fill{animation:none;height:100%;}
@keyframes numEntra{
  0%{opacity:0;transform:translateY(14px) scale(.7);filter:blur(4px);}
  60%{opacity:1;filter:blur(0);}
  100%{opacity:1;transform:none;}
}
@keyframes numAvance{from{height:0;}to{height:100%;}}
@media (max-width:760px){
  .hero{display:block;}
  .hero__nums{
    position:static;transform:none;flex-direction:row;justify-content:center;
    gap:.9rem;margin-top:2rem;
  }
  .hero__num{flex-direction:column;gap:.35rem;}
  .hero__num-track{width:34px;height:2px;}
  .hero__num[aria-selected="true"] .hero__num-track{height:2px;width:52px;}
  .hero__num-fill{height:100%;width:0;}
  .hero__num[aria-selected="true"] .hero__num-fill{animation:numAvanceH 6.8s linear forwards;}
  .hero__nums.is-paused .hero__num[aria-selected="true"] .hero__num-fill{animation:none;width:100%;}
  .hero__num[aria-selected="true"] .hero__num-n{font-size:1.5rem;}
  @keyframes numAvanceH{from{width:0;}to{width:100%;}}
}

/* La sección posterior al hero deja aire para la carretilla que la invade */
.hero + .seccion{padding-top:calc(var(--sec-y) + clamp(10px,3vw,56px));}

/* Hero interior (páginas secundarias) */
.hero-int{
  position:relative;isolation:isolate;overflow:hidden;
  padding-top:calc(var(--cab-h) + clamp(3rem,7vw,5.5rem));
  padding-bottom:clamp(3.5rem,3rem + 4vw,6rem);
  background:var(--c-marino-prof);color:#fff;
}
.hero-int__bg{position:absolute;inset:0;z-index:-2;}
.hero-int__bg img{width:100%;height:100%;object-fit:cover;}
.hero-int::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(100deg, rgba(1,5,56,.92) 0%, rgba(1,5,56,.78) 48%, rgba(0,68,126,.62) 100%);
}
.hero-int h1{color:#fff;max-width:20ch;}
.hero-int__sub{color:#cfdcec;max-width:62ch;font-size:clamp(1rem,.95rem + .35vw,1.16rem);margin-bottom:0;}
.hero-int .grupo-btn{margin-top:2rem;}

/* Migas */
.migas{font-size:.85rem;margin:0 0 1.4rem;}
.migas ol{display:flex;flex-wrap:wrap;gap:.35rem .55rem;list-style:none;margin:0;padding:0;}
.migas li{margin:0;display:flex;align-items:center;gap:.55rem;color:#a9c0d8;}
.migas li+li::before{content:"›";opacity:.6;}
.migas a{color:#cfe0f1;text-decoration:none;}
.migas a:hover{color:#fff;text-decoration:underline;}
.migas [aria-current]{color:#fff;font-weight:700;}

/* ================= 08 · SEPARADORES ONDULADOS =========================== */
.onda{display:block;width:100%;height:clamp(38px,5vw,78px);line-height:0;}
.onda svg{display:block;width:100%;height:100%;}
.onda--arriba{margin-bottom:-1px;}
.onda--abajo{margin-top:-1px;}

/* ================= 09 · SECCIONES DE CONTENIDO ========================== */
.intro-grid{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:clamp(1.8rem,1rem + 3.5vw,4.5rem);align-items:center;
}
@media (max-width:900px){.intro-grid{grid-template-columns:1fr;}}
.intro-grid__media{position:relative;}
.intro-grid__media img{
  border-radius:var(--r-lg);box-shadow:var(--s-3);
  width:100%;aspect-ratio:5/6;object-fit:cover;
}
@media(max-width:900px){.intro-grid__media img{aspect-ratio:16/10;}}

/* Sello del símbolo de reciclaje desbordando la fotografía */
.intro-grid__sello{
  position:absolute;left:-clamp(10px,3vw,42px);bottom:clamp(18px,5vw,54px);
  left:clamp(-42px,-3vw,-10px);
  width:clamp(120px,15vw,178px);aspect-ratio:1;
  display:grid;place-items:center;
  background:#fff;border-radius:50%;
  box-shadow:0 18px 40px rgba(0,21,39,.22), 0 0 0 1px rgba(0,21,39,.05);
  animation:selloFlota 7s ease-in-out infinite;pointer-events:none;
}
/* El ancho se fija en el <picture>: en línea y sin ancho propio, un width en
   % sobre el <img> se resolvía contra una caja indefinida y descentraba. */
.intro-grid__sello picture{display:block;width:62%;line-height:0;}
.intro-grid__sello img{
  width:100%;height:auto;border-radius:0;box-shadow:none;aspect-ratio:auto;
  animation:selloGira 26s linear infinite;
}
.intro-grid__sello::before,
.intro-grid__sello::after{
  content:"";position:absolute;inset:-6px;border-radius:50%;
  border:1.5px solid rgba(0,117,124,.45);
  animation:selloPulso 4.6s ease-out infinite;
}
.intro-grid__sello::after{animation-delay:2.3s;}
@keyframes selloFlota{0%,100%{transform:translateY(6px);}50%{transform:translateY(-6px);}}
@keyframes selloGira{to{transform:rotate(360deg);}}
@keyframes selloPulso{
  0%{transform:scale(1);opacity:.75;}
  70%{transform:scale(1.22);opacity:0;}
  100%{transform:scale(1.22);opacity:0;}
}
@media (max-width:520px){
  .intro-grid__sello{left:auto;right:-10px;bottom:-22px;width:104px;}
}

.cifras{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:1px;background:var(--c-linea);border:1px solid var(--c-linea);
  border-radius:var(--r-md);overflow:hidden;margin-top:2rem;
}
.cifras div{background:#fff;padding:1.3rem 1.4rem;}
.cifras b{display:block;font-size:1.05rem;color:var(--c-marino-prof);font-weight:800;}
.cifras span{font-size:.88rem;color:var(--c-texto-2);}

/* ======================= 10 · SERVICIOS ================================== */
.servicios{position:relative;isolation:isolate;overflow:hidden;background:var(--c-marino-prof);}
.servicios__bg{position:absolute;inset:0;z-index:-2;overflow:hidden;}
.servicios__bg img{width:100%;height:118%;object-fit:cover;will-change:transform;}
.servicios::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(1,5,56,.93),rgba(0,21,39,.95));
}
.serv-lista{display:grid;gap:1.1rem;}
@media (min-width:760px){.serv-lista{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (min-width:1100px){
  .serv-lista{grid-template-columns:repeat(6,minmax(0,1fr));}
  .serv-card{grid-column:span 2;}
  .serv-card:nth-child(4),.serv-card:nth-child(5){grid-column:span 3;}
}
.serv-card{
  position:relative;display:flex;flex-direction:column;
  padding:1.6rem 1.5rem 1.4rem;
  background:rgba(255,255,255,.055);
  border:1px solid var(--c-linea-inv);border-radius:var(--r-lg);
  text-decoration:none;color:#fff;overflow:hidden;
  transition:background var(--tr), border-color var(--tr), transform var(--tr), box-shadow var(--tr);
}
.serv-card::after{
  content:"";position:absolute;inset:auto 0 0 0;height:3px;
  background:linear-gradient(90deg,var(--c-turquesa-luz),var(--c-azul-luz));
  transform:scaleX(0);transform-origin:left;transition:transform var(--tr);
}
.serv-card:hover,.serv-card:focus-visible{
  background:rgba(255,255,255,.1);border-color:rgba(64,176,191,.55);
  transform:translateY(-4px);box-shadow:var(--s-inv);
}
.serv-card:hover::after,.serv-card:focus-visible::after{transform:scaleX(1);}
.serv-card__num{
  font-size:2.6rem;font-weight:800;line-height:1;
  color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.42);
  margin-bottom:.6rem;font-variant-numeric:tabular-nums;
}
.serv-card:hover .serv-card__num{-webkit-text-stroke-color:var(--c-turquesa-luz);}
.serv-card__ico{
  position:absolute;top:1.4rem;right:1.4rem;
  width:42px;height:42px;display:grid;place-items:center;
  border-radius:12px;background:rgba(64,176,191,.16);color:var(--c-turquesa-luz);
  transition:background var(--tr), color var(--tr);
}
.serv-card__ico svg{width:22px;height:22px;}
.serv-card:hover .serv-card__ico{background:var(--c-turquesa-luz);color:var(--c-marino-prof);}
.serv-card h3{color:#fff;font-size:1.24rem;margin-bottom:.5rem;padding-right:3rem;}
.serv-card p{color:var(--c-texto-inv-2);font-size:.95rem;margin-bottom:1.1rem;flex:1;}
.serv-card__mas{
  display:inline-flex;align-items:center;gap:.4rem;
  font-weight:700;font-size:.9rem;color:var(--c-turquesa-luz);
}
.serv-card__mas::after{content:"→";transition:transform var(--tr);}
.serv-card:hover .serv-card__mas::after{transform:translateX(5px);}

/* Índice de servicios en páginas interiores */
.serv-otros{display:grid;gap:.75rem;}
@media(min-width:700px){.serv-otros{grid-template-columns:repeat(2,1fr);}}
.serv-otros a{
  display:flex;align-items:center;gap:.85rem;padding:.95rem 1.1rem;
  background:#fff;border:1px solid var(--c-linea);border-radius:var(--r-md);
  text-decoration:none;color:var(--c-marino-prof);font-weight:700;font-size:.96rem;
  transition:border-color var(--tr), transform var(--tr), box-shadow var(--tr);
}
.serv-otros a:hover{border-color:var(--c-azul);transform:translateY(-2px);box-shadow:var(--s-2);}
.serv-otros .num{
  width:30px;height:30px;flex:none;display:grid;place-items:center;border-radius:50%;
  background:var(--c-fondo-3);color:var(--c-azul-osc);font-size:.8rem;font-weight:800;
}

/* Bloques de la página de servicio */
.bloques{display:grid;gap:1.1rem;}
@media(min-width:720px){.bloques{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));}}
.bloque{
  padding:1.5rem 1.45rem;background:#fff;
  border:1px solid var(--c-linea);border-radius:var(--r-md);
  border-top:3px solid var(--c-azul);
}
.bloque h3{font-size:1.1rem;margin-bottom:.45rem;}
.bloque p:last-child{margin-bottom:0;}
.bloque--claro{background:var(--c-fondo-2);}

.check{list-style:none;padding:0;}
.check li{position:relative;padding-left:1.9rem;margin-bottom:.7rem;}
.check li::before{
  content:"";position:absolute;left:0;top:.42em;
  width:12px;height:7px;border-left:2.5px solid var(--c-turquesa);
  border-bottom:2.5px solid var(--c-turquesa);transform:rotate(-45deg);
}
.seccion--osc .check li::before{border-color:var(--c-turquesa-luz);}

/* ============== 11 · TIPOS DE PALETS (pestañas + tarjetas) ============== */
.tabs{margin-bottom:2.2rem;}
.tabs__lista{
  display:flex;flex-wrap:wrap;gap:.5rem;list-style:none;margin:0;padding:0;
}
.tabs__btn{
  display:inline-flex;align-items:center;gap:.5rem;
  padding:.7rem 1.25rem;min-height:46px;
  background:#fff;border:1px solid var(--c-linea-fuerte);border-radius:var(--r-pill);
  font:inherit;font-weight:700;font-size:.92rem;color:var(--c-marino);cursor:pointer;
  transition:background var(--tr), color var(--tr), border-color var(--tr);
}
.tabs__btn:hover{border-color:var(--c-azul);color:var(--c-azul-osc);}
.tabs__btn[aria-selected="true"]{
  background:var(--c-marino-prof);border-color:var(--c-marino-prof);color:#fff;
}
.tabs__panel[hidden]{display:none;}
.tabs__panel{animation:panelIn .4s ease both;}
@keyframes panelIn{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:none;}}
.no-js .tabs__lista{display:none;}
.no-js .tabs__panel[hidden]{display:block!important;}

.palets-grid{display:grid;gap:1.4rem;}
@media(min-width:720px){.palets-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(min-width:1080px){.palets-grid--3{grid-template-columns:repeat(3,minmax(0,1fr));}}
.palet-card{
  position:relative;display:flex;flex-direction:column;overflow:hidden;
  background:#fff;border:1px solid var(--c-linea);border-radius:var(--r-lg);
  box-shadow:var(--s-1);
  transition:transform var(--tr), box-shadow var(--tr), border-color var(--tr);
}
.palet-card::before{
  content:"";position:absolute;inset:0 0 auto 0;height:3px;z-index:3;
  background:linear-gradient(90deg,var(--c-turquesa),var(--c-azul));
  transform:scaleX(0);transform-origin:left;transition:transform .5s var(--tr);
}
.palet-card:hover{transform:translateY(-6px);box-shadow:var(--s-3);border-color:var(--c-linea-fuerte);}
.palet-card:hover::before{transform:scaleX(1);}

/* Escenario del palet: trama técnica, perspectiva y sombra de contacto */
.palet-card__foto{
  position:relative;perspective:1000px;overflow:hidden;
  padding:1.9rem 1.5rem 2.1rem;
  background:
    radial-gradient(120% 90% at 50% 115%, rgba(15,111,196,.10), transparent 60%),
    linear-gradient(170deg,#fbfcfe 0%,var(--c-fondo-2) 100%);
}
.palet-card__trama{
  position:absolute;inset:0;pointer-events:none;
  background-image:radial-gradient(rgba(15,111,196,.20) 1px, transparent 1px);
  background-size:18px 18px;
  -webkit-mask-image:radial-gradient(70% 65% at 50% 45%, #000 10%, transparent 78%);
  mask-image:radial-gradient(70% 65% at 50% 45%, #000 10%, transparent 78%);
  opacity:.7;transition:opacity var(--tr), transform .8s var(--tr);
}
.palet-card:hover .palet-card__trama{opacity:1;transform:scale(1.06);}
.palet-card__foto picture{display:block;position:relative;z-index:2;}
.palet-card__foto img{
  width:100%;aspect-ratio:600/350;object-fit:contain;
  transform:rotateX(7deg) rotateY(-9deg) scale(.95);
  transform-origin:50% 70%;
  transition:transform .6s cubic-bezier(.22,1,.36,1);
  filter:drop-shadow(0 10px 14px rgba(0,21,39,.16));
}
.palet-card:hover .palet-card__foto img{
  transform:rotateX(2deg) rotateY(0deg) scale(1.05) translateY(-6px);
  filter:drop-shadow(0 20px 22px rgba(0,21,39,.22));
}
.palet-card__sombra{
  position:absolute;left:50%;bottom:1.05rem;z-index:1;
  width:62%;height:16px;transform:translateX(-50%);
  border-radius:50%;
  background:radial-gradient(ellipse at center, rgba(0,21,39,.30), transparent 70%);
  filter:blur(3px);
  transition:width .6s var(--tr), opacity var(--tr);
}
.palet-card:hover .palet-card__sombra{width:72%;opacity:.75;}

.palet-card__cuerpo{padding:1.35rem 1.4rem 1.5rem;display:flex;flex-direction:column;flex:1;}
.palet-card h3{font-size:1.2rem;margin-bottom:.35rem;}
.palet-card p{font-size:.95rem;color:var(--c-texto-2);}
.palet-card p:last-child{margin-bottom:0;}

/* Etiqueta flotando sobre la fotografía */
.etiqueta{
  position:absolute;top:1rem;left:1rem;z-index:3;
  display:inline-flex;align-items:center;
  padding:.34rem .8rem;border-radius:var(--r-pill);
  background:rgba(255,255,255,.88);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  border:1px solid var(--c-linea);
  color:var(--c-azul-osc);box-shadow:var(--s-1);
  font-size:.74rem;font-weight:800;letter-spacing:.05em;
  font-variant-numeric:tabular-nums;
}
.ficha-tec{
  list-style:none;padding:0;margin:.9rem 0 0;border-top:1px solid var(--c-linea);
}
.ficha-tec li{
  display:flex;align-items:baseline;gap:.5rem;
  padding:.55rem 0;border-bottom:1px solid var(--c-linea);
  font-size:.9rem;margin:0;
}
.ficha-tec li span:first-child{color:var(--c-texto-2);flex:none;}
.ficha-tec li::before{
  content:"";order:1;flex:1;height:0;
  border-bottom:1px dotted var(--c-linea-fuerte);transform:translateY(-.22em);
}
.ficha-tec b{order:2;color:var(--c-marino-prof);font-variant-numeric:tabular-nums;
  text-align:right;flex:none;}

/* Resumen de tipos en portada */
.tipos-resumen{display:grid;gap:1rem;}
@media(min-width:640px){.tipos-resumen{grid-template-columns:repeat(2,1fr);}}
@media(min-width:1000px){.tipos-resumen{grid-template-columns:repeat(4,1fr);}}
.tipo-mini{
  position:relative;display:flex;flex-direction:column;gap:.5rem;
  padding:1.25rem 1.2rem;background:#fff;border-radius:var(--r-md);
  border:1px solid var(--c-linea);text-decoration:none;color:inherit;
  transition:transform var(--tr), box-shadow var(--tr), border-color var(--tr);
}
.tipo-mini:hover{transform:translateY(-4px);box-shadow:var(--s-2);border-color:var(--c-azul);}
.tipo-mini img{width:100%;aspect-ratio:600/300;object-fit:contain;}
.tipo-mini b{font-size:1.02rem;color:var(--c-marino-prof);}
.tipo-mini span{font-size:.86rem;color:var(--c-texto-2);}

/* ===== 12 · (bloque retirado: la cadena de suministro usa ahora el bento) ===== */

/* ==================== 13 · MEDIO AMBIENTE =============================== */
.ambiente{position:relative;isolation:isolate;overflow:hidden;background:var(--c-marino-prof);}
.ambiente__bg{position:absolute;inset:0;z-index:-2;overflow:hidden;}
.ambiente__bg img{width:100%;height:118%;object-fit:cover;will-change:transform;}
.ambiente::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(120deg,rgba(0,21,39,.95) 0%,rgba(0,21,39,.82) 45%,rgba(0,94,73,.80) 100%);
}
.ambiente__grid{display:grid;gap:clamp(1.8rem,1rem + 3vw,3.5rem);align-items:center;}
@media(min-width:960px){.ambiente__grid{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);}}
.ambiente__figura{
  position:relative;display:grid;place-items:center;
  width:min(420px,86%);aspect-ratio:1;justify-self:center;
}
.ambiente__figura::before{
  content:"";position:absolute;inset:0;border-radius:50%;z-index:0;
  background:conic-gradient(from 0deg,
    rgba(64,176,191,0) 0deg 150deg, rgba(64,176,191,.22) 236deg,
    rgba(64,176,191,.95) 318deg, rgba(0,150,244,.65) 342deg, rgba(0,150,244,0) 358deg);
  -webkit-mask:radial-gradient(circle, transparent 0 64%, #000 66%, #000 78%, transparent 80%);
  mask:radial-gradient(circle, transparent 0 64%, #000 66%, #000 78%, transparent 80%);
  filter:drop-shadow(0 0 14px rgba(64,176,191,.5));
  animation:ambGiro 9s linear infinite;
}
.ambiente__figura::after{
  content:"";position:absolute;inset:12%;border-radius:50%;z-index:0;
  border:1px dashed rgba(255,255,255,.28);
  animation:ambGiro 40s linear infinite reverse;
}
.ambiente__figura picture{
  position:relative;z-index:1;display:block;width:58%;line-height:0;
}
.ambiente__simbolo{
  position:relative;z-index:1;width:100%;height:auto;
  filter:drop-shadow(0 22px 40px rgba(0,0,0,.55));
  animation:ambFlota 6.5s ease-in-out infinite;
}
@keyframes ambGiro{to{transform:rotate(360deg);}}
@keyframes ambFlota{0%,100%{transform:translateY(7px) scale(.99);}50%{transform:translateY(-7px) scale(1.03);}}
.ambiente .btn--inv{padding:1.05rem 2rem;font-size:1.02rem;}
.ciclo{display:grid;gap:.9rem;counter-reset:paso;list-style:none;padding:0;margin:0;}
.ciclo li{
  position:relative;padding:1.05rem 1.2rem 1.05rem 3.7rem;
  background:rgba(255,255,255,.06);border:1px solid var(--c-linea-inv);
  border-radius:var(--r-md);color:var(--c-texto-inv-2);font-size:.95rem;margin:0;
}
.ciclo li b{display:block;color:#fff;font-size:1.02rem;margin-bottom:.15rem;}
.ciclo li::before{
  counter-increment:paso;content:counter(paso,decimal-leading-zero);
  position:absolute;left:1.1rem;top:1.05rem;
  font-size:.86rem;font-weight:800;color:var(--c-turquesa-luz);
  border:1px solid rgba(64,176,191,.5);border-radius:50%;
  width:32px;height:32px;display:grid;place-items:center;
}

/* ===================== 14 · PREGUNTAS FRECUENTES ======================== */
.faq{max-width:900px;}
.faq.centro{margin-inline:auto;}
.faq details{
  border:1px solid var(--c-linea);border-radius:var(--r-md);
  background:#fff;margin-bottom:.7rem;overflow:hidden;
  transition:border-color var(--tr), box-shadow var(--tr);
}
.faq details[open]{border-color:var(--c-azul);box-shadow:var(--s-2);}
.faq summary{
  list-style:none;cursor:pointer;position:relative;
  padding:1.1rem 3.4rem 1.1rem 1.3rem;
  font-weight:700;font-size:1.02rem;color:var(--c-marino-prof);
}
.faq summary::-webkit-details-marker{display:none;}
.faq summary:hover{color:var(--c-azul-osc);}
.faq summary::after{
  content:"";position:absolute;right:1.35rem;top:1.42rem;
  width:11px;height:11px;
  border-right:2.5px solid var(--c-azul);border-bottom:2.5px solid var(--c-azul);
  transform:rotate(45deg);transition:transform var(--tr);
}
.faq details[open] summary::after{transform:rotate(-135deg);top:1.62rem;}
.faq__r{padding:0 1.3rem 1.3rem;color:var(--c-texto-2);font-size:.97rem;}
.faq__r p:last-child{margin-bottom:0;}
@media(min-width:900px){
  .faq--dos{max-width:none;display:grid;grid-template-columns:repeat(2,1fr);gap:0 1.2rem;align-items:start;}
}

/* ===================== 15 · CONTACTO Y MAPA ============================= */
.contacto{position:relative;background:var(--c-marino-prof);color:#fff;overflow:hidden;isolation:isolate;}
.contacto::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:
    radial-gradient(90% 70% at 12% 0%, rgba(16,131,228,.30), transparent 60%),
    radial-gradient(70% 60% at 92% 100%, rgba(0,135,142,.26), transparent 62%);
}
.contacto__grid{display:grid;gap:clamp(1.6rem,1rem + 3vw,3rem);align-items:stretch;}
@media(min-width:1000px){.contacto__grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);}}
.tarjetas-contacto{display:grid;gap:.85rem;}
@media(min-width:560px){.tarjetas-contacto{grid-template-columns:repeat(2,1fr);}}
.t-contacto{
  display:flex;gap:.95rem;align-items:flex-start;
  padding:1.25rem 1.25rem;border-radius:var(--r-md);
  background:rgba(255,255,255,.07);border:1px solid var(--c-linea-inv);
  color:#fff;text-decoration:none;
  transition:background var(--tr), border-color var(--tr), transform var(--tr);
}
.t-contacto:hover{background:rgba(255,255,255,.13);border-color:var(--c-turquesa-luz);
  transform:translateY(-3px);color:#fff;}
.t-contacto .ico{
  width:44px;height:44px;flex:none;display:grid;place-items:center;border-radius:12px;
  background:rgba(64,176,191,.18);color:var(--c-turquesa-luz);
}
.t-contacto .ico svg{width:22px;height:22px;}
.t-contacto .et{display:block;font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--c-texto-inv-2);margin-bottom:.15rem;}
.t-contacto .txt{display:block;min-width:0;}
.t-contacto b{font-size:1.04rem;font-weight:700;line-height:1.35;display:block;}
.t-contacto small{display:block;color:var(--c-texto-inv-2);font-size:.86rem;margin-top:.15rem;}
.t-contacto--ancha{grid-column:1/-1;}
.t-contacto b{overflow-wrap:anywhere;}
.t-contacto b.correo{font-size:.8rem;letter-spacing:-.015em;white-space:nowrap;}

/* Mapa diferido */
.mapa{
  position:relative;display:flex;flex-direction:column;
  border-radius:var(--r-lg);overflow:hidden;
  border:1px solid var(--c-linea-inv);box-shadow:var(--s-inv);
  background:var(--c-noche);min-height:420px;height:100%;
}
.mapa__marco{position:relative;flex:1;min-height:320px;}
@media(max-width:640px){.mapa__marco{min-height:380px;}}
.mapa iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}
.mapa__aviso{
  position:absolute;inset:0;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:1rem;text-align:center;
  padding:2rem 1.5rem;
  background:
    linear-gradient(180deg,rgba(1,5,56,.86),rgba(0,21,39,.94)),
    repeating-linear-gradient(118deg, rgba(255,255,255,.045) 0 2px, transparent 2px 22px);
}
.mapa__aviso .ico{
  width:56px;height:56px;display:grid;place-items:center;border-radius:50%;
  background:rgba(64,176,191,.18);color:var(--c-turquesa-luz);
}
.mapa__aviso .ico svg{width:28px;height:28px;}
.mapa__aviso p{color:var(--c-texto-inv-2);max-width:38ch;font-size:.95rem;margin:0;}
.mapa__aviso b{color:#fff;display:block;font-size:1.1rem;margin-bottom:.2rem;}
.mapa__pie{
  display:flex;flex-wrap:wrap;gap:.7rem;justify-content:space-between;align-items:center;
  padding:.9rem 1.2rem;background:rgba(255,255,255,.06);
  border-top:1px solid var(--c-linea-inv);font-size:.9rem;color:var(--c-texto-inv-2);
}
.mapa__pie a{color:var(--c-turquesa-luz);font-weight:700;text-decoration:none;}
.mapa__pie a:hover{text-decoration:underline;}
.mapa__pie a svg{display:inline-block;width:12px;height:12px;vertical-align:-1px;margin-left:.25rem;}

/* ======================= 16 · PIE DE PÁGINA ============================= */
.pie{background:#000c17;color:var(--c-texto-inv-2);padding-block:clamp(2.8rem,2rem + 3vw,4.2rem) 0;}
.pie__grid{
  display:grid;gap:2rem clamp(1.5rem,1rem + 2vw,3rem);
  grid-template-columns:1fr;
}
@media(min-width:720px){.pie__grid{grid-template-columns:1.4fr 1fr 1fr;}}
@media(min-width:1000px){.pie__grid{grid-template-columns:1.6fr 1fr 1fr 1.1fr;}}
.pie h2,.pie h3{color:#fff;font-size:.82rem;letter-spacing:.14em;text-transform:uppercase;
  margin-bottom:1.1rem;font-weight:800;}
.pie img.pie__logo{height:44px;width:auto;margin-bottom:1.1rem;}
.pie p{font-size:.92rem;margin-bottom:.7rem;}
.pie ul{list-style:none;padding:0;margin:0;}
.pie li{margin-bottom:.5rem;}
.pie a{color:var(--c-texto-inv-2);text-decoration:none;font-size:.93rem;transition:color var(--tr);}
.pie a:hover{color:var(--c-turquesa-luz);}
.pie address{font-style:normal;font-size:.92rem;line-height:1.7;}
.pie__legal{
  margin-top:2.6rem;padding:1.3rem 0 1.6rem;border-top:1px solid rgba(255,255,255,.12);
  display:flex;flex-wrap:wrap;gap:.6rem 1.4rem;justify-content:space-between;align-items:center;
  font-size:.85rem;
}
.pie__legal nav{display:flex;flex-wrap:wrap;gap:.5rem 1.2rem;}
.pie__legal button{
  background:none;border:0;padding:0;font:inherit;font-size:.85rem;
  color:var(--c-texto-inv-2);cursor:pointer;text-decoration:underline;
}
.pie__legal button:hover{color:var(--c-turquesa-luz);}
.pie__artemovil{
  display:inline-flex;align-items:center;gap:.45rem;white-space:nowrap;
  padding:.42rem .85rem;border-radius:var(--r-pill);
  border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.05);
  color:#cfe0f1;font-size:.78rem;font-weight:600;letter-spacing:.02em;
  text-decoration:none;
  transition:background var(--tr), color var(--tr), border-color var(--tr), transform var(--tr);
}
.pie__artemovil:hover{background:rgba(255,255,255,.11);color:#fff;
  border-color:var(--c-turquesa-luz);transform:translateY(-2px);}
.pie__artemovil svg{width:12px;height:12px;flex:none;opacity:.85;}
.t-contacto small svg{display:inline-block;width:11px;height:11px;}

/* ==================== 17 · CONTROLES FLOTANTES ========================== */
.flotante{
  position:fixed;z-index:850;
  display:inline-flex;align-items:center;justify-content:center;
  border-radius:50%;text-decoration:none;border:0;cursor:pointer;
  box-shadow:0 10px 26px rgba(0,12,25,.34);
  transition:transform var(--tr), box-shadow var(--tr), background var(--tr), opacity .3s ease;
}
.flotante:hover{transform:translateY(-3px);box-shadow:0 14px 32px rgba(0,12,25,.42);}
.flotante svg{width:26px;height:26px;}

.f-arriba{
  position:relative;width:52px;height:52px;
  background:var(--c-marino-prof);color:#fff;
  opacity:0;visibility:hidden;pointer-events:none;
}
.f-arriba.is-visible{opacity:1;visibility:visible;pointer-events:auto;}
.f-arriba:hover{background:var(--c-azul-osc);}
.f-arriba svg.icono{width:20px;height:20px;position:relative;z-index:1;}
.f-arriba .aro{position:absolute;inset:0;transform:rotate(-90deg);width:52px;height:52px;}
.f-arriba .aro circle{fill:none;stroke-width:2.5;}
.f-arriba .aro .fondo{stroke:rgba(255,255,255,.2);}
.f-arriba .aro .prog{stroke:var(--c-turquesa-luz);stroke-linecap:round;
  stroke-dasharray:151;stroke-dashoffset:151;transition:stroke-dashoffset .1s linear;}

/* Recolocación cuando el aviso de cookies está visible */
@media(max-width:640px){
  body.cc-visible .f-col{transform:translateY(-198px);}
}
@media(max-width:520px){
  .f-arriba{width:46px;height:46px;}
  .f-arriba .aro{width:46px;height:46px;}
}

/* =============== 18 · PÁGINAS LEGALES Y 404 ============================= */
.legal{padding-block:var(--sec-y);}
.legal h2{font-size:clamp(1.28rem,1.1rem + .8vw,1.7rem);margin-top:2.4rem;}
.legal h2:first-of-type{margin-top:0;}
.legal h3{font-size:1.12rem;margin-top:1.8rem;}
.legal p,.legal li{color:var(--c-texto-2);}
.legal .dato{
  background:var(--c-fondo-2);border:1px solid var(--c-linea);
  border-radius:var(--r-md);padding:1.3rem 1.4rem;margin:1.5rem 0;
}
.legal .dato p:last-child{margin-bottom:0;}
.legal figure{margin:1.6rem 0;}
.legal figure img{border:1px solid var(--c-linea);border-radius:var(--r-sm);width:100%;}
.legal figcaption{font-size:.85rem;color:var(--c-texto-2);margin-top:.5rem;}
.tabla-envoltorio{overflow-x:auto;margin:1.5rem 0;}
.tabla{width:100%;border-collapse:collapse;font-size:.92rem;min-width:520px;}
.tabla th,.tabla td{border:1px solid var(--c-linea);padding:.7rem .85rem;text-align:left;vertical-align:top;}
.tabla th{background:var(--c-fondo-2);color:var(--c-marino-prof);font-weight:700;}

.p404{
  min-height:70svh;display:grid;place-items:center;text-align:center;
  padding:calc(var(--cab-h) + 3rem) var(--pad-x) 4rem;
}
.p404__num{
  font-size:clamp(5rem,12vw,10rem);font-weight:800;line-height:.9;
  color:transparent;-webkit-text-stroke:2px var(--c-linea-fuerte);margin-bottom:.4rem;
}


/* ======================================================================== */
/* 21 · COMPONENTES DE LAS PÁGINAS DE SERVICIO                              */
/* ======================================================================== */

/* --- 21.1 · Proceso: tarjetas con anillo que se traza al aparecer -------- */
.proceso{display:grid;gap:1.2rem;}
@media(min-width:640px){.proceso{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(min-width:1100px){.proceso{grid-template-columns:repeat(4,minmax(0,1fr));}}

.paso{
  position:relative;overflow:hidden;
  padding:1.9rem 1.5rem 1.6rem;
  background:#fff;border:1px solid var(--c-linea);border-radius:var(--r-lg);
  box-shadow:var(--s-1);
  transition:transform var(--tr), box-shadow var(--tr), border-color var(--tr);
}
.paso:hover{transform:translateY(-6px);box-shadow:var(--s-3);border-color:var(--c-linea-fuerte);}
.paso::before{
  content:"";position:absolute;inset:auto 0 0 0;height:3px;
  background:linear-gradient(90deg,var(--c-turquesa),var(--c-azul));
  transform:scaleX(0);transform-origin:left;transition:transform .55s var(--tr);
}
.paso:hover::before{transform:scaleX(1);}

.paso__aro{position:relative;width:76px;height:76px;margin-bottom:1.1rem;}
.paso__aro svg{width:100%;height:100%;display:block;transform:rotate(-90deg);}
.paso__base{fill:none;stroke:var(--c-linea);stroke-width:3;}
.paso__traza{
  fill:none;stroke:var(--c-azul);stroke-width:3;stroke-linecap:round;
  stroke-dasharray:100;stroke-dashoffset:100;
  transition:stroke-dashoffset 1.25s cubic-bezier(.25,.6,.3,1) .15s;
}
.reveal.is-in .paso__traza,.no-js .paso__traza{stroke-dashoffset:22;}
.paso__punt{
  fill:none;stroke:rgba(0,117,124,.55);stroke-width:2;
  stroke-dasharray:3 7;transform-box:fill-box;transform-origin:center;
  opacity:0;transition:opacity var(--tr);
  animation:pasoGira 16s linear infinite;
}
.paso:hover .paso__punt{opacity:1;}
@keyframes pasoGira{to{transform:rotate(360deg);}}
.paso__n{
  position:absolute;inset:0;display:grid;place-items:center;
  font-size:1.42rem;font-weight:800;color:var(--c-marino-prof);
  font-variant-numeric:tabular-nums;
}
.paso h3{font-size:1.08rem;margin-bottom:.4rem;}
.paso p{font-size:.94rem;color:var(--c-texto-2);margin:0;}

/* --- 21.2 · Panel de logística equilibrado ------------------------------ */
.encaje{display:grid;gap:clamp(1.6rem,1rem + 3vw,3rem);align-items:stretch;}
@media(min-width:960px){.encaje{grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr);align-items:center;}}
.panel-log{
  display:flex;flex-direction:column;height:100%;
  padding:1.9rem 1.8rem;border-radius:var(--r-lg);
  background:linear-gradient(160deg,var(--c-marino-prof) 0%,#062a4a 100%);
  color:var(--c-texto-inv);box-shadow:var(--s-3);
  position:relative;overflow:hidden;
}
.panel-log::before{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background-image:radial-gradient(rgba(255,255,255,.10) 1px, transparent 1px);
  background-size:24px 24px;
  -webkit-mask-image:radial-gradient(80% 70% at 80% 10%, #000, transparent 70%);
  mask-image:radial-gradient(80% 70% at 80% 10%, #000, transparent 70%);
}
.panel-log > *{position:relative;z-index:1;}
.panel-log .ico{
  width:52px;height:52px;display:grid;place-items:center;border-radius:14px;
  background:rgba(64,176,191,.18);color:var(--c-turquesa-luz);margin-bottom:1rem;
}
.panel-log .ico svg{width:26px;height:26px;}
.panel-log h3{color:#fff;font-size:1.22rem;margin-bottom:.5rem;}
.panel-log p{color:var(--c-texto-inv-2);font-size:.96rem;}
.panel-log__datos{
  list-style:none;margin:auto 0 0;padding:1.2rem 0 0;
  border-top:1px solid var(--c-linea-inv);display:grid;gap:.55rem;
}
.panel-log__datos li{margin:0;}
.panel-log__datos a{
  display:flex;align-items:center;gap:.7rem;color:#fff;text-decoration:none;
  font-weight:700;font-size:.96rem;padding:.35rem 0;
  transition:color var(--tr), transform var(--tr);
}
.panel-log__datos a:hover{color:var(--c-turquesa-luz);transform:translateX(4px);}
.panel-log__datos svg{width:17px;height:17px;flex:none;color:var(--c-turquesa-luz);}
.panel-log__datos small{display:block;font-weight:500;color:var(--c-texto-inv-2);font-size:.82rem;}

/* --- 21.3 · «Otros servicios»: tarjetas oscuras con barrido ------------- */
.otros{
  position:relative;overflow:hidden;isolation:isolate;
  background:linear-gradient(150deg,var(--c-marino-prof) 0%,#04203a 55%,#062f52 100%);
}
.otros::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background-image:repeating-linear-gradient(118deg, rgba(255,255,255,.035) 0 2px, transparent 2px 24px);
}
.otros h2,.otros h3{color:#fff;}
.otros .cabecera-seccion p{color:var(--c-texto-inv-2);}
.otros-grid{display:grid;gap:1rem;}
@media(min-width:680px){.otros-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(min-width:1100px){.otros-grid{grid-template-columns:repeat(4,minmax(0,1fr));}}
.otro{
  position:relative;overflow:hidden;isolation:isolate;
  display:flex;flex-direction:column;justify-content:flex-end;
  min-height:210px;padding:1.5rem 1.4rem 1.3rem;
  border:1px solid var(--c-linea-inv);border-radius:var(--r-lg);
  background:rgba(255,255,255,.05);color:#fff;text-decoration:none;
  transition:transform var(--tr), border-color var(--tr), background var(--tr), box-shadow var(--tr);
}
.otro:hover,.otro:focus-visible{
  transform:translateY(-6px);background:rgba(255,255,255,.11);
  border-color:rgba(64,176,191,.6);box-shadow:var(--s-inv);color:#fff;
}
.otro__n{
  position:absolute;top:.4rem;right:.7rem;z-index:-1;
  font-size:4.4rem;font-weight:800;line-height:.9;
  color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.12);
  font-variant-numeric:tabular-nums;transition:-webkit-text-stroke-color var(--tr), transform var(--tr);
}
.otro:hover .otro__n{-webkit-text-stroke-color:rgba(64,176,191,.4);transform:translateY(6px);}
.otro__ico{
  width:48px;height:48px;display:grid;place-items:center;border-radius:14px;
  background:rgba(64,176,191,.16);color:var(--c-turquesa-luz);margin-bottom:auto;
  transition:background var(--tr), color var(--tr), transform var(--tr);
}
.otro__ico svg{width:24px;height:24px;}
.otro:hover .otro__ico{background:var(--c-turquesa-luz);color:var(--c-marino-prof);transform:rotate(-8deg);}
.otro h3{font-size:1.06rem;margin:1.1rem 0 .55rem;line-height:1.28;}
.otro__mas{
  display:inline-flex;align-items:center;gap:.4rem;
  font-size:.86rem;font-weight:700;color:var(--c-turquesa-luz);
}
.otro__mas::after{content:"→";transition:transform var(--tr);}
.otro:hover .otro__mas::after{transform:translateX(6px);}
.otro__brillo{
  position:absolute;inset:-40% -120%;z-index:-1;pointer-events:none;
  background:linear-gradient(74deg,transparent 38%,rgba(255,255,255,.16) 48%,transparent 58%);
  transform:translateX(-45%);
  animation:otroBrillo 6.5s ease-in-out infinite;
}
.otro:nth-child(2) .otro__brillo{animation-duration:7.7s;}
.otro:nth-child(3) .otro__brillo{animation-duration:9.1s;}
.otro:nth-child(4) .otro__brillo{animation-duration:11.3s;}
@keyframes otroBrillo{0%,68%{transform:translateX(-45%);}94%,100%{transform:translateX(45%);}}

/* --- 21.4 · FAQ en dos columnas con ficha numerada ---------------------- */
.faq--srv{max-width:none;}
@media(min-width:900px){
  .faq--srv{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
            gap:0 1.3rem;align-items:start;}
}
.faq--srv .faq__col{display:flex;flex-direction:column;}
.faq--srv details{
  position:relative;overflow:hidden;
  border:1px solid var(--c-linea);border-radius:var(--r-md);
  background:#fff;margin-bottom:.75rem;
  transition:border-color var(--tr), box-shadow var(--tr), transform var(--tr);
}
.faq--srv details::before{
  content:"";position:absolute;left:-1px;top:-1px;bottom:-1px;width:3px;
  background:linear-gradient(180deg,var(--c-turquesa),var(--c-azul));
  opacity:0;transition:opacity var(--tr);
}
.faq--srv details[open]{border-color:var(--c-azul);box-shadow:var(--s-2);}
.faq--srv details[open]::before{opacity:1;}
.faq--srv details:hover{transform:translateY(-2px);}
.faq--srv summary{
  list-style:none;cursor:pointer;
  display:grid;grid-template-columns:auto 1fr auto;align-items:start;gap:.85rem;
  padding:1.05rem 1.1rem;
}
.faq--srv summary::-webkit-details-marker{display:none;}
.faq--srv summary::after{content:none;}
.faq__n{
  font-size:.76rem;font-weight:800;color:var(--c-turquesa);
  font-variant-numeric:tabular-nums;padding-top:.22em;letter-spacing:.04em;
}
.faq__q{display:block;font-weight:700;font-size:1rem;color:var(--c-marino-prof);line-height:1.4;}
.faq__tag{
  display:inline-block;margin-top:.4rem;padding:.16rem .55rem;border-radius:var(--r-pill);
  background:var(--c-fondo-3);color:var(--c-azul-osc);
  font-size:.68rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;
}
.faq__mas{
  position:relative;width:30px;height:30px;flex:none;border-radius:9px;
  border:1px solid var(--c-linea-fuerte);
  transition:background var(--tr), border-color var(--tr), transform var(--tr);
}
.faq__mas::before,.faq__mas::after{
  content:"";position:absolute;left:50%;top:50%;background:var(--c-azul);
  transform:translate(-50%,-50%);transition:transform var(--tr), background var(--tr);
}
.faq__mas::before{width:12px;height:2px;}
.faq__mas::after{width:2px;height:12px;}
.faq--srv summary:hover .faq__mas{border-color:var(--c-azul);background:var(--c-fondo-3);}
.faq--srv details[open] .faq__mas{background:var(--c-azul);border-color:var(--c-azul);transform:rotate(180deg);}
.faq--srv details[open] .faq__mas::before{background:#fff;}
.faq--srv details[open] .faq__mas::after{transform:translate(-50%,-50%) scaleY(0);background:#fff;}
.faq--srv .faq__r{
  padding:0 1.1rem 1.15rem calc(1.1rem + 2.1rem);
  color:var(--c-texto-2);font-size:.95rem;
}
@media(max-width:480px){.faq--srv .faq__r{padding-left:1.1rem;}}

/* --- 21.5 · Bento de la cadena de suministro ---------------------------- */
.bento{display:grid;gap:1rem;}
@media(min-width:700px){
  .bento{grid-template-columns:repeat(2,minmax(0,1fr));
         grid-template-areas:"a b" "c d";}
  .bento > :nth-child(1){grid-area:a;}
  .bento > :nth-child(2){grid-area:b;}
  .bento > :nth-child(3){grid-area:c;}
  .bento > :nth-child(4){grid-area:d;}
}
@media(min-width:1080px){
  .bento{grid-template-columns:repeat(3,minmax(0,1fr));
         grid-template-areas:"a a b" "c d d";}
}
.tesela{
  position:relative;overflow:hidden;isolation:isolate;
  display:flex;flex-direction:column;justify-content:flex-end;
  min-height:230px;padding:1.7rem 1.6rem;
  border-radius:var(--r-lg);border:1px solid var(--c-linea);
  background:linear-gradient(155deg,#fff 0%,var(--c-fondo-2) 100%);
  transition:transform var(--tr), box-shadow var(--tr), border-color var(--tr);
}
.tesela:hover{transform:translateY(-5px);box-shadow:var(--s-3);border-color:var(--c-linea-fuerte);}
.tesela__marca{
  position:absolute;right:-14px;bottom:-26px;z-index:-1;
  width:150px;height:150px;color:var(--c-azul);opacity:.07;
  transition:transform .6s cubic-bezier(.25,.6,.3,1), opacity var(--tr);
}
.tesela:hover .tesela__marca{transform:translate(-8px,-10px) rotate(-8deg);opacity:.13;}
.tesela__marca svg{width:100%;height:100%;}
.tesela__n{
  font-size:.74rem;font-weight:800;letter-spacing:.16em;
  color:var(--c-turquesa);margin-bottom:auto;font-variant-numeric:tabular-nums;
}
.tesela h3{font-size:1.16rem;margin:1.2rem 0 .45rem;}
.tesela p{font-size:.95rem;color:var(--c-texto-2);margin:0;}
.tesela--osc{
  background:linear-gradient(150deg,var(--c-marino-prof) 0%,#073055 100%);
  border-color:transparent;color:var(--c-texto-inv);
}
.tesela--osc h3{color:#fff;}
.tesela--osc p{color:var(--c-texto-inv-2);}
.tesela--osc .tesela__n{color:var(--c-turquesa-luz);}
.tesela--osc .tesela__marca{color:#fff;opacity:.12;}
.tesela--osc:hover .tesela__marca{opacity:.2;}

/* --- 21.6 · WhatsApp flotante desplegable ------------------------------- */
.f-col{
  position:fixed;z-index:850;
  right:max(1rem, env(safe-area-inset-right));
  bottom:calc(1rem + env(safe-area-inset-bottom));
  display:flex;flex-direction:column;align-items:flex-end;gap:.75rem;
}
.f-wa{
  position:relative;display:inline-flex;align-items:center;
  padding:5px;border-radius:var(--r-pill);
  background:linear-gradient(135deg,var(--c-azul-osc),var(--c-marino-prof));
  box-shadow:0 12px 28px rgba(0,12,25,.38);
  text-decoration:none;color:#fff;
  transition:transform var(--tr), box-shadow var(--tr);
}
.f-wa:hover,.f-wa:focus-visible{transform:translateY(-3px);color:#fff;
  box-shadow:0 16px 34px rgba(0,12,25,.46);}
.f-wa__txt{
  display:grid;overflow:hidden;white-space:nowrap;
  max-width:0;opacity:0;padding-right:0;padding-left:0;
  transition:max-width .45s cubic-bezier(.25,.8,.3,1), opacity .3s ease,
             padding .45s cubic-bezier(.25,.8,.3,1);
}
.f-wa:hover .f-wa__txt,.f-wa:focus-visible .f-wa__txt,.f-wa.is-abierto .f-wa__txt{
  max-width:230px;opacity:1;padding-left:1.05rem;padding-right:.9rem;
}
.f-wa__txt small{
  font-size:.68rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;
  color:var(--c-turquesa-luz);line-height:1.2;
}
.f-wa__txt b{font-size:1.02rem;font-weight:800;line-height:1.25;color:#fff;}
.f-wa__ico{
  position:relative;z-index:2;width:52px;height:52px;flex:none;
  display:grid;place-items:center;border-radius:50%;
  background:#25d366;color:#fff;
  box-shadow:0 0 0 2px rgba(255,255,255,.18) inset;
}
.f-wa__ico svg{width:27px;height:27px;}
.f-wa__aro{
  position:absolute;right:5px;top:5px;width:52px;height:52px;
  border-radius:50%;border:2px solid var(--c-turquesa-luz);
  z-index:1;pointer-events:none;
  animation:waAro 3.2s cubic-bezier(.2,.6,.3,1) infinite;
}
.f-wa__aro--2{animation-delay:1.6s;border-color:var(--c-azul-luz);}
@keyframes waAro{
  0%{transform:scale(1);opacity:.85;}
  70%{transform:scale(1.75);opacity:0;}
  100%{transform:scale(1.75);opacity:0;}
}
@media(max-width:520px){
  .f-wa__ico{width:48px;height:48px;}
  .f-wa__ico svg{width:24px;height:24px;}
  .f-wa__aro{width:48px;height:48px;}
  .f-wa:hover .f-wa__txt,.f-wa.is-abierto .f-wa__txt{max-width:190px;}
  .f-wa__txt b{font-size:.94rem;}
}

/* ======================= 19 · IMPRESIÓN ================================= */
@media print{
  .cabecera,.nav,.hamburguesa,.flotante,.f-col,.f-wa,.f-arriba,.velo,
  .hero__nums,.hero__trazado,.hero__trama,.hero__onda,.onda-sup,
  .mapa,.onda{display:none!important;}
  body{color:#000;background:#fff;}
  .hero,.hero-int,.seccion--osc,.servicios,.ambiente,.contacto{
    background:#fff!important;color:#000!important;padding-block:1.5rem;}
  .hero h1,.hero-int h1,.seccion--osc h2,.seccion--osc h3{color:#000!important;}
  a{color:#000;text-decoration:underline;}
  .faq details{break-inside:avoid;}
  details{open:true;}
}

/* ================== 20 · MOVIMIENTO REDUCIDO ============================ */
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{
    animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important;scroll-behavior:auto!important;
  }
  /* Fijar el estado FINAL visible, no el inicial */
  .reveal{opacity:1!important;transform:none!important;}
  .hero__slide.is-on img{transform:scale(1.03);}
  .flujo{animation:none!important;stroke-dasharray:none;stroke-dashoffset:0;opacity:.55;}
  .nodo--on{animation:none!important;opacity:.9;}
  .paso__traza{stroke-dashoffset:22!important;}
  .paso__punt{opacity:.5;}
  .otro__brillo{display:none;}
  .f-wa__aro{display:none;}
  .intro-grid__sello,.intro-grid__sello img{animation:none!important;}
  .palet-card__foto img{transform:none!important;}
  .palet-card__trama{transform:none!important;}
  .intro-grid__sello::before,.intro-grid__sello::after{animation:none!important;opacity:.4;transform:none;}
  .ambiente__figura::before,.ambiente__figura::after,.ambiente__simbolo{animation:none!important;}
  .hero__num[aria-selected="true"] .hero__num-fill{height:100%;width:100%;}
  .serv-card::after{transform:scaleX(1);}
  .servicios__bg img,.ambiente__bg img{transform:none!important;height:100%;}
}