/**
 * FixSteel Entry Gateway — Cinematic Industrial UI
 *
 * @package FixSteel_Entry_Gateway
 */

/* Typography: system stack (Vazirmatn files not bundled in gateway). */
:root {
	--feg-blue: #172554;
	--feg-blue-mid: #1e40af;
	--feg-blue-lt: #60a5fa;
	--feg-silver: #e2e8f0;
	--feg-silver-dk: #94a3b8;
	--feg-orange: #f97316;
	--feg-orange-hot: #fb923c;
	--feg-orange-lt: #fed7aa;
	--feg-orange-glow: rgba(249, 115, 22, 0.55);
	--feg-champ: #FFC107;
	--feg-champ-lt: #FFE082;
	--feg-champagne: #F3DFA0;
	--feg-champagne-rich: #EDD274;
	--feg-champagne-bright: #FFF0C8;
	--feg-aisi-gold: #FFCC00;
	--feg-aisi-gold-text: #0f0c06;
	--feg-aisi-strip-border: rgba(255, 204, 0, 0.62);
	--feg-aisi-strip-glow: rgba(255, 204, 0, 0.14);
	--feg-gold-solid: #FFC107;
	--feg-gold-hot: #FFD54F;
	--feg-gold-deep: #F9A825;
	--feg-nokhodi: #EEE8AA;
	--feg-nokhodi-input: #EEE8AA;
	--feg-nokhodi-dim: rgba(238, 232, 170, 0.55);
	--feg-dark: #030712;
	--feg-dark2: #0a1020;
	--feg-card: rgba(8, 14, 32, 0.42);
	--feg-card-solid: rgba(8, 14, 32, 0.66);
	--feg-border: rgba(255, 255, 255, 0.13);
	--feg-border-lt: rgba(255, 255, 255, 0.08);
	--feg-green: #10b981;
	--feg-red: #f43f5e;

	--feg-blur: 30px;
	--feg-radius: 16px;
	--feg-radius-sm: 12px;
	--feg-radius-xs: 10px;

	--feg-font: 'Tahoma', 'Arial', 'Segoe UI', system-ui, sans-serif;
	--feg-shadow: 0 28px 72px rgba(0, 0, 0, 0.52), 0 10px 28px rgba(0, 0, 0, 0.32);
	--feg-glow-blue: 0 0 0 1px rgba(30, 64, 175, 0.32), 0 0 56px rgba(30, 64, 175, 0.10);
	--feg-glow-orange: 0 0 0 1px rgba(249, 115, 22, 0.32), 0 0 20px rgba(249, 115, 22, 0.18);
	--feg-glow-gold: 0 0 0 1px rgba(255, 204, 0, 0.48), 0 0 22px rgba(255, 204, 0, 0.16);

	--feg-blue-btn-top: rgba(42, 72, 152, 0.80);
	--feg-blue-btn-bottom: rgba(28, 52, 118, 0.84);
	--feg-blue-btn-border: rgba(80, 130, 210, 0.34);
	--feg-blue-btn-highlight: rgba(147, 197, 253, 0.16);

	--feg-overlay-opacity: 0.55;
}

/* ─── Reset (scoped) ────────────────────────────────────────── */
*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
}

