:root {
  --hd:#0b3d26;
  --bg:#0e0f11;
  --ch:#1a1c1f;
  --ch2:#23262a;
  --tx:#f2f3f4;
  --mt:#9aa1a8;
  --g:#0f7a48;
  --gold:#c9a24b;
  --r:18px;
  --sh:0 10px 30px rgba(0,0,0,.35);
}
* {
  box-sizing:border-box;
  margin:0;
  padding:0;
}
html {
  scroll-behavior:smooth;
  scroll-padding-top:80px;
}
body {
  font-family:Tahoma,"Segoe UI","Noto Sans Arabic",Arial,sans-serif;
  background:var(--bg);
  color:var(--tx);
  line-height:1.8;
  overflow-x:hidden;
}
a {
  color:inherit;
  text-decoration:none;
}
img {
  max-width:100%;
  display:block;
}
.w {
  width:min(1180px,92%);
  margin-inline:auto;
}
.skip {
  position:absolute;
  top:-60px;
  right:10px;
  background:var(--gold);
  color:#000;
  padding:8px 14px;
  border-radius:8px;
  z-index:99;
}
.skip:focus {
  top:8px;
}
:focus-visible {
  outline:3px solid var(--gold);
  outline-offset:2px;
}
.btn {
  display:inline-block;
  padding:10px 20px;
  border-radius:999px;
  border:0;
  cursor:pointer;
  font:inherit;
  font-weight:700;
  transition:.25s;
  text-align:center;
}
.lg {
  padding:14px 30px;
}
.b1 {
  background:var(--g);
  color:#fff;
}
.b1:hover {
  background:#0c6a3e;
  transform:translateY(-2px);
}
.b2 {
  background:rgba(255,255,255,.16);
  color:#fff;
}
.b3 {
  background:transparent;
  color:#fff;
  border:2px solid var(--gold);
}
.b3:hover {
  background:var(--gold);
  color:#000;
}
#hd {
  position:sticky;
  top:0;
  z-index:50;
  background:var(--hd);
  border-bottom:3px solid var(--gold);
  transition:.3s;
}
#hd.sc {
  box-shadow:var(--sh);
}
.acts .b1 {
  background:var(--gold);
  color:#000;
}
.acts .b1:hover {
  background:#dbb75f;
}
.hd {
  display:flex;
  align-items:center;
  gap:18px;
  height:70px;
}
.logo {
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-size:1.4rem;
  font-weight:800;
}
.logo b {
  color:var(--gold);
}
#nav {
  display:flex;
  gap:10px;
  margin-inline-end:auto;
  font-size:1rem;
}
#nav a {
  color:#dfe9e3;
  padding:8px 18px;
  border-radius:99px;
  transition:.2s;
}
#nav a:hover,#nav a[aria-current] {
  color:#fff;
  background:rgba(255,255,255,.15);
}
.acts {
  display:flex;
  gap:8px;
}
#bg {
  display:none;
  background:none;
  border:0;
  cursor:pointer;
  margin-inline-start:auto;
  width:44px;
  height:44px;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  gap:5px;
}
#bg span {
  display:block;
  width:24px;
  height:2px;
  background:var(--tx);
  transition:.25s;
}
#bg[aria-expanded=true] span:nth-child(1) {
  transform:translateY(7px) rotate(45deg);
}
#bg[aria-expanded=true] span:nth-child(2) {
  opacity:0;
}
#bg[aria-expanded=true] span:nth-child(3) {
  transform:translateY(-7px) rotate(-45deg);
}
.hero {
  position:relative;
  overflow:hidden;
  min-height:82vh;
  display:flex;
  align-items:center;
  background:#111;
}
.hero::after {
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  background:---linear-gradient(90deg,rgba(69, 113, 121, 0.92),rgba(14,15,17,.5))-----;
}
.hs {
  position:absolute;
  inset:0;
  --slide:.1s;
}
.hsl {
  position:absolute;
  inset:0;
  transform:translateX(-100%);
  transition:transform var(--slide) linear;
}
.hsl.on {
  transform:none;
}
.hsl.gone {
  transform:translateX(100%);
}
.hsl .slot {
  position:absolute;
  inset:0;
  border:0;
  border-radius:0;
  display:block;
}
.hsl .slot::before {
  position:absolute;
  bottom:14px;
  right:0;
  left:0;
}
.hsl:nth-child(2) .slot {
  background:linear-gradient(135deg,#0f4d31,#2c3035);
}
.hsl:nth-child(3) .slot {
  background:linear-gradient(135deg,#3a3320,#1a1c1f);
}
.hsl:nth-child(4) .slot {
  background:linear-gradient(135deg,#2c3035,#5b6066);
}
.hc {
  position:relative;
  z-index:2;
  padding:60px 0;
  max-width:720px;
}
.hero h1 {
  color:#070707;
  font-size:clamp(1.9rem,5vw,3.4rem);
  line-height:1.4;
  margin-bottom:16px;
}
.hero p {
  color:#ecf006;
  font-size:1.1rem;
  margin-bottom:26px;
}
.row {
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}
.trust {
  background:var(--ch);
  border-block:1px solid var(--ch2);
}
.g4 {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
  padding:22px 0;
  text-align:center;
}
.trust .g4>div {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  font-size:1.6rem;
}
.trust span {
  font-size:.95rem;
  font-weight:700;
}
.sec {
  padding:80px 0;
}
.dark {
  background:var(--ch);
}
h2 {
  font-size:clamp(1.6rem,3.5vw,2.3rem);
  margin-bottom:12px;
}
h2::after {
  content:"";
  display:block;
  width:60px;
  height:4px;
  background:var(--gold);
  border-radius:4px;
  margin-top:8px;
}
.sub {
  color:var(--mt);
  margin-bottom:30px;
}
.grid {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(230px,1fr));
  gap:20px;
  margin-top:30px;
}
.g3 {
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
}
.g5 {
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
}
.card {
  background:var(--ch2);
  border-radius:var(--r);
  padding:16px;
  box-shadow:var(--sh);
  transition:.3s;
  border:1px solid transparent;
}
.dark .card {
  background:var(--bg);
}
.card:hover {
  transform:translateY(-6px);
  border-color:var(--gold);
}
.card h3 {
  margin:10px 0 4px;
  font-size:1.1rem;
}
card p,.card small {
  color:var(--mt);
  font-size:.92rem;
}
.card p {
  overflow-wrap:break-word;
  word-break:break-word;
}
.card a {
  display:inline-block;
  margin-top:10px;
  color:var(--gold);
  font-weight:700;
}
.g5 .card {
  text-align:center;
  font-size:2rem;
}
.slot {
  position:relative;
  display:grid;
  place-items:center;
  margin:0;
  overflow:hidden;
  text-align:center;
  font-size:.85rem;
  color:var(--mt);
  background:linear-gradient(135deg,#2c3035,#0f4d31);
  border:2px dashed var(--gold);
  border-radius:12px;
}
.slot::before {
  content:attr(data-label);
  padding:6px;
}
.slot img {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
}
.slot.ok {
  border-color:transparent;
}
.slot.ok::before {
  display:none;
}
.lgo {
  width:44px;
  height:44px;
  border-width:1px;
  font-size:.55rem;
  border-radius:10px;
}
.lgo img {
  object-fit:contain;
}
.ph {
  height:140px;
  border-radius:12px;
  display:grid;
  place-items:center;
  font-size:2.8rem;
  background:linear-gradient(135deg,#2c3035,#0f4d31);
}
.ph.sm {
  height:60px;
  width:60px;
  font-size:1.8rem;
}
.ph.big {
  height:340px;
}
.two {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:40px;
  align-items:center;
}
.ticks {
  list-style:none;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin-top:16px;
}
.ticks li::before {
  content:"";
  display:inline-block;
  width:8px;
  height:8px;
  margin-inline-end:8px;
  border-radius:50%;
  background:var(--gold);
}
.stats {
  background:linear-gradient(135deg,#0b3d26,#0f7a48);
}
.stats b {
  display:block;
  font-size:2.4rem;
  color:#fff;
}
.stats b::before {
  content:"+";
}
.stats span {
  color:#dfe;
}
.filters {
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-bottom:20px;
}
.filters button {
  background:var(--bg);
  color:var(--tx);
  border:1px solid var(--ch2);
  padding:8px 18px;
  border-radius:999px;
  cursor:pointer;
  font:inherit;
}
.filters .on,.filters button:hover {
  background:var(--g);
  border-color:var(--g);
}
.gal {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(200px,1fr));
  gap:12px;
}
.gi {
  position:relative;
  aspect-ratio:4/3;
  border:0;
  border-radius:14px;
  overflow:hidden;
  cursor:zoom-in;
  background:linear-gradient(135deg,#2c3035,#0f4d31);
  color:#fff;
  font:inherit;
  transition:.3s;
}
.gi[hidden] {
  display:none;
}
.gi:hover {
  transform:scale(1.03);
}
.gi img {
  width:100%;
  height:100%;
  object-fit:cover;
  position:absolute;
  inset:0;
}
.gi span {
  position:absolute;
  bottom:8px;
  right:10px;
  font-size:.85rem;
  background:rgba(0,0,0,.55);
  padding:2px 10px;
  border-radius:99px;
}
.ba {
  position:relative;
  height:380px;
  border-radius:var(--r);
  overflow:hidden;
  margin-top:24px;
  user-select:none;
}
.af,.bf {
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  font-size:1.6rem;
  font-weight:800;
}
.af {
  background:linear-gradient(135deg,#0f4d31,#0f7a48);
}
.bf {
  background:linear-gradient(135deg,#3a3d42,#55595f);
  clip-path:inset(0 0 0 50%);
}
#bar {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  opacity:0;
  cursor:ew-resize;
}
.steps {
  list-style:none;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:20px;
  margin-top:30px;
  position:relative;
}
.steps::before {
  content:"";
  position:absolute;
  top:26px;
  right:10%;
  left:10%;
  border-top:2px dashed var(--gold);
}
.steps li {
  text-align:center;
  position:relative;
}
.steps i {
  display:grid;
  place-items:center;
  width:52px;
  height:52px;
  margin:0 auto 10px;
  border-radius:50%;
  background:var(--gold);
  color:#000;
  font-style:normal;
  font-weight:800;
}
.steps p {
  color:var(--mt);
  font-size:.92rem;
}
.bh {
  display:flex;
  justify-content:space-between;
  align-items:center;
}
.ar {
  background:var(--ch2);
  color:var(--tx);
  border:0;
  width:42px;
  height:42px;
  border-radius:50%;
  font-size:1.4rem;
  cursor:pointer;
  margin-inline-start:6px;
}
.ar:hover {
  background:var(--g);
}
.sl {
  display:flex;
  gap:18px;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  padding:26px 0;
  scrollbar-width:none;
}
.sl::-webkit-scrollbar {
  display:none;
}
.sl .card {
  flex:0 0 min(320px,82%);
  scroll-snap-align:start;
}
.narrow {
  max-width:800px;
}
details {
  background:var(--bg);
  border-radius:14px;
  margin-top:12px;
  padding:16px 20px;
}
summary {
  cursor:pointer;
  font-weight:700;
}
details[open] summary {
  color:var(--gold);
}
details p {
  color:var(--mt);
  margin-top:8px;
}
.cta {
  padding:70px 0;
  text-align:center;
  background:linear-gradient(135deg,#0b3d26,#111);
}
.cta h2::after {
  margin-inline:auto;
}
.cta p {
  margin:10px 0 24px;
  color:#dfe;
}
.cta .row {
  justify-content:center;
}
.two p {
  margin-bottom:8px;
}
.two a[data-tel],.two a[data-wa] {
  color:var(--gold);
}
iframe {
  width:100%;
  height:240px;
  border:0;
  border-radius:var(--r);
  margin-top:14px;
}
form {
  background:var(--bg);
  padding:26px;
  border-radius:var(--r);
  display:grid;
  gap:14px;
}
label {
  display:grid;
  gap:4px;
  font-size:.92rem;
  color:var(--mt);
}
input,select,textarea {
  width:100%;
  padding:12px;
  border-radius:10px;
  border:1px solid var(--ch2);
  background:var(--ch);
  color:var(--tx);
  font:inherit;
}
#msg {
  color:var(--gold);
}
footer {
  background:#08090a;
  padding:50px 0 0;
}
.fg {
  display:grid;
  grid-template-columns:1.5fr repeat(4,1fr);
  gap:26px;
}
.fg h3 {
  color:var(--gold);
  margin-bottom:8px;
  font-size:1rem;
}
.fg a,.fg span {
  display:block;
  color:var(--mt);
  font-size:.92rem;
}
.fg a:hover {
  color:var(--tx);
}
.fg p {
  color:var(--mt);
  margin-top:8px;
  font-size:.92rem;
}
.cp {
  text-align:center;
  padding:20px;
  margin-top:30px;
  border-top:1px solid var(--ch2);
  color:var(--mt);
  font-size:.88rem;
}
.fab {
  position:fixed;
  bottom:18px;
  left:16px;
  display:grid;
  gap:10px;
  z-index:60;
}
.fab a {
  padding:12px 22px;
  border-radius:99px;
  font-size:.95rem;
  font-weight:700;
  color:#000;
  text-align:center;
  box-shadow:var(--sh);
  transition:.2s;
}
.fab a:hover {
  transform:scale(1.1);
}
.wa {
  background:#25d366;
}
.ph2 {
  background:var(--gold);
}
#lb {
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.92);
  z-index:100;
  display:flex;
  align-items:center;
  justify-content:center;
}
#lb[hidden] {
  display:none;
}
#li {
  max-width:88vw;
  max-height:84vh;
  border-radius:10px;
  transition:transform .3s;
  cursor:zoom-in;
  background:var(--ch);
  min-width:min(300px,80vw);
  min-height:200px;
}
#li.z {
  transform:scale(1.8);
  cursor:zoom-out;
}
#lb button {
  position:absolute;
  background:rgba(255,255,255,.15);
  color:#fff;
  border:0;
  width:46px;
  height:46px;
  border-radius:50%;
  font-size:1.5rem;
  cursor:pointer;
}
#lx {
  top:16px;
  right:16px;
}
#lp {
  right:14px;
}
#ln {
  left:14px;
}
.rv {
  opacity:0;
  transform:translateY(24px);
  transition:opacity .7s,transform .7s;
}
.rv.in {
  opacity:1;
  transform:none;
}
@media(max-width:900px) {
  #bg {
    display:flex;
  }
  .acts {
    display:none;
  }
  #nav {
    display:none;
    position:absolute;
    top:70px;
    right:0;
    left:0;
    flex-direction:column;
    background:var(--hd);
    padding:16px 5%;
    gap:4px;
  }
  #nav.open {
    display:flex;
  }
  #nav a {
    padding:12px 0;
    border-bottom:1px solid var(--ch2);
    font-size:1.05rem;
  }
  .two {
    grid-template-columns:1fr;
  }
  .g4 {
    grid-template-columns:1fr 1fr;
  }
  .steps {
    grid-template-columns:1fr 1fr;
  }
  .steps::before {
    display:none;
  }
  .fg {
    grid-template-columns:1fr 1fr;
  }
  .sec {
    padding:56px 0;
  }
  .ph.big {
    height:220px;
  }
}
@media(max-width:520px) {
  .ticks {
    grid-template-columns:1fr;
  }
  .btn.lg {
    width:100%;
  }
  .fg {
    grid-template-columns:1fr;
  }
  .trust .g4>div {
    flex-direction:column;
    gap:2px;
  }
  .ba {
    height:260px;
  }
}
@media(prefers-reduced-motion:reduce) {
  * {
    transition:none!important;
    scroll-behavior:auto!important;
  }
  .rv {
    opacity:1;
    transform:none;
  }
}
.tg {
  position:absolute;
  top:12px;
  right:12px;
  z-index:2;
  background:rgba(0,0,0,.65);
  color:#fff;
  padding:2px 12px;
  border-radius:99px;
  font-size:.9rem;
}
.af .tg {
  right:auto;
  left:12px;
}
@media(max-width:1100px) {
  #nav a {
    padding:8px 11px;
  }
  .hd {
    gap:10px;
  }
}
.pb {
  padding:56px 0;
  background:linear-gradient(135deg,#0b3d26,#111);
}
.pb h1 {
  font-size:clamp(1.8rem,4vw,2.8rem);
}
.pb p {
  color:#cfd8d2;
  max-width:640px;
}