/**
 * Butler — block styles, context colors, header, responsive.
 * Tokens come from theme.json (--wp--preset--*). Loaded on the front end and in the editor.
 */

/* ---------------------------------------------------------------------------
 * Context tokens
 * Components read these, so the same block looks right on light or navy.
 * ------------------------------------------------------------------------- */
:root,
.editor-styles-wrapper,
.has-off-white-background-color,
.has-mist-background-color,
.has-white-background-color,
.wp-block-group.is-style-card {
	--butler-accent: var(--wp--preset--color--aqua-deep);
	--butler-link: var(--wp--preset--color--aqua-deep);
	--butler-link-hover: var(--wp--preset--color--navy-deep);
	--butler-muted: var(--wp--preset--color--body);
	--butler-label: var(--wp--preset--color--ink-soft);
	--butler-line: var(--wp--preset--color--line);
	--butler-line-soft: var(--wp--preset--color--line-soft);
	--butler-outline: var(--wp--preset--color--navy);
	--butler-highlight-bg: transparent;
	--butler-input-bg: var(--wp--preset--color--white);
	--butler-input-border: var(--wp--preset--color--line);
}

.has-navy-background-color,
.has-navy-deep-background-color,
.has-navy-card-background-color,
.wp-block-group.is-style-card-navy {
	--butler-accent: var(--wp--preset--color--aqua-light);
	--butler-link: var(--wp--preset--color--aqua-light);
	--butler-link-hover: var(--wp--preset--color--on-navy);
	--butler-muted: var(--wp--preset--color--on-navy-muted);
	--butler-label: var(--wp--preset--color--on-navy-soft);
	--butler-line: var(--wp--preset--color--navy-line);
	--butler-line-soft: var(--wp--preset--color--navy-line);
	--butler-outline: #2c4767;
	--butler-highlight-bg: rgba(47, 212, 196, 0.08);
	--butler-input-bg: var(--wp--preset--color--navy);
	--butler-input-border: #2c4767;
}

.has-aqua-background-color {
	--butler-accent: var(--wp--preset--color--navy);
	--butler-link: var(--wp--preset--color--navy);
	--butler-link-hover: var(--wp--preset--color--navy-deep);
	--butler-outline: var(--wp--preset--color--navy);
}

/* ---------------------------------------------------------------------------
 * Base
 * ------------------------------------------------------------------------- */
html {
	scroll-behavior: smooth;
}

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

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

/* Anchored sections land below the sticky header. */
[id] {
	scroll-margin-top: calc(var(--wp--custom--header--height) + 16px);
}

:where(a, button, input, select, textarea, .wp-element-button):focus-visible {
	outline: 2px solid var(--wp--preset--color--aqua);
	outline-offset: 2px;
}

/* Header / main / footer sit flush; full-width sections stack with no gaps. */
body .wp-site-blocks > * {
	margin-block: 0;
}

/* Footer stays at the bottom on short pages. */
body:not(.editor-styles-wrapper) .wp-site-blocks {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
	min-height: 100dvh;
}

body:not(.editor-styles-wrapper) .wp-site-blocks > main {
	flex: 1 0 auto;
	display: flex;
	flex-direction: column;
}

/* A single full-width section (e.g. the 404) fills the space down to the footer. */
body:not(.editor-styles-wrapper) .wp-site-blocks > main > .alignfull:only-child {
	flex: 1 0 auto;
}

.admin-bar .wp-site-blocks {
	min-height: calc(100dvh - var(--wp-admin--admin-bar--height, 32px));
}

body .wp-block-post-content > .alignfull,
body .wp-site-blocks main > .alignfull {
	margin-block: 0;
}

/* Mist sections get hairlines top and bottom, as in the design. */
.alignfull.has-mist-background-color {
	border-top: 1px solid var(--wp--preset--color--line);
	border-bottom: 1px solid var(--wp--preset--color--line);
}

.alignfull.has-navy-deep-background-color + .alignfull.has-navy-deep-background-color,
.alignfull.has-navy-background-color + .alignfull.has-navy-deep-background-color {
	border-top: 1px solid #1c3350;
}

/* ---------------------------------------------------------------------------
 * Header (sticky, translucent)
 * ------------------------------------------------------------------------- */
.wp-site-blocks > header.wp-block-template-part {
	position: sticky;
	top: 0;
	z-index: 50;
}

.admin-bar .wp-site-blocks > header.wp-block-template-part {
	top: var(--wp-admin--admin-bar--height, 32px);
}

@media (max-width: 600px) {
	.admin-bar .wp-site-blocks > header.wp-block-template-part {
		top: 0;
	}
}

/* The frosted background lives on a pseudo-element. A backdrop-filter on
 * .site-header itself would trap the position:fixed mobile menu inside the
 * header bar. */
.site-header {
	position: relative;
	isolation: isolate;
	border-bottom: 1px solid #e0e5e2;
	min-height: var(--wp--custom--header--height);
}

.site-header::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: rgba(244, 246, 244, 0.92);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
}

.site-header .butler-nav-desktop .wp-block-navigation-item__content:hover {
	color: var(--wp--preset--color--aqua-deep);
}

/* Desktop nav: the shared Main menu, minus the phone-only extras. */
.site-header .butler-nav-desktop .is-secondary,
.site-header .butler-nav-desktop .butler-nav-mobile__actions {
	display: none !important;
}

.site-header .butler-nav-desktop .wp-block-navigation-submenu__toggle {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 0;
	background: none;
	border: 0;
	color: inherit;
	font: inherit;
	cursor: pointer;
}

.site-header .butler-nav-desktop .wp-block-navigation__submenu-icon {
	width: 10px;
	height: 10px;
	margin-left: 2px;
	transition: transform 0.2s ease;
}

.site-header .butler-nav-desktop .wp-block-navigation-submenu__toggle[aria-expanded="true"] + .wp-block-navigation__submenu-icon {
	transform: rotate(180deg);
}

