/* ===== متغيرات الهوية البصرية - عدّل هنا لو الألوان أو الخطوط اتغيّرت ===== */
:root {
	--scs-color-main: #19242a;
	--scs-color-second: #ffdf7b;
	--scs-color-white: #ffffff;
	--scs-font-ar: 'El Messiri', 'Tahoma', sans-serif;
	--scs-font-en: 'Poppins', 'Arial', sans-serif;
}

.scs-section {
	font-family: var(--scs-font-ar);
	direction: rtl;
	text-align: right;
	box-sizing: border-box;
}

/* لو الصفحة نفسها بقت LTR (مثال: النسخة الإنجليزية عن طريق بلاجن ترجمة زي
   TranslatePress/WPML) اقلب اتجاه القسم بدل ما يفضل RTL بالإجبار. بنعتمد
   على أكتر من إشارة عشان يشتغل مع أي بلاجن ترجمة:
   - كلاس "rtl" اللي ووردبريس نفسه بيضيفه على الـ body لما is_rtl() = true
     (فغيابه معناه الصفحة LTR دلوقتي).
   - سمة dir="ltr" على html لو البلاجن بيضبطها.
   - سمة lang اللي بتبدأ بـ en على html. */
body:not(.rtl) .scs-section,
html[dir="ltr"] .scs-section,
html[lang^="en"] .scs-section {
	direction: ltr;
	text-align: left;
	font-family: var(--scs-font-en);
}

.scs-section * {
	box-sizing: border-box;
}

.scs-section [dir="ltr"],
.scs-section .scs-en,
.scs-section .scs-number {
	font-family: var(--scs-font-en);
}

.scs-container {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 20px;
}

/* ===== Hero / البانر الرئيسي (فيديو) ===== */
.scs-hero {
	position: relative;
	overflow: hidden;
	background: var(--scs-color-main);
	height: 60vh;
	min-height: 420px;
	display: flex;
	align-items: center;
	justify-content: center;
}

/* على الكمبيوتر البانر ياخد ارتفاع الشاشة كامل مش نص الشاشة بس */
@media (min-width: 768px) {
	.scs-hero {
		height: 100vh;
		min-height: 560px;
	}
}

.scs-hero-video {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.scs-hero-overlay {
	position: absolute;
	inset: 0;
	z-index: 1;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	background: linear-gradient(180deg, rgba(25, 36, 42, 0.35) 0%, rgba(25, 36, 42, 0.65) 100%);
	padding: 40px 20px;
}

.scs-hero-text {
	max-width: 700px;
}

.scs-hero-text h1 {
	color: var(--scs-color-white);
	font-size: 34px;
	font-weight: 700;
	margin: 0 0 14px;
}

.scs-hero-text p {
	color: var(--scs-color-white);
	font-size: 17px;
	opacity: 0.95;
	margin: 0 0 22px;
}

@media (max-width: 767px) {
	.scs-hero {
		height: 60vh;
		min-height: 320px;
	}
	.scs-hero-text h1 {
		font-size: 24px;
	}
	.scs-hero-text p {
		font-size: 15px;
	}
}

/* ===== خلفية اختيارية لأي سكشن (Cover + Fixed) ===== */
.scs-has-bg {
	position: relative;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	color: var(--scs-color-white);
	z-index: 0;
}

.scs-has-bg::before {
	content: '';
	position: absolute;
	inset: 0;
	background: rgba(25, 36, 42, 0.72);
	z-index: -1;
}

.scs-has-bg .scs-about-title,
.scs-has-bg h1,
.scs-has-bg h2,
.scs-has-bg h3 {
	color: var(--scs-color-second);
}

.scs-has-bg p,
.scs-has-bg span,
.scs-has-bg strong {
	color: var(--scs-color-white);
}

/* iOS Safari وبعض متصفحات الموبايل بتتعامل بشكل سيء مع background-attachment:fixed */
@media (max-width: 767px) {
	.scs-has-bg {
		background-attachment: scroll;
	}
}

/* ===== الخدمات ===== */
.scs-services-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 24px;
	padding: 50px 0;
}

