/* ============================================================
   CRM DEBUGZONE — Header nav + Footer re-skin (site-wide)
   Modern, professional IT-firm look. Loads after main.css so it
   overrides the theme. Only targets header/footer classes.
   ============================================================ */
:root {
    --nf-navy: #0a2540; --nf-blue: #1d6cff; --nf-blue-2: #1558d6;
    --nf-cyan: #06b6d4; --nf-cyan-2: #22d3ee; --nf-line: #e5edf7; --nf-muted: #b9cbe0;
}

/* =====================  HEADER NAV  ===================== */
.tg-header__area, #sticky-header { background: #fff; }
#sticky-header { box-shadow: 0 4px 20px rgba(17, 66, 126, .06); transition: box-shadow .25s ease, top .3s ease; }
#sticky-header.sticky-menu { box-shadow: 0 8px 28px rgba(17, 66, 126, .12); }

.tg-header__area .tgmenu__wrap { padding-top: 6px; padding-bottom: 6px; }

/* top-level links */
.tg-header__area .tgmenu__main-menu .navigation > li > a {
    color: var(--nf-navy) !important;
    font-weight: 600;
    font-size: 16px;
    position: relative;
    transition: color .2s ease;
}
.tg-header__area .tgmenu__main-menu .navigation > li:hover > a,
.tg-header__area .tgmenu__main-menu .navigation > li.active > a {
    color: var(--nf-blue) !important;
}
/* animated underline indicator */
.tg-header__area .tgmenu__main-menu .navigation > li > a::before {
    content: ""; position: absolute; left: 0; right: 0; bottom: 8px; margin: 0 auto;
    width: 0; height: 2px; border-radius: 2px;
    background: linear-gradient(90deg, var(--nf-blue), var(--nf-cyan));
    transition: width .22s ease;
}
.tg-header__area .tgmenu__main-menu .navigation > li:hover > a::before,
.tg-header__area .tgmenu__main-menu .navigation > li.active > a::before { width: 62%; }

/* dropdown (Services) */
.tg-header__area .navigation li .sub-menu {
    border: 1px solid var(--nf-line) !important;
    border-radius: 14px !important;
    box-shadow: 0 20px 48px rgba(17, 66, 126, .16) !important;
    padding: 8px !important; min-width: 240px;
    overflow: hidden;
}
.tg-header__area .navigation li .sub-menu li a {
    border-radius: 9px !important;
    padding: 10px 14px !important;
    color: var(--nf-navy) !important;
    font-weight: 600; font-size: 14.5px;
    transition: background .15s ease, color .15s ease, padding-left .15s ease;
}
.tg-header__area .navigation li .sub-menu li a:hover {
    background: rgba(29, 108, 255, .08) !important;
    color: var(--nf-blue) !important;
    padding-left: 18px !important;
}

/* "Get Free Estimation" CTA button */
.tg-header__area .tgmenu__action .btn,
.tg-header__area .header-btn .btn {
    background: linear-gradient(135deg, var(--nf-blue), var(--nf-cyan)) !important;
    border: none !important; color: #fff !important;
    border-radius: 999px !important;
    font-weight: 700 !important;
    padding: 12px 26px !important;
    box-shadow: 0 10px 24px rgba(29, 108, 255, .30);
    transition: transform .15s ease, box-shadow .18s ease, filter .15s ease;
}
.tg-header__area .tgmenu__action .btn:hover,
.tg-header__area .header-btn .btn:hover {
    color: #fff !important; transform: translateY(-2px);
    box-shadow: 0 14px 32px rgba(29, 108, 255, .42); filter: brightness(1.03);
}
/* remove the theme's decorative offset layer behind the button (the overlap) */
.tg-header__area .tgmenu__action .btn::before,
.tg-header__area .tgmenu__action .btn::after,
.tg-header__area .header-btn .btn::before,
.tg-header__area .header-btn .btn::after { content: none !important; display: none !important; background: none !important; }
.tg-header__area .tgmenu__action .btn,
.tg-header__area .header-btn .btn { position: relative; overflow: hidden; z-index: 1; background-image: linear-gradient(135deg, var(--nf-blue), var(--nf-cyan)) !important; }
.tg-header__area .tgmenu__action .list-wrap { overflow: visible; }

