/* ============================================================
   GenCom 2026 Skin — light premium identity
   Replaces the (copied) purple/indigo gradient look with a clean
   white + slate + corporate-blue identity. Orange (#FE5A0E) stays:
   it is the logo color. Loaded AFTER all theme styles.

   Palette:
     orange  #FE5A0E   (brand, unchanged)
     blue    #3F80C2   (new accent — replaces #3f42a3)
     deep    #0066A9   (new deep blue — replaces #1f2158)
     ink     #16202B   (headings / nav text)
     slate   #101820   (footer)
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Inter+Tight:wght@400;500;600;700;800&display=swap');

:root{
  --g26-orange:#FE5A0E;
  --g26-blue:#3F80C2;
  --g26-deep:#0066A9;
  --g26-ink:#16202B;
  --g26-slate:#101820;
  --g26-slate2:#16202B;
}

/* ---------- 0. Typography: premium headline face ---------- */
h1,h2,h3,h4,h5,h6,
.title,.post-title,.dlab-tilte{
  font-family:'Inter Tight','Poppins',sans-serif !important;
  letter-spacing:-0.01em;
}

/* ---------- 1. HEADER: white, airy, sticky ---------- */
.site-header .main-bar,
.site-header .main-bar > .container,
.site-header .header-nav{
  background:#ffffff !important;
  background-image:none !important;
}
.site-header .main-bar{
  box-shadow:0 1px 0 rgba(22,32,43,.08), 0 10px 30px -18px rgba(22,32,43,.18);
}
/* nav links: ink on white (RFQ button keeps its own orange styling) */
.header-nav .nav > li > a:not([href="/request-a-quote"]){
  color:var(--g26-ink) !important;
  font-weight:600;
}
/* hover: the theme paints an orange block -> white text (matches active) */
.header-nav .nav > li:hover > a:not([href="/request-a-quote"]){
  color:#ffffff !important;
  background-color:var(--g26-orange);
  border-radius:4px;
}
/* active item: the theme paints it with an orange block -> white text */
.header-nav .nav > li.active > a:not([href="/request-a-quote"]){
  color:#ffffff !important;
  background-color:var(--g26-orange);
  border-radius:4px;
}
/* search icon on white */
.site-header .extra-nav .site-button-link,
.site-header .extra-nav .site-button-link i{
  color:var(--g26-ink) !important;
}
/* mobile toggler bars visible on white */
.navbar-toggler.navicon span{ background:var(--g26-ink) !important; }

/* ---------- 2. TOP STRIP (social + ISO): slate, thin orange seam ---------- */
.site-header .main-bar > div[style*="border-top"]{
  background:var(--g26-slate) !important;
  background-image:none !important;
  border-top:3px solid var(--g26-orange) !important;
}

