/* =====================================================================
   WHITE-VARIANT OVERRIDE (preview copy only) — linked LAST in <head> on
   every page so it wins by source order, regardless of whether a page
   links site.css or inlines its styles. Flips the whole site dark ->
   white and recolors white text to charcoal so it stays readable. Teal
   accents and all layout/placement/content are unchanged. Exists only in
   the _gen/website-white copy; the live site is untouched.
   ===================================================================== */

:root{
  --bg-dark-primary:#FFFFFF !important;
  --bg-dark-secondary:#F3F4F5 !important;
  --card-dark-bg:#FFFFFF !important;
  --card-dark-border:rgba(28,26,23,.15) !important;
  --text-dark-main:#1C1A17 !important;
  --text-dark-muted:#4A5154 !important;
}

body{ background-color:#FFFFFF !important; color:var(--text-dark-muted); }

/* Sections with hardcoded dark backgrounds. */
#landing{ background:#FFFFFF !important; }
.sec-tone-primary.sec-tone-primary{ background-color:#FFFFFF !important; }
.sec-tone-secondary.sec-tone-secondary{ background-color:#F3F4F5 !important; }
.sec-approach{ background:#FFFFFF !important; }
.sec-commitment{ background:#F3F4F5 !important; }
.sec-values{ background:#FFFFFF !important; }
.light-wrapper{ background-color:#F3F4F5 !important; color:var(--text-dark-muted); }
.network-strip{ background:#F3F4F5 !important; }
.stacked-cards-section{ background-color:#FFFFFF !important; }
.about-sec, .about-sec-dark, .about-sec-dark2{ background-color:#FFFFFF !important; }
.about-sec-dark2{ background-color:#F3F4F5 !important; }
.faq-section-seamless{ background-color:#FFFFFF !important; }

/* White TEXT -> charcoal (teal fills/borders untouched). */
.hero-tagline .line-white{ color:#1C1A17 !important; }
.hero-tagline{ text-shadow:none !important; }
.value-tile-title, .value-tile:hover .value-tile-title{ color:#1C1A17 !important; }
.corp-cta-band h2{ color:#1C1A17 !important; }
.svc-cta p, .svc-cta-band p{ color:#1C1A17 !important; }
.ia-row:hover h3{ color:#1C1A17 !important; }
.cat-reg-row:hover .cat-reg-name{ color:#1C1A17 !important; }
.cat-div-row:hover .cat-div-copy h3{ color:#1C1A17 !important; }
.division-icon-big svg{ stroke:#1C1A17 !important; }
.mv-text, .mv-label, .val-glass-title, .val-glass-desc,
.rail-title, .rail-desc, .unique-title, .unique-desc,
.v-tl-label, .v-tl-text, .exp-your{ color:#1C1A17 !important; }
.mv-text, .val-glass-desc, .rail-desc, .unique-desc, .v-tl-text{ color:#4A5154 !important; }

/* Hardcoded dark panels on inner/service/about pages. */
.commitment-hero-side{ background:#F3F4F5 !important; }
.commitment-hero-side .commitment-hero-title{ color:#1C1A17 !important; }
.value-tile:hover{ background:#F3F4F5 !important; }
.svc-cta{ background:#F3F4F5 !important; }

/* Chrome: header / nav / footer / dock. */
.site-header{ background-color:rgba(255,255,255,.92) !important; border-bottom:1px solid var(--card-dark-border); }
.site-header.scrolled{ background-color:rgba(255,255,255,.98) !important; box-shadow:0 8px 24px -14px rgba(28,26,23,.22); }
.hamburger-line{ background-color:#1C1A17 !important; }
.dropdown-menu-card{ background-color:#FFFFFF !important; }
.site-nav{ background-color:#FFFFFF !important; }
.site-footer{ background-color:#F3F4F5 !important; }
.floating-dock{ background-color:#FFFFFF !important; border:1px solid var(--card-dark-border); }

.footer-cta{ background:#FFFFFF !important; border:1px solid var(--card-dark-border); box-shadow:0 10px 30px -14px rgba(28,26,23,.2); }
.footer-cta-title{ color:#1C1A17 !important; }
.footer-btn-ghost{ color:#1C1A17 !important; background:transparent !important; border-color:rgba(38,169,154,.5) !important; }
.footer-btn-ghost:hover{ color:var(--teal-primary) !important; background:rgba(38,169,154,.08) !important; }

/* LOGO: white wordmark -> charcoal version, same size/position. The
   override CSS lives in /assets, so logo-charcoal.svg sits beside it. */
.brand-logo .brand-logo-full{ visibility:hidden; width:150px; }
.brand-logo{ position:relative; }
.brand-logo::after{
  content:''; position:absolute; left:0; top:50%; transform:translateY(-50%);
  width:150px; height:34px;
  background:url('logo-charcoal.svg') left center / contain no-repeat;
  pointer-events:none;
}
.site-header.scrolled .brand-logo::after{ height:28px; }
.footer-brand-col a .footer-logo-img{ visibility:hidden; width:238px; }
.footer-brand-col a{ position:relative; display:inline-block; }
.footer-brand-col a::after{
  content:''; position:absolute; left:0; top:0;
  width:238px; height:54px;
  background:url('logo-charcoal.svg') left center / contain no-repeat;
  pointer-events:none;
}


/* =====================================================================
   CONTRAST + MOBILE CORRECTIONS (appended) — fixes real low-contrast /
   invisible text found when scanning the white variant on a 390px
   mobile viewport. Color only; no layout/placement/text changes.
   ===================================================================== */

/* --- The mobile homepage (.mhome) carries its OWN local color vars that
       the token flip above never reached, so its text was near-white on
       white (invisible). Re-point those local vars to the white scheme. */
.mhome{
  --teal:#26A99A !important;        /* readable deep teal for mobile accents */
  --teal-deep:#26A99A !important;
  --text:#1C1A17 !important;        /* was #E8EDF4 — now charcoal */
  --muted:#51606B !important;       /* was #94A3B8 — darker, readable */
  --card:#FFFFFF !important;
  --border:rgba(28,26,23,.15) !important;
  --bg2:#F3F4F5 !important;
  background:#FFFFFF !important;
  color:#1C1A17 !important;
}
.mhome .mh-hero{ background:#FFFFFF !important; }
.mhome .mh-hero .line-white, .mhome h1 .l1{ color:#1C1A17 !important; }
.mhome h1 .l2, .mhome .mh-hero .line-teal{ color:#26A99A !important; }
.mhome .mh-scroll-hint{ color:#51606B !important; }
.mhome .mh-stat b{ color:#26A99A !important; }
.mhome .mh-stat span{ color:#51606B !important; }
.mhome .mh-eyebrow{ color:#26A99A !important; }
.mhome .mh-index-row h3, .mhome h3, .mhome h4{ color:#1C1A17 !important; }
.mhome .mh-index-row p, .mhome p, .mhome .mh-blog .cat{ color:#51606B !important; }
.mhome .mh-blog .cat{ color:#26A99A !important; }
.mhome .dot{ color:rgba(38,169,154,.55) !important; }
.mhome .mh-see-all{ color:#26A99A !important; }
.mhome .mh-foot .ct{ color:#26A99A !important; }
.mhome .mh-foot a{ color:#51606B !important; }
.mhome .mh-copy{ color:#8A8A8A !important; }
.mhome .mh-dock{ background:#FFFFFF !important; border-top:1px solid rgba(28,26,23,.15) !important; }
.mhome .mh-dock a{ color:#26A99A !important; }
.mhome .mh-faq-q{ color:#1C1A17 !important; }
.mhome .mh-faq-a p{ color:#51606B !important; }

/* --- Deepen the accent used for SMALL text/labels so it clears 3:1 on
       white (the brand soft-teal #26A99A / #26A99A is too light for text).
       Larger teal UI (buttons/fills) keep the brand teal; these rules only
       touch teal TEXT elements that the scan flagged. */
.sec-eyebrow,
.mh-eyebrow,
.blog-category, .mh-blog .cat,
.cat-reg-new, .cat-div-mark,
.division-badge,
.mh-foot .ct{
  color:#26A99A !important;
}
/* Division/stat numbers rendered in teal text -> deeper teal. */
.division-badge b, .svc-stat b, .stat-num{ color:#26A99A !important; }
/* Contact page teal links (email/phone/address) -> deeper teal. */
.contact-detail a, a[href^="mailto:"], a[href^="tel:"]{ color:#26A99A !important; }

/* --- Muted body grey #94A3B8 (ratio ~2.56) -> darker readable grey. */
.footer-links a{ color:#51606B !important; }
.footer-links a:hover, .footer-links a:focus-visible{ color:#26A99A !important; }

/* --- Scroll hints were pale slate (ratio ~1.48). Darken for legibility. */
.hero-scroll-hint, .scroll-hint, .svc-scroll,
.blogs-scroll-hint, .contact-scroll-hint, .mh-scroll-hint{
  color:#51606B !important;
}
.hero-scroll-hint .scroll-mouse, .scroll-hint .scroll-hint-mouse{ border-color:#51606B !important; }


/* --- Final targeted contrast fixes from the second mobile scan. --- */
/* Mobile division index ghost numbers were too faint on grey. */
.mhome .mh-index-row .n{ color:rgba(38,169,154,.6) !important; }
/* Division hero stat number (e.g. "18") still brand-teal -> deeper teal. */
.division-badge b, .division-hero b, .svc-hero b{ color:#26A99A !important; }
/* About page "Vision" accent word. */
.exp-vision{ color:#26A99A !important; }
/* Any remaining teal links (contact phone/address render as plain <a>
   in teal) -> deeper teal for legibility. */
.contact-row a, .contact-info a, .svc-contact a{ color:#26A99A !important; }
a[style*="14B8A6"], a[style*="20,184,166"]{ color:#26A99A !important; }