/**
 * Jhilik Portfolio foundation — P0 visual reset.
 * Shared tokens, type, rhythm and header geometry only.
 */

:root {
	--content-width: 1220px;
	--content-width-narrow: 760px;
	--section-space: clamp(3rem, 6vw, 5.5rem);
	--card-gap: clamp(1rem, 2.2vw, 1.5rem);
	/* Static fallback for first paint / no-JS only. labs.js
	   (initHeaderClearance) measures the fixed header's real height via
	   ResizeObserver and overwrites this property inline once it can, so
	   drift never silently reintroduces a layout gap or overlap. Mobile
	   tiers are refined further in responsive.css. */
	--jh-header-clearance: 94px;
	--jh-focus: 0 0 0 3px color-mix(in srgb, var(--wp--preset--color--primary) 30%, transparent);
}

html {
	scroll-behavior: smooth;
	scroll-padding-top: calc(var(--jh-header-clearance) + 1rem);
}

body {
	font-size: 1rem;
	line-height: 1.65;
	text-rendering: optimizeLegibility;
}

main h1,
.case-study-shell h1,
.jhilik-blog-shell h1,
.jhilik-cpt-single h1 {
	font-size: var(--wp--preset--font-size--xx-large);
	line-height: 1.08;
	letter-spacing: -0.03em;
}

main h2 {
	font-size: var(--wp--preset--font-size--x-large);
	line-height: 1.15;
}

main h3 {
	font-size: var(--wp--preset--font-size--large);
	line-height: 1.25;
}

.jhilik-lead,
.jhilik-hero__lead {
	font-size: var(--wp--preset--font-size--lead);
}

.jhilik-eyebrow,
.has-small-font-size,
.jhilik-hero__meta {
	font-size: var(--wp--preset--font-size--small) !important;
}

.jhilik-section {
	padding-block: var(--section-space);
	scroll-margin-top: calc(var(--jh-header-clearance) + 1rem);
}

.jhilik-section__head {
	margin-bottom: clamp(1.5rem, 3vw, 2.5rem);
}

.jhilik-site-header {
	padding-block: 0.75rem;
}

.jhilik-site-header__bar {
	min-height: 58px;
	padding: 0.42rem 0.85rem 0.42rem 1rem;
	column-gap: 1rem;
	border-radius: 16px;
}

.jhilik-site-header__brand .wp-block-site-title {
	font-size: 1.08rem;
	line-height: 1.2;
}

.jhilik-site-header__cta .wp-block-button__link {
	min-height: 42px;
	display: inline-flex;
	align-items: center;
	padding: 0.6rem 1.1rem;
	font-size: 0.92rem;
}

.jhilik-mobile-trigger,
.jhilik-mobile-panel__close {
	width: 42px;
	height: 42px;
	min-width: 42px;
}

.jhilik-mobile-trigger svg,
.jhilik-mobile-panel__close svg {
	display: block !important;
	width: 20px;
	height: 20px;
	color: currentColor;
	stroke: currentColor;
}

.jhilik-mobile-trigger path,
.jhilik-mobile-panel__close path {
	stroke: currentColor;
}

:where(a, button, [tabindex]):focus-visible {
	outline: 2px solid var(--wp--preset--color--primary);
	outline-offset: 3px;
	box-shadow: var(--jh-focus);
}

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