/**
 * Princess TPG — tokens de diseño.
 * Paleta tomada del CSS del sitio actual de la marca.
 * Contraste: --ptg-rose sobre crema ≈ 3.1:1 (solo títulos grandes y botones);
 * para texto rosa pequeño usa --ptg-rose-dark (≈ 5:1, pasa WCAG AA).
 */
:root {
	/* Color */
	--ptg-rose: #c9748a;
	--ptg-rose-light: #e8a5b5;
	--ptg-rose-pale: #f5dde4;
	--ptg-rose-dark: #a0546a;
	--ptg-gold: #b8973a;
	--ptg-cream: #fdf8f5;
	--ptg-cream-dark: #f5ede8;
	--ptg-white: #ffffff;
	--ptg-text: #3a2a2e;
	--ptg-text-light: #7a5a62;

	--ptg-success: #4f7a5b;
	--ptg-error: #a8403f;
	--ptg-border: color-mix(in srgb, var(--ptg-rose-light) 55%, transparent);
	--ptg-border-soft: color-mix(in srgb, var(--ptg-rose-light) 30%, transparent);

	/* Tipografía */
	--ptg-font-display: "Cinzel", "Trajan Pro", Georgia, serif;
	--ptg-font-script: "Great Vibes", "Apple Chancery", cursive;
	--ptg-font-body: "Cormorant Garamond", "Cormorant", Garamond, Georgia, serif;

	/* Escala modular (≈ 1.25) con mínimo de 18px para cuerpo en móvil */
	--ptg-fs-sm: 1rem;          /* 16px · notas */
	--ptg-fs-base: 1.1875rem;   /* 19px · cuerpo */
	--ptg-fs-md: 1.375rem;      /* 22px */
	--ptg-fs-lg: clamp(1.5rem, 1.2rem + 1.2vw, 2rem);
	--ptg-fs-xl: clamp(1.875rem, 1.4rem + 2vw, 2.75rem);
	--ptg-fs-2xl: clamp(2.25rem, 1.5rem + 3.4vw, 4rem);
	--ptg-fs-script: clamp(1.75rem, 1.5rem + 1vw, 2.25rem);

	--ptg-lh-body: 1.6;
	--ptg-lh-tight: 1.15;
	--ptg-tracking-display: 0.14em;

	/* Espaciado */
	--ptg-space-1: 0.25rem;
	--ptg-space-2: 0.5rem;
	--ptg-space-3: 0.75rem;
	--ptg-space-4: 1rem;
	--ptg-space-5: 1.5rem;
	--ptg-space-6: 2rem;
	--ptg-space-7: 3rem;
	--ptg-space-8: 4.5rem;
	--ptg-section: clamp(3.5rem, 2rem + 6vw, 7rem);
	--ptg-gutter: clamp(1rem, 0.5rem + 2.5vw, 2.5rem);

	/* Contenedores */
	--ptg-container: 1240px;
	--ptg-container-narrow: 820px;

	/* Forma */
	--ptg-radius-sm: 4px;
	--ptg-radius: 6px;
	--ptg-radius-pill: 999px;
	--ptg-shadow: 0 10px 30px -12px rgba(160, 84, 106, 0.28);
	--ptg-shadow-lg: 0 24px 60px -24px rgba(160, 84, 106, 0.38);

	/* Movimiento */
	--ptg-ease: cubic-bezier(0.22, 0.61, 0.36, 1);
	--ptg-dur: 240ms;

	/* Capas */
	--ptg-z-header: 50;
	--ptg-z-bar: 60;
	--ptg-z-overlay: 90;
	--ptg-z-drawer: 100;
	--ptg-z-toast: 110;

	--ptg-header-h: 72px;
	--ptg-mobile-bar-h: 64px;
}

@media (prefers-reduced-motion: reduce) {
	:root {
		--ptg-dur: 0ms;
	}
}
