/*
 * Gallery page (Figma 48:1072) — restyles the Clear pH Masonry Gallery plugin output to the comp.
 * Loaded by inc/gallery.php on /gallery/ only, after the plugin's gallery.css.
 * Comp: filters at x168 y1203 (30px Rund 500 upper, 40px gaps, ALL green-700 / rest #a3a3a3),
 * grid 3 × 488 at x168 / 715 / 1268 (59px gutters), rows 391 apart (65px), square corners.
 */
body.gw-gallery-page .container-wrap { padding-top: 0 !important; }
body.gw-gallery-page { --gw-gallery-margin: clamp(20px, 8.75vw, 168px); --gw-gallery-gap: clamp(16px, 3.07vw, 59px); }

/* Full-bleed inside Salient's 1244px container (the .gw-bleed trick), content at the 168 margin */
body.gw-gallery-page .clearph-gallery-filters,
body.gw-gallery-page .clearph-gallery { width: 100vw; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); padding-left: var(--gw-gallery-margin); padding-right: var(--gw-gallery-margin); box-sizing: border-box; }

/* Filters: text buttons, no underline bar */
body.gw-gallery-page .clearph-gallery-filters { gap: clamp(20px, 2.6vw, 50px); margin-top: clamp(48px, 6.4vw, 123px); margin-bottom: clamp(40px, 5.2vw, 100px); } /* never the `margin` shorthand: it would reset the bleed margins above */
body.gw-gallery-page .clearph-gallery-filters .filter-btn { padding: 0; border: 0; border-bottom: 0; background: none; font-family: var(--gw-font-display); font-weight: 500; font-size: clamp(16px, 1.5625vw, 30px); line-height: 1.15; letter-spacing: 0.04em; text-transform: uppercase; color: var(--gw-grey-500); transition: color var(--gw-dur) var(--gw-ease); }
body.gw-gallery-page .clearph-gallery-filters .filter-btn:hover,
body.gw-gallery-page .clearph-gallery-filters .filter-btn.active { color: var(--gw-green-700); border-bottom-color: transparent; }
body.gw-gallery-page .clearph-gallery-filters .filter-btn:focus-visible { outline: 2px solid var(--gw-teal-500); outline-offset: 4px; }
body[data-button-style] .gw-gallery-page .clearph-gallery-filters .filter-btn,
body.gw-gallery-page[data-button-style] .clearph-gallery-filters .filter-btn { border-radius: 0 !important; }

/* Grid: the plugin's micro-column grid (3 columns = 6 tracks); a Regular tile (2×2) lands at the comp's 3:2 */
body.gw-gallery-page .clearph-gallery { margin-top: 0; margin-bottom: 0; gap: var(--gw-gallery-gap); --column-margin: var(--gw-gallery-gap); --border-radius: 0px; }
body.gw-gallery-page .clearph-gallery.masonry-enabled,
body.gw-gallery-page .clearph-gallery:not(.masonry-enabled) { grid-auto-rows: clamp(56px, 6.93vw, 133px); }
body.gw-gallery-page .clearph-gallery .gallery-item { border-radius: 0; }
body.gw-gallery-page .clearph-gallery .gallery-item img { height: 100% !important; } /* Salient: img { height: auto !important } */

@media (max-width: 999px) {
  body.gw-gallery-page .clearph-gallery-filters { gap: var(--gw-space-3); margin-top: var(--gw-space-5); margin-bottom: var(--gw-space-4); }
}
@media (max-width: 767px) {
  body.gw-gallery-page .clearph-gallery.masonry-enabled,
  body.gw-gallery-page .clearph-gallery:not(.masonry-enabled) { grid-auto-rows: clamp(90px, 28vw, 160px); } /* one column: a 2-row tile lands near 3:2 */
}
