/* Pixel Earth: global styles not expressible in theme.json. Section styles live in
   assets/css/components/<section>.css, scoped to .pe-s-<section>. */

/* ---------- Base ---------- */
html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--wp--custom--header-height) + 16px); }
body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
	font-feature-settings: "ss01", "cv11";
}
::selection { background: rgba(48, 112, 168, 0.22); }
img, svg, video, canvas { max-width: 100%; height: auto; }
.wp-site-blocks { overflow-x: clip; }
/* Full-width sections meet edge to edge: no block gap between the header, main, footer or sections. */
.wp-site-blocks > * + * { margin-block-start: 0; }
main.pe-main > * { margin-block: 0; }

:where(p, li) { text-wrap: pretty; }
:where(h1, h2, h3, h4) { text-wrap: balance; }

:where(.wp-site-blocks) a:where(:not(.wp-element-button)) {
	text-decoration-thickness: 1px;
	text-underline-offset: 0.2em;
	transition: color var(--wp--custom--motion--duration-short) var(--wp--custom--motion--easing-out);
}

:focus-visible {
	outline: 2px solid var(--wp--preset--color--color-highlight);
	outline-offset: 3px;
	border-radius: 4px;
}

.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- Type roles ---------- */
.pe-eyebrow {
	font-family: var(--wp--preset--font-family--geist-mono);
	font-size: var(--wp--preset--font-size--label);
	font-weight: 500;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	line-height: 1.4;
	color: var(--wp--preset--color--color-accent);
	margin-block-end: 0;
}
.pe-display {
	font-size: var(--wp--preset--font-size--display);
	font-weight: 700;
	line-height: 0.98;
	letter-spacing: -0.045em;
}
.pe-lead {
	font-size: var(--wp--preset--font-size--lead);
	line-height: 1.5;
	color: var(--wp--preset--color--color-text-secondary);
	max-width: 38em;
}
.pe-small { font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--color-text-secondary); }
.pe-mono { font-family: var(--wp--preset--font-family--geist-mono); font-size: var(--wp--preset--font-size--mono); letter-spacing: 0.02em; }
.pe-muted { color: var(--wp--preset--color--color-text-secondary); }

/* ---------- Sections ---------- */
/* Phones and small tablets: tighter section spacing (owner direction: no gap over about 120px on
   phones, 160px below 782px). */
@media (max-width: 781px) {
	:root { --wp--preset--spacing--section: clamp(36px, 0.25rem + 6.5vw, 56px); }
}
.pe-section {
	padding-top: var(--wp--preset--spacing--section);
	padding-bottom: var(--wp--preset--spacing--section);
}
.pe-section > .alignwide + .alignwide { margin-block-start: clamp(40px, 4vw, 64px); }
.pe-surface { background: var(--wp--preset--color--color-surface-light); }
.pe-dark {
	background: var(--wp--preset--color--color-background-dark);
	color: var(--wp--preset--color--color-text-on-dark);
}
.pe-dark :where(h1, h2, h3, h4, h5, h6) { color: var(--wp--preset--color--color-text-on-dark); }
.pe-dark .pe-lead, .pe-dark .pe-muted, .pe-dark .pe-small { color: var(--wp--preset--color--color-text-on-dark-secondary); }
.pe-dark .pe-eyebrow { color: var(--wp--preset--color--color-accent-muted); }
.pe-dark a:where(:not(.wp-element-button)) { color: var(--wp--preset--color--color-text-on-dark); }

.pe-section-head > * { max-width: 760px; margin-block: 0; }
.pe-section-head > * + * { margin-block-start: 16px; }
.pe-section-head h2 { margin-block-start: 14px; }

/* ---------- Buttons ---------- */
.wp-block-buttons { gap: 12px; }
.wp-block-button__link {
	display: inline-flex; align-items: center; gap: 10px;
	transition: background-color var(--wp--custom--motion--duration-short) var(--wp--custom--motion--easing-out),
		color var(--wp--custom--motion--duration-short) var(--wp--custom--motion--easing-out),
		border-color var(--wp--custom--motion--duration-short) var(--wp--custom--motion--easing-out),
		transform var(--wp--custom--motion--duration-short) var(--wp--custom--motion--easing-out);
	white-space: nowrap;
}
.wp-block-button__link:active { transform: translateY(1px); }
.wp-block-button.is-style-outline > .wp-block-button__link {
	background: transparent;
	color: var(--wp--preset--color--color-text-primary);
	border: 1px solid var(--wp--preset--color--color-line);
	padding: 13px 23px;
}
.wp-block-button.is-style-outline > .wp-block-button__link:hover {
	border-color: var(--wp--preset--color--color-text-primary);
	background: transparent;
	color: var(--wp--preset--color--color-text-primary);
}
.pe-dark .wp-block-button:not(.is-style-outline) > .wp-block-button__link { background: var(--wp--preset--color--color-surface-light); color: var(--wp--preset--color--color-text-primary); }
.pe-dark .wp-block-button:not(.is-style-outline) > .wp-block-button__link:hover { background: var(--wp--preset--color--color-highlight); color: var(--wp--preset--color--color-background-dark); }
.pe-dark .wp-block-button.is-style-outline > .wp-block-button__link { color: var(--wp--preset--color--color-text-on-dark); border-color: var(--wp--preset--color--color-line-dark); }
.pe-dark .wp-block-button.is-style-outline > .wp-block-button__link:hover { border-color: var(--wp--preset--color--color-text-on-dark); color: var(--wp--preset--color--color-text-on-dark); }
.pe-arrow::after { content: "→"; font-family: var(--wp--preset--font-family--geist); transition: transform var(--wp--custom--motion--duration-short) var(--wp--custom--motion--easing-out); }
.pe-arrow:hover::after, a:hover .pe-arrow::after { transform: translateX(3px); }

