:root{
  --bg:#14050d; --bg2:#1d0914; --velvet:#2a0a1b; --wine:#5c1332; --ink:#f6ead6; --muted:#c9b3b8; --faint:#8f7a82;
  --jade:#38d9a9; --jade2:#8ff3d2; --jade3:#169474; --brass:#d9a95b; --rose:#f0a9bd;
  --line:rgba(244,214,170,.2); --glass:rgba(255,255,255,.045);
  --serif:'Oranienbaum','Times New Roman',serif; --sans:'Nunito',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --r:20px; --ease:cubic-bezier(.2,.7,.2,1);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:70px}
body{margin:0;background:var(--bg);color:var(--ink);font:400 16px/1.62 var(--sans);overflow-x:hidden;padding-bottom:84px;
  background-image:radial-gradient(900px 600px at 50% -8%,rgba(92,19,50,.7),transparent 65%),radial-gradient(700px 500px at 100% 40%,rgba(22,148,116,.14),transparent 60%),radial-gradient(700px 500px at 0% 70%,rgba(92,19,50,.35),transparent 60%)}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.08;margin:0}
em{font-style:normal;background:linear-gradient(100deg,var(--rose),var(--brass) 45%,var(--jade2));-webkit-background-clip:text;background-clip:text;color:transparent;background-size:200% 100%;animation:hue 9s ease-in-out infinite}
@keyframes hue{0%,100%{background-position:0 0}50%{background-position:100% 0}}
.skip{position:absolute;left:-999px;top:8px;background:var(--jade);color:#06251c;padding:10px 14px;border-radius:10px;z-index:100}
.skip:focus{left:8px}
:focus-visible{outline:2px solid var(--jade2);outline-offset:3px;border-radius:8px}
.wrap{width:min(1160px,calc(100% - 32px));margin-inline:auto}
.narrow{width:min(760px,calc(100% - 32px))}
.centered{text-align:center}
.sec{position:relative;padding:clamp(56px,9vw,112px) 0}
.sec h2,.final h2{font-size:clamp(2rem,6.2vw,3.5rem);letter-spacing:-.005em;margin-bottom:16px}
.eyebrow{font:800 .7rem/1 var(--sans);letter-spacing:.22em;text-transform:uppercase;color:var(--jade2);margin:0 0 16px}
.sec-lead{color:var(--muted);font-size:clamp(1rem,2.2vw,1.16rem);max-width:620px;margin:0 0 26px}
.centered .sec-lead{margin-inline:auto}
.fine{color:var(--faint);font-size:.86rem;max-width:720px;margin:18px auto 0}
.micro{color:var(--muted);font-size:.86rem;margin:12px 0 0}

/* кнопки */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 24px;border-radius:14px;border:1px solid transparent;font:800 .98rem/1 var(--sans);text-decoration:none;cursor:pointer;overflow:hidden;white-space:nowrap;transition:transform .25s var(--ease),box-shadow .25s,border-color .25s,background .25s;-webkit-tap-highlight-color:transparent}
.btn i{font-style:normal;transition:transform .25s var(--ease)}
.btn:hover i{transform:translateX(4px)}
.btn-jade{color:#05261c;background:linear-gradient(135deg,var(--jade2),var(--jade) 55%,var(--jade3));box-shadow:0 10px 34px rgba(56,217,169,.28),inset 0 1px 0 rgba(255,255,255,.5)}
.btn-jade::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.5) 50%,transparent 65%);transform:translateX(-120%);animation:shine 5.5s 1.2s infinite}
.btn-jade:hover{transform:translateY(-2px);box-shadow:0 14px 44px rgba(56,217,169,.42)}
.btn-line{color:var(--ink);border-color:rgba(244,214,170,.35);background:rgba(255,255,255,.04)}
.btn-line:hover{border-color:var(--brass);background:rgba(217,169,91,.1)}
.btn-sm{min-height:42px;padding:0 18px;font-size:.88rem}
.btn-lg{min-height:58px;padding:0 32px;font-size:1.05rem}
@keyframes shine{0%,60%{transform:translateX(-120%)}100%{transform:translateX(120%)}}

/* шапка */
.site-header{position:fixed;inset:0 0 auto 0;z-index:50;padding:10px 0;border-bottom:1px solid transparent;transition:background .3s,border-color .3s,backdrop-filter .3s}
.site-header.solid{background:rgba(20,5,13,.8);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-color:var(--line)}
.bar{width:min(1160px,calc(100% - 32px));margin:auto;display:flex;align-items:center;justify-content:space-between;gap:12px}
.brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font:400 1.25rem/1 var(--serif);letter-spacing:.03em;color:var(--brass)}
.brand svg{color:var(--brass)}

