/* ═══ GALERÍA ═══ */
.gl-hero { position:relative; min-height:60vh; overflow:hidden; display:flex; align-items:center; padding-top:var(--nav-h); }
.gl-sky { position:absolute; inset:0; background:linear-gradient(180deg,#1a3a50 0%,#2d6a80 30%,#4a9070 70%,#3a7030 100%); }
.gl-hero-inner { position:relative; z-index:10; padding:4rem 2rem 10rem 5%; max-width:560px; }
.gl-kicker { font-size:.72rem; letter-spacing:.22em; text-transform:uppercase; color:rgba(200,240,220,.7); margin-bottom:.8rem; }
.gl-title { font-family:var(--serif); font-size:clamp(2.8rem,7vw,5rem); font-weight:300; line-height:1.05; color:white; margin-bottom:1rem; }
.gl-title em { color:#a8d8c8; font-weight:400; }
.gl-sub { font-family:var(--serif); font-size:1.05rem; font-style:italic; color:rgba(255,255,255,.75); line-height:1.7; }
.hero-grass { position:absolute; bottom:0; left:0; right:0; height:160px; background:linear-gradient(180deg,transparent 0%,#4a8c40 55%,#2d5a27 100%); clip-path:ellipse(60% 70% at 50% 100%); z-index:2; }

/* Galería */
.gl-section { padding:6rem 0; background:var(--paper); }
.gl-block { display:grid; grid-template-columns:1.2fr 1fr; gap:4rem; align-items:center; margin-bottom:2rem; }
.gl-block.reverse { grid-template-columns:1fr 1.2fr; direction:rtl; }
.gl-block.reverse > * { direction:ltr; }
.gl-photo-main {
  position:relative; border-radius:20px; overflow:hidden;
  aspect-ratio:4/5;
  box-shadow:0 20px 60px rgba(0,0,0,.18);
  cursor:pointer;
}
.gl-photo-main img { transition:transform .7s var(--ease); }
.gl-photo-main:hover img { transform:scale(1.05); }
.gl-photo-overlay {
  position:absolute; bottom:0; left:0; right:0;
  padding:1.25rem 1.5rem;
  background:linear-gradient(transparent,rgba(0,0,0,.6));
  color:white; font-family:var(--serif); font-size:.9rem; font-style:italic;
  transform:translateY(100%);
  transition:transform .4s var(--ease);
}
.gl-photo-main:hover .gl-photo-overlay { transform:translateY(0); }

.gl-block-text { display:flex; flex-direction:column; gap:.75rem; }
.gl-num { font-size:.65rem; letter-spacing:.22em; text-transform:uppercase; color:var(--ink-mute); }
.gl-block-text h3 { font-family:var(--serif); font-size:1.8rem; font-weight:400; color:var(--ink); line-height:1.2; }
.gl-block-text p { font-family:var(--serif); font-size:1rem; line-height:1.75; color:var(--ink-soft); font-style:italic; max-width:48ch; }
.gl-location { font-size:.78rem; letter-spacing:.1em; color:var(--teal); font-weight:500; }

.gl-divider-wave { line-height:0; background:var(--cream); margin:0; }
.gl-divider-wave.alt { background:var(--paper); }
.gl-divider-wave svg { width:100%; display:block; }

/* Juntos */
.gl-together-section { margin-top:4rem; }
.gl-together-header { text-align:center; margin-bottom:2.5rem; }
.gl-together-header h3 { font-family:var(--serif); font-size:2rem; font-weight:400; color:var(--ink); margin:.4rem 0 .8rem; }
.gl-together-header p { font-family:var(--serif); font-size:1rem; color:var(--ink-soft); font-style:italic; }
.gl-together-grid { display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; }
.gl-together-item {
  position:relative; border-radius:16px; overflow:hidden;
  aspect-ratio:4/5; cursor:pointer;
  box-shadow:0 12px 40px rgba(0,0,0,.14);
}
.gl-together-item img { transition:transform .7s var(--ease); }
.gl-together-item:hover img { transform:scale(1.06); }
.gl-together-item .gl-photo-overlay { transform:translateY(100%); }
.gl-together-item:hover .gl-photo-overlay { transform:translateY(0); }

/* Lightbox */
.gl-lightbox {
  position:fixed; inset:0; z-index:5000;
  background:rgba(0,0,0,.92); backdrop-filter:blur(12px);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1rem;
  opacity:0; pointer-events:none;
  transition:opacity .4s ease;
}
.gl-lightbox.open { opacity:1; pointer-events:all; }
.gl-lightbox img { max-width:90vw; max-height:80vh; object-fit:contain; border-radius:12px; width:auto; height:auto; }
.gl-lightbox p { color:rgba(255,255,255,.7); font-family:var(--serif); font-size:.9rem; font-style:italic; }
.lb-close {
  position:absolute; top:1.5rem; right:1.5rem;
  background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.2);
  color:white; font-size:1.2rem; width:40px; height:40px;
  border-radius:50%; cursor:pointer; display:flex; align-items:center; justify-content:center;
  transition:background .2s;
}
.lb-close:hover { background:rgba(255,255,255,.25); }

/* Hero block variant — inherits gl-block, adds extra top spacing */
.gl-block-hero { margin-bottom:3rem; }

/* Section headers */
.gl-section-header { text-align:center; margin-bottom:4rem; }
.gl-section-label { font-size:.65rem; letter-spacing:.3em; text-transform:uppercase; color:var(--teal); margin-bottom:.5rem; }
.gl-section-title { font-family:var(--serif); font-size:clamp(2rem,4.5vw,3.2rem); font-weight:300; color:var(--ink); line-height:1.15; margin-bottom:.6rem; }
.gl-section-title em { color:var(--teal); font-weight:400; }
.gl-section-sub { font-family:var(--serif); font-size:1rem; font-style:italic; color:var(--ink-soft); }

/* Tall photo variant */
.gl-photo-main.tall { aspect-ratio:3/4; }

/* Section alt (slightly different bg) */
.gl-section-alt { padding:6rem 0; background:var(--cream); }

/* Mosaic grid */
.gl-mosaic { display:grid; grid-template-columns:1fr 1fr; grid-template-rows:auto auto; gap:1.5rem; }
.gl-mosaic-item {
  position:relative; border-radius:18px; overflow:hidden; cursor:pointer;
  box-shadow:0 12px 40px rgba(0,0,0,.13);
  background:#e8e0d4;
}
.gl-mosaic-item img { width:100%; height:100%; object-fit:cover; display:block; aspect-ratio:4/5; transition:transform .7s var(--ease); }
.gl-mosaic-item:hover img { transform:scale(1.05); }
.gl-mosaic-item .gl-photo-overlay { transform:translateY(100%); }
.gl-mosaic-item:hover .gl-photo-overlay { transform:translateY(0); }
.gl-mosaic-tall { grid-row:span 2; }
.gl-mosaic-tall img { aspect-ratio:unset; height:100%; min-height:400px; }
.gl-mosaic-caption {
  position:absolute; bottom:0; left:0; right:0; padding:1.25rem 1.5rem;
  background:linear-gradient(transparent, rgba(0,0,0,.65));
  color:white; opacity:0; transition:opacity .4s ease;
}
.gl-mosaic-item:hover .gl-mosaic-caption { opacity:1; }
.gl-mosaic-caption h4 { font-family:var(--serif); font-size:1rem; font-weight:400; margin-bottom:.3rem; }
.gl-mosaic-caption p { font-family:var(--serif); font-size:.82rem; font-style:italic; line-height:1.5; opacity:.85; }

/* Childhood section */
.gl-section-childhood { padding:6rem 0; background:linear-gradient(160deg,#fdf8f0 0%,#f5edd8 100%); }
.gl-childhood-grid { display:grid; grid-template-columns:1fr 1fr; gap:3rem; }
.gl-childhood-item { display:flex; flex-direction:column; gap:1.5rem; }
.gl-childhood-photo {
  position:relative; border-radius:20px; overflow:hidden; cursor:pointer;
  aspect-ratio:4/5; box-shadow:0 16px 50px rgba(0,0,0,.15);
  border:4px solid white;
  filter:sepia(15%);
  transition:filter .4s ease;
}
.gl-childhood-photo:hover { filter:sepia(0%); }
.gl-childhood-photo img { transition:transform .7s var(--ease); }
.gl-childhood-photo:hover img { transform:scale(1.04); }
.gl-childhood-photo .gl-photo-overlay { transform:translateY(100%); }
.gl-childhood-photo:hover .gl-photo-overlay { transform:translateY(0); }
.gl-childhood-text h4 { font-family:var(--serif); font-size:1.4rem; font-weight:400; color:var(--ink); margin-bottom:.6rem; }
.gl-childhood-text p { font-family:var(--serif); font-size:.95rem; line-height:1.75; color:var(--ink-soft); font-style:italic; }

/* Together captions */
.gl-together-grid.large { grid-template-columns:repeat(4,1fr); }
.gl-together-caption {
  position:absolute; bottom:0; left:0; right:0; padding:1.25rem 1.5rem;
  background:linear-gradient(transparent,rgba(0,0,0,.65));
  color:white; opacity:0; transition:opacity .4s ease;
}
.gl-together-item:hover .gl-together-caption { opacity:1; }
.gl-together-caption h4 { font-family:var(--serif); font-size:1rem; font-weight:400; margin-bottom:.3rem; }
.gl-together-caption p { font-family:var(--serif); font-size:.82rem; font-style:italic; line-height:1.5; opacity:.85; }

/* Next */
.gl-next { padding:6rem 0; background:var(--forest); text-align:center; }
.gl-next-label { font-size:.7rem; letter-spacing:.22em; text-transform:uppercase; color:rgba(200,240,200,.5); margin-bottom:.8rem; }
.gl-next-title { font-family:var(--serif); font-size:clamp(1.8rem,4vw,3rem); font-weight:300; color:white; margin-bottom:2.5rem; }
.gl-next-title em { color:#a8d8a8; }
.btn-ghibli {
  display:inline-block; padding:.9rem 2.5rem;
  background:rgba(255,255,255,.1); border:1.5px solid rgba(255,255,255,.3);
  color:white; font-family:var(--serif); font-size:1rem; font-style:italic;
  border-radius:50px; backdrop-filter:blur(8px);
  transition:background .3s ease,transform .3s var(--ease);
}
.btn-ghibli:hover { background:rgba(255,255,255,.2); transform:translateY(-3px); }

@media(max-width:1100px){
  .gl-together-grid.large { grid-template-columns:repeat(2,1fr); }
  .gl-childhood-grid { grid-template-columns:1fr 1fr; }
}
@media(max-width:900px){
  .gl-block,.gl-block.reverse { grid-template-columns:1fr; direction:ltr; gap:2rem; }
  .gl-photo-main { aspect-ratio:16/10; }
  .gl-photo-main.tall { aspect-ratio:16/10; }
  .gl-childhood-grid { grid-template-columns:1fr; gap:2rem; }
  .gl-mosaic { grid-template-columns:1fr; }
  .gl-mosaic-tall { grid-row:span 1; }
  .gl-mosaic-tall img { min-height:280px; }
  .gl-together-grid.large { grid-template-columns:1fr 1fr; }
}
@media(max-width:600px){
  .gl-together-grid,.gl-together-grid.large { grid-template-columns:1fr; }
  .gl-mosaic { grid-template-columns:1fr; }
}