/* ===== Pie de página compartido (inicio, inventario, fichas de unidad, aviso y 404) =====
   Una sola fuente: aquí vive todo el CSS del footer. El HTML está en Landing/inc/footer.php
   y los scripts en Landing/js/footer.js. Las variables se definen en .footer-cine para que
   funcione igual en páginas con otras hojas de estilo. */
.footer-cine{
  --container:1180px; --pad-x:clamp(16px,4vw,32px); --primary:#1342ff;
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  font-size:16px; line-height:1.5; text-align:left; text-align:start;
}
.footer-cine *, .footer-cine *::before, .footer-cine *::after{ box-sizing:border-box; }
.footer-cine .ico{ display:inline-block; width:1em; height:1em; fill:currentColor; vertical-align:-0.125em; flex-shrink:0; }
.nl-dialogo{ font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif; }

/* =========================
   FOOTER CINEMATOGRÁFICO
========================= */

/* Footer en azul marino profundo (transmite confianza, estilo piloto Ford):
   menos negro, más azul. Color SÓLIDO —sin degradado— para no encarecer el
   repintado: el degradado a todo ancho, con la aurora borrosa y el canvas
   animados encima, hacía que el slider de reseñas (rAF) diera stuttering. */
.footer-cine{
  position:relative; overflow:hidden; isolation:isolate; color:#fff; padding-top:0;
  background:#0c1f57;
}