.scs-service-card {
	background: var(--scs-color-white);
	border: 1px solid #ececec;
	border-radius: 16px;
	padding: 30px 24px;
	transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
	display: flex;
	flex-direction: column;
	height: 100%;
	position: relative;
	overflow: hidden;
	box-shadow: 0 3px 14px rgba(25, 36, 42, 0.05);
}

.scs-service-card::before {
	content: '';
	position: absolute;
	inset-inline-start: 0;
	top: 0;
	bottom: 0;
	width: 4px;
	background: transparent;
	transition: background 0.2s ease;
}

.scs-service-card .scs-service-desc-wrap {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
}

.scs-service-card:hover {
	transform: translateY(-6px);
	box-shadow: 0 14px 30px rgba(25, 36, 42, 0.12);
	border-color: var(--scs-color-second);
}

.scs-service-card.is-featured {
	border-color: #f0e3b8;
	box-shadow: 0 10px 26px rgba(25, 36, 42, 0.1);
}

.scs-service-card.is-featured::before {
	background: var(--scs-color-second);
}

.scs-service-icon {
	width: 56px;
	height: 56px;
	border-radius: 14px;
	background: rgba(255, 223, 122, 0.35);
	color: var(--scs-color-main);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 24px;
	margin-bottom: 18px;
}

.scs-service-card.is-featured .scs-service-icon {
	background: var(--scs-color-second);
}

.scs-service-title {
	font-size: 18px;
	font-weight: 700;
	color: var(--scs-color-main);
	margin: 0 0 10px;
}

.scs-service-desc {
	font-size: 14px;
	line-height: 1.9;
	margin: 0;
	opacity: 0.9;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 4;
	overflow: hidden;
}

.scs-service-desc.is-expanded {
	-webkit-line-clamp: unset;
	display: block;
	overflow: visible;
}

.scs-section .scs-read-more,
.scs-section button.scs-read-more {
	display: none;
	align-items: center;
	gap: 6px;
	align-self: flex-start;
	margin: 12px 0 0 !important;
	background: rgba(255, 223, 122, 0.25) !important;
	background-image: none !important;
	border-width: 0 !important;
	border-style: none !important;
	border-color: transparent !important;
	border: 0 !important;
	outline: none !important;
	box-shadow: none !important;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	border-radius: 999px !important;
	padding: 7px 14px !important;
	color: var(--scs-color-main) !important;
	font-family: inherit !important;
	font-size: 13px !important;
	font-weight: 700 !important;
	line-height: 1 !important;
	text-decoration: none !important;
	text-transform: none !important;
	text-shadow: none !important;
	letter-spacing: normal !important;
	cursor: pointer;
	transition: background 0.2s ease, color 0.2s ease;
}

.scs-section .scs-read-more:hover,
.scs-section .scs-read-more:focus,
.scs-section .scs-read-more:active,
.scs-section .scs-read-more:visited {
	background: var(--scs-color-second) !important;
	color: var(--scs-color-main) !important;
	border-color: transparent !important;
	outline: none !important;
	box-shadow: none !important;
	text-decoration: none !important;
}

.scs-read-more-icon {
	width: 14px;
	height: 14px;
	display: inline-block;
	flex-shrink: 0;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 15.5 5 8.5l1.4-1.4L12 12.7l5.6-5.6L19 8.5z'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 15.5 5 8.5l1.4-1.4L12 12.7l5.6-5.6L19 8.5z'/%3E%3C/svg%3E") center / contain no-repeat;
	transition: transform 0.2s ease;
}

.scs-read-more.is-open .scs-read-more-icon {
	transform: rotate(180deg);
}

