/*
Theme Name:       Argon Sanat
Theme URI:        https://www.argonsanat.com/
Description:      Premium industrial WordPress theme for Argon Sanat Sepahan — engineering, manufacturing, stainless steel tanks, pressure vessels and industrial equipment.
Version:          2.2.0
Author:           Hooshiar Movahed
Author URI:       https://agra-itco.com/
Author Company:   Agra
Text Domain:      argon_sanat
*/



:root {
	/* ---------- Brand palette ---------------------------------------- */
	--argon-bg: #090c12;            /* page surface, navy-tinted graphite */
	--argon-bg-deep: #05070b;
	--argon-surface: #101520;
	--argon-surface-2: #161d2a;
	--argon-surface-3: #1d2635;
	--argon-line: #1d2634;
	--argon-line-soft: #2a3547;
	--argon-line-strong: #3a4759;

	--argon-ink: #eef3f9;
	--argon-ink-soft: #a9b8ca;
	--argon-ink-mute: #78889c;
	--argon-ink-faint: #566477;

	/* Stainless-steel / silver from the logotype */
	--argon-steel: #c3d2e3;
	--argon-steel-2: #8b9cb4;

	/* Accent: steel blue taken from the logo and slogan artwork */
	--argon-accent: #79b4ea;
	--argon-accent-2: #4d86c9;
	--argon-accent-deep: #2b5a94;
	--argon-accent-alt: #67d3e6;
	--argon-accent-mute: rgba(121, 180, 234, 0.14);
	--argon-accent-line: rgba(121, 180, 234, 0.32);
	--argon-accent-soft: rgba(121, 180, 234, 0.07);
	--argon-glow: rgba(90, 150, 220, 0.34);
	--argon-on-accent: #06121f;

	/* ---------- Typography ----------------------------------------- */
	--argon-font-sans: 'Vazirmatn', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
	--argon-font-arabic: 'Vazirmatn', 'IRANSans', 'Vazir', Tahoma, system-ui, sans-serif;
	--argon-font-heading: 'Estedad', 'Vazirmatn', system-ui, -apple-system, sans-serif;

	/* Fluid type scale — no media queries needed for legibility */
	--argon-text-xs: clamp(0.75rem, 0.735rem + 0.08vw, 0.8125rem);
	--argon-text-sm: clamp(0.8125rem, 0.79rem + 0.12vw, 0.875rem);
	--argon-text-base: clamp(0.9375rem, 0.915rem + 0.14vw, 1rem);
	--argon-text-md: clamp(1rem, 0.96rem + 0.2vw, 1.0625rem);
	--argon-text-lg: clamp(1.0625rem, 1rem + 0.32vw, 1.1875rem);
	--argon-text-xl: clamp(1.1875rem, 1.08rem + 0.55vw, 1.4375rem);
	--argon-text-2xl: clamp(1.4rem, 1.2rem + 1vw, 1.9rem);
	--argon-text-3xl: clamp(1.7rem, 1.35rem + 1.75vw, 2.5rem);
	--argon-text-4xl: clamp(1.95rem, 1.35rem + 3vw, 3.4rem);
	--argon-text-5xl: clamp(2.05rem, 1.25rem + 3.6vw, 3.75rem);

	font-size: 100%;
	color: var(--argon-ink);

	/* ---------- Layout --------------------------------------------- */
	--argon-container: 1240px;
	--argon-max-width: 1440px;
	--argon-gutter: clamp(1.125rem, 3vw, 2.5rem);
	--argon-lead-width: 62ch;
	--argon-grid-gap: clamp(1rem, 1.8vw, 1.75rem);
	--argon-section-y: clamp(3.5rem, 7vw, 6.5rem);

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

	/* ---------- Borders ------------------------------------------- */
	--argon-radius-xs: 8px;
	--argon-radius-sm: 12px;
	--argon-radius: 16px;
	--argon-radius-lg: 22px;
	--argon-radius-xl: 32px;
	--argon-radius-pill: 999px;

	/* ---------- Shadows ------------------------------------------- */
	--argon-shadow-sm: 0 1px 2px rgba(3, 6, 12, 0.5), 0 4px 14px -8px rgba(3, 6, 12, 0.7);
	--argon-shadow: 0 2px 4px rgba(3, 6, 12, 0.4), 0 26px 50px -30px rgba(3, 6, 12, 0.9);
	--argon-shadow-lg: 0 44px 90px -46px rgba(2, 4, 9, 0.95);
	--argon-shadow-glow: 0 22px 52px -24px var(--argon-glow);
	--argon-ring-inset: inset 0 1px 0 rgba(255, 255, 255, 0.05);

	/* ---------- Transitions -------------------------------------- */
	--argon-ease: cubic-bezier(0.22, 0.61, 0.36, 1);
	--argon-motion: 200ms var(--argon-ease);
	--argon-motion-slow: 420ms var(--argon-ease);

	/* ---------- Misc -------------------------------------------- */
	--argon-accessible-border: 1px;
}

