/* Карточка товара dongcheng.asia 2026 — та же стилистика, что карточка в программе USTA.tools (static/css/product-card.css),
   цвета DongCheng: акцент — синий, тёмный — тёмно-синий. Классы pc-, чтобы не мешать стилям темы. */
.product2026{--pc-accent:#005bac;--pc-accent-tx:#005bac;--pc-ink:#0b2c5f;--pc-card:#fff;--pc-soft:#f1f5fb;--pc-line:#d9e2ef;
  --pc-tx:#1d2433;--pc-mut:#5b6577;--pc-tint:#eaf2fb;--pc-buy:#e8770f;--pc-ok:#16a34a;
  background:#f6f8fc;padding:18px 0 34px}
.product2026 .container{max-width:1320px}
.pc{color:var(--pc-tx);font-size:15px;line-height:1.45}
.pc *{box-sizing:border-box}
.pc [hidden]{display:none!important}
.pc a{text-decoration:none}

/* Верх: фото слева, главное справа */
.pc-hero{position:relative;display:grid;grid-template-columns:minmax(300px,520px) minmax(0,1fr);gap:34px;
  background:var(--pc-card);border:1px solid var(--pc-line);border-radius:18px;padding:26px 28px;overflow:hidden}
/* синей полоски слева нет (владелец 07.11.2026: «полоски убрать, чтобы просто в рамочке была, в белой») */
@media(max-width:900px){.pc-hero{grid-template-columns:minmax(0,1fr);padding:16px 14px 18px;gap:18px}}

/* Галерея: миниатюры столбиком слева от фото, на телефоне — полоской под фото; видео — вторым */
.pc-gal{position:relative;min-width:0}
.pc-gal.has-th .pc-main{margin-left:84px}
.pc-main{position:relative;aspect-ratio:1/1;border-radius:14px;background:#fff;border:1px solid var(--pc-line);display:flex;align-items:center;justify-content:center;overflow:hidden}
.pc-main>a{display:flex;width:100%;height:100%;cursor:zoom-in;box-sizing:border-box}
/* главные значки, как в каталоге завода (владелец 07.11.2026): справа вверху столбиком на своей белой полосе — фото
   сдвигается и уменьшается, значки его никогда не закрывают; название — при наведении (на телефоне — нажатии) */
.pc-main.has-badges>a{padding:10px calc(clamp(46px,14%,70px) + 22px) 10px 10px}
.pc-bside{position:absolute;top:12px;right:12px;display:flex;flex-direction:column;align-items:center;gap:8px;z-index:2;width:clamp(46px,14%,70px)}
.pc-bside>span,.pc-plat{position:relative;display:block;width:100%;outline:none}
.pc-bside img,.pc-plat img{width:100%;height:auto;display:block}
.pc-bside .pc-bnew img{filter:drop-shadow(0 2px 4px rgba(0,0,0,.18))}
.pc-main.playing .pc-bside{display:none}.pc-main.playing.has-badges>a{padding:0}
.pc-bside [data-tip]:hover::after,.pc-bside [data-tip]:focus::after,.pc-plat[data-tip]:hover::after,.pc-plat[data-tip]:focus::after{
  content:attr(data-tip);position:absolute;top:50%;right:calc(100% + 8px);transform:translateY(-50%);background:var(--pc-ink);color:#fff;
  font-size:12px;font-weight:600;line-height:1.3;padding:6px 10px;border-radius:7px;white-space:normal;width:max-content;max-width:200px;
  text-align:left;z-index:5;pointer-events:none}
.pc-plat[data-tip]:hover::after,.pc-plat[data-tip]:focus::after{top:auto;bottom:calc(100% + 6px);right:0;transform:none;max-width:280px}
.pc-keyrow{display:flex;gap:12px;align-items:center}
.pc-keyrow .pc-key{flex:1 1 auto;min-width:0}
.pc-plat{flex:none;width:110px}
@media(max-width:560px){.pc-plat{width:88px}}
/* гарантия — крупно и ясно (владелец 07.11.2026: «2 года — чтобы прям ярко было видно, чётко, грамотно»), условие — мелко */
.pc-war{display:flex;align-items:center;gap:12px;align-self:flex-start;border-radius:14px;padding:10px 18px 10px 12px;min-width:0;
  background:#eaf2fb;border:1.5px solid #9cc0e6}
.pc-war svg{flex:none;width:38px;height:42px}
.pc-war b{display:block;font-size:22px;line-height:1.1;font-weight:900;color:#005bac;white-space:nowrap;letter-spacing:-.01em}
.pc-war span{display:block;font-size:13px;line-height:1.35;color:var(--pc-mut);margin-top:3px}
@media(max-width:520px){.pc-war b{font-size:19px}.pc-war span{font-size:12px}}
.pc-main img{width:100%;height:100%;object-fit:contain}
.pc-main.playing{background:#000}
.pc-main iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.pc-noph-in{display:flex;align-items:center;justify-content:center;width:100%;height:100%;background:var(--pc-soft)}
.pc-noph-in img{width:40%;height:auto;opacity:.6}
.pc-thumbs{position:absolute;top:0;bottom:0;left:0;width:72px;display:flex;flex-direction:column;gap:8px;overflow-y:auto;scrollbar-width:thin}
.pc-thumbs button{position:relative;flex:none;width:72px;height:72px;border-radius:10px;border:2px solid var(--pc-line);background:#fff;padding:0;cursor:pointer;overflow:hidden}
.pc-thumbs button:hover{border-color:#9db8da}
.pc-thumbs button.on{border-color:var(--pc-accent)}
.pc-thumbs img{width:100%;height:100%;object-fit:contain}
.pc-thumbs .vid{background:var(--pc-ink)}
.pc-thumbs .vid img{object-fit:cover}
.pc-thumbs .play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.18)}
.pc-thumbs .play svg{width:30px;height:30px;padding:6px 5px 6px 7px;border-radius:50%;background:var(--pc-accent);fill:#fff;box-shadow:0 2px 6px rgba(0,0,0,.3)}
@media(max-width:900px){
  .pc-gal.has-th .pc-main{margin-left:0}
  .pc-thumbs{position:static;width:auto;flex-direction:row;overflow-x:auto;overflow-y:hidden;margin-top:10px}
  .pc-thumbs button{width:62px;height:62px}
}

.pc-info{min-width:0;display:flex;flex-direction:column;gap:16px}
.pc-crumbs{font-size:12px;letter-spacing:.04em;text-transform:uppercase;color:var(--pc-mut)}
.pc-crumbs a{color:inherit}.pc-crumbs a:hover{color:var(--pc-accent)}
.pc-title{font-size:30px;line-height:1.15;font-weight:800;letter-spacing:-.01em;margin:6px 0 0;color:var(--pc-ink)}
@media(max-width:900px){.pc-title{font-size:22px}}
.pc-chips{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.pc-sku{font:700 15px/1 Consolas,"SFMono-Regular",monospace;background:var(--pc-ink);color:#fff;padding:9px 13px;border-radius:9px;letter-spacing:.02em}
.pc-type{font-weight:700;font-size:13px;padding:7px 12px;border-radius:9px;border:1.5px solid var(--pc-accent);color:var(--pc-accent)}
/* Наличие: «В наличии» — зелёный, «Нет в наличии» — серый (без штук) */
.pc-stock{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:14px;padding:7px 13px;border-radius:99px}
.pc-stock i{width:9px;height:9px;border-radius:50%;background:currentColor}
.pc-stock.y{color:var(--pc-ok);background:#e8f7ee}
.pc-stock.n{color:#6b7176;background:#eef0f2}

/* Значки функций — только те, что есть у товара; название — при наведении (на телефоне — нажатии) */
.pc-icons{display:flex;flex-wrap:wrap;gap:7px}
.pc-ic{position:relative;flex:none;width:50px;height:50px;border-radius:10px;background:var(--pc-soft);display:flex;align-items:center;justify-content:center;transition:transform .15s;outline:none}
.pc-ic img{width:100%;height:100%;object-fit:contain;border-radius:10px}
.pc-ic:hover,.pc-ic:focus{transform:translateY(-2px)}
.pc-ic[data-tip]:hover::after,.pc-ic[data-tip]:focus::after{content:attr(data-tip);position:absolute;bottom:calc(100% + 7px);left:50%;transform:translateX(-50%);
  background:var(--pc-ink);color:#fff;font-size:12px;font-weight:600;padding:6px 10px;border-radius:7px;white-space:nowrap;z-index:5;pointer-events:none}
.pc-ictx{height:50px;max-width:160px;display:flex;align-items:center;font-size:11px;font-weight:600;line-height:1.2;color:var(--pc-mut);border:1.5px dashed var(--pc-line);border-radius:10px;padding:4px 9px}

@media(max-width:900px){.pc-ic{width:42px;height:42px}.pc-ictx{height:42px}}

/* Главные цифры */
.pc-key{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px}
.pc-key div{background:var(--pc-tint);border-radius:12px;padding:13px 15px}
.pc-key b{display:block;font-size:20px;line-height:1.15;font-weight:800;color:var(--pc-ink);overflow-wrap:anywhere}
.pc-key span{display:block;font-size:12px;color:var(--pc-mut);margin-top:4px}
@media(max-width:900px){.pc-key{grid-template-columns:1fr 1fr}.pc-key div{padding:11px 12px}.pc-key b{font-size:16px}}

/* Комплектации модели */
.pc-row{display:flex;flex-wrap:wrap;gap:6px 8px;align-items:center}
.pc-row>.lbl{font-size:13px;color:var(--pc-mut);margin-right:2px}
.pc-var{font-weight:700;font-size:13px;padding:7px 12px;border-radius:9px;border:1.5px solid var(--pc-line);color:var(--pc-tx);background:#fff}
.pc-var:hover{border-color:var(--pc-accent);color:var(--pc-accent)}
.pc-var.on{background:var(--pc-ink);border-color:var(--pc-ink);color:#fff}

/* Кнопки */
.pc-buy{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media(max-width:520px){.pc-buy{grid-template-columns:1fr}}
.pc-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:54px;border-radius:12px;padding:8px 14px;
  font-weight:700;font-size:15px;text-align:center;transition:filter .15s,transform .15s}
.pc-btn small{font-size:12px;font-weight:600;opacity:.8;margin-top:2px}
.pc-btn.buy{background:var(--pc-buy);color:#fff}
.pc-btn.buy:hover{filter:brightness(1.06);transform:translateY(-1px)}
.pc-btn.warr{border:2px solid var(--pc-accent);color:var(--pc-accent);background:#fff}
.pc-btn.warr:hover{background:var(--pc-tint)}

/* Модель, серия, бренд… */
.pc-facts{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:8px}
.pc-facts div{border:1px solid var(--pc-line);border-radius:10px;padding:9px 12px;min-width:0}
.pc-facts span{display:block;font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--pc-mut)}
.pc-facts b{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:14px;font-weight:700;line-height:1.25;overflow:hidden;overflow-wrap:anywhere}

/* Вкладки */
.pc-tabs{display:flex;gap:6px;overflow-x:auto;margin:22px 0 0;padding-bottom:0;scrollbar-width:none}
.pc-tabs::-webkit-scrollbar{display:none}
.pc-tabs button{flex:none;font:inherit;font-weight:700;font-size:15px;color:var(--pc-mut);background:#fff;border:1px solid var(--pc-line);
  border-radius:12px 12px 0 0;padding:12px 18px;cursor:pointer;position:relative;border-bottom-color:transparent}
.pc-tabs button:hover{color:var(--pc-ink)}
.pc-tabs button.on{background:var(--pc-ink);border-color:var(--pc-ink);color:#fff}
.pc-tabs button.on::after{content:'';position:absolute;left:12px;right:12px;bottom:0;height:3px;border-radius:3px 3px 0 0;background:#4da3ff}
.pc-tabs sup{font-size:11px;font-weight:700;margin-left:4px;opacity:.7;vertical-align:1px}
.pc-panel{background:#fff;border:1px solid var(--pc-line);border-radius:0 14px 14px 14px;padding:22px 24px}
@media(max-width:900px){.pc-panel{padding:16px 14px}}
.pc.js .pc-panel{display:none}.pc.js .pc-panel.on{display:block}
.pc:not(.js) .pc-panel{margin-top:12px;border-radius:14px}
.pc-panel h3{font-size:13px;letter-spacing:.05em;text-transform:uppercase;color:var(--pc-mut);margin:20px 0 10px}
.pc-panel h3:first-child{margin-top:0}

/* Характеристики — полосами */
.pc-specs{width:100%;max-width:980px;border-collapse:separate;border-spacing:0;font-size:15px}
.pc-specs td{padding:11px 15px;border:0;vertical-align:top}
.pc-specs tr:nth-child(odd) td{background:var(--pc-soft)}
.pc-specs td:first-child{color:var(--pc-mut);width:45%;border-radius:8px 0 0 8px}
.pc-specs td:last-child{font-weight:700;border-radius:0 8px 8px 0}
.pc-specs tr.div td{background:none!important;font-weight:800;color:var(--pc-ink);padding-top:18px;text-transform:uppercase;font-size:12px;letter-spacing:.05em}

/* Функции и защиты */
.pc-fn{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px}
.pc-fn div{display:flex;align-items:center;gap:12px;border:1px solid var(--pc-line);border-radius:12px;padding:8px 12px 8px 8px;font-size:14px;font-weight:600}
.pc-fn img,.pc-fn .noic{width:46px;height:46px;flex:none;object-fit:contain;border-radius:9px}
.pc-fn .noic{border:1.5px dashed var(--pc-line)}

/* Комплектация, описание и особенности */
.pc-list,.pc-desc ul{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.pc-list li,.pc-desc li{display:flex;gap:12px;align-items:flex-start;line-height:1.45}
.pc-list li::before,.pc-desc li::before{content:'';flex:none;width:8px;height:8px;margin-top:8px;border-radius:2px;background:var(--pc-accent)}
.pc-list .q{margin-left:auto;flex:none;font-weight:800;background:var(--pc-soft);border-radius:7px;padding:1px 9px;font-size:13px}
.pc-desc{max-width:900px;line-height:1.6}
.pc-desc p{margin:0 0 12px}
.pc-desc ul{margin-top:16px}

/* Фото крупно */
.pc-zoom[hidden]{display:none}
.pc-zoom{position:fixed;inset:0;z-index:1000;background:rgba(11,44,95,.92);display:flex;align-items:center;justify-content:center;padding:24px;cursor:zoom-out}
.pc-zoom img{max-width:100%;max-height:100%;background:#fff;border-radius:12px;object-fit:contain}
.pc-zoom .x{position:absolute;top:14px;right:18px;width:44px;height:44px;border:0;border-radius:50%;background:#fff;color:var(--pc-ink);font-size:28px;line-height:1;cursor:pointer}