/*
Theme Name: Optivarcart Child
Theme URI: https://optivarcart.com/
Description: Дочерняя тема витрины Optivarcart на базе GeneratePress.
Author: Optivarcart
Author URI: https://optivarcart.com/
Template: generatepress
Version: 0.2.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: optivarcart-child
*/

/*
 * Цветовая палитра Optivarcart.
 * Источник — макет главной страницы optivarcart.com (образец).
 * Все цвета берём только через эти переменные — единообразие по всей витрине.
 */

:root {
	/* Акцент — синие кнопки «В корзину», «Перейти в каталог», активный чип, ссылки.
	 * Обновлено 2026-10-09: взят из утверждённого лого (эмблема Softcart24 с корзиной),
	 * доминантные оттенки арта #0077fb/#0186fb. */
	--oc-primary: #017ffb;
	--oc-primary-hover: #0149e5;
	/* Светло-голубая подложка: кнопка «Выбрать номинал», ховеры чипов и ссылок */
	--oc-primary-soft: #e6f3ff;

	/* Градиент хиро-баннера: слева светлее, справа насыщеннее */
	--oc-hero-from: #7ea8be; /* подложка хиро — левый край арта «голубая сказка» */
	--oc-hero-to: #9fc8fe;

	/* Фоны */
	--oc-bg: #fefefe;          /* фон страницы */
	--oc-surface: #ffffff;     /* карточки товаров */
	--oc-surface-alt: #eef0f4; /* карточки категорий и светлые подложки (было #f7f8fa) */
	--oc-chip-bg: #f4f5f9;     /* неактивный чип фильтра */

	/* Линии и границы карточек */
	--oc-border: #e4e8f0;

	/* Текст: заголовки, основной, второстепенный, футер */
	--oc-text: #0a112e;
	--oc-text-body: #2e3852;
	--oc-text-muted: #5b6170;
	--oc-text-faint: #8a8f99;

	/* Иконки категорий */
	--oc-cat-games: #3c80eb;    /* Игры */
	--oc-cat-shopping: #674de8; /* Покупки */
	--oc-cat-apps: #26a173;     /* Приложения */
	--oc-cat-mobile: #f47c2d;   /* Мобильная связь */
}

/*
 * Хэдер витрины. Верхняя строка: лого — поиск — вход/корзина.
 * Нижняя строка: кнопка «Каталог» + меню (локация Primary).
 */

.oc-container {
	max-width: 1160px;
	margin: 0 auto;
	padding-left: 20px;
	padding-right: 20px;
}

.oc-header {
	background: var(--oc-bg);
	border-bottom: 1px solid var(--oc-border);
}

.oc-header__top {
	display: grid;
	/* первая колонка auto: широкое лого не сжимается и не искажается;
	 * лого и действия фиксированной ширины, поиск центрируется между ними */
	grid-template-columns: auto 1fr auto;
	align-items: center;
	gap: 24px;
	padding-top: 14px;
	padding-bottom: 14px;
}

.oc-header__top > .oc-logo {
	justify-self: start;
}

.oc-header__top > .oc-header__actions {
	justify-self: end;
	margin-left: 0;
	/* фиксированная ширина зоны «Войти/Корзина» = зеркальный вес лого-колонки,
	 * тогда поиск стоит ровно по центру строки */
	min-width: 237px;
}

.oc-logo {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	text-decoration: none;
	flex-shrink: 0;
}

.oc-search {
	position: relative;
	display: flex;
	align-items: center;
	width: 100%;
}

.oc-logo__img {
	height: 52px;
	width: auto;
	display: block;
}

.oc-logo--footer .oc-logo__img {
	height: 30px;
}

.oc-search {
	flex: 1;
	max-width: 520px;
	position: relative;
	display: flex;
	align-items: center;
	justify-self: center;
	margin: 0 auto;
}

.oc-search svg {
	position: absolute;
	left: 14px;
	width: 18px;
	height: 18px;
	color: var(--oc-text-faint);
	pointer-events: none;
}

/* Специфичность input[type="search"] — чтобы перебить стили форм GeneratePress */
input[type="search"].oc-search__input {
	width: 100%;
	height: 44px;
	padding: 0 16px 0 42px;
	border: 1px solid #c8dcf5;
	border-radius: 10px;
	background: #ffffff;
	font-size: 15px;
	line-height: 44px;
	color: var(--oc-text);
	outline: none;
	appearance: none;
	-webkit-appearance: none;
}

input[type="search"].oc-search__input::placeholder {
	color: var(--oc-text-faint);
	opacity: 1;
}

input[type="search"].oc-search__input:focus {
	border-color: var(--oc-primary);
	box-shadow: 0 0 0 3px rgba(1, 127, 251, 0.12);
	outline: none;
}

.oc-header__actions {
	display: flex;
	align-items: center;
	gap: 22px;
	margin-left: auto;
	flex-shrink: 0;
}

.oc-header__action {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: var(--oc-text-body);
	text-decoration: none;
	font-size: 15px;
	transition: color 0.2s ease;
}

.oc-header__action:hover,
.oc-header__action:focus-visible {
	color: var(--oc-primary);
}

.oc-header__action:hover {
	color: var(--oc-primary);
}

.oc-header__action svg {
	width: 20px;
	height: 20px;
}

.oc-header__nav {
	display: flex;
	align-items: center;
	justify-content: center;
	padding-bottom: 14px;
}

.oc-nav__list {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 34px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.oc-nav__list a {
	position: relative;
	display: inline-block;
	padding: 6px 2px 10px;
	color: var(--oc-text-body);
	text-decoration: none;
	font-size: 15px;
	font-weight: 500;
	transition: color 0.2s ease;
}

/* Подчёркивание выезжает слева направо при наведении */
.oc-nav__list a::after {
	content: "";
	position: absolute;
	left: 0;
	right: 100%;
	bottom: 4px;
	height: 2px;
	border-radius: 2px;
	background: var(--oc-primary);
	transition: right 0.28s cubic-bezier(0.25, 0.8, 0.35, 1);
}

.oc-nav__list a:hover,
.oc-nav__list a:focus-visible,
.oc-nav__list .current-menu-item a,
.oc-nav__list .current_page_item a {
	color: var(--oc-primary);
}

.oc-nav__list a:hover::after,
.oc-nav__list a:focus-visible::after,
.oc-nav__list .current-menu-item a::after,
.oc-nav__list .current_page_item a::after {
	right: 0;
}

@media (max-width: 900px) {
	.oc-header__top {
		grid-template-columns: auto auto;
		gap: 12px 16px;
	}

	/* мобильная схема: лого + действия в первой строке,
	 * поиск — второй строкой на всю ширину, меню — отдельной строкой ниже */
	.oc-header__top > .oc-header__actions {
		min-width: 0;
	}

	.oc-search {
		grid-column: 1 / -1;
		grid-row: 2;
		width: 100%;
		max-width: none;
	}

	.oc-header__nav {
		justify-content: flex-start;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
	}

	.oc-header__nav::-webkit-scrollbar {
		display: none;
	}

	.oc-nav__list {
		justify-content: flex-start;
		flex-wrap: nowrap;
		gap: 22px;
	}

	.oc-nav__list a {
		font-size: 14px;
		padding: 4px 2px 8px;
	}

	.oc-header__action span {
		display: none;
	}
}

/*
 * Футер. Тёмный градиент, три колонки: бренд, меню, реквизиты.
 */

.oc-footer {
	/* Под цвет фона неонового лого (его краевые оттенки #000f36–#011642),
	 * чтобы корзина сливалась с футером без видимых краёв. */
	background: linear-gradient(120deg, #000f36 0%, #01163f 70%);
	color: #e8edf6;
}

.oc-footer__inner {
	display: grid;
	grid-template-columns: 1.15fr 0.6fr 1.3fr;
	gap: 36px 48px;
	padding-top: 38px;
	padding-bottom: 30px;
	align-items: start;
}

.oc-logo--footer .oc-logo__img {
	height: 44px;
	width: auto;
}

.oc-footer__tagline {
	margin: 16px 0 0;
	max-width: 330px;
	font-size: 13.5px;
	line-height: 1.65;
	color: rgba(255, 255, 255, 0.72);
}

.oc-footer__heading {
	margin: 0 0 14px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.09em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.5);
}

.oc-footer__legal {
	padding-top: 16px;
	padding-bottom: 20px;
	font-size: 12.5px;
	color: rgba(255, 255, 255, 0.5);
	text-align: center;
	border-top: 1px solid rgba(255, 255, 255, 0.08);
}

@media (max-width: 980px) {
	.oc-footer__inner {
		grid-template-columns: 1fr 1fr;
	}

	.oc-footer__brand {
		grid-column: 1 / -1;
	}
}

@media (max-width: 900px) {
	.oc-footer__req {
		order: 3;
	}
}

@media (max-width: 640px) {
	.oc-footer__inner {
		grid-template-columns: 1fr;
		gap: 28px;
	}
}

/*
 * ===== Главная витрины (гутенберг-блоки) =====
 */

/* Контейнер секций */
.oc-wrap {
	max-width: 1160px;
	margin-left: auto;
	margin-right: auto;
	padding-left: 20px;
	padding-right: 20px;
}

body {
	overflow-x: clip;
	background: var(--oc-bg);
}

/* Скроллбар в стиле витрины */
html {
	scrollbar-width: thin;
	scrollbar-color: #b9cdf2 var(--oc-surface-alt);
}

::-webkit-scrollbar {
	width: 10px;
	height: 10px;
}

::-webkit-scrollbar-track {
	background: var(--oc-surface-alt);
}

::-webkit-scrollbar-thumb {
	background: #b9cdf2;
	border-radius: 8px;
	border: 2px solid var(--oc-bg);
}

::-webkit-scrollbar-thumb:hover {
	background: var(--oc-primary);
}

::-webkit-scrollbar-corner {
	background: var(--oc-surface-alt);
}

/* Страница на всю ширину: без серого фона и боковых полей GP */
.site.grid-container {
	max-width: 100%;
	padding-left: 0;
	padding-right: 0;
}

.separate-containers .site-content {
	margin: 0;
	padding: 0;
}

.separate-containers .inside-article {
	padding: 0;
	margin: 0;
}

.separate-containers .site-main {
	margin-top: 0;
}

/* На главной убираем внутренние отступы GP — секции дают свои */
.page-id-7 .inside-article {
	padding: 0;
}

/* Секции главной растягиваем на всю ширину экрана внутри контейнера GP */
.entry-content .oc-cats-wrap,
.entry-content .oc-featured-wrap,
.entry-content .oc-how-wrap,
.entry-content .oc-benefits-wrap,
.entry-content .oc-aud-wrap {
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
}

/* Внутренние контейнеры WP-групп секций с карточками — по сетке .oc-wrap
 * (1160px + 20px): иначе GP-паддинг .site-main .wp-block-group__inner-container
 * (40px / 30px на мобильных) даёт другой отступ, и карточки не примыкают
 * к краям сетки на ширинах ниже 1200px. По вертикали паддинг GP тоже убран —
 * зазоры между секциями задают паддинги самих секций */
.entry-content .oc-benefits-wrap > .wp-block-group__inner-container,
.entry-content .oc-aud-wrap > .wp-block-group__inner-container {
	max-width: 1160px;
	padding: 0 20px;
}

/* Хиро — по ширине контентной области, со скруглёнными краями */
.entry-content .oc-hero {
	max-width: 1120px;
	margin-top: 25px;
	margin-right: auto;
	margin-bottom: 26px;
	margin-left: auto;
	border-radius: 24px;
	overflow: hidden;
}

.entry-content .oc-hero .wp-block-group__inner-container {
	padding-top: 0;
	padding-bottom: 0;
}

@media (max-width: 1200px) {
	.entry-content .oc-hero {
		margin-left: 16px;
		margin-right: 16px;
	}
}

@media (max-width: 640px) {
	.entry-content .oc-hero {
		border-radius: 16px;
	}
}

/* Кнопки витрины */
.oc-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	height: 44px;
	padding: 0 20px;
	border-radius: 8px;
	font-size: 15px;
	font-weight: 600;
	text-decoration: none;
	cursor: pointer;
}

.oc-btn svg {
	width: 18px;
	height: 18px;
}

.oc-btn--primary {
	background: var(--oc-primary);
	color: #fff;
}

.oc-btn--primary:hover {
	background: var(--oc-primary-hover);
	color: #fff;
}

.oc-btn--soft {
	background: var(--oc-primary-soft);
	color: var(--oc-primary);
}

.oc-btn--soft:hover {
	background: #d8e8ff;
	color: var(--oc-primary-hover);
}

/* Хиро-баннер: готовый арт («Подарочные карты в голубой сказке», 2026-10-09), текст слева */
.oc-hero {
	position: relative;
	background: var(--oc-hero-from) url("/wp-content/uploads/oc-art/hero-banner-blue.jpg") no-repeat center / cover;
	padding-top: 0;
	padding-bottom: 0;
	overflow: hidden;
}

/* Фиксированная высота на десктопе, контент центрирован по вертикали */
.oc-hero:not(.oc-hero--how) {
	min-height: 370px;
}

.oc-hero:not(.oc-hero--how) .wp-block-group__inner-container {
	min-height: 370px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding-top: 0;
	padding-bottom: 0;
}

/* Дети constrained-группы получают margin:auto !important — во флексе это центрирует текст */
.oc-hero:not(.oc-hero--how) .wp-block-group__inner-container > * {
	margin-left: 0 !important;
	margin-right: 0 !important;
	max-width: none;
}

.oc-hero__title {
	text-shadow: 0 1px 0 rgba(255, 255, 255, 0.35);
}

@media (min-width: 1021px) {
	/* На широких экранах контент прижат к левой половине — справа карты арта */
	.oc-hero .oc-hero__inner {
		max-width: 46%;
		margin-left: 0 !important;
		padding-left: 40px;
	}

	.oc-hero .oc-hero__title {
		font-size: clamp(26px, 3vw, 38px);
	}
}

.oc-hero__title {
	font-size: clamp(30px, 4.4vw, 44px);
	line-height: 1.15;
	font-weight: 800;
	color: var(--oc-text);
	margin: 0 0 14px !important;
}

.oc-hero__subtitle {
	font-size: 18px;
	color: var(--oc-text-muted);
	margin: 0 0 28px !important;
}

/* Специфичность выше динамического CSS GP (.wp-block-button .wp-block-button__link) */
.oc-hero .wp-block-button .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	background: var(--oc-primary);
	border-radius: 8px;
	font-size: 15px;
	font-weight: 600;
	padding: 12px 22px;
}

.oc-hero .wp-block-button .wp-block-button__link:hover {
	background: var(--oc-primary-hover);
}

/* Стрелка на кнопке хиро (как в макете) */
.oc-hero .wp-block-button .wp-block-button__link::after {
	content: "";
	width: 17px;
	height: 14px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h16M14 6l6 6-6 6'/%3E%3C/svg%3E") no-repeat center / contain;
}

/* Карточки категорий */
.oc-cats-wrap {
	padding: 26px 0 6px;
}

.oc-cats {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
}

.oc-cat {
	display: flex;
	align-items: center;
	gap: 14px;
	background: var(--oc-surface-alt);
	border-radius: 14px;
	padding: 18px 16px;
	text-decoration: none;
	transition: box-shadow 0.15s ease;
}