.site-header .butler-nav-desktop .wp-block-navigation-item.has-child:hover > .wp-block-navigation-submenu__toggle,
.site-header .butler-nav-desktop .wp-block-navigation-submenu__toggle[aria-expanded="true"] {
	color: var(--wp--preset--color--aqua-deep);
}

/* Dropdown panel. */
.site-header .butler-nav-desktop .wp-block-navigation__submenu-container {
	min-width: 230px !important;
	margin-top: 14px !important;
	padding: 8px !important;
	border: 1px solid var(--wp--preset--color--line) !important;
	border-radius: var(--wp--custom--radius--sm);
	background: var(--wp--preset--color--white) !important;
	box-shadow: 0 12px 32px rgba(15, 36, 64, 0.12);
}

/* Bridge the gap so the panel doesn't close when the pointer moves down to it. */
.site-header .butler-nav-desktop .wp-block-navigation__submenu-container::before {
	content: "";
	position: absolute;
	top: -15px;
	left: 0;
	right: 0;
	height: 15px;
}

.site-header .butler-nav-desktop .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	display: block;
	padding: 9px 12px !important;
	border-radius: 6px;
	color: var(--wp--preset--color--navy);
	font-size: 14px;
	white-space: nowrap;
}

.site-header .butler-nav-desktop .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover,
.site-header .butler-nav-desktop .wp-block-navigation__submenu-container .wp-block-navigation-item__content:focus-visible {
	background: var(--wp--preset--color--mist);
	color: var(--wp--preset--color--aqua-deep);
}

@media (prefers-reduced-motion: reduce) {
	.site-header .butler-nav-desktop .wp-block-navigation__submenu-icon {
		transition: none;
	}
}

/* ---------------------------------------------------------------------------
 * Mega Menu Item (blocks/mega-menu)
 * Desktop: a full-width panel under the header. Phones: an expandable
 * section inside the mobile menu.
 * ------------------------------------------------------------------------- */
.butler-mega__panel {
	display: none;
}

/* The panel is positioned against the header, not the menu item. */
.site-header .butler-nav-desktop,
.site-header .butler-nav-desktop .wp-block-navigation__container,
.site-header .butler-nav-desktop .butler-mega-item {
	position: static !important;
}

.site-header .butler-nav-desktop .butler-mega__toggle::after {
	content: "";
	width: 12px;
	height: 12px;
	background-color: currentColor;
	-webkit-mask: url("../icons/chevron-down.svg") center / contain no-repeat;
	mask: url("../icons/chevron-down.svg") center / contain no-repeat;
	transition: transform 0.2s ease;
}

.site-header .butler-nav-desktop .butler-mega-item.is-mega-open > .butler-mega__toggle {
	color: var(--wp--preset--color--aqua-deep);
}

.site-header .butler-nav-desktop .butler-mega-item.is-mega-open > .butler-mega__toggle::after {
	transform: rotate(180deg);
}

.site-header .butler-nav-desktop .butler-mega__panel {
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	z-index: 40;
	border-top: 1px solid var(--wp--preset--color--line);
	border-bottom: 1px solid var(--wp--preset--color--line);
	background: var(--wp--preset--color--white);
	box-shadow: 0 22px 44px rgba(15, 36, 64, 0.14);
	color: var(--wp--preset--color--navy);
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 400;
	line-height: 1.5;
	text-align: left;
	cursor: default;
}

.site-header .butler-nav-desktop .butler-mega-item.is-mega-open > .butler-mega__panel {
	display: block;
	animation: butler-mega-in 0.18s ease-out;
}

