/* Table of contents
=========================
1.Preloader
2.Scrollup
3.Header Section
 3.1.Header v2 Section
 
4.Menu  Section
5.Slider Section
 5.1 Slider V2
 
6.About Us Section
  6.1  About Us v2 Section
  
7.Title Section
8.Service Section
 8.1 Service V2
9.Consult Form Section
 9.1 Consult Form V2 Section
 
10.Project Gallery Section
11. Project Details Page Section
12.Service Section 
13.Count Up Section 
  13.1 Count Up Section 
14.Faq Section
15.Blog Section
16.Sidebar Section
17.Testimonial Section
  17.1 Testimonial V2 Section
  
18.Page Heading Section
19.Team section
  19.1 Team section
20.Faq Page
21.Contact Page
22.404 Page Section 
23.Footer Section 
24.Why Choose Us Section 
===========================*/

  /* Languages */

.lang-selector {
  display: flex;
  justify-content: center;
  gap: 12px;
  margin: 18px 0;
  padding: 0 10px;
}

.lang-item {
  background: #fff;
  border-radius: 16px;
  padding: 8px 12px;
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 6px;
  border: 1px solid #eee;
  box-shadow: 0 4px 12px rgba(0,0,0,.06);
  transition: .2s;
}

.lang-item img {
  width: 22px;
  height: 22px;
  border-radius: 4px;
}

.lang-item span {
  font-size: 14px;
  color: #333;
  font-weight: 600;
}

.lang-item:hover {
  transform: translateY(-3px);
  box-shadow: 0 6px 16px rgba(0,0,0,.10);
}

.header-right-div {
  display: flex;
  justify-content: center;
  align-items: center; /* ← يوسّط المحتوى رأسيًا */
  height: 100%;        /* ← علشان يتم التمركز حسب ارتفاع الهيدر */
}
/* توسيط اللغات في منتصف الشريط الأخضر */
.lang-selector {
  width: 100%;
  display: flex;
  justify-content: center; /* ← في المنتصف أفقياً */
  align-items: center;     /* ← في المنتصف رأسياً */
  margin: -8px auto;          /* ← يمنع الميل */
  padding: 18px 0;
 
}




