/* ==========================================================================
   Web Bird Digital: site styles.

   Colours, fonts, spacing, borders, radii and shadows are set with block settings and theme.json
   (presets, element defaults and block style variations). This file only covers what those can't
   express: hover effects, pseudo-elements, styling inside third-party block markup, the sticky
   header and menus, scroll reveal, and resets for parent-theme styles.
   ========================================================================== */

:root {
	--wbd-ease: cubic-bezier(.2, .7, .2, 1);
	--wbd-header-h: 76px;
}

html {
	scroll-behavior: smooth;
	scroll-padding-top: var(--wbd-header-h);
}

html,
body {
	overflow-x: clip;
}

body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

@media (max-width: 600px) {
	html body {
		font-size: 16px;
		--wp--style--root--padding-left: 16px;
		--wp--style--root--padding-right: 16px;
		/* The parent theme caps constrained content at 100vw minus these */
		--wp--custom--content-padding: 32px;
		--wp--custom--narrow-content-padding: 32px;
	}
}

[class*="wbd-"],
[class*="wbd-"]::before,
[class*="wbd-"]::after {
	box-sizing: border-box;
}

.wbd-sr-only,
.wb-social-label {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

/* ---------------------------------------------------------------- Layout fixes for the parent theme */

/* The parent theme sets .alignfull { width: 100% }, which (with the root padding's negative margins)
   pushes full-width blocks 20px left. Let them fill the padded parent instead. */
.has-global-padding > .alignfull {
	width: auto;
}

/* Full-width sections sit flush against each other and the footer. */
.wp-block-post-content > .alignfull,
.wp-site-blocks > footer {
	margin-block-start: 0;
}

/* Quotes: remove the parent theme's blockquote styling site-wide (grey box, thick left border,
   margins, opening-quote glyph, tight centred citation), so a Quote block looks like its block
   settings. The parent's stylesheet loads in the footer, hence `:root` for the extra weight; the
   block's own border, background, spacing and shadow settings are inline styles, so they still win. */
:root blockquote {
	margin: 0;
	padding: 0;
	background: none;
	border-left: 0;
	font-style: normal;
	quotes: none;
}

:root blockquote::before,
:root blockquote::after {
	content: none;
}

:root blockquote.wp-block-quote p {
	line-height: 1.6;
}

:root blockquote.wp-block-quote cite {
	display: block;
	margin-top: 6px;
	font-family: var(--wp--preset--font-family--heading);
	font-size: .88rem;
	font-weight: 600;
	font-style: normal;
	line-height: 1.6;
	text-align: left;
	color: var(--wp--preset--color--slate);
}

:root blockquote.wp-block-quote cite strong {
	font-size: .95rem;
	text-transform: none;
	color: var(--wp--preset--color--ink);
}

/* Address block: "Shop 5, 589 Kingsway / Miranda NSW 2228" (the theme and block add commas) */
.wb-address-block .address_element {
	display: inline;
}

.wb-address-block .address_line_1,
.wb-address-block .address_line_2 {
	display: block;
}

.wb-address-block .address_line_1::after,
.wb-address-block .address_line_2::after {
	content: none;
}

.wb-address-block .address_suburb::after,
.wb-address-block .address_state::after {
	content: " ";
}

.wb-address-block .address_country {
	display: none;
}

.wb-contact-block a,
.wp-block-wb-encrypt a {
	color: inherit;
	text-decoration: none;
}

.wb-contact-block .contact_section--intl .wbd-phone-label {
	opacity: .75;
}

/* ---------------------------------------------------------------- Scroll reveal (site.js) */
html.wbd-js .wbd-reveal {
	opacity: 0;
	translate: 0 18px;
	transition: opacity .6s var(--wbd-ease), translate .6s var(--wbd-ease);
}

html.wbd-js .wbd-reveal.is-visible {
	opacity: 1;
	translate: none;
}

/* The page's first section is in view on load: fade it up with CSS rather than waiting for site.js, so the
   banner (and the page's largest paint) doesn't wait for every deferred script. */
@media (prefers-reduced-motion: no-preference) {
	html.wbd-js .wp-block-post-content > :first-child .wbd-reveal {
		opacity: 1;
		translate: none;
		animation: wbd-reveal-in .6s var(--wbd-ease) both;
	}
}

@keyframes wbd-reveal-in {
	from {
		opacity: 0;
		translate: 0 18px;
	}
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	html.wbd-js .wbd-reveal {
		opacity: 1;
		translate: none;
		transition: none;
	}
}

/* ---------------------------------------------------------------- Buttons */
.wp-block-button__link.wp-element-button {
	transition: transform .2s var(--wbd-ease), background .2s, color .2s, border-color .2s, box-shadow .2s;
}

.wp-block-button__link.wp-element-button:hover {
	transform: translateY(-1px);
}

/* Visited links keep their style's text colour (the default button's is set in theme.json) */
.wp-block-button.is-style-outline .wp-block-button__link:visited {
	color: var(--wp--preset--color--ink);
}

.wp-block-button.is-style-light .wp-block-button__link:visited {
	color: var(--wp--preset--color--deep-red-light);
}

.wp-block-button.is-style-ghost .wp-block-button__link:visited {
	color: var(--wp--preset--color--base);
}

.wp-block-button.is-style-outline .wp-block-button__link:is(:hover, :focus) {
	background: transparent;
	color: var(--wp--preset--color--ink);
	border-color: var(--wp--preset--color--ink);
}

.wp-block-button.is-style-light .wp-block-button__link:is(:hover, :focus) {
	background: var(--wp--preset--color--red-soft);
	color: var(--wp--preset--color--deep-red-light);
}

.wp-block-button.is-style-ghost .wp-block-button__link:is(:hover, :focus) {
	background: transparent;
	color: var(--wp--preset--color--base);
	border-color: var(--wp--preset--color--base);
}

/* ---------------------------------------------------------------- Query pagination (blog, archives)
   Round buttons with the current page filled, matching the projects filter. Font and gap are set in
   theme.json; the block has no settings for the shape of each page link. */
:root .wp-block-query-pagination {
	align-items: center;
	row-gap: 8px;
}

:root .wp-block-query-pagination > :is(.wp-block-query-pagination-previous, .wp-block-query-pagination-numbers, .wp-block-query-pagination-next) {
	margin: 0;
}

:root .wp-block-query-pagination-numbers {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px;
}

:root .wp-block-query-pagination :is(.page-numbers, .wp-block-query-pagination-previous, .wp-block-query-pagination-next) {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 42px;
	height: 42px;
	padding: 0 14px;
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 999px;
	background: var(--wp--preset--color--base);
	color: var(--wp--preset--color--ink);
	line-height: 1;
	text-decoration: none;
	transition: border-color .2s, background .2s, color .2s;
}

:root .wp-block-query-pagination :is(.wp-block-query-pagination-previous, .wp-block-query-pagination-next) {
	padding: 0 20px;
}

:root .wp-block-query-pagination a:is(.page-numbers, .wp-block-query-pagination-previous, .wp-block-query-pagination-next):is(:hover, :focus-visible) {
	border-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--primary);
}