body.feg-gateway {
	margin: 0;
	padding: 0;
	min-height: 100vh;
	min-height: 100dvh;
	font-family: var(--feg-font);
	font-size: 16px;
	font-weight: 600;
	line-height: 1.55;
	color: var(--feg-silver);
	background: var(--feg-dark);
	overflow-x: hidden;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

body.feg-gateway a {
	color: inherit;
	text-decoration: none;
}

body.feg-gateway img,
body.feg-gateway video {
	max-width: 100%;
	display: block;
}

/* ─── App Shell ─────────────────────────────────────────────── */
.feg-app {
	position: relative;
	min-height: 100vh;
	min-height: 100dvh;
	isolation: isolate;
}

/* ─── Zone A: Background ────────────────────────────────────── */
.feg-bg {
	position: fixed;
	inset: 0;
	z-index: 0;
	overflow: hidden;
	background: var(--feg-dark2);
	pointer-events: none;
}

.feg-bg__video,
.feg-bg__poster {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

.feg-bg__video {
	z-index: 2;
}

.feg-bg__poster {
	z-index: 1;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

.feg-bg__gradient {
	z-index: 3;
	position: absolute;
	inset: 0;
	background:
		radial-gradient(ellipse 80% 60% at 50% 40%, rgba(15, 30, 70, calc(var(--feg-overlay-opacity, 0.55) * 0.55)) 0%, transparent 70%),
		linear-gradient(180deg, rgba(3, 7, 18, calc(var(--feg-overlay-opacity, 0.55) * 0.35)) 0%, rgba(3, 7, 18, calc(var(--feg-overlay-opacity, 0.55) * 0.85)) 100%);
}

.feg-bg__overlay {
	position: absolute;
	inset: 0;
	z-index: 4;
	background: rgba(3, 7, 18, var(--feg-overlay-opacity, 0.55));
}

.feg-bg__vignette {
	position: absolute;
	inset: 0;
	z-index: 5;
	background: radial-gradient(ellipse at center, transparent 42%, rgba(0, 0, 0, calc(var(--feg-overlay-opacity, 0.55) * 0.75)) 100%);
	pointer-events: none;
}

/* ─── Stage ─────────────────────────────────────────────────── */
.feg-stage {
	position: relative;
	z-index: 1;
	min-height: 100vh;
	min-height: 100dvh;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: clamp(20px, 4vw, 48px) clamp(16px, 3vw, 32px);
}

.feg-composition {
	display: flex;
	flex-direction: column;
	gap: clamp(18px, 2.5vw, 26px);
	width: 100%;
	max-width: 1260px;
}

/* Mobile order: Branding first, Tool second */
.feg-panel--brand {
	order: 1;
}

.feg-panel--tool {
	order: 2;
}

/* ─── Glass Panels ──────────────────────────────────────────── */
.feg-panel {
	position: relative;
	border-radius: var(--feg-radius);
	border: 1px solid rgba(255, 255, 255, 0.14);
	background: var(--feg-card);
	backdrop-filter: blur(var(--feg-blur));
	-webkit-backdrop-filter: blur(var(--feg-blur));
	box-shadow: var(--feg-shadow);
	overflow: hidden;
}

.feg-panel::before {
	content: '';
	position: absolute;
	top: 0;
	left: 6%;
	right: 6%;
	height: 1px;
	background: linear-gradient(90deg, transparent, rgba(96, 165, 250, 0.55) 50%, transparent);
	z-index: 2;
	pointer-events: none;
}

.feg-panel__glow {
	position: absolute;
	pointer-events: none;
	border-radius: inherit;
}

.feg-panel__glow--brand {
	inset: 0;
	box-shadow: var(--feg-glow-blue);
}

.feg-panel__glow--tool {
	inset: 0;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), var(--feg-glow-blue);
}

.feg-panel__inner {
	position: relative;
	padding: clamp(22px, 3vw, 32px);
}

/* ─── Branding Island ───────────────────────────────────────── */
.feg-brand__badge {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	padding: 6px 16px;
	border-radius: 100px;
	border: 1px solid rgba(30, 64, 175, 0.50);
	background: rgba(30, 64, 175, 0.14);
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--feg-blue-lt);
	margin-bottom: 20px;
}

.feg-brand__badge-dot {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--feg-blue-mid);
	box-shadow: 0 0 10px var(--feg-blue-mid);
	flex-shrink: 0;
}

.feg-brand__title-block {
	margin: 0 0 12px;
	display: inline-block;
	max-width: 100%;
	--feg-title-gradient: linear-gradient(
		to left,
		#000000 0%,
		#1f1f1f 4%,
		#52525b 10%,
		#71717a 16%,
		#94a3b8 24%,
		#cbd5e1 32%,
		#e8eef4 40%,
		#ffffff 48%,
		#ffffff 100%
	);
}

.feg-brand__title {
	margin: 0;
	font-family: var(--feg-font);
	font-size: clamp(28px, 3.9vw, 40px);
	font-weight: 600;
	line-height: 1.26;
	letter-spacing: 0.01em;
	color: #ffffff;
}