/* ============================================================
   Base resets
   ============================================================ */

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

html {
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
	scroll-behavior: smooth;
	font-family: var(--argon-font-sans);
	scrollbar-color: var(--argon-line-strong) var(--argon-bg-deep);
}

body {
	margin: 0;
	background-color: var(--argon-bg);
	color: var(--argon-ink);
	font-size: var(--argon-text-base);
	line-height: 1.75;
	overflow-x: hidden;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/* Slim, on-brand scrollbars for the dark shell */
* {
	scrollbar-width: thin;
}

*::-webkit-scrollbar {
	width: 10px;
	height: 10px;
}

*::-webkit-scrollbar-track {
	background: var(--argon-bg-deep);
}

*::-webkit-scrollbar-thumb {
	background: var(--argon-line-soft);
	border: 2px solid var(--argon-bg-deep);
	border-radius: var(--argon-radius-pill);
}

*::-webkit-scrollbar-thumb:hover {
	background: var(--argon-line-strong);
}

::selection {
	background: var(--argon-accent);
	color: var(--argon-on-accent);
}

/* ============================================================
   Typography defaults
   ============================================================ */

p,
li,
figcaption {
	margin: 0;
}

button,
input,
optgroup,
select,
textarea {
	font-family: inherit;
	font-size: inherit;
	line-height: inherit;
}

h1, h2, h3, h4, h5, h6 {
	margin: 0;
	font-family: var(--argon-font-heading);
	font-weight: 700;
	line-height: 1.22;
	color: var(--argon-ink);
	letter-spacing: -0.022em;
	text-wrap: balance;
}

/* Persian does not tolerate negative tracking, and it needs more leading. */
[dir="rtl"] h1,
[dir="rtl"] h2,
[dir="rtl"] h3,
[dir="rtl"] h4,
[dir="rtl"] h5,
[dir="rtl"] h6 {
	letter-spacing: normal;
	line-height: 1.4;
	font-size: var(--argon-text-2xl);
	margin-bottom: 0.5em;
}

a,
button {
	color: inherit;
}

a {
	text-decoration: none;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
[tabindex]:focus-visible {
	outline: 2px solid var(--argon-accent);
	outline-offset: 3px;
	border-radius: var(--argon-radius-xs);
}

img,
picture,
video,
svg {
	display: block;
	max-width: 100%;
	height: auto;
}

svg {
	fill: none;
}

ul,
ol {
	margin: 0;
	padding-left: 1.5em;
}

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

/* Remove the native search decoration so inputs match the design system. */
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
	appearance: none;
}

/* ============================================================
   Layout
   ============================================================ */

.wrap {
	max-width: var(--argon-max-width);
	margin-inline: auto;
	padding-inline: var(--argon-gutter);
}

.container {
	width: 100%;
	max-width: var(--argon-container);
	margin-inline: auto;
	padding-inline: var(--argon-gutter);
}

.grid {
	display: grid;
	gap: var(--argon-grid-gap);
}

/* ============================================================
   Color helpers
   ============================================================ */

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

.visually-hidden-focusable:not(:focus):not(:focus-within) {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.text-ink { color: var(--argon-ink); }
.text-soft { color: var(--argon-ink-soft); }
.text-mute { color: var(--argon-ink-mute); }
.text-faint { color: var(--argon-ink-faint); }
.text-accent { color: var(--argon-accent); }
.text-accent-mute { color: var(--argon-accent-mute); }
.text-accent-2 { color: var(--argon-accent-2); }

/* ============================================================
   Buttons
   ============================================================ */

.btn {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5em;
	padding: 0.8em 1.6em;
	font-family: var(--argon-font-sans);
	font-size: var(--argon-text-sm);
	font-weight: 600;
	letter-spacing: 0.005em;
	line-height: 1.1;
	border: var(--argon-accessible-border) solid transparent;
	border-radius: var(--argon-radius-pill);
	cursor: pointer;
	white-space: nowrap;
	text-decoration: none;
	transition: background var(--argon-motion), color var(--argon-motion),
		border-color var(--argon-motion), box-shadow var(--argon-motion),
		transform var(--argon-motion);
}

[dir="rtl"] .btn {
	letter-spacing: normal;
}

.btn svg {
	transition: transform var(--argon-motion);
}

.btn:hover svg {
	transform: translateX(2px);
}

[dir="rtl"] .btn:hover svg {
	transform: translateX(-2px);
}

.btn:active {
	transform: translateY(1px);
}

.btn-primary {
	background-image: linear-gradient(135deg, var(--argon-accent) 0%, var(--argon-accent-alt) 120%);
	background-color: var(--argon-accent);
	color: var(--argon-on-accent);
	border-color: transparent;
	box-shadow: var(--argon-shadow-sm);
}

.btn-primary:hover {
	background-image: linear-gradient(135deg, #8ec3f3 0%, #79dcea 120%);
	box-shadow: var(--argon-shadow-glow);
	transform: translateY(-1px);
}

.btn-ghost {
	background: transparent;
	color: var(--argon-ink);
	border-color: var(--argon-line-soft);
}

.btn-ghost:hover {
	background: var(--argon-surface-2);
	border-color: var(--argon-line-strong);
	color: var(--argon-ink);
}

.btn-inverse {
	background: var(--argon-accent-soft);
	color: var(--argon-accent);
	border-color: var(--argon-accent-line);
}

.btn-inverse:hover {
	background: var(--argon-accent-mute);
	border-color: var(--argon-accent);
	color: #cfe4fb;
}

.btn-lg {
	padding: 1em 2em;
	font-size: var(--argon-text-base);
}

.btn-sm {
	padding: 0.6em 1.15em;
	font-size: var(--argon-text-xs);
}

.btn-block {
	width: 100%;
}

/* ============================================================
   Form basics
   ============================================================ */

.field {
	margin-bottom: 1.25rem;
}

.field label,
.field legend {
	display: block;
	font-size: var(--argon-text-sm);
	font-weight: 600;
	color: var(--argon-ink-soft);
	margin-bottom: 0.5rem;
}

.field input[type="text"],
.field input[type="email"],
.field input[type="tel"],
.field input[type="url"],
.field input[type="number"],
.field input[type="search"],
.field input[type="password"],
.field textarea,
.field select {
	display: block;
	width: 100%;
	min-height: 3rem;
	padding: 0.8rem 1.1rem;
	background: var(--argon-surface);
	color: var(--argon-ink);
	border: 1px solid var(--argon-line-soft);
	border-radius: var(--argon-radius-sm);
	transition: border-color var(--argon-motion), box-shadow var(--argon-motion), background var(--argon-motion);
}

.field input::placeholder,
.field textarea::placeholder {
	color: var(--argon-ink-faint);
}

.field input:hover,
.field textarea:hover,
.field select:hover {
	border-color: var(--argon-line-strong);
}

.field input:focus,
.field textarea:focus,
.field select:focus {
	background: var(--argon-surface-2);
	border-color: var(--argon-accent);
	box-shadow: 0 0 0 4px var(--argon-accent-soft);
	outline: none;
}

.field textarea {
	resize: vertical;
	min-height: 6rem;
}

.field .help {
	display: block;
	font-size: var(--argon-text-xs);
	color: var(--argon-ink-mute);
	margin-top: 0.4rem;
}

.field .required {
	color: var(--argon-accent);
}

.field.error input,
.field.error textarea,
.field.error select {
	border-color: #e0705a;
	box-shadow: 0 0 0 4px rgba(224, 112, 90, 0.12);
}

/* ============================================================
   Headings and lead text
   ============================================================ */

.lead {
	font-size: var(--argon-text-lg);
	line-height: 1.8;
	color: var(--argon-ink-soft);
	max-width: var(--argon-lead-width);
	text-wrap: pretty;
}

.section-title {
	font-family: var(--argon-font-heading);
	font-size: var(--argon-text-3xl);
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: -0.025em;
}

.section-eyebrow,
.eyebrow {
	font-size: var(--argon-text-xs);
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--argon-accent);
	font-weight: 600;
}

[dir="rtl"] .section-eyebrow,
[dir="rtl"] .eyebrow {
	letter-spacing: normal;
	text-transform: none;
	font-size: var(--argon-text-sm);
}

/* ============================================================
   Divider / engineering line
   ============================================================ */

.divider {
	border: none;
	height: 1px;
	background: linear-gradient(90deg, var(--argon-line-soft), transparent);
}

/* ============================================================
   Small component primitives
   ============================================================ */

.card {
	background: var(--argon-surface);
	border: 1px solid var(--argon-line-soft);
	border-radius: var(--argon-radius-lg);
	padding: 1.5rem;
	box-shadow: var(--argon-ring-inset);
}

.card-tonal {
	background-image: linear-gradient(180deg, var(--argon-surface-2), var(--argon-surface));
	background-color: var(--argon-surface);
	border: 1px solid var(--argon-line-soft);
	border-radius: var(--argon-radius-lg);
}

/* ============================================================
   Font assignment for Persian / Arabic
   ============================================================ */

[dir="rtl"] {
	font-family: var(--argon-font-arabic);
}

[dir="rtl"] h1,
[dir="rtl"] h2,
[dir="rtl"] h3,
[dir="rtl"] h4,
[dir="rtl"] h5,
[dir="rtl"] h6 {
	font-family: var(--argon-font-heading);
}

/* ============================================================
   RTL overrides
   ============================================================ */

[dir="rtl"] ul { padding-right: 1.5em; padding-left: unset; }
[dir="rtl"] .align-right { text-align: right; }
[dir="rtl"] .align-left { text-align: left; }

[dir="rtl"] .wrap,
[dir="rtl"] .container { direction: rtl; }

/* Latin fragments (phone numbers, codes, e-mail) stay LTR in RTL copy */
[dir="rtl"] .force-ltr,
[dir="rtl"] [dir="ltr"] {
	direction: ltr;
	unicode-bidi: isolate;
}

/* ============================================================
   Prose for article content
   ============================================================ */

.entry-content {
	font-size: var(--argon-text-md);
	line-height: 1.85;
	color: var(--argon-ink-soft);
}

.entry-content p { margin-bottom: 1.2rem; }

.entry-content h2,
.entry-content h3,
.entry-content h4 {
	margin-top: 2.2rem;
	margin-bottom: 0.7rem;
	color: var(--argon-ink);
}

.entry-content h2 { font-size: var(--argon-text-2xl); }
.entry-content h3 { font-size: var(--argon-text-xl); }

.entry-content a {
	color: var(--argon-accent);
	text-decoration: underline;
	text-underline-offset: 4px;
	text-decoration-thickness: 1px;
}

.entry-content a:hover { color: var(--argon-accent-alt); }

.entry-content ul,
.entry-content ol { margin-bottom: 1.1rem; }

.entry-content li { margin-bottom: 0.4rem; }

.entry-content blockquote {
	margin: 2rem 0;
	padding: 1.25rem 1.6rem;
	border: 1px solid var(--argon-line-soft);
	border-inline-start: 3px solid var(--argon-accent);
	border-radius: var(--argon-radius);
	background: var(--argon-surface);
	color: var(--argon-ink);
	font-size: var(--argon-text-md);
}

.entry-content code {
	padding: 0.15em 0.45em;
	font-size: 0.9em;
	color: var(--argon-accent-alt);
	background: var(--argon-surface-2);
	border-radius: var(--argon-radius-xs);
}

.entry-content pre {
	overflow-x: auto;
	padding: 1.25rem 1.4rem;
	background: var(--argon-bg-deep);
	border: 1px solid var(--argon-line);
	border-radius: var(--argon-radius);
}

.entry-content pre code {
	padding: 0;
	background: none;
}

/* ============================================================
   Skip link
   ============================================================ 

.skip-link {
	position: absolute;
	left: -9999px;
	top: 0;
	padding: 0.8rem 1.35rem;
	background: var(--argon-accent);
	color: var(--argon-on-accent);
	font-weight: 600;
	z-index: 99999;
	border-radius: var(--argon-radius-pill);
}

.skip-link:focus {
	left: 1rem;
	top: 1rem;
}*/
.skip-link {
  position: absolute;
  top: 0;
  inset-inline-start: 1rem;
  transform: translateY(-150%);
  z-index: 100000;
}

.skip-link:focus {
  top: 1rem;
  transform: translateY(0);
}