/* ===== خدمات بشكل مربعات صور (صفحة خدماتنا) ===== */
.scs-services-photo-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 26px;
	padding: 50px 0;
}

.scs-service-photo-card {
	background: var(--scs-color-white);
	border: 1px solid #e7e7e7;
	border-radius: 14px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.scs-service-photo-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 10px 24px rgba(25, 36, 42, 0.12);
}

.scs-service-photo {
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	display: block;
	background: #eef0ef;
}

.scs-service-photo-placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--scs-color-main);
	font-size: 40px;
}

.scs-service-photo-body {
	padding: 22px;
	flex: 1;
	display: flex;
	flex-direction: column;
}

.scs-service-photo-body .scs-service-desc-wrap {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
}

/* ===== مميزات / لماذا تختارنا ===== */
.scs-features-section {
	position: relative;
	overflow: hidden;
	padding: 10px 0;
}

.scs-features-section .scs-bg-layer {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	z-index: 0;
}

@media (max-width: 767px) {
	.scs-features-section .scs-bg-layer {
		background-attachment: scroll;
	}
}

.scs-features-inner {
	position: relative;
	z-index: 1;
}

.scs-features-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 22px;
	padding: 40px 0 50px;
}

.scs-feature-card {
	text-align: center;
	padding: 34px 24px;
	background: var(--scs-color-main);
	border: 1px solid rgba(255, 223, 122, 0.18);
	border-radius: 16px;
	box-shadow: 0 12px 28px rgba(25, 36, 42, 0.18);
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.scs-feature-card:hover {
	transform: translateY(-6px);
	box-shadow: 0 16px 34px rgba(25, 36, 42, 0.26);
}

.scs-feature-icon {
	width: 56px;
	height: 56px;
	border-radius: 14px;
	background: var(--scs-color-second);
	color: var(--scs-color-main);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 24px;
	margin: 0 auto 18px;
}

.scs-feature-card h4 {
	color: var(--scs-color-second);
	font-size: 17px;
	font-weight: 700;
	margin: 0 0 10px;
}

.scs-feature-card p {
	color: rgba(255, 255, 255, 0.85);
	font-size: 14px;
	line-height: 1.8;
	margin: 0;
}

/* ===== عدادات / أرقام ===== */
.scs-stats-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
	gap: 20px;
	background: var(--scs-color-main);
	border-radius: 14px;
	padding: 40px 20px;
}

.scs-stat {
	text-align: center;
	color: var(--scs-color-white);
}

.scs-stat-number {
	font-family: var(--scs-font-en);
	font-size: 36px;
	font-weight: 700;
	color: var(--scs-color-second);
	display: block;
}

.scs-stat-label {
	font-size: 14px;
	margin-top: 6px;
	opacity: 0.9;
}

/* ===== CTA / حجز موعد - شكل ثلاثي الأبعاد بارز + إطار متحرك حوالين الحواف ===== */
.scs-cta-outer {
	position: relative;
	margin: 60px 0;
}

.scs-cta {
	position: relative;
	z-index: 1;
	background: linear-gradient(155deg, #223642 0%, var(--scs-color-main) 45%, #0a1114 100%);
	color: var(--scs-color-white);
	border-radius: 22px;
	padding: 50px 32px;
	text-align: center;
	box-shadow:
		0 1px 0 rgba(255, 255, 255, 0.1) inset,
		0 -30px 50px rgba(0, 0, 0, 0.3) inset,
		0 26px 50px rgba(0, 0, 0, 0.5),
		0 6px 14px rgba(0, 0, 0, 0.35);
}

/* طبقة "لمعة" خفيفة أعلى الكارت بتدّي إحساس زجاجي/ثلاثي الأبعاد */
.scs-cta::before {
	content: '';
	position: absolute;
	inset: 0;
	border-radius: inherit;
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.08) 0%, rgba(255, 255, 255, 0) 40%);
	pointer-events: none;
}