@supports (-webkit-background-clip: text) or (background-clip: text) {
	.feg-brand__title-gradient {
		background-image: var(--feg-title-gradient);
		background-size: 100% 100%;
		background-repeat: no-repeat;
		-webkit-background-clip: text;
		background-clip: text;
		-webkit-text-fill-color: transparent;
		color: transparent;
	}
}

.feg-brand__title-gradient,
.feg-brand__title-accent {
	display: inline;
}

.feg-brand__title-accent {
	color: #ffffff;
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
}

/* Fallback when background-clip:text unsupported */
@supports not ((-webkit-background-clip: text) or (background-clip: text)) {
	.feg-brand__title-gradient {
		color: #e2e8f0;
		text-shadow:
			0 0 1px rgba(0, 0, 0, 0.65),
			0 1px 3px rgba(0, 0, 0, 0.38);
	}

	.feg-brand__title-accent {
		color: #ffffff;
		text-shadow: 0 1px 3px rgba(0, 0, 0, 0.38);
	}
}

.feg-brand__sub {
	display: flex;
	align-items: center;
	gap: 14px;
	margin-bottom: 22px;
}

.feg-brand__sub-fa {
	font-size: 15px;
	font-weight: 800;
	color: var(--feg-silver-dk);
}

.feg-brand__sub-en {
	font-size: 14px;
	font-weight: 800;
	letter-spacing: 0.1em;
	color: var(--feg-silver);
}

.feg-brand__divider {
	height: 1px;
	background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.14), transparent);
	margin-bottom: 22px;
}

/* Product Cards */
.feg-brand__products {
	display: block;
}

.feg-brand__cards {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 14px;
	margin-bottom: 16px;
}

.feg-product {
	position: relative;
	display: block;
	padding: 18px 16px 16px;
	border-radius: var(--feg-radius-sm);
	background: rgba(255, 255, 255, 0.035);
	border: 1px solid rgba(255, 255, 255, 0.10);
	overflow: hidden;
	min-height: 108px;
	isolation: isolate;
}

