/**
 * Deccan Trendz — design tokens.
 * Single source of truth for colour, type, spacing, motion and layout.
 */

:root {
	/* --- Brand palette ------------------------------------------------ */
	--dt-black: #0a0a0a;
	--dt-black-900: #050505;
	--dt-ink: #14110d;
	--dt-graphite: #1c1a17;
	--dt-smoke: #2a2622;

	--dt-ivory: #f6f1e7;
	--dt-off-white: #faf7f0;
	--dt-paper: #ede6d6;

	--dt-champagne: #c9a86a;
	--dt-champagne-bright: #e6cf9e;
	--dt-champagne-deep: #a9884b;

	--dt-line: rgba(246, 241, 231, 0.14);
	--dt-line-strong: rgba(246, 241, 231, 0.28);

	/* --- Semantic roles (light context = dark UI on ivory) ---------- */
	--dt-bg: var(--dt-black);
	--dt-bg-alt: var(--dt-graphite);
	--dt-surface: var(--dt-off-white);
	--dt-text: var(--dt-ivory);
	--dt-text-muted: rgba(246, 241, 231, 0.68);
	--dt-text-on-light: var(--dt-ink);
	--dt-accent: var(--dt-champagne);
	--dt-accent-hover: var(--dt-champagne-bright);
	--dt-focus: var(--dt-champagne-bright);

	/* --- Typography ------------------------------------------------- */
	--dt-font-display: "Cormorant Garamond", "Times New Roman", Georgia, serif;
	--dt-font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

	--dt-fs-eyebrow: 0.75rem;
	--dt-fs-body: clamp(1rem, 0.95rem + 0.25vw, 1.125rem);
	--dt-fs-lead: clamp(1.125rem, 1rem + 0.6vw, 1.375rem);
	--dt-fs-h3: clamp(1.5rem, 1.2rem + 1.4vw, 2.25rem);
	--dt-fs-h2: clamp(2rem, 1.4rem + 3vw, 3.75rem);
	--dt-fs-h1: clamp(2.75rem, 1.6rem + 5.6vw, 6.5rem);

	--dt-lh-tight: 1.02;
	--dt-lh-snug: 1.2;
	--dt-lh-body: 1.6;
	--dt-tracking-eyebrow: 0.34em;
	--dt-tracking-wide: 0.06em;
	--dt-tracking-button: 0.14em;

	/* --- Spacing scale -------------------------------------------- */
	--dt-space-3xs: 0.25rem;
	--dt-space-2xs: 0.5rem;
	--dt-space-xs: 0.75rem;
	--dt-space-sm: 1rem;
	--dt-space-md: 1.5rem;
	--dt-space-lg: 2.5rem;
	--dt-space-xl: 4rem;
	--dt-space-2xl: 6rem;
	--dt-space-3xl: clamp(6rem, 4rem + 10vw, 12rem);

	--dt-section-y: clamp(5rem, 3rem + 9vw, 10.5rem);

	/* --- Layout -------------------------------------------------- */
	--dt-container: 1360px;
	--dt-container-narrow: 900px;
	--dt-gutter: clamp(1.25rem, 0.5rem + 3vw, 3.5rem);
	--dt-header-h: 88px;

	/* --- Radius / border --------------------------------------- */
	--dt-radius-sm: 2px;
	--dt-radius-md: 4px;
	--dt-radius-lg: 10px;

	/* --- Elevation -------------------------------------------- */
	--dt-shadow-soft: 0 20px 60px -20px rgba(0, 0, 0, 0.55);
	--dt-shadow-lift: 0 50px 130px -28px rgba(0, 0, 0, 0.78), 0 8px 30px -12px rgba(0, 0, 0, 0.5);
	--dt-shadow-frame: 0 60px 140px -30px rgba(0, 0, 0, 0.82), 0 0 0 1px rgba(201, 168, 106, 0.16), inset 0 0 60px -20px rgba(0, 0, 0, 0.65);

	/* --- Motion --------------------------------------------- */
	--dt-ease: cubic-bezier(0.22, 1, 0.36, 1);
	--dt-ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
	--dt-dur-fast: 180ms;
	--dt-dur-base: 320ms;
	--dt-dur-slow: 620ms;

	/* --- Z-index ------------------------------------------- */
	--dt-z-header: 100;
	--dt-z-nav: 200;
	--dt-z-overlay: 300;
}

@media (prefers-reduced-motion: reduce) {
	:root {
		--dt-dur-fast: 1ms;
		--dt-dur-base: 1ms;
		--dt-dur-slow: 1ms;
	}
}