.er-btn-9:hover {
                    background-color: var(--omega-black) !important;
                    border: 2px solid #fff !important;
                    color: #fff !important;
                }
            .er-btn-9 {
                background-color: var(--omega-blue) !important;
                color: var(--omega-black) !important;
                border: 2px solid var(--omega-blue) !important;
                padding: 0 37px !important;
                height: 60px !important;
                line-height: 60px !important;
                display: inline-block;
                transition: 0.3s;
            }
        .er-btn-9 {
            background-color: var(--omega-blue) !important;
            color: var(--omega-black) !important;
            border: 2px solid var(--omega-blue) !important;
        }
    .er-btn-8:hover {
        background-color: var(--omega-black) !important;
        border: 2px solid var(--omega-black) !important;
        color: #fff !important;
    }
/* ================================
   OMEGA CUSTOM THEME (BLACK/YELLOW)
   ================================ */

/* MAIN BRAND COLORS */
:root {
    --omega-blue: #538dd6;  /* brand accent blue */
    --omega-blue-dark: #3669a4;
    --omega-black: #141414;
    --omega-grey: #2b2b2b;
}

/* GLOBAL BODY BACKGROUND FIX */
.page-ongoing,
.page-recent,
body {
    background-color: var(--omega-black) !important;
    color: #f5f5f5 !important;
}

/* HEADERS / TITLES */
h1, h2, h3, h4, h5, h6 {
    color: #fff !important;
}

.er-contact-title {
    color: #000 !important;
}

.er-contact-info-text h3,
.er-contact-info-text h3 a,
.er-contact-info-text span {
    color: var(--omega-blue) !important;
}

/* BLUE SUBTITLES */
.er-section-subtitle {
    color: var(--omega-blue) !important;
}

/* MAIN BUTTONS */
.er-btn,
.er-btn-4 {
   
    color: var(--omega-black) !important;
}

/* Make search icon white */
.er-search img,
.er-search-toggle {
    filter: brightness(0) invert(1) !important;   /* turns black icons white */
}

.er-btn-5,
.er-btn-6 {

    background-color: var(--omega-blue) !important;
    color: var(--omega-black) !important;
}

.er-btn:hover,
.er-btn-4:hover {
    color: var(--omega-black) !important;
    
}

.er-btn-5:hover,
.er-btn-6:hover,
.er-btn-7:hover {
    color: #ffffffff !important;
    background-color: var(--omega-black) !important;
    
}
.er-btn-7{
    border: 2px solid black!important;
    background-color:black;
    color: #ffffff !important;
}

.er-btn-7:hover{
    border: 2px solid var(--omega-blue) !important;
    background-color: var(--omega-blue) !important;
    color: var(--omega-black) !important;
    
}


/* WHITE BUTTON OVERRIDE */
.btn-white {
    background-color: #fff !important;
    color: var(--omega-black) !important;
}

/* NAVBAR */
.er-header-area,
.er-offcanvas,
.er-main-menu ul li a {
    background-color: var(--omega-black) !important;
    color: #fff !important;
}

/* NAVBAR LINKS HOVER */
.er-main-menu ul li a:hover {
    color: var(--omega-blue) !important;
}

/* ACTIVE MENU LINK */
.er-main-menu ul li a.active {
    color: var(--omega-blue) !important;
}

/* HERO BACKGROUND */
.er-hero-area {
    background-color: var(--omega-black) !important;
}

/* SIDE SOCIAL ICONS – make them solid black, no hover */
.er-hero-social ul li a i {
    color: #000000 !important;      /* solid black */
    opacity: 1 !important;          /* fully visible */
}

/* Remove hover effects (color change, opacity, transform) */
.er-hero-social ul li a:hover i {
    color: #000000 !important;
    opacity: 1 !important;
    transform: none !important;
}

/* Remove hovering text color */
.er-hero-social-text {
    color: #000000 !important;
}

.er-search-close {
    filter: brightness(0) invert(1) !important;   /* turns black icons white */
}

/* --- FIX VIMEO SVG ICON (make it solid black, no hover dim) --- */

/* Target the inline SVG in the last social item */
.er-hero-social ul li a svg path {
    fill: #000000 !important;        /* solid black */
    fill-opacity: 1 !important;      /* remove grey tint */
    opacity: 1 !important;
}

/* Prevent hover effect from template */
.er-hero-social ul li a:hover svg path {
    fill: #000000 !important;
    fill-opacity: 1 !important;
    opacity: 1 !important;
}

