/*
 * Theme: Modern (default)
 * Design tokens only — no layout or component rules belong in this file.
 * Every section/component should consume these variables so new themes
 * (variables-wicked.css, variables-dark.css) can be swapped in from the
 * Customizer without touching markup or other stylesheets.
 */

:root {
	/* Brand */
	--color-primary: #1E56E8;
	--color-primary-dark: #143FAE;
	--color-primary-light: #E8EFFE;
	--color-accent: #2F5D9F;
	--color-accent-dark: #24487F;
	--color-accent-light: #E8EFFE;

	/* Feedback */
	--color-success: #16A34A;
	--color-success-light: #E8F8EE;
	--color-warning: #F59E0B;
	--color-error: #DC2626;

	/* Neutrals */
	--color-bg: #FFFFFF;
	--color-bg-alt: #F5F7FA;
	--color-surface: #FFFFFF;
	--color-text: #161B22;
	--color-text-muted: #5B6472;
	--color-text-inverse: #FFFFFF;
	--color-border: #E3E7ED;

	/* Header / Footer */
	--color-header-bg: #FFFFFF;
	--color-header-text: #161B22;
	--color-footer-bg: #101828;
	--color-footer-text: #C9CFDA;
	--color-footer-heading: #FFFFFF;
	--color-footer-border: #1F2937;

	/* Section backgrounds — one per template-parts/sections/*.php file */
	--bg-section-hero: linear-gradient(180deg, #EEF3FF 0%, #FFFFFF 100%);
	--bg-section-trust-bar: #101828;
	--color-trust-bar-text: #FFFFFF;
	--color-trust-bar-icon: var(--color-accent);
	--bg-section-services: #FFFFFF;
	--bg-section-why-us: var(--color-bg-alt);
	--bg-section-insurance: #FFFFFF;
	--bg-section-reviews: var(--color-bg-alt);
	--bg-section-faq: #FFFFFF;
	--bg-section-service-area: var(--color-bg-alt);
	--bg-section-final-cta: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%);
	--color-final-cta-text: #FFFFFF;

	/* Typography */
	--font-heading: 'Poppins', 'Segoe UI', system-ui, sans-serif;
	--font-body: 'Inter', 'Segoe UI', system-ui, sans-serif;

	--fs-h1: clamp(2.1rem, 1.7rem + 2vw, 3rem);
	--fs-h2: clamp(1.6rem, 1.4rem + 1vw, 2.25rem);
	--fs-h3: clamp(1.25rem, 1.15rem + 0.5vw, 1.5rem);
	--fs-h4: 1.125rem;
	--fs-body: 1rem;
	--fs-small: 0.875rem;
	--fs-eyebrow: 0.8125rem;

	--fw-regular: 400;
	--fw-medium: 500;
	--fw-semibold: 600;
	--fw-bold: 700;

	--line-height-base: 1.6;
	--line-height-heading: 1.2;
	--letter-spacing-eyebrow: 0.08em;

	/* Spacing scale */
	--space-3xs: 0.25rem;
	--space-2xs: 0.5rem;
	--space-xs: 0.75rem;
	--space-sm: 1rem;
	--space-md: 1.5rem;
	--space-lg: 2rem;
	--space-xl: 3rem;
	--space-2xl: 4rem;
	--space-3xl: 6rem;

	--section-padding-y: var(--space-3xl);
	--section-padding-y-sm: var(--space-2xl);

	/* Shape */
	--radius-sm: 6px;
	--radius-md: 12px;
	--radius-lg: 20px;
	--radius-full: 999px;

	/* Elevation */
	--shadow-sm: 0 1px 2px rgba(16, 24, 40, 0.06);
	--shadow-md: 0 4px 16px rgba(16, 24, 40, 0.08);
	--shadow-lg: 0 12px 32px rgba(16, 24, 40, 0.12);

	/* Layout */
	--container-max-width: 1200px;
	--container-padding-x: var(--space-md);
	--header-height: 76px;

	/* Buttons */
	--btn-radius: var(--radius-full);
	--btn-padding-y: 0.85em;
	--btn-padding-x: 1.75em;
	--btn-font-weight: var(--fw-semibold);
	--btn-transition: 160ms ease;

	--btn-primary-bg: var(--color-accent);
	--btn-primary-bg-hover: var(--color-accent-dark);
	--btn-primary-text: #FFFFFF;

	--btn-secondary-bg: var(--color-primary);
	--btn-secondary-bg-hover: var(--color-primary-dark);
	--btn-secondary-text: #FFFFFF;

	--btn-outline-border: var(--color-border);
	--btn-outline-text: var(--color-text);
	--btn-outline-bg-hover: var(--color-bg-alt);

	--btn-ghost-text: var(--color-primary);
	--btn-ghost-bg-hover: var(--color-primary-light);

	/* Forms */
	--input-bg: #FFFFFF;
	--input-border: var(--color-border);
	--input-border-focus: var(--color-primary);
	--input-radius: var(--radius-md);
	--input-text: var(--color-text);
	--input-placeholder: #8A93A3;
	--input-padding-y: 0.75em;
	--input-padding-x: 1em;
	--input-label-color: var(--color-text);

	/* Cards */
	--card-bg: #FFFFFF;
	--card-border: var(--color-border);
	--card-radius: var(--radius-lg);
	--card-shadow: var(--shadow-sm);
	--card-shadow-hover: var(--shadow-md);
}