@keyframes butler-mega-in {
	from {
		opacity: 0;
		transform: translateY(-6px);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

.butler-mega__inner {
	max-width: var(--wp--style--global--wide-size);
	margin-inline: auto;
	padding: 34px clamp(20px, 4vw, 40px) 38px;
}

.butler-mega__panel .is-style-eyebrow {
	margin: 0 0 18px;
}

.butler-mega__links {
	margin: 0;
}

.butler-mega__link p {
	margin: 0;
}

.butler-mega__link .butler-mega__desc {
	padding-left: 34px;
	line-height: 1.45;
}

.butler-mega__area {
	margin: 0 0 12px;
	font-weight: 600;
}

.butler-mega__area a {
	color: var(--wp--preset--color--navy);
	text-decoration: none;
}

.butler-mega__area a:hover,
.butler-mega__area a:focus-visible {
	color: var(--wp--preset--color--aqua-deep);
}

.butler-mega__promo h3 {
	margin: 0;
	color: var(--wp--preset--color--white);
}

.butler-mega__promo p {
	margin: 0;
}

/* Editor: show the mega item like a menu link. */
.butler-mega-item-editor {
	display: inline-flex;
	align-items: center;
	gap: 2px;
}

/* Phones: an expandable section in the mobile menu. */
.butler-nav-mobile .is-menu-open .butler-mega-item.is-butler-open > .butler-mega__panel {
	display: block;
	margin: 0 0 8px;
	padding: 2px 0 2px 14px;
	border-left: 1px solid var(--wp--preset--color--navy-line);
}

.butler-nav-mobile .is-menu-open .butler-mega__inner {
	max-width: none;
	padding: 0;
}

.butler-nav-mobile .is-menu-open .butler-mega__columns,
.butler-nav-mobile .is-menu-open .butler-mega__links {
	display: block !important;
	margin: 0 !important;
}

.butler-nav-mobile .is-menu-open .butler-mega__columns > .wp-block-column {
	flex-basis: 100% !important;
}

.butler-nav-mobile .is-menu-open .butler-mega__heading,
.butler-nav-mobile .is-menu-open .butler-mega__desc,
.butler-nav-mobile .is-menu-open .butler-mega__promo-col {
	display: none !important;
}

.butler-nav-mobile .is-menu-open .butler-mega__panel .is-style-eyebrow {
	margin: 14px 0 4px;
}

.butler-nav-mobile .is-menu-open .butler-mega__panel p[class*="is-style-icon-"],
.butler-nav-mobile .is-menu-open .butler-mega__area {
	margin: 0;
	padding: 8px 0;
	color: var(--wp--preset--color--on-navy-soft);
	font-size: 16px;
	font-weight: 500;
}

.butler-nav-mobile .is-menu-open .butler-mega__panel p[class*="is-style-icon-"]::before {
	flex-basis: 18px;
	width: 18px;
	height: 18px;
}

.butler-nav-mobile .is-menu-open .butler-mega__area a {
	color: inherit;
}

@media (prefers-reduced-motion: reduce) {
	.site-header .butler-nav-desktop .butler-mega-item.is-mega-open > .butler-mega__panel {
		animation: none;
	}

	.site-header .butler-nav-desktop .butler-mega__toggle::after {
		transition: none;
	}
}

/* Desktop links above 782px, the mobile menu below. */
.site-header .wp-block-navigation.butler-nav-mobile {
	display: none;
}

@media (max-width: 781px) {
	.site-header .wp-block-navigation.butler-nav-desktop {
		display: none;
	}

	.site-header .wp-block-navigation.butler-nav-mobile {
		display: flex;
	}
}

/* ---------------------------------------------------------------------------
 * Mobile menu (full-screen navy overlay)
 * ------------------------------------------------------------------------- */
.butler-nav-mobile .wp-block-navigation__responsive-container-open {
	color: var(--wp--preset--color--navy);
}

.butler-nav-mobile .wp-block-navigation__responsive-container.is-menu-open {
	padding: 0;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
}

.butler-nav-mobile .is-menu-open .wp-block-navigation__responsive-close {
	max-width: none;
}

.butler-nav-mobile .is-menu-open .wp-block-navigation__responsive-dialog {
	position: relative;
	min-height: 100%;
	padding: 20px 24px 32px;
}

/* Logo mark + name, top left. */
.butler-nav-mobile .is-menu-open .wp-block-navigation__responsive-dialog::before {
	content: "";
	position: absolute;
	top: 26px;
	left: 24px;
	width: 32px;
	height: 27px;
	background-color: var(--wp--preset--color--white);
	-webkit-mask: url("../images/butler-icon.svg") center / contain no-repeat;
	mask: url("../images/butler-icon.svg") center / contain no-repeat;
}

.butler-nav-mobile .is-menu-open .wp-block-navigation__responsive-dialog::after {
	content: "BUTLER";
	position: absolute;
	top: 29px;
	left: 66px;
	color: var(--wp--preset--color--white);
	font-size: 17px;
	font-weight: 800;
	letter-spacing: 0.04em;
	line-height: 1.2;
}

.butler-nav-mobile .is-menu-open .wp-block-navigation__responsive-container-close {
	top: 18px;
	right: 14px;
	color: var(--wp--preset--color--on-navy-soft);
}

.butler-nav-mobile .is-menu-open .wp-block-navigation__responsive-container-close svg {
	width: 28px;
	height: 28px;
}

.butler-nav-mobile .is-menu-open .wp-block-navigation__responsive-container-content {
	padding-top: 76px !important;
	align-items: stretch !important;
}

.butler-nav-mobile .is-menu-open .wp-block-navigation__responsive-container-content > .wp-block-navigation__container {
	display: grid !important;
	grid-template-columns: 1fr 1fr;
	column-gap: 24px;
	row-gap: 0 !important;
	width: 100%;
	align-items: start;
}

.butler-nav-mobile .is-menu-open .wp-block-navigation__container > * {
	grid-column: 1 / -1;
	width: 100%;
	margin: 0;
}

/* Main links. */
.butler-nav-mobile .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	padding: 12px 0;
	color: var(--wp--preset--color--white);
	font-size: 19px;
	font-weight: 600;
	line-height: 1.3;
	text-align: left;
}

/* Expandable sections (Services, Service areas). */
.butler-nav-mobile .is-menu-open .wp-block-navigation__submenu-icon {
	display: none !important;
}

.butler-nav-mobile .is-menu-open .wp-block-navigation-submenu__toggle {
	background: none;
	border: 0;
	cursor: pointer;
}

.butler-nav-mobile .is-menu-open .wp-block-navigation-submenu__toggle::after {
	content: "";
	flex: 0 0 20px;
	width: 20px;
	height: 20px;
	background-color: var(--wp--preset--color--slate-light);
	-webkit-mask: url("../icons/chevron-down.svg") center / contain no-repeat;
	mask: url("../icons/chevron-down.svg") center / contain no-repeat;
	transition: transform 0.2s ease;
}

.butler-nav-mobile .is-menu-open .has-child.is-butler-open > .wp-block-navigation-submenu__toggle::after {
	transform: rotate(180deg);
	background-color: var(--wp--preset--color--aqua);
}

.butler-nav-mobile .is-menu-open .has-child > .wp-block-navigation__submenu-container {
	display: none !important;
}

.butler-nav-mobile .is-menu-open .has-child.is-butler-open > .wp-block-navigation__submenu-container {
	display: flex !important;
	flex-direction: column;
	gap: 0;
	margin: 0 0 8px !important;
	padding: 0 0 0 14px !important;
	border-left: 1px solid var(--wp--preset--color--navy-line);
}

.butler-nav-mobile .is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	padding: 9px 0 !important;
	color: var(--wp--preset--color--on-navy-soft);
	font-size: 16px;
	font-weight: 500;
}

/* Divider, then the smaller links in two columns. */
.butler-nav-mobile .is-menu-open .wp-block-navigation__container > .is-secondary {
	grid-column: auto;
}

.butler-nav-mobile .is-menu-open .wp-block-navigation__container > .is-secondary > .wp-block-navigation-item__content {
	padding: 8px 0;
	color: var(--wp--preset--color--on-navy-soft);
	font-size: 16px;
	font-weight: 500;
}

.butler-nav-mobile .is-menu-open .wp-block-navigation__container > .is-secondary:nth-child(1 of .is-secondary),
.butler-nav-mobile .is-menu-open .wp-block-navigation__container > .is-secondary:nth-child(2 of .is-secondary) {
	margin-top: 20px;
	padding-top: 20px;
	border-top: 1px solid var(--wp--preset--color--navy-line);
}