/* SERVICE SECTION BACKGROUND */
.er-service-area {
    background-color: var(--omega-grey) !important;
}

/* SERVICE CARDS */
.er-service-h3 {
    background-color: var(--omega-black) !important;
    border: 1px solid var(--omega-blue);
}

.er-service-h3-title a {
    color: var(--omega-blue) !important;
}

.er-service-hover-text-2 h3,
.er-service-hover-text-2 h3 a {
    color: var(--omega-blue) !important;
}

.er-service-page:hover .btn-changecolor svg circle {
    fill: var(--omega-blue) !important;
}

/* Make project category links (e.g. "Construction") blue */
.er-project-hover-title-2 span a {
    color: var(--omega-blue) !important;
}



/* CTA SECTIONS */
.er-cta-area {
    background-color: var(--omega-black) !important;
}


.er-cta-text p,
.er-cta-para {
    color: #ffffff !important;
}

/* Apply only a yellow color overlay over the CTA image */
.er-cta-area.cta-img-2,
.er-cta-area[data-background*="cta-img-2"] {
    position: relative;
}

.er-cta-area.cta-img-2::after,
.er-cta-area[data-background*="cta-img-2"]::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--omega-blue);   /* requested accent */
    mix-blend-mode: multiply;  /* blends with the image */
    opacity: 10;             /* control brightness */
    pointer-events: none;
    z-index: 0;
}

/* CTA OVERLAY goes behind everything */
.er-cta-area::before {
    z-index: 0 !important;
}

/* CTA text + button above overlay */

.er-cta-title,
.er-cta-area h2 {
    position: relative;
    z-index: 2 !important;
    color: #ffffff !important;   /* make text white */
}

/* KEEP THE LINES IN NORMAL FLOW (do not raise their z-index) */
.er-cta-lines {
    position: relative;
    z-index: 1 !important;
}




/* FOOTER */
.er-footer-area {
    background-color: var(--omega-black) !important;
}


.er-footer-title,
.er-footer-text,
.er-footer-menu li a {
    color: #ffffff !important;
}

.er-footer-menu li a:hover {
    color: var(--omega-blue) !important;
}

/* =====================
   PAGE-SPECIFIC OVERRIDES
   ===================== */

/* Recent Projects page: keep project grid on white */
.page-recent .er-project-area {
    background-color: #ffffff !important;
}

/* Ongoing Projects page: keep project grid on white */
.page-ongoing .er-project-area {
    background-color: #ffffff !important;
}

/* Footer social icons -> pure black */
footer .fa-brands,
footer .fa-light,
footer .fa-solid {
    color: #ffffff !important;
}


/* SEARCH BAR */
.er-header-search-bar {
    background-color: var(--omega-black) !important;
}

.er-header-search-bar input {
    background-color: #1b1b1b !important;
    color: #fff !important;
}

/* OFFCANVAS OVERLAY */
.er-offcanvas-overlay {
    background-color: rgba(0,0,0,0.85) !important;
}


/* hide left menu icon on all screen sizes */
.er-header-area .er-menubar {
    display: none !important;
}


/* Clean rectangular subtitle (no rounded border) */
.er-about-area .er-section-subtitle {
   
    color: var(--omega-blue-dark) !important;
    font-weight: 600 !important;
    padding: 10px 22px !important;
    font-size: 20px !important;
    border: none !important;
    letter-spacing: 0.3px;
}

.er-team-area .er-section-subtitle {

     color: var(--omega-blue-dark) !important;
    font-weight: 600 !important;
    padding: 10px 22px !important;
    font-size: 20px !important;
    border: none !important;
    letter-spacing: 0.3px;
}
.er-team-area .er-section-title {
    color: #141414 !important;  /* dark black */
    font-size: 46px !important;      /* desktop size */
    line-height: 1.2 !important;
    font-weight: 700 !important;
}

.er-team-area .er-team-number-text{
    color: #141414 !important;
}


/* Fix about section title color on light background */
.er-about-area .er-section-title-2 {
    color: #141414 !important;  /* dark black */
}

.er-team-content h3 a{
    color: var(--omega-blue);
}
.er-about-area .er-section-title-2 span,
.er-about-area h2,
.er-about-area h2 span {
    color: #141414 !important;
}

/* Fix the dot bullet */
.er-about-area .er-about-number,
.er-about-area .er-about-smtext {
    color: #141414 !important;
}

