/* Visual refinement — 2026-07-13
   Shared by every public page. */
:root {
  --navy: #081E35;
  --deep: #081E35;
  --fleet-navy: #081E35;
  --fleet-navy-deep: #081E35;
}

html { -webkit-font-smoothing: antialiased; }

/* Keep the header mark present but less dominant. */
.site-header { background-color: rgba(8, 30, 53, .34); }
.site-header.scrolled,
.site-header.menu-open { background: rgba(8, 30, 53, .96) !important; }
.site-header .brand img { height: 40px; width: auto; }
.site-footer .footer-logo { height: 48px; width: auto; }
.language-switch {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  min-height: 40px;
  padding: 8px 12px;
  border: 1px solid rgba(255,255,255,.42);
  border-radius: 8px;
  color: #fff;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .03em;
  transition-property: background-color, border-color, color, transform;
  transition-duration: 180ms;
  transition-timing-function: cubic-bezier(.2, 0, 0, 1);
}
.language-switch:hover { background: rgba(255,255,255,.12); border-color: #fff; }
.language-switch:active { transform: scale(.96); }

/* Normalize dark surfaces to the site navy family. */
.dark-section,
.project-section {
  background: linear-gradient(155deg, #081E35 0%, var(--navy) 55%, #081E35 100%) !important;
}
.site-footer,
.stats-band,
.stat-card { background: var(--navy) !important; }

/* Fleet cards: a large, centered truck on an edge-to-edge navy visual surface. */
.fleet-mini-grid { gap: 22px; align-items: stretch; }
.fleet-mini.fleet-mini-polished {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  min-height: 100%;
  padding: 0 0 26px;
  overflow: hidden;
  border: 1px solid rgba(8, 30, 53, .08);
  border-radius: 20px;
  border-bottom: 0;
  box-shadow: 0 13px 32px rgba(8, 30, 53, .09), 0 2px 5px rgba(8, 30, 53, .05);
  transition-property: transform, box-shadow;
  transition-duration: 180ms;
  transition-timing-function: cubic-bezier(.2, 0, 0, 1);
}
.fleet-mini.fleet-mini-polished:hover {
  transform: translateY(-5px);
  box-shadow: 0 22px 44px rgba(8, 30, 53, .16), 0 3px 7px rgba(8, 30, 53, .06);
}
.fleet-visual,
.fleet-card-visual {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 68% 10%, rgba(255, 255, 255, .12), transparent 36%),
    linear-gradient(145deg, var(--fleet-navy), var(--fleet-navy-deep));
  box-shadow: inset 0 -1px 0 rgba(255, 255, 255, .12);
}
.fleet-visual { min-height: 174px; padding: 18px 24px; }
.fleet-visual::after,
.fleet-card-visual::after {
  content: "";
  position: absolute;
  inset: auto -16% -55% auto;
  width: 178px;
  height: 178px;
  border: 1px solid rgba(255, 255, 255, .11);
  border-radius: 50%;
}
.fleet-visual img {
  position: relative;
  z-index: 1;
  width: 174px;
  height: 132px;
  max-width: 78%;
  object-fit: contain;
}
.fleet-mini-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 22px 24px 0;
}
.fleet-mini.fleet-mini-polished h3 {
  margin: 0;
  color: var(--navy);
  font-size: clamp(24px, 2vw, 30px);
  line-height: 1.25;
  text-wrap: balance;
}
.fleet-mini.fleet-mini-polished .fleet-mini-title > span,
.fleet-card-title-row > span {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 42px;
  height: 32px;
  padding: 0 10px;
  border-radius: 999px;
  background: var(--orange);
  color: #fff;
  font-size: 13px;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
}
.fleet-mini.fleet-mini-polished p {
  margin: 12px 24px 0;
  color: #435365;
  font-size: 15.5px;
  line-height: 1.9;
  text-wrap: pretty;
}

/* The full fleet page follows the same visual language, with larger truck art. */
.fleet-card.fleet-card-enhanced {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid rgba(8, 30, 53, .09);
  border-radius: 20px;
  box-shadow: 0 13px 32px rgba(8, 30, 53, .09), 0 2px 5px rgba(8, 30, 53, .05);
  transition-property: transform, box-shadow;
  transition-duration: 180ms;
  transition-timing-function: cubic-bezier(.2, 0, 0, 1);
}
.fleet-card.fleet-card-enhanced:hover {
  transform: translateY(-5px);
  box-shadow: 0 22px 44px rgba(8, 30, 53, .16), 0 3px 7px rgba(8, 30, 53, .06);
}
.fleet-card-visual { min-height: 188px; padding: 20px 26px; }
.fleet-card-visual img {
  position: relative;
  z-index: 1;
  width: 194px;
  height: 146px;
  max-width: 82%;
  object-fit: contain;
}
.fleet-card.fleet-card-enhanced .fleet-card-head {
  min-height: 0;
  padding: 20px 24px 8px;
  color: var(--navy);
  background: #fff;
}
.fleet-card-title-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.fleet-card.fleet-card-enhanced .fleet-card-head h2 {
  margin: 0;
  color: var(--navy) !important;
  font-size: 28px;
  line-height: 1.2;
}
.fleet-card.fleet-card-enhanced .fleet-card-head small {
  display: block;
  margin-top: 10px;
  padding: 0;
  color: var(--orange);
  background: transparent;
  font-weight: 900;
}
.fleet-card.fleet-card-enhanced .fleet-card-body { padding: 10px 24px 25px; }
.fleet-card.fleet-card-enhanced .fleet-card-body p { margin: 9px 0; }
.fleet-card.fleet-card-enhanced .fleet-card-body a { display: inline-flex; margin-top: 8px; }

/* Contact gets the same distinct navy surface as the vehicle visual panels. */
.contact-panel {
  background:
    radial-gradient(circle at 82% 12%, rgba(255, 255, 255, .12), transparent 30%),
    linear-gradient(145deg, var(--fleet-navy), var(--fleet-navy-deep)) !important;
  border-radius: 20px;
  box-shadow: 0 20px 44px rgba(8, 30, 53, .16), inset 0 1px 0 rgba(255, 255, 255, .12);
}

@media (max-width: 760px) {
  .site-header .brand img { height: 32px; }
  .site-footer .footer-logo { height: 42px; }
  .fleet-visual { min-height: 160px; }
  .fleet-visual img { width: 158px; height: 120px; }
  .fleet-card-visual { min-height: 174px; }
  .fleet-card-visual img { width: 178px; height: 134px; }
}