@font-face{font-family:"Yauza";src:url("/fonts/yauza.ttf") format("truetype");font-weight:400;font-display:swap}
:root{
  --bg:#0e1511; --moss:#18261d; --moss2:#233428; --paper:#ece3d0; --paper2:#e0d4ba; --ink:#1d241f;
  --gold:#c9ae74; --gold2:#e1c489; --sage:#7f9486; --line:rgba(201,174,116,.28);
  --display:"Yauza","Georgia",serif; --body:-apple-system,BlinkMacSystemFont,"Segoe UI","Inter",Roboto,"Helvetica Neue",Arial,sans-serif;
  --r:18px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:72px;-webkit-text-size-adjust:100%}
html{overflow-x:hidden}
body{margin:0;background:var(--bg);color:#ece7da;font:400 17px/1.6 var(--body);overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:var(--gold2)}
.wrap{width:min(1120px,100% - 40px);margin-inline:auto}
.wrap--narrow{width:min(820px,100% - 40px)}
.center{text-align:center}

/* типографика */
.display{font:400 clamp(34px,6.2vw,64px)/1.08 var(--display);color:var(--gold2);margin:.2em 0 .35em;text-transform:uppercase;letter-spacing:.02em}
.h2{font:400 clamp(26px,4.2vw,40px)/1.15 var(--display);color:var(--gold2);margin:0 0 .6em;text-transform:uppercase;letter-spacing:.015em}
.h2--center{text-align:center}
.h3{font:400 clamp(22px,3vw,28px)/1.2 var(--display);color:var(--ink);margin:.1em 0 .5em}
.kicker{font:600 12px/1 var(--body);letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin:0 0 14px}
.kicker--center,.sub--center{text-align:center}
.lead{font-size:clamp(18px,2.4vw,22px);line-height:1.5;margin:0 0 14px}
.sub{max-width:640px;margin:0 auto 34px;color:#c9c3b3}
p{margin:0 0 1em}

/* кнопки */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 28px;border-radius:999px;border:1.5px solid var(--gold);background:var(--gold);color:#17120a;font:700 15px/1 var(--body);letter-spacing:.03em;text-decoration:none;cursor:pointer;transition:transform .15s,background .15s,color .15s}
.btn:hover{background:var(--gold2);transform:translateY(-1px)}
.btn:focus-visible,a:focus-visible,button:focus-visible,summary:focus-visible,.shelf:focus-visible{outline:3px solid var(--gold2);outline-offset:3px}
.btn--ghost{background:transparent;color:var(--gold2)}
.btn--ghost:hover{background:rgba(201,174,116,.14);color:var(--gold2)}
.btn--small{min-height:40px;padding:0 18px;font-size:14px}
.btn--big{min-height:58px;padding:0 44px;font-size:17px}

/* шапка */
.top{box-sizing:border-box;max-width:100%;overflow:hidden;position:fixed;inset:0 0 auto 0;z-index:30;display:flex;align-items:center;gap:20px;padding:10px max(16px,calc((100vw - 1120px)/2));background:rgba(14,21,17,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.top__brand{font:400 20px var(--display);color:var(--gold2);text-decoration:none;margin-right:auto;white-space:nowrap}
.top__mark{color:var(--gold)}
.top__nav{display:flex;gap:22px}
.top__nav a{color:#d6d0c0;text-decoration:none;font-size:14px}
.top__nav a:hover{color:var(--gold2)}

/* герой */
.hero{padding:96px 0 56px;background:radial-gradient(120% 90% at 30% 0%,#18261d 0,#0e1511 62%)}
.hero__grid{display:grid;grid-template-columns:1.05fr 1fr;gap:48px;align-items:center}
.hero__frame{margin:0}
.hero__frame img{border-radius:6px;width:100%}
.hero__sub{color:#c9c3b3}
.hero__cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}

/* секции */
.sec{padding:76px 0}
.sec--paper{background:var(--paper);color:var(--ink)}
.sec--paper .h2{color:#3a2d1b}
.sec--moss{background:var(--moss)}
.sec--dark{background:#1c1f1d}

/* урок */
.lesson{display:grid;grid-template-columns:1.1fr 1fr;gap:44px;align-items:center}
.player{position:relative;border-radius:var(--r);overflow:hidden;background:#000;aspect-ratio:16/9;box-shadow:0 18px 40px rgba(40,28,10,.28)}
.player video{width:100%;height:100%;object-fit:cover;display:block}
.player__play{position:absolute;inset:0;margin:auto;width:84px;height:84px;border-radius:50%;border:2px solid #fff;background:rgba(14,21,17,.62);color:#fff;font-size:28px;cursor:pointer;padding-left:6px}
.player.is-playing .player__play{display:none}
.player__alt{font-size:14px;margin:10px 4px 0}
.sec--paper a{color:#6b4c19}
.lesson__text .h2{font-size:clamp(24px,3.4vw,34px);text-transform:none}

/* полка с картинками */
.shelf{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px 2px 18px;scrollbar-width:thin;scrollbar-color:var(--gold) transparent}
.shelf figure{flex:0 0 min(340px,78vw);margin:0;scroll-snap-align:start}
.shelf img{border-radius:14px;width:100%}
.shelf--reviews figure{flex-basis:min(420px,82vw)}
.ctaband{margin-top:34px;text-align:center}
.ctaband__title{font:400 clamp(22px,3.4vw,34px)/1.2 var(--display);color:var(--gold2);max-width:720px;margin:0 auto 6px}
.ctaband__price{margin:0 0 16px;font-size:20px;color:#a7a190}

/* двухколоночный блок */
.split{display:grid;grid-template-columns:.9fr 1.1fr;gap:48px;align-items:center}
.split__img img{border-radius:var(--r)}
.ticks{list-style:none;margin:0;padding:0}
.ticks li{position:relative;padding:8px 0 8px 32px;border-top:1px solid rgba(255,255,255,.08)}
.ticks li::before{content:"";position:absolute;left:4px;top:15px;width:12px;height:12px;background:var(--gold);border-radius:50% 0 50% 0;transform:rotate(-12deg)}

/* спецпредложение */
.offer{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin:36px 0 52px}
.offer__card{background:#141d17;border:1px solid var(--line);border-radius:var(--r);padding:18px 18px 8px}
.offer__card img{border-radius:12px;margin-bottom:16px}
.offer__card p{font-size:15.5px}
.price{max-width:640px;margin:0 auto;text-align:center;background:var(--paper);color:var(--ink);border-radius:24px;padding:38px 28px 32px}
.price__what{font:400 clamp(20px,2.8vw,26px)/1.25 var(--display);margin-bottom:6px}
.price__term{color:#5b564a;margin-bottom:18px}
.price__nums{display:flex;gap:18px;align-items:baseline;justify-content:center;margin-bottom:6px}
.price__nums b{font:400 clamp(44px,7vw,64px)/1 var(--display);color:#3a2d1b}
.price__nums s{font-size:24px;color:#8a8372}
.price__small{color:#5b564a}
.price .btn{margin:6px 0 14px}
.price__note{font-size:14px;color:#5b564a;margin:0}

/* вопросы */
.qa{border-top:1px solid rgba(255,255,255,.14)}
.qa:last-of-type{border-bottom:1px solid rgba(255,255,255,.14)}
.qa summary{list-style:none;cursor:pointer;padding:20px 40px 20px 0;position:relative;font-weight:600;font-size:17px}
.qa summary::-webkit-details-marker{display:none}
.qa summary::after{content:"+";position:absolute;right:6px;top:50%;transform:translateY(-50%);font:300 30px var(--body);color:var(--gold)}
.qa[open] summary::after{content:"–"}
.qa div{padding:0 0 12px;color:#d6d0c0}

/* подвал */
.foot{padding:44px 0 56px;border-top:1px solid var(--line);font-size:14px;color:#aaa595}
.foot__grid{display:grid;grid-template-columns:1fr 1.4fr auto;gap:32px}
.foot p{margin:0 0 6px}
.foot__links{display:grid;gap:8px;align-content:start}
.foot a{color:#d6d0c0}

/* окошко-заглушка */
.soon{border:1px solid var(--gold);border-radius:20px;background:var(--moss);color:#ece7da;padding:26px;max-width:420px}
.soon::backdrop{background:rgba(0,0,0,.6)}
.soon__title{font:400 26px var(--display);color:var(--gold2)}

/* ====== Карусель «Что люди получают в приложении» ====== */
.sec--app{background:linear-gradient(180deg,#0e1511,#142019 40%,#0e1511)}
.app__note{text-align:center;color:#c9c3b3;margin:26px auto 18px;max-width:560px}
.demo{max-width:1040px;margin:0 auto}
.demo__viewport{overflow:hidden;border-radius:26px;border:1px solid var(--line);background:var(--paper);touch-action:pan-y}
.demo__track{display:flex;transition:transform .6s cubic-bezier(.22,.8,.25,1)}
.slide{flex:0 0 100%;display:grid;grid-template-columns:1fr 1fr;min-height:440px;color:var(--ink)}
.slide__body{padding:40px 44px;display:flex;flex-direction:column;justify-content:center}
.slide__body .kicker{color:#7b5c24}
.slide__body p{color:#37352d}
.pain{margin-top:6px;font-weight:600;color:#3a2d1b!important;padding-left:14px;border-left:3px solid var(--gold)}
.scene{position:relative;background:linear-gradient(160deg,#2b4033,#1a2a20);overflow:hidden;display:grid;place-items:center;padding:24px;min-height:300px}
.scene::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 20% 20%,rgba(255,255,255,.05) 0,transparent 40%),repeating-linear-gradient(115deg,rgba(255,255,255,.018) 0 2px,transparent 2px 7px);pointer-events:none}
.chip{display:inline-block;padding:7px 14px;border-radius:999px;background:var(--paper);color:#3a2d1b;font:700 12.5px/1 var(--body);letter-spacing:.02em}
.chip--float{position:absolute;left:18px;bottom:18px}
.ph{display:block;border-radius:6px;background:linear-gradient(135deg,#cdb78f,#9a8159)}
.ph--a{background:linear-gradient(160deg,#d8c7a2 0,#b49b6c 55%,#7c6a48)}
.ph--b{background:linear-gradient(160deg,#c3cbb4 0,#8b9a7c 55%,#566650)}
.ph--c{background:linear-gradient(160deg,#dcc0b0 0,#b88c78 55%,#7a5849)}

.demo__bar{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:18px}
.ctl{min-width:44px;height:44px;border-radius:999px;border:1.5px solid var(--gold);background:transparent;color:var(--gold2);font:400 26px/1 var(--body);cursor:pointer;padding:0 12px}
.ctl:hover{background:rgba(201,174,116,.16)}
.ctl--text{font-size:13px;font-weight:600;padding:0 16px}
.dots{display:flex;gap:2px;flex-wrap:wrap;justify-content:center;max-width:300px}
.dot{width:24px;height:44px;display:grid;place-items:center;background:none;border:0;cursor:pointer;padding:0}
.dot i{width:8px;height:8px;border-radius:50%;background:rgba(201,174,116,.75);transition:.25s}
.dot[aria-current="true"] i{width:22px;border-radius:6px;background:var(--gold2)}
.demo__progress{height:3px;background:rgba(201,174,116,.2);border-radius:3px;margin:8px auto 0;max-width:260px;overflow:hidden}
.demo__progress i{display:block;height:100%;width:0;background:var(--gold)}

/* --- сцены (анимации стартуют, когда слайд активен) --- */
.slide:not(.is-active) .scene *{animation:none!important}
/* древо */
.tree-svg{width:min(360px,100%);height:auto}
.br{fill:none;stroke:#9bb08e;stroke-width:3.2;stroke-linecap:round;stroke-dasharray:200;stroke-dashoffset:200}
.node{transform-box:fill-box;transform-origin:center;opacity:0}
.node circle{fill:var(--paper);stroke:var(--gold);stroke-width:2}
.node text{font:700 8.5px var(--body);fill:#3a2d1b;text-anchor:middle}
.is-active .br{animation:draw 1s ease forwards}
.is-active .b1{animation-delay:.1s}.is-active .b2{animation-delay:.6s}.is-active .b3{animation-delay:.7s}.is-active .b4,.is-active .b5{animation-delay:1.3s}.is-active .b6,.is-active .b7{animation-delay:1.4s}
.is-active .node{animation:pop .5s cubic-bezier(.3,1.5,.5,1) forwards}
.is-active .n0{animation-delay:.1s}.is-active .n1{animation-delay:.9s}.is-active .n2{animation-delay:1s}.is-active .n3{animation-delay:1.7s}.is-active .n4{animation-delay:1.8s}.is-active .n5{animation-delay:1.9s}.is-active .n6{animation-delay:2s}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes pop{from{opacity:0;transform:scale(.2)}to{opacity:1;transform:scale(1)}}
/* ленты */
.feed{width:min(280px,100%);display:grid;gap:12px}
.post{background:var(--paper);border-radius:12px;padding:10px;display:grid;grid-template-columns:54px 1fr;grid-template-rows:auto auto;column-gap:12px;opacity:0;transform:translateY(40px)}
.post .ph{grid-row:1/3;width:54px;height:54px}
.post b{font-size:14px;color:#3a2d1b;align-self:end}.post span{font-size:12px;color:#6a6554}
.is-active .post{animation:rise .6s cubic-bezier(.2,.9,.3,1) forwards}
.is-active .p1{animation-delay:.2s}.is-active .p2{animation-delay:.9s}.is-active .p3{animation-delay:1.6s}
@keyframes rise{to{opacity:1;transform:none}}
/* книга */
.book{position:relative;width:min(340px,100%);aspect-ratio:1.5/1;perspective:1100px}
.page{position:absolute;top:0;width:50%;height:100%;background:var(--paper);border:1px solid #cdbf9f;padding:14px 12px;display:grid;align-content:start;gap:7px}
.pg-l{left:0;border-radius:6px 0 0 6px}.pg-r{left:50%;border-radius:0 6px 6px 0}
.pg-flip{left:50%;transform-origin:left center;border-radius:0 6px 6px 0;backface-visibility:hidden;background:#f1e9d6}
.ln{display:block;height:5px;border-radius:3px;background:#b9ad8d;width:0}
.l1{--w:90%}.l2{--w:70%}.l3{--w:82%}.l4{--w:55%}
.ph--sm{height:44px;width:100%}
.is-active .ln{animation:type .8s ease forwards}
.is-active .l2{animation-delay:.2s}.is-active .l3{animation-delay:.4s}.is-active .l4{animation-delay:.6s}
@keyframes type{to{width:var(--w)}}
.is-active .pg-flip{animation:flip 1.6s 1.4s ease-in-out forwards}
@keyframes flip{0%{transform:rotateY(0)}100%{transform:rotateY(-180deg)}}
/* мемуары */
.chapters{display:grid;gap:9px;width:min(260px,100%)}
.ch{margin:0;display:flex;align-items:center;gap:12px;background:var(--paper);color:#3a2d1b;border-radius:10px;padding:9px 14px;font-weight:700;font-size:14px;opacity:0;transform:translateX(-26px)}
.ch span{width:24px;height:24px;border-radius:50%;background:var(--gold);display:grid;place-items:center;font-size:12px}
.is-active .ch{animation:slidein .5s ease forwards}
.is-active .c1{animation-delay:.1s}.is-active .c2{animation-delay:.4s}.is-active .c3{animation-delay:.7s}.is-active .c4{animation-delay:1s}.is-active .c5{animation-delay:1.3s}.is-active .c6{animation-delay:1.6s}
@keyframes slidein{to{opacity:1;transform:none}}
.heart{position:absolute;right:26px;top:26px;font-size:38px;color:#d99a8d;opacity:0}
.is-active .heart{animation:beat 1.4s 2s ease-in-out infinite}
@keyframes beat{0%{opacity:0;transform:scale(.6)}20%{opacity:1;transform:scale(1.15)}40%{transform:scale(.95)}60%{opacity:1;transform:scale(1.1)}100%{opacity:1;transform:scale(1)}}
/* свадьба */
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;width:min(300px,100%)}
.grid .ph{aspect-ratio:3/4;opacity:0;transform:scale(.8)}
.grid .g1{grid-row:span 2;aspect-ratio:auto}
.is-active .grid .ph{animation:fill .5s ease forwards}
.is-active .g1{animation-delay:.1s}.is-active .g2{animation-delay:.4s}.is-active .g3{animation-delay:.7s}.is-active .g4{animation-delay:1s}.is-active .g5{animation-delay:1.3s}.is-active .g6{animation-delay:1.6s}
@keyframes fill{to{opacity:1;transform:none}}
.cap{position:absolute;bottom:22px;right:22px;margin:0;color:#e5dcc4;font:400 14px var(--display);opacity:.9}
.scene--wedding{padding-bottom:60px}
/* голос */
.scene--voice{align-content:center;gap:16px}
.qcard{background:var(--paper);color:#3a2d1b;border-radius:14px;padding:16px 18px;width:min(300px,100%);transform:rotate(-2deg)}
.qcard small{display:block;color:#7b5c24;font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:10.5px;margin-bottom:6px}
.qcard b{font:400 19px/1.25 var(--display)}
.wave{display:flex;align-items:center;gap:5px;height:56px}
.wave i{width:5px;height:12px;border-radius:3px;background:var(--gold2)}
.is-active .wave i{animation:eq 1s ease-in-out infinite alternate}
.wave i:nth-child(2n){animation-delay:.15s!important}.wave i:nth-child(3n){animation-delay:.3s!important}.wave i:nth-child(5n){animation-delay:.45s!important}
@keyframes eq{to{height:52px}}
.rec{color:#e5dcc4;font-size:13px;display:flex;align-items:center;gap:8px}
.rec em{width:10px;height:10px;border-radius:50%;background:#d9776a}
.is-active .rec em{animation:blink 1s infinite}
@keyframes blink{50%{opacity:.2}}
/* ИИ */
.chat{display:grid;gap:10px;width:min(320px,100%)}
.msg{margin:0;padding:10px 14px;border-radius:16px;font-size:14px;line-height:1.4;max-width:88%;opacity:0;transform:translateY(14px)}
.msg.me{background:#d9cba6;color:#2d2616;justify-self:end;border-bottom-right-radius:4px}
.msg.ai{background:var(--paper);color:#2d2616;justify-self:start;border-bottom-left-radius:4px}
.msg.page{background:var(--gold);color:#241a07;font-weight:700;justify-self:stretch;max-width:100%;text-align:center}
.is-active .msg{animation:rise .5s ease forwards}
.is-active .m1{animation-delay:.2s}.is-active .m2{animation-delay:1.1s}.is-active .m3{animation-delay:2.1s}.is-active .m4{animation-delay:3s}
/* поиск */
.scene--search{align-content:center;gap:14px}
.sbox{background:var(--paper);border-radius:999px;padding:12px 18px;width:min(320px,100%);display:flex;justify-content:space-between;align-items:center;color:#3a2d1b;font-weight:600;font-size:14px}
.sbox .q{display:inline-block;overflow:hidden;white-space:nowrap;width:0}
.is-active .sbox .q{animation:typew 1.4s steps(26) .2s forwards}
@keyframes typew{to{width:21ch}}
.lens{font-style:normal;font-size:22px}
.results{list-style:none;margin:0;padding:0;display:grid;gap:9px;width:min(320px,100%)}
.results li{background:#e9dfc6;border-radius:10px;padding:9px 14px;display:grid;opacity:0;transform:translateY(12px)}
.results b{font-size:13.5px;color:#3a2d1b}.results span{font-size:12px;color:#6a6554}
.is-active .results li{animation:rise .5s ease forwards}
.is-active .r1{animation-delay:1.8s}.is-active .r2{animation-delay:2.2s}.is-active .r3{animation-delay:2.6s}
/* напоминания */
.phone{position:relative;width:200px;height:300px;border-radius:30px;border:6px solid #0e1511;background:linear-gradient(160deg,#3a5143,#22342a);padding:34px 10px 10px;overflow:hidden}
.notch{position:absolute;top:8px;left:50%;width:56px;height:14px;margin-left:-28px;border-radius:8px;background:#0e1511}
.push{background:rgba(236,227,208,.96);color:#2d2616;border-radius:14px;padding:10px 12px;margin-bottom:10px;opacity:0;transform:translateY(-70px)}
.push b{display:block;font-size:11px;color:#7b5c24;margin-bottom:2px}.push span{font-size:12.5px;line-height:1.3;display:block}
.is-active .push{animation:drop .6s cubic-bezier(.2,1.2,.4,1) forwards}
.is-active .pu1{animation-delay:.4s}.is-active .pu2{animation-delay:1.8s}
@keyframes drop{to{opacity:1;transform:none}}
/* синхронизация */
.scene--sync{grid-auto-flow:column;gap:14px;justify-content:center;align-items:center}
.dev{background:var(--paper);border:5px solid #0e1511;padding:10px;display:grid;gap:8px;align-content:start}
.dev--a{width:92px;height:168px;border-radius:18px}.dev--b{width:150px;height:116px;border-radius:12px;grid-template-columns:1fr 1fr}
.mini{display:block;height:34px;border-radius:5px;background:linear-gradient(160deg,#cdb78f,#9a8159)}
.dev--b .mini{height:44px}
.mini--new{opacity:0;background:var(--gold)}
.is-active .mini--new{animation:fill .6s 2s ease forwards}
.link{display:flex;gap:6px}
.link i{width:9px;height:9px;border-radius:50%;background:var(--gold2);opacity:.2}
.is-active .link i{animation:run 1.2s infinite}
.link i:nth-child(2){animation-delay:.2s!important}.link i:nth-child(3){animation-delay:.4s!important}
@keyframes run{50%{opacity:1;transform:scale(1.4)}}

/* уважение к «меньше движения» */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .demo__track{transition:none}
  .br{stroke-dashoffset:0!important;animation:none!important}
  .node,.post,.ch,.msg,.results li,.push,.grid .ph,.mini--new,.heart{opacity:1!important;transform:none!important;animation:none!important}
  .ln{width:var(--w)!important;animation:none!important}
  .sbox .q{width:auto!important;animation:none!important}
  .wave i{animation:none!important;height:26px}
  .pg-flip{display:none}
}

/* ====== телефон ====== */
@media (max-width:860px){
  body{font-size:16.5px}
  .top__nav{display:none}
  .hero{padding:84px 0 40px}
  .hero__grid,.lesson,.split{grid-template-columns:1fr;gap:28px}
  .sec{padding:54px 0}
  .offer{grid-template-columns:1fr}
  .slide{grid-template-columns:1fr;min-height:0}
  .scene{min-height:270px}
  .slide__body{padding:24px 22px 28px}
  .foot__grid{grid-template-columns:1fr}
  .hero__cta .btn{flex:1 1 100%}
  .btn--big{width:100%;padding:0 20px}
}
@media (max-width:420px){
  .top .btn--small{padding:0 14px;font-size:13px}
  .top__brand{font-size:18px}
}

/* картинки нарисованы на чёрном: на тёмно-зелёном фоне чёрное растворяется */
.hero__frame img,.offer__card img,.split__img img,.shelf img{mix-blend-mode:lighten}
.shelf img{border-radius:14px}

/* ---- правки арт-директора ---- */
.demo__viewport{background:var(--moss2);border-color:var(--line)}
.slide__body{background:var(--paper);margin:14px 14px 14px 0;border-radius:14px}
.scene{background:#1d3024}
.scene::before{background:repeating-linear-gradient(115deg,rgba(255,255,255,.025) 0 2px,transparent 2px 8px)}
.pain{border-left-color:#7b5c24}
.book{filter:drop-shadow(0 12px 0 rgba(0,0,0,.25))}
.pg-r{border-left:2px solid #b9ad8d}
.pg-l .l1{height:8px;background:#7b5c24}
.is-active .pg-flip{animation:flip 1.4s 1.2s ease-in-out infinite alternate}
.pg-flip{box-shadow:-6px 0 0 rgba(0,0,0,.12)}
.post .ph.ph--a,.mini:nth-child(1){background:url(/media/lesson1.webp) center/cover}
.post .ph.ph--b,.mini:nth-child(2){background:url(/media/lesson3.webp) center/cover}
.post .ph.ph--c{background:url(/media/lesson5.webp) center/cover}
.mini--new{background:url(/media/lesson4.webp) center/cover;outline:2px solid var(--gold2)}
.link{width:48px;height:2px;background:repeating-linear-gradient(90deg,var(--gold2) 0 6px,transparent 6px 12px);background-size:12px 2px}
.link i{display:none}
.is-active .link{animation:dash 1s linear infinite}
@keyframes dash{to{background-position:12px 0}}
.qcard{width:min(340px,100%)}.qcard b{font-size:22px}
.sbox,.results{width:min(360px,100%)}
.heart{color:var(--sage)}
.is-active .heart{animation:fadein .8s 2s ease forwards}
@keyframes fadein{to{opacity:1}}
.rec em{background:var(--gold2)}
.is-active .rec em{animation-duration:2s}
.sec--app{padding:96px 0}
@media (min-width:861px){.slide{min-height:480px}}
@media (max-width:860px){
  .slide__body{margin:0 12px 12px}
  .sec--app{padding:64px 0}
  .scene{padding:20px 16px}.chip--float{left:12px;bottom:12px}
  .dots{max-width:none;flex-wrap:nowrap;gap:0}.dot{width:20px}
  .h3{font-size:22px}
}
@media (max-width:420px){
  .demo__bar{gap:6px}.ctl--text{padding:0 10px}
  .scene--sync{grid-auto-flow:row}.link{width:2px;height:32px;background:repeating-linear-gradient(180deg,var(--gold2) 0 6px,transparent 6px 12px);background-size:2px 12px}
  @keyframes dash{to{background-position:0 12px}}
}
@media (prefers-reduced-motion:reduce){.pg-flip{display:block;transform:rotateY(-180deg)}.link{animation:none!important}}

/* доступность */
.skip{position:absolute;left:-999px;top:0}.skip:focus{left:12px;top:12px;z-index:50;background:#e1c489;color:#17120a;padding:12px 16px;border-radius:8px}
.sec--paper a:focus-visible,.price a:focus-visible,.price .btn:focus-visible{outline-color:#3a2d1b}
.demo.is-paused :is(.wave i,.rec em,.link,.heart,.pg-flip){animation-play-state:paused!important}
.price__nums s{color:#6b6454}.results span,.post span{color:#5b564a}
.btn--small{min-height:44px}
.top__nav a,.foot__links a,.player__alt a{display:inline-flex;align-items:center;min-height:44px;padding:0 6px}
.qa summary::after{content:"+"/""}.qa[open] summary::after{content:"–"/""}
main:focus{outline:none}

/* ===== золотые переливающиеся кнопки ===== */
.btn{position:relative;overflow:hidden;border-color:#e1c489;background:linear-gradient(110deg,#b38f52 0%,#e1c489 22%,#f6e4b4 38%,#c9ae74 55%,#e8cd93 75%,#b38f52 100%);background-size:260% 100%;animation:goldflow 6s linear infinite;box-shadow:0 6px 0 rgba(0,0,0,.28)}
.btn::after{content:"";position:absolute;top:-10%;bottom:-10%;left:-70%;width:38%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.65),transparent);transform:skewX(-20deg);animation:sheen 4.2s ease-in-out infinite;pointer-events:none}
.btn:hover{background:linear-gradient(110deg,#b38f52 0%,#e1c489 22%,#f6e4b4 38%,#c9ae74 55%,#e8cd93 75%,#b38f52 100%);background-size:260% 100%;transform:translateY(-2px);box-shadow:0 8px 0 rgba(0,0,0,.28)}
.btn--ghost{background:transparent;animation:none;box-shadow:none;color:var(--gold2)}
.btn--ghost:hover{background:rgba(201,174,116,.14);box-shadow:none}
.btn--ghost::after{animation-duration:6s;opacity:.5}
@keyframes goldflow{to{background-position:-260% 0}}
@keyframes sheen{0%,55%{left:-70%}100%{left:130%}}

/* ===== живая рамка героя ===== */
.hero__frame{position:relative;aspect-ratio:1200/766}
.hero__frame .live{position:absolute;inset:0;background:url(/media/hero.webp) 0 0/100% 100%;clip-path:inset(24% 28% 24.5% 29%);transform-origin:57% 64%;animation:roomDrift 16s ease-in-out infinite alternate}
@keyframes roomDrift{0%{transform:scale(1) translate(0,0)}50%{transform:scale(1.07) translate(-1.2%,-.6%)}100%{transform:scale(1.13) translate(.8%,-1.4%)}}
.hero__frame .motes{position:absolute;inset:0;clip-path:inset(24% 28% 24.5% 29%);pointer-events:none}
.motes i{position:absolute;bottom:-4%;width:4px;height:4px;border-radius:50%;background:#f1e3c2;opacity:0;animation:mote 9s linear infinite}
.motes i:nth-child(1){left:34%;animation-delay:0s}.motes i:nth-child(2){left:42%;animation-delay:1.5s;width:3px;height:3px}.motes i:nth-child(3){left:50%;animation-delay:3s}.motes i:nth-child(4){left:58%;animation-delay:4.5s;width:5px;height:5px}.motes i:nth-child(5){left:65%;animation-delay:2.2s}.motes i:nth-child(6){left:72%;animation-delay:6s;width:3px;height:3px}.motes i:nth-child(7){left:38%;animation-delay:7s}.motes i:nth-child(8){left:54%;animation-delay:5.2s;width:3px;height:3px}.motes i:nth-child(9){left:68%;animation-delay:8s}
@keyframes mote{0%{transform:translate(0,0);opacity:0}15%{opacity:.7}80%{opacity:.5}100%{transform:translate(14px,-210px);opacity:0}}
.hero__frame .flame{position:absolute;left:55.6%;top:62%;width:5%;height:7%;border-radius:50%;background:radial-gradient(circle,rgba(255,214,140,.55),transparent 70%);mix-blend-mode:screen;animation:flick 2.4s ease-in-out infinite;pointer-events:none}
@keyframes flick{0%,100%{opacity:.55;transform:scale(1)}25%{opacity:.9;transform:scale(1.12)}50%{opacity:.5;transform:scale(.94)}75%{opacity:.85;transform:scale(1.08)}}

/* ===== появление блоков ===== */
.js .rv{opacity:0;transform:translateY(30px);transition:opacity .9s ease,transform .9s cubic-bezier(.2,.8,.2,1);transition-delay:var(--d,0s)}
.js .rv.in{opacity:1;transform:none}
.js .rv--zoom{transform:translateY(22px) scale(.94)}
.js .rv--paper{opacity:1;transform:none;clip-path:inset(0 0 97% 0);transition:clip-path 1.1s cubic-bezier(.3,.7,.2,1)}
.js .rv--paper.in{clip-path:inset(0 0 0 0)}
.js .rv--paper.hero__frame{clip-path:none}
.js .demo.rv{transform:translateY(50px)}

/* ===== подсказка «листайте» ===== */
.swipe-hint{display:flex;align-items:center;justify-content:center;gap:10px;margin:0 0 6px;color:var(--gold);font:600 12px var(--body);letter-spacing:.18em;text-transform:uppercase}
.swipe-hint i{font-style:normal;font-size:20px;animation:nudgeL 1.4s ease-in-out infinite}
.swipe-hint i:last-child{animation-name:nudgeR}
@keyframes nudgeL{50%{transform:translateX(-7px)}}@keyframes nudgeR{50%{transform:translateX(7px)}}
.sec--paper .swipe-hint{color:#7b5c24}

/* ===== бабочка-проводник ===== */
.fly{position:fixed;left:0;top:0;width:56px;height:44px;z-index:25;pointer-events:none;opacity:0;transition:opacity 1s;will-change:transform;filter:drop-shadow(0 6px 0 rgba(0,0,0,.2))}
.fly.on{opacity:1}
.fly svg{overflow:visible}
.fly__wl,.fly__wr{animation:flapw .32s ease-in-out infinite alternate}
.fly__wl{transform-origin:45px 36px}.fly__wr{transform-origin:45px 36px}
.fly.rest .fly__wl,.fly.rest .fly__wr{animation-duration:1.4s}
@keyframes flapw{from{transform:scaleX(1)}to{transform:scaleX(.28)}}
@media (max-width:700px){.fly{width:38px;height:30px}}
@media (prefers-reduced-motion:reduce){.btn,.btn::after,.live,.motes i,.flame{animation:none!important}.fly{display:none}.js .rv,.js .rv--paper{opacity:1!important;transform:none!important;clip-path:none!important}}

/* ===== разгрузка текста ===== */
.more{margin:0 0 1em}
.more summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;min-height:44px;color:var(--gold2);border-bottom:1px solid var(--line);font-weight:600;font-size:15px}
.more summary::-webkit-details-marker{display:none}
.more summary::after{content:"+";margin-left:8px;font-size:20px}
.more[open] summary{display:none}
.sec--paper .more summary{color:#6b4c19;border-color:#cdbf9f}
.punch{font:400 clamp(20px,2.6vw,26px)/1.3 var(--display);color:#3a2d1b;text-transform:none}
.lesson__text .punch strong{font-weight:400}
.price__help{font-size:14.5px;color:#3a2d1b;background:#e3d8bd;border-radius:12px;padding:12px 16px;margin:0 0 12px}
.soon__help{background:rgba(201,174,116,.12);border:1px solid var(--line);border-radius:12px;padding:12px 14px;font-size:15px}
.soon__btns{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.offer__card p{font-size:16px}

/* вайб уроков */
.vibe{display:grid;grid-template-columns:1.2fr 1fr;gap:44px;align-items:center}
.vibe__video{border-radius:var(--r);overflow:hidden;box-shadow:0 14px 0 rgba(40,28,10,.18);aspect-ratio:720/404;background:#000}
.vibe__video video{width:100%;height:100%;object-fit:cover;display:block}
.sec--paper .kicker{color:#7b5c24}

/* реальные картинки из приложения в карусели */
.scene--shots{padding:20px}
.scene--shots .shot{display:block;border-radius:10px;border:5px solid var(--paper);background:var(--paper);max-width:100%;opacity:0;transform:translateY(40px) rotate(var(--r,0deg))}
.is-active .scene--shots .shot{animation:shotIn .9s cubic-bezier(.2,.9,.3,1) forwards}
.is-active .scene--shots .s2{animation-delay:.45s}
@keyframes shotIn{to{opacity:1;transform:rotate(var(--r,0deg))}}
.scene--treeshots{display:flex;gap:12px;justify-content:center;align-items:center}
.scene--treeshots .shot{width:46%;max-height:300px;object-fit:cover;object-position:top}
.scene--treeshots .s1{--r:-3deg}.scene--treeshots .s2{--r:2.5deg}
.scene--bookshots .shot.wide{width:min(400px,100%);--r:-1.5deg}
.scene--loveshots{display:flex;gap:16px;justify-content:center;align-items:center}
.scene--loveshots .shot{width:42%;max-height:300px;object-fit:cover;object-position:top;--r:-3deg}
.scene--loveshots .chapters{width:46%;gap:6px}.scene--loveshots .ch{padding:7px 10px;font-size:13px}
.scene--wedshots .shot.tall{max-height:310px;width:auto;--r:2deg}
.scene--wedshots{padding-bottom:52px}
@media (max-width:860px){.vibe{grid-template-columns:1fr;gap:24px}.scene--treeshots .shot,.scene--loveshots .shot{max-height:230px}.scene--wedshots .shot.tall{max-height:240px}}
@media (prefers-reduced-motion:reduce){.scene--shots .shot{opacity:1!important;transform:rotate(var(--r,0deg))!important}}

/* читаемость: длинные фразы не декоративным шрифтом */
.lesson__text .h2{font:700 clamp(24px,3.2vw,32px)/1.25 var(--body);letter-spacing:0;color:#2c2216}
.punch{font:600 clamp(19px,2.4vw,23px)/1.4 var(--body);color:#2c2216}
.h3{font:700 clamp(21px,2.6vw,26px)/1.25 var(--body);letter-spacing:0}
.vibe__text .h2{font-size:clamp(26px,4vw,38px)}
/* подпись и ярлык в сцене свадьбы не накладываются */
.scene--wedshots{padding-bottom:96px}
.scene--wedshots .cap{left:0;right:0;bottom:62px;text-align:center}

.price__small{white-space:nowrap;font-size:clamp(13px,3.6vw,16.5px)}
.price__help a,.soon__help a{color:#6b4c19;font-weight:600}.soon__help a{color:var(--gold2)}

/* вайб уроков: подпись-ярлык прямо на видео */
.vibe{display:block;max-width:900px}
.vibe__video{position:relative;margin:0 0 54px;aspect-ratio:auto;overflow:visible;background:none;box-shadow:none;border-radius:0}
.vibe__video video{border-radius:var(--r);box-shadow:0 14px 0 rgba(40,28,10,.18);aspect-ratio:720/404;background:#000}
.vibe__tag{position:absolute;left:-14px;bottom:-40px;max-width:min(420px,88%);background:var(--moss);color:var(--paper);padding:20px 24px 18px;border-radius:6px;transform:rotate(-2deg);box-shadow:0 8px 0 rgba(0,0,0,.2);display:grid;gap:6px}
.vibe__tag::before{content:"";position:absolute;left:50%;top:-12px;width:90px;height:24px;margin-left:-45px;background:rgba(225,196,137,.85);transform:rotate(3deg)}
.vibe__kick{font:600 11px var(--body);letter-spacing:.2em;text-transform:uppercase;color:var(--gold)}
.vibe__tag b{font:400 clamp(24px,4vw,34px)/1.1 var(--display);color:var(--gold2);text-transform:uppercase}
.vibe__tag em{font-style:normal;font-size:15px;color:#d6d0c0}
@media (max-width:860px){.vibe__tag{left:-6px;bottom:-46px;padding:16px 18px}.vibe__video{margin-bottom:64px}}
.app__note{margin-top:48px}
.demo__progress{margin-bottom:6px}

/* === Карточка продажи: пригласительный на бумаге === */
.price{position:relative;max-width:560px;padding:44px 26px 28px;border-radius:6px;background:var(--paper);color:var(--ink);box-shadow:0 0 0 1px #b99a5c inset,0 0 0 8px var(--paper) inset,0 0 0 9px #b99a5c inset;box-shadow:none;outline:1px solid #8a6d33;outline-offset:-10px}
.pc__c{position:absolute;width:26px;height:26px;border:3px solid #8a6d33;pointer-events:none}
.pc__c--tl{top:5px;left:5px;border-right:0;border-bottom:0}.pc__c--tr{top:5px;right:5px;border-left:0;border-bottom:0}
.pc__c--bl{bottom:5px;left:5px;border-right:0;border-top:0}.pc__c--br{bottom:5px;right:5px;border-left:0;border-top:0}
.pc__seal{position:absolute;top:-16px;left:50%;transform:translateX(-50%) rotate(-2deg);margin:0;padding:8px 18px;background:var(--moss);color:var(--gold2);border:1.5px solid var(--gold);font:400 14px/1 var(--display);letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
.pc__kicker{margin:0 0 14px;font:400 clamp(20px,5vw,26px)/1.2 var(--display);color:#2a2418}
.pc__list{list-style:none;margin:0 auto 16px;padding:14px 0;max-width:340px;text-align:left;border-top:1px solid #b99a5c;border-bottom:1px solid #b99a5c;display:grid;gap:10px}
.pc__list li{display:flex;gap:12px;align-items:center;font:500 16px/1.3 var(--body);color:var(--ink)}
.pc__sp{flex:none;width:20px;height:20px;color:#3d5a45}
.price .price__term{margin:0 0 14px;font-size:14px;color:#4d483c}
.price .price__nums{margin-bottom:8px}
.price .price__nums b{font-size:clamp(52px,14vw,72px);color:#2a2012}
.price .price__nums s{color:#5f5848;text-decoration-thickness:2px}
.price .price__small{margin:0 0 16px;color:#4d483c}
.price .btn{margin:0 0 14px}
.price>.price__note{margin:0 0 18px}
.pc__tags{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;text-align:left}
.pc__tag{flex:1 1 200px;border:1px solid #8a6d33;border-radius:4px;background:#e6dcc3}
.pc__tag summary{cursor:pointer;padding:11px 14px;min-height:44px;display:flex;align-items:center;font:600 14px/1.25 var(--body);color:#2a2418;list-style:none}
.pc__tag summary::-webkit-details-marker{display:none}
.pc__tag summary::after{content:"+";margin-left:auto;padding-left:10px;font-size:18px;color:#6b4c19}
.pc__tag[open] summary::after{content:"–"}
.pc__tag p{margin:0;padding:0 14px 12px;font-size:14px;line-height:1.45;color:#3a2d1b;background:none;border-radius:0}
.pc__tag summary:focus-visible{outline:2px solid #3a2d1b;outline-offset:-2px}
@media(max-width:480px){.price{padding:42px 20px 22px}.pc__tag{flex-basis:100%}}
.price .price__nums{flex-wrap:nowrap;white-space:nowrap;gap:12px}
.price .price__nums b{font-size:clamp(44px,13vw,72px)}
.price .price__nums s{font-size:clamp(18px,5vw,24px)}

/* ярлык вайба: под видео, ничего не перекрывает */
.vibe__video{margin-bottom:0}
.vibe__tag{position:relative;left:auto;bottom:auto;max-width:none;margin:22px 0 0;transform:none;text-align:center;justify-items:center;background:transparent;box-shadow:none;padding:0}
.vibe__tag::before{display:none}
.vibe__kick{color:#7b5c24}
.vibe__tag b{color:#3a2d1b}
.vibe__tag em{color:#4a4538}
