/* ============================================
   CUSTOM STYLES - CNC Associates
   File: custom-cnc.css
   Last Updated: 2026-05-26 v1.0.7
   ============================================ */

/* ===============================================
   CNC FOOTER STYLES
   =============================================== */

.cnc-site-footer footer {
    background-color: #1a2b3c;
    color: #cdd8e3;
    font-size: 14px;
    line-height: 1.7;
}

/* -----------------------------------------------
   MAIN FOOTER GRID — 4 columns
----------------------------------------------- */
.cnc-footer-main {
    padding: 60px 0 40px;
    border-bottom: 1px solid rgba(255,255,255,0.08);
}

.cnc-footer-grid {
    display: grid;
    grid-template-columns: 1.4fr 1.2fr 1.3fr 1fr;
    gap: 40px;
}

/* -----------------------------------------------
   FOOTER LOGO & DESCRIPTION
----------------------------------------------- */
.cnc-footer-logo {
    margin-bottom: 16px;
}

.cnc-footer-logo img {
    height: 65px;
    width: auto;
    filter: brightness(0) invert(1);
    opacity: 0.9;
}

.cnc-footer-desc {
    font-size: 13.5px;
    color: #9db0c0;
    margin-bottom: 20px;
    line-height: 1.7;
}

.cnc-footer-contact-info p {
    margin: 5px 0;
    font-size: 13px;
    color: #b0c4d4;
}

.cnc-footer-contact-info a {
    color: #b0c4d4 !important;
    text-decoration: none !important;
    transition: color 0.2s;
}

.cnc-footer-contact-info a:hover {
    color: #ffffff !important;
}

.cnc-footer-icon {
    margin-right: 6px;
    color: #345578;
    font-size: 14px;
}

/* -----------------------------------------------
   FOOTER HEADINGS
----------------------------------------------- */
.cnc-footer-heading {
    font-size: 13px !important;
    font-weight: 700 !important;
    letter-spacing: 1.5px !important;
    text-transform: uppercase !important;
    color: #ffffff !important;
    margin-bottom: 18px !important;
    padding-bottom: 10px !important;
    border-bottom: 2px solid #345578 !important;
    font-family: inherit !important;
}

/* -----------------------------------------------
   FOOTER LINKS LIST
----------------------------------------------- */
.cnc-footer-links {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.cnc-footer-links li {
    margin-bottom: 8px !important;
    padding-left: 0 !important;
}

.cnc-footer-links li::before {
    display: none !important;
}

.cnc-footer-links a {
    color: #9db0c0 !important;
    text-decoration: none !important;
    font-size: 13.5px !important;
    transition: color 0.2s ease, padding-left 0.2s ease !important;
    display: inline-block;
}

.cnc-footer-links a:hover {
    color: #ffffff !important;
    padding-left: 6px !important;
}

/* -----------------------------------------------
   OFFICES
----------------------------------------------- */
.cnc-office {
    margin-bottom: 14px;
}

.cnc-office strong {
    display: block;
    color: #ffffff;
    font-size: 12.5px;
    font-weight: 600;
    letter-spacing: 0.5px;
    margin-bottom: 3px;
}

.cnc-office p {
    margin: 0 !important;
    font-size: 12.5px;
    color: #8fa5b8;
    line-height: 1.6;
}

.cnc-associate-offices p {
    color: #9db0c0;
}

/* -----------------------------------------------
   DISCLAIMER BAR
----------------------------------------------- */
.cnc-footer-disclaimer {
    background-color: #111e2b;
    padding: 20px 0;
    border-top: 1px solid rgba(255,255,255,0.06);
}

.cnc-footer-disclaimer p {
    font-size: 11.5px !important;
    color: #ffffff !important;
    line-height: 1.7 !important;
    margin: 0 !important;
    text-align: justify;
}

.cnc-disclaimer-label {
    font-weight: 700 !important;
    font-size: 11.5px !important;
    color: #ffffff !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    margin-right: 6px !important;
}

/* -----------------------------------------------
   COPYRIGHT BAR
----------------------------------------------- */
.cnc-footer-copyright {
    background-color: #0f1a24;
    padding: 14px 0;
}

.cnc-copyright-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

.cnc-copyright-inner > span:first-child {
    font-size: 12.5px;
    color: #566d80;
}

.cnc-footer-nav {
    display: flex;
    gap: 20px;
}

.cnc-footer-nav a {
    font-size: 12px !important;
    color: #566d80 !important;
    text-decoration: none !important;
    transition: color 0.2s;
}

.cnc-footer-nav a:hover {
    color: #ffffff !important;
}

/* -----------------------------------------------
   HIDE OLD THEME FOOTER ELEMENTS
----------------------------------------------- */
.btSiteFooterWidgets,
.btSiteFooterCopyMenu {
    display: none !important;
}

/* -----------------------------------------------
   HOME PAGE: Hide Contact Us + Our Associates
   sections (replaced by footer)
----------------------------------------------- */
#bt_bb_section6a15e63267e21,
#bt_bb_section6a15e63268192 {
    display: none !important;
}

