
/* ======================================================================
   ZL1MPORT 4.6.18 — POST-CINEMATIC ART DIRECTION
   DESKTOP + MOBILE
   ----------------------------------------------------------------------
   The approved automotive cinematic and its text cards are untouched.
   This file starts at USA → BRASIL and styles only later sections.
   ====================================================================== */

:root{
  --zl18-ink:#121418;
  --zl18-muted:#686d74;
  --zl18-line:#dde1e5;
  --zl18-paper:#f5f3ef;
  --zl18-white:#ffffff;
  --zl18-silver:#eef1f3;
  --zl18-dark:#050607;
  --zl18-dark2:#0a0c10;
  --zl18-red:#e01823;
  --zl18-red2:#ff2e39;
}

/* ---------- 01 / USA → BRASIL — KEEP IT DARK ---------- */
.zl4-route-section{
  background:
    radial-gradient(circle at 72% 46%,rgba(224,24,35,.14),transparent 27%),
    linear-gradient(120deg,#040506,#0b0d11 55%,#030405) !important;
  color:#fff !important;
  border-top:1px solid #25282e !important;
}
.zl4-route-section::before{
  opacity:.26 !important;
  background:
    linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px) !important;
  background-size:64px 64px !important;
}
.zl4-route-copy>small{color:#a9adb4 !important}
.zl4-route-copy h2{color:#fff !important}
.zl4-route-copy h2 em{color:var(--zl18-red2) !important}
.zl4-route-copy>p{color:#aeb2b9 !important}
.zl4-route-points span{
  color:#cfd1d5 !important;
  border-top-color:#292d34 !important;
}
.zl4-route-stage{
  border-color:#242830 !important;
  background:radial-gradient(circle at 50% 48%,#11141a,#06070a 67%) !important;
  box-shadow:0 35px 80px rgba(0,0,0,.38) !important;
}
.zl4-route-grid{
  opacity:.24 !important;
  background:
    linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px) !important;
  background-size:54px 54px !important;
}
.zl4-route-node strong{color:#fff !important}
.zl4-route-node small{color:#777d86 !important}
.zl4-route-plane svg{fill:#fff !important}
.zl4-route-caption{color:#858a93 !important}
.zl4-route-caption i{border-color:#393e47 !important}

/* ---------- 02 / IMPORTAÇÃO SOB MEDIDA — LIGHT ---------- */
.zl4-import-expertise{
  position:relative;
  overflow:hidden;
  padding:96px 5vw 102px;
  color:var(--zl18-ink);
  background:
    radial-gradient(circle at 92% 0%,rgba(224,24,35,.07),transparent 28%),
    linear-gradient(180deg,#faf9f7 0%,#f1f3f4 100%);
  border-top:1px solid #e4e6e8;
  border-bottom:1px solid #dfe3e6;
}
.zl4-import-expertise::before{
  content:"";
  position:absolute;
  left:-8%;
  bottom:-50%;
  width:46vw;
  height:46vw;
  border-radius:50%;
  background:radial-gradient(circle,rgba(28,61,82,.08),transparent 66%);
  pointer-events:none;
}
.zl4-import-expertise-inner{
  position:relative;
  z-index:2;
  max-width:1320px;
  margin:0 auto;
  display:grid;
  grid-template-columns:.82fr 1.18fr;
  gap:5vw;
  align-items:center;
}
.zl4-import-expertise-copy{
  max-width:580px;
}
.zl4-import-expertise-copy>small{
  display:block;
  color:#c91b25;
  font-size:9px;
  font-weight:950;
  letter-spacing:.20em;
}
.zl4-import-expertise-copy h2{
  margin:12px 0 18px;
  color:#14161a;
  font-size:clamp(46px,4.8vw,78px);
  line-height:.91;
  letter-spacing:-.045em;
  font-style:italic;
}
.zl4-import-expertise-copy h2 em{
  color:#d71924;
  font-style:normal;
}
.zl4-import-expertise-copy p{
  max-width:570px;
  margin:0;
  color:#646a71;
  line-height:1.72;
  font-size:14px;
}
.zl4-import-expertise-tags{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin:23px 0 24px;
}
.zl4-import-expertise-tags span{
  padding:8px 10px;
  border:1px solid #d7dce0;
  border-radius:999px;
  background:#fff;
  color:#4f555c;
  font-size:9px;
  font-weight:850;
}
.zl4-import-expertise-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
}
.zl4-import-expertise-grid article{
  position:relative;
  min-height:290px;
  padding:28px 24px;
  overflow:hidden;
  border:1px solid #dfe3e6;
  border-radius:20px;
  background:#fff;
  box-shadow:0 18px 46px rgba(34,41,47,.055);
  transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease;
}
.zl4-import-expertise-grid article:hover{
  transform:translateY(-7px);
  border-color:#cdd3d8;
  box-shadow:0 24px 58px rgba(34,41,47,.09);
}
.zl4-import-expertise-grid article::after{
  content:"";
  position:absolute;
  right:-58px;
  bottom:-58px;
  width:170px;
  height:170px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(224,24,35,.11),transparent 67%);
}
.zl4-import-expertise-grid b{
  display:block;
  margin-bottom:44px;
  color:#e5e8ea;
  font-size:54px;
  line-height:.8;
  font-weight:300;
  font-style:italic;
}
.zl4-import-expertise-grid small{
  display:block;
  color:#c91b25;
  font-size:8px;
  font-weight:950;
  letter-spacing:.18em;
}
.zl4-import-expertise-grid h3{
  margin:11px 0 10px;
  color:#16181c;
  font-size:21px;
  line-height:1.08;
}
.zl4-import-expertise-grid p{
  margin:0;
  color:#6a7077;
  font-size:11.5px;
  line-height:1.58;
}

/* ---------- 03 / PARTS UNIVERSE — DARK ---------- */
.zl4-parts-universe{
  background:
    radial-gradient(circle at 12% 8%,rgba(224,24,35,.09),transparent 28%),
    linear-gradient(145deg,#050607,#090b0e) !important;
  color:#fff !important;
  border-top:1px solid #282c32 !important;
}
.zl4-parts-universe .zl4-section-title small{color:#9da2aa !important}
.zl4-parts-universe .zl4-section-title h2{color:#fff !important}
.zl4-parts-universe .zl4-section-title h2 em{color:#fff !important}
.zl4-parts-universe .zl4-section-title p{color:#92979f !important}
.zl4-part-card{
  background:linear-gradient(145deg,#0e1014,#08090c) !important;
  border-color:#292d34 !important;
  color:#fff !important;
  box-shadow:none !important;
}
.zl4-part-card>b{color:#42464f !important}
.zl4-part-card>span{
  color:var(--zl18-red2) !important;
  border-color:#343941 !important;
  background:transparent !important;
}
.zl4-part-card h3{color:#fff !important}
.zl4-part-card p{color:#8e939c !important}
.zl4-part-card button{color:#fff !important}

/* ---------- 04 / COMO FUNCIONA — LIGHT ---------- */
.zl4-how.zl4-how-premium{
  background:
    radial-gradient(circle at 100% 0%,rgba(60,109,143,.08),transparent 28%),
    #f4f6f7 !important;
  color:var(--zl18-ink) !important;
  border-top:1px solid #dfe3e6 !important;
}
.zl4-how-copy small{color:#c91b25 !important}
.zl4-how-copy h2{color:#15171b !important}
.zl4-how-copy h2 em{color:#d71924 !important}
.zl4-how-copy p{color:#656b72 !important}
.zl4-how-steps:before{border-top-color:#d71924 !important}
.zl4-how-steps article{
  color:#15171b !important;
}
.zl4-how-steps i{
  background:#fff !important;
  color:#17191d !important;
  border-color:#d4d9dd !important;
  box-shadow:0 12px 28px rgba(32,38,44,.05);
}
.zl4-how-steps h3{color:#17191d !important}
.zl4-how-steps p{color:#6d7279 !important}

/* ---------- 05 / POR QUE — DARK ---------- */
.zl4-why{
  background:
    radial-gradient(circle at 78% 15%,rgba(224,24,35,.09),transparent 30%),
    #07090c !important;
  color:#fff !important;
  border-top:1px solid #282c32 !important;
}
.zl4-why-copy h2{color:#fff !important}
.zl4-why-copy>p{color:#a5aab2 !important}
.zl4-why-grid article{
  background:#0d0f12 !important;
  border-color:#292d34 !important;
  color:#fff !important;
  box-shadow:none !important;
}
.zl4-why-grid h3{color:#fff !important}
.zl4-why-grid p{color:#8f949c !important}

/* ---------- 06 / IMPORT REQUEST — LIGHT SPLIT ---------- */
.zl4-import.zl4-import-premium{
  background:#f5f3ef !important;
  color:var(--zl18-ink) !important;
  border-top:1px solid #dfded9 !important;
}
.zl4-import-premium .zl4-import-car{
  background:
    radial-gradient(circle at 50% 48%,#191c21,#08090c 68%) !important;
}
.zl4-import-copy{
  background:#f5f3ef !important;
}
.zl4-import-copy small{color:#c91b25 !important}
.zl4-import-copy h2{color:#14161a !important}
.zl4-import-copy p{color:#656a71 !important}
.zl4-import-tags span{
  background:#fff !important;
  border-color:#d7d9dc !important;
  color:#4f555c !important;
}

/* ---------- 07 / ABOUT — DARK ---------- */
.zl4-about.zl4-about-premium{
  background:#07090b !important;
  color:#fff !important;
  border-top:1px solid #272b31 !important;
}
.zl4-about-premium .zl4-about-visual{
  background:radial-gradient(circle at 50% 50%,#171a20,#060709 68%) !important;
}
.zl4-about-copy{
  background:#07090b !important;
}
.zl4-about-copy>small{color:#a6a9af !important}
.zl4-about-copy h2{color:#fff !important}
.zl4-about-copy p{color:#afb2b9 !important}
.zl4-about-copy strong{color:#fff !important}
.zl4-about-points{color:#c3c5ca !important}

/* ---------- 08 / FINAL CTA — LIGHT ACCENT ---------- */
.zl4-final-cta{
  background:
    radial-gradient(circle at 50% 50%,rgba(224,24,35,.13),transparent 42%),
    linear-gradient(180deg,#fff3f0,#f8f1ed) !important;
  color:var(--zl18-ink) !important;
  border-top:1px solid #eadbd7 !important;
}
.zl4-final-glow{
  background:radial-gradient(ellipse,rgba(224,24,35,.16),rgba(224,24,35,.035) 42%,transparent 68%) !important;
}
.zl4-final-copy small{color:#c91b25 !important}
.zl4-final-copy h2{color:#15171b !important}
.zl4-final-copy p{color:#646a71 !important}
.zl4-final-copy .zl4-btn:not(.primary){
  background:#fff !important;
  color:#15171b !important;
  border-color:#d7d9dc !important;
}

/* ---------- 09 / DESTAQUES — LIGHT SHOWROOM ---------- */
.zl4-catalog.zl4-catalog-last{
  background:
    radial-gradient(circle at 50% 0%,rgba(224,24,35,.055),transparent 26%),
    #eef1f3 !important;
  color:var(--zl18-ink) !important;
  border-top:1px solid #dce1e4 !important;
}
.zl4-catalog-last .zl4-section-title small{
  color:#c91b25 !important;
  font-weight:950;
}
.zl4-catalog-last .zl4-section-title h2{
  color:#15171b !important;
}
.zl4-catalog-last .zl4-section-title h2 em{
  color:#d71924 !important;
}
.zl4-catalog-last .zl4-fitment{
  padding:14px;
  border:1px solid #d8dde1;
  border-radius:16px;
  background:#fff;
  box-shadow:0 12px 32px rgba(31,38,44,.055);
}
.zl4-catalog-last .zl4-fitment select,
.zl4-catalog-last .zl4-fitment input{
  background:#f8f9fa !important;
  color:#15171b !important;
  border-color:#d6dbe0 !important;
}
.zl4-catalog-last .zl4-fitment button{
  background:#15171b !important;
  color:#fff !important;
  border-color:#15171b !important;
}
.zl4-catalog-last .zl4-product{
  overflow:hidden;
  border:1px solid #d9dee2 !important;
  border-radius:20px;
  background:#fff !important;
  box-shadow:0 16px 38px rgba(30,36,42,.07) !important;
}
.zl4-catalog-last .zl4-product:hover{
  transform:translateY(-6px);
  border-color:#cbd1d6 !important;
  box-shadow:0 24px 50px rgba(30,36,42,.12) !important;
}
.zl4-catalog-last .zl4-product-image{
  background:
    radial-gradient(circle at 50% 52%,rgba(224,24,35,.06),transparent 45%),
    linear-gradient(145deg,#f9fafb,#e7ebee) !important;
}
.zl4-catalog-last .zl4-product-info{
  background:#fff !important;
}
.zl4-catalog-last .zl4-product-info small{color:#9b5257 !important}
.zl4-catalog-last .zl4-product-info h3,
.zl4-catalog-last .zl4-product-info h3 a,
.zl4-catalog-last .zl4-product-info strong{
  color:#17191d !important;
}
.zl4-catalog-last .zl4-product-info p{
  color:#697078 !important;
}
.zl4-catalog-last .product-order-link{
  color:#c91b25 !important;
}
.zl4-catalog-last .zl4-view-all{
  background:#fff !important;
  color:#17191d !important;
  border-color:#d4d9dd !important;
}

/* ===============================================================
   MOBILE — same design direction, optimized spacing.
   Route remains dark; new content is NOT mobile-only.
   =============================================================== */
@media(max-width:820px){

  .zl4-import-expertise{
    padding:70px 18px 74px;
  }
  .zl4-import-expertise-inner{
    grid-template-columns:1fr;
    gap:30px;
  }
  .zl4-import-expertise-copy h2{
    font-size:clamp(39px,10.7vw,55px);
  }
  .zl4-import-expertise-copy p{
    font-size:13px;
    line-height:1.62;
  }
  .zl4-import-expertise-grid{
    grid-template-columns:1fr;
    gap:9px;
  }
  .zl4-import-expertise-grid article{
    min-height:0;
    padding:22px 20px;
    border-radius:17px;
  }
  .zl4-import-expertise-grid b{
    position:absolute;
    right:18px;
    top:18px;
    margin:0;
    font-size:44px;
  }
  .zl4-import-expertise-grid p{
    max-width:86%;
  }

  /* 4.6.16 had made USA→Brasil light. Restore dark decisively. */
  .zl4-route-section{
    padding:72px 18px 66px !important;
    background:
      radial-gradient(circle at 72% 34%,rgba(224,24,35,.14),transparent 28%),
      linear-gradient(180deg,#07090c,#030405) !important;
    color:#fff !important;
    border-top:1px solid #25282e !important;
  }
  .zl4-route-section::before{
    opacity:.22 !important;
    background:
      linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),
      linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px) !important;
    background-size:42px 42px !important;
  }
  .zl4-route-copy>small{color:#a9adb4 !important}
  .zl4-route-copy h2{
    color:#fff !important;
    font-size:clamp(40px,11.4vw,58px) !important;
  }
  .zl4-route-copy>p{color:#aeb2b9 !important}
  .zl4-route-points span{
    color:#cfd1d5 !important;
    border-top-color:#292d34 !important;
  }
  .zl4-route-stage{
    height:330px !important;
    margin-top:28px !important;
    border:1px solid #242830 !important;
    border-radius:20px !important;
    background:radial-gradient(circle at 50% 48%,#11141a,#06070a 67%) !important;
    box-shadow:0 20px 50px rgba(0,0,0,.28) !important;
  }
  .zl4-route-grid{
    opacity:.24 !important;
    background:
      linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),
      linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px) !important;
    background-size:42px 42px !important;
  }
  .zl4-route-node strong{color:#fff !important}
  .zl4-route-node small{color:#777d86 !important}
  .zl4-route-plane svg{fill:#fff !important}
  .zl4-route-caption{color:#858a93 !important}
  .zl4-route-caption i{border-color:#393e47 !important}

  /* Parts returns to dark on mobile: alternating light/dark is intentional. */
  .zl4-parts-universe{
    padding:68px 18px 74px !important;
    background:
      radial-gradient(circle at 10% 7%,rgba(224,24,35,.08),transparent 27%),
      #06080a !important;
    color:#fff !important;
    border-top:1px solid #282c32 !important;
  }
  .zl4-parts-universe .zl4-section-title small{color:#9da2aa !important}
  .zl4-parts-universe .zl4-section-title h2{color:#fff !important}
  .zl4-parts-universe .zl4-section-title h2 em{color:#fff !important}
  .zl4-parts-universe .zl4-section-title p{color:#92979f !important}
  .zl4-part-card{
    min-height:210px !important;
    padding:24px !important;
    border:1px solid #292d34 !important;
    border-radius:18px !important;
    background:linear-gradient(145deg,#0e1014,#08090c) !important;
    color:#fff !important;
    box-shadow:none !important;
  }
  .zl4-part-card>b{color:#42464f !important}
  .zl4-part-card>span{
    border-color:#343941 !important;
    background:transparent !important;
    color:var(--zl18-red2) !important;
  }
  .zl4-part-card h3{color:#fff !important}
  .zl4-part-card p{color:#8e939c !important}
  .zl4-part-card button{color:#fff !important}

  .zl4-how.zl4-how-premium{
    padding:70px 18px 76px !important;
    background:#f4f6f7 !important;
    color:#15171b !important;
  }
  .zl4-how-copy{padding:0 !important}
  .zl4-how-copy h2{color:#15171b !important}
  .zl4-how-copy p{color:#656b72 !important}
  .zl4-how-steps article{
    padding:12px 0 !important;
  }
  .zl4-how-steps i{
    background:#fff !important;
    color:#15171b !important;
    border-color:#d4d9dd !important;
  }
  .zl4-how-steps h3{color:#17191d !important}
  .zl4-how-steps p{color:#6d7279 !important}

  .zl4-why{
    padding:72px 18px 76px !important;
    background:#07090c !important;
    color:#fff !important;
  }
  .zl4-why-copy h2{color:#fff !important}
  .zl4-why-copy>p{color:#a5aab2 !important}
  .zl4-why-grid article{
    background:#0d0f12 !important;
    border-color:#292d34 !important;
    color:#fff !important;
  }
  .zl4-why-grid h3{color:#fff !important}
  .zl4-why-grid p{color:#8f949c !important}

  .zl4-import.zl4-import-premium{
    background:#f5f3ef !important;
    color:#15171b !important;
  }
  .zl4-import-copy{
    padding:42px 22px 72px !important;
    background:#f5f3ef !important;
  }
  .zl4-import-copy h2{color:#14161a !important}
  .zl4-import-copy p{color:#656a71 !important}
  .zl4-import-tags span{
    background:#fff !important;
    color:#4f555c !important;
    border-color:#d7d9dc !important;
  }

  .zl4-about.zl4-about-premium{
    background:#07090b !important;
    color:#fff !important;
  }
  .zl4-about-copy{
    padding:56px 22px !important;
    background:#07090b !important;
  }
  .zl4-about-copy h2{color:#fff !important}
  .zl4-about-copy p{color:#afb2b9 !important}

  .zl4-final-cta{
    padding:72px 18px !important;
    background:
      radial-gradient(circle at 50% 50%,rgba(224,24,35,.13),transparent 44%),
      #fff3f0 !important;
    color:#15171b !important;
  }
  .zl4-final-copy h2{color:#15171b !important}
  .zl4-final-copy p{color:#646a71 !important}

  .zl4-catalog.zl4-catalog-last{
    padding:68px 18px 76px !important;
    background:#eef1f3 !important;
    color:#15171b !important;
  }
  .zl4-catalog-last .zl4-fitment{
    padding:12px !important;
    background:#fff !important;
    border:1px solid #d8dde1 !important;
    border-radius:16px !important;
  }
  .zl4-catalog-last .zl4-product{
    border-radius:18px !important;
    background:#fff !important;
    border-color:#d9dee2 !important;
    box-shadow:0 14px 34px rgba(30,36,42,.07) !important;
  }
  .zl4-catalog-last .zl4-product-image{
    background:
      radial-gradient(circle at 50% 52%,rgba(224,24,35,.06),transparent 45%),
      linear-gradient(145deg,#f9fafb,#e7ebee) !important;
  }
  .zl4-catalog-last .zl4-product-info{background:#fff !important}
}
