/*
Theme Name:   Astra Child - Karina
Theme URI:    https://karina-d.com/
Description:  Child theme for Astra (karina-d.com). Global tokens, Vazirmatn font, custom header.
Author:       Karina
Template:     astra
Version:      1.2.3
Text Domain:  astra-child
*/

/* =========================================================================
   1. Fonts — Vazirmatn (Farsi digits), self-hosted. License: assets/fonts/OFL.txt
   ========================================================================= */
@font-face {
	font-family: "Vazirmatn";
	src: url("assets/fonts/Vazirmatn-FD-Regular.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "Vazirmatn";
	src: url("assets/fonts/Vazirmatn-FD-Medium.woff2") format("woff2");
	font-weight: 500;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "Vazirmatn";
	src: url("assets/fonts/Vazirmatn-FD-Bold.woff2") format("woff2");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "Vazirmatn";
	src: url("assets/fonts/Vazirmatn-FD-ExtraBold.woff2") format("woff2");
	font-weight: 800;
	font-style: normal;
	font-display: swap;
}

/* =========================================================================
   2. Design tokens — taken from the approved UI
   ========================================================================= */
:root {
	/* Brand — measured from the approved UI (single source of truth: use these variables only) */
	--kr-primary: #016E86;        /* buttons, links, active menu */
	--kr-primary-hover: #015A6E;  /* button hover */
	--kr-accent: #05ADCE;         /* icons, highlights */
	--kr-light-blue: #73D3E5;     /* map dots, soft highlights */
	--kr-light-gray: #E4E8EB;     /* borders, dividers */

	/* Surfaces */
	--kr-white: #FFFFFF;
	--kr-soft-bg: #F5FAFB;        /* stats bar, light sections */
	--kr-footer: #00556A;         /* footer */
	--kr-topbar-edge: #00687E;    /* top bar gradient: edges */
	--kr-topbar-mid: #038199;     /* top bar gradient: center */

	/* Text */
	--kr-heading: #0B153A;
	--kr-text: #5B6B7A;

	/* Type */
	--kr-font: "Vazirmatn", Tahoma, "Segoe UI", sans-serif;
	--kr-fs-h1: clamp(30px, 3.4vw, 52px);
	--kr-fs-h2: clamp(24px, 2.4vw, 38px);
	--kr-fs-body: clamp(15px, 1.05vw, 17px);

	/* Layout */
	--kr-container: 1520px;
	--kr-gutter: 24px;
	--kr-radius: 8px;
	--kr-radius-lg: 14px;
	--kr-shadow: 0 6px 24px rgba(11, 21, 58, 0.08);
	--kr-transition: 0.2s ease;
}

/* Make Elementor's own widgets use the same font */
body {
	--e-global-typography-primary-font-family: "Vazirmatn";
	--e-global-typography-secondary-font-family: "Vazirmatn";
	--e-global-typography-text-font-family: "Vazirmatn";
	--e-global-typography-accent-font-family: "Vazirmatn";
}

/* =========================================================================
   3. Base
   ========================================================================= */
body,
button,
input,
select,
textarea,
.ast-button,
h1, h2, h3, h4, h5, h6,
.entry-content h1, .entry-content h2, .entry-content h3,
.entry-content h4, .entry-content h5, .entry-content h6 {
	font-family: var(--kr-font) !important;
}

body {
	/* Astra uses overflow-x:hidden, which breaks position:sticky. clip keeps the same effect without it. */
	overflow-x: clip !important;
	color: var(--kr-text);
	font-size: var(--kr-fs-body);
	line-height: 1.9;
}

h1, h2, h3, h4, h5, h6 {
	color: var(--kr-heading);
	line-height: 1.45;
}

a {
	color: var(--kr-primary);
	transition: color var(--kr-transition);
}

.kr-container {
	width: 100%;
	max-width: var(--kr-container);
	margin-inline: auto;
	padding-inline: var(--kr-gutter);
	box-sizing: border-box;
}

/* Buttons */
.kr-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-height: 46px;
	padding: 10px 24px;
	border-radius: var(--kr-radius);
	border: 1.5px solid transparent;
	font-family: var(--kr-font);
	font-size: 15px;
	font-weight: 700;
	line-height: 1;
	text-decoration: none !important;
	white-space: nowrap;
	cursor: pointer;
	transition: background-color var(--kr-transition), color var(--kr-transition), border-color var(--kr-transition), transform var(--kr-transition);
}
.kr-btn:hover { transform: translateY(-1px); }
.kr-btn--primary {
	background: var(--kr-primary);
	color: var(--kr-white) !important;
}
.kr-btn--primary:hover { background: var(--kr-primary-hover); }
.kr-btn--outline {
	background: var(--kr-white);
	color: var(--kr-primary) !important;
	border-color: var(--kr-primary);
}
.kr-btn--outline:hover { background: var(--kr-soft-bg); }
.kr-btn--block { width: 100%; }

.kr-icon { flex-shrink: 0; }

/* Accessibility: visible keyboard focus */
.kr-btn:focus-visible,
.kr-nav a:focus-visible,
.kr-menu-toggle:focus-visible,
.kr-topbar a:focus-visible {
	outline: 2px solid var(--kr-light-blue);
	outline-offset: 2px;
}

/* ===== Custom styles go below ===== */