.footer-cine-aurora{
  position:absolute; left:50%; top:34%; width:70vw; height:52vh; max-width:900px;
  transform:translate(-50%,-50%); border-radius:50%; filter:blur(90px);
  background:radial-gradient(circle, rgba(19,66,255,.35) 0%, rgba(10,30,122,.16) 45%, transparent 72%);
  pointer-events:none; z-index:0;
}
.footer-cine-canvas{
  position:absolute; inset:0; z-index:0; pointer-events:none;
  width:100%; height:100%; display:block;
  -webkit-mask-image:linear-gradient(to bottom, transparent, #000 20%, #000 80%, transparent);
  mask-image:linear-gradient(to bottom, transparent, #000 20%, #000 80%, transparent);
}
.footer-cine-giant{
  position:absolute; left:50%; bottom:-4vw; z-index:0; pointer-events:none; user-select:none;
  transform:translateX(-50%); opacity:.15;
  font-size:16vw; line-height:.8; font-weight:900; letter-spacing:-.02em; white-space:nowrap;
  color:transparent; -webkit-text-stroke:1px rgba(255,255,255,.06);
  background:linear-gradient(180deg, rgba(255,255,255,.10) 0%, transparent 65%);
  -webkit-background-clip:text; background-clip:text;
}

.footer-cine-marquee{
  position:relative; z-index:1; overflow:hidden;
  border-top:1px solid rgba(255,255,255,.10); border-bottom:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.03);
  /* Oculto mientras el footer solo asoma por abajo del viewport (así no
     compite con el carrusel de "Clientes Tru Iron"). El JS añade
     .is-revealed cuando el footer ya ocupa ~50% de la pantalla. */
  opacity:0; transition:opacity .45s ease;
}
.footer-cine-marquee.is-revealed{ opacity:1; }
.footer-cine-marquee-track{
  display:flex; width:max-content;
  animation:footer-cine-marquee 32s linear infinite;
  animation-play-state:paused;
}
.footer-cine-marquee.is-revealed .footer-cine-marquee-track{ animation-play-state:running; }
.footer-cine-marquee-set{ display:flex; align-items:center; flex-shrink:0; padding:14px 0; }
.footer-cine-marquee-set span{ padding:0 20px; font-size:.72rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:rgba(255,255,255,.78); white-space:nowrap; }
.footer-cine-marquee-set span.sep{ color:var(--primary); padding:0; }
@keyframes footer-cine-marquee{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
@media (prefers-reduced-motion: reduce){
  .footer-cine-marquee-track{ animation:none; }
  /* Sin listener de scroll: se muestra siempre. */
  .footer-cine-marquee{ opacity:1; }
}

.footer-cine-centro{
  position:relative; z-index:1; width:min(var(--container),100%); margin:0 auto;
  padding:64px var(--pad-x) 48px; text-align:center; display:flex; flex-direction:column; align-items:center;
}
.footer-cine-centro h3{ margin:0 0 12px; font-weight:800; text-transform:uppercase; letter-spacing:.02em; color:#fff; font-size:clamp(1.4rem,3vw,2.1rem); }
.footer-cine-centro p{ margin:0 0 30px; color:rgba(255,255,255,.72); max-width:480px; }
.footer-cine-btns{ display:flex; gap:14px; flex-wrap:wrap; justify-content:center; }

.footer-pill{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  border-radius:999px; padding:14px 26px; font-size:.88rem; font-weight:800;
  text-decoration:none; white-space:nowrap; cursor:pointer; color:#fff;
  background:linear-gradient(145deg, rgba(255,255,255,.08) 0%, rgba(255,255,255,.03) 100%);
  border:1px solid rgba(255,255,255,.14);
  box-shadow:0 10px 26px -10px rgba(0,0,0,.5), inset 0 1px 1px rgba(255,255,255,.10);
  transition:background .3s ease, border-color .3s ease;
}
.footer-pill:hover{ background:linear-gradient(145deg, rgba(255,255,255,.14) 0%, rgba(255,255,255,.05) 100%); border-color:rgba(255,255,255,.26); }
.footer-pill-principal{ background:linear-gradient(135deg,#0058ff,#002dd9); border-color:transparent; box-shadow:0 12px 30px rgba(0,41,255,.30); }
.footer-pill-principal:hover{ background:linear-gradient(135deg,#0058ff,#002dd9); filter:brightness(1.08); }
.footer-pill-magnetica{ transition:transform .3s cubic-bezier(.34,1.56,.64,1), background .3s ease, border-color .3s ease; will-change:transform; }

.footer-cine-info{ position:relative; z-index:1; width:min(var(--container),100%); margin:0 auto; padding:36px var(--pad-x) 0; border-top:1px solid rgba(255,255,255,.10); color:rgba(255,255,255,.68); font-size:.86rem; }
.grid-footer{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; margin-bottom:16px; }
.titulo-footer{ font-weight:700; margin-bottom:6px; color:#fff; text-transform:uppercase; letter-spacing:.04em; font-size:.8rem; }
.footer-cine-info a{ color:rgba(255,255,255,.82); text-decoration:none; }
.footer-cine-info a:hover{ text-decoration:underline; }
.footer-social{ margin-top:12px; display:flex; gap:10px; }
.footer-social a{
  width:34px; height:34px; border-radius:999px; display:flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.14); text-decoration:none;
}
.footer-social a:hover{ transform:translateY(-1px); background:rgba(255,255,255,.14); }

.footer-cine-bottom{
  position:relative; z-index:1; width:min(var(--container),100%); margin:0 auto;
  padding:24px var(--pad-x) 34px; display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
}
.footer-bottom{ flex:1; text-align:center; font-size:.78rem; opacity:.5; }
.footer-cine-top{ width:46px; height:46px; padding:0; flex:0 0 auto; }
.footer-cine-top svg{ width:18px; height:18px; transition:transform .3s ease; }
.footer-cine-top:hover svg{ transform:translateY(-2px); }

@media (max-width:768px){
  .grid-footer{ grid-template-columns:1fr; text-align:center; gap:26px; }
  .footer-social{ justify-content:center; }
  .footer-cine-bottom{ flex-direction:column; text-align:center; }
}
@media (max-width:600px){
  .footer-cine-giant{ font-size:22vw; }
}

/* ----- Footer: Newsletter | Enlaces rápidos | Contacto | Síguenos ----- */
.grid-footer-4{ grid-template-columns:1.6fr 1fr 1.1fr 1.1fr; gap:30px; }
.footer-cine-info .titulo-footer{ margin-bottom:10px; }
.fn-texto{ margin:0 0 12px; line-height:1.5; max-width:34ch; }
.fn-fila{ display:flex; gap:8px; }
.fn-campos{ display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-bottom:8px; }
.fn-fila input, .fn-campos input{
  flex:1 1 auto; min-width:0; padding:11px 16px; border-radius:999px;
  border:1px solid rgba(255,255,255,.22); background:rgba(255,255,255,.07); color:#fff;
  font:inherit; font-size:.88rem; transition:border-color .2s ease, background .2s ease;
}
.fn-fila input::placeholder, .fn-campos input::placeholder{ color:rgba(255,255,255,.45); }
.fn-fila input:focus, .fn-campos input:focus{ outline:2px solid #4d7cff; outline-offset:2px; background:rgba(255,255,255,.11); }
.fn-boton{ flex:0 0 auto; padding:11px 20px; font:inherit; font-size:.84rem; font-weight:800; }
.fn-boton:disabled{ opacity:.6; cursor:progress; }
.fn-oculto{ position:absolute; width:1px; height:1px; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.fn-trampa{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.fn-aviso{ margin:10px 0 0; font-size:.76rem; line-height:1.45; color:rgba(255,255,255,.6); }
.fn-aviso a{ text-decoration:underline; }
.fn-msg{ margin:8px 0 0; min-height:1.3em; font-size:.82rem; line-height:1.4; }
.fn-msg.ok{ color:#86efac; }
.fn-msg.error{ color:#fca5a5; }
/* Confirmación del newsletter: ventana emergente chica */
.nl-dialogo{
  width:min(92vw,360px); padding:28px 26px 24px; border:1px solid rgba(255,255,255,.14); border-radius:20px;
  background:#0b1220; color:#fff; text-align:center; box-shadow:0 24px 60px rgba(0,0,0,.55);
  overflow:visible; /* sin esto el sitio le pinta barras de desplazamiento aunque todo cabe */
}
.nl-dialogo::backdrop{ background:rgba(3,6,14,.7); }
.nl-dialogo[open]{ animation:nl-dialogo-entra .25s ease both; }
@keyframes nl-dialogo-entra{ from{ opacity:0; transform:translateY(10px) scale(.96); } to{ opacity:1; transform:none; } }
.nl-dialogo-icono{ width:52px; height:52px; margin:0 auto 14px; border-radius:50%; display:grid; place-items:center; background:rgba(134,239,172,.14); color:#86efac; }
.nl-dialogo-icono svg{ width:26px; height:26px; }
.nl-dialogo h3{ margin:0 0 8px; font-size:1.15rem; color:#fff; }
.nl-dialogo p{ margin:0 0 20px; font-size:.9rem; line-height:1.5; color:rgba(255,255,255,.78); }
.nl-dialogo-cerrar{
  width:100%; padding:12px 24px; border:0; border-radius:999px; cursor:pointer;
  background:linear-gradient(135deg,#0058ff,#002dd9); color:#fff; font:inherit; font-size:.88rem; font-weight:800;
  box-shadow:0 12px 30px rgba(0,41,255,.30);
}
.nl-dialogo-cerrar:hover{ filter:brightness(1.08); }
.nl-dialogo-cerrar:focus-visible{ outline:2px solid #4d7cff; outline-offset:3px; }
@media (prefers-reduced-motion:reduce){ .nl-dialogo[open]{ animation:none; } }
.footer-links{ list-style:none; margin:0; padding:0; display:grid; gap:7px; }
.footer-bottom a{ color:inherit; text-decoration:underline; }
@media (max-width:1000px){
  .grid-footer-4{ grid-template-columns:repeat(3,minmax(0,1fr)); }
  .grid-footer-4 .footer-newsletter{ grid-column:1 / -1; }
  .fn-texto{ max-width:none; }
}
@media (max-width:768px){
  .grid-footer-4{ grid-template-columns:1fr; }
  .fn-texto{ margin-left:auto; margin-right:auto; }
  .fn-campos{ grid-template-columns:1fr; }
  .fn-fila{ flex-direction:column; }
  .fn-boton{ width:100%; }
}

/* Sucursal dentro de la columna de contacto */
.footer-subtitulo{ margin-top:16px; }

.ultima-seccion{ background:#0c1f57; }
