/**
 * Mahasakthi Theme — design tokens & fonts
 *
 * Change palette/type/spacing here. Component CSS should reference these variables only.
 */

@font-face {
	font-family: "Cormorant Garamond";
	src: url("../fonts/cormorant-garamond-latin-400.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Cormorant Garamond";
	src: url("../fonts/cormorant-garamond-latin-600.woff2") format("woff2");
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Source Serif 4";
	src: url("../fonts/source-serif-4-latin-400.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Source Serif 4";
	src: url("../fonts/source-serif-4-latin-600.woff2") format("woff2");
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Source Sans 3";
	src: url("../fonts/source-sans-3-latin-400.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Source Sans 3";
	src: url("../fonts/source-sans-3-latin-600.woff2") format("woff2");
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Noto Serif Tamil";
	src: url("../fonts/noto-serif-tamil-400.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Noto Serif Tamil";
	src: url("../fonts/noto-serif-tamil-600.woff2") format("woff2");
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Noto Sans Tamil";
	src: url("../fonts/noto-sans-tamil-400.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Noto Sans Tamil";
	src: url("../fonts/noto-sans-tamil-500.woff2") format("woff2");
	font-weight: 500;
	font-style: normal;
	font-display: swap;
}

:root {
	/* Brand / semantic colour roles */
	--ms-color-primary: #7a1f1f;
	--ms-color-primary-deep: #5c1515;
	--ms-color-secondary: #4a5d4e;
	--ms-color-accent: #b8954a;
	--ms-color-accent-soft: #d4bc7a;

	/* Surfaces */
	--ms-color-bg: #f7f1e8;
	--ms-color-bg-soft: #efe6d8;
	--ms-color-surface: #fffaf3;
	--ms-color-surface-dark: #1c1410;

	/* Text */
	--ms-color-ink: #1c1410;
	--ms-color-ink-muted: #5a4a3d;
	--ms-color-ink-inverse: #fffaf3;

	/* Legacy aliases (same tokens — keep existing CSS working) */
	--ms-color-maroon: var(--ms-color-primary);
	--ms-color-maroon-deep: var(--ms-color-primary-deep);
	--ms-color-gold: var(--ms-color-accent);
	--ms-color-gold-soft: var(--ms-color-accent-soft);
	--ms-color-sage: var(--ms-color-secondary);

	--ms-color-border: rgba(28, 20, 16, 0.12);
	--ms-color-border-strong: rgba(28, 20, 16, 0.22);
	--ms-color-overlay: rgba(28, 20, 16, 0.55);

	/* Typography */
	--ms-font-display: "Cormorant Garamond", "Noto Serif Tamil", Georgia, serif;
	--ms-font-body: "Source Serif 4", "Noto Serif Tamil", Georgia, serif;
	--ms-font-ui: "Source Sans 3", "Noto Sans Tamil", system-ui, sans-serif;

	--ms-text-xs: 0.875rem;
	--ms-text-sm: 1rem;
	--ms-text-base: 1.0625rem;
	--ms-text-lg: 1.2rem;
	--ms-text-xl: clamp(1.85rem, 3.2vw, 2.7rem);
	--ms-text-hero: clamp(2.65rem, 6.8vw, 4.75rem);
	--ms-leading: 1.8;
	--ms-leading-tight: 1.18;
	--ms-leading-tamil: 1.9;

	/* Spacing scale */
	--ms-space-1: 0.5rem;
	--ms-space-2: 1rem;
	--ms-space-3: 1.5rem;
	--ms-space-4: 2rem;
	--ms-space-5: 3rem;
	--ms-space-6: 4.5rem;
	--ms-space-7: 6rem;
	--ms-space-8: 8rem;
	--ms-space-section: clamp(3.375rem, 2.2rem + 5vw, 6.875rem);

	/* Radius & elevation */
	--ms-radius-sm: 8px;
	--ms-radius: 12px;
	--ms-radius-lg: 20px;
	--ms-radius-pill: 999px;
	--ms-shadow: 0 12px 40px rgba(28, 20, 16, 0.08);
	--ms-shadow-soft: 0 6px 24px rgba(28, 20, 16, 0.06);

	/* Layout */
	--ms-container: 70rem;
	--ms-container-narrow: 42rem;
	--ms-header-h: 5.25rem;

	/* Motion */
	--ms-ease: cubic-bezier(0.22, 1, 0.36, 1);
	--ms-transition: 220ms var(--ms-ease);
	--ms-transition-slow: 480ms var(--ms-ease);
	--ms-reveal-distance: 1.25rem;
}

html.lang-ta,
body.lang-ta {
	--ms-font-display: "Noto Serif Tamil", "Cormorant Garamond", Georgia, serif;
	--ms-font-body: "Noto Serif Tamil", "Source Serif 4", Georgia, serif;
	--ms-font-ui: "Noto Sans Tamil", "Source Sans 3", system-ui, sans-serif;
	--ms-leading: var(--ms-leading-tamil);
}

@media (min-width: 1024px) {
	:root {
		--ms-text-base: 1.125rem;
		--ms-header-h: 5.6rem;
	}
}