@font-face {
    font-family: 'Vazirmatn';
    src: url('../../fonts/Tajawal-Bold.ttf') format('truetype');
}
.vazirmatn-<uniquifier> {
  font-family: Vazirmatn,'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}
body {
  font-family: Vazirmatn;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
  font-variation-settings:"wdth" 100;
}

a {
  color: #428bca;
  text-decoration: none;
}

a:hover {
  color: #9eccf4;
  text-decoration: none;
}

h1,
h2,
h3,
h4,
h5,
h6,
.font-primary {
  font-family: Vazirmatn;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
  font-variation-settings:
    "wdth" 100;
}

/*--------------------------------------------------------------
# Back to top button
--------------------------------------------------------------*/
.back-to-top {
  position: fixed;
  visibility: hidden;
  opacity: 0;
  right: 15px;
  bottom: 15px;
  z-index: 99999;
  background: #428bca;
  width: 40px;
  height: 40px;
  border-radius: 4px;
  transition: all 0.4s;
}

.back-to-top i {
  font-size: 24px;
  color: #fff;
  line-height: 0;
}

.back-to-top:hover {
  background: #629fd3;
  color: #fff;
}

.back-to-top.active {
  visibility: visible;
  opacity: 1;
}

/*--------------------------------------------------------------
# Disable aos animation delay on mobile devices
--------------------------------------------------------------*/
@media screen and (max-width: 768px) {
  [data-aos-delay] {
    transition-delay: 0 !important;
  }
}



/*--------------------------------------------------------------
# Sections General
--------------------------------------------------------------*/
section {
  padding: 30px 0;
  overflow: hidden;
}

.section-bg {
  background-color: #f5f9fc;
}

.section-title {
  text-align: center;
  padding-bottom: 30px;
}

.section-title h2 {
  font-size: 32px;
  font-weight: 600;
  margin-bottom: 20px;
  padding-bottom: 0;
  color: #5c768d;
}

.section-title p {
  margin-bottom: 0;
}

/*--------------------------------------------------------------
# Breadcrumbs
--------------------------------------------------------------*/
.breadcrumbs {
  padding: 15px 0;
  background-color: #f5f9fc;
  min-height: 40px;
}

.breadcrumbs h2 {
  font-size: 24px;
  font-weight: 300;
}

.breadcrumbs ol {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  padding: 0;
  margin: 0;
  font-size: 14px;
}

.breadcrumbs ol li+li {
  padding-left: 10px;
}

.breadcrumbs ol li+li::before {
  display: inline-block;
  padding-right: 10px;
  color: #6c757d;
  content: "/";
}

@media (max-width: 768px) {
  .breadcrumbs .d-flex {
    display: block !important;
  }

  .breadcrumbs ol {
    display: block;
  }

  .breadcrumbs ol li {
    display: inline-block;
  }
}



/*--------------------------------------------------------------
# Frequently Asked Questions
--------------------------------------------------------------*/
.faq {
  padding-bottom: 30px;
}

.faq .faq-item {
  margin-bottom: 40px;
}

.faq .faq-item h4 {
  font-size: 20px;
  line-height: 28px;
  font-weight: 600;
  margin-bottom: 15px;
  color: #1f3548;
}







:root{
  --brand:#0ea5e9;
  --brand2:#0284c7;
  --ink:#0f172a;
  --muted:#64748b;
  --border:rgba(15,23,42,.10);
  --shadow:0 14px 30px rgba(2,6,23,.10);
  --radius:18px;
  --bg:#f6f8fb;
}

.section-head{
  margin-bottom: 14px;
}
.section-head h2{
  font-weight: 900;
  margin: 0 0 6px;
}
.section-head p{
  margin: 0;
  color: var(--muted);
}

.home-hero{
  padding: 44px 0 18px;
  background:
    radial-gradient(900px 280px at 10% 0%, rgba(14,165,233,.18), transparent 60%),
    radial-gradient(800px 260px at 85% 10%, rgba(2,132,199,.14), transparent 60%),
    transparent;
}

.hero-card{
  background: rgba(255,255,255,.92);
  border: 1px solid var(--border);
  border-radius: calc(var(--radius) + 8px);
  box-shadow: var(--shadow);
  padding: 20px 18px;
}

.hero-badge{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(14,165,233,.10);
  color: var(--brand2);
  font-weight: 800;
  font-size: .95rem;
}

.hero-title{
  font-weight: 600;
  line-height: 1.35;
  margin: 12px 0 8px;
}

.hero-subtitle{
  color: var(--muted);
  font-size: 1.02rem;
  margin: 0 0 14px;
}

.hero-actions{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 14px;
}

.hero-meta{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.meta-item{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(2,6,23,.03);
  border: 1px solid var(--border);
  font-weight: 800;
  color: var(--ink);
}

.hero-side{
  display: grid;
  gap: 12px;
}
.hero-side-card{
  display: flex;
  gap: 12px;
  align-items: center;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: 0 10px 22px rgba(2,6,23,.06);
  padding: 14px 14px;
}
.hero-side-icon{
  width: 46px; height: 46px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  background: rgba(14,165,233,.10);
  color: var(--brand2);
  font-size: 1.2rem;
}
.hero-side-title{ font-weight: 950; }
.hero-side-sub{ color: var(--muted); font-size: .95rem; margin-top: 2px; }

.quick-links{
  margin-top: 16px;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.qcard{
  display: flex;
  gap: 12px;
  align-items: center;
  padding: 14px 14px;
  border-radius: var(--radius);
  background: #fff;
  border: 1px solid var(--border);
  box-shadow: 0 10px 22px rgba(2,6,23,.06);
  color: var(--ink);
}
.qcard i{
  font-size: 1.25rem;
  color: var(--brand2);
}
.qtitle{ font-weight: 950; }
.qsub{ color: var(--muted); font-size: .92rem; }

.qcard:hover{
  border-color: rgba(14,165,233,.35);
  background: rgba(14,165,233,.06);
  transform: translateY(-1px);
}

.hint-note{
  margin-top: 10px;
  display: flex;
  gap: 8px;
  align-items: center;
  color: var(--muted);
  font-weight: 650;
}

/* wrappers */
.home-slider, .home-counters, .home-portfolio, .home-contact{
  padding: 12px 0;
}

.back_for_contact{
     background:
    radial-gradient(900px 240px at 10% 10%, rgba(14,165,233,.10), transparent 60%),
    radial-gradient(700px 220px at 90% 30%, rgba(2,132,199,.10), transparent 55%),
    #f6f9fc;
}
/* Responsive */
@media (max-width: 991.98px){
  .quick-links{ grid-template-columns: 1fr 1fr; }
}
@media (max-width: 575.98px){
  .quick-links{ grid-template-columns: 1fr; }
  .hero-title{ font-size: 1.35rem; }
}




/* ===== Slider Section ===== */
.home-slider-grid .slider-card{
  background: #fff;
  border: 1px solid var(--border);
  border-radius: calc(var(--radius) + 8px);
  box-shadow: 0 14px 30px rgba(2,6,23,.10);
  overflow: hidden;
  height: 100%;
}

#homeCarousel .carousel-inner,
#homeCarousel .carousel-item{
  height: 420px;
}
.slider-img{
  height: 420px;
  object-fit: cover;
}

.slider-overlay{
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(2,6,23,.50), transparent 55%),
    linear-gradient(180deg, rgba(2,6,23,.20), rgba(2,6,23,.10));
  pointer-events: none;
}

/* indicators modern */
#homeCarousel .carousel-indicators{
  margin-bottom: 14px;
}
#homeCarousel .carousel-indicators [data-bs-target]{
  width: 22px;
  height: 6px;
  border-radius: 999px;
  border: 0;
  background: rgba(255,255,255,.55);
  opacity: 1;
}
#homeCarousel .carousel-indicators .active{
  background: rgba(14,165,233,.95);
}

/* controls modern */
.slider-control{
  width: 46px;
  height: 46px;
  top: 50%;
  transform: translateY(-50%);
  opacity: 1;
}
.slider-control .carousel-control-prev-icon,
.slider-control .carousel-control-next-icon{
  filter: drop-shadow(0 10px 18px rgba(2,6,23,.35));
}

/* Promo card */
.promo-card{
  position: relative;
  display: block;
  height: 420px;
  border-radius: calc(var(--radius) + 8px);
  overflow: hidden;
  border: 1px solid var(--border);
  box-shadow: 0 14px 30px rgba(2,6,23,.10);
  background: #fff;
}
.promo-img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.promo-overlay{
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(2,6,23,.05), rgba(2,6,23,.30));
}
.promo-badge{
  position: absolute;
  top: 12px;
  right: 12px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,.86);
  border: 1px solid rgba(255,255,255,.65);
  color: var(--ink);
  font-weight: 900;
}
.promo-card:hover{
  transform: translateY(-1px);
  border-color: rgba(14,165,233,.35);
}

/* Responsive */
@media (max-width: 991.98px){
  #homeCarousel .carousel-inner,
  #homeCarousel .carousel-item,
  .slider-img,
  .promo-card{
    height: 320px;
  }
}