:root{
  --navy:#0d2f4f;--navy2:#153f68;--orange:#f28c28;--light:#f5f7fa;
  --muted:#667085;--text:#1f2937;--white:#fff;--border:#e5e7eb;
  --shadow:0 18px 45px rgba(13,47,79,.10);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Tahoma,Arial,sans-serif;color:var(--text);background:#fff;line-height:1.8}
body[dir="rtl"]{direction:rtl} body[dir="ltr"]{direction:ltr}
a{text-decoration:none;color:inherit}
.container{width:min(1140px,92%);margin:auto}
.topbar{background:var(--navy);color:#fff;font-size:14px}
.topbar .container{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:7px 0;flex-wrap:wrap}
.header{background:#fff;border-bottom:1px solid var(--border);position:sticky;top:0;z-index:20}
.nav{height:82px;display:flex;align-items:center;justify-content:space-between;gap:22px}
.logo img{max-height:62px;max-width:190px;object-fit:contain}
.menu{display:flex;align-items:center;gap:24px;font-weight:700;color:var(--navy)}
.menu a:hover{color:var(--orange)}
.actions{display:flex;align-items:center;gap:10px}
.lang{border:1px solid var(--border);padding:7px 12px;border-radius:999px;color:var(--navy);font-weight:700;background:#fff}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:12px 20px;border-radius:999px;font-weight:700;border:1px solid transparent;transition:.2s ease}
.btn-primary{background:var(--orange);color:#fff}.btn-primary:hover{filter:brightness(.95);transform:translateY(-1px)}
.btn-outline{border-color:rgba(255,255,255,.65);color:#fff}.btn-outline:hover{background:#fff;color:var(--navy)}
.hero{position:relative;overflow:hidden;background:linear-gradient(90deg,rgba(13,47,79,.97),rgba(13,47,79,.82)),radial-gradient(circle at 18% 20%,rgba(242,140,40,.35),transparent 30%),linear-gradient(135deg,#0d2f4f,#1d5f8f);color:#fff}
.hero::after{content:"";position:absolute;inset:0;background-image:linear-gradient(30deg,rgba(255,255,255,.06) 12%,transparent 12.5%,transparent 87%,rgba(255,255,255,.06) 87.5%),linear-gradient(150deg,rgba(255,255,255,.06) 12%,transparent 12.5%,transparent 87%,rgba(255,255,255,.06) 87.5%);background-size:70px 120px;opacity:.22}
.hero .container{position:relative;z-index:2;min-height:560px;display:grid;grid-template-columns:1.1fr .9fr;gap:36px;align-items:center;padding:78px 0}
.hero-card{background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.16);border-radius:28px;padding:34px;box-shadow:var(--shadow);backdrop-filter:blur(8px)}
.hero h1{font-size:38px;line-height:1.45;margin:0 0 20px}.hero p{font-size:18px;margin:0 0 16px;color:rgba(255,255,255,.92)}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.visual{min-height:360px;border-radius:34px;background:linear-gradient(135deg,rgba(255,255,255,.94),rgba(255,255,255,.72)),repeating-linear-gradient(45deg,rgba(13,47,79,.15) 0 2px,transparent 2px 14px);position:relative;box-shadow:var(--shadow);overflow:hidden}
.visual::before{content:"";position:absolute;width:230px;height:230px;border:34px solid var(--orange);border-radius:50%;inset-block-start:-40px;inset-inline-start:-60px;opacity:.9}
.visual::after{content:"";position:absolute;inset:70px 40px 40px 40px;background:linear-gradient(to top,var(--navy) 0 18%,transparent 18%),linear-gradient(to top,rgba(13,47,79,.92) 0 72%,transparent 72%);clip-path:polygon(5% 100%,5% 45%,26% 45%,26% 20%,48% 20%,48% 52%,68% 52%,68% 8%,92% 8%,92% 100%);opacity:.9}
section{padding:76px 0}.services{background:var(--light)}
.section-title{text-align:center;margin-bottom:36px}.section-title h2{color:var(--navy);font-size:32px;margin:0 0 10px}.section-title p{color:var(--muted);margin:0 auto;max-width:760px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.why .grid{grid-template-columns:repeat(4,1fr)}
.card{background:#fff;padding:26px;border:1px solid var(--border);border-radius:22px;box-shadow:0 10px 30px rgba(15,23,42,.05);min-height:205px}
.why .card{text-align:center;min-height:178px}.icon{width:52px;height:52px;border-radius:16px;background:rgba(242,140,40,.14);color:var(--orange);display:flex;align-items:center;justify-content:center;font-size:24px;margin-bottom:14px}.why .icon{margin:0 auto 14px}
.card h3{color:var(--navy);margin:0 0 10px;font-size:20px}.card p{margin:0;color:#4b5563}
.cta{background:linear-gradient(135deg,var(--navy),var(--navy2));color:#fff}.cta-box{display:flex;justify-content:space-between;align-items:center;gap:24px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);padding:34px;border-radius:26px}.cta h2{margin:0 0 8px;font-size:30px}.cta p{margin:0;color:rgba(255,255,255,.88)}
.page-hero{background:linear-gradient(135deg,var(--navy),var(--navy2));color:#fff;padding:70px 0}.page-hero h1{margin:0;font-size:36px}.page-hero p{max-width:850px;margin:14px 0 0;color:rgba(255,255,255,.88)}
.content{max-width:960px;margin:auto}.content-box{background:#fff;border:1px solid var(--border);border-radius:22px;padding:28px;box-shadow:0 10px 30px rgba(15,23,42,.05);margin-bottom:22px}.content h2,.content h3{color:var(--navy)}
.form-wrap{display:grid;grid-template-columns:1fr .9fr;gap:26px;align-items:start}.form{background:#fff;border:1px solid var(--border);border-radius:22px;padding:26px;box-shadow:0 10px 30px rgba(15,23,42,.05)}.field{margin-bottom:14px}label{display:block;font-weight:700;color:var(--navy);margin-bottom:6px}input,select,textarea{width:100%;border:1px solid var(--border);border-radius:14px;padding:12px 14px;font-family:inherit;font-size:15px}textarea{min-height:120px;resize:vertical}.notice{background:#fff7ed;border:1px solid #fed7aa;color:#7c2d12;border-radius:18px;padding:16px;margin-top:16px}
.footer{background:#071f35;color:#fff;padding:52px 0 20px}.footer-grid{display:grid;grid-template-columns:1.2fr .8fr 1fr;gap:28px}.footer h3,.footer h4{margin:0 0 16px;color:#fff}.footer p,.footer a{color:rgba(255,255,255,.82)}.footer a{display:block;margin:7px 0}.footer-bottom{border-top:1px solid rgba(255,255,255,.14);margin-top:32px;padding-top:16px;text-align:center;color:rgba(255,255,255,.68)}
@media(max-width:920px){.hero .container{grid-template-columns:1fr;padding:48px 0}.visual{min-height:260px}.grid,.why .grid,.footer-grid,.form-wrap{grid-template-columns:1fr}.menu{display:none}.cta-box{flex-direction:column;text-align:center}.hero h1{font-size:30px}.topbar .container{justify-content:center}.actions .btn-primary{display:none}}

/* v2 updates */
.logo{
  display:flex;
  align-items:center;
  gap:12px;
}
body[dir="rtl"] .logo{flex-direction:row-reverse;}
.logo img{
  max-height:74px;
  max-width:88px;
}
.brand-text{
  display:flex;
  flex-direction:column;
  line-height:1.25;
}
.brand-main{
  color:var(--navy);
  font-weight:900;
  font-size:20px;
  white-space:nowrap;
}
.brand-sub{
  color:var(--orange);
  font-weight:700;
  font-size:13px;
  letter-spacing:.4px;
}
.contact-actions{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
  margin-top:22px;
}
.contact-btn{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:13px 14px;
  border-radius:16px;
  font-weight:800;
  border:1px solid var(--border);
  background:#fff;
  color:var(--navy);
  box-shadow:0 8px 20px rgba(15,23,42,.05);
}
.contact-btn:hover{
  border-color:var(--orange);
  color:var(--orange);
  transform:translateY(-1px);
}
.contact-btn.primary{
  background:var(--orange);
  color:#fff;
  border-color:var(--orange);
}
.contact-btn.primary:hover{
  color:#fff;
  filter:brightness(.96);
}
@media(max-width:920px){
  .brand-main{font-size:16px}
  .brand-sub{font-size:11px}
  .logo img{max-height:58px;max-width:68px}
  .contact-actions{grid-template-columns:1fr}
}

/* v3 updates: company name only in header */
.brand-text{line-height:1}
.brand-main{font-size:22px}
@media(max-width:920px){.brand-main{font-size:17px}}

/* v4 updates */
.header .nav{
  height:96px;
}
.logo{
  gap:16px;
}
body[dir="rtl"] .logo{
  flex-direction:row-reverse;
}
.logo img{
  max-height:90px !important;
  max-width:108px !important;
}
.brand-main{
  font-size:28px !important;
  font-weight:950 !important;
  color:var(--navy);
  letter-spacing:-.3px;
}
.actions .btn-primary{
  display:none !important;
}
@media(max-width:920px){
  .header .nav{height:82px}
  .logo img{max-height:68px !important;max-width:82px !important}
  .brand-main{font-size:19px !important}
}

/* v5 updates: keep decorative top strip without contact text */
.empty-topbar{
  height:18px;
  min-height:18px;
}
.empty-topbar .container{
  padding:0;
  min-height:18px;
}

/* v6 unified header across all pages */
.topbar.empty-topbar{
  height:18px !important;
  min-height:18px !important;
  padding:0 !important;
  background:var(--navy) !important;
}
.topbar.empty-topbar .container{
  height:18px !important;
  min-height:18px !important;
  padding:0 !important;
}
.header .nav{
  height:108px !important;
}
.logo{
  display:flex !important;
  align-items:center !important;
  gap:18px !important;
}
body[dir="rtl"] .logo{
  flex-direction:row-reverse !important;
}
.logo img{
  max-height:104px !important;
  max-width:132px !important;
  width:auto !important;
  object-fit:contain !important;
}
.brand-main{
  font-size:30px !important;
  font-weight:950 !important;
  color:var(--navy) !important;
  letter-spacing:-.3px !important;
  white-space:nowrap !important;
}
.header .actions .btn-primary{
  display:none !important;
}
.cta .hero-actions .btn-outline{
  display:none !important;
}
@media(max-width:920px){
  .header .nav{height:88px !important}
  .logo img{max-height:74px !important;max-width:92px !important}
  .brand-main{font-size:19px !important}
}

/* v7 contact form processing */
.hidden-field{display:none !important}
.form-alert{
  display:none;
  border-radius:14px;
  padding:12px 14px;
  margin:0 0 16px;
  font-weight:700;
}
.form-alert.success{background:#ecfdf3;color:#027a48;border:1px solid #abefc6}
.form-alert.warning{background:#fffaeb;color:#b54708;border:1px solid #fedf89}
.form-alert.error{background:#fef3f2;color:#b42318;border:1px solid #fecdca}
body:has(#sentMsg) .form-alert{display:none}

/* v8 robust contact form */
.submit-btn{
  cursor:pointer;
  min-width:160px;
  border:none;
}
.submit-btn:active{
  transform:scale(.98);
}

/* v10 other service field */
.other-service-field{
  display:none;
}
.other-service-field.show{
  display:block;
}

/* v11 contact form UX */
.required-star{
  color:#d92d20;
  font-weight:900;
  margin-inline-start:4px;
}
input.invalid, select.invalid, textarea.invalid{
  border-color:#d92d20 !important;
  box-shadow:0 0 0 3px rgba(217,45,32,.12) !important;
}
.field .error-note{
  color:#d92d20;
  font-size:13px;
  margin-top:4px;
  display:none;
}
.field.has-error .error-note{
  display:block;
}
.whatsapp-after-submit{
  display:none;
  margin:0 0 18px;
  width:fit-content;
}
.form-alert{
  display:none;
}
.other-service-field{
  display:none;
}
.other-service-field.show{
  display:block;
}

/* final approved updates */
.topbar.empty-topbar{height:18px !important;min-height:18px !important;padding:0 !important;background:var(--navy) !important;}
.topbar.empty-topbar .container{height:18px !important;min-height:18px !important;padding:0 !important;}
.header .nav{height:108px !important;}
.logo{display:flex !important;align-items:center !important;gap:18px !important;}
body[dir="rtl"] .logo{flex-direction:row-reverse !important;}
.logo img{max-height:104px !important;max-width:132px !important;width:auto !important;object-fit:contain !important;}
.brand-main{font-size:30px !important;font-weight:950 !important;color:var(--navy) !important;letter-spacing:-.3px !important;white-space:nowrap !important;}
.header .actions .btn-primary,.cta .hero-actions .btn-outline{display:none !important;}
.required-star{color:#d92d20;font-weight:900;margin-inline-start:4px;}
input.invalid,select.invalid,textarea.invalid{border-color:#d92d20 !important;box-shadow:0 0 0 3px rgba(217,45,32,.12) !important;}
.field .error-note{color:#d92d20;font-size:13px;margin-top:4px;display:none;}
.field.has-error .error-note{display:block;}
.whatsapp-after-submit{display:none;margin:0 0 18px;width:fit-content;}
.other-service-field{display:none;}
.other-service-field.show{display:block;}
@media(max-width:920px){.header .nav{height:88px !important}.logo img{max-height:74px !important;max-width:92px !important}.brand-main{font-size:19px !important}}

/* services summary on homepage */
.services-summary .service-title-card{
  min-height:150px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
}
.services-summary .service-title-card h3{
  margin:14px 0 0;
}
.section-actions{
  display:flex;
  justify-content:center;
  margin-top:28px;
}