/* ==========================================================================
   Карточка изделия (Product.dc.html)
   ========================================================================== */

/* Тёмная шапка: только крошки; на телефоне без названия изделия */
.oa-phead--product .oa-phead__body {
	--ph-pad: 16px 4px 4px;
	--ph-pad-t: 18px 12px 6px;
	--ph-pad-d: 22px 20px 8px;
}

@media (max-width: 639px) {
	.oa-phead--product .oa-crumbs__current,
	.oa-phead--product .oa-crumbs__sep:nth-last-child(2) {
		display: none;
	}
}

/* ---------- Товар: медиа + информация ---------- */
.oa-product {
	background: #FFFFFF;
	border-radius: var(--oa-r-section);
	padding: 10px 10px 22px;
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 20px;
	align-items: start;
}

@media (min-width: 640px) {
	.oa-product {
		padding: 18px 18px 28px;
		gap: 28px;
	}
}

@media (min-width: 1024px) {
	.oa-product {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
		gap: 36px;
		padding: 24px;
	}
}

@media (min-width: 1024px) {
	.oa-product {
		gap: 48px;
	}
}

.oa-gallery {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 10px;
	min-width: 0;
}

@media (min-width: 1024px) {
	.oa-gallery {
		position: sticky;
		top: 84px; /* под закреплённой шапкой (v2.1) */
	}
}

/* Переключатель «Фото / 3D-модель» */
.oa-seg {
	align-self: flex-start;
	display: flex;
	gap: 4px;
	padding: 4px;
	border-radius: var(--oa-r-pill);
	background: var(--oa-card-2);
}

.oa-seg__btn {
	display: flex;
	align-items: center;
	gap: 8px;
	height: 40px;
	padding: 0 16px 0 12px;
	border-radius: var(--oa-r-pill);
	color: var(--oa-text);
	font-size: 14px;
	font-weight: 700;
	transition: background 0.2s ease, color 0.2s ease;
}

.oa-seg__btn:hover {
	background: #FFFFFF;
}

.oa-seg__btn[aria-pressed="true"] {
	background: var(--oa-ink);
	color: #FFFFFF;
}

.oa-seg__btn[aria-pressed="true"] svg {
	stroke: var(--oa-accent-light);
}

/* Главное фото 1:1 (v2.1): тёмное — в край на #16191C, светлое — целиком на радиальной подложке */
.oa-gallery__stage {
	position: relative;
	aspect-ratio: 1 / 1;
	border-radius: 18px;
	overflow: hidden;
	background: #16191C;
}

.oa-gallery__open {
	position: absolute;
	inset: 0;
	width: 100%;
	cursor: zoom-in;
}

.oa-gallery__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: 0;
	transition: opacity 0.25s ease;
}

.oa-gallery__img.is-active {
	opacity: 1;
}

.oa-gallery__stage.is-light {
	background: var(--oa-photo-light);
}

/* Предмет на светлом фоне — целиком, с полями 8% */
.oa-gallery__img--light,
.oa-gallery__img--white {
	object-fit: contain;
	padding: 8%;
}

/* Фото на белом фоне (яркость краёв ≥ 240): белый прямоугольник растворяется в подложке */
.oa-gallery__img--white {
	mix-blend-mode: multiply;
}

.oa-gallery__zoom {
	position: absolute;
	top: 14px;
	right: 14px;
	width: 40px;
	height: 40px;
	border-radius: var(--oa-r-pill);
	background: rgba(255, 255, 255, 0.14);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
	display: flex;
	align-items: center;
	justify-content: center;
	pointer-events: none;
}

.oa-gallery__stage.is-light .oa-gallery__zoom {
	background: rgba(18, 20, 18, 0.55);
}

.oa-gnav {
	position: absolute;
	top: 50%;
	width: 40px;
	height: 40px;
	margin-top: -20px;
	border-radius: var(--oa-r-pill);
	background: rgba(255, 255, 255, 0.92);
	color: var(--oa-ink);
	display: flex;
	align-items: center;
	justify-content: center;
	transition: transform 0.2s ease, background 0.2s ease;
}

.oa-gnav:hover {
	transform: scale(1.06);
	background: #FFFFFF;
}

.oa-gnav--prev {
	left: 12px;
}

.oa-gnav--next {
	right: 12px;
}

