/*
 Theme Name:   Bricks Child Theme
 Theme URI:    https://bricksbuilder.io/
 Description:  Use this child theme to extend Bricks.
 Author:       Bricks
 Author URI:   https://bricksbuilder.io/
 Template:     bricks
 Version:      1.1
 Text Domain:  bricks
*/

/* =============================== SHOP — FILTER + PRODUCTS LAYOUT =============================== */
/*
 * Sidebar (270px) + main column: main must grow or it stays content-sized and feels “bunched”.
 * (Parent `block-filter-3__container__content-container` is a flex row from Bricks global class.)
 */
.block-filter-3__container__content-container > .block-filter-3__container__content {
	flex: 1 1 0%;
	min-width: 0;
	width: 100%;
	max-width: 100%;
}

/* Product grid wrapper: full width of main column (not a multi-column grid cell). */
.block-filter-3__container__content .brxe-woocommerce-products {
	width: 100%;
	max-width: 100%;
}

.block-filter-3__container__content .brxe-woocommerce-products > ul.products {
	width: 100%;
}

/* Result count + pagination: calm hierarchy above/below the grid */
.block-filter-3__container__content .brxe-woocommerce-products .bricks-products-widgets {
	font-size: var(--text-s, 1.35rem);
	line-height: 1.4;
	color: var(--text-body, inherit);
}

.block-filter-3__container__content .brxe-woocommerce-products .bricks-products-widgets.before {
	margin-bottom: var(--space-s, 1rem);
}

.block-filter-3__container__content .brxe-woocommerce-products .bricks-products-widgets.after {
	margin-top: var(--space-m, 1.25rem);
}

