/* ============================================================
   HUELLA GLOBAL — Hoja de estilos compartida
   Paleta tomada del logo: azul royal + turquesa
============================================================ */
:root{
  --azul:        #1b4da1;
  --azul-oscuro: #0d2b5e;
  --azul-noche:  #081d42;
  --turquesa:    #00a9c4;
  --turquesa-cl: #4fd1e8;
  --hielo:       #f2f7fc;
  --blanco:      #ffffff;
  --texto:       #2b3a52;
  --texto-suave: #5d6f8a;
  --sombra:      0 18px 45px rgba(13, 43, 94, .12);
  --radio:       18px;
  --transicion:  .35s cubic-bezier(.25,.8,.3,1);
  --fuente:      'Plus Jakarta Sans', 'Segoe UI', sans-serif;
}
*{ margin:0; padding:0; box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  font-family:var(--fuente);
  color:var(--texto);
  background:var(--blanco);
  line-height:1.65;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; display:block; }
a{ text-decoration:none; color:inherit; }
.contenedor{ width:min(1180px, 92%); margin-inline:auto; }

/* ---------- Animaciones de aparición ---------- */
.revelar{
  opacity:0; transform:translateY(36px);
  transition:opacity .8s ease, transform .8s cubic-bezier(.22,.9,.3,1);
}
.revelar.visible{ opacity:1; transform:translateY(0); }
.retraso-1{ transition-delay:.12s; } .retraso-2{ transition-delay:.24s; }
.retraso-3{ transition-delay:.36s; } .retraso-4{ transition-delay:.48s; }

@keyframes aparecer{
  from{ opacity:0; transform:translateY(30px); }
  to{ opacity:1; transform:translateY(0); }
}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{ animation:none !important; transition:none !important; }
  .revelar{ opacity:1; transform:none; }
  html{ scroll-behavior:auto; }
}

/* ============ HEADER ============ */
.header{
  position:fixed; inset:0 0 auto 0; z-index:100;
  padding:14px 0;
  transition:var(--transicion);
}
.header.compacto{
  background:rgba(255,255,255,.9);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  box-shadow:0 6px 30px rgba(13,43,94,.10);
  padding:8px 0;
}
.header-inner{ display:flex; align-items:center; justify-content:space-between; gap:24px; }
.logo img{ height:54px; width:auto; transition:var(--transicion); }
.header.compacto .logo img{ height:44px; }
/* Doble logo: blanco sobre hero oscuro, a color con header compacto */
.logo .logo-color{ display:none; }
.header.compacto .logo .logo-color{ display:block; }
.header.compacto .logo .logo-blanco{ display:none; }

.nav{ display:flex; align-items:center; gap:4px; }
.nav > a, .nav .nav-item-sub > a{
  font-weight:600; font-size:.95rem; color:#fff;
  padding:9px 16px; border-radius:999px; position:relative;
  transition:var(--transicion);
  display:inline-flex; align-items:center; gap:6px;
}
.header.compacto .nav > a,
.header.compacto .nav .nav-item-sub > a{ color:var(--azul-oscuro); }
.nav > a:hover, .nav .nav-item-sub > a:hover{ background:rgba(0,169,196,.16); color:var(--turquesa-cl); }
.header.compacto .nav > a:hover,
.header.compacto .nav .nav-item-sub > a:hover{ color:var(--turquesa); background:rgba(0,169,196,.12); }
.nav a.activo{ color:var(--turquesa-cl); }
.header.compacto .nav a.activo{ color:var(--turquesa); }

.nav .cta-nav, .header.compacto .nav .cta-nav{
  background:linear-gradient(120deg, var(--azul), var(--turquesa));
  color:#fff; margin-left:8px;
  box-shadow:0 8px 20px rgba(0,169,196,.35);
}
.nav .cta-nav:hover, .header.compacto .nav .cta-nav:hover{
  transform:translateY(-2px); color:#fff;
  box-shadow:0 12px 26px rgba(0,169,196,.45); background:linear-gradient(120deg, var(--azul), var(--turquesa));
}