:root .wp-block-query-pagination .page-numbers.current {
	border-color: transparent;
	background: var(--wp--preset--color--deep-red);
	color: var(--wp--preset--color--base);
}

:root .wp-block-query-pagination .page-numbers.dots {
	min-width: 0;
	padding: 0 4px;
	border-color: transparent;
	background: none;
}

/* ---------------------------------------------------------------- Block style variations: extras */

/* Card (group): clip images to the corners; lift on hover */
.wp-block-group.is-style-card {
	overflow: hidden;
	transition: transform .25s var(--wbd-ease), box-shadow .25s var(--wbd-ease), opacity .6s var(--wbd-ease), translate .6s var(--wbd-ease);
}

.wp-block-group.is-style-card:hover {
	transform: translateY(-3px);
	box-shadow: var(--wp--preset--shadow--md);
}

.wp-block-group.is-style-card > .wp-block-image:first-child {
	margin: 0;
	overflow: hidden;
	border-bottom: 1px solid var(--wp--preset--color--line);
}

.wp-block-group.is-style-card > .wp-block-image:first-child img {
	object-position: top;
	transition: transform .5s var(--wbd-ease);
}

.wp-block-group.is-style-card:hover > .wp-block-image:first-child img {
	transform: scale(1.03);
}

/* Glass card (group) */
.wp-block-group.is-style-glass {
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
}

/* Numbered steps (grid group): circles numbered in order, joined by a dashed line */
.wp-block-group.is-style-steps {
	position: relative;
	counter-reset: wbd-step;
}

.wp-block-group.is-style-steps::before {
	content: "";
	position: absolute;
	top: 29px;
	left: 22px;
	right: calc((100% - 2 * clamp(20px, 3vw, 40px)) / 3 - 22px);
	border-top: 2px dashed var(--wp--preset--color--line);
}

.wp-block-group.is-style-steps > * {
	position: relative;
	padding-top: 8px;
	counter-increment: wbd-step;
}

.wp-block-group.is-style-steps > *::before {
	content: counter(wbd-step);
	position: relative;
	z-index: 1;
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	margin-bottom: 18px;
	border: 2px solid var(--wp--preset--color--primary);
	border-radius: 50%;
	background: var(--wp--preset--color--base);
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 700;
	color: var(--wp--preset--color--primary);
}

@media (max-width: 1100px) {
	.wp-block-group.is-style-steps::before {
		display: none;
	}
}

/*
 * Responsive layout styles. Block layout controls only switch at 781px (Columns) or by minimum column
 * width (Grid), so these add the design's tablet breakpoint.
 */
@media (max-width: 900px) {
	/* Columns: stack on tablet */
	.wp-block-columns.is-style-stack-tablet {
		flex-wrap: wrap !important;
	}

	.wp-block-columns.is-style-stack-tablet > .wp-block-column {
		flex-basis: 100% !important;
	}

	/* Grid: 2 columns on tablet (column spans reset) */
	.wp-block-group.is-style-tablet-two.is-layout-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}

	.wp-block-group.is-style-tablet-two.is-layout-grid > * {
		grid-column: auto !important;
	}
}

