/* ============================================================
 *  quitegood-custom.css
 *  Custom styling for the rebuilt header, footer and the
 *  image-free breadcrumb. Loaded after the theme CSS.
 *  Colours match the site theme:
 *    primary  #497373  (teal-green)
 *    dark     #131944  (deep navy)
 *    darker   #0C1239  (menu navy)
 * ============================================================ */

:root{
    --qg-brand:#497373;
    --qg-brand-soft:#84b3b3;
    --qg-dark:#131944;
    --qg-darker:#0C1239;
}

/* Hide the floating Google reCAPTCHA badge.
   The required reCAPTCHA notice is shown under every form instead. */
.grecaptcha-badge{visibility:hidden!important;}

/* ---------------------------------------------------------------
 *  HEADER  (top bar + main menu as one overlay)
 * --------------------------------------------------------------- */
.qg-header{
    position:absolute;
    top:0; left:0;
    width:100%;
    z-index:99;
}
.qg-header .menu-area:not(.sticky-menu){
    position:static;
    background:transparent;
}

/* Make the navigation text readable over the dark banner / sticky bar */
.qg-header .navbar-wrap .navigation > li > a{
    color:#ffffff;
}
.qg-header .navbar-wrap .navigation > li.active > a,
.qg-header .navbar-wrap .navigation > li:hover > a{
    color:var(--qg-brand-soft);
}

