/* =========================
   GALLERY PAGE TOKENS
========================= */
.page-gallery{
  --hero-img:url('../assets/gallery/gallery-header3.png');
}

/* =========================
   PAGE BACKGROUND
========================= */
body.page-gallery{
  background:radial-gradient(
    1400px 600px at 50% -220px,
    #fff 0%,
    var(--bg) 55%,
    var(--bg-2) 100%
  );
}

/* =========================
   HERO (MATCH GLOBAL TYPE)
========================= */
.page-gallery .hero{
  background:
    linear-gradient(0deg, rgba(0,0,0,.45), rgba(0,0,0,.3)),
    var(--hero-img) center/cover no-repeat;
  padding-block:120px;
  text-align:center;
}

.page-gallery .hero h1{
  color:#fff;
}

.page-gallery .hero .lead{
  color:#fff;
  font-size:clamp(1rem, 1.4vw, 1.15rem);
  max-width:720px;
  margin-inline:auto;
  opacity:.95;
}

/* =========================
   MAIN CONTAINER
   (RESTORED — THIS IS THE KEY)
========================= */
.page-gallery main.container{
  max-width:none;            /* ⬅ restores wide cards */
  padding-left:8px;
  padding-right:8px;
}

/* =========================
   SECTION SPACING
========================= */
.page-gallery section{
  padding-block:24px;
}

.page-gallery .filters{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:14px;
  flex-wrap:wrap;
  margin:36px 0 5px; /* ⬅ brings images closer */
}


.page-gallery .chip{
  background:#fff;
  color:var(--heading);
  border:1.5px solid var(--border);
  border-radius:999px;
  padding:10px 18px;
  font-size:.95rem;
  font-weight:700;
  cursor:pointer;
}

.page-gallery .chip.active{
  background:var(--heading);
  color:#fff;
  border-color:var(--heading);
}

/* =========================
   GALLERY GRID (WIDE LIKE BEFORE)
========================= */
.page-gallery .grid{
  display:grid;
  grid-template-columns:repeat(12,1fr);
  gap:8px;
  max-width:1600px;
  margin-inline:auto;
}

/* =========================
   CARD (3 PER ROW)
========================= */
.page-gallery .card{
  grid-column:span 4;
  border-radius:14px;
  overflow:hidden;
  position:relative;
}

.page-gallery .card img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

/* =========================
   TABLET
========================= */
@media (max-width:1000px){
  .page-gallery .grid{
    grid-template-columns:repeat(6,1fr);
    gap:10px;
  }
  .page-gallery .card{
    grid-column:span 3;
  }
}

/* =========================
   MOBILE — ONE LARGE IMAGE PER ROW
========================= */
@media (max-width:640px){
  .page-gallery .grid{
    grid-template-columns:1fr;   /* ⬅ new requirement */
    gap:12px;
  }
  .page-gallery .card{
    grid-column:span 1;
  }
}

/* =========================
   CTA (UNCHANGED)
========================= */
.page-gallery .gallery-cta{
  text-align:center;
  margin:8px auto 24px; /* ⬅ brings CTA closer */
  padding:0 16px;
  max-width:1000px;
}


.page-gallery .gallery-cta h2{
  font-size:clamp(1.55rem, 2.6vw, 1.9rem);
  font-weight:800;
  margin-bottom:10px;
}

.page-gallery .gallery-cta p{
  max-width:520px;
  margin:0 auto 24px;
  font-size:1rem;
  line-height:1.55;
  opacity:.85;
}

.page-gallery .gallery-cta .btn{
  font-size:.95rem;
  padding:14px 30px;
}