@font-face {
	font-family: "IRANSansX";
	src: url("../fonts/IRANSansXFaNum-UltraLight.woff2") format("woff2");
	font-style: normal;
	font-weight: 200;
	font-display: swap;
}

@font-face {
	font-family: "IRANSansX";
	src: url("../fonts/IRANSansXFaNum-Light.woff2") format("woff2");
	font-style: normal;
	font-weight: 300;
	font-display: swap;
}

@font-face {
	font-family: "IRANSansX";
	src: url("../fonts/IRANSansX-Regular.woff2") format("woff2");
	font-style: normal;
	font-weight: 400;
	font-display: swap;
}

@font-face {
	font-family: "IRANSansX";
	src: url("../fonts/IRANSansX-Medium.woff2") format("woff2");
	font-style: normal;
	font-weight: 500;
	font-display: swap;
}

@font-face {
	font-family: "IRANSansX";
	src: url("../fonts/IRANSansXFaNum-DemiBold.woff2") format("woff2");
	font-style: normal;
	font-weight: 600;
	font-display: swap;
}

@font-face {
	font-family: "IRANSansX";
	src: url("../fonts/IRANSansX-Bold.woff2") format("woff2");
	font-style: normal;
	font-weight: 700;
	font-display: swap;
}

@font-face {
	font-family: "IRANSansX";
	src: url("../fonts/IRANSansXFaNum-ExtraBold.woff2") format("woff2");
	font-style: normal;
	font-weight: 800;
	font-display: swap;
}

@font-face {
	font-family: "IRANSansX";
	src: url("../fonts/IRANSansXFaNum-Black.woff2") format("woff2");
	font-style: normal;
	font-weight: 900;
	font-display: swap;
}

:root {
	--calora-bg: #fafaf8;
	--calora-surface: #ffffff;
	--calora-text: #181818;
	--calora-text-muted: #6b6b67;
	--calora-border: #e8e8e3;
	--calora-primary: #20201e;
	--calora-accent: #8a6248;
	--calora-accent-light: #f2eee8;
	--calora-container: 1280px;
	--calora-radius-sm: 8px;
	--calora-radius-md: 12px;
	--calora-space-1: 4px;
	--calora-space-2: 8px;
	--calora-space-3: 12px;
	--calora-space-4: 16px;
	--calora-space-5: 24px;
	--calora-space-6: 32px;
	--calora-space-7: 48px;
	--calora-space-8: 64px;
	--calora-space-9: 80px;
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
}

body {
	margin: 0;
	direction: rtl;
	background: var(--calora-bg);
	color: var(--calora-text);
	font-family: "IRANSansX", Tahoma, sans-serif;
	font-size: 16px;
	line-height: 1.8;
	text-align: right;
	-webkit-font-smoothing: antialiased;
}

html.is-drawer-open,
body.is-drawer-open {
	overflow: hidden;
	overscroll-behavior: none;
}

img,
svg {
	display: block;
	max-width: 100%;
}

a {
	color: inherit;
	text-decoration: none;
}

button,
input,
select,
textarea {
	font: inherit;
}

button {
	color: inherit;
}

:focus-visible {
	outline: 2px solid var(--calora-accent);
	outline-offset: 3px;
}

.l-container {
	width: min(100% - 32px, var(--calora-container));
	margin-inline: auto;
}

.c-main {
	padding-block: var(--calora-space-8);
}


.c-skip-link {
	position: fixed;
	inset-block-start: 12px;
	inset-inline-start: 12px;
	z-index: 10000;
	padding: 10px 14px;
	border-radius: var(--calora-radius-sm);
	background: var(--calora-primary);
	color: #fff;
	transform: translateY(-160%);
}

.c-skip-link:focus {
	transform: translateY(0);
}

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

@media (min-width: 768px) {
	.l-container {
		width: min(100% - 64px, var(--calora-container));
	}
}
