/*
 * Design tokens — Veneta George Orthodontics.
 *
 * Editorial, warm, feminine: cream page, sand bands, powder-pink accent, near-black ink.
 * High-contrast display serif headings over a clean sans UI.
 *
 * Paired files that MUST change together (AI-INSTRUCTIONS.md "Design Rules"):
 *   theme.json         — editor palette, font families, font sizes
 *   editor-style.css   — heading scale mirror
 */

:root {
	/* Surfaces — warm neutrals, never pure white on large areas. */
	--myco-color-bg: #faf7f4;
	--myco-color-surface: #ede7e2;
	--myco-color-surface-strong: #e2d9d2;
	--myco-color-white: #ffffff;

	/* Ink. */
	--myco-color-text: #1a1a1a;
	--myco-color-muted: #6b6360;
	--myco-color-border: rgba(26, 26, 26, 0.12);

	/* Brand. "primary" = ink (headings, dark UI); "accent" = powder pink (fills). */
	--myco-color-primary: #1a1a1a;
	--myco-color-primary-soft: #3a3634;
	--myco-color-accent: #e3b4b4;
	--myco-color-accent-strong: #c08f8f;
	--myco-color-accent-soft: #f3e3e1;
	--myco-color-accent-2: #6b6360;

	/* Semantic state tokens (form notices) — functional, not identity. */
	--myco-color-success: #4f7a63;
	--myco-color-danger: #a75a5a;

	/* Type. */
	--myco-font-display: "Playfair Display", Georgia, "Times New Roman", serif;
	--myco-font-sans: "Montserrat", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

	--myco-font-size-xs: 0.75rem;
	--myco-font-size-sm: 0.875rem;
	--myco-font-size-base: 1rem;
	--myco-font-size-lg: 1.125rem;
	--myco-font-size-xl: 1.375rem;
	--myco-font-size-2xl: clamp(1.75rem, 3.4vw, 2.5rem);
	--myco-font-size-3xl: clamp(2.25rem, 5.2vw, 4rem);

	--myco-line-height: 1.75;
	--myco-line-height-tight: 1.14;

	/* Uppercase label tracking — nav, eyebrows, buttons. */
	--myco-tracking-wide: 0.14em;
	--myco-tracking-wider: 0.2em;

	/* Layout. */
	--myco-container: 1240px;
	--myco-container-wide: 1440px;
	--myco-container-content: 760px;
	--myco-header-height: 5.5rem;

	--myco-space-2xs: 0.25rem;
	--myco-space-xs: 0.5rem;
	--myco-space-sm: 0.75rem;
	--myco-space-md: 1rem;
	--myco-space-lg: 1.5rem;
	--myco-space-xl: 2rem;
	--myco-space-2xl: 3rem;
	--myco-space-3xl: 4.5rem;
	--myco-space-4xl: 6rem;
	--myco-space-5xl: 8rem;

	/* Radius. The identity is square — buttons and bands use radius-none. */
	--myco-radius-none: 0;
	--myco-radius-sm: 0.125rem;
	--myco-radius-md: 0.25rem;
	--myco-radius-lg: 0.5rem;
	--myco-radius-xl: 0.75rem;
	--myco-radius-pill: 999px;

	--myco-shadow-soft: 0 18px 50px rgba(26, 26, 26, 0.06);
	--myco-shadow-card: 0 24px 60px rgba(26, 26, 26, 0.08);

	--myco-z-header: 50;
	--myco-z-menu: 60;
	--myco-z-modal: 70;

	--myco-transition: 220ms ease;
}