.butler-nav-mobile .is-menu-open .wp-block-navigation__container > .is-secondary:nth-child(1 of .is-secondary) {
	margin-right: -24px;
	padding-right: 24px;
}

/* Call + quote buttons, full width, below the links. */
.butler-nav-mobile .is-menu-open .wp-block-navigation__responsive-container-content > .wp-block-navigation__container {
	order: 1;
}

.butler-nav-mobile .is-menu-open .butler-nav-mobile__actions {
	order: 2;
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: stretch !important;
	gap: 12px;
	margin-top: 28px !important;
}

.butler-nav-mobile .is-menu-open .butler-nav-mobile__actions .wp-block-button,
.butler-nav-mobile .is-menu-open .butler-nav-mobile__actions .wp-block-button__link {
	width: 100%;
	text-align: center;
}

.butler-nav-mobile .is-menu-open .butler-nav-mobile__actions .is-style-outline > .wp-block-button__link {
	border-color: var(--wp--preset--color--navy-line);
	color: var(--wp--preset--color--white);
}

@media (prefers-reduced-motion: reduce) {
	.butler-nav-mobile .is-menu-open .wp-block-navigation-submenu__toggle::after {
		transition: none;
	}
}

.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-close {
	min-width: 44px;
	min-height: 44px;
	justify-content: center;
	align-items: center;
}

/* ---------------------------------------------------------------------------
 * Logo block
 * ------------------------------------------------------------------------- */
.butler-logo {
	--butler-logo-width: 34px;
	line-height: 1;
}

.butler-logo__link {
	display: inline-flex;
	align-items: center;
	gap: calc(var(--butler-logo-width) * 0.35);
	color: inherit !important;
	text-decoration: none;
}

.butler-logo__icon {
	display: block;
	width: var(--butler-logo-width);
	flex-shrink: 0;
}

.butler-logo__svg {
	display: block;
	width: 100%;
	height: auto;
}

.butler-logo__wordmark {
	display: flex;
	flex-direction: column;
	line-height: 1;
}

.butler-logo__name {
	font-weight: 800;
	font-size: calc(var(--butler-logo-width) * 0.47);
	letter-spacing: 0.02em;
}

.butler-logo__tag {
	font-size: calc(var(--butler-logo-width) * 0.265);
	letter-spacing: 0.28em;
	color: var(--wp--preset--color--slate);
	margin-top: 3px;
	white-space: nowrap;
}

.butler-logo.aligncenter {
	text-align: center;
}

.butler-logo.aligncenter .butler-logo__link {
	justify-content: center;
}

@media (max-width: 420px) {
	.site-header .butler-logo.is-variant-horizontal .butler-logo__wordmark {
		display: none;
	}
}

/* Phones: CTA button, then hamburger on the far right; tighter so it all fits at 360–390px. */
@media (max-width: 600px) {
	.site-header .wp-block-navigation.butler-nav-mobile {
		order: 2;
	}

	.site-header .alignwide > .wp-block-group {
		gap: 6px !important;
	}
}

@media (max-width: 480px) {
	.site-header .wp-block-button.is-small > .wp-block-button__link {
		font-size: 12.5px;
		padding: 10px 14px;
	}
}

/* ---------------------------------------------------------------------------
 * Paragraph styles
 * ------------------------------------------------------------------------- */
p.is-style-eyebrow {
	font-size: var(--wp--preset--font-size--label);
	font-weight: 600;
	letter-spacing: 0.24em;
	text-transform: uppercase;
	line-height: 1.4;
	color: var(--butler-accent);
}

p.is-style-eyebrow + :is(h1, h2, h3) {
	margin-block-start: 14px;
}

p.is-style-eyebrow-pill {
	display: flex;
	align-items: center;
	gap: 9px;
	width: fit-content;
	padding: 7px 15px;
	border: 1px solid rgba(47, 212, 196, 0.35);
	border-radius: var(--wp--custom--radius--pill);
	background: rgba(47, 212, 196, 0.12);
	color: var(--butler-accent);
	font-size: 12.5px;
	font-weight: 600;
	letter-spacing: 0.04em;
	line-height: 1.35;
}

p.is-style-eyebrow-pill::before {
	content: "";
	flex-shrink: 0;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--wp--preset--color--aqua);
}

p.is-style-badge {
	display: inline-block;
	width: fit-content;
	padding: 5px 12px;
	border-radius: var(--wp--custom--radius--pill);
	background: var(--wp--preset--color--aqua);
	color: var(--wp--preset--color--navy);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	line-height: 1.3;
}

p.is-style-label {
	font-size: var(--wp--preset--font-size--label);
	letter-spacing: 0.18em;
	text-transform: uppercase;
	line-height: 1.4;
	color: var(--wp--preset--color--slate);
}

p.is-style-tagline {
	font-family: var(--wp--preset--font-family--cormorant);
	font-style: italic;
	font-weight: 500;
	font-size: var(--wp--preset--font-size--tagline);
	line-height: 1.4;
	color: var(--butler-accent);
}

p.is-style-step-number {
	font-size: 22px;
	font-weight: 800;
	line-height: 1;
	color: var(--wp--preset--color--aqua);
}

/* ---------------------------------------------------------------------------
 * Group styles: cards
 * ------------------------------------------------------------------------- */
.wp-block-group.is-style-card,
.wp-block-group.is-style-card-navy {
	border-radius: var(--wp--custom--radius--md);
	padding: clamp(24px, 3vw, 34px) clamp(22px, 3vw, 36px);
}

.wp-block-group.is-style-card {
	background-color: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--line);
	color: var(--wp--preset--color--navy);
}

.wp-block-group.is-style-card-navy {
	background-color: var(--wp--preset--color--navy-card);
	border: 1px solid var(--wp--preset--color--navy-line);
	color: var(--wp--preset--color--on-navy);
}

/* Featured card (e.g. navy bg on a card-navy) drops the border. */
.wp-block-group.is-style-card-navy.has-navy-background-color {
	border-color: transparent;
}