/* -----------------------------------------------
   FOOTER RESPONSIVE
----------------------------------------------- */
@media (max-width: 1024px) {
    .cnc-footer-grid {
        grid-template-columns: 1fr 1fr;
        gap: 32px;
    }
}

@media (max-width: 768px) {
    .cnc-footer-main {
        padding: 40px 0 30px;
    }
    .cnc-footer-grid {
        grid-template-columns: 1fr;
        gap: 28px;
    }
    .cnc-footer-logo img {
        height: 50px;
    }
    .cnc-copyright-inner {
        flex-direction: column;
        text-align: center;
    }
    .cnc-footer-nav {
        justify-content: center;
        flex-wrap: wrap;
        gap: 12px;
    }
    .cnc-footer-disclaimer p {
        text-align: left;
    }
}

/* -----------------------------------------------
   TOP BAR: Consistent navy background
----------------------------------------------- */
.mainHeader .topBar,
.mainHeaderInner .topBar,
div.topBar,
.topBar.bt-clear,
.btPageWrap .topBar,
.topBarPort,
.topBarPort.port,
div.topBarPort {
    background-color: #345578 !important;
}

/* -----------------------------------------------
   TOP BAR: All text & icons white
----------------------------------------------- */
.topBar *,
.topBarPort *,
.topTools *,
.btTopToolsLeft *,
.btTopToolsRight * {
    color: #ffffff !important;
}

/* -----------------------------------------------
   TOP BAR: SVG / icon elements white
----------------------------------------------- */
.topBar svg,
.topBar i,
.topBar .fa,
.topBar [class*="icon"],
.topBarPort i,
.topBarPort svg {
    color: #ffffff !important;
    fill: #ffffff !important;
}

/* -----------------------------------------------
   TOP BAR: Hover state for links
----------------------------------------------- */
.topBar a:hover,
.topTools a:hover,
.btTopToolsLeft a:hover,
.btTopToolsRight a:hover {
    color: #ccddee !important;
    text-decoration: none !important;
    opacity: 0.9;
}

/* -----------------------------------------------
   MAIN HEADER & NAV: Keep white background
----------------------------------------------- */
.mainHeader,
.mainHeaderInner,
.btLogoArea {
    background-color: #ffffff !important;
}

/* -----------------------------------------------
   LOGO: Consistent size across all pages
   Targets both desktop (.btLogoArea img) and
   mobile/general (.logo img) containers
----------------------------------------------- */
.btLogoArea img,
.mainHeader .logo img,
.mainHeaderInner .logo img,
header .logo img {
    height: 90px !important;
    width: auto !important;
    max-height: 90px !important;
}

/* Give logo container vertical breathing room so
   the CC arcs don't clip against the top bar */
.menuHolder,
.mainHeader .logo,
.mainHeaderInner .logo,
header .logo {
    padding-top: 8px !important;
    padding-bottom: 8px !important;
    box-sizing: border-box !important;
}

/* -----------------------------------------------
   SIMPLE BREADCRUMB — replaces big page banner
----------------------------------------------- */
.cnc-breadcrumb-wrap {
    background-color: #f4f4f4;
    border-bottom: 1px solid #e2e2e2;
    padding: 10px 0;
    width: 100%;
}

.cnc-breadcrumb-inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.cnc-breadcrumb {
    font-size: 13px;
    font-family: inherit;
    color: #666;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 2px;
}

.cnc-breadcrumb a {
    color: #345578 !important;
    text-decoration: none !important;
    transition: color 0.2s ease;
}

.cnc-breadcrumb a:hover {
    color: #1a3a5c !important;
    text-decoration: underline !important;
}

.cnc-sep {
    color: #aaa;
    margin: 0 6px;
    font-size: 15px;
    line-height: 1;
}

.cnc-current {
    color: #444;
    font-weight: 500;
}

