/**
 * Galería justificada de portafolio (Flickr-style, sin recortes) + lightbox.
 * Portado 1:1 del prototipo gallery_template.html. Vars propias scoped para no
 * depender de home.css. Fuentes 'Literata'/'Fira Sans' vienen de home.css.
 *
 * @package losfull-editorial
 */
.lf-gal{
  --g-bg:#100E14; --g-bg2:#241E2B;
  --g-ink:#F5F1EA; --g-ink-soft:#C4B9CE; --g-ink-dim:#8F8699;
  --g-line:rgba(245,241,234,.06);
  --g-accent:#E6297E; --g-accent-bright:#F97BB6;
  --g-grad:linear-gradient(100deg,#F0913E 0%,#E6297E 52%,#8E2C87 100%);
  --g-serif:'Literata',Georgia,serif; --g-sans:'Fira Sans',-apple-system,system-ui,sans-serif;
  background:var(--g-bg); color:var(--g-ink); font-family:var(--g-sans);
}
.lf-gal *{box-sizing:border-box;}

/* header */
.lf-gal .ghead{max-width:1400px;margin:0 auto;padding:120px 30px 26px;}
.lf-gal .eyebrow{font-weight:600;font-size:.72rem;letter-spacing:.26em;text-transform:uppercase;color:var(--g-accent);margin:0;}
.lf-gal .ghead h1{font-family:var(--g-serif);font-weight:300;font-size:clamp(2.2rem,5vw,3.6rem);line-height:1.05;letter-spacing:-.02em;margin:14px 0 0;}
.lf-gal .ghead h1 em{font-style:italic;color:var(--g-accent-bright);}
.lf-gal .ghead p{color:var(--g-ink-soft);font-weight:300;max-width:56ch;margin-top:16px;font-size:1.02rem;line-height:1.55;}

/* justified gallery */
.lf-gal .jwrap{max-width:1400px;margin:0 auto;padding:20px 8px 60px;}
.lf-gal .jgal{display:flex;flex-wrap:wrap;gap:4px;}
.lf-gal .jitem{position:relative;overflow:hidden;cursor:pointer;flex:0 0 auto;background:var(--g-bg2);}
.lf-gal .jitem .ph{position:absolute;inset:0;background-image:var(--img);background-size:cover;background-position:center;transition:transform .9s cubic-bezier(.2,.7,.2,1);}
.lf-gal .jitem:hover .ph{transform:scale(1.06);}
.lf-gal .jitem::after{content:"";position:absolute;inset:0;background:rgba(11,8,13,0);transition:background .35s;}
.lf-gal .jitem:hover::after{background:rgba(11,8,13,.14);}

/* video row (fachada YouTube: carga el iframe solo al dar clic) */
.lf-gal .jvideo{position:relative;overflow:hidden;flex:0 0 100%;width:100%;cursor:pointer;background:#000;}
.lf-gal .jvideo .ph{position:absolute;inset:0;background-size:cover;background-position:center 30%;filter:brightness(.72);}
.lf-gal .jvideo::after{content:"";position:absolute;inset:0;background:radial-gradient(60% 60% at 50% 50%,transparent,rgba(11,8,13,.4));}
.lf-gal .jvideo .vlabel{position:absolute;top:20px;left:22px;z-index:3;color:#fff;pointer-events:none;}
.lf-gal .jvideo .vlabel b{font-family:var(--g-serif);font-weight:300;font-size:1.25rem;display:block;}
.lf-gal .jvideo .vlabel span{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.7);}
.lf-gal .jvideo .vplay{position:absolute;inset:0;z-index:3;display:grid;place-items:center;pointer-events:none;}
.lf-gal .jvideo .pbtn{width:86px;height:86px;border-radius:50%;background:rgba(255,255,255,.14);backdrop-filter:blur(8px);border:1.5px solid rgba(255,255,255,.55);display:grid;place-items:center;transition:transform .35s,background .35s,border-color .35s;animation:vpulse 2.8s infinite;}
.lf-gal .jvideo:hover .pbtn{transform:scale(1.09);background:var(--g-grad);border-color:transparent;}
.lf-gal .jvideo .pbtn svg{width:32px;height:32px;fill:#fff;margin-left:5px;}
@keyframes vpulse{0%{box-shadow:0 0 0 0 rgba(255,255,255,.35)}70%{box-shadow:0 0 0 24px rgba(255,255,255,0)}100%{box-shadow:0 0 0 0 rgba(255,255,255,0)}}
.lf-gal .jvideo .vchip{position:absolute;bottom:18px;right:20px;z-index:3;font-size:.7rem;font-weight:600;background:rgba(11,8,13,.6);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.22);color:#fff;padding:6px 12px;border-radius:999px;pointer-events:none;}
.lf-gal .jvideo iframe{position:absolute;inset:0;width:100%;height:100%;border:0;z-index:5;}

/* lightbox */
.lf-lb{position:fixed;inset:0;z-index:100000;background:rgba(8,6,10,.96);display:none;align-items:center;justify-content:center;}
.lf-lb.open{display:flex;}
.lf-lb .lb-img{width:92vw;height:86vh;background-size:contain;background-position:center;background-repeat:no-repeat;transition:opacity .25s;}
.lf-lb .lb-btn{position:absolute;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.25);color:#fff;cursor:pointer;width:52px;height:52px;border-radius:50%;display:grid;place-items:center;font-size:1.6rem;transition:background .25s,transform .25s;line-height:1;}
.lf-lb .lb-btn:hover{background:linear-gradient(100deg,#F0913E,#E6297E 52%,#8E2C87);border-color:transparent;transform:scale(1.06);}
.lf-lb .lb-prev{left:24px;top:50%;transform:translateY(-50%);}
.lf-lb .lb-prev:hover{transform:translateY(-50%) scale(1.06);}
.lf-lb .lb-next{right:24px;top:50%;transform:translateY(-50%);}
.lf-lb .lb-next:hover{transform:translateY(-50%) scale(1.06);}
.lf-lb .lb-close{top:22px;right:24px;width:46px;height:46px;font-size:1.4rem;}
.lf-lb .lb-count{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);color:rgba(255,255,255,.8);font-size:.82rem;letter-spacing:.1em;}

@media (max-width:600px){ .lf-lb .lb-prev{left:10px;} .lf-lb .lb-next{right:10px;} .lf-lb .lb-btn{width:44px;height:44px;} }
@media (prefers-reduced-motion:reduce){ .lf-gal .jvideo .pbtn{animation:none;} .lf-gal .jitem .ph{transition:none;} }