/* A text link with an arrow (card footers, "Read more"). */
.pe-link-arrow a, a.pe-link-arrow {
	font-weight: 600; text-decoration: none; color: var(--wp--preset--color--color-text-primary);
	display: inline-flex; align-items: center; gap: 8px;
}
.pe-link-arrow a::after, a.pe-link-arrow::after { content: "→"; transition: transform var(--wp--custom--motion--duration-short) var(--wp--custom--motion--easing-out); }
.pe-link-arrow a:hover::after, a.pe-link-arrow:hover::after { transform: translateX(3px); }
.pe-dark .pe-link-arrow a, .pe-dark a.pe-link-arrow { color: var(--wp--preset--color--color-text-on-dark); }

/* ---------- Cards and media ---------- */
.pe-card {
	background: var(--wp--preset--color--color-surface-light);
	border: 1px solid var(--wp--preset--color--color-line);
	border-radius: var(--wp--custom--radius--medium);
	padding: clamp(22px, 2.2vw, 32px);
	box-shadow: var(--wp--custom--shadow--card);
	transition: box-shadow var(--wp--custom--motion--duration-medium) var(--wp--custom--motion--easing-out), transform var(--wp--custom--motion--duration-medium) var(--wp--custom--motion--easing-out), border-color var(--wp--custom--motion--duration-medium) var(--wp--custom--motion--easing-out);
}
a.pe-card, .pe-card.is-link { text-decoration: none; color: inherit; display: block; }
.pe-card.is-link:hover, a.pe-card:hover { box-shadow: var(--wp--custom--shadow--lift); transform: translateY(-2px); border-color: #d4d9e0; }
.pe-dark .pe-card { background: var(--wp--preset--color--color-surface-dark); border-color: var(--wp--preset--color--color-line-dark); box-shadow: none; }
.pe-card > * + * { margin-block-start: 12px; }
.pe-card h3 { margin: 0; }

.pe-media { border-radius: var(--wp--custom--radius--large); overflow: hidden; }
.pe-media img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* ---------- Lists ---------- */
.pe-checks { list-style: none; padding-left: 0; margin: 0; }
.pe-checks li { position: relative; padding-left: 28px; }
.pe-checks li + li { margin-top: 10px; }
.pe-checks li::before {
	content: ""; position: absolute; left: 0; top: 0.45em; width: 14px; height: 8px;
	border-left: 2px solid var(--wp--preset--color--color-accent); border-bottom: 2px solid var(--wp--preset--color--color-accent);
	transform: rotate(-45deg);
}
.pe-dark .pe-checks li::before { border-color: var(--wp--preset--color--color-highlight); }

/* ---------- FAQ (core/details) ---------- */
.wp-block-details {
	border-top: 1px solid var(--wp--preset--color--color-line);
	padding: 20px 0;
}
.wp-block-details:last-of-type { border-bottom: 1px solid var(--wp--preset--color--color-line); }
.wp-block-details summary {
	cursor: pointer; list-style: none; position: relative; padding-right: 40px;
	font-size: var(--wp--preset--font-size--h-4); font-weight: 600; letter-spacing: -0.01em; line-height: 1.35;
}
.wp-block-details summary::-webkit-details-marker { display: none; }
.wp-block-details summary::after {
	content: "+"; position: absolute; right: 4px; top: -2px; font-size: 26px; font-weight: 300; line-height: 1;
	color: var(--wp--preset--color--color-accent);
	transition: transform var(--wp--custom--motion--duration-short) var(--wp--custom--motion--easing-out);
}
.wp-block-details[open] summary::after { transform: rotate(45deg); }
.wp-block-details > :not(summary) { color: var(--wp--preset--color--color-text-secondary); max-width: 68ch; }
.pe-dark .wp-block-details { border-color: var(--wp--preset--color--color-line-dark); }

/* ---------- Header ---------- */
/* The template part's own wrapper is what sticks (a sticky child of an equally tall wrapper cannot). */
.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, 0px); }
/* The blur sits on a pseudo-element: backdrop-filter on the header itself would make it the
   containing block of the fixed full-screen menu, trapping the open menu inside the 72px bar. */
