/* ==========================================================================
   Bron — main stylesheet
   Direction: the topographic survey plan.
   Palette: slate graphite, chalk paper, surveyor's gold.

   Note on the gold: it exists as three tokens because one value cannot
   serve both grounds. --bron-gold on chalk measures 2.5:1, which is not
   readable at label sizes, so small text on light backgrounds uses
   --bron-gold-dk (4.8:1) and text on dark uses --bron-gold-lo (7.6:1).
   Plain --bron-gold is for fills, rules and the mark only.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Fonts — self-hosted (SIL Open Font License 1.1, licences in assets/fonts/)

   Served locally rather than from Google Fonts: no third-party request means
   no IP address handed to Google before the visitor has consented to anything,
   which is what the site's own privacy policy will say.

   Both families carry real Greek. Split by subset with unicode-range, so a
   Greek page never downloads the Latin file and vice versa — about 8 KB per
   Greek weight instead of 30 KB for the combined face.
   -------------------------------------------------------------------------- */

@font-face {
	font-family: "Commissioner";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/commissioner-greek-400-normal.woff2") format("woff2");
	unicode-range: U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF;
}

@font-face {
	font-family: "Commissioner";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/commissioner-latin-400-normal.woff2") format("woff2");
	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: "Commissioner";
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url("../fonts/commissioner-greek-500-normal.woff2") format("woff2");
	unicode-range: U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF;
}

@font-face {
	font-family: "Commissioner";
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url("../fonts/commissioner-latin-500-normal.woff2") format("woff2");
	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: "Commissioner";
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url("../fonts/commissioner-greek-600-normal.woff2") format("woff2");
	unicode-range: U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF;
}

@font-face {
	font-family: "Commissioner";
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url("../fonts/commissioner-latin-600-normal.woff2") format("woff2");
	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: "Source Serif 4";
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url("../fonts/source-serif-4-greek-500-normal.woff2") format("woff2");
	unicode-range: U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF;
}

@font-face {
	font-family: "Source Serif 4";
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url("../fonts/source-serif-4-latin-500-normal.woff2") format("woff2");
	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: "Source Serif 4";
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url("../fonts/source-serif-4-greek-600-normal.woff2") format("woff2");
	unicode-range: U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF;
}

@font-face {
	font-family: "Source Serif 4";
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url("../fonts/source-serif-4-latin-600-normal.woff2") format("woff2");
	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: "Source Serif 4";
	font-style: italic;
	font-weight: 500;
	font-display: swap;
	src: url("../fonts/source-serif-4-greek-500-italic.woff2") format("woff2");
	unicode-range: U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF;
}

@font-face {
	font-family: "Source Serif 4";
	font-style: italic;
	font-weight: 500;
	font-display: swap;
	src: url("../fonts/source-serif-4-latin-500-italic.woff2") format("woff2");
	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: "Noto Sans Mono";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/noto-sans-mono-greek-400-normal.woff2") format("woff2");
	unicode-range: U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF;
}

@font-face {
	font-family: "Noto Sans Mono";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/noto-sans-mono-latin-400-normal.woff2") format("woff2");
	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: "Noto Sans Mono";
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url("../fonts/noto-sans-mono-greek-500-normal.woff2") format("woff2");
	unicode-range: U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF;
}

@font-face {
	font-family: "Noto Sans Mono";
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url("../fonts/noto-sans-mono-latin-500-normal.woff2") format("woff2");
	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;
}

/*
 * Metric-matched fallbacks. Without these the page visibly reflows when the
 * webfont swaps in, because Georgia and Arial set at different widths.
 */
@font-face {
	font-family: "Source Serif 4 Fallback";
	src: local("Georgia"), local("Times New Roman");
	size-adjust: 96%;
	ascent-override: 98%;
	descent-override: 26%;
	line-gap-override: 0%;
}
@font-face {
	font-family: "Commissioner Fallback";
	src: local("Arial"), local("Helvetica Neue"), local("Liberation Sans");
	size-adjust: 102%;
	ascent-override: 96%;
	descent-override: 24%;
	line-gap-override: 0%;
}

:root {
	/*
	 * Three brand colours carry the site:
	 *   --bron-dark   #31454F   every dark plate
	 *   --bron-chalk  #E3E7E6   every light plate
	 *   --bron-gold   #E0C782   the single accent
	 *
	 * Everything below is DERIVED from those three with color-mix, not a
	 * separate palette — so changing one of the three moves the whole site.
	 *
	 * The one rule that cannot be bent: gold on chalk measures 1.33:1, which
	 * is invisible. Gold therefore appears on dark plates and inside buttons
	 * (gold ground, dark text, 6.04:1) and nowhere else. On light plates the
	 * accent role is carried by --bron-dark at 8.04:1.
	 */
	--bron-dark:  #31454F;
	--bron-chalk: #E3E7E6;
	--bron-gold:  #E0C782;

	/* Depth, only where a surface must separate from the one behind it. */
	--bron-dark-deep: color-mix(in srgb, var(--bron-dark) 86%, #000);
	--bron-panel:     color-mix(in srgb, var(--bron-chalk) 55%, #fff);
	--bron-well:      color-mix(in srgb, var(--bron-chalk) 88%, var(--bron-dark));

	/* Secondary text, mixed from the two grounds rather than picked fresh. */
	--bron-muted:      color-mix(in srgb, var(--bron-dark) 80%, var(--bron-chalk));
	--bron-muted-dark: color-mix(in srgb, var(--bron-chalk) 75%, var(--bron-dark));

	--bron-display: "Source Serif 4", "Source Serif 4 Fallback", Georgia, serif;
	--bron-sans:    "Commissioner", "Commissioner Fallback", system-ui, sans-serif;
	/*
	 * Noto Sans Mono, not IBM Plex Mono: the mono role carries ΑΦΜ, ΓΕΜΗ and
	 * «Ανώνυμη Εταιρεία», and Plex has no Greek at all — those lines would have
	 * rendered half in Plex and half in the fallback, mid-string.
	 */
	--bron-mono:    "Noto Sans Mono", "Commissioner", ui-monospace, monospace;

	--bron-rail: clamp(1.25rem, 5vw, 5rem);
	--bron-maxw: 1260px;
	--bron-hair: 1px solid color-mix(in srgb, var(--bron-dark) 18%, transparent);
	--bron-hair-dk: 1px solid color-mix(in srgb, var(--bron-chalk) 18%, transparent);
}

/* --------------------------------------------------------------------------
   Base
   -------------------------------------------------------------------------- */

*, *::before, *::after { box-sizing: border-box; }

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
	scroll-padding-top: 6rem;
	color-scheme: light;
}

body {
	margin: 0;
	background: var(--bron-chalk);
	color: var(--bron-dark);
	font-family: var(--bron-sans);
	font-size: clamp(1rem, .96rem + .2vw, 1.0625rem);
	line-height: 1.65;
	-webkit-font-smoothing: antialiased;
	font-variant-numeric: tabular-nums;
}

img, svg, video { max-width: 100%; height: auto; }
img { display: block; }

h1, h2, h3, h4 {
	font-family: var(--bron-display);
	font-weight: 500;
	line-height: 1.1;
	letter-spacing: -.012em;
	margin: 0;
	text-wrap: balance;
}
h1 { font-size: clamp(2.2rem, 1.45rem + 3.6vw, 4.1rem); }
h2 { font-size: clamp(1.8rem, 1.3rem + 2.1vw, 2.85rem); }
h3 { font-size: clamp(1.15rem, 1.03rem + .5vw, 1.45rem); }
h4 { font-size: 1.0625rem; }

p { margin: 0 0 1.1em; }
p:last-child { margin-bottom: 0; }

a { color: inherit; }

:where(a, button, input, textarea, select, summary):focus-visible {
	outline: 2px solid var(--bron-dark);
	outline-offset: 3px;
}
/*
 * A dark focus ring is invisible on the dark plates, and a gold one is
 * invisible on chalk, so the ring follows the ground it sits on.
 */
.bron-hdr :focus-visible,
.bron-mnav :focus-visible,
.bron-hero :focus-visible,
.bron-facts :focus-visible,
.bron-approach :focus-visible,
.bron-phero :focus-visible,
.bron-ftr :focus-visible {
	outline-color: var(--bron-gold);
}

.bron-skip {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 100;
	background: var(--bron-dark-deep);
	color: var(--bron-chalk);
	padding: .75rem 1.25rem;
}
.bron-skip:focus-visible { left: 0; }

.screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden; clip-path: inset(50%);
	white-space: nowrap; border: 0;
}