/* первый экран */
.hero{position:relative;padding:96px 0 56px;min-height:100svh;display:flex;align-items:center;overflow:hidden;isolation:isolate}
.dust{position:absolute;inset:0;z-index:-1;pointer-events:none}
.hero h1{font-size:clamp(2.5rem,11vw,4.6rem);margin-bottom:16px;letter-spacing:-.01em}
.lead{max-width:600px;margin:0 auto 6px;font-size:clamp(1.02rem,2.5vw,1.2rem);color:#e2d2d2}

/* веер карт */
.fan{position:relative;height:236px;margin:22px auto 20px;width:min(100%,430px);perspective:1000px}
.fc{position:absolute;left:50%;top:14px;width:92px;height:138px;margin-left:-46px;color:var(--brass);transform-origin:50% 130%;animation:bob 6s ease-in-out infinite}
.fc>svg,.fc .face>svg{width:100%;height:100%;display:block}
.fc>svg,.fc .back{border-radius:11px;background:linear-gradient(160deg,#4a0f2a,#24081a);box-shadow:0 14px 30px rgba(0,0,0,.55),0 0 0 1px rgba(217,169,91,.25)}
.fc1{transform:translateX(-132px) rotate(-18deg);animation-delay:-1s}
.fc2{transform:translateX(-66px) rotate(-9deg);animation-delay:-2s}
.fc3{width:124px;height:186px;margin-left:-62px;top:0;z-index:3;animation:none}
.fc4{transform:translateX(66px) rotate(9deg);animation-delay:-3s}
.fc5{transform:translateX(132px) rotate(18deg);animation-delay:-4s}
.fc3 .face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:12px}
.fc3.flipper{transform-style:preserve-3d;transition:transform .9s var(--ease)}
.fc3.is-front{transform:rotateY(180deg)}
.fc3 .front{transform:rotateY(180deg);padding:12px 11px;display:flex;flex-direction:column;justify-content:center;gap:7px;text-align:center;background:linear-gradient(165deg,#f6ead6,#e9d3b0);color:#3a0f22;box-shadow:0 16px 40px rgba(0,0,0,.6),0 0 40px rgba(56,217,169,.3)}
.fc3 .front .k{font:400 1.12rem/1 var(--serif);color:#5c1332}
.fc3 .front b{font:700 .72rem/1.3 var(--sans)}
.fc3 .front i{font:800 .6rem/1 var(--sans);font-style:normal;letter-spacing:.14em;text-transform:uppercase;color:#169474}
@keyframes bob{0%,100%{translate:0 0}50%{translate:0 -7px}}
.cta-col{display:grid;justify-items:center}

/* появление */
.js .reveal{opacity:0;transform:translateY(22px);transition:opacity .8s var(--ease),transform .8s var(--ease);transition-delay:calc(var(--i,0)*90ms)}
.js .reveal.in{opacity:1;transform:none}

/* колода */
.counter{margin:0;color:var(--muted);font-weight:700}
.counter b{color:var(--jade2);font:400 1.6rem var(--serif)}
.cards{list-style:none;margin:30px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:12px;perspective:1400px}
.card{all:unset;box-sizing:border-box;display:block;width:100%;aspect-ratio:2/3;cursor:pointer;-webkit-tap-highlight-color:transparent;position:relative}
.card:focus-visible{outline:2px solid var(--jade2);outline-offset:4px;border-radius:14px}
.card .in{position:absolute;inset:0;transform-style:preserve-3d;transition:transform .85s var(--ease)}
.card[aria-pressed=true] .in{transform:rotateY(180deg)}
.card .face{position:absolute;inset:0;border-radius:14px;backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden}
.card .back{color:var(--brass);background:linear-gradient(160deg,#4a0f2a,#24081a);box-shadow:0 14px 34px rgba(0,0,0,.5),0 0 0 1px rgba(217,169,91,.28);display:grid;place-items:center;transition:box-shadow .3s}
.card .back svg{position:absolute;inset:0;width:100%;height:100%}
.card .num{position:relative;font:400 clamp(1.6rem,6vw,2.2rem)/1 var(--serif);color:var(--jade2);text-shadow:0 0 18px rgba(56,217,169,.6)}
.card:hover .back{box-shadow:0 18px 44px rgba(0,0,0,.6),0 0 0 1px var(--brass),0 0 30px rgba(217,169,91,.25)}
.card .front{transform:rotateY(180deg);display:flex;flex-direction:column;justify-content:center;gap:8px;padding:14px 12px;text-align:center;background:linear-gradient(165deg,#f8ecd8,#ead6b4);color:#3a0f22;box-shadow:0 18px 44px rgba(0,0,0,.55),0 0 36px rgba(56,217,169,.22)}
.card .k{font:400 clamp(1.1rem,4.4vw,1.5rem)/1.05 var(--serif);color:#5c1332}
.card .pl{font:800 .6rem/1.2 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:#169474}
.card b{font:600 clamp(.76rem,2.9vw,.9rem)/1.38 var(--sans)}
html:not(.js) .card .in{transform:rotateY(180deg)}
.nudge{margin:26px auto 0;max-width:620px;padding:22px;border-radius:var(--r);border:1px solid rgba(56,217,169,.4);background:linear-gradient(160deg,rgba(56,217,169,.12),rgba(255,255,255,.03));text-align:center;display:grid;gap:14px;justify-items:center;animation:rise .7s var(--ease)}
.nudge[hidden]{display:none}
.nudge p{margin:0;color:#ecdede}
@keyframes rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}

/* чат */
.chat{background:linear-gradient(180deg,transparent,rgba(92,19,50,.3),transparent)}
.two-col{display:grid;gap:36px;align-items:center}
.mini-steps{list-style:none;margin:22px 0 26px;padding:0;display:grid;gap:14px}
.mini-steps li{display:flex;gap:14px;align-items:flex-start}
.mini-steps b{flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--jade);color:var(--jade2);font:400 1.15rem var(--serif)}
.mini-steps span{padding-top:5px;color:#e6d6d6}
.phone{width:min(100%,360px);margin:0 auto;border-radius:34px;padding:14px 12px 10px;background:linear-gradient(180deg,#22101a,#160a12);border:1px solid rgba(244,214,170,.25);box-shadow:0 40px 90px rgba(0,0,0,.6),0 0 60px rgba(56,217,169,.1)}
.phone-top{display:flex;align-items:center;gap:10px;padding:6px 8px 12px;border-bottom:1px solid var(--line)}
.phone-top .av{width:36px;height:36px;border-radius:50%;background:radial-gradient(circle at 35% 30%,var(--jade2),var(--jade3) 60%,#0a3a2d);box-shadow:0 0 16px rgba(56,217,169,.5)}
.phone-top b{display:block;font-size:.92rem;line-height:1.1}
.phone-top small{color:var(--muted);font-size:.74rem}
.msgs{display:flex;flex-direction:column;gap:8px;padding:14px 4px 6px;min-height:430px}
.m{margin:0;padding:10px 13px;border-radius:16px;max-width:86%;font-size:.88rem;line-height:1.4}
.m.bot{align-self:flex-start;background:#2f1624;border-bottom-left-radius:5px;color:#f1e3e3}
.m.me{align-self:flex-end;background:linear-gradient(135deg,var(--jade2),var(--jade));color:#05261c;font-weight:700;border-bottom-right-radius:5px}
.js .m{opacity:0;transform:translateY(10px) scale(.96);transition:opacity .45s var(--ease),transform .45s var(--ease)}
.js .m.show{opacity:1;transform:none}
.js .m[hidden]{display:none}
.frag{display:grid;gap:6px}
.frag b{color:var(--jade2)}
.frag span{color:#e6d3d3}
.frag i{display:block;height:8px;border-radius:4px;background:rgba(255,255,255,.18);filter:blur(1.5px)}
.frag i.s{width:60%}
.file{display:flex;gap:10px;align-items:center}
.file .pdf{flex:none;width:38px;height:44px;border-radius:7px;background:linear-gradient(160deg,#f8ecd8,#d9b98a);color:#5c1332;font:800 .66rem/1 var(--sans);display:grid;place-items:center}
.file b{display:block;font-size:.88rem}
.file small{color:var(--muted)}
.typing{align-self:flex-start;display:flex;gap:4px;padding:12px 14px;background:#2f1624;border-radius:16px;border-bottom-left-radius:5px}
.typing span{width:6px;height:6px;border-radius:50%;background:var(--muted);animation:dot 1s infinite}
.typing span:nth-child(2){animation-delay:.15s}.typing span:nth-child(3){animation-delay:.3s}
@keyframes dot{0%,60%,100%{opacity:.3;transform:none}30%{opacity:1;transform:translateY(-3px)}}
.phone-cap{text-align:center;color:var(--faint);font-size:.74rem;margin:6px 0 0}

/* PDF */
.book{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding:18px 16px 26px;margin:14px -16px 6px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.book::-webkit-scrollbar{display:none}
.leaf{flex:0 0 min(74vw,300px);margin:0;scroll-snap-align:center;transition:transform .5s var(--ease)}
.leaf img{border-radius:6px;border:1px solid rgba(244,214,170,.4);box-shadow:0 26px 60px rgba(0,0,0,.6),0 0 40px rgba(56,217,169,.08);background:#0b0a18}
.leaf figcaption{text-align:center;color:var(--brass);font:800 .72rem var(--sans);letter-spacing:.14em;text-transform:uppercase;margin-top:12px}
.row-cta{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.row-cta .btn{flex:1 1 230px;max-width:340px}

/* бесплатно/платно */
.two{display:grid;gap:14px;margin:24px 0 20px}
.tile{padding:26px 24px;border-radius:var(--r);border:1px solid var(--line);background:var(--glass)}
.tile-hot{background:linear-gradient(160deg,rgba(56,217,169,.13),rgba(92,19,50,.3));border-color:rgba(56,217,169,.4)}
.tag{display:inline-block;font:800 .66rem/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;padding:7px 11px;border-radius:999px;background:rgba(56,217,169,.16);color:var(--jade2);margin-bottom:14px}
.tile-hot .tag{background:rgba(217,169,91,.2);color:var(--brass)}
.tile h3{font-size:1.75rem;margin-bottom:10px}
.tile p{margin:0;color:#e4d4d4}
.trust{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.trust li{font-size:.84rem;color:var(--jade2);border:1px solid rgba(56,217,169,.3);background:rgba(56,217,169,.07);padding:8px 14px;border-radius:999px}

/* FAQ */
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 2px;font:400 1.28rem/1.2 var(--serif);min-height:56px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";flex:none;width:30px;height:30px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;font:400 1.3rem/1 var(--sans);color:var(--jade2);transition:transform .3s var(--ease),background .3s}
.faq details[open] summary::after{transform:rotate(45deg);background:rgba(56,217,169,.14)}
.faq details p{margin:0;padding:0 2px 22px;color:var(--muted);animation:rise .5s both}

/* финал */
.final{position:relative;padding:clamp(80px,12vw,150px) 0;overflow:hidden;isolation:isolate;background:radial-gradient(700px 420px at 50% 100%,rgba(22,148,116,.28),transparent 70%)}
.dust-final{position:absolute;inset:0;z-index:-1}
.final .btn{margin:6px 0 4px}

.site-footer{border-top:1px solid var(--line);padding:32px 0 40px;color:var(--faint);font-size:.82rem}
.f-top{display:flex;flex-wrap:wrap;gap:14px 28px;align-items:center;justify-content:space-between;margin-bottom:16px}
.site-footer p{margin:0;max-width:900px}
.link-btn{background:none;border:1px solid var(--line);color:var(--muted);border-radius:999px;min-height:40px;padding:0 16px;font:700 .8rem var(--sans);cursor:pointer}
.link-btn:hover{color:var(--jade2);border-color:var(--jade)}

.sticky-cta{position:fixed;left:0;right:0;bottom:0;z-index:60;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:linear-gradient(180deg,transparent,rgba(20,5,13,.94) 40%);transform:translateY(110%);transition:transform .45s var(--ease);pointer-events:none}
.sticky-cta.is-visible{transform:none}
.sticky-cta .btn{width:100%;pointer-events:auto}

@media (min-width:700px){
  .cards{grid-template-columns:repeat(4,1fr);gap:16px}
  .two{grid-template-columns:1fr 1fr}
  .fan{height:310px;width:min(100%,640px)}
  .fc{width:128px;height:192px;margin-left:-64px}
  .fc3{width:170px;height:255px;margin-left:-85px}
  .fc1{transform:translateX(-215px) rotate(-18deg)}.fc2{transform:translateX(-108px) rotate(-9deg)}
  .fc4{transform:translateX(108px) rotate(9deg)}.fc5{transform:translateX(215px) rotate(18deg)}
  .fc3 .front{padding:16px 14px;gap:10px}.fc3 .front .k{font-size:1.5rem}.fc3 .front b{font-size:.92rem}.fc3 .front i{font-size:.66rem}
}
@media (min-width:900px){
  body{padding-bottom:0}
  .sticky-cta{display:none}
  .two-col{grid-template-columns:1.05fr .95fr;gap:70px}
  .book{overflow:visible;justify-content:center;gap:0;padding:44px 0 20px;margin:14px 0 6px}
  .leaf{flex:0 1 290px}
  .leaf.l1{transform:rotate(-7deg) translateX(40px) translateY(14px)}
  .leaf.l3{transform:rotate(7deg) translateX(-40px) translateY(14px)}
  .leaf.l2{z-index:2;transform:translateY(-14px) scale(1.06)}
  .book:hover .leaf{transform:none}
  .book:hover .l2{transform:translateY(-8px) scale(1.04)}
}
@media (max-width:380px){.btn-lg{padding:0 16px;font-size:.96rem}.fc1{transform:translateX(-112px) rotate(-18deg)}.fc5{transform:translateX(112px) rotate(18deg)}.fc2{transform:translateX(-56px) rotate(-9deg)}.fc4{transform:translateX(56px) rotate(9deg)}}

.motion-off *,.motion-off *::before,.motion-off *::after{animation:none!important;transition:none!important}
.motion-off .reveal,.motion-off .m{opacity:1!important;transform:none!important}
.motion-off .btn-jade::after{display:none}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}