.oa-gallery__counter {
	position: absolute;
	left: 14px;
	bottom: 14px;
	padding: 6px 12px;
	border-radius: var(--oa-r-pill);
	background: rgba(16, 19, 22, 0.7);
	color: #FFFFFF;
	font-size: 12px;
	font-weight: 700;
	pointer-events: none;
}

.oa-gallery__empty {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
}

@media (min-width: 640px) {
	.oa-gallery__stage {
		border-radius: 24px;
	}

	.oa-gnav {
		width: 48px;
		height: 48px;
		margin-top: -24px;
	}
}

/* Миниатюры */
.oa-thumbs {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: 8px;
}

.oa-thumb {
	position: relative;
	aspect-ratio: 1 / 1;
	border-radius: 14px;
	overflow: hidden;
	border: 2px solid transparent;
	background: #16191C;
	opacity: 0.72;
	transition: opacity 0.2s ease, border-color 0.2s ease;
}

.oa-thumb img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.oa-thumb:hover {
	opacity: 1;
}

.oa-thumb[aria-pressed="true"] {
	border-color: var(--oa-accent-light);
	opacity: 1;
}

.oa-thumb--3d {
	background: var(--oa-ink);
	color: var(--oa-accent-light);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 4px;
	font-size: 11px;
	font-weight: 700;
	opacity: 0.85;
}