/* --- Top bar --- */
.qg-topbar{
    background:var(--qg-darker);
    color:#cdd3e6;
    font-size:14px;
    border-bottom:1px solid rgba(255,255,255,.08);
}
.qg-topbar .container{
    display:flex;
    align-items:center;
    justify-content:space-between;
    flex-wrap:wrap;
    min-height:44px;
    padding-top:4px;
    padding-bottom:4px;
}
.qg-topbar-left{display:flex;flex-wrap:wrap;gap:22px;}
.qg-topbar-left a,
.qg-topbar-left span{
    color:#cdd3e6;
    text-decoration:none;
    display:inline-flex;
    align-items:center;
    gap:8px;
}
.qg-topbar-left a:hover{color:#fff;}
.qg-topbar-left i{color:var(--qg-brand-soft);}
.qg-topbar-right{display:flex;align-items:center;gap:18px;}
.qg-topbar-tag{color:#9aa3c0;font-size:13px;}
.qg-topbar-social{display:flex;gap:8px;}
.qg-topbar-social a{
    width:28px;height:28px;border-radius:50%;
    display:flex;align-items:center;justify-content:center;
    background:rgba(255,255,255,.08);
    color:#cdd3e6;font-size:13px;transition:.25s;
}
.qg-topbar-social a:hover{background:var(--qg-brand);color:#fff;}

@media (max-width:991px){
    .qg-topbar{display:none;}
}

/* --- Sticky state (theme adds .sticky-menu) --- */
.qg-header .menu-area.sticky-menu{
    background:var(--qg-darker);
    box-shadow:0 6px 24px rgba(0,0,0,.18);
}

/* --- Header phone block --- */
.header-action .list-wrap{display:flex;align-items:center;gap:22px;margin:0;padding:0;list-style:none;}
.header-phone{display:flex;align-items:center;gap:10px;color:#fff;}
.header-phone i{
    font-size:22px;color:var(--qg-brand-soft);
    background:rgba(255,255,255,.1);
    width:42px;height:42px;border-radius:50%;
    display:flex;align-items:center;justify-content:center;
}
.header-phone span{display:flex;flex-direction:column;line-height:1.3;}
.header-phone small{font-size:12px;color:#aeb6cf;}
.header-phone a{color:#fff;font-weight:600;font-size:15px;text-decoration:none;}
.header-phone a:hover{color:var(--qg-brand-soft);}

/* --- Mobile menu contact block (the mobile menu panel is white) --- */
.mobile-contact-info{padding:18px 0;border-top:1px solid #ececec;margin-top:12px;}
.mobile-contact-info ul{list-style:none;padding:0;margin:0;}
.mobile-contact-info li{
    display:flex;gap:10px;align-items:flex-start;
    color:#444;font-size:14px;margin-bottom:12px;
}
.mobile-contact-info li i{color:var(--qg-brand);margin-top:3px;}
.mobile-contact-info a{color:#444;text-decoration:none;}
.mobile-contact-info a:hover{color:var(--qg-brand);}

/* ---------------------------------------------------------------
 *  BREADCRUMB  (no image — subtle dark gradient)
 * --------------------------------------------------------------- */
.qg-breadcrumb{
    background:linear-gradient(120deg,#0C1239 0%,#131944 100%);
    position:relative;
    padding:190px 0 70px;
    overflow:hidden;
}
.qg-breadcrumb::after{
    content:"";
    position:absolute;right:-80px;top:-80px;
    width:340px;height:340px;border-radius:50%;
    background:radial-gradient(circle,rgba(73,115,115,.30),transparent 70%);
}
.qg-breadcrumb .container{position:relative;z-index:2;}
.qg-breadcrumb-title{
    color:#fff;
    font-size:40px;
    font-weight:700;
    margin:0 0 12px;
}
.qg-breadcrumb-nav{
    list-style:none;
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    padding:0;margin:0;
    font-size:15px;
}
.qg-breadcrumb-nav li{color:#aeb4cc;}
.qg-breadcrumb-nav li+li::before{
    content:"\f105";
    font-family:"Font Awesome 5 Free","Font Awesome 6 Free";
    font-weight:900;
    margin-right:10px;
    color:#6b7090;
}
.qg-breadcrumb-nav a{color:#aeb4cc;text-decoration:none;}
.qg-breadcrumb-nav a:hover{color:var(--qg-brand-soft);}
.qg-breadcrumb-nav li[aria-current]{color:#fff;}

@media (max-width:767px){
    .qg-breadcrumb{padding:150px 0 50px;}
    .qg-breadcrumb-title{font-size:28px;}
}

/* ---------------------------------------------------------------
 *  FOOTER polish
 * --------------------------------------------------------------- */
.qg-footer-credit a{
    color:#fff;
    text-decoration:none;
    font-weight:600;
}
.qg-footer-credit a:hover{color:var(--qg-brand-soft);}

/* Spec tables inside product descriptions */
.services-process-wrap table{width:100%;margin:18px 0;}
.services-process-wrap table th{
    background:#f4f6f9;
    width:230px;
    vertical-align:top;
}
.services-process-wrap table th,
.services-process-wrap table td{
    border:1px solid #e3e6ea;
    padding:9px 12px;
}

/* ---------------------------------------------------------------
 *  CONTACT PAGE
 * --------------------------------------------------------------- */
.qg-contact-section{padding:90px 0;}
.qg-contact-grid{display:flex;flex-wrap:wrap;gap:30px;}
.qg-contact-col{flex:1 1 360px;}

.qg-contact-card{
    background:#fff;
    border:1px solid #e7e9f2;
    border-radius:12px;
    padding:34px;
    box-shadow:0 18px 40px rgba(12,18,57,.06);
    height:100%;
}
.qg-contact-card h3{
    font-size:24px;font-weight:700;color:var(--qg-dark);
    margin:0 0 6px;
}
.qg-contact-card .qg-sub{color:#61657E;margin:0 0 22px;font-size:15px;}

.qg-field{margin-bottom:18px;}
.qg-field input,
.qg-field textarea{
    width:100%;
    border:1px solid #d8dbe8;
    border-radius:8px;
    padding:13px 16px;
    font-size:15px;
    color:#1c1c1c;
    background:#f8f9fc;
    transition:.2s;
}
.qg-field textarea{min-height:130px;resize:vertical;}
.qg-field input:focus,
.qg-field textarea:focus{
    outline:none;
    border-color:var(--qg-brand);
    background:#fff;
    box-shadow:0 0 0 3px rgba(73,115,115,.12);
}
.qg-contact-card .btn{border:none;cursor:pointer;}
.qg-captcha-notice{margin-top:14px;font-size:12px;color:#8a8f9e;line-height:1.6;}
.qg-captcha-notice a{color:var(--qg-brand);}

.qg-info-list{list-style:none;padding:0;margin:0 0 24px;}
.qg-info-list li{
    display:flex;gap:16px;align-items:flex-start;
    padding:16px 0;border-bottom:1px solid #eef0f6;
}
.qg-info-list li:last-child{border-bottom:none;}
.qg-info-ico{
    flex:0 0 46px;width:46px;height:46px;border-radius:50%;
    background:var(--qg-brand);color:#fff;
    display:flex;align-items:center;justify-content:center;font-size:17px;
}
.qg-info-list h4{font-size:16px;margin:0 0 4px;color:var(--qg-dark);font-weight:700;}
.qg-info-list a,
.qg-info-list p{color:#61657E;margin:0;text-decoration:none;font-size:15px;}
.qg-info-list a:hover{color:var(--qg-brand);}

.qg-contact-social{display:flex;gap:10px;}
.qg-contact-social a{
    width:40px;height:40px;border-radius:50%;
    background:#eef0f6;color:var(--qg-dark);
    display:flex;align-items:center;justify-content:center;transition:.25s;
}
.qg-contact-social a:hover{background:var(--qg-brand);color:#fff;}

.qg-map{margin-top:50px;border-radius:12px;overflow:hidden;line-height:0;}
.qg-map iframe{width:100%;height:420px;border:0;}

@media (max-width:767px){
    .qg-contact-section{padding:60px 0;}
    .qg-contact-card{padding:24px;}
    .qg-map iframe{height:300px;}
}

/* ============================================================
 *  FIXES — header logo / phone visibility, spacing
 * ============================================================ */

/* Logo is a dark logo on a dark header — render it white so it shows.
   (The mobile menu panel is white, so its logo is left untouched.) */
.qg-header .logo img{
    filter:brightness(0) invert(1);
}

/* Header "Call us anytime" phone block — theme colours these links dark;
   force them light so they are visible on the dark header. */
.qg-header .header-action ul li a{color:#ffffff !important;}
.qg-header .header-phone small{color:#cfd5e6 !important;}
.qg-header .header-phone i{color:#ffffff;}

/* Homepage appointment section — make the side image match the form
   height so there is no large empty white block after the form. */
.appointment-area .appointment-img{
    height:100%;
    display:flex;
}
.appointment-area .appointment-img img{
    width:100%;
    height:100%;
    object-fit:cover;
    border-radius:8px;
}

/* Product detail page — readable vertical rhythm for the description */
.services-process-wrap h4,
.services-process-wrap h5{
    margin-top:30px;
    margin-bottom:12px;
}
.services-process-wrap > h4:first-child,
.services-process-wrap > h5:first-child,
.services-process-wrap > p:first-child{
    margin-top:0;
}
.services-process-wrap p{
    margin-bottom:15px;
    line-height:1.7;
}
.services-process-wrap ul{
    margin:0 0 20px;
    padding-left:20px;
}
.services-process-wrap ul li{
    margin-bottom:7px;
}