:root{
--space-0:0px;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;
--space-5:20px;--space-6:24px;--space-7:32px;--space-8:40px;--space-9:48px;
--space-10:64px;--space-11:80px;--space-12:104px;--space-13:140px;

/* Breakpoints: mobile ≤639 · tablet 640–1023 · desktop ≥1024 */
--bp-mobile-max:639px; /* @kind spacing */
--bp-tablet-min:640px; /* @kind spacing */
--bp-tablet-max:1023px; /* @kind spacing */
--bp-desktop-min:1024px; /* @kind spacing */

--gutter-inline:clamp(16px,3vw,24px);
--container-max:1240px; /* @kind spacing */
--container-narrow:760px; /* @kind spacing */
--section-y:clamp(64px,8vw,104px); /* @kind spacing */
--section-y-compact:clamp(48px,6vw,64px); /* @kind spacing */
--hero-pad-y:clamp(56px,10vw,96px); /* @kind spacing */
--hero-pad-x:clamp(20px,4vw,40px); /* @kind spacing */
--cta-pad-y:clamp(48px,8vw,72px); /* @kind spacing */
--cta-pad-x:clamp(24px,4vw,48px); /* @kind spacing */
--header-h:clamp(60px,8vw,72px); /* @kind spacing */
--control-h-sm:34px;--control-h-md:42px;--control-h-lg:52px;
--control-pad-x-sm:14px;--control-pad-x-md:20px;--control-pad-x-lg:26px;
--card-pad:clamp(20px,3vw,24px); /* @kind spacing */
--card-pad-lg:clamp(24px,3.5vw,32px); /* @kind spacing */
}