/* ============================================================
   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; }

/* ============================================================
   Schedule-a-call modal (modern) + Calendly option
   ============================================================ */
.formmodels .modal-content { border: none; border-radius: 20px; overflow: hidden; box-shadow: 0 30px 70px rgba(10, 26, 51, .3); }
.formmodels .modal-header { background: linear-gradient(135deg, var(--nf-navy), var(--nf-blue)); border: none; padding: 20px 24px; }
.formmodels .modal-header .modal-title { color: #fff !important; font-weight: 800; font-size: 20px; }
.formmodels .modal-header .btn-close { filter: brightness(0) invert(1); opacity: .9; }
.formmodels .modal-body { padding: 24px; }
.scb-cal { text-align: center; }
.scb-cal__lead { color: var(--nf-muted); font-size: 14.5px; margin: 0 0 14px; }
.scb-cal__btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; width: 100%; background: linear-gradient(135deg, var(--nf-blue), var(--nf-cyan)); color: #fff !important; font-weight: 700; font-size: 16px; padding: 14px; border-radius: 12px; box-shadow: 0 12px 26px rgba(29, 108, 255, .3); transition: transform .15s ease; }
.scb-cal__btn:hover { transform: translateY(-2px); color: #fff !important; }
.scb-or { position: relative; text-align: center; margin: 20px 0 8px; }
.scb-or::before { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 1px; background: var(--nf-line); }
.scb-or span { position: relative; background: #fff; padding: 0 14px; color: var(--nf-muted); font-size: 13px; font-weight: 600; }
.formmodels .call-back-form .form-control { border: 1.5px solid var(--nf-line); border-radius: 11px; padding: 12px 14px; font-size: 15px; font-family: inherit; }
.formmodels .call-back-form .form-control:focus { border-color: var(--nf-cyan); box-shadow: 0 0 0 4px rgba(6, 182, 212, .14); outline: none; }
.formmodels .call-back-form .form-grp { margin-bottom: 12px; }
.formmodels .call-back-form textarea.form-control { min-height: 96px; resize: vertical; }
.formmodels .call-back-form .iti { width: 100%; }
.formmodels .call-back-form .btn { width: 100%; background: #f97316; color: #fff; border: none; border-radius: 12px; padding: 13px; font-weight: 800; font-size: 16px; box-shadow: 0 12px 26px rgba(249, 115, 22, .3); transition: background .15s ease; }
.formmodels .call-back-form .btn:hover { background: #ea6a0c; }
