/**
 * Low-specificity global foundations.
 *
 * Elementor widget and Site Settings styles can override these defaults without
 * `!important` or generated element IDs.
 */

html:root {
	color-scheme: light;
	scroll-behavior: auto;
}

:where(body) {
	color: var(--rp-color-text);
	background: var(--rp-color-surface);
	font-family: var(--rp-font-family-body);
	line-height: var(--rp-line-height-body);
	text-rendering: optimizeLegibility;
}

/* Prevent late-loaded Elementor sections from nudging the front-page viewport. */
body.home {
	overflow-anchor: none;
}

:where(h1, h2, h3, h4, h5, h6) {
	color: var(--rp-color-secondary);
	font-family: var(--rp-font-family-heading);
	line-height: var(--rp-line-height-heading);
}

:where(a) {
	color: var(--rp-color-primary);
	text-underline-offset: 0.18em;
}

:where(a, button, input, select, textarea, [tabindex]):focus-visible {
	outline: 0.1875rem solid color-mix(in srgb, var(--rp-color-primary) 45%, transparent);
	outline-offset: 0.1875rem;
}

:where(img, svg, video) {
	max-inline-size: 100%;
	height: auto;
}

::selection {
	color: var(--rp-color-surface);
	background: var(--rp-color-primary);
}

/* Elementor header composition. Navigation and contact content remain widgets. */
:where(.rp-site-header) {
	position: relative;
	z-index: var(--rp-z-header);
	inline-size: min(100% - (2 * var(--rp-container-gutter)), var(--rp-container-elementor));
	max-inline-size: var(--rp-container-elementor);
	margin-inline: auto;
	background: var(--rp-color-surface);
}

:where(.rp-site-header .elementor-nav-menu--main .elementor-item) {
	white-space: nowrap;
}

:where(.rp-site-header .elementor-widget-heading .elementor-heading-title) {
	font-size: clamp(1.25rem, 1.1rem + 0.4vw, 1.55rem);
	font-weight: var(--rp-font-weight-bold);
	letter-spacing: -0.03em;
}

@media (max-width: 767px) {
	:where(.rp-site-header) {
		inline-size: calc(100% - (2 * var(--rp-space-4)));
	}
}

/* Elementor footer composition. Editorial copy and links remain widget content. */
:where(.rp-footer) {
	font-size: var(--rp-font-size-sm);
}

:where(.rp-footer .elementor-widget-text-editor) {
	min-inline-size: 0;
}

:where(.rp-footer h3, .rp-footer h4, .rp-footer p) {
	margin-block-start: 0;
}

:where(.rp-footer h3) {
	margin-block-end: var(--rp-space-4);
	font-size: 1.75rem;
	font-weight: var(--rp-font-weight-bold);
}

:where(.rp-footer h4) {
	margin-block-end: var(--rp-space-4);
	font-size: 0.875rem;
	font-weight: var(--rp-font-weight-bold);
}

:where(.rp-footer p) {
	margin-block-end: var(--rp-space-4);
}

:where(.rp-footer a) {
	text-decoration: none;
}

/* Override legacy Elementor widget colours while retaining editable link content. */
body .rp-footer a,
body .rp-footer h3 a {
	color: var(--rp-color-primary);
}

body .rp-footer a:hover,
body .rp-footer a:focus-visible {
	color: var(--rp-color-primary-hover);
	text-decoration: underline;
}

:where(.rp-footer__grid > .e-con) {
	min-inline-size: 0;
}

/* Legal copy remains native WordPress content and easy to edit. */
:where(.rp-legal-page main.site-main) {
	inline-size: min(100% - (2 * var(--rp-container-gutter)), 62rem);
	margin-inline: auto;
	padding-block: clamp(2.5rem, 6vw, 5rem);
}

:where(.rp-legal-page main.site-main h1) {
	margin-block: 0 clamp(2rem, 4vw, 3rem);
	font-size: clamp(2.25rem, 5vw, 4rem);
}

:where(.rp-legal-page main.site-main h2) {
	margin-block: 2.25rem 0.8rem;
	font-size: clamp(1.35rem, 2.5vw, 1.8rem);
}

:where(.rp-legal-page main.site-main p, .rp-legal-page main.site-main li) {
	color: var(--rp-color-muted);
}

:where(.rp-legal-page main.site-main table) {
	display: block;
	inline-size: 100%;
	overflow-x: auto;
	border-collapse: collapse;
}

:where(.rp-legal-page main.site-main td) {
	padding: var(--rp-space-3);
	border: 1px solid var(--rp-color-border);
	vertical-align: top;
}

:where(.rp-work-card) {
	overflow: hidden;
	background-color: var(--rp-color-surface-alt);
	transition: transform var(--rp-transition-base), box-shadow var(--rp-transition-base);
}

/*
 * Elementor adds transform transitions to every element by default. On static
 * home sections the browser can re-evaluate hover hit testing when wheel
 * scrolling stops, briefly compositing an element on a different layer. Keep
 * useful colour and shadow feedback without allowing those blocks to move.
 */
body.home :is(
	.rp-hero,
	.rp-services,
	.rp-project-banner,
	.rp-why,
	.rp-final-cta
) :is(.elementor-element, .elementor-button) {
	transition-property: background-color, border-color, box-shadow, color, fill, opacity;
}

@media (hover: hover) {
	:where(.rp-work-card:hover) {
		transform: translateY(-0.25rem);
		box-shadow: var(--rp-shadow-md);
	}
}

@media (max-width: 767px) {
	:where(.rp-footer) {
		text-align: center;
	}
}

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

	:where(*, *::before, *::after) {
		animation-duration: 0.01ms;
		animation-iteration-count: 1;
		transition-duration: 0.01ms;
	}
}