
:root{
  --navy:#0d2a4f;
  --gold:#c88b1f;
  --gold-dark:#a76e12;
  --ink:#1f2937;
  --muted:#667085;
  --cream:#fbfaf7;
  --white:#ffffff;
  --line:#e8e5df;
  --soft:#f4f6f8;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:"Segoe UI",Arial,sans-serif;
  color:var(--ink);
  background:var(--white);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
a{color:inherit}
.site-header{
  height:92px;
  padding:0 4.5%;
  display:flex;
  justify-content:space-between;
  align-items:center;
  background:#fff;
  border-bottom:1px solid var(--line);
  position:sticky;
  top:0;
  z-index:20;
}
.brand{
  display:flex;
  align-items:center;
  gap:14px;
  text-decoration:none;
}
.brand img{
  width:58px;height:58px;object-fit:contain;
}
.brand-copy{display:flex;flex-direction:column;gap:5px}
.brand-copy strong{
  color:var(--navy);
  font-size:17px;
  letter-spacing:-.01em;
}
.brand-copy small{
  color:var(--gold);
  font-weight:700;
  letter-spacing:.08em;
}
.main-nav{
  display:flex;
  align-items:center;
  gap:30px;
}
.main-nav a{
  text-decoration:none;
  font-size:14px;
  font-weight:600;
  color:var(--navy);
}
.lang-btn{
  margin-left:12px;
  background:#fff;
  border:1px solid var(--gold);
  color:var(--navy);
  padding:10px 18px;
  border-radius:4px;
  cursor:pointer;
  font-weight:600;
}
.hero{
  position:relative;
  min-height:640px;
  overflow:hidden;
  display:grid;
  grid-template-columns:1.15fr .85fr;
  align-items:center;
  gap:60px;
  padding:55px 7.5% 110px;
  background:
    radial-gradient(circle at 62% 38%,rgba(13,42,79,.035),transparent 30%),
    linear-gradient(180deg,#fff 0%,#fbfcfd 100%);
}
.world-grid{
  position:absolute;
  inset:60px 5% auto 34%;
  height:370px;
  opacity:.18;
  pointer-events:none;
  background:
    radial-gradient(circle at 35% 42%,transparent 0 120px,#b9c4d0 121px 123px,transparent 124px),
    radial-gradient(circle at 35% 42%,transparent 0 185px,#cfd6de 186px 188px,transparent 189px),
    linear-gradient(24deg,transparent 49.5%,#d9dfe6 50%,transparent 50.5%),
    linear-gradient(-24deg,transparent 49.5%,#d9dfe6 50%,transparent 50.5%);
}
.hero-left{position:relative;z-index:2;max-width:700px}
.eyebrow,.section-label{
  font-size:12px;
  letter-spacing:.16em;
  font-weight:800;
  color:var(--gold);
}
.hero h1{
  margin:18px 0 22px;
  font-size:52px;
  line-height:1.02;
  letter-spacing:-.035em;
  color:var(--navy);
  font-weight:700;
}
.hero h1 em{font-style:normal;color:var(--gold)}
.hero-text{
  max-width:690px;
  color:#4d5968;
  font-size:18px;
  line-height:1.65;
}
.hero-actions{
  display:flex;
  gap:16px;
  margin-top:30px;
}
.btn{
  text-decoration:none;
  padding:14px 24px;
  border-radius:3px;
  font-weight:700;
  display:inline-flex;
  align-items:center;
  gap:18px;
}
.btn.primary{background:var(--navy);color:#fff}
.btn.secondary{border:1px solid var(--navy);color:var(--navy);background:#fff}
.hero-right{
  position:relative;
  z-index:2;
  display:flex;
  flex-direction:column;
  align-items:center;
}
.oman-badge{
  align-self:flex-end;
  display:flex;
  gap:12px;
  align-items:center;
  margin-bottom:18px;
}
.oman-badge img{
  width:56px;
  height:auto;
  object-fit:contain;
}
.oman-badge div{
  border-left:2px solid var(--gold);
  padding-left:12px;
  display:flex;
  flex-direction:column;
  color:var(--navy);
  font-size:12px;
  line-height:1.35;
}
.hero-logo{
  width:min(360px,80%);
  mix-blend-mode:multiply;
}
.oman-silhouette{
  position:absolute;
  left:43%;
  right:21%;
  bottom:92px;
  height:150px;
  opacity:.08;
  pointer-events:none;
}
.mountain{
  position:absolute;
  bottom:0;
  background:#345678;
  clip-path:polygon(0 100%,25% 55%,38% 78%,55% 35%,72% 68%,100% 100%);
}
.m1{left:0;width:75%;height:120px}
.m2{right:0;width:68%;height:95px}
.fort{
  position:absolute;
  left:46%;
  bottom:0;
  width:130px;
  height:58px;
  background:#345678;
}
.minaret{
  position:absolute;
  left:63%;
  bottom:0;
  width:18px;
  height:125px;
  background:#345678;
}
.capability-strip{
  width:85%;
  margin:-72px auto 0;
  position:relative;
  z-index:5;
  display:grid;
  grid-template-columns:repeat(6,1fr);
  background:#fff;
  box-shadow:0 15px 40px rgba(13,42,79,.08);
  border-bottom:3px solid var(--gold);
}
.capability{
  min-height:86px;
  display:flex;
  gap:12px;
  align-items:center;
  padding:18px 20px;
  border-right:1px solid var(--line);
}
.capability:last-child{border-right:0}
.capability .icon{
  font-size:24px;
  color:var(--gold);
}
.capability strong{
  display:block;
  color:var(--navy);
  font-size:12px;
}
.capability span{
  display:block;
  font-size:12px;
  color:var(--muted);
  margin-top:4px;
}
.content-section{
  padding:100px 9%;
  background:#fff;
}
.content-section.alt{background:var(--soft)}
.section-grid{
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:90px;
  margin-top:14px;
}
.content-section h2,.contact-section h2{
  margin:0;
  font-size:40px;
  line-height:1.14;
  color:var(--navy);
  letter-spacing:-.025em;
}
.content-section p{
  margin:0;
  color:#566273;
  font-size:17px;
  line-height:1.8;
}
.solution-cards{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}
.solution-cards article{
  background:#fff;
  border:1px solid var(--line);
  padding:24px;
}
.solution-cards h3{
  color:var(--navy);
  margin-top:0;
  font-size:18px;
}
.solution-cards p{font-size:15px;line-height:1.65}
.why-list{
  display:grid;
  gap:10px;
}
.why-list div{
  display:grid;
  grid-template-columns:52px 1fr;
  gap:12px;
  padding:18px 0;
  border-top:1px solid var(--line);
}
.why-list span{
  color:var(--gold);
  font-weight:800;
}
.contact-section{
  background:var(--navy);
  color:#fff;
  padding:90px 9%;
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:80px;
  align-items:center;
}
.section-label.light{color:#f2c46f}
.contact-section h2{color:#fff;margin-top:12px}
.contact-card{
  background:#fff;
  color:var(--ink);
  padding:28px;
}
.contact-card span{
  display:block;
  color:var(--gold);
  font-size:11px;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
  margin-top:14px;
}
.contact-card span:first-child{margin-top:0}
.contact-card a{
  color:var(--navy);
  font-size:20px;
  font-weight:700;
  text-decoration:none;
}
.contact-card p{margin:6px 0 0}
footer{
  min-height:92px;
  padding:18px 7%;
  display:flex;
  align-items:center;
  gap:18px;
  background:#0a1b31;
  color:#d4dbe3;
  font-size:13px;
}
footer img{
  width:58px;height:58px;object-fit:contain;
  background:white;
  border-radius:2px;
}
[dir="rtl"] body{text-align:right}
[dir="rtl"] .site-header{direction:rtl}
[dir="rtl"] .main-nav{direction:rtl}
[dir="rtl"] .lang-btn{margin-left:0;margin-right:12px}
[dir="rtl"] .hero{grid-template-columns:.85fr 1.15fr}
[dir="rtl"] .hero-left{grid-column:2}
[dir="rtl"] .hero-right{grid-column:1;grid-row:1}
[dir="rtl"] .hero h1{letter-spacing:0;line-height:1.2}
[dir="rtl"] .hero-text{line-height:1.9}
[dir="rtl"] .oman-badge div{
  border-left:0;
  border-right:2px solid var(--gold);
  padding-left:0;
  padding-right:12px;
}
[dir="rtl"] .capability{border-right:0;border-left:1px solid var(--line)}
[dir="rtl"] .capability:last-child{border-left:0}
[dir="rtl"] .btn .arrow{transform:rotate(180deg)}
@media(max-width:1100px){
  .main-nav{gap:16px}
  .main-nav a{font-size:13px}
  .hero h1{font-size:46px}
  .capability-strip{width:92%;grid-template-columns:repeat(3,1fr)}
}
@media(max-width:780px){
  .site-header{
    height:auto;
    padding:12px 4%;
    align-items:flex-start;
  }
  .brand-copy{display:none}
  .main-nav{
    gap:9px;
    flex-wrap:wrap;
    justify-content:flex-end;
  }
  .main-nav a{display:none}
  .hero,[dir="rtl"] .hero{
    grid-template-columns:1fr;
    padding:55px 7% 95px;
    min-height:auto;
  }
  [dir="rtl"] .hero-left,[dir="rtl"] .hero-right{
    grid-column:auto;
    grid-row:auto;
  }
  .hero h1{font-size:39px}
  .hero-right{margin-top:24px}
  .hero-logo{width:260px}
  .oman-badge{align-self:center}
  .capability-strip{grid-template-columns:repeat(2,1fr);margin-top:-55px}
  .content-section{padding:70px 7%}
  .section-grid{grid-template-columns:1fr;gap:30px}
  .content-section h2,.contact-section h2{font-size:32px}
  .solution-cards{grid-template-columns:1fr}
  .contact-section{grid-template-columns:1fr;padding:70px 7%}
}
