/* ZOHAN ESTIBA | Galería audiovisual
   Hoja independiente: no altera los estilos de las demás páginas. */
.gallery-page { --gallery-ink: #15242d; --gallery-muted: #5b6a72; }
.gallery-hero {
  position: relative; overflow: hidden; color: #fff;
  background: linear-gradient(116deg, #032d3c 0%, #06485a 64%, #063746 100%);
  padding: clamp(44px, 6vw, 82px) 0 56px;
}
.gallery-hero-glow {
  position:absolute; inset:0; pointer-events:none; opacity:.55;
  background: radial-gradient(ellipse at 78% 25%, rgba(18,181,167,.22), transparent 40%),
              linear-gradient(132deg, transparent 50%, rgba(25,118,201,.13) 50.2%, transparent 72%);
}
.gallery-hero-inner { position:relative; display:grid; grid-template-columns: .92fr 1.08fr; gap:clamp(30px,5vw,72px); align-items:center; }
.gallery-hero-copy { max-width:610px; padding: 12px 0; }
.gallery-eyebrow, .gallery-kicker {
  margin:0 0 15px; color:#6dd4bd; font-size:11px; font-weight:800;
  letter-spacing:.19em; line-height:1.5;
}
.gallery-eyebrow span { display:inline-block; width:28px; height:3px; margin:0 9px 3px 0; background:linear-gradient(90deg,#1976c9,#12b5a7,#bca35d); }
.gallery-hero h1 { margin:0; max-width:680px; font-size:clamp(34px,4.4vw,61px); line-height:1.02; letter-spacing:-.05em; font-weight:900; }
.gallery-hero h1 em { display:block; margin-top:7px; color:#6dd4bd; font-style:normal; }
.gallery-hero-copy > p:not(.gallery-eyebrow) { max-width:520px; margin:23px 0 27px; color:rgba(255,255,255,.78); font-size:16px; line-height:1.75; }
.gallery-hero-link { display:inline-flex; align-items:center; gap:12px; padding:0 0 8px; color:#fff; border-bottom:1px solid rgba(109,212,189,.65); font-size:13px; font-weight:800; }
.gallery-hero-link span { color:#6dd4bd; font-size:20px; transition:transform .2s ease; }
.gallery-hero-link:hover span { transform:translateY(4px); }
.gallery-hero-image { position:relative; min-width:0; }
.gallery-hero-image::before { content:""; position:absolute; inset:-12px 14px 14px -12px; border:1px solid rgba(109,212,189,.45); border-radius:18px; }
.gallery-hero-image img { position:relative; width:100%; height:clamp(290px,36vw,460px); object-fit:cover; object-position:center 48%; border:1px solid rgba(255,255,255,.18); border-radius:16px; box-shadow:0 24px 60px rgba(0,0,0,.24); }
.gallery-image-caption { position:absolute; right:14px; bottom:14px; display:flex; align-items:center; gap:9px; padding:10px 13px; border:1px solid rgba(255,255,255,.18); border-radius:7px; background:rgba(3,35,47,.78); backdrop-filter:blur(10px); color:#fff; font-size:11px; font-weight:700; }
.gallery-image-caption i { width:7px; height:7px; border-radius:50%; background:#6dd4bd; box-shadow:0 0 0 4px rgba(109,212,189,.15); }
.gallery-hero-bottom { position:absolute; bottom:0; left:0; right:0; height:3px; display:flex; }
.gallery-hero-bottom span:nth-child(1){width:42%;background:#1976c9}.gallery-hero-bottom span:nth-child(2){width:43%;background:#12b5a7}.gallery-hero-bottom span:nth-child(3){flex:1;background:#6dd4bd}
.gallery-intro { padding:clamp(42px,6vw,76px) 0 82px; background:#f4f5f5; }
.gallery-section-heading { display:grid; grid-template-columns:1fr .72fr; gap:40px; align-items:end; margin-bottom:29px; }
.gallery-heading-copy { padding-left:19px; border-left:4px solid transparent; border-image:linear-gradient(180deg,#1976c9,#12b5a7,#bca35d) 1; }
.gallery-kicker { margin-bottom:9px; color:#078d8b; }
.gallery-section-heading h2 { max-width:680px; color:#063c4d; font-size:clamp(28px,3.3vw,43px); font-weight:900; letter-spacing:-.045em; line-height:1.09; }
.gallery-section-heading h2 span { display:block; color:#087f83; }
.gallery-intro-text { max-width:490px; margin:0 0 2px; color:#52616a; font-size:14px; line-height:1.8; }
.gallery-filters { display:flex; flex-wrap:wrap; gap:9px; margin:0 0 26px; }
.gallery-filter { display:inline-flex; align-items:center; gap:10px; padding:10px 15px; border:1px solid #d8e0e2; border-radius:99px; background:#fff; color:#52616a; font:700 12px Arial,Helvetica,sans-serif; cursor:pointer; transition:background .2s,color .2s,border-color .2s,transform .2s; }
.gallery-filter span { display:grid; place-items:center; min-width:21px; height:21px; padding:0 5px; border-radius:99px; background:#eef2f3; color:#52616a; font-size:10px; }
.gallery-filter:hover { transform:translateY(-1px); border-color:#12b5a7; }
.gallery-filter.is-active { border-color:#063c4d; background:#063c4d; color:#fff; }
.gallery-filter.is-active span { background:rgba(255,255,255,.15); color:#8fe4d6; }
.gallery-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; align-items:start; }
.gallery-card { min-width:0; overflow:hidden; border:1px solid #e1e6e7; border-radius:13px; background:#fff; box-shadow:0 5px 18px rgba(8,32,42,.055); transition:transform .3s ease,box-shadow .3s ease; }
.gallery-card:hover { transform:translateY(-4px); box-shadow:0 16px 34px rgba(8,32,42,.12); }
.gallery-card-featured { grid-column:span 2; }
.gallery-media, .gallery-photo-button { position:relative; display:block; width:100%; overflow:hidden; background:#082c3b; }
.gallery-media video { display:block; width:100%; aspect-ratio:16/9; object-fit:cover; background:#082c3b; }
.media-tag { position:absolute; top:14px; left:14px; display:inline-flex; align-items:center; gap:8px; padding:8px 11px; border:1px solid rgba(255,255,255,.2); border-radius:5px; background:rgba(3,35,47,.78); color:#fff; font-size:9px; font-weight:800; letter-spacing:.12em; pointer-events:none; }
.play-symbol { color:#6dd4bd; font-size:10px; }
.gallery-photo-button { padding:0; border:0; cursor:zoom-in; }
.gallery-photo-button img { display:block; width:100%; height:260px; object-fit:cover; transition:transform .65s cubic-bezier(.2,.7,.2,1),filter .35s ease; }
.gallery-card-featured .gallery-photo-button img { height:330px; }
.gallery-photo-button:hover img { transform:scale(1.045); filter:saturate(1.04); }
.photo-open { position:absolute; right:12px; bottom:12px; display:grid; place-items:center; width:33px; height:33px; border:1px solid rgba(255,255,255,.6); border-radius:50%; background:rgba(3,35,47,.7); color:#fff; font-size:18px; opacity:0; transform:translateY(4px); transition:opacity .2s,transform .2s; }
.gallery-photo-button:hover .photo-open, .gallery-photo-button:focus-visible .photo-open { opacity:1; transform:translateY(0); }
.gallery-card-copy { padding:18px 19px 20px; }
.gallery-card-index { color:#078d8b; font-size:9px; font-weight:800; letter-spacing:.14em; }
.gallery-card-copy h3 { margin:8px 0 7px; color:#063c4d; font-size:17px; line-height:1.25; letter-spacing:-.02em; }
.gallery-card-copy p { margin:0; color:#65737a; font-size:12px; line-height:1.65; }
.gallery-card[hidden] { display:none; }
.gallery-cta { padding:38px 0; color:#fff; background:linear-gradient(112deg,#063747,#07566a); }
.gallery-cta-inner { display:flex; align-items:center; justify-content:space-between; gap:30px; }
.gallery-cta .gallery-kicker { margin-bottom:8px; color:#6dd4bd; }
.gallery-cta h2 { margin:0 0 8px; font-size:clamp(24px,3vw,34px); letter-spacing:-.035em; }
.gallery-cta p:not(.gallery-kicker) { margin:0; color:rgba(255,255,255,.75); font-size:13px; }
.gallery-cta-button { flex:0 0 auto; display:inline-flex; align-items:center; gap:16px; padding:14px 20px; border-radius:99px; background:linear-gradient(110deg,#1976c9,#12b5a7); color:#fff; font-size:13px; font-weight:800; box-shadow:0 8px 22px rgba(0,0,0,.16); transition:transform .2s,filter .2s; }
.gallery-cta-button:hover { transform:translateY(-2px); filter:brightness(1.08); }
.gallery-cta-button span { font-size:20px; }
.gallery-footer { padding:23px 0; background:#022936; color:rgba(255,255,255,.65); }
.gallery-footer .container { display:flex; align-items:center; gap:18px; }
.gallery-footer-brand { color:#fff; font-size:14px; font-weight:900; letter-spacing:.04em; }
.gallery-footer-brand span { color:#6dd4bd; }
.gallery-footer p { margin:0; font-size:11px; }
.gallery-footer > .container > a:last-child { margin-left:auto; color:#8fe4d6; font-size:11px; font-weight:700; }
.gallery-lightbox { position:fixed; z-index:1000; inset:0; display:none; align-items:center; justify-content:center; padding:55px 70px 70px; background:rgba(1,17,24,.94); }
.gallery-lightbox.is-open { display:flex; }
.gallery-lightbox > img { max-width:min(100%,1200px); max-height:calc(100vh - 125px); object-fit:contain; border-radius:4px; box-shadow:0 15px 50px rgba(0,0,0,.35); }
.gallery-lightbox button { position:absolute; display:grid; place-items:center; width:43px; height:43px; border:1px solid rgba(255,255,255,.3); border-radius:50%; background:rgba(255,255,255,.08); color:#fff; cursor:pointer; font-size:28px; line-height:1; }
.gallery-lightbox button:hover { background:#087f83; border-color:#087f83; }
.lightbox-close { top:20px; right:24px; }
.lightbox-prev { left:20px; top:50%; transform:translateY(-50%); }
.lightbox-next { right:20px; top:50%; transform:translateY(-50%); }
.lightbox-counter { position:absolute; bottom:20px; left:0; right:0; margin:0; color:rgba(255,255,255,.72); text-align:center; font-size:12px; }
body.lightbox-open { overflow:hidden; }
@media (max-width:900px) {
 .gallery-hero-inner { grid-template-columns:1fr 1fr; gap:28px; }
 .gallery-hero h1 { font-size:clamp(32px,5vw,46px); }
 .gallery-section-heading { grid-template-columns:1fr; gap:15px; }
 .gallery-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
 .gallery-card-featured { grid-column:span 2; }
 .gallery-card-copy { padding:16px; }
 .gallery-photo-button img { height:250px; }
 .gallery-card-featured .gallery-photo-button img { height:320px; }
}
@media (max-width:680px) {
 .gallery-hero { padding:35px 0 42px; }
 .gallery-hero-inner { grid-template-columns:1fr; gap:30px; }
 .gallery-hero-copy { padding:0; }
 .gallery-hero h1 { font-size:clamp(32px,9vw,44px); }
 .gallery-hero-copy > p:not(.gallery-eyebrow) { margin:17px 0 20px; font-size:14px; }
 .gallery-hero-image img { height:270px; }
 .gallery-intro { padding:40px 0 52px; }
 .gallery-section-heading { margin-bottom:23px; }
 .gallery-section-heading h2 { font-size:30px; }
 .gallery-intro-text { font-size:13px; }
 .gallery-filters { gap:7px; margin-bottom:19px; }
 .gallery-filter { padding:8px 11px; font-size:11px; }
 .gallery-grid { grid-template-columns:1fr 1fr; gap:12px; }
 .gallery-card-featured { grid-column:span 2; }
 .gallery-card-copy { padding:12px 12px 14px; }
 .gallery-card-copy h3 { font-size:14px; }
 .gallery-card-copy p { font-size:11px; }
 .gallery-card-index { font-size:8px; letter-spacing:.1em; }
 .gallery-photo-button img { height:175px; }
 .gallery-card-featured .gallery-photo-button img { height:250px; }
 .gallery-media video { aspect-ratio:16/10; }
 .media-tag { top:9px; left:9px; padding:7px 8px; font-size:8px; }
 .gallery-cta-inner { align-items:flex-start; flex-direction:column; gap:20px; }
 .gallery-footer .container { flex-wrap:wrap; gap:8px 15px; }
 .gallery-footer p { flex-basis:100%; order:3; }
 .gallery-footer > .container > a:last-child { margin-left:auto; }
 .gallery-lightbox { padding:45px 12px 55px; }
 .gallery-lightbox > img { max-width:100%; max-height:calc(100vh - 120px); }
 .lightbox-prev { left:8px; }
 .lightbox-next { right:8px; }
 .gallery-lightbox button { width:36px; height:36px; }
}
@media (max-width:380px) {
 .gallery-grid { grid-template-columns:1fr; }
 .gallery-card-featured { grid-column:auto; }
 .gallery-photo-button img, .gallery-card-featured .gallery-photo-button img { height:235px; }
}
@media (prefers-reduced-motion:reduce) {
 .gallery-card, .gallery-photo-button img, .gallery-hero-link span { transition:none; }
}

/* Pie de página: aviso de copyright */
.gallery-copyright { margin: 15px auto 0; padding-top: 11px; border-top: 1px solid rgba(255,255,255,.12); max-width: min(100% - 40px, 1200px); text-align: center; color: rgba(255,255,255,.55); font-size: 11px; }
@media (max-width: 640px) { .gallery-footer .container { flex-wrap: wrap; gap: 12px; } .gallery-footer > .container > a:last-child { margin-left: 0; } .gallery-copyright { margin-top: 12px; } }
