/* plenki.kz — «Примерка цвета», страница /primerka-cveta (пак deploy/2026-11-03-primerka). Только .pvp*.
   Текст страниц «Информации» стоит в .blog-post, а тема красит там каждый span и h2 — поэтому правила начинаются с .pvp,
   span и заголовки внутри сброшены. Цвета — как у калькулятора: #0299ae, #00788b, рамки #d5e3e6. */
.pvp{display:grid;grid-template-columns:minmax(0,1fr);gap:18px;margin:0 0 24px;font-size:15px;line-height:1.4;color:#222}
.pvp *,.pvp *::before,.pvp *::after{box-sizing:border-box}
.pvp span{display:inline;margin:0;font-size:inherit;line-height:inherit;color:inherit}
.pvp button{font:inherit;color:inherit}
.pvp .pvp-vid{min-width:0}
.pvp .pvp-ramka{position:relative;overflow:hidden;border-radius:10px;background:#0d1214;aspect-ratio:4/3}
.pvp .pvp-holst{display:block;width:100%;height:100%;object-fit:cover}
.pvp .pvp-zagr{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(13,18,20,.55);color:#fff;font-size:15px;text-align:center}
.pvp .pvp-zagr[hidden]{display:none}
.pvp .pvp-orig{position:absolute;left:10px;bottom:10px;min-height:44px;padding:9px 14px;border:0;border-radius:18px;background:rgba(0,0,0,.6);color:#fff;font-size:13px;cursor:pointer;touch-action:none;-webkit-user-select:none;user-select:none}
.pvp .pvp-orig:hover,.pvp .pvp-orig:active{background:rgba(0,0,0,.8)}
.pvp .pvp-orig:focus-visible{outline:3px solid #7cc5d0;outline-offset:2px}
.pvp .pvp-mashiny{display:flex;gap:8px;margin:10px 0 0;padding:0 0 4px;overflow-x:auto;scrollbar-width:thin}
.pvp .pvp-mashina{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;width:104px;margin:0;padding:4px 4px 6px;border:2px solid #d5e3e6;border-radius:8px;background:#fff;cursor:pointer;transition:border-color .15s}
.pvp .pvp-mashina img{display:block;width:92px;height:69px;border-radius:5px;object-fit:cover;background:#0d1214}
.pvp .pvp-mashina span{display:block;margin-top:4px;font-size:12px;line-height:1.2;text-align:center}
.pvp .pvp-mashina:hover{border-color:#7cc5d0}
.pvp .pvp-mashina[aria-pressed="true"]{border-color:#0299ae;background:#e8f6f8}
.pvp .pvp-mashina:focus-visible,.pvp .pvp-plenka:focus-visible,.pvp .pvp-chip:focus-visible,.pvp .pvp-knopka:focus-visible,.pvp .pvp-foto:focus-visible{outline:3px solid #00788b;outline-offset:2px}
.pvp .pvp-ocenka{margin:8px 0 0;font-size:13px;line-height:1.4;color:#555}
.pvp .pvp-panel{min-width:0}
.pvp .pvp-info{margin:0 0 14px;padding:12px;border:1px solid #d5e3e6;border-radius:10px;background:#f7fbfc}
.pvp .pvp-info-shapka{display:flex;gap:12px;align-items:center}
.pvp .pvp-info-tekst{min-width:0}
.pvp h2.pvp-info-imya{margin:0;padding:0;font-size:18px;font-weight:700;line-height:1.25;color:#222;text-transform:none;letter-spacing:0}
.pvp .pvp-info-sv{margin:2px 0 0;font-size:13px;color:#555}
.pvp .pvp-info-cena{margin:4px 0 0;font-size:14px;color:#222}
.pvp .pvp-info-cena b{font-size:16px}
.pvp .pvp-net{color:#a33}
.pvp .pvp-knopki{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 0}
.pvp .pvp-knopka{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:8px 14px;border:2px solid #0299ae;border-radius:8px;background:#fff;color:#00788b;font-size:14px;font-weight:700;line-height:1.2;text-decoration:none}
.pvp .pvp-knopka:hover{background:#e8f6f8;color:#00606f;text-decoration:none}
.pvp .pvp-knopka.pvp-wa{border-color:#128c4b;background:#128c4b;color:#fff}
.pvp .pvp-knopka.pvp-wa:hover{background:#0e7a40;border-color:#0e7a40;color:#fff}
.pvp .pvp-foto{display:flex;align-items:center;gap:10px;width:100%;margin:12px 0 0;padding:6px;border:1px solid #d5e3e6;border-radius:8px;background:#fff;text-align:left;cursor:pointer}
.pvp .pvp-foto img{flex:none;width:64px;height:80px;border-radius:5px;object-fit:cover;background:#0d1214}
.pvp .pvp-foto span{font-size:14px;font-weight:700;color:#00788b}
.pvp .pvp-foto:hover{border-color:#7cc5d0}
.pvp .pvp-filtry{display:grid;gap:8px;margin:0 0 6px}
.pvp .pvp-poisk{width:100%;min-height:44px;padding:8px 12px;border:2px solid #d5e3e6;border-radius:8px;background:#fff;font-size:16px;color:#222}
.pvp .pvp-poisk:focus{border-color:#0299ae;outline:none}
.pvp .pvp-chipy{display:flex;flex-wrap:wrap;gap:6px}
.pvp .pvp-chip{display:inline-flex;align-items:center;gap:6px;min-height:40px;margin:0;padding:5px 11px;border:1px solid #cfe0e3;border-radius:17px;background:#fff;font-size:13px;line-height:1.2;cursor:pointer}
.pvp .pvp-chip:hover{border-color:#7cc5d0}
.pvp .pvp-chip[aria-pressed="true"]{border-color:#0299ae;background:#0299ae;color:#fff}
.pvp .pvp-tochka{display:inline-block;width:12px;height:12px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.25)}
.pvp .pvp-schet{margin:8px 0 6px;font-size:13px;color:#555}
.pvp .pvp-podpis-ryada{margin:4px 0 -2px;font-size:12px;font-weight:700;color:#555;text-transform:uppercase;letter-spacing:.03em}
.pvp .pvp-sbros{display:inline-flex;align-items:center;min-height:40px;margin:0 0 8px;padding:6px 14px;border:2px solid #0299ae;border-radius:8px;background:#fff;color:#00788b;font-size:14px;font-weight:700;cursor:pointer}
.pvp .pvp-sbros[hidden]{display:none}
.pvp .pvp-nadpis{position:absolute;left:10px;top:10px;max-width:calc(100% - 20px);overflow:hidden;padding:5px 10px;border:0;border-radius:6px;background:rgba(0,0,0,.6);color:#fff;font-size:13px;font-weight:700;line-height:1.3;text-align:left;white-space:nowrap;text-overflow:ellipsis;cursor:default}
.pvp .pvp-nadpis[hidden]{display:none}
.pvp .pvp-setka{display:grid;grid-template-columns:repeat(auto-fill,minmax(86px,1fr));gap:6px}
.pvp .pvp-plenka{display:flex;flex-direction:column;align-items:center;min-width:0;margin:0;padding:6px 4px;border:2px solid transparent;border-radius:8px;background:none;cursor:pointer;text-align:center}
.pvp .pvp-plenka[hidden]{display:none}
.pvp .pvp-plenka:hover{background:#f2f9fa}
.pvp .pvp-plenka[aria-selected="true"]{border-color:#0299ae;background:#e8f6f8}
.pvp .pvp-obr{display:block;width:46px;height:46px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.18),0 1px 2px rgba(0,0,0,.15)}
.pvp .pvp-obr-bol{flex:none;width:56px;height:56px}
.pvp .pvp-imya{display:-webkit-box;margin-top:5px;overflow:hidden;font-size:11.5px;line-height:1.2;-webkit-line-clamp:2;-webkit-box-orient:vertical;word-break:break-word}
.pvp .pvp-nom{display:block;font-size:11px;color:#555}
.pvp-okno{position:fixed;top:0;right:0;bottom:0;left:0;z-index:10050;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(0,0,0,.86)}
.pvp-okno[hidden]{display:none}
.pvp-okno-img{max-width:100%;max-height:100%;border-radius:8px;object-fit:contain}
.pvp-okno-x{position:absolute;top:10px;right:12px;width:44px;height:44px;border:0;border-radius:50%;background:rgba(255,255,255,.15);color:#fff;font-size:28px;line-height:44px;cursor:pointer}
.pvp-okno-x:focus-visible{outline:3px solid #7cc5d0}
body.pvp-bez-prokrutki{overflow:hidden}
@media (max-width:991px){
	/* телефон и планшет: машина всегда видна, пока листаете цвета; кадр — во всю ширину колонки */
	.pvp .pvp-vid{display:contents}
	.pvp .pvp-ramka.pvp-prikleen{position:fixed;top:0;z-index:1000;border-radius:0;box-shadow:0 6px 14px rgba(0,0,0,.25)}
	.pvp .pvp-ramka.pvp-prikleen .pvp-nadpis{cursor:pointer}
	.pvp .pvp-mashiny{margin:0}
	.pvp .pvp-ocenka{margin:-10px 0 0}
}
@media (min-width:992px){
	.pvp{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:24px;align-items:start}
	/* колонка с машиной сдвигается скриптом (transform): у html и body темы overflow-y: auto — sticky не держится */
	.pvp .pvp-mashiny{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));overflow:visible}
	.pvp .pvp-mashina{width:auto;min-width:0}
	.pvp .pvp-mashina img{width:100%;height:auto}
	.pvp .pvp-setka{max-height:520px;max-height:max(520px,calc(100vh - 160px));overflow-y:auto;padding-right:4px}
}