/* =============== Why UAIC =============== */
.uaic-why{background:#f6f9fc; padding:40px 16px}
.uaic-why .why-wrap{max-width:1200px; margin:0 auto}

.why-head{text-align:center; margin-bottom:22px}
.why-head h2{
  margin:0 0 6px; font-size:clamp(1.4rem,2.2vw,2rem);
  color:#0b2f25; font-weight:900; letter-spacing:.2px
}
.why-head p{margin:0; color:#6b7280}

.why-grid{
  display:grid;
  grid-template-columns:repeat(4, minmax(0,1fr));
  gap:18px;
}
@media (max-width:992px){ .why-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:540px){ .why-grid{ grid-template-columns:1fr; } }

.why-card{
  background:#fff; border:1px solid #e8eef6; border-radius:18px;
  padding:18px; text-align:center;
  box-shadow:0 8px 24px rgba(0,0,0,.06);
  transition:transform .2s ease, box-shadow .2s ease;
}
.why-card:hover{
  transform:translateY(-3px);
  box-shadow:0 14px 30px rgba(0,0,0,.10);
}

.why-card .ic{
  width:64px;height:64px;margin:0 auto 10px;border-radius:16px;
  display:grid;place-items:center;
  color:#1e4029; /* أزرق أيقونات */
  background:linear-gradient(180deg,#f5f8ff,#eef3ff);
  border:1px solid #e1e7ff;
}
.why-card .ic svg{width:30px;height:30px}

.why-card h3{
  margin:6px 0 6px; font-size:1rem; color:#0b1b42; font-weight:800
}
.why-card p{
  margin:0; color:#64748b; font-size:.95rem; line-height:1.6
}
.why-card .ic svg {
  width: 32px;
  height: 32px;
  display: block;
}


/*------------------*/
/*Products Details start
/*------------------*/


:root{ --blue:#1e4029; --gold:#d4af37; --bg:#f6f8fb; }
*{box-sizing:border-box} body{margin:0;background:var(--bg);font-family:"Droid Arabic Kufi",Tahoma,Arial}
.container{max-width:1100px;margin:auto;padding:14px}
.header{padding:18px 14px;background:linear-gradient(135deg, rgba(28,78,128,.08), rgba(1,43,68,.12)), #fff;border-bottom:1px solid rgba(1,43,68,.08)}
.header h1{margin:0 0 8px;color:#1e4029}
.header p{margin:0;color:#335c81}
.grid{display:grid;gap:18px;grid-template-columns:1.1fr .9fr}
@media (max-width:900px){.grid{grid-template-columns:1fr}}
.card{background:#fff;border:1px solid rgba(1,43,68,.12);border-radius:16px;padding:12px}
.mainimg{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:12px;background:#e9eef5}
.thumbs{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:10px}
.thumbs img{width:100%;aspect-ratio:1/1;border-radius:10px;border:2px solid transparent;cursor:pointer;object-fit:cover}
.thumbs img.active{border-color:#1e4029}
.badges{display:flex;gap:8px;flex-wrap:wrap;margin:6px 0 10px}
.badge{font-size:11px;padding:5px 10px;border-radius:999px;background:rgba(212,175,55,.12);border:1px solid rgba(212,175,55,.4);color:#875e00}
.block{margin-top:14px}
.block h3{margin:0 0 8px;color:#1e4029;font-size:16px}
.specs{width:100%;border-collapse:separate;border-spacing:0;border-radius:12px;overflow:hidden;border:1px solid rgba(1,43,68,.12)}
.specs th,.specs td{padding:10px 12px;font-size:13px}
.specs th{background:#f1f5fa;color:#334e68;text-align:right;width:38%}
.cta{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
.btn{display:inline-block;padding:12px 14px;border-radius:12px;font-weight:700}
.btn-primary{background:linear-gradient(90deg,var(--gold),#ffd700);color:#232b3b}
.btn-outline{border:1px solid rgba(1,43,68,.25);color:#1e4029;background:#fff}
.variants{margin-top:14px}
.variants h3{margin:0 0 8px;color:#1e4029}
.var-grid{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(130px,1fr))}
.var-card{background:#fff;border:3px solid rgba(1,35,35,.15);border-radius:50px;padding:8px;display:flex;flex-direction:column;align-items:center;gap:6px;cursor:pointer;transition:.2s}
.var-card img{width:66px;height:66px;border-radius:50%;object-fit:cover;box-shadow:0 2px 6px rgba(0,0,0,.10)}
.var-card span{font-size:14px;color:#0b2540}
.var-card:hover{transform:translateY(-2px)}
.var-card.active{box-shadow:0 0 0 2px #1e4029 inset, 0 0 0 4px #d4af37 inset}

/* === placed variants + description under gallery === */
.card.gallery .variants{ margin-top:12px; border-top:1px dashed rgba(1,43,68,.12); padding-top:12px }
.card.gallery .variants h3{ margin:0 0 8px; color:#1e4029 }
.card.gallery .block-desc-under{ margin-top:12px; border-top:1px dashed rgba(1,43,68,.12); padding-top:12px }


#breadcrumbs{ top:113px;height:35px;width: 100%;overflow: hidden;min-height:0px;text-indent:10px;padding:9px 6 10px 0;  background-color:#ffffff;border:solid 2px #2d386f;border-radius: 25px; }
#breadcrumbs .breadcrumb {
    font-size: 14px !important; 
    font-family: 'Righteous-Regular', sans-serif;margin-top:7px
}
.header h1 { font-size: clamp(16px, 4.2vw, 46px); }
.header p  { font-size: clamp(11px, 2.2vw, 20px); line-height: 1.9; }

 #footer{position:fixed;bottom:0px;width: 100%;overflow:hidden;padding-top:5px ;border-top:3px solid #2d386f;background-color:#ffffff;border-top-left-radius:20px;border-top-right-radius:20px;}
 
@font-face {
font-family: "Righteous-Regular";
src: url("../eHotline/Righteous-Regular.ttf");
}
	#p3 
{
 font-size:8;
 font-weight:200
;font-family:Righteous-Regular;
 color:#2d386f;margin:1 0px 0px 0px;letter-spacing: 0px
}

.icon-links {
    display: flex;
    gap: 25px; /* مسافة بين الأيقونات */
    justify-content: center;
    align-items: center;
    margin-top: 10px;
}

.icon-links a {
    text-decoration: none; /* إزالة الخط تحت النص */
    color: #2d386f; /* لون الأيقونة أو النص */
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: 11px; /* حجم النص أسفل الأيقونة إذا موجود */
	font-family:Righteous-Regular
}

.icon-links a img {
    width: 25px; /* عرض الأيقونة */
    height: 25px; /* طول الأيقونة */
    margin-bottom: 5px; /* مسافة بين الأيقونة والنص */
    transition: transform 0.2s ease;
}

.icon-links a:hover img {
    transform: scale(1.2); /* تكبير عند المرور */
}



/*------------------*/
/*Products Details end
/*------------------*/











/*------------------*/
/*Theme default CSS
/*------------------*/
* {
  margin: 0;
  padding: 0;
  border: 0;
  outline: none; }

html,
body {
height: 100%;
font-size: 16px;
color: #808080;
font-family: 'Poppins', sans-serif;
vertical-align: baseline;
line-height: 26px;
}
a:focus {
  outline: 0px solid;
}
img {
  max-width: 100%;
  height: auto;
}
p {
  margin: 0 0 20px;
}
h1,
h2,
h3,
h4,
h5,
h6 {
margin: 0 0 20px;
font-weight: 600;
font-family:'Droid Arabic Kufi Bold', 'Poppins', sans-serif;
color: #1e4029;
}

h1 {
font-size: 32px;
}
h2 {
font-size: 18px;
}
h3 {
font-size: 16px;
}

a {
  transition: all 0.5s ease-out;
  text-decoration: none;color:#1e4029
}
a:active,
a:hover {
  outline: 0 none;
  color: #1e4029;text-decoration:none
}
ul {
  list-style: outside none none;
  margin: 0;
  padding: 0;
}

::-moz-selection {
  background: #e0b552;
  text-shadow: none;color:#fff
}
::selection {
  background: #e0b552;
  text-shadow: none;color:#fff
}
textarea:focus, input:focus{
    outline: none;
}
.slider-overlay {
  background-color:rgba(0, 0, 0, 0.40);
  height: 100%;  width: 100%;
  position: absolute;
  top: 0;z-index:1
}
.images-overlay {
   background-color:rgba(0, 0, 0, 0.60);
  height: 100%;
  position: absolute;  width: 100%;
  top: 0;

}
.pt-100{padding-top:100px}
.pb-100{padding-bottom:100px}
.pb-70{padding-bottom:70px}
.bg-color{background:#fbfbfb}
.no-padding-left{padding-left:0px}
.no-padding-right{padding-right:0px}
.bg-gray{
	background:#f0f0f0
}
/*
1.Preloader
============================*/
#preloader {
    position: fixed;
    top: 0;
    left: 0;
    background-color: #fff;
    z-index: 9999999;
	right: 0;
    bottom: 0;
}
#preloader-status {
    height: 210px;
	width: 210px;
    background: url(../img/preloader.gif);
    background-repeat: no-repeat;
    background-position: center;
    margin: -100px 0 0 -100px;
    position: absolute;
    left: 50%;
    top: 50%;	
}

/* Contact */
    .contact .c-grid{display:flex; gap:10px; flex-wrap:wrap}
    .contact .chip{padding:10px 12px; border-radius:999px; background:#fff; border:1px solid #e6ecf5; color:#0b2344; font-weight:900; box-shadow:var(--shadow)}


/*
2.Scrollup
==============*/
#scrollUp {
	background: #e0b552 none repeat scroll 0 0;
	border-radius: 100%;
	bottom: 5px;
	color: #fff;
	font-size:16px;
	height: 40px;
	right: 20px;
	text-align: center;
	text-decoration: none;
	width: 40px;
}
#scrollUp:hover {
  opacity: 1;
  color: #fff!important;background:#c9c00;
}
#scrollUp i {
display: block;
font-weight: bold;
padding-top: 11px;
}


 /* Features strip */
    .features{display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin:16px auto}
    .feat{background:#fff; border:1px solid #e6ecf5; border-radius:16px; padding:14px; text-align:center; box-shadow:var(--shadow)}
    .feat .ico{font-size:22px; display:block; margin-bottom:6px}
    .feat b{display:block}
    .feat small{color:var(--muted)}
/* Categories */
    section h2{font-size:24px; margin:6px 0 12px}
    .cats .grid{display:grid; grid-template-columns:repeat(4,1fr); gap:14px}
    .card{background:#fff; border:1px solid #e6ecf5; border-radius:16px; box-shadow:var(--shadow); overflow:hidden}
    .thumb{aspect-ratio:16/9; background:#f3f6fb}
    .thumb img{width:100%; height:100%; object-fit:cover}
    .info{padding:12px}
    .info h3{margin:0 0 6px; font-size:16px}
    .info p{margin:0; color:var(--muted)}
/*
3.Header Section
==================*/
.header-top {
	background: #e0b552;
	overflow:hidden;
}
.header-left {
	padding: 10px 0;	
}
.header-left ul {
	display: inline-block;
}
.header-left li{padding-right:40px;position:relative;display: inline-block;color: #1e4029;}
.header-left li:last-child{padding-right:0}
.header-left li i {
	color: #1e4029;
	font-size: 20px;
	margin-right: 15px;
}
.header-right-div {
	text-align: right;
	position: relative;
	z-index: 2;
}
.header-right-div::before {
	position: absolute;
	content: "";
	background: #1e4029;
	width: 5000px;
	height: 64px;
	top: 0;
	left: 0;
	transform: skew(-48deg);
	z-index: -2;
}
.follow-title {
	color: #e0b552;
}

.header-right a span {
	margin-left: 10px;
}
.soical-profile {
	padding-top: 7px;
}
.soical-profile,
.soical-profile li {
	display: inline-block;
}
.soical-profile li a i{
color:#d5d4d4;	width: 30px;
height: 30px;
text-align: center;
line-height: 30px;
border-radius:100%}
.soical-profile li a i:hover {
	background: #e0b552;
	color: #fff;
	transition: all 0.4s ease 0s;
}


/*
3.1.Header v2 Section
=================*/
.header-v2-top {
	background: #1e4029;
	overflow:hidden;
}
.header-v2-top-intro {
	float: left;
	text-align:left;
}
.header-v2-intro {
	display: inline-block;
	padding-right: 44px;
	position: relative;
	padding-top: 10px;
}
.header-v2-intro:last-child{
	padding-right:0px;
}
.header-v2-intro::before {
	border-right: 1px solid #ddd;
	content: "";
	height: 20px;
	position: absolute;
	right: 20px;
	top: 18px;
}
.header-v2-intro:last-child:before{
	display:none;
}
.header-v2-icon {
	display: inline-block;
	height: 40px;
	margin-right: 10px;
	position: relative;
	top: -15px;
	width: 40px;
}
.header-v2-text {
	text-align: left;
	display: inline-block;
}
.header-v2-text h5 {
	margin-bottom: 10px;
	color: #fff;
	text-transform: capitalize;
	margin-bottom: 5px;
}
.header-v2-text a {
	color: #808080;
}
.header-v2-top .header-right-div::before {
	background: none;
	height: 100px;
}
.header-v2-top .soical-profile li a i {
	color: #1e4029;
	background: #e0b552;
	border-radius: 0;
}
.header-v2-top .soical-profile li a i:hover{
	background:#fff;
}
.header-v2-top .soical-profile {
	padding-top: 18px;
}
/*
4.Menu  Section
=================*/
.logo-menu {
  padding: 20px;
  width: 400px !important;
  display: block;
  margin-left: auto;    /* يحرك العنصر لليمين */
  margin-right: 0;
  text-align: right;    /* لو داخله صورة */
}

.logo-menu img {
  max-width: 100%;
  height: auto;
  display: inline-block;
}

.menu {
  display: inline-block;
  width: 100%;
}
.main-menu {
	display: inline-block;
	text-align: right;
	margin-right: 40px;
}

.main-menu ul {
margin : 0;
padding : 0;
position : relative;
}
.main-menu ul li {
display: inline-block;
padding: 0;
position: relative;
}
.main-menu ul li a {
	color: #1e4029;
	display: block;
	font-size: 15px;
	padding: 40px 16px;
	text-decoration: none;
	text-transform: uppercase;
	transition: all 0.4s ease 0s;
	position: relative;
	font-weight: 600;
}
.main-menu ul li ul:hover .main-menu ul li a{
  background: #fafafa;
}
.main-menu ul li a:hover {
transition : all 0.4s 0s ease;
color:#e0b552
}

.main-menu ul ul {
background: #1e4029 none repeat scroll 0 0;
left: 0;
opacity: 0;
position: absolute;
text-align: left;
top:106px;
transition: all 0.4s ease 0s;
visibility: hidden;
z-index: 99999;
transition: all 0.3s ease 0s;
border-top:2px solid #e0b552;
}
.main-menu ul ul li {
float : none;
width : 220px;
}
.main-menu ul ul li a {
	line-height: 120%;
	padding: 10px 20px;
	color: #ddd;
	text-transform: capitalize;
	border-bottom: 1px solid #162f45;
}
.main-menu ul ul li a:hover {
color:#e0b552;background:#fff;
}
.main-menu ul ul ul {
top : 0;
left : 100%;
}
.main-menu ul li:hover ul {
	
 visibility: visible;transition: all 0.4s ease 0s; opacity: 1;
}
.main-menu ul li a i {
margin-left : 6px;
}
.search-bar-icon {
	display: inline-block;
	padding: 39px 0px;
	position: absolute;
	right: 0;
	top: 0;
}
.site-search span {
	display: inline-block;
	width: 30px;
	height: 30px;
	text-align: center;
	border-radius: 100%;
	cursor: pointer;
	transition: all 0.4s ease 0s;
	border: 1px solid #1e4029;
}
.site-search.open span i.fa-search::before {
	 content: "\f00d" !important; 
}
.site-search i {
  color: #1e4029;
}
.search-forum > form {
	display: inline-flex;
	background: #fff;
	padding: 18px 20px;
	border-top: 2px solid #f1c40f;
}
.search-forum input[type="text"] {
	padding: 10px;
	border: 1px solid #ddd;
	width: 200px;
}
.search-forum input[type="submit"] {
  padding: 10px;
  background: #22253a;
  color: #fff;
}
.search-forum {
	left: -233px;
	position: absolute;
	top: 105px;
	transition: all 0.4s ease 0s;
	z-index: 2;
}
.search-forum.dropdown-menu {
	padding: 0;
	border: 0px;
}
.animation{
	-webkit-animation-duration: 0.3s;
	animation-duration: 0.3s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
}

 @-webkit-keyframes slideUpIn {
	 0% {
		 
		 -webkit-transform: translateY(40px);
	 }
	 100% {
		 
		 -webkit-transform: translateY(0);
	 }
	 
	 0% {
		 -webkit-transform: translateY(40px);
	 }
}

@keyframes slideUpIn {
	0% {
		transform: translateY(40px);
	}
	100% {
		transform: translateY(0);
	}
	0% {
		transform: translateY(40px);
	}
}

.slideUpIn {
	-webkit-animation-name: slideUpIn;
	animation-name: slideUpIn;
}
.hd-sec.sticky_menu {
  background-color: #fff;
  left: 0;
  right: 0;
  top: 0;  
  position: fixed;
  z-index: 9999;
  box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.25);
 
}
.appoitment-button {
	position: relative;
	z-index: 2;
	width: 200px !important;
	padding: 28px  0;
	display: inline-block;
	  top: 30px;  
	text-align: right;
}
.appoitment-button a {
	 
	padding: 12px 16px;
	display: inline-block;
	font-weight: 600;text-transform: uppercase;font-size: 15px;color:#1e4029;
}
 
/*
 certificates Section
======================*/
.certificates-section {
  text-align: center;
  padding: 50px 20px;
  background-color: #1e4029; /* نفس لون الخلفية الموجود */
  color: white;
}

.certificates-section h2 {
  font-size: 28px;
  margin-bottom: 30px;
  font-weight: bold;
}

.certificates-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px;
}

.certificate-card {
  background: white;
  padding: 10px;
  border-radius: 8px;
  box-shadow: 0 4px 15px rgba(0,0,0,0.2);
  width: 200px;
  transition: transform 0.3s ease;
}

.certificate-card:hover {
  transform: scale(1.05);
}

.certificate-card img {
  width: 100%;
  height: auto;
  border-radius: 5px;
}

.uaic-icons-nav {
  display: flex;
  justify-content: center;
  gap: 82px;
  padding: 16px;
  background: #fff;
  border-bottom: 1px solid #e8eef6;
  box-shadow: 0 4px 12px rgba(0,0,0,.05);
  position: sticky; /* يبقى ثابت عند التمرير */
  top: 0;
  z-index: 1000;
}

.uaic-icons-nav a {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-decoration: none;
  color: #0b1b42;
  font-weight: 700;
  font-size: .9rem;
  transition: .3s;
}

.uaic-icons-nav a img {
  width: 40px;
  height: 40px;
  margin-bottom: 6px;
  transition: transform .3s;
}

.uaic-icons-nav a:hover img {
  transform: scale(1.1);
}

.uaic-icons-nav a:hover {
  color: #167a3a;
}



/* ===== Goals Section ===== */
.uaic-goals{background:#f7fafc; padding:34px 16px; scroll-margin-top:90px}
.uaic-goals .goals-wrap{max-width:1200px; margin:0 auto}

.goals-head{text-align:center; margin-bottom:20px}
.goals-head h2{
  margin:0 0 6px; font-weight:900; color:#0b2f25;
  font-size:clamp(1.2rem, 2.2vw, 1.8rem)
}
.goals-head p{margin:0; color:#64748b}

/* Grid of goals */
.goals-grid{
  list-style:none; padding:0; margin:0;
  display:grid; gap:14px;
  grid-template-columns:repeat(2, minmax(0,1fr));
}
@media (max-width:820px){ .goals-grid{ grid-template-columns:1fr; } }

.goals-grid li{
  position:relative; background:#fff; border:1px solid #e8eef6;
  border-radius:16px; padding:16px 68px 16px 12px;  /* مساحة لرقم اليسار (RTL) */
  box-shadow:0 10px 22px rgba(0,0,0,.05);
}

.goals-grid li .num{
  position:absolute; inset-inline-start:14px; inset-block:50%;
  transform:translateY(-50%);
  width:38px; height:38px; border-radius:11px;
  display:grid; place-items:center; font-weight:900; color:#fff;
  background:linear-gradient(135deg,#167a3a,#1c9a4a); /* أخضر */
  box-shadow:0 8px 16px rgba(22,122,58,.25);
}

/* النص */
.goals-grid li p{
  margin:0; color:#0b1b42; line-height:1.7; font-size:.98rem;
}

/* لمسة ذهبية خفيفة عند الـ hover */
.goals-grid li:hover{
  border-color:#e4c15e55;
  box-shadow:0 14px 28px rgba(0,0,0,.08);
}
/* ===== Timeline section ===== */
.uaic-timeline{background:#f6f9fc; padding:40px 16px; scroll-margin-top:90px}
.uaic-timeline .tl-wrap{max-width:1200px; margin:0 auto}

.tl-head{text-align:center; margin-bottom:18px}
.tl-head h2{margin:0 0 6px; font-weight:900; color:#0b2f25; font-size:clamp(1.3rem,2.6vw,2rem)}
.tl-head p{margin:0; color:#64748b}

.tl-sub{
  margin:22px 0 12px; color:#0b1b42; font-weight:900; font-size:1.05rem
}

/* خط التايملاين */
.tl{
  position:relative;
  padding:18px 0;
}
.tl::before{
  content:""; position:absolute; inset-block:0; inset-inline:50%;
  width:2px; transform:translateX(-50%);
  background:linear-gradient(180deg,#e4c15e,#caa13a,#e4c15e); opacity:.55;
  border-radius:2px;
}

/* عنصر */
.tl-item{
  position:relative;
  width:50%;
  padding-inline:22px;
}
.tl-item .dot{
  position:absolute; inset-inline:50%; transform:translate(-50%,-50%);
  top:50%;
  width:38px; height:38px; border-radius:50%;
  background:linear-gradient(135deg,#167a3a,#1c9a4a);
  color:#fff; font-weight:900; display:grid; place-items:center;
  box-shadow:0 10px 22px rgba(22,122,58,.25); z-index:2;
}
.tl-item .card{
  background:#fff; border:1px solid #e8eef6; border-radius:14px;
  padding:14px 16px; box-shadow:0 10px 24px rgba(0,0,0,.06);
  color:#0b1b42; line-height:1.7; font-size:.98rem;
}

/* يمين/يسار بالتناوب (RTL واعي) */
.tl-item:nth-child(odd){
  margin-inline-start:auto; /* يظهر على اليسار */
}
.tl-item:nth-child(even){
  margin-inline-end:auto;   /* يظهر على اليمين */
}

/* استجابة للموبايل: عمود واحد */
@media (max-width: 820px){
  .tl::before{ inset-inline:8px; transform:none; } /* الخط على أقصى اليمين */
  .tl-item{ width:100%; padding-inline-start:36px; padding-inline-end:0; }
  .tl-item .dot{ inset-inline:auto; right:0; transform:translate(50%,-50%); }
}

.uaic-benefits {
  background:#f9fafc;
  padding:40px 16px;
}
.uaic-benefits .wrap {
  max-width:1200px;
  margin:0 auto;
}
.benefits-head {
  text-align:center;
  margin-bottom:28px;
}
.benefits-head h2 {
  font-size:clamp(1.4rem,2.5vw,2rem);
  font-weight:900;
  color:#0b2f25;
  margin:0 0 6px;
}
.benefits-head p {
  color:#64748b;
  margin:0;
}

.benefits-sub {
  margin:20px 0 12px;
  font-size:1.1rem;
  font-weight:800;
  color:#167a3a;
}

.benefits-list {
  list-style:none;
  padding:0;
  margin:0 0 28px;
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  gap:14px;
}

.benefits-list li {
  background:#fff;
  border:1px solid #e8eef6;
  border-radius:14px;
  padding:16px 18px;
  box-shadow:0 6px 16px rgba(0,0,0,.05);
  line-height:1.7;
  color:#0b1b42;
  font-size:.96rem;
  transition:.3s;
}
.benefits-list li:hover {
  transform:translateY(-3px);
  box-shadow:0 12px 22px rgba(0,0,0,.08);
  border-color:#caa13a55;
}


.benefits-list li {
  display:flex;
  align-items:flex-start;
  gap:10px;
  background:#fff;
  border:1px solid #e8eef6;
  border-radius:14px;
  padding:14px 16px;
  box-shadow:0 6px 16px rgba(0,0,0,.05);
  line-height:1.7;
  color:#0b1b42;
  font-size:.96rem;
  transition:.3s;
}

.benefits-list li:hover {
  transform:translateY(-3px);
  box-shadow:0 12px 22px rgba(0,0,0,.08);
  border-color:#caa13a55;
}

.benefits-list .icon {
  font-size:1.3rem;
  flex-shrink:0;
}



/* ===== Section shell ===== */
.af-section{background:#f6f9fc; padding:40px 16px; scroll-margin-top:100px}
.af-wrap{max-width:1200px; margin:0 auto}

/* ===== Header ===== */
.af-sec-head{ text-align:center; margin-bottom:20px }
.af-sec-head h2{
  margin:8px 0 4px; font-weight:900; color:#0b2f25;
  font-size:clamp(1.4rem,2.6vw,2rem)
}
.af-lead{color:#64748b; margin:0}
.af-chip{
  display:inline-flex; align-items:center; gap:8px;
  padding:6px 12px; border-radius:12px; font-weight:800;
  background:linear-gradient(135deg,#fff,#f1f5f9);
  border:1px solid #e8eef6; color:#0b1b42
}
.af-chip .af-icon{width:18px;height:18px}

/* ===== Org Tree ===== */
.org-tree{
  position:relative;
  padding:10px 0 12px;
}

/* العمود الذهبي في المنتصف (desktop) */
@media (min-width: 992px){
  .org-tree::before{
    content:""; position:absolute; inset-block:0; inset-inline:50%;
    width:2px; transform:translateX(-50%);
    background:linear-gradient(180deg,#e4c15e,#caa13a,#e4c15e); opacity:.6; border-radius:2px;
  }
}

/* مستوى */
.org-level{
  position:relative;
  display:flex; justify-content:center;
  margin-block:18px;
  padding-inline:14px;
}

/* بطاقات المستوى */
.org-card{
  background:#fff; border:1px solid #e8eef6; border-radius:16px;
  box-shadow:0 10px 24px rgba(0,0,0,.06);
  padding:18px; color:#0b1b42; line-height:1.8;
  width:min(800px, 100%);
}

/* عنوان البطاقة */
.org-card h3{ margin:0 0 8px; font-weight:900; color:#0b2f25 }

/* الشارة الدائرية (الإيموجي/الرمز) */
.org-card .lvl{
  display:inline-grid; place-items:center;
  width:38px;height:38px;border-radius:50%;
  background:linear-gradient(135deg,#167a3a,#1c9a4a); color:#fff; font-weight:900;
  margin-inline-start:8px;
}

/* القوائم الداخلية في البطاقات */
.org-card ul{ margin:10px 0 0; padding:0 1rem }
.org-card li{ margin:4px 0 }

/* ===== اتصال بصري بين المستويات المفردة والعمود الذهبي ===== */
@media (min-width: 992px){
  .org-level:not(.split)::after{
    content:""; position:absolute; inset-inline:50%; transform:translateX(-50%);
    top:-14px; width:2px; height:28px; background:#e4c15e; opacity:.65;
  }
}

/* ===== مستوى مُقسّم (الإدارات) ===== */
.org-level.split{
  display:grid; gap:20px;
}

/* Desktop: عمودان متساويان */
@media (min-width: 992px){
  .org-level.split{
    grid-template-columns:1fr 1fr;
    align-items:start;
  }
  .org-level.split .org-card{
    width:100%;
  }
  /* أذرع أفقية صغيرة من العمود الذهبي للبطاقتين */
  .org-level.split::before,
  .org-level.split::after{
    content:""; position:absolute; inset-inline:50%; transform:translateX(-50%);
    width:46px; height:2px; background:#e4c15e; opacity:.65; top:24px;
  }
  .org-level.split::before{ margin-inline-start:-46px; } /* ذراع لليسار */
  .org-level.split::after{ margin-inline-end:-46px; }   /* ذراع لليمين */
}

/* ===== Responsive (Tablet/Mobile) ===== */
@media (max-width: 991.98px){
  /* إلغاء العمود الذهبي وتراص عمودي */
  .org-tree::before{ display:none }
  .org-level{ margin-block:14px }
  .org-level.split{ grid-template-columns:1fr }
  .org-card{ width:100% }
}

/* لمسة ذهبية على الحافة */
.org-card{ border:1px solid #e8eef6; position:relative }
.org-card::after{
  content:""; position:absolute; inset:0; border-radius:16px; padding:1px;
  background:linear-gradient(135deg,#e4c15e,#ffffff00 65%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
}
/* ===== Shell ===== */
.af-section{background:#f6f9fc; padding:40px 16px; scroll-margin-top:100px}
.af-wrap{max-width:1200px; margin:0 auto}

/* ===== Header ===== */
.af-sec-head{text-align:center; margin-bottom:18px}
.af-sec-head h2{margin:8px 0 4px; font-weight:900; color:#0b2f25; font-size:clamp(1.4rem,2.6vw,2rem)}
.af-lead{color:#64748b; margin:0}
.af-chip{display:inline-flex; align-items:center; gap:8px; padding:6px 12px; border-radius:12px; font-weight:800; background:linear-gradient(135deg,#fff,#f1f5f9); border:1px solid #e8eef6; color:#0b1b42}
.af-chip .af-icon{width:18px;height:18px}

/* ===== Org tree (desktop center line) ===== */
.org-tree{position:relative; padding:10px 0}
@media (min-width:992px){
  .org-tree::before{
    content:""; position:absolute; top:0; bottom:0; left:50%; transform:translateX(-50%);
    width:2px; background:linear-gradient(180deg,#e4c15e,#caa13a,#e4c15e); opacity:.6; border-radius:2px; z-index:0;
  }
}

/* ===== Levels ===== */
.org-level{position:relative; margin:26px 0; padding:0 14px}
.org-level:not(.split)::after{
  /* وصلة قصيرة من الخط الذهبي للبطاقة */
  content:""; position:absolute; left:50%; transform:translateX(-50%); top:-18px; width:2px; height:36px;
  background:#e4c15e; opacity:.6; border-radius:2px;
}

/* ===== Cards ===== */
.org-card{
  position:relative; z-index:1;
  max-width:980px; margin:0 auto;               /* تمركز الكارت في المنتصف */
  background:#fff; border:1px solid #e8eef6; border-radius:16px;
  box-shadow:0 10px 24px rgba(0,0,0,.06);
  padding:22px 24px; color:#0b1b42; line-height:1.85;
}
.org-card h3{margin:0 0 8px; font-weight:900; color:#0b2f25}
.org-card .lvl{
  display:inline-grid; place-items:center; width:38px; height:38px; border-radius:50%;
  margin-inline-start:8px; background:linear-gradient(135deg,#167a3a,#1c9a4a); color:#fff; font-weight:900;
}
/* لمسة ذهبية على الحافة */
.org-card::after{
  content:""; position:absolute; inset:0; border-radius:16px; padding:1px;
  background:linear-gradient(135deg,#e4c15e,transparent 65%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
}

/* ===== الإدارات (عمودان متساويان) ===== */
.org-level.split{
  max-width:1100px; margin:26px auto; display:grid; grid-template-columns:1fr 1fr; gap:24px; align-items:stretch; position:relative;
}
.org-level.split .org-card{height:100%; max-width:none; margin:0}

/* أذرع توصيل من الخط الذهبي للبطاقتين */
@media (min-width:992px){
  .org-level.split .org-card{position:relative}
  .org-level.split .org-card:first-child::before,
  .org-level.split .org-card:last-child::before{
    content:""; position:absolute; top:24px; width:40px; height:2px; background:#e4c15e; opacity:.65
  }
  .org-level.split .org-card:first-child::before{ right:-20px } /* الكارت اليسار (RTL) – وصلة لليمين */
  .org-level.split .org-card:last-child::before{ left:-20px }  /* الكارت اليمين – وصلة لليسار */
}

/* قوائم داخل البطاقات */
.org-card ul{margin:10px 0 0; padding:0 1.1rem}
.org-card li{margin:4px 0}

/* ===== Responsive ===== */
@media (max-width:991.98px){
  .org-tree::before{display:none}
  .org-level{margin:18px 0}
  .org-level.split{grid-template-columns:1fr}
}
/* ===== عنوان القسم (الإدارات) ===== */
.org-title-card {
  text-align:center;
  background:linear-gradient(135deg,#fffbe6,#fff);
  border:1px solid #e4c15e;
  box-shadow:0 6px 14px rgba(202,161,58,.2);
}

.org-title-card h3 {
  margin:0;
  font-weight:900;
  color:#0b2f25;
  font-size:1.2rem;
}
.org-title-card p {
  margin:6px 0 0;
  font-size:.95rem;
  color:#64748b;
}

/* وصلة ذهبية قصيرة من العنوان إلى العمود الرئيسي */
@media (min-width:992px){
  .org-level.section-title::after {
    content:"";
    position:absolute;
    left:50%; transform:translateX(-50%);
    bottom:-18px; width:2px; height:36px;
    background:#e4c15e; opacity:.7; border-radius:2px;
  }
}





/* ===== Membership Section ===== */
.uaic-membership{background:#f6f9fc; padding:40px 16px; scroll-margin-top:100px}
.mb-wrap{max-width:1200px; margin:0 auto}

.mb-head{text-align:center; margin-bottom:22px}
.mb-head h2{margin:0 0 6px; font-weight:900; color:#0b2f25; font-size:clamp(1.3rem,2.6vw,2rem)}
.mb-lead{margin:0; color:#64748b}

.mb-sub{
  margin:22px 0 12px; font-weight:900; color:#0b1b42; font-size:1.08rem
}

/* grid */
.mb-grid{
  display:grid; gap:16px;
  grid-template-columns:repeat(3, minmax(0,1fr));
}
@media (max-width:1024px){ .mb-grid{ grid-template-columns:repeat(2, 1fr);} }
@media (max-width:640px){ .mb-grid{ grid-template-columns:1fr;} }

/* cards */
.mb-card{
  position:relative;
  background:#fff;
  border:1px solid #e8eef6; border-radius:18px;
  padding:18px 18px 20px;
  box-shadow:0 10px 24px rgba(0,0,0,.06);
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.mb-card::after{
  content:""; position:absolute; inset:0; padding:1px; border-radius:18px;
  background:linear-gradient(135deg,#e4c15e,transparent 65%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
}
.mb-card:hover{
  transform:translateY(-4px);
  box-shadow:0 14px 30px rgba(0,0,0,.10);
  border-color:#e4c15e55;
}

.mb-chip{
  display:inline-flex; align-items:center; gap:8px;
  font-weight:800; color:#0b2f25;
  background:linear-gradient(135deg,#ffffff,#f1f5f9);
  border:1px solid #e8eef6; border-radius:12px; padding:6px 12px; margin-bottom:10px;
}

.mb-price{margin:6px 0 8px; color:#0b1b42}
.mb-price .lbl{opacity:.7; margin-inline-start:4px}
.mb-price strong{font-size:1.4rem; letter-spacing:.5px}
.mb-price .ccy{margin-inline-start:6px; color:#6b7280}
.mb-desc{margin:0; color:#27324a; line-height:1.8}

/* VIP styling */
.mb-grid.vip .mb-card{isolation:isolate}
.mb-ribbon{
  position:absolute; top:12px; inset-inline-start:-8px; z-index:2;
  transform:skewX(-10deg);
}
.mb-ribbon span{
  display:inline-block; padding:6px 12px; border-radius:10px;
  color:#fff; font-weight:900; letter-spacing:.3px;
  box-shadow:0 6px 14px rgba(0,0,0,.18);
  transform:skewX(10deg); /* يعادل ميلان الحاوية */
}
.vip-card.silver .mb-ribbon span{ background:linear-gradient(135deg,#9ea7b3,#c4cbd4) }
.vip-card.gold .mb-ribbon span{ background:linear-gradient(135deg,#caa13a,#e7c867) }
.vip-card.platinum .mb-ribbon span{ background:linear-gradient(135deg,#7d8fa1,#c9d4df) }

/* هالة بسيطة للـVIP */
.vip-card.gold{ box-shadow:0 16px 42px rgba(202,161,58,.18) }
.vip-card.platinum{ box-shadow:0 16px 42px rgba(125,143,161,.16) }
.vip-card.silver{ box-shadow:0 16px 42px rgba(158,167,179,.16) }
/* === Membership polish pack === */

/* شبكة الكروت: نفس الأعمدة لكن نخلي كل الكروت تتمدد بالتساوي */
.mb-grid{ align-items:stretch }

/* الكارت: عمود مرن علشان الوصف ما يزق الشارة */
.mb-card{
  display:flex; flex-direction:column; gap:10px;
  height:100%;
  padding:20px 20px 22px;
  border-radius:18px;
}

/* بادج عنوان الفئة */
.mb-chip{
  align-self:flex-start;
  margin-bottom:4px;
  padding:7px 12px;
  border-radius:12px;
}

/* السعر: ترتيب أوضح وارتفاع موحّد */
.mb-price{
  display:flex; align-items:baseline; gap:8px;
  flex-wrap:wrap;
  margin:6px 0 6px;
}
.mb-price .lbl{ order:1; opacity:.75 }
.mb-price strong{ order:2; font-size:1.6rem; line-height:1 }
.mb-price .ccy{ order:3; color:#6b7280 }

/* الوصف يكمّل المساحة لتوحيد الارتفاع */
.mb-desc{ margin-top:auto; line-height:1.85 }

/* شارات VIP: مثبتة أعلى اليمين كبساط أنيق */
.mb-ribbon{
  position:absolute; top:-12px; inset-inline-end:12px; /* بدلاً من start */
  transform:none; z-index:3;
}
.mb-ribbon span{
  display:inline-block;
  padding:6px 12px;
  border-radius:999px;
  color:#fff; font-weight:900; letter-spacing:.2px;
  box-shadow:0 8px 18px rgba(0,0,0,.18);
}
.vip-card.silver .mb-ribbon span{ background:linear-gradient(135deg,#9ea7b3,#c4cbd4) }
.vip-card.gold   .mb-ribbon span{ background:linear-gradient(135deg,#caa13a,#e7c867) }
.vip-card.platinum .mb-ribbon span{ background:linear-gradient(135deg,#7d8fa1,#c9d4df) }

/* ظل/حدود متناسقة أكثر */
.mb-card:hover{
  transform:translateY(-4px);
  box-shadow:0 16px 34px rgba(0,0,0,.12);
}
.mb-card::after{
  border-radius:18px;
}

/* تباعد بين مجموعتي الأساسـي و VIP */
.mb-grid + .mb-sub{ margin-top:28px }

/* استجابة أفضل */
@media (max-width:1024px){
  .mb-price strong{ font-size:1.45rem }
}
@media (max-width:640px){
  .mb-card{ padding:18px }
  .mb-ribbon{ top:-10px; inset-inline-end:10px }
}



/* ===== Bylaws Section (Desktop-first) ===== */
#aflaws, #bylaws{} /* just a guard if ids change */

.af-section{background:#f6f9fc; padding:40px 16px; scroll-margin-top:100px}
.af-wrap{max-width:1200px; margin:0 auto}

/* Header */
.af-sec-head{ text-align:center; margin-bottom:18px }
.af-sec-head h2{
  margin:10px 0 6px; font-weight:900; color:#0b2f25;
  font-size:clamp(1.3rem,2.6vw,2rem)
}
.af-lead{margin:0; color:#64748b}
.af-chip{
  display:inline-flex; align-items:center; gap:8px;
  padding:6px 12px; border-radius:12px; font-weight:800;
  background:linear-gradient(135deg,#fff,#f1f5f9);
  border:1px solid #e8eef6; color:#0b1b42
}
.af-chip .af-icon{width:18px;height:18px}

/* Search */
.law-search{
  margin:14px auto 6px; max-width:820px; display:flex; flex-direction:column; gap:6px
}
.law-search input[type="search"]{
  padding:12px 14px; border-radius:12px; border:1px solid #dfe7f2;
  background:#fff; outline:none; font-size:.98rem; color:#0b1b42;
  box-shadow:0 6px 14px rgba(0,0,0,.04);
}
.law-search input[type="search"]:focus{
  border-color:#caa13a; box-shadow:0 8px 22px rgba(202,161,58,.15)
}
.law-hint{color:#64748b; min-height:1em}

/* Tabs (pills) */
.pill-tabs{ display:flex; gap:10px; justify-content:center; margin:18px 0 }
.pill{
  background:#fff; border:1px solid #e8eef6; border-radius:999px;
  padding:8px 14px; font-weight:800; cursor:pointer; transition:.2s; color:#0b1b42
}
.pill.active, .pill:hover{
  color:#fff; border-color:transparent;
  background:linear-gradient(135deg,#167a3a,#1c9a4a)
}

/* Panel visibility */
.tab-panel{ display:none }
.tab-panel.show{ display:block }

/* Law hero */
.law-hero{
  margin:8px 0 14px; padding:18px; border-radius:14px;
  background:linear-gradient(135deg,#fffbe6,#fff);
  border:1px solid #e4c15e40; color:#0b1b42; text-align:center
}
.law-hero h3{ margin:0 0 6px; font-weight:900; color:#0b2f25 }
 
/* TOC + content layout on desktop */
@media (min-width: 992px){
  #tab-constitution{ display:grid; grid-template-columns:280px 1fr; gap:18px }
  .law-hero{ grid-column:1 / -1 }
}

.law-toc{
  display:flex; gap:8px; flex-wrap:wrap;
  background:#fff; border:1px solid #e8eef6; border-radius:14px;
  padding:10px; box-shadow:0 8px 20px rgba(0,0,0,.05)
}
.law-toc a{
  flex:1 1 auto; text-align:center; text-decoration:none;
  background:#f6f9fc; border:1px solid #e8eef6; color:#0b1b42;
  padding:8px 10px; border-radius:10px; font-weight:800; transition:.2s
}
.law-toc a:hover{ background:#eef5ff }
@media (min-width: 992px){
  .law-toc{
    position:sticky; top:110px;
    display:flex; flex-direction:column; gap:8px; align-self:start
  }
  .law-toc a{ text-align:inherit }
}

/* Chapters (details) */
.chapter{
  background:#fff; border:1px solid #e8eef6; border-radius:14px;
  margin:10px 0; overflow:hidden; box-shadow:0 8px 20px rgba(0,0,0,.05)
}
.chapter[open]{ border-color:#e4c15e55 }
.chapter summary{
  list-style:none; cursor:pointer; display:flex; align-items:center; gap:10px;
  padding:12px 14px; background:linear-gradient(180deg,#fff,#f8fbff);
  border-bottom:1px solid #eef2f7
}
.chapter summary::-webkit-details-marker{ display:none }
.badge{
  display:inline-block; padding:6px 10px; border-radius:10px; font-weight:900;
  background:linear-gradient(135deg,#167a3a,#1c9a4a); color:#fff
}
.chapter h4{ margin:0; color:#0b1b42; font-weight:900 }

.chapter-body{ padding:14px 16px }
.article{ margin:8px 0 14px }
.art-head{ font-weight:900; color:#0b2f25; margin-bottom:6px }
.art-list{ margin:0; padding:0 1.2rem }
.art-list.two-cols{ display:grid; grid-template-columns:1fr 1fr; gap:6px 24px }
@media (max-width: 700px){ .art-list.two-cols{ grid-template-columns:1fr } }

/* Anchor highlight */
:target .art-head, :target h4{ color:#167a3a }

/* Search highlight */
mark.law-hit{
  background:#fde68a; color:#0b1b42; padding:0 .15em; border-radius:4px
}

/* 1) ثبّتي تخطيط عمودين على الديسكتوب: فهرس يسار + محتوى يمين */
@media (min-width: 992px){
  #tab-constitution{
    display: grid !important;
    grid-template-columns: 300px minmax(0,1fr);
    gap: 18px;
    align-items: start;
  }

  /* الفهرس في العمود الأول فقط، ويكون sticky داخل عموده */
  #tab-constitution > .law-toc{
    grid-column: 1 !important;
    position: sticky !important;
    top: 110px;          /* عدّليها حسب ارتفاع الهيدر عندك */
    bottom: auto;        /* مهم: منع التثبيت أسفل الشاشة */
    height: max-content; 
    align-self: start;
    z-index: 0;          /* مايغطيش المحتوى */
  }

  /* باقي العناصر (الهيرو والفصول) في العمود الثاني */
  #tab-constitution > .law-hero,
  #tab-constitution > .chapter{
    grid-column: 2 !important;
    position: relative;
    z-index: 1;
  }
}

/* 2) أوقفي الـsticky على الشاشات الأصغر نهائياً */
@media (max-width: 991.98px){
  #bylaws .law-toc{
    position: static !important;
    top: auto !important;
    bottom: auto !important;
  }
}

/* 3) في حال كان عندك أي كود قديم مدي له أولوية أقل */
#bylaws .law-toc{ will-change: auto; } /* فقط لإلغاء أي سلوك غريب */
.tab-panel{ display:none; }
.tab-panel.show{ display:block; }



.tab-panel {
  display: none;
}
.tab-panel.is-active {
  display: block;
}






/* ===== Section shell ===== */
#departments.af-section{background:#f6f9fc; padding:40px 16px; scroll-margin-top:100px}
#departments .af-wrap{max-width:1200px; margin:0 auto}

#departments .af-sec-head{text-align:center; margin-bottom:18px}
#departments .af-sec-head h2{
  margin:8px 0 6px; font-weight:900; color:#0b2f25; font-size:clamp(1.3rem,2.6vw,2rem)
}
#departments .af-lead{margin:0; color:#64748b}
#departments .af-chip{
  display:inline-flex; align-items:center; gap:8px; padding:6px 12px; border-radius:12px;
  background:linear-gradient(135deg,#fff,#f1f5f9); border:1px solid #e8eef6; font-weight:800; color:#0b1b42
}

/* ===== Tabs (pills) ===== */
#departments .pill-tabs{display:flex; gap:10px; justify-content:center; margin:18px 0}
#departments .pill{
  background:#fff; border:1px solid #e8eef6; border-radius:999px;
  padding:8px 14px; font-weight:800; cursor:pointer; transition:.2s; color:#0b1b42
}
#departments .pill.active, #departments .pill:hover{
  color:#fff; border-color:transparent; background:linear-gradient(135deg,#167a3a,#1c9a4a)
}

/* ===== Panels visibility ===== */
#departments .dept-panel{display:none}
#departments .dept-panel.is-active{display:block}
#departments .dept-panel[hidden]{display:none !important}

/* ===== Grid of cards ===== */
#departments .dept-grid{
  display:grid; gap:16px;
  grid-template-columns:repeat(3, minmax(0,1fr));
  align-items:stretch;
}
@media (max-width:1024px){ #departments .dept-grid{ grid-template-columns:repeat(2,1fr) } }
@media (max-width:640px){  #departments .dept-grid{ grid-template-columns:1fr } }

/* ===== Card ===== */
#departments .dept-card{
  position:relative; height:100%;
  background:#fff; border:1px solid #e8eef6; border-radius:18px;
  padding:18px 16px 20px; display:flex; flex-direction:column; gap:12px;
  box-shadow:0 10px 24px rgba(0,0,0,.06);
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
  isolation:isolate;
}
#departments .dept-card:hover{
  transform:translateY(-4px);
  box-shadow:0 16px 32px rgba(0,0,0,.12);
  border-color:#e4c15e55;
}
/* لمسة ذهبية على الحافة */
#departments .dept-card::after{
  content:""; position:absolute; inset:0; border-radius:18px; padding:1px;
  background:linear-gradient(135deg,#e4c15e,transparent 65%);
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
}

/* أيقونة دائرية */
#departments .dept-card .icon{
  width:48px; height:48px; border-radius:50%;
  display:grid; place-items:center;
  background:linear-gradient(135deg,#167a3a,#1c9a4a);
  color:#fff; box-shadow:0 8px 18px rgba(22,122,58,.25);
}
#departments .dept-card .icon svg{width:26px; height:26px; stroke:#fff}

/* العنوان */
#departments .dept-card h4{
  margin:0; color:#0b1b42; font-weight:900; line-height:1.5; font-size:1rem
}

/* Edge شريط خفيف أعلى البطاقة */
#departments .dept-card .edge{
  position:absolute; inset-inline:0; top:0; height:4px; border-top-left-radius:18px; border-top-right-radius:18px;
  background:linear-gradient(90deg,#e4c15e,#f7e7b2 50%,#e4c15e);
  opacity:.65;
}

/* تنويع ألوان الأيقونة قليلاً لكل عمود (اختياري) */
#departments .dept-grid .dept-card:nth-child(3n+1) .icon{background:linear-gradient(135deg,#0f6b36,#19924a)}
#departments .dept-grid .dept-card:nth-child(3n+2) .icon{background:linear-gradient(135deg,#0a5a8a,#1e88c9)}
#departments .dept-grid .dept-card:nth-child(3n+3) .icon{background:linear-gradient(135deg,#7a3ec9,#a16fe3)}



/*
 Abut Section Starts
======================*/
/* ====== Base ====== */
:root{
  --ink:#0e2a3b;       /* نص/عناوين داكنة قريبة من النيفي */
  --muted:#5f6c76;     /* نص ثانوي */
  --card:#ffffff;      /* خلفية البطاقات */
  --bg:#f7f8fa;        /* خلفية خفيفة للقسم */
  --primary:#0e2a3b;   /* للزر والأيقونات */
  --shadow: 0 10px 25px rgba(0,0,0,.06);
  --radius:14px;
}

.provide-section{
  background: var(--bg);
  padding: 80px 0;
}
.container{
  width: min(1200px, 92%);
  margin: 0 auto;
}
.provide-grid{
  display: grid;
  grid-template-columns: 1.1fr 1.2fr; /* يسار نص كبير / يمين بطاقات */
  gap: 40px;
  align-items: start;
}

/* ====== Left (About) ====== */
.provide-left h2{
  font-size: clamp(28px, 3.4vw, 40px);
  color: var(--ink);
  margin: 0 0 18px;
  letter-spacing:.2px;
}
.provide-left p{
  color: var(--muted);
  line-height: 1.85;
  font-size: 17px;
  margin: 0 0 14px;
}
.provide-left .btn-primary{
  display: inline-block;
  margin-top: 10px;
  background: var(--primary);
  color:#fff;
  padding: 12px 20px;
  border-radius: 10px;
  font-weight: 700;
  text-decoration: none;
  box-shadow: var(--shadow);
  transition:.25s ease;
}
.provide-left .btn-primary:hover{
  transform: translateY(-2px);
  opacity:.9;
}

/* ====== Right (Cards) ====== */
.provide-right{
  display: grid;
  grid-template-columns: repeat(2, minmax(260px,1fr));
  gap: 26px;
}
.service-card{
  background: var(--card);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 24px 22px;
  border: 1px solid #eef1f4;
  transition: transform .25s ease, box-shadow .25s ease;
}
.service-card:hover{
  transform: translateY(-4px);
  box-shadow: 0 16px 40px rgba(0,0,0,.08);
}
.card-head{
  display:flex;
  align-items:center;
  gap:16px;
  margin-bottom: 10px;
  color: var(--primary);
}
.card-head h3{
  margin:0;
  font-size: 22px;
  color: var(--ink);
}
.service-card p{
  margin: 8px 0 0;
  color: var(--muted);
  line-height: 1.8;
  font-size: 16px;
}

/* آخر بطاقة تمتد مثل التخطيط الأصلي لو أردتِ صفين */
.provide-right .service-card:nth-child(3){
  grid-column: span 2;
}

/* ====== Responsive ====== */
@media (max-width: 992px){
  .provide-grid{ grid-template-columns: 1fr; }
  .provide-right{ grid-template-columns: 1fr; }
  .provide-right .service-card:nth-child(3){ grid-column: auto; }
}
/* ====== About Section ends ====== */
/*
5.Slider Section
======================*/
.all-slide .owl-item {
  height: 650px;
}
.all-slide .single-slide {
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
height: 100%;
}
.slider-wrapper {
	width: 1170px;
	padding: 15px 0;
	margin: 0px auto;
	height: 100%;
}
.slider-text {
left: 0;
position: relative;
right:0;
top: 50%;
transform: translateY(-50%);
z-index: 2;
text-align:left;

}
.slider-caption {
	width: 780px;
}
.slider-caption span.subtitle {
	color: #ffffff;
	font-size: 24px;
	text-transform: capitalize;
}
.slider-text ul {
  margin-top: 20px;
}
.slider-text h1 {
	color: #fff;
	font-size: 48px;
	text-transform: capitalize;
	line-height: 60px;
	margin-bottom: 10px;
}
.slider-text h1 > span{color:#e0b552;}
.slider-text p {
  color: #fff;
}
.slider-text li {
  display: inline-block;
}
.slider-text li a {
	background: #e0b552;
	color: #fff;
	display: inline-block;
	padding: 12px 30px;
	text-transform: uppercase;
	position: relative;
	z-index: 5;
	transition: 0.5s;
	font-weight: 600;
	position: related;
	transition: all 0.4s ease 0s;
	margin-right: 10px;
}
.slider-text li a:hover:before{
	visibility:visible;transition: all 0.4s ease 0s;margin-left:0px;opacity:1;
}
.slider-text li a:before{
content: "\f178";
font-family: fontawesome;
float:right;top:0px;
position: relative;color:#fff;padding-left:10px;transition: all 0.4s ease 0s;
margin-left: -50px;visibility:hidden;
opacity:0;
}
.slider-text li a:hover{background:#e0b552;color:#fff;transition: all 0.4s ease 0s;border-color:#e0b552;}
.slider-text li:last-child a{background:#fff;color:#e0b552}
.slider-text li:last-child a:hover{background:#1e4029;color:#fff;transition: all 0.4s ease 0s;border-color:#1e4029;}
.all-slide .owl-controls {
	position: absolute;
	bottom: 80px;
	width: 768px;
	z-index: 99;
	text-align: right;
	left: 0;
	margin: 0px auto;
	right: 0;
}
.all-slide .owl-controls .owl-nav {
	display: inline-block;
}
.all-slide .owl-controls .owl-buttons div {
background: none;
opacity: 1.00;
}

.all-slide .owl-controls .owl-prev {
	left: -50px;
	position: relative;
	transition: all 0.4s ease 0s;
	display: inline-block;
	float: left;
}
.all-slide:hover .owl-prev{transition: all 0.4s ease 0s;}

.all-slide .owl-controls .owl-next {
	position: absolute;
	transition: all 0.4s ease 0s;
}
.all-slide:hover .owl-next{transition: all 0.4s ease 0s;}
.all-slide .owl-controls .owl-prev i, .all-slide .owl-controls .owl-next i {
	background: transparent;
	color: #fff;
	font-size: 32px;
	height: 40px;
	line-height: 40px;
	text-align: center;
	transition: all 0.5s ease-out 0s;
	width: 40px;
	border: 1px solid #fff;
}
.all-slide .owl-controls .owl-next i{
	background: #e0b552;
	border-color:#e0b552;
}
.all-slide .owl-controls .owl-next i:hover {
transition: all 0.5s ease-out 0s;background:#e0b552;color:#fff;border-color:#e0b552;
}
.all-slide .owl-controls .owl-prev i:hover {
transition: all 0.5s ease-out 0s;background:#e0b552;color:#fff;border-color:#e0b552;
}

.header-right span {
	color: #ffffff;
}
.header-right span i {
	margin-right: 10px;
}
.hd-search-field {
	position: absolute;
	right: 24px;
	top: 5px;
}
.hd-search-field form {
	width: 190px;
	position: relative;
}
.hd-search-field input[type="text"] {
	background: transparent;
	padding: 3px 35px 3px 10px;
	width: 100%;
	border: 1px solid #858484;
	border-radius: 6px;
}
.hd-search-field button {
	background: transparent;
	color: #fff;
	position: absolute;
	padding: 4px 10px;
	right: 0;
	top: 0;
}
.hd-search-field button i{color:#858484;}
.blog-sec .pagination.custom-pagination {
  text-align: left;
  width: 100%;
}
.pagination.custom-pagination li {
  display: inline-block;
}
.pagination.custom-pagination li a {
color: #999999;
font-size: 16px;
font-weight: 600;
height: 36px;
line-height: 22px;
margin: 2px 5px;
width: 36px;
border: none;border-radius:0%;text-align:center;
border:1px solid #fafafa
}
.pagination.custom-pagination li.active a {
  background: #e0b552 none repeat scroll 0 0;color:#1e4029;
  border:0px;;
}

.pagination.custom-pagination li a:hover{background:#e0b552 none repeat scroll 0 0;color:#1e4029;border-color:#e0b552}
.blog-sec a.blog-btn {
	color: #8d8d8d;
	font-weight: 600;
	text-transform: capitalize;
	font-size: 16px;
	display: inline-block;
	width: 150px;
	height: 50px;
	text-align: center;
	padding: 10px;
	border: 1px solid #fafafa;
}
.single-post:hover a.blog-btn {background:#e0b552;color:#1e4029;border-color:#e0b552}

/*
5.1 Slider V2
========================*/
.slider.slider-v2 .slider-text {
	text-align: center;
}
.slider.slider-v2 .slider-caption {
	text-align: center;
	margin: 0px auto;
}
.slider.slider-v2 .all-slide .owl-controls {
	text-align: center;
	width: 100%;
	position: absolute;
	top: 50%;
	height: 0;
}
.slider.slider-v2 .all-slide .owl-controls .owl-nav {
	position: absolute;
	width: 100%;
	left: 0;
}
.slider.slider-v2 .all-slide .owl-controls .owl-prev {
	left: 50px;
	position: absolute;
}
.slider.slider-v2  .all-slide .owl-controls .owl-next {
	right: 50px;
	position: absolute;
}
/*
6.About Us Section
=================*/
.about-img img{width:100%;position:relative;}
.about-img::before {
	border: 10px solid rgba(0, 0, 0, 0.30);
	content: "";
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	z-index: 9;
}
.about-img {
	position: relative;
}
.about-desc h1 {
	font-size: 32px;
	line-height: 42px;
	margin-bottom: 30px;
	font-weight: bold;
}
.about-desc h1 span{
	color: #e0b552;
}
.about-desc span.about-subtitle {
	color: #e0b552;
	text-transform: capitalize;
}
.about-desc a {
	background: #e0b552;
	padding: 12px 26px;
	display: inline-block;
	font-weight: 600;
	text-transform: capitalize;
	color: #1e4029;
	position:relative;
}
.about-desc a:before{
content: "\f178";
font-family: fontawesome;
float:right;top:0px;
position: relative;color:#1e4029;padding-left:10px;transition: all 0.4s ease 0s;
}
.about-sec{background:#fafafa}
.company-ceo-info h2 {
	font-size: 18px;
	text-transform: uppercase;
	font-weight: 600;
	margin-bottom: 10px;
}
.company-ceo-info span {
	text-transform: capitalize;
	font-weight: 400;
	margin-bottom: 20px;
	display: inline-block;
	width: 100%;
	font-size: 16px;
}
.company-mission {
	margin-top: 20px;
}
.company-mission h2 a {
	text-transform: capitalize;
	font-size: 28px;
	font-weight: 600;
	color: #1e4029;
}
.company-mission a {
	color: #e0b552;
	text-transform: capitalize;
	font-weight: bold;
}


.vedio-inner {
	position: relative;
	margin-bottom: 40px;
}
.vedio-overly{position:absolute;top:0;height:100%;width:100%;
background-color: rgba(0, 0, 0, 0.10);}
.vedio-button {
	text-align: center;
	transform: translateY(-50%);
	top: 50%;
	position: relative;
}
.vedio-inner img {
	width: 100%;
}
.vedio-button {
  position: relative;
  width: 60px;
  height: 60px;
  box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.7);
  border-radius: 50%;
  background-color: transparent;
  background-image: url('../img/icon/play_button.png');
  background-size:cover;
  background-repeat: no-repeat;
  -webkit-animation: pulse 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
  -moz-animation: pulse 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
  -ms-animation: pulse 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
  animation: pulse 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
  margin:0px auto;
}
.vedio-button a {
	display: inline-block;
	width: 100%;
	height: 100%;
}
.vedio-button:hover 
{
  -webkit-animation: none;-moz-animation: none;-ms-animation: none;animation: none;
}

@-webkit-keyframes pulse {to {box-shadow: 0 0 0 45px rgba(255, 255, 255, 0);}}
@-moz-keyframes pulse {to {box-shadow: 0 0 0 45px rgba(255, 255, 255, 0);}}
@-ms-keyframes pulse {to {box-shadow: 0 0 0 45px rgba(255, 255, 255, 0);}}
@keyframes pulse {to {box-shadow: 0 0 0 45px rgba(255, 255, 255, 0);}}
/*
6.1  About Us v2 Section
==========================*/
.about-tab {
  margin-bottom: 40px;
}
.about-tab li {
display: inline-block;
margin-right: 10px; transition: all 0.4s ease 0s;
}
.about-tab li a:hover{background: #e0b552 none repeat scroll 0 0; transition: all 0.4s ease 0s;color:#fff;border-color:#e0b552;}
.about-tab li.active a {
	border-color: #e0b552;
	color: #1e4029;
	background: #e0b552;
}
.about-tab li.active a:hover{color:#fff}
.about-tab li a {
	font-weight: 400;
	width: 130px;
	display: inline-block;
	height: 50px;
	text-align: center;
	line-height: 50px;
	color: #999999;
	text-transform: capitalize;border:1px solid #f0f0f0
}
/*
7.Title Section
=================*/
.sec-title {
	text-align: center;
	margin: 0 150px 50px 150px;
}
.sec-title  h1 {
  font-size: 36px;
  text-transform: uppercase;
  color: #1e4029;
  font-weight: bold;
  font-family: 'Poppins', sans-serif;
}
.sec-title h1 span {
  font-weight: normal;
}
.border-shape::before {
	background: #ddd none repeat scroll 0 0;
	bottom: 0;
	content: "";
	height: 1px;
	left: 0px;
	position: absolute;
	top: 3px;
	width: 90px;margin: 0px auto;
	left:0;right:0;
}
.border-shape {
background:#ddd;
display: block;
height: 1px;
left: 0;
margin: 20px auto;
position: relative;
right: 0;
text-align: center;
top: 0;
width: 350px;
}
.border-shape::after {
	background: #ddd none repeat scroll 0 0;
	bottom: 0;
	content: "";
	height: 1px;
	position: absolute;
	left: 0;
	text-align: center;
	top: 6px;
	width: 70px;
	margin: 0px auto;
	left:0;right:0;
}
.sec-title  p {
  margin-bottom: 0;
}

/*
8.Service Section
=================*/
.service-sec-title h2 {
	font-size: 28px;
}
.service-sec-title a {
	display: inline-block;
	padding: 12px 36px;
	background: #e0b552;
	color: #1e4029;
}
.service2-sec {
	overflow: hidden;
	background:#f9f9f9
}
.service2-icon {
	width: 40px;
	margin-right: 10px;
	margin-top: 10px;
}
.service2-inner::before {
	position: absolute;
	content: "";
	background: #fff;
	width: 100%;
	height: 100%;
	z-index: -1;
	transition: all 0.4s ease 0s;
	top:0px;
	
}
.service2-inner:hover.service2-inner::before{
height:0;
transition: all 0.4s ease 0s;	
}
.service2-inner:hover .service2-details h2 a{color:#1e4029
;}
.service2-inner:hover .service2-details{color:#1e4029
;}
.service2-inner{
	background: #e0b552;
	margin-bottom: 25px;
	display:inline-block;
	position:relative;
	z-index:3
}
.service2-inner .media{
	padding: 10px;	
}
.service2-details h2{margin-top:10px;margin-bottom:10px}
.service2-details h2 a {
	display: inline-block;
	width: 100%;
	font-size: 20px;
}
.service2-sec:hover .service2-item::before{bottom: -144px;transition-delay: .9s;}
.service2-item::before {
	position: absolute;
	content: "";
	background-image: url(../img/why-choose-bg.html);
	width: 413px;
	height: 342px;
	bottom: -244px;
	right: -100px;
	background-repeat: no-repeat;
	z-index: -1;
	right: -225px;
	  transition: 0.9s;
      -webkit-transition: 0.9s;
      -khtml-transition: 0.9s;
      -moz-transition: 0.9s;
      -ms-transition: 0.9s;
      -o-transition: 0.9s;
}

.service2-item {
	position: relative;
	display: inline-block;
	z-index: 2;
}

/*
8.1 Service V2
==========================*/
.service2-sec.service-box-v2 {
	background: #fff;
}
.service2-inner.service-v2-box {
	border: 1px solid #f2f2f2;
}

/* Layout */
.quote-wrap{
  display:grid;
  grid-template-columns: 1.2fr 1fr; /* يسار أوسع */
  min-height: 420px;
  background:#0d2a46; /* احتياطي */
  position:relative;
  overflow:hidden;
}

/* Media (left) */
.quote-media{
  position:relative;
  overflow:hidden;
}
.quote-media img,
.quote-media video{
  width:100%; height:100%; object-fit:cover; display:block;
}

/* Panel (right) */
.quote-panel{
  position:relative;
  padding:40px 36px;
  color:#fff;
  background:linear-gradient(0deg,rgba(10,33,60,.92),rgba(10,33,60,.92));
  display:flex; flex-direction:column; justify-content:center;
}
.quote-head .eyebrow{
  display:block; font-size:13px; letter-spacing:.08em; opacity:.75; margin-bottom:6px;
}
.quote-head h2{
  margin:0 0 18px; font-size: clamp(22px, 3.2vw, 42px); font-weight:800; line-height:1.1;
}

/* Form */
.grid{
  display:grid; gap:14px;
  grid-template-columns: 1fr 1fr;
}
.field input,
.field textarea{
  width:100%; background:transparent; color:#fff;
  border:1px dashed rgba(156,186,210,.75); /* نفس المزاج في الصورة */
  border-radius:6px; padding:12px 14px; outline:none;
}
.field textarea{ resize:vertical; }
.field input::placeholder,
.field textarea::placeholder{ color:#bcd0df; }
.field input:focus,
.field textarea:focus{ border-color:#7fb3d8; box-shadow:0 0 0 2px rgba(127,179,216,.15); }

.field.span-2{ grid-column: 1 / -1; }

.quote-btn{
  margin-top:16px; padding:14px 22px; border:none; cursor:pointer; font-weight:800;
  background:#5c87b6; color:#fff; border-radius:6px;
  position:relative; transition:transform .15s ease, box-shadow .15s ease;
}
.quote-btn::after{ /* خط سفلي ذهبي بسيط */
  content:""; position:absolute; inset:auto 0 0 0; height:4px; border-radius:0 0 6px 6px; background:#f6b21f;
}
.quote-btn:hover{ transform:translateY(-2px); box-shadow:0 10px 22px rgba(92,135,182,.35); }

/* Responsiveness */
@media (max-width: 900px){
  .quote-wrap{ grid-template-columns: 1fr; }
  .quote-media{ min-height:240px; }
  .quote-panel{ padding:28px 20px; }
  .grid{ grid-template-columns: 1fr; }
}





/*
9.Consult Form Section
==========================*/
.consult-form-sec{
  background-color: #fff;
  background-image: url("../img/count_up_bg.jpg");
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}
.consult-form::before {
	background-color:rgba(7, 41, 72, 0.95);
	content: "";
	height: 100%;
	left: 0px;
	position: absolute;
	top: 0;
	width: 5000px;
	z-index: -9;
}
.consult-form {
	color: #fff;
	display: inline-block;
	float: right;
	padding: 50px 0px 50px 50px;
	position: relative;
	text-align: left;
	z-index: 9;
}
.consult-form h5 {
	font-size: 18px;
	font-weight: 600;
	color: #e0b552;
	font-style: italic;
	text-transform: uppercase;
}
.consult-form > h1 {
  font-size: 36px;
  text-transform: capitalize;
  font-weight: bold;
  color: #fff;
  margin-top: 20px;
}
.consult-form input[type="text"], .consult-form input[type="email"] {
	background: transparent;
	border: 1px dashed  #fff;
	padding: 10px;
	color: #e0b552 !important;
	width: 100%;
	font-weight: 600;
	font-size: 14px;
}
.consult-form input[type="submit"] {
	background: #e0b552 none repeat scroll 0 0;
	border-bottom: 2px solid #ddaf01;
	color: #fff;
	font-weight: bold;
	padding: 14px 30px;
	text-transform: uppercase;
}
.consult-form .col-md-6 {
  margin-bottom: 20px;
}
.checkbox-field {
  margin-top: 40px;
}
.consult-form input[type="checkbox"]:not(:checked),
.consult-form input[type="checkbox"]:checked {
  position: absolute;
  left: -9999px;
}
.consult-form input[type="checkbox"]:not(:checked) + label,
.consult-form input[type="checkbox"]:checked + label {
color: #fff;
cursor: pointer;
display: inline-block;
font-size: 14px;
font-weight: 600;
padding-left: 40px;
position: relative;
}

.consult-form input[type="checkbox"]:not(:checked) + label:before,
.consult-form input[type="checkbox"]:checked + label:before {
background: transparent none repeat scroll 0 0;
border: 1px solid #fff;
content: "";
height: 15px;
left: 0;
position: absolute;
top: -4px;
width: 15px;
margin-top: 10px;
border-radius: 2px;
}

.consult-form input[type="checkbox"]:not(:checked) + label:after,
.consult-form input[type="checkbox"]:checked + label:after {
color: #fff;
content: "";
font-family: fontawesome;
font-size: 10px;
left: 2px;
line-height: 0.8;
position: absolute;
top: 9px;
transition: all 0.2s ease 0s;
}
.consult-form input[type="checkbox"]:not(:checked) + label:after {
  opacity: 0;
  transform: scale(0);
}
.consult-form input[type="checkbox"]:checked + label:after {
  opacity: 1;
  transform: scale(1);
}
.consult-form input[type="text"]::-webkit-input-placeholder {
color:#fff;opacity:1
}
.consult-form input[type="email"]::-webkit-input-placeholder {
color:#fff;opacity:1
}
.consult-form textarea::-webkit-input-placeholder {
color:#fff;opacity:1
}
.consult-form option::-webkit-input-placeholder {
color:#fff;opacity:1
}
.consult-form input[type="text"]::-moz-placeholder{
color:#fff;opacity:1
}
.consult-form input[type="email"]::-moz-placeholder{
color:#fff;opacity:1
}
.consult-form textarea::-moz-placeholder{
color:#fff;opacity:1
}
.consult-form option::-moz-placeholder{
color:#fff;opacity:1
}
/*
9.1 Consult Form V2 Section
==========================*/
.consult-form-sec.consult-form-v2 {
	position: relative;
}
.consult-form-v2-overlay {
	position: absolute;
	height: 100%;
	width: 100%;
	left: 0;
	background-color: rgba(7, 41, 72, 0.95);
}
.consult-form-v2.consult-form input[type="text"], .consult-form-v2.consult-form input[type="email"] {
	border: 1px solid #fff;
}
.consult-form-v2.consult-form textarea {
	width: 100%;
	background: transparent;
	border: 1px solid #fff;
	height: 100px;
	margin-bottom: 30px;
}
.consult-form-v2.consult-form::before {
	display:none;
}
.support-man {
	position: absolute;
	left: 0;
	bottom: 0;
}

/*
9.Consult Form Section end
==========================*/


/*
9.Hoppec Products Section
==========================*/

:root{
  --bg-deep:#0b1620;   /* خلفية رأس السكشن */
  --bg-card:#fff;
  --ink:#0e2a3b;       /* عناوين */
  --muted:#5f6c76;     /* فقرات */
  --accent:#2f6cb3;    /* لون الأيقونات */
  --ring:#e8edf3;      /* حدود البطاقات */
  --shadow: 0 18px 50px rgba(0,0,0,.08);
  --radius:16px;
}

/* Container helper */
.products-section .container{
  width:min(1200px,92%);
  margin:0 auto;
}

/* Header */
.products-head{
  background: var(--bg-deep);
  color:#eaf0f7;
  text-align:center;
  padding: 36px 22px 44px;
  border-radius: 18px;
  margin-bottom: 24px;
}
.products-head h2{
  margin:0 0 10px;
  font-size: clamp(26px,3.2vw,38px);
}
.products-head p{
  margin:0 auto;
  max-width: 1050px;
  line-height: 1.9;
  font-size: 16.5px;
  color:#d3deea;
}

/* Grid */
.products-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:24px;
}

/* Card */
.product-card{
  background: var(--bg-card);
  border:1px solid var(--ring);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 22px 24px 26px;
}
.card-title{
  display:flex;
  align-items:center;
  gap:10px;
  color: var(--accent);
  margin-bottom: 10px;
}
.card-title svg{
  width:36px;height:36px;flex:0 0 auto;
}
.card-title h3{
  margin:0;
  color: var(--ink);
  font-size: 22px;
}
.product-card p{
  color: var(--muted);
  line-height: 1.85;
  margin: 8px 0 10px;
  font-size: 16px;
}

/* Bullets */
.bullets{
  list-style:none;
  padding:0;margin:10px 0 0;
  display:grid; gap:10px;
}
.bullets li{
  position:relative;
  padding-left:28px;
  color: var(--muted);
  line-height:1.8;
}
.bullets li::before{
  content:"✓";
  position:absolute; left:0; top:0;
  font-weight:900;
  color:#2e7d32;
}
.bullets li span{ color: var(--ink); font-weight:600; }

/* Responsive */
@media (max-width: 992px){
  .products-grid{ grid-template-columns:1fr; }
}


/*
9.Hoppec Products Section End
==========================*/



/*
9.Hoppec Clients starts
==========================*/

:root{
  --ring:#1b2b59;      /* لون الإطار */
  --bg:#ffffff;        /* خلفية دائرة الشعار */
  --shadow:0 8px 24px rgba(0,0,0,.08);
}

/* هيكل عام */
.partners .container{ width:min(1200px,92%); margin:0 auto; }
.partners h2{
  text-align:center; margin: 10px 0 22px;
  font-size: clamp(22px,3.2vw,36px); color:#20314d;
}

/* الماركيه */
.partners-marquee{ overflow:hidden; position:relative; }
.partners-marquee .track{
  display:flex; gap:40px;
  width:max-content;                   /* يتيح العرض الحقيقي للمحتوى */
  animation: partners-scroll 52s linear infinite;
}
.partners-marquee:hover .track{ animation-play-state: paused; }

@keyframes partners-scroll{
  to { transform: translateX(-50%); }  /* المحتوى مكرر مرتين → نحرك نصف العرض */
}

/* الأيقونة الدائرية */
.logo{
  flex:0 0 auto;
  width:160px; height:160px;
  border-radius:50%;
  border:3px solid var(--ring);
  background: var(--bg);
  display:grid; place-items:center;
  box-shadow: var(--shadow);
  position:relative;
}
.logo img{
	border-radius:50%;
  max-width:90%;
  max-height:90%;
  object-fit: contain;   /* يحافظ على النسبة */
}
.logo:hover img{
  transform: scale(1.06);
  filter: none; opacity:1;
}

/* موبايل */
@media (max-width: 768px){
  .partners-marquee .track{ gap:22px; }
  .logo{ width:120px; height:120px; }
}

/* مراعاة الوصول */
@media (prefers-reduced-motion: reduce){
  .partners-marquee .track{ animation: none; }
}

/*
9.Hoppec Clients Ends
==========================*/





/*
10.Project Gallery Section
============================*/
.gallery-sec {
	background: #fafafa none repeat scroll 0 0;
	padding: 90px 0;
}
.simplefilter {
	position: relative;
	text-align: center;
	margin-bottom: 40px;
	display: inline-block;
	width: 100%;
}
.shorttitle {
  display: none;
}
.simplefilter li {
	color: #fff;
	cursor: pointer;
	display: inline-block;
	padding: 10px 20px;
	font-size: 13px;
	text-transform: capitalize;
	background: #1e4029;
	margin: 0px 5px;
}
.simplefilter li:hover {
transition: all 0.5s ease-out 0s;background:#e0b552;color:#fff;
}
.simplefilter li.active {
    background: #e0b552;color:#fff;position:relative
}
.simplefilter li.active:hover{transition: all 0.5s ease-out 0s;background:#e0b552;color:#fff;}
.gallery-item {
	position: relative;overflow:hidden
}

.gallery-item:hover .gallery-button h2 a{
	top:0px;
	transition: all 0.4s ease 0s;
}
.gallery-button h2 a {
	color: #1e4029;
	text-transform: capitalize;
	font-size: 20px;
	top:-100px;
	position: relative;
	transition: all 0.4s ease 0s;
}
.gallery-button a i {
	color: #fff;
	font-size: 24px;
	width: 60px;
	height: 60px;
	border: 1px solid #fff;
	border-radius: 100%;
	line-height: 60px;
}
.project-gallery .inner {
	width: 25%;
	display: inline-block;
	float: left;
}
.gallery-sec .gallery-item {
	margin-bottom:30px;
}
.gallery-sec .simplefilter li.active{color:#fff;background:#e0b552;}
.gallery-item:hover .project-project-gallery-overlay {
	visibility: visible;
	opacity: 1;
	transition: all 0.4s ease 0s;	
}
.gallery-item:hover .gallery-button a i{
bottom:0px;
transition: all 0.4s ease 0s;
}
.project-project-gallery-overlay {
	position: absolute;
	top: 0;
	height: 100%;
	width: 100%;
	background-color:rgba(246, 196, 5, 0.9);
	left: 0;
	visibility: hidden;
	opacity: 0;
	transition: all 0.4s ease 0s;
}
.project-gallery-overlay-text {
	text-align: center;
}
.project-gallery-overlay-text {
	transform: translateY(-50%);
	top: 50%;
	position: relative;
}
.project-gallery-overlay-text .gallery-button a i {
	color: #1e4029;
	font-size: 20px;
	width: 50px;
	height: 50px;
	border: 1px solid #1e4029;
	border-radius: 100%;
	line-height: 50px;
	bottom: -140px;
	position: relative;
	transition: all 0.4s ease 0s;
}
.project-gallery-overlay-text .gallery-button a i:hover{background:#1e4029;color:#fff;border-color:#1e4029;transition: all 0.4s ease 0s;}
.nav-page {
	text-align: center;
	margin-top: 20px;
}
.nav-page ul li {
	display: inline-block;
}
.nav-page ul li a:hover{color: #ffc300;}
.nav-page li.active a {
	color: #ffc300;
}
/*
11. Project Details Page Section
=================================*/
.details-text img{margin-bottom:20px;}
.details-text h2 a,
.project-details-info h2 {
	color: #1e4029;
	font-size: 24px;
	text-transform: capitalize;
}
.details-text h2,
.related-project h2 {
	font-size: 22px;
	text-transform: capitalize;
}
.project-details-info ul li {
	display: inline-block;
	width: 100%;
	text-transform: capitalize;
	padding: 6px 0;
}
.project-details-info ul li span{float:right}
.project-details-info {
	padding: 50px 40px;
	background: #fafafa;
}
.service-details-img img {
	width: 100%;
}
.details-text h2,
.related-project h2 {
	font-size: 22px;
	text-transform: capitalize;
}
.project-details-info ul li {
	display: inline-block;
	width: 100%;
	text-transform: capitalize;
	padding: 6px 0;
}
.project-details-info ul li span{float:right}
.project-details-info {
	padding: 50px 40px;
	background: #fafafa;
}
/*
13.Service Details Section
============================*/
.service-details h2 a,
.service-details-text h2,
.contact-field.service-details h2,
.brochures h2 {
	color: #1e4029;
	font-size: 24px;
	font-weight: 600;
	text-transform: capitalize;
}
.service-details-text {
	margin-top: 30px;
}
.brochures li:first-child::before {
content: "\f1c1";
font-family: fontawesome;
left:0px;top:0px;
position: relative;color:#fff; padding-right: 10px;
}
.brochures li:last-child::before {
content: "\f0f6";
font-family: fontawesome;
left:0px;top:0px;
position: relative;color:#fff; padding-right: 10px;
}
.brochures li {
	display: inline-block;
	width: 100%;
	padding: 10px 20px;
	position: relative;
 background:#e0b552;
 margin-bottom:5px;
}
.brochures li a {
  color: #1e4029;
  font-weight: 600;
  font-size: 14px;
}
.brochures li:hover{background:#e0b552}
.brochures li:hover a{color:#fff}
.brochures li:hover::before{color:#fff}
.brochures li:hover i{color:#fff}


.brochures li a span {
  float: right;
  color: #fff;
}
/*
12.Service Section 
============================*/
.service-sec {
background: #4cc700 none repeat scroll 0 0;
padding: 90px 0;
background-image: url(../img/slider/2.jpg);
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
position: relative;
}
.service-sec-overlay{background-color: rgba(7, 41, 72, 0.95);
height: 100%;
left: 0;
position: absolute;
right: 0;
top: 0;
width: 100%;}
.service-title span {
	color: #ffc300;
	font-size: 20px;
	font-style: italic;
}
.service-title h1 {
	font-size: 30px;
	color: #ffffff;
	font-weight: bold;
	text-transform: capitalize;
	margin-bottom: 40px;
}
.service-content .media-left{padding-right:0px;}
.service-icon {
	width: 70px;
	height: 80px;
	background: #ffc300;
	line-height: 58px;
	text-align: center;
	padding: 10px;
}
.service-text::before {
	content: "";
	position: absolute;
	background: #ffc300;
	height: 100%;
	width:0%;
	top: 0;
	left: 0;
	z-index: -2;
	transition: all 0.4s ease 0s;
}
.service-text {
	background: #fff;
	padding-left: 10px;
	display: inline-block;
	width: 100%;
	padding: 14px 0px;
	padding-left: 20px;
	position:relative;
	z-index:3;
	transition: all 0.4s ease 0s;
}
.service-item:hover .service-text::before {width:100%} 
.service-text p {
	margin-bottom: 0;
	text-transform: capitalize;
	font-size: 16px;
}
.service-text h2 {
	margin-bottom: 4px;
}
.service-text h2 a {
	font-size: 20px;
	text-transform: capitalize;
	font-weight: 600;
}
.all-service-item .owl-controls {
	position: absolute;
	top: -90px;
	right: 0;
	z-index: 99;
}
.all-service-item .owl-controls .owl-buttons div {
background: none;
opacity: 1.00;
}

.all-service-item .owl-controls .owl-prev {
  left: -85px;
  position: absolute;transition: all 0.4s ease 0s;
}

.all-service-item .owl-controls .owl-next {
  right: 0;
  position: absolute;transition: all 0.4s ease 0s;
}

.all-service-item .owl-controls .owl-prev i {
color: #fff;
font-size: 30px;
height: 40px;
line-height: 40px;
text-align: center;
transition: all 0.5s ease-out 0s;
width: 40px;
}
.all-service-item .owl-controls .owl-next i {
background:#ffc300;
color: #fff;
font-size: 30px;
height: 40px;
line-height: 40px;
text-align: center;
transition: all 0.5s ease-out 0s;
width: 40px;
}

.all-service-item .owl-controls .owl-next i:hover {
transition: all 0.5s ease-out 0s;background:#333;color:#fff;border-color:#333
}
.all-service-item .owl-controls .owl-prev i:hover {
transition: all 0.5s ease-out 0s;background:#ffc300;color:#fff;border-color:#ffc300
}
.all-service-item.owl-carousel .owl-item .service-icon img {
	width: auto;
	height: auto;
	display: inline-block;
}

/* Contact overlay with text */
.team-member .team-overlay{
  display:flex; align-items:center; justify-content:center;
}
.team-member .team-overlay ul{
  list-style:none; margin:0; padding:0;
  display:flex; flex-direction:column; gap:10px;
}
.team-member .team-overlay a{
  display:flex; align-items:center; gap:10px;
  padding:8px 12px; border-radius:12px;
  background: rgba(0,0,0,.35);
  color:#fff !important; text-decoration:none;
  white-space:nowrap; backdrop-filter: blur(2px);
  transition: transform .2s ease, background .2s ease;
}
.team-member .team-overlay a:hover{ transform: translateY(-2px); background: rgba(0,0,0,.5); }
.team-member .team-overlay i{ font-size:18px; }

/* إظهار الـ overlay في الموبايل عند لمس الصورة (focus-within) */
.team-member:focus-within .team-overlay{ opacity:1; visibility:visible; }
.team-thumb img{ display:block; }

/*
13.Count Up Section 
============================*/
.count-up-sec {
background: #1e4029 none repeat scroll 0 0;
padding: 76px 0;
background-image: url(../img/slider/1.webp);
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
position: relative;
background-attachment:fixed;
}
.count-up-sec-overlay{background-color: #1e4029;
height: 100%;
left: 0;
position: absolute;
right: 0;
top: 0;
width: 100%;}
.counting_sl {
text-align: center;
}
.countup-icon {
  display: inline-block;
  height: 70px;
  margin-bottom: 16px;
  text-align: center;
  width: 70px;
}
.counting_sl h2 {
	color: #e0b552;
	font-size: 48px;
	text-transform: uppercase;
	margin-bottom:0px;
	
}
.counting_sl h4 {
	color: #fff;
	font-size: 22px;
	margin-bottom: 0;
	text-transform: capitalize;font-weight:400;
	
}
/*
13.1 Count Up Section 
=========================*/
.count-up-man-img {
	position: absolute;
	right: 0;
	bottom: 0;
}
.count-up-v2-title h1 {
	color: #fff;
}
.count-up-v2-title p {
	color: #f2f2f2;
}
.counting_sl.count-up-v2-item {
	text-align: left;
	margin-top: 30px;
}
/*
14.Faq Section
=========================*/
.faq-free-consult-sec {
	overflow: hidden;
	position:relative;
}
.faq-free-consult-sec::before {
	position: absolute;
	content: "";
	background: #1e4029;
	width: 5000px;
	height: 100%;
	top: 0;
	left: 0;
	z-index:-2
}
.about-us-contact {
	position: relative;
	background: #fff;
}

.about-us-contact .contact-field {
	border: 1px solid #ddd;
	padding: 35px;
}
.about-us-contact-title{position:relative}
.contact-title-border {
	width: 1px;
	height: 10px;
	display: inline-block;
	background: #fff;
	text-align: center;
	margin: 0px auto;
	position: absolute;
	left: 0;
	right: 0;
	bottom: 10px;
}
.about-us-contact .contact-field input,
.about-us-contact .single-input-field textarea{border-color:#ddd;}
.about-us-contact-title h1 {
	display: inline-block;
	width: 100%;
	background: #e0b552;
	color: #ffffff;
	text-align: center;
	padding: 50px 0;
	margin-bottom: 0;font-weight:bold;font-size:30px;position:relative;margin-bottom: -1px;
}
.about-us-contact .contact-field input[type="submit"] {
	background: #e0b552 none repeat scroll 0 0;
	border: 1px solid #e0b552;
	border-radius: 100px;
}

.faq-sec .sec-title {
text-align:left;
margin-bottom:30px;
margin:0
}

.faq-sec .panel-title {
	font-size: 20px;
	text-transform: capitalize;
	font-weight: 600px;
}
.faq-sec .panel-content {
	padding: 0px 20px 20px 20px;
	color: #777777;
}
.faq-img {
display: inline-block;
width: 100%;
}
.faq-img img {
  width: 100%;
}
.faq-sec .panel-heading {
	margin-bottom: 0px;
	padding: 20px;
	border: 1px solid #edf2f6;
	border-radius: 0;
	margin-bottom: 10px;
}
.faq-sec .panel {
 border: none;
	border-radius: 0;
	-webkit-box-shadow: 0;
	 box-shadow: 0 1px 1px rgba(0,0,0,.0);
}
.faq-sec .panel-heading a {
color: #282828;
display: inline-block;
font-size: 18px;
width: 100%;
font-weight:600
}
.faq-sec .panel-title a:before {
    float:right !important;
    font-family: FontAwesome;
    content:"\f106";
   color:#777777
}
.faq-sec .panel-title a.collapsed:before {
    float: right !important;
    content:"\f107";color:#777777;
}
.faq-sec .panel-title > a:hover, 
.faq-sec .panel-title > a:active, 
.faq-sec .panel-title > a:focus  {
    text-decoration:none;color:#777777;
}
h1.faq-style1-title {
	font-size: 32px;
	text-transform: capitalize;
	font-weight: bold;
	color: #1e4029;
	line-height: 40px;
	margin-bottom: 50px;
}
.faq-title {
	color: #e0b552;
}
.faq-style1-sec .panel {
  background: transparent;
}
.faq-style1-sec .panel-content {
	padding-bottom: 20px;
	color: #999;
}

.faq-style1-sec .panel-heading {
margin-bottom:15px;
padding: 0;
}
.faq-style1-sec .panel {
	border: none;
	border-radius: 0;
	-webkit-box-shadow: 0;
	box-shadow: 0 1px 1px rgba(0,0,0,.0);
	padding-bottom: 15px !important;
	transition: all 0.4s ease 0s;
}
.faq-style1-sec .panel-heading a {
color: #1e4029;
display: inline-block;
font-size: 20px;
width: 100%;
font-weight:600;
font-family: 'Poppins', sans-serif;
}
.faq-style1-sec .panel-title > a:hover, 
.faq-sec .panel-title > a:active, 
.faq-style1-style1-sec .panel-title > a:focus  {
    text-decoration:none;color:#e0b552;
}

/*
15.Blog Section
==================*/

.single-post {
  display: inline-block;
  margin-bottom: 30px;
}
.single-blog.inner .single-post {
  margin-bottom: 10px;
}
.blog-detail-page .single-post-text {
  padding: 0;
  margin-top: 25px;
}

.single-blog.inner .single-post img {
  margin-bottom: 25px;
}
.single-blog.inner {
  margin-bottom: 40px;
}

/*latest blog*/
.single-post-thumb {
	position: relative;
	overflow: hidden;
}
.single-post:hover .single-post-thumb img{transform:scale(1.2);transition: all 0.4s ease 0s;}
.project-gallery .inner:hover .gallery-item img{transform:scale(1.2);transition: all 0.4s ease 0s;}
.service-item .inner:hover .service-thumb img{transform:scale(1.2);transition: all 0.4s ease 0s;}
.single-post-thumb img,
.gallery-item img,
.service-thumb img{transform:scale(1);transition: all 0.4s ease 0s;}
.service-item .inner:hover h2 a,
.service2-inner:hover h2 a{color:#e0b552}

.single-post:hover a.blog-readmore{
color:#e0b552;
}
.single-post:hover .single-post-thumb-overlay{
visibility: visible;bottom:0;
transition: all 0.4s ease 0s;
}
.single-post-text h2 {
	margin-bottom: 0;
}
.single-post-thumb-overlay {
	position: absolute;
	bottom: -100%;
	width: 100%;
	visibility: hidden;
	transition: all 0.4s ease 0s;
}
.single-post-text {
	padding: 10px;
	border: 1px solid #f2f2f2;
}
.post-meta {
	display: inline-block;
	width: 100%;
	padding-bottom: 5px;
	border-bottom: 1px solid #f2f2f2;
	margin-bottom: 10px;
}
.post-info {
	display: inline-block;
	width: 100%;
	padding: 14px 0;
}
.post-meta li span {
	color: #8d8d8d;
	font-weight: normal;
	margin-right: 10px;
}
.post-meta li {
	display: inline-block;
	margin-right: 5px;
	text-transform: capitalize;
	padding-right: 10px;
}
.post-meta li:last-child {
	float: right;
	margin-right: 0;
}
.post-meta a i {
	color: #e0b552;
	margin-right: ;
	margin-right: 10px;
}
.post-meta li a {
	font-size: 16px;
	margin-top: 10px;
	text-transform: capitalize;
}
.post-tags {
  display: inline-block;
  float: right;
}
.blog-title  h2 {
color: #0f0f0f;
font-size: 24px;
font-weight: 900;
line-height: 30px;
}
.single-post-text a {
	color: #1e4029;
	font-size: 20px;
	font-weight: 600;
	display: inline-block;
	width: 100%;
	line-height: 30px;
	text-transform: capitalize;
}
a.blog-readmore {
	color: #e0b552;
	text-transform: capitalize;
	font-size: 16px;
}
.pst_info {
  float: left;
  display: inline-block;
}
.post-date h2 {
  background: #e0b552;
  text-align: center;
  padding: 10px 5px;
  font-size: 18px;
  color: #fff;
}
.blog-title {
  padding-bottom: 20px;
}
.single-post  img {
width: 100%;
}

.comment-list {
border: 1px solid #fafafa;
font-size: 18px;
padding: 14px;
text-align: center;
}
.comment-list h5 {
  margin-bottom: 0;
}
.post-meta li:last-child {
  float: right;
}
.post-meta li:last-child {
  float: right;
}
.single-post-text li a {
float: left;
font-size: 15px;
font-weight: normal;
margin-left: 1px;
padding-right:2px;
text-transform: capitalize;
}

.post-date h1 {
  background: #f3af1e none repeat scroll 0 0;
  color: #fff;
  display: inline-block;
  font-size: 18px;
  margin-top: 13px;
  padding: 15px;
  text-align: center;
  text-transform: none;
}
.commentar-sec img {
	float: left;
	margin-right: 20px;
	width: 100px;
	border-radius: 100%;
	height: 100px;
}
.single-post .single-input-fieldsbtn input[type="submit"] {
	width: 170px;
	height: 50px;
	padding: 10px 0;
	background: #e0b552;
	border-color: #e0b552;
}
.comment-author {
	margin-bottom: 10px;
	font-size: 18px;
	text-transform: capitalize;
	font-weight: 600;
	color: #1e4029;
}
.comment-author-designation {
	font-size: 14px;
	color: #858484;
	font-style: italic;
}
.comment-time {
	font-size: 16px;
	font-weight: normal;
	display: inline-block;
	width: 100%;
	margin-top: 25px;
}
.commentar-sec .media.mt-3 {
  margin-top: 40px;
}
.single-post .contact-field h2 {
	font-size: 20px;
	margin-bottom: 20px;
	margin-top: 40px;
	text-transform: capitalize;
	font-weight: bold;
	color: #1e4029;
}
.commentar-sec h2 {
	margin-top: 50px;
	font-weight: 600;
	text-transform: capitalize;
	margin-bottom: 50px;
	font-size: 20px;
}
.replay-button {
	display: inline-block;
	width: 100%;
}
.replay-button a {
	color: #e0b552;
	font-weight: 600;
	text-transform: capitalize;
}
.replay-button a:hover{color:#e0b552;}
.commentar-sec .media-body p a {
	color: #7e7e7f;
	font-weight: 600;
	font-size: 15px;
}
.commentar-sec.author ul li {
  display: inline-block;
  margin-right: 20px;
}
.commentar-sec.author {
  position: relative;
}
.commentar-sec.author ul li a i{color:#cbc8c8}
.commentar-sec.author ul li a i:hover{transition: all 0.4s ease 0s;color:#29ace4}
.commentar-sec.author .media-body {
  padding-left: 100px;
}
.commentar-sec.author .media {
background: #fafafa none repeat scroll 0 0;
border-radius: 30px;
padding: 30px 0;
margin-left: 20px;
}
.author-thumb {
border-radius: 100%;
float: left;
height: 100px;
left: 0;
overflow: hidden;
position: absolute;
top: 70px;
width: 100px;
}
.author-thumb img {
  height: 100%;
  width: 100%;
}
.pagination.custom-pagination {
  text-align: center;
  width: 100%;
}
.code-text {
	font-style: italic;
	padding: 10px 40px;
	position: relative;
}
.code-text::before {
	color: #e0b552;
	content: "";
	font-family: fontawesome;
	font-size: 30px;
	left: 20px;
	position: absolute;
	top: 16px;
	transform: translateY(-50%);
	text-align: center;
	left: 0;
	font-style: normal;
}
.post-share-link {
	display: inline-block;
	width: 100%;
	border-top: 1px solid #fafafa;
	border-bottom: 1px solid #fafafa;
	margin-top: 30px;
}
.post-share-link span {
	color: #e0b552;
	font-weight: 600;
	text-transform: capitalize;
	padding: 10px 0px;
	display: inline-block;
}
.post-share-link ul{display:inline-block;float:right;padding: 10px 0px;}
.post-share-link li{display:inline-block;margin-right:20px}
.post-share-link li a{color:#cbc8c8;}
.post-share-link li a:hover{color:#e0b552;transition:all 0.4s ease 0s}
/*
16.Sidebar Section
=====================*/
.sidebar h1 {
	display: inline-block;
	font-size: 24px;
	margin-bottom: 20px;
	text-transform: capitalize;
	width: 100%;
	color: #1e4029;
	position: relative;
	padding-bottom: 10px;
	font-weight: bold;
}
.search-field {
	margin-bottom: 40px;
}
.search-field form {
display: inline-block;
width: 100%;
position: relative;
}

.search-field input[type=text] {
background: #fff none repeat scroll 0 0;
border: 1px solid #fafafa;
padding: 10px 35px 10px 10px;
width: 100%;
}

.search-field button {
	color: #1e4029;
	padding: 10px;
	position: absolute;
	right: 0;
	background: #e0b552;
	top: 0;
}

.blog-sec .inner:nth-child(2n+1) {
  clear: both;
}
.abt_dec > p {
  margin-top: 20px;
}

.sidebar ul li a{font-size: 16px;
font-weight: normal;
text-transform: capitalize;
transition: all 0.4s ease-in-out 0s;}

.sidebar ul li a:hover{transition: all 0.4s ease-in-out 0s;color:#e0b552}
.widget-two {
	margin: 40px 0;
}
.widget-archive li {
	display: inline-block;
	position: relative;
	width: 100%;
	background: #fafafa;
	padding: 10px 20px;
	color: #777777;
	background: #;
	margin-bottom: 5px;
}
.widget-archive li:hover{background:#e0b552;color:#fff;transition: all 0.4s ease-in-out 0s;}
.widget-archive li a:hover{color:#fff!important;transition: all 0.4s ease-in-out 0s;}
.widget-archive li:last-child {
  border-bottom: none;
}
.widget-cat li:last-child {
  border-bottom: none;
}
.widget-archive li a{color:#777777;
display:inline-block;
width:100%;
}
.widget-archive li a span {
	float: right;
}
.widget-cat li{position:relative}

.widget-cat li {
  padding: 10px 0;
  border-bottom: 1px solid #ececec;
}
.widget-cat li a span{float:right;}
.widget-tag li a:hover{transition: all 0.4s ease-in-out 0s;color:#e0b552!important}
.relative-post h3 {
	font-size: 16px;
	margin-bottom: 10px;
	font-weight: bold;
	color: #999999;
}
.single_r_dec li {
	display: inline-block;
	margin-right: 10px;
}
.single_r_dec li a{font-weight:600;text-transform:capitalize}
.single_r_dec li a i{color:#e0b552;margin-right:5px}
.relative-post {
display: inline-block;
padding: 12px 0;
width: 100%;
}
.relative-post-thumb {
  float: left;
  margin-right:25px;
}
.single_r_dec h3 a {
	color: #25292f;
	font-weight: 600;
}

.single_r_dec li:last-child{float:right}
.single_r_dec  a:hover{ transition: all 0.4s ease-in-out 0s;color:#e0b552}
.all_r_pst .media {
  margin-top: 0;
}
.widget-tag a {
	float: left;
	margin-right: 5px;
	margin-bottom: 5px;
	padding: 8px 14px;
	color: #c3c3c3;
	font-weight: 600;
	border: 1px solid #fafafa;
}
.widget-tag li a:hover{background:#e0b552;border-color:#e0b552;color:#fff!important;}
.author_dec h3 {
margin : 0;
color : #1e4029;
font-size : 14px;
margin-bottom : 11px;
}
.author_info {
border-bottom : 1px solid #e3e3e3;
display : inline-block;
padding : 22px 0;
margin-bottom : 30px;
}
.author_info > img {
  float: left;
  margin-right: 35px;
  height: 80px;
}
.social_link {
margin : 0;
padding : 0;
float : right;
display : inline-flex;
}
.social_link li {
list-style : none;
}
.social_link li a i {
color : #363636;
float : left;
padding : 6px;
}
.project-feedbac-inner {
	background: #fafafa;
	padding:70px 20px;
	margin-top: 40px;
	position: relative;
}
.project-feedbac-inner::before {
	color: #e0b552;
	content: "";
	font-family: fontawesome;
	font-size: 30px;
	left: 20px;
	position: absolute;
	top: 35px;
	z-index: 2;
}
.project-sidebar .brochures {
	margin-top: 40px;
}
/*
17.Testimonial Section
=========================*/
.testimonial-sec2 {
	background: #1e4029 none repeat scroll 0 0;
	padding: 76px 0;
	background-image: url(../img/count_up_bg.jpg);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	position: relative;
	background-attachment: fixed;
}
.testimonial-sec2-overlay{
	background-color: rgba(7, 41, 72, 0.95);
	height: 100%;
	left: 0;
	position: absolute;
	right: 0;
	top: 0;
	width: 100%;
}
.all-testimonial2 .owl-controls {
  position: absolute;
  top: 40%;
  width: 100%;
}
.all-testimonial .owl-controls .owl-buttons div {
  background: none;
opacity:1
}

.all-testimonial2 .owl-controls .owl-prev {
  left: -80px;
  position: absolute;
}
.all-testimonial2 .owl-controls .owl-next {
  right: -80px;
  position: absolute;
}
.all-testimonial2 .owl-controls .owl-prev i,
.all-testimonial2 .owl-controls .owl-next i {
border: 1px solid #fff;
color: #fff;
font-size: 30px;
height: 40px;
line-height: 40px;
text-align: center;
transition: all 0.5s ease-out 0s;
width: 40px;
}

.all-testimonial2 .owl-controls .owl-next i:hover {
transition: all 0.5s ease-out 0s;background:#e0b552;color:#fff;border-color:#e0b552
}
.all-testimonial2 .owl-controls .owl-prev i:hover {
transition: all 0.5s ease-out 0s;background:#e0b552;color:#fff;border-color:#e0b552
}
.testimonial2 {
  margin-bottom: 10px;
}
.testimonial2 .inner {
  display: inline-block;
}
.testimonial2 .inner:first-child {
  border-right: 1px dashed #e0b552;
  margin-right: 20px;
  padding-right: 20px;
  position: relative;
  right: 0;
  top: -14px;
}
.testimonial2 .client-info {
  position: relative;
}
.single-testimonial2  h2 {
color: #e0b552;
font-size: 22px;
margin-bottom: 10px;
}
.all-testimonial2.owl-carousel.owl-theme .owl-item img {
	height: 60px;
	width: 60px;
	border-bottom: 2px solid #e0b552;
	border-radius: 2px;
}
.testimonial2 .client-info h3 {
  margin-bottom: 0;
  color:#fff;
}
.single-testimonial2 {
	color: #f4f4f4;
	text-align: center;
}
/*
 17.1 Testimonial V2 Section
==========================*/
.all-testimonial2.testimonial-v2 .testimonial2 .inner:first-child {
	border-right: none;
	margin-right: 0;
	padding-right: 0;
	position: relative;
	right: 0;
	top: 0;
}
.all-testimonial2.testimonial-v2 .testimonial2 .inner {
	display: inline-block;
	width: 100%;
}
.all-testimonial2.testimonial-v2.owl-carousel.owl-theme .owl-item img {
	height: 100px;
	width: 100px;
	border-bottom: navajowhite;
	border-radius: 100%;
	margin: 0px auto;
}
.all-testimonial2.testimonial-v2 .testimonial2-client-img {
	margin-top: 20px;
}
.all-testimonial2.testimonial-v2 .owl-controls{
	bottom: -35px;
}
.all-testimonial2.testimonial-v2 .owl-controls  .owl-nav{
	display: none;
}
.all-testimonial2.testimonial-v2 .owl-controls .owl-dots {
	text-align: center;
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
}
.all-testimonial2.testimonial-v2 .owl-controls .owl-dot {
	width: 15px;
	height: 15px;
	background: #fff;
	display: inline-block;
	border-radius: 100%;
	margin: 0px 4px;
}
.all-testimonial2.testimonial-v2 .owl-controls .owl-dot.active{
	background:#e0b552;
} 


@font-face {
font-family: "Droid Arabic Kufi Bold";
src: url("../../eHotline/Droid Arabic Kufi Bold.ttf");
}
@font-face {
font-family: "Righteous-Regular";
src: url("../../eHotline/Righteous-Regular.ttf");
}
 /* ====== HOPPEC Products – Full CSS (RTL + Responsive) ====== */
:root{
  --blue:#1e4029;        /* أزرق هوبك الغامق */
  --blue-2:#1c4e80;      /* أزرق ثانوي */
  --gold:#d4af37;        /* ذهبي */
  --ink:#0f172a;         /* نص أساسي */
}

*{box-sizing:border-box}
html,body{direction:rtl}
body{
  margin:0;
  background:#f6f8fb;
  color:#0b2540;
  font-family:"Droid Arabic Kufi", Tahoma, Arial, sans-serif;
}
a{text-decoration:none;color:inherit}
.filters{
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)) !important;
  gap: 10px !important;
  overflow: visible !important;         /* إلغاء الشريط */
  padding-bottom: 0 !important;
}

.chip{
  white-space: normal !important;       /* يسمح بلفّ النص */
  text-align: center;
  padding: 10px 12px;
}

/* لو عايزاها صفّين ثابتين تحديدًا */
@media (min-width: 420px){
  .filters{
    grid-auto-rows: 1fr;
    grid-template-rows: repeat(2, auto); /* صفّين */
  }
}
/* صندوق البحث */
.search{
  position: relative;
  flex: 1;
  min-width: 120px;
  background: #fff;
  border: 1px solid rgba(1,43,68,.15);
  border-radius: 14px;
  padding: 12px 44px 12px 14px; /* مساحة للأيقونة يمين */
  box-shadow: 0 6px 14px rgba(1,43,68,.06);
}

/* الحقل نفسه */
.search input{
  width: 100%;
  border: none;
  outline: none;
  background: transparent;
  font-size: 14px;
  text-align: right;                 /* RTL */
  color: #0b2540;
}

.search input::placeholder{
  color: #a7b3c6;
  opacity: 1;
}

/* أيقونة العدسة في يمين الصندوق */
.search::after{
  content: "🔎";
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 18px;
  opacity: .7;
  pointer-events: none;
}

/* للموبايل الصغير */
@media (max-width: 480px){
  .search{ padding: 10px 40px 10px 12px; }
  .search::after{ right: 10px; font-size: 16px; }
}
/* محاذاة الأدوات في الوسط */
.hero .toolbar{ justify-content:right }

/* شبكة الفلاتر صفّين متّزنين ومحاذاة وسط */
.hero .filters{
  display:grid !important;
  grid-template-columns: repeat(2, minmax(110px,1fr)) !important;
  gap:12px !important;
  max-width:880px;            /* يمنع تمدّد الشبكة بعرض الشاشة */
  margin:10px auto 0;         /* وسط */
  overflow:visible !important;
  padding-bottom:0 !important;
}
@media (min-width: 600px){
  .hero .filters{ grid-template-columns: repeat(4, minmax(150px,1fr)) !important; }
}

/* كبسولات ثابتة الارتفاع + ظل خفيف */
.hero .chip{
  height:46px; display:flex; align-items:center; justify-content:center;
  border-radius:999px; padding:0 14px;
  background:#fff; border:1px solid rgba(1,43,68,.18);
  box-shadow:0 4px 10px rgba(0,0,0,.05);
  transition:transform .15s ease, box-shadow .15s ease;
}
.hero .chip:hover{ transform:translateY(-2px); box-shadow:0 8px 16px rgba(0,0,0,.08); }

/* تمييز أوضح للنشط: أزرق غامق + حلقة ذهبية */
.hero .chip.active{
  background:#1e4029; color:#fff; border-color:#1e4029;
  box-shadow:0 0 0 2px #d4af37, 0 10px 20px rgba(1,43,68,.25);
}

/* صندوق البحث – يملأ العرض ويُوسّط */
.hero .search{
  max-width:700px; margin:12px auto 0; display:block;
}


/* ===== Hero / Header ===== */
.hero{
  position:relative;
  padding:28px 16px 20px;
  background:
    linear-gradient(135deg, rgba(28,78,128,.08),rgba(1,43,68,.12)),
    radial-gradient(1200px 300px at 100% 0, rgba(212,175,55,.12), transparent 60%),
    #fff;
  border-bottom:1px solid rgba(1,43,68,.08);
}
.hero h1{margin:0 0 6px; color:var(--blue); font-size:clamp(18px,2.4vw,24px)}
.hero p {margin:0; color:#335c81; font-size:clamp(12px,1.8vw,14px)}

/* ===== Toolbar: Search + Filters ===== */
.toolbar{display:flex; gap:10px; flex-wrap:wrap; margin-top:16px; align-items:center}
/* removed duplicate search block */
.search input{ width:100%; border:none; outline:none; background:transparent; font-size:14px; text-align:right; color:#0b2540;}
/* removed flex-based filters to avoid scrollbar */
.chip{
  scroll-snap-align:start; white-space:nowrap;
  padding:10px 12px; border:1px solid rgba(1,43,68,.18);
  background:#fff; color:var(--blue);
  border-radius:999px; font-size:13px; cursor:pointer; user-select:none
}
.chip.active{background:var(--blue); color:#fff; border-color:var(--blue)}
.chip[data-cat="all"]{border-color:var(--gold)}

/* ===== Grid / Cards ===== */
.wrap{padding:18px 12px 40px; max-width:1100px; margin:auto}
.grid{
  display:grid; gap:14px;
  grid-template-columns:repeat(auto-fit, minmax(210px, 1fr))
}
.card{
  background:#fff; border:1px solid rgba(1,43,68,.10);
  border-radius:16px; overflow:hidden;
  box-shadow:0 10px 20px rgba(0,0,0,.05);
  transition:transform .2s ease, box-shadow .2s ease
}
.card:hover{transform:translateY(-4px); box-shadow:0 16px 28px rgba(0,0,0,.08)}
.thumb{aspect-ratio:4/3; width:100%; object-fit:cover; background:#e9eef5; display:block}
.body{padding:12px 12px 14px}
.title{font-size:clamp(14px,2vw,16px); color:var(--blue); margin:2px 0 6px; text-align:right}
.desc{font-size:13px; color:#335c81; margin:0 0 10px; text-align:right;font-family:Droid Arabic Kufi Bold}
.meta{display:flex; gap:8px; align-items:center; font-size:12px; color:#64748b; justify-content:flex-start}

.btn{
  display:inline-block; margin-top:10px; padding:12px 14px; border-radius:10px;
  background:linear-gradient(90deg, var(--gold), #ffd700);
  color:#232b3b; font-weight:700; font-size:13px;font-family:Droid Arabic Kufi Bold
}

.badge{
  display:inline-block; background:rgba(212,175,55,.12); color:#a0790a;
  border:1px solid rgba(212,175,55,.4); padding:3px 8px;
  border-radius:999px; font-size:11px
}

/* ===== Footer ===== */
.foot{
  padding:22px 16px; border-top:1px solid rgba(1,43,68,.08);
  text-align:center; color:#6b7a8c; font-size:12px; background:#fff
}

/* ===== Mobile tweaks ===== */
@media (max-width: 480px){
  .wrap{padding-inline:10px}
  .grid{grid-template-columns:1fr; gap:12px}
  .thumb{aspect-ratio:16/10}
  .filters{gap:6px}
  .chip{padding:9px 11px; font-size:12px}
}

/* ===== Reduce motion (accessibility) ===== */
@media (prefers-reduced-motion: reduce){
  *{animation:none !important; transition:none !important}
}

/* ===== Optional: sticky filters on scroll ===== */
/*
.hero .toolbar{
  position: sticky; top: 0;
  background: linear-gradient(180deg,#fff 70%, rgba(255,255,255,.85));
  z-index: 5; padding-block:8px
}
*/


/* === Final enforced styles === */
.hero .filters{
  display: grid !important;
  grid-template-columns: repeat(2, minmax(80px, 1fr)) !important;
  gap: 10px !important;
  overflow: visible !important;
  padding-bottom: 0 !important;
}
@media (min-width: 480px){
  .hero .filters{ grid-template-columns: repeat(3, minmax(140px, 1fr)) !important; }
}
@media (min-width: 768px){
  .hero .filters{ grid-template-columns: repeat(5, minmax(140px, 1fr)) !important; }
}
.hero .chip{
  white-space: normal !important;
  text-align: center; padding: 10px 12px;
}
.hero .search{
  position: relative !important;
  min-width: 150px;
  background: #fff;
  border: 1px solid rgba(1,43,68,.15);
  border-radius: 14px;
  padding: 12px 44px 12px 14px !important;
  box-shadow: 0 6px 14px rgba(1,43,68,.06);
}
.hero .search::after{
  content: "🔎";
  position: absolute; right: 12px; top: 50%;
  transform: translateY(-50%); font-size: 18px; opacity: .7; pointer-events: none;
  
}







/*
18.Page Heading Section
==========================*/
.pagehding-sec {
	background-image: url("../img/slider/1.webp");
	background-position: center center;
	background-repeat: no-repeat;
	padding-bottom: 50px;
	padding-top: 60px;
	position: relative;
	background-size: cover;
}

.pagehding-sec1 {
	background-image: url("../img/slider/4.jpg");
	background-position: center center;
	background-repeat: no-repeat;
	padding-bottom: 50px;
	padding-top: 60px;
	position: relative;
	background-size: cover;
}
.page-heading h1 {
	font-size: 40px;
	text-align: center;
	text-transform: capitalize;
	font-weight: bold;
	color:#fff;
}
.breadcrumb-list {
	text-align: center;
}
.breadcrumb-list li {display: inline-block;
position: relative;
padding: 0px 14px;}
.breadcrumb-list li:first-child{
	padding-left:0px;
}
.breadcrumb-list li a {
	font-weight: 600;
	text-transform: capitalize;
	color: #fff;
}
.breadcrumb-list li:last-child a {
  color: #e0b552;
}
.breadcrumb-list li::before {
  content: "/";
position: absolute;
right: -8px;font-size:16px;
font-weight: 600;
color:#fff;
}
.breadcrumb-list li:last-child::before{display:none}
.breadcrumb-list li:last-child::before {
  display: none;
}
/*
19.Team section
=================*/
.team-member {
background: #fff none repeat scroll 0 0;
padding-bottom: 20px;
text-align: center;
margin-bottom: 30px;position:relative;overflow:hidden;transition: all 0.4s ease-in-out 0s;
z-index:2
}
.team-member::after {
	content: "";
	background: #fff;
	position: absolute;
	top: 0;
	width: 100%;
	height: 50%;
	left: 0;
	z-index: -1;
}
.team-member::before {
	position: absolute;
	content: "";
	width:100%;
	height:100%;
	z-index: -1;
	transition: all 0.4s ease 0s;
	top: 0px;
	left:0;
	background:#1e4029;
	filter: alpha(opacity=75);	
}
 .team-member:hover.team-member::before{width:100%;transition: all 0.4s ease-in-out 0s;background:#e0b552;}
.team-member:hover .team-overlay{visibility:visible;transition: all 0.4s ease-in-out 0s;-moz-opacity: 0.75;
	opacity: 0.75;top:0px;background:#e0b552;}
.team-member:hover.team-member h2{color:#fff;transition: all 0.4s ease-in-out 0s;}
.team-member:hover.team-member h3{color:#fff;transition: all 0.4s ease-in-out 0s;} 
.team-member:hover .team-thumb{border-radius:0;transition: all 0.4s ease-in-out 0s;} 
.team-thumb {
	position: relative;
	overflow: hidden;
	transition: all 0.4s ease-in-out 0s;
}
.team-overlay{
  position: absolute;
  width: 100%;
  left: 0;height:100%;top:100%;	
background:#e0b552;
filter: alpha(opacity=75);
visibility:hidden;transition: all 0.4s ease-in-out 0s;
}
.team-overlay ul{
  position: absolute;
  top: 50%;
  width: 100%;
  transform: translateY(-50%);
}
.team-member img {
  width: 100%;
}
.team-member  h2 {
  font-size: 18px;
  font-weight: bold;
  margin-top: 20px;
  text-transform: uppercase;transition: all 0.4s ease-in-out 0s;
  color:#fff;
}
.team-member  h3 {
  font-size: 14px;
  text-transform: capitalize;transition: all 0.4s ease-in-out 0s;
  color:#fff;
}
.team-overlay li a {
	width: 30px;
	height: 30px;
	display: inline-block;
	background: #282828;
	border-radius: 100%;
	color: #fff;
	text-align: center;
	line-height: 30px;
}
.team-overlay li{
	  transition: 0.6s;
      -webkit-transition: 0.3s;
      -khtml-transition: 0.3s;
      -moz-transition: 0.3s;
      -ms-transition: 0.3s;
      -o-transition: 0.3s;
	display: inline-block;	
	text-align: left;	
	padding:5px 0;	
}
.team-member:hover .team-overlay li{transform: translateY(0px);}
.team-overlay li:nth-child(1) {
transform: translateY(20px);
transition-delay: .1s; }
.team-overlay li:nth-child(2) {
transform: translateY(40px);
transition-delay: .2s; }
.team-overlay li:nth-child(3) {
transform: translateY(60px);
transition-delay: .3s; }  
.team-overlay li:nth-child(4) {
transform: translateY(80px);
transition-delay: .4s; }
.team-overlay li:nth-child(5) {
transform: translateY(100px);
transition-delay: .5s; }

.team-member li i{color:#fff}
.testimonial-text.expert-team {
	position: relative;
	padding-bottom: 70px;
}
.testimonial-text.expert-team::before {
	position: absolute;
	content: "";
	background-image: url(../img/team_sec_bg.html);
	width: 100%;
	height: 100%;
	top: 0;
	left: -165px;
	background-repeat: no-repeat;
	z-index: -1;
}

/*
19.1 Team section
================*/
.team-member.team-v2 {
	padding-bottom: 0;
}
.team-member.team-v2 .team-thumb {
	border-radius: 100%;
}
/*
20.Faq Page
================*/
.faq-id {
	display: inline-block;
	float: left;
	width: 60px;
	margin-top: 7px;
}
.faq-id span {
	color: #e0b552;
	font-size: 36px;
	font-family: 'Poppins', sans-serif;
	font-weight:700
}
.faq-title h2 {
	color: #1e4029;
	font-size: 20px;
	line-height: 30px;
	padding-left: 60px;
}
.single-faq {
	margin-bottom: 30px;
}
/*
21.Contact Page
============================*/
.contact-info-icon {
	float: left;
	text-align: center;
}
.contact-page-sec .contact-field h2 {
	color: #1e4029;
	text-transform: capitalize;
	font-size: 22px;
	font-weight: 700;
}
.contact-field .col-md-6.col-sm-6.col-xs-12 {
  padding-left: 0;
}  
.contact-field.contact-form input {
  margin-bottom: 5px;
}  
.contact-field.contact-form textarea {
  height: 110px;
}
.contact-field.contact-form input[type="submit"] {
  background: #e0b552;
  width: 150px;
  border-color: #e0b552;
}
.contact-info-icon i {
	font-size: 30px;
	color: #e0b552;
}
.contact-info-text {
	padding-left: 50px;
	margin-bottom: 40px;
}
.contact-info-text h2 {
	color: #1e4029;
	font-size: 20px;
	text-transform: capitalize;
	font-weight: 700;
}
.contact-info-text span {
	color: #999999;
	font-size: 16px;
	font-weight: ;
	display: inline-block;
	width: 100%;
}

.contact-field input{
  background: #fff none repeat scroll 0 0;
  border: 1px solid #f0f0f0;
  margin-bottom: 20px;
  padding: 10px;
  width: 100%;color:#999999;
}
.contact-field select {
	width: 100%;
	border: 1px solid #f0f0f0;
	padding: 12px 20px;
	margin-bottom: 20px;
	text-transform: capitalize;
	color: #999999;
}
.contact-field .select-arrow::before {
	top: 15px;
	color: #999999;
}
.contact-field .message-input {
display: inline-block;
width: 100%;
padding-left: 0;
}
.single-input-field textarea {
	border: 1px solid #f0f0f0;
	width: 100%;
	height: 120px;
	padding: 10px;
}
.single-input-fieldsbtn input[type="submit"] {
	background: #e0b552 none repeat scroll 0 0;
	border: 1px solid #e0b552;
	color: #1e4029;
	display: inline-block;
	font-weight: 600;
	padding: 14px 0;
	text-transform: capitalize;
	width: 150px;
	margin-top: 20px;
	font-size: 16px;
	border-radius:0px;
}

.single-input-fieldsbtn input[type="submit"]:hover{background:#e0b552;transition: all 0.4s ease-in-out 0s;border-color:#e0b552}
.contact-field {
  display: inline-block;width:100%
}
.single-input-field  h4 {
  color: #464646;
  text-transform: capitalize;
  font-size: 14px;
}
.contact-page-form {
	display: inline-block;
	width: 100%;
	margin-top: 30px;
}

.contact-page-map{width:100%;height:350px;margin-bottom:70px}



/*
22.404 Page Section 
======================*/
.error-page-content {
  text-align: center;
  padding: 0px 50px;
}
.error-page-content  h1 {
  color: #1e4029;
  font-weight: bold;
  font-size: 60px;
  text-align:center;
}
.error-page-content  h2{text-transform:capitalize;}
.error-page-content > a {
	color: #1e4029;
	font-weight: 600;
	background: #e0b552;
	padding: 12px 34px;
	display: inline-block;
	margin-top: 20px;
	border-radius: 30px;
}
.error-page-content ul li {
	display: inline-block;
	width: 100%;
	padding: 4px 0;
	position:relative;
}
.error-page-content ul li::before {
	content: "\f101";
	font-family: fontawesome;
	left: 0px;
	top: 0px;
	position: relative;
	color: #e0b552;
	padding-right: 10px;
}

/*
23.Footer Section 
======================*/
footer.footer{
background: #1e4029 none repeat scroll 0 0;	
}
.footer-sec {
	padding-top: 100px;
	position: relative;
	padding-bottom: 70px;
}
.footer-sec h2 {
	color: #fff;
	margin-bottom: 20px;
	position: relative;
	text-transform: uppercase;
	font-weight: bold;
}
.footer-sec p {
  color: #fff;
}
.footer-wedget-one img {
	margin-bottom: 20px;
	margin-top: -10px;
}

.footer-wedget-one i:hover{background:#e0b552;color:#fff;border-color:#e0b552; transition: all 0.4s ease-in-out 0s;}
.footer-wedget-one ul {
  margin-top: 15px;
}
.footer-wedget-one form {
  background: #525459 none repeat scroll 0 0;
  margin-top: 35px;position:relative
}
.footer-wedget-one input[type="email"] {
background: #fff none repeat scroll 0 0;
border: 1px solid #fff;
color: #292929;
padding: 10px 58px 10px 10px;
text-transform: capitalize;
width: 100%;
}
.footer-wedget-one button {
background: #e0b552 none repeat scroll 0 0;
color: #fff;
padding: 11px 20px;
position: absolute;
right: 0;top:0
}
.footer-wedget-one button i {
  border: none;
  margin-right: 0;
  color: #fff;
}
.inner-item {
	color: #f4f4f4;
}
.inner-item i {
	color: #e0b552;
}
.footer-wedget-three li i {
  display: inline-block;
  margin-right: 10px;
}
.ft-menu ul {
  padding: 0px 20px;
}
.ft-menu h2 {
  display: inline-block;
  text-align: left;
}
.footer-wedget-three li {
  color: #ccc;
  font-size: 14px;
padding:10px
}
.footer-wedget-two li {
  display: inline-block;
}
.footer-wedget-two li a {
	border: 1px solid #10385c;
	color: #fff;
	display: inline-block;
	margin: 8px 8px 8px 0;
	padding: 8px 10px;
	text-transform: capitalize;
	transition: all 0.4s ease-in-out 0s;
	background: transparent;
	color: #f4f4f4;
}
.footer-wedget-two li a:hover{transition: all 0.4s ease-in-out 0s;background:#e0b552;color:#fff;border-color:#e0b552}
.footer-wedget-two li a i {
  margin-right: 10px;
}
.footer-widget-menu li:before{content: "\f101";
font-family: fontawesome;
left:0px;top:0px;
position: relative;color:#e0b552;padding-right:10px}
.footer-widget-menu li{position:relative}
.footer-widget-menu li a {
  color: #f4f4f4;
  text-transform: capitalize;
  padding-bottom: 10px;
  display: inline-block;
}
.footer-widget-menu li a:hover{color:#e0b552;transition: all 0.4s ease 0s;}

.footer-bottom-sec {
	padding: 15px 0;
	border-top: 1px solid #10385c;
}
.footer-social{text-align:right}
.footer-social ul li{display:inline-block;}
.footer-social ul li i {
color: #fff;
float: left;
font-size: 18px;
height: 40px;
line-height: 40px;
margin-right: 10px;
text-align: center;
width: 40px; transition: all 0.4s ease-in-out 0s;border-radius:100%;background:#10385c;
}
.footer-social ul li:first-child i{
background:#e0b552;	
}
.footer-social ul li i:hover{background:#e0b552;}
.copy-right {
	margin-top: 8px;
}
.footer-bottom-sec p {
color: #f4f4f4;
margin: 0;
text-align: left;
}
.copy-right span,
.copy-right span a{
  color: #e0b552;
}

/*
24.Why Choose Us Section 
======================*/
.why-choose-us-sec {

}
.why-choose-thumb {
	position: relative;
}
.why-choose-text {
	padding: 60px 15px 20px 15px;
}
.why-choose-inner {
	text-align: center;
	position: relative;
	overflow: hidden;
	margin-bottom: 30px;
	box-shadow: 0 0 15px 5px rgba(0, 0, 0, 0.1);
}
.why-choose-text h2 a {
	font-size: 24px;
	text-transform: capitalize;
	color:#1e4029;
}
.why-choose-inner:hover .why-choose-text h2 a{
	color:#e0b552
}
.why-choose-icon {
	position: absolute;
	width: 80px;
	height: 80px;
	background: #fff;
	border-radius: 100%;
	line-height: 80px;
	text-align: center;
	margin: 0px auto;
	left: 0;
	right: 0;
	bottom: -50px;
}
.why-choose-icon img {
	width: 50px;
	height: 50px;
	display: inline-block;
}

/*
Why Us hoppec Starts
=============================*/

:root{
  --primary:#19345e;      /* لون الأيقونات */
  --ink:#0e2a3b;          /* عناوين */
  --muted:#5f6c76;        /* ثانوي */
  --card:#fff;
  --ring:#e9eef5;
  --shadow:0 10px 24px rgba(0,0,0,.08);
  --radius:16px;
  --icon-size:64px;       /* 👈 حجم الأيقونة — صغّري/كبّري هنا */
}

.benefits .container{ width:min(1200px,92%); margin:0 auto; }
.benefits-head{ text-align:center; margin-bottom:20px; }
.benefits-head h2{ margin:10px 0 6px; font-size: clamp(24px,3vw,36px); color:var(--ink); }
.benefits-head p{ margin:0; color:var(--muted); }

.benefits-grid{
  list-style:none; margin:18px 0 0; padding:0;
  display:grid; gap:22px;
  grid-template-columns: repeat(4, minmax(0,1fr));  /* 4 في الصف */
}

.benefit-card{
  background:var(--card);
  border:1px solid var(--ring);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  padding: 22px 16px 18px;
  text-align:center;
  transition: transform .2s ease, box-shadow .2s ease;
}
.benefit-card:hover{ transform: translateY(-4px); box-shadow:0 16px 36px rgba(0,0,0,.10); }

.benefit-card .icon{
  width:var(--icon-size); height:var(--icon-size);
  margin: 6px auto 10px; color:var(--primary);
}
.benefit-card .icon svg{ width:100%; height:100%; display:block; }

.benefit-card h3{ margin:6px 0 0; font-size:18px; color:var(--ink); letter-spacing:.2px; }

/* Responsive */
@media (max-width: 1024px){
  .benefits-grid{ grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 720px){
  .benefits-grid{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 420px){
  .benefits-grid{ grid-template-columns: 1fr; }
}

/*
Why Us hoppec Ends
=============================*/

/*
Why Us Box V2
=============================*/
.why-choose-inner.why-us-box-v2 {
	box-shadow: none;
}
.why-choose-inner.why-us-box-v2 .why-choose-icon {
	right: 0;
	bottom: 0;
	margin: 0;
	border-radius: 0;
	background: #1e4029;
}
.why-choose-inner.why-us-box-v2 .why-choose-text {
	padding: 20px 15px 1px 15px;
	text-align: left;
	background: #fff;
	border: 1px solid #f2f2f2;
}
/*
Section Heading Version 2
=============================*/
.sec-hd-v1 {
	display: inline-block;
	width: 100%;
	margin-bottom: 50px;
}
.sec-hd-v1-title {
	text-align: right;
	float: right;
	border-right: 2px solid #e0b552;
	padding-right: 35px;
	font-weight: bold;	
}

/* ===== Contact Cards (scoped) ===== */
.contact-cards{ --brand:#0b2344; --brand-2:#F6891F; --ink:#0f172a; --muted:#64748b }
.contact-cards{ margin:28px auto; max-width:1200px; padding:0 12px }
.contact-cards .grid{
  display:grid; gap:18px;
  grid-template-columns:repeat(4,1fr);
}
@media (max-width:1024px){ .contact-cards .grid{ grid-template-columns:repeat(2,1fr) } }
@media (max-width:560px){  .contact-cards .grid{ grid-template-columns:1fr } }

.contact-cards .card{
  position:relative; background:#fff; border:1px solid #e6ecf5;
  border-radius:12px; padding:26px 16px 22px; text-align:center;
  box-shadow:0 8px 18px rgba(11,35,68,.08);
  transition:transform .15s ease, box-shadow .15s ease;
  min-height:150px; display:flex; flex-direction:column; justify-content:center; gap:8px;
}
.contact-cards .card:hover{ transform:translateY(-2px); box-shadow:0 14px 26px rgba(11,35,68,.12) }

/* الزاوية البرتقالية */
.contact-cards .card::before{
  content:""; position:absolute; left:0; bottom:0; width:66px; height:66px;
  background:linear-gradient(135deg,var(--brand-2) 0 50%, transparent 51% 100%);
  border-bottom-left-radius:12px;
  opacity:.95;
}
 
.contact-cards a{ color:inherit; text-decoration:none }
.contact-cards a:hover{ text-decoration:underline }

/* لصف عربي */
.contact-cards[dir="rtl"] .card::before{ left:auto; right:0; border-bottom-left-radius:0; border-bottom-right-radius:12px }
/* === Contact cards: smaller icons + image icons === */
.contact-cards{
  --ico: 14px;               /* حجم الأيقونة (غيّري الرقم براحتك) */
  --title: 18px;             /* عنوان الكارت أصغر */
  --val: 16px;               /* القيمة (رقم/يوزر) أصغر */
  --sub: 13px;               /* سطر ثانوي */
}

.contact-cards .ico img{
  width: var(--ico);
  height: var(--ico);
  object-fit: contain;
  display: block;
  margin: 0 auto 4px;
}

/* أحجام أصغر على الشاشات الصغيرة */
@media (max-width: 268px){
  .contact-cards{ --ico: 28px; --title: 16px; --val: 15px; }
}

/* طبّقي الأحجام الجديدة على النصوص */
.contact-cards .title{ font-size: var(--title); }
.contact-cards .value{ font-size: var(--val); }
.contact-cards .sub{ font-size: var(--sub); }

/* ===== Fix contact cards layout ===== */
.contact-cards{
  --ico: 56px;       /* حجم الأيقونة */
  --title: 16px;
  --val: 15px;
  --gap: 12px;
}

.contact-cards .grid{
  display:grid; gap:16px;
  grid-template-columns:repeat(4,1fr);
}
@media (max-width:1024px){ .contact-cards .grid{ grid-template-columns:repeat(2,1fr) } }
@media (max-width:600px){  .contact-cards .grid{ grid-template-columns:1fr } }

.contact-cards .card{
  position:relative;
  background:#fff;
  border:1px solid #e6ecf5;
  border-radius:14px;
  box-shadow:0 8px 18px rgba(11,35,68,.08);
  padding:18px 16px 16px;
  display:flex; flex-direction:column; align-items:center;
  justify-content:flex-start; gap: var(--gap);
  min-height: 180px;               /* ارتفاع موحّد */
  text-align:center;
}

/* المثلث البرتقالي */
.contact-cards .card::before{
  content:""; position:absolute; inset:auto auto 0 0;
  width:54px; height:54px; border-bottom-left-radius:14px;
  background:linear-gradient(135deg,#F6891F 0 50%,transparent 51% 100%);
}
.contact-cards[dir="rtl"] .card::before{ left:auto; right:0; border-bottom-left-radius:0; border-bottom-right-radius:14px }

/* الأيقونة كحجم ثابت */
.contact-cards .ico{
  width: var(--ico); height: var(--ico);
  border-radius:12px;
  overflow:hidden;
}
.contact-cards .ico img{
  width:100%; height:100%; object-fit:contain; display:block;
}

/* نصوص موحّدة وأصغر */
.contact-cards .title{ font:700 var(--title)/1.2 "Cairo",system-ui; color:#0b2344; margin:0 }
.contact-cards .value{ font:700 var(--val)/1.35 "Cairo",system-ui; color:#173067; margin:0 }
.contact-cards .sub{ font:400 13px/1.4 "Cairo",system-ui; color:#64748b; margin-top:-6px }

/* أرقام وروابط */
.contact-cards a{ color:inherit; text-decoration:none }
.contact-cards a:hover{ text-decoration:underline }
.contact-cards .ltr{ direction:ltr; unicode-bidi:bidi-override } /* للأرقام واليوزرز */

/* تصغير أكثر على الشاشات الصغيرة */
@media (max-width:768px){
  .contact-cards{ --ico: 48px; --title:15px; --val:14px; }
  .contact-cards .card{ min-height:160px; }
}

/* The End */