/* Make Back-to-Top button background blue */
#back-to-top {
    background-color: var(--omega-blue) !important;
    border: none !important;
    color: #141414 !important;       /* arrow color (black) */
    box-shadow: 0 4px 10px rgba(0,0,0,0.25);
}

/* Hover effect */
#back-to-top:hover {
    background-color: var(--omega-blue-dark) !important;
    color: #000 !important;
}

/* Fix fact numbers visibility on light background (desktop only) */
@media (min-width: 992px) {
  .er-facts .er-fact-title,
  .er-facts-number-2,
  .er-facts-number-2 span {
      color: #141414 !important;   /* black on desktop */
  }
}

/* Make Services section background black */
.er-service-area {
    background-color: var(--omega-black) !important;
}

/* Ensure service cards contrast well */
.er-service-h3 {
    background-color: var(--omega-black) !important;
    border: 1px solid var(--omega-blue);
}

/* Service titles in blue */
.er-service-h3-title a {
    color: var(--omega-blue) !important;
}

/* Hover effect */
.er-service-h3:hover {
    background-color: #1d1d1d !important;
}

/* Bigger, more attractive "Our Services" heading */
.er-service-area .er-section-title {
    font-size: 46px !important;      /* desktop size */
    line-height: 1.2 !important;
    font-weight: 700 !important;
}

/* Slightly stronger subtitle "Our Services" */
.er-service-area .er-section-subtitle {
    font-size: 25px !important;
    text-transform: uppercase;
    letter-spacing: 0.12em;
}

/* Responsive: reduce size on small screens */
@media (max-width: 767px) {
    .er-service-area .er-section-title {
        font-size: 32px !important;
    }
}

/* Service card border -> white */
.er-service-h3 {
    border: none;
}

/* Service titles -> white */
.er-service-h3-title a {
    color: #ffffff !important;
    font-weight: 700 !important;
}


/* Arrow button circle -> blue */
.er-service-h3-btn svg circle {
    fill: var(--omega-blue) !important;
}

/* Arrow icon -> black */
.er-service-h3-btn svg path {
    stroke: #141414 !important;
}

.er-service-h3 {
    background-color: #161616 !important;
}


/* ===========================
   NAV LINKS – Rounded Yellow Border
   =========================== */

/* Default nav link style */
.er-main-menu ul li a {
    padding: 10px 18px !important;
    border: 2px solid transparent !important;
    border-radius: 30px !important;      /* round border */
    transition: 0.3s ease-in-out !important;
}

/* Hover effect — blue outline */
.er-main-menu ul li a:hover {
    border-color: var(--omega-blue) !important;
    color: var(--omega-blue) !important;
    background-color: transparent !important;
}

/* Active page (current page) */
.er-main-menu ul li a.active {
    border-color: var(--omega-blue) !important;
    color: var(--omega-blue) !important;
    background-color: rgba(255, 213, 0, 0.1) !important; /* optional light highlight */
}

/* FIX TOP BLUE HOVER BAR UNDER PROJECTS MENU */
.er-main-menu ul li > a::before {
    background-color: var(--omega-blue) !important;
}

/* also for hover state */
.er-main-menu ul li:hover > a::before {
    background-color: var(--omega-blue) !important;
}

/* REMOVE yellow border around dropdown links */
.er-main-menu .sub-menu ul li a,
.er-main-menu .sub-menu ul li a:hover,
.er-main-menu .sub-menu ul li a:focus,
.er-main-menu .sub-menu ul li:hover > a {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    background: transparent !important;
    border-radius: 0 !important;
}

/* Move Omega Engineering & Consultancy title upward */
.er-footer-year {
    margin-top: -85px !important;  /* adjust as needed */
}

.er-footer-copyright {
    color: #ffffff !important;
    margin-bottom: 20px;  /* space before next line */
    line-height: 1.6 !important;
}

.er-footer-developed {
    color: #ffffff !important;
    font-size: 18px;
    margin-top: 10px;
}

.er-footer-developed a {
    color: var(--omega-blue) !important;
    font-weight: 600 !important;
}

/* FORCE MOBILE MENU ICON (hamburger) TO WHITE */
.er-menubar-2 i.fa-bars,
.er-menubar-2 i.fa-light.fa-bars,
.er-menubar-2 i {
    color: #ffffff !important;
    filter: brightness(0) invert(1) !important; 
}

