/*
 * Design tokens — the single source of truth for venus-theme's look.
 *
 * Extracted from venusdesign.eu: the holding site is a minimalist white /
 * warm-near-black / grey system set in Inter with generous whitespace. Every
 * downstream sheet references these custom properties — never raw hex, never a
 * literal font name or pixel size that belongs here.
 */

:root {

	/* ---- Colour -------------------------------------------------------- */
	/* Warm neutral palette pulled from the live site (#fff bg, #151111 body,
	   #707070 grey, #000 headings). Action colour is the same near-black the
	   holding uses for its buttons — the brand reads quiet and architectural. */
	--color-bg:               #ffffff;
	--color-surface:          #f7f5f3; /* warm off-white panels / alt sections */
	--color-surface-2:        #efebe6; /* slightly deeper warm neutral         */
	--color-text:             #151111; /* warm near-black — body copy          */
	--color-text-muted:       #707070; /* secondary text, captions             */
	--color-heading:          #000000;
	--color-border:           #e4ded7; /* warm hairline                        */
	--color-border-strong:    #cfc8bf;

	--color-accent:           #151111; /* primary action (buttons, focus)      */
	--color-accent-hover:     #3a2f2a;
	--color-on-accent:        #ffffff; /* text/icons on the accent             */

	--color-focus-ring:       #151111;

	/* ---- Typography ---------------------------------------------------- */
	--font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto,
		Helvetica, Arial, sans-serif;
	--font-heading: var(--font-sans);

	--font-weight-normal:   400;
	--font-weight-medium:   500;
	--font-weight-semibold: 600;
	--font-weight-bold:     700;

	--line-height-base:    1.65;
	--line-height-heading: 1.12;
	--letter-spacing-tight: -0.01em;
	--letter-spacing-wide:   0.12em; /* eyebrows / small-caps labels — wide architectural tracking */

	/* Fluid type scale (min 320px → max ~1280px viewport). */
	--text-xs:   clamp(0.78rem, 0.76rem + 0.10vw, 0.84rem);
	--text-sm:   clamp(0.86rem, 0.83rem + 0.15vw, 0.94rem);
	--text-base: clamp(1.00rem, 0.96rem + 0.20vw, 1.10rem);
	--text-lg:   clamp(1.18rem, 1.10rem + 0.40vw, 1.40rem);
	--text-xl:   clamp(1.45rem, 1.30rem + 0.75vw, 1.95rem);
	--text-2xl:  clamp(1.85rem, 1.55rem + 1.50vw, 2.85rem);
	--text-3xl:  clamp(2.30rem, 1.80rem + 2.50vw, 4.00rem);
	--text-4xl:  clamp(2.80rem, 2.00rem + 4.00vw, 5.25rem);

	/* ---- Spacing (generous whitespace) -------------------------------- */
	--space-3xs: 0.25rem;
	--space-2xs: 0.5rem;
	--space-xs:  0.75rem;
	--space-s:   1rem;
	--space-m:   1.5rem;
	--space-l:   2.5rem;
	--space-xl:  4rem;
	--space-2xl: 6rem;
	--space-3xl: 9rem;

	/* ---- Layout ------------------------------------------------------- */
	--container-max:   1200px;
	--container-wide:  1440px;
	--container-pad:   clamp(1.25rem, 5vw, 3rem);
	--header-height:   72px;

	/* ---- Form / surface detail ---------------------------------------- */
	--radius-sm: 2px;
	--radius:    4px;
	--radius-lg: 10px;

	--shadow-sm: 0 1px 2px rgba(21, 17, 17, 0.06);
	--shadow:    0 6px 24px rgba(21, 17, 17, 0.08);

	--transition: 160ms ease;

	/* ---- z-index ------------------------------------------------------ */
	--z-header: 100;
	--z-overlay: 200;
}