/**
 * Кутюр Парфюм — база: reset, типографика, формы, утилиты, доступность.
 */

/* ---------------------------------------------------------------- Reset */

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
	/* Компенсация фиксированной шапки при переходе по якорям. */
	scroll-padding-top: calc(var(--header-h) + var(--space-6));
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}
}

body {
	margin: 0;
	background: var(--bg);
	color: var(--text);
	font-family: var(--font-body);
	font-size: var(--fs-base);
	line-height: var(--lh-relaxed);
	font-weight: 400;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
	overflow-x: hidden;
}

body.cp-no-scroll {
	overflow: hidden;
}

h1, h2, h3, h4, h5, h6 {
	margin: 0 0 var(--space-4);
	font-family: var(--font-display);
	font-weight: 400;
	line-height: var(--lh-snug);
	letter-spacing: var(--ls-tight);
	color: var(--ink);
	font-variation-settings: 'SOFT' 0, 'WONK' 0;
}

h1 { font-size: var(--fs-4xl); line-height: var(--lh-tight); }
h2 { font-size: var(--fs-3xl); line-height: var(--lh-tight); }
h3 { font-size: var(--fs-2xl); }
h4 { font-size: var(--fs-xl); }
h5 { font-size: var(--fs-lg); }
h6 { font-size: var(--fs-md); }

p {
	margin: 0 0 var(--space-4);
}

p:last-child {
	margin-bottom: 0;
}

a {
	color: inherit;
	text-decoration: none;
	transition: color var(--dur) var(--ease-out), opacity var(--dur) var(--ease-out);
}

a:hover {
	color: var(--amber);
}

/* Ссылки внутри редакторского контента должны читаться как ссылки. */
.cp-prose a {
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.22em;
	text-decoration-color: var(--line-strong);
}

.cp-prose a:hover {
	text-decoration-color: var(--amber);
}

img,
picture,
video,
canvas,
svg {
	display: block;
	max-width: 100%;
	height: auto;
}

svg {
	flex-shrink: 0;
}

ul, ol {
	margin: 0 0 var(--space-4);
	padding-left: var(--space-5);
}

li + li {
	margin-top: var(--space-1);
}

hr {
	border: 0;
	border-top: 1px solid var(--line);
	margin: var(--space-8) 0;
}

blockquote {
	margin: var(--space-8) 0;
	padding-left: var(--space-6);
	border-left: 2px solid var(--amber);
	font-family: var(--font-display);
	font-size: var(--fs-lg);
	line-height: var(--lh-normal);
	color: var(--ink-70);
}

table {
	width: 100%;
	border-collapse: collapse;
	font-size: var(--fs-sm);
}

th, td {
	padding: var(--space-3) var(--space-4);
	text-align: left;
	border-bottom: 1px solid var(--line);
}

th {
	font-family: var(--font-mono);
	font-size: var(--fs-2xs);
	letter-spacing: var(--ls-wider);
	text-transform: uppercase;
	color: var(--ink-55);
	font-weight: 500;
}

code, pre, kbd {
	font-family: var(--font-mono);
	font-size: 0.92em;
}

::selection {
	background: var(--amber);
	color: var(--paper-pure);
}

/* ---------------------------------------------------- Служебная типографика */

/* Мелкая трекинговая метка: «КОЛЛЕКЦИЯ», «АРТИКУЛ», «ФИЛЬТРЫ» */
.cp-eyebrow {
	font-family: var(--font-mono);
	font-size: var(--fs-2xs);
	font-weight: 500;
	letter-spacing: var(--ls-widest);
	text-transform: uppercase;
	color: var(--ink-55);
	margin: 0 0 var(--space-3);
	display: block;
}

.cp-eyebrow--accent {
	color: var(--amber);
}

/* Технические данные: цены, артикулы, объёмы, счётчики */
.cp-mono {
	font-family: var(--font-mono);
	font-variant-numeric: tabular-nums;
	letter-spacing: var(--ls-wide);
}

.cp-display {
	font-family: var(--font-display);
	letter-spacing: var(--ls-tight);
}

.cp-lede {
	font-size: var(--fs-lg);
	line-height: var(--lh-relaxed);
	color: var(--ink-70);
	max-width: 62ch;
}

.cp-muted {
	color: var(--text-muted);
}

/* Редакторский контент из WordPress */
.cp-prose {
	max-width: var(--container-text);
	line-height: var(--lh-relaxed);
}

.cp-prose > * + * {
	margin-top: var(--space-4);
}

.cp-prose h2 {
	font-size: var(--fs-2xl);
	margin-top: var(--space-12);
}

