/* Fastex Logistics - additions supporting the static JS runtime. */
html { scroll-behavior: smooth; }
[data-fx-acc] { cursor: pointer; transition: padding .35s cubic-bezier(.44,0,.56,1); }
.fx-acc-panel { width: 100%; align-self: stretch; overflow: hidden; height: 0; transition: height .35s cubic-bezier(.44,0,.56,1); }
/* Closed, the panel must leave the flex row entirely: the collapsed nav is a
 * row whose logo bar uses flex:1 0 1px, so a 100%-wide sibling would squeeze it
 * to 1px. display:none is restored to flex by JS before measuring. */
.fx-mnav-panel { display: none; flex-direction: column; align-items: flex-start;
  gap: 16px; width: 100%; overflow: hidden; height: 0;
  transition: height .35s cubic-bezier(.44,0,.56,1); }
.fx-mnav-panel.is-open { display: flex; }
[data-fx-ticker] { will-change: transform; }
@keyframes fx-ticker { from { transform: translateX(0); } to { transform: translateX(calc(-1 * var(--fx-shift, 0px))); } }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  [data-fx-ticker] { animation: none !important; }
  [data-framer-appear-id], [data-fx-split-item], [data-fx-reveal] { transition: none !important; opacity: 1 !important; transform: var(--fx-base-tf, none) !important; }
  .fx-acc-panel, .fx-mnav-panel, [data-fx-acc] { transition: none; }
}
/* No-JS fallback: never leave content invisible. */
html.no-js [data-framer-appear-id], html.no-js [data-fx-split-item], html.no-js [data-fx-reveal] { opacity: 1 !important; transform: var(--fx-base-tf, none) !important; }
html.no-js .fx-acc-panel, html.no-js .fx-mnav-panel { height: auto; }
/* ---- Framer runtime base transforms ----
 * Framer's JS applies these centering transforms at runtime to pair with
 * `left:50%`. Without its bundle they must be declared here. They are exposed
 * as a custom property so the animation runtime composes with them instead of
 * overwriting them, and so they stay breakpoint-aware: the nav only needs
 * centering below 810px, where its CSS switches to left:50%. */
.framer-YPBj2 { --fx-base-tf: translateX(-50%); }
@media (max-width: 809.98px) {
  .framer-1w4idz0-container { --fx-base-tf: translateX(-50%); }
}
[data-framer-appear-id], [data-fx-reveal] { transform: var(--fx-base-tf, none); }

/* Open state — restores the X that Framer's variant used to handle */
.framer-NNXhp.framer-v-x7hxnj .framer-133r1i8 { transform: rotate(-45deg) !important; }
.framer-NNXhp.framer-v-x7hxnj .framer-18b13og { transform: rotate(45deg) !important; }
.framer-NNXhp.framer-v-x7hxnj .framer-1en0qzr { opacity: 0 !important; }

/* Mobile nav: the closed (row) variant is now applied only once the panel is
 * out of flow, so the nav keeps its open-variant 20px row-gap for the whole
 * collapse. Ease that gap away in step with the panel height, otherwise the
 * header drops 20px in a single frame the moment the variant swaps.
 * !important is needed: the Framer variant rule is 3 classes deep. */
.fx-mnav-collapsing {
  row-gap: 0 !important;
  transition: row-gap .35s cubic-bezier(.44, 0, .56, 1);
}


/* ==========================================================
   FASTEX — CTA hover states (restores Framer behaviour)
   ========================================================== */

