/* Карточка машины Heydealer (прототип 10.11.2026). Основа — стили карточки Кореи (new-product.css),
   здесь только новое: сцена 360° / салон / фото, проверка heydealer eye, термоснимки, состояние. */

/* ---------- Источник над заголовком ---------- */
.hd-src-line { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin:0 0 10px; }
.hd-src-chip { display:inline-flex; align-items:center; gap:7px; padding:5px 11px; border-radius:999px; background:#EEF4FF; color:#1D4ED8; font-size:12px; font-weight:700; letter-spacing:.01em; }
.hd-src-dot { width:7px; height:7px; border-radius:50%; background:#2563EB; box-shadow:0 0 0 3px rgba(37,99,235,.18); }
.hd-src-date { font-size:12px; color:var(--muted,#6E6E76); }

/* ---------- Сцена галереи ---------- */
.hd-gallery { min-width:0; }
.hd-stage { position:relative; aspect-ratio:4/3; border-radius:14px; overflow:hidden; user-select:none; -webkit-user-select:none;
  background:linear-gradient(180deg, var(--hd-bg1,#D5D4D7), var(--hd-bg2,#D1D0D5)); isolation:isolate; }
.hd-view { position:absolute; inset:0; opacity:0; visibility:hidden; transition:opacity .25s var(--ease,ease); }
.hd-view.is-on { opacity:1; visibility:visible; }

.hd-spin-poster, .hd-spin-canvas { position:absolute; inset:0; width:100%; height:100%; }
.hd-spin-poster { object-fit:contain; transition:opacity .2s; }
.hd-view-spin.is-ready .hd-spin-poster { opacity:0; }
.hd-spin-canvas { touch-action:pan-y; cursor:grab; }
.hd-view-spin.is-drag .hd-spin-canvas { cursor:grabbing; }
.hd-spin-hint { position:absolute; left:50%; top:16px; transform:translateX(-50%); display:flex; align-items:center; gap:8px;
  padding:7px 13px; border-radius:999px; background:rgba(14,14,18,.62); color:#fff; font-size:12px; font-weight:600; white-space:nowrap;
  pointer-events:none; transition:opacity .4s; backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); }
.hd-spin-hint.off { opacity:0; }
.hd-spin-tilt { position:absolute; right:12px; top:50%; transform:translateY(-50%); display:flex; flex-direction:column; align-items:center; gap:6px;
  padding:6px; border-radius:999px; background:rgba(255,255,255,.78); box-shadow:0 4px 14px rgba(14,14,18,.12); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); }
#hdStage .hd-spin-tilt button { width:30px; height:30px; border:0; border-radius:50%; background:#fff; color:var(--ink,#0A0A0B); display:flex; align-items:center; justify-content:center; cursor:pointer; padding:0; }
#hdStage .hd-spin-tilt button:hover { background:var(--ink,#0A0A0B); color:#fff; }
.hd-tilt-dots { display:flex; flex-direction:column; gap:4px; padding:2px 0; }
.hd-tilt-dots i { width:5px; height:5px; border-radius:50%; background:rgba(14,14,18,.22); transition:background .2s, transform .2s; }
.hd-tilt-dots i.on { background:var(--accent,#E11D2E); transform:scale(1.3); }
.hd-spin-load { position:absolute; left:0; right:0; top:0; height:3px; background:rgba(14,14,18,.06); transition:opacity .4s; }
.hd-spin-load i { display:block; height:100%; width:0; background:var(--accent,#E11D2E); transition:width .2s; }
.hd-view-spin.is-loaded .hd-spin-load { opacity:0; }

.hd-pano { position:absolute; inset:0; }
.hd-pano .pnlm-container { background:#EDEDF0; }
#hdStage .hd-pano-poster { position:absolute; inset:0; border:0; padding:0; cursor:pointer; background-size:cover; background-position:center; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; }
.hd-pano-poster::before { content:''; position:absolute; inset:0; background:linear-gradient(180deg, rgba(14,14,18,.05), rgba(14,14,18,.35)); }
.hd-view-pano.is-live .hd-pano-poster { opacity:0; pointer-events:none; transition:opacity .35s; }
.hd-view-pano.is-loading .hd-play { animation:hdPulse 1s ease-in-out infinite; }
.hd-pano-cta { position:relative; color:#fff; font-weight:700; font-size:15px; text-shadow:0 1px 8px rgba(0,0,0,.4); }
@keyframes hdPulse { 50% { transform:scale(.92); opacity:.75; } }
.hd-play { position:relative; width:58px; height:58px; border-radius:50%; background:rgba(255,255,255,.94); color:var(--accent,#E11D2E); display:flex; align-items:center; justify-content:center; box-shadow:0 8px 24px rgba(0,0,0,.22); }
.hd-play svg { margin-left:3px; }

.hd-photo-main { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; cursor:zoom-in; touch-action:pan-y; }
#hdStage .hd-photo-nav { position:absolute; top:50%; transform:translateY(-50%); width:38px; height:38px; border:0; border-radius:50%; background:rgba(255,255,255,.88); color:var(--ink,#0A0A0B);
  display:flex; align-items:center; justify-content:center; cursor:pointer; box-shadow:0 4px 12px rgba(0,0,0,.15); padding:0; }
#hdStage .hd-photo-nav.prev { left:12px; } #hdStage .hd-photo-nav.next { right:12px; }
.hd-photo-count { position:absolute; right:12px; top:12px; padding:5px 10px; border-radius:999px; background:rgba(14,14,18,.6); color:#fff; font-size:12px; font-family:'JetBrains Mono',monospace; }
.hd-stage[data-view="photo"] .hd-stage-badge { display:none; }

.hd-stage-badge { position:absolute; left:12px; top:12px; z-index:3; padding:4px 10px; border-radius:999px; background:#2563EB; color:#fff; font-size:11px; font-weight:700; letter-spacing:.02em; pointer-events:none; }
.hd-stage[data-view="spin"] .hd-stage-badge { top:auto; bottom:14px; }
#hdStage .hd-fs { position:absolute; right:12px; bottom:12px; z-index:4; width:38px; height:38px; border:0; border-radius:50%; background:rgba(255,255,255,.9); color:var(--ink,#0A0A0B);
  display:flex; align-items:center; justify-content:center; cursor:pointer; box-shadow:0 4px 12px rgba(0,0,0,.14); padding:0; }
.hd-fs .i-close { display:none; }
.hd-stage.is-fs .hd-fs .i-open, .hd-stage.hd-fs-on .hd-fs .i-open { display:none; }
.hd-stage.is-fs .hd-fs .i-close, .hd-stage.hd-fs-on .hd-fs .i-close { display:block; }
#hdStage .hd-seg { position:absolute; left:50%; bottom:12px; transform:translateX(-50%); z-index:4; display:flex; gap:2px; padding:3px; border-radius:999px;
  background:rgba(255,255,255,.86); box-shadow:0 6px 18px rgba(14,14,18,.16); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }
#hdStage .hd-seg button { border:0; background:none; padding:8px 14px; border-radius:999px; font:inherit; font-size:13px; font-weight:700; color:var(--ink-3,#3d3d48); cursor:pointer; white-space:nowrap; display:flex; align-items:center; gap:6px; }
#hdStage .hd-seg button.is-on { background:var(--ink,#0A0A0B); color:#fff; }
#hdStage .hd-seg .cn { font-size:11px; font-weight:600; opacity:.6; font-family:'JetBrains Mono',monospace; }

.hd-stage.is-fs, .hd-stage.hd-fs-on { aspect-ratio:auto; border-radius:0; }
.hd-stage.hd-fs-on { position:fixed; inset:0; z-index:100050; width:100vw; height:100vh; height:100dvh; }
html.hd-noscroll, html.hd-noscroll body { overflow:hidden !important; }

.hd-thumbs { margin-top:8px; }
#hdGallery .hd-thumb { border:0; padding:0; background:none; cursor:zoom-in; font:inherit; }
body[class*="new-design"] .pd-thumbs.hd-thumbs { display:grid !important; grid-template-columns:repeat(3,1fr) !important; gap:8px !important; }
body[class*="new-design"] .hd-thumbs .pd-thumb { position:relative; aspect-ratio:4/3; width:auto !important; height:auto !important; border-radius:10px; overflow:hidden; display:block; }
body[class*="new-design"] .hd-thumbs .pd-thumb img { width:100% !important; height:100% !important; object-fit:cover; display:block; }
.hd-thumbs .pd-thumb-more::before { content:''; position:absolute; inset:0; background:rgba(14,14,18,.55); z-index:1; }
.hd-thumbs .pd-thumb-more-count { position:absolute; inset:0; z-index:2; display:flex; align-items:center; justify-content:center; color:#fff; font-size:13px; font-weight:700; }

.hd-lb { position:fixed; inset:0; z-index:100060; background:rgba(0,0,0,.92); display:flex; align-items:center; justify-content:center; }
.hd-lb img { max-width:94%; max-height:90%; object-fit:contain; }
body .hd-lb button { position:absolute; border:0; width:44px; height:44px; border-radius:50%; background:rgba(255,255,255,.14); color:#fff; font-size:22px; cursor:pointer; }
.hd-lb .x { top:14px; right:14px; } .hd-lb .p { left:10px; top:50%; } .hd-lb .n { right:10px; top:50%; }

.hd-inc { margin-top:14px; }

/* ---------- Проверка heydealer eye ---------- */
.hd-eye { gap:16px !important; }
.hd-check .hd-eye-video { position:relative; display:block; width:100%; aspect-ratio:16/10; border:0; padding:0; border-radius:12px; overflow:hidden; cursor:pointer;
  background-size:cover; background-position:center; background-color:#1e1e24; }
.hd-eye-video::after { content:''; position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,0) 40%, rgba(0,0,0,.55)); }
.hd-eye-video .hd-play { position:absolute; left:50%; top:46%; transform:translate(-50%,-50%); z-index:1; }
.hd-eye-video-t { position:absolute; left:14px; bottom:12px; z-index:1; color:#fff; font-size:13px; font-weight:700; }
.hd-eye-player { width:100%; aspect-ratio:16/10; border-radius:12px; background:#000; display:block; }
.hd-eye-k { font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:rgba(255,255,255,.45); margin-bottom:6px; }
.hd-eye-sum .pdc-score-t { font-size:17px; }
.hd-eye-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.hd-eye-stat { border-radius:10px; background:rgba(255,255,255,.06); padding:10px 12px; display:flex; flex-direction:column; gap:2px; }
.hd-eye-stat b { font-size:24px; line-height:1; font-weight:800; color:#2FB666; }
.hd-eye-stat.warn b { color:#F59E0B; }
.hd-eye-stat.info b { color:#38BDF8; }
.hd-eye-stat span { font-size:12px; color:rgba(255,255,255,.6); }
.hd-check .pdl-m.type-W, .hd-check .pdc-mk[data-type="W"], .hd-pill.type-W { background:#EA580C; }
.pdl-m.type-P, .pdc-mk[data-type="P"], .hd-pill.type-P { background:#0EA5E9; }
.hd-pill.type-X { background:var(--accent,#E11D2E); }
.hd-li-src { color:var(--muted,#6E6E76); font-size:12px; }

/* ---------- Термоснимки ---------- */
.hd-thermo { display:flex; flex-direction:column; gap:14px; }
.hd-th-bar { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.hd-th-groups { display:flex; gap:6px; flex-wrap:wrap; }
#hdThermo .hd-th-groups button, #hdThermo .hd-th-modes button { border:1px solid var(--line,#ececf0); background:#fff; color:var(--ink,#0A0A0B); font:inherit; font-size:13px; font-weight:600;
  padding:8px 14px; border-radius:999px; cursor:pointer; display:flex; align-items:center; gap:7px; }
#hdThermo .hd-th-groups button.is-on { background:var(--ink,#0A0A0B); color:#fff; border-color:var(--ink,#0A0A0B); }
.hd-th-groups .cn { min-width:18px; height:18px; padding:0 5px; border-radius:9px; background:#F59E0B; color:#fff; font-size:11px; font-weight:700; display:inline-flex; align-items:center; justify-content:center; }
.hd-th-modes { display:flex; padding:3px; border-radius:999px; background:var(--bg,#f7f7f9); border:1px solid var(--line,#ececf0); }
#hdThermo .hd-th-modes button { border:0; background:none; padding:6px 14px; }
#hdThermo .hd-th-modes button.is-on { background:#fff; box-shadow:0 1px 4px rgba(14,14,18,.12); }
#hdThermo .hd-th-modes button:disabled { opacity:.35; cursor:default; }
.hd-th-stage { background:#0E0E12; border-radius:14px; padding:18px; overflow-x:auto; -webkit-overflow-scrolling:touch; }
.hd-th-fig { display:none; position:relative; margin:0 auto; max-width:100%; }
.hd-th-fig.is-on { display:block; }
.hd-th-fig img { display:block; width:100%; height:auto; border-radius:6px; }
.hd-th-fig[data-mode="panel"] img { filter:brightness(1.9) contrast(1.15); }
.hd-th-swipe { display:none; font-size:12px; color:var(--muted,#6E6E76); margin-top:-6px; }
.hd-th-fig[data-group="hood"], .hd-th-fig[data-group="trunk"] { max-width:560px; }
.hd-th-box { position:absolute; border:2px solid #F59E0B; border-radius:6px; background:rgba(245,158,11,.10); cursor:pointer; transition:background .2s, box-shadow .2s; }
.hd-th-box.type-W { border-color:#EA580C; background:rgba(234,88,12,.12); }
.hd-th-box.type-P { border-color:#0EA5E9; background:rgba(14,165,233,.10); }
.hd-th-box.type-X { border-color:var(--accent,#E11D2E); background:rgba(225,29,46,.12); }
.hd-th-box b { position:absolute; left:-11px; top:-11px; width:22px; height:22px; border-radius:50%; background:#fff; color:var(--ink,#0A0A0B); font-size:12px; font-weight:800;
  display:flex; align-items:center; justify-content:center; box-shadow:0 2px 6px rgba(0,0,0,.35); }
.hd-th-box.is-hl { background:rgba(255,255,255,.18); box-shadow:0 0 0 3px rgba(255,255,255,.55); }
.hd-th-list { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:10px; }
.hd-th-it { display:flex; gap:12px; align-items:center; padding:10px; border-radius:12px; border:1px solid var(--line,#ececf0); background:#fff; cursor:pointer; transition:border-color .2s, box-shadow .2s, opacity .2s; }
.hd-th-it:not(.in-view) { opacity:.6; }
.hd-th-it.is-hl { border-color:var(--ink,#0A0A0B); box-shadow:0 4px 14px rgba(14,14,18,.10); opacity:1; }
.hd-th-crop { flex:0 0 auto; height:64px; max-width:120px; min-width:44px; border-radius:8px; background-repeat:no-repeat; background-color:#0E0E12; }
.hd-th-txt { min-width:0; }
.hd-th-t { display:flex; align-items:flex-start; gap:8px; font-size:14px; font-weight:700; color:var(--ink,#0A0A0B); line-height:1.35; }
.hd-th-l { min-width:0; padding-top:1px; }
.hd-th-n { width:20px; height:20px; border-radius:50%; background:var(--ink,#0A0A0B); color:#fff; font-size:11px; font-weight:800; display:inline-flex; align-items:center; justify-content:center; flex:0 0 auto; }
.hd-pill { display:inline-block; color:#fff; font-size:11px; font-weight:700; padding:1px 8px; border-radius:999px; margin-right:4px; vertical-align:1px; }
.hd-th-c { margin-top:3px; font-size:13px; line-height:1.45; color:var(--ink-3,#3d3d48); }
.hd-th-note { font-size:13px; line-height:1.55; color:var(--ink-3,#3d3d48); background:var(--bg,#f7f7f9); border-radius:12px; padding:12px 14px; }

.hd-docs { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(0,1fr); gap:16px; margin-top:22px; }
.hd-doc { margin:0; border:1px solid var(--line,#ececf0); border-radius:14px; background:#fff; overflow:hidden; }
.hd-doc-ub a { display:block; background:#000; }
.hd-doc-ub img { display:block; width:100%; height:auto; }
.hd-doc figcaption, .hd-doc-h { padding:12px 14px; font-size:13px; line-height:1.45; color:var(--ink-3,#3d3d48); }
.hd-doc-h { display:flex; flex-direction:column; gap:2px; }
.hd-doc-h span { color:var(--muted,#6E6E76); font-size:12px; }
.hd-doc figcaption b, .hd-doc-h b { color:var(--ink,#0A0A0B); }
.hd-doc-pages { display:grid; grid-template-columns:1fr 1fr; gap:10px; padding:0 14px 14px; }
.hd-doc-pages a { position:relative; display:block; border-radius:8px; overflow:hidden; border:1px solid var(--line,#ececf0); }
.hd-doc-pages img { display:block; width:100%; height:auto; }
.hd-doc-pages span { position:absolute; right:6px; bottom:6px; padding:2px 7px; border-radius:6px; background:rgba(14,14,18,.7); color:#fff; font-size:11px; }

/* ---------- Состояние ---------- */
.hd-cond { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-top:16px; }
.hd-cond-it { display:flex; gap:12px; align-items:flex-start; padding:14px; border-radius:14px; border:1px solid var(--line,#ececf0); background:#fff; }
.hd-cond-it.warn { border-color:#F5D9A8; background:#FFFBF2; }
.hd-cond-ic { flex:0 0 38px; height:38px; border-radius:10px; background:var(--bg,#f7f7f9); color:var(--ink,#0A0A0B); display:flex; align-items:center; justify-content:center; }
.hd-cond-l { font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--muted,#6E6E76); }
.hd-cond-v { font-size:14px; font-weight:600; color:var(--ink,#0A0A0B); margin-top:2px; line-height:1.4; }
.hd-cond-n { font-size:12px; color:#8a6320; margin-top:6px; line-height:1.45; }
.hd-cond-photos { grid-column:1 / -1; display:grid; grid-template-columns:repeat(4,1fr); gap:8px; }
.hd-cond-photos a { display:block; border-radius:10px; overflow:hidden; aspect-ratio:4/3; }
.hd-cond-photos img { width:100%; height:100%; object-fit:cover; display:block; }

/* ---------- Комплектация: отсутствующие, пакеты, «чем хороша» ---------- */
.hd-eq-no { margin-top:12px; font-size:13px; color:var(--muted,#6E6E76); }
.hd-eq-more { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,1fr); gap:16px; margin-top:18px; }
.hd-pack, .hd-hl { border:1px solid var(--line,#ececf0); border-radius:14px; background:#fff; padding:16px; }
.hd-pack-h { font-size:15px; font-weight:800; color:var(--ink,#0A0A0B); margin-bottom:10px; display:flex; flex-direction:column; gap:2px; }
.hd-pack-h span { font-size:12px; font-weight:500; color:var(--muted,#6E6E76); }
.hd-pack-it + .hd-pack-it { margin-top:12px; padding-top:12px; border-top:1px dashed var(--line,#ececf0); }
.hd-pack-t { font-size:14px; font-weight:700; }
.hd-pack ul, .hd-hl ul { margin:6px 0 0; padding:0 0 0 18px; font-size:13px; line-height:1.55; color:var(--ink-3,#3d3d48); }
.hd-hl ul { list-style:none; padding:0; }
.hd-hl li { position:relative; padding-left:24px; margin-top:8px; }
.hd-hl li::before { content:''; position:absolute; left:0; top:4px; width:14px; height:14px; border-radius:50%; background:#E7F6EC url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231E8C4A' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/9px no-repeat; }

/* ---------- Панель цены: что входит, телефон (у лота аукциона эти правила живут инлайном в его теле) ---------- */
.nd-au-inc { list-style:none; margin:14px 0 0; padding:12px 0 0; border-top:1px solid #EDEDF1; }
.nd-au-inc li { display:flex; align-items:flex-start; gap:8px; font-size:13px; color:var(--ink,#0E0E12); line-height:1.5; padding:3px 0; }
.nd-au-inc li::before, .nd-au-inc li::marker { content:none; }
.nd-au-inc li svg { flex:0 0 14px; margin-top:3px; color:#1E8C4A; }
.nd-au-phone { display:flex; align-items:center; justify-content:center; gap:8px; margin-top:12px; font-size:15px; font-weight:700; color:var(--ink,#0E0E12); text-decoration:none; }
.nd-au-phone span { font-size:12px; font-weight:400; color:var(--muted,#6E6E76); }
.po-city-switch { margin-bottom:2px; }
/* Опции: галочка и текст с отступом, как у Кореи */
#eq .pd-eq-it { display:flex; align-items:center; gap:8px; padding:3px 0; }
#eq .pd-eq-ic { flex:0 0 auto; color:var(--ink,#0A0A0B); }

/* ---------- Телефон ---------- */
@media (max-width:700px) {
  .hd-stage { border-radius:12px; }
  #hdStage .hd-seg button { padding:7px 11px; font-size:12px; }
  .hd-spin-tilt { right:8px; padding:4px; gap:4px; }
  #hdStage .hd-spin-tilt button { width:26px; height:26px; }
  .hd-spin-hint { top:12px; font-size:11px; padding:6px 11px; }
  .hd-stage-badge { left:10px; }
  .hd-stage[data-view="spin"] .hd-stage-badge { display:none; }
  #hdStage .hd-fs { width:34px; height:34px; right:10px; bottom:10px; }
  #hdStage .hd-photo-nav { width:32px; height:32px; }
  .hd-th-stage { padding:12px; }
  .hd-th-fig[data-group^="side"] { min-width:620px; }
  #hdThermo[data-group^="side"] .hd-th-swipe { display:block; }
  .hd-th-list { grid-template-columns:1fr; }
  .hd-docs { grid-template-columns:1fr; }
  .hd-cond { grid-template-columns:1fr; }
  .hd-cond-photos { grid-template-columns:repeat(4,1fr); }
  .hd-eq-more { grid-template-columns:1fr; }
}
@media print { .hd-seg, .hd-fs, .hd-spin-tilt, .hd-spin-hint, .hd-photo-nav { display:none !important; } }