.cp-prose h3 {
	font-size: var(--fs-xl);
	margin-top: var(--space-8);
}

.cp-prose img {
	margin: var(--space-8) 0;
}

.cp-prose ul,
.cp-prose ol {
	padding-left: var(--space-6);
}

/* ------------------------------------------------------------------ Формы */

input,
textarea,
select,
button {
	font: inherit;
	color: inherit;
}

button {
	cursor: pointer;
	background: none;
	border: none;
	padding: 0;
	color: inherit;
}

/* Убираем стрелки у числовых полей — количество меняется кнопками. */
input[type='number'] {
	-moz-appearance: textfield;
}

input[type='number']::-webkit-outer-spin-button,
input[type='number']::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

input[type='search']::-webkit-search-decoration,
input[type='search']::-webkit-search-cancel-button {
	-webkit-appearance: none;
}

fieldset {
	border: 0;
	margin: 0;
	padding: 0;
	min-width: 0;
}

legend {
	padding: 0;
}

/* ------------------------------------------------------- Доступность */

/* Фокус виден всегда, когда пользователь ведёт с клавиатуры. */
:focus-visible {
	outline: 2px solid var(--amber);
	outline-offset: 3px;
	border-radius: var(--radius-xs);
}

:focus:not(:focus-visible) {
	outline: none;
}

.screen-reader-text,
.cp-visually-hidden {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

/* Ссылка «к содержимому» появляется только при фокусе. */
.cp-skip-link {
	position: absolute;
	top: -100px;
	left: var(--space-4);
	z-index: var(--z-toast);
	padding: var(--space-3) var(--space-5);
	background: var(--ink);
	color: var(--parchment);
	font-family: var(--font-mono);
	font-size: var(--fs-xs);
	letter-spacing: var(--ls-wide);
	text-transform: uppercase;
	transition: top var(--dur) var(--ease-out);
}

.cp-skip-link:focus {
	top: var(--space-4);
	color: var(--parchment);
}

[hidden] {
	display: none !important;
}

[aria-busy='true'] {
	cursor: progress;
}

/* ------------------------------------------------------------ Раскладка */

.cp-container {
	width: 100%;
	max-width: var(--container);
	margin-inline: auto;
	padding-inline: var(--gutter);
}

.cp-container--narrow {
	max-width: var(--container-narrow);
}

.cp-container--text {
	max-width: var(--container-text);
}

.cp-section {
	padding-block: var(--section-y);
}

.cp-section--sm {
	padding-block: var(--section-y-sm);
}

.cp-section--tint {
	background: var(--paper);
}

.cp-section--deep {
	background: var(--parchment-deep);
}

.cp-section--inverse {
	background: var(--ink);
	color: var(--parchment);
}

.cp-section--inverse h1,
.cp-section--inverse h2,
.cp-section--inverse h3 {
	color: var(--parchment);
}

.cp-section--inverse .cp-eyebrow,
.cp-section--inverse .cp-muted {
	color: rgba(236, 238, 240, 0.6);
}

/* Шапка секции: заголовок слева, ссылка «смотреть все» справа */
.cp-section__head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: var(--space-6);
	margin-bottom: var(--space-10);
	flex-wrap: wrap;
}

.cp-section__title {
	margin: 0;
	font-size: var(--fs-3xl);
}

.cp-section__head p {
	margin: var(--space-2) 0 0;
	color: var(--ink-55);
	max-width: 52ch;
}

.cp-stack > * + * {
	margin-top: var(--space-4);
}

.cp-flow > * + * {
	margin-top: var(--space-8);
}

/* --------------------------------------------------------- Разделители */

.cp-rule {
	height: 1px;
	background: var(--line);
	border: 0;
	margin: 0;
}

/* Тонкий орнаментальный разделитель между editorial-блоками */
.cp-rule--ornament {
	display: flex;
	align-items: center;
	gap: var(--space-4);
	height: auto;
	background: none;
	color: var(--ink-40);
}

.cp-rule--ornament::before,
.cp-rule--ornament::after {
	content: '';
	flex: 1;
	height: 1px;
	background: var(--line);
}

/* ------------------------------------------------- Печать / служебное */

.cp-clamp-1 { -webkit-line-clamp: 1; }
.cp-clamp-2 { -webkit-line-clamp: 2; }
.cp-clamp-3 { -webkit-line-clamp: 3; }

.cp-clamp-1,
.cp-clamp-2,
.cp-clamp-3 {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

@media print {
	.cp-header,
	.cp-footer,
	.cp-drawer,
	.cp-overlay,
	.cp-toast-region {
		display: none !important;
	}
}