@media (max-width: 600px) {
	.wp-block-group.is-style-tablet-two.is-layout-grid {
		grid-template-columns: minmax(0, 1fr) !important;
	}

	/* Buttons: full width on mobile */
	.wp-block-buttons.is-style-mobile-full > .wp-block-button {
		flex: 1 1 100%;
	}

	.wp-block-buttons.is-style-mobile-full .wp-block-button__link {
		width: 100%;
	}
}

/* Avatar (paragraph): an initial in an overlapping circle */
p.is-style-avatar {
	display: grid;
	flex: none;
	place-items: center;
	box-sizing: border-box;
	width: 54px;
	height: 54px;
	margin: 0 0 0 -12px !important;
	padding: 0;
	border: 3px solid var(--wp--preset--color--deep-red);
	border-radius: 50%;
}

p.is-style-avatar:first-child {
	margin-left: 0 !important;
}

/* Pill (paragraph): a linked pill darkens its border on hover */
p.is-style-pill {
	margin: 0;
	transition: border-color .15s;
}

p.is-style-pill:has(a):hover {
	border-color: var(--wp--preset--color--charcoal);
}

/* Ticks (list): a red tick in a soft circle for each item */
ul.is-style-checks {
	display: grid;
	gap: 10px;
	padding-left: 0;
	list-style: none;
}

ul.is-style-checks > li {
	position: relative;
	margin: 0;
	padding-left: 30px;
}

/* The circle and tick share one 18px box, centred on the first line of text. */
ul.is-style-checks > li::before,
ul.is-style-checks > li::after {
	content: "";
	position: absolute;
	top: .2em;
	top: calc((1lh - 18px) / 2);
	left: 0;
	width: 18px;
	height: 18px;
}

ul.is-style-checks > li::before {
	border-radius: 50%;
	background: var(--wp--preset--color--red-soft);
}

/* Tick drawn as an SVG mask so it stays centred in the circle at any font size. */
ul.is-style-checks > li::after {
	background: var(--wp--preset--color--primary);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='M5 9.3l2.7 2.7L13 6.5' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='M5 9.3l2.7 2.7L13 6.5' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
}

/*
 * Numbered cards (tabs): each tab is a card with a step number, joined by a dashed line; the panels sit in
 * a bordered box below. Tab labels are "<strong>Name</strong><br>Description".
 */
.wp-block-tabs.is-style-cards {
	counter-reset: wbd-tab;
}

.wp-block-tabs.is-style-cards > .wp-block-tab-list {
	position: relative;
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 10px;
	margin: 0 0 26px;
}

.wp-block-tabs.is-style-cards > .wp-block-tab-list::before {
	content: "";
	position: absolute;
	top: 50%;
	right: 6%;
	left: 6%;
	border-top: 2px dashed var(--wp--preset--color--line);
}

.wp-block-tabs.is-style-cards > .wp-block-tab-list > button {
	counter-increment: wbd-tab;
	position: relative;
	z-index: 1;
	width: auto;
	margin: 0;
	padding: 18px 20px 18px 66px;
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--preset--border-radius--md);
	background: var(--wp--preset--color--paper-2);
	color: var(--wp--preset--color--slate);
	font-family: var(--wp--preset--font-family--body);
	font-size: .84rem;
	line-height: 1.45;
	letter-spacing: normal;
	text-align: left;
	text-transform: none;
	transition: background .2s, border-color .2s, box-shadow .2s;
}

.wp-block-tabs.is-style-cards > .wp-block-tab-list > button strong {
	display: block;
	margin-bottom: 2px;
	color: var(--wp--preset--color--ink);
	font-family: var(--wp--preset--font-family--heading);
	font-size: 1rem;
	font-weight: 700;
}

.wp-block-tabs.is-style-cards > .wp-block-tab-list > button br {
	display: none;
}

.wp-block-tabs.is-style-cards > .wp-block-tab-list > button::before {
	content: counter(wbd-tab, decimal-leading-zero);
	position: absolute;
	top: 50%;
	bottom: auto;
	left: 20px;
	display: grid;
	place-items: center;
	width: 34px;
	height: 34px;
	border: 2px solid var(--wp--preset--color--line);
	border-radius: 50%;
	background: var(--wp--preset--color--base);
	color: var(--wp--preset--color--slate);
	font-family: var(--wp--preset--font-family--heading);
	font-size: .78rem;
	font-weight: 700;
	transform: translateY(-50%);
}

.wp-block-tabs.is-style-cards > .wp-block-tab-list > button:hover {
	border-color: color-mix(in srgb, var(--wp--preset--color--line), #000 12%);
}

.wp-block-tabs.is-style-cards > .wp-block-tab-list > button[aria-selected="true"] {
	border-color: var(--wp--preset--color--primary);
	background: var(--wp--preset--color--base);
	box-shadow: 0 0 0 4px var(--wp--preset--color--red-soft);
}

.wp-block-tabs.is-style-cards > .wp-block-tab-list > button[aria-selected="true"]::before {
	border-color: var(--wp--preset--color--primary);
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--base);
}