:root { --fx-green: #52bb4a; }

/* wrapper added by fastex.js — generates no box, layout unchanged */
a.fx-cta-link { display: contents; }

/* shared transitions (buttons currently ship with transition:all 0s) */
.framer-Q6dz3.framer-nai7wt,
.framer-15TbL.framer-h8buuf,
.framer-vzQwh.framer-18mx1ls {
  transition: background-color .3s ease, color .3s ease !important;
}
.framer-Q6dz3.framer-nai7wt::after,
.framer-vzQwh.framer-18mx1ls::after { transition: border-color .3s ease; }
.framer-Q6dz3.framer-nai7wt .framer-text,
.framer-15TbL.framer-h8buuf .framer-text { transition: color .3s ease; }
.framer-1st0zgk { transition: transform .3s ease; }

/* 1. GET A FREIGHT QUOTE — outline → solid white */
.framer-Q6dz3.framer-nai7wt:hover { background-color: #fff !important; }
.framer-Q6dz3.framer-nai7wt:hover::after { border-color: #fff !important; }
.framer-Q6dz3.framer-nai7wt:hover .framer-text { color: #000 !important; }

/* 2. APPLY TO DRIVE — white → green, arrow rotates to horizontal */
.framer-15TbL.framer-v-h8buuf:hover { background-color: var(--fx-green) !important; }
.framer-15TbL.framer-v-h8buuf:hover .framer-text { color: #fff !important; }
.framer-15TbL.framer-v-h8buuf:hover .framer-1st0zgk {
  --token-473ff22e-f387-4bda-a5fd-81579076a742: #fff;
  transform: rotate(45deg) !important;
}

/* 3. APPLY TODAY — green → white, arrow rotates to horizontal */
.framer-15TbL.framer-v-156riuj:hover { background-color: #fff !important; }
.framer-15TbL.framer-v-156riuj:hover .framer-text { color: #000 !important; }
.framer-15TbL.framer-v-156riuj:hover .framer-1st0zgk {
  --token-7d46519b-7ae3-4c0a-9383-88033d4deee8: var(--fx-green);
  transform: rotate(45deg) !important;
}

/* 4. Learn More About Us — arrow slides in, button widens */
.framer-vzQwh.framer-18mx1ls::before {
  content: "";
  order: 1;
  flex: 0 0 auto;
  width: 0;
  height: 12px;
  margin-left: -10px;          /* cancels the flex gap while hidden */
  opacity: 0;
  background-color: #fff;
  transform: rotate(45deg);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12.02 12.021'%3E%3Cpath d='M 10.021 3.414 L 1.414 12.021 L 0 10.607 L 8.607 2 L 1.02 2 L 1.02 0 L 12.02 0 L 12.02 11 L 10.02 11 L 10.02 3.414 Z' fill='%23000'/%3E%3C/svg%3E") center/contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12.02 12.021'%3E%3Cpath d='M 10.021 3.414 L 1.414 12.021 L 0 10.607 L 8.607 2 L 1.02 2 L 1.02 0 L 12.02 0 L 12.02 11 L 10.02 11 L 10.02 3.414 Z' fill='%23000'/%3E%3C/svg%3E") center/contain no-repeat;
  transition: width .3s ease, opacity .3s ease, margin-left .3s ease;
}
.framer-vzQwh.framer-18mx1ls:hover::before { width: 12px; opacity: 1; margin-left: 0; }
/* ===== Animated menu underline (desktop nav only) ===== */
@media (hover: hover) and (pointer: fine) {

  .framer-lrI2R .framer-Gh3zv.framer-1h37gh8 .framer-1o7h1wh,
  .framer-lrI2R .framer-La71C.framer-1ohan7t .framer-1at7gsx {
    left: 0;
    right: auto;
    width: 100%;
    transform: scaleX(0);
    transform-origin: right center;
    transition: transform 0.32s cubic-bezier(0.33, 1, 0.68, 1);
  }

  .framer-lrI2R .framer-Gh3zv.framer-1h37gh8:hover .framer-1o7h1wh,
  .framer-lrI2R .framer-La71C.framer-1ohan7t:hover .framer-1at7gsx {
    transform: scaleX(1);
    transform-origin: left center;
  }
}

@media (prefers-reduced-motion: reduce) {
  .framer-lrI2R .framer-Gh3zv.framer-1h37gh8 .framer-1o7h1wh,
  .framer-lrI2R .framer-La71C.framer-1ohan7t .framer-1at7gsx { transition: none; }
}