/* mobile menu tidy-ups (menu is cloned from the desktop nav) */
.tgmobile__menu .navigation > li > a { color: var(--nf-navy) !important; font-weight: 600; }
.tgmobile__menu .navigation > li > a::before { display: none !important; }
.tgmobile__menu .navigation li.active > a,
.tgmobile__menu .navigation > li > a:hover { color: var(--nf-blue) !important; }
.tgmobile__menu .navigation .sub-menu li a:hover { color: var(--nf-blue) !important; }
.tgmobile__menu-box .nav-logo img { max-height: 42px; }

/* =====================  FOOTER  ===================== */
footer .footer-area {
    background: linear-gradient(150deg, var(--nf-navy) 0%, #0d2c4d 55%, #113a67 100%) !important;
    position: relative; overflow: hidden;
}
footer .footer-shape { display: none !important; }
footer .footer-top { padding: 72px 0 40px; position: relative; z-index: 2; }

/* logo (dark asset rendered white on the dark footer) */
footer .footer-widget .fw-logo img { filter: brightness(0) invert(1); max-height: 46px; width: auto; }

footer .footer-widget .footer-content p { color: var(--nf-muted); font-size: 15px; line-height: 1.7; }

footer .footer-widget .fw-title {
    color: #fff !important; font-size: 18px; font-weight: 800; margin-bottom: 22px;
    position: relative; padding-bottom: 12px;
}
footer .footer-widget .fw-title::after {
    content: ""; position: absolute; left: 0; bottom: 0; width: 38px; height: 3px; border-radius: 3px;
    background: linear-gradient(90deg, var(--nf-blue), var(--nf-cyan));
}

/* link lists */
footer .footer-link-list .list-wrap li { margin-bottom: 11px; }
footer .footer-link-list .list-wrap li a {
    color: var(--nf-muted) !important; font-size: 15px; font-weight: 500;
    display: inline-flex; align-items: center; gap: 8px;
    transition: color .15s ease, padding-left .15s ease;
}
footer .footer-link-list .list-wrap li a::before {
    content: "\f105"; font-family: "Font Awesome 5 Free"; font-weight: 900; font-size: 12px;
    color: var(--nf-cyan-2); opacity: 0; transform: translateX(-6px); transition: all .15s ease;
}
footer .footer-link-list .list-wrap li a:hover { color: #fff !important; padding-left: 4px; }
footer .footer-link-list .list-wrap li a:hover::before { opacity: 1; transform: translateX(0); }
footer .footer-link-list .list-wrap li a i.flaticon-arrow-button { display: none; }

/* info list */
footer .footer-info-list .list-wrap li { display: flex; align-items: flex-start; gap: 14px; margin-bottom: 16px; }
footer .footer-info-list .list-wrap li .icon {
    width: 42px; height: 42px; flex: 0 0 42px; border-radius: 11px; display: grid; place-items: center;
    background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .12); color: var(--nf-cyan-2); font-size: 16px;
}
footer .footer-info-list .list-wrap li .content a,
footer .footer-info-list .list-wrap li .content p { color: var(--nf-muted) !important; font-size: 15px; margin: 6px 0 0; }
footer .footer-info-list .list-wrap li .content a:hover { color: #fff !important; }

/* social */
footer .footer-social .list-wrap { display: flex; gap: 10px; margin-top: 18px; }
footer .footer-social .list-wrap li a {
    width: 40px; height: 40px; border-radius: 11px; display: grid; place-items: center;
    background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .14); color: #fff !important;
    transition: all .18s ease;
}
footer .footer-social .list-wrap li a:hover {
    background: linear-gradient(135deg, var(--nf-blue), var(--nf-cyan)); border-color: transparent; transform: translateY(-3px);
}

/* bottom bar */
footer .footer-bottom { border-top: 1px solid rgba(255, 255, 255, .10); padding: 20px 0; position: relative; z-index: 2; }
footer .footer-bottom .copyright-text p,
footer .footer-bottom .copyright-text { color: var(--nf-muted); font-size: 14px; margin: 0; }
footer .footer-bottom .copyright-text a { color: #fff; font-weight: 700; }
footer .footer-bottom .copyright-text a:hover { color: var(--nf-cyan-2); }
footer .footer-bottom .qualityassurance { text-align: right; display: flex; gap: 20px; justify-content: flex-end; }
footer .footer-bottom .qualityassurance a { color: var(--nf-muted); font-size: 14px; font-weight: 500; }
footer .footer-bottom .qualityassurance a:hover { color: var(--nf-cyan-2); }

@media (max-width: 767px) {
    footer .footer-top { padding: 52px 0 26px; }
    footer .footer-bottom .qualityassurance { justify-content: flex-start; text-align: left; margin-top: 10px; flex-wrap: wrap; gap: 14px; }
}

/* ---- keep header on ONE row: logo | menu | CTA (never wrap the button under the logo) ---- */
.tg-header__area .tgmenu__nav {
    display: flex !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    justify-content: space-between;
}
.tg-header__area .tgmenu__nav .logo { flex: 0 0 auto; }
.tg-header__area .tgmenu__nav .tgmenu__main-menu { flex: 0 1 auto; justify-content: center; }
.tg-header__area .tgmenu__nav .tgmenu__action { flex: 0 0 auto; margin-left: 28px; }
.tg-header__area .tgmenu__nav .mobile-nav-toggler { flex: 0 0 auto; }
.tg-header__area .navigation { flex-wrap: nowrap; }
/* tighten item spacing so all links fit one line */
.tg-header__area .navigation > li { margin: 0 !important; }
.tg-header__area .navigation > li > a { padding: 18px 12px !important; font-size: 15px; white-space: nowrap; }
.tg-header__area .tgmenu__action .list-wrap { margin: 0; }

/* ============================================================
   Service mega-menu (categories + services on hover)
   ============================================================ */
.tg-header__area .navigation li .sub-menu.svc-mega {
    min-width: 720px !important; left: 50%; transform: translateX(-50%); padding: 22px !important;
}
.svc-mega__wrap { padding: 0 !important; }
.svc-mega__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.svc-mega__col { min-width: 0; }
.svc-mega__cat { display: flex !important; align-items: center; gap: 11px; padding: 8px !important; border-radius: 10px; margin-bottom: 8px; border-bottom: 1px solid var(--nf-line); }
.svc-mega__cat:hover { background: rgba(29, 108, 255, .06) !important; padding-left: 8px !important; }
.svc-mega__cat .ic { width: 38px; height: 38px; flex: 0 0 38px; border-radius: 10px; display: grid; place-items: center; color: #fff; font-size: 16px; background: linear-gradient(135deg, var(--nf-blue), var(--nf-cyan)); }
.svc-mega__col:nth-child(2) .svc-mega__cat .ic { background: linear-gradient(135deg, var(--nf-blue), var(--nf-cyan)); }
.svc-mega__col:nth-child(3) .svc-mega__cat .ic { background: linear-gradient(135deg, #7c3aed, var(--nf-blue)); }
.svc-mega__cat .t { display: block; font-weight: 800; color: var(--nf-navy); font-size: 14.5px; line-height: 1.2; }
.svc-mega__cat .d { display: block; font-size: 11px; color: #9aa7ba; font-weight: 700; letter-spacing: .5px; text-transform: uppercase; margin-top: 2px; }
.svc-mega__list { list-style: none; margin: 0; padding: 0; }
.svc-mega__list li { margin: 0; }
.svc-mega__list li a { display: flex !important; align-items: center; gap: 9px; padding: 8px 10px !important; border-radius: 8px !important; color: var(--nf-navy) !important; font-weight: 600 !important; font-size: 13.5px !important; }
.svc-mega__list li a > i { color: var(--nf-blue); width: 16px; text-align: center; font-size: 12px; }
.svc-mega__list li a:hover { background: rgba(29, 108, 255, .08) !important; color: var(--nf-blue) !important; padding-left: 14px !important; }

/* mobile: mega collapses to a single readable column inside the accordion */
@media (max-width: 1199px) {
    .svc-mega__grid { grid-template-columns: 1fr; gap: 8px; }
    .tg-header__area .navigation li .sub-menu.svc-mega { min-width: 0 !important; left: 0; transform: none; }
}
.tgmobile__menu .svc-mega__grid { display: block; }
.tgmobile__menu .svc-mega__cat { border-bottom: 1px solid var(--nf-line); }
.tgmobile__menu .svc-mega__cat .t { color: var(--nf-navy); }
.tgmobile__menu .svc-mega__list li a { color: var(--nf-navy) !important; }
