/* Tipografías alojadas en la propia web (Sora y Figtree, licencia OFL) */
@font-face { font-family: "Sora"; font-style: normal; font-weight: 300; font-display: swap; src: url("/assets/fonts/sora-latin-300-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Sora"; font-style: normal; font-weight: 300; font-display: swap; src: url("/assets/fonts/sora-latin-ext-300-normal.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Sora"; font-style: normal; font-weight: 400; font-display: swap; src: url("/assets/fonts/sora-latin-400-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Sora"; font-style: normal; font-weight: 400; font-display: swap; src: url("/assets/fonts/sora-latin-ext-400-normal.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Sora"; font-style: normal; font-weight: 600; font-display: swap; src: url("/assets/fonts/sora-latin-600-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Sora"; font-style: normal; font-weight: 600; font-display: swap; src: url("/assets/fonts/sora-latin-ext-600-normal.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Sora"; font-style: normal; font-weight: 700; font-display: swap; src: url("/assets/fonts/sora-latin-700-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Sora"; font-style: normal; font-weight: 700; font-display: swap; src: url("/assets/fonts/sora-latin-ext-700-normal.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Figtree"; font-style: normal; font-weight: 400; font-display: swap; src: url("/assets/fonts/figtree-latin-400-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Figtree"; font-style: normal; font-weight: 400; font-display: swap; src: url("/assets/fonts/figtree-latin-ext-400-normal.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Figtree"; font-style: normal; font-weight: 500; font-display: swap; src: url("/assets/fonts/figtree-latin-500-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Figtree"; font-style: normal; font-weight: 500; font-display: swap; src: url("/assets/fonts/figtree-latin-ext-500-normal.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Figtree"; font-style: normal; font-weight: 600; font-display: swap; src: url("/assets/fonts/figtree-latin-600-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Figtree"; font-style: normal; font-weight: 600; font-display: swap; src: url("/assets/fonts/figtree-latin-ext-600-normal.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }

/* Estilos comunes de la web de Nautilus Ocean Corporation */
  :root {
    --marino: #152969;      /* azul de marca */
    --abisal: #0B1740;
    --medio: #3D68B0;
    --espuma: #F4F7FA;
    --bruma: #E3EAF3;
    --tinta: #0F1B3D;
    --gris: #4A5878;
    --pradera: #2F8F78;     /* verde praderas marinas, solo para capital natural */
    --display: "Sora", "Helvetica Neue", Arial, sans-serif;
    --texto: "Figtree", "Helvetica Neue", Arial, sans-serif;
    --gutter: clamp(20px, 5vw, 72px);
    --ancho: 1200px;
  }
  * { box-sizing: border-box; margin: 0; padding: 0; }
  html { scroll-behavior: smooth; scroll-padding-top: 72px; }
  body { font-family: var(--texto); font-size: 1.0625rem; line-height: 1.6; color: var(--tinta); background: #fff; -webkit-font-smoothing: antialiased; }
  img { max-width: 100%; display: block; }
  a { color: inherit; }
  :focus-visible { outline: 3px solid var(--medio); outline-offset: 3px; }
  .wrap { max-width: var(--ancho); margin: 0 auto; padding-inline: var(--gutter); }
  h1, h2, h3 { font-family: var(--display); letter-spacing: -.02em; line-height: 1.1; }
  h2 { font-size: clamp(1.9rem, 4vw, 3rem); font-weight: 600; max-width: 22ch; }
  h3 { font-weight: 600; }
  .lead { font-size: clamp(1.1rem, 1.6vw, 1.25rem); color: var(--gris); max-width: 60ch; margin-top: 20px; }
  section { padding-block: clamp(72px, 10vw, 136px); }

  /* ---------- Cabecera ---------- */
  .barra { position: fixed; inset: 0 0 auto 0; z-index: 20; transition: background .3s, box-shadow .3s; }
  .barra .wrap { display: flex; align-items: center; justify-content: space-between; height: 72px; gap: 20px; }
  .barra .logo img { height: 30px; width: auto; }
  .barra .logo .navy { display: none; }
  .barra nav { display: flex; gap: clamp(14px, 2.4vw, 30px); font-size: .95rem; font-weight: 500; }
  .barra nav a { text-decoration: none; color: rgba(255,255,255,.88); padding-block: 6px; }
  .barra nav a:hover { color: #fff; }
  .barra.solida { background: rgba(255,255,255,.96); box-shadow: 0 1px 0 rgba(21,41,105,.12); backdrop-filter: blur(8px); }
  .barra.solida .logo .blanco { display: none; }
  .barra.solida .logo .navy { display: block; }
  .barra.solida nav a { color: var(--gris); }
  .barra.solida nav a:hover { color: var(--marino); }
  .barra .contacto-nav { border: 1.5px solid currentColor; border-radius: 999px; padding: 6px 16px !important; }
  /* Selector de idioma desplegable: muestra siempre el idioma activo */
  .idioma { position: relative; }
  .idioma summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 6px; padding: 6px 2px; font-size: .9rem; font-weight: 600; letter-spacing: .04em; color: rgba(255,255,255,.92); user-select: none; }
  .idioma summary::-webkit-details-marker { display: none; }
  .idioma summary svg { width: 10px; height: 10px; transition: transform .2s ease; }
  .idioma[open] summary svg { transform: rotate(180deg); }
  .barra.solida .idioma summary { color: var(--tinta); }
  .idioma ul { position: absolute; right: 0; top: calc(100% + 10px); min-width: 150px; list-style: none; margin: 0; padding: 6px; background: #fff; border-radius: 8px; box-shadow: 0 10px 30px rgba(11,23,64,.18); }
  .barra nav .idioma ul a { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 9px 12px; border-radius: 6px; color: var(--tinta); font-weight: 500; text-decoration: none; }
  .barra nav .idioma ul a:hover, .barra nav .idioma ul a:focus-visible { background: var(--espuma); color: var(--marino); }
  .barra nav .idioma ul a[aria-current="true"] { color: var(--marino); font-weight: 600; }
  .barra nav .idioma ul a[aria-current="true"]::after { content: "✓"; font-size: .85em; }
  @media (max-width: 860px) { .barra nav > a:not(.contacto-nav) { display: none; } }

  /* ---------- Portada ---------- */
  /* El horizonte de la foto pasa entre "Nos apasiona" (cielo) y "el mar." (mar).
     --lineas = líneas del titular por encima del horizonte; el JS afina la posición en cada pantalla. */
  .portada { --fs: clamp(2.6rem, min(8vw, 11.5svh), 6.4rem); --lineas: 1; position: relative; height: 100svh; min-height: 600px; display: flex; align-items: flex-start; color: #fff; padding: 0; overflow: hidden; }
  html[lang="en"] .portada { --lineas: 2; }
  .portada .fondo { position: absolute; inset: 0; }
  .portada .fondo img { width: 100%; height: 100%; object-fit: cover; object-position: center 60%; }
  .portada .fondo { overflow: hidden; }
  .portada::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(11,23,64,.45) 0%, rgba(11,23,64,0) 28%, rgba(11,23,64,.2) 52%, rgba(11,23,64,.82) 100%); }
  .portada .wrap { position: relative; z-index: 1; width: 100%; padding-top: calc(47.4svh - (var(--lineas) * 1.1 - .05) * var(--fs)); padding-bottom: clamp(28px, 6svh, 80px); }
  .portada h1 { font-size: var(--fs); line-height: 1.1; font-weight: 300; letter-spacing: -.035em; max-width: 12ch; }
  .portada h1 strong { font-weight: 700; display: block; }
  .portada h1 { text-wrap: balance; }
  html[lang="en"] .portada h1 { max-width: 16ch; }
  .portada p { margin-top: 24px; font-size: clamp(1.1rem, 1.8vw, 1.35rem); max-width: 50ch; color: rgba(255,255,255,.9); }
  @media (max-height: 640px) { .portada p { font-size: 1rem; margin-top: 14px; } .portada .lema { margin-top: 16px; padding-top: 12px; } }
  .lema { margin-top: clamp(24px, 5svh, 64px); display: grid; grid-template-columns: repeat(4, auto); justify-content: start; gap: 0; border-top: 1px solid rgba(255,255,255,.35); padding-top: 18px; font-family: var(--display); font-size: .95rem; letter-spacing: .02em; }
  .lema span { padding-right: clamp(18px, 3vw, 44px); }
  .lema span + span { padding-left: clamp(18px, 3vw, 44px); border-left: 1px solid rgba(255,255,255,.35); }
  @media (max-width: 620px) {
    .lema { grid-template-columns: 1fr 1fr; row-gap: 10px; }
    .lema { font-size: .9rem; }
    .lema span { white-space: nowrap; padding-right: 12px; }
    .lema span + span { padding-left: 12px; }
    .lema span:nth-child(3) { border-left: 0; padding-left: 0; }
  }

  /* ---------- Manifiesto ---------- */
  .manifiesto .intro { display: block; }
  .manifiesto .intro h2 { max-width: none; }
  .manifiesto .intro p { margin-top: 22px; max-width: 62ch; font-size: clamp(1.15rem, 1.7vw, 1.35rem); color: var(--gris); }
  .manifiesto .intro p strong { color: var(--tinta); font-weight: 600; }
  .motivos { margin-top: clamp(48px, 7vw, 88px); display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; list-style: none; counter-reset: m; }
  .motivo { --pad: clamp(24px, 3vw, 36px); position: relative; min-height: 520px; border-radius: 4px; overflow: hidden; display: flex; flex-direction: column; justify-content: flex-end; padding: var(--pad); color: #fff; }
  .motivo .num { position: absolute; top: 24px; left: clamp(24px, 3vw, 36px); font-family: var(--display); font-size: .9rem; opacity: .8; }
  .motivo .tipo { font-family: var(--display); font-size: .95rem; opacity: .85; }
  .motivo h3 { font-size: clamp(1.4rem, 2vw, 1.7rem); margin-top: 8px; }
  .motivo p { margin-top: 12px; color: rgba(255,255,255,.88); }
  /* Fotos de Unsplash (licencia Unsplash, uso comercial libre):
     plástico: Naja Bertolt Jensen, Bali — unsplash.com/photos/bN_pgc53NO4
     vida: Joan Li, John Brewer Reef (Australia) — unsplash.com/photos/Q0s3x7yvUeU */
  .motivo.plastico { background: var(--abisal) url("/assets/manifiesto/plastico.jpg") center/cover; }
  .motivo.vida { background: #0E3A5C url("/assets/manifiesto/vida.jpg") center/cover; }
  .motivo.plastico::before, .motivo.vida::before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(11,23,64,0) 48%, rgba(11,23,64,.55) 72%, rgba(11,23,64,.88) 100%); }
  /* Bloque 2: la foto es muy luminosa; velo más alto y denso + sombra suave para que el blanco se lea */
  .motivo.vida::before { background: linear-gradient(180deg, rgba(11,23,64,0) 0%, rgba(11,23,64,0) 40%, rgba(11,23,64,.7) 66%, rgba(11,23,64,.93) 100%); }
  .motivo.plastico .tipo, .motivo.plastico h3, .motivo.plastico p,
  .motivo.vida .tipo, .motivo.vida h3, .motivo.vida p { text-shadow: 0 1px 2px rgba(5,12,35,.55), 0 2px 18px rgba(5,12,35,.5); }
  /* Bloque 3: escultura arriba (foto aportada por Nautilus), que se funde en azul; texto abajo como en los bloques 1 y 2 */
  .motivo.ciencia { background: var(--abisal); }
  .motivo.ciencia p { color: rgba(255,255,255,.88); }
  .motivo.ciencia .tipo { margin-top: auto; padding-top: 18px; }
  .motivo-foto { order: -1; position: relative; margin: calc(-1 * var(--pad)) calc(-1 * var(--pad)) 0; }
  .motivo-foto img { width: 100%; height: 190px; object-fit: cover; object-position: 50% 100%; filter: brightness(1.18) saturate(1.05); }
  .motivo-foto::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 34%; background: linear-gradient(180deg, rgba(11,23,64,0) 0%, rgba(11,23,64,.55) 55%, var(--abisal) 100%); pointer-events: none; }
  @media (max-width: 900px) { .motivo-foto img { height: 200px; } }
  .motivo > * { position: relative; }
  .motivo > .num { position: absolute; }
  /* Entrada ligada al scroll en "La emoción nos mueve a la acción" (el JS fija transform/opacidad según el scroll) */
  @media (prefers-reduced-motion: no-preference) {
    .manifiesto.anima .intro h2 .pal { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .08em; margin-bottom: -.08em; }
    .manifiesto.anima .intro h2 .pal > span { display: inline-block; will-change: transform; }
    .manifiesto.anima .motivo { will-change: transform, opacity, clip-path; }
  }

  /* PC con ratón: se ven la cabecera (emoción/hallazgo) y el título; el texto aparece al pasar el ratón */
  @media (hover: hover) and (pointer: fine) and (min-width: 901px) {
    .motivo { cursor: default; }
    .motivo > * { z-index: 1; }
    .motivo::after { content: ""; position: absolute; inset: 0; z-index: 0; background: linear-gradient(180deg, rgba(11,23,64,0) 0%, rgba(11,23,64,.55) 45%, rgba(11,23,64,.75) 100%); opacity: 0; transition: opacity .4s ease; pointer-events: none; }
    .motivo:hover::after, .motivo:focus-visible::after, .motivo:focus-within::after { opacity: 1; }
    .motivo p { max-height: 0; margin-top: 0; opacity: 0; overflow: hidden; transform: translateY(8px); transition: max-height .5s ease, margin-top .5s ease, opacity .35s ease .1s, transform .45s ease .05s; }
    .motivo:hover p, .motivo:focus-visible p, .motivo:focus-within p { max-height: 16em; margin-top: 12px; opacity: 1; transform: none; }
    /* Altura fija para que la fila no salte al desplegar el texto; en la caja 3 la escultura cede sitio */
    .motivos { margin-inline: calc(-1 * min(4vw, 64px)); gap: 14px; }
    .motivos .motivo { --pad: 28px; height: 540px; min-height: 0; }
    .motivo .num { left: 28px; }
    .motivo h3 { font-size: clamp(1.3rem, 1.7vw, 1.6rem); }
    .motivo.ciencia .motivo-foto { position: absolute; top: 0; left: 0; right: 0; margin: 0; z-index: 0; }
    .motivo-foto img { height: 300px; }
    .motivo p { font-size: .98rem; line-height: 1.5; }
    .motivo:focus-visible { outline: 3px solid var(--medio); outline-offset: 3px; }
  }
  @media (max-width: 900px) {
    /* Móvil y tableta: carrusel horizontal con desplazamiento por tarjeta */
    .motivos { display: flex; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; scrollbar-width: none;
      margin-inline: calc(-1 * var(--gutter)); padding: 4px var(--gutter) 8px; scroll-padding-inline: var(--gutter); }
    .motivos::-webkit-scrollbar { display: none; }
    .motivo { flex: 0 0 min(82%, 420px); min-height: 460px; scroll-snap-align: start; }
    .puntos { display: flex; justify-content: center; gap: 8px; margin-top: 18px; }
    .puntos button { width: 8px; height: 8px; border-radius: 50%; border: 0; padding: 0; background: #C9D3E3; cursor: pointer; transition: background .3s, width .3s; }
    .puntos button[aria-current="true"] { width: 22px; border-radius: 4px; background: var(--marino); }
  }
  @media (min-width: 901px) { .puntos { display: none; } }

  /* ---------- Cifras ---------- */
  .cifras { padding: 0; }
  .cifras .bloque { padding-block: clamp(72px, 9vw, 120px); }
  .cifras .da { background: var(--espuma); }
  .cifras .hacemos { background: var(--marino); color: #fff; }
  .cifras .titulo { display: flex; justify-content: space-between; align-items: end; gap: 24px; flex-wrap: wrap; }
  .cifras .hacemos h2 { color: #fff; }
  .da .rejilla { grid-template-columns: repeat(5, 1fr); }
  .hacemos .rejilla { grid-template-columns: repeat(4, 1fr); }
  @media (max-width: 1100px) { .da .rejilla, .hacemos .rejilla { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); } }
  .rejilla { margin-top: clamp(40px, 6vw, 72px); display: grid; gap: clamp(28px, 4vw, 48px) clamp(20px, 3vw, 40px); list-style: none; }
  .rejilla li { border-top: 1.5px solid rgba(21,41,105,.25); padding-top: 18px; }
  .hacemos .rejilla li { border-top-color: rgba(255,255,255,.3); }
  .cifra { font-family: var(--display); font-weight: 300; font-size: clamp(2.6rem, 4.4vw, 3.9rem); line-height: 1; letter-spacing: -.04em; color: var(--marino); white-space: nowrap; }
  .hacemos .cifra { color: #fff; }
  .cifra .n { display: inline-block; font-variant-numeric: tabular-nums; }
  .cifra small.pre { margin-left: 0; margin-right: .06em; }
  .cifra small { font-size: .45em; letter-spacing: -.01em; margin-left: .12em; }
  .rejilla p { margin-top: 12px; color: var(--gris); max-width: 28ch; }
  .hacemos .rejilla p { color: rgba(255,255,255,.82); }

  /* ---------- Cita ---------- */
  .cita { position: relative; min-height: 92svh; display: flex; align-items: center; color: #fff; background: var(--abisal) url("/assets/ballena.jpg") center/cover; }
  .cita::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(11,23,64,.15) 0%, rgba(11,23,64,.25) 40%, rgba(11,23,64,.75) 100%); }
  .cita .wrap { position: relative; width: 100%; display: flex; justify-content: flex-end; }
  .cita blockquote { max-width: 30ch; font-family: var(--display); font-weight: 300; font-size: clamp(1.5rem, 2.9vw, 2.35rem); line-height: 1.3; letter-spacing: -.015em; }
  .cita blockquote strong { font-weight: 600; }
  @media (max-width: 760px) { .cita::before { background: rgba(11,23,64,.62); } .cita .wrap { justify-content: flex-start; } }

  /* ---------- Objetivos ---------- */
  .metas { margin-top: clamp(40px, 6vw, 72px); display: grid; grid-template-columns: repeat(3, 1fr); list-style: none; border-top: 1.5px solid var(--marino); }
  .meta { padding: 32px clamp(16px, 2.5vw, 36px) 8px 0; }
  .meta + .meta { border-left: 1px solid var(--bruma); padding-left: clamp(16px, 2.5vw, 36px); }
  .meta h3 { font-size: 1.3rem; }
  @media (min-width: 861px) { .meta h3 { min-height: 2.3em; } }
  .meta .eq { margin-top: 22px; font-family: var(--display); font-weight: 600; font-size: clamp(1.6rem, 2.6vw, 2.1rem); line-height: 1.12; color: var(--marino); letter-spacing: -.02em; }
  .meta .eq span { display: block; font-family: var(--texto); font-weight: 400; font-size: 1rem; color: var(--gris); letter-spacing: 0; margin-top: 8px; }
  .meta .filial { margin-top: 26px; }
  .meta .filial img { height: 36px; width: auto; }
  .meta .filial img.l-io { height: 28px; }
  .meta .filial img.l-opc { height: 20px; }
  @media (max-width: 860px) { .metas { grid-template-columns: 1fr; } .meta + .meta { border-left: 0; border-top: 1px solid var(--bruma); padding-left: 0; } }

  /* ---------- Qué hacemos ---------- */
  .hacer { background: var(--espuma); }
  .hacer > .wrap:first-child { padding-bottom: 0; }

  .capitulos { display: grid; gap: 0; }
  .capitulo { display: grid; grid-template-columns: 1fr 1fr; min-height: min(75svh, 820px); background: #fff; }
  .capitulo + .capitulo { border-top: 1px solid var(--bruma); }
  .capitulo.invertido { grid-template-columns: 1fr 1fr; }
  .capitulo.natural { grid-template-columns: .85fr 1.15fr; }
  .capitulo.natural .cap-texto { max-width: 780px; }
  .capitulo.invertido .cap-foto { order: 2; }
  .cap-foto { position: relative; overflow: hidden; background: var(--abisal); min-height: 420px; }
  .cap-foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
  .cap-foto::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(11,23,64,0) 45%, rgba(11,23,64,.78) 100%); }
  .cap-titulo { position: absolute; left: clamp(24px, 4vw, 64px); right: clamp(24px, 4vw, 64px); bottom: clamp(28px, 5vw, 64px); z-index: 1; color: #fff; }
  .cap-titulo span { font-family: var(--display); font-size: .95rem; opacity: .85; }
  .cap-titulo h3 { margin-top: 10px; font-size: clamp(2.2rem, 4.6vw, 4.2rem); font-weight: 600; letter-spacing: -.035em; line-height: 1.02; max-width: 12ch; }
  .cap-texto { padding: clamp(32px, 4vw, 64px) clamp(24px, 5vw, 88px); display: flex; flex-direction: column; justify-content: center; max-width: 700px; }
  .capitulo.invertido .cap-texto { justify-self: end; }
  .cap-logo { height: clamp(44px, 4.2vw, 60px); width: auto; align-self: flex-start; }
  .cap-logo.l-io { height: clamp(36px, 3.4vw, 48px); }
  .cap-logo.l-op { height: clamp(38px, 3.6vw, 52px); }
  .cap-lema { margin-top: 16px; font-family: var(--display); font-size: clamp(1.1rem, 1.5vw, 1.35rem); line-height: 1.3; letter-spacing: -.01em; color: var(--tinta); max-width: 26ch; }
  .cap-texto dl { margin-top: 20px; display: grid; gap: 12px; }
  .cap-texto dt { font-weight: 600; font-size: .95rem; }
  .cap-texto dd { color: var(--gris); font-size: 1rem; line-height: 1.55; }
  .sublineas { margin-top: 20px; display: grid; gap: 14px; }
  .sublineas h4 { font-family: var(--display); font-weight: 600; font-size: 1.15rem; color: var(--pradera); }
  .sublineas p { margin-top: 4px; color: var(--gris); font-size: 1rem; line-height: 1.55; }
  .cap-cartera { margin-top: 24px; padding-top: 16px; border-top: 1.5px solid var(--marino); display: flex; align-items: baseline; gap: 16px; }
  .natural .cap-cartera { border-top-color: var(--pradera); }
  .cap-cartera b { font-family: var(--display); font-weight: 300; font-size: clamp(2.6rem, 4vw, 3.6rem); line-height: 1; letter-spacing: -.04em; color: var(--marino); }
  .natural .cap-cartera b { color: var(--pradera); }
  .cap-cartera > span { color: var(--gris); max-width: 20ch; }
  @media (max-width: 900px) {
    .capitulo, .capitulo.invertido, .capitulo.natural { grid-template-columns: 1fr; min-height: 0; }
    .capitulo.invertido .cap-foto { order: 0; }
    .cap-foto { min-height: 62svh; }
    .capitulo.invertido .cap-texto { justify-self: start; }
  }
  @media (prefers-reduced-motion: no-preference) {
    .capitulo.animable .cap-foto img { transform: scale(1.12); transition: transform 1.8s cubic-bezier(.2,.7,.2,1); }
    .capitulo.animable.visto .cap-foto img { transform: none; }
  }

  .banda-renovables { margin: clamp(48px, 7vw, 88px) 0 0; height: clamp(260px, 42vw, 560px); overflow: hidden; }
  .banda-renovables img { width: 100%; height: 100%; object-fit: cover; object-position: center 60%; }
  .plataforma { margin-top: clamp(72px, 9vw, 120px); display: grid; grid-template-columns: 1fr 1.6fr; gap: clamp(28px, 5vw, 72px); align-items: start; }
  .plataforma h3 { font-size: clamp(1.4rem, 2.2vw, 1.75rem); }
  .plataforma > div > p { margin-top: 14px; color: var(--gris); }
  .servicios { list-style: none; display: grid; grid-template-columns: 1fr 1fr; gap: 0 32px; }
  .servicios li { padding: 14px 0; border-bottom: 1px solid #D3DDEA; }
  .proximamente { margin-top: 56px; padding: 28px clamp(24px, 3vw, 36px); border: 1.5px dashed #A9BAD3; border-radius: 4px; display: flex; gap: 12px 32px; flex-wrap: wrap; align-items: baseline; }
  .proximamente strong { font-family: var(--display); font-weight: 600; font-size: 1.15rem; }
  .proximamente span { color: var(--gris); }
  @media (max-width: 860px) { .plataforma { grid-template-columns: 1fr; } .servicios { grid-template-columns: 1fr; } }

  /* ---------- Cómo trabajamos ---------- */
  .metodo-cab { display: grid; grid-template-columns: 1.2fr 1fr; gap: clamp(32px, 6vw, 96px); align-items: end; }
  .experiencia { display: flex; gap: clamp(28px, 4vw, 56px); }
  .experiencia div { flex: 1 1 auto; border-left: 1.5px solid var(--marino); padding-left: 18px; }
  .experiencia b { display: block; white-space: nowrap; font-family: var(--display); font-weight: 300; font-size: clamp(2.4rem, 4vw, 3.4rem); line-height: 1; color: var(--marino); letter-spacing: -.04em; }
  .experiencia span { display: block; margin-top: 8px; color: var(--gris); max-width: 26ch; }
  .capacidades { margin-top: clamp(48px, 7vw, 80px); display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(28px, 4vw, 48px) clamp(24px, 3vw, 40px); list-style: none; }
  .capacidades h3 { font-size: 1.15rem; }
  .capacidades p { margin-top: 8px; color: var(--gris); }
  @media (max-width: 860px) { .metodo-cab { grid-template-columns: 1fr; } .capacidades { grid-template-columns: 1fr 1fr; } }
  @media (max-width: 560px) { .capacidades { grid-template-columns: 1fr; } .experiencia { flex-direction: column; } }

  .fases { margin-top: clamp(56px, 8vw, 88px); list-style: none; display: grid; grid-template-columns: repeat(3, 1fr); counter-reset: f; }
  .fases li { counter-increment: f; padding: 22px 24px 22px 0; border-top: 3px solid var(--marino); }
  .fases li:nth-child(1) { border-top-color: #9FB2D6; }
  .fases li:nth-child(2) { border-top-color: var(--medio); }
  .fases b { font-family: var(--display); font-weight: 600; font-size: 1.25rem; }
  .fases b::before { content: counter(f) " "; color: var(--medio); font-weight: 400; margin-right: 6px; }
  .fases span { display: block; margin-top: 6px; color: var(--gris); max-width: 30ch; }
  @media (max-width: 760px) { .fases { grid-template-columns: 1fr; } }

  /* ---------- Equipo ---------- */
  .equipo { background: var(--espuma); }
  .personas { margin-top: clamp(40px, 6vw, 64px); display: grid; grid-template-columns: repeat(3, 1fr); gap: 0 clamp(24px, 3vw, 48px); list-style: none; }
  .personas li { padding-block: 26px; border-top: 1px solid #D3DDEA; }
  .personas h3 { font-size: 1.15rem; }
  .personas .cargo { color: var(--medio); font-weight: 600; font-size: .95rem; margin-top: 2px; }
  .personas p:last-child { margin-top: 10px; color: var(--gris); font-size: 1rem; }
  .equipo .cierre { margin-top: 40px; color: var(--gris); max-width: 72ch; }
  @media (max-width: 900px) { .personas { grid-template-columns: 1fr 1fr; } }
  @media (max-width: 600px) { .personas { grid-template-columns: 1fr; } }

  /* ---------- Contacto ---------- */
  .contacto { background: var(--abisal); color: #fff; position: relative; overflow: hidden; }
  .contacto .wrap { display: grid; grid-template-columns: 1.3fr 1fr; gap: clamp(32px, 6vw, 96px); align-items: end; }
  .contacto h2 { color: #fff; }
  .contacto .lead { color: rgba(255,255,255,.8); }
  .contacto .publicos { list-style: none; }
  .contacto .publicos li { padding: 12px 0; border-bottom: 1px solid rgba(255,255,255,.18); color: rgba(255,255,255,.88); }
  .correo { display: inline-block; margin-top: 36px; font-family: var(--display); font-weight: 600; font-size: clamp(1.3rem, 2.8vw, 2rem); color: #fff; text-underline-offset: 8px; text-decoration-thickness: 1.5px; }
  .correo:hover { color: #B9CCEB; }
  @media (max-width: 860px) { .contacto .wrap { grid-template-columns: 1fr; } }

  footer { background: var(--abisal); color: rgba(255,255,255,.65); font-size: .9rem; padding-block: 28px; border-top: 1px solid rgba(255,255,255,.12); }
  footer .wrap { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px 24px; }
  footer img { height: 32px; width: auto; opacity: .95; }

  /* Entrada de la portada: único momento animado */
  @media (prefers-reduced-motion: no-preference) {
    /* Entrada: zoom suave del conjunto. Después, deriva lenta izquierda-derecha de la foto original (sin recomprimir) */
    .portada .fondo { animation: acercar 14s ease-out both; }
    .portada .fondo img { transform: scale(1.12); animation: deriva 26s ease-in-out infinite alternate; will-change: transform; }
    @keyframes deriva { from { transform: scale(1.12) translateX(-2.6%); } to { transform: scale(1.12) translateX(2.6%); } }
    .portada h1, .portada p, .portada .lema { animation: subir 1.1s cubic-bezier(.2,.7,.2,1) both; }
    .portada p { animation-delay: .25s; } .portada .lema { animation-delay: .5s; }
    @keyframes acercar { from { transform: scale(1.08); } to { transform: scale(1); } }
    @keyframes subir { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: none; } }
  }

/* Desplegable "Qué hacemos" del menú */
.menu-dd { position: relative; }
.menu-dd summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 6px; padding-block: 6px; font-size: .95rem; font-weight: 500; color: rgba(255,255,255,.88); user-select: none; }
.menu-dd summary::-webkit-details-marker { display: none; }
.menu-dd summary svg { width: 10px; height: 10px; transition: transform .2s ease; }
.menu-dd[open] summary svg { transform: rotate(180deg); }
.barra.solida .menu-dd summary { color: var(--gris); }
.menu-dd ul { position: absolute; left: -12px; top: calc(100% + 10px); min-width: 230px; list-style: none; margin: 0; padding: 6px; background: #fff; border-radius: 8px; box-shadow: 0 10px 30px rgba(var(--sombra),.18); }
.barra nav .menu-dd ul a { display: block; padding: 9px 12px; border-radius: 6px; color: var(--tinta); font-weight: 500; text-decoration: none; }
.barra nav .menu-dd ul a:hover, .barra nav .menu-dd ul a:focus-visible { background: var(--espuma); color: var(--marino); }
.barra nav .menu-dd ul a[aria-current="page"] { color: var(--marino); font-weight: 600; }
.barra nav .menu-dd ul li.sep { border-top: 1px solid var(--bruma); margin-top: 4px; padding-top: 4px; }
@media (max-width: 860px) { .barra nav > .menu-dd { display: none; } }

/* Enlace a la página de cada filial */
.cap-mas { display: inline-flex; gap: 8px; align-items: center; margin-top: 28px; font-weight: 600; color: var(--marino); text-decoration: none; border-bottom: 1.5px solid currentColor; padding-bottom: 3px; }
.cap-mas span { transition: transform .25s ease; }
.cap-mas:hover span { transform: translateX(4px); }

/* Qué hacemos: una tarjeta grande por filial */
.filiales { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; max-width: 1600px; margin: clamp(36px, 5vw, 56px) auto 0; padding-inline: var(--gutter); }
.filial-card { position: relative; min-height: min(84svh, 860px); border-radius: 6px; overflow: hidden; color: #fff; text-decoration: none; display: flex; flex-direction: column; justify-content: space-between; padding: clamp(24px, 2.4vw, 36px); background: #0B1411; }
.filial-card > img.f { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 1.4s cubic-bezier(.2,.7,.2,1); }
.filial-card:hover > img.f, .filial-card:focus-visible > img.f { transform: scale(1.05); }
.filial-card::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(8,14,14,.55) 0%, rgba(8,14,14,0) 26%, rgba(8,14,14,.15) 48%, rgba(8,14,14,.9) 100%); }
.filial-card > div { position: relative; z-index: 1; }
.fc-logo { width: clamp(170px, 14vw, 220px); height: auto; max-height: 64px; object-fit: contain; object-position: left center; display: block; }
.fc-arriba span { display: block; margin-top: 14px; font-family: var(--display); font-size: .9rem; opacity: .85; }
.filial-card h3 { font-size: clamp(1.7rem, 2.4vw, 2.4rem); font-weight: 600; letter-spacing: -.03em; line-height: 1.05; color: #fff; }
.filial-card .cap-lema { margin-top: 10px; color: rgba(255,255,255,.88); font-size: clamp(1rem, 1.2vw, 1.1rem); max-width: 30ch; }
.filial-card .cap-cartera { border-top-color: var(--acento-fc); }
.filial-card .cap-cartera b { color: #fff; }
.filial-card .cap-cartera > span { color: rgba(255,255,255,.8); }
.filial-card .cap-mas { color: #fff; border-bottom-color: var(--acento-fc); margin-top: 22px; }
.filial-card:hover .cap-mas span { transform: translateX(4px); }
@media (max-width: 960px) { .filiales { grid-template-columns: 1fr; } .filial-card { min-height: 76svh; } }

/* Página de equipo */
.eq-cab { background: var(--abisal); color: #fff; padding-top: clamp(140px, 18vw, 200px); padding-bottom: clamp(56px, 8vw, 96px); }
.eq-cab h1 { font-size: clamp(2.6rem, 6vw, 4.6rem); font-weight: 600; letter-spacing: -.035em; }
.eq-cab .lead { color: rgba(255,255,255,.8); }
.eq-grupo + .eq-grupo { margin-top: clamp(56px, 8vw, 96px); }
.eq-grupo-cab { display: flex; align-items: center; gap: 20px 32px; flex-wrap: wrap; }
.eq-grupo-cab img { height: 40px; width: auto; }
.eq-grupo-cab p { color: var(--gris); }
.eq-lista .personas { margin-top: 28px; }

/* Home: referencia breve al equipo */
.equipo-breve { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px, 6vw, 96px); align-items: center; }
.equipo-breve .personas { margin-top: 0; grid-template-columns: 1fr 1fr; }
.equipo-breve .personas li { padding-block: 20px; }
@media (max-width: 860px) { .equipo-breve { grid-template-columns: 1fr; } }
@media (max-width: 600px) { .equipo-breve .personas { grid-template-columns: 1fr 1fr; } }
@media (min-width: 901px) { .eq-lista .personas.cuatro { grid-template-columns: repeat(4, 1fr); } }

/* Organigrama */
.eq-org { padding-block: clamp(64px, 9vw, 112px) clamp(56px, 8vw, 96px); }
.org-etq { margin-bottom: 18px; font-family: var(--display); font-size: .78rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--medio); }
.org { display: grid; gap: 28px; }
.org-caja { position: relative; border-radius: 8px; padding: clamp(22px, 2.4vw, 30px); }
.org-tipo { font-family: var(--display); font-size: .74rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--gris); }
.org-consejo { background: var(--espuma); border: 1px solid var(--bruma); }
.org-plataforma { background: var(--marino); color: #fff; }
.org-plataforma .org-tipo { color: #A9C1EA; }
.org-logo { display: block; height: 40px; width: auto; margin-top: 12px; }
.org-gente { list-style: none; display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 0 24px; margin-top: 14px; }
.org-gente li { border-top: 1px solid var(--bruma); padding: 12px 0; }
.org-plataforma .org-gente li { border-top-color: rgba(255,255,255,.18); }
.org-gente b { display: block; font-family: var(--display); font-weight: 600; font-size: 1.02rem; color: var(--tinta); }
.org-gente span { display: block; font-size: .9rem; color: var(--gris); margin-top: 2px; }
.org-plataforma .org-gente b { color: #fff; }
.org-plataforma .org-gente span { color: rgba(255,255,255,.75); }
.org-filiales { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
.org-filial { background: #EEF2F8; border: 1px solid var(--bruma); border-top: 3px solid var(--acento-org); }
.org-filial .org-tipo { color: var(--acento-org); }
.org-filial .org-gente { grid-template-columns: 1fr; }
.org-sub { margin-top: 8px; font-size: .95rem; font-style: italic; color: var(--gris); }
.org-links { margin-top: 14px; display: flex; flex-wrap: wrap; gap: 8px 22px; }
.org-links a { font-weight: 600; color: var(--marino); text-decoration: none; border-bottom: 1.5px solid var(--acento-org); padding-bottom: 2px; }
.org-links a span { display: inline-block; transition: transform .25s ease; }
.org-links a:hover span { transform: translateX(4px); }
/* Líneas de conexión */
.org-consejo::after, .org-plataforma::after { content: ""; position: absolute; left: 50%; top: 100%; width: 1.5px; height: 28px; background: #B5C3D8; }
.org-filiales { position: relative; }
.org-filiales::before { content: ""; position: absolute; top: -14px; left: 25%; right: 25%; height: 14px; border: 1.5px solid #B5C3D8; border-bottom: 0; }
.org-plataforma::after { height: 14px; }
@media (max-width: 860px) {
  .org-filiales { grid-template-columns: 1fr; }
  .org-filiales::before { display: none; }
  .org-plataforma::after { height: 28px; }
  .org-filial + .org-filial::before { content: ""; position: absolute; left: 50%; bottom: 100%; width: 1.5px; height: 28px; background: #B5C3D8; }
}
.eq-lista h2 { margin-bottom: 8px; }
.org-consejo .org-gente { grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); }

/* Equipo: toques visuales */
.eq-cab { position: relative; overflow: hidden; min-height: min(62svh, 560px); display: flex; align-items: flex-end; }
.eq-cab .wrap { position: relative; z-index: 1; width: 100%; }
.eq-fondo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 60%; }
.eq-cab::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(11,23,64,.55) 0%, rgba(11,23,64,.25) 40%, rgba(11,23,64,.85) 100%); }
@media (prefers-reduced-motion: no-preference) { .eq-fondo { animation: acercar-eq 16s cubic-bezier(.2,.6,.2,1) both; } }
@keyframes acercar-eq { from { transform: scale(1.12); } to { transform: scale(1.02); } }
.eq-cab h1 { font-size: clamp(3rem, 7vw, 5.6rem); }
.org-plataforma { background: linear-gradient(135deg, #152969 0%, #0B1740 100%); }
.org-plataforma::before { content: ""; position: absolute; inset: 0; background: url("/assets/ballena.jpg") center/cover; opacity: .14; mix-blend-mode: screen; border-radius: inherit; }
.org-plataforma > * { position: relative; }
.org-foto { margin: calc(-1 * clamp(22px, 2.4vw, 30px)) calc(-1 * clamp(22px, 2.4vw, 30px)) 20px; height: 170px; overflow: hidden; border-radius: 5px 5px 0 0; position: relative; }
.org-foto img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s cubic-bezier(.2,.7,.2,1); }
.org-filial:hover .org-foto img { transform: scale(1.05); }
.org-foto::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(8,14,14,0) 50%, rgba(8,14,14,.35) 100%); }
.eq-lista .personas li { display: grid; grid-template-columns: 52px 1fr; column-gap: 16px; align-content: start; }
.eq-lista .personas li > :not(.mono) { grid-column: 2; }
.mono { grid-row: 1 / 4; width: 52px; height: 52px; border-radius: 50%; display: grid; place-items: center; color: #fff; font-family: var(--display); font-weight: 600; font-size: 1.05rem; letter-spacing: .02em; }
.org-foto + .org-logo { margin-top: 0; }

/* ---------- Menú hamburguesa en móvil ---------- */
.hamb { display: none; }
@media (max-width: 860px) {
  .barra .logo { position: relative; z-index: 3; }
  .hamb { display: inline-flex; flex-direction: column; justify-content: center; align-items: center; gap: 5px; width: 44px; height: 44px; margin-right: -10px; padding: 0; background: none; border: 0; color: #fff; cursor: pointer; position: relative; z-index: 3; }
  .barra.solida .hamb { color: var(--tinta); }
  .hamb span { display: block; width: 24px; height: 2px; border-radius: 2px; background: currentColor; transition: transform .3s ease, opacity .2s ease; }
  .barra.abierta { background: var(--abisal); backdrop-filter: none; box-shadow: none; }
  .barra.abierta .hamb { color: #fff; }
  .barra.abierta .logo .blanco { display: block; }
  .barra.abierta .logo .navy { display: none; }
  .barra.abierta .hamb span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .barra.abierta .hamb span:nth-child(2) { opacity: 0; }
  .barra.abierta .hamb span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

  .barra nav { position: fixed; inset: 0; z-index: 2; height: 100dvh; display: flex; flex-direction: column; align-items: stretch; gap: 0; padding: 92px var(--gutter) 36px; background: var(--abisal); overflow-y: auto; opacity: 0; visibility: hidden; transform: translateY(-10px); transition: opacity .3s ease, transform .3s ease, visibility 0s linear .3s; }
  .barra.abierta nav { opacity: 1; visibility: visible; transform: none; transition: opacity .3s ease, transform .3s ease; }
  .barra nav > a, .barra nav > a:not(.contacto-nav), .barra.solida nav > a, .barra nav > a.contacto-nav { display: block; color: #fff; font-family: var(--display); font-size: 1.45rem; font-weight: 600; letter-spacing: -.01em; padding: 14px 0 !important; border: 0 !important; border-bottom: 1px solid rgba(255,255,255,.14) !important; border-radius: 0 !important; }
  .barra nav > .menu-dd { display: block; border-bottom: 1px solid rgba(255,255,255,.14); padding-bottom: 10px; }
  .barra nav .menu-dd summary, .barra.solida nav .menu-dd summary { pointer-events: none; padding: 16px 0 4px; font-family: var(--display); font-size: .78rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: rgba(255,255,255,.6); }
  .barra nav .menu-dd summary svg { display: none; }
  .barra nav .menu-dd ul { position: static; min-width: 0; padding: 0; background: none; box-shadow: none; border-radius: 0; }
  .barra nav .menu-dd ul a, .barra.solida nav .menu-dd ul a { color: #fff; font-family: var(--display); font-size: 1.45rem; font-weight: 600; padding: 8px 0; border-radius: 0; background: none !important; }
  .barra nav .menu-dd ul li.sep { border: 0; margin-top: 2px; padding-top: 0; }
  .barra nav .menu-dd ul li.sep a { font-family: var(--texto); font-size: 1rem; font-weight: 500; color: rgba(255,255,255,.7); }
  .barra nav > .idioma { margin-top: 28px; }
  .barra nav .idioma summary { display: none; }
  .barra nav .idioma ul { position: static; display: flex; gap: 10px; min-width: 0; padding: 0; background: none; box-shadow: none; }
  .barra nav .idioma ul a { border: 1.5px solid rgba(255,255,255,.35); border-radius: 999px; padding: 8px 18px; color: #fff; }
  .barra nav .idioma ul a[aria-current="true"] { background: #fff; color: var(--abisal); border-color: #fff; }
  .barra nav .idioma ul a[aria-current="true"]::after { content: none; }
}

/* ---------- Footer ---------- */
footer.pie { padding-block: clamp(56px, 7vw, 88px) 0; display: block; }
.pie .pie-arriba { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr; gap: 40px clamp(24px, 4vw, 64px); padding-bottom: clamp(40px, 5vw, 64px); }
.pie-marca img { height: 34px; width: auto; }
.pie-marca p { margin-top: 18px; max-width: 34ch; color: rgba(255,255,255,.7); font-size: .95rem; line-height: 1.55; }
.pie-correo { display: inline-block; margin-top: 18px; color: #fff; font-weight: 600; text-decoration: none; border-bottom: 1px solid rgba(255,255,255,.35); padding-bottom: 2px; }
.pie-correo:hover { border-bottom-color: #fff; }
.pie-col h2 { font-family: var(--display); font-size: .74rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: rgba(255,255,255,.5); max-width: none; }
.pie-col ul { list-style: none; margin-top: 16px; display: grid; gap: 10px; }
.pie-col a { color: rgba(255,255,255,.85); text-decoration: none; font-size: .95rem; }
.pie-col a:hover { color: #fff; text-decoration: underline; text-underline-offset: 4px; }
.pie .pie-abajo { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px 24px; padding-block: 22px; border-top: 1px solid rgba(255,255,255,.12); font-size: .85rem; color: rgba(255,255,255,.55); }
.pie-idioma { display: flex; gap: 6px; }
.pie-idioma a { color: rgba(255,255,255,.6); text-decoration: none; font-weight: 600; padding: 4px 10px; border-radius: 999px; border: 1px solid rgba(255,255,255,.2); font-size: .8rem; }
.pie-idioma a[aria-current="true"] { color: var(--abisal); background: #fff; border-color: #fff; }
@media (max-width: 860px) { .pie .pie-arriba { grid-template-columns: 1fr 1fr; } .pie-marca { grid-column: 1 / -1; } }
@media (max-width: 420px) { .pie .pie-arriba { grid-template-columns: 1fr; } }

/* ---------- Páginas legales ---------- */
.legal-cab { background: var(--abisal); color: #fff; padding-top: clamp(130px, 16vw, 180px); padding-bottom: clamp(40px, 6vw, 72px); }
.legal-cab h1 { font-size: clamp(2.2rem, 5vw, 3.6rem); font-weight: 600; letter-spacing: -.03em; }
.legal-cab p { margin-top: 12px; color: rgba(255,255,255,.7); }
.legal { padding-block: clamp(48px, 7vw, 88px); }
.legal .wrap { max-width: 820px; }
.legal h2 { font-size: clamp(1.25rem, 2vw, 1.5rem); margin-top: 44px; max-width: none; }
.legal h2:first-child { margin-top: 0; }
.legal p, .legal li { margin-top: 12px; color: var(--gris); line-height: 1.7; }
.legal ul { padding-left: 1.2em; }
.legal a { color: var(--marino); }
.legal dl { margin-top: 16px; display: grid; grid-template-columns: max-content 1fr; gap: 8px 24px; }
.legal dt { font-weight: 600; color: var(--tinta); }
.legal dd { color: var(--gris); }
@media (max-width: 600px) { .legal dl { grid-template-columns: 1fr; gap: 2px; } .legal dd { margin-bottom: 10px; } }
.pendiente { background: #FFF1C2; color: #6B4E00; padding: 1px 6px; border-radius: 4px; font-weight: 600; }

/* ---------- Contacto ---------- */
.contacto { position: relative; overflow: hidden; padding-block: clamp(96px, 13vw, 168px) clamp(72px, 9vw, 112px); }
.contacto-fondo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 60%; }
.contacto::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(11,23,64,.62) 0%, rgba(11,23,64,.78) 55%, rgba(11,23,64,.94) 100%); }
.contacto .wrap { position: relative; z-index: 1; display: block; }
.contacto-cab { max-width: 720px; }
.contacto-cab h2 { font-size: clamp(2rem, 4.4vw, 3.4rem); max-width: 18ch; }
.contacto-cab .lead { color: rgba(255,255,255,.85); }
.contacto-tarjetas { list-style: none; margin-top: clamp(40px, 6vw, 64px); display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.contacto-tarjetas li { display: flex; flex-direction: column; padding: 26px 24px; border-radius: 6px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.16); backdrop-filter: blur(6px); transition: background .3s ease, border-color .3s ease, transform .3s ease; }
.contacto-tarjetas li:hover { background: rgba(255,255,255,.14); border-color: rgba(255,255,255,.3); transform: translateY(-3px); }
.contacto-tarjetas h3 { font-size: 1.15rem; color: #fff; line-height: 1.2; }
.contacto-tarjetas p { margin-top: 10px; color: rgba(255,255,255,.78); font-size: .95rem; line-height: 1.5; }
.contacto-tarjetas a { margin-top: auto; padding-top: 22px; color: #fff; font-weight: 600; text-decoration: none; }
.contacto-tarjetas a span { display: inline-block; transition: transform .25s ease; }
.contacto-tarjetas li:hover a span { transform: translateX(4px); }
.contacto-directo { margin-top: 36px; color: rgba(255,255,255,.75); }
.contacto-directo a { color: #fff; font-weight: 600; text-underline-offset: 5px; }
@media (max-width: 1000px) { .contacto-tarjetas { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .contacto-tarjetas { grid-template-columns: 1fr; } }
.contacto-tarjetas li:hover { transform: none; }
.contacto-boton { display: inline-flex; align-items: center; gap: 10px; margin-top: 40px; padding: 16px 30px; border-radius: 999px; background: #fff; color: var(--abisal); font-family: var(--display); font-weight: 600; font-size: 1.05rem; text-decoration: none; transition: transform .25s ease, box-shadow .25s ease; }
.contacto-boton:hover { transform: translateY(-2px); box-shadow: 0 10px 28px rgba(0,0,0,.25); }
.contacto-boton span { transition: transform .25s ease; }
.contacto-boton:hover span { transform: translateX(4px); }

/* ---------- Móvil: contacto y footer compactos ---------- */
@media (max-width: 560px) {
  .contacto { padding-block: 72px 56px; }
  .contacto-cab h2 { font-size: 1.8rem; }
  .contacto-tarjetas { grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 28px; }
  .contacto-tarjetas li { padding: 16px 14px; }
  .contacto-tarjetas h3 { font-size: .95rem; line-height: 1.25; }
  .contacto-tarjetas p { display: none; }
  .contacto-boton { margin-top: 24px; width: 100%; justify-content: center; }

  footer.pie { padding-top: 40px; }
  .pie .pie-arriba { grid-template-columns: 1fr 1fr; gap: 28px 20px; padding-bottom: 28px; }
  .pie-marca p { display: none; }
  .pie-marca img { height: 28px; }
  .pie-col ul { margin-top: 10px; gap: 6px; }
  .pie-col a { font-size: .9rem; }
  .pie-col:last-child { grid-column: 1 / -1; }
  .pie-col:last-child ul { display: flex; flex-wrap: wrap; gap: 6px 18px; }
  .pie .pie-abajo { padding-block: 16px; font-size: .78rem; flex-wrap: nowrap; }
}
@media (max-width: 420px) { .pie .pie-arriba { grid-template-columns: 1fr 1fr; } }

/* El contacto se funde con el footer: el degradado termina en el mismo azul y sin línea de separación */
.contacto::after { background: linear-gradient(180deg, rgba(11,23,64,.6) 0%, rgba(11,23,64,.78) 50%, rgba(11,23,64,.94) 80%, #0B1740 100%); }
footer.pie { border-top: 0; background: #0B1740; }
.pie .pie-arriba { align-items: start; }

/* ---------- Cifras sobre foto con tarjetas de cristal (móvil y escritorio) ---------- */
.cifras .bloque { position: relative; overflow: hidden; padding-block: clamp(96px, 11vw, 150px); color: #fff; background: #0B1411 center/cover no-repeat; }
.cifras .da { background-image: url("/assets/manifiesto/cifras-vida-d.jpg"); }
.cifras .hacemos { background-image: url("/assets/manifiesto/cifras-plastico-d.jpg"); }
.cifras .bloque::before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(8,16,30,.6) 0%, rgba(8,16,30,.3) 40%, rgba(8,16,30,.82) 100%); }
.cifras .hacemos::before { background: linear-gradient(180deg, rgba(11,23,64,.65) 0%, rgba(11,23,64,.38) 40%, rgba(11,23,64,.88) 100%); }
.cifras .bloque .wrap { position: relative; z-index: 1; }
.cifras .bloque h2 { color: #fff; text-shadow: 0 2px 18px rgba(0,0,0,.35); }
.cifras .rejilla { gap: 16px; }
.cifras .rejilla li { border: 1px solid rgba(255,255,255,.22) !important; border-radius: 8px; padding: 26px 22px 24px; background: rgba(255,255,255,.1); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.cifras .cifra { color: #fff; }
.cifras .rejilla p { color: rgba(255,255,255,.88); }
.cifras .da .rejilla { grid-template-columns: repeat(6, 1fr); }
.cifras .da .rejilla li { grid-column: span 2; }
.cifras .da .rejilla li:nth-child(n+4) { grid-column: span 3; }
@media (max-width: 1100px) {
  .cifras .da .rejilla, .cifras .hacemos .rejilla { grid-template-columns: 1fr 1fr; }
  .cifras .da .rejilla li, .cifras .da .rejilla li:nth-child(n+4) { grid-column: auto; }
  .cifras .da .rejilla li:last-child { grid-column: 1 / -1; }
}
@media (max-width: 700px) {
  .cifras .bloque { padding-block: 64px 56px; }
  .cifras .da { background-image: url("/assets/manifiesto/cifras-vida.jpg"); }
  .cifras .hacemos { background-image: url("/assets/manifiesto/cifras-plastico.jpg"); }
  .cifras .bloque h2 { font-size: 1.9rem; }
  .cifras .rejilla { display: grid; grid-template-columns: 1fr 1fr !important; gap: 10px; margin-top: 28px; }
  .cifras .rejilla li { border-radius: 6px; padding: 16px 14px 14px; backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
  .cifras .da .rejilla li:last-child { grid-column: 1 / -1; }
  .cifras .cifra { font-size: 2.3rem; }
  .cifras .rejilla p { margin-top: 8px; font-size: .86rem; line-height: 1.4; }
}

/* ---------- Tres metas de impacto: tarjetas con foto ---------- */
.metas { border-top: 0; gap: 14px; }
.meta, .meta + .meta { position: relative; overflow: hidden; min-height: 460px; padding: 28px; border: 0; border-radius: 6px; display: flex; flex-direction: column; justify-content: space-between; color: #fff; background: #0B1411; }
.meta > img.f { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 1.4s cubic-bezier(.2,.7,.2,1); }
.meta:hover > img.f { transform: scale(1.05); }
.meta::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(8,14,20,.5) 0%, rgba(8,14,20,0) 28%, rgba(8,14,20,.2) 50%, rgba(8,14,20,.88) 100%); }
.meta > * { position: relative; z-index: 1; }
.meta > img.f { z-index: 0; }
.meta .filial { margin-top: 0; }
.meta .filial img { height: 34px; }
.meta .filial img.l-io { height: 28px; }
.meta .filial img.l-op { height: 34px; }
.meta h3 { min-height: 0 !important; font-size: 1rem; font-family: var(--texto); font-weight: 600; color: rgba(255,255,255,.88); letter-spacing: 0; }
.meta .eq { margin-top: 10px; color: #fff; font-size: clamp(1.9rem, 2.8vw, 2.6rem); line-height: 1.05; }
.meta .eq b { font-weight: 600; white-space: nowrap; }
.meta .eq span { display: inline; font: inherit; color: inherit; margin: 0; letter-spacing: inherit; }
.meta .eq > span { display: block; font-family: var(--texto); font-weight: 400; font-size: 1rem; color: rgba(255,255,255,.85); letter-spacing: 0; margin-top: 8px; }
@media (max-width: 860px) {
  .metas { gap: 10px; }
  .meta, .meta + .meta { min-height: 300px; padding: 22px; border-top: 0; }
  .meta .eq { font-size: 2rem; }
}
.meta .eq { font-size: clamp(1.7rem, 2.3vw, 2.2rem); }
.meta .eq b { white-space: normal; }
@media (max-width: 860px) { .meta, .meta + .meta { min-height: 250px; } .meta .eq { font-size: 1.9rem; } }

/* ---------- Plataforma común: círculo de capacidades ---------- */
.plataforma { align-items: center; }
.orb { --r: 39%; --n: 9; --a-act: -90deg; position: relative; width: min(560px, 100%); aspect-ratio: 1; margin: 0 auto 36px; }
.orb-anillo { position: absolute; inset: calc(50% - var(--r)); border-radius: 50%; border: 1.5px dashed #B5C3D8; }
@media (prefers-reduced-motion: no-preference) { .orb-anillo { animation: girar 90s linear infinite; } }
@keyframes girar { to { transform: rotate(360deg); } }
.orb-anillo::after { content: ""; position: absolute; inset: 22%; border-radius: 50%; border: 1px solid #DDE5F0; }
.orb-rayo { position: absolute; left: 50%; top: 50%; width: var(--r); height: 2px; margin-top: -1px; background: linear-gradient(90deg, rgba(21,41,105,0) 0%, var(--marino) 100%); transform-origin: 0 50%; transform: rotate(var(--a-act)); transition: transform .4s cubic-bezier(.3,.9,.3,1); }
.orb-centro { position: absolute; inset: 27%; border-radius: 50%; background: radial-gradient(circle at 30% 25%, #2A4A9A 0%, var(--marino) 45%, var(--abisal) 100%); color: #fff; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 8%; box-shadow: 0 18px 50px rgba(11,23,64,.25); z-index: 1; }
.orb-etq { font-family: var(--display); font-size: .7rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: #A9C1EA; }
.orb-activo { margin-top: 8px; font-family: var(--display); font-weight: 600; font-size: clamp(.9rem, 1.6vw, 1.2rem); line-height: 1.2; letter-spacing: -.01em; min-height: 3.6em; display: flex; align-items: center; animation: aparecer .25s ease; }
.orb-num { margin-top: 6px; font-size: .78rem; color: rgba(255,255,255,.6); font-variant-numeric: tabular-nums; }
@keyframes aparecer { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.orb-nodos { list-style: none; margin: 0; padding: 0; }
.orb-nodo { --a: calc(var(--i) * 40deg - 90deg); position: absolute; left: calc(50% + var(--r) * cos(var(--a))); top: calc(50% + var(--r) * sin(var(--a))); transform: translate(-50%, -50%); z-index: 2; }
.orb-nodo button { position: relative; display: block; padding: 0; border: 0; background: none; cursor: pointer; font: inherit; color: inherit; }
.orb-ico { display: grid; place-items: center; width: 58px; height: 58px; border-radius: 50%; background: #fff; border: 1.5px solid #C9D5E6; color: var(--marino); box-shadow: 0 6px 18px rgba(11,23,64,.08); transition: background .35s ease, color .35s ease, transform .35s cubic-bezier(.3,1.4,.5,1), border-color .35s ease, box-shadow .35s ease; }
.orb-ico svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.orb-nodo.on .orb-ico { background: var(--marino); border-color: var(--marino); color: #fff; transform: scale(1.14); box-shadow: 0 0 0 7px rgba(21,41,105,.12), 0 10px 24px rgba(11,23,64,.22); }
.orb-corto { position: absolute; top: calc(100% + 8px); left: 50%; transform: translateX(-50%); width: 120px; text-align: center; font-size: .8rem; font-weight: 600; line-height: 1.2; color: var(--gris); transition: color .3s ease; }
.orb-nodo.on .orb-corto { color: var(--marino); }
.orb-largo { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.orb-nodo button:focus-visible .orb-ico { outline: 3px solid var(--medio); outline-offset: 3px; }
/* Entrada al hacer scroll */
@media (prefers-reduced-motion: no-preference) {
  .orb .orb-nodo { opacity: 0; transform: translate(-50%, -50%) scale(.3); transition: opacity .5s ease calc(var(--i) * 90ms), transform .6s cubic-bezier(.3,1.5,.5,1) calc(var(--i) * 90ms); }
  .orb.visto .orb-nodo { opacity: 1; transform: translate(-50%, -50%); }
  .orb .orb-centro { opacity: 0; transform: scale(.85); transition: opacity .6s ease, transform .7s cubic-bezier(.3,1.3,.5,1); }
  .orb.visto .orb-centro { opacity: 1; transform: none; }
  .orb .orb-anillo, .orb .orb-rayo { opacity: 0; transition: opacity .8s ease .3s, transform .7s cubic-bezier(.3,.9,.3,1); }
  .orb.visto .orb-anillo, .orb.visto .orb-rayo { opacity: 1; }
}
@media (max-width: 700px) {
  .orb { --r: 40%; margin-bottom: 8px; }
  .orb-ico { width: 44px; height: 44px; }
  .orb-ico svg { width: 20px; height: 20px; }
  .orb-corto { display: none; }
  .orb-centro { inset: 25%; padding: 9%; }
  .orb-activo { font-size: .92rem; }
}

/* ---------- Cita de la ballena: movimiento ---------- */
.cita { overflow: hidden; background-image: none; }
.cita-fondo { position: absolute; inset: -6%; background: var(--abisal) url("/assets/ballena.jpg") center/cover; transform: scale(1.14); will-change: transform; }
.cita::before { z-index: 1; }
.cita .wrap { z-index: 2; }
@media (prefers-reduced-motion: no-preference) {
  .cita-fondo { transition: transform .2s linear; }
}
.cita.anima blockquote .w { color: rgba(255,255,255,.26); transition: color .35s ease; }
.cita.anima blockquote .w.on { color: #fff; }
.cita.anima blockquote strong .w { color: rgba(255,255,255,.26); }
.cita.anima blockquote strong .w.on { color: #fff; text-shadow: 0 0 22px rgba(169,193,234,.55); }

/* Portada en móvil: la foto se muestra a su ancho natural y se desplaza de lado a lado (antes apenas se movía) */
@media (max-width: 900px) and (prefers-reduced-motion: no-preference) {
  .portada .fondo img { position: absolute; top: 0; left: 50%; width: auto; max-width: none; height: 100%; animation: deriva-movil 20s ease-in-out infinite alternate; }
  @keyframes deriva-movil { from { transform: translateX(-62%) scale(1.12); } to { transform: translateX(-38%) scale(1.12); } }
}

/* Equipo: "Equipo" sobre el cielo y el texto sobre el mar (el JS alinea el titular con el horizonte) */
.eq-cab.alineada { height: min(70svh, 620px); min-height: 460px; padding-top: 0; padding-bottom: 0; align-items: flex-start; }
.eq-cab.alineada h1 { line-height: 1; }

/* ---------- Móvil: las tres cajas del manifiesto con la misma composición (foto arriba, texto abajo, titulares alineados) ---------- */
@media (max-width: 900px) {
  .motivo { --pad: 24px; justify-content: flex-start; }
  .motivo.plastico, .motivo.vida { background: var(--abisal); padding-top: calc(200px + 18px); }
  .motivo.plastico::before, .motivo.vida::before { inset: 0 0 auto 0; height: 200px; }
  .motivo.plastico::before { background: linear-gradient(180deg, rgba(11,23,64,0) 66%, rgba(11,23,64,.55) 84%, var(--abisal) 100%), url("/assets/manifiesto/plastico.jpg") center 35% / cover; }
  .motivo.vida::before { background: linear-gradient(180deg, rgba(11,23,64,0) 66%, rgba(11,23,64,.55) 84%, var(--abisal) 100%), url("/assets/manifiesto/vida.jpg") center 45% / cover; }
  .motivo.plastico .tipo, .motivo.plastico h3, .motivo.plastico p,
  .motivo.vida .tipo, .motivo.vida h3, .motivo.vida p { text-shadow: none; }
  .motivo.ciencia .tipo { margin-top: 0; padding-top: 18px; }
  .motivo-foto img { height: 200px; }
  .motivo .num { z-index: 2; }
}

/* ---------- Transición integrada entre los dos bloques de cifras ---------- */
.cifras .bloque::after { content: ""; position: absolute; inset: 0; pointer-events: none; }
.cifras .da::after { background: linear-gradient(180deg, transparent calc(100% - clamp(120px, 16vw, 240px)), var(--abisal) 100%); }
.cifras .hacemos::after { background: linear-gradient(180deg, var(--abisal) 0, transparent clamp(120px, 16vw, 240px)); }

/* ---------- Cita (2.ª sección): sin foto, luz de aurora en movimiento y texto que se ilumina al leer ---------- */
.cita { min-height: 86svh; justify-content: center; background: radial-gradient(130% 90% at 50% 0%, #1a3a86 0%, #0e2259 38%, var(--abisal) 72%); }
.cita::before { z-index: 1; background: radial-gradient(60% 50% at 50% 50%, rgba(11,23,64,0) 0%, rgba(11,23,64,.55) 100%); }
.cita .wrap { justify-content: center; }
.cita blockquote { position: relative; max-width: 26ch; text-align: center; font-size: clamp(1.7rem, 3.6vw, 3.1rem); line-height: 1.22; letter-spacing: -.025em; }
.cita-aurora { position: absolute; inset: 0; overflow: hidden; z-index: 0; }
.cita-aurora span { position: absolute; width: 60vmax; height: 60vmax; border-radius: 50%; filter: blur(70px); opacity: .5; mix-blend-mode: screen; }
.cita-aurora span:nth-child(1) { left: -18vmax; top: -22vmax; background: radial-gradient(circle, rgba(46,180,190,.7), rgba(46,180,190,0) 65%); }
.cita-aurora span:nth-child(2) { right: -20vmax; top: 10%; background: radial-gradient(circle, rgba(110,140,255,.55), rgba(110,140,255,0) 65%); }
.cita-aurora span:nth-child(3) { left: 25%; bottom: -34vmax; background: radial-gradient(circle, rgba(140,214,210,.45), rgba(140,214,210,0) 65%); }
@media (prefers-reduced-motion: no-preference) {
  .cita-aurora span:nth-child(1) { animation: aurora1 18s ease-in-out infinite alternate; }
  .cita-aurora span:nth-child(2) { animation: aurora2 22s ease-in-out infinite alternate; }
  .cita-aurora span:nth-child(3) { animation: aurora3 26s ease-in-out infinite alternate; }
}
@keyframes aurora1 { to { transform: translate(18vmax, 12vmax) scale(1.15); } }
@keyframes aurora2 { to { transform: translate(-16vmax, 8vmax) scale(.9); } }
@keyframes aurora3 { to { transform: translate(-10vmax, -14vmax) scale(1.2); } }
.cita.anima blockquote .w { color: rgba(255,255,255,.2); transition: color .4s ease, text-shadow .4s ease; }
.cita.anima blockquote .w.on { color: #fff; }
.cita blockquote strong { font-weight: 600; }
.cita.anima blockquote strong .w.on, .cita:not(.anima) blockquote strong { color: transparent; background: linear-gradient(100deg, #8CD6D2 0%, #ffffff 25%, #A9C1EA 50%, #8CD6D2 75%, #ffffff 100%); background-size: 400% 100%; -webkit-background-clip: text; background-clip: text; text-shadow: none; filter: drop-shadow(0 0 18px rgba(140,214,210,.35)); }
@media (prefers-reduced-motion: no-preference) { .cita.anima blockquote strong .w.on { animation: brillo 6s linear infinite; } }
@keyframes brillo { from { background-position: 0% 0; } to { background-position: 100% 0; } }
@media (max-width: 760px) {
  .cita { min-height: 78svh; }
  .cita::before { background: rgba(11,23,64,.25); }
  .cita .wrap { justify-content: center; }
  .cita blockquote { font-size: clamp(1.5rem, 6.6vw, 2rem); }
}
.lead.lead-sig { margin-top: 10px; }

/* Portada → cita: el mar se funde en el mismo azul con el que empieza la cita, sin corte */
.portada::after { background: linear-gradient(180deg, rgba(11,23,64,.45) 0%, rgba(11,23,64,0) 28%, rgba(20,43,82,.15) 52%, rgba(20,43,82,.75) 82%, #142b52 100%); }
.cita { background: linear-gradient(180deg, #142b52 0%, rgba(20,43,82,0) 32%), radial-gradient(130% 90% at 50% 30%, #1a3a86 0%, #0e2259 42%, var(--abisal) 76%); }
.cita::before { -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 35%); mask-image: linear-gradient(180deg, transparent 0, #000 35%); }
.cita::after { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(180deg, #142b52 0, rgba(20,43,82,.85) 6%, rgba(20,43,82,0) 30%); }

/* ---------- Equipo en la home: fondo blanco, ola animada y foto del mar en un «ojo de buey» con anillos que giran ---------- */
.equipo-claro { position: relative; overflow: hidden; background: #fff; padding-block: clamp(88px, 10vw, 140px) clamp(120px, 13vw, 180px); }
.ec-grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); align-items: center; gap: clamp(32px, 6vw, 96px); }
.ec-texto h2 { font-size: clamp(2.4rem, 4.6vw, 3.8rem); letter-spacing: -.035em; }
.ec-texto .lead { max-width: 46ch; }
.ec-texto .cap-mas { margin-top: 28px; display: inline-flex; }
.ec-ojo { position: relative; width: min(100%, 380px); aspect-ratio: 1; justify-self: center; }
.ec-anillos { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.ec-anillos circle { fill: none; }
.ec-anillos .a1 { stroke: rgba(21,41,105,.18); stroke-width: 1; stroke-dasharray: 2 7; }
.ec-anillos .a2 { stroke: rgba(15,127,134,.35); stroke-width: 1.2; stroke-dasharray: 60 14; }
.ec-anillos .pt { fill: #0F7F86; stroke: none; }
.ec-foto { position: absolute; inset: 11%; border-radius: 50%; overflow: hidden; box-shadow: 0 24px 60px rgba(11,23,64,.22); }
.ec-foto img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 60%; }
.ec-olas { position: absolute; left: 0; bottom: 0; width: 200%; height: clamp(90px, 10vw, 150px); z-index: 0; }
.ec-olas path { fill: none; stroke-linecap: round; }
.ec-olas .o1 { stroke: rgba(15,127,134,.22); stroke-width: 1.5; }
.ec-olas .o2 { stroke: rgba(21,41,105,.12); stroke-width: 1.2; }
@media (prefers-reduced-motion: no-preference) {
  .ec-anillos { animation: ec-giro 40s linear infinite; }
  .ec-anillos .a1 { transform-origin: 200px 200px; animation: ec-giro 70s linear infinite reverse; }
  .ec-foto img { animation: ec-respira 14s ease-in-out infinite alternate; }
  .ec-olas { animation: ec-ola 22s linear infinite; }
  .ec-olas .o2 { animation: ec-ola-y 7s ease-in-out infinite alternate; }
}
@keyframes ec-giro { to { transform: rotate(360deg); } }
@keyframes ec-respira { from { transform: scale(1.08) translateX(-2%); } to { transform: scale(1.18) translateX(2%); } }
@keyframes ec-ola { to { transform: translateX(-50%); } }
@keyframes ec-ola-y { to { transform: translateY(10px); } }
@media (max-width: 860px) {
  .ec-grid { grid-template-columns: 1fr; }
  .ec-grid { display: block; }
  .ec-ojo { position: absolute; top: -18px; right: var(--gutter); width: 132px; }
  .ec-texto h2 { padding-right: 140px; min-height: 100px; display: flex; align-items: center; }
}

/* Equipo sin foto: una sola columna */
.ec-grid { grid-template-columns: minmax(0, 1fr); }
.ec-texto h2 { padding-right: 0; min-height: 0; }
.ec-olas.arriba { top: 0; bottom: auto; }
@media (prefers-reduced-motion: no-preference) { .ec-olas.arriba { animation-direction: reverse; animation-duration: 26s; } }
/* La ola superior puede invadir el final de la sección anterior para quedar centrada en el hueco */
.equipo-claro { overflow: visible; overflow-x: clip; }
.ec-olas.arriba { pointer-events: none; }

/* ---------- Página de equipo: entradas ligadas al scroll ---------- */
.sc-on .sc { --k: 0; will-change: transform, opacity; }
.sc-on .sc[data-sc="sube"] { opacity: var(--k); transform: translateY(calc((1 - var(--k)) * 48px)); }
.sc-on .sc[data-sc="zoom"] { opacity: calc(.2 + var(--k) * .8); transform: translateY(calc((1 - var(--k)) * 40px)) scale(calc(.92 + var(--k) * .08)); }
.sc-on .sc[data-sc="lado"] { opacity: var(--k); }
.sc-on .org-filial.sc[data-sc="lado"]:nth-child(1) { transform: translateX(calc((1 - var(--k)) * -60px)) rotate(calc((1 - var(--k)) * -1.5deg)); }
.sc-on .org-filial.sc[data-sc="lado"]:nth-child(2) { transform: translateX(calc((1 - var(--k)) * 60px)) rotate(calc((1 - var(--k)) * 1.5deg)); }
.sc-on .sc[data-sc="fila"] { opacity: var(--k); transform: translateX(calc((1 - var(--k)) * 22px)); }
.sc-on .sc[data-sc="foto"] { transform: translateY(calc((var(--k) - .5) * -12%)) scale(1.15); }
.sc-on .org-consejo::after, .sc-on .org-plataforma::after { transform-origin: top; transform: scaleY(var(--lk, 0)); }
.sc-on .org-filiales::before { transform-origin: center; transform: scaleX(var(--lk, 0)); }
.org-foto { overflow: hidden; }
@media (max-width: 860px) {
  .sc-on .org-filial.sc[data-sc="lado"]:nth-child(n) { transform: translateY(calc((1 - var(--k)) * 50px)); }
}
/* Olas de Equipo algo más rápidas */
@media (prefers-reduced-motion: no-preference) {
  .ec-olas { animation-duration: 16s; }
  .ec-olas.arriba { animation-duration: 19s; }
  .ec-olas .o2 { animation-duration: 5s; }
}

/* Contacto: menú con opciones al pulsar «Escríbenos» (correo, Gmail, Outlook o copiar la dirección) */
.contacto-accion { position: relative; display: inline-block; }
.contacto-menu { position: absolute; left: 0; top: calc(100% + 10px); z-index: 5; min-width: 290px; padding: 8px; border-radius: 14px; background: #fff; box-shadow: 0 18px 50px rgba(0,0,0,.35); display: grid; gap: 2px; }
.contacto-menu[hidden] { display: none; }
.contacto-menu a, .contacto-menu button { display: block; width: 100%; text-align: left; padding: 11px 14px; border: 0; border-radius: 9px; background: none; color: var(--abisal); font: 500 .98rem var(--body, inherit); text-decoration: none; cursor: pointer; }
.contacto-menu a:hover, .contacto-menu button:hover, .contacto-menu a:focus-visible, .contacto-menu button:focus-visible { background: var(--espuma); }
.contacto-menu button span { display: block; margin-top: 2px; font-size: .82rem; color: var(--gris); }
@media (max-width: 700px) { .contacto-accion { display: block; } .contacto-menu { left: 0; right: 0; min-width: 0; } }
/* El bloque de contacto recorta lo que sobresale: el menú se abre dentro del flujo, bajo el botón */
.contacto-accion { display: block; }
.contacto-menu { position: static; margin-top: 12px; width: min(100%, 340px); }
@media (max-width: 700px) { .contacto-menu { width: 100%; } }
/* En ordenador muchos equipos no tienen asociada una app a los enlaces de correo: solo se ofrece en móvil y tableta */
@media (hover: hover) and (pointer: fine) { .contacto-menu .cm-app { display: none; } }

/* Footer: raya fina arriba (como la de abajo) y menos hueco azul entre «Escríbenos» y el footer en PC */
footer.pie { padding-top: 0; }
.pie .pie-arriba { padding-top: clamp(40px, 4.5vw, 56px); }
.contacto { padding-bottom: clamp(48px, 5vw, 64px); }
@media (max-width: 700px) { .contacto { padding-bottom: 40px; } }

/* Metas: la cifra reserva su ancho final durante la cuenta, para que «millones» no salte de línea */
.meta .eq .n { display: inline-block; font-variant-numeric: tabular-nums; text-align: left !important; white-space: nowrap; }

/* Esbozo de los nautilus junto a «La emoción nos mueve a la acción» */
.manifiesto .intro .conchas { display: block; width: 100%; height: auto; pointer-events: none; user-select: none; }
@media (min-width: 901px) {
  .manifiesto .intro { display: grid !important; grid-template-columns: 1fr 1fr; grid-template-areas: "t c" "p c"; column-gap: clamp(32px, 4vw, 64px); align-items: center; }
  .manifiesto .intro h2 { grid-area: t; align-self: end; }
  .manifiesto .intro p { grid-area: p; align-self: start; }
  .manifiesto .intro .conchas { grid-area: c; max-width: 620px; justify-self: end; margin-right: -24px; }
}
@media (max-width: 900px) { .manifiesto .intro .conchas { width: 104%; margin: 0 -2% -8px; } }
@media (prefers-reduced-motion: no-preference) {
  .js .manifiesto .intro .conchas { opacity: 0; transform: translateY(16px); transition: opacity 1.2s ease, transform 1.2s cubic-bezier(.2,.7,.2,1); }
  .js .manifiesto .intro .conchas.visto { opacity: 1; transform: none; }
}
/* Cabecera del manifiesto alineada con las fotos: texto al borde izquierdo de la primera, nautilus al borde derecho de la tercera */
@media (hover: hover) and (pointer: fine) and (min-width: 901px) {
  .manifiesto .intro { margin-inline: calc(-1 * min(4vw, 64px)); }
  .manifiesto .intro .conchas { margin-right: 0; }
}
@media (min-width: 901px) { .manifiesto .intro p { max-width: 46ch; } }
@media (max-width: 900px) { .manifiesto .intro .conchas { margin-bottom: 18px; } }
/* Manifiesto en PC: los titulares de las tres tarjetas arrancan a la misma altura (reservan tres líneas) */
@media (hover: hover) and (pointer: fine) and (min-width: 901px) {
  .motivos .motivo h3 { min-height: calc(3 * 1.15em); line-height: 1.15; }
}
/* Metas en PC: titular, cifra y descripción arrancan a la misma altura en las tres tarjetas */
@media (min-width: 861px) {
  .metas .meta .eq > span { min-height: calc(2 * 1.35em); line-height: 1.35; }
}
@media (min-width: 861px) and (max-width: 1200px) { .metas .meta h3 { min-height: calc(2 * 1.2em) !important; line-height: 1.2; } }

/* Qué hacemos en PC: título y texto alineados con el borde de las tarjetas y más anchos (menos líneas) */
@media (min-width: 961px) {
  .hacer > .wrap { max-width: 1600px; }
  .hacer .lead { max-width: 96ch; }
}
.metas .meta .eq b { display: block; }