/* ===============================================
   MOBILE RESPONSIVENESS FIXES
   Tested on: iPhone 14 (390px), Galaxy S21 (360px),
              Small (320px), iPad (768px)
   =============================================== */

/* -----------------------------------------------
   GLOBAL: Prevent horizontal overflow on all screens
----------------------------------------------- */
body,
.btPageWrap,
.btContentWrap,
.btContentHolder,
.btContent {
    overflow-x: hidden !important;
    max-width: 100% !important;
}

/* -----------------------------------------------
   MOBILE: Up to 768px (phones + small tablets)
----------------------------------------------- */
@media (max-width: 768px) {

    /* Prevent horizontal scroll globally */
    .bt_bb_section,
    .bt_bb_row,
    .bt_bb_column,
    .bt_bb_column_content,
    .bt_bb_content_slider_item_content {
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    /* ---- HERO SLIDER: Fix extrahuge font size ---- */
    /* The hero uses bt_bb_size_extrahuge — too large for mobile */
    .bt_bb_headline.bt_bb_size_extrahuge *,
    .bt_bb_size_extrahuge .bt_bb_headline_content,
    .bt_bb_size_extrahuge .bt_bb_headline_supertitle,
    .bt_bb_size_extrahuge .bt_bb_headline_content h1,
    .bt_bb_size_extrahuge .bt_bb_headline_content h2,
    .bt_bb_size_extrahuge .bt_bb_headline_content h3 {
        font-size: clamp(1.4rem, 6.5vw, 2rem) !important;
        line-height: 1.3 !important;
        word-break: break-word !important;
        overflow-wrap: break-word !important;
        letter-spacing: 0.02em !important;
    }

    /* ---- HERO SLIDER: Fix excessive height on mobile ---- */
    .bt_bb_content_slider_item {
        height: auto !important;
        min-height: 380px !important;
        max-height: 520px !important;
    }
    .bt_bb_content_slider_item_content {
        padding-top: 40px !important;
        padding-bottom: 40px !important;
    }

    /* ---- ALL headlines: general mobile scaling ---- */
    .bt_bb_headline h1,
    .bt_bb_headline h2,
    .bt_bb_headline_content h1,
    .bt_bb_headline_content h2 {
        word-break: break-word !important;
        overflow-wrap: break-word !important;
    }

    /* Fix decorative border box on hero */
    .bt_bb_border_decoration,
    [class*="border_decoration"] {
        display: none !important;
    }

    /* Logo — smaller on mobile */
    .btLogoArea img,
    .mainHeader .logo img,
    .mainHeaderInner .logo img,
    header .logo img {
        height: 60px !important;
        max-height: 60px !important;
    }

    /* Breadcrumb padding on mobile */
    .cnc-breadcrumb-wrap { padding: 8px 0; }
    .cnc-breadcrumb-inner { padding: 0 16px; }
    .cnc-breadcrumb { font-size: 12px; }
}

/* -----------------------------------------------
   SMALL MOBILE: Up to 400px (320px–390px phones)
----------------------------------------------- */
@media (max-width: 400px) {

    /* Even smaller extrahuge headline on tiny screens */
    .bt_bb_headline.bt_bb_size_extrahuge *,
    .bt_bb_size_extrahuge .bt_bb_headline_content h1,
    .bt_bb_size_extrahuge .bt_bb_headline_content h2 {
        font-size: clamp(1.2rem, 7.5vw, 1.6rem) !important;
        letter-spacing: 0 !important;
    }

    /* Slider height on tiny screens */
    .bt_bb_content_slider_item {
        min-height: 320px !important;
    }

    /* Logo even smaller on 320px */
    .btLogoArea img,
    .mainHeader .logo img,
    .mainHeaderInner .logo img,
    header .logo img {
        height: 50px !important;
        max-height: 50px !important;
    }
}

/* -----------------------------------------------
   TABLET: 768px–1024px
----------------------------------------------- */
@media (min-width: 769px) and (max-width: 1024px) {

    /* Medium logo size for tablet */
    .btLogoArea img,
    .mainHeader .logo img,
    .mainHeaderInner .logo img,
    header .logo img {
        height: 75px !important;
        max-height: 75px !important;
    }

    /* Scale down extrahuge on tablet too */
    .bt_bb_size_extrahuge .bt_bb_headline_content h1,
    .bt_bb_size_extrahuge .bt_bb_headline_content h2 {
        font-size: clamp(2rem, 4.5vw, 3rem) !important;
    }
}