/* لو الكارت له صورة خلفية (scs-has-bg)، لازم الـ ::before يجمع بين تعتيم
   الصورة واللمعة الزجاجية مع بعض - الأولوية الأعلى هنا (كلاسين) بتغلب على
   قاعدة .scs-has-bg::before العادية. */
.scs-cta.scs-has-bg::before {
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.08) 0%, rgba(255, 255, 255, 0) 40%), rgba(25, 36, 42, 0.72);
	z-index: 0;
}

/* نقطة مضيئة بتجري بالظبط على حواف الكارت نفسها (زي progress bar بيلف
   حوالين المربع) - SVG مضبوط على قياس الكارت بالظبط فمش ممكن يخرج بره. */
.scs-cta-trace {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	overflow: visible;
	pointer-events: none;
	z-index: 3;
}

.scs-cta-trace-rect {
	x: 1.5px;
	y: 1.5px;
	width: calc(100% - 3px);
	height: calc(100% - 3px);
	rx: 21px;
	fill: none;
	stroke: var(--scs-color-second);
	stroke-width: 3px;
	stroke-linecap: round;
	filter: drop-shadow(0 0 5px rgba(255, 223, 122, 0.9)) drop-shadow(0 0 10px rgba(255, 223, 122, 0.5));
	stroke-dasharray: 7 93;
	stroke-dashoffset: 0;
	animation: scs-cta-trace 5.5s linear infinite;
}

@keyframes scs-cta-trace {
	to {
		stroke-dashoffset: -100;
	}
}

@media (prefers-reduced-motion: reduce) {
	.scs-cta-trace-rect {
		animation: none;
	}
}

.scs-cta-title {
	font-size: 26px;
	font-weight: 700;
	color: var(--scs-color-second);
	margin: 0 0 10px;
}

.scs-cta-subtitle {
	font-size: 15px;
	margin: 0 0 22px;
	opacity: 0.9;
}

.scs-cta-actions {
	display: flex;
	gap: 14px;
	justify-content: center;
	flex-wrap: wrap;
}

.scs-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 12px 26px;
	border-radius: 999px;
	font-weight: 600;
	text-decoration: none;
	transition: opacity 0.2s ease;
}

.scs-btn-primary {
	background: var(--scs-color-second);
	color: var(--scs-color-main);
}

.scs-btn-outline {
	border: 1px solid var(--scs-color-second);
	color: var(--scs-color-second);
}

.scs-btn-outline-dark {
	border: 1px solid var(--scs-color-main);
	color: var(--scs-color-main);
}

.scs-btn:hover {
	opacity: 0.85;
}

/* ===== سكشن "شركة تابعة" (مثال: Egypt United) ===== */
.scs-subsidiary-wrap {
	padding: 10px 0 50px;
}

.scs-subsidiary {
	position: relative;
	background: var(--scs-color-white);
	border: 2px solid var(--scs-color-second);
	border-radius: 22px;
	padding: 44px 34px 34px;
	box-shadow: 0 12px 32px rgba(25, 36, 42, 0.08);
}

.scs-subsidiary-badge {
	position: absolute;
	top: -18px;
	right: 34px;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: var(--scs-color-main);
	color: var(--scs-color-second);
	padding: 8px 18px;
	border-radius: 999px;
	font-size: 13px;
	font-weight: 700;
	box-shadow: 0 6px 16px rgba(25, 36, 42, 0.22);
}

/* الشارة أصلها متظبطة على يمين الكارت (بداية القراءة في RTL) - في وضع
   LTR بنقلبها على الشمال عشان تفضل قريبة من بداية المحتوى. مربوطة بنفس
   نقطة توقف الموبايل (768px) عشان ميضربش في تمركز الشارة على الموبايل
   (اللي شغالة صح في الاتجاهين زي ما هي). */
