/* ПЛЮС КИЛО — конверсионная страница
   Цвета: база plus-kilo.ru + расширение. Типографика/ритм/UX: подход apple.com. Шрифт один — Jost. */

@font-face{font-family:Jost;src:url(/a/jost-400.woff2)format("woff2");font-weight:400;font-display:swap;unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Jost;src:url(/a/jost-lat-400.woff2)format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:Jost;src:url(/a/jost-500.woff2)format("woff2");font-weight:500;font-display:swap;unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Jost;src:url(/a/jost-lat-500.woff2)format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:Jost;src:url(/a/jost-600.woff2)format("woff2");font-weight:600;font-display:swap;unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Jost;src:url(/a/jost-lat-600.woff2)format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:Jost;src:url(/a/jost-700.woff2)format("woff2");font-weight:700;font-display:swap;unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Jost;src:url(/a/jost-lat-700.woff2)format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:Podkova;src:url(/a/podkova-700.woff2)format("woff2");font-weight:700;font-display:swap;unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Podkova;src:url(/a/podkova-lat-700.woff2)format("woff2");font-weight:700;font-display:swap}

:root{
  /* ——— унаследовано с plus-kilo.ru ——— */
  --cream:#fff7f0; --linen:#f9eee6; --peach:#f5d7c4;
  --brown-800:#5a2716; --brown-900:#3d170c; --brown-950:#2e0f07;
  --orange:#e87b35; --orange-dark:#de6d2a;   /* заливка кнопок из фирменного набора */
  --ink:#3b1a10; --muted:#70584f; --line:rgba(74,34,20,.14);
  /* ——— добавлено: ступени светлого и вторая линия ——— */
  --sand:#f3e4d5; --clay:#ead0b8; --peach-soft:#f5c9a5; --peach-lightest:#fceade;
  --studio:#e6e4e1; --studio2:#e9e5e2;   /* подложки студийных кадров: первый экран и «Вместе эффективнее» */
  --green:#2e7d4f; --berry:#c23142; --berry-bright:#ea3c50;   /* второй фирменный цвет */
  --disabled:#cbced4;
  /* ——— рабочие роли, переопределяются по секциям ——— */
  --bg:var(--cream); --fg:var(--ink); --dim:var(--muted);
  --ctrl-bg:rgba(59,26,16,.09); --ctrl-bg-hover:rgba(59,26,16,.16); --ctrl-fg:var(--ink); --dot:rgba(59,26,16,.22);
  --hair:var(--line); --accent:var(--orange);
  --shell:min(1180px, 88vw);
  --gap:clamp(64px,8vw,120px);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:84px}
body{margin:0;font-family:Jost,system-ui,Arial,sans-serif;font-size:17px;line-height:1.47;
  color:var(--ink);background:var(--cream);-webkit-font-smoothing:antialiased}