/* ---- Submenú de productos ---- */
.nav-item-sub{ position:relative; }
.nav-item-sub .flecha{ transition:var(--transicion); }
.nav-item-sub:hover .flecha, .nav-item-sub:focus-within .flecha{ transform:rotate(180deg); }
.submenu{
  position:absolute; top:calc(100% + 12px); left:0; min-width:290px;
  background:var(--blanco); border-radius:16px; box-shadow:var(--sombra);
  padding:10px; display:grid; gap:2px;
  opacity:0; visibility:hidden; transform:translateY(14px);
  transition:var(--transicion);
}
.nav-item-sub:hover .submenu, .nav-item-sub:focus-within .submenu{
  opacity:1; visibility:visible; transform:translateY(0);
}
.submenu a{
  display:block; padding:10px 16px; border-radius:10px;
  font-size:.92rem; font-weight:600; color:var(--azul-oscuro) !important;
  transition:var(--transicion);
}
.submenu a:hover{ background:rgba(0,169,196,.10); color:var(--turquesa) !important; padding-left:22px; }

.idiomas{ display:flex; gap:10px; font-size:.85rem; font-weight:700; color:rgba(255,255,255,.7); }
.idiomas a.activo{ color:#fff; }
.idiomas a:hover{ color:var(--turquesa-cl); }
.header.compacto .idiomas{ color:var(--texto-suave); }
.header.compacto .idiomas a.activo{ color:var(--azul); }
.header.compacto .idiomas a:hover{ color:var(--turquesa); }

.menu-burger{ display:none; background:none; border:none; cursor:pointer; padding:8px; }
.menu-burger span{
  display:block; width:26px; height:3px; margin:5px 0; border-radius:3px;
  background:#fff; transition:var(--transicion);
}
.header.compacto .menu-burger span{ background:var(--azul-oscuro); }

/* ============ HERO (inicio) ============ */
.hero{
  position:relative; min-height:100vh;
  display:flex; align-items:center;
  padding:140px 0 90px;
  background:
    radial-gradient(900px 500px at 85% 10%, rgba(0,169,196,.25), transparent 60%),
    radial-gradient(700px 600px at 0% 100%, rgba(27,77,161,.35), transparent 55%),
    linear-gradient(140deg, var(--azul-noche) 0%, var(--azul-oscuro) 55%, #0e3a6e 100%);
  color:#fff; overflow:hidden;
}
.hero::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background-image:radial-gradient(rgba(255,255,255,.05) 1.5px, transparent 1.5px);
  background-size:34px 34px;
  mask-image:linear-gradient(to bottom, transparent, #000 30%, transparent 95%);
}
.hero-grid{
  display:grid; grid-template-columns:1.05fr .95fr;
  gap:56px; align-items:center; position:relative; z-index:2;
}
.hero-etiqueta{
  display:inline-flex; align-items:center; gap:8px;
  background:rgba(255,255,255,.10); border:1px solid rgba(255,255,255,.22);
  padding:8px 18px; border-radius:999px;
  font-size:.82rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
  color:var(--turquesa-cl); margin-bottom:26px;
  backdrop-filter:blur(6px);
}
.hero-etiqueta::before{ content:""; width:8px; height:8px; border-radius:50%; background:var(--turquesa-cl);
  animation:pulso 2s infinite; }
@keyframes pulso{ 0%,100%{ box-shadow:0 0 0 0 rgba(79,209,232,.6);} 50%{ box-shadow:0 0 0 8px rgba(79,209,232,0);} }

.hero h1{
  font-size:clamp(2rem, 4.2vw, 3.3rem);
  font-weight:800; line-height:1.15; margin-bottom:22px; letter-spacing:-.02em;
}
.hero h1 .acento, .pagina-hero h1 .acento{
  background:linear-gradient(90deg, var(--turquesa-cl), #8be9ff);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.hero p{ font-size:1.12rem; color:rgba(255,255,255,.82); max-width:540px; margin-bottom:36px; }
.hero-botones{ display:flex; flex-wrap:wrap; gap:16px; margin-bottom:54px; }
.boton{
  display:inline-flex; align-items:center; gap:10px;
  padding:15px 32px; border-radius:999px;
  font-weight:700; font-size:1rem; transition:var(--transicion); cursor:pointer; border:none;
}
.boton-primario{
  background:linear-gradient(120deg, var(--turquesa), var(--turquesa-cl));
  color:var(--azul-noche); box-shadow:0 14px 34px rgba(0,169,196,.45);
}
.boton-primario:hover{ transform:translateY(-3px) scale(1.02); box-shadow:0 20px 44px rgba(0,169,196,.55); }
.boton-fantasma{
  background:transparent; color:#fff; border:1.5px solid rgba(255,255,255,.4);
}
.boton-fantasma:hover{ background:rgba(255,255,255,.12); border-color:#fff; transform:translateY(-3px); }

.hero-cifras{ display:flex; gap:44px; flex-wrap:wrap; }
.cifra .numero{
  font-size:2.1rem; font-weight:800; color:var(--turquesa-cl); line-height:1;
  font-variant-numeric:tabular-nums;
}
.cifra .texto{ font-size:.88rem; color:rgba(255,255,255,.68); margin-top:6px; }

.hero-visual{ position:relative; }
.hero-visual .marco{
  position:relative; border-radius:28px; overflow:hidden;
  box-shadow:0 40px 90px rgba(0,0,0,.45);
  animation:flotar 7s ease-in-out infinite;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.18);
  padding:14px;
}
.hero-visual .marco img{ border-radius:18px; }
@keyframes flotar{ 0%,100%{ transform:translateY(0) rotate(.4deg);} 50%{ transform:translateY(-18px) rotate(-.4deg);} }
.hero-visual::before{
  content:""; position:absolute; inset:-40px -30px auto auto; width:180px; height:180px;
  border-radius:50%; background:radial-gradient(circle, rgba(79,209,232,.35), transparent 70%);
  filter:blur(10px);
}

.hero-onda{ position:absolute; bottom:-2px; left:0; width:100%; z-index:3; line-height:0; }
.hero-onda svg{ width:100%; height:90px; display:block; }

/* ============ HERO DE PÁGINA INTERNA ============ */
.pagina-hero{
  position:relative; padding:180px 0 110px;
  background:
    radial-gradient(800px 400px at 90% 0%, rgba(0,169,196,.25), transparent 60%),
    linear-gradient(140deg, var(--azul-noche) 0%, var(--azul-oscuro) 60%, #0e3a6e 100%);
  color:#fff; overflow:hidden; text-align:center;
}
.pagina-hero::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background-image:radial-gradient(rgba(255,255,255,.05) 1.5px, transparent 1.5px);
  background-size:34px 34px;
  mask-image:linear-gradient(to bottom, transparent, #000 40%, transparent);
}
.pagina-hero .contenedor{ position:relative; z-index:2; }
.pagina-hero h1{
  font-size:clamp(1.9rem, 3.6vw, 2.9rem); font-weight:800;
  letter-spacing:-.02em; line-height:1.15;
  max-width:760px; margin:0 auto 18px;
  animation:aparecer .9s ease both .15s;
}
.pagina-hero p.sub{
  color:rgba(255,255,255,.78); max-width:640px; margin:0 auto;
  font-size:1.08rem; animation:aparecer .9s ease both .3s;
}
.pagina-hero .kicker{ animation:aparecer .9s ease both; }
.migas{
  display:flex; justify-content:center; gap:8px; margin-top:28px;
  font-size:.85rem; color:rgba(255,255,255,.55);
  animation:aparecer .9s ease both .45s;
}
.migas a{ color:var(--turquesa-cl); font-weight:600; }
.migas a:hover{ text-decoration:underline; }

/* ============ FRANJA DE MARCAS (marquee) ============ */
.marcas{ background:var(--blanco); padding:48px 0 8px; }
.marcas-titulo{
  text-align:center; font-size:.85rem; font-weight:700; letter-spacing:.18em;
  text-transform:uppercase; color:var(--texto-suave); margin-bottom:28px;
}
.marquee{ overflow:hidden; position:relative;
  mask-image:linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); }
.marquee-pista{ display:flex; gap:70px; width:max-content; animation:desplazar 30s linear infinite; align-items:center; }
.marquee:hover .marquee-pista{ animation-play-state:paused; }
@keyframes desplazar{ to{ transform:translateX(-50%); } }
.marquee-pista img{
  height:64px; width:auto; object-fit:contain;
  filter:grayscale(1) opacity(.55); transition:var(--transicion);
}
.marquee-pista img:hover{ filter:none; transform:scale(1.08); }

/* ============ SECCIONES GENÉRICAS ============ */
.seccion{ padding:96px 0; }
.seccion-cabecera{ text-align:center; max-width:680px; margin:0 auto 60px; }
.kicker{
  display:inline-block; font-size:.8rem; font-weight:800; letter-spacing:.2em;
  text-transform:uppercase; color:var(--turquesa);
  background:rgba(0,169,196,.10); padding:7px 18px; border-radius:999px; margin-bottom:16px;
}
.pagina-hero .kicker{ background:rgba(255,255,255,.12); color:var(--turquesa-cl); }
.seccion-cabecera h2, h2.titulo-seccion{
  font-size:clamp(1.7rem, 3vw, 2.4rem); font-weight:800;
  color:var(--azul-oscuro); letter-spacing:-.02em; line-height:1.2; margin-bottom:14px;
}
.seccion-cabecera p{ color:var(--texto-suave); font-size:1.05rem; }

/* ============ PRODUCTOS (tarjetas) ============ */
.productos{ background:var(--hielo); position:relative; }
.grid-productos{ display:grid; grid-template-columns:repeat(4, 1fr); gap:24px; }
.tarjeta-producto{
  background:var(--blanco); border-radius:var(--radio); overflow:hidden;
  box-shadow:0 8px 24px rgba(13,43,94,.07);
  transition:var(--transicion);
  display:flex; flex-direction:column; position:relative;
}
.tarjeta-producto::after{
  content:""; position:absolute; inset:auto 0 0 0; height:4px;
  background:linear-gradient(90deg, var(--azul), var(--turquesa));
  transform:scaleX(0); transform-origin:left; transition:var(--transicion);
}
.tarjeta-producto:hover{ transform:translateY(-10px); box-shadow:var(--sombra); }
.tarjeta-producto:hover::after{ transform:scaleX(1); }
.tarjeta-producto .imagen{ overflow:hidden; aspect-ratio:300/220; background:#e8f0f8; }
.tarjeta-producto .imagen img{
  width:100%; height:100%; object-fit:cover; transition:transform .6s ease;
}
.tarjeta-producto:hover .imagen img{ transform:scale(1.07); }
.tarjeta-producto .cuerpo{ padding:22px 22px 26px; flex:1; display:flex; flex-direction:column; }
.tarjeta-producto h3{ font-size:1.05rem; font-weight:700; color:var(--azul-oscuro); margin-bottom:8px; }
.tarjeta-producto p{ font-size:.9rem; color:var(--texto-suave); flex:1; }
.tarjeta-producto .enlace{
  margin-top:16px; font-weight:700; font-size:.9rem; color:var(--turquesa);
  display:inline-flex; align-items:center; gap:6px;
}
.tarjeta-producto .enlace svg{ transition:var(--transicion); }
.tarjeta-producto:hover .enlace svg{ transform:translateX(5px); }

/* ============ FILAS DE DETALLE (páginas de producto) ============ */
.fila-detalle{
  display:grid; grid-template-columns:1fr 1fr;
  gap:64px; align-items:center; padding:54px 0;
}
.fila-detalle + .fila-detalle{ border-top:1px solid #e8eff7; }
.fila-detalle.invertida .detalle-imagen{ order:2; }
.detalle-imagen{ position:relative; }
.detalle-imagen img{
  border-radius:24px; box-shadow:var(--sombra);
  background:var(--hielo); width:100%; object-fit:cover;
}
.detalle-imagen::before{
  content:""; position:absolute; inset:22px -22px -22px 22px;
  border:2px solid rgba(0,169,196,.30); border-radius:24px; z-index:-1;
}
.fila-detalle.invertida .detalle-imagen::before{ inset:22px 22px -22px -22px; }
.detalle-texto h2, .detalle-texto h3{
  font-size:clamp(1.4rem, 2.4vw, 1.9rem); font-weight:800;
  color:var(--azul-oscuro); letter-spacing:-.02em; margin-bottom:14px;
}
.detalle-texto p{ color:var(--texto-suave); margin-bottom:14px; }
.lista-chequeos{ list-style:none; display:grid; gap:10px; margin-top:18px; }
.lista-chequeos li{
  display:flex; gap:12px; align-items:flex-start;
  font-size:.96rem; color:var(--texto);
}
.lista-chequeos li::before{
  content:"✓"; flex:0 0 22px; height:22px; border-radius:50%;
  display:grid; place-items:center; font-size:.75rem; font-weight:800;
  background:linear-gradient(135deg, var(--azul), var(--turquesa)); color:#fff;
  margin-top:2px;
}

/* ============ VALOR AGREGADO ============ */
.valor-grid{ display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center; }
.valor-imagen{ position:relative; }
.valor-imagen img{ border-radius:24px; box-shadow:var(--sombra); }
.valor-imagen::before{
  content:""; position:absolute; inset:24px -24px -24px 24px;
  border:2px solid rgba(0,169,196,.35); border-radius:24px; z-index:-1;
}
.lista-valor{ display:grid; gap:18px; margin-top:34px; }
.item-valor{
  display:flex; gap:20px; align-items:flex-start;
  background:var(--blanco); border:1px solid #e3ecf5;
  padding:22px 24px; border-radius:var(--radio); transition:var(--transicion);
}
.item-valor:hover{
  border-color:transparent; box-shadow:var(--sombra); transform:translateX(8px);
}
.item-valor .icono{
  flex:0 0 52px; height:52px; border-radius:14px;
  display:grid; place-items:center;
  background:linear-gradient(135deg, rgba(27,77,161,.12), rgba(0,169,196,.16));
  color:var(--azul);
}
.item-valor h3{ font-size:1.05rem; font-weight:700; color:var(--azul-oscuro); margin-bottom:4px; }
.item-valor p{ font-size:.92rem; color:var(--texto-suave); }

/* ============ REPRESENTACIONES ============ */
.representaciones{ background:linear-gradient(160deg, var(--azul-noche), var(--azul-oscuro)); color:#fff; }
.representaciones .seccion-cabecera h2{ color:#fff; }
.representaciones .seccion-cabecera p{ color:rgba(255,255,255,.7); }
.grid-repre{ display:grid; grid-template-columns:repeat(3, 1fr); gap:22px; }
.tarjeta-repre{
  background:rgba(255,255,255,.96); border-radius:var(--radio);
  padding:30px; display:grid; place-items:center; min-height:150px;
  transition:var(--transicion);
}
.tarjeta-repre:hover{ transform:translateY(-8px) scale(1.02); box-shadow:0 24px 50px rgba(0,0,0,.35); }
.tarjeta-repre img{ max-height:88px; width:auto; object-fit:contain; }

/* ============ PRESENCIA / MAPA ============ */
.presencia .mapa{ margin:40px auto 50px; max-width:980px; }
.presencia .mapa img{ width:100%; }
.oficinas{ display:grid; grid-template-columns:1fr 1fr; gap:24px; max-width:860px; margin-inline:auto; }
.oficina{
  background:var(--hielo); border-radius:var(--radio); padding:30px 34px;
  display:flex; gap:18px; align-items:flex-start; transition:var(--transicion);
  border:1px solid transparent;
}
.oficina:hover{ border-color:rgba(0,169,196,.4); box-shadow:var(--sombra); transform:translateY(-6px); }
.oficina .bandera{ font-size:2rem; line-height:1; }
.oficina h3{ color:var(--azul-oscuro); font-size:1.1rem; margin-bottom:6px; }
.oficina a{ color:var(--turquesa); font-weight:600; display:block; margin-top:2px; }
.oficina a:hover{ text-decoration:underline; }

/* ============ BOLETINES ============ */
.boletines{ background:var(--hielo); }
.grid-boletines{ display:grid; grid-template-columns:repeat(3,1fr); gap:26px; }
.tarjeta-boletin{
  background:var(--blanco); border-radius:var(--radio); overflow:hidden;
  box-shadow:0 8px 24px rgba(13,43,94,.07); transition:var(--transicion);
  display:flex; flex-direction:column;
}
.tarjeta-boletin:hover{ transform:translateY(-10px); box-shadow:var(--sombra); }
.tarjeta-boletin .imagen{ aspect-ratio:16/10; overflow:hidden; }
.tarjeta-boletin .imagen img{ width:100%; height:100%; object-fit:cover; transition:transform .6s ease; }
.tarjeta-boletin:hover .imagen img{ transform:scale(1.06); }
.tarjeta-boletin .cuerpo{ padding:24px; flex:1; display:flex; flex-direction:column; }
.tarjeta-boletin .chip{
  align-self:flex-start; font-size:.72rem; font-weight:800; letter-spacing:.12em;
  text-transform:uppercase; color:var(--azul);
  background:rgba(27,77,161,.10); padding:5px 12px; border-radius:999px; margin-bottom:12px;
}
.tarjeta-boletin h3{ font-size:1.08rem; color:var(--azul-oscuro); line-height:1.35; margin-bottom:10px; }
.tarjeta-boletin p{ font-size:.92rem; color:var(--texto-suave); flex:1; }

/* ============ FORMULARIO DE CONTACTO ============ */
.contacto-grid{ display:grid; grid-template-columns:1.1fr .9fr; gap:56px; align-items:start; }
.formulario{
  background:var(--blanco); border-radius:24px; box-shadow:var(--sombra);
  padding:40px;
}
.formulario h2{ font-size:1.4rem; font-weight:800; color:var(--azul-oscuro); margin-bottom:8px; }
.formulario .nota{ font-size:.95rem; color:var(--texto-suave); margin-bottom:26px; }
.campos{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.campo{ display:grid; gap:7px; }
.campo.ancho{ grid-column:1 / -1; }
.campo label{ font-size:.85rem; font-weight:700; color:var(--azul-oscuro); }
.campo input, .campo select, .campo textarea{
  font-family:var(--fuente); font-size:.95rem; color:var(--texto);
  padding:13px 16px; border:1.5px solid #dde7f2; border-radius:12px;
  background:var(--hielo); transition:var(--transicion); width:100%;
}
.campo textarea{ resize:vertical; min-height:130px; }
.campo input:focus, .campo select:focus, .campo textarea:focus{
  outline:none; border-color:var(--turquesa); background:#fff;
  box-shadow:0 0 0 4px rgba(0,169,196,.14);
}
.formulario .boton{ margin-top:24px; width:100%; justify-content:center; }
.form-exito{
  display:none; margin-top:18px; padding:14px 18px; border-radius:12px;
  background:rgba(0,208,132,.12); color:#0a7a52; font-weight:600; font-size:.93rem;
}
.form-exito.visible{ display:block; }

.panel-contacto{ display:grid; gap:20px; }
.tarjeta-contacto{
  background:var(--hielo); border-radius:var(--radio); padding:26px 30px;
  display:flex; gap:18px; align-items:flex-start;
  border:1px solid transparent; transition:var(--transicion);
}
.tarjeta-contacto:hover{ border-color:rgba(0,169,196,.4); box-shadow:var(--sombra); transform:translateY(-4px); }
.tarjeta-contacto .icono{
  flex:0 0 50px; height:50px; border-radius:14px; display:grid; place-items:center;
  background:linear-gradient(135deg, rgba(27,77,161,.12), rgba(0,169,196,.16));
  color:var(--azul); font-size:1.4rem;
}
.tarjeta-contacto h3{ font-size:1.02rem; color:var(--azul-oscuro); margin-bottom:4px; }
.tarjeta-contacto p, .tarjeta-contacto a{ font-size:.93rem; color:var(--texto-suave); display:block; }
.tarjeta-contacto a:hover{ color:var(--turquesa); }

/* ============ CTA FINAL ============ */
.cta-final{
  background:
    radial-gradient(600px 300px at 90% 0%, rgba(79,209,232,.25), transparent 60%),
    linear-gradient(120deg, var(--azul), var(--turquesa));
  border-radius:28px; color:#fff; text-align:center;
  padding:70px 30px; position:relative; overflow:hidden;
}
.cta-final h2{ font-size:clamp(1.6rem, 2.8vw, 2.3rem); font-weight:800; margin-bottom:14px; letter-spacing:-.02em; }
.cta-final p{ color:rgba(255,255,255,.85); max-width:560px; margin:0 auto 32px; }
.cta-final .boton-primario{ background:#fff; color:var(--azul-oscuro); }

/* ============ FOOTER ============ */
.footer{ background:var(--azul-noche); color:rgba(255,255,255,.75); margin-top:96px; }
.footer-grid{
  display:grid; grid-template-columns:1.4fr 1fr 1fr 1.2fr; gap:48px;
  padding:70px 0 50px;
}
.footer img.logo-footer{ height:56px; width:auto; margin-bottom:18px; }
.footer h4{
  color:#fff; font-size:.85rem; font-weight:800; letter-spacing:.15em;
  text-transform:uppercase; margin-bottom:18px;
}
.footer ul{ list-style:none; display:grid; gap:10px; }
.footer a{ transition:var(--transicion); font-size:.95rem; }
.footer a:hover{ color:var(--turquesa-cl); padding-left:4px; }
.footer .contacto-item{ display:flex; gap:10px; align-items:flex-start; margin-bottom:12px; font-size:.95rem; }
.footer-base{
  border-top:1px solid rgba(255,255,255,.12);
  padding:22px 0; text-align:center; font-size:.85rem; color:rgba(255,255,255,.5);
}

/* ============ FLOTANTES ============ */
.whatsapp-flotante{
  position:fixed; right:24px; bottom:24px; z-index:90;
  width:60px; height:60px; border-radius:50%;
  background:#25d366; display:grid; place-items:center;
  box-shadow:0 14px 34px rgba(37,211,102,.45);
  transition:var(--transicion);
  animation:latido 2.6s ease-in-out infinite;
}
.whatsapp-flotante:hover{ transform:scale(1.12) rotate(8deg); }
@keyframes latido{ 0%,100%{ box-shadow:0 14px 34px rgba(37,211,102,.45);} 50%{ box-shadow:0 14px 34px rgba(37,211,102,.45), 0 0 0 14px rgba(37,211,102,0);} }

.ir-arriba{
  position:fixed; right:28px; bottom:100px; z-index:90;
  width:46px; height:46px; border-radius:50%;
  background:var(--azul); color:#fff; border:none; cursor:pointer;
  display:grid; place-items:center;
  opacity:0; pointer-events:none; transform:translateY(14px);
  transition:var(--transicion);
  box-shadow:0 10px 26px rgba(13,43,94,.35);
}
.ir-arriba.visible{ opacity:1; pointer-events:auto; transform:translateY(0); }
.ir-arriba:hover{ background:var(--turquesa); }

/* ============ RESPONSIVE ============ */
@media (max-width: 1024px){
  .grid-productos{ grid-template-columns:repeat(2,1fr); }
  .hero-grid{ grid-template-columns:1fr; gap:44px; }
  .hero{ padding-top:120px; min-height:auto; }
  .hero p{ max-width:100%; }
  .valor-grid, .contacto-grid{ grid-template-columns:1fr; gap:44px; }
  .grid-repre{ grid-template-columns:repeat(2,1fr); }
  .grid-boletines{ grid-template-columns:1fr 1fr; }
  .footer-grid{ grid-template-columns:1fr 1fr; }
  .fila-detalle{ grid-template-columns:1fr; gap:40px; }
  .fila-detalle.invertida .detalle-imagen{ order:0; }
}
@media (max-width: 720px){
  .nav{
    position:fixed; inset:0 0 0 auto; width:min(330px, 86vw);
    background:var(--blanco); flex-direction:column; align-items:flex-start;
    padding:100px 30px 40px; gap:8px;
    transform:translateX(100%); transition:transform .4s cubic-bezier(.22,.9,.3,1);
    box-shadow:-20px 0 60px rgba(13,43,94,.18); z-index:99;
    overflow-y:auto;
  }
  .nav.abierto{ transform:translateX(0); }
  .nav > a, .nav .nav-item-sub > a,
  .header .nav > a, .header .nav .nav-item-sub > a{ color:var(--azul-oscuro); width:100%; }
  .nav-item-sub{ width:100%; }
  .submenu{
    position:static; opacity:1; visibility:visible; transform:none;
    box-shadow:none; padding:0 0 0 18px; min-width:0;
  }
  .menu-burger{ display:block; z-index:100; }
  .menu-burger.abierto span{ background:var(--azul-oscuro); }
  .menu-burger.abierto span:nth-child(1){ transform:translateY(8px) rotate(45deg); }
  .menu-burger.abierto span:nth-child(2){ opacity:0; }
  .menu-burger.abierto span:nth-child(3){ transform:translateY(-8px) rotate(-45deg); }
  .idiomas{ display:none; }
  .grid-productos, .grid-boletines, .oficinas{ grid-template-columns:1fr; }
  .grid-repre{ grid-template-columns:1fr 1fr; gap:14px; }
  .hero-cifras{ gap:28px; }
  .seccion{ padding:64px 0; }
  .pagina-hero{ padding:150px 0 80px; }
  .footer-grid{ grid-template-columns:1fr; gap:36px; }
  .campos{ grid-template-columns:1fr; }
  .formulario{ padding:28px 22px; }
}