/* MS Monitors V41.0 — isolated premium UI polish
   Scope: header identity, service cards, CCTV reference card, and footer.
   Does not alter service-page layouts or related cards. */

/* Header identity */
.site-header .ms-brand{
  display:flex!important;
  align-items:center!important;
  gap:11px!important;
  flex:0 0 auto!important;
  min-width:205px!important;
  padding:5px 0!important;
}
.site-header .ms-brand-mark{
  width:58px!important;
  height:58px!important;
  flex:0 0 58px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:18px!important;
  background:linear-gradient(145deg,#ffffff,#f1fbff)!important;
  box-shadow:0 8px 24px rgba(15,23,42,.09)!important;
  border:1px solid rgba(47,125,209,.10)!important;
  overflow:hidden!important;
}
.site-header .ms-brand-mark img{
  width:52px!important;
  height:52px!important;
  max-width:none!important;
  object-fit:contain!important;
  display:block!important;
}
.site-header .ms-brand-copy{
  display:flex!important;
  flex-direction:column!important;
  text-align:right!important;
  line-height:1.15!important;
  white-space:nowrap!important;
}
.site-header .ms-brand-copy strong{
  color:#0f172a!important;
  font-size:16px!important;
  font-weight:900!important;
  letter-spacing:-.25px!important;
}
.site-header .ms-brand-copy small{
  color:#2788bf!important;
  font-size:11px!important;
  font-weight:800!important;
  margin-top:4px!important;
}

/* Premium service cards — no inner-box effect */
#services .services-grid{
  gap:22px!important;
}
#services .service-card{
  padding:0 20px 20px!important;
  overflow:hidden!important;
  border-radius:24px!important;
  min-height:390px!important;
  background:#fff!important;
}
#services .service-card .service-img{
  height:208px!important;
  min-height:208px!important;
  width:calc(100% + 40px)!important;
  margin:0 -20px 16px!important;
  padding:0!important;
  background:linear-gradient(180deg,#f8fdff 0%,#ffffff 100%)!important;
  border-bottom:1px solid #edf3f8!important;
  overflow:hidden!important;
  border-radius:24px 24px 0 0!important;
}
#services .service-card .service-img img{
  width:100%!important;
  max-width:none!important;
  height:100%!important;
  max-height:none!important;
  object-fit:cover!important;
  object-position:center!important;
  border-radius:0!important;
  margin:0!important;
  transform:none!important;
}
#services .service-card:hover .service-img img{
  transform:scale(1.025)!important;
}
#services .service-card h3{
  font-size:20px!important;
  margin:0 0 8px!important;
}
#services .service-card p{
  line-height:1.8!important;
}

/* CCTV card gets contain-like product visibility without a second box */
#services .service-card[href="/cctv"] .service-img{
  background:linear-gradient(145deg,#f3fbff,#ffffff)!important;
}
#services .service-card[href="/cctv"] .service-img img{
  object-fit:cover!important;
  object-position:center 48%!important;
}

/* Footer identity */
.footer .ms-footer-brand{
  max-width:320px!important;
}
.footer .ms-footer-logo{
  display:flex!important;
  align-items:center!important;
  gap:13px!important;
  margin-bottom:16px!important;
}
.footer .ms-footer-logo img{
  width:72px!important;
  height:72px!important;
  object-fit:contain!important;
  margin:0!important;
  background:transparent!important;
}
.footer .ms-footer-logo span{
  display:flex!important;
  flex-direction:column!important;
  line-height:1.2!important;
}
.footer .ms-footer-logo strong{
  color:#fff!important;
  font-size:20px!important;
  font-weight:900!important;
}
.footer .ms-footer-logo small{
  color:#75d8dc!important;
  font-size:12px!important;
  font-weight:800!important;
  margin-top:4px!important;
}
.footer .ms-footer-brand p{
  max-width:310px!important;
  line-height:1.9!important;
}
.footer-grid{
  align-items:start!important;
}
.footer-grid>div h3{
  position:relative!important;
  padding-bottom:10px!important;
}
.footer-grid>div h3:after{
  content:""!important;
  position:absolute!important;
  right:0!important;
  bottom:0!important;
  width:34px!important;
  height:3px!important;
  border-radius:999px!important;
  background:linear-gradient(90deg,#2F7DD1,#009688)!important;
}

@media (max-width:1280px) and (min-width:1101px){
  .site-header .ms-brand{min-width:170px!important;gap:8px!important;}
  .site-header .ms-brand-mark{width:50px!important;height:50px!important;flex-basis:50px!important;}
  .site-header .ms-brand-mark img{width:46px!important;height:46px!important;}
  .site-header .ms-brand-copy strong{font-size:14px!important;}
  .site-header .ms-brand-copy small{font-size:10px!important;}
}

@media (max-width:1100px){
  .site-header .ms-brand{min-width:0!important;gap:8px!important;}
  .site-header .ms-brand-mark{width:50px!important;height:50px!important;flex-basis:50px!important;border-radius:15px!important;}
  .site-header .ms-brand-mark img{width:45px!important;height:45px!important;}
  .site-header .ms-brand-copy strong{font-size:14px!important;}
  .site-header .ms-brand-copy small{font-size:10px!important;}
}

@media (max-width:700px){
  .site-header .ms-brand-copy{display:none!important;}
  #services .service-card{min-height:auto!important;}
  #services .service-card .service-img{
    height:220px!important;
    min-height:220px!important;
  }
  .footer .ms-footer-brand{max-width:none!important;text-align:center!important;}
  .footer .ms-footer-logo{justify-content:center!important;}
  .footer .ms-footer-brand p{margin-inline:auto!important;}
  .footer-grid>div h3:after{right:50%!important;transform:translateX(50%)!important;}
}
