/* Custom redesign layer — loads after all Elementor/theme CSS.
   Overrides the Elementor global kit design tokens (--e-global-*) so every
   page that consumes them updates automatically, plus adds component
   polish and scroll-reveal support. See /skills/redesign-skill and
   /skills/minimalist-skill for the design system this implements. */

/* ---------- Design tokens ---------- */
body.elementor-kit-413 {
	/* Single warm bronze accent replaces the mixed blue/green/orange/yellow set */
	--e-global-color-primary: #a9824f;
	--e-global-color-accent: #a9824f;
	--e-global-color-0175bfe: #a9824f;

	/* Warm off-white canvas, warm charcoal text */
	--e-global-color-secondary: #f7f6f3;
	--e-global-color-text: #34302b;
	--e-global-color-9459ca4: #24211d;
	--e-global-color-843c2fb: #ffffff;

	/* Remaining semantic colors desaturated toward the warm neutral family */
	--e-global-color-38cecf1: #f2efe8;
	--e-global-color-727d5b8: #7c9160;
	--e-global-color-4f9340e: #b8823e;
	--e-global-color-6ab7c87: #e3c988;
	--e-global-color-52da84f: #8a8479;

	/* Typography: editorial serif for headings, clean geometric sans for body */
	--e-global-typography-primary-font-family: "Fraunces";
	--e-global-typography-primary-font-weight: 600;
	--e-global-typography-secondary-font-family: "Fraunces";
	--e-global-typography-secondary-font-weight: 500;
	--e-global-typography-text-font-family: "Outfit";
	--e-global-typography-text-font-weight: 400;
	--e-global-typography-accent-font-family: "Outfit";
	--e-global-typography-accent-font-weight: 500;
	--e-global-typography-04561b9-font-family: "Fraunces";
	--e-global-typography-f4de919-font-family: "Fraunces";
	--e-global-typography-ad7a5ff-font-family: "Fraunces";
	--e-global-typography-ef54e41-font-family: "Outfit";

	background-color: var(--e-global-color-secondary);
	color: var(--e-global-color-text);
}

/* ---------- Typography polish ---------- */
body.elementor-kit-413 h1,
body.elementor-kit-413 h2,
body.elementor-kit-413 h3,
body.elementor-kit-413 .elementor-heading-title {
	letter-spacing: -0.02em;
	line-height: 1.15;
	text-wrap: balance;
}

body.elementor-kit-413 p,
body.elementor-kit-413 .elementor-widget-text-editor {
	line-height: 1.7;
	text-wrap: pretty;
}

/* ---------- Surfaces & shadows ---------- */
body.elementor-kit-413 .elementor-widget-image-box .elementor-image-box-wrapper,
body.elementor-kit-413 .elementor-widget-icon-box .elementor-icon-box-wrapper,
body.elementor-kit-413 .elementor-widget-call-to-action .elementor-cta,
body.elementor-kit-413 .elementor-widget-testimonial .elementor-testimonial-wrapper {
	transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.35s ease;
}

body.elementor-kit-413 [class*="elementor-widget"] [style*="box-shadow"] {
	box-shadow: 0 1px 3px rgba(52, 48, 43, 0.06), 0 8px 24px rgba(52, 48, 43, 0.05) !important;
}

/* ---------- Buttons & links ---------- */
body.elementor-kit-413 .elementor-button,
body.elementor-kit-413 a.elementor-button,
body.elementor-kit-413 button.elementor-button {
	transition: transform 0.2s cubic-bezier(0.16, 1, 0.3, 1), filter 0.2s ease, box-shadow 0.2s ease;
}

body.elementor-kit-413 .elementor-button:hover,
body.elementor-kit-413 a.elementor-button:hover,
body.elementor-kit-413 button.elementor-button:hover {
	transform: translateY(-2px);
	filter: brightness(1.06);
}

body.elementor-kit-413 .elementor-button:active,
body.elementor-kit-413 a.elementor-button:active,
body.elementor-kit-413 button.elementor-button:active {
	transform: scale(0.98) translateY(0);
}

body.elementor-kit-413 a:not(.elementor-button) {
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
	transition: color 0.2s ease;
}

/* ---------- Focus visibility (accessibility) ---------- */
body.elementor-kit-413 a:focus-visible,
body.elementor-kit-413 button:focus-visible,
body.elementor-kit-413 input:focus-visible,
body.elementor-kit-413 textarea:focus-visible {
	outline: 2px solid var(--e-global-color-primary);
	outline-offset: 2px;
}

/* ---------- Smooth scroll ---------- */
html {
	scroll-behavior: smooth;
}

/* ---------- Scroll reveal (classes are added at runtime by custom-animations.js;
   if JS never runs, elements simply never receive these classes and render normally) ---------- */
.reveal-init {
	opacity: 0;
	transform: translateY(20px);
	transition: opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1), transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
	transition-delay: calc(var(--reveal-i, 0) * 70ms);
}

.reveal-init.is-visible {
	opacity: 1;
	transform: none;
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	.reveal-init,
	body.elementor-kit-413 .elementor-button:hover,
	body.elementor-kit-413 [class*="elementor-widget"] {
		transition: none !important;
		transform: none !important;
	}

	.reveal-init {
		opacity: 1;
	}
}