:is(.is-style-card, .is-style-card-navy) > :first-child {
	margin-block-start: 0;
}

:is(.is-style-card, .is-style-card-navy) > :is(h3, h4) + p {
	margin-block-start: 8px;
}

/* ---------------------------------------------------------------------------
 * Group styles: price rows (label left, value right, hairline divider)
 * Tip: italic text inside a row renders as an accent note ("· best value").
 * ------------------------------------------------------------------------- */
.wp-block-group.is-style-price-row,
.wp-block-group.is-style-price-row-highlight {
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: baseline;
	gap: 16px;
	margin-block: 0;
	padding: 11px 0;
	border-bottom: 1px solid var(--butler-line-soft);
	font-size: var(--wp--preset--font-size--small);
	line-height: 1.45;
}

.wp-block-group.is-style-price-row:last-child,
.wp-block-group.is-style-price-row-highlight:last-child {
	border-bottom: 0;
}

.wp-block-group:is(.is-style-price-row, .is-style-price-row-highlight) > * {
	margin: 0;
}

.wp-block-group.is-style-price-row > :first-child {
	color: var(--butler-label);
}

.wp-block-group:is(.is-style-price-row, .is-style-price-row-highlight) > :last-child:not(:first-child) {
	flex-shrink: 0;
	font-weight: 700;
	text-align: right;
	white-space: nowrap;
}

.wp-block-group:is(.is-style-price-row, .is-style-price-row-highlight) em {
	font-style: normal;
	font-weight: 500;
	font-size: 0.87em;
	color: var(--butler-accent);
}

.wp-block-group:is(.is-style-price-row, .is-style-price-row-highlight) > :last-child em {
	font-size: inherit;
	font-weight: 700;
}

.wp-block-group.is-style-price-row-highlight > :first-child {
	font-weight: 600;
}

.wp-block-group.is-style-price-row-highlight > :last-child:not(:first-child) {
	color: var(--butler-accent);
}

:is(.has-navy-background-color, .has-navy-card-background-color, .is-style-card-navy) .wp-block-group.is-style-price-row-highlight {
	margin-inline: -12px;
	padding-inline: 12px;
	border-radius: 4px;
	background: var(--butler-highlight-bg);
	font-size: var(--wp--preset--font-size--medium);
}

/* ---------------------------------------------------------------------------
 * Group style: hairline grid (cells separated by 1px lines)
 * ------------------------------------------------------------------------- */
.wp-block-group.is-style-hairline-grid {
	gap: 1px !important;
	background-color: var(--butler-line);
	border: 1px solid var(--butler-line);
	border-radius: var(--wp--custom--radius--md);
	overflow: hidden;
}

.wp-block-group.is-style-hairline-grid > * {
	margin: 0 !important;
	background-color: var(--wp--preset--color--white);
	padding: clamp(28px, 3vw, 38px) clamp(24px, 3vw, 34px);
}

.wp-block-group.is-style-hairline-grid > * > :first-child {
	margin-block-start: 0;
}

.wp-block-group.is-style-hairline-grid p.is-style-step-number + * {
	margin-block-start: 14px;
}

.wp-block-group.is-style-hairline-grid h4 + p {
	margin-block-start: 8px;
}

/* ---------------------------------------------------------------------------
 * Buttons
 * Default = aqua pill (theme.json). Add class "is-small" / "is-large" in
 * Advanced → Additional CSS class(es) for the header / hero sizes.
 * ------------------------------------------------------------------------- */
.wp-block-button.is-small > .wp-block-button__link {
	font-size: 13.5px;
	letter-spacing: 0.01em;
	padding: 11px 20px;
}

.wp-block-button.is-large > .wp-block-button__link {
	font-size: 16px;
	padding: 16px 32px;
}

.wp-block-button > .wp-block-button__link {
	min-height: 44px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	white-space: nowrap;
}

.wp-block-button.is-style-outline > .wp-block-button__link {
	background: transparent;
	color: inherit;
	border: 1px solid var(--butler-outline);
	font-weight: 600;
}

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

.wp-block-button.is-style-navy > .wp-block-button__link {
	background: var(--wp--preset--color--navy);
	color: var(--wp--preset--color--on-navy);
}

.wp-block-button.is-style-navy > .wp-block-button__link:hover,
.wp-block-button.is-style-navy > .wp-block-button__link:focus-visible {
	background: var(--wp--preset--color--navy-card);
	color: var(--wp--preset--color--on-navy);
}

.wp-block-button.is-style-text-link > .wp-block-button__link {
	background: transparent;
	color: inherit;
	padding: 0 0 2px;
	min-height: 0;
	border-radius: 0;
	border-bottom: 1px solid currentColor;
	border-bottom-color: color-mix(in srgb, currentColor 35%, transparent);
	font-weight: 600;
}

.wp-block-button.is-style-text-link > .wp-block-button__link:hover,
.wp-block-button.is-style-text-link > .wp-block-button__link:focus-visible {
	background: transparent;
	color: var(--butler-accent);
	border-bottom-color: currentColor;
}

/* ---------------------------------------------------------------------------
 * Images
 * ------------------------------------------------------------------------- */
.wp-block-image img[style*="aspect-ratio"] {
	width: 100%;
}

.wp-block-image.is-style-framed img {
	border: 1px solid var(--butler-line);
	border-radius: var(--wp--custom--radius--sm);
}

.has-navy-background-color .wp-block-image.is-style-framed img {
	border-color: var(--wp--preset--color--navy-line);
}

/* ---------------------------------------------------------------------------
 * Separator
 * ------------------------------------------------------------------------- */
.wp-block-separator:not(.has-background) {
	border: 0;
	border-top: 1px solid var(--butler-line);
	opacity: 1;
}

.has-navy-deep-background-color .wp-block-separator:not(.has-background) {
	border-top-color: #1c3350;
}

/* Footer legal links stay muted. */
.has-fine-print-color a:where(:not(.wp-element-button)) {
	color: var(--wp--preset--color--slate);
	text-decoration: underline;
}

