/*
Theme Name:  PB Bricks Child
Theme URI:   https://poolbuilders.co.za
Description: PoolBuilders client-site child theme for Bricks. Theme-coupled customisations only — portable logic lives in the poolbuilders-connect plugin.
Author:      Lightning Digital
Template:    bricks
Version:     0.2.0-curtis
*/

/* Root scale: Bricks sets html{font-size:62.5%}; the PB token scale is authored for a 16px root. */
html { font-size: 100%; }

/* ---- PB self-hosted variable fonts (Curtis Pools signature: Bodoni Moda + Manrope) ---- */
@font-face {
	font-family: 'Bodoni Moda';
	font-style: normal;
	font-weight: 400 900;
	font-display: swap;
	src: url('fonts/bodoni-moda-latin-wght-normal.woff2') format('woff2-variations');
	unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
	font-family: 'Bodoni Moda';
	font-style: normal;
	font-weight: 400 900;
	font-display: swap;
	src: url('fonts/bodoni-moda-latin-ext-wght-normal.woff2') format('woff2-variations');
	unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
	font-family: 'Bodoni Moda';
	font-style: italic;
	font-weight: 400 900;
	font-display: swap;
	src: url('fonts/bodoni-moda-latin-wght-italic.woff2') format('woff2-variations');
}
@font-face {
	font-family: 'Manrope';
	font-style: normal;
	font-weight: 200 800;
	font-display: swap;
	src: url('fonts/manrope-latin-wght-normal.woff2') format('woff2-variations');
	unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
	font-family: 'Manrope';
	font-style: normal;
	font-weight: 200 800;
	font-display: swap;
	src: url('fonts/manrope-latin-ext-wght-normal.woff2') format('woff2-variations');
	unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* ---- Plugin-rendered markup (poolbuilders-connect) --------------------
   Styles for HTML injected by {pbc_*} dynamic tags. Bricks only emits
   global-class CSS for classes referenced by ELEMENTS, so plugin-rendered
   markup is styled here in the theme, not via builder classes. */
.c-gal {
	display: grid;
	grid-template-columns: repeat(12, 1fr);
	gap: var(--space-m);
	margin-block: var(--space-l);
}
.c-gal img {
	width: 100%;
	height: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	display: block;
}
.c-gal > * { grid-column: span 4; }
.c-gal figure { margin: 0; }
.c-gal > *:nth-child(3n+1) { grid-column: span 8; }
.c-gal > *:nth-child(3n+1) img { aspect-ratio: 3 / 2; }
@media (max-width: 767px) {
	.c-gal { grid-template-columns: 1fr; }
	.c-gal > *, .c-gal > *:nth-child(3n+1) { grid-column: span 1; }
}

/* ---- PERF-1 (2026-09-08) -------------------------------------------------
   Bricks wraps an image element in <figure> whenever the attachment carries a
   caption. The element's own class then lands on the FIGURE, so a hero's
   `object-fit: cover` never reaches the <img> inside and the photo renders
   stretched (object-fit: fill) — which is also what makes Lighthouse's
   image-aspect-ratio / image-size-responsive audits fire. Let the inner image
   inherit the figure's box and fit, so a captioned image behaves like an
   uncaptioned one. */
figure.brxe-image > img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: inherit;
}