.oc-cat:hover {
	box-shadow: 0 8px 20px rgba(15, 35, 90, 0.08);
}

.oc-cat__icon {
	width: 46px;
	height: 46px;
	border-radius: 12px;
	background: var(--oc-cat-color, var(--oc-primary));
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.oc-cat__icon svg {
	width: 24px;
	height: 24px;
}

.oc-cat__text {
	min-width: 0;
}

.oc-cat__name {
	display: block;
	font-weight: 700;
	font-size: 16px;
	color: var(--oc-text);
}

.oc-cat__sub {
	display: block;
	font-size: 13px;
	color: var(--oc-text-muted);
	margin-top: 2px;
}

.oc-cat__chevron {
	width: 18px;
	height: 18px;
	color: var(--oc-text-faint);
	margin-left: auto;
	flex-shrink: 0;
}

/* Секция «Подарочные карты» */
.oc-featured-wrap {
	padding: 40px 0 10px;
}

.oc-section-title {
	font-size: 26px;
	font-weight: 800;
	color: var(--oc-text);
	margin: 0 !important;
}

.oc-featured__head {
	display: flex;
	align-items: center;
	gap: 18px;
	flex-wrap: wrap;
	margin-bottom: 20px;
}

.oc-chips {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}

.oc-chip {
	padding: 8px 16px;
	border-radius: 999px;
	background: var(--oc-chip-bg);
	color: var(--oc-text-body);
	font-size: 14px;
	text-decoration: none;
}

.oc-chip--active {
	background: var(--oc-primary);
	color: #fff;
}

.oc-chip:not(.oc-chip--active):hover {
	color: var(--oc-primary);
}

.oc-featured__all {
	margin-left: auto;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: var(--oc-primary);
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
}

.oc-featured__all svg {
	width: 16px;
	height: 16px;
}

/* Карточка товара */
.oc-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
}

.oc-pcard {
	background: var(--oc-surface);
	border: 1px solid var(--oc-border);
	border-radius: 14px;
	padding: 12px 12px 14px;
	display: flex;
	flex-direction: column;
}