/* --------------------------------------------------------------------------
   Layout primitives
   -------------------------------------------------------------------------- */

.bron-section { padding-block: clamp(4rem, 9vw, 7.5rem); }

.bron-hero__in,
.bron-thesis__in,
.bron-svc__in,
.bron-approach__in,
.bron-contact__in,
.bron-phero__in,
.bron-page__body,
.bron-single__in,
.bron-legal__in,
.bron-landing__in,
.bron-partner__in,
.bron-list__in,
.bron-ftr__top,
.bron-ftr__bottom,
.bron-hdr__in,
.bron-adjacent {
	max-width: var(--bron-maxw);
	margin-inline: auto;
	padding-inline: var(--bron-rail);
}

.bron-lede {
	font-size: clamp(1.08rem, 1rem + .45vw, 1.3rem);
	line-height: 1.56;
	max-width: 46ch;
}

.bron-muted { color: var(--bron-muted); }

/* Greek uppercase is stripped of its tonos in PHP (bron_upper), never by CSS. */
.bron-eyebrow {
	font-family: var(--bron-sans);
	font-size: .6875rem;
	font-weight: 600;
	letter-spacing: .2em;
	color: var(--bron-dark);
	margin: 0 0 1.4rem;
	display: flex;
	align-items: center;
	gap: .8rem;
}
.bron-eyebrow::after {
	content: "";
	flex: 1;
	height: 1px;
	background: currentColor;
	opacity: .4;
	max-width: 4.5rem;
}

/* --------------------------------------------------------------------------
   Buttons
   -------------------------------------------------------------------------- */

.bron-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .6rem;
	padding: .85rem 1.5rem;
	border: 1px solid transparent;
	border-radius: 1px;
	font-family: var(--bron-sans);
	font-size: .9375rem;
	font-weight: 500;
	line-height: 1.3;
	text-align: center;
	text-wrap: balance;
	text-decoration: none;
	cursor: pointer;
	transition: background .18s ease, color .18s ease, border-color .18s ease, transform .18s ease;
}
.bron-btn__icon { flex: none; }
.bron-btn:hover { transform: translateY(-1px); }

