/* ============================================================
   GALLERY PAGE
   ============================================================ */
/* Hero — title with photos drifting chaotically */
.ghero{ position:relative; min-height:86svh; display:flex; align-items:center; justify-content:center;
  padding:clamp(130px,16vh,190px) 0 clamp(60px,8vh,90px); overflow:hidden; text-align:center;
  background:radial-gradient(120% 70% at 50% 22%, var(--cream-3), var(--cream-2) 60%); }
.ghero__content{ position:relative; z-index:3; }
.ghero__title{ font-family:var(--display); font-weight:400; font-size:clamp(2.6rem,6.4vw,5.6rem); line-height:1.04; letter-spacing:-.02em; color:var(--bark); margin:.4rem 0 1.2rem; }
.ghero__title em{ font-style:italic; color:var(--gold-deep); }
.ghero__lead{ max-width:46ch; margin:0 auto; color:var(--text-soft); font-size:clamp(1.02rem,1.4vw,1.2rem); }

.ghero__floats{ position:absolute; inset:0; z-index:1; pointer-events:none; }
.ghero__float{ position:absolute; border-radius:18px; overflow:hidden; box-shadow:0 30px 60px -34px rgba(44,39,31,.5); }
.ghero__float img{ width:100%; height:100%; object-fit:cover; }
.gf1{ width:clamp(120px,13vw,200px); aspect-ratio:4/5; left:6%;  top:16%;  animation:drift1 13s ease-in-out infinite; }
.gf2{ width:clamp(110px,11vw,170px); aspect-ratio:1/1; right:8%; top:13%;  animation:drift2 16s ease-in-out infinite; }
.gf3{ width:clamp(120px,12vw,185px); aspect-ratio:4/5; left:10%; bottom:12%; animation:drift3 15s ease-in-out infinite; }
.gf4{ width:clamp(130px,13vw,210px); aspect-ratio:3/4; right:7%; bottom:14%; animation:drift4 18s ease-in-out infinite; }
@keyframes drift1{ 0%,100%{ transform:translate(0,0) rotate(-5deg);} 33%{ transform:translate(18px,24px) rotate(2deg);} 66%{ transform:translate(-14px,12px) rotate(-8deg);} }
@keyframes drift2{ 0%,100%{ transform:translate(0,0) rotate(6deg);} 33%{ transform:translate(-22px,16px) rotate(-3deg);} 66%{ transform:translate(10px,-18px) rotate(9deg);} }
@keyframes drift3{ 0%,100%{ transform:translate(0,0) rotate(4deg);} 33%{ transform:translate(20px,-16px) rotate(-4deg);} 66%{ transform:translate(-12px,18px) rotate(7deg);} }
@keyframes drift4{ 0%,100%{ transform:translate(0,0) rotate(-7deg);} 33%{ transform:translate(-18px,-20px) rotate(4deg);} 66%{ transform:translate(14px,14px) rotate(-3deg);} }
@media (max-width:880px){ .gf2,.gf3{ display:none; } .gf1{ left:-4%; } .gf4{ right:-4%; } }
@media (max-width:680px){
  /* mobile: drop the floating photos entirely — clean, centred text hero */
  .ghero{ min-height:auto; padding:clamp(120px,17vh,150px) 0 clamp(48px,8vh,72px); }
  .ghero__floats{ display:none; }
}
@media (prefers-reduced-motion:reduce){ .ghero__float{ animation:none; } }

/* Carousel — smooth auto-scrolling marquee, pauses on hover */
.gcar{ padding:clamp(40px,5vw,70px) 0 var(--section); background:var(--cream-2); overflow:hidden; }
.gcar__track{ display:flex; gap:16px; width:max-content; animation:gcar-scroll 50s linear infinite; }
.gcar:hover .gcar__track{ animation-play-state:paused; }
.gcar__slide{ flex:none; width:clamp(280px,30vw,440px); margin:0; }
.gcar__slide img{ width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:var(--radius-lg); display:block; }
@keyframes gcar-scroll{ to{ transform:translateX(-50%); } }
@media (prefers-reduced-motion:reduce){ .gcar__track{ animation:none; } }

/* Filtered wall */
.gwallsec{ padding:var(--section) 0; background:var(--cream-2); }
.gwall__head{ display:flex; justify-content:space-between; align-items:flex-end; gap:24px; flex-wrap:wrap; margin-bottom:clamp(30px,3.5vw,48px); }
.gfilter{ display:flex; flex-wrap:wrap; gap:8px; }
.gchip{ padding:10px 18px; border-radius:100px; border:1.5px solid var(--line); background:transparent; color:var(--text-soft); font-weight:600; font-size:.92rem; transition:.3s var(--ease); }
.gchip:hover{ border-color:var(--gold); color:var(--bark); }
.gchip.is-active{ background:var(--bark); border-color:var(--bark); color:#fff; }
.gwall{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.gtile{ overflow:hidden; border-radius:16px; aspect-ratio:1/1; position:relative; background:var(--cream); transition:opacity .45s var(--ease), transform .45s var(--ease); }
.gtile img{ width:100%; height:100%; object-fit:cover; transition:transform 1s var(--ease); }
.gtile::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 55%,rgba(44,39,31,.3)); opacity:0; transition:opacity .4s var(--ease); }
.gtile:hover img{ transform:scale(1.07); }
.gtile:hover::after{ opacity:1; }
.gtile.is-hidden{ display:none; }
.gwall__note{ text-align:center; margin-top:clamp(34px,4vw,52px); color:var(--text-soft); font-size:1rem; }

@media (max-width:1024px){ .gwall{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:680px){ .gwall{ grid-template-columns:repeat(2,1fr); gap:12px; } .gwall__head{ flex-direction:column; align-items:flex-start; } }