/* ---------------------------------------------------------------------------
 * Long-form content (text pages, posts)
 * Headings typed straight into the content step down from the 42px section
 * size so the page title stays dominant. Sections (headings inside groups)
 * are untouched, and an explicit font size still wins.
 * ------------------------------------------------------------------------- */
.wp-block-post-content > h2.wp-block-heading:not([class*="-font-size"]) {
	font-size: var(--wp--preset--font-size--statement);
	margin-block-start: 1.6em;
}

.wp-block-post-content > h3.wp-block-heading:not([class*="-font-size"]) {
	margin-block-start: 1.5em;
}

.wp-block-post-content > :is(h2, h3, h4) + * {
	margin-block-start: 0.6em;
}

/* Post titles in lists read as headings, not links. */
.wp-block-post-title a {
	color: inherit;
}

.wp-block-post-title a:hover,
.wp-block-post-title a:focus-visible {
	color: var(--butler-accent);
}

.wp-block-post-navigation-link a {
	color: inherit;
	font-weight: 600;
}

.wp-block-post-navigation-link a:hover {
	color: var(--butler-accent);
}

/* ---------------------------------------------------------------------------
 * Embedded forms
 * Drop the embed (Custom HTML block) inside a "Card (navy)" group.
 * These rules only reach forms injected into the page; iframes style themselves.
 * ------------------------------------------------------------------------- */
:where(.wp-block-group, .wp-block-html) :where(input:not([type="checkbox"], [type="radio"], [type="submit"], [type="button"], [type="hidden"]), select, textarea) {
	width: 100%;
	padding: 12px 14px;
	border: 1px solid var(--butler-input-border);
	border-radius: var(--wp--custom--radius--sm);
	background: var(--butler-input-bg);
	color: inherit;
	font: inherit;
	font-size: var(--wp--preset--font-size--small);
	line-height: 1.4;
}

:where(.wp-block-group, .wp-block-html) :where(input, select, textarea)::placeholder {
	color: var(--wp--preset--color--slate);
	opacity: 1;
}

:where(.wp-block-group, .wp-block-html) :where(input, select, textarea):focus {
	border-color: var(--wp--preset--color--aqua);
	outline: none;
}

:where(.wp-block-group, .wp-block-html) :where(button[type="submit"], input[type="submit"]) {
	padding: 14px 34px;
	border: 0;
	border-radius: var(--wp--custom--radius--pill);
	background: var(--wp--preset--color--aqua);
	color: var(--wp--preset--color--navy);
	font: inherit;
	font-size: 15px;
	font-weight: 700;
	cursor: pointer;
}

:where(.wp-block-group, .wp-block-html) :where(button[type="submit"], input[type="submit"]):hover {
	background: #28bdb0;
}

.wp-block-html iframe {
	display: block;
	width: 100%;
	border: 0;
}

/* Embeds with a fixed width attribute (e.g. Google Forms at 640px) must never
 * push the page wider than the phone screen. */
main iframe,
.wp-site-blocks iframe {
	max-width: 100%;
}

/* ---------------------------------------------------------------------------
 * Icon titles (Lucide icons, ISC — assets/icons/LICENSE.txt)
 * A Paragraph with an "Icon title" style: aqua icon + title text beside it.
 * White on navy sections and cards, navy on light ones.
 * ------------------------------------------------------------------------- */
p[class*="is-style-icon-"] {
	--butler-icon: none;
	display: flex;
	align-items: center;
	gap: 12px;
	color: var(--wp--preset--color--navy);
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 700;
	letter-spacing: 0.01em;
	line-height: 1.3;
}

p[class*="is-style-icon-"]::before {
	content: "";
	flex: 0 0 22px;
	width: 22px;
	height: 22px;
	background-color: var(--wp--preset--color--aqua-deep);
	-webkit-mask: var(--butler-icon) center / contain no-repeat;
	mask: var(--butler-icon) center / contain no-repeat;
}

:is(.has-navy-background-color, .has-navy-deep-background-color, .has-navy-card-background-color, .is-style-card-navy) p[class*="is-style-icon-"] {
	color: var(--wp--preset--color--white);
}

:is(.has-navy-background-color, .has-navy-deep-background-color, .has-navy-card-background-color, .is-style-card-navy) p[class*="is-style-icon-"]::before {
	background-color: var(--wp--preset--color--aqua);
}

p.is-style-icon-phone {
	--butler-icon: url("../icons/phone.svg");
}

p.is-style-icon-map-pin {
	--butler-icon: url("../icons/map-pin.svg");
}

p.is-style-icon-mail {
	--butler-icon: url("../icons/mail.svg");
}

p.is-style-icon-clock {
	--butler-icon: url("../icons/clock.svg");
}

p.is-style-icon-layers {
	--butler-icon: url("../icons/layers.svg");
}

p.is-style-icon-sofa {
	--butler-icon: url("../icons/sofa.svg");
}

p.is-style-icon-grid-3x3 {
	--butler-icon: url("../icons/grid-3x3.svg");
}

p.is-style-icon-wind {
	--butler-icon: url("../icons/wind.svg");
}

p.is-style-icon-flame {
	--butler-icon: url("../icons/flame.svg");
}

p.is-style-icon-sparkles {
	--butler-icon: url("../icons/sparkles.svg");
}

p[class*="is-style-icon-"] a {
	color: inherit;
	text-decoration: none;
}

p[class*="is-style-icon-"] a:hover,
p[class*="is-style-icon-"] a:focus-visible {
	color: var(--butler-accent);
}

/* ---------------------------------------------------------------------------
 * FAQ (Details block)
 * White cards with a border; the question is a large bold line with an aqua
 * plus button that turns into a close mark when the answer is open.
 * ------------------------------------------------------------------------- */
.wp-block-details {
	--butler-faq-pad: clamp(18px, 2.4vw, 26px);
	position: relative;
	padding: 0;
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--md);
	background: var(--wp--preset--color--white);
	box-shadow: 0 1px 2px rgba(15, 36, 64, 0.04);
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.wp-block-details + .wp-block-details {
	margin-top: 14px;
}