/* ---------- 3. FOOTER: deep slate, no purple, no loud orange bands ---------- */
.site-footer .footer-info-bar{
  background:var(--g26-slate) !important;
  background-image:none !important;
}
.site-footer .footer-info-bar .icon-bx-wraper{
  border-color:rgba(255,255,255,.12) !important;
}
.site-footer .footer-top{
  background:var(--g26-slate2) !important;
  background-image:none !important;
  border-top:1px solid rgba(255,255,255,.06);
}
.site-footer .footer-bottom{
  background:#0B1118 !important;
  color:#9FB0C0 !important;
}
.site-footer .footer-bottom a{ color:#ffffff !important; }

/* ---------- 4. PURPLE GRADIENT KILL-SWITCH (content areas) ----------
   Any element still carrying the old inline indigo gradient gets the
   new deep-blue gradient instead. Matches only background gradients,
   never plain text colors. */
.page-content [style*="linear-gradient"][style*="1f2158"],
.page-content [style*="linear-gradient"][style*="3f42a3"],
.page-content [style*="linear-gradient"][style*="1f214f"]{
  background-image:linear-gradient(120deg,var(--g26-deep) 0%,var(--g26-blue) 100%) !important;
}

/* ---------- 5. Purple ACCENTS -> new blue ---------- */
.text-primary{ color:var(--g26-deep) !important; }
.page-content a[style*="color:#3f42a3"],
.page-content a[style*="color: #3f42a3"],
.page-content span[style*="color:#3f42a3"],
.page-content span[style*="color: #3f42a3"]{
  color:var(--g26-deep) !important;
}
/* new-page component accents (request-a-quote / shutdown / resources / article) */
.rfq-field label{ color:var(--g26-deep) !important; }
.rfq-field input:focus,.rfq-field select:focus,.rfq-field textarea:focus{
  border-color:var(--g26-blue) !important;
  box-shadow:0 0 0 3px rgba(63,128,194,.15) !important;
}
.rfq-step-ind.active .lbl,.rfq-step-ind.done .lbl{ color:var(--g26-ink) !important; }
.rfq-btn-back{ color:var(--g26-deep) !important; }
.rfq-review-item .k{ color:var(--g26-deep) !important; }
.rfq-h,.sd-step h5,.res-card h5,.art-body h2,
.gallery-card-title{ color:var(--g26-ink) !important; }
.art-body h3{ color:var(--g26-deep) !important; }
.res-ic{ background-image:linear-gradient(135deg,var(--g26-deep),var(--g26-blue)) !important; }
.rfq-file i{ color:var(--g26-blue) !important; }

/* headings that were forced to old indigo */
h1[style*="1f2158"],h2[style*="1f2158"],h3[style*="1f2158"],
h4[style*="1f2158"],h5[style*="1f2158"],h6[style*="1f2158"]{
  color:var(--g26-ink) !important;
}

/* ---------- 6. Cards: lighter, crisper ----------
   NOTE: no overflow on .dlab-box — service-box-3 title bars hang
   25px below the box BY DESIGN (theme: .service-box-3 .dlab-info
   bottom:-25px). Clip only the media (image) container. */
.dlab-box{
  border-radius:12px;
}
.dlab-box .dlab-media{
  border-radius:10px;
  overflow:hidden;
}
.dlab-box > .p-a20{
  border-radius:0 0 12px 12px;
}
.section-full.content-inner-2[style*="f4f6f8"],
.section-full.content-inner[style*="f4f6f8"]{
  background-color:#F4F7FA !important;
}

/* ---------- 7. Buttons: keep brand orange, modern radius ---------- */
.site-button:not(.facebook):not(.youtube):not(.linkedin):not(.instagram):not(.twitter){
  border-radius:8px !important;
}

/* ---------- 8. Inner-page hero banners: deeper, cleaner shade ---------- */
.dlab-bnr-inr.overlay-black-middle:after{
  background:linear-gradient(180deg,rgba(10,16,24,.55),rgba(10,16,24,.35) 45%,rgba(10,16,24,.7)) !important;
  opacity:1 !important;
}

/* ---------- 9. Class-level purple gradients on custom pages ---------- */
.sd-priority,
.res-band,
.art-cta{
  background-image:linear-gradient(120deg,var(--g26-deep) 0%,var(--g26-blue) 100%) !important;
}
.rfq-card{ box-shadow:0 10px 30px rgba(16,32,48,.07) !important; }

/* ---------- 10. SOLID purple fallbacks (inline backgrounds/borders) ---------- */
[style*="background-color:#3f42a3"],[style*="background-color: #3f42a3"],
[style*="background:#3f42a3"],[style*="background: #3f42a3"]{
  background-color:var(--g26-blue) !important;
}
[style*="background-color:#1f2158"],[style*="background-color: #1f2158"],
[style*="background:#1f2158"],[style*="background: #1f2158"],
[style*="background-color:#1f214f"],[style*="background-color: #1f214f"]{
  background-color:var(--g26-deep) !important;
}
[style*="border"][style*="#3f42a3"]{ border-color:var(--g26-blue) !important; }
[style*="border"][style*="#1f2158"]{ border-color:var(--g26-deep) !important; }

/* ---------- 11. Header strip: slate on ALL page variants ---------- */
.site-header .header-top,
.site-header nav.header-top,
.site-header div:has(> .header-top),
.site-header div:has(> nav.header-top){
  background:var(--g26-slate) !important;
  background-image:none !important;
}

/* ---------- 12. Floating buttons: stack WhatsApp above scroll-top ---------- */
a[href*="wa.me"]{
  bottom:92px !important;
  right:20px !important;
}

/* ---------- 13. Mobile menu: clean white panel ---------- */
.site-header .header-nav .navbar-nav,
.site-header .header-nav.navbar-collapse,
.site-header .navbar-collapse .nav{
  background:#ffffff !important;
  background-image:none !important;
}
@media (max-width: 991px){
  header.site-header .header-nav,
  header.site-header .header-nav .navbar-nav,
  header.site-header .header-nav .nav > li{
    background:#ffffff !important;
    background-image:none !important;
  }
  header.site-header .header-nav .nav > li{
    border-color:rgba(22,32,43,.08) !important;
  }
  header.site-header .header-nav .nav > li > a:not([href="/request-a-quote"]){
    color:var(--g26-ink) !important;
  }
  /* keep active/hover readable on mobile too (+ inner padding) */
  header.site-header .header-nav .nav > li.active > a:not([href="/request-a-quote"]),
  header.site-header .header-nav .nav > li:hover > a:not([href="/request-a-quote"]){
    color:#ffffff !important;
    background-color:var(--g26-orange) !important;
    padding:10px 14px !important;
    border-radius:6px;
  }
  /* Request a Quote: visible orange button on mobile (desktop rule is min-width:992px only) */
  header.site-header .header-nav .nav > li > a[href="/request-a-quote"]{
    color:#ffffff !important;
    background-color:var(--g26-orange) !important;
    display:inline-block !important;
    padding:10px 16px !important;
    margin:8px 0 !important;
    border-radius:6px !important;
    line-height:1.2 !important;
  }
}