:root{
  --red:#EF000A!important;
  --red-dark:#CC0004!important;
  --dark:#151618!important;
  --dark-2:#0F1012!important;
  --gray:#6E7071!important;
  --light:#F4F5F6!important;
  --border:#E1E3E5!important;
  --white:#FFFFFF!important;
}
html{scroll-behavior:smooth}
body{font-family:Inter,Arial,sans-serif!important;background:#fff;color:#282727}
.site-header{background:rgba(255,255,255,.97)!important;border-bottom:1px solid #E1E3E5!important;box-shadow:none!important;backdrop-filter:blur(14px)}
.brand-mark .m-red{color:#EF000A!important}.brand-mark .m-dark{color:#282727!important}
.brand-name,.brand-sub,.brand-ar{color:#282727!important}
.main-nav a,.main-nav button{color:#282727!important}
.main-nav a:hover,.main-nav button:hover{color:#EF000A!important}
.header-btn,.lang-btn{border-radius:2px!important}
.header-btn{background:#282727!important;color:#fff!important;border-color:#282727!important}
.header-btn:hover{background:#EF000A!important;border-color:#EF000A!important}
.mec-group-header-btn,.mecmind-header-btn{background:#fff!important;color:#282727!important;border:1px solid #D9DCDF!important}
.hero.hero-v2{position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(110deg,#101113 0%,#171719 54%,#202124 100%)!important;min-height:690px}
.hero.hero-v2:before{content:"";position:absolute;inset:0;z-index:-2;background-image:linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px);background-size:56px 56px;mask-image:linear-gradient(90deg,transparent 0%,#000 42%,#000 100%)}
.hero.hero-v2:after{content:"";position:absolute;width:700px;height:700px;right:-190px;top:-190px;z-index:-1;background:radial-gradient(circle,rgba(255,255,255,.055),rgba(255,255,255,.018) 36%,transparent 68%);pointer-events:none}
.hero-grid{position:relative;z-index:2}
.hero .label{color:#D9DDE1!important;font-weight:800!important;letter-spacing:.115em}
.hero-content h1,.hero-content h1 span{color:#fff!important}
.hero-content h1 strong{color:#F1F2F3!important}
.hero-text{color:#C7CBCF!important}
.hero .btn-primary{background:#D71920!important;border-color:#D71920!important;color:#fff!important}
.hero .btn-primary:hover{background:#B8141B!important;border-color:#B8141B!important}
.hero .btn-outline{background:transparent!important;border-color:rgba(255,255,255,.48)!important;color:#fff!important}
.hero-quotation-portal{color:#D8DBDE!important}
.hero-card{background:linear-gradient(145deg,rgba(255,255,255,.07),rgba(255,255,255,.02))!important;border:1px solid rgba(255,255,255,.14)!important;box-shadow:none!important;color:#fff!important;backdrop-filter:blur(6px)}
.hero-card h3{color:#fff!important}.hero-card p{color:#C7CBCF!important}
.hero-card .icon{border:1px solid rgba(255,255,255,.14)!important}
.stats.stats-v2{background:#fff!important;border-bottom:1px solid #E1E3E5!important}
.stats-grid>div{border-color:#E1E3E5!important}
.stats span,.section-label,.eyebrow{color:#EF000A!important}
.section{border-color:#E1E3E5}
.about-section,.company-info-section,.services-section,.certificates-section,.mec-clean-contact{background:#fff!important}
.ai-home-section,.scope-section,.construction-cv-section,#working-hours{background:#F4F5F6!important}
.vision-section{background:#151618!important;color:#fff!important}
.vision-section h2,.vision-section h3,.vision-section strong{color:#fff!important}
.vision-section p{color:#C6C9CC!important}
.service-card,.project-card,.certificate-card,#mec-management-clean .mec-card,#mec-management-clean .mec-info-box,.mec-social-card{border-radius:3px!important;box-shadow:none!important;border-color:#E1E3E5!important}
.btn-primary{background:#EF000A!important;border-color:#EF000A!important}
.btn-primary:hover{background:#CC0004!important;border-color:#CC0004!important}
#mec-management-clean{background:#F4F5F6!important}
#mec-management-clean .mec-role,#mec-management-clean .mec-info-box span{color:#EF000A!important}
#mec-management-clean .mec-avatar{background:#282727!important;box-shadow:0 7px 0 #EF000A!important}
.mec-social-section{background:radial-gradient(circle at 12% 20%,rgba(239,0,10,.07),transparent 30%),linear-gradient(180deg,#fff 0%,#F4F5F6 100%)!important}
.mec-footer-clean{background:#0F1012!important}
.mec-preview-badge{position:fixed;right:16px;bottom:16px;z-index:999999;padding:9px 12px;background:#EF000A;color:#fff;font:800 11px/1.2 Inter,Arial,sans-serif;letter-spacing:.08em;box-shadow:0 8px 28px rgba(0,0,0,.22)}
@media(max-width:900px){.hero.hero-v2{min-height:auto}.hero.hero-v2:after{width:420px;height:420px}.mec-preview-badge{right:10px;bottom:10px;font-size:9px}}
html[dir="rtl"] body{font-family:Arial,Tahoma,sans-serif!important}

@media(max-width:900px){
  .hero.hero-v2{padding:54px 0 46px!important;min-height:auto!important}
  .hero-grid{display:grid!important;grid-template-columns:1fr!important;gap:34px!important;align-items:start!important}
  .hero-content{width:100%!important;max-width:100%!important;min-width:0!important}
  .hero-content h1{font-size:44px!important;line-height:1.03!important;max-width:100%!important}
  .hero-content h1 span,.hero-content h1 strong{font-size:inherit!important;line-height:inherit!important}
  .hero-text{max-width:100%!important}
  .hero-cards{position:static!important;display:grid!important;grid-template-columns:1fr!important;gap:16px!important;width:100%!important;max-width:100%!important;margin:0!important;transform:none!important}
  .hero-card,.hero-card.offset{position:static!important;width:100%!important;max-width:100%!important;margin:0!important;transform:none!important}
  .hero-buttons{display:flex!important;flex-wrap:wrap!important;gap:12px!important}
  .mec-preview-badge{display:none!important}
}
@media(max-width:480px){
  .hero-content h1{font-size:39px!important}
  .hero .label{font-size:12px!important;line-height:1.8!important}
}

/* MECMISR family mobile management width guard */
@media(max-width:768px){
  #mec-management-clean .mec-management-wrap{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }
  #mec-management-clean .mec-management-wrap > *{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }
  #mec-management-clean .mec-name,
  #mec-management-clean .mec-name-nowrap{
    max-width:100%!important;
  }
}