/* ============================================================
   UNION MEDIA — 2026 re-skin
   Loads AFTER style.css / responsive.css and overrides the theme.
   Identity: navy #16294D · deep #0D1730 · gold #C8A44D · ice #EFF2F7
   Matches the Union Media catalogue design.
   ============================================================ */

:root{
  --um-navy:#16294D;
  --um-navy-2:#1E3560;
  --um-deep:#0D1730;
  --um-gold:#C8A44D;
  --um-gold-d:#A88024;
  --um-ice:#EFF2F7;
  --um-ink:#14213C;
  --um-muted:#5A6B8C;
  --um-line:#D4DBE8;
}

/* ---------- typography ---------- */
body{
  font-family:'IBM Plex Sans Arabic','Open Sans',sans-serif;
  color:#2A3550;
}
h1,h2,h3,h4,h5,h6,
.page-title,.footer-title,.heading-title h3,.me-menu{
  font-family:'Cairo','Montserrat',sans-serif !important;
}
#page-header .post-meta,
#page-header .heading-caption{
  font-family:'IBM Plex Sans Arabic','Open Sans',sans-serif;
  font-style:normal;
  letter-spacing:.5px;
}

/* ---------- brand color swap (purple -> navy) ---------- */
.text-color{color:var(--um-navy);}
.colored-bg{background-color:var(--um-navy) !important;}

.btn-default{
  background:var(--um-navy);
  border-radius:8px;
}
.btn-default:hover,.btn-default:focus,
.btn-default:active:hover,.btn-default:active:focus,
.btn-default.active:focus,.open>.dropdown-toggle.btn-default,
.btn-default:active,.btn-default.active{
  background:var(--um-gold-d);
  color:#fff;
}
.btn{border-radius:8px;}

/* ---------- header ---------- */
.header-top{background:var(--um-deep);}
.header-main{background:rgba(13,23,48,.72);}
.header-info a:hover,.header-info i{color:var(--um-gold);}
.header-social a:hover{color:var(--um-gold);}

.me-menu > li > a{
  font-weight:600;
  letter-spacing:.4px;
}
.me-menu > li > a:hover,
.me-menu > li > a:focus,
.me-menu > li > a.active,
.me-menu > li > a.highlighted,
.me-menu > li > a.current{color:var(--um-gold) !important;}
#header .header-main.header-on-sticky .me-menu > li > a:hover,
#header .header-main.header-on-sticky .me-menu > li > a.active{color:var(--um-navy) !important;}

/* highlight the Catalogue menu item */
.me-menu > li > a[href*="catalogue"]{
  color:#fff;
  background:var(--um-gold-d);
  border-radius:8px;
}
.me-menu > li > a[href*="catalogue"]:hover{
  background:var(--um-gold);
  color:#fff !important;
}
#header .header-main.header-on-sticky .me-menu > li > a[href*="catalogue"]{
  color:#fff !important;
}

/* ---------- page header band (the gray hero) ---------- */
#page-header .page-title-container{
  background:url(um-wall.jpg) center/cover !important;
  min-height:340px;
}
#page-header .centered-container{
  min-height:340px;
  padding-top:185px;
  padding-bottom:44px;
}
#page-header .background-overlay{
  opacity:.84;
  background:linear-gradient(180deg,#0D1730 0%,rgba(13,23,48,.70) 55%,#0D1730 100%);
}
#page-header .page-title{
  font-weight:700;
  letter-spacing:1px;
  text-transform:none;
}
#page-header .heading-caption{color:#CADCF5;}

/* dashed separator -> short gold line */
.separator{padding:18px 0 19px;}
.separator:after{
  border-top:3px solid var(--um-gold);
  width:56px;
  border-radius:2px;
}
.separator.small-separator:after{width:56px;}
.hero-separator:after,.text-left .hero-separator:after{
  border-top:3px solid var(--um-gold);
}

/* breadcrumb strip */
.breadcrumb-container{
  background-color:var(--um-ice);
  border-bottom:1px solid var(--um-line);
  box-shadow:none;
}
.breadcrumb .breadcrumb-item:hover,
.breadcrumb > .active{color:var(--um-navy);}

/* ---------- content accents ---------- */
a{color:var(--um-navy);}
a:hover{color:var(--um-gold-d);}
.form-control{border-radius:8px;}
.form-control:focus{border-color:var(--um-navy);box-shadow:0 0 0 2px rgba(22,41,77,.15);}

/* ---------- footer ---------- */
#footer{
  background-color:var(--um-deep);
  color:#8FA3C8;
  padding-top:64px;
}
#footer strong,#footer a{color:#B9C6E0;}
#footer a:hover{color:var(--um-gold);}
.footer-title{
  color:#fff;
  letter-spacing:.5px;
}
#footer .text-color{
  color:#fff;background:transparent;padding:0;border-radius:0;
}
#footer .text-color:hover{color:var(--um-gold);background:transparent;}
#footer .footer-bottom{
  border-top:1px solid rgba(185,198,224,.15);
  margin-top:40px;
}
#footer .subscribe-form .btn-default{background:var(--um-gold-d);}
#footer .subscribe-form .btn-default:hover{background:var(--um-gold);}

/* ---------- anchors ---------- */
html{scroll-behavior:smooth;}
#clients{scroll-margin-top:110px;}

