/* Landings de servicio: cabecera con vídeo, mosaico de fotos y CTA con foto.
   Se carga después de marca.css y responsive.css. */

/* ── Cabecera con vídeo de fondo ─────────────────────────────── */
.l-top{position:relative;isolation:isolate;overflow:hidden}
.l-hero-bg{position:absolute;inset:0;z-index:0;pointer-events:none;-webkit-mask-image:linear-gradient(180deg,#000 72%,transparent 100%);mask-image:linear-gradient(180deg,#000 72%,transparent 100%)}
.l-hero-bg video{display:block;width:100%;height:100%;object-fit:cover;object-position:72% 50%}
.l-hero-shade{position:absolute;inset:0;background:
  linear-gradient(90deg,rgba(10,26,58,.97) 0%,rgba(10,26,58,.92) 36%,rgba(10,26,58,.62) 58%,rgba(10,26,58,.14) 100%),
  linear-gradient(180deg,rgba(10,26,58,.75) 0%,rgba(10,26,58,0) 20%)}
html body .l-top .l-hero:not(#_){z-index:1;min-height:min(86vh,720px);display:flex;flex-direction:column;justify-content:center;align-items:flex-start}
html body .l-top .l-hero .l-dek:not(#_){color:#d5def2!important;text-shadow:0 1px 18px rgba(10,26,58,.6)}

/* ── Mosaico de fotos ────────────────────────────────────────── */
.l-gal-wrap{position:relative;z-index:1;max-width:1060px;margin:0 auto;padding:.5rem 1.5rem 1.5rem}
.l-gal{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);grid-template-rows:repeat(2,minmax(0,1fr));gap:14px;height:clamp(380px,44vw,540px)}
.l-gal-f{position:relative;margin:0;border-radius:18px;overflow:hidden;background:#13284f;
  box-shadow:0 1px 0 rgba(255,255,255,.06) inset,0 30px 70px -32px rgba(0,0,0,.7)}
.l-gal-f:first-child{grid-row:1/3}
.l-gal-f img{display:block;width:100%;height:100%;object-fit:cover;transition:transform 1.4s cubic-bezier(.22,1,.36,1)}
@media (hover:hover){.l-gal-f:hover img{transform:scale(1.045)}}
.l-gal-f figcaption{position:absolute;left:0;right:0;bottom:0;padding:2.6rem 1.15rem .95rem;
  background:linear-gradient(0deg,rgba(6,16,38,.88),rgba(6,16,38,0));
  color:#fff;font-family:var(--font-display);font-weight:600;font-size:.98rem;line-height:1.3;letter-spacing:-.01em}

/* ── CTA final con foto ──────────────────────────────────────── */
html body .l-cta-card.l-cta--foto:not(#_):not(#_){display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);
  padding:0!important;text-align:left;align-items:stretch;overflow:hidden}
.l-cta-img{position:relative;min-height:360px;background:#dfe6f3}
.l-cta-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
html body .l-cta--foto .l-cta-txt:not(#_){padding:3.2rem 3rem;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}
html body .l-cta--foto .l-cta-txt p:not(#_){margin:0 0 1.6rem!important;max-width:none}
html body .l-cta--foto .l-cta-txt .l-note:not(#_){margin:1.2rem 0 0!important}

/* ── Tableta ─────────────────────────────────────────────────── */
@media (max-width:1024px) and (min-width:761px){
  .l-hero-shade{background:
    linear-gradient(90deg,rgba(10,26,58,.97) 0%,rgba(10,26,58,.88) 45%,rgba(10,26,58,.45) 80%,rgba(10,26,58,.25) 100%)}
  html body .l-top .l-hero:not(#_){min-height:620px}
}

/* ── Móvil: el vídeo pasa a ser una banda propia encima del titular ── */
@media (max-width:760px){
  .l-hero-bg{position:relative;inset:auto;height:min(62vw,380px);margin-top:66px}
  .l-hero-bg video{object-position:50% 45%}
  .l-hero-bg{-webkit-mask-image:linear-gradient(180deg,#000 50%,transparent 100%);mask-image:linear-gradient(180deg,#000 50%,transparent 100%)}
  .l-hero-shade{background:linear-gradient(0deg,rgba(10,26,58,.5) 0%,rgba(10,26,58,0) 50%)}
  html body .l-top .l-hero:not(#_):not(#_){min-height:0;padding-top:0!important;margin-top:-1.6rem}
  .l-gal-wrap{padding:0 1rem .5rem}
  .l-gal{grid-template-columns:1fr 1fr;grid-template-rows:auto;height:auto;gap:10px}
  .l-gal-f{border-radius:14px}
  .l-gal-f:first-child{grid-column:1/3;grid-row:auto;aspect-ratio:16/10}
  .l-gal-f:not(:first-child){aspect-ratio:1/1}
  .l-gal-f figcaption{font-size:.84rem;padding:1.8rem .75rem .65rem}
  html body .l-cta-card.l-cta--foto:not(#_):not(#_){grid-template-columns:1fr}
  .l-cta-img{min-height:0;aspect-ratio:16/9}
  html body .l-cta--foto .l-cta-txt:not(#_){padding:1.6rem 1.3rem 1.9rem}
}
@media (prefers-reduced-motion:reduce){.l-gal-f img{transition:none}}

/* «Qué incluye» con 4 tarjetas: 2×2 en escritorio en lugar de 3+1 */
@media (min-width:761px){html body .l-sec .cards:has(> .card:nth-child(4):last-child):not(#_){grid-template-columns:repeat(2,minmax(0,1fr))}}
/* Tableta: con 3 tarjetas en 2 columnas, la última ocupa toda la fila */
@media (min-width:761px) and (max-width:1024px){html body .l-sec .cards > .card:nth-child(3):last-child:not(#_){grid-column:1/-1}}