/* Mazar Steel - modern UI overrides (non-destructive) */
:root{
  /* Steel-silver accents */
  --ms-accent:#cfd8e3;
  --ms-accent-2:#9aa4b2;
  /* Primary button blues */
  --ms-primary:#2563eb; /* blue-600 */
  --ms-primary-2:#60a5fa; /* blue-400 */
  --ms-dark:#111827; /* near black */
  --ms-mid:#1f2937; /* slate */
  --ms-muted:#6b7280; /* gray */
  --ms-bg:#0b1220; /* deep steel */
  --ms-steel1:#0f172a; /* deep steel blue */
  --ms-steel2:#1e293b; /* darker slate */
}
html{scroll-behavior:smooth}
body{font-family:'Poppins', 'Segoe UI', Arial, sans-serif; color:#1f2937; padding-top:72px}

/* Header & Menu */
/* Force override of legacy header.css: fixed, compact, no pseudo shapes */
.header{position:fixed !important; left:0; top:0; width:100%; z-index:1030; background:linear-gradient(90deg, var(--ms-steel1), var(--ms-steel2)); border-bottom:1px solid rgba(255,255,255,.08); height:auto !important}
.header:before,.header:after{display:none !important}
.logo a{padding:0 !important}
.header .nav-wrap{padding:6px 0; transition:padding .2s ease}
.header.menu-bg,.header.shrink{background:linear-gradient(90deg, #0b1220, #0a0f1a); box-shadow:0 8px 24px rgba(0,0,0,.18)}
.logo img{height:48px; width:auto; display:block; transition:height .2s ease}
.header.menu-bg .logo img,.header.shrink .logo img{height:40px}
.navigation > ul{display:flex; gap:6px; align-items:center}
.navigation > ul > li{position:relative}
.header .navigation > ul > li > a{display:inline-block; padding:10px 10px !important; font-weight:700; color:#e5e7eb; text-transform:uppercase; font-size:12px; letter-spacing:.05em}
.navigation > ul > li > a:hover{color:#fff}
/* Active link underline */
.navigation > ul > li > a::after{content:""; display:block; height:2px; background:linear-gradient(90deg, var(--ms-accent), var(--ms-accent-2)); transform:scaleX(0); transition:transform .25s ease; transform-origin:left}
.navigation > ul > li:hover > a::after{transform:scaleX(1)}
/* Colorful hover pill */
.navigation > ul > li:hover > a{background:linear-gradient(90deg, var(--ms-accent), var(--ms-accent-2)); color:#111; border-radius:8px}
/* Active states */
.navigation > ul > li > a.active, .navigation > ul > li.active > a{background:linear-gradient(90deg, var(--ms-accent), var(--ms-accent-2)); color:#111; border-radius:8px}
/* Dropdown */
.navigation .sub-nav{position:absolute; top:calc(100% + 6px); left:0; background:#fff; border:1px solid rgba(0,0,0,.06); box-shadow:0 10px 30px rgba(0,0,0,.12); border-radius:10px; padding:8px 0; min-width:220px; opacity:0; visibility:hidden; transform:translateY(6px); transition:all .18s ease; z-index:2000}
.navigation li:hover > .sub-nav{opacity:1; visibility:visible; transform:translateY(0)}
.navigation .sub-nav li a{display:block; padding:10px 14px; font-weight:600; color:var(--ms-mid)}
.navigation .sub-nav li a:hover{background:#f8fafc; color:var(--ms-dark)}
.nav-bg{justify-content:flex-end}

/* Primary buttons (center text and consistent color) */
button, .btn, .btn-text, .btn-color, .btn-primary, .sent-but, input[type="submit"], input[type="button"], input[type="reset"]{
  display:inline-flex !important; align-items:center; justify-content:center; vertical-align:middle;
  background:linear-gradient(90deg, var(--ms-primary), var(--ms-primary-2));
  border:1px solid transparent; color:#fff !important;
  font-weight:800; letter-spacing:.05em; text-transform:uppercase;
  padding:10px 20px; border-radius:999px; line-height:1.2; min-height:44px;
  box-shadow:0 6px 18px rgba(37,99,235,.25);
}
button:hover, .btn:hover, .btn-text:hover, .btn-color:hover, .btn-primary:hover, .sent-but:hover, input[type="submit"]:hover, input[type="button"]:hover, input[type="reset"]:hover{
  filter:brightness(1.05); transform:translateY(-1px); box-shadow:0 10px 22px rgba(37,99,235,.30);
}
button:active, .btn:active, .btn-text:active, .btn-color:active, .btn-primary:active, .sent-but:active, input[type="submit"]:active{ transform:translateY(0) }

/* Slider / Hero (Home.aspx) */
.rev_slider_wrapper{position:relative; margin-top:0}
.main-banner{margin-top:0}
.header + .main-banner{margin-top:0}
.rev_slider_wrapper::after{display:none !important}
.banner-text span{display:block; color:#fff; font-size:46px; line-height:1.1; font-weight:800; letter-spacing:.3px; text-shadow:0 6px 22px rgba(0,0,0,.45)}
.banner-text p{color:#e5e7eb; font-size:16px; max-width:700px}
.btn-text{display:inline-block; background:linear-gradient(90deg, var(--ms-accent), var(--ms-accent-2)); color:#111; font-weight:800; padding:10px 18px; border-radius:999px; text-transform:uppercase; letter-spacing:.06em}
.btn-text:hover{filter:brightness(1.05); transform:translateY(-1px)}

/* Cards */
.card, .service-box, .maine_box{border:1px solid rgba(0,0,0,.06); border-radius:14px; box-shadow:0 6px 24px rgba(0,0,0,.06); overflow:hidden}
.card:hover, .service-box:hover, .maine_box:hover{transform:translateY(-2px); box-shadow:0 12px 28px rgba(0,0,0,.09)}

/* Footer */
.footer{background:var(--ms-bg); color:#e5e7eb}
.footer h4{color:#fff; font-weight:800; letter-spacing:.3px}
.footer address{color:#cbd5e1}
.footer .link-small li{margin-bottom:6px}
.footer a{color:#e5e7eb}
.footer a:hover{color:var(--ms-accent)}
.icons-hover-black a{display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; border-radius:50%; background:#0f172a; color:#e5e7eb; margin-right:6px}
.icons-hover-black a:hover{background:linear-gradient(90deg, var(--ms-accent), var(--ms-accent-2)); color:#111}
.newsletter-input{border-radius:999px; border:1px solid rgba(255,255,255,.18); background:#0f172a; color:#fff}
.newsletter-btn{border-radius:999px}
.copyright{background:#0a0f1a; color:#cbd5e1; padding:14px 0; font-size:13px}

/* Section titles */
h1,h2,h3{font-weight:800; letter-spacing:.2px}
.section-title span.accent{background:linear-gradient(90deg, var(--ms-accent), var(--ms-accent-2)); -webkit-background-clip:text; background-clip:text; color:transparent}

/* Organization chart and tables */
.table thead th{background:#f8fafc; color:#0f172a}
.table-striped tbody tr:nth-of-type(odd){background:#f8fafc}

/* Page intro (About/Services/Projects/etc.) - remove legacy top gap */
.inner-intro{margin-top:0 !important}
.inner-intro.inner-intro-small{margin-top:0 !important}

/* Responsive nav fallback */
@media (max-width: 991.98px){
  .navigation > ul{flex-wrap:wrap; gap:6px}
  .header .nav-wrap{padding:6px 0}
  .logo img{height:40px}
  .header .navigation > ul > li > a{padding:10px 8px !important}
  body{padding-top:64px}
}