/* Design tokens (DESIGN.md §2–§5). Colour values live once, in theme.json → --wp--preset--color--*.
   Roles: surface = page; bg = white cards/inputs; action = vermilion buttons; accent = numbers and
   the emphasised phrase of reason titles; link = blue links, focus, rules and the solution band. */
:root{
	/* Colour roles */
	--color-surface:var(--wp--preset--color--surface);
	--color-bg:var(--wp--preset--color--base);
	--color-heading:var(--wp--preset--color--heading);
	--color-text:var(--color-heading);
	--color-text-sub:var(--color-heading);
	--color-border:var(--wp--preset--color--border);
	--color-action:var(--wp--preset--color--action);
	--color-action-hover:var(--wp--preset--color--action-hover);
	--color-action-text:var(--wp--preset--color--base);
	--color-accent:var(--color-action);
	--color-link:var(--wp--preset--color--link);
	--color-link-hover:var(--color-heading);
	--color-focus-ring:var(--color-link);
	--color-focus-halo:rgba(11,64,156,.18);
	--color-error:var(--wp--preset--color--error);
	--color-error-halo:rgba(195,38,31,.16);
	--color-required-bg:var(--color-heading);
	--color-required-text:var(--color-bg);
	--color-pending-bg:var(--color-bg);
	--color-pending-text:var(--color-heading);
	--color-disabled-bg:var(--color-border);
	--color-disabled-text:var(--color-heading);
	--curve-1:var(--wp--preset--color--curve-1);
	--curve-2:var(--wp--preset--color--curve-2);
	--curve-3:var(--wp--preset--color--curve-3);
	--curve-4:var(--wp--preset--color--curve-4);
	--curve-opacity:.9;
	--curve-stroke:1.25px;

	/* Type */
	--font-sans:var(--wp--preset--font-family--sans);
	--font-heading:var(--wp--preset--font-family--heading);
	--font-latin:var(--wp--preset--font-family--latin);
	--fw-regular:400;
	--fw-medium:500;
	--fw-semibold:600;
	--fw-bold:700;

	--fs-hero:clamp(2.125rem,1.15rem + 4.2vw,4.5rem);
	--fs-hero-lead:clamp(.9375rem,.86rem + .45vw,1.3125rem);
	--fs-section:clamp(1.75rem,1.2rem + 2.3vw,3.25rem);
	--fs-problems-title:clamp(1.5rem,1.1rem + 1.9vw,2.625rem);
	--fs-problem:clamp(1rem,.9rem + .45vw,1.25rem);
	--fs-solution-title:clamp(1.625rem,1rem + 3vw,3.5rem);
	--fs-solution-lead:clamp(.9375rem,.84rem + .5vw,1.3125rem);
	--fs-bubble:clamp(.9375rem,.86rem + .4vw,1.1875rem);
	--fs-card:clamp(1.25rem,1.1rem + .6vw,1.625rem);
	--fs-reason:clamp(1.375rem,1.1rem + 1vw,1.875rem);
	--fs-reason-num:clamp(.9375rem,.85rem + .35vw,1.125rem);
	--fs-page-title:clamp(1.625rem,1.2rem + 1.8vw,2.625rem);
	--fs-body:clamp(.9375rem,.9rem + .2vw,1.0625rem);
	--fs-base:1rem;
	--fs-step:clamp(.875rem,.85rem + .15vw,.9375rem);
	--fs-body-lg:1.0625rem;
	--fs-ui:.9375rem;
	--fs-nav:clamp(.875rem,.84rem + .15vw,.9375rem);
	--fs-brand:clamp(.9375rem,.88rem + .3vw,1.1875rem);
	--fs-label:.9375rem;
	--fs-small:.875rem;
	--fs-caption:.8125rem;
	--fs-caption-xs:.6875rem;

	--lh-tight:1.3;
	--lh-heading:1.5;
	--lh-body:1.95;
	--lh-relaxed:2;
	--ls-body:.04em;
	--ls-heading:.08em;
	--ls-ui:.06em;

	/* Space & layout */
	--container-max:1120px;
	--container-narrow:760px;
	--gutter:clamp(20px,5vw,48px);
	--gutter-header:clamp(20px,2.6vw,44px);
	--header-h:clamp(64px,5.6vw,88px);
	--hero-min-h:clamp(600px,100svh,980px);
	--section-pad:clamp(80px,9vw,144px);
	--heading-gap:clamp(48px,6vw,88px);
	--card-gap:clamp(20px,2.2vw,32px);
	--card-pad:clamp(28px,2.8vw,40px);
	--reason-gap:clamp(72px,9vw,136px);

	/* Shape */
	--radius-card:24px;
	--radius-image:16px;
	--radius-input:8px;
	--radius-tag:4px;
	--radius-problem:6px;
	--radius-sheet:32px;
	--radius-pill:999px;
	--border-width:1px;
	--shadow-card:0 12px 40px rgba(22,24,29,.06);
	--shadow-card-hover:0 18px 48px rgba(22,24,29,.10);
	--shadow-panel:0 16px 32px rgba(22,24,29,.08);
	--shadow-sheet:0 -12px 40px rgba(16,49,107,.08);
	--focus-ring-width:2px;
	--focus-ring-offset:3px;

	/* Motion */
	--dur-fast:150ms;
	--dur-base:240ms;
	--ease-standard:cubic-bezier(.2,.7,.2,1);
	--rv-dur:.8s;
	--rv-ease:cubic-bezier(.22,1,.36,1);
	--rv-y:48px;
	--rv-x:52px;
	--rv-ry:0px;
}
@media (max-width:899px){:root{--rv-x:0px;--rv-ry:28px}}
@media (max-width:767px){:root{--rv-y:24px;--rv-ry:20px}}