/* 3D-сцена */
.oa-model {
	position: relative;
	aspect-ratio: 4 / 5;
	border-radius: 18px;
	overflow: hidden;
	background: radial-gradient(120% 80% at 50% 30%, #2A3036 0%, #16191C 60%, #0E1114 100%);
}

.oa-model:fullscreen {
	aspect-ratio: auto;
	border-radius: 0;
}

.oa-model__scene,
.oa-model__scene model-viewer {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	--poster-color: transparent;
	background: transparent;
}

.oa-model__floor {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	opacity: 0.35;
	pointer-events: none;
}

.oa-model__badge {
	position: absolute;
	top: 14px;
	left: 14px;
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 6px 12px 6px 9px;
	border-radius: var(--oa-r-pill);
	background: var(--oa-accent);
	color: var(--oa-on-accent);
	font-size: 12px;
	font-weight: 700;
	pointer-events: none;
}

.oa-model__full {
	position: absolute;
	top: 14px;
	right: 14px;
	width: 40px;
	height: 40px;
	border-radius: var(--oa-r-pill);
	background: rgba(255, 255, 255, 0.14);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
	display: flex;
	align-items: center;
	justify-content: center;
}

.oa-model__ctrls {
	position: absolute;
	left: 50%;
	bottom: 14px;
	transform: translateX(-50%);
	display: flex;
	align-items: center;
	gap: 4px;
	padding: 5px;
	border-radius: var(--oa-r-pill);
	background: rgba(16, 19, 22, 0.78);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
}

.oa-3dbtn {
	width: 38px;
	height: 38px;
	border-radius: var(--oa-r-pill);
	color: #FFFFFF;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background 0.18s ease;
}

.oa-3dbtn:hover {
	background: rgba(255, 255, 255, 0.16);
}

.oa-3dbtn[aria-pressed="true"] {
	background: var(--oa-accent);
	color: var(--oa-on-accent);
}

.oa-3dbtn__pause,
.oa-3dbtn[aria-pressed="true"] .oa-3dbtn__play {
	display: none;
}

.oa-3dbtn[aria-pressed="true"] .oa-3dbtn__pause {
	display: flex;
}

.oa-model__hint {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 0 6px;
	font-size: 13px;
	line-height: 1.45;
	color: var(--oa-muted);
}

.oa-model__hint svg {
	flex-shrink: 0;
}

@media (min-width: 640px) {
	.oa-model {
		border-radius: 24px;
	}

	.oa-3dbtn {
		width: 42px;
		height: 42px;
	}
}

/* ---------- Информация ---------- */
.oa-pinfo {
	display: flex;
	flex-direction: column;
	gap: 22px;
	min-width: 0;
}

@media (min-width: 1024px) {
	.oa-pinfo {
		padding-top: 16px;
	}
}

.oa-pinfo__head {
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.oa-pinfo__cat {
	align-self: flex-start;
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 7px 14px 7px 8px;
	border-radius: var(--oa-r-pill);
	background: var(--oa-accent-soft);
	color: var(--oa-accent-ink);
	font-size: 13px;
	font-weight: 700;
}

.oa-pinfo__cat:hover {
	text-decoration: underline;
}

.oa-pinfo__cat-icon {
	width: 22px;
	height: 22px;
	border-radius: var(--oa-r-pill);
	background: #FFFFFF;
	display: flex;
	align-items: center;
	justify-content: center;
}

.oa-pinfo__title {
	margin: 0;
	font-family: var(--oa-font-head);
	font-size: var(--oa-h1-product);
	line-height: 1.1;
	font-weight: var(--oa-fw-h1);
	letter-spacing: -0.02em;
	text-wrap: balance;
	overflow-wrap: anywhere;
}

.oa-pinfo__classes {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.oa-pinfo__chips {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.oa-tag--lg {
	min-width: 48px;
	height: 38px;
	justify-content: center;
	padding: 0 14px;
	border-radius: 12px;
	font-size: 15px;
}

.oa-tag--md {
	height: 34px;
	padding: 0 12px;
	font-size: 14px;
}

.oa-pinfo__lead {
	font-size: 15px;
	line-height: 1.65;
	color: var(--oa-text);
	text-wrap: pretty;
}

.oa-pinfo__facts {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 8px;
}

.oa-pfact {
	padding: 12px 14px;
	border-radius: 18px;
	background: var(--oa-card-2);
	display: flex;
	flex-direction: column;
	gap: 4px;
	min-width: 0;
}

.oa-pfact__label {
	font-size: 12px;
	font-weight: 700;
	color: var(--oa-muted);
}

.oa-pfact__value {
	font-size: 15px;
	font-weight: 700;
	line-height: 1.3;
	overflow-wrap: anywhere;
}

.oa-pinfo__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.oa-pinfo__req {
	flex: 1 1 220px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	height: 58px;
	padding: 0 6px 0 24px;
	border-radius: var(--oa-r-pill);
	background: var(--oa-accent);
	color: var(--oa-on-accent);
	font-size: 16px;
	font-weight: 700;
	transition: transform 0.2s ease, filter 0.2s ease;
}

.oa-pinfo__req:hover {
	transform: translateY(-2px);
	filter: brightness(1.06);
}

.oa-pinfo__req .oa-btn__circle {
	width: 46px;
	height: 46px;
	background: #FFFFFF;
}

.oa-pinfo__req .oa-btn__circle svg {
	stroke: var(--oa-accent);
}

.oa-pinfo__phone {
	flex: 1 1 200px;
	height: 58px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 0 20px;
	border-radius: var(--oa-r-pill);
	font-size: 15px;
	font-weight: 700;
	transition: background 0.2s ease, color 0.2s ease;
}

@media (min-width: 640px) {

	.oa-pinfo__lead {
		font-size: 16px;
	}

	.oa-pfact {
		padding: 16px 18px;
	}

	.oa-pfact__value {
		font-size: 17px;
	}
}

@media (min-width: 1024px) {

	.oa-pinfo__lead {
		font-size: 17px;
	}
}

/* ---------- Об изделии: вкладки ---------- */
.oa-about-product {
	gap: 20px;
}

.oa-tabs {
	display: flex;
	gap: 4px;
	padding: 4px;
	border-radius: var(--oa-r-pill);
	background: var(--oa-card-2);
	overflow-x: auto;
	max-width: 100%;
	scrollbar-width: none;
}

.oa-tabs::-webkit-scrollbar {
	display: none;
}

.oa-tabs__tab {
	flex-shrink: 0;
	display: flex;
	align-items: center;
	gap: 8px;
	height: 42px;
	padding: 0 12px 0 14px;
	border-radius: var(--oa-r-pill);
	color: var(--oa-text);
	font-size: 14px;
	font-weight: 700;
	white-space: nowrap;
	transition: background 0.2s ease, color 0.2s ease;
}

.oa-tabs__tab[aria-selected="false"]:hover {
	background: #FFFFFF;
}

.oa-tabs__tab[aria-selected="true"] {
	background: var(--oa-ink);
	color: #FFFFFF;
}

.oa-tabs__tab[aria-selected="true"] .oa-tabs__icon {
	stroke: var(--oa-accent-light);
}

.oa-tabs__count {
	min-width: 24px;
	height: 24px;
	padding: 0 7px;
	border-radius: var(--oa-r-pill);
	background: #FFFFFF;
	color: var(--oa-ink);
	font-size: 12px;
	font-weight: 700;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.oa-tabs__tab[aria-selected="true"] .oa-tabs__count {
	background: var(--oa-accent-light);
}

.oa-about-product__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 14px;
	align-items: start;
}

.oa-tabpanel {
	min-width: 0;
	border-radius: 24px;
	background: var(--oa-card-2);
	padding: 16px 14px;
	display: flex;
	flex-direction: column;
	gap: 22px;
}

.oa-tabpanel:focus-visible {
	outline-offset: 4px;
}

/* Текст изделия в панели: заголовки 18/800, абзацы 16/1.7 */
.oa-content.oa-tabcontent {
	max-width: none;
	color: #3A3E37;
}

.oa-content.oa-tabcontent h2,
.oa-content.oa-tabcontent h3,
.oa-content.oa-tabcontent h4,
.oa-content.oa-tabcontent .oa-subhead,
.oa-content.oa-tabcontent > p:has(> b:only-child),
.oa-content.oa-tabcontent > p:has(> strong:only-child) {
	margin-top: 22px;
	font-family: var(--oa-font);
	font-size: 18px;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: 0;
	color: var(--oa-ink);
}

.oa-content.oa-tabcontent > :first-child {
	margin-top: 0;
}

.oa-content.oa-tabcontent h2 + *,
.oa-content.oa-tabcontent h3 + *,
.oa-content.oa-tabcontent h4 + *,
.oa-content.oa-tabcontent .oa-subhead + * {
	margin-top: 8px;
}

.oa-content.oa-tabcontent p {
	max-width: 760px;
}

/* Таблицы в стиле макета: белая подложка, скругление; строка-заголовок — тёмная */
.oa-content.oa-tabcontent .oa-table-wrap {
	border: 0;
	border-radius: 16px;
}

.oa-content.oa-tabcontent table {
	font-size: 15px;
}

.oa-content.oa-tabcontent th,
.oa-content.oa-tabcontent td {
	padding: 14px 16px;
	border-bottom: 0;
	border-top: 1px solid #EFEDE6;
}

.oa-content.oa-tabcontent tr:first-child td,
.oa-content.oa-tabcontent tr:first-child th {
	border-top: 0;
}

.oa-content.oa-tabcontent tbody tr:nth-child(even) td {
	background: #FFFFFF;
}

.oa-content.oa-tabcontent td:first-child {
	width: 40%;
	font-size: 14px;
	font-weight: 700;
	color: var(--oa-muted);
}

.oa-content.oa-tabcontent td + td {
	font-weight: 700;
	color: var(--oa-ink);
}

.oa-content.oa-tabcontent thead th,
.oa-content.oa-tabcontent thead td,
.oa-content.oa-tabcontent tr.oa-tr-head td,
.oa-content.oa-tabcontent tr.oa-tr-head th {
	background: var(--oa-ink) !important;
	color: #FFFFFF;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	padding: 12px 16px;
}

.oa-content.oa-tabcontent tr.oa-tr-head strong {
	color: #FFFFFF;
	font-weight: 700;
}

/* Таблица размеров: 3+ колонки — первая колонка жирная, остальные обычные */
.oa-content.oa-tabcontent table:has(tr > :nth-child(3)) td:first-child {
	width: auto;
	font-size: 15px;
	font-weight: 700;
	color: var(--oa-ink);
}

.oa-content.oa-tabcontent table:has(tr > :nth-child(3)) td + td {
	font-weight: 600;
	color: var(--oa-text);
}

/* Площадь защиты по классам */
.oa-areas {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.oa-areas__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 8px;
}

.oa-area {
	display: grid;
	grid-template-columns: 84px minmax(0, 1fr);
	gap: 12px;
	align-items: center;
	padding: 14px 16px;
	border-radius: 16px;
	background: #FFFFFF;
}

.oa-area__classes {
	display: flex;
	flex-wrap: wrap;
	gap: 4px;
}

.oa-area__text {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.oa-area__value {
	font-size: 16px;
	font-weight: 700;
}

.oa-area__note {
	font-size: 13px;
	line-height: 1.45;
	color: var(--oa-muted);
}

/* Классы защиты под описанием */
.oa-desc-classes {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.oa-desc-classes h3 {
	margin: 0;
	font-size: 18px;
	font-weight: 700;
}

.oa-desc-classes__row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
}

.oa-desc-classes__std {
	font-size: 14px;
	font-weight: 700;
	color: var(--oa-muted);
}

/* Боковая колонка вкладок: только «Остались вопросы?» (v2.1) */
.oa-about-product__aside {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

/* «Остались вопросы?» (v2.3): телефоны, почта, WhatsApp */
.oa-ask-card {
	border-radius: 24px;
	border: 1px solid var(--oa-line);
	background: linear-gradient(180deg, #FFFFFF 0%, #FAFAF6 100%);
	box-shadow: var(--oa-shadow-soft);
	padding: 22px;
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.oa-ask-card__head,
.oa-ask-card__rows {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.oa-ask-card__caption {
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--oa-muted);
}

.oa-ask-card__lead {
	font-size: 14px;
	line-height: 1.55;
	color: var(--oa-text);
}

.oa-qrow {
	display: flex;
	align-items: center;
	gap: 12px;
	min-height: 44px;
	border-radius: 16px;
}

.oa-qrow__icon {
	flex-shrink: 0;
	width: 40px;
	height: 40px;
	border-radius: var(--oa-r-pill);
	background: var(--oa-accent-soft);
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background 0.18s ease;
}

.oa-qrow--mail .oa-qrow__icon {
	background: var(--oa-card-2);
}

.oa-qrow__text {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.oa-qrow__num {
	font-family: var(--oa-font-head);
	font-size: 16px;
	font-weight: 600;
	white-space: nowrap;
	transition: color 0.18s ease;
}

.oa-qrow__note {
	font-size: 12px;
	font-weight: 600;
	color: var(--oa-muted);
}

.oa-qrow__mail {
	font-size: 15px;
	font-weight: 700;
	color: var(--oa-text);
	overflow-wrap: anywhere;
	transition: color 0.18s ease;
}

.oa-qrow:hover .oa-qrow__num,
.oa-qrow:hover .oa-qrow__mail {
	color: var(--oa-accent);
}

.oa-qrow:hover .oa-qrow__icon {
	background: var(--oa-accent-pale);
}

/* Кнопка «Написать в WhatsApp»: зелёная «таблетка» 52 px, белый круг со стрелкой */
.oa-wa {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	min-height: 52px;
	padding: 6px 6px 6px 18px;
	border-radius: var(--oa-r-pill);
	background: var(--oa-accent);
	color: var(--oa-on-accent);
	font-size: 15px;
	font-weight: 800;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.oa-wa:hover {
	transform: translateY(-2px);
	box-shadow: var(--oa-glow-accent);
}

.oa-wa__label {
	display: flex;
	align-items: center;
	gap: 10px;
}

.oa-wa__label svg {
	flex-shrink: 0;
}

.oa-wa__circle {
	flex-shrink: 0;
	width: 40px;
	height: 40px;
	border-radius: var(--oa-r-pill);
	background: #FFFFFF;
	display: flex;
	align-items: center;
	justify-content: center;
}

.oa-wa__note {
	margin-top: -6px;
	font-size: 12px;
	line-height: 1.5;
	color: var(--oa-muted);
}

@media (prefers-reduced-motion: reduce) {
	.oa-wa:hover {
		transform: none;
	}
}

@media (min-width: 640px) {
	.oa-about-product {
		gap: 24px;
	}

	.oa-tabs {
		align-self: flex-start;
	}

	.oa-tabs__tab {
		height: 48px;
		padding: 0 18px 0 14px;
		font-size: 15px;
	}

	.oa-tabpanel {
		padding: 28px;
	}

	.oa-areas__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.oa-area {
		grid-template-columns: 110px minmax(0, 1fr);
	}

	.oa-tabcontent td:first-child {
		width: 38%;
	}
}

@media (min-width: 1024px) {
	.oa-about-product__grid {
		grid-template-columns: minmax(0, 1fr) 340px;
		gap: 16px;
	}
}

/* ---------- Похожие изделия ---------- */
.oa-related {
	gap: 20px;
}

@media (max-width: 639px) {
	/* Телефон: горизонтальная лента, карточка 76% ширины */
	.oa-related__list.oa-plist--grid {
		grid-template-columns: none;
		grid-auto-flow: column;
		grid-auto-columns: 76%;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		gap: 12px;
		padding-bottom: 4px;
	}

	.oa-related__list .oa-pc {
		scroll-snap-align: start;
		padding: 10px;
		gap: 14px;
		border-radius: 24px;
	}

	.oa-related__list .oa-pc__title {
		font-size: 16px;
	}

	.oa-related__list .oa-pc__std {
		display: block;
	}

	.oa-related__list .oa-pc__req,
	.oa-related__list .oa-pc__more {
		min-height: 44px;
		height: 44px;
		font-size: 14px;
	}

	.oa-related__list .oa-pc__more {
		width: 44px;
	}
}

@media (min-width: 640px) {
	.oa-related__list.oa-plist--grid {
		grid-template-columns: repeat(4, minmax(0, 1fr));
		gap: 12px;
	}
}

@media (min-width: 640px) and (max-width: 1023px) {
	/* Планшет: плитки изделий в 3 колонки */
	.oa-related__list.oa-plist--grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (min-width: 1024px) {
	.oa-about-product,
	.oa-related {
		gap: 24px;
	}
}

/* ---------- Просмотр фото ---------- */
.oa-pviewer {
	width: 100%;
	max-width: 560px;
	max-height: calc(100vh - 24px);
	margin: auto;
	padding: 12px;
	border: 0;
	background: transparent;
	color: #FFFFFF;
	overflow: visible;
}

.oa-pviewer[open] {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.oa-pviewer::backdrop {
	background: rgba(10, 12, 14, 0.9);
}

.oa-pviewer__frame {
	position: relative;
	aspect-ratio: 4 / 5;
	max-height: calc(100vh - 110px);
	border-radius: 24px;
	overflow: hidden;
	background: #16191C;
}

.oa-pviewer__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.oa-pviewer__bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}

.oa-pviewer__caption {
	font-size: 14px;
	font-weight: 700;
	color: var(--oa-on-dark);
}

.oa-pviewer__close {
	flex-shrink: 0;
	width: 44px;
	height: 44px;
	border-radius: var(--oa-r-pill);
	background: #FFFFFF;
	color: var(--oa-ink);
	display: flex;
	align-items: center;
	justify-content: center;
}

@media (min-width: 640px) {
	.oa-pviewer {
		margin: var(--oa-view-top, 24px) auto 24px;
	}

	.oa-pviewer .oa-gnav {
		width: 48px;
		height: 48px;
		margin-top: -24px;
	}
}

/* ---------- Закреплённая панель (телефон) ---------- */
.oa-stickybar {
	position: sticky;
	bottom: 10px;
	z-index: 30;
	display: flex;
	gap: 8px;
	padding: 8px;
	border-radius: var(--oa-r-pill);
	background: rgba(18, 20, 18, 0.92);
	-webkit-backdrop-filter: blur(12px);
	backdrop-filter: blur(12px);
	box-shadow: 0 14px 30px rgba(0, 0, 0, 0.28);
}

.oa-stickybar__req {
	flex: 1 1 auto;
	height: 50px;
	border-radius: var(--oa-r-pill);
	background: var(--oa-accent);
	color: var(--oa-on-accent);
	font-size: 15px;
	font-weight: 700;
}

.oa-stickybar__call {
	flex-shrink: 0;
	width: 50px;
	height: 50px;
	border-radius: var(--oa-r-pill);
	background: rgba(255, 255, 255, 0.12);
	display: flex;
	align-items: center;
	justify-content: center;
}

@media (min-width: 1024px) {
	.oa-stickybar {
		display: none;
	}
}

/* Первая ячейка строки-заголовка таблицы — как остальные ячейки шапки */
.oa-content.oa-tabcontent tr.oa-tr-head td:first-child,
.oa-content.oa-tabcontent thead th:first-child {
	font-size: 12px;
	color: #FFFFFF;
}

/* ---------- v2.1: сервисные плитки, помощь с выбором, «Ещё в категории», «Как заказать» ---------- */

/* Фактов нет — «Цена» и «Поставка». ПК 1440 — 2 колонки, 1024 и телефон — 1, планшет — 2 */
.oa-pinfo__service,
.oa-sibs__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 8px;
}

.oa-svc {
	padding: 12px 14px;
	border-radius: 18px;
	background: var(--oa-card-2);
	display: flex;
	align-items: flex-start;
	gap: 12px;
}

.oa-svc__icon {
	flex-shrink: 0;
	width: 36px;
	height: 36px;
	border-radius: 12px;
	background: #FFFFFF;
	display: flex;
	align-items: center;
	justify-content: center;
}

.oa-svc__text {
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 3px;
}

.oa-svc__value {
	font-size: 15px;
	font-weight: 700;
	line-height: 1.35;
}

/* Нужна помощь с выбором? — сразу под кнопками; кнопка переносится под текст, если места мало */
.oa-help {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 14px;
	padding: 16px;
	border-radius: 22px;
	border: 1px solid var(--oa-line);
	background: linear-gradient(135deg, #FFFFFF 0%, #EEF6F2 100%);
	box-shadow: var(--oa-shadow-soft);
}

.oa-help__main {
	flex: 1 1 300px;
	min-width: 0;
	display: flex;
	align-items: flex-start;
	gap: 14px;
}

.oa-help__icon {
	flex-shrink: 0;
	width: 46px;
	height: 46px;
	border-radius: 14px;
	background: var(--oa-accent-soft);
	display: flex;
	align-items: center;
	justify-content: center;
}

.oa-help__text {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.oa-help__title {
	font-size: 16px;
	font-weight: 700;
	line-height: 1.3;
}

.oa-help__desc {
	font-size: 14px;
	line-height: 1.5;
	color: #5A5E55;
}

.oa-help__btn {
	flex-shrink: 0;
	min-height: 44px;
	padding: 0 18px;
}

/* Ещё в категории */
.oa-sibs {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding-top: 6px;
}

.oa-sibs__head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
}

.oa-sibs__all {
	font-size: 14px;
	font-weight: 700;
	color: var(--oa-accent-ink);
	white-space: nowrap;
}

.oa-sibs__all:hover {
	text-decoration: underline;
}

.oa-sib {
	min-width: 0;
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 8px 12px 8px 8px;
	border-radius: 18px;
	border: 1px solid var(--oa-line);
	background: #FFFFFF;
	box-shadow: var(--oa-shadow-rest);
	transition: transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
}

.oa-sib:hover {
	transform: translateY(-3px);
	border-color: var(--oa-card-hover-line);
	box-shadow: var(--oa-shadow-hover);
}

.oa-sib > svg {
	flex-shrink: 0;
}

.oa-sib__img {
	position: relative;
	flex-shrink: 0;
	width: 60px;
	height: 60px;
	border-radius: 12px;
	overflow: hidden;
	background: var(--oa-photo-light);
}

.oa-sib__img img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: contain;
	padding: 4px;
	mix-blend-mode: multiply;
}

.oa-sib__img.is-dark {
	background: var(--oa-photo);
}

.oa-sib__img.is-dark img {
	object-fit: cover;
	padding: 0;
	mix-blend-mode: normal;
}

.oa-sib__title {
	flex: 1 1 auto;
	min-width: 0;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.3;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* Как заказать — вместо «Об изделии», когда все вкладки были бы пустыми */
.oa-order {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 18px;
	align-items: start;
}

.oa-order__intro {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.oa-order__text {
	max-width: 420px;
	font-size: 15px;
	line-height: 1.6;
	color: var(--oa-text);
}

.oa-order__steps {
	margin: 0;
	padding: 0;
	list-style: none;
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 10px;
}

.oa-order__step {
	border-radius: 22px;
	background: var(--oa-card-2);
	padding: 20px;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.oa-order__num {
	width: 34px;
	height: 34px;
	border-radius: var(--oa-r-pill);
	background: var(--oa-ink);
	color: var(--oa-accent-light);
	font-family: var(--oa-font-head);
	font-size: 13px;
	font-weight: 500;
	display: flex;
	align-items: center;
	justify-content: center;
}

.oa-order__title {
	font-size: 16px;
	font-weight: 700;
}

.oa-order__desc {
	font-size: 14px;
	line-height: 1.55;
	color: var(--oa-text);
}

@media (min-width: 640px) {
	.oa-pinfo__service,
	.oa-sibs__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.oa-svc {
		padding: 16px 18px;
	}

	.oa-order__steps {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (min-width: 1024px) {
	.oa-pinfo__service,
	.oa-sibs__grid {
		grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	}

	.oa-order {
		grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.4fr);
		gap: 40px;
	}
}