
/* ---- v10 rollout additions: gallery layouts, natural-ratio rail, product video, tones ---- */
body:is(.ags-has-pgx-gl,:has(.pgx-gl)) .agv-media .agv-stage{grid-template-columns:repeat(12,1fr)!important}
/* the storefront plugin re-sorts and de-duplicates gallery images, so the layout follows what it actually shows */
body:is(.ags-has-pgx-gl,:has(.pgx-gl)) .agv-media .agv-slide{aspect-ratio:1/1;grid-column:span 4;order:1}
body:is(.ags-has-pgx-gl,:has(.pgx-gl)) .agv-media .agv-stage:has(>.agv-slide:only-child)>.agv-slide{grid-column:3 / span 8}
body:is(.ags-has-pgx-gl,:has(.pgx-gl)) .agv-media .agv-stage:has(>.agv-slide:nth-child(2):last-child)>.agv-slide,body:is(.ags-has-pgx-gl,:has(.pgx-gl)) .agv-media .agv-stage:has(>.agv-slide:nth-child(4):last-child)>.agv-slide{grid-column:span 6}
body:is(.ags-has-pgx-gl,:has(.pgx-gl)) .agv-media .agv-stage:has(img[src*="Horizontal"]):has(>.agv-slide:nth-child(2):last-child)>.agv-slide{grid-column:4 / span 6}
body:is(.ags-has-pgx-gl,:has(.pgx-gl)) .agv-media .agv-stage:has(img[src*="Horizontal"]):has(>.agv-slide:nth-child(3):last-child)>.agv-slide{grid-column:span 6}
body:is(.ags-has-pgx-gl,:has(.pgx-gl)) .agv-media .agv-stage:has(img[src*="Horizontal"]):has(>.agv-slide:nth-child(4):last-child)>.agv-slide{grid-column:span 4}
body:is(.ags-has-pgx-gl,:has(.pgx-gl)) .agv-media .agv-stage:has(img[src*="Horizontal"]):has(>.agv-slide:nth-child(5):last-child)>.agv-slide{grid-column:span 3}
/* the wide 16:9 render is found by name and moved first */
body:is(.ags-has-pgx-gl,:has(.pgx-gl)) .agv-media .agv-stage>.agv-slide:has(img[src*="Horizontal"]){order:0!important;grid-column:1 / span 12!important;aspect-ratio:1672/941!important}
/* all-wide galleries (patio cover renders): first one full width, the rest in pairs */
body:has(.pgx-gl-pw) .agv-media .agv-stage>.agv-slide{aspect-ratio:1672/941!important;grid-column:span 6!important}
body:has(.pgx-gl-pw) .agv-media .agv-stage>.agv-slide:first-child{grid-column:1 / span 12!important}
body:is(.ags-has-pgx-gl,:has(.pgx-gl)) .agv-media .agv-slide:nth-child(n+6){display:none!important}
body:is(.ags-has-pgx-gl,:has(.pgx-gl)) .agv-media .agv-slide{background:#fff!important}
/* buy box on black: keep plugin notices and variation labels readable */
body:is(.ags-has-pgx,:has(.pgx)) .agv-buy .agv-soon,body:is(.ags-has-pgx,:has(.pgx)) .agx-soon{display:none!important}
body:is(.ags-has-pgx,:has(.pgx)) .agv-buy .variations label,body:is(.ags-has-pgx,:has(.pgx)) .agv-buy .variations th,body:is(.ags-has-pgx,:has(.pgx)) .agv-buy .reset_variations{color:#d1d1d6!important}
body:is(.ags-has-pgx,:has(.pgx)) .agv-buy .woocommerce-variation-price .price,body:is(.ags-has-pgx,:has(.pgx)) .agv-buy .woocommerce-variation-availability{color:#fff!important}
/* real-project rail: one height, every photo at its own width, nothing cropped */
.pgx .rail.fh{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x proximity;padding-bottom:12px}
.pgx .rail.fh .ugc{flex:0 0 auto;height:440px;aspect-ratio:auto!important;background:#000}
.pgx .rail.fh .ugc img{height:100%;width:auto;max-width:none;display:block;object-fit:contain}
@media (max-width:980px){.pgx .rail.fh .ugc{height:300px}}
/* product animation video */
.pgx .vid{position:relative;aspect-ratio:16/9;border-radius:18px;overflow:hidden;background:#000}
.pgx .vid video{width:100%;height:100%;object-fit:contain;display:block}
/* wood tones */
.pgx .tones{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.pgx .tones figure{margin:0}
.pgx .tones .ph{aspect-ratio:1/1;background:#fff;border:1px solid var(--line)}
.pgx .tones figcaption{margin-top:12px;text-align:center;font-weight:600;color:var(--txt)}
@media (max-width:700px){.pgx .tones{grid-template-columns:1fr}}
.pgx .g3v{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
@media (max-width:980px){.pgx .g3v{grid-template-columns:1fr}}