@media (min-width: 768px) {
	body:not(.rtl) .scs-subsidiary-badge,
	html[dir="ltr"] .scs-subsidiary-badge,
	html[lang^="en"] .scs-subsidiary-badge {
		right: auto;
		left: 34px;
	}
}

.scs-subsidiary-badge .dashicons {
	font-size: 16px;
	width: 16px;
	height: 16px;
}

.scs-subsidiary-inner {
	display: flex;
	align-items: center;
	gap: 32px;
}

.scs-subsidiary-logo {
	flex-shrink: 0;
	width: 140px;
	height: 140px;
	background: var(--scs-color-white);
	border: 1px solid #ececec;
	border-radius: 16px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 16px;
}

.scs-subsidiary-logo img {
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
	display: block;
}

.scs-subsidiary-text {
	flex: 1 1 auto;
	min-width: 0;
}

.scs-subsidiary-text h3 {
	color: var(--scs-color-main);
	font-size: 22px;
	font-weight: 700;
	margin: 0 0 10px;
}

.scs-subsidiary-text p {
	font-size: 14px;
	line-height: 1.9;
	color: #4a4a4a;
	margin: 0 0 18px;
}

@media (max-width: 767px) {
	.scs-subsidiary {
		padding-top: 40px;
	}
	.scs-subsidiary-badge {
		right: 50%;
		transform: translateX(50%);
		white-space: nowrap;
	}
	.scs-subsidiary-inner {
		flex-direction: column;
		text-align: center;
	}
	.scs-subsidiary-logo {
		width: 110px;
		height: 110px;
	}
}

/* ===== هيدر داخلي لصفحات (خدماتنا / تواصل معنا) مع دعم خلفية اختيارية ===== */
.scs-page-header {
	padding: 40px 0;
}

.scs-page-header.scs-has-bg {
	padding: 70px 0;
}

/* ===== من نحن ===== */
.scs-about-header {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 40px;
	align-items: center;
	padding: 50px 0;
}

@media (max-width: 767px) {
	.scs-about-header {
		grid-template-columns: 1fr;
	}
}

.scs-about-header img {
	width: 100%;
	border-radius: 16px;
	display: block;
}

.scs-about-title {
	color: var(--scs-color-main);
	font-size: 28px;
	font-weight: 700;
}

.scs-vision-mission {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 20px;
	padding-bottom: 40px;
}

@media (max-width: 767px) {
	.scs-vision-mission {
		grid-template-columns: 1fr;
	}
}

.scs-vm-card {
	background: #f7f5ef;
	border-inline-start: 4px solid var(--scs-color-second);
	border-radius: 10px;
	padding: 24px;
}

.scs-vm-card h3 {
	color: var(--scs-color-main);
	margin-top: 0;
}

/* ===== تواصل معنا ===== */
.scs-contact-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 30px;
	padding: 40px 0;
}

@media (max-width: 767px) {
	.scs-contact-grid {
		grid-template-columns: 1fr;
	}
}

.scs-contact-card {
	background: var(--scs-color-main);
	color: var(--scs-color-white);
	border-radius: 20px;
	padding: 30px 26px;
	box-shadow: 0 16px 40px rgba(25, 36, 42, 0.18);
	border: 1px solid rgba(255, 223, 122, 0.12);
}