.bron-btn--solid {
	background: var(--bron-gold);
	color: var(--bron-dark-deep);
	border-color: var(--bron-gold);
}
.bron-btn--solid:hover {
	background: color-mix(in srgb, var(--bron-gold) 82%, #fff);
	border-color: color-mix(in srgb, var(--bron-gold) 82%, #fff);
}

.bron-btn--ghost {
	border-color: color-mix(in srgb, var(--bron-chalk) 40%, transparent);
	color: var(--bron-chalk);
}
.bron-btn--ghost:hover {
	border-color: var(--bron-chalk);
	background: color-mix(in srgb, var(--bron-chalk) 10%, transparent);
}

.bron-btn--ink {
	border-color: color-mix(in srgb, var(--bron-dark) 32%, transparent);
	color: var(--bron-dark);
	background: transparent;
}
.bron-btn--ink:hover {
	background: var(--bron-dark);
	color: var(--bron-chalk);
	border-color: var(--bron-dark);
}

.bron-btn--quiet {
	padding: 0;
	border: 0;
	color: var(--bron-dark);
	font-size: .875rem;
	font-weight: 600;
}
.bron-btn--quiet:hover { color: var(--bron-dark); transform: none; }
.bron-btn--quiet:hover .bron-btn__icon { transform: translateX(3px); }
.bron-btn--quiet .bron-btn__icon { transition: transform .18s ease; }

/* --------------------------------------------------------------------------
   Header
   -------------------------------------------------------------------------- */

.bron-hdr {
	position: sticky;
	top: 0;
	z-index: 50;
	background: var(--bron-dark-deep);
	border-bottom: 1px solid color-mix(in srgb, var(--bron-gold) 40%, transparent);
}
.bron-hdr__in {
	display: flex;
	align-items: center;
	gap: 1.5rem;
	height: 4.5rem;
}

.bron-brand {
	display: flex;
	align-items: center;
	gap: .6rem;
	text-decoration: none;
	color: var(--bron-chalk);
	margin-right: auto;
}
/*
 * The lockup is one SVG: `color` paints the mark, --bron-logo-word the letters.
 * Height is fixed and width follows the viewBox, so the aspect never distorts.
 */
.bron-brand__logo {
	height: 1.9rem;
	width: auto;
	flex: none;
	color: var(--bron-gold);
	--bron-logo-word: var(--bron-chalk);
}
.bron-brand__sfx {
	font-family: var(--bron-mono);
	font-size: .625rem;
	letter-spacing: .16em;
	color: var(--bron-gold);
	align-self: flex-end;
	padding-bottom: .2rem;
}

.bron-nav { display: none; }
.bron-nav__list {
	display: flex;
	gap: 2rem;
	list-style: none;
	margin: 0;
	padding: 0;
}
.bron-nav__list a {
	display: block;
	text-decoration: none;
	color: var(--bron-muted-dark);
	font-size: .875rem;
	font-weight: 500;
	padding-block: .4rem;
	border-bottom: 1px solid transparent;
	transition: color .18s ease, border-color .18s ease;
}
.bron-nav__list a:hover,
.bron-nav__list .current-menu-item > a,
.bron-nav__list .current_page_item > a {
	color: var(--bron-chalk);
	border-color: var(--bron-gold);
}

/*
 * Language switcher. Both languages are always listed; the one without a
 * translation is an inert span, struck through, rather than a link that would
 * land the visitor somewhere they did not ask for.
 */
.bron-lang { display: flex; }
.bron-lang__list {
	display: flex;
	list-style: none;
	margin: 0;
	padding: 0;
	border: 1px solid color-mix(in srgb, var(--bron-chalk) 26%, transparent);
}
.bron-lang__item + .bron-lang__item {
	border-left: 1px solid color-mix(in srgb, var(--bron-chalk) 26%, transparent);
}
.bron-lang__link {
	display: block;
	/* 24px of target on a 44px-tall header row. */
	padding: .45rem .6rem;
	text-decoration: none;
	font-family: var(--bron-mono);
	font-size: .625rem;
	letter-spacing: .1em;
	color: var(--bron-muted-dark);
	transition: color .18s ease, background .18s ease;
}
.bron-lang__link:hover { color: var(--bron-chalk); }
.bron-lang__link.is-current {
	background: var(--bron-gold);
	color: var(--bron-dark-deep);
}
.bron-lang__link.is-disabled {
	color: color-mix(in srgb, var(--bron-chalk) 34%, transparent);
	text-decoration: line-through;
	cursor: default;
}

.bron-burger {
	display: inline-flex;
	flex-direction: column;
	justify-content: center;
	gap: 5px;
	width: 2.5rem;
	height: 2.5rem;
	padding: 0 .55rem;
	background: none;
	border: 1px solid color-mix(in srgb, var(--bron-chalk) 26%, transparent);
	cursor: pointer;
}
.bron-burger span {
	display: block;
	height: 1px;
	background: var(--bron-chalk);
	transition: transform .22s ease, opacity .22s ease;
}
.bron-burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.bron-burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.bron-burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

.bron-mnav { display: none; background: var(--bron-dark-deep); border-top: var(--bron-hair-dk); }
.bron-mnav.is-open { display: block; }
.bron-mnav__list { list-style: none; margin: 0; padding: 0; }
.bron-mnav__list a {
	display: block;
	padding: .9rem var(--bron-rail);
	color: var(--bron-chalk);
	text-decoration: none;
	border-bottom: 1px solid color-mix(in srgb, var(--bron-chalk) 9%, transparent);
}
.bron-mnav__list .sub-menu { list-style: none; margin: 0; padding: 0; }
.bron-mnav__list .sub-menu a { padding-left: calc(var(--bron-rail) + 1.25rem); color: var(--bron-muted-dark); }

@media (min-width: 960px) {
	.bron-nav { display: block; }
	.bron-burger { display: none; }
	.bron-mnav { display: none !important; }
}

/* --------------------------------------------------------------------------
   Hero
   -------------------------------------------------------------------------- */

.bron-hero { background: var(--bron-dark); color: var(--bron-chalk); overflow: hidden; }
.bron-hero__in {
	display: grid;
	gap: clamp(2.5rem, 5vw, 4rem);
	align-items: center;
	padding-block: clamp(3rem, 7vw, 5.5rem);
}
@media (min-width: 1000px) {
	.bron-hero__in { grid-template-columns: 1.02fr .98fr; }
}
.bron-hero h1 { max-width: 15ch; margin-bottom: 1.4rem; }
.bron-hero h1 em { font-style: italic; color: var(--bron-gold); }
.bron-hero .bron-eyebrow { color: var(--bron-gold); }
.bron-hero .bron-lede {
	color: color-mix(in srgb, var(--bron-chalk) 86%, transparent);
	max-width: 47ch;
}
.bron-hero__cta { display: flex; flex-wrap: wrap; gap: .85rem; margin-top: 2.25rem; }

/* --------------------------------------------------------------------------
   Survey plan (hero graphic)
   -------------------------------------------------------------------------- */

.bron-plan { width: 100%; height: auto; display: block; }
.bron-plan text { font-family: var(--bron-sans); fill: var(--bron-chalk); }
.bron-plan__grid    { stroke: var(--bron-chalk); stroke-width: .5; opacity: .10; }
.bron-plan__contour { fill: none; stroke: var(--bron-muted-dark); stroke-width: 1; opacity: .28; }
.bron-plan__road    { fill: var(--bron-chalk); opacity: .06; }
.bron-plan__roadline{ fill: none; stroke: var(--bron-chalk); stroke-width: 1; stroke-dasharray: 9 9; opacity: .25; }
.bron-plan__parcel  { fill: none; stroke: var(--bron-chalk); stroke-width: 1.15; opacity: .34; }
.bron-plan__fill    { fill: var(--bron-gold); opacity: .13; }
.bron-plan__hi      { fill: none; stroke: var(--bron-gold); stroke-width: 2.2; }
.bron-plan__mark    { fill: var(--bron-gold); }
.bron-plan__dim     { fill: none; stroke: var(--bron-gold); stroke-width: 1; opacity: .75; }
.bron-plan__north   { fill: var(--bron-chalk); opacity: .7; }
.bron-plan__scale   { fill: var(--bron-chalk); opacity: .65; }
.bron-plan__scale--open { fill: none; stroke: var(--bron-chalk); stroke-width: 1; opacity: .65; }
.bron-plan__label {
	font-size: 15px;
	font-weight: 600;
	letter-spacing: .14em;
}
.bron-plan__area { font-family: var(--bron-mono); font-size: 13px; fill: var(--bron-gold); }
.bron-plan__tick { font-family: var(--bron-mono); font-size: 9.5px; fill: var(--bron-muted-dark); letter-spacing: .06em; }
.bron-plan__tick--gold { fill: var(--bron-gold); }

/* Animation is gated on .js so the drawing is fully visible without scripts. */
.js .bron-plan__draw {
	stroke-dasharray: 1;
	stroke-dashoffset: 1;
	animation: bron-draw 1.5s cubic-bezier(.5, 0, .2, 1) forwards;
}
.js .bron-plan__fade { opacity: 0; animation: bron-fade .7s ease forwards; }
.js .bron-plan__fill { opacity: 0; animation: bron-fill .8s ease .9s forwards; }
.js .bron-plan__mark {
	opacity: 0;
	transform-box: fill-box;
	transform-origin: center;
	animation: bron-pop .4s cubic-bezier(.3, 1.5, .5, 1) forwards;
}
@keyframes bron-draw { to { stroke-dashoffset: 0; } }
@keyframes bron-fade { to { opacity: 1; } }
@keyframes bron-fill { to { opacity: .13; } }
@keyframes bron-pop { from { opacity: 0; transform: scale(.2); } to { opacity: 1; transform: scale(1); } }

/* --------------------------------------------------------------------------
   Registry facts strip
   -------------------------------------------------------------------------- */

.bron-facts { background: var(--bron-dark-deep); color: var(--bron-muted-dark); border-top: var(--bron-hair-dk); }
.bron-facts__in {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1px;
	background: color-mix(in srgb, var(--bron-chalk) 12%, transparent);
	margin: 0;
}
@media (min-width: 760px) {
	.bron-facts__in {
		grid-template-columns: repeat(var(--bron-facts-count, 4), 1fr);
	}
}
.bron-fact { background: var(--bron-dark-deep); padding: 1.5rem clamp(1rem, 2.5vw, 1.75rem); }
.bron-fact dt {
	font-family: var(--bron-sans);
	font-size: .625rem;
	font-weight: 600;
	letter-spacing: .16em;
	color: var(--bron-gold);
	margin-bottom: .45rem;
}
.bron-fact dd {
	margin: 0;
	font-family: var(--bron-mono);
	font-size: clamp(.9375rem, .85rem + .3vw, 1.0625rem);
	color: var(--bron-chalk);
}

/* --------------------------------------------------------------------------
   Thesis
   -------------------------------------------------------------------------- */

.bron-thesis { background: var(--bron-panel); border-bottom: var(--bron-hair); }
.bron-thesis__in {
	display: grid;
	gap: clamp(2rem, 5vw, 4.5rem);
	align-items: start;
}
@media (min-width: 900px) {
	.bron-thesis__in { grid-template-columns: .82fr 1.18fr; }
}
.bron-thesis h2 { max-width: 13ch; }

.bron-pillars { display: grid; margin: 2.75rem 0 0; border-top: var(--bron-hair); }
.bron-pillar {
	display: grid;
	gap: .35rem 1.5rem;
	padding: 1.15rem 0;
	border-bottom: var(--bron-hair);
}
@media (min-width: 640px) {
	.bron-pillar { grid-template-columns: 11.5rem 1fr; align-items: baseline; }
}
.bron-pillar dt {
	font-family: var(--bron-sans);
	font-size: .6875rem;
	font-weight: 600;
	letter-spacing: .15em;
	color: var(--bron-dark);
}
.bron-pillar dd { margin: 0; color: var(--bron-muted); font-size: .9375rem; }

/* --------------------------------------------------------------------------
   Services
   -------------------------------------------------------------------------- */

.bron-svc__head { display: grid; gap: 1.25rem; margin-bottom: clamp(2.5rem, 5vw, 4rem); }
@media (min-width: 900px) {
	.bron-svc__head { grid-template-columns: 1fr 1fr; align-items: end; }
}

.bron-svc__grid {
	display: grid;
	gap: 1px;
	background: color-mix(in srgb, var(--bron-dark) 15%, transparent);
	border: var(--bron-hair);
}
@media (min-width: 720px) {
	.bron-svc__grid { grid-template-columns: 1fr 1fr; }
}

.bron-card {
	background: var(--bron-chalk);
	padding: clamp(1.75rem, 3.5vw, 2.75rem);
	display: flex;
	flex-direction: column;
	gap: .9rem;
	transition: background .22s ease;
}
.bron-card:hover { background: var(--bron-panel); }
.bron-card__tag {
	display: flex;
	align-items: center;
	gap: .6rem;
	margin: 0;
	font-size: .6875rem;
	font-weight: 600;
	letter-spacing: .15em;
	color: var(--bron-dark);
}
.bron-card__tag i { font-family: var(--bron-mono); font-style: normal; letter-spacing: .05em; }
.bron-card__tag::after { content: ""; flex: 1; height: 1px; background: currentColor; opacity: .3; }
.bron-card h3 { max-width: 19ch; }
.bron-card__text { color: var(--bron-muted); font-size: .9375rem; }
.bron-card__list { margin: .25rem 0 0; padding: 0; list-style: none; display: grid; gap: .42rem; }
.bron-card__list li { font-size: .875rem; padding-left: 1.15rem; position: relative; }
.bron-card__list li::before {
	content: "";
	position: absolute;
	left: 0;
	top: .62em;
	width: .45rem;
	height: 1px;
	background: var(--bron-dark);
}
.bron-card__more { margin: .5rem 0 0; }

/* --------------------------------------------------------------------------
   Approach
   -------------------------------------------------------------------------- */

.bron-approach { background: var(--bron-dark); color: var(--bron-chalk); }
.bron-approach .bron-eyebrow { color: var(--bron-gold); }
.bron-approach h2 { max-width: 19ch; margin-bottom: clamp(2.5rem, 5vw, 4rem); }

.bron-steps {
	list-style: none;
	margin: 0;
	padding: 0;
	border-top: var(--bron-hair-dk);
}
.bron-step {
	display: grid;
	gap: .5rem 2rem;
	padding: clamp(1.4rem, 3vw, 2rem) 0;
	border-bottom: var(--bron-hair-dk);
	transition: padding-left .25s ease;
}
@media (min-width: 820px) {
	.bron-step { grid-template-columns: 5rem 17rem 1fr; align-items: baseline; }
	.bron-step:hover { padding-left: .75rem; }
}
.bron-step__n { font-family: var(--bron-mono); font-size: .8125rem; color: var(--bron-gold); letter-spacing: .08em; }
.bron-step h3 { font-size: clamp(1.12rem, 1rem + .45vw, 1.35rem); }
.bron-step p { color: var(--bron-muted-dark); font-size: .9375rem; max-width: 56ch; }

/* --------------------------------------------------------------------------
   Contact
   -------------------------------------------------------------------------- */

.bron-contact__in { display: grid; gap: clamp(2.5rem, 5vw, 4.5rem); }
@media (min-width: 900px) {
	.bron-contact__in { grid-template-columns: 1fr 1fr; }
}
.bron-contact h2 { max-width: 12ch; margin-bottom: 1.25rem; }

.bron-details { margin: 2.5rem 0 0; }
.bron-detail { display: grid; gap: .2rem; padding: 1.05rem 0; border-bottom: var(--bron-hair); }
.bron-detail:first-of-type { border-top: var(--bron-hair); }
.bron-detail dt {
	font-family: var(--bron-sans);
	font-size: .6875rem;
	font-weight: 600;
	letter-spacing: .15em;
	color: var(--bron-dark);
}
.bron-detail dd { margin: 0; font-size: 1.0625rem; }
.bron-detail a {
	text-decoration: none;
	border-bottom: 1px solid color-mix(in srgb, var(--bron-dark) 25%, transparent);
}
.bron-detail a:hover { border-color: var(--bron-dark); }

.bron-map { margin-top: 2rem; }
.bron-map__note { font-size: .75rem; color: var(--bron-muted); margin: .6rem 0 0; }
.bron-map iframe { width: 100%; min-height: 320px; border: 0; display: block; }

.bron-form {
	background: var(--bron-panel);
	border: var(--bron-hair);
	padding: clamp(1.5rem, 3.5vw, 2.5rem);
}
.bron-form h3 { margin-bottom: 1.5rem; }
.bron-form__note { font-size: .75rem; color: var(--bron-muted); margin-top: 1rem; }
.bron-form__fallback {
	font-size: .875rem;
	color: var(--bron-dark);
	border: 1px dashed currentColor;
	padding: 1rem;
}

/* --------------------------------------------------------------------------
   Gravity Forms

   Gravity Forms ships its own stylesheet (the "orbital" theme in 2.8+), which
   paints a blue submit button and its own control styling. Rather than fight it
   selector by selector, this block sets GF's own custom properties where they
   exist and follows with direct rules for older versions. Everything is scoped
   under .bron-form so a form placed anywhere else is left alone.
   -------------------------------------------------------------------------- */

.bron-form .gform_wrapper,
.bron-form .gform-theme--framework,
.bron-form .gform-theme--orbital {
	--gf-color-primary: var(--bron-dark);
	--gf-color-primary-contrast: var(--bron-chalk);
	--gf-color-primary-darker: var(--bron-dark-deep);
	--gf-color-primary-lighter: var(--bron-panel);
	--gf-color-secondary: var(--bron-chalk);
	--gf-color-secondary-contrast: var(--bron-dark);
	--gf-color-out-ctrl-light-darker: color-mix(in srgb, var(--bron-dark) 22%, transparent);
	--gf-color-out-ctrl-dark: var(--bron-muted);
	--gf-ctrl-border-color: color-mix(in srgb, var(--bron-dark) 22%, transparent);
	--gf-ctrl-radius: 1px;
	--gf-ctrl-btn-radius: 1px;
	--gf-ctrl-btn-bg-color-primary: var(--bron-gold);
	--gf-ctrl-btn-bg-color-hover-primary: color-mix(in srgb, var(--bron-gold) 82%, #fff);
	--gf-ctrl-btn-color-primary: var(--bron-dark-deep);
	--gf-ctrl-btn-border-color-primary: var(--bron-gold);
	--gf-local-color: var(--bron-dark);
	--gf-form-gap-y: 1.1rem;
}

.bron-form .gform_wrapper .gform_fields { gap: 1.1rem; }

/* «* indicates required fields» — the asterisks already say it. */
.bron-form .gform_wrapper .gform_required_legend { display: none; }

.bron-form .gform_wrapper .gfield_label,
.bron-form .gform_wrapper .gform-field-label {
	font-family: var(--bron-sans);
	font-size: .8125rem;
	font-weight: 500;
	color: var(--bron-muted);
	margin-bottom: .4rem;
}
.bron-form .gform_wrapper .gfield_required { color: var(--bron-dark); }

.bron-form .gform_wrapper input[type="text"],
.bron-form .gform_wrapper input[type="email"],
.bron-form .gform_wrapper input[type="tel"],
.bron-form .gform_wrapper input[type="url"],
.bron-form .gform_wrapper input[type="number"],
.bron-form .gform_wrapper select,
.bron-form .gform_wrapper textarea {
	font: inherit;
	/* 16px minimum, or iOS zooms the viewport when the field takes focus. */
	font-size: 1rem;
	line-height: 1.4;
	padding: .7rem .85rem;
	border: 1px solid color-mix(in srgb, var(--bron-dark) 22%, transparent);
	border-radius: 1px;
	background: var(--bron-chalk);
	color: var(--bron-dark);
	width: 100%;
	box-shadow: none;
	transition: border-color .18s ease;
}
.bron-form .gform_wrapper input:focus,
.bron-form .gform_wrapper select:focus,
.bron-form .gform_wrapper textarea:focus {
	border-color: var(--bron-dark);
}
.bron-form .gform_wrapper textarea { min-height: 6.5rem; resize: vertical; }

/* ---- select ----
   appearance:none removes the native control so the chevron and padding match
   the text inputs. The chevron is an inline SVG data URI, so no extra request. */
.bron-form .gform_wrapper select {
	appearance: none;
	-webkit-appearance: none;
	padding-right: 2.5rem;
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2331454F' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right .85rem center;
	background-size: 16px 16px;
}
/*
 * Firefox draws a dotted ring INSIDE a focused select — the stray lines that
 * appear the moment the box is clicked. Making the text transparent and
 * repainting it with a zero-blur text-shadow removes the ring without
 * removing the focus outline itself.
 */
.bron-form .gform_wrapper select:-moz-focusring {
	color: transparent;
	text-shadow: 0 0 0 var(--bron-dark);
}
.bron-form .gform_wrapper select::-ms-expand { display: none; }

/* ---- checkbox and radio ---- */
.bron-form .gform_wrapper .gfield_checkbox,
.bron-form .gform_wrapper .gfield_radio { display: grid; gap: .5rem; }

.bron-form .gform_wrapper .gfield_checkbox label,
.bron-form .gform_wrapper .gfield_radio label,
.bron-form .gform_wrapper .gfield_consent_label {
	font-size: .9375rem;
	color: var(--bron-dark);
	line-height: 1.5;
}
.bron-form .gform_wrapper input[type="checkbox"],
.bron-form .gform_wrapper input[type="radio"] {
	appearance: none;
	-webkit-appearance: none;
	width: 1.15rem;
	height: 1.15rem;
	flex: none;
	margin: 0 .55rem 0 0;
	vertical-align: -.2em;
	border: 1px solid color-mix(in srgb, var(--bron-dark) 40%, transparent);
	border-radius: 1px;
	background: var(--bron-chalk);
	cursor: pointer;
	transition: background .15s ease, border-color .15s ease;
}
.bron-form .gform_wrapper input[type="radio"] { border-radius: 50%; }
.bron-form .gform_wrapper input[type="checkbox"]:checked,
.bron-form .gform_wrapper input[type="radio"]:checked {
	background-color: var(--bron-dark);
	border-color: var(--bron-dark);
}
.bron-form .gform_wrapper input[type="checkbox"]:checked {
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23E3E7E6' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	background-size: 12px 12px;
}
.bron-form .gform_wrapper input[type="radio"]:checked {
	box-shadow: inset 0 0 0 3px var(--bron-chalk);
}

/* ---- submit ---- */
.bron-form .gform_wrapper .gform_footer { margin: 1.6rem 0 0; padding: 0; }

.bron-form .gform_wrapper .gform_button,
.bron-form .gform_wrapper input[type="submit"],
.bron-form .gform_wrapper .gform-button--primary {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .6rem;
	width: 100%;
	padding: .9rem 1.5rem;
	border: 1px solid var(--bron-gold);
	border-radius: 1px;
	background: var(--bron-gold);
	color: var(--bron-dark-deep);
	font-family: var(--bron-sans);
	font-size: .9375rem;
	font-weight: 600;
	letter-spacing: .01em;
	cursor: pointer;
	transition: background .18s ease, border-color .18s ease, transform .18s ease;
}
.bron-form .gform_wrapper .gform_button:hover,
.bron-form .gform_wrapper input[type="submit"]:hover,
.bron-form .gform_wrapper .gform-button--primary:hover {
	background: color-mix(in srgb, var(--bron-gold) 82%, #fff);
	border-color: color-mix(in srgb, var(--bron-gold) 82%, #fff);
	transform: translateY(-1px);
}

/* ---- validation and confirmation ---- */
.bron-form .gform_wrapper .gfield_description,
.bron-form .gform_wrapper .gform_fileupload_rules {
	font-size: .8125rem;
	color: var(--bron-muted);
}
.bron-form .gform_wrapper .validation_message,
.bron-form .gform_wrapper .gfield_validation_message {
	font-size: .8125rem;
	color: #8E2C1C;
	background: none;
	border: 0;
	border-left: 2px solid #8E2C1C;
	padding: .1rem 0 .1rem .6rem;
	margin-top: .4rem;
}
.bron-form .gform_wrapper .gfield_error input,
.bron-form .gform_wrapper .gfield_error select,
.bron-form .gform_wrapper .gfield_error textarea { border-color: #8E2C1C; }
.bron-form .gform_wrapper .gform_validation_errors {
	background: color-mix(in srgb, #8E2C1C 8%, transparent);
	border: 0;
	border-left: 2px solid #8E2C1C;
	border-radius: 0;
	box-shadow: none;
	padding: .9rem 1rem;
	margin-bottom: 1.2rem;
}
.bron-form .gform_wrapper .gform_validation_errors h2 {
	font-family: var(--bron-sans);
	font-size: .9375rem;
	font-weight: 600;
	color: #8E2C1C;
	margin: 0;
}
.bron-form .gform_confirmation_message {
	font-size: 1rem;
	border-left: 2px solid var(--bron-dark);
	padding-left: 1rem;
}

.bron-form .gform_wrapper .gform_hidden,
.bron-form .gform_wrapper .gform_validation_container { display: none !important; }

/* --------------------------------------------------------------------------
   Interior pages
   -------------------------------------------------------------------------- */

.bron-phero {
	background: var(--bron-dark);
	color: var(--bron-chalk);
	padding-block: clamp(3rem, 7vw, 5rem);
}
.bron-phero h1 {
	font-size: clamp(1.9rem, 1.4rem + 2.4vw, 3.1rem);
	max-width: 22ch;
}
.bron-phero .bron-eyebrow { color: var(--bron-gold); }
.bron-phero .bron-lede {
	margin-top: 1.25rem;
	color: color-mix(in srgb, var(--bron-chalk) 84%, transparent);
}
.bron-phero__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 3rem;
	height: 3rem;
	margin-bottom: 1.4rem;
	border: 1px solid color-mix(in srgb, var(--bron-gold) 55%, transparent);
	color: var(--bron-gold);
}
.bron-phero__meta {
	font-family: var(--bron-mono);
	font-size: .75rem;
	letter-spacing: .1em;
	color: var(--bron-gold);
	margin: 0 0 1rem;
}

.bron-page__body { max-width: 74ch; }

/* --------------------------------------------------------------------------
   Prose
   -------------------------------------------------------------------------- */

.bron-prose h2 { margin: 2.5em 0 .6em; font-size: clamp(1.5rem, 1.2rem + 1.2vw, 2rem); }
.bron-prose h3 { margin: 2em 0 .5em; }
.bron-prose h2:first-child, .bron-prose h3:first-child { margin-top: 0; }
.bron-prose ul, .bron-prose ol { margin: 0 0 1.3em; padding-left: 1.3em; }
.bron-prose li { margin-bottom: .4em; }
.bron-prose li::marker { color: var(--bron-dark); }
.bron-prose a { color: var(--bron-dark); text-decoration-color: color-mix(in srgb, var(--bron-dark) 45%, transparent); text-underline-offset: .2em; }
.bron-prose a:hover { color: var(--bron-dark); }
.bron-prose blockquote {
	margin: 2em 0;
	padding-left: 1.5rem;
	border-left: 2px solid var(--bron-dark);
	font-family: var(--bron-display);
	font-size: 1.2rem;
	line-height: 1.45;
}
.bron-prose img { margin: 2em 0; }
.bron-prose figcaption { font-size: .8125rem; color: var(--bron-muted); margin-top: .6rem; }
.bron-prose table { width: 100%; border-collapse: collapse; margin: 2em 0; font-size: .9375rem; }
.bron-prose th, .bron-prose td { text-align: left; padding: .7rem .8rem; border-bottom: var(--bron-hair); }
.bron-prose th { font-family: var(--bron-sans); font-weight: 600; font-size: .8125rem; letter-spacing: .04em; }
.bron-prose hr { border: 0; border-top: var(--bron-hair); margin: 3em 0; }

/* --------------------------------------------------------------------------
   Blog
   -------------------------------------------------------------------------- */

.bron-list { display: grid; gap: clamp(2rem, 4vw, 3rem); }
@media (min-width: 700px) { .bron-list { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1060px) { .bron-list { grid-template-columns: repeat(3, 1fr); } }

.bron-pcard { display: flex; flex-direction: column; gap: 1rem; }
.bron-pcard__media { display: block; overflow: hidden; background: var(--bron-well); }
.bron-pcard__media img { transition: transform .5s cubic-bezier(.22, .7, .25, 1); width: 100%; }
.bron-pcard:hover .bron-pcard__media img { transform: scale(1.04); }
.bron-pcard__meta { font-family: var(--bron-mono); font-size: .75rem; color: var(--bron-muted); margin: 0; }
.bron-pcard__title { font-size: 1.25rem; margin: 0; }
.bron-pcard__title a { text-decoration: none; }
.bron-pcard__title a:hover { color: var(--bron-dark); }
.bron-pcard__excerpt { font-size: .9375rem; color: var(--bron-muted); margin: 0; }

.bron-pagination { margin-top: 3.5rem; }
.bron-pagination .nav-links { display: flex; flex-wrap: wrap; gap: .5rem; }
.bron-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.75rem;
	height: 2.75rem;
	padding-inline: .6rem;
	border: var(--bron-hair);
	text-decoration: none;
	font-size: .9375rem;
}
.bron-pagination .page-numbers.current { background: var(--bron-dark); color: var(--bron-chalk); border-color: var(--bron-dark); }
.bron-pagination a.page-numbers:hover { border-color: var(--bron-dark); }

.bron-single__media { margin: 0; }
.bron-single__media img { width: 100%; }
.bron-single__in { display: grid; gap: clamp(2rem, 5vw, 4rem); }
@media (min-width: 980px) {
	.bron-single__in { grid-template-columns: minmax(0, 1fr) 17rem; }
}
.bron-single__body { max-width: 74ch; }

.bron-toc { align-self: start; }
@media (min-width: 980px) { .bron-toc { position: sticky; top: 6.5rem; } }
.bron-toc__head {
	font-family: var(--bron-sans);
	font-size: .6875rem;
	font-weight: 600;
	letter-spacing: .16em;
	color: var(--bron-dark);
	margin: 0 0 1rem;
}
.bron-toc__list { list-style: none; margin: 0; padding: 0; counter-reset: bron-toc; border-top: var(--bron-hair); }
.bron-toc__list li { counter-increment: bron-toc; border-bottom: var(--bron-hair); }
.bron-toc__link {
	display: block;
	padding: .6rem 0;
	font-size: .875rem;
	text-decoration: none;
	color: var(--bron-muted);
	transition: color .18s ease;
}
.bron-toc__link:hover, .bron-toc__link.is-current { color: var(--bron-dark); }
.bron-toc__link::before {
	content: counter(bron-toc) ". ";
	font-family: var(--bron-mono);
	font-size: .75rem;
	color: var(--bron-dark);
}

.bron-adjacent {
	display: grid;
	gap: 1rem;
	padding-block: clamp(2rem, 4vw, 3rem);
	border-top: var(--bron-hair);
}
@media (min-width: 640px) { .bron-adjacent { grid-template-columns: 1fr 1fr; } }
.bron-adjacent__link {
	display: flex;
	align-items: center;
	gap: .75rem;
	text-decoration: none;
	font-size: .9375rem;
	color: var(--bron-muted);
}
.bron-adjacent__link:hover { color: var(--bron-dark); }
.bron-adjacent__link--next { justify-content: flex-end; text-align: right; grid-column: -2 / -1; }

.bron-search { display: flex; gap: .5rem; flex-wrap: wrap; margin: 1.5rem 0; }
.bron-search input[type="search"] {
	flex: 1 1 14rem;
	font: inherit;
	font-size: 1rem;
	padding: .7rem .85rem;
	border: 1px solid color-mix(in srgb, var(--bron-dark) 22%, transparent);
	border-radius: 1px;
	background: var(--bron-panel);
	color: var(--bron-dark);
}

.bron-empty { max-width: 46ch; }

/* --------------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------------- */

.bron-ftr { background: var(--bron-dark-deep); color: var(--bron-muted-dark); font-size: .875rem; }
.bron-ftr__top { display: grid; gap: 2.5rem; padding-block: clamp(3rem, 6vw, 4.5rem); }
@media (min-width: 820px) { .bron-ftr__top { grid-template-columns: 1.5fr 1fr 1fr; } }
.bron-ftr__brand .bron-brand__logo { --bron-logo-word: var(--bron-chalk); }
.bron-ftr__blurb { margin-top: 1rem; max-width: 36ch; }
.bron-ftr__legal {
	font-family: var(--bron-mono);
	font-size: .6875rem;
	line-height: 1.9;
	margin-top: 1.25rem;
	color: color-mix(in srgb, var(--bron-muted-dark) 82%, var(--bron-dark));
}
.bron-ftr__head {
	font-family: var(--bron-sans);
	font-size: .625rem;
	font-weight: 600;
	letter-spacing: .18em;
	color: var(--bron-gold);
	margin: 0 0 1rem;
}
.bron-ftr__list { list-style: none; margin: 0; padding: 0; display: grid; gap: .55rem; }
.bron-ftr__list a { text-decoration: none; }
.bron-ftr a:hover { color: var(--bron-chalk); }
.bron-ftr__bottom {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
	justify-content: space-between;
	padding-block: 1.5rem;
	font-size: .75rem;
	border-top: 1px solid color-mix(in srgb, var(--bron-chalk) 12%, transparent);
}
.bron-ftr__bottom a { border-bottom: 1px solid color-mix(in srgb, var(--bron-gold) 60%, transparent); }

/* --------------------------------------------------------------------------
   Scroll reveal

   Gated on the .js root class. Without it the sections would be
   permanently invisible for anyone without JavaScript, and to any crawler
   that renders CSS but not scripts.
   -------------------------------------------------------------------------- */

.js [data-reveal] { opacity: 0; transform: translateY(18px); }
.js [data-reveal].is-in {
	opacity: 1;
	transform: none;
	transition: opacity .7s ease, transform .7s cubic-bezier(.22, .7, .25, 1);
}

/* --------------------------------------------------------------------------
   Reduced motion
   -------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after {
		animation-duration: .01ms !important;
		animation-delay: 0ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
	}
	.js [data-reveal] { opacity: 1; transform: none; }
	.js .bron-plan__draw { stroke-dashoffset: 0; }
	.js .bron-plan__fill { opacity: .13; }
	.js .bron-plan__fade,
	.js .bron-plan__mark { opacity: 1; }
}

/* --------------------------------------------------------------------------
   Print
   -------------------------------------------------------------------------- */

@media print {
	.bron-hdr, .bron-mnav, .bron-ftr__top, .bron-adjacent,
	.bron-toc, .bron-form, .bron-map, .bron-plan, .bron-skip { display: none !important; }
	body { background: #fff; color: #000; font-size: 11pt; }
	.bron-phero { background: none; color: #000; padding-block: 0 1.5rem; }
	.bron-prose a::after { content: " (" attr(href) ")"; font-size: .85em; word-break: break-all; }
	.bron-section { padding-block: 0; }
	h2, h3 { break-after: avoid; }
	p, li, blockquote { break-inside: avoid; }
}

/* --------------------------------------------------------------------------
   Small leftovers
   -------------------------------------------------------------------------- */

.bron-pagelinks {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
	margin-top: 2.5rem;
	font-size: .875rem;
}
.bron-pagelinks a { text-decoration: none; border-bottom: 1px solid color-mix(in srgb, var(--bron-dark) 45%, transparent); }

.bron-pcard__body { display: flex; flex-direction: column; gap: .5rem; }

.bron-hero__copy,
.bron-hero__plan,
.bron-thesis__head,
.bron-thesis__body,
.bron-contact__copy,
.bron-ftr__col { min-width: 0; }

/* The map placeholder keeps the frame's height so loading it doesn't jump the page. */
.bron-map__load { width: 100%; }

/* --------------------------------------------------------------------------
   Legal pages (page-templates/page-legal.php)

   The sidebar is first in the DOM and second visually below 1024px, so the
   contents list is met before the body by a screen reader while sighted users
   get the conventional left rail on desktop.
   -------------------------------------------------------------------------- */

.bron-legal__in { display: grid; gap: clamp(2rem, 4vw, 3rem); }

@media (min-width: 1024px) {
	/* Always open on desktop, so the summary toggle would be noise. */
	.bron-toc__wrap > summary { display: none; }
	.bron-legal__toc { border-top: var(--bron-hair); }

	.bron-legal__in {
		grid-template-columns: 16.5rem minmax(0, 1fr);
		gap: clamp(2.5rem, 5vw, 4.5rem);
		align-items: start;
	}
	.bron-legal__aside {
		position: sticky;
		/* Clears the 4.5rem sticky header plus breathing room. */
		top: 6.5rem;
		/* A long contents list must scroll inside the rail, not past the viewport. */
		max-height: calc(100vh - 8rem);
		overflow-y: auto;
		overscroll-behavior: contain;
	}
}

.bron-legal__body { max-width: 74ch; }
.bron-legal__body > h2:first-child { margin-top: 0; }

/* ---- contents ---- */

.bron-legal__toc { margin-bottom: 2rem; }

.bron-toc__wrap > summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: .75rem;
	padding: .75rem 0;
	border-top: var(--bron-hair);
	border-bottom: var(--bron-hair);
	cursor: pointer;
	list-style: none;
	font-family: var(--bron-sans);
	font-size: .6875rem;
	font-weight: 600;
	letter-spacing: .16em;
	color: var(--bron-dark);
}
.bron-toc__wrap > summary::-webkit-details-marker { display: none; }
.bron-toc__chev { transition: transform .2s ease; color: var(--bron-muted); }
.bron-toc__wrap[open] > summary .bron-toc__chev { transform: rotate(180deg); }

.bron-legal__toc .bron-toc__list {
	list-style: none;
	margin: 0;
	padding: 0;
	counter-reset: bron-toc;
}
.bron-legal__toc .bron-toc__list li {
	counter-increment: bron-toc;
	border-bottom: var(--bron-hair);
}
.bron-legal__toc .bron-toc__link {
	display: grid;
	grid-template-columns: 1.9rem 1fr;
	gap: .3rem;
	padding: .6rem 0;
	font-size: .875rem;
	line-height: 1.45;
	text-decoration: none;
	color: var(--bron-muted);
	border-left: 2px solid transparent;
	padding-left: .6rem;
	margin-left: -.6rem;
	transition: color .18s ease, border-color .18s ease;
}
.bron-legal__toc .bron-toc__link::before {
	content: counter(bron-toc) ".";
	font-family: var(--bron-mono);
	font-size: .75rem;
	color: var(--bron-dark);
	opacity: .55;
}
.bron-legal__toc .bron-toc__link:hover { color: var(--bron-dark); }
.bron-legal__toc .bron-toc__link.is-current {
	color: var(--bron-dark);
	border-left-color: var(--bron-dark);
	font-weight: 500;
}
.bron-legal__toc .bron-toc__link.is-current::before { opacity: 1; }

/* ---- sidebar CTA ---- */

.bron-legal__cta {
	background: var(--bron-panel);
	border: var(--bron-hair);
	padding: 1.4rem;
}
.bron-legal__cta-title {
	font-family: var(--bron-display);
	font-size: 1.125rem;
	font-weight: 500;
	margin: 0 0 .5rem;
}
.bron-legal__cta p {
	font-size: .875rem;
	color: var(--bron-muted);
	margin-bottom: 1.1rem;
}
.bron-legal__cta-btn { width: 100%; }

.bron-legal__print {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: .5rem;
	width: 100%;
	margin-top: .6rem;
	padding: .55rem;
	background: none;
	border: 0;
	cursor: pointer;
	font-family: var(--bron-sans);
	font-size: .8125rem;
	color: var(--bron-muted);
	transition: color .18s ease;
}
.bron-legal__print:hover { color: var(--bron-dark); }

.bron-phero--legal .bron-phero__meta { margin: 1.5rem 0 0; }

@media print {
	.bron-legal__aside { display: none !important; }
	.bron-legal__in { display: block; }
	.bron-legal__body { max-width: none; }
}

/* --------------------------------------------------------------------------
   Back to top
   -------------------------------------------------------------------------- */

.bron-top {
	position: fixed;
	right: clamp(1rem, 3vw, 2rem);
	/* Clear of the iOS home indicator and any browser chrome. */
	bottom: calc(clamp(1rem, 3vw, 2rem) + env(safe-area-inset-bottom, 0px));
	z-index: 40;
	display: flex;
	align-items: center;
	justify-content: center;
	/* 44px minimum, so it is a comfortable target on a phone. */
	width: 2.875rem;
	height: 2.875rem;
	padding: 0;
	border: 1px solid var(--bron-gold);
	border-radius: 1px;
	background: var(--bron-dark-deep);
	color: var(--bron-gold);
	cursor: pointer;
	opacity: 0;
	transform: translateY(.5rem);
	pointer-events: none;
	transition: opacity .25s ease, transform .25s ease, background .18s ease, color .18s ease;
}
.bron-top.is-visible {
	opacity: 1;
	transform: none;
	pointer-events: auto;
}
.bron-top:hover {
	background: var(--bron-gold);
	color: var(--bron-dark-deep);
}
.bron-top:focus-visible { outline-color: var(--bron-dark); }

/* The button is [hidden] until JS arms it, so it never appears without working. */
.bron-top[hidden] { display: none; }

@media print { .bron-top { display: none !important; } }

/* --------------------------------------------------------------------------
   Partnership + leadership
   -------------------------------------------------------------------------- */

.bron-partner { background: var(--bron-panel); border-block: var(--bron-hair); }

.bron-partner__head { display: grid; gap: 1.25rem; margin-bottom: clamp(2.5rem, 5vw, 3.5rem); }
@media (min-width: 900px) {
	.bron-partner__head { grid-template-columns: 1fr 1fr; align-items: end; }
}
.bron-partner__head .bron-lede { color: var(--bron-muted); max-width: 52ch; }

.bron-partner__grid {
	display: grid;
	gap: 1px;
	background: color-mix(in srgb, var(--bron-dark) 15%, transparent);
	border: var(--bron-hair);
}
@media (min-width: 820px) {
	.bron-partner__grid { grid-template-columns: 1fr 1fr; }
}

.bron-partner__card {
	background: var(--bron-chalk);
	padding: clamp(1.75rem, 3.5vw, 2.75rem);
	display: flex;
	flex-direction: column;
	gap: .8rem;
}
.bron-partner__label {
	margin: 0;
	font-family: var(--bron-sans);
	font-size: .6875rem;
	font-weight: 600;
	letter-spacing: .16em;
	color: var(--bron-dark);
	opacity: .65;
}
.bron-partner__name { font-size: clamp(1.25rem, 1.1rem + .6vw, 1.6rem); margin: 0; }
.bron-partner__text { color: var(--bron-muted); font-size: .9375rem; }
.bron-partner__list { margin: .3rem 0 auto; padding: 0; list-style: none; display: grid; gap: .42rem; }
.bron-partner__list li { font-size: .875rem; padding-left: 1.15rem; position: relative; }
.bron-partner__list li::before {
	content: "";
	position: absolute;
	left: 0;
	top: .62em;
	width: .45rem;
	height: 1px;
	background: var(--bron-dark);
}
.bron-partner__card .bron-btn { margin-top: 1.2rem; align-self: flex-start; }

.bron-partner__note {
	margin: 1.25rem 0 0;
	font-size: .8125rem;
	color: var(--bron-muted);
	max-width: 68ch;
}

/* ---- leadership ---- */

.bron-lead {
	margin-top: clamp(2.5rem, 5vw, 4rem);
	padding-top: clamp(2rem, 4vw, 3rem);
	border-top: var(--bron-hair);
}
.bron-lead__body { display: grid; gap: 1.25rem; margin-top: 1.25rem; }
@media (min-width: 820px) {
	.bron-lead__body { grid-template-columns: 20rem minmax(0, 1fr); gap: clamp(2rem, 4vw, 3.5rem); align-items: start; }
}
.bron-lead__name { font-size: clamp(1.35rem, 1.15rem + .8vw, 1.85rem); margin: 0; }
.bron-lead__role {
	margin: .4rem 0 0;
	font-size: .875rem;
	color: var(--bron-muted);
	line-height: 1.5;
}
.bron-lead__bio { font-size: .9375rem; color: var(--bron-muted); max-width: 60ch; }
.bron-lead .bron-btn { margin-top: 1rem; }

/* --------------------------------------------------------------------------
   Landing pages (page-templates/page-landing.php)
   -------------------------------------------------------------------------- */

.bron-landing__in { display: grid; gap: clamp(2rem, 4vw, 3rem); }

@media (min-width: 1024px) {
	.bron-landing__in {
		/* Mirror of the legal template: rail on the right, body on the left. */
		grid-template-columns: minmax(0, 1fr) 17rem;
		gap: clamp(2.5rem, 5vw, 4.5rem);
		align-items: start;
	}
	.bron-landing__aside {
		position: sticky;
		top: 6.5rem;
		max-height: calc(100vh - 8rem);
		overflow-y: auto;
		overscroll-behavior: contain;
	}
}

.bron-landing__body { max-width: 74ch; min-width: 0; }
.bron-landing__body > h2:first-child { margin-top: 0; }

.bron-fact__note {
	margin: .4rem 0 0;
	font-family: var(--bron-sans);
	font-size: .6875rem;
	line-height: 1.5;
	color: var(--bron-muted-dark);
}

.bron-landing__disclaimer,
.bron-landing__reviewed {
	font-size: .8125rem;
	color: var(--bron-muted);
}
.bron-landing__disclaimer {
	margin-top: 2.5rem;
	padding-left: 1rem;
	border-left: 2px solid color-mix(in srgb, var(--bron-dark) 30%, transparent);
}
.bron-landing__reviewed {
	margin-top: 1rem;
	font-family: var(--bron-mono);
	font-size: .75rem;
}

/* ---- questions ---- */

.bron-faq { background: var(--bron-panel); border-block: var(--bron-hair); }
.bron-faq__in { max-width: var(--bron-maxw); margin-inline: auto; padding-inline: var(--bron-rail); }
.bron-faq__title { max-width: 20ch; margin-bottom: clamp(2rem, 4vw, 3rem); }
.bron-faq__list { border-top: var(--bron-hair); max-width: 82ch; }

.bron-faq__item { border-bottom: var(--bron-hair); }
.bron-faq__item > summary {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 1.5rem;
	padding: 1.15rem 0;
	cursor: pointer;
	list-style: none;
	font-family: var(--bron-display);
	font-size: clamp(1.05rem, .98rem + .35vw, 1.25rem);
	font-weight: 500;
	line-height: 1.35;
	color: var(--bron-dark);
}
.bron-faq__item > summary::-webkit-details-marker { display: none; }
.bron-faq__item > summary:hover { color: var(--bron-muted); }
.bron-faq__chev { flex: none; color: var(--bron-muted); transition: transform .22s ease; }
.bron-faq__item[open] > summary .bron-faq__chev { transform: rotate(180deg); }

.bron-faq__answer { padding: 0 0 1.5rem; max-width: 70ch; }
.bron-faq__answer p { font-size: .9375rem; color: var(--bron-muted); }

/* ---- closing call to action ---- */

.bron-landing__cta { background: var(--bron-dark); color: var(--bron-chalk); }
.bron-landing__cta-in {
	max-width: var(--bron-maxw);
	margin-inline: auto;
	padding-inline: var(--bron-rail);
	text-align: center;
}
.bron-landing__cta h2 { max-width: 18ch; margin-inline: auto; }
.bron-landing__cta .bron-lede {
	margin: 1.25rem auto 2rem;
	color: var(--bron-muted-dark);
	max-width: 52ch;
}

/* --------------------------------------------------------------------------
   Menu call-to-action

   Add the class `is-cta` to a menu item under Appearance → Menus → Screen
   Options → CSS Classes. Gold ground with dark text reads 6:1, so it stands
   out against the muted nav links without failing contrast.
   -------------------------------------------------------------------------- */

.bron-nav__list li.is-cta > a {
	background: var(--bron-gold);
	color: var(--bron-dark-deep);
	padding: .5rem .9rem;
	border: 1px solid var(--bron-gold);
	border-radius: 1px;
	font-weight: 600;
	transition: background .18s ease, border-color .18s ease;
}
.bron-nav__list li.is-cta > a:hover,
.bron-nav__list li.is-cta.current-menu-item > a {
	background: color-mix(in srgb, var(--bron-gold) 82%, #fff);
	border-color: color-mix(in srgb, var(--bron-gold) 82%, #fff);
	color: var(--bron-dark-deep);
}

.bron-mnav__list li.is-cta > a {
	margin: .6rem var(--bron-rail);
	padding: .8rem 1rem;
	background: var(--bron-gold);
	color: var(--bron-dark-deep);
	font-weight: 600;
	text-align: center;
	border: 0;
	border-radius: 1px;
}
