/**
 * Typography and color tokens.
 */

:root {
	--hr-color-text: #262b4a;
	--hr-color-accent: #A32D59;
	--hr-color-accent-light: #CC1D4A;
	--hr-gradient-accent: linear-gradient(0deg, var(--hr-color-accent) 0%, var(--hr-color-accent-light) 100%);
	--hr-gradient-dark: linear-gradient(0deg, #262B4A 0%, #353E70 100%);
	--hr-gradient-soft-1: linear-gradient(90deg, #a9b8dd 0%, #a790cc 100%);
	--hr-gradient-soft-2: linear-gradient(90deg, #a9b7dd 0%, #a791cd 100%);
	--hr-gradient-soft-3: linear-gradient(90deg, #8c97c1 0%, #866eb3 100%);
	--hr-gradient-soft-4: linear-gradient(90deg, #9dc0e1 0%, #c9a1d2 50%, #5f6ec1 100%);
	--hr-header-height: 86px;
	--hr-header-height-mini: 60px;
	--hr-header-logo-height: 62px;
	--hr-header-logo-height-mini: 48px;
	--hr-header-logo-scale-mini: 0.7742;
	--hr-header-action-size: 2.75rem;
	--hr-header-action-scale-mini: 0.8182;
	--hr-header-actions-gap: clamp(1.5rem, 2.5vw, 2.5rem);
	--hr-shadow-accent: 0 0.2rem 0.6rem rgba(163, 45, 89, 0.5);
	--hr-shadow-dark: 0 0.2rem 0.6rem rgba(53, 62, 112, 0.5);
	--hr-color-accent-tint: color-mix(in srgb, var(--hr-color-accent) 14%, white);
	--hr-color-accent-soft: color-mix(in srgb, var(--hr-color-accent) 12%, transparent);
	--hr-color-nav: #333751;
	--hr-font-size-base: 1rem;
	--hr-line-height-base: 1.3125rem;
	--hr-font-size-lg: 1.125rem;
	--hr-line-height-lg: 1.5rem;
	--hr-font-size-nav: 1.0625rem;
	--hr-font-size-nav-sub: 1rem;
}

body {
	color: var(--hr-color-text);
	font-family: var(--wp--preset--font-family--inter), system-ui, sans-serif;
	font-size: var(--hr-font-size-base);
	line-height: var(--hr-line-height-base);
}

.has-lg-font-size {
	font-size: var(--hr-font-size-lg);
	line-height: var(--hr-line-height-lg);
}

/**
 * Optional Amithen accent — apply manually when needed.
 * Default typography (including all headings) stays Inter via theme.json.
 */
.hr-font-amithen,
.is-style-hr-font-amithen {
	font-family: var(--wp--preset--font-family--amithen), cursive;
	font-weight: 400;
	line-height: 1.2;
}

.hr-gradient-text-accent,
.hr-gradient-text-soft {
	color: transparent;
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

.hr-gradient-text-accent {
	background-image: var(--hr-gradient-accent);
}

.hr-gradient-text-soft--1 {
	background-image: var(--hr-gradient-soft-1);
}

.hr-gradient-text-soft--2 {
	background-image: var(--hr-gradient-soft-2);
}

.hr-gradient-text-soft--3 {
	background-image: var(--hr-gradient-soft-3);
}

.hr-gradient-text-soft--4 {
	background-image: var(--hr-gradient-soft-4);
}