.pe-header {
	position: relative; isolation: isolate;
	border-bottom: 1px solid transparent;
	transition: border-color var(--wp--custom--motion--duration-medium) var(--wp--custom--motion--easing-out);
}
.pe-header::before {
	content: ""; position: absolute; inset: 0; z-index: -1;
	background: rgba(255, 255, 255, 0.92);
	-webkit-backdrop-filter: saturate(160%) blur(12px); backdrop-filter: saturate(160%) blur(12px);
}
.pe-header.is-scrolled { border-bottom-color: var(--wp--preset--color--color-line); }
.pe-header__bar { min-height: var(--wp--custom--header-height); gap: 24px; }
.pe-header .wp-block-site-logo { flex: 0 0 auto; }
.pe-header .wp-block-site-logo img { width: 116px; height: auto; display: block; }
.pe-header .wp-block-navigation { gap: 4px; }
.pe-header .wp-block-navigation-item__content { padding: 8px 12px; border-radius: 999px; color: var(--wp--preset--color--color-text-primary); text-decoration: none; transition: background-color var(--wp--custom--motion--duration-short) var(--wp--custom--motion--easing-out); }
.pe-header .wp-block-navigation-item__content:hover { background: rgba(20, 23, 28, 0.05); }
.pe-header .wp-block-navigation .current-menu-item > .wp-block-navigation-item__content,
.pe-header .wp-block-navigation-item__content[aria-current="page"] { background: rgba(48, 112, 168, 0.08); color: var(--wp--preset--color--color-accent); }
/* Desktop dropdown (Services). */
.pe-header .wp-block-navigation .wp-block-navigation__submenu-container {
	border: 1px solid var(--wp--preset--color--color-line); border-radius: var(--wp--custom--radius--medium);
	background: var(--wp--preset--color--color-surface-light); box-shadow: var(--wp--custom--shadow--lift);
	padding: 8px; min-width: 240px; margin-top: 6px;
}
.pe-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content { display: block; padding: 10px 14px; border-radius: var(--wp--custom--radius--small); }
.pe-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover { background: var(--wp--preset--color--color-background-light); color: var(--wp--preset--color--color-accent); }
.pe-header .wp-block-navigation-submenu > .wp-block-navigation-item__content { padding-right: 4px; }
.pe-header__cta { flex: 0 0 auto; }
.pe-header__cta .wp-block-button__link { padding: 11px 20px; }

/* Below 1100px the links move into the full-screen menu (core shows its button only below 600px). */
@media (min-width: 600px) and (max-width: 1099px) {
	.pe-header .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex; }
	.pe-header .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none; }
}
/* Home is the logo in the bar; the open menu lists it with the other primary links. */
.pe-header .wp-block-navigation__responsive-container:not(.is-menu-open) .pe-nav-home { display: none; }
@media (max-width: 1099px) {
	/* The menu button sits at the far right, after the header button (owner direction: logo left,
	   menu button right). Two classes: WordPress's "body .is-layout-flex > * { margin: 0 }" outranks one. */
	.pe-header .pe-header__nav { order: 3; margin-left: 16px; }
	.pe-header .pe-header__cta { margin-left: auto; }
}
@media (max-width: 599px) {
	.pe-header .pe-header__nav { margin-left: auto; }
}
@media (max-width: 599px) {
	/* Two classes: WordPress's "body .is-layout-flex { display: flex }" outranks one. */
	.pe-header .pe-header__cta { display: none; }
	.pe-header .wp-block-site-logo img { width: 104px; }
}
.pe-header .wp-block-navigation__responsive-container-open { min-width: 44px; min-height: 44px; margin: -8px -10px -8px 0; padding: 0; align-items: center; justify-content: center; color: var(--wp--preset--color--color-text-primary); }
.pe-header .wp-block-navigation__responsive-container-open svg { width: 26px; height: 26px; }
.pe-header .wp-block-navigation__responsive-container.is-menu-open {
	background: var(--wp--preset--color--color-surface-light);
	padding: 24px clamp(20px, 5vw, 64px);
	/* Left-aligned list (the bar's own links are centred). */
	--navigation-layout-justification-setting: flex-start; --navigation-layout-justify: flex-start; text-align: left;
}
.pe-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content { padding-top: 64px; }
.pe-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { gap: 4px; align-items: flex-start; align-self: stretch; margin: 0; }
.pe-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item { align-items: flex-start; text-align: left; }
.pe-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	font-size: clamp(1.5rem, 1.1rem + 2vw, 2.25rem); font-weight: 600; letter-spacing: -0.02em; padding: 10px 0; border-radius: 0;
}
.pe-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content:hover { background: none; color: var(--wp--preset--color--color-accent); }
/* In the open menu the service links sit under Services, smaller, as a group. */
.pe-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container { padding: 4px 0 12px 2px; gap: 0; border: 0; box-shadow: none; min-width: 0; margin: 0; }
.pe-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	font-size: var(--wp--preset--font-size--body-large); font-weight: 500; letter-spacing: 0; padding: 7px 0; color: var(--wp--preset--color--color-text-secondary);
}