.wp-block-tabs.is-style-cards > .wp-block-tab-list > button:focus-visible {
	outline: 2px solid var(--wp--preset--color--primary);
	outline-offset: 2px;
}

.wp-block-tabs.is-style-cards > .wp-block-tab-panels {
	overflow: hidden;
}

.wp-block-tabs.is-style-cards .wp-block-tab-panel {
	padding: 0;
}

.wp-block-tabs.is-style-cards .wp-block-tab-panel:focus {
	outline: none;
}

@media (max-width: 900px) {
	.wp-block-tabs.is-style-cards > .wp-block-tab-list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.wp-block-tabs.is-style-cards > .wp-block-tab-list::before {
		display: none;
	}
}

@media (max-width: 600px) {
	.wp-block-tabs.is-style-cards > .wp-block-tab-list {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* Price list (table): light rows, small caps headings, caption below */
.wp-block-table.is-style-plans table {
	font-size: .92rem;
}

.wp-block-table.is-style-plans thead {
	border-bottom: 2px solid var(--wp--preset--color--line);
}

.wp-block-table.is-style-plans :is(th, td) {
	padding: 12px 10px;
	border: 0;
	text-align: left;
	white-space: nowrap;
}

.wp-block-table.is-style-plans th {
	color: var(--wp--preset--color--slate);
	font-family: var(--wp--preset--font-family--heading);
	font-size: .72rem;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
}

.wp-block-table.is-style-plans tbody tr {
	border-bottom: 1px solid var(--wp--preset--color--line);
}

.wp-block-table.is-style-plans td strong {
	color: var(--wp--preset--color--ink);
	font-family: var(--wp--preset--font-family--heading);
}

@media (max-width: 600px) {
	.wp-block-table.is-style-plans :is(th, td) {
		padding: 10px 8px;
	}
}

.wp-block-table.is-style-plans figcaption {
	margin-top: 10px;
	color: var(--wp--preset--color--slate);
	font-size: .85rem;
	text-align: left;
}

/* Scrolling screenshot (image): a cropped window onto a full-page screenshot; hovering scrolls down it */
.wp-block-image:is(.is-style-scroll-shot, .is-style-scroll-shot-highlight) {
	position: relative;
	margin: 0;
	overflow: hidden;
	background: var(--wp--preset--color--base);
}

.wp-block-image:is(.is-style-scroll-shot, .is-style-scroll-shot-highlight) img {
	object-position: top;
	transition: object-position 4s ease-in-out;
}

.wp-block-image:is(.is-style-scroll-shot, .is-style-scroll-shot-highlight):hover img {
	object-position: bottom;
}

.wp-block-image:is(.is-style-scroll-shot, .is-style-scroll-shot-highlight) figcaption {
	position: absolute;
	top: 12px;
	left: 12px;
	margin: 0;
	padding: 6px 12px;
	border-radius: 999px;
	background: rgba(34, 38, 41, .82);
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 700;
	font-size: .72rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: #fff;
	opacity: 1;
}

.wp-block-image.is-style-scroll-shot-highlight figcaption {
	background: var(--wp--preset--color--primary);
}

@media (prefers-reduced-motion: reduce) {
	.wp-block-image:is(.is-style-scroll-shot, .is-style-scroll-shot-highlight) img {
		transition: none;
	}
}

/* Quote mark (quote block style): a large faded opening quote in the corner */
:root blockquote.wp-block-quote.is-style-quote-mark {
	position: relative;
}

:root blockquote.wp-block-quote.is-style-quote-mark::before {
	content: "\201D";
	position: absolute;
	top: 10px;
	right: 22px;
	font-family: var(--wp--preset--font-family--heading);
	font-size: 5rem;
	line-height: 1;
	color: var(--wp--preset--color--red-soft);
	pointer-events: none;
}

:root blockquote.wp-block-quote.is-style-quote-mark > p {
	position: relative;
	margin: 0 0 20px;
}

/* FAQ card (details) */
.wp-block-details.is-style-faq {
	transition: border-color .2s, box-shadow .2s;
}

.wp-block-details.is-style-faq[open] {
	border-color: var(--wp--preset--color--primary);
	box-shadow: var(--wp--preset--shadow--ring);
}

.wp-block-details.is-style-faq summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 20px 24px;
	list-style: none;
	cursor: pointer;
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 700;
	font-size: 1.05rem;
	color: var(--wp--preset--color--ink);
}

.wp-block-details.is-style-faq summary::-webkit-details-marker {
	display: none;
}

.wp-block-details.is-style-faq summary::after {
	content: "+";
	flex: none;
	display: grid;
	place-items: center;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background: var(--wp--preset--color--red-soft);
	font-size: 1.2rem;
	color: var(--wp--preset--color--primary);
	transition: transform .2s;
}

.wp-block-details.is-style-faq[open] summary::after {
	transform: rotate(45deg);
}

.wp-block-details.is-style-faq summary:focus-visible {
	outline: 2px solid var(--wp--preset--color--primary);
	outline-offset: 2px;
	border-radius: 12px;
}

.wp-block-details.is-style-faq > :not(summary) {
	max-width: 70ch;
	margin: 0;
	padding: 0 24px 22px;
	color: var(--wp--preset--color--slate);
}

/* Lists in an FAQ answer keep their bullet indent inside the card */
.wp-block-details.is-style-faq > :is(ul, ol) {
	padding-left: calc(24px + 1.25em);
}

.wp-block-details.is-style-faq > p:has(+ :is(ul, ol)) {
	padding-bottom: 8px;
}

/* Before -> after (table, on dark backgrounds) */
.wp-block-table.is-style-before-after {
	margin: 0;
}

.wp-block-table.is-style-before-after table {
	width: 100%;
	overflow: hidden;
	border-collapse: separate;
	border-spacing: 0;
	background-color: rgba(0, 0, 0, .4);
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
	border: 1px solid rgba(255, 255, 255, .18);
	border-radius: var(--wp--preset--border-radius--md);
	font-size: .95rem;
}

.wp-block-table.is-style-before-after :is(thead, th, td) {
	border: 0;
}

.wp-block-table.is-style-before-after th {
	padding: 14px 18px;
	background: rgba(255, 255, 255, .1);
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 700;
	font-size: .74rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	text-align: left;
	color: var(--wp--preset--color--haze);
}

.wp-block-table.is-style-before-after th:last-child {
	color: var(--wp--preset--color--pink);
}

.wp-block-table.is-style-before-after td {
	padding: 13px 18px;
	border-top: 1px solid rgba(255, 255, 255, .1);
	vertical-align: top;
}

.wp-block-table.is-style-before-after td:first-child {
	width: 46%;
	color: var(--wp--preset--color--haze);
}

.wp-block-table.is-style-before-after td:last-child {
	position: relative;
	padding-left: 34px;
	font-weight: 500;
	color: #fff;
}

.wp-block-table.is-style-before-after td:last-child::before {
	content: "→";
	position: absolute;
	left: 14px;
	font-weight: 700;
	color: var(--wp--preset--color--pink);
}

@media (max-width: 600px) {
	.wp-block-table.is-style-before-after table {
		font-size: .88rem;
	}

	.wp-block-table.is-style-before-after :is(th, td) {
		padding: 11px 12px;
	}

	.wp-block-table.is-style-before-after td:last-child {
		padding-left: 28px;
	}

	.wp-block-table.is-style-before-after td:last-child::before {
		left: 10px;
	}
}

/* Stat card (framework Stat block); "glass" is the same card on a dark background */
.wp-block-wb-stats:is(.is-style-card, .is-style-glass) {
	text-align: left;
}

.wp-block-wb-stats:is(.is-style-card, .is-style-glass) .wb_statistic__container {
	display: grid;
	gap: 4px;
	padding: 0;
}

.wp-block-wb-stats:is(.is-style-card, .is-style-glass) .wb_statistic__title {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 800;
	font-size: 1.6rem;
	line-height: 1.6;
	letter-spacing: -.02em;
	color: var(--wp--preset--color--ink);
}

.wp-block-wb-stats:is(.is-style-card, .is-style-glass) .wb_statistic__title mark {
	font-size: 1rem;
	letter-spacing: .05em;
}

.wp-block-wb-stats:is(.is-style-card, .is-style-glass) .wb_statistic__body {
	margin: 0;
	font-size: .9rem;
	line-height: 1.5;
	color: var(--wp--preset--color--slate);
}

.wp-block-wb-stats.is-style-glass .wb_statistic__title {
	color: var(--wp--preset--color--base);
}

.wp-block-wb-stats.is-style-glass .wb_statistic__body {
	color: var(--wp--preset--color--mist);
}

/* Soft tile (framework Icon block) */
.wp-block-wb-icons.is-style-tile {
	--wbd-tile-bg: var(--wp--preset--color--red-soft);
	--wbd-tile-fg: var(--wp--preset--color--primary);
}

.wp-block-cover .wp-block-wb-icons.is-style-tile {
	--wbd-tile-bg: rgba(255, 255, 255, .1);
	--wbd-tile-fg: #fff;
}

.wp-block-wb-icons.is-style-tile .icon_image_center {
	display: block;
	text-align: left;
}

.wp-block-wb-icons.is-style-tile .icon_image_wrapper {
	display: grid;
	place-items: center;
	width: 46px;
	height: 46px;
	margin: 0;
	padding: 0;
	border-radius: var(--wp--preset--border-radius--md);
	background: var(--wbd-tile-bg);
	color: var(--wbd-tile-fg);
}

.wp-block-wb-icons.is-style-tile svg {
	display: block;
	width: 22px;
	height: 22px !important;
}

/* ================================================================= HEADER */
header.fixed_header {
	z-index: 100;
	background: rgba(255, 255, 255, .92);
	-webkit-backdrop-filter: saturate(150%) blur(10px);
	backdrop-filter: saturate(150%) blur(10px);
	border-bottom: 1px solid transparent;
	box-shadow: none;
	transition: border-color .2s, box-shadow .2s;
}

header.fixed_header.is-scrolled {
	border-color: var(--wp--preset--color--line);
	box-shadow: 0 4px 20px rgba(0, 23, 46, .06);
}

/* A backdrop filter makes the header the containing block for fixed children, which would trap the
   mobile menu overlay inside it; drop the blur while the overlay is open. */
html.has-modal-open header.fixed_header {
	-webkit-backdrop-filter: none;
	backdrop-filter: none;
	background: #fff;
}

/* The navigation's wrappers take focus (tabindex -1) when clicked or when the overlay opens; they aren't
   controls, so no focus ring around a whole menu. Links and buttons keep their focus styles. */
.wp-block-navigation :is(.wp-block-navigation__responsive-container, .wp-block-navigation__responsive-close, .wp-block-navigation__responsive-dialog, .wp-block-navigation__responsive-container-content, .wp-block-wb-megamenu__menu-container):focus {
	outline: none;
}

.fixed_header .wbd-header .wp-block-site-logo img {
	max-height: none;
}

/* Menu items: rounded highlight on hover (and no theme underline) */
.wbd-header .wp-block-navigation-item > a::after,
.wbd-footer .wp-block-navigation-item > a::after {
	display: none;
}

.wbd-header .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content,
.wbd-header .wp-block-wb-megamenu__toggle {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 10px 14px;
	border-radius: var(--wp--preset--border-radius--sm);
	font-family: inherit;
	font-weight: inherit;
	transition: background .15s, color .15s;
}

.wbd-header .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content:hover,
.wbd-header .wp-block-wb-megamenu__toggle:hover,
.wbd-header .wp-block-wb-megamenu__toggle[aria-expanded="true"] {
	background: var(--wp--preset--color--paper);
	color: var(--wp--preset--color--ink);
}

.wbd-header .wp-block-wb-megamenu__toggle .wp-block-wb-megamenu__toggle-icon {
	width: 14px;
	height: 14px;
	margin-left: 0;
}

.wbd-header .wp-block-wb-megamenu__toggle .wp-block-wb-megamenu__toggle-icon svg {
	transform: none;
	stroke-width: 1.6;
}

.wbd-header .wp-block-wb-megamenu__toggle[aria-expanded="true"] .wp-block-wb-megamenu__toggle-icon svg {
	transform: rotate(180deg);
}

/* Phone (Contact block) */
.wbd-header .wb-contact-block .contact-information,
.wbd-header .wb-contact-block [id^="phone_primary"] {
	position: relative;
	display: flex;
	align-items: center;
	gap: 8px;
}

.wbd-header .wb-contact-block .symbol {
	display: inline-flex;
	color: var(--wp--preset--color--primary);
}

.wbd-header .wb-contact-block .symbol svg {
	width: 18px;
	height: 18px;
}

.wbd-header .wb-contact-block a {
	white-space: nowrap;
}

/* Mega menu panel (framework Mega Menu block; content from the "solutions-menu" template part) */
.wbd-header .wp-block-wb-megamenu__menu-container {
	--wbd-mega-w: min(880px, calc(100vw - 40px));
	left: 50% !important;
	right: auto;
	width: var(--wbd-mega-w) !important;
	max-width: none;
	margin-left: calc(var(--wbd-mega-w) / -2);
	background: transparent;
	box-shadow: none;
	transition: opacity .18s var(--wbd-ease), visibility .18s;
	transition-delay: 0s;
}

.wbd-header .wp-block-wb-megamenu__menu-container .menu-container__close-button {
	top: 24px;
}

.wbd-mega {
	font-family: var(--wp--preset--font-family--body);
	font-weight: 400;
	line-height: 1.6;
	text-align: left;
	transform: translateY(6px);
	transition: transform .18s var(--wbd-ease);
}

.wp-block-wb-megamenu__toggle[aria-expanded="true"] ~ .wp-block-wb-megamenu__menu-container .wbd-mega {
	transform: none;
}

.wbd-mega p a {
	display: block;
	margin: 0 -12px;
	padding: 10px 12px;
	border-radius: var(--wp--preset--border-radius--sm);
	color: inherit;
	text-decoration: none;
}

.wbd-mega p a:hover {
	background: var(--wp--preset--color--paper);
}

.wbd-mega p a strong {
	display: block;
	font-family: var(--wp--preset--font-family--heading);
	font-size: .95rem;
	color: var(--wp--preset--color--ink);
}

.wbd-mega p a br {
	display: none;
}

.wbd-mega ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.wbd-mega ul a {
	display: block;
	padding: 6px 0;
	color: inherit;
	text-decoration: none;
}

.wbd-mega ul a:hover {
	color: var(--wp--preset--color--primary);
}

/* Mobile menu (core Navigation overlay): open the overlay at 900px and below, not just below 600px */
@media (min-width: 600px) and (max-width: 900px) {
	.wbd-header .wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex;
	}

	.wbd-header .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		display: none;
	}
}

