/* Diapositiva 1 del hero: «De Gran Canaria a todo el archipiélago» (29/10/2026).
   Mapa real de Canarias (OpenStreetMap) en SVG; Gran Canaria late y salen
   rutas animadas hacia cada isla con clientes, que se ilumina al llegar.
   Lógica en js/alcance.js; datos en vivo de /api/landing/alcance. */
.slide-alcance .slide-title { color: #fff; font-size: 44px; letter-spacing: -1px; line-height: 1.08; margin-bottom: 16px; }
.slide-alcance .lead { color: #b9c3d9; max-width: 46ch; }

.alc-cifras { display: flex; flex-wrap: wrap; gap: 10px 24px; margin: 6px 0 22px; padding: 0; list-style: none; }
.alc-cifras li { display: grid; gap: 2px; }
.alc-cifras b { font-size: 40px; line-height: 1; font-weight: 800; letter-spacing: -1px; color: #fff; font-variant-numeric: tabular-nums; }
.alc-cifras span { font-size: 12.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #8fa3c4; }
.alc-cifras li:first-child b { background: linear-gradient(90deg, #7fb0ff 0%, #4fe39b 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }

.alc-visual { min-height: 460px; }
.alc-mapa { width: 100%; max-width: 620px; height: auto; overflow: visible; }
.alc-mapa .mar-linea { stroke: rgba(127, 176, 255, 0.07); stroke-width: 1; fill: none; }
.alc-mapa .isla { fill: #1b2f52; stroke: #2c4a7c; stroke-width: 1.2; stroke-linejoin: round; transition: fill .8s ease, stroke .8s ease, filter .8s ease; }
.alc-mapa .isla.con-clientes.encendida { fill: #2f6fed; stroke: #9cc1ff; filter: drop-shadow(0 0 10px rgba(79, 140, 255, .65)); }
.alc-mapa .isla[data-isla="gran-canaria"] { fill: #2f6fed; stroke: #cfe0ff; filter: drop-shadow(0 0 14px rgba(79, 227, 155, .55)); }
.alc-mapa .isla-nombre { fill: #6f83a8; font: 700 18px/1 -apple-system, "Segoe UI", Roboto, sans-serif; text-anchor: middle; letter-spacing: .02em; transition: fill .6s ease; }
.alc-mapa .isla-nombre.encendida, .alc-mapa .isla-nombre[data-isla="gran-canaria"] { fill: #fff; }
.alc-mapa .ruta { fill: none; stroke: url(#alcDegradado); stroke-width: 2.6; stroke-linecap: round; }
.alc-mapa .ruta-sombra { fill: none; stroke: rgba(79, 227, 155, .18); stroke-width: 9; stroke-linecap: round; }
.alc-mapa .viajero { fill: #fff; filter: drop-shadow(0 0 6px #4fe39b); }
.alc-mapa .onda { fill: none; stroke: #4fe39b; stroke-width: 2; opacity: 0; }
.alc-mapa .origen-onda { fill: none; stroke: #4fe39b; stroke-width: 2; }
.alc-mapa .origen-punto { fill: #4fe39b; }
.alc-mapa .marca { fill: #4fe39b; }
.alc-mapa .marca-check { fill: none; stroke: #0b1a33; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }

.alc-casa { position: absolute; left: 50%; bottom: 6%; transform: translateX(-12%); background: rgba(16, 35, 63, .82); border: 1px solid rgba(127, 176, 255, .28); color: #fff; border-radius: 14px; padding: 9px 14px; font-size: 13px; line-height: 1.3; backdrop-filter: blur(6px); box-shadow: 0 14px 30px -14px rgba(0, 0, 0, .6); }
.alc-casa strong { display: block; font-size: 14px; }
.alc-casa span { color: #9fb3d6; }
.alc-nueva { position: absolute; left: 22%; top: 8%; background: #4fe39b; color: #0b1a33; border-radius: 999px; padding: 7px 14px; font-size: 13px; font-weight: 800; box-shadow: 0 10px 24px -10px rgba(79, 227, 155, .8); opacity: 0; transform: translateY(8px) scale(.9); }
.alc-nueva.visible { opacity: 1; transform: none; transition: opacity .5s ease, transform .5s cubic-bezier(.3, 1.6, .5, 1); }

@media (prefers-reduced-motion: no-preference) {
  .slide-alcance.is-active .origen-onda { animation: alcOnda 2.4s ease-out infinite; }
  .slide-alcance.is-active .origen-onda.dos { animation-delay: 1.2s; }
  .slide-alcance.is-active .alc-casa { animation: hvChip 0.55s cubic-bezier(0.3, 1.5, 0.5, 1) .4s both; }
}
@keyframes alcOnda { 0% { r: 6; opacity: .9; } 100% { r: 46; opacity: 0; } }

@media (max-width: 960px) {
  .slide-alcance .slide-title { font-size: 32px; }
  .alc-visual { min-height: 0; }
  .alc-cifras b { font-size: 32px; }
  .alc-casa { position: static; transform: none; margin-top: 10px; display: inline-block; }
  .alc-nueva { left: 4%; top: 0; }
}

/* El mapa necesita ancho: columna de texto más estrecha y mapa más grande. */
.hero .slide.slide-alcance { grid-template-columns: minmax(440px, 0.9fr) 1.1fr; gap: 24px; }
.alc-visual .alc-mapa { max-width: none; width: 118%; margin-right: -12%; }
@media (max-width: 960px) {
  .hero .slide.slide-alcance { grid-template-columns: 1fr; gap: 18px; }
  .alc-visual .alc-mapa { width: 112%; margin: 0 -6%; }
}
/* Pantallas medianas: sin ensanchar el mapa, que si no Lanzarote se sale por la derecha. */
@media (min-width: 961px) and (max-width: 1280px) {
  .alc-visual .alc-mapa { width: 100%; margin-right: 0; }
}