/* ===== Design tokens (привязка к глобальным переменным с фолбэками) ===== */
:root{
  --prime-surface: var(--surface, #fff);
  --prime-surface-2: var(--surface-2, #f6f6f6);
  --prime-text: var(--text, #111);
  --prime-muted: var(--muted, #666);
  --prime-line: var(--line, rgba(0,0,0,.08));
  --accent-emerald:#0c7a43;            /* акценты */
  --accent-champagne:#E5D5B8;          /* бэйджи */
  --cta-ink:#000;                      /* кнопки чёрные */
  --cta-ink-contrast:#fff;
  --glass: rgba(255,255,255,.08);
  --glass-dark: rgba(255,255,255,.04);

  --radius-lg:18px;
  --radius-md:14px;
  --radius-sm:10px;

  --shadow-lg:0 30px 80px rgba(0,0,0,.14), 0 10px 30px rgba(0,0,0,.08);
  --shadow-sm:0 10px 24px rgba(0,0,0,.08);
  --focus:0 0 0 3px rgba(229,213,184,.45);
}

:focus-visible{outline:none;box-shadow:var(--focus);border-radius:8px}

/* ===== Page ===== */
.car-page{padding:32px 18px 110px;max-width:1280px;margin-inline:auto}
@media (min-width:1024px){.car-page{padding-inline:26px}}

/* ===== Breadcrumbs ===== */
.breadcrumbs{display:flex;gap:6px;align-items:center;margin:4px 0 12px;font-size:12px;color:var(--prime-muted)}
.breadcrumbs a{color:inherit;text-underline-offset:2px}
.breadcrumbs .current{color:var(--prime-text);font-weight:700}

/* ===== Head row ===== */
.car-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin:8px 0 12px}
.car-title{font:800 26px/1.2 system-ui,-apple-system,Segoe UI,Roboto,Inter,Arial,sans-serif;letter-spacing:.01em;margin:0;color:var(--prime-text)}
.badges{display:flex;gap:8px;margin-top:6px}
.pill{display:inline-flex;align-items:center;height:28px;padding:0 10px;border-radius:999px;font:700 12px/28px system-ui;border:1px solid rgba(0,0,0,.06);background:var(--accent-champagne);color:#111}
.pill--dealer{background:linear-gradient(180deg,rgba(229,213,184,.9),rgba(229,213,184,.75))}

/* ===== Icon buttons ===== */
.icon-btn{inline-size:40px;block-size:40px;display:grid;place-items:center;background:var(--prime-surface);border:1px solid var(--prime-line);border-radius:12px;color:var(--prime-text)}
.icon-btn svg{inline-size:22px;block-size:22px}
.icon-btn.is-active{border-color:var(--accent-emerald);box-shadow:0 0 0 2px rgba(12,122,67,.18) inset;color:var(--accent-emerald)}

/* ===== Main grid ===== */
.car-main{display:grid;gap:18px;grid-template-columns:1fr}
@media (min-width:1024px){.car-main{grid-template-columns:1fr 1fr;align-items:start}}

.gallery{
  background:#fdfdfb;
  border:1px solid rgba(0,0,0,.05);
  border-radius:18px;
  box-shadow:0 10px 24px rgba(0,0,0,.06);
  overflow:hidden;
}
.gallery__stage{
  position:relative;
  display:block;
  background:linear-gradient(180deg,#f9fbfd 0%,#eef2f6 100%);
  aspect-ratio:4/3;
  padding:0;
}
.gallery__stage img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:0;
  box-shadow:none;
  background:transparent;
}
.gallery__stage img#stageImg{object-fit:cover !important;}
.gallery__nav{position:absolute;border:none;background:rgba(0,0,0,.42);color:#fff;inline-size:40px;block-size:40px;border-radius:999px;display:grid;place-items:center;cursor:pointer}
.gallery__nav:hover{background:rgba(0,0,0,.6)}
.gallery__nav.prev{left:8px}.gallery__nav.next{right:8px}
.thumbs{display:flex;gap:8px;overflow:auto;padding:8px}
.thumbs .thumb{border:1px solid var(--prime-line);background:var(--prime-surface-2);border-radius:12px;padding:4px;display:inline-grid;place-items:center;cursor:pointer}
.thumbs .thumb img{width:96px;height:60px;object-fit:cover;border-radius:8px;opacity:.85}
.thumbs .thumb.is-active img{opacity:1;outline:2px solid var(--accent-emerald);outline-offset:2px}
.thumbs:empty{display:none}

/* ===== Buy-box ===== */
.buybox{
  background:var(--prime-surface);
  border:1px solid var(--prime-line);
  border-radius:18px;
  box-shadow:0 14px 36px rgba(0,0,0,.1);
  padding:14px;
  position:sticky;
  top:12px;
}
.price-block{
  border:1px solid rgba(12,122,67,.22);
  border-radius:14px;
  padding:12px 14px;
  margin-bottom:12px;
  background:linear-gradient(180deg,rgba(12,122,67,.08),transparent 92%);
}
.price-row{display:flex;align-items:flex-end;gap:12px;justify-content:space-between}
#price{font:900 24px/1.1 system-ui;letter-spacing:.01em;color:var(--prime-text)}
.price-old{color:var(--prime-muted);text-decoration:line-through;margin-left:8px;font-size:13px}
.rrc-note{font-size:12px;color:var(--prime-muted);margin-top:6px}
.f{display:block;margin:10px 0}
.f>span{display:block;margin:0 0 6px;font-size:12px;color:var(--prime-muted)}
.f select{
  width:100%;height:46px;border-radius:12px;
  border:1px solid var(--prime-line);
  padding:0 12px;
  background:var(--prime-surface-2);
  color:var(--prime-text);
  box-shadow:inset 0 1px 2px rgba(0,0,0,.04);
}
.f select:focus-visible{box-shadow:var(--focus)}
.spec-short{
  list-style:none;margin:12px 0 6px;padding:0;
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.spec-short li{
  background:var(--prime-surface-2);
  border:1px solid var(--prime-line);
  border-radius:10px;
  padding:8px 10px;
  font-size:13px;
  color:var(--prime-text);
  box-shadow:inset 0 1px 2px rgba(0,0,0,.03);
}

/* ===== Buttons ===== */
.btn{height:46px;padding:0 16px;border-radius:12px;border:1px solid var(--cta-ink);font:800 14px/46px system-ui;letter-spacing:.01em;transition:opacity .15s ease,transform .1s ease}
.btn:active{transform:translateY(1px)}
.btn--primary{background:var(--cta-ink);color:var(--cta-ink-contrast);border-color:var(--cta-ink)}
.btn--primary:hover{opacity:.92}
.btn--ghost{background:transparent;color:var(--prime-text);border-color:var(--prime-line)}
.btn--ghost:hover{background:var(--prime-surface-2)}
.btn:focus-visible{box-shadow:var(--focus)}

/* ===== Tabs ===== */
.car-tabs{margin-top:14px}
.tabs{display:flex;gap:8px;overflow:auto;padding:4px;border-bottom:1px solid var(--prime-line)}
.tab{appearance:none;border:none;background:transparent;padding:10px 12px;border-radius:10px;font-weight:800;color:var(--prime-muted);border-bottom:2px solid transparent}
.tab.is-active{color:var(--prime-text);border-color:var(--accent-emerald)}
.tab-panel{display:none;background:var(--prime-surface);border:1px solid var(--prime-line);border-radius:16px;box-shadow:var(--shadow-sm);padding:12px;margin-top:10px}
.tab-panel.is-active{display:block}
.bullets{padding-left:18px;color:var(--prime-text)}
.tab-panel p{margin:0 0 10px;color:var(--prime-text);line-height:1.5}

/* grid for specs */
.spec-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.spec-grid .cell{background:var(--prime-surface-2);border:1px solid var(--prime-line);border-radius:10px;padding:10px;color:var(--prime-text)}
.spec-grid .cell b{display:block;font-size:12px;color:var(--prime-muted);margin-bottom:4px}
@media (min-width:1024px){.spec-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}

.equip-list{display:grid;gap:10px}
.equip{border:1px solid var(--prime-line);border-radius:14px;padding:10px;background:var(--prime-surface);color:var(--prime-text)}
.equip h3{margin:0 0 6px;font-size:16px}
.equip ul{margin:0;padding-left:18px}

/* ===== Recommendations ===== */
.other-cars .section-header{display:flex;justify-content:space-between;align-items:center;margin:12px 0;color:var(--prime-text)}
.reco-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
@media (min-width:720px){.reco-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:1024px){.reco-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
.reco-card{background:var(--prime-surface);border:1px solid var(--prime-line);border-radius:14px;overflow:hidden;display:grid;grid-template-rows:auto 1fr auto;box-shadow:0 10px 22px rgba(0,0,0,.08)}
.reco-card .media{aspect-ratio:16/9;background:var(--prime-surface-2)}
.reco-card .body{padding:10px;color:var(--prime-text)}
.reco-card .meta{display:flex;justify-content:space-between;color:var(--prime-muted);font-size:12px;margin-top:4px}
.reco-card .actions{padding:10px}
.reco-card .actions .btn{width:100%;text-align:center}

@media (max-width:768px){
  .reco-grid{
    grid-auto-flow:column;
    grid-auto-columns:80%;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    padding-bottom:6px;
  }
  .reco-grid > *{scroll-snap-align:start;}
}

/* ===== Sticky bar ===== */
.sticky-bar{position:fixed;left:0;right:0;bottom:8px;margin-inline:auto;max-width:640px;background:var(--prime-surface);border:1px solid var(--prime-line);border-radius:14px;box-shadow:var(--shadow-lg);padding:8px;display:flex;gap:10px;align-items:center;justify-content:space-between;transform:translateY(16px);opacity:0;pointer-events:none;transition:transform .18s ease,opacity .18s ease}
.sticky-bar.is-show{transform:translateY(0);opacity:1;pointer-events:auto}
.sticky-price{font:900 18px/1 system-ui;color:var(--prime-text)}

/* Reduce motion */
@media (prefers-reduced-motion: reduce){.btn{transition:none}}
/* Fix: изображение в карточке рекомендаций заполняет контейнер */
.reco-card .media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

/* ===== PDP refresh ===== */
body{background:#f7f4ed;}
.car-page{
  padding:42px 18px 120px;
  max-width:1320px;
  margin-inline:auto;
  background:linear-gradient(180deg,#f8f6f1 0%,#fdfbf7 18%,#f8f6f1 100%);
}
@media (min-width:1024px){.car-page{padding-inline:32px}}
.car-head{margin:12px 0 16px}
.car-title{font:800 28px/1.2 system-ui, -apple-system, Segoe UI, Roboto, Inter, Arial, sans-serif;}

.gallery{
  border:1px solid rgba(0,0,0,.06);
  border-radius:22px;
  box-shadow:var(--shadow-lg);
  max-width:640px;
}
.gallery__stage{
  background:radial-gradient(circle at 30% 30%, rgba(0,0,0,.06), transparent 40%), linear-gradient(180deg,#f9fbfd 0%,#eef2f6 100%);
  aspect-ratio:4/3;
}
.gallery__stage img#stageImg{object-fit:cover !important;}
.thumbs .thumb img{width:120px;height:76px;object-fit:cover;border-radius:10px;opacity:.88;filter:saturate(.96)}

.buybox{
  border:1px solid rgba(0,0,0,.05);
  border-radius:22px;
  box-shadow:0 24px 60px rgba(0,0,0,.12);
  padding:18px 18px 20px;
  top:18px;
  max-width:640px;
  width:100%;
}
.price-block{
  border:1px solid rgba(12,122,67,.16);
  border-radius:16px;
  padding:14px 16px;
  margin-bottom:14px;
  background:linear-gradient(180deg,rgba(12,122,67,.08),rgba(12,122,67,.02));
}
#price{font:900 26px/1.2 system-ui;}
.price-old{font-size:14px;}
.f select{
  border:1px solid rgba(0,0,0,.1);
  padding:12px 12px;
  background:#f8f7f4;
}
.spec-short li{
  background:#f8f7f4;
  border:1px solid rgba(0,0,0,.08);
}

.car-tabs{
  margin-top:26px;
  border:1px solid rgba(0,0,0,.05);
  border-radius:18px;
  background:var(--prime-surface);
  box-shadow:0 18px 48px rgba(0,0,0,.08);
}
.tabs{gap:0;padding:4px 6px;border-bottom:1px solid var(--prime-line)}
.tab{padding:16px 18px;font:800 13px/1.2 system-ui;color:var(--prime-muted);letter-spacing:.04em;text-transform:uppercase;border-radius:10px 10px 0 0;}
.tab.is-active{color:var(--prime-text);box-shadow:0 -3px 0 var(--accent-emerald) inset;}
.tab-panel{padding:22px 22px 26px;border:none;box-shadow:none;margin-top:0;}

.spec-grid{gap:12px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));}
.spec-grid .cell{
  border:1px solid rgba(0,0,0,.06);
  border-radius:14px;
  padding:14px 16px;
  background:linear-gradient(180deg,#fff, #f7f6f2);
  box-shadow:0 8px 24px rgba(0,0,0,.06);
}
.equip-list{gap:14px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));}
.equip{
  border:1px solid rgba(0,0,0,.06);
  border-radius:16px;
  padding:16px;
  background:linear-gradient(180deg,#fff, #f9f7f3);
  box-shadow:0 12px 30px rgba(0,0,0,.08);
}

.reco-grid{gap:16px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));}
.reco-card{
  border:1px solid rgba(0,0,0,.06);
  border-radius:16px;
  box-shadow:0 12px 28px rgba(0,0,0,.08);
}
.reco-card .media{aspect-ratio:4/3;}
.reco-card .body{padding:12px 14px;}

/* ===== Dark theme ===== */
[data-theme="dark"] body{background:#0f1116;}
[data-theme="dark"] .car-page{
  background:linear-gradient(180deg,#0f1116 0%,#0c0e12 100%);
}
[data-theme="dark"] .gallery{
  background:#131720;
  border-color:rgba(255,255,255,.06);
  box-shadow:0 24px 60px rgba(0,0,0,.5);
}
[data-theme="dark"] .gallery__stage{
  background:radial-gradient(circle at 30% 30%, rgba(255,255,255,.04), transparent 40%), linear-gradient(180deg,#1a1f29 0%,#0f131a 100%);
}
[data-theme="dark"] .thumbs .thumb{background:#161b24;border-color:rgba(255,255,255,.06);}
[data-theme="dark"] .thumbs .thumb img{opacity:.9}
[data-theme="dark"] .thumbs .thumb.is-active img{outline-color:var(--accent-emerald);}

[data-theme="dark"] .buybox{
  background:#141922;
  border-color:rgba(255,255,255,.06);
  box-shadow:0 24px 60px rgba(0,0,0,.6);
}
[data-theme="dark"] .price-block{
  border-color:rgba(12,122,67,.35);
  background:radial-gradient(circle at 18% 18%, rgba(39,179,126,.24), transparent 36%),
             radial-gradient(circle at 84% 12%, rgba(229,213,184,.2), transparent 32%),
             linear-gradient(180deg,rgba(12,122,67,.22),rgba(12,122,67,.1));
  box-shadow:0 26px 70px rgba(0,0,0,.7), 0 0 0 1px rgba(255,255,255,.06) inset;
}
[data-theme="dark"] .price-now .label{color:#dce6f5;}
[data-theme="dark"] .price-caption{color:#cfd9e8;}
[data-theme="dark"] .price-caption::before{background:linear-gradient(90deg,#34d295,#9ce2c3);}
[data-theme="dark"] #price{color:#f8fbff;text-shadow:0 10px 26px rgba(0,0,0,.4);}
[data-theme="dark"] .price-old{color:#d0d7e4;}
[data-theme="dark"] .f select{
  background:#1a1f29;
  border-color:rgba(255,255,255,.08);
  color:#eaeef5;
}
[data-theme="dark"] .f>span{color:#dce3ef;}
[data-theme="dark"] .spec-short li{
  background:#191f2a;
  border-color:rgba(255,255,255,.08);
  color:#eaeef5;
}
[data-theme="dark"] .car-title,
[data-theme="dark"] .tab-panel,
[data-theme="dark"] .reco-card .body,
[data-theme="dark"] .equip,
[data-theme="dark"] .spec-grid .cell,
[data-theme="dark"] .price-old,
[data-theme="dark"] .rrc-note {color:#eaeef5;}
[data-theme="dark"] .breadcrumbs,
[data-theme="dark"] .tab,
[data-theme="dark"] .equip p,
[data-theme="dark"] .reco-card .meta {color:#a8b0be;}
[data-theme="dark"] .tab.is-active{color:#f7f9fd;}
[data-theme="dark"] .tab-panel,
[data-theme="dark"] .spec-grid .cell,
[data-theme="dark"] .equip,
[data-theme="dark"] .reco-card{
  background:linear-gradient(180deg,#171c26,#111722);
  border-color:rgba(255,255,255,.07);
  box-shadow:0 16px 48px rgba(0,0,0,.6);
}
[data-theme="dark"] .reco-card .media{background:#0f131a;}
[data-theme="dark"] .car-tabs{
  background:#141a24;
  border-color:rgba(255,255,255,.06);
  box-shadow:0 20px 50px rgba(0,0,0,.6);
}
[data-theme="dark"] .thumbs .thumb.is-active img{outline-color:#27b37e;}
[data-theme="dark"] .btn--ghost:hover{background:#1a202c;}
[data-theme="dark"] .sticky-bar{
  background:#141922;
  border-color:rgba(255,255,255,.08);
}

/* ===== Premium PDP polish ===== */
.buybox{
  background:linear-gradient(135deg,rgba(255,255,255,.92),rgba(248,247,244,.92));
  border:1px solid rgba(0,0,0,.05);
  box-shadow:0 24px 64px rgba(0,0,0,.14);
  backdrop-filter:blur(12px);
}
.price-block{
  position:relative;
  border:1px solid rgba(39,179,126,.26);
  border-radius:18px;
  padding:16px 18px;
  margin-bottom:16px;
  background:radial-gradient(circle at 16% 12%, rgba(39,179,126,.18), transparent 32%),
             radial-gradient(circle at 86% 12%, rgba(229,213,184,.24), transparent 30%),
             linear-gradient(180deg,rgba(12,122,67,.12),rgba(12,122,67,.05));
  box-shadow:0 22px 60px rgba(0,0,0,.22), 0 0 0 1px rgba(255,255,255,.06) inset;
  overflow:hidden;
}
.price-block::before{
  content:'';
  position:absolute;
  inset:-20% auto auto -20%;
  width:240px;height:240px;
  background:radial-gradient(circle, rgba(39,179,126,.16), transparent 60%);
  filter:blur(18px);
  pointer-events:none;
}
.price-block::after{
  content:'';
  position:absolute;
  inset:0;
  background:radial-gradient(120% 80% at 20% 10%, rgba(39,179,126,.12), transparent 50%);
  pointer-events:none;
}
.price-row{display:flex;align-items:flex-end;gap:12px;justify-content:space-between}
#price{font:900 clamp(28px,3vw,34px)/1.1 system-ui;letter-spacing:.015em;color:#0f1419;text-shadow:0 8px 24px rgba(12,122,67,.22);}
.price-now{display:flex;align-items:baseline;gap:8px;}
.price-now .label{font-weight:700;color:rgba(0,0,0,.65);margin-right:4px;letter-spacing:.02em;text-transform:uppercase;font-size:12px}
.price-old{color:rgba(0,0,0,.55);text-decoration-color:rgba(0,0,0,.38);text-decoration-thickness:2px;font-size:14px;}
.price-caption{
  margin-top:8px;
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:rgba(0,0,0,.62);
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.price-caption::before{
  content:'';
  width:32px;height:2px;
  border-radius:99px;
  background:linear-gradient(90deg,#27b37e,#e5d5b8);
  box-shadow:0 0 18px rgba(39,179,126,.45);
}
.price-animated{animation:priceFlash .9s ease;}
@keyframes priceFlash{
  0%{transform:scale(1);box-shadow:0 0 0 rgba(39,179,126,.0);}
  40%{transform:scale(1.01);box-shadow:0 14px 36px rgba(39,179,126,.32);}
  100%{transform:scale(1);}
}
.price-block.is-hot{box-shadow:0 26px 70px rgba(39,179,126,.35),0 0 0 1px rgba(39,179,126,.28) inset;}
.rrc-note{margin-top:4px;color:var(--prime-muted);}

.f{position:relative;}
.f select{
  border:1px solid rgba(0,0,0,.14);
  padding:12px 12px;
  background:linear-gradient(135deg,#fdfbf7,#f3f0e9);
  box-shadow:0 12px 28px rgba(0,0,0,.08), inset 0 1px 0 rgba(255,255,255,.6);
  transition:border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
.f.is-changed select{
  border-color:rgba(39,179,126,.6);
  box-shadow:0 12px 34px rgba(39,179,126,.22), inset 0 1px 0 rgba(255,255,255,.4);
}
.f.color-field::after{
  content:'';
  position:absolute;
  right:14px;
  top:38px;
  width:14px;height:14px;
  border-radius:50%;
  border:1px solid rgba(0,0,0,.12);
  box-shadow:0 0 0 3px rgba(0,0,0,.04);
  background:var(--color-swatch, linear-gradient(135deg,#27b37e,#9ce2c3));
  pointer-events:none;
}
.f>span{font-weight:700;letter-spacing:.01em;}

.spec-short{
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
}
.spec-short li{
  display:grid;
  grid-template-columns:auto 1fr;
  align-items:center;
  gap:10px;
  background:rgba(255,255,255,.9);
  box-shadow:0 10px 26px rgba(0,0,0,.08);
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.spec-short li::before{
  content:'';
  width:30px;height:30px;
  border-radius:12px;
  background:linear-gradient(135deg,#27b37e,#9ce2c3);
  box-shadow:0 8px 18px rgba(39,179,126,.28);
  mask-size:18px 18px;
  mask-repeat:no-repeat;
  mask-position:center;
  -webkit-mask-size:18px 18px;
  -webkit-mask-repeat:no-repeat;
  -webkit-mask-position:center;
}
.spec-short li:nth-child(1)::before{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M4 9h2V7h2V5h4v2h2v2h2v4h-2v2h-2v2h-4v-2H8v-2H6V9Zm2 2v2h2v2h4v-2h2v-2h2V9h-2V7h-2V5h-4v2H8v2H6Z'/%3E%3C/svg%3E");}
.spec-short li:nth-child(2)::before{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M6 4h12l2 8-2 8H6L4 12l2-8Zm2.1 2-1.4 6L8.1 18h7.8l1.4-6-1.4-6H8.1Zm1.9 2h4l.5 4-.5 4h-4l-.5-4 .5-4Z'/%3E%3C/svg%3E");}
.spec-short li:nth-child(3)::before{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M4 13h2v-2H4v2Zm3 0h2v-2H7v2Zm3 0h2v-2h-2v2Zm3 0h2v-2h-2v2Zm3 0h2v-2h-2v2Zm1 2H6v2H4v2h2v-2h12v2h2v-2h-2v-2Z'/%3E%3C/svg%3E");}
.spec-short li:nth-child(4)::before{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M5 5h6v6H5V5Zm8 0h6v6h-6V5Zm0 8h6v6h-6v-6Zm-8 0h6v6H5v-6Z'/%3E%3C/svg%3E");}
.spec-short li:hover{
  transform:translateY(-2px) scale(1.01);
  border-color:rgba(39,179,126,.4);
  box-shadow:0 18px 36px rgba(0,0,0,.14), 0 0 0 1px rgba(39,179,126,.18) inset;
}

.btn{min-height:52px;font:800 15px/1 system-ui;letter-spacing:.04em;}
.btn--primary{
  background:linear-gradient(120deg,#1f7a50,#27b37e);
  border-color:rgba(39,179,126,.8);
  box-shadow:0 18px 40px rgba(39,179,126,.28), 0 0 0 1px rgba(255,255,255,.08) inset;
  transition:transform .15s ease, box-shadow .2s ease, filter .2s ease;
}
.btn--primary:hover{box-shadow:0 22px 50px rgba(39,179,126,.35);transform:translateY(-1px);}
.btn--primary:active{transform:translateY(1px);}
.buy-actions .btn--primary{animation:pulseOnce 1.6s ease;}
.btn--primary.pulse-once{animation:pulseOnce 1.6s ease;}
@keyframes pulseOnce{
  0%{box-shadow:0 18px 40px rgba(39,179,126,.0);}
  30%{box-shadow:0 26px 60px rgba(39,179,126,.35);}
  100%{box-shadow:0 18px 40px rgba(39,179,126,.28);}
}

.trust-hints{
  margin-top:12px;
  display:grid;
  gap:6px;
  color:var(--prime-muted);
  font-size:12px;
}
.trust-hints span{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:8px 10px;
  border-radius:12px;
  background:rgba(39,179,126,.08);
  color:#0f1419;
}
[data-theme="dark"] .trust-hints span{
  background:rgba(39,179,126,.16);
  color:#eaeef5;
  border:1px solid rgba(255,255,255,.12);
}

.sticky-bar{
  background:linear-gradient(135deg,rgba(20,25,34,.96),rgba(12,16,24,.92));
  border-color:rgba(255,255,255,.06);
  box-shadow:0 20px 52px rgba(0,0,0,.4);
}
.sticky-price{font-size:18px;}

[data-theme=\"dark\"] .price-block{
  background:radial-gradient(circle at 18% 18%, rgba(39,179,126,.22), transparent 36%),
             radial-gradient(circle at 84% 12%, rgba(229,213,184,.18), transparent 32%),
             linear-gradient(180deg,rgba(12,122,67,.18),rgba(12,122,67,.08));
  box-shadow:0 26px 70px rgba(0,0,0,.7), 0 0 0 1px rgba(255,255,255,.06) inset;
  border-color:rgba(12,122,67,.35);
}
[data-theme=\"dark\"] #price{color:#f8fbff;text-shadow:0 10px 26px rgba(0,0,0,.4);}
[data-theme=\"dark\"] .price-caption{color:#cbd3e0;}
[data-theme=\"dark\"] .price-caption::before{background:linear-gradient(90deg,#27b37e,#9ce2c3);}
[data-theme=\"dark\"] .f select{
  background:#1a1f29;
  border-color:rgba(255,255,255,.08);
  color:#eaeef5;
}
[data-theme=\"dark\"] .f.color-field::after{border-color:rgba(255,255,255,.18);box-shadow:0 0 0 3px rgba(255,255,255,.06);}
[data-theme=\"dark\"] .spec-short li{
  background:#191f2a;
  border-color:rgba(255,255,255,.08);
  color:#eaeef5;
  box-shadow:0 12px 30px rgba(0,0,0,.5);
}
[data-theme=\"dark\"] .trust-hints span{
  background:rgba(39,179,126,.16);
  color:#eaeef5;
}
[data-theme=\"dark\"] .btn--primary{color:#0c0f15;}

@media (prefers-reduced-motion: reduce){
  .price-animated{animation:none;}
  .spec-short li{transition:none;}
  .btn--primary{transition:none;animation:none;}
  .buy-actions .btn--primary{animation:none;}
}

/* ===== Layout / hero split ===== */
@media (min-width:1024px){
  .car-main{grid-template-columns:minmax(0,1.05fr) minmax(400px,0.95fr);align-items:start;gap:22px;}
  .gallery{max-width:none;}
}
.gallery{border-radius:24px;}
.buybox{border-radius:24px;}

/* Sticky bar mobile ergonomics */
@media (max-width:768px){
  .sticky-bar{
    left:10px; right:10px; bottom:12px;
    max-width:none; width:auto;
    border-radius:16px;
    padding:10px 12px;
    gap:12px;
  }
  .sticky-price{font-size:15px;}
  .sticky-bar .btn{min-height:48px;}
}

/* Equip cards (trims) */
.equip-list{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));}
.equip{
  border:1px solid rgba(0,0,0,.06);
  border-radius:18px;
  padding:16px;
  box-shadow:0 16px 36px rgba(0,0,0,.08);
  position:relative;
}
.equip.is-active{
  border-color:rgba(39,179,126,.45);
  box-shadow:0 20px 50px rgba(39,179,126,.18),0 0 0 1px rgba(39,179,126,.2) inset;
}
.equip__price{
  display:inline-block;
  margin:4px 0 10px;
  padding:6px 10px;
  border-radius:12px;
  background:linear-gradient(120deg,rgba(39,179,126,.12),rgba(229,213,184,.18));
  font-weight:800;
}
.equip ul{padding-left:18px;line-height:1.5;}

/* Spec grid hover on touch */
@media (max-width:640px){
  .spec-short{grid-template-columns:repeat(2,minmax(0,1fr));}
}

/* Recommendations CTA prominence */
.reco-card .actions .btn{width:100%;text-align:center;}
.reco-card .meta span:last-child{font-weight:700;color:var(--prime-text);}

/* Dark theme readability tweaks */
[data-theme=\"dark\"] .equip{
  background:linear-gradient(180deg,#191f2a,#111722);
  border-color:rgba(255,255,255,.08);
  box-shadow:0 18px 46px rgba(0,0,0,.6);
}
[data-theme=\"dark\"] .equip__price{
  background:linear-gradient(120deg,rgba(39,179,126,.22),rgba(229,213,184,.18));
  color:#f2f6ff;
}
[data-theme=\"dark\"] .equip.is-active{
  border-color:rgba(39,179,126,.5);
  box-shadow:0 24px 60px rgba(39,179,126,.22),0 0 0 1px rgba(39,179,126,.22) inset;
}
[data-theme=\"dark\"] .reco-card .meta span:last-child{color:#f2f6ff;}