/* =========================================================================
   WEFOM — base.css
   Reset, design tokens (supplementing theme.json), and base elements.
   ========================================================================= */

/* -- Reset & foundations -------------------------------------------------- */
*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
}

body {
	margin: 0;
	overflow-x: hidden;
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
}

img,
picture,
svg {
	max-width: 100%;
	display: block;
	height: auto;
}

/* -- Tokens not expressed through theme.json presets ---------------------- */
:root {
	--wefom-gutter: clamp(20px, 5vw, 64px);
	--wefom-section-space: clamp(3.5rem, 10vw, 10rem);
	--wefom-section-space-sm: clamp(2.5rem, 6vw, 6rem);
	--wefom-max-text: 72ch;
	--wefom-header-height: 84px;
	--wefom-easing: cubic-bezier(0.2, 0.8, 0.2, 1);
	--wefom-fast: 160ms;
	--wefom-normal: 250ms;
	--wefom-reveal: 420ms;
}

/* -- Accessibility: motion -------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.001ms !important;
		scroll-behavior: auto !important;
	}
}

/* -- Focus ------------------------------------------------------------------ */
a,
button,
input,
select,
textarea,
summary,
[tabindex] {
	outline: none;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible,
.wp-block-button__link:focus-visible {
	outline: 2px solid var(--wp--preset--color--primary-blue);
	outline-offset: 3px;
	border-radius: var(--wp--custom--radius--small, 6px);
}

/* -- Skip link --------------------------------------------------------------- */
.wefom-skip-link {
	position: absolute;
	left: -999px;
	top: 0;
	z-index: 10000;
	background: var(--wp--preset--color--near-black);
	color: var(--wp--preset--color--pure-white);
	padding: 12px 20px;
	border-radius: 0 0 var(--wp--custom--radius--small, 6px) 0;
	font-size: var(--wp--preset--font-size--small);
	text-decoration: none;
}

.wefom-skip-link:focus {
	left: 0;
}

/* -- Typography basics -------------------------------------------------------- */
h1, h2, h3, h4, h5, h6 {
	text-wrap: balance;
	overflow-wrap: break-word;
}

p {
	max-width: var(--wefom-max-text);
	text-wrap: pretty;
}

.wp-block-post-content p,
.entry-content p {
	max-width: var(--wp--custom--content-width--text, 72ch);
}

label,
.wefom-label,
.wefom-eyebrow {
	font-size: var(--wp--preset--font-size--label);
	text-transform: uppercase;
	letter-spacing: 0.06em;
	font-weight: 600;
	color: var(--wp--preset--color--muted-text);
}

/* -- Landmarks / layout helpers ------------------------------------------------ */
.wefom-container {
	padding-inline: var(--wefom-gutter);
}

/* Anchor targets must not be hidden behind the sticky header. */
#top,
#services,
#process,
#engagements,
#applications,
#insights,
#contact,
#wefom-contact-form {
	scroll-margin-top: var(--wefom-header-height);
}

::selection {
	background: var(--wp--preset--color--pale-blue);
	color: var(--wp--preset--color--near-black);
}

/* -- Forms (neutral styling, plugin-compatible) -------------------------------- */
input:not([type="checkbox"]):not([type="radio"]),
select,
textarea {
	width: 100%;
	padding: 12px 14px;
	background: var(--wp--preset--color--pure-white);
	border: 1px solid var(--wp--preset--color--border-light);
	border-radius: var(--wp--custom--radius--small, 6px);
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--body);
	color: var(--wp--preset--color--graphite);
	transition: border-color var(--wefom-fast) var(--wefom-easing);
}

input:hover,
select:hover,
textarea:hover {
	border-color: var(--wp--preset--color--border-strong);
}

input:focus-visible,
select:focus-visible,
textarea:focus-visible {
	border-color: var(--wp--preset--color--primary-blue);
}

::placeholder {
	color: var(--wp--preset--color--muted-text);
}