
:root{
  --brand-navy:#192240;
  --brand-navy-2:#283354;
  --brand-slate:#4d5e87;
  --brand-gold:#b5976b;
  --brand-gold-2:#957c51;
  --brand-bg:#f7f6f5;
  --brand-muted:#e0ddd6;
  --text:#10131f;
}

@font-face{
  font-family:'Shahd';
  src:url('../Fonts/shahd.ttf') format('opentype');
  font-display:swap;
}
@font-face{
  font-family:'CairoLocal';
  src:url('../Fonts/Cairo-VariableFont_wght.ttf') format('truetype');
  font-display:swap;
}
@font-face{
  font-family:'CairoLocal';
  src:url('../Fonts/Cairo-VariableFont_wght.ttf') format('truetype');
  font-weight:700;
  font-display:swap;
}

html,body{height:100%;}
body{
  font-family: 'CairoLocal','Cairo',system-ui,-apple-system,'Segoe UI',Tahoma,Arial,sans-serif;
  background: var(--brand-bg);
  color: var(--text);
}

a{color:var(--brand-navy); text-decoration:none;}
a:hover{color:var(--brand-gold-2);}

.navbar{
  background: rgba(247,246,245,.92);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid rgba(40,51,84,.08);
}
.navbar .nav-link{color:var(--brand-navy); font-weight:600;}
.navbar .nav-link:hover{color:var(--brand-gold-2);}

.brand-btn{
  background:var(--brand-navy);
  border:1px solid var(--brand-navy);
  color:#fff;
  border-radius: 999px;
  padding:.55rem 1.1rem;
}
.brand-btn:hover{background:var(--brand-navy-2); border-color:var(--brand-navy-2); color:#fff;}

.brand-btn-outline{
  background:transparent;
  border:1px solid var(--brand-navy);
  color:var(--brand-navy);
  border-radius: 999px;
  padding:.55rem 1.1rem;
}
.brand-btn-outline:hover{border-color:var(--brand-gold-2); color:var(--brand-gold-2);}

.hero{
  position:relative;
  overflow:hidden;
  border-radius: 24px;
  background: linear-gradient(135deg, rgba(25,34,64,.96), rgba(40,51,84,.92));
  color:#fff;
}
.hero:before{
  content:'';
  position:absolute; inset:0;
  background-image:url('../Images/نمط -01.png');
  background-size: 720px auto;
  opacity:.13;
  mix-blend-mode: screen;
}
.hero .content{position:relative; z-index:1;}
.hero .badge{
  display:inline-flex; gap:.5rem; align-items:center;
  background: rgba(181,151,107,.16);
  border:1px solid rgba(181,151,107,.35);
  padding:.35rem .75rem;
  border-radius: 999px;
  color:#fff;
  font-weight:600;
}
.kpi{
  background:#fff;
  border:1px solid rgba(40,51,84,.08);
  border-radius:18px;
  padding:18px;
  box-shadow: 0 12px 30px rgba(16,19,31,.06);
}
.kpi .num{font-size: 28px; font-weight:800; color:var(--brand-navy);}
.kpi .label{color:rgba(16,19,31,.65); font-weight:600;}

.card-soft{
  background:#fff;
  border:1px solid rgba(40,51,84,.08);
  border-radius:18px;
  box-shadow: 0 12px 30px rgba(16,19,31,.06);
}
.card-soft .card-title{color:var(--brand-navy); font-weight:800;}

.section-title{
  font-weight:900;
  color:var(--brand-navy);
  letter-spacing:.2px;
}
.section-sub{
  color:rgba(16,19,31,.65);
  font-weight:600;
}

.footer{
  background: linear-gradient(180deg, rgba(25,34,64,.06), rgba(25,34,64,.0));
  border-top:1px solid rgba(40,51,84,.08);
}

.whatsapp-float{
  position: fixed;
  left: 18px;
  bottom: 18px;
  z-index: 9999;
  display:flex;
  align-items:center;
  gap:.6rem;
  background:#25D366;
  color:#fff;
  border-radius:999px;
  padding:.7rem 1rem;
  box-shadow: 0 14px 30px rgba(0,0,0,.18);
}
.whatsapp-float:hover{color:#fff; opacity:.95;}
.whatsapp-float img{width:18px; height:18px;}
.form-control, .form-select{
  border-radius: 14px;
  border-color: rgba(40,51,84,.14);
}
.form-control:focus, .form-select:focus{
  border-color: rgba(181,151,107,.55);
  box-shadow: 0 0 0 .2rem rgba(181,151,107,.18);
}

.badge-service{
  background: rgba(181,151,107,.12);
  border:1px solid rgba(181,151,107,.28);
  color: var(--brand-navy);
  font-weight:700;
  border-radius: 999px;
  padding: .4rem .75rem;
}