.wbd-header .wp-block-navigation__responsive-container.is-menu-open .wbd-mega {
	border: 0;
	box-shadow: none;
	transform: none;
}

.wbd-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-wb-megamenu__menu-container {
	margin-left: 0;
	background: var(--wp--preset--color--base);
}

.wbd-header .wp-block-navigation__responsive-container-open {
	width: 44px;
	height: 44px;
	align-items: center;
	justify-content: center;
	border-radius: var(--wp--preset--border-radius--sm);
	color: var(--wp--preset--color--ink);
}

@media (max-width: 900px) {
	:root {
		--wbd-header-h: 68px;
	}

	.wbd-header > .wp-block-group {
		min-height: 68px !important;
		gap: 12px;
	}

	.wbd-header .wp-block-navigation {
		order: 3;
		flex: none;
	}

	.wbd-header > .wp-block-group > .wp-block-group {
		margin-left: auto;
	}

	/* Phone: icon only, still a tap-to-call link */
	.wbd-header .wb-contact-block .content a {
		position: absolute;
		inset: -10px;
		font-size: 0;
	}
}

@media (max-width: 600px) {
	.wbd-header .wp-block-site-logo img {
		width: 86px;
	}
}

/* ================================================================= FOOTER */
.wbd-footer .wp-block-navigation-item__content {
	padding: 0;
}

