/*
 * Propertiana design tokens.
 * Primitive -> semantic -> component.
 */
:root{
	/* Primitive: color. */
	--ds-white:#fff;
	--ds-canvas-50:#faf9f5;
	--ds-canvas-100:#f6f4ee;
	--ds-sand-200:#efece3;
	--ds-sand-300:#e5e1d6;
	--ds-stone-400:#b2b7ad;
	--ds-stone-600:#667064;
	--ds-stone-700:#4e594d;
	--ds-pine-950:#172017;
	--ds-olive-50:#f3f6ed;
	--ds-olive-100:#e8eddf;
	--ds-olive-500:#607846;
	--ds-olive-600:#4b632e;
	--ds-olive-700:#3b5124;
	--ds-clay-50:#fbf5f1;
	--ds-clay-100:#f5eae3;
	--ds-clay-600:#9b4f34;
	--ds-clay-700:#803e29;
	--ds-danger-600:#b33a32;
	--ds-white-rgb:255 255 255;
	--ds-pine-rgb:23 32 23;

	/* Primitive: spacing, type, radius, elevation, motion. */
	--ds-space-1:4px;
	--ds-space-2:8px;
	--ds-space-3:12px;
	--ds-space-4:16px;
	--ds-space-5:20px;
	--ds-space-6:24px;
	--ds-space-8:32px;
	--ds-space-10:40px;
	--ds-space-12:48px;
	--ds-space-14:56px;
	--ds-space-16:64px;
	--ds-space-20:80px;
	--ds-space-24:96px;
	--ds-font-xs:12px;
	--ds-font-sm:14px;
	--ds-font-base:16px;
	--ds-font-lg:18px;
	--ds-font-xl:24px;
	--ds-font-2xl:32px;
	--ds-font-3xl:48px;
	--ds-font-4xl:64px;
	--ds-font-arabic:"Cairo",system-ui,sans-serif;
	--ds-font-wordmark:"Cinzel",Georgia,serif;
	--ds-font-numeric:"IBM Plex Mono",ui-monospace,monospace;
	--ds-radius-sm:12px;
	--ds-radius-md:16px;
	--ds-radius-lg:22px;
	--ds-radius-xl:30px;
	--ds-radius-full:999px;
	--ds-shadow-xs:0 1px 2px rgb(var(--ds-pine-rgb)/.04);
	--ds-shadow-sm:0 8px 24px rgb(var(--ds-pine-rgb)/.07);
	--ds-shadow-md:0 18px 48px rgb(var(--ds-pine-rgb)/.11);
	--ds-duration-fast:150ms;
	--ds-duration-normal:220ms;
	--ds-ease:cubic-bezier(.2,.7,.3,1);

	/* Semantic. */
	--ds-color-canvas:var(--ds-canvas-100);
	--ds-color-surface:var(--ds-white);
	--ds-color-surface-subtle:var(--ds-sand-200);
	--ds-color-text:var(--ds-pine-950);
	--ds-color-text-body:var(--ds-stone-700);
	--ds-color-text-muted:var(--ds-stone-600);
	--ds-color-border:var(--ds-sand-300);
	--ds-color-primary:var(--ds-olive-600);
	--ds-color-primary-hover:var(--ds-olive-700);
	--ds-color-primary-soft:var(--ds-olive-100);
	--ds-color-accent:var(--ds-clay-600);
	--ds-color-accent-hover:var(--ds-clay-700);
	--ds-color-accent-soft:var(--ds-clay-100);
	--ds-color-focus:var(--ds-olive-500);
	--ds-page-gutter:clamp(18px,4vw,52px);
	--ds-section-space:var(--ds-space-24);
	--ds-content-max:1200px;

	/* Component. */
	--ds-button-height:48px;
	--ds-button-radius:var(--ds-radius-full);
	--ds-button-padding-inline:var(--ds-space-6);
	--ds-card-bg:var(--ds-color-surface);
	--ds-card-border:var(--ds-color-border);
	--ds-card-radius:var(--ds-radius-lg);
	--ds-card-shadow:var(--ds-shadow-xs);
	--ds-card-shadow-hover:var(--ds-shadow-md);
	--ds-field-height:54px;
	--ds-field-bg:var(--ds-canvas-50);
	--ds-field-border:var(--ds-color-border);
	--ds-field-radius:var(--ds-radius-md);
	--ds-hero-content-max:840px;
	--ds-hero-brand-mark-size:76px;
	--ds-hero-brand-mark-radius:var(--ds-radius-lg);
	--ds-focus-ring:0 0 0 3px var(--ds-color-primary-soft),0 0 0 5px var(--ds-color-focus);
}

@media(max-width:900px){:root{--ds-section-space:var(--ds-space-20)}}
@media(max-width:650px){:root{--ds-section-space:var(--ds-space-14);--ds-page-gutter:15px;--ds-hero-brand-mark-size:68px;--ds-hero-brand-mark-radius:var(--ds-radius-md)}}