.oc-pcard__art {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 4px;
	aspect-ratio: 16 / 10;
	border-radius: 10px;
	text-decoration: none;
	margin-bottom: 12px;
	overflow: hidden;
	background: linear-gradient(135deg, #e6f3ff, #d3e7ff);
}

.oc-pcard__artimg {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.oc-pcard__art--playstation,
.oc-pcard__art--steam {
	background: linear-gradient(135deg, #1e56c8, #0d3fa8);
}

.oc-pcard__art--amazon {
	background: linear-gradient(135deg, #232a36, #12151c);
}

.oc-pcard__art--att {
	background: linear-gradient(135deg, #0d60fe, #00a0e0);
}

/* Подложки новых брендов (добавлено 2026-10-09 при доборе каталога до 20 товаров) */
.oc-pcard__art--xbox     { background: linear-gradient(135deg, #128a12, #075007); }
.oc-pcard__art--nintendo { background: linear-gradient(135deg, #ef0013, #9f000c); }
.oc-pcard__art--roblox   { background: linear-gradient(135deg, #3b3b40, #17171a); }
.oc-pcard__art--ebay     { background: linear-gradient(135deg, #0a71e5, #023e8f); }
.oc-pcard__art--netflix  { background: linear-gradient(135deg, #f50d1c, #7d030a); }
.oc-pcard__art--spotify  { background: linear-gradient(135deg, #23c65b, #0e7a35); }
.oc-pcard__art--discord  { background: linear-gradient(135deg, #6470f8, #3a44bb); }
.oc-pcard__art--telegram { background: linear-gradient(135deg, #2ea6e0, #166d9c); }
.oc-pcard__art--t-mobile { background: linear-gradient(135deg, #f51684, #a3005e); }
.oc-pcard__art--verizon  { background: linear-gradient(135deg, #e60f14, #7d0308); }
.oc-pcard__art--etisalat { background: linear-gradient(135deg, #00a644, #045f28); }
.oc-pcard__art--orange   { background: linear-gradient(135deg, #ff8a0f, #c95f00); }

.oc-pcard__brandname {
	font-weight: 800;
	font-size: 18px;
	color: var(--oc-text);
}

.oc-pcard__art--playstation .oc-pcard__brandname,
.oc-pcard__art--steam .oc-pcard__brandname,
.oc-pcard__art--amazon .oc-pcard__brandname,
.oc-pcard__art--att .oc-pcard__brandname,
.oc-pcard__art--xbox .oc-pcard__brandname,
.oc-pcard__art--nintendo .oc-pcard__brandname,
.oc-pcard__art--roblox .oc-pcard__brandname,
.oc-pcard__art--ebay .oc-pcard__brandname,
.oc-pcard__art--netflix .oc-pcard__brandname,
.oc-pcard__art--spotify .oc-pcard__brandname,
.oc-pcard__art--discord .oc-pcard__brandname,
.oc-pcard__art--telegram .oc-pcard__brandname,
.oc-pcard__art--t-mobile .oc-pcard__brandname,
.oc-pcard__art--verizon .oc-pcard__brandname,
.oc-pcard__art--etisalat .oc-pcard__brandname,
.oc-pcard__art--orange .oc-pcard__brandname {
	color: #fff;
}

.oc-pcard__artlabel {
	font-size: 12px;
	font-style: normal;
	color: var(--oc-text-muted);
}

.oc-pcard__art--playstation .oc-pcard__artlabel,
.oc-pcard__art--steam .oc-pcard__artlabel,
.oc-pcard__art--amazon .oc-pcard__artlabel,
.oc-pcard__art--att .oc-pcard__artlabel,
.oc-pcard__art--xbox .oc-pcard__artlabel,
.oc-pcard__art--nintendo .oc-pcard__artlabel,
.oc-pcard__art--roblox .oc-pcard__artlabel,
.oc-pcard__art--ebay .oc-pcard__artlabel,
.oc-pcard__art--netflix .oc-pcard__artlabel,
.oc-pcard__art--spotify .oc-pcard__artlabel,
.oc-pcard__art--discord .oc-pcard__artlabel,
.oc-pcard__art--telegram .oc-pcard__artlabel,
.oc-pcard__art--t-mobile .oc-pcard__artlabel,
.oc-pcard__art--verizon .oc-pcard__artlabel,
.oc-pcard__art--etisalat .oc-pcard__artlabel,
.oc-pcard__art--orange .oc-pcard__artlabel {
	color: rgba(255, 255, 255, 0.75);
}

.oc-pcard__badge {
	position: absolute;
	top: 10px;
	right: 10px;
	background: rgba(255, 255, 255, 0.9);
	color: var(--oc-text);
	font-size: 12px;
	font-weight: 700;
	padding: 3px 8px;
	border-radius: 8px;
}

.oc-pcard__meta {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	color: var(--oc-text-muted);
	margin: 0 4px 4px;
}

.oc-flag {
	width: 20px;
	height: 14px;
	border-radius: 2px;
	display: block;
}

.oc-pcard__title {
	font-size: 15px;
	font-weight: 600;
	line-height: 1.35;
	margin: 0 4px 10px !important;
}

.oc-pcard__title a {
	color: var(--oc-text);
	text-decoration: none;
}

.oc-pcard__title a:hover {
	color: var(--oc-primary);
}

.oc-pcard__row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	margin-top: auto;
}

.oc-pcard__price {
	font-size: 16px;
	font-weight: 700;
	color: var(--oc-text);
}

.oc-pcard .oc-btn {
	height: 38px;
	padding: 0 14px;
	font-size: 14px;
	flex-shrink: 0;
}

/* «Как купить» */
.oc-how-wrap {
	padding: 48px 0 64px;
}

/* Преимущества */
.oc-benefits-wrap {
	padding: 36px 0 0;
}

/* Грид на inner-container: WP оборачивает детей группы.
 * padding 0: GP даёт .site-main .wp-block-group__inner-container { padding: 40px }
 * (30px на мобильных) — по бокам он врезал карточки внутрь сетки,
 * по вертикали раздувал зазоры между секциями; ритм задают сами секции
 * и margin заголовков (.oc-section-title) */
.oc-benefits > .wp-block-group__inner-container {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 20px;
	padding: 0;
}

/* Заголовки секций с карточками — единый зазор до карточек (20px, как у «Подарочных карт») */
.oc-benefits-wrap .oc-section-title,
.oc-aud-wrap .oc-section-title {
	margin-bottom: 20px !important;
}

.oc-benefits .oc-benefit {
	background: var(--oc-surface);
	border: 1px solid var(--oc-border);
	border-radius: 14px;
	padding: 20px 20px 18px;
	max-width: none;
	margin: 0 !important;
	width: auto;
}

/* Внутренний контейнер карточки — обычный поток */
.oc-benefits .oc-benefit .wp-block-group__inner-container {
	display: block;
	max-width: none;
	margin: 0;
	padding: 0;
}

.oc-benefit__icon {
	width: 46px;
	height: 46px;
	border-radius: 12px;
	background: var(--oc-primary-soft);
	color: var(--oc-primary);
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 12px;
}

.oc-benefit__icon svg {
	width: 24px;
	height: 24px;
}

.oc-benefit__icon--gift {
	background: #fdeaf3;
	color: #d63384;
}

.oc-benefit__icon--game {
	background: #e6f0ff;
	color: #3c80eb;
}

.oc-benefit__icon--sub {
	background: #fff2e5;
	color: #f47c2d;
}

.oc-benefit h3 {
	font-size: 16px;
	font-weight: 700;
	color: var(--oc-text);
	margin: 0 0 6px !important;
}

.oc-benefit p {
	margin: 0 !important;
	font-size: 14px;
	color: var(--oc-text-muted);
}

/* Кому подойдёт */
.oc-aud-wrap {
	padding: 40px 0 48px;
}

/* GP даёт .wp-block-columns { margin-bottom: 1.75em } — убираем,
 * зазор до CTA задают паддинг секции (48px) и margin-top CTA (26px) */
.oc-aud-wrap .oc-aud {
	margin-bottom: 0 !important;
}

.oc-aud {
	gap: 20px;
}

.oc-aud__card {
	background: var(--oc-surface-alt);
	border-radius: 14px;
	padding: 22px 22px 20px;
}

.oc-aud__card h3 {
	font-size: 16px;
	font-weight: 700;
	color: var(--oc-text);
	margin: 0 0 6px !important;
}

.oc-aud__card p {
	margin: 0 !important;
	font-size: 14px;
	color: var(--oc-text-muted);
}

/* CTA-баннер */
.entry-content .oc-cta {
	max-width: 1120px;
	height: 280px;
	margin-top: 26px;
	margin-right: auto;
	margin-bottom: 60px;
	margin-left: auto;
	/* Арт «Подарочные карты в голубой студии» (2026-10-09, v3);
	 * карты слева/по центру, текст секции — справа на светлом фоне */
	background:
		url("/wp-content/uploads/oc-art/cta-studio.jpg") left center / cover no-repeat;
	border-radius: 24px;
	overflow: hidden;
}

.oc-cta .wp-block-group__inner-container {
	max-width: none;
	margin: 0;
	padding: 0 40px 0 0;
	height: 100%;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	justify-content: center;
	gap: 10px;
}

.oc-cta .oc-cta__text {
	/* -40px справа: правый край текста совпадает с правым краем кнопки
	 * (контейнер имеет padding-right: 40px) */
	margin: 0 -40px 0 0 !important;
	max-width: 430px;
	text-align: right;
}

.oc-cta__text h2 {
	font-size: 26px;
	font-weight: 800;
	color: var(--oc-text);
	margin: 0 0 8px !important;
	text-shadow: 0 0 12px rgba(255, 255, 255, 0.95), 0 0 4px rgba(255, 255, 255, 0.9);
}

.oc-cta__text p {
	margin: 0 !important;
	font-size: 15px;
	color: var(--oc-text-body);
	text-shadow: 0 0 10px rgba(255, 255, 255, 0.95), 0 0 4px rgba(255, 255, 255, 0.9);
}

.oc-cta .wp-block-buttons {
	margin: 0 !important;
	flex-shrink: 0;
}

.oc-cta .wp-block-button .wp-block-button__link {
	background: var(--oc-primary);
	color: #fff;
	border-radius: 8px;
	font-size: 15px;
	font-weight: 600;
	padding: 12px 24px;
}

.oc-cta .wp-block-button .wp-block-button__link:hover {
	background: var(--oc-primary-hover);
	color: #fff;
}

@media (max-width: 900px) {
	.oc-benefits > .wp-block-group__inner-container {
		grid-template-columns: repeat(2, 1fr);
	}

	.entry-content .oc-cta {
		height: auto;
		min-height: 220px;
	}

	.oc-cta .wp-block-group__inner-container {
		padding: 24px;
		align-items: flex-start;
	}

	.oc-cta .oc-cta__text {
		text-align: left;
		max-width: none;
		margin: 0 !important;
	}
}

@media (max-width: 560px) {
	.oc-benefits > .wp-block-group__inner-container {
		grid-template-columns: 1fr;
	}
}

.oc-how {
	counter-reset: oc-step;
}

.oc-how > .wp-block-column.oc-how__step {
	display: flex;
	gap: 14px;
	align-items: flex-start;
	counter-increment: oc-step;
	position: relative;
	padding-right: 28px;
}

.oc-how__step::before {
	content: counter(oc-step);
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: var(--oc-primary-soft);
	color: var(--oc-primary);
	font-weight: 700;
	font-size: 15px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.oc-how__step h3 {
	font-size: 16px;
	font-weight: 700;
	color: var(--oc-text);
	margin: 6px 0 4px !important;
}

/* GP добавляет 40px внутренним контейнерам групп — в шагах они не нужны */
.oc-how__text > .wp-block-group__inner-container {
	padding: 0;
}

.oc-how__step p {
	font-size: 14px;
	color: var(--oc-text-muted);
	margin: 0 !important;
}

.oc-how__step:not(:last-child)::after {
	content: "";
	position: absolute;
	right: 6px;
	top: 12px;
	width: 9px;
	height: 9px;
	border-right: 2px solid var(--oc-text-faint);
	border-top: 2px solid var(--oc-text-faint);
	transform: rotate(45deg);
}

/* «Как купить» и информационные страницы */
body.page:not(.home) .inside-article {
	max-width: 1160px;
	margin: 0 auto;
	padding: 20px;
}

/* The hero already has a 25px top margin; avoid adding article padding above it. */
body.page:not(.home).page-id-69 .inside-article,
body.page:not(.home).page-id-88 .inside-article,
body.page:not(.home).page-id-97 .inside-article {
	padding-top: 0;
}

/* Хиро информационных страниц — как на главной, компактный */
.oc-hero--how {
	position: relative;
	border-radius: 24px;
	min-height: 370px;
	padding: 56px 56px;
	background:
		linear-gradient(90deg, rgba(5, 17, 48, 0.98) 0%, rgba(5, 17, 48, 0.9) 34%, rgba(5, 17, 48, 0.28) 66%, rgba(5, 17, 48, 0.05) 100%),
		url("/wp-content/uploads/oc-art/how-to-buy-hero-v2.png") center / cover no-repeat;
	margin-bottom: 48px;
	overflow: hidden;
	display: flex;
	align-items: center;
}

.entry-content .oc-hero--how > .wp-block-group__inner-container {
	box-sizing: border-box;
	width: 100%;
	max-width: none;
	margin: 0;
	padding: 0;
}

/* Gutenberg's constrained layout centers nested groups unless their width is explicit. */
.oc-hero--how > .oc-hero--how__content,
.oc-hero--how > .wp-block-group__inner-container > .oc-hero--how__content {
	width: min(100%, 540px);
	max-width: 540px;
	margin: 0 !important;
	padding: 0;
}

.entry-content .oc-hero--how__content > .wp-block-group__inner-container {
	padding: 0;
}

.oc-hero--how .oc-hero__title {
	max-width: 540px;
	font-size: clamp(36px, 4vw, 52px);
	line-height: 1.08;
	color: #fff;
}

.oc-hero--how .oc-hero__subtitle {
	max-width: 510px;
	font-size: 18px;
	line-height: 1.55;
	color: rgba(255, 255, 255, 0.82);
	margin-bottom: 24px !important;
}

.oc-hero--how .wp-block-button .wp-block-button__link {
	background: #fff;
	color: var(--oc-primary);
}

.oc-hero--how .wp-block-button .wp-block-button__link:hover {
	background: var(--oc-primary-soft);
	color: var(--oc-primary-hover);
}

.oc-how-page__intro {
	max-width: 680px;
	margin: 0 0 24px;
	color: var(--oc-text-muted);
	font-size: 17px;
	line-height: 1.6;
}

.oc-how-page__title {
	font-size: clamp(26px, 3vw, 34px);
	line-height: 1.2;
	color: var(--oc-text);
	margin: 0 0 10px !important;
}

/* Шаги: три ровные колонки на широком экране, две на планшете. */
.oc-steps {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 20px;
	counter-reset: ocstep;
	margin-bottom: 56px;
}

.entry-content .oc-steps > .oc-step,
.entry-content .oc-steps > .wp-block-group__inner-container > .oc-step,
.entry-content .oc-how-support > .oc-note,
.entry-content .oc-how-support > .wp-block-group__inner-container > .oc-note {
	box-sizing: border-box;
	width: 100%;
	max-width: none;
	margin: 0 !important;
}

.oc-steps > .wp-block-group__inner-container,
.oc-how-support > .wp-block-group__inner-container {
	display: contents;
}

.oc-steps .oc-step {
	counter-increment: ocstep;
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 4px;
	min-height: 238px;
	background: var(--oc-step-bg, #f4f7ff);
	border: 1px solid var(--oc-border);
	border-radius: 18px;
	padding: 26px;
	box-shadow: 0 8px 28px rgba(18, 43, 94, 0.06);
	transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

/* Alternating dark and light cards create rhythm across the buying sequence. */
.oc-steps .oc-step:nth-child(1) {
	--oc-step-bg: radial-gradient(circle at 95% 4%, #6159f6, transparent 45%), linear-gradient(140deg, #0c1742 0%, #1d3489 58%, #3169ce 100%);
	--oc-step-heading: #fff;
	--oc-step-copy: #e1eaff;
	--oc-step-index: #d5dfff;
	--oc-step-icon-bg: #f4f7ff;
	--oc-step-border: #617bea;
}
.oc-steps .oc-step:nth-child(2) {
	--oc-step-bg: radial-gradient(circle at 95% 0%, #c9a4ff, transparent 48%), linear-gradient(140deg, #fff 0%, #f4eaff 56%, #e2c9ff 100%);
	--oc-step-index: #7956ae;
	--oc-step-icon-bg: #f7f0ff;
	--oc-step-border: #b98bea;
}
.oc-steps .oc-step:nth-child(3) {
	--oc-step-bg: radial-gradient(circle at 100% 0%, #22b6cd, transparent 46%), linear-gradient(140deg, #092d47 0%, #086080 58%, #0b7896 100%);
	--oc-step-heading: #fff;
	--oc-step-copy: #def7fb;
	--oc-step-index: #d7f8ff;
	--oc-step-icon-bg: #eefbff;
	--oc-step-border: #55c5db;
}
.oc-steps .oc-step:nth-child(4) {
	--oc-step-bg: radial-gradient(circle at 96% 4%, #ffc37d, transparent 48%), linear-gradient(140deg, #fff 0%, #fff0df 54%, #f8c6d6 100%);
	--oc-step-index: #a86363;
	--oc-step-icon-bg: #fff8ee;
	--oc-step-border: #f3ad9e;
}
.oc-steps .oc-step:nth-child(5) {
	--oc-step-bg: radial-gradient(circle at 100% 0%, #e654a6, transparent 46%), linear-gradient(140deg, #291448 0%, #652a72 58%, #a43792 100%);
	--oc-step-heading: #fff;
	--oc-step-copy: #f9e6f7;
	--oc-step-index: #ffe0f5;
	--oc-step-icon-bg: #fff0f9;
	--oc-step-border: #d56ab7;
}
.oc-steps .oc-step:nth-child(6) {
	--oc-step-bg: radial-gradient(circle at 96% 0%, #8fe2bb, transparent 50%), linear-gradient(140deg, #fff 0%, #eaf9eb 54%, #b9e9dc 100%);
	--oc-step-index: #39836d;
	--oc-step-icon-bg: #effbf3;
	--oc-step-border: #75c6a9;
}

.oc-steps .oc-step:hover {
	transform: translateY(-3px);
	border-color: var(--oc-step-border, #cddcff);
	box-shadow: 0 16px 34px rgba(18, 43, 94, 0.11);
}

.oc-step__icon {
	width: 52px;
	height: 52px;
	border-radius: 14px;
	background: var(--oc-step-icon-bg, var(--oc-primary-soft));
	color: var(--oc-primary);
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 18px;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 26px 26px;
}

.oc-steps .oc-step:nth-child(1) .oc-step__icon { background-image: url("assets/img/step-choose.svg"); }
.oc-steps .oc-step:nth-child(2) .oc-step__icon { background-image: url("assets/img/step-cart.svg"); }
.oc-steps .oc-step:nth-child(3) .oc-step__icon { background-image: url("assets/img/step-order.svg"); }
.oc-steps .oc-step:nth-child(4) .oc-step__icon { background-image: url("assets/img/step-pay.svg"); }
.oc-steps .oc-step:nth-child(5) .oc-step__icon { background-image: url("assets/img/step-email.svg"); }
.oc-steps .oc-step:nth-child(6) .oc-step__icon { background-image: url("assets/img/step-activate.svg"); }

.oc-step__icon svg {
	width: 26px;
	height: 26px;
}

.oc-steps .oc-step h3 {
	font-size: 18px;
	font-weight: 700;
	color: var(--oc-step-heading, var(--oc-text));
	margin: 0 0 8px !important;
}

.oc-steps .oc-step p {
	margin: 0 !important;
	font-size: 15px;
	line-height: 1.6;
	color: var(--oc-step-copy, var(--oc-text-muted));
}

/* Номер шага — бейдж в правом углу */
.oc-steps .oc-step::after {
	content: counter(ocstep, decimal-leading-zero);
	position: absolute;
	top: 24px;
	right: 24px;
	font-size: 16px;
	font-weight: 800;
	letter-spacing: 0.02em;
	color: var(--oc-step-index, #5670a5);
}

@media (max-width: 960px) {
	.oc-steps {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.oc-hero--how {
		min-height: 340px;
		padding: 42px 36px;
		background-position: 58% center;
	}
}

@media (max-width: 640px) {
	.oc-hero--how {
		min-height: 385px;
		padding: 30px 24px;
		align-items: flex-end;
		background:
			linear-gradient(0deg, rgba(5, 17, 48, 0.98) 0%, rgba(5, 17, 48, 0.82) 46%, rgba(5, 17, 48, 0.12) 100%),
			url("/wp-content/uploads/oc-art/how-to-buy-hero-v2.png") 67% center / cover no-repeat;
	}

	.oc-hero--how .oc-hero__title {
		font-size: 34px;
	}

	.oc-hero--how .oc-hero__subtitle {
		font-size: 16px;
	}

	.oc-steps {
		grid-template-columns: 1fr;
		gap: 14px;
	}

	.oc-steps .oc-step {
		min-height: 0;
	}
}

/* Информационная плашка (оплата, поддержка) */
.oc-note {
	background: var(--oc-primary-soft);
	border: 1px solid #d6e5ff;
	border-radius: 18px;
	padding: 26px;
}

.oc-how-support {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 20px;
	margin: 0 0 56px;
}

.oc-how-support .oc-note {
	min-height: 100%;
}

.oc-how-cta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 28px;
	margin: 0 0 48px;
	padding: 34px 38px;
	border-radius: 20px;
	background: linear-gradient(120deg, #eaf2ff 0%, #f5f8ff 100%);
	border: 1px solid #dce7fb;
}

.oc-how-cta > .wp-block-group__inner-container {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 28px;
	width: 100%;
}

.oc-how-cta > .wp-block-group__inner-container > .wp-block-group {
	min-width: 0;
	margin: 0 !important;
}

.oc-how-cta h2,
.oc-how-cta p {
	margin: 0 !important;
}

.oc-how-cta h2 {
	font-size: 25px;
	color: var(--oc-text);
}

.oc-how-cta p {
	margin-top: 7px !important;
	color: var(--oc-text-muted);
}

.oc-how-cta .wp-block-buttons {
	flex-shrink: 0;
	margin: 0;
}

@media (max-width: 720px) {
	.oc-how-support {
		grid-template-columns: 1fr;
	}

	.oc-how-cta {
		align-items: flex-start;
		flex-direction: column;
		padding: 26px;
	}

	.oc-how-cta > .wp-block-group__inner-container {
		align-items: flex-start;
		flex-direction: column;
	}
}

/* GP добавляет 40px внутренним контейнерам групп — здесь они не нужны */
.oc-step .wp-block-group__inner-container,
.oc-note .wp-block-group__inner-container,
.oc-how-cta .wp-block-group__inner-container {
	padding: 0;
	max-width: none;
	margin: 0;
}

.oc-note h3 {
	margin: 0 0 6px !important;
	font-size: 16px;
	font-weight: 700;
	color: var(--oc-text);
}

.oc-note p {
	margin: 0 !important;
	font-size: 14.5px;
	color: var(--oc-text-body);
}

/* Реквизиты в футере */
.oc-footer__legal {
	padding-bottom: 16px;
	font-size: 12.5px;
	color: var(--oc-text-faint);
	text-align: center;
}

/* Кнопки в контенте страниц — фирменный синий */
.entry-content .wp-block-button .wp-block-button__link {
	background: var(--oc-primary);
	color: #fff;
	border-radius: 8px;
	font-size: 15px;
	font-weight: 600;
	padding: 12px 22px;
}

.entry-content .wp-block-button .wp-block-button__link:hover {
	background: var(--oc-primary-hover);
	color: #fff;
}

/* Изображения на информационных страницах */
.oc-img img {
	width: 100%;
	height: 380px;
	object-fit: cover;
	border-radius: 14px;
}

.oc-media {
	border-radius: 14px;
	overflow: hidden;
	background: var(--oc-surface);
	border: 1px solid var(--oc-border);
}

.oc-media .wp-block-media-text__media {
	height: 340px;
	min-height: 0;
}

.oc-media .wp-block-media-text__media img {
	height: 100%;
	width: 100%;
	object-fit: cover;
}

.oc-media .wp-block-media-text__content {
	padding: 22px 24px;
}

@media (max-width: 781px) {
	.oc-media .wp-block-media-text__media {
		height: 260px;
	}
}

/*
 * ===== WooCommerce: каталог, товар, корзина =====
 */

/* Контейнер содержимого WC-страниц (после правила для separate-containers) */
.woocommerce .inside-article,
.woocommerce-account .inside-article,
.woocommerce-cart .inside-article,
.woocommerce-checkout .inside-article {
	max-width: 1160px;
	margin-left: auto;
	margin-right: auto;
	padding: 20px;
}

.woocommerce .woocommerce-breadcrumb {
	color: var(--oc-text-faint);
	font-size: 13px;
	margin-bottom: 10px !important;
}

.woocommerce .woocommerce-breadcrumb a {
	color: var(--oc-text-faint);
	text-decoration: none;
}

.woocommerce .woocommerce-breadcrumb a:hover {
	color: var(--oc-primary);
}

/* Заголовок архива и описание категории */
.woocommerce-products-header__title.page-title {
	font-size: 26px;
	font-weight: 800;
	color: var(--oc-text);
	margin: 0 0 6px !important;
}

.woocommerce-products-header {
	margin-bottom: 22px;
}

.woocommerce-products-header .term-description,
.woocommerce-products-header__description {
	font-size: 14px;
	color: var(--oc-text-muted);
	max-width: 720px;
}

/* Сетка товаров каталога */
.woocommerce ul.products {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
	margin-block: 0 28px;
	padding: 0;
	list-style: none;
}

.woocommerce ul.products::before,
.woocommerce ul.products::after {
	display: none;
}

.woocommerce ul.products li.product {
	width: 100% !important;
	float: none;
	margin: 0 !important;
	background: var(--oc-surface);
	border: 1px solid var(--oc-border);
	border-radius: 14px;
	padding: 12px 12px 14px;
	position: relative;
	padding-bottom: 62px;
	text-align: left;
	overflow: hidden;
}

.woocommerce ul.products li.product a.woocommerce-LoopProduct-link {
	display: block;
	text-decoration: none;
}

.woocommerce ul.products li.product a img {
	border-radius: 10px;
	margin: 0 0 10px !important;
	aspect-ratio: 16 / 10;
	object-fit: cover;
	width: 100%;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
	font-size: 15px;
	font-weight: 600;
	line-height: 1.35;
	color: var(--oc-text);
	padding: 0 4px !important;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title:hover {
	color: var(--oc-primary);
}

.woocommerce ul.products li.product .price {
	position: absolute;
	left: 16px;
	right: 122px;
	bottom: 18px;
	color: var(--oc-text) !important;
	font-size: 16px;
	font-weight: 700;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.woocommerce ul.products li.product del {
	color: var(--oc-text-faint);
	font-weight: 400;
}

.woocommerce ul.products li.product .button {
	position: absolute !important;
	right: 12px;
	bottom: 12px;
	background: var(--oc-primary) !important;
	color: #fff !important;
	border-radius: 8px !important;
	padding: 9px 14px !important;
	font-size: 14px;
	font-weight: 600;
}

.woocommerce ul.products li.product .button:hover {
	background: var(--oc-primary-hover) !important;
	color: #fff !important;
}

.woocommerce ul.products li.product .button.product_type_variable,
.woocommerce ul.products li.product .button.product_type_grouped {
	background: var(--oc-primary-soft) !important;
	color: var(--oc-primary) !important;
}

.woocommerce ul.products li.product .button.product_type_variable:hover,
.woocommerce ul.products li.product .button.product_type_grouped:hover {
	background: #d8e8ff !important;
	color: var(--oc-primary-hover) !important;
}

/* Служебные строки архива */
.woocommerce .woocommerce-result-count {
	color: var(--oc-text-muted);
	font-size: 14px;
	margin-block: 0 16px;
}

.woocommerce .woocommerce-ordering select {
	border: 1px solid var(--oc-border);
	border-radius: 8px;
	padding: 8px 12px;
	color: var(--oc-text-body);
	background: var(--oc-surface);
}

/* Кнопки WooCommerce (карточка товара, корзина, чекаут) */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce #place_order {
	background: var(--oc-primary);
	color: #fff;
	border-radius: 8px;
	font-weight: 600;
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce #place_order:hover {
	background: var(--oc-primary-hover);
	color: #fff;
}

.woocommerce a.button.alt,
.woocommerce button.button.alt {
	background: var(--oc-primary);
}

.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover {
	background: var(--oc-primary-hover);
}

/* Страница товара */
.woocommerce div.product .product_title {
	color: var(--oc-text);
	font-weight: 800;
}

/* SKU у витрины не показываем */
.woocommerce div.product .product_meta .sku_wrapper,
.woocommerce div.product .product_meta .posted_in {
	display: none;
}

/*
 * ===== Мой аккаунт =====
 */

/* Две колонки: меню слева, содержимое справа (только для залогиненных) */
.woocommerce-account.logged-in .woocommerce {
	display: grid;
	grid-template-columns: 250px 1fr;
	gap: 32px;
	align-items: start;
}

/* Явные колонки: у WC свои флоаты, которые ломают авторазмещение */
.woocommerce-account .woocommerce .woocommerce-MyAccount-navigation {
	grid-column: 1;
	grid-row: 1;
	float: none;
	width: auto;
}

.woocommerce-account .woocommerce .woocommerce-MyAccount-content {
	grid-column: 2;
	grid-row: 1;
	float: none;
	width: auto;
}

.woocommerce-MyAccount-navigation ul {
	list-style: none;
	margin: 0;
	padding: 0;
	background: var(--oc-surface);
	border: 1px solid var(--oc-border);
	border-radius: 14px;
	overflow: hidden;
}

.woocommerce-MyAccount-navigation li {
	margin: 0;
}

.woocommerce-MyAccount-navigation li + li {
	border-top: 1px solid var(--oc-border);
}

.woocommerce-MyAccount-navigation a {
	display: block;
	padding: 13px 18px;
	color: var(--oc-text-body);
	text-decoration: none;
	font-size: 15px;
}

.woocommerce-MyAccount-navigation a:hover {
	color: var(--oc-primary);
	background: var(--oc-primary-soft);
}

.woocommerce-MyAccount-navigation .is-active a {
	color: var(--oc-primary);
	background: var(--oc-primary-soft);
	font-weight: 600;
}

.woocommerce-MyAccount-content h2,
.woocommerce-MyAccount-content h3 {
	color: var(--oc-text);
	font-weight: 700;
}

.woocommerce-MyAccount-content p {
	color: var(--oc-text-body);
	font-size: 15px;
}

/* Таблица заказов */
.woocommerce-MyAccount-content table {
	border-collapse: collapse;
	width: 100%;
	background: var(--oc-surface);
	border: 1px solid var(--oc-border);
	border-radius: 14px;
	overflow: hidden;
}

.woocommerce-MyAccount-content th,
.woocommerce-MyAccount-content td {
	padding: 12px 16px;
	border: none;
	border-bottom: 1px solid var(--oc-border);
	text-align: left;
	font-size: 14px;
}

.woocommerce-MyAccount-content tr:last-child td {
	border-bottom: none;
}

.woocommerce-MyAccount-content th {
	background: var(--oc-surface-alt);
	color: var(--oc-text);
	font-weight: 600;
}

/* Кнопка «Выйти» и прочие кнопки аккаунта */
.woocommerce-MyAccount-content a.button {
	background: var(--oc-primary-soft);
	color: var(--oc-primary);
	border-radius: 8px;
	padding: 10px 18px;
	font-weight: 600;
	text-decoration: none;
}

.woocommerce-MyAccount-content a.button:hover {
	background: #d8e8ff;
	color: var(--oc-primary-hover);
}

/* Формы входа/регистрации */
.woocommerce-account .u-columns {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 32px;
	float: none;
	width: 100%;
}

.woocommerce-account .u-columns > div {
	float: none !important;
	width: auto !important;
}

.woocommerce-account .u-columns .u-column1 {
	grid-column: 1;
	grid-row: 1;
}

.woocommerce-account .u-columns .u-column2 {
	grid-column: 2;
	grid-row: 1;
}

.woocommerce-account .u-columns .woocommerce-form-login,
.woocommerce-account .u-columns .woocommerce-form-register {
	max-width: none;
	margin: 0 !important;
}

.woocommerce-form-login,
.woocommerce-form-register {
	max-width: 460px;
	background: var(--oc-surface);
	border: 1px solid var(--oc-border);
	border-radius: 14px;
	padding: 26px 26px 24px;
	margin: 0 0 24px !important;
}

.woocommerce-form-login p,
.woocommerce-form-register p {
	margin: 0 0 14px !important;
}

.woocommerce-form-login label,
.woocommerce-form-register label {
	display: block;
	color: var(--oc-text-body);
	font-size: 14px;
	margin-bottom: 6px;
}

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce-form-login input[type="text"],
.woocommerce-form-login input[type="password"],
.woocommerce-form-register input[type="text"],
.woocommerce-form-register input[type="password"],
.woocommerce-form-register input[type="email"] {
	width: 100%;
	height: 44px;
	border: 1px solid var(--oc-border);
	border-radius: 10px;
	padding: 0 14px;
	font-size: 15px;
	color: var(--oc-text);
	background: var(--oc-surface);
	outline: none;
}

.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce-form-login input:focus,
.woocommerce-form-register input:focus {
	border-color: var(--oc-primary);
}

.woocommerce-form-login__rememberme,
.woocommerce-form-login .lost_password {
	font-size: 14px;
	color: var(--oc-text-muted);
}

.woocommerce-form-login .lost_password a {
	color: var(--oc-primary);
	text-decoration: none;
}

.woocommerce-form-login .lost_password a:hover {
	text-decoration: underline;
}

/* Поля корзины/чекаута в том же стиле */
.woocommerce form .form-row input.input-text::placeholder,
.woocommerce form .form-row textarea::placeholder {
	color: var(--oc-text-faint);
}

.woocommerce-billing-fields__field-wrapper p,
.woocommerce-additional-fields__field-wrapper p,
.woocommerce-shipping-fields__field-wrapper p {
	margin: 0 0 14px !important;
}

@media (max-width: 860px) {
	.woocommerce-account.logged-in .woocommerce {
		grid-template-columns: 1fr;
	}

	.woocommerce-account .u-columns {
		grid-template-columns: 1fr;
	}
}

/*
 * ===== Корзина =====
 */

/* Сообщения (добавлено в корзину, купон и т.д.) */
.woocommerce-message,
.woocommerce-info {
	background: var(--oc-primary-soft);
	border: none;
	border-radius: 12px;
	color: var(--oc-text);
	box-shadow: none;
}

.woocommerce-message::before,
.woocommerce-info::before {
	color: var(--oc-primary);
}

.woocommerce-message .button,
.woocommerce-info .button {
	background: var(--oc-primary);
	color: #fff;
	border-radius: 8px;
	font-weight: 600;
}

.woocommerce-message .button:hover,
.woocommerce-info .button:hover {
	background: var(--oc-primary-hover);
	color: #fff;
}

/* Таблица корзины */
.woocommerce table.shop_table.cart {
	border: 1px solid var(--oc-border) !important;
	border-radius: 14px;
	border-collapse: separate;
	border-spacing: 0;
	background: var(--oc-surface);
	width: 100% !important;
	overflow: hidden;
}

.woocommerce table.shop_table.cart th {
	background: var(--oc-surface-alt);
	color: var(--oc-text);
	font-weight: 600;
	font-size: 14px;
	padding: 14px 16px;
	border: none;
	border-bottom: 1px solid var(--oc-border);
}

.woocommerce table.shop_table.cart td {
	border: none;
	border-bottom: 1px solid var(--oc-border);
	padding: 14px 16px;
}

.woocommerce table.shop_table.cart tr:last-child td {
	border-bottom: none;
}

.woocommerce table.shop_table.cart td.product-thumbnail img {
	width: 96px !important;
	height: auto !important;
	border-radius: 10px;
}

.woocommerce table.shop_table.cart td.actions .input-text {
	width: 180px !important;
	height: 42px;
	border: 1px solid var(--oc-border);
	border-radius: 8px;
	padding: 0 12px;
}

/* Пересчёт корзины автоматический — кнопка «Обновить корзину» не нужна */
.woocommerce-cart table.shop_table.cart td.actions .button[name="update_cart"] {
	display: none !important;
}

.woocommerce-cart-form__contents .product-name a {
	color: var(--oc-text);
	font-weight: 600;
	text-decoration: none;
}

.woocommerce-cart-form__contents .product-name a:hover {
	color: var(--oc-primary);
}

.woocommerce-cart-form__contents .product-remove a {
	color: var(--oc-text-faint);
	font-size: 22px;
	text-decoration: none;
}

.woocommerce-cart-form__contents .product-remove a:hover {
	color: #d64545;
}

.woocommerce-cart-form__contents .quantity .qty {
	width: 72px;
	height: 42px;
	border: 1px solid var(--oc-border);
	border-radius: 8px;
	text-align: center;
	color: var(--oc-text);
}

.woocommerce-cart-form__contents .product-subtotal,
.woocommerce-cart-form__contents .product-price {
	color: var(--oc-text);
	font-weight: 700;
}

/* Строка купона и обновления */
.woocommerce table.shop_table.cart td.actions .input-text {
	height: 42px;
	border: 1px solid var(--oc-border);
	border-radius: 8px;
	padding: 0 12px;
}

/* Итого */
.woocommerce-cart .cart-collaterals .cart_totals,
.woocommerce-cart .cart-collaterals .cart_totals table {
	background: var(--oc-surface);
	border: 1px solid var(--oc-border);
	border-radius: 14px;
}

.woocommerce-cart .cart-collaterals .cart_totals {
	padding: 22px 24px;
	float: right;
	width: 46%;
}

.woocommerce-cart .cart-collaterals .cart_totals table {
	border: none;
	border-spacing: 0;
	width: 100%;
}

.woocommerce-cart .cart-collaterals .cart_totals th,
.woocommerce-cart .cart-collaterals .cart_totals td {
	border: none;
	padding: 10px 0;
	font-size: 15px;
	vertical-align: middle;
}

.woocommerce-cart .cart-collaterals .cart_totals th {
	width: 60%;
	font-weight: 400;
	color: var(--oc-text-body);
}

.woocommerce-cart .cart-collaterals .cart_totals td {
	text-align: right;
	font-weight: 700;
	color: var(--oc-text);
}

.woocommerce-cart .cart-collaterals .cart_totals tr:last-child strong {
	font-size: 18px;
}

.woocommerce-cart .cart-collaterals .cart_totals h2 {
	font-size: 18px;
	font-weight: 700;
	color: var(--oc-text);
	margin: 0 0 12px !important;
}

.woocommerce-cart .cart-collaterals .checkout-button {
	display: flex !important;
	align-items: center;
	justify-content: center;
	width: 100% !important;
	background: var(--oc-primary) !important;
	color: #fff !important;
	border-radius: 8px !important;
	height: 48px;
	font-size: 15px;
	font-weight: 600;
	text-align: center !important;
}

.woocommerce-cart .cart-collaterals .checkout-button:hover {
	background: var(--oc-primary-hover) !important;
	color: #fff !important;
}

@media (max-width: 768px) {
	.woocommerce-cart .cart-collaterals .cart_totals {
		float: none;
		width: 100%;
	}
}

@media (max-width: 768px) {
	.woocommerce-cart .cart-collaterals .cart_totals {
		float: none;
		width: 100%;
	}
}

/*
 * ===== Оформление заказа =====
 */

.woocommerce-checkout form.checkout {
	display: grid;
	grid-template-columns: 1fr 440px;
	grid-template-rows: auto 1fr;
	gap: 12px 32px;
	align-items: start;
}

.woocommerce-checkout form.checkout .col2-set {
	grid-column: 1;
	grid-row: 1 / span 2;
	float: none;
	width: auto;
}

/* Внутри левой колонки блоки идут в столбик, без флоатов WC */
.woocommerce-checkout #customer_details .col-1,
.woocommerce-checkout #customer_details .col-2 {
	float: none;
	width: auto;
}

.woocommerce-checkout #customer_details .col-2 {
	margin-top: 26px;
}

.woocommerce-checkout #order_review_heading {
	grid-column: 2;
	grid-row: 1;
	float: none;
	width: auto;
	margin: 0 !important;
	font-size: 18px;
	font-weight: 700;
	color: var(--oc-text);
}

.woocommerce-checkout #order_review {
	grid-column: 2;
	grid-row: 2;
	float: none;
	width: auto;
	background: var(--oc-surface);
	border: 1px solid var(--oc-border);
	border-radius: 14px;
	padding: 20px 22px;
}

.woocommerce-checkout #order_review table.shop_table {
	border: none;
	background: transparent;
	border-radius: 0;
}

.woocommerce-checkout #order_review th,
.woocommerce-checkout #order_review td {
	border: none;
	background: transparent;
	padding: 8px 0;
	font-size: 15px;
}

.woocommerce-checkout #order_review .product-name {
	color: var(--oc-text);
	font-weight: 600;
}

.woocommerce-checkout #order_review tfoot td,
.woocommerce-checkout #order_review tfoot th {
	font-weight: 700;
	color: var(--oc-text);
}

/* Блок оплаты */
.woocommerce-checkout #payment {
	background: var(--oc-surface-alt);
	border-radius: 10px;
}

.woocommerce-checkout #payment div.payment_box {
	background: var(--oc-surface);
	color: var(--oc-text-body);
	border-radius: 8px;
	box-shadow: none;
}

.woocommerce-checkout #payment div.payment_box::before,
.woocommerce-checkout #payment .woocommerce-info::before {
	display: none;
}

.woocommerce-checkout #payment #place_order {
	width: 100%;
	height: 48px;
	font-size: 15px;
}

@media (max-width: 1000px) {
	.woocommerce-checkout form.checkout {
		grid-template-columns: 1fr;
	}

	.woocommerce-checkout form.checkout .col2-set,
	.woocommerce-checkout #order_review_heading,
	.woocommerce-checkout #order_review {
		grid-column: 1;
		grid-row: auto;
	}
}

.woocommerce div.product p.price,
.woocommerce div.product span.price {
	color: var(--oc-text);
	font-size: 22px;
	font-weight: 700;
}

.woocommerce div.product div.summary p {
	color: var(--oc-text-body);
	font-size: 15px;
}

.woocommerce div.product form.cart div.quantity .qty {
	border: 1px solid var(--oc-border);
	border-radius: 8px;
	height: 44px;
}

.woocommerce div.product form.cart .button {
	height: 44px;
	padding: 0 24px;
}

/* Сообщения WooCommerce */
.woocommerce-message {
	border-top-color: var(--oc-primary);
}

.woocommerce-message::before {
	color: var(--oc-primary);
}

@media (max-width: 1020px) {
	.woocommerce ul.products {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 640px) {
	.woocommerce ul.products {
		grid-template-columns: 1fr;
	}
}

/* Адаптив главной */
@media (max-width: 1020px) {
	.oc-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.oc-cats {
		grid-template-columns: repeat(2, 1fr);
	}

	/* На узких экранах арт уезжает под текст — усиливаем читаемость подложкой */
	.oc-hero {
		background-color: var(--oc-hero-from);
	}
}

@media (max-width: 640px) {
	.oc-grid,
	.oc-cats {
		grid-template-columns: 1fr;
	}

	.oc-featured__all {
		margin-left: 0;
	}
}

/*
 * ===== Служебные страницы: FAQ / Условия / Политика (добавлено 2026-10-08) =====
 */

/* FAQ: аккордеон вопросов */
.oc-faq h2 {
	font-size: 24px;
	font-weight: 800;
	color: var(--oc-text);
	margin: 40px 0 14px;
}

.oc-faq > .wp-block-group__inner-container > h2:first-child {
	margin-top: 8px;
}

.oc-faq details {
	background: var(--oc-surface);
	border: 1px solid var(--oc-border);
	border-radius: 14px;
	margin: 0 0 10px;
	overflow: hidden;
}

.oc-faq details summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 15px 20px;
	font-size: 15.5px;
	font-weight: 600;
	color: var(--oc-text);
	cursor: pointer;
	list-style: none;
}

.oc-faq details summary::-webkit-details-marker {
	display: none;
}

.oc-faq details summary::after {
	content: "+";
	flex: none;
	width: 26px;
	height: 26px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: var(--oc-primary-soft);
	color: var(--oc-primary);
	font-weight: 700;
}

.oc-faq details[open] summary::after {
	content: "–";
}

.oc-faq details > *:not(summary) {
	padding-right: 20px;
	padding-left: 20px;
}

.oc-faq details > p,
.oc-faq details .wp-block-group__inner-container > p {
	color: var(--oc-text-body);
	font-size: 15px;
	line-height: 1.6;
}

.oc-faq details > p:last-child,
.oc-faq details .wp-block-group__inner-container > p:last-child {
	padding-bottom: 16px;
	margin: 0;
}

/* Текстовые страницы (условия, политика) */
.oc-legal h2 {
	font-size: 22px;
	font-weight: 800;
	color: var(--oc-text);
	margin: 34px 0 10px;
}

.oc-legal > .wp-block-group__inner-container > h2:first-child {
	margin-top: 0;
}

.oc-legal p,
.oc-legal li {
	color: var(--oc-text-body);
	font-size: 15.5px;
	line-height: 1.65;
}

.oc-legal a,
.oc-faq a {
	color: var(--oc-primary);
}

.oc-legal__version {
	margin-top: 40px;
	padding-top: 18px;
	border-top: 1px solid var(--oc-border);
	color: var(--oc-text-faint) !important;
	font-size: 13.5px !important;
}

/* Футер: колонки меню и реквизитов (обновлено 2026-10-09) */
.oc-footer__nav {
	display: flex;
	flex-direction: column;
	/* растягиваемся на высоту соседней колонки, чтобы низ совпадал */
	align-self: stretch;
}

.oc-footer__menu {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: space-between;
	/* заполняет всю высоту колонки — пункты распределяются вровень с реквизитами */
	flex: 1;
	margin: 0;
	padding: 0;
	list-style: none;
}

.oc-footer__menu li {
	line-height: 1.6;
	padding: 0;
}

.oc-footer__menu a {
	color: #e8edf6;
	font-size: 14px;
	text-decoration: none;
}

.oc-footer__menu a:hover,
.oc-footer__menu a:focus {
	color: #ffffff;
	text-decoration: underline;
}

.oc-footer__req p {
	margin: 0 0 8px;
	font-size: 13px;
	line-height: 1.6;
	color: rgba(255, 255, 255, 0.72);
}

.oc-footer__reqname {
	font-weight: 600;
	color: #ffffff !important;
}

.oc-footer__bank {
	margin-top: 12px;
	color: rgba(255, 255, 255, 0.55) !important;
	font-size: 12.5px !important;
}

.oc-footer__acc {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	grid-template-rows: repeat(2, auto);
	grid-auto-flow: column;
	gap: 10px 20px;
	margin: 8px 0 0;
	padding: 0;
	list-style: none;
}

.oc-footer__acc li {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 2px;
	align-items: baseline;
}

.oc-footer__acc span {
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: rgba(255, 255, 255, 0.5);
}

.oc-footer__acc b {
	font-weight: 600;
	font-size: 12.5px;
	font-variant-numeric: tabular-nums;
	letter-spacing: 0.02em;
	color: rgba(255, 255, 255, 0.85);
	overflow-wrap: anywhere;
}

@media (max-width: 600px) {
	.oc-footer__acc {
		grid-template-columns: 1fr;
		grid-template-rows: none;
		grid-auto-flow: row;
	}

	.oc-footer__acc li {
		grid-template-columns: 58px 1fr;
		gap: 12px;
	}
}

/* Лого шапки: «Логотип Softcart24 с подарочной корзиной» (2026-10-09, v5 — белый фон снят), 900x205 */
.oc-header__top .oc-logo__img {
	height: 50px;
	width: auto;
	max-width: none; /* отменить глобальный max-width:100%, иначе лого сплющивается колонкой */
}

@media (max-width: 900px) {
	.oc-header__top .oc-logo__img {
		height: 40px;
	}
}

/* Лого футера: «Логотип Softcart24 с подарком в корзине» (2026-10-09, v3), 
 * прозрачный фон, аспект 4.38:1 — читается на тёмном градиенте без инверсии */
.oc-footer__brand .oc-logo__img {
	height: 56px;
}

@media (max-width: 640px) {
	.oc-footer__brand .oc-logo__img {
		height: 41px;
	}
}

/* -----------------------------------------------------------------
 * Страница товара: вкладка «Дополнительная информация» и таблица
 * атрибутов в стиле витрины (добавлено 2026-10-09)
 * ------------------------------------------------------------- */

.woocommerce div.product .woocommerce-tabs {
	clear: both;
	margin: 40px 0 0;
}

/* Вкладка-пилюля вместо дефолтных серых углов */
.woocommerce div.product .woocommerce-tabs ul.tabs {
	display: flex;
	gap: 8px;
	padding: 0;
	margin: 0 0 20px;
	border: 0;
}

.woocommerce div.product .woocommerce-tabs ul.tabs::before {
	display: none;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li {
	margin: 0;
	padding: 0;
	background: var(--oc-surface);
	border: 1px solid var(--oc-border);
	border-radius: 999px;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after {
	display: none;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
	display: inline-block;
	padding: 10px 22px;
	font-size: 14px;
	font-weight: 600;
	color: var(--oc-text-muted);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active {
	background: var(--oc-primary-soft);
	border-color: var(--oc-primary);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
	color: var(--oc-primary);
}

/* Панель вкладки — карточка */
.woocommerce div.product .woocommerce-tabs .panel {
	margin: 0 0 48px;
	padding: 8px 26px;
	background: var(--oc-surface);
	border: 1px solid var(--oc-border);
	border-radius: 14px;
}

/* Заголовок внутри панели дублирует название вкладки */
.woocommerce-Tabs-panel--additional_information > h2:first-child {
	display: none;
}

/* Таблица атрибутов: строки с разделителями, без курсива */
.woocommerce div.product .woocommerce-product-attributes {
	width: 100%;
	margin: 0;
	border-collapse: collapse;
}

.woocommerce div.product .woocommerce-product-attributes tr {
	border-bottom: 1px solid var(--oc-border);
}

/* Дефолтная «зебра» WC перекрывает базовый фон (селектор с :nth-child) */
.woocommerce div.product .woocommerce-product-attributes tr:nth-child(2n) th,
.woocommerce div.product .woocommerce-product-attributes tr:nth-child(2n) td {
	background: none;
}

.woocommerce div.product .woocommerce-product-attributes tr:last-child {
	border-bottom: 0;
}

.woocommerce div.product .woocommerce-product-attributes th,
.woocommerce div.product .woocommerce-product-attributes td {
	padding: 13px 4px;
	margin: 0;
	border: 0;
	background: none;
	font-style: normal;
	vertical-align: top;
}

.woocommerce div.product .woocommerce-product-attributes th {
	width: 180px;
	text-align: left;
	font-size: 14px;
	font-weight: 600;
	color: var(--oc-text-muted);
}

.woocommerce div.product .woocommerce-product-attributes td {
	font-size: 15px;
	color: var(--oc-text-body);
}

.woocommerce div.product .woocommerce-product-attributes td p {
	margin: 0;
}

.woocommerce div.product .woocommerce-product-attributes td a {
	color: var(--oc-primary);
	text-decoration: none;
}

.woocommerce div.product .woocommerce-product-attributes td a:hover {
	text-decoration: underline;
}

@media (max-width: 640px) {
	.woocommerce div.product .woocommerce-product-attributes th,
	.woocommerce div.product .woocommerce-product-attributes td {
		display: block;
		width: auto;
		padding: 4px 4px;
	}

	.woocommerce div.product .woocommerce-product-attributes tr {
		padding: 10px 0;
		display: block;
	}

	.woocommerce div.product .woocommerce-product-attributes th {
		padding-top: 10px;
	}
}

/* Feedback: contacts, CF7 form and company details. */
.entry-content .oc-feedback {
 max-width: 1120px; margin: 0 auto 48px; color: var(--oc-text-body);
}
.entry-content .oc-feedback .wp-block-group__inner-container { padding: 0; max-width: none; }
.oc-feedback h2 { margin: 0 0 14px; font-size: 28px; font-weight: 800; line-height: 1.2; color: var(--oc-text); }
.oc-feedback h3 { margin: 0 0 10px; font-size: 17px; font-weight: 700; color: var(--oc-text); }
.oc-feedback p { font-size: 15px; line-height: 1.65; margin: 0 0 18px; }
.oc-feedback a { color: var(--oc-primary); }
.oc-feedback__grid > .wp-block-group__inner-container, .oc-feedback__grid:not(:has(> .wp-block-group__inner-container)) {
 display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: 44px; align-items: start;
}
.oc-feedback__grid .oc-feedback__contact { margin: 0; padding: 24px 0; min-width: 0; }
.oc-feedback .oc-feedback__eyebrow { color: var(--oc-primary); font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; margin-bottom: 14px; }
.oc-feedback .oc-feedback__email { margin: 24px 0; font-size: clamp(18px, 2vw, 24px); font-weight: 700; overflow-wrap: anywhere; }
.oc-feedback__email a { text-decoration: none; }
.oc-feedback__contact .oc-feedback__hint { margin: 28px 0 24px; padding: 22px; border-left: 3px solid var(--oc-primary); border-radius: 0 16px 16px 0; background: var(--oc-primary-soft); }
.oc-feedback__hint p:last-child { margin-bottom: 0; }
.oc-feedback__grid .oc-feedback__form-card { margin: 0; padding: 30px; min-width: 0; border: 1px solid var(--oc-border); border-radius: 24px; background: var(--oc-surface); box-shadow: 0 12px 36px rgba(10,17,46,.04); }
.oc-feedback__form-card > .wp-block-group__inner-container > p { color: var(--oc-text-muted); font-size: 14px; }
.oc-feedback .wpcf7 { width: 100%; }
.oc-contact-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px 16px; }
.oc-feedback .oc-contact-fields p { margin: 0; display: contents; }
.oc-contact-fields label { display: block; color: var(--oc-text); font-size: 13px; font-weight: 600; line-height: 1.5; min-width: 0; }
.oc-contact-fields__wide { grid-column: 1 / -1; }
.oc-contact-fields .wpcf7-form-control-wrap { display: block; margin-top: 7px; }
.oc-feedback .oc-contact-fields input, .oc-feedback .oc-contact-fields select, .oc-feedback .oc-contact-fields textarea {
 width: 100%; max-width: 100%; box-sizing: border-box; min-height: 46px; padding: 12px 13px; border: 1px solid var(--oc-border); border-radius: 10px; background: var(--oc-bg); color: var(--oc-text); font: inherit; font-size: 14px; font-weight: 400;
}
.oc-feedback .oc-contact-fields textarea { height: 145px; min-height: 110px; resize: vertical; }
.oc-feedback .oc-contact-fields input::placeholder, .oc-feedback .oc-contact-fields textarea::placeholder { color: var(--oc-text-faint); }
.oc-feedback .oc-contact-fields :is(input,select,textarea):focus { outline: 2px solid var(--oc-primary); outline-offset: 2px; border-color: var(--oc-primary); }
.oc-contact-consent { margin: 20px 0; font-size: 12px; line-height: 1.6; color: var(--oc-text-muted); }
.oc-feedback .oc-contact-consent p { font-size: inherit; margin: 0; }
.oc-contact-consent .wpcf7-list-item { margin: 0; }
.oc-contact-consent label { display: flex; gap: 9px; align-items: flex-start; }
.oc-contact-consent input { margin: 4px 0 0; flex: 0 0 auto; accent-color: var(--oc-primary); }
.oc-feedback .oc-contact-submit p { margin: 0; }
.oc-feedback .wpcf7-submit { border: 0; border-radius: 10px; background: var(--oc-primary); color: white; min-height: 48px; padding: 14px 24px; font-size: 14px; font-weight: 700; cursor: pointer; }
.oc-feedback .wpcf7-submit:hover { background: var(--oc-primary-hover); }
.oc-feedback a:focus-visible, .oc-feedback .wpcf7-submit:focus-visible { outline: 2px solid var(--oc-primary); outline-offset: 4px; }
.oc-feedback .wpcf7-not-valid-tip { font-size: 12px; margin-top: 5px; }
.oc-feedback .wpcf7-response-output { margin: 20px 0 0; border-radius: 10px; font-size: 14px; }
.oc-feedback .oc-feedback__details { margin-top: 48px; padding: 30px; border-radius: 24px; background: var(--oc-surface-alt); }
.oc-feedback__details-grid > .wp-block-group__inner-container, .oc-feedback__details-grid:not(:has(> .wp-block-group__inner-container)) { display: grid; grid-template-columns: 1fr 1.15fr; gap: 44px; }
.oc-feedback__details-grid .wp-block-group { margin: 0; min-width: 0; }
.oc-feedback .oc-feedback__company-name { color: var(--oc-text); font-weight: 700; font-size: 18px; margin-top: 6px; }
.oc-feedback__company h3 { margin-top: 22px; }
.oc-feedback__accounts > .wp-block-group__inner-container, .oc-feedback__accounts:not(:has(> .wp-block-group__inner-container)) { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.oc-feedback__accounts .oc-feedback__account { padding: 13px 15px; background: var(--oc-surface); border: 1px solid var(--oc-border); border-radius: 12px; }
.oc-feedback .oc-feedback__currency { margin: 0 0 4px; font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: var(--oc-text-muted); }
.oc-feedback .oc-feedback__number { margin: 0; font-size: 13px; font-weight: 600; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; color: var(--oc-text); }
@media (max-width: 800px) {
 .oc-feedback__grid > .wp-block-group__inner-container, .oc-feedback__grid:not(:has(> .wp-block-group__inner-container)), .oc-feedback__details-grid > .wp-block-group__inner-container, .oc-feedback__details-grid:not(:has(> .wp-block-group__inner-container)) { grid-template-columns: 1fr; gap: 24px; }
 .oc-feedback__grid .oc-feedback__contact { padding: 0; }
}
@media (max-width: 600px) {
 .oc-feedback__grid .oc-feedback__form-card, .oc-feedback .oc-feedback__details { padding: 22px 18px; border-radius: 18px; }
 .oc-contact-fields { grid-template-columns: 1fr; gap: 16px; }
 .oc-feedback h2 { font-size: 24px; }
 .oc-feedback .wpcf7-submit { width: 100%; }
 .oc-feedback .wpcf7-spinner { display: block; margin: 8px auto 0; }
 .oc-feedback__accounts > .wp-block-group__inner-container, .oc-feedback__accounts:not(:has(> .wp-block-group__inner-container)) { grid-template-columns: 1fr; }
}

/* CF7 inserts line breaks between labels; keep the field grid contiguous. */
.oc-contact-fields > br, .oc-contact-fields > p > br { display: none; }

/* FAQ support callout. */
body.page-id-88 .oc-how-cta#support {
 position: relative; max-width: 1120px; margin: 36px auto 48px; padding: 36px; border: 1px solid #233e75; border-radius: 24px;
 background: radial-gradient(ellipse at 100% 0%, rgba(1,127,251,.26), transparent 65%), linear-gradient(120deg,#0a1738,#10254d);
 box-shadow: 0 12px 32px rgba(10,17,46,.1);
}
body.page-id-88 #support > .wp-block-group__inner-container { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 32px; align-items: center; padding: 0; }
body.page-id-88 #support > .wp-block-group__inner-container > .wp-block-group { position: relative; padding-left: 78px; }
body.page-id-88 #support > .wp-block-group__inner-container > .wp-block-group::before {
 content: ''; position: absolute; left: 0; top: 2px; width: 54px; height: 54px; border: 1px solid rgba(130,184,255,.28); border-radius: 16px;
 background: rgba(1,127,251,.15) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 24 24' fill='none' stroke='%239bceff' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='3'/%3E%3Cpath d='m4 7 8 6 8-6'/%3E%3C/svg%3E") center no-repeat;
}
body.page-id-88 #support h2 { color: #fff; font-size: 28px; font-weight: 800; line-height: 1.2; }
body.page-id-88 #support p { max-width: 590px; margin-top: 12px !important; color: #c6d5ed; font-size: 15px; line-height: 1.65; }
body.page-id-88 #support p a { color: #9bceff; text-underline-offset: 3px; overflow-wrap: anywhere; }
body.page-id-88 #support .wp-block-buttons { margin: 0; }
body.page-id-88 #support .wp-block-button__link {
 display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 50px; padding: 14px 22px; border: 1px solid rgba(255,255,255,.15); border-radius: 12px;
 background: var(--oc-primary); color: #fff; font-size: 14px; font-weight: 700; text-decoration: none; box-shadow: 0 6px 18px rgba(1,127,251,.2); transition: background .18s ease;
}
body.page-id-88 #support .wp-block-button__link::after { content: '→'; font-size: 20px; line-height: 1; }
body.page-id-88 #support .wp-block-button__link:hover { background: var(--oc-primary-hover); }
body.page-id-88 #support a:focus-visible { outline: 2px solid #9bceff; outline-offset: 5px; }
@media (max-width: 800px) {
 body.page-id-88 .oc-how-cta#support { padding: 28px; }
 body.page-id-88 #support > .wp-block-group__inner-container { grid-template-columns: 1fr; gap: 24px; }
 body.page-id-88 #support .wp-block-buttons { padding-left: 78px; }
}
@media (max-width: 480px) {
 body.page-id-88 .oc-how-cta#support { padding: 24px 20px; border-radius: 18px; }
 body.page-id-88 #support > .wp-block-group__inner-container > .wp-block-group { padding-left: 0; padding-top: 72px; }
 body.page-id-88 #support h2 { font-size: 25px; }
 body.page-id-88 #support .wp-block-buttons { padding-left: 0; width: 100%; }
 body.page-id-88 #support .wp-block-button, body.page-id-88 #support .wp-block-button__link { width: 100%; }
}
@media (prefers-reduced-motion: reduce) { body.page-id-88 #support .wp-block-button__link { transition: none; } }

/* How to buy: visual refresh below the existing hero. */
body.page-id-69 .oc-how-page__title { max-width: 1120px; margin: 54px auto 12px !important; font-size: clamp(27px,3vw,36px); font-weight: 800; letter-spacing: -.025em; }
body.page-id-69 .oc-how-page__intro { max-width: 750px; margin: 0 0 30px; font-size: 16px; line-height: 1.7; }
body.page-id-69 .oc-steps { max-width: 1120px; margin: 0 auto 36px; gap: 18px; }
body.page-id-69 .oc-steps .oc-step {
 --oc-step-heading: var(--oc-text); --oc-step-copy: var(--oc-text-muted); --oc-step-index: #a4b6d2; --oc-step-icon-bg: var(--oc-primary-soft);
 background: var(--oc-surface); border: 1px solid var(--oc-border); border-radius: 22px; padding: 28px; min-height: 258px; box-shadow: 0 8px 26px rgba(10,17,46,.035);
}
body.page-id-69 .oc-steps .oc-step:first-child {
 --oc-step-heading: #fff; --oc-step-copy: #cedcf3; --oc-step-index: #7099d5; --oc-step-icon-bg: #e6f3ff;
 background: radial-gradient(ellipse at 100% 0%,rgba(1,127,251,.32),transparent 70%),linear-gradient(135deg,#0a1738,#142e5f); border-color: #233e75;
}
body.page-id-69 .oc-steps .oc-step:hover { transform: translateY(-3px); border-color: #99caff; box-shadow: 0 14px 32px rgba(10,17,46,.08); }
body.page-id-69 .oc-step__icon { width: 56px; height: 56px; border-radius: 16px; margin-bottom: 24px; background-size: 28px; }
body.page-id-69 .oc-step::after { top: 24px; right: 26px; font-size: 36px; font-weight: 800; line-height: 1; letter-spacing: -.04em; }
body.page-id-69 .oc-step h3 { font-size: 20px; line-height: 1.3; margin-bottom: 12px !important; }
body.page-id-69 .oc-step p { font-size: 14.5px; line-height: 1.7; }
body.page-id-69 .oc-how-support { max-width: 1120px; margin: 0 auto 36px; gap: 18px; }
body.page-id-69 .oc-how-support .oc-note { position: relative; padding: 28px 28px 28px 82px; background: #f4f8ff; border: 1px solid #dce8f8; border-radius: 20px; }
body.page-id-69 .oc-how-support .oc-note::before { content: ''; position: absolute; top: 28px; left: 25px; width: 38px; height: 38px; border-radius: 12px; background-color: #e1edff; background-position: center; background-repeat: no-repeat; background-size: 23px; }
body.page-id-69 .oc-how-support .oc-note:first-child::before { background-image: url('assets/img/step-pay.svg'); }
body.page-id-69 .oc-how-support .oc-note:last-child::before { background-image: url('assets/img/step-email.svg'); }
body.page-id-69 .oc-note h3 { font-size: 18px; margin-bottom: 10px !important; line-height: 1.35; }
body.page-id-69 .oc-note p { font-size: 14px; line-height: 1.7; color: var(--oc-text-muted); }
body.page-id-69 .oc-note a { color: var(--oc-primary-hover); text-underline-offset: 3px; }
body.page-id-69 .oc-how-cta {
 max-width: 1120px; margin: 0 auto 48px; padding: 36px 38px; border-radius: 24px; border: 1px solid #233e75;
 background: radial-gradient(ellipse at 95% 10%,rgba(1,127,251,.3),transparent 65%),linear-gradient(120deg,#0a1738,#10254d); box-shadow: 0 12px 32px rgba(10,17,46,.08);
}
body.page-id-69 .oc-how-cta > .wp-block-group__inner-container { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 32px; align-items: center; }
body.page-id-69 .oc-how-cta h2 { color: #fff; font-size: 28px; font-weight: 800; line-height: 1.25; }
body.page-id-69 .oc-how-cta p { margin-top: 12px !important; color: #c6d5ed; font-size: 15px; line-height: 1.65; max-width: 590px; }
body.page-id-69 .oc-how-cta .wp-block-button__link { display: inline-flex; align-items: center; justify-content: center; gap: 18px; min-height: 50px; padding: 14px 24px; background: var(--oc-primary); border: 1px solid rgba(255,255,255,.15); border-radius: 12px; color: #fff; font-size: 14px; font-weight: 700; text-decoration: none; }
body.page-id-69 .oc-how-cta .wp-block-button__link::after { content: '→'; font-size: 20px; line-height: 1; }
body.page-id-69 .oc-how-cta .wp-block-button__link:hover { background: var(--oc-primary-hover); }
body.page-id-69 .oc-how-cta a:focus-visible, body.page-id-69 .oc-note a:focus-visible { outline: 2px solid var(--oc-primary); outline-offset: 5px; }
@media (max-width: 960px) { body.page-id-69 .oc-steps { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 720px) {
 body.page-id-69 .oc-how-support { grid-template-columns: 1fr; }
 body.page-id-69 .oc-how-cta > .wp-block-group__inner-container { grid-template-columns: 1fr; gap: 24px; }
 body.page-id-69 .oc-how-cta { padding: 28px; }
}
@media (max-width: 600px) {
 body.page-id-69 .oc-how-page__title { margin-top: 34px !important; }
 body.page-id-69 .oc-how-page__intro { font-size: 15px; }
 body.page-id-69 .oc-steps { grid-template-columns: 1fr; gap: 14px; }
 body.page-id-69 .oc-steps .oc-step { min-height: 0; padding: 24px; border-radius: 18px; }
 body.page-id-69 .oc-step__icon { margin-bottom: 18px; }
 body.page-id-69 .oc-how-support .oc-note { padding: 24px 20px 24px 72px; border-radius: 18px; }
 body.page-id-69 .oc-how-support .oc-note::before { top: 24px; left: 20px; }
 body.page-id-69 .oc-how-cta { padding: 26px 22px; border-radius: 18px; }
 body.page-id-69 .oc-how-cta h2 { font-size: 25px; }
 body.page-id-69 .oc-how-cta .wp-block-buttons, body.page-id-69 .oc-how-cta .wp-block-button, body.page-id-69 .oc-how-cta .wp-block-button__link { width: 100%; }
}
@media (prefers-reduced-motion: reduce) { body.page-id-69 .oc-steps .oc-step { transition: none; } body.page-id-69 .oc-steps .oc-step:hover { transform: none; } }

/* Shop archive: catalog presentation, scoped away from product/cart pages. */
body:is(.woocommerce-shop, .tax-product_cat) .inside-article { padding-top: 25px; padding-bottom: 48px; }
body:is(.woocommerce-shop, .tax-product_cat) .woocommerce-breadcrumb { margin-bottom: 16px !important; font-size: 12px; color: var(--oc-text-muted); }
body:is(.woocommerce-shop, .tax-product_cat) .woocommerce-breadcrumb a { color: var(--oc-text-muted); }
body:is(.woocommerce-shop, .tax-product_cat) .woocommerce-products-header {
 position: relative; overflow: hidden; display: flex; align-items: center; min-height: 175px; margin-bottom: 28px; padding: 36px 40px; border-radius: 24px; border: 1px solid #233e75;
 background: linear-gradient(90deg,rgba(5,17,48,.97),rgba(5,17,48,.85) 45%,rgba(5,17,48,.12)),url('/wp-content/uploads/oc-art/how-to-buy-hero-v2.png') center / cover no-repeat;
}
body:is(.woocommerce-shop, .tax-product_cat) .woocommerce-products-header__title.page-title { position: relative; margin: 0 !important; color: #fff; font-size: clamp(32px,4vw,44px); font-weight: 800; letter-spacing: -.025em; line-height: 1.1; }
body:is(.woocommerce-shop, .tax-product_cat) .woocommerce-result-count { display: flex; align-items: center; min-height: 46px; margin: 0 0 24px; font-size: 14px; color: var(--oc-text-muted); }
body:is(.woocommerce-shop, .tax-product_cat) .woocommerce-ordering { margin: 0 0 24px; max-width: 100%; }
body:is(.woocommerce-shop, .tax-product_cat) .woocommerce-ordering select { min-height: 46px; max-width: 100%; padding: 10px 36px 10px 16px; border: 1px solid var(--oc-border); border-radius: 12px; background-color: #f5f8fc; color: var(--oc-text); font-size: 13px; cursor: pointer; }
body:is(.woocommerce-shop, .tax-product_cat) ul.products { clear: both; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 20px; margin-bottom: 36px; }
body:is(.woocommerce-shop, .tax-product_cat) ul.products li.product { display: flex; flex-direction: column; min-width: 0; padding: 12px; border-radius: 20px; border: 1px solid var(--oc-border); box-shadow: 0 6px 20px rgba(10,17,46,.035); transition: border-color .18s ease,box-shadow .18s ease,transform .18s ease; }
body:is(.woocommerce-shop, .tax-product_cat) ul.products li.product:hover { border-color: #a0ccff; box-shadow: 0 14px 30px rgba(10,17,46,.08); transform: translateY(-3px); }
body:is(.woocommerce-shop, .tax-product_cat) ul.products li.product a.woocommerce-LoopProduct-link { display: flex; flex-direction: column; flex: 1; min-width: 0; }
body:is(.woocommerce-shop, .tax-product_cat) ul.products li.product a img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: contain; border-radius: 12px; background: #f2f6fc; margin: 0 0 16px !important; }
body:is(.woocommerce-shop, .tax-product_cat) ul.products li.product .woocommerce-loop-product__title { padding: 0 4px !important; margin: 0 0 10px; font-size: 17px; line-height: 1.35; font-weight: 700; }
body:is(.woocommerce-shop, .tax-product_cat) ul.products li.product .price { position: static; inset: auto; margin: auto 4px 16px; padding-top: 4px; overflow: visible; white-space: normal; font-size: 19px; font-weight: 800; font-variant-numeric: tabular-nums; line-height: 1.3; }
body:is(.woocommerce-shop, .tax-product_cat) ul.products li.product .button { position: static !important; inset: auto; display: flex; align-items: center; justify-content: center; width: 100%; min-height: 44px; margin: 0; padding: 12px 8px !important; border-radius: 10px !important; font-size: 13px; line-height: 1.35; font-weight: 700; text-align: center; }
body:is(.woocommerce-shop, .tax-product_cat) ul.products li.product .button.product_type_variable { background: var(--oc-primary-soft) !important; }
body:is(.woocommerce-shop, .tax-product_cat) ul.products li.product .added_to_cart { padding: 10px 0 2px; text-align: center; color: var(--oc-primary); font-size: 13px; }
body:is(.woocommerce-shop, .tax-product_cat) nav.woocommerce-pagination { padding-top: 8px; }
body:is(.woocommerce-shop, .tax-product_cat) nav.woocommerce-pagination ul { display: inline-flex; gap: 8px; margin: 0; border: 0; }
body:is(.woocommerce-shop, .tax-product_cat) nav.woocommerce-pagination ul li { border: 0; }
body:is(.woocommerce-shop, .tax-product_cat) nav.woocommerce-pagination ul li :is(a,span) { display: flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 10px; border: 1px solid var(--oc-border); border-radius: 12px; background: var(--oc-surface); color: var(--oc-text); font-size: 14px; font-weight: 600; }
body:is(.woocommerce-shop, .tax-product_cat) nav.woocommerce-pagination ul li span.current { background: var(--oc-primary); border-color: var(--oc-primary); color: #fff; }
body:is(.woocommerce-shop, .tax-product_cat) nav.woocommerce-pagination ul li a:hover { background: var(--oc-primary-soft); color: var(--oc-primary-hover); }
body:is(.woocommerce-shop, .tax-product_cat) :is(.woocommerce-ordering select,ul.products a,nav.woocommerce-pagination a):focus-visible { outline: 2px solid var(--oc-primary); outline-offset: 3px; }
@media (max-width: 1050px) { body:is(.woocommerce-shop, .tax-product_cat) ul.products { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; } }
@media (max-width: 760px) {
 body:is(.woocommerce-shop, .tax-product_cat) ul.products { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
 body:is(.woocommerce-shop, .tax-product_cat) .woocommerce-products-header { min-height: 145px; padding: 28px; border-radius: 20px; }
}
@media (max-width: 480px) {
 body:is(.woocommerce-shop, .tax-product_cat) .inside-article { padding-left: 16px; padding-right: 16px; }
 body:is(.woocommerce-shop, .tax-product_cat) .woocommerce-products-header { min-height: 130px; padding: 24px; border-radius: 18px; background-position: 60% center; }
 body:is(.woocommerce-shop, .tax-product_cat) .woocommerce-result-count, body:is(.woocommerce-shop, .tax-product_cat) .woocommerce-ordering { float: none; width: 100%; margin-bottom: 12px; }
 body:is(.woocommerce-shop, .tax-product_cat) .woocommerce-result-count { min-height: 24px; font-size: 13px; }
 body:is(.woocommerce-shop, .tax-product_cat) .woocommerce-ordering { margin-bottom: 22px; }
 body:is(.woocommerce-shop, .tax-product_cat) .woocommerce-ordering select { width: 100%; }
 body:is(.woocommerce-shop, .tax-product_cat) ul.products { gap: 12px; }
 body:is(.woocommerce-shop, .tax-product_cat) ul.products li.product { padding: 8px; border-radius: 15px; }
 body:is(.woocommerce-shop, .tax-product_cat) ul.products li.product a img { margin-bottom: 12px !important; border-radius: 10px; }
 body:is(.woocommerce-shop, .tax-product_cat) ul.products li.product .woocommerce-loop-product__title { font-size: 14px; padding: 0 2px !important; }
 body:is(.woocommerce-shop, .tax-product_cat) ul.products li.product .price { font-size: 16px; margin-left: 2px; margin-right: 2px; margin-bottom: 12px; }
 body:is(.woocommerce-shop, .tax-product_cat) ul.products li.product .button { font-size: 11.5px; padding: 10px 4px !important; min-height: 42px; }
}
@media (max-width: 340px) { body:is(.woocommerce-shop, .tax-product_cat) ul.products { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { body:is(.woocommerce-shop, .tax-product_cat) ul.products li.product { transition: none; } body:is(.woocommerce-shop, .tax-product_cat) ul.products li.product:hover { transform: none; } }

/* Match catalog hero dimensions to the information pages. */
body:is(.woocommerce-shop, .tax-product_cat) .woocommerce-products-header { min-height: 370px; padding: 56px; margin-bottom: 48px; }
body:is(.woocommerce-shop, .tax-product_cat) .woocommerce-products-header__title.page-title { font-size: 44px; }
body:is(.woocommerce-shop, .tax-product_cat) .oc-shop-intro { margin: 0 0 28px; }
body:is(.woocommerce-shop, .tax-product_cat) .oc-shop-intro > .wp-block-group__inner-container { padding: 0; max-width: none; }
body:is(.woocommerce-shop, .tax-product_cat) .oc-shop-intro h2 { margin: 0 0 12px; color: var(--oc-text); font-size: clamp(27px,3vw,36px); line-height: 1.2; font-weight: 800; letter-spacing: -.025em; }
body:is(.woocommerce-shop, .tax-product_cat) .oc-shop-intro p { max-width: 780px; margin: 0; color: var(--oc-text-muted); font-size: 16px; line-height: 1.7; }
body:is(.woocommerce-shop, .tax-product_cat) ul.products li.product a img { object-fit: cover; }
@media (max-width: 960px) { body:is(.woocommerce-shop, .tax-product_cat) .woocommerce-products-header { min-height: 340px; padding: 42px 36px; background-position: 58% center; } }
@media (max-width: 640px) {
 body:is(.woocommerce-shop, .tax-product_cat) .woocommerce-products-header { min-height: 385px; padding: 30px 24px; align-items: flex-end; border-radius: 16px; background: linear-gradient(0deg,rgba(5,17,48,.98),rgba(5,17,48,.82) 46%,rgba(5,17,48,.12)),url('/wp-content/uploads/oc-art/how-to-buy-hero-v2.png') 67% center / cover no-repeat; }
 body:is(.woocommerce-shop, .tax-product_cat) .woocommerce-products-header__title.page-title { font-size: 34px; }
 body:is(.woocommerce-shop, .tax-product_cat) .oc-shop-intro p { font-size: 15px; }
}

/* Shop introduction belongs inside the hero. */
body:is(.woocommerce-shop, .tax-product_cat) .woocommerce-products-header { flex-direction: column; justify-content: center; align-items: flex-start; gap: 18px; }
body:is(.woocommerce-shop, .tax-product_cat) .woocommerce-products-header > p { max-width: 540px; margin: 0; font-size: 18px; line-height: 1.65; color: #dce7fa; }
@media (max-width: 640px) { body:is(.woocommerce-shop, .tax-product_cat) .woocommerce-products-header { justify-content: flex-end; } body:is(.woocommerce-shop, .tax-product_cat) .woocommerce-products-header > p { font-size: 16px; } }

/* Compact mobile header and navigation disclosure. */
.oc-menu-toggle { display: none; }
.oc-header__nav[hidden] { display: none; }
@media (max-width: 900px) {
 .oc-header { background: #fff; box-shadow: 0 4px 18px rgba(10,17,46,.035); }
 .oc-header__top { grid-template-columns: minmax(0,1fr) auto; gap: 14px 10px; padding: 14px 16px 16px; }
 .oc-header__top > .oc-logo { min-width: 0; width: 100%; max-width: 190px; }
 .oc-header__top .oc-logo__img { width: 100%; max-width: 190px; height: auto; }
 .oc-header__top > .oc-header__actions { gap: 4px; min-width: 0; }
 .oc-header__action, .oc-menu-toggle { width: 40px; height: 40px; justify-content: center; border-radius: 12px; flex: 0 0 40px; }
 .oc-header__action { background: #f4f7fc; color: var(--oc-text-body); }
 .oc-header__action:hover { background: var(--oc-primary-soft); }
 .oc-header--menu-ready .oc-menu-toggle { display: inline-flex; align-items: center; padding: 0; border: 1px solid #d7e8fc; background: var(--oc-primary-soft); color: var(--oc-primary); cursor: pointer; }
 .oc-menu-toggle svg { width: 22px; height: 22px; }
 .oc-menu-toggle path { transform-origin: 12px 12px; transition: transform .18s ease, opacity .18s ease; }
 .oc-header--menu-open .oc-menu-toggle__top { transform: translateY(6px) rotate(45deg); transform-origin: 12px 6px; }
 .oc-header--menu-open .oc-menu-toggle__middle { opacity: 0; }
 .oc-header--menu-open .oc-menu-toggle__bottom { transform: translateY(-6px) rotate(-45deg); transform-origin: 12px 18px; }
 .oc-header .oc-search { margin: 0; }
 .oc-header input[type="search"].oc-search__input { height: 38px; line-height: 38px; border-radius: 11px; background: #f7f9fd; border-color: #e0e8f3; font-size: 16px; padding-left: 38px; }
 .oc-header .oc-search svg { width: 16px; height: 16px; left: 13px; }
 .oc-header__nav { padding: 0 16px 16px; overflow: visible; }
 .oc-header__nav .oc-nav { width: 100%; padding: 8px; background: #f5f8fd; border: 1px solid var(--oc-border); border-radius: 16px; }
 .oc-header__nav .oc-nav__list { display: grid; grid-template-columns: 1fr; gap: 4px; }
 .oc-header__nav .oc-nav__list a { display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 44px; padding: 10px 14px; border-radius: 10px; font-size: 14px; line-height: 1.4; }
 .oc-header__nav .oc-nav__list a::after { content: '›'; position: static; width: auto; height: auto; background: none; color: #8ea6c9; font-size: 22px; line-height: 1; }
 .oc-header__nav .oc-nav__list a:hover, .oc-header__nav .oc-nav__list .current-menu-item a { background: #fff; color: var(--oc-primary); }
 .oc-menu-toggle:focus-visible, .oc-header__action:focus-visible, .oc-header__nav a:focus-visible { outline: 2px solid var(--oc-primary); outline-offset: 2px; }
}
@media (max-width: 350px) { .oc-header__top { padding-left: 12px; padding-right: 12px; gap: 12px 6px; } .oc-header__top > .oc-header__actions { gap: 2px; } }
@media (prefers-reduced-motion: reduce) { .oc-menu-toggle path { transition: none; } }

/* Mobile search spacing and placeholder size. */
@media (max-width: 900px) {
 .oc-header .oc-search { margin-top: 4px; }
 .oc-header input[type="search"].oc-search__input::placeholder { font-size: 14px; }
}

/* Category descriptions share the catalog hero typography. */
body.tax-product_cat .woocommerce-products-header .term-description { max-width: 540px; margin: 0; color: #dce7fa; font-size: 18px; line-height: 1.65; }
body.tax-product_cat .woocommerce-products-header .term-description p { margin: 0; color: inherit; font-size: inherit; line-height: inherit; }
@media (max-width: 640px) { body.tax-product_cat .woocommerce-products-header .term-description { font-size: 16px; } }

/* Product gallery: disable zoom trigger and magnified image overlay. */
.woocommerce-product-gallery__trigger, .woocommerce-product-gallery .zoomImg { display: none !important; }

/* First audience card: gift artwork preview. */
.oc-aud .oc-aud__card.oc-aud__card--gift-art { padding: 0; overflow: hidden; border: 1px solid #f2dbe5; border-radius: 22px; background: linear-gradient(145deg,#fff7fa,#fcecf3); box-shadow: 0 10px 28px rgba(125,41,78,.07); }
.oc-aud__card--gift-art .oc-aud__image { margin: 0 0 22px; width: 100%; }
.oc-aud__card--gift-art .oc-aud__image img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; border-radius: 0; }
.oc-aud__card--gift-art h3 { margin: 0 26px 10px; font-size: 22px; font-weight: 800; color: var(--oc-text); }
.oc-aud__card--gift-art p { margin: 0 26px 26px; font-size: 15px; line-height: 1.7; color: var(--oc-text-body); }
@media (max-width: 600px) { .oc-aud__card--gift-art h3 { margin-left: 22px; margin-right: 22px; } .oc-aud__card--gift-art p { margin-left: 22px; margin-right: 22px; margin-bottom: 22px; } }

/* Gift card copy needs padding: Gutenberg flow rules reset child margins. */
.oc-aud .oc-aud__card--gift-art h3 { padding: 4px 26px 10px; margin: 0 !important; }
.oc-aud .oc-aud__card--gift-art p { padding: 0 26px 26px; margin: 0 !important; }
@media (max-width: 600px) {
 .oc-aud .oc-aud__card--gift-art h3 { padding-left: 22px; padding-right: 22px; }
 .oc-aud .oc-aud__card--gift-art p { padding-left: 22px; padding-right: 22px; padding-bottom: 22px; }
}

/* Complete the audience image card set. */
.oc-aud .oc-aud__card:is(.oc-aud__card--games-art,.oc-aud__card--subscriptions-art) { padding: 0; overflow: hidden; border: 1px solid #dbe6f5; border-radius: 22px; background: linear-gradient(145deg,#f6faff,#eaf2ff); box-shadow: 0 10px 28px rgba(20,55,115,.06); }
.oc-aud .oc-aud__card.oc-aud__card--subscriptions-art { border-color: #f0e0cc; background: linear-gradient(145deg,#fffaf3,#fff1df); box-shadow: 0 10px 28px rgba(125,75,20,.06); }
.oc-aud :is(.oc-aud__card--games-art,.oc-aud__card--subscriptions-art) .oc-aud__image { margin: 0 0 22px; width: 100%; }
.oc-aud :is(.oc-aud__card--games-art,.oc-aud__card--subscriptions-art) .oc-aud__image img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; border-radius: 0; }
.oc-aud :is(.oc-aud__card--games-art,.oc-aud__card--subscriptions-art) h3 { padding: 4px 26px 10px; margin: 0 !important; font-size: 22px; font-weight: 800; color: var(--oc-text); }
.oc-aud :is(.oc-aud__card--games-art,.oc-aud__card--subscriptions-art) p { padding: 0 26px 26px; margin: 0 !important; font-size: 15px; line-height: 1.7; color: var(--oc-text-body); }
@media (max-width: 600px) {
 .oc-aud :is(.oc-aud__card--games-art,.oc-aud__card--subscriptions-art) h3 { padding-left: 22px; padding-right: 22px; }
 .oc-aud :is(.oc-aud__card--games-art,.oc-aud__card--subscriptions-art) p { padding-left: 22px; padding-right: 22px; padding-bottom: 22px; }
}

/* CTA uses the lossless original at its native aspect ratio. */
.entry-content .oc-cta {
 position: relative; height: auto; min-height: 0; aspect-ratio: 1983 / 793; padding: 0;
 background: url('/wp-content/uploads/oc-art/cta-studio-original.png') center / 100% 100% no-repeat;
}
.entry-content .oc-cta > .wp-block-group__inner-container { position: absolute; inset: 0; height: auto; padding: 32px 40px; align-items: flex-end; justify-content: center; }
.entry-content .oc-cta .oc-cta__text { width: 40%; max-width: 430px; margin: 0 !important; }
.entry-content .oc-cta .oc-cta__text > .wp-block-group__inner-container { height: auto; padding: 0; }
@media (max-width: 900px) {
 .entry-content .oc-cta { aspect-ratio: auto; background: #ddecff; }
 .entry-content .oc-cta::before { content: ''; display: block; width: 100%; aspect-ratio: 1983 / 793; background: url('/wp-content/uploads/oc-art/cta-studio-original.png') center / 100% 100% no-repeat; }
 .entry-content .oc-cta > .wp-block-group__inner-container { position: static; padding: 24px; align-items: flex-start; }
 .entry-content .oc-cta .oc-cta__text { width: 100%; max-width: none; text-align: left; }
}

/* Benefit icons use external SVGs so WordPress content sanitizing cannot strip them. */
.oc-benefits .oc-benefit__icon { background-repeat: no-repeat; background-position: center; background-size: 24px 24px; }
.oc-benefits .oc-benefit:nth-child(1) .oc-benefit__icon { background-image: url('assets/img/step-email.svg'); }
.oc-benefits .oc-benefit:nth-child(2) .oc-benefit__icon { background-image: url('assets/img/step-order.svg'); }
.oc-benefits .oc-benefit:nth-child(3) .oc-benefit__icon { background-image: url('assets/img/step-choose.svg'); }
.oc-benefits .oc-benefit:nth-child(4) .oc-benefit__icon { background-image: url('assets/img/step-activate.svg'); }

/* Restore compact CTA height while retaining the lossless original. */
@media (min-width: 901px) {
 .entry-content .oc-cta { height: 280px; min-height: 0; aspect-ratio: auto; background-image: url('/wp-content/uploads/oc-art/cta-studio-original.png'); background-size: cover; background-position: left center; }
}

/* Why Softcart24: distinct, lightweight benefit cards. */
.oc-benefits .oc-benefit { position: relative; padding: 26px 24px; border-radius: 20px; border: 1px solid #dce8f6; background: linear-gradient(145deg,#fff,#f3f8ff); box-shadow: 0 6px 22px rgba(10,17,46,.035); transition: border-color .18s ease, box-shadow .18s ease; }
.oc-benefits .oc-benefit:nth-child(2) { background: linear-gradient(145deg,#fff,#f5f2ff); border-color: #e5dff5; }
.oc-benefits .oc-benefit:nth-child(3) { background: linear-gradient(145deg,#fff,#effaf6); border-color: #dbeee5; }
.oc-benefits .oc-benefit:nth-child(4) { background: linear-gradient(145deg,#fff,#fff6ed); border-color: #f0e3d5; }
.oc-benefits .oc-benefit:hover { border-color: #9ec8fb; box-shadow: 0 12px 28px rgba(10,17,46,.07); }
.oc-benefits .oc-benefit__icon { width: 56px; height: 56px; border-radius: 16px; margin-bottom: 22px; background-color: #e3efff; background-size: 28px 28px; border: 1px solid rgba(1,127,251,.08); }
.oc-benefits .oc-benefit:nth-child(2) .oc-benefit__icon { background-color: #ece6ff; border-color: #e2d9fa; }
.oc-benefits .oc-benefit:nth-child(3) .oc-benefit__icon { background-color: #dff4ea; border-color: #cfecdf; }
.oc-benefits .oc-benefit:nth-child(4) .oc-benefit__icon { background-color: #ffead5; border-color: #f6dfc6; }
.oc-benefits .oc-benefit h3 { margin: 0 0 12px !important; font-size: 18px; font-weight: 800; line-height: 1.35; letter-spacing: -.015em; }
.oc-benefits .oc-benefit p { margin: 0 !important; font-size: 14px; line-height: 1.75; color: var(--oc-text-muted); }
@media (max-width: 560px) {
 .oc-benefits > .wp-block-group__inner-container { gap: 14px; }
 .oc-benefits .oc-benefit { padding: 22px; border-radius: 18px; }
 .oc-benefits .oc-benefit__icon { width: 50px; height: 50px; margin-bottom: 18px; }
}
@media (prefers-reduced-motion: reduce) { .oc-benefits .oc-benefit { transition: none; } }

/* Mobile CTA: contained width and compact copy. */
@media (max-width: 900px) {
 .entry-content .oc-cta { width: auto; max-width: 100%; margin-left: 16px; margin-right: 16px; margin-top: 20px; margin-bottom: 36px; border-radius: 20px; }
 .entry-content .oc-cta > .wp-block-group__inner-container { width: 100%; min-width: 0; gap: 16px; padding: 22px; box-sizing: border-box; }
 .entry-content .oc-cta .oc-cta__text { min-width: 0; margin: 0 !important; }
 .entry-content .oc-cta .oc-cta__text > .wp-block-group__inner-container { display: block; width: 100%; height: auto; padding: 0; }
 .entry-content .oc-cta .oc-cta__text h2 { font-size: 24px; line-height: 1.25; margin: 0 0 12px !important; text-shadow: none; }
 .entry-content .oc-cta .oc-cta__text p { font-size: 14px; line-height: 1.65; margin: 0 !important; text-shadow: none; }
 .entry-content .oc-cta .wp-block-buttons { width: 100%; }
 .entry-content .oc-cta .wp-block-button { width: 100%; }
 .entry-content .oc-cta .wp-block-button__link { display: flex; justify-content: center; align-items: center; width: 100%; min-height: 44px; padding: 12px 16px; font-size: 14px; border-radius: 10px; }
}

/* Saturated benefit gradients with high-contrast copy. */
.oc-benefits .oc-benefit:nth-child(1) { background: radial-gradient(ellipse at 100% 0%,#49c7ff 0%,transparent 65%),linear-gradient(135deg,#12368b,#087bed); border-color: #328ce7; }
.oc-benefits .oc-benefit:nth-child(2) { background: radial-gradient(ellipse at 100% 0%,#e876ee 0%,transparent 65%),linear-gradient(135deg,#4922a5,#9546db); border-color: #a362e5; }
.oc-benefits .oc-benefit:nth-child(3) { background: radial-gradient(ellipse at 100% 0%,#52e4bd 0%,transparent 65%),linear-gradient(135deg,#064d62,#079c94); border-color: #32b8a7; }
.oc-benefits .oc-benefit:nth-child(4) { background: radial-gradient(ellipse at 100% 0%,#ffbb68 0%,transparent 65%),linear-gradient(135deg,#922543,#e5673c); border-color: #f28d68; }
.oc-benefits .oc-benefit h3 { color: #fff; }
.oc-benefits .oc-benefit p { color: #f0f5ff; }
.oc-benefits .oc-benefit:nth-child(n) .oc-benefit__icon { background-color: rgba(255,255,255,.94); border-color: rgba(255,255,255,.65); box-shadow: 0 4px 14px rgba(0,0,0,.08); }
.oc-benefits .oc-benefit:hover { border-color: rgba(255,255,255,.6); box-shadow: 0 14px 30px rgba(25,46,95,.16); }

/* Catalog card actions: price left, compact blue button right. */
body:is(.woocommerce-shop, .tax-product_cat) ul.products li.product { padding-bottom: 70px; }
body:is(.woocommerce-shop, .tax-product_cat) ul.products li.product .price { position: absolute; left: 16px; right: 164px; bottom: 24px; margin: 0; padding: 0; font-size: 17px; line-height: 1.3; }
body:is(.woocommerce-shop, .tax-product_cat) ul.products li.product .button { position: absolute !important; left: auto; right: 12px; bottom: 12px; width: auto; min-width: 140px; min-height: 44px; gap: 8px; padding: 11px 14px !important; background: var(--oc-primary) !important; color: #fff !important; border-radius: 11px !important; font-size: 13px; }
body:is(.woocommerce-shop, .tax-product_cat) ul.products li.product .button::before { content: ''; width: 16px; height: 18px; flex: 0 0 16px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 8h12l-1 12H7L6 8Z'/%3E%3Cpath d='M9 10V7a3 3 0 0 1 6 0v3'/%3E%3C/svg%3E") center / contain no-repeat; }
body:is(.woocommerce-shop, .tax-product_cat) ul.products li.product .button:hover { background: var(--oc-primary-hover) !important; color: #fff !important; }
body:is(.woocommerce-shop, .tax-product_cat) ul.products li.product .added_to_cart { position: relative; margin-top: 8px; margin-bottom: 4px; }
@media (min-width: 761px) and (max-width: 1300px) {
 body:is(.woocommerce-shop, .tax-product_cat) ul.products { grid-template-columns: repeat(3,minmax(0,1fr)); }
}
@media (max-width: 600px) {
 body:is(.woocommerce-shop, .tax-product_cat) ul.products li.product { padding-bottom: 62px; }
 body:is(.woocommerce-shop, .tax-product_cat) ul.products li.product .price { position: static; inset: auto; margin: auto 2px 12px; font-size: 16px; }
 body:is(.woocommerce-shop, .tax-product_cat) ul.products li.product .button { left: 8px; right: 8px; bottom: 8px; min-width: 0; width: auto; font-size: 11.5px; padding: 10px 5px !important; gap: 5px; }
}

@media (min-width: 761px) { body:is(.woocommerce-shop, .tax-product_cat) ul.products { grid-template-columns: repeat(3,minmax(0,1fr)); } }
body:is(.woocommerce-shop, .tax-product_cat) ul.products li.product .price { right: 190px; }
@media (max-width: 600px) { body:is(.woocommerce-shop, .tax-product_cat) ul.products li.product .price { right: auto; } }

/* Four desktop catalog columns with compact action sizing. */
@media (min-width: 1051px) {
 body:is(.woocommerce-shop, .tax-product_cat) ul.products { grid-template-columns: repeat(4,minmax(0,1fr)); }
 body:is(.woocommerce-shop, .tax-product_cat) ul.products li.product .button { min-width: 0; gap: 5px; padding: 11px 9px !important; font-size: 11px; }
 body:is(.woocommerce-shop, .tax-product_cat) ul.products li.product .button::before { width: 14px; flex-basis: 14px; }
 body:is(.woocommerce-shop, .tax-product_cat) ul.products li.product .price { right: 157px; left: 12px; font-size: 15px; }
}

/* Denomination selection: soft blue action, as in the reference. */
body:is(.woocommerce-shop, .tax-product_cat) ul.products li.product .button.product_type_variable {
 background: #e6f3ff !important; color: #017ffb !important; border-radius: 16px !important; font-weight: 700;
}
body:is(.woocommerce-shop, .tax-product_cat) ul.products li.product .button.product_type_variable:hover {
 background: #d6eaff !important; color: #0149e5 !important;
}

/* Stronger brand-blue tint for denomination actions. */
body:is(.woocommerce-shop, .tax-product_cat) ul.products li.product .button.product_type_variable { background: #cce5ff !important; color: var(--oc-primary-hover) !important; }
body:is(.woocommerce-shop, .tax-product_cat) ul.products li.product .button.product_type_variable:hover { background: #b3d8ff !important; color: var(--oc-primary-hover) !important; }

/* Match denomination action colors to Add to cart. */
body:is(.woocommerce-shop, .tax-product_cat) ul.products li.product .button.product_type_variable { background: var(--oc-primary) !important; color: #fff !important; }
body:is(.woocommerce-shop, .tax-product_cat) ul.products li.product .button.product_type_variable:hover { background: var(--oc-primary-hover) !important; color: #fff !important; }

/* Product denomination selector. */
.woocommerce.single-product div.product form.cart table.variations { margin: 26px 0 22px; border: 0; }
.woocommerce.single-product div.product form.cart table.variations tbody, .woocommerce.single-product div.product form.cart table.variations tr { display: block; width: 100%; }
.woocommerce.single-product div.product form.cart table.variations th.label { display: block; padding: 0 0 9px; text-align: left; line-height: 1.4; }
.woocommerce.single-product div.product form.cart table.variations label { font-size: 14px; font-weight: 700; color: var(--oc-text); }
.woocommerce.single-product div.product form.cart table.variations td.value { display: block; width: 100%; padding: 0; }
.woocommerce.single-product div.product form.cart table.variations select {
 display: block; width: 100%; max-width: 440px; min-width: 0; height: 50px; margin: 0; padding: 0 44px 0 16px;
 border: 1px solid #b8d8fa; border-radius: 12px; background-color: #f0f7ff;
 background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23017ffb' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 8 5 5 5-5'/%3E%3C/svg%3E"); background-position: right 15px center; background-size: 18px; background-repeat: no-repeat;
 color: var(--oc-text); font-size: 16px; font-weight: 500; line-height: normal; cursor: pointer; appearance: none; -webkit-appearance: none;
}
.woocommerce.single-product div.product form.cart table.variations select:hover { border-color: var(--oc-primary); background-color: #e6f3ff; }
.woocommerce.single-product div.product form.cart table.variations select:focus { outline: 2px solid var(--oc-primary); outline-offset: 3px; border-color: var(--oc-primary); }
.woocommerce.single-product div.product form.cart table.variations select option { background: #fff; color: var(--oc-text); }
.woocommerce.single-product div.product form.cart .reset_variations { display: inline-block; margin-top: 9px; padding: 2px 0; color: var(--oc-text-muted); font-size: 12px; text-decoration: underline; text-underline-offset: 3px; }
.woocommerce.single-product div.product form.cart .reset_variations:hover { color: var(--oc-primary); }
@media (max-width: 600px) { .woocommerce.single-product div.product form.cart table.variations select { max-width: none; } }

/* Space below product information before the following section. */
.woocommerce.single-product div.product .woocommerce-tabs { margin-bottom: 48px; }
@media (max-width: 600px) { .woocommerce.single-product div.product .woocommerce-tabs { margin-bottom: 32px; } }

/* Mobile cart actions: remove WooCommerce floats and fixed text height. */
@media (max-width: 768px) {
 .woocommerce-cart .woocommerce table.shop_table.cart td.actions .coupon { display: flex; flex-direction: column; gap: 10px; float: none; width: 100%; padding: 0; }
 .woocommerce-cart .woocommerce table.shop_table.cart td.actions .coupon .input-text { float: none; width: 100% !important; min-width: 0; height: 44px; margin: 0; box-sizing: border-box; font-size: 16px; }
 .woocommerce-cart .woocommerce table.shop_table.cart td.actions .coupon .button { float: none; width: 100% !important; min-height: 44px; height: auto; margin: 0; padding: 12px 16px; font-size: 14px; line-height: 1.4; white-space: normal; border-radius: 10px; }
 .woocommerce-cart .cart-collaterals .cart_totals { padding: 22px 18px; box-sizing: border-box; }
 .woocommerce-cart .cart-collaterals .wc-proceed-to-checkout { padding: 18px 0 0; }
 .woocommerce-cart .cart-collaterals .checkout-button { min-height: 48px; height: auto; padding: 14px 16px; margin: 0; box-sizing: border-box; font-size: 15px !important; line-height: 1.4; white-space: normal; border-radius: 10px !important; }
}

/* Calm, uniform benefit cards. */
.oc-benefits .oc-benefit:nth-child(n) { background: var(--oc-surface); border: 1px solid var(--oc-border); border-radius: 16px; box-shadow: none; padding: 24px; }
.oc-benefits .oc-benefit h3 { color: var(--oc-text); font-size: 17px; font-weight: 700; }
.oc-benefits .oc-benefit p { color: var(--oc-text-muted); line-height: 1.65; }
.oc-benefits .oc-benefit:nth-child(n) .oc-benefit__icon { background-color: var(--oc-primary-soft); border: 0; box-shadow: none; width: 48px; height: 48px; border-radius: 12px; margin-bottom: 18px; background-size: 24px 24px; }
.oc-benefits .oc-benefit:hover { border-color: #b8d8fa; box-shadow: none; }
@media (max-width: 560px) { .oc-benefits .oc-benefit:nth-child(n) { padding: 22px; } }

/* Site scrollbars in the dark blue brand palette. */
html { scrollbar-color: #143f85 #eef3fa; scrollbar-width: thin; }
* { scrollbar-color: #143f85 #eef3fa; scrollbar-width: thin; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: #eef3fa; }
::-webkit-scrollbar-thumb { background: #143f85; border: 2px solid #eef3fa; border-radius: 10px; }
::-webkit-scrollbar-thumb:hover { background: #0a2454; }
::-webkit-scrollbar-corner { background: #eef3fa; }