.feg-product__bg {
	position: absolute;
	inset: 0;
	z-index: 0;
	background-position: center right;
	background-size: cover;
	background-repeat: no-repeat;
	opacity: 0.38;
	pointer-events: none;
	/* ~۵۰٪ بیرونی هر لبه نرم محو شود؛ مرکز واضح بماند */
	-webkit-mask-image:
		linear-gradient(to right, transparent 0%, rgba(0,0,0,.4) 25%, #000 50%, #000 50%, rgba(0,0,0,.4) 75%, transparent 100%),
		linear-gradient(to bottom, transparent 0%, rgba(0,0,0,.4) 25%, #000 50%, #000 50%, rgba(0,0,0,.4) 75%, transparent 100%);
	-webkit-mask-composite: source-in;
	mask-image:
		linear-gradient(to right, transparent 0%, rgba(0,0,0,.4) 25%, #000 50%, #000 50%, rgba(0,0,0,.4) 75%, transparent 100%),
		linear-gradient(to bottom, transparent 0%, rgba(0,0,0,.4) 25%, #000 50%, #000 50%, rgba(0,0,0,.4) 75%, transparent 100%);
	mask-composite: intersect;
}

.feg-product__glass {
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	background:
		linear-gradient(135deg, rgba(255, 255, 255, 0.14) 0%, rgba(255, 255, 255, 0.03) 28%, rgba(8, 12, 24, 0.52) 62%, rgba(5, 9, 22, 0.76) 100%),
		linear-gradient(180deg, rgba(255, 255, 255, 0.07) 0%, transparent 42%);
	backdrop-filter: blur(10px) saturate(1.15);
	-webkit-backdrop-filter: blur(10px) saturate(1.15);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

.feg-product--has-media {
	background: rgba(8, 12, 24, 0.35);
	border-color: rgba(255, 255, 255, 0.16);
	/* فضای خالی بالای کارت تا شکلک زیر عکس نرود */
	padding-top: 40px;
}

.feg-product__row {
	position: relative;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	min-height: 72px;
}

.feg-product__copy {
	flex: 1 1 auto;
	min-width: 0;
}

a.feg-product,
a.feg-aisi,
a.feg-tool__footer {
	text-decoration: none;
	color: inherit;
	transition:
		transform 0.2s ease,
		box-shadow 0.2s ease,
		border-color 0.2s ease,
		background 0.2s ease;
}

a.feg-product:hover {
	transform: translateY(-3px);
	cursor: pointer;
}

a.feg-product--economy:hover {
	border-color: rgba(249, 115, 22, 0.58);
	background: rgba(249, 115, 22, 0.07);
	box-shadow:
		inset 0 0 0 1px rgba(249, 115, 22, 0.18),
		0 0 0 1px rgba(249, 115, 22, 0.22),
		0 8px 22px rgba(249, 115, 22, 0.18),
		0 14px 36px rgba(249, 115, 22, 0.22);
}

a.feg-product--economy:hover .feg-product__accent {
	box-shadow: -2px 0 22px rgba(249, 115, 22, 0.62);
}

a.feg-product--premium:hover {
	border-color: rgba(96, 165, 250, 0.52);
	background: rgba(30, 64, 175, 0.09);
	box-shadow:
		inset 0 0 0 1px rgba(96, 165, 250, 0.16),
		0 0 0 1px rgba(30, 64, 175, 0.24),
		0 8px 22px rgba(30, 64, 175, 0.18),
		0 14px 36px rgba(96, 165, 250, 0.20);
}

a.feg-product--premium:hover .feg-product__accent {
	box-shadow: -2px 0 22px rgba(96, 165, 250, 0.55);
}

a.feg-aisi:hover {
	transform: translateY(-3px);
	border-color: rgba(255, 204, 0, 0.92);
	background:
		linear-gradient(90deg, rgba(255, 204, 0, 0.14) 0%, rgba(255, 193, 7, 0.08) 55%, rgba(5, 9, 22, 0.38) 100%);
	box-shadow:
		0 0 0 1px rgba(255, 204, 0, 0.52),
		0 0 24px rgba(255, 204, 0, 0.18),
		0 8px 22px rgba(255, 204, 0, 0.16),
		0 14px 38px rgba(255, 193, 7, 0.22),
		inset 0 1px 0 rgba(255, 228, 130, 0.18);
	cursor: pointer;
}

.feg-product__accent {
	position: absolute;
	top: 0;
	right: 0;
	z-index: 3;
	width: 3px;
	height: 100%;
	border-radius: 0 2px 2px 0;
}

.feg-product--economy {
	border-color: rgba(249, 115, 22, 0.30);
	border-right-width: 2px;
	border-right-color: var(--feg-orange-hot);
	box-shadow: inset 0 0 0 1px rgba(249, 115, 22, 0.06);
}

.feg-product--economy .feg-product__accent {
	background: linear-gradient(180deg, var(--feg-orange-hot) 0%, var(--feg-orange) 100%);
	box-shadow: -2px 0 14px var(--feg-orange-glow);
	width: 3px;
}

.feg-product--premium {
	border-color: rgba(30, 64, 175, 0.28);
	border-right-width: 2px;
	border-right-color: var(--feg-blue-mid);
	box-shadow: inset 0 0 0 1px rgba(30, 64, 175, 0.06);
}

.feg-product--premium .feg-product__accent {
	background: linear-gradient(180deg, #60a5fa 0%, var(--feg-blue-mid) 100%);
	box-shadow: -2px 0 14px rgba(30, 64, 175, 0.45);
	width: 3px;
}

.feg-product__icon {
	position: absolute;
	top: 12px;
	left: 12px;
	z-index: 5;
	opacity: 0.9;
	filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.4));
	pointer-events: none;
}

.feg-product__thumb {
	position: relative;
	z-index: 2;
	width: 72px;
	height: 72px;
	margin: 0;
	border-radius: 14px;
	overflow: hidden;
	flex: 0 0 72px;
	align-self: center;
	border: 0;
	background: transparent;
	box-shadow: none;
	/* ~۵۰٪ لبهٔ بیرونی هر سمت نرم محو شود */
	-webkit-mask-image:
		linear-gradient(to right, transparent 0%, rgba(0,0,0,.4) 25%, #000 50%, #000 50%, rgba(0,0,0,.4) 75%, transparent 100%),
		linear-gradient(to bottom, transparent 0%, rgba(0,0,0,.4) 25%, #000 50%, #000 50%, rgba(0,0,0,.4) 75%, transparent 100%);
	-webkit-mask-composite: source-in;
	mask-image:
		linear-gradient(to right, transparent 0%, rgba(0,0,0,.4) 25%, #000 50%, #000 50%, rgba(0,0,0,.4) 75%, transparent 100%),
		linear-gradient(to bottom, transparent 0%, rgba(0,0,0,.4) 25%, #000 50%, #000 50%, rgba(0,0,0,.4) 75%, transparent 100%);
	mask-composite: intersect;
}

.feg-product__thumb img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 14px;
	filter: saturate(1.08) contrast(1.03) brightness(1.02);
}

.feg-product__thumb-shine {
	position: absolute;
	inset: 0;
	pointer-events: none;
	border-radius: 14px;
	background: radial-gradient(ellipse 65% 50% at 28% 22%, rgba(255, 255, 255, 0.22) 0%, transparent 60%);
	mix-blend-mode: soft-light;
}

.feg-product--economy .feg-product__icon {
	color: var(--feg-orange-hot);
	opacity: 0.9;
}

.feg-product--premium .feg-product__icon {
	color: var(--feg-blue-lt);
}

.feg-product__title {
	margin: 0 0 8px;
	padding-left: 0;
	font-size: 16px;
	font-weight: 800;
	letter-spacing: 0.01em;
	text-shadow: 0 1px 10px rgba(0, 0, 0, 0.45);
}

.feg-product:not(.feg-product--has-media) .feg-product__title {
	padding-left: 26px;
}

.feg-product--has-media .feg-product__line {
	text-shadow: 0 1px 8px rgba(0, 0, 0, 0.4);
}

.feg-product--economy .feg-product__title {
	color: var(--feg-orange-hot);
	text-shadow: 0 0 24px rgba(249, 115, 22, 0.22);
}

.feg-product--premium .feg-product__title {
	color: #60a5fa;
	font-weight: 800;
}

.feg-product__line {
	margin: 0;
	font-size: 15px;
	line-height: 1.5;
	color: var(--feg-silver);
	font-weight: 700;
}

.feg-product__line--muted {
	color: var(--feg-silver-dk);
	font-size: 14px;
	margin-top: 3px;
	font-weight: 600;
}

/* AISI 316 Strip */
.feg-aisi {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	padding: 18px 16px 18px 18px;
	min-height: 58px;
	margin-bottom: 24px;
	border-radius: 10px;
	border: 1.5px solid var(--feg-aisi-strip-border);
	background:
		linear-gradient(90deg, rgba(255, 204, 0, 0.10) 0%, rgba(255, 193, 7, 0.06) 55%, rgba(5, 9, 22, 0.38) 100%);
	box-shadow:
		var(--feg-glow-gold),
		inset 0 1px 0 rgba(255, 228, 130, 0.10);
}

.feg-aisi__text {
	margin: 0;
	font-size: 15px;
	line-height: 1.5;
	color: rgba(243, 236, 210, 0.92);
	flex: 1;
	font-weight: 700;
}

.feg-aisi__badge {
	flex-shrink: 0;
	padding: 9px 16px;
	border-radius: 8px;
	font-size: 15px;
	font-weight: 800;
	letter-spacing: 0.03em;
	line-height: 1.25;
	color: var(--feg-aisi-gold-text);
	background: var(--feg-aisi-gold);
	border: 1px solid rgba(255, 236, 150, 0.55);
	box-shadow:
		0 2px 8px rgba(204, 153, 0, 0.42),
		inset 0 1px 0 rgba(255, 248, 210, 0.35);
}

/* CTA Row */
.feg-brand__cta {
	display: flex;
	gap: 14px;
	flex-wrap: wrap;
}

.feg-brand__cta .feg-btn {
	height: 88px;
	padding: 0 24px;
	border-radius: 12px;
}

.feg-brand__cta .feg-btn--primary {
	font-family: var(--feg-font);
	font-size: 19px;
	font-weight: 800;
	line-height: 1.28;
	letter-spacing: 0.015em;
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.22);
	flex: 1.15;
}

.feg-brand__cta .feg-btn--ghost {
	flex: 1;
	font-size: 17px;
	font-weight: 800;
	line-height: 1.3;
	letter-spacing: 0.01em;
}

/* ─── Tool Island ───────────────────────────────────────────── */
.feg-tool__header {
	position: relative;
	margin-bottom: 20px;
	padding-right: 52px;
}

.feg-tool__icon {
	position: absolute;
	top: 0;
	right: 0;
	left: auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	border-radius: 11px;
	background: rgba(30, 64, 175, 0.14);
	border: 1px solid rgba(30, 64, 175, 0.28);
	color: var(--feg-blue-lt);
}

.feg-tool__title {
	margin: 0 0 8px;
	font-size: clamp(22px, 2.8vw, 28px);
	font-weight: 800;
	color: #fff;
	line-height: 1.24;
	letter-spacing: -0.02em;
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.22);
}

.feg-tool__subtitle {
	margin: 0;
	font-size: 13px;
	line-height: 1.6;
	color: var(--feg-silver-dk);
	font-weight: 700;
}

/* Form */
.feg-tool__form {
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.feg-tool__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px;
}

.feg-field {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.feg-field--full {
	width: 100%;
}

.feg-field label {
	font-size: 12px;
	font-weight: 800;
	color: var(--feg-silver-dk);
	letter-spacing: 0.01em;
}

/* Base field chrome — select & shared */
.feg-field input,
.feg-select-wrap select {
	width: 100%;
	height: 42px;
	padding: 0 14px;
	border-radius: var(--feg-radius-xs);
	border: 1px solid rgba(255, 255, 255, 0.12);
	background: rgba(3, 7, 18, 0.48);
	font-family: var(--feg-font);
	font-size: 14px;
	transition: border-color 0.2s, box-shadow 0.2s;
	appearance: none;
	-webkit-appearance: none;
}

/* فقط اعداد داخل کادرهای ابعاد — نخودی */
.feg-tool__grid .feg-field input {
	color: var(--feg-nokhodi-input);
	font-weight: 800;
}

.feg-tool__grid .feg-field input::placeholder {
	color: var(--feg-nokhodi-dim);
	font-weight: 700;
}

/* Dropdown متریال — نقره‌ای (نه نخودی) */
.feg-select-wrap select {
	color: var(--feg-silver-dk);
	font-weight: 700;
}

.feg-select-wrap select:valid {
	color: var(--feg-silver);
	font-weight: 800;
}

.feg-select-wrap select option {
	color: var(--feg-dark);
	background: var(--feg-silver);
}

.feg-field input:focus,
.feg-select-wrap select:focus {
	outline: none;
	border-color: rgba(30, 64, 175, 0.50);
	box-shadow: 0 0 0 3px rgba(30, 64, 175, 0.12);
}

.feg-field input::-webkit-outer-spin-button,
.feg-field input::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

.feg-field input[type='number'] {
	-moz-appearance: textfield;
}

.feg-select-wrap {
	position: relative;
}

.feg-select-wrap select {
	padding-left: 32px;
	cursor: pointer;
}

.feg-select-arrow {
	position: absolute;
	left: 12px;
	top: 50%;
	transform: translateY(-50%);
	color: var(--feg-silver-dk);
	pointer-events: none;
}

/* Result */
.feg-result {
	padding: 12px 16px;
	border-radius: var(--feg-radius-xs);
	background: rgba(16, 185, 129, 0.10);
	border: 1px solid rgba(16, 185, 129, 0.26);
	color: var(--feg-green);
	font-size: 14px;
	font-weight: 800;
	text-align: center;
}

.feg-result.feg-result--error {
	background: rgba(244, 63, 94, 0.10);
	border-color: rgba(244, 63, 94, 0.26);
	color: var(--feg-red);
}

/* Tool Footer */
.feg-tool__footer {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin-top: 22px;
	min-height: 52px;
	padding: 0 20px;
	width: 100%;
	border-radius: var(--feg-radius-xs);
	border: 1px solid rgba(237, 210, 116, 0.32);
	background: linear-gradient(
		180deg,
		rgba(255, 204, 0, 0.08) 0%,
		rgba(255, 193, 7, 0.04) 100%
	);
	font-family: var(--feg-font);
	font-size: 12px;
	font-weight: 800;
	line-height: 1.4;
	letter-spacing: 0.025em;
	color: var(--feg-champagne-rich);
	text-shadow:
		0 1px 3px rgba(0, 0, 0, 0.48),
		0 0 14px rgba(255, 214, 120, 0.18);
	cursor: default;
}

a.feg-tool__footer:hover {
	transform: translateY(-1px);
	color: var(--feg-champagne-bright);
	border-color: rgba(255, 228, 150, 0.48);
	background: linear-gradient(
		180deg,
		rgba(255, 204, 0, 0.14) 0%,
		rgba(255, 193, 7, 0.08) 100%
	);
	box-shadow: 0 0 18px rgba(255, 204, 0, 0.12);
	cursor: pointer;
}

.feg-tool__footer-icon {
	color: var(--feg-champagne);
	opacity: 0.95;
	flex-shrink: 0;
	filter: drop-shadow(0 0 6px rgba(255, 214, 120, 0.28));
}

/* ─── Buttons ───────────────────────────────────────────────── */
.feg-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 9px;
	height: 44px;
	padding: 0 22px;
	border-radius: var(--feg-radius-xs);
	font-family: var(--feg-font);
	font-size: 14px;
	font-weight: 800;
	cursor: pointer;
	border: none;
	transition: background 0.2s, box-shadow 0.2s, transform 0.15s;
	white-space: nowrap;
	flex: 1;
	min-width: 0;
}

.feg-btn--ghost {
	background: rgba(255, 255, 255, 0.05);
	color: var(--feg-silver);
	border: 1px solid rgba(255, 255, 255, 0.16);
	font-weight: 800;
}

.feg-btn--primary {
	background: linear-gradient(
		180deg,
		var(--feg-blue-btn-top) 0%,
		var(--feg-blue-btn-bottom) 100%
	);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	border: 1px solid var(--feg-blue-btn-border);
	color: rgba(248, 250, 252, 0.96);
	box-shadow:
		0 6px 18px rgba(20, 40, 100, 0.42),
		inset 0 1px 0 var(--feg-blue-btn-highlight),
		inset 0 -1px 0 rgba(0, 0, 0, 0.16);
}

.feg-btn--primary:hover {
	background: linear-gradient(
		180deg,
		rgba(48, 82, 168, 0.84) 0%,
		rgba(34, 60, 138, 0.88) 100%
	);
	border-color: rgba(96, 165, 250, 0.40);
	box-shadow:
		0 8px 22px rgba(20, 40, 100, 0.45),
		inset 0 1px 0 rgba(191, 219, 254, 0.18),
		inset 0 -1px 0 rgba(0, 0, 0, 0.18);
	transform: translateY(-1px);
}

.feg-btn--primary:active {
	transform: translateY(0);
}

.feg-btn--ghost:hover {
	background: rgba(255, 255, 255, 0.09);
	border-color: rgba(255, 255, 255, 0.22);
}

.feg-btn--static {
	cursor: default;
	pointer-events: none;
}

.feg-btn--static:hover,
.feg-btn--static:active {
	transform: none;
}

.feg-btn--calc {
	width: 100%;
	flex: none;
	height: 56px;
	margin-top: 4px;
	border-radius: 12px;
	font-family: var(--feg-font);
	font-size: 19px;
	font-weight: 800;
	line-height: 1.22;
	letter-spacing: 0.025em;
	text-shadow:
		0 1px 4px rgba(0, 0, 0, 0.38),
		0 0 1px rgba(255, 255, 255, 0.22);
}

.feg-btn__icon {
	display: inline-flex;
	flex-shrink: 0;
	opacity: 0.85;
}

/* ─── Desktop Layout ────────────────────────────────────────── */
@media (min-width: 1024px) {
	.feg-stage {
		padding: clamp(24px, 3vw, 40px) clamp(20px, 2.5vw, 36px);
	}

	.feg-composition {
		display: grid;
		grid-template-columns: 36fr 58fr;
		gap: 24px;
		align-items: stretch;
	}

	/* Desktop order: Tool left, Brand right — equal height */
	.feg-panel--tool,
	.feg-panel--brand {
		display: flex;
		flex-direction: column;
		min-height: 548px;
		height: 100%;
	}

	.feg-panel--tool {
		order: 1;
	}

	.feg-panel--brand {
		order: 2;
	}

	.feg-panel--brand .feg-panel__inner {
		display: flex;
		flex-direction: column;
		flex: 1;
		min-height: 100%;
		padding: 30px 34px 28px;
	}

	.feg-panel--tool .feg-panel__inner {
		display: flex;
		flex-direction: column;
		flex: 1;
		min-height: 100%;
		padding: 28px 26px 24px;
	}

	.feg-tool__form {
		flex: 1;
	}

	.feg-tool__footer {
		margin-top: auto;
	}

	.feg-brand__cta {
		margin-top: auto;
		padding-top: 4px;
	}
}

@media (min-width: 960px) and (max-width: 1023px) {
	.feg-composition {
		flex-direction: row;
		align-items: stretch;
		gap: 20px;
	}

	.feg-panel--tool,
	.feg-panel--brand {
		display: flex;
		flex-direction: column;
		min-height: 520px;
		height: 100%;
	}

	.feg-panel--tool {
		order: 1;
		flex: 0 0 36%;
		max-width: 36%;
	}

	.feg-panel--brand {
		order: 2;
		flex: 1 1 58%;
		max-width: 58%;
	}

	.feg-panel--brand .feg-panel__inner,
	.feg-panel--tool .feg-panel__inner {
		display: flex;
		flex-direction: column;
		flex: 1;
		min-height: 100%;
	}

	.feg-tool__form {
		flex: 1;
	}

	.feg-tool__footer {
		margin-top: auto;
	}

	.feg-brand__cta {
		margin-top: auto;
	}
}

/* ─── Mobile Product Order ──────────────────────────────────── */
@media (max-width: 768px) {
	.feg-brand__products {
		display: flex;
		flex-direction: column;
		gap: 14px;
		margin-bottom: 16px;
	}

	.feg-brand__cards {
		display: contents;
		margin-bottom: 0;
	}

	.feg-product--premium {
		order: 1;
		width: 100%;
	}

	.feg-product--economy {
		order: 2;
		width: 100%;
	}

	.feg-aisi,
	a.feg-aisi {
		order: 3;
		width: 100%;
		align-self: stretch;
		flex-direction: column;
		align-items: stretch;
		gap: 12px;
		margin-bottom: 0;
	}

	.feg-aisi__badge {
		width: 100%;
		align-self: stretch;
		display: flex;
		align-items: center;
		justify-content: center;
		text-align: center;
	}
}

/* ─── Small Mobile ──────────────────────────────────────────── */
@media (max-width: 480px) {
	.feg-brand__cta {
		flex-direction: column-reverse;
	}

	.feg-brand__cta .feg-btn {
		height: 64px;
		font-size: 15px;
		width: 100%;
		flex: none;
	}

	.feg-btn {
		width: 100%;
		flex: none;
	}

	.feg-tool__footer {
		min-height: 46px;
		padding: 0 16px;
		font-size: 11px;
		margin-top: 18px;
	}
}

/* ─── Reduced Motion ────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	.feg-btn {
		transition: none;
	}

	.feg-bg__video {
		display: none;
	}
}

/* ─── Fallback for no backdrop-filter ───────────────────────── */
@supports not (backdrop-filter: blur(1px)) {
	.feg-panel {
		background: var(--feg-card-solid);
	}
}