.wp-block-details:hover {
	border-color: #cdd7d2;
}

.wp-block-details[open] {
	border-color: var(--wp--preset--color--aqua);
	box-shadow: 0 12px 28px rgba(15, 36, 64, 0.08);
}

.wp-block-details > summary {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	padding: var(--butler-faq-pad);
	padding-right: calc(var(--butler-faq-pad) + 52px);
	color: var(--wp--preset--color--navy);
	font-size: clamp(18px, 1.7vw, 20px);
	font-weight: 700;
	letter-spacing: -0.01em;
	line-height: 1.35;
	list-style: none;
	cursor: pointer;
}

.wp-block-details > summary::-webkit-details-marker {
	display: none;
}

.wp-block-details > summary::marker {
	content: "";
}

/* Round button. */
.wp-block-details > summary::after {
	content: "";
	position: absolute;
	top: 50%;
	right: var(--butler-faq-pad);
	width: 36px;
	height: 36px;
	margin-top: -18px;
	border-radius: 50%;
	background: var(--wp--preset--color--mist);
	transition: background-color 0.2s ease;
}

/* Plus icon on the button. */
.wp-block-details > summary::before {
	content: "";
	position: absolute;
	z-index: 1;
	top: 50%;
	right: calc(var(--butler-faq-pad) + 9px);
	width: 18px;
	height: 18px;
	margin-top: -9px;
	background-color: var(--wp--preset--color--aqua-deep);
	-webkit-mask: url("../icons/plus.svg") center / contain no-repeat;
	mask: url("../icons/plus.svg") center / contain no-repeat;
	transition: transform 0.25s ease, background-color 0.2s ease;
}

.wp-block-details > summary:hover::after {
	background: #e2ebe7;
}

.wp-block-details[open] > summary::after {
	background: var(--wp--preset--color--aqua);
}

.wp-block-details[open] > summary::before {
	background-color: var(--wp--preset--color--navy);
	transform: rotate(45deg);
}

.wp-block-details > summary:focus-visible {
	outline: 2px solid var(--wp--preset--color--aqua);
	outline-offset: 3px;
	border-radius: var(--wp--custom--radius--md);
}

/* Answer. */
.wp-block-details > :not(summary) {
	margin: 0;
	padding: 0 var(--butler-faq-pad);
	color: var(--wp--preset--color--body);
	font-size: var(--wp--preset--font-size--body);
	line-height: 1.7;
}

.wp-block-details > summary + * {
	margin-top: -4px;
}

.wp-block-details > :not(summary) + :not(summary) {
	margin-top: 12px;
}

.wp-block-details > :last-child:not(summary) {
	padding-bottom: calc(var(--butler-faq-pad) + 2px);
}

/* On navy sections. */
:is(.has-navy-background-color, .has-navy-deep-background-color) .wp-block-details {
	border-color: var(--wp--preset--color--navy-line);
	background: var(--wp--preset--color--navy-card);
	box-shadow: none;
}

:is(.has-navy-background-color, .has-navy-deep-background-color) .wp-block-details > summary {
	color: var(--wp--preset--color--white);
}

:is(.has-navy-background-color, .has-navy-deep-background-color) .wp-block-details > summary::after {
	background: var(--wp--preset--color--navy-line);
}

:is(.has-navy-background-color, .has-navy-deep-background-color) .wp-block-details > summary::before {
	background-color: var(--wp--preset--color--aqua);
}

:is(.has-navy-background-color, .has-navy-deep-background-color) .wp-block-details > :not(summary) {
	color: var(--wp--preset--color--on-navy-muted);
}

:is(.has-navy-background-color, .has-navy-deep-background-color) .wp-block-details[open] > summary::before {
	background-color: var(--wp--preset--color--navy);
}

@media (prefers-reduced-motion: reduce) {
	.wp-block-details,
	.wp-block-details > summary::before,
	.wp-block-details > summary::after {
		transition: none;
	}
}

/* ---------------------------------------------------------------------------
 * Footer link columns
 * ------------------------------------------------------------------------- */
.butler-footer__top {
	grid-template-columns: minmax(0, 1.4fr) repeat(3, minmax(0, 1fr)) !important;
}

.butler-footer__heading {
	margin: 0;
	color: var(--wp--preset--color--on-navy-soft);
}

.butler-footer__nav .wp-block-navigation-item__content {
	padding: 2px 0;
	transition: color 0.2s ease;
}

.butler-footer__nav .wp-block-navigation-item__content:hover,
.butler-footer__nav .wp-block-navigation-item__content:focus-visible {
	color: var(--wp--preset--color--aqua-light);
}

.butler-footer__brand p[class*="is-style-icon-"] {
	margin: 0;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	line-height: 1.4;
}

/* Breathing room: a gap after the description, then between contact lines. */
.butler-footer__brand > p:not([class*="is-style-icon-"]) + p[class*="is-style-icon-"] {
	margin-top: 22px;
}

.butler-footer__brand p[class*="is-style-icon-"] + p[class*="is-style-icon-"] {
	margin-top: 14px;
}

.butler-footer__brand p[class*="is-style-icon-"]::before {
	flex-basis: 18px;
	width: 18px;
	height: 18px;
}

@media (max-width: 900px) {
	.butler-footer__top {
		grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	}

	.butler-footer__brand {
		grid-column: 1 / -1;
	}
}