.scs-contact-row {
	display: flex;
	align-items: flex-start;
	gap: 14px;
	padding: 16px 0;
	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.scs-contact-row:first-child {
	padding-top: 0;
}

.scs-contact-row:last-of-type {
	border-bottom: 0;
}

.scs-contact-icon {
	width: 44px;
	height: 44px;
	border-radius: 12px;
	background: rgba(255, 223, 122, 0.15);
	color: var(--scs-color-second);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 20px;
	flex-shrink: 0;
}

.scs-contact-label {
	display: block;
	color: rgba(255, 255, 255, 0.55);
	font-size: 12px;
	margin-bottom: 4px;
}

.scs-contact-value {
	display: block;
	color: var(--scs-color-white);
	font-size: 15px;
	font-weight: 600;
	text-decoration: none;
}

a.scs-contact-value:hover {
	color: var(--scs-color-second);
}

.scs-social-links {
	display: flex;
	gap: 10px;
	margin-top: 20px;
}

.scs-social-links a {
	width: 38px;
	height: 38px;
	border-radius: 50%;
	background: var(--scs-color-second);
	color: var(--scs-color-main);
	color: var(--scs-color-second);
	display: flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
}

.scs-map-embed iframe {
	width: 100%;
	height: 320px;
	border: 0;
	border-radius: 12px;
}

/* ===== فورم "تواصل معنا" المدمج ===== */
.scs-form-notice {
	padding: 14px 18px;
	border-radius: 10px;
	margin-bottom: 18px;
	font-size: 14px;
	font-weight: 600;
	border: 1px solid transparent;
}

.scs-form-notice.is-success {
	background: #eaf7ee;
	color: #1e7b34;
	border-color: #bfe6c9;
}

.scs-form-notice.is-error {
	background: #fdecec;
	color: #b3261e;
	border-color: #f3c2c0;
}

.scs-native-form {
	background: var(--scs-color-main);
	border-radius: 20px;
	padding: 32px 26px;
	box-shadow: 0 16px 40px rgba(25, 36, 42, 0.18);
}

.scs-form-honeypot {
	position: absolute;
	left: -9999px;
	top: -9999px;
}

.scs-form-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 18px;
	margin-bottom: 18px;
}

@media (max-width: 767px) {
	.scs-form-row {
		grid-template-columns: 1fr;
	}
}

.scs-form-field {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin-bottom: 18px;
}

.scs-form-row .scs-form-field {
	margin-bottom: 0;
}

.scs-form-field label {
	color: var(--scs-color-second);
	font-size: 13px;
	font-weight: 700;
}

.scs-form-field input,
.scs-form-field select,
.scs-form-field textarea {
	background: rgba(255, 255, 255, 0.07);
	border: 1px solid rgba(255, 223, 122, 0.25);
	border-radius: 10px;
	padding: 12px 14px;
	color: var(--scs-color-white);
	font-family: inherit;
	font-size: 14px;
	outline: none;
	transition: border-color 0.2s ease, background 0.2s ease;
}

.scs-form-field input::placeholder,
.scs-form-field textarea::placeholder {
	color: rgba(255, 255, 255, 0.5);
}

.scs-form-field input:focus,
.scs-form-field select:focus,
.scs-form-field textarea:focus {
	border-color: var(--scs-color-second);
	background: rgba(255, 255, 255, 0.12);
}

.scs-form-field select {
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffdf7b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: left 12px center;
	background-size: 16px;
	padding-left: 34px;
}

.scs-form-field select option {
	color: var(--scs-color-main);
}

.scs-form-field textarea {
	resize: vertical;
	min-height: 120px;
}

.scs-form-submit {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	background: var(--scs-color-second) !important;
	color: var(--scs-color-main) !important;
	border: 0 !important;
	outline: none !important;
	box-shadow: none !important;
	appearance: none;
	-webkit-appearance: none;
	border-radius: 999px !important;
	padding: 13px 30px !important;
	font-family: inherit;
	font-size: 15px;
	font-weight: 700;
	cursor: pointer;
	margin-top: 4px;
	transition: opacity 0.2s ease, transform 0.2s ease;
}

.scs-form-submit:hover,
.scs-form-submit:focus {
	opacity: 0.85;
	transform: translateY(-2px);
	outline: none !important;
	box-shadow: none !important;
}

.scs-form-submit-icon {
	width: 16px;
	height: 16px;
	display: inline-block;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20 12H4m6-6-6 6 6 6' fill='none' stroke='%2319242a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20 12H4m6-6-6 6 6 6' fill='none' stroke='%2319242a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}