/* Kult Auto Premium 2.1 — mobile/UI corrections approved after real-device QA */

/* Keep interactive icons consistent */
.ka-menu-toggle{
  align-items:center;
  justify-content:center;
  color:var(--ka-gold);
  cursor:pointer;
}
.ka-menu-toggle__icon{width:24px;height:24px;display:block;color:var(--ka-gold)}
.ka-footer__contact-block .ka-icon{width:22px;height:22px;flex:0 0 22px}

/* Selectable budget pills */
.ka-budget-pills button{
  appearance:none;
  -webkit-appearance:none;
  padding:9px 14px;
  border:1px solid rgba(214,181,109,.38);
  border-radius:999px;
  background:rgba(1,18,14,.55);
  color:var(--ka-gold);
  font:inherit;
  cursor:pointer;
  transition:border-color .2s ease,background .2s ease,color .2s ease,transform .2s ease;
}
.ka-budget-pills button:hover,
.ka-budget-pills button.is-selected{
  border-color:var(--ka-gold);
  background:rgba(214,181,109,.12);
  color:var(--ka-gold-light);
}
.ka-budget-pills button:focus-visible{outline:2px solid var(--ka-gold-light);outline-offset:3px}
.ka-budget-pills + .ka-btn[disabled]{opacity:.45;cursor:not-allowed;filter:saturate(.5)}
.ka-budget-choice-hint{margin:10px 0 0!important;color:#91a09b!important;font-size:.76rem!important}

/* One clean frame around the Why image, not several nested-looking borders */
.ka-why__visual{
  border:0!important;
  padding:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.ka-why__visual img{
  display:block;
  border:1px solid rgba(214,181,109,.52);
  border-radius:18px;
  box-shadow:0 24px 70px rgba(0,0,0,.24);
}

/* Default demo photos already contain the "ПЕРЕВІРЕНО" label. Never duplicate it. */
.ka-car-card--fallback-image .ka-car-card__badge{display:none!important}

/* Mobile phones */
@media (max-width:767px){
  /* 1. Visible, usable menu button */
  .ka-header{height:70px!important;--ka-header-height:70px}
  .ka-header__inner{grid-template-columns:minmax(0,1fr) 44px 48px!important;gap:10px!important}
  .ka-header__contact{display:flex!important;margin:0!important}
  .ka-header__phone{width:44px!important;height:44px!important}
  .ka-menu-toggle{
    display:inline-flex!important;
    width:48px!important;
    height:48px!important;
    margin:0!important;
    padding:0!important;
    border:1px solid rgba(214,181,109,.42)!important;
    border-radius:11px!important;
    background:#03130f!important;
    z-index:1002;
  }
  .ka-menu-toggle__icon{width:26px;height:26px;stroke-width:2}
  .ka-nav{top:70px!important;z-index:1000}

  /* Hero and 2. prevent stats from overlapping trust/content */
  .ka-hero{
    min-height:0!important;
    padding-top:70px!important;
    overflow:hidden;
  }
  .ka-hero__media{
    inset:70px 0 0 0!important;
    background-position:62% 16%!important;
    background-size:auto 58%!important;
    background-repeat:no-repeat!important;
    opacity:.88!important;
  }
  .ka-hero__shade{
    inset:70px 0 0!important;
    background:linear-gradient(180deg,rgba(2,15,12,.12) 0%,rgba(2,15,12,.46) 32%,rgba(2,15,12,.92) 60%,#020f0c 78%,#020f0c 100%)!important;
  }
  .ka-hero__inner{
    min-height:690px!important;
    align-items:flex-end!important;
  }
  .ka-hero__content{
    width:100%!important;
    padding:270px 0 34px!important;
  }
  .ka-hero h1{font-size:clamp(2.45rem,11.8vw,3.7rem)!important;line-height:1.03!important}
  .ka-hero__lead{font-size:1rem!important;line-height:1.62!important}
  .ka-hero__trust{grid-template-columns:1fr!important;margin-bottom:0!important}
  .ka-hero__stats{
    position:relative!important;
    left:auto!important;
    right:auto!important;
    bottom:auto!important;
    height:auto!important;
    min-height:0!important;
  }
  .ka-stats-grid{height:auto!important;grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .ka-stat{min-height:102px!important;padding:18px 10px!important;display:flex!important;flex-direction:column;justify-content:center}
  .ka-stat:nth-child(2n){border-right:0!important}
  .ka-stat:nth-child(-n+2){border-bottom:1px solid rgba(214,181,109,.18)!important}
  .ka-stat:nth-child(n+3){border-bottom:0!important}
  .ka-stat strong{font-size:1.18rem!important}

  /* 3. Category photos must show the whole approved image */
  .ka-budget-card img{
    width:100%!important;
    height:auto!important;
    aspect-ratio:auto!important;
    object-fit:contain!important;
    object-position:center!important;
    background:#020e0b;
  }
  .ka-budget-card{display:block!important}

  /* 4. Auction partners as a clean horizontal rail */
  .ka-auctions{padding:28px 0!important}
  .ka-auctions__inner{display:block!important}
  .ka-auctions p{
    margin:0 0 16px!important;
    max-width:100%!important;
    font-size:.7rem!important;
    line-height:1.45!important;
    letter-spacing:.08em!important;
    white-space:normal!important;
  }
  .ka-auctions__logos{
    display:flex!important;
    flex-wrap:nowrap!important;
    gap:10px!important;
    overflow-x:auto!important;
    overscroll-behavior-x:contain;
    scroll-snap-type:x proximity;
    scrollbar-width:none;
    padding:2px 0 8px;
    justify-content:flex-start!important;
  }
  .ka-auctions__logos::-webkit-scrollbar{display:none}
  .ka-auctions__logos span{
    flex:0 0 auto!important;
    min-width:112px!important;
    min-height:48px!important;
    padding:0 16px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    border:1px solid rgba(214,181,109,.16)!important;
    border-radius:10px!important;
    background:rgba(3,25,20,.65)!important;
    scroll-snap-align:start;
    font-size:.93rem!important;
  }

  /* 5. Calculator mobile layout */
  .ka-calculator-section .ka-section-heading{margin-bottom:26px!important}
  .ka-calc{
    grid-template-columns:1fr!important;
    gap:18px!important;
    padding:16px!important;
    border-radius:18px!important;
  }
  .ka-calc__form{grid-template-columns:1fr!important;gap:14px!important}
  .ka-field--wide{grid-column:auto!important}
  .ka-calc__addons{grid-template-columns:1fr!important}
  .ka-calc__result{padding:22px 18px!important;border-radius:14px!important}
  .ka-calc__result>strong{font-size:clamp(1.85rem,9vw,2.6rem)!important}
  .ka-calc__result dl div{gap:10px!important}
  .ka-calc__result dt{font-size:.82rem}
  .ka-calc__result dd{white-space:nowrap;font-size:.86rem}

  /* 6. One image frame only */
  .ka-why__grid{gap:34px!important}
  .ka-why__visual{margin:0!important}
  .ka-why__visual img{
    width:100%!important;
    min-height:0!important;
    height:auto!important;
    aspect-ratio:auto!important;
    object-fit:contain!important;
    border-radius:16px!important;
  }
  .ka-why__verified{left:14px!important;top:14px!important}
  .ka-why__badge{right:10px!important;bottom:-26px!important;width:108px!important;height:108px!important}

  /* 7. Car cards: clean image and no duplicated fallback badge */
  .ka-car-card__image img{
    width:100%!important;
    height:auto!important;
    aspect-ratio:auto!important;
    object-fit:contain!important;
    background:#020e0b;
  }
  .ka-car-card--fallback-image .ka-car-card__badge{display:none!important}
  .ka-car-card__body{padding:22px!important}
  .ka-car-card__bottom{align-items:center!important;flex-direction:row!important;gap:14px!important}

  /* 8. Budget selector */
  .ka-seo-card--accent{padding:24px!important}
  .ka-budget-pills{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
  .ka-budget-pills button{width:100%;min-height:46px;padding:8px!important}
  .ka-seo-card--accent>.ka-btn{width:100%!important;margin-top:4px}

  /* Final CTA/footer: no duplicated blocks, consistent icon alignment */
  .ka-final-cta__inner{padding-block:44px!important}
  .ka-footer__top{padding:46px 0 34px!important}
  .ka-footer__contact-block>a,.ka-footer__contact-block>span{align-items:center!important}
  .ka-footer__contact-block .ka-icon{width:23px;height:23px}
  .ka-footer__bottom-inner{align-items:center!important;text-align:center!important}
}

@media (max-width:420px){
  .ka-brand__logo{max-width:170px!important}
  .ka-hero__media{background-size:auto 53%!important;background-position:64% 13%!important}
  .ka-hero__content{padding-top:245px!important}
  .ka-hero h1{font-size:clamp(2.2rem,11.4vw,3.2rem)!important}
  .ka-auctions__logos span{min-width:104px!important}
  .ka-car-card__bottom{flex-direction:column!important;align-items:flex-start!important}
}

/* === v2.1.1 real-device fixes === */

/* Avoid visual double frames when the approved artwork already contains its own frame. */
.ka-why__visual,
.ka-why__visual img{
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
}
.ka-why__visual{padding:0!important;background:transparent!important;overflow:hidden;border-radius:18px!important}
.ka-why__visual img{border-radius:18px!important}
.ka-why__verified,.ka-why__badge{display:none!important}

@media (max-width:767px){
  /* Hero: fixed header overlays the hero, therefore there must be no second header-height spacer. */
  .ka-hero{
    padding-top:0!important;
    min-height:0!important;
    background:#020f0c!important;
  }
  .ka-hero__media{
    inset:0!important;
    background-size:cover!important;
    background-position:64% center!important;
    opacity:1!important;
  }
  .ka-hero__shade{
    inset:0!important;
    background:
      linear-gradient(180deg,rgba(1,9,7,.36) 0%,rgba(2,15,12,.30) 18%,rgba(2,15,12,.58) 43%,rgba(2,15,12,.94) 72%,#020f0c 100%),
      linear-gradient(90deg,rgba(2,15,12,.84) 0%,rgba(2,15,12,.48) 63%,rgba(2,15,12,.18) 100%)!important;
  }
  .ka-hero__inner{
    min-height:720px!important;
    align-items:flex-end!important;
    padding-top:var(--ka-header-height)!important;
  }
  .ka-hero__content{
    width:100%!important;
    max-width:none!important;
    padding:250px 0 30px!important;
  }
  .ka-hero .ka-eyebrow{margin-bottom:12px!important}
  .ka-hero h1{
    max-width:100%!important;
    margin-bottom:20px!important;
    font-size:clamp(2.25rem,10.5vw,3.35rem)!important;
    line-height:1.04!important;
    text-wrap:balance;
    text-shadow:0 2px 20px rgba(0,0,0,.34);
  }
  .ka-hero__lead{
    max-width:100%!important;
    margin-bottom:24px!important;
    font-size:.98rem!important;
    line-height:1.55!important;
    color:#eef1ee!important;
    text-shadow:0 1px 12px rgba(0,0,0,.42);
  }
  .ka-hero__actions{margin:0 0 24px!important;gap:12px!important}
  .ka-hero__actions .ka-btn{width:100%!important}
  .ka-hero__trust{display:grid!important;grid-template-columns:1fr 1fr!important;gap:13px 16px!important;margin-top:0!important}
  .ka-hero__trust span:last-child{grid-column:1/-1}
  .ka-hero__stats{margin-top:0!important}

  /* Approved Why artwork already includes its own badge and border. Don't create another frame. */
  .ka-why__visual{
    overflow:hidden!important;
    border-radius:16px!important;
  }
  .ka-why__visual img{
    width:100%!important;
    height:auto!important;
    object-fit:contain!important;
    border:0!important;
    border-radius:16px!important;
    box-shadow:none!important;
  }

  /* Catalog fallback artwork already contains the verified label and an image frame. */
  .ka-car-card__badge{display:none!important}
  .ka-car-card--fallback-image{
    border:0!important;
    background:transparent!important;
    box-shadow:none!important;
    overflow:visible!important;
  }
  .ka-car-card--fallback-image .ka-car-card__image{
    display:block!important;
    overflow:hidden!important;
    border:0!important;
    border-radius:16px 16px 0 0!important;
    background:#020e0b!important;
  }
  .ka-car-card--fallback-image .ka-car-card__image img{
    display:block!important;
    border:0!important;
    outline:0!important;
    box-shadow:none!important;
    border-radius:0!important;
  }
  .ka-car-card--fallback-image .ka-car-card__body{
    border:1px solid var(--ka-border)!important;
    border-top:0!important;
    border-radius:0 0 16px 16px!important;
    background:linear-gradient(145deg,rgba(7,42,34,.78),rgba(3,21,17,.94))!important;
  }

  /* Calculator is live: only the precise calculation CTA remains. */
  .ka-calc__form>.ka-btn[data-ka-calc-button]{display:none!important}
  .ka-calc__result [data-ka-calc-lead]{width:100%!important}
}

@media (max-width:420px){
  .ka-hero__media{background-size:cover!important;background-position:66% center!important}
  .ka-hero__content{padding-top:230px!important}
  .ka-hero__inner{min-height:690px!important}
  .ka-hero h1{font-size:clamp(2.05rem,10.4vw,3rem)!important}
}

/* Demo catalogue artwork contains its own image border and label. Keep exactly one of each on every viewport. */
.ka-car-card--baked-artwork{
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:visible!important;
}
.ka-car-card--baked-artwork .ka-car-card__badge{display:none!important}
.ka-car-card--baked-artwork .ka-car-card__image{
  display:block;
  overflow:hidden;
  border:0!important;
  border-radius:16px 16px 0 0;
  background:#020e0b;
}
.ka-car-card--baked-artwork .ka-car-card__image img{
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
}
.ka-car-card--baked-artwork .ka-car-card__body{
  border:1px solid var(--ka-border);
  border-top:0;
  border-radius:0 0 16px 16px;
  background:linear-gradient(145deg,rgba(7,42,34,.78),rgba(3,21,17,.94));
}


/* === v2.1.2 desktop readability + single-frame fixes === */

/* 1. Desktop hero: keep the left text protected while allowing the approved
   information baked into the right-side photo to remain legible. */
@media (min-width: 1024px){
  .ka-hero__media{
    filter:saturate(.98) contrast(1.08) brightness(1.07)!important;
    background-position:center 50%!important;
  }
  .ka-hero__shade{
    background:
      linear-gradient(90deg,
        #020f0c 0%,
        rgba(2,15,12,.99) 25%,
        rgba(2,15,12,.92) 35%,
        rgba(2,15,12,.52) 43%,
        rgba(2,15,12,.16) 51%,
        rgba(2,15,12,.035) 62%,
        rgba(2,15,12,0) 100%),
      linear-gradient(180deg,rgba(0,0,0,.04) 0%,rgba(0,0,0,.08) 68%,rgba(0,0,0,.02) 100%)!important;
  }
}

/* 2. The five approved category JPGs already have a thin gold frame baked in.
   Pull the image a few pixels under the card overflow so only the CSS card frame
   is visible. This avoids the doubled vertical/top borders on every viewport. */
.ka-budget-card{
  overflow:hidden!important;
  border:1px solid var(--ka-border)!important;
}
.ka-budget-card--baked-artwork > img{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  margin:0!important;
  object-position:center!important;
}

/* 3. The approved Why artwork already contains the gold rounded frame, VERIFIED
   label and 100% badge. Remove every theme-generated frame/pseudo-frame. */
.ka-why__visual,
.ka-why__visual img{
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
}
.ka-why__visual{
  position:relative!important;
  padding:0!important;
  background:transparent!important;
  overflow:hidden!important;
  border-radius:20px!important;
}
.ka-why__visual::before,
.ka-why__visual::after{
  content:none!important;
  display:none!important;
  border:0!important;
}
.ka-why__visual img{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  border-radius:20px!important;
}
.ka-why__verified,
.ka-why__badge{display:none!important}

@media (max-width:767px){
  .ka-budget-card--baked-artwork > img{
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    height:auto!important;
    aspect-ratio:auto!important;
    object-fit:contain!important;
  }
  .ka-why__visual,
  .ka-why__visual img{border-radius:16px!important}
}


/* v2.1.2: render the two Hero photo benefits as real HTML instead of baked text. */
.ka-hero__image-benefits{display:none}
@media (min-width:1024px){
  .ka-hero__image-benefits{
    position:absolute;
    z-index:5;
    left:50.5%;
    right:2%;
    bottom:22px;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    background:linear-gradient(90deg,rgba(2,15,12,.82),rgba(2,15,12,.58));
    border-block:1px solid rgba(214,181,109,.16);
    backdrop-filter:blur(5px);
    -webkit-backdrop-filter:blur(5px);
  }
  .ka-hero__image-benefit{
    min-height:82px;
    padding:16px 20px;
    display:flex;
    align-items:center;
    gap:14px;
    color:#e6ebe8;
    font-size:.82rem;
    font-weight:600;
    line-height:1.45;
    text-shadow:0 2px 12px rgba(0,0,0,.55);
  }
  .ka-hero__image-benefit + .ka-hero__image-benefit{border-left:1px solid rgba(214,181,109,.18)}
  .ka-hero__image-benefit .ka-icon{width:30px;height:30px;color:var(--ka-gold);flex:0 0 30px}
}
@media (max-width:1023px){.ka-hero__image-benefits{display:none!important}}


/* === v2.2.0 approved fixes === */

/* Hero: remove the half-visible right-side feature boxes completely. */
.ka-hero__image-benefits{display:none!important}

/* Five approved budget categories on desktop, including Electric/Tesla. */
@media (min-width:1024px){
  .ka-budget-grid{grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:18px!important}
}
.ka-budget-card{
  border:1px solid rgba(214,181,109,.32)!important;
  border-radius:18px!important;
  overflow:hidden!important;
  background:linear-gradient(145deg,rgba(7,42,34,.78),rgba(3,21,17,.94))!important;
  box-shadow:none!important;
}
.ka-budget-card>img{
  display:block!important;
  width:100%!important;
  height:220px!important;
  object-fit:cover!important;
  object-position:center center!important;
  margin:0!important;
  border:0!important;
  border-radius:0!important;
  outline:0!important;
  box-shadow:none!important;
}
@media (max-width:1023px) and (min-width:640px){
  .ka-budget-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .ka-budget-card:nth-child(5){grid-column:auto!important}
}
@media (max-width:639px){
  .ka-budget-grid{grid-template-columns:1fr!important}
  .ka-budget-card>img{height:auto!important;aspect-ratio:1200/690!important;object-fit:cover!important}
}

/* Calculator: keep the total range compact and on one line on desktop. */
@media (min-width:1024px){
  .ka-calc{grid-template-columns:minmax(0,1.65fr) minmax(390px,.76fr)!important}
  .ka-calc__result>strong{
    white-space:nowrap!important;
    font-size:clamp(1.8rem,2.05vw,2.45rem)!important;
    letter-spacing:-.035em!important;
    line-height:1.05!important;
  }
}
@media (max-width:1023px){
  .ka-calc__result>strong{white-space:nowrap!important;font-size:clamp(1.6rem,6vw,2.2rem)!important}
}

/* Why block: one real frame around a clean photo; no baked labels, no extra badges. */
.ka-why__visual{
  position:relative!important;
  padding:0!important;
  border:1px solid rgba(214,181,109,.48)!important;
  border-radius:20px!important;
  background:#03140f!important;
  overflow:hidden!important;
  box-shadow:none!important;
}
.ka-why__visual::before,.ka-why__visual::after{content:none!important;display:none!important}
.ka-why__visual img{
  display:block!important;
  width:100%!important;
  height:auto!important;
  aspect-ratio:14/7.5!important;
  object-fit:cover!important;
  object-position:center 52%!important;
  margin:0!important;
  border:0!important;
  border-radius:0!important;
  outline:0!important;
  box-shadow:none!important;
}
.ka-why__verified,.ka-why__badge{display:none!important}

/* Slightly stronger visual separation for the updated 20–30% stat. */
.ka-stat strong{white-space:nowrap}


/* === v2.2.2 category-photo and heading alignment fixes === */
@media (min-width:1024px){
  .ka-budget .ka-section-heading--split{
    grid-template-columns:minmax(0,1fr) auto!important;
    width:100%!important;
    max-width:none!important;
    align-items:end!important;
  }
  .ka-budget .ka-section-heading--split .ka-text-link{
    justify-self:end!important;
    align-self:end!important;
    text-align:right!important;
    margin-left:auto!important;
    white-space:nowrap!important;
  }
}
.ka-budget-card>img{
  object-fit:contain!important;
  object-position:center center!important;
  background:#08251d!important;
}
@media (min-width:1024px){
  .ka-budget-card>img{height:220px!important;padding:0!important}
}
@media (max-width:1023px){
  .ka-budget-card>img{object-fit:contain!important;background:#08251d!important}
}

/* === v2.2.4 Why Kult Auto image refresh === */
.ka-why__visual{
  padding:0!important;
  border:1px solid rgba(214,181,109,.48)!important;
  border-radius:22px!important;
  overflow:hidden!important;
  background:#03140f!important;
  box-shadow:0 18px 48px rgba(0,0,0,.22)!important;
}
.ka-why__visual::before,
.ka-why__visual::after{
  content:none!important;
  display:none!important;
}
.ka-why__visual img{
  display:block!important;
  width:100%!important;
  height:auto!important;
  aspect-ratio:16/9!important;
  object-fit:cover!important;
  object-position:center center!important;
  margin:0!important;
  border:0!important;
  border-radius:0!important;
  outline:0!important;
  box-shadow:none!important;
  filter:brightness(.88) saturate(.9) contrast(1.04)!important;
}
.ka-why__verified,
.ka-why__badge{display:none!important}
@media (max-width:767px){
  .ka-why__visual{border-radius:18px!important}
  .ka-why__visual img{aspect-ratio:16/10!important;object-fit:cover!important}
}

/* === v2.2.5 mobile card polish, cohesive catalogue cards, animated Why visual === */

/* Budget/category cards: use the natural 4:3 image ratio so the photo fills the
   whole card width and the complete car remains visible without side bands. */
.ka-budget-card>img{
  display:block!important;
  width:100%!important;
  max-width:none!important;
  height:auto!important;
  aspect-ratio:auto!important;
  object-fit:contain!important;
  object-position:center center!important;
  background:transparent!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
}
@media (max-width:767px){
  .ka-budget-grid{gap:22px!important}
  .ka-budget-card{
    width:100%!important;
    border-radius:20px!important;
    overflow:hidden!important;
  }
  .ka-budget-card__body{padding:24px 22px 26px!important}
  .ka-budget-card__body h3{font-size:1.35rem!important;margin-bottom:8px!important}
  .ka-budget-card__body>strong{font-size:1rem!important;margin-bottom:18px!important}
  .ka-budget-card .ka-card-copy{font-size:.96rem!important;line-height:1.65!important}
  .ka-budget-card .ka-card-link{margin-top:24px!important;font-size:.92rem!important}
}

/* Why Kult Auto: different photo, single frame and subtle cinematic movement. */
.ka-why__visual{
  position:relative!important;
  overflow:hidden!important;
  border:1px solid rgba(214,181,109,.46)!important;
  border-radius:22px!important;
  background:#03140f!important;
  box-shadow:0 22px 60px rgba(0,0,0,.34)!important;
  isolation:isolate!important;
}
.ka-why__visual img{
  display:block!important;
  width:100%!important;
  height:auto!important;
  aspect-ratio:auto!important;
  object-fit:contain!important;
  object-position:center center!important;
  filter:saturate(.92) contrast(1.05) brightness(.9)!important;
  transform:scale(1.012);
  animation:kaWhyCinematic 11s ease-in-out infinite alternate;
  will-change:transform;
}
@keyframes kaWhyCinematic{
  from{transform:scale(1.012) translate3d(0,0,0)}
  to{transform:scale(1.045) translate3d(-.7%,-.35%,0)}
}
@media (max-width:767px){
  .ka-why__grid{gap:30px!important}
  .ka-why__content{order:1!important}
  .ka-why__visual{order:2!important;border-radius:18px!important;margin-top:6px!important}
  .ka-why__visual img{width:100%!important;height:auto!important;aspect-ratio:auto!important;object-fit:contain!important}
}
@media (prefers-reduced-motion:reduce){
  .ka-why__visual img{animation:none!important;transform:none!important}
}

/* Catalogue cards: treat fallback/demo artwork as one real card instead of a
   separate image frame + separate content frame. This fixes the mobile seam. */
.ka-car-card--baked-artwork,
.ka-car-card--fallback-image{
  overflow:hidden!important;
  border:1px solid var(--ka-border)!important;
  border-radius:18px!important;
  background:linear-gradient(145deg,rgba(7,42,34,.78),rgba(3,21,17,.94))!important;
  box-shadow:none!important;
}
.ka-car-card--baked-artwork .ka-car-card__image,
.ka-car-card--fallback-image .ka-car-card__image{
  display:block!important;
  width:100%!important;
  overflow:hidden!important;
  border:0!important;
  border-radius:0!important;
  background:#041912!important;
}
.ka-car-card--baked-artwork .ka-car-card__image img,
.ka-car-card--fallback-image .ka-car-card__image img{
  display:block!important;
  width:100%!important;
  max-width:none!important;
  height:auto!important;
  aspect-ratio:auto!important;
  object-fit:contain!important;
  object-position:center center!important;
  margin:0!important;
  border:0!important;
  border-radius:0!important;
  outline:0!important;
  box-shadow:none!important;
}
.ka-car-card--baked-artwork .ka-car-card__body,
.ka-car-card--fallback-image .ka-car-card__body{
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
}
@media (max-width:767px){
  .ka-cars-grid{gap:22px!important}
  .ka-car-card{border-radius:20px!important;overflow:hidden!important}
  .ka-car-card__body{padding:24px 22px 26px!important}
  .ka-car-card h3{font-size:1.18rem!important;margin-bottom:18px!important}
  .ka-car-card__specs{font-size:.9rem!important;gap:12px 20px!important;padding-bottom:18px!important}
  .ka-car-card__bottom{flex-direction:row!important;align-items:center!important;justify-content:space-between!important;gap:14px!important;padding-top:20px!important}
  .ka-car-card__bottom strong{font-size:1.25rem!important;white-space:nowrap!important}
  .ka-car-card__bottom a{font-size:.88rem!important;white-space:nowrap!important}
}
@media (max-width:390px){
  .ka-car-card__bottom{align-items:flex-start!important;flex-direction:column!important}
}


/* === v2.2.6 readability + market-demand inventory refresh === */
.ka-auctions p{
  color:#f2f4f2!important;
  font-weight:700!important;
  opacity:1!important;
  letter-spacing:.045em!important;
}
.ka-auctions__logos{
  color:#d3d9d6!important;
  font-weight:800!important;
}
.ka-auctions__logos span{color:inherit!important}
.ka-stat span{
  color:#dce2df!important;
  font-weight:600!important;
  opacity:1!important;
  letter-spacing:.01em!important;
}
@media (min-width:1024px){
  .ka-stat span{font-size:.82rem!important}
}
/* Inventory cards: all fallback photos share one clean daylight aspect ratio. */
.ka-cars-grid .ka-car-card__image{
  aspect-ratio:16/10!important;
  background:#071b16!important;
}
.ka-cars-grid .ka-car-card__image img{
  width:100%!important;
  height:100%!important;
  aspect-ratio:auto!important;
  object-fit:cover!important;
  object-position:center center!important;
  display:block!important;
}
@media (max-width:639px){
  .ka-auctions p{font-size:.8rem!important;line-height:1.55!important}
  .ka-stat span{font-size:.72rem!important;line-height:1.35!important}
}