/* ---------- slider arrows: always visible ---------- */
.slideshow .flex-nav-prev a{opacity:1 !important;left:20px !important;}
.slideshow .flex-nav-next a{opacity:1 !important;right:20px !important;}
.slideshow .flex-direction-nav a{background:rgba(13,23,48,.6);}
.slideshow .flex-nav-prev:hover a,
.slideshow .flex-nav-next:hover a{background:#A88024;}

/* ---------- homepage section rhythm ---------- */
#our-services, #clients{background:var(--um-ice);}
#why-choose-us{background:#fff;}
#our-services .service-grid, #clients .service-grid{
  background:#fff;
  border:1px solid var(--um-line);
  border-radius:14px;
  padding:22px 18px 24px;
  height:100%;
  box-shadow:0 2px 10px rgba(20,33,60,.06);
  transition:transform .15s ease, box-shadow .15s ease;
}
#our-services .service-grid:hover{
  transform:translateY(-3px);
  box-shadow:0 10px 26px rgba(20,33,60,.12);
}
#our-services .img-service img, #clients .img-service img{border-radius:10px;}
#why-choose-us .feature{
  background:var(--um-ice);
  border-radius:12px;
  padding:18px 22px;
  margin-bottom:14px;
}

/* ============ Homepage 2026 sections ============ */
.um-band{background:linear-gradient(150deg,#0D1730 0%,#16294D 75%,#1E3560 100%);padding:205px 0 64px;}
@media (max-width:991px){.um-band{padding-top:150px;}}
.um-tagline{text-align:center;max-width:760px;margin:0 auto 34px;}
.um-tagline h1,.um-tagline h2{font-family:Cairo,sans-serif;color:#fff;font-size:38px;font-weight:800;line-height:1.3;margin:0 0 12px;}
.um-tagline p{color:#B9C6E0;font-size:15px;line-height:1.85;margin:0;}
.um-stats{display:flex;flex-wrap:wrap;justify-content:center;gap:26px 60px;}
.um-stat{text-align:center;}
.um-stat b{display:block;font-family:Cairo,sans-serif;font-size:38px;font-weight:900;color:#C8A44D;line-height:1.1;}
.um-stat i{font-style:normal;color:#B9C6E0;font-size:12px;letter-spacing:2px;text-transform:uppercase;font-family:Cairo,sans-serif;font-weight:700;}

.um-eyebrow{color:#A88024;font-family:Cairo,sans-serif;font-weight:700;letter-spacing:4px;font-size:12px;text-transform:uppercase;margin-bottom:4px;}
.um-showcase{background:#fff;padding-bottom:84px;}
.um-posters{display:flex;justify-content:center;gap:18px;flex-wrap:wrap;margin-top:26px;}
.um-posters img{width:150px;height:150px;object-fit:cover;border-radius:14px;
  box-shadow:0 10px 26px rgba(20,33,60,.18);transition:transform .15s ease;}
.um-posters img:nth-child(even){transform:translateY(20px);}
.um-posters img:hover{transform:translateY(-4px) scale(1.03);}
.um-posters img:nth-child(even):hover{transform:translateY(14px) scale(1.03);}
.um-show-cta{text-align:center;margin-top:56px;}
.um-btn-gold{display:inline-block;background:#A88024;color:#fff !important;font-family:Cairo,sans-serif;
  font-weight:700;font-size:15px;padding:15px 40px;border-radius:9px;text-decoration:none !important;}
.um-btn-gold:hover{background:#C8A44D;}
.um-show-cta small{display:block;margin-top:12px;color:#5A6B8C;font-size:12.5px;}

/* Why Choose Us: navy drama */
#why-choose-us{background:linear-gradient(150deg,#0D1730 0%,#16294D 70%,#1E3560 100%);}
#why-choose-us .heading-title h3 strong{color:#fff;}
#why-choose-us .feature{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);
  border-radius:14px;padding:24px 26px;margin-bottom:0;height:100%;}
#why-choose-us .feature-content h5{color:#C8A44D;font-weight:800;}
#why-choose-us .feature-content p{color:#C9D5EC;}
@media (min-width:992px){
  #why-choose-us .row{display:flex;flex-wrap:wrap;}
  #why-choose-us .col-lg-12:not(:first-child){flex:0 0 50%;max-width:50%;padding-bottom:20px;}
}

/* closing CTA band */
.um-cta{background:#A88024;padding:40px 0;}
.um-cta .container{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:18px;}
.um-cta h3{font-family:Cairo,sans-serif;color:#fff;font-size:23px;font-weight:800;margin:0;}
.um-cta a{background:#0D1730;color:#fff !important;font-family:Cairo,sans-serif;font-weight:700;
  padding:14px 32px;border-radius:9px;text-decoration:none !important;font-size:14px;}
.um-cta a:hover{background:#16294D;}

/* ---------- contact persons + compact map ---------- */
.um-person{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid var(--um-line);
  border-radius:12px;padding:14px 18px;box-shadow:0 2px 8px rgba(20,33,60,.06);margin-bottom:14px;}
.um-person img{width:52px !important;height:52px !important;max-width:52px;border-radius:50%;object-fit:cover;
  border:2px solid var(--um-ice);flex-shrink:0;}
.um-person h5{font-family:Cairo,sans-serif;color:var(--um-navy);font-weight:800;margin:0 0 1px;font-size:15px;}
.um-person span{display:block;color:var(--um-gold-d);font-family:Cairo,sans-serif;font-weight:700;
  font-size:10.5px;letter-spacing:1.5px;text-transform:uppercase;margin-bottom:2px;}
.um-person a{color:var(--um-muted);font-size:12.5px;text-decoration:none;}
.um-person a:hover{color:var(--um-navy);}
.um-map{border-radius:14px;border:1px solid var(--um-line);}

/* v12: keep images responsive when width/height attributes are present */
.img-service img{max-width:100%;height:auto;}