/* Homepage vehicle preview follows the public app's CustomerVehicleCard. */
.reference-fleet-card__title-link { color: inherit; text-decoration: none; }
.reference-fleet-mobile-footer { display: none; }
.reference-fleet-card__image img[hidden] { display: none; }
.reference-fleet-card__placeholder {
  width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 14px; padding: 22px 16px 52px; color: #b5b9ad; background: radial-gradient(ellipse at 50% 40%, #34382f, #151716 75%);
  font: 12px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
.reference-fleet-card__placeholder svg { width: 70px; height: 44px; color: #c6a36a; opacity: .75; }
@media (max-width: 767px) {
  .reference-fleet {
    --fc-home-gold: #c6a36a; --fc-home-paper: #f4f2ed;
    padding: 36px 0 40px; background: var(--fc-home-paper); color: #111; scroll-margin-top: 88px;
    font: 14px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  }
  .reference-fleet *, .reference-fleet *::before, .reference-fleet *::after { box-sizing: border-box; }
  .reference-fleet > .container { width: 100%; padding-inline: 20px; }
  .reference-fleet .reference-section-head { display: block; margin: 0 0 22px; padding: 0; }
  .reference-fleet .reference-section-head .eyebrow { margin: 0 0 9px; color: #947c55; font-family: inherit; font-size: 10px; font-weight: 600; line-height: 1.4; letter-spacing: 1.8px; }
  .reference-fleet .reference-section-head h2 { max-width: 330px; margin: 0; color: #111; font-family: inherit; font-size: 29px; font-weight: 600; line-height: 1.12; letter-spacing: -.9px; text-transform: none; }
  .reference-fleet .reference-section-head > .text-link { display: none; }
  .reference-fleet .reference-fleet-grid {
    display: flex; align-items: stretch; gap: 14px; margin: 0 -20px; padding: 0 20px 18px;
    overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scroll-padding-inline: 20px;
    scrollbar-width: none; -webkit-overflow-scrolling: touch;
  }
  .reference-fleet-grid::-webkit-scrollbar { display: none; }
  .reference-fleet .reference-fleet-grid > div { flex: 0 0 calc(100% - 28px); min-width: 0; scroll-snap-align: start; }
  .reference-fleet .reference-fleet-card {
    display: flex; flex-direction: column; position: relative; height: 100%; overflow: hidden;
    color: #fff; border: 1px solid #c6a36a3d; border-radius: 24px;
    background: radial-gradient(ellipse at 85% 10%, #c6a36a0e, transparent 65%), linear-gradient(135deg, #222522 0%, #151716 35%, #080909 100%);
    box-shadow: 0 8px 18px #00000013; transition: none;
  }
  .reference-fleet .reference-fleet-card::after { content: ""; position: absolute; pointer-events: none; width: 140%; height: 45px; left: -20%; bottom: -29px; border: 1px solid #c6a36a26; border-radius: 50%; }
  .reference-fleet .reference-fleet-card:hover { transform: none; box-shadow: 0 8px 18px #00000013; }
  .reference-fleet .reference-fleet-card__image { flex: 0 0 auto; aspect-ratio: 1.65; background: #222522; }
  .reference-fleet .reference-fleet-card__image::after { content: ""; position: absolute; inset: 50% 0 0; pointer-events: none; background: linear-gradient(transparent, #08090959); }
  .reference-fleet .reference-fleet-card__image img { display: block; width: 100%; height: 100%; object-fit: cover; }
  .reference-fleet .reference-fleet-card__image img[hidden] { display: none; }
  .reference-fleet .reference-fleet-card:hover .reference-fleet-card__image img { transform: none; }
  .reference-fleet .reference-fleet-card__image > span {
    z-index: 1; left: 14px; bottom: 14px; display: inline-flex; align-items: center; gap: 7px;
    padding: 8px 12px; border: 1px solid #c6a36a47; border-radius: 20px; background: #fffffff0;
    color: #2f654b; font-size: 11px; font-weight: 600; line-height: 1.4;
  }
  .reference-fleet .reference-fleet-card__image > span i { width: 7px; height: 7px; background: #34815b; box-shadow: 0 0 0 3px #34815b14; }
  .reference-fleet .reference-fleet-card__image > span.is-requested { color: #85642d; }
  .reference-fleet .reference-fleet-card__image > span.is-requested i { background: #a78343; box-shadow: 0 0 0 3px #a7834314; }
  .reference-fleet .reference-fleet-card__body { flex: 1; display: flex; flex-direction: column; padding: 18px; }
  .reference-fleet .reference-fleet-card__body > p { order: 0; margin: 0 0 5px; font-family: inherit; color: var(--fc-home-gold); font-size: 10px; font-weight: 600; line-height: 1.4; letter-spacing: 1.8px; }
  .reference-fleet .reference-fleet-card h3 { order: 1; min-height: 0; margin: 0; color: #fff; font-family: inherit; font-size: 23px; font-weight: 600; line-height: 1.2; letter-spacing: -.6px; text-transform: none; overflow-wrap: anywhere; }
  .reference-fleet-card__title-link::after { content: ""; position: absolute; inset: 0; }
  .reference-fleet .reference-fleet-card__bottom { order: 2; display: flex; flex-wrap: wrap; gap: 7px; padding: 0; margin: 13px 0 17px; border: 0; }
  .reference-fleet .reference-fleet-card__bottom .reference-fleet-spec { display: inline-flex; align-items: center; gap: 5px; padding: 7px 9px; border: 1px solid #c6a36a24; border-radius: 10px; background: #ffffff0b; color: #c2c5c1; font-size: 11px; font-weight: 400; line-height: 1.3; white-space: normal; overflow-wrap: anywhere; }
  .reference-fleet .reference-fleet-card__bottom .reference-fleet-spec svg { flex: 0 0 13px; width: 13px; height: 13px; color: var(--fc-home-gold); }
  .reference-fleet .reference-fleet-card__price { order: 3; margin: auto 0 0; padding: 15px 52px 0 0; border-top: 1px solid #3a3b33; color: #b5b9ad; font-size: 12px; line-height: 1.5; }
  .reference-fleet-card__price::before { content: "Prenájom"; display: block; margin-bottom: 7px; color: #b5b9ad; font-size: 11px; }
  .reference-fleet .reference-fleet-card__price strong { color: #f0d59a; font-size: 30px; font-weight: 600; line-height: 1.2; letter-spacing: -.8px; }
  .reference-fleet .reference-fleet-card__bottom > a { position: absolute; z-index: 1; right: 18px; bottom: 18px; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 13px; color: #111; background: linear-gradient(135deg, #dfc18c, #c6a36a); }
  .reference-fleet .reference-fleet-card__bottom > a svg { width: 21px; height: 21px; transform: rotate(-45deg); }
  .reference-fleet .reference-fleet-card:focus-within { outline: 2px solid #b38c4f; outline-offset: -3px; }
  .reference-fleet-mobile-footer { display: block; }
  .reference-fleet-mobile-nav { display: flex; align-items: center; gap: 14px; margin: 0 0 18px; }
  .reference-fleet-mobile-nav[hidden] { display: none; }
  .reference-fleet-mobile-position { flex: 0 0 auto; color: #78786f; font-size: 12px; font-variant-numeric: tabular-nums; }
  .reference-fleet-mobile-progress { flex: 1; height: 2px; max-width: 150px; background: #dfdcd2; overflow: hidden; }
  .reference-fleet-mobile-progress i { display: block; width: var(--progress, 25%); height: 100%; background: var(--fc-home-gold); transition: width .2s ease; }
  .reference-fleet-mobile-arrows { display: flex; gap: 8px; margin-left: auto; }
  .reference-fleet-mobile-arrows button { width: 44px; height: 44px; display: grid; place-items: center; padding: 0; border: 1px solid #c6a36a4d; border-radius: 14px; color: #947239; background: #fff; cursor: pointer; }
  .reference-fleet-mobile-arrows button:disabled { opacity: .35; cursor: default; }
  .reference-fleet .reference-fleet-mobile-all { display: flex; justify-content: center; align-items: center; gap: 12px; min-height: 52px; padding: 14px; border: 1px solid #c6a36a; border-radius: 16px; background: linear-gradient(135deg, #dfc18c, #c6a36a); color: #111; font-size: 14px; font-weight: 600; line-height: 1.4; text-align: center; text-decoration: none; box-shadow: 0 5px 14px #c6a36a1a; }
  .reference-fleet :focus-visible { outline: 2px solid #b38c4f; outline-offset: 3px; }
  @media (prefers-reduced-motion: reduce) { .reference-fleet-mobile-progress i { transition: none; } }
}