/* Filter buttons (sidebar uses data-mode="button"): clear focus rings for keyboard users */
.block-filter-3__container__filter-wrapper .brxe-filter-checkbox[data-mode="button"] .bricks-button:focus-visible,
.block-filter-3__container__filter-wrapper .brxe-filter-radio[data-mode="button"] .bricks-button:focus-visible {
	outline: 2px solid var(--secondary, #034c7f);
	outline-offset: 2px;
}

/* Product tiles: readable captions, calm card rhythm */
.block-filter-3__container__content .woocommerce ul.products li.product {
	background: var(--bg-surface, #fff);
	border-radius: var(--radius-s, 0.6rem);
	box-shadow: var(--shadow-xs, 0 1px 2px rgba(0, 0, 0, 0.08));
	overflow: hidden;
	transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.block-filter-3__container__content .woocommerce ul.products li.product:hover {
	box-shadow: var(--shadow-s, 0 1.5px 3px rgba(0, 0, 0, 0.12));
}

.block-filter-3__container__content .woocommerce ul.products li.product a.woocommerce-LoopProduct-link img,
.block-filter-3__container__content .woocommerce ul.products li.product img {
	border-radius: 0;
}

/* =============================== SHOP / PRODUCT GRID — CARD TITLES =============================== */
/*
 * WC outputs h2.woocommerce-loop-product__title — inherits global heading scale (reads very large).
 * Size + color from Core Framework tokens (Bricks theme style references the same --secondary / --text-*).
 * Card titles: between --text-s and --text-l (~1.5 CF steps above former --text-s).
 */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
	margin: 0.75rem 0 0;
	padding: 0;
	font-size: calc((var(--text-s, 1.74rem) + var(--text-l, 2rem)) / 2);
	font-weight: 400;
	line-height: 1.33;
	letter-spacing: 0.01em;
	color: var(--secondary, #034c7f);
}

.woocommerce ul.products li.product a.woocommerce-loop-product__link:hover .woocommerce-loop-product__title,
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link:hover .woocommerce-loop-product__title {
	color: var(--secondary-d-1, var(--secondary, #034c7f));
}

/* =============================================================================
   PDP product spec accordion (Impeccable: hierarchy, rhythm, calm contrast, a11y)
   WC attributes table has no thead — label/value rows only; style th/td accordingly.
   ============================================================================= */

.single-product .apchip-pdp-spec-accordion.brxe-accordion-nested {
	--apchip-acc-accent: var(--secondary, #034c7f);
	--apchip-acc-accent-soft: var(--secondary-10, rgba(3, 76, 127, 0.1));
	--apchip-acc-surface: var(--bg-surface, #fff);
	/* Neutral structure only — no brand tint on accordion chrome */
	--apchip-acc-border: rgba(0, 0, 0, 0.1);
	/* Lighter rule for row separation inside panels (no row backgrounds) */
	--apchip-acc-row-border: rgba(0, 0, 0, 0.08);
	width: 100%;
	margin-top: var(--space-m, 1.25rem);
	margin-bottom: var(--space-l, 1.5rem);
	/* border: 1px solid var(--apchip-acc-border); */
	border-radius: 0;
	background-color: var(--apchip-acc-surface);
	box-shadow: none;
	overflow: hidden;
}

.single-product .apchip-pdp-spec-accordion > .brxe-block {
	border-bottom: 1px solid var(--apchip-acc-border);
}

.single-product .apchip-pdp-spec-accordion > .brxe-block:last-child {
	border-bottom: none;
}

/* Brixies title = native button — full-width hit target, no UA chrome */
.single-product .apchip-pdp-spec-accordion .accordion-title-wrapper {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-s, 1rem);
	box-sizing: border-box;
	width: 100%;
	min-height: 3rem;
	margin: 0;
	padding: 0.9rem 1.15rem;
	font: inherit;
	color: inherit;
	text-align: left;
	background: transparent;
	border: none;
	border-radius: 0;
	cursor: pointer;
	transition: opacity 0.18s ease, transform 0.18s ease;
	-webkit-tap-highlight-color: transparent;
}

@media (min-width: 768px) {
	.single-product .apchip-pdp-spec-accordion .accordion-title-wrapper {
		min-height: 3.25rem;
		padding: 1rem 1.5rem;
	}
}

.single-product .apchip-pdp-spec-accordion .accordion-title-wrapper:hover {
	background-color: transparent;
}

.single-product .apchip-pdp-spec-accordion .accordion-title-wrapper:focus {
	outline: none;
}

/* Focus ring only (a11y) — not a chrome border */
.single-product .apchip-pdp-spec-accordion .accordion-title-wrapper:focus-visible {
	outline: 2px solid var(--apchip-acc-accent);
	outline-offset: 2px;
	background-color: transparent;
	box-shadow: none;
}

/* Open vs closed: same title row surface; icon state/colors unchanged below */
.single-product .apchip-pdp-spec-accordion > .brx-open > .accordion-title-wrapper {
	background-color: transparent;
	box-shadow: none;
}

.single-product .apchip-pdp-spec-accordion > .brx-open > .accordion-title-wrapper .brxe-icon {
	opacity: 1;
	color: var(--apchip-acc-accent);
}

.single-product .apchip-pdp-spec-accordion .accordion-title-wrapper .brxe-heading {
	margin: 0;
	font-size: var(--text-s);
	font-weight: 400;
	line-height: 1.35;
	letter-spacing: 0.012em;
	color: var(--text-title, inherit);
	text-align: left;
	flex: 1;
}

.single-product .apchip-pdp-spec-accordion .accordion-title-wrapper .brxe-icon {
	flex-shrink: 0;
	color: var(--apchip-acc-accent);
	opacity: 0.72;
	transition: opacity 0.18s ease, transform 0.18s ease, color 0.18s ease;
}

.single-product .apchip-pdp-spec-accordion .accordion-content-wrapper {
	padding: 1.25rem 1.15rem 1.4rem;
	background-color: transparent;
	/* border-top: 1px solid var(--apchip-acc-row-border); */
}

@media (min-width: 768px) {
	.single-product .apchip-pdp-spec-accordion .accordion-content-wrapper {
		padding: 1.5rem 1.5rem 1.65rem;
	}
}

/*
 * Panel body: token-first; fallback ~16px for readable specs (not 1.35rem).
 * Triggers stay semibold at --text-s; body regular weight.
 */
.single-product .apchip-pdp-spec-accordion .accordion-content-wrapper .brxe-text-basic {
	font-size: var(--text-s);
	font-family: var(--montserrat);
    font-weight: 500;
    line-height: 1.3;
	color: var(--text-body, inherit);
	padding-left: var(--space-s);
	padding-right: var(--space-s);
}

.single-product .apchip-pdp-spec-accordion .accordion-content-wrapper .brxe-text-basic > p:first-child {
	margin-top: 0;
}

.single-product .apchip-pdp-spec-accordion .accordion-content-wrapper .brxe-text-basic > p:last-child {
	margin-bottom: 0;
}

.single-product .apchip-pdp-spec-accordion .accordion-content-wrapper .brxe-text-basic > p + p {
	margin-top: 0.65em;
}

.single-product .apchip-pdp-spec-accordion .accordion-content-wrapper .brxe-text-basic h3,
.single-product .apchip-pdp-spec-accordion .accordion-content-wrapper .brxe-text-basic h4 {
	margin: 1.15em 0 0.45em;
	font-size: 1em;
	font-weight: 400;
	color: var(--text-title, inherit);
	line-height: 1.4;
}

.single-product .apchip-pdp-spec-accordion .accordion-content-wrapper .brxe-text-basic h3:first-child,
.single-product .apchip-pdp-spec-accordion .accordion-content-wrapper .brxe-text-basic h4:first-child {
	margin-top: 0;
}

.single-product .apchip-pdp-spec-accordion .accordion-content-wrapper a {
	color: var(--apchip-acc-accent, var(--secondary, #034c7f));
	text-decoration-thickness: 1px;
	text-underline-offset: 0.12em;
}

.single-product .apchip-pdp-spec-accordion .accordion-content-wrapper a:hover {
	text-decoration-thickness: 2px;
}

.single-product .apchip-pdp-spec-accordion .accordion-content-wrapper a:focus-visible {
	outline: 2px solid var(--apchip-acc-accent, var(--secondary, #034c7f));
	outline-offset: 2px;
}

/* Horizontal scroll for wide spec tables (wrapper from apchip_echo_product_attributes_html). */
.single-product .apchip-pdp-spec-accordion .apchip-pdp-spec-table-wrap {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	margin: 0;
	scrollbar-gutter: stable;
}

/* WooCommerce product-attributes.php: no thead — only tr > th + td */
.single-product .apchip-pdp-spec-accordion .accordion-content-wrapper table.shop_attributes {
	width: 100%;
	border-collapse: collapse;
	margin: 25px 0 25px 0;
	font-size: var(--text-s);
	line-height: 1.5;
}

.single-product .apchip-pdp-spec-accordion .accordion-content-wrapper table.shop_attributes thead th {
	text-align: left;
	font-weight: 600;
	padding: 0.65rem 0.85rem;
	background-color: transparent;
	color: var(--text-title, inherit);
	border-bottom: 1px solid var(--apchip-acc-row-border);
}

.single-product .apchip-pdp-spec-accordion .accordion-content-wrapper table.shop_attributes tbody th,
.single-product .apchip-pdp-spec-accordion .accordion-content-wrapper table.shop_attributes th[scope='row'] {
	width: 34%;
	max-width: 11.5rem;
	padding: 0.7rem 0.85rem 0.7rem 0;
	text-align: left;
	font-weight: 600;
	color: var(--text-title, inherit);
	vertical-align: top;
	border-bottom: 1px solid var(--apchip-acc-row-border);
}

.single-product .apchip-pdp-spec-accordion .accordion-content-wrapper table.shop_attributes tbody td,
.single-product .apchip-pdp-spec-accordion .accordion-content-wrapper table.shop_attributes td.woocommerce-product-attributes-item__value {
	padding: 0.7rem 0 0.7rem 0.85rem;
	vertical-align: top;
	color: var(--text-body, inherit);
	border-bottom: 1px solid var(--apchip-acc-row-border);
	font-size: var(--text-s);
	font-family: var(--montserrat);
    font-weight: 500;
    line-height: 1.3;
}

.single-product .apchip-pdp-spec-accordion .accordion-content-wrapper table.shop_attributes tbody tr:last-child th,
.single-product .apchip-pdp-spec-accordion .accordion-content-wrapper table.shop_attributes tbody tr:last-child td {
	border-bottom: none;
}

.single-product .apchip-pdp-spec-accordion .accordion-content-wrapper table.shop_attributes p {
	margin: 0 0 0.35em;
}

.single-product .apchip-pdp-spec-accordion .accordion-content-wrapper table.shop_attributes p:last-child {
	margin-bottom: 0;
}

/* Prep/nutrition fragments may include non-WC tables — keep parity without fighting .shop_attributes */
.single-product .apchip-pdp-spec-accordion .accordion-content-wrapper .brxe-text-basic table:not(.shop_attributes) {
	width: 100%;
	border-collapse: collapse;
	margin: 0.75em 0;
	font-size: 0.9375em;
	line-height: 1.5;
}

.single-product .apchip-pdp-spec-accordion .accordion-content-wrapper .brxe-text-basic table:not(.shop_attributes) :is(th, td) {
	padding: 0.65rem 0.85rem;
	vertical-align: top;
	border-bottom: 1px solid var(--apchip-acc-row-border);
}

.single-product .apchip-pdp-spec-accordion .accordion-content-wrapper .brxe-text-basic table:not(.shop_attributes) tr:last-child :is(th, td) {
	border-bottom: none;
}


.block-filter-3__container__filter-checkbox .brx-input-indicator {
	display: none !important;
}

.brx-option-all .brx-input-indicator {
	display: none !important;
}

.brx-input-indicator {
	display: none !important;
}

.brx-input-label {
	font-size: var(--text-s);
	font-family: var(--montserrat);
	font-weight: 600;
	line-height: 1.3;
	color: var(--text-body, inherit);
}

.block-filter-3__container__filter-checkbox label {
	font-size: var(--text-s);
	font-family: var(--montserrat);
	font-weight: 500;
	line-height: 1.3;
	color: var(--text-body, inherit);
}


.block-filter-3__container__filter-radio label {
	font-size: var(--text-s);
	font-family: var(--montserrat);
	font-weight: 500;
	line-height: 1.3;
	color: var(--text-body, inherit);
}

.brxe-filter-checkbox label {
	font-size: var(--text-s);
	font-family: var(--montserrat);
	font-weight: 500;
	line-height: 1.3;
	color: var(--text-body, inherit);
}

.brxe-filter-checkbox[data-mode="button"] .bricks-button {
	font-size: var(--text-xs);
	font-family: var(--montserrat);
	font-weight: 500;
	line-height: 1.3;
	color: var(--text-body, inherit);
}
.brxe-filter-radio label {
	font-size: var(--text-s);
	font-family: var(--montserrat);
	font-weight: 500;
	line-height: 1.3;
	color: var(--text-body, inherit);
}


.block-filter-3__container__filter-radio-btn.brxe-filter-radio[data-mode="button"] .bricks-button {
	font-size: var(--text-s);
}

.woocommerce ul.products li.product a.woocommerce-loop-product__link 
.woocommerce-loop-product__title, .woocommerce ul.products li.product 
a.woocommerce-LoopProduct-link .woocommerce-loop-product__title {
	padding-top: var(--space-s);
}

.brxe-filter-checkbox .brx-option-text {
	font-size: var(--text-s);
	font-family: var(--montserrat);
	font-weight: 600;
	line-height: 1.3;
	color: var(--text-body, inherit);
}

.button.product_type_simple {
	display: none;
}

#brx-content .brxe-breadcrumbs > span.item, #brx-content .brxe-breadcrumbs > span.item > a, #brx-content .brxe-breadcrumbs > a.item {
	font-size: var(--text-s);
	font-family: var(--montserrat);
	font-weight: 500;
	line-height: 1.3;
}

.products.woocommerce .wc-loop-sku {
    font-size: var(--text-s);
	font-family: var(--montserrat);
	font-weight: 600;
	line-height: 1.3;
	color: var(--text-body, inherit);
    margin-top: var(--space-xs);
    display: block;
}

.products.woocommerce .wc-loop-cut-size-value {
    font-size: var(--text-s);
	font-family: var(--montserrat);
	font-weight: 600;
	line-height: 1.3;
	color: var(--text-body, inherit);
    display: block;
}

.woocomerce-pagination {
    margin-top: var(--space-m);
}

.bricks-products-widgets .woocomerce-pagination .page-numbers li span, .bricks-products-widgets .woocomerce-pagination .page-numbers li a {
    font-size: var(--text-xl);
	font-family: var(--montserrat);
	font-weight: 500;
	line-height: 1.3;
	color: var(--text-body, inherit);
}

.woocomerce-pagination .page-numbers.current {
    font-weight: 600;
}

.woocommerce-pagination .page-numbers li a {
    font-size: var(--text-m);
	font-family: var(--montserrat);
	font-weight: 500;
	line-height: 1.3;
	color: var(--secondary);  
} 

.woocommerce-pagination .page-numbers li {
    font-size: var(--text-m);
	font-family: var(--montserrat);
	font-weight: 500;
	line-height: 1.3;
	color: var(--text-body, inherit);   
}

.brxe-filter-checkbox .depth-1 {
	margin-left: 15px;
}

.brxe-filter-active-filters .bricks-button .icon {
	width: initial;
}

.brxe-filter-search .fa-xmark {
	width: initial;
}

@media only screen and (min-width: 991px) {
	.contact-29-block__container__form.brxe-form select {
        min-height: 350px;
    }
}

/* Products multi-select (lefems): short hint above control — mobile only (native UI shows “N items”). */
.apchip-lefems-wrap .apchip-lefems-hint {
	display: none;
	margin: 0 0 0.5rem;
	font-size: var(--text-s);
	line-height: 1.45;
	color: rgba(0, 0, 0, 0.68);
	max-width: 40rem;
}

#brx-content .contact-29-block__container__form.brxe-form select {
    font-size: var(--text-s);
}

@media (max-width: 767px) {
	.apchip-lefems-wrap .apchip-lefems-hint {
		display: block;
	}

    #brx-content .contact-29-block__container__form.brxe-form select {
        font-size: var(--text-xs);
    }
}

@media (prefers-reduced-motion: reduce) {
	.single-product .apchip-pdp-spec-accordion.brxe-accordion-nested,
	.single-product .apchip-pdp-spec-accordion .accordion-title-wrapper,
	.single-product .apchip-pdp-spec-accordion .accordion-title-wrapper .brxe-icon {
		transition: none;
	}

	.single-product .apchip-pdp-spec-accordion .brx-icon-transform {
		transition: none !important;
	}
}

/* ============================================================
   Gravity Forms — dark-variant overrides for homepage hero
   Scope: Bricks block .hero-section24-block__container-form
   Form: GF id 4, gform-theme--orbital
   Brand: dark blue #034C7F bg, brand orange #FCB040 CTA, white labels
   ============================================================ */

/* Layer A: Orbital CSS-var overrides (labels, descriptions, progress, focus).
   Note: --gf-ctrl-label-color-primary is also set by GF's per-form theme-settings
   inline rule "#gform_wrapper_4[data-form-index='0'].gform-theme { --gf-ctrl-label-color-primary: #112337; }"
   at specificity (1,2,0). To beat it we need (1,3,0) — see Layer A2 below.
   The OTHER label vars (-secondary/-tertiary/-quaternary) and -req / -desc / focus / progress
   vars are not emitted by the per-form rule, so a (0,3,0) class scope is sufficient for them. */
.hero-section24-block__container-form .gform_wrapper.gform-theme--orbital {
	--gf-ctrl-label-color-secondary: #ffffff;
	--gf-ctrl-label-color-tertiary: rgba(255, 255, 255, 0.8);
	--gf-ctrl-label-color-quaternary: rgba(255, 255, 255, 0.8);

	--gf-ctrl-label-color-req: #FCB040;

	--gf-ctrl-desc-color: rgba(255, 255, 255, 0.82);

	--gf-ctrl-outline-color-focus: rgba(252, 176, 64, 0.65);
	--gf-ctrl-border-color-focus: #FCB040;
	--gf-ctrl-accent-color: #FCB040;

	--gf-field-pg-prog-color: rgba(255, 255, 255, 0.92);
	--gf-field-pg-steps-number-color: rgba(255, 255, 255, 0.85);
	--gf-field-pg-steps-number-border-color: rgba(255, 255, 255, 0.4);
	--gf-field-pg-steps-number-bg-color: transparent;
	--gf-field-pg-steps-number-color-active: #ffffff;
	--gf-field-pg-steps-number-bg-color-active: rgba(255, 255, 255, 0.18);
	--gf-field-pg-steps-number-border-color-active: #ffffff;
	--gf-field-pg-steps-number-color-complete: #034C7F;
	--gf-field-pg-steps-number-bg-color-complete: #FCB040;
	--gf-field-pg-steps-number-border-color-complete: #FCB040;

	--gf-form-validation-bg-color: rgba(255, 255, 255, 0.95);
	--gf-form-validation-color: #c02b0a;
	--gf-form-validation-heading-color: #c02b0a;
}

/* Layer A2: --gf-ctrl-label-color-primary at higher specificity to beat GF's per-form rule (1,2,0).
   Couples to form ID 4; if form is rebuilt with a new ID, update the #gform_wrapper_4 here. */
.hero-section24-block__container-form #gform_wrapper_4.gform-theme.gform-theme--orbital {
	--gf-ctrl-label-color-primary: #ffffff;
}

/* Layer B: direct-property button overrides — must beat the Bricks-parent rule at (1,5,0). */
#brx-content .hero-section24-block__container-form .gform_wrapper .gform-footer .gform_button.button,
#brx-content .hero-section24-block__container-form .gform_wrapper .gform_page_footer .gform_next_button.button,
#brx-content .hero-section24-block__container-form .gform_wrapper .gform_page_footer .gform_previous_button.button,
#brx-content .hero-section24-block__container-form .gform_wrapper .gform_page_footer .gform_button.button {
	background-color: #FCB040;
	color: #034C7F;
	border-color: transparent;
}

#brx-content .hero-section24-block__container-form .gform_wrapper .gform-footer .gform_button.button:hover,
#brx-content .hero-section24-block__container-form .gform_wrapper .gform_page_footer .gform_next_button.button:hover,
#brx-content .hero-section24-block__container-form .gform_wrapper .gform_page_footer .gform_previous_button.button:hover,
#brx-content .hero-section24-block__container-form .gform_wrapper .gform_page_footer .gform_button.button:hover {
	background-color: #e89a2a;
	color: #034C7F;
}

#brx-content .hero-section24-block__container-form .gform_wrapper .gform-footer .gform_button.button:focus,
#brx-content .hero-section24-block__container-form .gform_wrapper .gform_page_footer .gform_next_button.button:focus,
#brx-content .hero-section24-block__container-form .gform_wrapper .gform_page_footer .gform_previous_button.button:focus,
#brx-content .hero-section24-block__container-form .gform_wrapper .gform_page_footer .gform_button.button:focus {
	background-color: #FCB040;
	color: #034C7F;
	outline: 3px solid rgba(255, 255, 255, 0.6);
	outline-offset: 2px;
}

/* Layer F: error states.
   Default Orbital `--gf-form-validation-color: #c02b0a` is clobbered by the hero block's
   inherited `color: #fff`, leaving the summary banner unreadable (white text on white bg).
   Inherited Bricks font-size also makes the banner text balloon to ~42px. Direct overrides:
   - Summary banner: dark-red text on near-white bg at sensible size
   - Inline field-error: bright readable red on dark blue (default #c02b0a fails WCAG on the hero)
   - Errored input border: keep red (Orbital default works) */
.hero-section24-block__container-form .gform_wrapper .gform_validation_errors,
.hero-section24-block__container-form .gform_wrapper .validation_error {
	color: #c02b0a;
	background-color: #ffffff;
	border: 1px solid #c02b0a;
	border-radius: 4px;
	padding: 12px 16px;
	font-size: 14px;
	line-height: 1.45;
	font-weight: 500;
}

.hero-section24-block__container-form .gform_wrapper .gform_validation_errors h2,
.hero-section24-block__container-form .gform_wrapper .gform_validation_errors .gform_submission_error,
.hero-section24-block__container-form .gform_wrapper .gform_validation_errors a {
	color: #c02b0a;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.45;
}

.hero-section24-block__container-form .gform_wrapper .gfield_validation_message,
.hero-section24-block__container-form .gform_wrapper .gfield_description.validation_message {
	color: #ff8a80;
	font-size: 13px;
	font-weight: 500;
	margin-top: 4px;
}

/* Layer C: legacy page-step indicator (.gf_page_steps / .gf_step / .gf_step_number).
   GF Page List uses this older markup which does NOT read Orbital --gf-field-pg-steps-* vars;
   direct rules are required.
   Container forced inline (flex-wrap: nowrap) and each step laid out as a column (number above
   label) so all three fit horizontally in the ~461px form column on 1440 and the ~300px
   container on 375. Labels shrink + center-align under the circle; allow text wrapping within
   the step rather than wrapping the row. */
.hero-section24-block__container-form .gf_page_steps {
	flex-wrap: nowrap !important;
	gap: 8px !important;
	align-items: flex-start;
	justify-content: space-between;
}

.hero-section24-block__container-form .gf_page_steps .gf_step {
	flex: 1 1 0;
	min-width: 0;
	flex-direction: column !important;
	align-items: center;
	text-align: center;
	gap: 6px;
}

.hero-section24-block__container-form .gf_page_steps .gf_step .gf_step_number {
	color: #ffffff;
	border: 1px solid rgba(255, 255, 255, 0.5);
	background-color: transparent;
	flex-shrink: 0;
}

.hero-section24-block__container-form .gf_page_steps .gf_step .gf_step_label {
	font-size: 12px;
	line-height: 1.3;
	letter-spacing: 0.02em;
	word-break: normal;
	hyphens: none;
}

.hero-section24-block__container-form .gf_page_steps .gf_step.gf_step_active .gf_step_number {
	background-color: rgba(255, 255, 255, 0.2);
	border-color: #ffffff;
	color: #ffffff;
}

.hero-section24-block__container-form .gf_page_steps .gf_step.gf_step_completed .gf_step_number {
	background-color: #FCB040;
	border-color: #FCB040;
	color: #034C7F;
}

/* Layer E: font-family fixes — Bricks block template sets font-family to "Futura PT Web Book"
   on labels + step labels, but that font is NOT loaded on this site (Adobe Typekit family
   was registered as futura-pt/futura-pt-bold but never fetched, and "Futura PT Web Book" isn't
   even one of the registered names). Browser silently falls back to a system sans-serif which
   doesn't match Montserrat (the real site body font) used elsewhere on the page.
   Inputs and buttons already render in correctly-loaded fonts (Montserrat / Anton); only labels,
   descriptions, required indicators, and step elements need the explicit redirect. */
.hero-section24-block__container-form .gform_wrapper,
.hero-section24-block__container-form .gform_wrapper * {
	font-family: var(--montserrat), "Helvetica Neue", Arial, system-ui, sans-serif;
}

/* …but keep the buttons in Anton (the headline font, matching the rest of the site's CTAs). */
#brx-content .hero-section24-block__container-form .gform_wrapper .gform-footer .gform_button.button,
#brx-content .hero-section24-block__container-form .gform_wrapper .gform_page_footer .gform_next_button.button,
#brx-content .hero-section24-block__container-form .gform_wrapper .gform_page_footer .gform_previous_button.button,
#brx-content .hero-section24-block__container-form .gform_wrapper .gform_page_footer .gform_button.button {
	font-family: Anton, "Helvetica Neue", Arial, sans-serif;
}

/* Layer D: focus outlines on inputs. Bricks provides a 2px orange :focus-visible outline already
   (keyboard nav). We add the same on :focus (mouse click) using the outline shorthand so the
   declaration isn't lost to an outline-width:0 default. */
.hero-section24-block__container-form .gform_wrapper input:focus,
.hero-section24-block__container-form .gform_wrapper input:focus-visible,
.hero-section24-block__container-form .gform_wrapper textarea:focus,
.hero-section24-block__container-form .gform_wrapper textarea:focus-visible,
.hero-section24-block__container-form .gform_wrapper select:focus,
.hero-section24-block__container-form .gform_wrapper select:focus-visible {
	outline: 3px solid #FCB040;
	outline-offset: 2px;
	border-color: #FCB040;
}