img,video{max-width:100%;display:block;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
h1,h2,h3,h4,p,ul,ol,figure,dl{margin:0}
ul{padding:0;list-style:none}

/* ——— секции ——— */
.s{background:var(--bg);color:var(--fg);padding:var(--gap) 0}
.s--cream{--bg:var(--cream)}
.s--linen{--bg:var(--linen)}
.s--sand {--bg:var(--sand)}
.s--clay {--bg:var(--clay)}
.s--dark {--bg:var(--brown-950);--fg:var(--cream);--dim:#c9ab9c;--hair:rgba(255,247,240,.16);
  --ctrl-bg:rgba(255,247,240,.16);--ctrl-bg-hover:rgba(255,247,240,.28);--ctrl-fg:var(--cream);--dot:rgba(255,247,240,.32)}
.s--dark2{--bg:var(--brown-900);--fg:var(--cream);--dim:#c9ab9c;--hair:rgba(255,247,240,.16);
  --ctrl-bg:rgba(255,247,240,.16);--ctrl-bg-hover:rgba(255,247,240,.28);--ctrl-fg:var(--cream);--dot:rgba(255,247,240,.32)}
.s--dark3{--bg:var(--brown-800);--fg:var(--cream);--dim:#dcc0b1;--hair:rgba(255,247,240,.2);
  --ctrl-bg:rgba(255,247,240,.16);--ctrl-bg-hover:rgba(255,247,240,.28);--ctrl-fg:var(--cream);--dot:rgba(255,247,240,.32)}
.s--peach{--bg:var(--peach)}
.s--studio{--bg:var(--studio)}
.s--studio2{--bg:var(--studio2)}
.wrap{width:var(--shell);margin-inline:auto}
.narrow{max-width:720px}
.center{margin-inline:0}  /* оставлено для совместимости: центрирование отключено */

/* ——— типографика ——— */
h1,h2,h3{font-size:clamp(28px,3.9vw,52px);font-weight:700;line-height:1.07;letter-spacing:-.012em;text-transform:uppercase}
.lead{font-size:clamp(18px,1.8vw,21px);line-height:1.38;color:var(--dim);font-weight:400}   /* 1,2× текста */
.sub{color:var(--dim)}
.tiny{font-size:14px;line-height:1.43;color:var(--dim);max-width:52ch}
.tiny b{font-weight:600;color:var(--fg)}
.label{font-size:13px;font-weight:600;letter-spacing:-.01em;text-transform:uppercase;color:var(--dim)}
.num{font-variant-numeric:tabular-nums}

/* ——— градиент заголовков (приём с apple.com/macbook-air) ——— */
h1,h2,h3{
  background-image:linear-gradient(90deg,var(--grad-a),var(--grad-b));
  -webkit-background-clip:text;background-clip:text;color:transparent;
  width:fit-content;max-width:100%;padding-bottom:.06em}
:root{--grad-a:var(--brown-950);--grad-b:var(--orange)}
.s--dark,.s--dark2,.s--dark3{--grad-a:#fff7f0;--grad-b:var(--peach)}
@supports not ((-webkit-background-clip:text) or (background-clip:text)){
  h1,h2,h3{background-image:none;color:var(--fg)}
}

/* ——— слово в обводке внутри заголовка ——— */
/* важно: сплошной цвет и text-fill-color, иначе слово наследует прозрачность градиента */
.h-mark{display:inline-block;color:var(--brown-950);-webkit-text-fill-color:var(--brown-950);
  background:none;-webkit-background-clip:border-box;background-clip:border-box;
  border:.06em solid currentColor;border-radius:.22em;
  padding:.02em .2em .08em;margin:0 .04em;line-height:1.02}
.s--dark .h-mark,.s--dark2 .h-mark,.s--dark3 .h-mark{color:var(--cream);-webkit-text-fill-color:var(--cream)}

/* ——— кнопки ——— */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:44px;
  padding:0 22px;border-radius:12px;border:1px solid transparent;font-weight:500;font-size:17px;
  cursor:pointer;transition:background .18s,border-color .18s,color .18s,transform .18s}
.btn:active{transform:scale(.985)}
.btn--go{background:var(--orange);color:#fff}
.btn--go:hover{background:var(--orange-dark)}
.btn svg{width:18px;height:18px;flex:0 0 auto}
.btn--line{border-color:var(--hair);color:var(--fg)}
.btn--line:hover{border-color:currentColor}
.btn--onDark{background:var(--cream);color:var(--brown-950)}
.btn--onDark:hover{background:#fff}
.btn--sm{min-height:36px;padding:0 16px;font-size:14px;border-radius:12px}
.btn--wide{width:100%}
.acts{display:flex;flex-wrap:wrap;gap:12px}
.acts--c{justify-content:flex-start}
.more{display:inline-flex;align-items:center;gap:6px;font-weight:500;color:var(--orange)}
.more::after{content:"›";font-size:1.25em;line-height:0;transition:transform .18s}
.more:hover::after{transform:translateX(3px)}

/* ——— шапка ——— */
.top{display:none;position:fixed;top:0;left:0;right:0;z-index:40;
  background:color-mix(in srgb,var(--cream) 88%,transparent);
  backdrop-filter:saturate(160%) blur(14px);border-bottom:1px solid var(--line);
  transform:translateY(-100%);transition:transform .28s ease}
.top.is-on{transform:none}
.top__in{width:var(--shell);margin-inline:auto;height:62px;display:flex;align-items:center;gap:18px}
.brand{display:flex;align-items:center;gap:11px;margin-right:auto}
.brand img{width:40px}
.brand b{font-size:20px;font-weight:600;letter-spacing:-.01em;line-height:1;white-space:nowrap}
.brand span{display:block;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.top nav{display:flex;gap:22px;font-size:15px;color:var(--muted)}
.top nav a:hover{color:var(--ink)}

/* ——— hero ——— */
.hero{padding:clamp(22px,2.7vw,40px) 0 0;min-height:min(75svh,697px);display:flex;align-items:center;overflow-x:clip}
.hero__text{padding-bottom:calc(var(--gap) * .48)}
.hero__grid{display:grid;grid-template-columns:minmax(min-content,.88fr) minmax(0,1.12fr);gap:clamp(20px,3.2vw,52px);align-items:center}
.logo{display:block}
.logo img{width:clamp(180px,20vw,290px);height:auto}
.hero h1{max-width:22ch;margin-top:clamp(18px,2.4vw,32px);font-size:clamp(26px,3.05vw,40px);line-height:1.08}
.hero__lead{margin:14px 0 0;max-width:48ch}
.hero .acts{margin-top:clamp(18px,2.2vw,26px)}
.hero__mark{position:relative;justify-self:end;align-self:end;max-width:860px;
  width:calc(100% + (100vw - var(--shell)) / 2);
  margin-right:calc((var(--shell) - 100vw) / 2)}   /* кадр доходит до края экрана: +15% ширины */
.hero__mark img{width:100%;height:auto;display:block;max-height:min(76vh,720px);object-fit:cover;object-position:50% 23%}
.hero__mark::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:
    linear-gradient(to right, var(--bg) 0, rgba(230,228,225,0) 14%),
    linear-gradient(to bottom, var(--bg) 0, rgba(230,228,225,0) 12%)}
.facts{display:flex;flex-wrap:wrap;gap:0;margin:clamp(30px,4vw,50px) 0 0;border-top:1px solid var(--hair)}
.facts div{flex:1 1 168px;padding:22px 22px 22px 0;border-bottom:1px solid var(--hair)}
.facts b{display:block;font-size:clamp(26px,3vw,34px);font-weight:700;letter-spacing:-.02em;line-height:1.1}
.facts span{font-size:14px;color:var(--dim)}

/* ——— пульс на главных цифрах ——— */
.pulse{--tint:255,122,0;color:var(--orange);font-weight:600;border-radius:8px;
  padding:0 .12em;margin:0 -.12em;animation:breathe 2.6s ease-in-out infinite}
.pulse--gold{--tint:255,247,240;color:var(--cream)}
@keyframes breathe{0%,100%{background-color:rgba(var(--tint),0)}50%{background-color:rgba(var(--tint),.15)}}
@media (prefers-reduced-motion:reduce){.pulse{animation:none}}

/* ——— список с галочками ——— */
.ticks{display:grid;margin-top:22px;border-top:1px solid var(--hair);max-width:760px}
.ticks li{padding:15px 0;border-bottom:1px solid var(--hair);font-size:clamp(16px,1.35vw,19px);line-height:1.45}
.ticks li:last-child{border-bottom:0}
.ticks--tight li{font-size:17px}
.ticks b{font-weight:700;color:var(--fg);letter-spacing:-.012em}
.hero .ticks li{font-size:clamp(17px,1.5vw,21px);line-height:1.35}
.hero .ticks b{display:block;font-size:1.06em}
.ticks span{color:var(--dim)}

/* ——— продукты ——— */
.prods{display:grid;gap:clamp(18px,2vw,26px);grid-template-columns:repeat(2,1fr);margin-top:clamp(34px,4vw,54px)}
.card{background:#fff;border:1px solid var(--line);border-radius:26px;padding:clamp(24px,2.6vw,38px);
  display:flex;flex-direction:column}
.card__pic{position:relative;aspect-ratio:4/3;margin:-6px 0 22px;overflow:hidden}
/* клейм на фото упаковки: та же плашка, что у кнопок, только зелёная */
.claim{position:absolute;top:0;right:0;z-index:2;max-width:64%;
  background:var(--green);color:#fff;border-radius:12px;padding:7px 12px;
  font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;line-height:1.1}
.card__pic img{width:100%;height:100%;object-fit:contain}
.card h3{margin-bottom:6px;font-size:clamp(21px,2.1vw,28px);line-height:1.14;letter-spacing:-.008em}
.card__kcal{font-size:clamp(30px,3.4vw,40px);font-weight:700;letter-spacing:-.025em;line-height:1.1;margin:16px 0 2px}
.card__kcal small{font-size:.42em;font-weight:400;letter-spacing:0;color:var(--muted)}
.spec{margin:20px 0 26px;border-top:1px solid var(--line)}
.spec li{display:flex;gap:14px;justify-content:space-between;padding:11px 0;border-bottom:1px solid var(--line);font-size:15.5px}
.spec li span:first-child{color:var(--muted);flex:0 0 auto}
.spec li span:last-child{text-align:right}
.card .acts{margin-top:auto;align-items:center}

/* ——— широкая врезка-фото ——— */
.band{margin:0;border-radius:20px;overflow:hidden;line-height:0}
.band img{width:100%;display:block;border-radius:20px}
.band figcaption{line-height:1.4;background:var(--bg)}

/* ——— комплекс ——— */
.caps{text-transform:uppercase;letter-spacing:-.01em}
/* ——— карточка «Вместе эффективнее»: фото фоном, тёмная вуаль, кольцо-бейдж ——— */
.duo{--fg:var(--cream);--dim:#dcc0b1;--grad-a:#fff7f0;--grad-b:var(--peach);
  position:relative;overflow:hidden;border-radius:clamp(20px,2.2vw,32px);
  background:var(--brown-950);color:var(--fg);
  padding:clamp(30px,4.4vw,64px);
  min-height:clamp(420px,44vw,600px);
  display:grid;align-content:center}
.duo__bg{position:absolute;inset:0;z-index:0;width:100%;height:100%;
  object-fit:cover;object-position:50% 22%}
/* вуаль: слева глухая — под текст, справа отпускает модель с упаковками */
.duo__veil{position:absolute;inset:0;z-index:1;
  background:linear-gradient(96deg,rgba(46,15,7,.97) 0%,rgba(46,15,7,.93) 30%,rgba(46,15,7,.7) 56%,rgba(46,15,7,.52) 100%)}
.duo__text{position:relative;z-index:2;display:grid;justify-items:start;
  gap:clamp(14px,1.5vw,20px);max-width:min(100%,49%)}
.duo__text .lead{max-width:36ch}
.duo .offer{gap:10px}
.offer__note{font-size:clamp(14px,1.3vw,16px);font-weight:600;letter-spacing:-.01em;color:var(--peach-soft)}
.duo__eq{display:flex;align-items:baseline;flex-wrap:wrap;gap:.28em;
  font-weight:700;letter-spacing:-.028em;line-height:1;color:var(--cream)}
.duo__eq b{font-size:clamp(28px,3vw,42px);font-variant-numeric:tabular-nums}
.duo__eq i{font-style:normal;font-size:clamp(21px,2.1vw,29px);font-weight:500;color:var(--peach-soft)}
.duo__eq small{font-size:clamp(15px,1.4vw,18px);font-weight:500;letter-spacing:-.01em;color:var(--dim);margin-left:.3em}

/* кольцо стоит в правом верхнем углу — там на кадре чистая стена */
.duo__ring{position:absolute;z-index:2;top:clamp(20px,2.6vw,38px);right:clamp(20px,2.6vw,38px);
  width:clamp(156px,17.5vw,232px);aspect-ratio:1;display:grid;place-items:center}
.duo__ring::before{content:"";position:absolute;inset:-24%;border-radius:50%;
  background:radial-gradient(closest-side,rgba(46,15,7,.86),rgba(46,15,7,.5) 62%,rgba(46,15,7,0))}
.duo__ring svg{position:relative;width:100%;height:100%;display:block}
.duo__ringtext{position:absolute;display:grid;justify-items:center;gap:.1em;text-align:center;padding:0 17%}
.duo__ringtext b{font-size:clamp(38px,4.6vw,62px);font-weight:700;letter-spacing:-.03em;line-height:1;color:var(--cream)}
.duo__ringtext b i{font-style:normal}
.duo__ringtext span{font-size:clamp(12px,1.15vw,15px);line-height:1.2;color:var(--dim)}

.shots{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;
  border-radius:24px}
.shots::-webkit-scrollbar{display:none}
.shots figure{flex:0 0 100%;scroll-snap-align:start;margin:0;border-radius:24px;overflow:hidden;
  border:1px solid var(--hair);position:relative}
.shots img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}
.shots figcaption{position:absolute;left:0;right:0;bottom:0;padding:34px 20px 16px;font-size:15px;
  color:#fff7f0;background:linear-gradient(180deg,rgba(46,15,7,0),rgba(46,15,7,.78))}
.shots--wide figure{flex:0 0 min(58%,660px)}
.s--linen .slider{margin-block:calc(var(--gap) * -.2)}
.offer{display:grid;justify-items:start;gap:clamp(14px,1.4vw,18px);width:100%;margin-top:clamp(6px,1vw,12px)}
.offer__fig{display:flex;align-items:baseline;gap:clamp(10px,1.2vw,16px);flex-wrap:wrap}
.offer__fig b{font-size:clamp(40px,4.8vw,56px);font-weight:700;letter-spacing:-.02em;line-height:1;color:var(--berry-bright)}
.offer__fig span{font-size:clamp(17px,1.7vw,21px);line-height:1.25;font-weight:500;color:var(--fg)}

/* ——— бонусы ——— */
.freeword{display:inline-block;font-size:clamp(30px,3.6vw,46px);font-weight:700;line-height:1;
  letter-spacing:-.02em;text-transform:uppercase;color:var(--cream);background:var(--brown-950);
  border-radius:12px;padding:.38em .58em;margin:0;width:fit-content;max-width:100%}
.freeword.pulse{padding:.38em .58em;margin:0;animation:plate 2.6s ease-in-out infinite}
@keyframes plate{0%,100%{background-color:var(--brown-950)}50%{background-color:var(--brown-800)}}
@media (prefers-reduced-motion:reduce){.freeword.pulse{animation:none;background:var(--brown-950)}}
.freeword+p{margin-top:16px;font-size:clamp(16px,1.5vw,20px);font-weight:400;color:var(--dim);max-width:44ch}

/* ——— калькулятор ——— */
.calc{display:grid;grid-template-columns:1fr .9fr;gap:clamp(26px,3.4vw,56px);align-items:start;
  margin-top:clamp(28px,3.4vw,46px);background:#fff;border:1px solid var(--line);border-radius:26px;
  padding:clamp(24px,3vw,40px)}
.fields{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.f{display:flex;flex-direction:column;gap:7px}
.f span{font-size:14px;color:var(--muted)}
.f input,.f select{height:48px;padding:0 14px;border:1px solid var(--line);border-radius:13px;
  background:var(--cream);font:inherit;color:var(--ink);appearance:none}
.f--full{grid-column:1/-1}
.f input:focus,.f select:focus{outline:2px solid var(--orange);outline-offset:1px;border-color:transparent}
.seg{display:flex;gap:8px}
.seg button{flex:1;height:48px;border:1px solid var(--line);border-radius:13px;background:var(--cream);cursor:pointer}
.seg button[aria-pressed=true]{background:var(--ink);color:var(--cream);border-color:var(--ink)}
.out{background:var(--brown-950);color:var(--cream);border-radius:20px;padding:clamp(24px,2.6vw,32px);
  align-self:stretch;display:flex;flex-direction:column}
.out__big{font-size:clamp(40px,5.4vw,62px);font-weight:700;letter-spacing:-.03em;line-height:1;margin:10px 0 4px}
.out__big span{font-size:.32em;font-weight:400;letter-spacing:0;color:#c9ab9c}
.out .tiny{color:#c9ab9c}
.out__cover{margin-top:auto;padding-top:20px;border-top:1px solid rgba(255,247,240,.16)}

/* ——— видео ——— */
.slider{margin-top:clamp(28px,3.4vw,44px)}
.slider__head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:18px}
.dots{display:flex;gap:7px;align-items:center}
.dots button{width:7px;height:7px;padding:0;border:0;border-radius:50%;cursor:pointer;
  background:var(--dot);transition:background .2s,transform .2s}
.dots button[aria-current="true"]{background:var(--orange);transform:scale(1.35)}
.paddle{display:flex;gap:8px}
.paddle button{width:36px;height:36px;border-radius:50%;border:0;cursor:pointer;
  background:var(--ctrl-bg);color:var(--ctrl-fg);display:grid;place-items:center;
  transition:background .18s,opacity .18s}
.paddle button:hover{background:var(--ctrl-bg-hover)}
.paddle button:disabled{opacity:.35;cursor:default}
.paddle svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.vids{display:flex;gap:clamp(16px,1.8vw,24px);overflow-x:auto;scroll-snap-type:x mandatory;
  scrollbar-width:none;padding-bottom:4px}
.vids::-webkit-scrollbar{display:none}
.vids>*{flex:0 0 min(560px,86%);scroll-snap-align:start}
.vid{border-radius:22px;overflow:hidden;border:1px solid var(--hair);background:#000;position:relative}
.vid video{width:100%;aspect-ratio:16/9;object-fit:cover;background:#000}
.player{position:relative}
.play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:clamp(58px,7vw,76px);
  height:clamp(58px,7vw,76px);border:0;border-radius:50%;background:#e59736;color:#fff;cursor:pointer;
  display:grid;place-items:center;box-shadow:0 10px 28px rgba(0,0,0,.28);transition:transform .18s,background .18s}
.play:hover{background:#d98a2a;transform:translate(-50%,-50%) scale(1.06)}
.play svg{width:36%;height:36%;fill:currentColor}
.player.is-playing .play{display:none}
.vid figcaption{padding:20px 24px 22px;background:var(--brown-800)}
.vid figcaption b{display:block;font-weight:700;font-size:clamp(19px,1.9vw,25px);letter-spacing:-.025em;line-height:1.2}
.vid figcaption .tiny{color:#d6b9a9;margin-top:6px}


/* ——— консультация / клуб ——— */
.split{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(26px,4vw,60px);align-items:center}
.portrait{border-radius:26px;overflow:hidden;border:1px solid var(--hair);max-width:640px}
.portrait img{width:100%;aspect-ratio:3/2;object-fit:cover;object-position:44% center}
.portrait figcaption{padding:16px 20px 18px;background:#fff}
.portrait figcaption b{display:block;font-weight:500;font-size:18px}
.portrait--tall{max-width:420px}
.portrait--tall img{aspect-ratio:3/4;object-position:50% 30%}
.club li{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid var(--hair);font-size:17px}
.club li::before{content:"";flex:0 0 8px;height:8px;margin-top:9px;border-radius:50%;background:var(--orange)}
.locked{display:inline-flex;gap:8px;align-items:center;font-size:14px;color:var(--dim);margin-top:18px}

/* ——— FAQ ——— */
.faq{margin-top:clamp(26px,3vw,42px);border-top:1px solid var(--hair)}
.faq details{border-bottom:1px solid var(--hair)}
.faq summary{cursor:pointer;list-style:none;padding:22px 44px 22px 0;position:relative;
  font-size:clamp(17px,1.7vw,20px);font-weight:500;letter-spacing:-.01em}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:6px;top:50%;width:11px;height:11px;
  border-right:1.6px solid var(--muted);border-bottom:1.6px solid var(--muted);
  transform:translateY(-70%) rotate(45deg);transition:transform .2s}
.faq details[open] summary::after{transform:translateY(-30%) rotate(225deg)}
.faq .a{padding:0 8% 24px 0;color:var(--muted)}
.faq .a p+p{margin-top:12px}

/* ——— комментарии ——— */
.feed{display:grid;gap:16px;margin-top:clamp(24px,2.6vw,36px);max-width:820px}
.feed article{background:#fff;border:1px solid var(--line);border-radius:22px;padding:24px 26px}
.feed h4{font-size:17px;font-weight:500;margin-bottom:10px;letter-spacing:-.01em}
.feed .who{display:flex;align-items:center;gap:9px;margin-bottom:14px;font-size:14px;color:var(--muted)}
.feed .who i{width:28px;height:28px;border-radius:50%;background:var(--peach);display:grid;place-items:center;
  font-style:normal;font-size:13px;color:var(--brown-800);font-weight:500}
.feed .reply{margin-top:14px;padding-top:14px;border-top:1px solid var(--line);font-size:15px;color:var(--muted)}
.feed .reply b{color:var(--ink);font-weight:500}

/* ——— анонс ——— */
.soon{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(26px,4vw,60px);align-items:center}
.soon__pic{display:grid;place-items:center}
.soon__pic img{width:100%;max-width:min(74%,300px);height:auto;filter:drop-shadow(0 26px 40px rgba(0,0,0,.45))}

/* ——— о компании ——— */
.slot{margin-top:clamp(26px,3vw,42px);border:1.5px dashed var(--line);border-radius:24px;
  min-height:250px;display:grid;align-content:center;padding:34px;background:#fff}

/* ——— полоса «купить на Ozon со скидкой» ——— */
.mkt{background:var(--brown-900);color:var(--cream);padding:clamp(22px,2.6vw,30px) 0}
.mkt__in{width:var(--shell);margin-inline:auto;display:flex;align-items:center;justify-content:space-between;
  gap:clamp(16px,2vw,32px);flex-wrap:wrap}
.mkt__txt{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.mkt__off{font-size:clamp(26px,2.6vw,34px);font-weight:700;letter-spacing:-.02em;line-height:1;color:var(--berry-bright)}
.mkt__lbl{font-size:clamp(16px,1.5vw,19px);font-weight:500}
.mkt__acts{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.mkt__badge{display:block;width:150px;height:42px;border-radius:12px;overflow:hidden;background:#fff;
  transition:transform .18s}
.mkt__badge img{width:100%;height:100%;object-fit:contain}
.mkt__badge:hover{transform:translateY(-2px)}

/* ——— всплывающее окно с промокодом ——— */
.promo[hidden]{display:none}
.promo{position:fixed;inset:0;z-index:80;display:grid;place-items:center;padding:20px;
  background:rgba(30,10,4,.62);backdrop-filter:blur(4px)}
.promo__box{background:var(--cream);color:var(--ink);border-radius:20px;padding:clamp(24px,3vw,34px);
  width:min(420px,100%);text-align:left;position:relative}
.promo__box h3{font-size:clamp(22px,2vw,26px);margin-bottom:8px}
.promo__code{display:flex;align-items:center;gap:10px;margin:18px 0 8px}
.promo__code code{flex:1;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:clamp(19px,2vw,23px);
  font-weight:600;letter-spacing:.06em;background:#fff;border:1px dashed var(--line);border-radius:12px;
  padding:14px 16px;text-align:center}
.promo__close{position:absolute;top:12px;right:12px;width:34px;height:34px;border:0;border-radius:50%;
  background:rgba(59,26,16,.08);cursor:pointer;font-size:19px;line-height:1;color:var(--muted)}
.promo__close:hover{background:rgba(59,26,16,.16)}
/* display у .lead__form/.lead__done перебивает атрибут hidden — возвращаем ему силу */
[hidden]{display:none !important}
.lead__form{display:grid;gap:12px;margin-top:18px}
.lead__row{display:grid;gap:6px}
.lead__row span{font-size:13px;font-weight:600;letter-spacing:-.01em;color:var(--muted)}
.lead__row input{width:100%;min-height:46px;padding:0 14px;font:inherit;font-size:17px;color:var(--ink);
  background:#fff;border:1px solid var(--line);border-radius:12px}
.lead__row input:focus-visible{outline:2px solid var(--orange);outline-offset:1px;border-color:transparent}
.lead__row input[aria-invalid="true"]{border-color:var(--berry)}
.lead__done{display:grid;justify-items:start;gap:10px;margin-top:22px;color:var(--green)}
.lead__tick{width:46px;height:46px;flex:none}
.lead__done-h{font-size:clamp(20px,1.9vw,24px);font-weight:700;letter-spacing:-.01em;color:var(--ink)}
.lead__done-t{font-size:17px;line-height:1.4;color:var(--muted)}
.lead__done .btn{margin-top:8px}
.lead__note{min-height:18px;font-size:14px;color:var(--berry)}
.lead__note.is-ok{color:var(--green)}
.promo__done{font-size:14px;color:var(--berry);min-height:18px;margin-top:2px}

@media (max-width:760px){
  .mkt__in{flex-direction:column;align-items:flex-start;gap:16px}
  .mkt__acts{width:100%}
}

/* ——— футер ——— */
.foot{background:var(--brown-950);color:#c9ab9c;padding:56px 0 44px;font-size:15px}
.foot__in{width:var(--shell);margin-inline:auto;display:flex;flex-wrap:wrap;gap:28px;justify-content:space-between}
.foot a:hover{color:var(--cream)}
.foot .brand b,.foot .brand span{color:var(--cream)}

/* ——— низкие окна: логотип уступает место кнопке ——— */
@media (max-height:720px){
  .logo img{width:clamp(150px,18vw,220px)}
  .hero{padding-top:clamp(18px,2vw,30px)}
  .hero h1{margin-top:clamp(16px,2vw,26px)}
}

/* ——— адаптив ——— */
@media (max-width:1000px){
  .calc,.split,.soon,.hero__grid{grid-template-columns:1fr}
  .hero__mark{justify-self:stretch;max-width:none;width:100%;margin-top:8px;margin-right:0}
  }
@media (max-width:760px){
  :root{--shell:88vw;--gap:clamp(52px,11vw,76px)}
  body{font-size:17px}                      /* у Apple основной кегль на телефоне тоже 17 */
  .lead{font-size:19px;line-height:1.4}
  .tiny{font-size:14px}

  /* карточка «Вместе эффективнее»: фото сверху, дальше текст и кольцо */
  .duo{grid-template-columns:1fr;gap:16px;min-height:0;
    padding:calc(clamp(250px,72vw,340px) + 20px) clamp(22px,6vw,32px) clamp(26px,7vw,34px)}
  .duo__bg{height:clamp(250px,72vw,340px);object-position:58% 20%}
  .duo__veil{background:linear-gradient(180deg,rgba(46,15,7,.3) 0%,rgba(46,15,7,.42) 40%,rgba(46,15,7,1) 74%,rgba(46,15,7,1) 100%)}
  .duo__eq{gap:.24em}
  .duo__eq small{flex:0 0 100%;margin:3px 0 0}
  .duo__text{display:contents}
  .duo__text>*{position:relative;z-index:2}   /* display:contents снимает слой с родителя */
  .duo__text h2{order:1}
  .duo__eq{order:2}
  .duo__text .lead{order:3;max-width:none}
  .duo__ring{order:4;position:relative;inset:auto;width:min(62vw,226px);justify-self:start;margin:8px 0 4px}
  .duo__ring::before{display:none}
  .duo__text .offer{order:5;margin-top:2px}

  /* галерея: один кадр на экран, почти во всю высоту */
  .shots{gap:10px;margin-inline:calc((var(--shell) - 100vw) / 2);width:100vw;border-radius:0}
  .shots--wide figure{flex:0 0 100%;border-radius:0}
  .shots img{height:min(69svh,610px);aspect-ratio:auto;object-fit:cover}
  .shots figcaption{font-size:16px;padding:40px 22px 20px}
  /* логотип по центру, затем фото, затем текст */
  .hero__grid{display:flex;flex-direction:column;gap:16px}
  .hero__text{display:contents}
  .logo{order:1;display:flex;justify-content:center}
  .hero__mark{order:2;min-height:min(50svh,470px);overflow:hidden;border-radius:0}
  .hero__mark img{height:min(50svh,470px);object-fit:cover;object-position:50% 42%}
  .hero h1{order:3;margin-top:4px}
  .hero__lead{order:4}
  .hero .ticks{order:5}
  .hero .acts{order:6}
  .prods{grid-template-columns:1fr}
  .top nav{display:none}
  .top__in{height:60px}
  .brand img{width:34px}
  .facts div{flex-basis:50%;padding-right:14px}
  .hero{min-height:auto;padding-top:16px}
  .logo img{width:min(126px,36vw)}   /* ещё −21% */
  .fields{grid-template-columns:1fr}
  .top .btn{width:auto;padding:0 20px;min-height:44px;font-size:16px}
  .acts{flex-direction:row;flex-wrap:wrap;align-items:center;gap:10px}
  .card .acts{flex-direction:row;align-items:center}
  .card .btn{width:auto;flex:1}
  .hero h1{max-width:none}
}
@media (max-width:420px){
  .brand span span{display:none}
  .brand b{font-size:18px}
  .brand img{width:30px}
}
