/* ==========================================================================
   Hi-Tech Inspection — Theme Override
   Palette sampled from hitechoman.net:
     • Primary blue   #0050B5  (CTAs, headings, links)
     • Accent red     #F41E1E  (logo accent, hover states)
     • Heading dark   #333333
     • Body text      #3E3A3B
   Single point of control for theme + 6 unique loaders + clean SVG placeholders.
   ========================================================================== */

:root {
  --fx-clr-pr-1: #0050B5;
  --fx-clr-pr-2: #F41E1E;
  --fx-clr-sd-1: #002E68;
  --fx-clr-sd-2: #4A8FD6;
  --fx-clr-sd-3: #00345A;
  --fd-clr-h-1:  #333333;
  --fd-clr-p-1:  #3E3A3B;

  --ht-blue:        #0050B5;
  --ht-blue-deep:   #002E68;
  --ht-blue-light:  #4A8FD6;
  --ht-blue-soft:   #E6EFFA;
  --ht-red:         #F41E1E;
  --ht-ink:         #333333;
  --ht-text:        #3E3A3B;
}

/* ===== Buttons — blue primary, red hover ===== */
.fx-btn-1, .fx-btn-2, .fx-btn-3, .fx-btn-4,
button[type="submit"], .submit-btn, .btn-primary,
a[class*="fx-btn"], a[class*="fx-pr-btn"], a[class*="fx-link-btn"], .fx-link-btn {
  background-color: #0050B5 !important;
  border-color: #0050B5 !important;
  color: #fff !important;
}
.fx-btn-1:hover, .fx-btn-2:hover, .fx-btn-3:hover, .fx-btn-4:hover,
button[type="submit"]:hover, .submit-btn:hover, .btn-primary:hover,
a[class*="fx-btn"]:hover, a[class*="fx-pr-btn"]:hover, a[class*="fx-link-btn"]:hover {
  background-color: #F41E1E !important;
  border-color: #F41E1E !important;
}
/* Button labels stay white even when nested inside text-recolor contexts */
a[class*="fx-btn"] *, a[class*="fx-pr-btn"] *, a[class*="fx-link-btn"] *,
button[type="submit"] *, .btn-primary * {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

/* ===== Selection highlight ===== */
::-moz-selection { background-color: #0050B5 !important; color: #fff !important; }
::selection      { background-color: #0050B5 !important; color: #fff !important; }

/* ===== Header — logo + nav layout ===== */
.fx-header-1-main-logo img,
.fx-header-2-main-logo img,
.fx-header-3-main-logo img,
.fx-header-4-main-logo img,
.fx-header-5-main-logo img,
.fx-header-6-main-logo img,
header img.brand-logo,
.site-logo img { max-height: 52px; width: auto; }

.main-navigation .navbar-nav,
nav.main-navigation > ul,
#main-nav { flex-wrap: nowrap !important; white-space: nowrap; }
.main-navigation > ul > li > a,
#main-nav > li > a {
  padding-left: 14px !important;
  padding-right: 14px !important;
  font-size: 15px !important;
  letter-spacing: 0 !important;
}
@media (min-width:1200px) and (max-width:1399px){
  .main-navigation > ul > li > a,
  #main-nav > li > a { padding-left:10px !important; padding-right:10px !important; font-size:14px !important; }
}
@media (min-width:1400px) and (max-width:1599px){
  .main-navigation > ul > li > a,
  #main-nav > li > a { padding-left:12px !important; padding-right:12px !important; font-size:14.5px !important; }
}
.main-navigation li.dropdown > a::after { margin-left:4px; }

/* Header right-side action area — small gap between search/Quote/hamburger.
   No margin/padding/border that pushes the area beyond the container width. */
.fx-header-1-action-link, .fx-header-2-action-link, .fx-header-3-action-link,
.fx-header-4-action-link, .fx-header-5-action-link, .fx-header-6-action-link {
  gap: 14px !important;
}
.fx-search-btn-1, .fx-search-btn-2, .fx-search-btn-3,
.fx-search-btn-4, .fx-search-btn-5, .fx-search-btn-6,
.search_btn_toggle {
  display: inline-flex !important; align-items: center !important;
  gap: 8px !important; white-space: nowrap !important;
  padding: 6px 4px !important; font-size: 13px !important;
  letter-spacing: .04em !important; color: #333 !important;
}
.fx-search-btn-1 i, .fx-search-btn-2 i, .fx-search-btn-3 i,
.fx-search-btn-4 i, .fx-search-btn-5 i, .fx-search-btn-6 i,
.search_btn_toggle i { color: #0050B5 !important; font-size: 15px !important; }
@media (max-width:1399px){
  .fx-search-btn-1, .fx-search-btn-2, .fx-search-btn-3,
  .fx-search-btn-4, .fx-search-btn-5, .fx-search-btn-6,
  .search_btn_toggle { font-size: 0 !important; }
  .fx-search-btn-1 i, .fx-search-btn-2 i, .fx-search-btn-3 i,
  .fx-search-btn-4 i, .fx-search-btn-5 i, .fx-search-btn-6 i,
  .search_btn_toggle i { font-size: 16px !important; }
}
.fx-pr-btn-1, .fx-pr-btn-2, .fx-pr-btn-3,
.fx-pr-btn-4, .fx-pr-btn-5, .fx-pr-btn-6 { margin-left: 0 !important; white-space: nowrap !important; }
.fx-menu-btn-1, .fx-menu-btn-2, .fx-menu-btn-3,
.fx-menu-btn-4, .fx-menu-btn-5, .fx-menu-btn-6,
.offcanvas_toggle { margin-left: 4px !important; }

/* Header phone block — keep "Need Help?" + phone on one line, prevent squish */
.fx-header-1-phone, .fx-header-2-phone, .fx-header-3-phone,
.fx-header-4-phone, .fx-header-5-phone, .fx-header-6-phone {
  min-width: 220px !important;
  white-space: nowrap;
  flex-shrink: 0 !important;
}
.fx-header-1-phone .title, .fx-header-2-phone .title, .fx-header-3-phone .title,
.fx-header-4-phone .title, .fx-header-5-phone .title, .fx-header-6-phone .title {
  white-space: nowrap;
  font-size: 12px !important;
  letter-spacing: .04em !important;
  margin-bottom: 4px !important;
}
.fx-header-1-phone .phone-number, .fx-header-2-phone .phone-number,
.fx-header-3-phone .phone-number, .fx-header-4-phone .phone-number,
.fx-header-5-phone .phone-number, .fx-header-6-phone .phone-number {
  white-space: nowrap;
  font-size: 18px !important;
}

/* ===== Placeholder images (set by hitech-images.js) ===== */
img.ht-placeholder-img {
  opacity: 1 !important;
  background: #E6EFFA;
}
/* (deliberately no position rule — preserves the template's position:sticky
   needed by the project-6 stacked-cards scroll animation, etc.) */

/* ==========================================================================
   PRELOADER + 6 unique loaders
   ========================================================================== */
#preloader { background: #fff; }
#preloader .ht-loader{
  display:flex; align-items:center; justify-content:center;
  width:100%; height:100%; position:relative;
  font-family:'Roboto',system-ui,sans-serif;
}
#preloader .ht-loader-cap{
  position:absolute; bottom:14%; left:0; right:0; text-align:center;
  font-size:11px; letter-spacing:.4em; text-transform:uppercase;
  color:#0050B5; font-weight:600; opacity:.75;
}

/* 1 · Industrial · gear */
.ht-loader--gear .ht-gear{
  width:96px; height:96px; border-radius:50%;
  border:6px solid #002E68;
  border-top-color:#0050B5; border-right-color:#0050B5;
  position:relative; animation:htGearSpin 1.1s linear infinite;
}
.ht-loader--gear .ht-gear::before{
  content:""; position:absolute; inset:14px; border-radius:50%;
  border:4px dashed #0050B5; animation:htGearSpin 2.6s linear infinite reverse;
}
.ht-loader--gear .ht-gear::after{
  content:""; position:absolute; inset:36px; border-radius:50%; background:#F41E1E;
}
@keyframes htGearSpin{ to{ transform:rotate(360deg) } }

/* 2 · Construction · bars */
.ht-loader--bars{ gap:6px; align-items:flex-end !important; }
.ht-loader--bars .b{
  width:10px; height:60px; background:#0050B5; border-radius:3px;
  transform-origin:bottom; transform:scaleY(.2);
  animation:htBars 1s ease-in-out infinite;
}
.ht-loader--bars .b:nth-child(1){ animation-delay:0s }
.ht-loader--bars .b:nth-child(2){ animation-delay:.1s }
.ht-loader--bars .b:nth-child(3){ animation-delay:.2s; background:#F41E1E }
.ht-loader--bars .b:nth-child(4){ animation-delay:.3s }
.ht-loader--bars .b:nth-child(5){ animation-delay:.4s }
@keyframes htBars{ 0%,100%{transform:scaleY(.2)} 50%{transform:scaleY(1)} }

/* 3 · Building · grid */
.ht-loader--grid .g{ display:grid; grid-template-columns:repeat(3,16px); grid-gap:6px; }
.ht-loader--grid .g span{
  width:16px; height:16px; background:#0050B5; border-radius:3px;
  animation:htGrid 1.2s ease-in-out infinite;
}
.ht-loader--grid .g span:nth-child(1){ animation-delay:.0s }
.ht-loader--grid .g span:nth-child(2){ animation-delay:.1s }
.ht-loader--grid .g span:nth-child(3){ animation-delay:.2s }
.ht-loader--grid .g span:nth-child(4){ animation-delay:.1s }
.ht-loader--grid .g span:nth-child(5){ animation-delay:.2s; background:#F41E1E }
.ht-loader--grid .g span:nth-child(6){ animation-delay:.3s }
.ht-loader--grid .g span:nth-child(7){ animation-delay:.2s }
.ht-loader--grid .g span:nth-child(8){ animation-delay:.3s }
.ht-loader--grid .g span:nth-child(9){ animation-delay:.4s }
@keyframes htGrid{ 0%,100%{transform:scale(.5);opacity:.3} 50%{transform:scale(1);opacity:1} }

/* 4 · Shipping · sonar */
.ht-loader--sonar .ring{ position:relative; width:100px; height:100px; }
.ht-loader--sonar .ring::before,
.ht-loader--sonar .ring::after,
.ht-loader--sonar .ring i{
  content:""; position:absolute; inset:0; border-radius:50%;
  border:3px solid #0050B5; animation:htSonar 1.6s cubic-bezier(0,.55,.45,1) infinite;
}
.ht-loader--sonar .ring::after{ animation-delay:.4s }
.ht-loader--sonar .ring i{ animation-delay:.8s; border-color:#F41E1E }
.ht-loader--sonar .ring b{
  position:absolute; inset:38px; background:#0050B5; border-radius:50%;
}
@keyframes htSonar{ 0%{transform:scale(.2);opacity:1} 100%{transform:scale(1.4);opacity:0} }

/* 5 · Manufacturing · belt */
.ht-loader--belt .track{
  position:relative; width:160px; height:14px; border-radius:30px;
  background:#E6EFFA; overflow:hidden;
}
.ht-loader--belt .track i{
  position:absolute; top:2px; width:10px; height:10px; border-radius:50%;
  background:#0050B5; animation:htBelt 1.4s linear infinite;
}
.ht-loader--belt .track i:nth-child(1){ animation-delay:0s }
.ht-loader--belt .track i:nth-child(2){ animation-delay:.35s; background:#F41E1E }
.ht-loader--belt .track i:nth-child(3){ animation-delay:.7s }
.ht-loader--belt .track i:nth-child(4){ animation-delay:1.05s; background:#F41E1E }
@keyframes htBelt{ 0%{ left:-12px } 100%{ left:170px } }

/* 6 · Engineering · dial */
.ht-loader--dial .dial{
  position:relative; width:96px; height:96px; border-radius:50%;
  border:2px solid #002E68;
}
.ht-loader--dial .dial::before{
  content:""; position:absolute; inset:6px; border-radius:50%;
  border:1px dashed rgba(0,46,104,.3);
}
.ht-loader--dial .dial .needle{
  position:absolute; left:50%; top:8px; width:3px; height:42px; background:#F41E1E;
  transform-origin:bottom center; transform:translateX(-50%); border-radius:2px;
  animation:htDial 1.4s cubic-bezier(.7,0,.3,1) infinite;
}
.ht-loader--dial .dial .hub{
  position:absolute; inset:42px; background:#0050B5; border-radius:50%;
}
.ht-loader--dial .dial .tick{
  position:absolute; width:2px; height:8px; background:#002E68;
  left:calc(50% - 1px); top:0; transform-origin:50% 48px;
}
.ht-loader--dial .dial .tick:nth-child(2){ transform:rotate(90deg) }
.ht-loader--dial .dial .tick:nth-child(3){ transform:rotate(180deg) }
.ht-loader--dial .dial .tick:nth-child(4){ transform:rotate(270deg) }
@keyframes htDial{ 0%{transform:translateX(-50%) rotate(0deg)} 100%{transform:translateX(-50%) rotate(360deg)} }

/* ==========================================================================
   READABILITY FIX FOR LIGHT PLACEHOLDER SECTIONS (the only text-color override)
   --------------------------------------------------------------------------
   The Forgex template designs hero / banner / breadcrumb / cta sections with
   white text on a dark image. When that image becomes a LIGHT placeholder
   (.ht-placeholder-bg-light, set by hitech-images.js), the white text
   disappears. Recolor white text → deep navy and force outline-only titles
   to a solid fill — but ONLY inside light placeholders.

   .ht-placeholder-bg-blue (blue project / core-services cards) stays exactly
   as the template designed: white text on blue card.
   ========================================================================== */

/* ==========================================================================
   TARGETED READABILITY FIXES (per concrete class — not global)
   Each rule below addresses one specific element class found during visual
   audit on real rendered demos. No :has(), no [class*=""] sweeps — exact
   class names only, so the rule cannot bleed into other sections.
   ==========================================================================
   STYLE 2 — Construction
   ========================================================================== */
/* Hero text on light placeholder — ONLY when hero area is light. Style-5 reuses
   the same .fx-hero-2-slider-item-* classes but on a dark #070707 bg, so it must
   keep its native white text. */
.ht-placeholder-bg-light .fx-hero-2-slider-item-number,
.ht-placeholder-bg-light .fx-hero-2-slider-item-number *,
[class*="fx-hero-"]:has(.ht-placeholder-bg-light) .fx-hero-2-slider-item-number,
[class*="fx-hero-"]:has(.ht-placeholder-bg-light) .fx-hero-2-slider-item-number * {
  color: #021F45 !important;
  -webkit-text-fill-color: #021F45 !important;
}
.ht-placeholder-bg-light .fx-hero-2-slider-item-title,
.ht-placeholder-bg-light .fx-hero-2-slider-item-title *,
.ht-placeholder-bg-light .fx-hero-2-slider-item-title .split-line div,
[class*="fx-hero-"]:has(.ht-placeholder-bg-light) .fx-hero-2-slider-item-title,
[class*="fx-hero-"]:has(.ht-placeholder-bg-light) .fx-hero-2-slider-item-title *,
.fx-hero-2-area.ht-placeholder-bg-light .fx-hero-2-slider-item-title,
.fx-hero-2-area.ht-placeholder-bg-light .fx-hero-2-slider-item-title *,
.fx-hero-2-area.ht-placeholder-bg-light .split-line div {
  color: #021F45 !important;
  -webkit-text-fill-color: #021F45 !important;
  -webkit-text-stroke: 0 !important;
}
.ht-placeholder-bg-light .fx-hero-2-slider-item-pera,
.ht-placeholder-bg-light .fx-hero-2-slider-item-pera *,
.fx-hero-2-area.ht-placeholder-bg-light .fx-hero-2-slider-item-pera,
.fx-hero-2-area.ht-placeholder-bg-light .fx-hero-2-slider-item-pera * {
  color: #021F45 !important;
  -webkit-text-fill-color: #021F45 !important;
}
/* Play-video text label — only when hero is light */
[class*="fx-hero-"]:has(.ht-placeholder-bg-light) .fx-play-btn-1 span,
.ht-placeholder-bg-light .fx-play-btn-1 span {
  color: #021F45 !important;
  -webkit-text-fill-color: #021F45 !important;
}
/* Services-2 white sub/para — section sits on light placeholder */
.fx-services-2-area .fx-subtitle-1.has-clr-white,
.fx-services-2-area .fx-subtitle-1.has-clr-white *,
.fx-services-2-para.has-clr-white,
.fx-services-2-para.has-clr-white * {
  color: #021F45 !important;
  -webkit-text-fill-color: #021F45 !important;
}
/* Team-2 names + roles sit on light placeholder card */
.fx-team-2-area .item-name.has-clr-white,
.fx-team-2-area .item-disc.has-clr-white {
  color: #021F45 !important;
  -webkit-text-fill-color: #021F45 !important;
}
/* Blog-2 cards have light/white background — title + meta need dark text */
.fx-blog-2-area .item-title a,
.fx-blog-2-area .item-subtitle {
  color: #021F45 !important;
  -webkit-text-fill-color: #021F45 !important;
}
.fx-blog-2-area .item-title a:hover {
  color: #F41E1E !important;
  -webkit-text-fill-color: #F41E1E !important;
}
/* (Style 2 header keeps the template's native white-on-dark nav from
   .main-navigation.has-header-2 — do not override.) */

/* (Style 5 hero keeps the template's native 260px swiper-wrapper height.
   Hero headings and descriptions are kept short to fit the design.) */

/* ==========================================================================
   STYLE 3 — Building (.fd-home-3)
   ========================================================================== */
body.fd-home-3 .txxaslideup-item.d-inline-block,
body.fd-home-3 .item-slide-up,
body.fd-home-3 .txxaslideup-item.fx-cube-1 {
  color: #021F45 !important;
  -webkit-text-fill-color: #021F45 !important;
}
body.fd-home-3 [class*="fx-hero-3"] .split-line div,
body.fd-home-3 [class*="fx-hero-3"] :is(h1,h2,h3,h4,h5,h6),
body.fd-home-3 [class*="fx-hero-3"] :is(h1,h2,h3,h4,h5,h6) * {
  color: #021F45 !important;
  -webkit-text-fill-color: #021F45 !important;
  -webkit-text-stroke: 0 !important;
}
/* Process / how-we-work section — animated step labels on light bg */
body.fd-home-3 [class*="process-3"] .split-line div,
body.fd-home-3 [class*="process-3"] :is(h1,h2,h3,h4,h5,h6),
body.fd-home-3 [class*="process-3"] :is(h1,h2,h3,h4,h5,h6) *,
body.fd-home-3 [class*="process-3"] .item-slide-up,
body.fd-home-3 [class*="process-3"] .txxaslideup-item {
  color: #021F45 !important;
  -webkit-text-fill-color: #021F45 !important;
  -webkit-text-stroke: 0 !important;
}
body.fd-home-3 [class*="subtitle"].has-clr-white,
body.fd-home-3 [class*="subtitle"].has-clr-white * {
  color: #021F45 !important;
  -webkit-text-fill-color: #021F45 !important;
}
/* Testimonials */
body.fd-home-3 .fx-para-1.comment.has-clr-white,
body.fd-home-3 .author-name.has-clr-white,
body.fd-home-3 .author-disc.has-clr-white {
  color: #021F45 !important;
  -webkit-text-fill-color: #021F45 !important;
}
/* Blog cards on light bg */
body.fd-home-3 .item-subtitle,
body.fd-home-3 .box-title,
body.fd-home-3 .box-title a {
  color: #021F45 !important;
  -webkit-text-fill-color: #021F45 !important;
}
body.fd-home-3 .item-subtitle:hover,
body.fd-home-3 .box-title a:hover { color: #F41E1E !important; -webkit-text-fill-color: #F41E1E !important; }
/* Style 3: process section split-text titles + blog item titles + contact info box */
body.fd-home-3 .split-line,
body.fd-home-3 .split-line div,
body.fd-home-3 .split-line * {
  color: #021F45 !important;
  -webkit-text-fill-color: #021F45 !important;
  -webkit-text-stroke: 0 !important;
}
body.fd-home-3 h4.item-title,
body.fd-home-3 h4.item-title a,
body.fd-home-3 h4.item-title a * {
  color: #021F45 !important;
  -webkit-text-fill-color: #021F45 !important;
}
body.fd-home-3 h4.item-title a:hover { color: #F41E1E !important; -webkit-text-fill-color: #F41E1E !important; }

/* ==========================================================================
   STYLE 4 — Shipping (body.fx-style-shipping)
   ========================================================================== */
body.fx-style-shipping .fx-subtitle-1.has-clr-white,
body.fx-style-shipping .fx-subtitle-1.has-clr-white * {
  color: #021F45 !important; -webkit-text-fill-color: #021F45 !important;
}
body.fx-style-shipping h5.card-title,
body.fx-style-shipping h5.card-title a,
body.fx-style-shipping h5.card-title a * {
  color: #021F45 !important; -webkit-text-fill-color: #021F45 !important;
}
body.fx-style-shipping h5.card-title a:hover { color: #F41E1E !important; -webkit-text-fill-color: #F41E1E !important; }
body.fx-style-shipping .item-name.has-clr-white,
body.fx-style-shipping .item-disc.has-clr-white {
  color: #021F45 !important; -webkit-text-fill-color: #021F45 !important;
}
body.fx-style-shipping .item-comment.has-clr-white {
  color: #021F45 !important; -webkit-text-fill-color: #021F45 !important;
}

/* ==========================================================================
   STYLE 5 — Manufacturing (body.fx-home-5)
   Hero in this style sits on a DARK background — leave its white text alone.
   Only target sections with a confirmed LIGHT background.
   ========================================================================== */
/* Team / testimonial cards on light bg */
body.fx-home-5 .fx-team-5-area .item-name.has-clr-white,
body.fx-home-5 .fx-team-5-area .item-disc.has-clr-white,
body.fx-home-5 .fx-testimonial-5-area .item-comment.has-clr-white {
  color: #021F45 !important; -webkit-text-fill-color: #021F45 !important;
}
/* Contact box (light bg) */
body.fx-home-5 .fx-contact-us-1-info-box .box-title,
body.fx-home-5 .fx-contact-us-1-info-box .box-title *,
body.fx-home-5 .fx-contact-us-1-info-box .txxaslideup-item,
body.fx-home-5 .fx-contact-us-1-info-box .address,
body.fx-home-5 .fx-contact-us-1-info-box .address * {
  color: #021F45 !important; -webkit-text-fill-color: #021F45 !important;
}

/* ==========================================================================
   STYLE 6 — Engineering (body.fx-style-engineering)
   ========================================================================== */
body.fx-style-engineering h5.card-title,
body.fx-style-engineering h5.card-title * { color: #021F45 !important; -webkit-text-fill-color: #021F45 !important; }

/* About-6 description columns sit on BLACK background — make their text light.
   Scoped to the two text columns ONLY so the GSAP-animated 17-years pinned
   experience block (.fx-about-6-experi*) is left alone. */
body.fx-style-engineering .fx-about-6-content-right,
body.fx-style-engineering .fx-about-6-content-right p,
body.fx-style-engineering .fx-about-6-content-right p *,
body.fx-style-engineering .fx-about-6-content-right .disc,
body.fx-style-engineering .fx-about-6-content-right .disc *,
body.fx-style-engineering .fx-about-6-content-2-left,
body.fx-style-engineering .fx-about-6-content-2-left p,
body.fx-style-engineering .fx-about-6-content-2-left p *,
body.fx-style-engineering .fx-about-6-content-2-left .disc,
body.fx-style-engineering .fx-about-6-content-2-left .disc * {
  color: rgba(255,255,255,0.86) !important;
  -webkit-text-fill-color: rgba(255,255,255,0.86) !important;
}
body.fx-style-engineering .fx-about-6-content-right a,
body.fx-style-engineering .fx-about-6-content-right a *,
body.fx-style-engineering .fx-about-6-content-2-left a,
body.fx-style-engineering .fx-about-6-content-2-left a * {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}
body.fx-style-engineering .fx-about-6-content-right a:hover,
body.fx-style-engineering .fx-about-6-content-right a:hover *,
body.fx-style-engineering .fx-about-6-content-2-left a:hover,
body.fx-style-engineering .fx-about-6-content-2-left a:hover * {
  color: #F41E1E !important;
  -webkit-text-fill-color: #F41E1E !important;
}

/* Note: .fx-about-6-experi-* text colors are animated by GSAP in sync with
   the section's white→black bg transition. Do NOT override them — leave the
   template's native scroll-driven color animation alone. */
body.fx-style-engineering .box-title,
body.fx-style-engineering .box-title *,
body.fx-style-engineering .txxaslideup-item:not(.fx-about-6-area .txxaslideup-item),
body.fx-style-engineering .txxaslideup-item:not(.fx-about-6-area .txxaslideup-item) * {
  color: #021F45 !important; -webkit-text-fill-color: #021F45 !important;
}

/* Style 3 — Contact info boxes — labels + address text */
body.fd-home-3 .fx-contact-us-1-info-box .box-title,
body.fd-home-3 .fx-contact-us-1-info-box .box-title *,
body.fd-home-3 .fx-contact-us-1-info-box .address,
body.fd-home-3 .fx-contact-us-1-info-box .address *,
body.fd-home-3 .fx-contact-us-1-info-box p,
body.fd-home-3 .fx-contact-us-1-info-box p * {
  color: #021F45 !important;
  -webkit-text-fill-color: #021F45 !important;
}

/* ==========================================================================
   FOOTER (shared across all 6 demos — all use .fx-footer-1- prefix).
   The template's footer renders with a light grey bg (#EEEEEE) but the markup
   was authored with white text. Force readable dark text everywhere.
   ========================================================================== */
[class*="fx-footer-"][class*="-area"] .widget-title.has-clr-white,
[class*="fx-footer-"][class*="-area"] .widget-title,
[class*="fx-footer-"][class*="-area"] .widget-title * {
  color: #021F45 !important;
  -webkit-text-fill-color: #021F45 !important;
}
[class*="fx-footer-"][class*="-area"] .fx-footer-1-disc-text.has-clr-white,
[class*="fx-footer-"][class*="-area"] .fx-footer-1-disc-text,
[class*="fx-footer-"][class*="-area"] .fx-footer-1-disc-text * {
  color: #3E3A3B !important;
  -webkit-text-fill-color: #3E3A3B !important;
}
[class*="fx-footer-"][class*="-area"] .fx-footer-1-menu a,
[class*="fx-footer-"][class*="-area"] .fx-footer-1-menu-2 a,
[class*="fx-footer-"][class*="-area"] .fx-footer-1-menu .dropdown-link,
[class*="fx-footer-"][class*="-area"] .fx-footer-1-contact,
[class*="fx-footer-"][class*="-area"] .fx-footer-1-contact a,
[class*="fx-footer-"][class*="-area"] .fx-footer-1-contact * {
  color: #3E3A3B !important;
  -webkit-text-fill-color: #3E3A3B !important;
}
[class*="fx-footer-"][class*="-area"] .fx-footer-1-menu a:hover,
[class*="fx-footer-"][class*="-area"] .fx-footer-1-menu-2 a:hover,
[class*="fx-footer-"][class*="-area"] .fx-footer-1-contact a:hover {
  color: #0050B5 !important;
  -webkit-text-fill-color: #0050B5 !important;
}
[class*="fx-footer-"][class*="-area"] .fx-footer-1-copyright-text,
[class*="fx-footer-"][class*="-area"] .fx-footer-1-copyright a,
[class*="fx-footer-"][class*="-area"] .fx-footer-1-copyright {
  color: #3E3A3B !important;
  -webkit-text-fill-color: #3E3A3B !important;
}
[class*="fx-footer-"][class*="-area"] .fx-footer-1-copyright a:hover {
  color: #0050B5 !important;
  -webkit-text-fill-color: #0050B5 !important;
}
/* Footer marquee outline-text ("uncompromised quality / accredited inspection") */
[class*="fx-footer-"][class*="-area"] .item-text,
[class*="fx-footer-"][class*="-area"] .item-text * {
  color: rgba(2, 31, 69, 0.10) !important;
  -webkit-text-fill-color: rgba(2, 31, 69, 0.10) !important;
  -webkit-text-stroke: 1px rgba(2, 31, 69, 0.18) !important;
}

/* When a parent heading has .has-clr-white / .text-white, GSAP-generated inner
   split-line divs must STAY white too. Prefixed with `body` to win specificity
   tie against per-style navy rules like `body.fd-home-3 .split-line div`. */
body .has-clr-white .split-line,
body .has-clr-white .split-line div,
body .has-clr-white .split-line span,
body .has-clr-white .word,
body .has-clr-white .word div,
body [class*="has-clr-white"] .split-line,
body [class*="has-clr-white"] .split-line div,
body [class*="has-clr-white"] .split-line span,
body .text-white .split-line,
body .text-white .split-line div,
body [class*="text-white"] .split-line,
body [class*="text-white"] .split-line div {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

/* Always: button labels stay white regardless of context. */
a[class*="fx-btn"], a[class*="fx-btn"] *,
a[class*="fx-pr-btn"], a[class*="fx-pr-btn"] *,
a[class*="fx-link-btn"], a[class*="fx-link-btn"] *,
button[type="submit"], button[type="submit"] *,
.btn-primary, .btn-primary * {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}
.fx-search-btn-1, .fx-search-btn-1 *,
.fx-search-btn-2, .fx-search-btn-2 *,
.fx-search-btn-3, .fx-search-btn-3 *,
.fx-search-btn-4, .fx-search-btn-4 *,
.fx-search-btn-5, .fx-search-btn-5 *,
.fx-search-btn-6, .fx-search-btn-6 * {
  color: #333 !important;
  -webkit-text-fill-color: #333 !important;
}
.fx-search-btn-1 i, .fx-search-btn-2 i, .fx-search-btn-3 i,
.fx-search-btn-4 i, .fx-search-btn-5 i, .fx-search-btn-6 i {
  color: #0050B5 !important;
  -webkit-text-fill-color: #0050B5 !important;
}

/* ---- Video section: wide curved band, full image (zoomed out) on a blueprint-grid backing ---- */
.fx-video-3 .fx-video-1{
  height:clamp(360px,40vw,540px);
  background-color:#0a2240;
  background-image:
    repeating-linear-gradient(0deg,  rgba(255,255,255,.055) 0 1px, transparent 1px 40px),
    repeating-linear-gradient(90deg, rgba(255,255,255,.055) 0 1px, transparent 1px 40px),
    repeating-linear-gradient(45deg, rgba(0,80,181,.18) 0 1px, transparent 1px 22px);
}
.fx-video-3 .fx-video-1 img{object-fit:contain !important;object-position:center}

/* ---- Services section: make the background image more transparent ---- */
.fx-services-3-bg{opacity:.16}

/* ---- Services slider: card titles in brand red, readable on photos ---- */
body.fd-home-3 .fx-services-3-slider-item h4.item-title,
body.fd-home-3 .fx-services-3-slider-item h4.item-title a,
body.fd-home-3 .fx-services-3-slider-item h4.item-title a *{
  color:#F41E1E !important;
  -webkit-text-fill-color:#F41E1E !important;
  text-shadow:0 2px 12px rgba(0,0,0,.6);
}

/* ---- Process section: blue transparent overlay over the bg image ---- */
.fx-process-1-area{position:relative}
.fx-process-1-area::before{content:"";position:absolute;inset:0;border-radius:16px;background:linear-gradient(180deg,rgba(8,28,54,.90),rgba(2,18,40,.93));z-index:0;pointer-events:none}
.fx-process-1-area > *{position:relative;z-index:1}

/* ---- Project section: make the background image more transparent ---- */
.fx-project-2-bg{opacity:.15}

/* ---- Contact info boxes: yellow->blue, black->red (brand) with white text ---- */
.fx-contact-us-1-info-box[data-background*="c3-box-bg-1"]{background-image:none !important;background-color:#0050B5 !important}
.fx-contact-us-1-info-box[data-background*="c3-box-bg-2"]{background-image:none !important;background-color:#F41E1E !important}
.fx-contact-us-1-info-box[data-background*="c3-box-bg-1"],
.fx-contact-us-1-info-box[data-background*="c3-box-bg-1"] *,
.fx-contact-us-1-info-box[data-background*="c3-box-bg-2"],
.fx-contact-us-1-info-box[data-background*="c3-box-bg-2"] *{
  color:#fff !important;-webkit-text-fill-color:#fff !important;
}

/* ---- Contact section: breathing room above the CTA band (ported homepage) ---- */
.fx-contact-us-1-area{padding-bottom:64px}