@media (max-width: 600px) {
	.butler-footer__top {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	.butler-footer__nav .wp-block-navigation-item__content {
		transition: none;
	}
}

/* ---------------------------------------------------------------------------
 * Gallery — Stack style
 * Front end: a swipeable deck, one photo at a time, with offset cards behind
 * (assets/js/gallery-stack.js adds arrows, dots and keyboard support).
 * Editor: stays a normal grid so pairs are easy to edit.
 * ------------------------------------------------------------------------- */
body:not(.editor-styles-wrapper) .wp-block-gallery.has-nested-images.is-style-stack {
	--butler-stack-width: 340px;
	position: relative;
	display: flex;
	flex-wrap: nowrap;
	gap: 0;
	width: 100%;
	max-width: var(--butler-stack-width, 340px);
	margin-inline: auto;
	overflow-x: auto;
	overscroll-behavior-x: contain;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	border-radius: var(--wp--custom--radius--sm);
}

body:not(.editor-styles-wrapper) .wp-block-gallery.has-nested-images.is-style-stack::-webkit-scrollbar {
	display: none;
}

body:not(.editor-styles-wrapper) .wp-block-gallery.has-nested-images.is-style-stack figure.wp-block-image:not(#individual-image) {
	flex: 0 0 100%;
	width: 100%;
	margin: 0;
	aspect-ratio: 4 / 5;
	scroll-snap-align: center;
	scroll-snap-stop: always;
}

body:not(.editor-styles-wrapper) .wp-block-gallery.has-nested-images.is-style-stack figure.wp-block-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border: 1px solid var(--butler-line);
	border-radius: var(--wp--custom--radius--sm);
}

/* Captions become a "Before" / "After" pill instead of core's gradient overlay. */
body:not(.editor-styles-wrapper) .wp-block-gallery.has-nested-images.is-style-stack figure.wp-block-image:has(figcaption)::before {
	content: none;
}

body:not(.editor-styles-wrapper) .wp-block-gallery.has-nested-images.is-style-stack figure.wp-block-image figcaption {
	top: 14px;
	right: auto;
	bottom: auto;
	left: 14px;
	width: auto;
	max-height: none;
	margin: 0;
	padding: 5px 12px;
	border-radius: var(--wp--custom--radius--pill);
	background: var(--wp--preset--color--navy);
	color: var(--wp--preset--color--on-navy);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.08em;
	line-height: 1.3;
	text-align: left;
	text-shadow: none;
	text-transform: uppercase;
}

.has-navy-background-color .wp-block-gallery.has-nested-images.is-style-stack figure.wp-block-image figcaption {
	background: var(--wp--preset--color--aqua);
	color: var(--wp--preset--color--navy);
}

/* Deck: two offset cards behind the current photo. */
.butler-stack {
	--butler-stack-width: 340px;
	width: 100%;
	max-width: var(--butler-stack-width, 340px);
	margin-inline: auto;
}

.butler-stack__deck {
	position: relative;
	isolation: isolate;
}

.butler-stack__deck::before,
.butler-stack__deck::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	border: 1px solid var(--butler-line);
	border-radius: var(--wp--custom--radius--sm);
	background: var(--wp--preset--color--white);
	transition: transform 0.35s ease;
}

.butler-stack__deck::before {
	transform: rotate(-3deg) translate(-6px, 5px);
}

.butler-stack__deck::after {
	transform: rotate(2.5deg) translate(7px, 3px);
}

.butler-stack[data-index] .butler-stack__deck:hover::before {
	transform: rotate(-4.5deg) translate(-12px, 8px);
}

.butler-stack[data-index] .butler-stack__deck:hover::after {
	transform: rotate(4deg) translate(14px, 6px);
}

.has-navy-background-color .butler-stack__deck::before,
.has-navy-background-color .butler-stack__deck::after {
	background: var(--wp--preset--color--navy-card);
}

.butler-stack .wp-block-gallery.is-style-stack {
	max-width: none;
}

.butler-stack .wp-block-gallery.is-style-stack:focus-visible {
	outline: 2px solid var(--wp--preset--color--aqua);
	outline-offset: 4px;
}

.butler-stack__nav {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	margin-top: 16px;
}

.butler-stack__btn {
	display: grid;
	place-items: center;
	width: 34px;
	height: 34px;
	padding: 0;
	border: 1px solid var(--butler-line);
	border-radius: 50%;
	background: transparent;
	color: inherit;
	font-size: 17px;
	line-height: 1;
	cursor: pointer;
	transition: border-color 0.2s ease, color 0.2s ease;
}

.butler-stack__btn:hover:not(:disabled) {
	border-color: var(--butler-accent);
	color: var(--butler-accent);
}

.butler-stack__btn:disabled {
	opacity: 0.35;
	cursor: default;
}

.butler-stack__dots {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px;
	max-width: 260px;
}

.butler-stack__dot {
	position: relative;
	width: 8px;
	height: 8px;
	padding: 0;
	border: 0;
	border-radius: var(--wp--custom--radius--pill);
	background: var(--butler-line);
	cursor: pointer;
	transition: width 0.25s ease, background-color 0.25s ease;
}

.butler-stack__dot::before {
	/* Invisible 24px+ tap area around the small dot. */
	content: "";
	position: absolute;
	inset: -8px -4px;
}

.butler-stack__dot[aria-current="true"] {
	width: 22px;
	background: var(--wp--preset--color--aqua);
}

.butler-stack__status {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.butler-stack > figcaption {
	margin-top: 10px;
	text-align: center;
	color: var(--butler-label);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
}

@media (prefers-reduced-motion: reduce) {
	.butler-stack__deck::before,
	.butler-stack__deck::after,
	.butler-stack__dot,
	.butler-stack__btn {
		transition: none;
	}
}

/* ---------------------------------------------------------------------------
 * Responsive
 * ------------------------------------------------------------------------- */

/* Grid-layout groups: 3+ columns → 2 on tablet → 1 on phone. */
@media (max-width: 900px) {
	.wp-block-group.is-layout-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
}

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

/* Columns stack a bit earlier than core's 782px for the 2-col hero/pricing. */
@media (max-width: 900px) {
	.wp-block-columns.is-stacked-on-tablet {
		flex-wrap: wrap !important;
	}

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

@media (max-width: 600px) {
	.wp-block-buttons > .wp-block-button:not(.is-style-text-link):not(.is-small) {
		flex: 1 1 100%;
	}

	.wp-block-buttons > .wp-block-button:not(.is-style-text-link):not(.is-small) > .wp-block-button__link {
		width: 100%;
	}
}