/* Social links: the network names as text links */
.wbd-footer .wb-social-block {
	padding-top: 0;
}

.wbd-footer .wb-social-block .social-media {
	display: flex;
	flex-wrap: wrap;
	gap: 18px;
	text-align: left;
}

.wbd-footer .wb-social-block .icon {
	width: auto;
	margin: 0 !important;
	font-size: inherit;
}

.wbd-footer .wb-social-block .icon a {
	pointer-events: auto;
}

.wbd-footer .wb-social-block .icon svg {
	display: none;
}

.wbd-footer .wb-social-block .wb-social-label {
	position: static !important;
	width: auto;
	height: auto;
	margin: 0;
	overflow: visible;
	clip: auto;
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 600;
	font-size: .88rem;
}

.wbd-footer .wb-social-block a:hover .wb-social-label {
	color: #fff;
}

.wbd-footer .wp-block-wb-encrypt {
	margin-top: 0;
}

@media (max-width: 900px) {
	.wbd-footer .wp-block-wbd-perch {
		right: 0 !important;
	}
}

/* ---------------------------------------------------------------- Gravity Forms: brand styling for every form.
   !important beats the per-form colour variables the form block prints inline. */
.gform_wrapper.gform-theme {
	--gf-color-primary: #cc0033 !important;
	--gf-color-primary-rgb: 204, 0, 51 !important;
	--gf-color-primary-darker: #a0002a !important;
	--gf-color-primary-contrast: #fff !important;
	--gf-color-primary-lighter: #e0335c !important;
	--gf-color-in-ctrl: #fff !important;
	--gf-color-in-ctrl-contrast: #222629 !important;
	--gf-color-in-ctrl-primary: #cc0033 !important;
	--gf-color-in-ctrl-primary-rgb: 204, 0, 51 !important;
	--gf-color-in-ctrl-primary-darker: #a0002a !important;
	--gf-color-in-ctrl-primary-lighter: #e0335c !important;
	--gf-field-pg-prog-bar-bg-color-blue: #cc0033 !important; /* multi-page progress bar ("blue" style in the form settings) */
	--gf-ctrl-border-color: #d5d2ca !important;
	--gf-ctrl-border-color-hover: #c9c6bd !important;
	--gf-ctrl-border-color-focus: #cc0033 !important;
	--gf-ctrl-outline-color-focus: #fbe9ee !important;
	--gf-ctrl-outline-width-focus: 4px !important;
	--gf-ctrl-outline-offset: 0px !important;
	--gf-ctrl-radius: 8px !important;
	--gf-ctrl-size: 50px !important;
	--gf-ctrl-padding-x: 14px !important;
	--gf-ctrl-font-size: .98rem !important;
	--gf-ctrl-label-color-primary: #444 !important;
	--gf-ctrl-label-font-family-primary: var(--wp--preset--font-family--heading) !important;
	--gf-ctrl-label-font-size-primary: .85rem !important;
	--gf-ctrl-label-font-weight-primary: 600 !important;
	--gf-ctrl-btn-bg-color-primary: #cc0033 !important;
	--gf-ctrl-btn-bg-color-hover-primary: #a0002a !important;
	--gf-ctrl-btn-radius: 12px !important;
	--gf-ctrl-btn-size: 60px !important;
	--gf-ctrl-btn-font-family: var(--wp--preset--font-family--heading) !important;
	--gf-ctrl-btn-font-size: 1rem !important;
	--gf-ctrl-btn-font-weight: 600 !important;
	--gf-ctrl-btn-shadow: 0 6px 18px rgba(204, 0, 51, .25) !important;
	--gf-field-gap-y: 16px !important;
	--gf-field-gap-x: 16px !important;
	--gf-font-family-base: "Noto Sans", "Segoe UI", system-ui, sans-serif !important;
	margin: 0;
}

