/* Fleet Range — redesigned cards (home page) */
#fleet-range .fx-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;max-width:1240px;margin:0 auto}
.fx-card{all:unset;box-sizing:border-box;display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:22px;overflow:hidden;cursor:pointer;text-align:left;
  box-shadow:0 2px 6px rgba(19,37,57,.05),0 14px 34px rgba(19,37,57,.07);transition:transform .35s cubic-bezier(.215,.61,.355,1),box-shadow .35s,border-color .35s}
.fx-card:hover,.fx-card:focus-visible{transform:translateY(-6px);border-color:rgba(42,86,214,.35);box-shadow:0 4px 10px rgba(19,37,57,.06),0 26px 50px rgba(42,86,214,.16)}
.fx-card:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.fx-media{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--panel-light)}
.fx-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .7s cubic-bezier(.215,.61,.355,1)}
.fx-card:hover .fx-media img{transform:scale(1.06)}
.fx-media::after{content:"";position:absolute;inset:auto 0 0 0;height:45%;background:linear-gradient(to top,rgba(19,37,57,.55),transparent);pointer-events:none}
.fx-size{position:absolute;left:16px;top:16px;z-index:2;display:flex;align-items:baseline;gap:5px;background:var(--panel-dark);color:#fff;padding:8px 16px;border-radius:99px;box-shadow:0 6px 18px rgba(19,37,57,.35)}
.fx-size b{font-family:'Archivo Black',sans-serif;font-size:24px;line-height:1;font-weight:400}
.fx-size span{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--frost)}
.fx-pay{position:absolute;right:16px;bottom:14px;z-index:2;color:#fff;text-align:right;line-height:1.1}
.fx-pay b{font-family:'Archivo Black',sans-serif;font-size:34px;font-weight:400;display:block}
.fx-pay span{font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;opacity:.9}
.fx-body{padding:20px 22px 22px;display:flex;flex-direction:column;gap:14px;flex:1}
.fx-dims{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:600;color:var(--ink)}
.fx-dims svg{width:20px;height:20px;color:var(--accent);flex:none}
.fx-dims small{color:var(--muted);font-weight:500;font-size:12px;margin-left:auto;letter-spacing:.06em;text-transform:uppercase}
.fx-cargo{list-style:none;margin:0;padding:0;display:grid;gap:0;border-top:1px solid var(--line)}
.fx-cargo li{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px dashed var(--line);font-size:14px}
.fx-cargo li span{color:var(--muted)}
.fx-cargo li b{color:var(--accent);font-weight:800;font-size:15px;background:var(--accent-tint);padding:3px 12px;border-radius:99px;white-space:nowrap}
.fx-more{margin-top:auto;display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent)}
.fx-more svg{width:16px;height:16px;transition:transform .3s}
.fx-card:hover .fx-more svg{transform:translateX(5px)}
@media (max-width:1024px){#fleet-range .fx-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}}
@media (max-width:640px){
  #fleet-range .fx-grid{grid-template-columns:1fr;gap:18px}
  .fx-body{padding:16px 18px 18px}
  .fx-size b{font-size:21px}.fx-pay b{font-size:28px}
}

/* CSS-only entrance (always ends visible, no JS needed) */
@keyframes fxIn{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
.fx-card{animation:fxIn .6s cubic-bezier(.215,.61,.355,1) both}
.fx-card:nth-child(2){animation-delay:.07s}.fx-card:nth-child(3){animation-delay:.14s}
.fx-card:nth-child(4){animation-delay:.21s}.fx-card:nth-child(5){animation-delay:.28s}.fx-card:nth-child(6){animation-delay:.35s}
@media (prefers-reduced-motion:reduce){.fx-card{animation:none}}