/* ---------- Footer ---------- */
.pe-footer { background: var(--wp--preset--color--color-surface-light); border-top: 1px solid var(--wp--preset--color--color-line); }
.pe-footer__inner { padding-top: clamp(56px, 3rem + 4vw, 104px); padding-bottom: 32px; }
.pe-footer__cols { gap: clamp(32px, 4vw, 64px); }
.pe-footer__tagline { font-size: var(--wp--preset--font-size--body-large); line-height: 1.5; color: var(--wp--preset--color--color-text-secondary); max-width: 26em; margin-top: 20px; }
/* Tablets: the brand on its own row, then three link columns. Four classes: core's stacking rule
   below 782px (.wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column, !important) has three. */
@media (min-width: 600px) and (max-width: 1023px) {
	.pe-footer .pe-footer__cols.wp-block-columns { flex-wrap: wrap !important; }
	.pe-footer .pe-footer__cols.wp-block-columns > .wp-block-column { flex-basis: calc(33.333% - 24px) !important; flex-grow: 1; }
	.pe-footer .pe-footer__cols.wp-block-columns > .pe-footer__brand { flex-basis: 100% !important; }
}
.pe-footer .wp-block-site-logo img { width: 128px; height: auto; display: block; }
.pe-footer__label {
	font-family: var(--wp--preset--font-family--geist-mono);
	font-size: var(--wp--preset--font-size--label); font-weight: 500; letter-spacing: 0.12em; text-transform: uppercase;
	color: var(--wp--preset--color--color-text-secondary); margin: 0 0 16px;
}
.pe-footer ul { list-style: none; padding: 0; margin: 0; }
.pe-footer li + li { margin-top: 4px; }
.pe-footer a { color: var(--wp--preset--color--color-text-primary); text-decoration: none; }
.pe-footer li a { display: inline-block; padding-block: 3px; }
.pe-footer a:hover { color: var(--wp--preset--color--color-accent); text-decoration: underline; }
/* Same rhythm as the link lists beside it (links carry 3px padding, 4px apart). */
.pe-footer__contact p:not(.pe-footer__label) { margin: 0; padding-block: 3px; }
.pe-footer__contact p:not(.pe-footer__label) + p { margin-top: 4px; }
.pe-footer__contact .pe-nowrap { white-space: nowrap; }
.pe-footer__legal { border-top: 1px solid var(--wp--preset--color--color-line); padding-top: 24px; margin-top: clamp(40px, 5vw, 72px); }
.pe-footer__legal p { margin: 0; font-size: var(--wp--preset--font-size--caption); color: var(--wp--preset--color--color-text-secondary); }

/* ---------- Page intro (inner pages) ---------- */
.pe-page-intro { padding-top: clamp(56px, 4rem + 4vw, 128px); padding-bottom: clamp(40px, 3rem + 2vw, 72px); }
.pe-page-intro .wp-block-post-title, .pe-page-intro h1 { font-size: var(--wp--preset--font-size--h-1); margin-block-start: 14px; }

/* Running text from the editor (generic pages and posts). */
.pe-prose > * + * { margin-block-start: 1.1em; }
.pe-prose :where(h2) { font-size: var(--wp--preset--font-size--h-3); margin-block-start: 2em; }
.pe-prose :where(h3) { font-size: var(--wp--preset--font-size--h-4); margin-block-start: 1.6em; }
.pe-prose :where(ul, ol) { padding-left: 1.2em; }
.pe-prose :where(li + li) { margin-top: 6px; }

/* ---------- Reveal on scroll (assets/js/site.js adds .is-in; grids get .pe-stagger and reveal item by item) ---------- */
.pe-js .pe-reveal:not(.pe-stagger), .pe-js .pe-stagger > * { opacity: 0; transform: translateY(16px); transition: opacity var(--wp--custom--motion--duration-long) var(--wp--custom--motion--easing-out), transform var(--wp--custom--motion--duration-long) var(--wp--custom--motion--easing-out); }
.pe-js .pe-reveal.is-in:not(.pe-stagger), .pe-js .pe-stagger > .is-in { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
	.pe-js .pe-reveal, .pe-js .pe-stagger > * { opacity: 1; transform: none; }
}