.gform_wrapper.gform-theme .gform_footer .gform_button {
	text-transform: none;
	letter-spacing: normal;
	transition: transform .2s var(--wbd-ease), background .2s;
}

.gform_wrapper.gform-theme .gform_footer .gform_button:hover {
	transform: translateY(-1px);
}

.gform_wrapper.gform-theme .gfield_consent_description {
	padding: 0;
	border: 0;
	background: none;
}

.gform_wrapper.gform-theme .gfield_consent_description_text {
	padding: 14px 16px;
	border: 1px solid #d5d2ca;
	border-radius: 8px;
	background: var(--wp--preset--color--paper-2);
}

/* ---------------------------------------------------------------- Gravity Forms: homepage enquiry form extras (CSS class "wbd-form") */
.wbd-form_wrapper p.wbd-form-intro {
	margin: 0 0 6px;
	font-size: .95rem;
	color: var(--wp--preset--color--slate);
}

.wbd-form_wrapper p.wbd-form-intro strong {
	color: var(--wp--preset--color--ink);
}

/* Required marker kept for screen readers only */
.wbd-form_wrapper .gfield_required {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

.wbd-form_wrapper textarea {
	min-block-size: 125px !important;
	block-size: 125px;
	resize: vertical;
}

.wbd-form_wrapper .gform_footer {
	margin: 16px 0 0;
	padding: 0;
}

.wbd-form_wrapper .gform_footer .gform_button {
	width: 100%;
}

.gform_confirmation_wrapper .gform_confirmation_message,
.wbd-form_wrapper .gform_confirmation_message {
	padding: 18px 20px;
	border-radius: var(--wp--preset--border-radius--md);
	background: var(--wp--preset--color--paper-2);
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 600;
	color: #1b7f3b;
}

/* ---------------------------------------------------------------- Business Reviews Bundle (Google reviews widgets)
   The plugin gives its Google logos z-index 3. As flex items they then paint over the fixed AI chat
   button (z-index 1) when a "review us on" button scrolls under it. */
:root .rpi-logo::before,
:root .rpi-logo_after::after {
	z-index: auto;
}

/* ---------------------------------------------------------------- AI Chat widget (wb_ai_chat plugin): brand colours
   in place of the plugin's purple. Only colours and shadows change, so its pulse and hover animations still run. */
:root .wb-ai-chat-toggle,
:root .wb-ai-chat-send,
:root .wb-ai-chat-stop,
:root .wb-ai-chat-full-page-send,
:root .wb-ai-chat-message-user .wb-ai-chat-message-content {
	background: linear-gradient(135deg, #cc0033 0%, #86001f 100%);
}

:root .wb-ai-chat-stop {
	color: #fff;
}

:root .wb-ai-chat-toggle {
	box-shadow: 0 4px 20px rgba(204, 0, 51, .35);
}

:root .wb-ai-chat-toggle:hover {
	box-shadow: 0 6px 25px rgba(204, 0, 51, .5);
}

:root .wb-ai-chat-send:hover:not(:disabled),
:root .wb-ai-chat-stop:hover:not(:disabled),
:root .wb-ai-chat-full-page-send:hover:not(:disabled) {
	box-shadow: 0 6px 18px rgba(204, 0, 51, .25);
}

:root .wb-ai-chat-welcome-prompt-bubble {
	background: #cc0033;
}

:root .wb-ai-chat-welcome-prompt-bubble::after {
	border-top-color: #cc0033;
}

:root .wb-ai-chat-toggle:focus,
:root .wb-ai-chat-minimize:focus,
:root .wb-ai-chat-close:focus,
:root .wb-ai-chat-send:focus,
:root .wb-ai-chat-input:focus,
:root .wb-ai-chat-welcome-prompt-dismiss:focus {
	outline-color: #a0002a;
}

/* Inputs: red border and soft red ring, as on the Gravity Forms fields */
:root .wb-ai-chat-input:focus,
:root .wb-ai-chat-full-page-input:focus {
	border-color: #cc0033;
	box-shadow: 0 0 0 3px #fbe9ee;
}

:root .wb-ai-chat-list-item::marker {
	color: #cc0033;
}

:root .wb-ai-chat-link,
:root .wb-ai-chat-citation-link {
	color: #a0002a;
	background: rgba(204, 0, 51, .08);
}

:root .wb-ai-chat-link:hover,
:root .wb-ai-chat-citation-link:hover {
	background: rgba(204, 0, 51, .15);
}

:root .wb-ai-chat-link:active,
:root .wb-ai-chat-citation-link:active {
	background: rgba(204, 0, 51, .22);
}

:root .wb-ai-chat-ui-continue {
	background: #cc0033;
}

:root .wb-ai-chat-ui-continue:hover:not(:disabled) {
	background: #a0002a;
}