.vx-open{background:var(--vx-paper)}
.vx-open__in{display:grid;gap:2rem;padding-top:1.6rem;padding-bottom:2.4rem;align-items:start}
.vx-open__art{margin:0;min-width:0;display:flex;justify-content:center;padding:.9rem}
.vx-open__main{margin:0;line-height:0;outline:.1rem solid var(--vx-gold);outline-offset:.8rem}
.vx-open__main img{display:block;width:auto;max-width:100%;height:auto;max-height:38rem}
.vx-open__box{min-width:0;display:grid;gap:1.4rem;justify-items:start}
.vx-open__box .vx-kicker{margin:0}
.banner__text p{font-size:1.8rem;margin:0;color:var(--vx-ink2);max-width:52rem}
.banner__buttons{display:flex;flex-wrap:wrap;gap:1rem;width:100%}
.banner__buttons .button{flex:1 1 auto}
.vx-tabsband{background:var(--vx-paper);padding-bottom:2.4rem}
.vx-tabs{display:grid;grid-template-columns:minmax(0,1fr);margin:0;padding:0;list-style:none;border-top:.2rem solid var(--vx-gold);border-left:.1rem solid var(--vx-line);min-width:0}
.vx-tab{position:relative;display:grid;grid-template-columns:3.4rem 6.4rem minmax(0,1fr);gap:1.2rem;align-items:center;padding:1rem 1.2rem;border-right:.1rem solid var(--vx-line);border-bottom:.1rem solid var(--vx-line);min-width:0}
.vx-tab__no{font-family:var(--font-heading-family);font-weight:600;font-size:3.4rem;line-height:1;color:var(--vx-clay)}
.vx-tab__img{width:6.4rem;height:6.4rem;border-radius:3.2rem 3.2rem 0 0;background:var(--tint);display:flex;align-items:center;justify-content:center;overflow:hidden}
.vx-tab__img img{display:block;max-width:5.6rem;max-height:5.6rem;width:auto;height:auto;mix-blend-mode:multiply}
.vx-tab__body{display:grid;gap:.1rem;min-width:0}
.vx-tab__label{margin:0;font-weight:700;font-size:1.2rem;letter-spacing:.1em;text-transform:uppercase;color:var(--vx-ink2)}
.vx-tab__name{margin:0;font-weight:700;font-size:1.6rem;line-height:1.2}
.vx-tab__name a{text-decoration:none}
.vx-tab__name a:hover{text-decoration:underline;text-underline-offset:.3rem}
.vx-tab__price{margin:0;font-size:1.35rem;color:var(--vx-ink2)}
.vx-tab__price b{color:var(--vx-ink)}
@media screen and (min-width:37.5em){.vx-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media screen and (min-width:37.5em) and (max-width:46.873em){.vx-open__main img{max-height:42rem}}
@media screen and (min-width:46.875em){
 .vx-open__in{grid-template-columns:minmax(0,min(44rem,50%)) minmax(0,1fr);gap:2.4rem 3.2rem;padding-top:2rem}
 .vx-open__main img{max-height:32rem}
 .banner__buttons .button{flex:0 1 auto}
}
@media screen and (min-width:61.875em){
 .vx-open__in{grid-template-columns:minmax(0,min(52rem,50%)) minmax(0,1fr);gap:2.4rem 4.8rem}
 .vx-open__main img{max-height:34rem}
 .vx-tabs{grid-template-columns:repeat(4,minmax(0,1fr))}
 .vx-tab{grid-template-columns:auto 6.4rem minmax(0,1fr);gap:1rem;padding:1.2rem 1rem}
}
@media screen and (min-width:87.5em){.banner__buttons{flex-wrap:nowrap}.banner__buttons .button{white-space:nowrap;padding-inline:1.2rem;flex:0 1 auto;min-width:0}}
@media screen and (min-width:73.75em){.vx-open__in{grid-template-columns:minmax(0,min(60rem,50%)) minmax(0,1fr)}.vx-open__main img{max-height:36rem}}
/* лесенка этапов: номер, слова об этапе и изделия этапа; каждая ступень начинается правее предыдущей */
.vx-stages{display:grid;gap:0;margin:0;padding:0;list-style:none}
.vx-stage{display:grid;gap:1.6rem;padding:2.4rem 0 2.8rem;border-top:.2rem solid var(--vx-gold);min-width:0}
.vx-stage__head{display:grid;gap:.8rem;align-content:start;justify-items:start;min-width:0}
.vx-stage__no{font-family:var(--font-heading-family);font-weight:600;font-size:7.2rem;line-height:.8;color:var(--vx-clay)}
.vx-stage__head h3{font-family:var(--font-heading-family);font-weight:600;text-transform:uppercase;letter-spacing:.02em;font-size:3.2rem;line-height:1}
.vx-stage__head p{margin:0;font-size:1.6rem}
.vx-stage__head .vx-link{min-height:4.4rem;font-size:1.5rem}
@media screen and (min-width:61.875em){
 .vx-stage{grid-template-columns:minmax(0,30rem) minmax(0,1fr);gap:3.2rem;margin-left:calc(var(--i,0)*2.4rem)}
}
@media screen and (min-width:87.5em){.vx-stage{margin-left:calc(var(--i,0)*4.8rem)}}
/* до и после: слова объявления и две полосы пар кадров */
.vx-ba{display:grid;gap:2.8rem;align-items:start}
.vx-ba__text{min-width:0;display:grid;gap:1.6rem;align-content:start}
.vx-ba__text .vx-head{margin-bottom:0}
.vx-ba__figs{min-width:0;display:grid;gap:1.2rem;justify-items:center}
.vx-ba__fig{margin:0;line-height:0}
.vx-ba__fig img{display:block;width:100%;height:auto}
.vx-ba__cap{margin:0;font-size:1.3rem;color:var(--vx-ink2);justify-self:start}
@media screen and (min-width:61.875em){.vx-ba{grid-template-columns:minmax(0,1fr) minmax(0,min(70rem,56%));gap:4.8rem}}
/* остальные линии: панель — сцена на поле линии и слова о линии */
.vx-linecards{--rg:1.6rem}
.vx-linecard{position:relative;display:grid;grid-template-rows:auto 1fr;border:.1rem solid var(--vx-line);background:var(--vx-paper);min-width:0}
.vx-linecard__fig{margin:0;background:var(--tint);display:flex;align-items:center;justify-content:center;overflow:hidden;line-height:0}
.vx-linecard__fig img{display:block;width:auto;height:auto;max-width:min(100%,var(--cap,100%));max-height:36rem}
.vx-linecard__body{display:grid;gap:.8rem;align-content:start;padding:1.8rem 1.6rem 2rem;min-width:0}
.vx-linecard__body h3{font-family:var(--font-heading-family);font-weight:600;text-transform:uppercase;letter-spacing:.02em;font-size:3rem;line-height:1}
.vx-linecard__body h3 a{text-decoration:none}
.vx-linecard h3 a:hover{text-decoration:underline;text-underline-offset:.4rem;text-decoration-thickness:.1rem}
.vx-linecard__body p{margin:0;font-size:1.55rem}
.vx-linecard__names{color:var(--vx-ink2);font-size:1.4rem!important}
.vx-linecard__price b{font-size:1.9rem;margin-right:.6rem}
.vx-linecard__price span{font-size:1.3rem;color:var(--vx-ink2)}
@media screen and (min-width:37.5em) and (max-width:46.873em){.vx-linecard__fig img{max-height:40rem}}
@media screen and (min-width:46.875em){.vx-linecard__fig{aspect-ratio:1}.vx-linecard__fig img{max-height:100%}}
/* ячейки вкусов капель */
.vx-crono{display:grid;grid-template-columns:minmax(0,1fr);gap:0;margin:0;padding:0;list-style:none;border-top:.2rem solid var(--vx-gold)}
.vx-crono>li{display:grid;grid-template-columns:11rem minmax(0,1fr);gap:.4rem 1.4rem;align-content:start;padding:1.4rem;background:var(--tint);min-width:0}
.vx-crono__no{grid-column:2;font-family:var(--font-heading-family);font-weight:600;font-size:3rem;line-height:1;color:var(--vx-clay)}
.vx-crono__img{grid-column:1;grid-row:1 / span 4;width:11rem;display:flex;align-items:center;justify-content:center}
.vx-crono__img img{display:block;max-width:11rem;max-height:15rem;width:auto;height:auto;mix-blend-mode:multiply}
.vx-crono h3{grid-column:2;font-size:1.9rem;font-weight:700;line-height:1.2}
.vx-crono p{grid-column:2;margin:0;font-size:1.45rem}
.vx-crono__price b{font-size:1.7rem;margin-right:.5rem}
.vx-crono__price span{font-size:1.25rem;color:var(--vx-ink2)}
@media screen and (min-width:37.5em){
 .vx-crono{grid-template-columns:repeat(3,minmax(0,1fr))}
 .vx-crono>li{grid-template-columns:minmax(0,1fr);padding:1.6rem 1.4rem}
 .vx-crono__no,.vx-crono h3,.vx-crono p{grid-column:1}
 .vx-crono__img{grid-row:auto;width:100%;height:18rem}
 .vx-crono__img img{max-width:min(100%,18rem);max-height:18rem}
}
@media screen and (min-width:61.875em){.vx-story--flip .vx-story__side{order:-1}}
.vx-cols--faq .vx-head{margin-bottom:0}
@media screen and (min-width:61.875em){.vx-cols--faq:has(>.vx-cols__side:first-child){grid-template-columns:minmax(0,34rem) minmax(0,1fr);gap:5.6rem;align-items:start}.vx-cols--faq:has(>.vx-cols__side:first-child) .vx-qa__item{display:block}.vx-cols--faq:has(>.vx-cols__side:first-child) .vx-qa__item h3{margin-bottom:.8rem}}
/* доска «популярных»: ведущая ячейка во всю ширину (сцена + текст), под ней плитки рядами */
.vx-board{--rg:1.6rem}
@media screen and (max-width:37.498em){.vx-board{--rg:.8rem}.vx-board .vx-card__body{padding:1rem 1rem 1.2rem}.vx-board .vx-card__name{font-size:1.6rem}.vx-board .vx-card__btn{font-size:1.15rem;padding:.6rem .4rem;letter-spacing:.02em}.vx-board .vx-dot{width:1.5rem;height:1.5rem}.vx-board .vx-dots{gap:.3rem}}
@media screen and (max-width:22.498em){.vx-board .vx-card-li{--k:1}}
.vx-board__lead{flex:1 1 100%;display:grid;gap:0;border:.1rem solid var(--vx-ink);background:var(--vx-paper);min-width:0}
.vx-board__leadimg{background:var(--tint);display:flex;align-items:center;justify-content:center;overflow:hidden}
.vx-board__leadimg{aspect-ratio:1;max-height:44rem}
.vx-board__leadimg img{display:block;width:88%;height:88%;object-fit:contain;mix-blend-mode:multiply}
.vx-board__leadbody{display:grid;gap:.9rem;align-content:center;justify-items:start;padding:2rem 1.6rem;min-width:0}
.vx-board__name{font-family:var(--font-body-family);font-weight:700;font-size:clamp(2.6rem,2.6vw,3.6rem);line-height:1.05}
.vx-board__name a{text-decoration:none}
.vx-board__name a:hover{text-decoration:underline;text-underline-offset:.4rem;text-decoration-thickness:.1rem}
.vx-board__fact{margin:0;font-size:1.7rem;color:var(--vx-ink2)}
.vx-board__price{margin:0;font-size:1.5rem}
.vx-board__price b{font-size:2.2rem;margin-right:.6rem}
.vx-board__price span{font-family:var(--vx-mono);font-size:1.3rem;color:var(--vx-ink2)}
@media screen and (min-width:46.875em){.vx-board__lead{grid-template-columns:minmax(0,44rem) minmax(0,1fr)}.vx-board__leadbody{padding:3.2rem}}

/* ---- тема Vyxion: главная ---- */
/* ПЕРВЫЙ ЭКРАН: крупная сцена в тонкой рамке (шаблон 16: кадр во всю полосу в рамке) и кремовая карточка с заголовком,
   заходящая на кадр слева. На телефоне кадр сверху, карточка наезжает на его нижний край. */
.vx-open__in{display:flex;flex-direction:column;gap:0;padding-top:1.2rem;padding-bottom:1.2rem;align-items:stretch}
.vx-open .h0{font-size:clamp(3rem,3.1vw,4.3rem)}
.vx-open__art{order:-1;padding:0;display:block}
.vx-open__main{outline:0;border:.1rem solid var(--vx-ink);border-radius:1.4rem;overflow:hidden;box-shadow:.8rem .8rem 0 var(--vx-mint);margin-right:.8rem}
.vx-open__main img{display:block;width:100%;height:auto;max-height:none}
.vx-open__box{position:relative;z-index:1;margin:-1rem 1.2rem 0;padding:1.8rem 1.6rem 2rem;background:var(--vx-paper);border:.1rem solid var(--vx-ink);border-radius:1.4rem;gap:1.2rem}
.banner__text p{font-size:1.7rem}
@media screen and (min-width:46.875em){
 .vx-open__in{flex-direction:row;align-items:center;padding-top:1rem;padding-bottom:2rem}
 .vx-open__art{order:2;flex:1 1 0;min-width:0}
 /* плашка шире половины: заголовок в три строки, обе кнопки в первом экране 1366 px при шрифте браузера 24 px */
 .vx-open__box{flex:0 0 54%;margin:0 -5rem 0 0;padding:2rem 2.4rem;gap:1rem}
}
@media screen and (min-width:73.75em){.vx-open__box{flex-basis:60rem;margin-right:-9rem;padding:2.4rem 3.2rem}}
/* лента линий под героем */
.vx-tabsband{padding-bottom:1.6rem}
.vx-tabs{border-top:0;border-left:0;gap:1rem}
.vx-tab{grid-template-columns:5.6rem minmax(0,1fr)!important;border:0;border-radius:10rem;background:radial-gradient(circle at center,rgba(255,255,255,.55) 0 .11rem,transparent .13rem) 0 0/1rem 1rem,var(--tint);padding:.6rem 2rem .6rem .6rem!important}
.vx-tab__no{display:none}
.vx-tab__img{width:5.6rem;height:5.6rem;border-radius:50%;background:var(--vx-paper)}
.vx-tab__img img{max-width:4.4rem;max-height:4.4rem}
.vx-tab__name{font-family:var(--font-heading-family);font-weight:600;font-size:1.7rem}
.vx-tabsband .vx-depth{display:none}
/* полки «по задаче» */
.vx-stage{border-top:.1rem solid var(--vx-line);padding:2rem 0 2.2rem;gap:1.2rem}
.vx-stage__no{font-style:italic;font-weight:500;font-size:4.4rem;line-height:.9}
.vx-stage__head h3,.vx-linecard__body h3{text-transform:none;letter-spacing:0;font-size:2.8rem;line-height:1.05}
@media screen and (min-width:61.875em){.vx-stage{margin-left:0;grid-template-columns:minmax(0,28rem) minmax(0,1fr)}}
@media screen and (min-width:87.5em){.vx-stage{margin-left:0}}
.vx-linecard{border-radius:1.4rem;overflow:hidden}
.vx-board__lead{border:.1rem solid var(--vx-ink);border-radius:1.4rem;overflow:hidden}
.vx-board__leadimg{position:relative;background:radial-gradient(circle at center,rgba(255,255,255,.55) 0 .11rem,transparent .13rem) 0 0/1rem 1rem,var(--tint)}
.vx-board__name{font-family:var(--font-heading-family);font-weight:600}
.vx-crono{border-top:0;gap:1.2rem}
.vx-crono>li{border-radius:1.2rem}
.vx-crono__no{font-style:italic;font-weight:500}
.vx-crono__img img{mix-blend-mode:normal;border-radius:.8rem}
@media screen and (min-width:61.875em){.vx-crono{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media screen and (min-width:46.875em){.vx-linecard__fig{aspect-ratio:16/9}}
.vx-story__side--stack .vx-story__fig{max-width:50rem;margin-inline:auto}

/* п.4: герой — см. build.js (кадр 3:2 до 990 px); рамка не выше карточки */
@media screen and (min-width:46.875em) and (max-width:61.873em){.vx-open__box{flex-basis:50%;margin-right:1.6rem;padding:1.8rem 2rem}.vx-open .h0{font-size:2.7rem}.vx-open .banner__text p{font-size:1.5rem}}
/* п.13 (главная, 360 px): пипетка мельче — шагам остаётся ширина строки */
@media screen and (max-width:29.998em){.vx-take{gap:1.2rem}.vx-dropper{gap:.5rem}.vx-dropper__svg{width:4rem;height:16rem}.vx-dropper__marks{padding-top:4.63rem;gap:.6rem;font-size:1.2rem;line-height:1.4rem}.vx-take__steps li{font-size:1.6rem;gap:.9rem}}
/* п.10 (главная): плашка изделия стоит под кадром — колонки «как принимать» одной высоты */
.vx-ba__figs .vx-strip{justify-self:stretch;width:100%}
/* п.15а: стоячий кадр рядом со списком не выше списка */
@media screen and (min-width:46.875em){
 .vx-story__side:has(>.vx-story__fig){grid-template-columns:auto minmax(0,1fr)}
 .vx-story__side>.vx-story__fig{background:none}
 .vx-story__side>.vx-story__fig img{width:auto;height:auto;max-width:min(50rem,46vw);max-height:44rem}
}
/* п.15б: плитка вкуса от 750 px лежачая — флакон слева, слова справа (в стоячей плитке флакон терялся в поле) */
@media screen and (min-width:46.875em){
 .vx-crono--4.vx-rows>li{display:grid;grid-template-columns:10rem minmax(0,1fr);grid-template-rows:auto auto auto 1fr;gap:.6rem 2rem;align-items:start;padding:1.8rem 2rem}
 .vx-crono--4.vx-rows>li>*{grid-column:2}
 .vx-crono--4.vx-rows .vx-crono__img{grid-column:1;grid-row:1 / -1;width:10rem;height:auto;align-self:center}
 .vx-crono--4 .vx-crono__img img{max-width:10rem;max-height:19.6rem}
}
/* п.15в: кадр слева, слова и переход в магазин справа — одинокого кадра посреди полосы нет */
.vx-story--pair{align-items:stretch}
.vx-story--pair>.vx-story__fig{justify-self:center;align-self:start;max-width:50rem;width:100%}
.vx-story__col{min-width:0;display:grid;gap:2rem;align-content:center}
.vx-story__col .vx-story__text p:last-child{margin-bottom:0}
@media screen and (min-width:61.875em){.vx-story--pair:not(.vx-story--nofig){grid-template-columns:minmax(0,min(50rem,44%)) minmax(0,1fr);gap:4.8rem}}
/* 750–989 px: кадр рядом со словами, переход в магазин — полосой под ними (колонка слов с плашкой была вдвое выше кадра) */
@media screen and (min-width:46.875em) and (max-width:61.873em){
 .vx-story--pair:not(.vx-story--nofig){grid-template-columns:minmax(0,46%) minmax(0,1fr);grid-template-areas:"fig text" "box box";gap:2.4rem 3.2rem}
 .vx-story--pair:not(.vx-story--nofig)>.vx-story__col{display:contents}
 .vx-story--pair:not(.vx-story--nofig)>.vx-story__fig{grid-area:fig}
 .vx-story--pair:not(.vx-story--nofig) .vx-story__text{grid-area:text;align-self:center}
 .vx-story--pair:not(.vx-story--nofig) .vx-storebox{grid-area:box}
}