/* ===========================
   EVM CONSTRUCTION – BRAND CSS
   =========================== */

/* 1) Brand variables (easy theme-wide tweaks) */
:root{
  --evm-black:#0f1113;
  --evm-dark:#14161a;
  --evm-gray:#6b7280;
  --evm-light:#f5f7fb;
  --evm-white:#ffffff;

  --evm-orange:#ff6a00;  /* Primary */
  --evm-orange-600:#e55f00;
  --evm-gold:#cfa85a;    /* Accent */
  --evm-gold-600:#b8924f;

  --evm-radius:16px;
  --evm-radius-lg:20px;
  --evm-shadow:0 10px 24px rgba(0,0,0,.12);
  --evm-shadow-sm:0 6px 16px rgba(0,0,0,.10);

  --evm-hero-overlay:linear-gradient(180deg, rgba(15,17,19,.55), rgba(15,17,19,.75));
  --evm-speed:280ms;
}

/* 2) Global base */
body{
  color:var(--evm-black);
  background:var(--evm-white);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
h1,h2,h3{
  letter-spacing:.5px;
  font-weight:700;
}
.section-pad{padding:64px 0;}
@media (max-width: 767px){ .section-pad{padding:40px 0;} }

/* 3) Header / Sticky header polish (works with most WP themes) */
.header-main, .site-header, .elementor-location-header{
  background:var(--evm-white);
  box-shadow:0 2px 10px rgba(0,0,0,.04);
}
.sticky-header, .is-sticky .site-header{
  box-shadow:0 8px 22px rgba(0,0,0,.08);
  transition:box-shadow var(--evm-speed) ease;
}

/* 4) Primary navigation */
.main-navigation a, .site-nav a, .elementor-nav-menu a{
  color:var(--evm-black);
  font-weight:600;
}
.main-navigation a:hover, .site-nav a:hover, .elementor-nav-menu a:hover{
  color:var(--evm-orange);
}
.elementor-nav-menu--main .elementor-item:after{
  content:"";
  display:block;
  height:2px;
  width:0;
  background:var(--evm-orange);
  transition:width var(--evm-speed) ease;
  margin-top:6px;
}
.elementor-nav-menu--main .elementor-item:hover:after{ width:100%; }

/* 5) Hero with overlay (also fixes "Slider Overlay Color" needs) */
.evm-hero{
  position:relative;
  color:var(--evm-white);
  min-height:52vh;
  display:flex; align-items:center;
}
.evm-hero:before{
  content:"";
  position:absolute; inset:0;
  background:var(--evm-hero-overlay);
  pointer-events:none;
}
.evm-hero .elementor-heading-title,
.evm-hero h1, .evm-hero h2{ color:var(--evm-white); }

/* 6) Buttons / CTAs (Elementor + generic) */
a.button, button, .btn,
.elementor-button, .elementor-button-link .elementor-button{
  background:var(--evm-orange);
  color:var(--evm-white);
  border:none;
  border-radius:var(--evm-radius);
  padding:12px 22px;
  box-shadow:var(--evm-shadow-sm);
  transition:transform var(--evm-speed) ease, background var(--evm-speed) ease, box-shadow var(--evm-speed) ease;
}
a.button:hover, button:hover, .btn:hover,
.elementor-button:hover{
  background:var(--evm-orange-600);
  transform:translateY(-1px);
  box-shadow:var(--evm-shadow);
}

/* Secondary (gold) */
.btn-gold, .evm-btn-gold, .elementor-button.evm-gold{
  background:var(--evm-gold);
}
.btn-gold:hover, .evm-btn-gold:hover, .elementor-button.evm-gold:hover{
  background:var(--evm-gold-600);
}

/* 7) "Get a Quote" standout pill */
.evm-cta-quote{
  background:var(--evm-black) !important;
  color:var(--evm-white) !important;
  border-radius:999px !important;
  padding:10px 20px !important;
  letter-spacing:.2px;
}
.evm-cta-quote:hover{ background:#000 !important; }

/* 8) Cards / panels (services, projects, etc.) */
.evm-card{
  background:var(--evm-white);
  border-radius:var(--evm-radius-lg);
  box-shadow:var(--evm-shadow);
  padding:24px;
  transition:transform var(--evm-speed) ease, box-shadow var(--evm-speed) ease;
}
.evm-card:hover{
  transform:translateY(-4px);
  box-shadow:0 18px 32px rgba(0,0,0,.14);
}
.evm-card h3{ margin-bottom:8px; }

/* 9) Image polish + subtle zoom */
.evm-img, .elementor img{
  border-radius:14px;
  box-shadow:0 8px 20px rgba(0,0,0,.10);
}
.evm-zoom img, .img-zoom img{
  transition:transform .4s ease;
}
.evm-zoom img:hover, .img-zoom img:hover{
  transform:scale(1.04);
}

/* 10) “How We Build” striped engineering band */
.evm-stripes{
  background:repeating-linear-gradient(135deg, #fafafa, #fafafa 18px, #f2f2f4 18px, #f2f2f4 36px);
  border-radius:var(--evm-radius-lg);
  padding:40px 28px;
  border:1px solid #e9ecf3;
}

/* 11) KPI / Stats row */
.evm-stats{
  display:grid; gap:22px;
  grid-template-columns:repeat(4, minmax(0,1fr));
}
.evm-stat{
  text-align:center;
  background:var(--evm-light);
  border-radius:var(--evm-radius);
  padding:22px;
}
.evm-stat .num{
  font-size:clamp(28px, 5vw, 44px);
  font-weight:800; color:var(--evm-orange);
}
.evm-stat .label{ color:var(--evm-gray); font-weight:600; }

/* 12) Testimonials slider / cards */
.evm-testimonial{
  background:var(--evm-white);
  border-left:6px solid var(--evm-orange);
  border-radius:var(--evm-radius);
  padding:22px;
  box-shadow:var(--evm-shadow-sm);
}
.evm-testimonial .name{ font-weight:700; }

/* 13) Logo strip (clients/suppliers) */
.evm-logos{
  display:grid; gap:24px;
  grid-template-columns:repeat(auto-fit, minmax(120px,1fr));
  align-items:center;
}
.evm-logos img{
  max-height:48px; object-fit:contain; filter:grayscale(100%); opacity:.8;
  transition:filter var(--evm-speed), opacity var(--evm-speed);
}
.evm-logos img:hover{ filter:none; opacity:1; }

/* 14) Links underline accent */
a{
  color:var(--evm-black);
  text-decoration:none;
  position:relative;
}
a:hover{ color:var(--evm-orange); }
a.evm-underline:after{
  content:"";
  position:absolute; left:0; bottom:-3px; height:2px; width:0;
  background:var(--evm-orange);
  transition:width var(--evm-speed) ease;
}
a.evm-underline:hover:after{ width:100%; }

/* 15) Footer – dark, clean */
.site-footer, .elementor-location-footer{
  background:var(--evm-dark);
  color:var(--evm-light);
}
.site-footer a{ color:var(--evm-light); }
.site-footer a:hover{ color:var(--evm-gold); }

/* 16) Forms (Elementor & Contact Form 7 basics) */
input[type="text"], input[type="email"], input[type="tel"], textarea,
.elementor-field, .wpcf7-form-control{
  background:#fff;
  border:1px solid #e7eaf0;
  border-radius:12px;
  padding:12px 14px;
}
input:focus, textarea:focus, .elementor-field:focus{
  outline:none; border-color:var(--evm-orange);
  box-shadow:0 0 0 4px rgba(255,106,0,.12);
}
input[type="submit"], .wpcf7-submit{
  background:var(--evm-orange); color:#fff; border:none;
  border-radius:12px; padding:12px 22px; cursor:pointer;
}
input[type="submit"]:hover{ background:var(--evm-orange-600); }

/* 17) Section headings with small gold bar */
.evm-heading{
  position:relative; padding-top:14px; margin-bottom:18px;
}
.evm-heading:before{
  content:""; position:absolute; top:0; left:0; width:64px; height:6px;
  background:var(--evm-gold); border-radius:6px;
}

/* 18) Micro-interactions */
.reveal{
  opacity:0; transform:translateY(10px);
  animation:evmUp .65s ease forwards;
}
@keyframes evmUp{
  to{ opacity:1; transform:none; }
}

/* 19) Responsive tweaks */
@media (max-width:1024px){
  .evm-stats{ grid-template-columns:repeat(2, minmax(0,1fr)); }
}
@media (max-width:560px){
  .evm-stats{ grid-template-columns:1fr; }
}

/* 20) Optional: SVG logo color nudge (if your logo is inline SVG) */
/* Targets a path with class 'v-mark' to force black “V” */
svg .v-mark{ fill:#000 !important; }

/* 21) Utility helpers */
.mt-0{margin-top:0!important;} .mb-0{margin-bottom:0!important;}
.mt-2{margin-top:8px!important;} .mb-2{margin-bottom:8px!important;}
.mt-4{margin-top:16px!important;} .mb-4{margin-bottom:16px!important;}
.p-2{padding:8px!important;} .p-4{padding:16px!important;} .p-6{padding:24px!important;}
.text-center{text-align:center!important;}
.bg-dark{background:var(--evm-black)!important; color:var(--evm-white)!important;}
.bg-light{background:var(--evm-light)!important;}
.text-orange{color:var(--evm-orange)!important;}
.elementor-background-overlay {
    display: none !important;
}

.elementor-widget-image::after {
    background: none !important;
}
/* Remove dark bar overlay on homepage carousel */
.slider-caption,
.slider-overlay,
.hero-slider .overlay,
.swiper-slide .slide-overlay {
    background: none !important;
    opacity: 0 !important;
}
/* Kill the dark rounded bar on the HOME slider */
.home .slider, 
.home .hero,
.home .home-slider,
.home .main-slider,
.home .banner,
.home .carousel,
.home .slides { position: relative; }

/* Remove backgrounds on common caption/overlay wrappers */
.home .bx-caption,
.home .flex-caption,
.home .nivo-caption,
.home .slide-caption,
.home .banner-caption,
.home .slider-caption,
.home .swiper-slide .slide-caption,
.home .owl-carousel .slide-caption,
.home [class*="caption"],
.home [class*="overlay"] {
  background: transparent !important;
  opacity: 0 !important;
  box-shadow: none !important;
}

/* Also remove pseudo-element overlays (often used for the bar shape) */
.home .bx-caption::before,
.home .flex-caption::before,
.home .nivo-caption::before,
.home .slide-caption::before,
.home .banner-caption::before,
.home .slider-caption::before,
.home [class*="caption"]::before,
.home [class*="overlay"]::before,
.home [class*="caption"]::after,
.home [class*="overlay"]::after {
  content: none !important;
  display: none !important;
}

