/**
 * ExpertMatrimony design tokens.
 *
 * Hierarchy: maroon + warm neutrals/cream + restrained gold accents + white.
 * Gold (#d49e17) is ~2.4:1 on white: use it for borders/accents, never body text.
 * --emt-text (#67768e) passes AA on white only; use --emt-text-strong on cream.
 *
 * Breakpoints (cannot be custom properties):
 *   ≤ 544px mobile · 545–921px tablet · ≥ 922px desktop (Astra-compatible)
 *   1024px / 767px are respected only where Elementor/plugin layouts need it.
 */

:root {
	/* Brand */
	--emt-primary: #7a1f3d;
	--emt-primary-hover: #5e1830;
	--emt-primary-strong: #8c0931;
	--emt-primary-tint: rgba(122, 31, 61, 0.06);
	--emt-gold: #d49e17;
	--emt-gold-border: #d4a017;
	--emt-gold-soft: rgba(212, 160, 23, 0.45);
	--emt-gold-tint: rgba(212, 158, 23, 0.1);
	--emt-button-yellow: #ffcd57;
	--emt-headline-red: #ca1c1c;

	/* Text */
	--emt-heading: #1e293b;
	--emt-text: #67768e;
	--emt-text-strong: #475569;
	--emt-menu-text: #69696c;
	--emt-muted: #8a94a6;
	--emt-on-primary: #ffffff;

	/* Backgrounds */
	--emt-white: #ffffff;
	--emt-warm-white: #fffdfa;
	--emt-cream: #fdf7f1;
	--emt-soft-bg: #f9f6fe;
	--emt-light-bg: #f2f5f7;

	/* Borders */
	--emt-border: #ece6df;
	--emt-border-strong: #d9d0c6;
	--emt-border-cool: #e5e7eb;
	--emt-divider: rgba(30, 41, 59, 0.08);

	/* Status */
	--emt-success: #15803d;
	--emt-success-bg: #ecfdf5;
	--emt-warning: #b45309;
	--emt-warning-bg: #fffbeb;
	--emt-error: #b91c1c;
	--emt-error-bg: #fef2f2;
	--emt-info: #1d4ed8;
	--emt-info-bg: #eff6ff;

	/* Overlays */
	--emt-overlay: rgba(30, 20, 25, 0.45);
	--emt-overlay-light: rgba(255, 253, 250, 0.94);
	--emt-overlay-brand: rgba(122, 31, 61, 0.88);

	/* Typography */
	--emt-font-body: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	--emt-font-heading: "Plus Jakarta Sans", "Inter", system-ui, sans-serif;
	--emt-font-ui: "Poppins", "Inter", system-ui, sans-serif;

	--emt-fs-2xs: 0.611rem;  /* 11px at the 18px root */
	--emt-fs-xs: 0.722rem;   /* 13px */
	--emt-fs-sm: 0.778rem;   /* 14px */
	--emt-fs-ui: 0.833rem;   /* 15px */
	--emt-fs-base: 1rem;     /* 18px */
	--emt-fs-md: 1.111rem;   /* 20px */
	--emt-fs-lg: 1.333rem;   /* 24px */
	--emt-fs-xl: clamp(1.5rem, 1.2rem + 1vw, 1.778rem);    /* 27–32px */
	--emt-fs-2xl: clamp(1.778rem, 1.3rem + 1.6vw, 2.222rem); /* 32–40px */
	--emt-fs-3xl: clamp(2.222rem, 1.6rem + 2.2vw, 2.889rem); /* 40–52px */

	--emt-fw-regular: 400;
	--emt-fw-medium: 500;
	--emt-fw-semibold: 600;
	--emt-fw-bold: 700;

	--emt-lh-body: 1.65;
	--emt-lh-heading: 1.25;
	--emt-lh-tight: 1.1;
	--emt-tracking-caps: 0.08em;

	/* Layout */
	--emt-container: 1200px;
	--emt-container-wide: 1240px;
	--emt-container-narrow: 750px;
	--emt-gutter: 32px;
	--emt-section-spacing: clamp(3.5rem, 7vw, 6rem);
	--emt-stack: 1rem;

	/* Shape */
	--emt-radius-xs: 4px;
	--emt-radius-sm: 8px;
	--emt-radius-md: 14px;
	--emt-radius-lg: 20px;
	--emt-radius-pill: 999px;

	/* Elevation (restrained) */
	--emt-shadow-xs: 0 1px 2px rgba(30, 41, 59, 0.05);
	--emt-shadow-sm: 0 2px 8px rgba(30, 41, 59, 0.06);
	--emt-shadow-md: 0 10px 30px rgba(30, 41, 59, 0.08);
	--emt-shadow-header: 0 1px 0 rgba(30, 41, 59, 0.06), 0 6px 18px rgba(30, 41, 59, 0.05);
	--emt-shadow-drawer: -12px 0 40px rgba(30, 41, 59, 0.12);

	/* Header */
	--emt-header-height: 80px;
	--emt-header-height-scrolled: 64px;
	--emt-header-bg: var(--emt-white);
	--emt-header-bg-scrolled: rgba(255, 253, 250, 0.97);
	--emt-logo-width: clamp(200px, 22vw, 300px);
	--emt-logo-width-scrolled: clamp(180px, 18vw, 250px);
	--emt-logo-width-mobile: clamp(150px, 48vw, 210px);
	--emt-logo-max-height: 60px;

	/* Stacking (Popup Maker uses 1999999999; theme stays below it) */
	--emt-z-header: 1000;
	--emt-z-drawer: 100000;

	/* Motion */
	--emt-duration: 180ms;
	--emt-duration-slow: 260ms;
	--emt-ease: cubic-bezier(0.4, 0, 0.2, 1);

	/* Focus */
	--emt-focus-color: var(--emt-primary);
	--emt-focus-ring: 2px solid var(--emt-focus-color);
	--emt-focus-offset: 3px;
}