/* VALEVAN — основа: скидання, сітка, типографічні ролі верстки (.ey .nv .bt .un), кнопки, поля. */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { margin: 0; font: 400 15px/24px var(--vv-font); color: var(--vv-black); background: var(--vv-white); }
h1, h2, h3, h4, p, ul, ol, figure, blockquote { margin: 0; }
ul, ol { padding: 0; list-style: none; }
img, svg, video { display: block; max-width: 100%; }
img { height: auto; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
input, select, textarea { font: inherit; color: inherit; }
[hidden] { display: none !important; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; margin: -1px; padding: 0; border: 0; }
.screen-reader-text:focus { clip: auto; clip-path: none; width: auto; height: auto; margin: 0; padding: 12px 16px; background: var(--vv-white); z-index: 1000; left: 16px; top: 16px; }
:focus-visible { outline: 1px solid var(--vv-wine); outline-offset: 3px; }
.vv-lock { overflow: hidden; }

/* Сітка: поля 16 → 32 → 48, контент 1344 по центру на широких екранах (фон секцій — на всю ширину). */
.vv-wrap { padding-inline: max(var(--vv-gutter), calc((100% - var(--vv-content)) / 2)); }

/* Ролі верстки */
.vv-eyebrow { font: 500 10px/12px var(--vv-font); letter-spacing: .22em; text-transform: uppercase; }
.vv-nav { font: var(--vv-nav); letter-spacing: .16em; text-transform: uppercase; white-space: nowrap; }
.vv-under { display: inline-block; font: var(--vv-under); letter-spacing: .14em; text-transform: uppercase; padding-bottom: 6px; border-bottom: 1px solid currentColor; }
.vv-text { font: 400 14px/24px var(--vv-font); color: var(--vv-ink-2); }
.vv-meta { font: 400 12px/12px var(--vv-font); letter-spacing: .04em; color: var(--vv-stone); }
@media (min-width: 1024px) {
	.vv-eyebrow { font: var(--vv-eyebrow); letter-spacing: .24em; }
	.vv-under { letter-spacing: .16em; }
}

/* Кнопки */
.vv-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; height: var(--vv-btn-h); padding: 0 32px; font: var(--vv-btn); letter-spacing: .16em; text-transform: uppercase; white-space: nowrap; border: 1px solid transparent; background: var(--vv-wine); color: var(--vv-ivory); transition: background-color .2s var(--vv-ease), color .2s var(--vv-ease), border-color .2s var(--vv-ease); }
.vv-btn:hover { background: var(--vv-wine-press); }
.vv-btn--line { background: transparent; color: var(--vv-wine); border-color: var(--vv-wine); letter-spacing: .14em; }
.vv-btn--line:hover { background: var(--vv-wine); color: var(--vv-ivory); }
.vv-btn--light-line { background: transparent; color: var(--vv-ivory); border-color: var(--vv-ivory); }
.vv-btn--light-line:hover { background: var(--vv-ivory); color: var(--vv-wine); }
.vv-btn--block { display: flex; width: 100%; }
.vv-btn[disabled], .vv-btn.disabled { opacity: .45; cursor: not-allowed; }
@media (min-width: 1024px) { .vv-btn { letter-spacing: .18em; } .vv-btn--line { letter-spacing: .14em; } }

/* Поля: 16 px на мобільному, щоб iPhone не збільшував сторінку */
.vv-input, .vv-select, .vv-textarea { width: 100%; height: var(--vv-field-h); padding: 0 16px; border: 1px solid var(--vv-line); border-radius: 0; background: var(--vv-white); font: 400 16px/20px var(--vv-font); color: var(--vv-black); appearance: none; }
.vv-textarea { height: auto; min-height: 120px; padding: 12px 16px; resize: vertical; }
.vv-input::placeholder, .vv-textarea::placeholder { color: var(--vv-stone-2); }
.vv-input:focus, .vv-select:focus, .vv-textarea:focus { outline: none; border-color: var(--vv-black); }
@media (min-width: 1024px) { .vv-input, .vv-select, .vv-textarea { font-size: 14px; line-height: 24px; } }

/* Хлібні крихти */
.vv-crumbs { display: block; padding-top: 16px; }
.vv-crumbs__line { font: 400 12px/12px var(--vv-font); letter-spacing: .04em; color: var(--vv-stone); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vv-crumbs a:hover { color: var(--vv-black); }
@media (min-width: 1024px) { .vv-crumbs { padding-block: 20px; background: var(--vv-white); } }
@media (min-width: 1024px) { .vv-hide-d { display: none !important; } }
/* Телефон: у верстці фон сторінки — слонова кістка (кадри 01–11), у 12–16 — білий (vv-bg-white). */
@media (max-width: 1023px) { body { background: var(--vv-ivory); } body.vv-bg-white { background: var(--vv-white); } }
@media (max-width: 1023px) { .vv-hide-m { display: none; } .vv-ftr__copy { min-width: 140px; } }

/* Горизонтальні стрічки на телефоні: індикатор прокрутки (theme.js). */
.vv-rail-progress { height: 2px; margin: 16px var(--vv-gutter) 0; background: var(--vv-sand); overflow: hidden; }
.vv-rail-progress span { display: block; width: 50%; height: 2px; background: var(--vv-wine); }
[data-vv-rail] { scrollbar-width: none; }
[data-vv-rail]::-webkit-scrollbar { display: none; }
@media (min-width: 1024px) { .vv-rail-progress { display: none; } }

/* Заголовок з окремими переносами для ПК і телефону (vv_title_lines) */
.vv-tl { display: block; }
@media (max-width: 1023px) { .vv-tl.vv-hide-m { display: none; } }