/* MOBILE NAV LINKS BLACK */
@media (max-width: 991px) {
    .er-offcanvas-menu nav ul li a {
        color: #000000 !important;   /* Pure black text */
    }

    .er-offcanvas-menu nav ul li a:hover {
        color: #000000 !important;   /* No hover color change */
        background: transparent !important;
    }

    /* Dropdown arrows in mobile menu */
    .er-offcanvas-menu .er-menu-close i {
        color: #000000 !important;
    }
@media (max-width: 991px) {
    .er-offcanvas-menu nav ul li a:hover {
        color: var(--omega-blue) !important;   /* pure accent */
    }

}
}

/* MOBILE: Make footer title black */
@media (max-width: 991px) {
    .er-offcanvas-title {
        color: #000000 !important;   /* pure black */
    }
}

/*------------------------OFFCANVAS SOCIAL ICONS – COLOR ONLY FIX (No layout change)--------------------------- */

/* Default = black icon */
.er-offcanvas-social a i {
    color: #000000 !important;
    transition: color 0.25s ease-in-out !important;
}

/* Hover: icon blue, keep layout the same */
.er-offcanvas-social a:hover i {
    color: var(--omega-blue) !important;   /* #538dd6 */
}

/* Optional: only change border color on hover, not width */
.er-offcanvas-social a:hover {
    border-color: var(--omega-blue) !important;
    background: transparent !important;      /* keep white bg as is */
}

/* Mobile facts – keep numbers white */
@media (max-width: 991.98px) {
  .er-facts-col .er-fact-title,
  .er-facts-col .er-fact-title span {
      color: #000000 !important;  /* black on mobile */
  }
}

.er-brand-logo {
  height: 40px;
  text-align: center;
}
.er-cta-rect {
    background-color: var(--omega-blue) !important;
}


    /* CTA at bottom */
    .er-cta-area { 
        background: var(--omega-black) !important; 
        color: var(--omega-white) !important; 
    }

    .er-cta-area .er-section-title { 
        color: var(--omega-white) !important; 
    }

    
    /* responsive tweaks */
    @media (max-width:767px) {
      .ongoing-thumb { height:140px; }
      .ongoing-title { font-size:1rem; }
    }

    /* keep pagination style harmonious */
    .er-pagination .page-link { 
        color: var(--omega-black); 
    }
    
    .er-pagination .page-link:hover { 
        color: var(--omega-blue); 
        border-color: transparent; 
        background: transparent; 
    }

   
 /* Ongoing project card */
    .ongoing-card {
      background: #fbfbfb;
      border: 1px solid #efefef;
      padding: 22px;
      border-radius: 6px;
      box-shadow: 0 6px 18px rgba(20,20,20,0.03);
      height: 100%;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
    }
    .ongoing-thumb { width:100%; height:160px; overflow:hidden; border-radius:4px; margin-bottom:14px; }
    .ongoing-thumb img { width:100%; height:100%; object-fit:cover; display:block; }
    .ongoing-meta { font-size:0.95rem; color:var(--omega-blue); font-weight:600; }
    .ongoing-title { font-size:1.12rem; color:var(--omega-black); margin:6px 0 12px; font-weight:700; }

    /* progress bar */
    .progress-wrap { margin-top:8px; }
    .progress { height:12px; background:#e9eef8; border-radius:10px; overflow:hidden; }
    .progress .progress-bar { background: linear-gradient(90deg, var(--omega-blue), #2f6fb2); height:100%; }

    .progress-text { display:flex; justify-content:space-between; align-items:center; margin-top:8px; font-size:0.9rem; color:#666; }

    /* CTA at bottom */
    .er-cta-area { background: var(--omega-black) !important; color: var(--omega-white) !important; }
    .er-cta-area .er-section-title { color: var(--omega-white) !important; }

    /* Footer */
    .er-footer-area { background: var(--omega-black) !important; color: var(--omega-white) !important; }
    .er-footer-area a { color: var(--omega-white) !important; }

    /* responsive tweaks */
    @media (max-width:767px) {
      .ongoing-thumb { height:140px; }
      .ongoing-title { font-size:1rem; }
    }

    /* keep pagination style harmonious */
    .er-pagination .page-link { color: var(--omega-black); }
    .er-pagination .page-link:hover { color: var(--omega-blue); border-color: transparent; background: transparent; }


    .er-btn-8{
        background-color: var(--omega-blue) !important;
        color: var(--omega-black) !important;
        border: #538dd6 2px solid !important;
    }