.hero{padding:56px 0 40px}
.hero .wrap{display:grid;grid-template-columns:7fr 5fr;gap:48px;align-items:center}
.hero h1{font-size:clamp(34px,4.6vw,58px);line-height:1.04;font-weight:800;margin-top:14px}
.hero h1 em{font-style:normal;color:var(--gold-deep)}
.lead{font-size:clamp(17px,1.4vw,19px);color:var(--ink-2);max-width:56ch;margin:22px 0 0}
.lead strong{color:var(--ink);font-weight:600}
.cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.risk{margin:14px 0 0;font-size:14px;color:var(--ink-3)}
.photo{position:relative;aspect-ratio:4/5;border-radius:18px;overflow:hidden;background:var(--paper-2);box-shadow:0 30px 60px -40px rgba(27,29,34,.45);margin:0}
.photo img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s ease}
.photo:hover img{transform:scale(1.02)}
.photo .tag{position:absolute;left:14px;bottom:14px;background:color-mix(in srgb,var(--night) 82%,transparent);color:var(--night-ink);font:500 12px/1 var(--font-body);padding:9px 12px;border-radius:999px;backdrop-filter:blur(6px)}

.nos{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--paper-2)}
.nos .wrap{display:grid;grid-template-columns:repeat(3,1fr)}
.no{padding:26px 28px 26px 0;display:grid;grid-template-columns:22px 1fr;gap:14px;align-items:start}
.no+.no{border-left:1px solid var(--line);padding-left:28px}
.no svg{margin-top:3px}
.no b{font-family:var(--font-display);font-weight:700;display:block;margin-bottom:3px}
.no span{color:var(--ink-2);font-size:15px}

.nums{padding:64px 0 24px}
.nums .grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.num{padding-right:24px}
.num+.num{border-left:1px solid var(--line);padding-left:24px}
.num .v{font:800 clamp(40px,4.5vw,56px)/1 var(--font-display);letter-spacing:-.03em}
.num .v i{font-style:normal;color:var(--gold)}
.num .l{margin-top:10px;color:var(--ink-2);font-size:15px}
.claim{margin:44px 0 0;padding:32px 0 0;border-top:1px solid var(--line);display:grid;grid-template-columns:7fr 5fr;gap:40px;align-items:start}
.claim h2{font-size:clamp(22px,2.4vw,30px);font-weight:700;line-height:1.25}
.claim p{color:var(--ink-2);font-size:15.5px}
.claim p b{color:var(--ink);font-weight:600}

.dark{background:var(--night);color:var(--night-ink);margin-top:64px;padding:72px 0}
.dark .wrap{display:grid;grid-template-columns:5fr 7fr;gap:48px;align-items:start}
.dark h2{font-size:clamp(30px,3.6vw,44px);font-weight:800;line-height:1.08;margin-top:14px}
.dark h2 span{color:var(--gold)}
.dark .eyebrow{color:var(--gold)}
.dark p{color:var(--night-muted);margin:0 0 16px;font-size:17px;max-width:60ch}
.dark p.big{color:var(--night-ink);font-family:var(--font-display);font-weight:600;font-size:20px;margin-top:24px}
.dark .rule{width:56px;height:3px;background:var(--gold);margin:20px 0 0}

.plans{padding:80px 0 40px}
.plans h2{font-size:clamp(30px,3.6vw,44px);font-weight:800;line-height:1.08;margin-top:14px}
.plans .sub{color:var(--ink-2);margin:14px 0 0;max-width:60ch}
.toggle{display:inline-flex;align-items:center;gap:6px;background:var(--paper-2);border:1px solid var(--line);border-radius:999px;padding:4px;margin:-4px 0 -6px;align-self:start;max-width:100%;flex-wrap:wrap}
.toggle button{border:0;background:transparent;font:600 13px/1 var(--font-display);padding:9px 14px;border-radius:999px;color:var(--ink-2);cursor:pointer;transition:background var(--t),color var(--t)}
.toggle button.on{background:var(--ink);color:var(--paper)}
.toggle .gift{font:600 12px/1 var(--font-display);color:var(--gold-deep);padding:0 12px 0 4px;transition:opacity var(--t)}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:32px;align-items:start}
.card{position:relative;background:var(--white);border:1.5px solid var(--line);border-radius:var(--r);padding:28px 26px 26px;display:flex;flex-direction:column;gap:18px;transition:transform var(--t),box-shadow var(--t),border-color var(--t)}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-card);border-color:var(--line-2)}
.card.rec{border-color:var(--gold);box-shadow:0 20px 44px -30px rgba(201,162,39,.55);padding-bottom:52px}
.card.rec:hover{border-color:var(--gold-deep)}
.card .who{font:700 20px/1.2 var(--font-display)}
.card .for{color:var(--ink-2);font-size:15px;margin:-6px 0 0}
.price{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;padding-top:6px;border-top:1px solid var(--line)}
.price .p{font:800 40px/1 var(--font-display);letter-spacing:-.03em}
.price .u{color:var(--ink-2);font-size:15px}
.price .note{flex-basis:100%;color:var(--ink-3);font-size:13px;margin-top:2px}
.badge{position:absolute;top:-13px;right:26px;background:var(--ink);color:var(--paper);font:700 12px/1 var(--font-display);letter-spacing:.04em;padding:8px 12px;border-radius:999px}
.list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;font-size:15px}
.list li{display:grid;grid-template-columns:18px 1fr;gap:10px;align-items:start}
.list li.off{color:var(--ink-3)}
.list li svg{margin-top:3px}
.list li.first{font-weight:600}
.list .sep{height:1px;background:var(--line);margin:4px 0}
.card .btn{margin-top:auto;width:100%}
.under{font-size:13px;color:var(--ink-3);text-align:center;margin:-8px 0 0}
.ribbon{position:absolute;left:0;right:0;bottom:0;background:var(--gold);color:var(--ink);font:700 12px/1 var(--font-display);letter-spacing:.06em;text-align:center;padding:9px;border-radius:0 0 12px 12px;text-transform:uppercase}
.scarce{margin:36px 0 0;padding:22px 26px;border:1px dashed var(--line);border-radius:var(--r);color:var(--ink-2);font-size:15px;background:var(--paper-2)}
.scarce b{color:var(--ink);font-weight:600}
.free{margin:40px 0 0;text-align:center}
.free p{color:var(--ink-2);margin:0 0 14px}

@media (max-width:900px){
  .hero{padding:32px 0 24px}
  .hero .wrap{grid-template-columns:1fr;gap:26px}
  .hero h1{font-size:clamp(32px,9vw,42px)}
  .photo{max-width:420px}
  .cta .btn{flex:1 1 100%}
  .nos .wrap{grid-template-columns:1fr}
  .no{padding:18px 0}
  .no+.no{border-left:0;padding-left:0;border-top:1px solid var(--line)}
  .nums .grid{grid-template-columns:1fr 1fr;gap:20px 16px}
  .num+.num{border-left:0;padding-left:0}
  .num:nth-child(even){border-left:1px solid var(--line);padding-left:16px}
  .claim{grid-template-columns:1fr;gap:16px}
  .dark .wrap{grid-template-columns:1fr;gap:24px}
  .cards{grid-template-columns:1fr}
  .card.rec{order:-1}
}


/* найдите себя */
.find{padding:72px 0 0}
.find h2,.day h2,.port h2,.income h2,.cases h2,.upper h2,.alt h2,.faqh h2,.feed h2{font-size:clamp(28px,3.4vw,42px);font-weight:800;line-height:1.08;margin-top:14px}
.fgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:28px}
.fcard{display:block;background:var(--white);border:1.5px solid var(--line);border-radius:var(--r);padding:24px 26px;transition:transform var(--t),border-color var(--t),box-shadow var(--t)}
.fcard:hover{transform:translateY(-3px);border-color:var(--gold);box-shadow:var(--shadow-card)}
.fcard b{display:block;font:700 19px/1.3 var(--font-display);margin-bottom:8px}
.fcard span{color:var(--ink-2);font-size:15px}

/* день */
.day{padding:80px 0 0}
.day .wrap{display:grid;grid-template-columns:7fr 5fr;gap:48px;align-items:start}
.dtext p{margin:16px 0 0;color:var(--ink-2);max-width:62ch}
.dtext p b{color:var(--ink);font-weight:600}
/* На широком экране три фото в одну колонку уезжали ниже текста, и последнее висело в пустоте.
   Раскладка та же, что на телефоне: большой кадр сверху, два поменьше рядом (Дима 20.09). */
.dphotos{display:grid;gap:14px 12px;grid-template-columns:1fr 1fr;position:sticky;top:90px}
.dphotos figure:first-child{grid-column:1/-1}
.dphotos figure{margin:0}
.ph{aspect-ratio:4/3;border-radius:14px;background:linear-gradient(135deg,var(--paper-2),#E8E2D4);border:1px dashed var(--line-2)}
img.ph{width:100%;height:auto;aspect-ratio:auto;border:none;background:none;display:block}
.dphotos figcaption{font-size:12.5px;color:var(--ink-3);margin-top:6px}

/* портфель */
.port{padding:80px 0 0}
.pgrid{display:grid;grid-template-columns:5fr 7fr;gap:40px;align-items:start;margin-top:24px}
.ptabs{display:flex;gap:8px;margin:0 0 16px}
.ptabs button{font:600 14px/1 inherit;padding:9px 16px;border-radius:999px;border:1.5px solid var(--line);background:var(--white);color:var(--ink-2);cursor:pointer}
.ptabs button.on{background:var(--night);border-color:var(--night);color:var(--night-ink)}
.ptabs button:hover{border-color:var(--gold)}
.ptext p{color:var(--ink-2);margin:0 0 14px}
.ptext p b{color:var(--ink);font-weight:600}
.pchart{background:var(--white);border:1.5px solid var(--line);border-radius:var(--r);padding:18px 18px 12px}
.pcap,.pfoot{display:flex;justify-content:space-between;font-size:13px;color:var(--ink-3);padding:0 4px}
@media (max-width:560px){.pfoot{display:grid;gap:3px;font-size:12px;line-height:1.35}.pcap{font-size:12.5px}}
.pcap span:last-child{font:700 15px/1 var(--font-display);color:var(--ink)}
.pchart svg{width:100%;height:230px;display:block;margin:8px 0;cursor:crosshair;outline:none;touch-action:pan-y}
.pchart svg:focus-visible{box-shadow:0 0 0 3px var(--gold-soft);border-radius:10px}
@media (min-width:760px){.pchart svg{height:280px}}

/* доход */
.income{padding:80px 0 0}
.igrid{display:grid;grid-template-columns:1fr 1fr;gap:0 40px;margin-top:20px}
.ilead{grid-column:1/-1;color:var(--ink-2);margin-bottom:10px}
.icol p{margin:14px 0 0;color:var(--ink-2)}
.icol p b{color:var(--ink);font-weight:600}

/* кейсы */
.cases{padding:80px 0 0}
.cgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:28px}
.case{background:var(--white);border:1.5px solid var(--line);border-radius:var(--r);padding:24px 26px;transition:transform var(--t),border-color var(--t),box-shadow var(--t)}
.case:hover{transform:translateY(-3px);border-color:var(--gold);box-shadow:var(--shadow-card)}
.case h3{font-size:19px;font-weight:700;line-height:1.3}
.case p{margin-top:10px;color:var(--ink-2);font-size:15px}
.cnote{margin-top:18px;max-width:70ch}

/* верхний слой */
.upper{background:var(--paper-2);margin-top:80px;padding:64px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.ulist{list-style:none;margin:24px 0 0;padding:0;display:grid;gap:14px;max-width:760px}
.ulist li{padding:16px 0 16px 22px;border-left:3px solid var(--gold);color:var(--ink);font-size:16.5px}
.unote{margin-top:24px;color:var(--ink-2);max-width:70ch}
.unote a{color:var(--gold-deep);font-weight:600;border-bottom:1px solid var(--gold)}

/* альтернативы */
.alt{padding:80px 0 0}
.agrid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:28px}
.aitem{border:1.5px solid var(--line);border-radius:var(--r);padding:22px;background:var(--white)}
.aitem b{font:700 17px/1.3 var(--font-display);display:block;margin-bottom:8px}
.aitem p{color:var(--ink-2);font-size:14.5px}
.aitem.worst{background:var(--night);color:var(--night-ink);border-color:var(--night)}
.aitem.worst b{color:var(--gold)}
.aitem.worst p{color:var(--night-muted)}

/* гарантия */
.guar{padding:64px 0 0}
.gbox{display:grid;grid-template-columns:5fr 7fr;gap:40px;background:var(--gold-soft);border:1.5px solid var(--gold);border-radius:var(--r);padding:34px 36px}
.gbox h2{font-size:clamp(24px,2.8vw,34px);font-weight:800;line-height:1.1;margin-top:10px}
.gbox p{color:var(--ink-2);margin:0 0 12px}

/* вопросы */
.faqh{padding:80px 0 0}
.fsub{color:var(--ink-2);margin:14px 0 0;max-width:66ch}
.faq{max-width:820px;margin-top:10px}
.faq details{border-bottom:1px solid var(--line);padding:16px 0}
.faq summary{cursor:pointer;font:600 17px/1.35 var(--font-display);list-style:none;display:flex;justify-content:space-between;gap:16px}
.faq summary::after{content:"+";color:var(--gold-deep);font-weight:700}
.faq details[open] summary::after{content:"−"}
.faq details p{color:var(--ink-2);margin-top:10px;font-size:15.5px;max-width:74ch}

/* лента */
.feed{padding:80px 0 0}
.flist{list-style:none;margin:20px 0 14px;padding:0;max-width:700px}
.flist li{display:grid;grid-template-columns:130px 1fr;gap:16px;padding:12px 0;border-bottom:1px solid var(--line)}
.flist time{color:var(--gold-deep);font:600 14px/1.5 var(--font-display)}

/* финал */
.final{background:var(--night);color:var(--night-ink);margin-top:80px;padding:72px 0}
.final .wrap{text-align:center;max-width:720px}
.final h2{font-size:clamp(28px,3.6vw,44px);font-weight:800;line-height:1.08}
.final p{color:var(--night-muted);margin:16px 0 24px}
.final .small{color:var(--night-muted);margin:14px 0 0}

@media (max-width:900px){
  .fgrid,.cgrid,.igrid{grid-template-columns:1fr}
  .day .wrap{grid-template-columns:1fr;gap:24px}
  .dphotos{position:static;grid-template-columns:1fr 1fr}
  .dphotos figure:first-child{grid-column:1/-1}
  .pgrid{grid-template-columns:1fr}
  .agrid{grid-template-columns:1fr 1fr}
  .gbox{grid-template-columns:1fr;padding:24px}
  .flist li{grid-template-columns:100px 1fr}
}


/* квиз */
.quiz{padding:80px 0 0}
.quiz .wrap{display:grid;grid-template-columns:5fr 7fr;gap:48px;align-items:start}
.qintro h2{font-size:clamp(28px,3.4vw,42px);font-weight:800;line-height:1.08;margin-top:14px}
.qintro p{color:var(--ink-2);margin-top:16px;max-width:52ch}
.qintro p b{color:var(--ink);font-weight:600}
.qcard{background:var(--white);border:1.5px solid var(--line);border-radius:var(--r);padding:26px 28px 22px;box-shadow:var(--shadow-card);position:relative;min-height:420px}
.qbar{height:4px;background:var(--paper-2);border-radius:99px;overflow:hidden}
.qbar i{display:block;height:100%;width:0;background:var(--gold);transition:width var(--t)}
.qstep{font:600 12px/1 var(--font-display);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);margin:16px 0 10px}
.qq{border:0;padding:0;margin:0;display:grid;gap:10px}
.qq legend{font:700 clamp(19px,1.8vw,23px)/1.3 var(--font-display);margin-bottom:14px;padding:0}
.qa{text-align:left;background:var(--paper);border:1.5px solid var(--line);border-radius:var(--r-sm);padding:14px 16px;font:500 15.5px/1.4 var(--font-body);color:var(--ink);cursor:pointer;transition:border-color var(--t),transform var(--t),background var(--t)}
.qa:hover{border-color:var(--gold);background:var(--white);transform:translateX(3px)}
.qback{position:absolute;right:22px;top:20px;background:none;border:0;color:var(--ink-3);font:500 13px/1 var(--font-body);cursor:pointer;padding:6px}
.qback:hover{color:var(--ink)}
.qcontact{display:grid;gap:14px}
.qpre{background:var(--paper-2);border-radius:14px;padding:16px 18px}
.qpre h3{font:800 24px/1.2 var(--font-display);margin:6px 0 8px}
.qpre p{margin:0;color:var(--ink-2);font-size:15px}
.qtg{text-align:center}
.qtg-note{margin:-6px 0 0;text-align:center}
.qor{display:flex;align-items:center;gap:12px;color:var(--ink-3);font-size:13px;margin:4px 0}
.qor::before,.qor::after{content:"";flex:1;height:1px;background:var(--line)}
.qcontact legend{font:700 22px/1.3 var(--font-display);padding:0;margin-bottom:4px}
.qcontact label{display:grid;gap:6px;font-size:14px;color:var(--ink-2)}
.qcontact .opt{color:var(--ink-3);font-size:12.5px}
.qcontact input:not([type=checkbox]){font:500 16px/1.2 var(--font-body);padding:13px 14px;border:1.5px solid var(--line);border-radius:var(--r-sm);background:var(--paper);color:var(--ink);width:100%}
.qcontact input:focus{border-color:var(--gold);outline:0}
.qcontact .chk{display:grid;grid-template-columns:20px 1fr;gap:10px;align-items:start;font-size:13.5px}
.qcontact .chk input{width:18px;height:18px;margin-top:2px;accent-color:var(--gold)}
.qcontact .chk a{color:var(--gold-deep);border-bottom:1px solid var(--gold-soft)}
.qerr{color:#8E2F2F;font-size:14px;background:#FBEDED;border-radius:10px;padding:10px 12px}
.qresult h3{font-size:clamp(24px,2.6vw,32px);font-weight:800;line-height:1.1;margin:10px 0 14px}
.qresult p{color:var(--ink-2);margin:0 0 12px;font-size:15.5px}
.qresult .rdream{color:var(--ink);font-weight:500}
.qresult .rnext{color:var(--ink);font-weight:600;font-family:var(--font-display)}
.ract{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0 14px}
.rwhy{border-top:1px solid var(--line);padding-top:12px}
@media (max-width:900px){.quiz .wrap{grid-template-columns:1fr;gap:24px}.qcard{padding:20px 18px 18px;min-height:0}}

.pstruct{margin-top:14px;border-top:1px solid var(--line);padding-top:12px;display:grid;gap:8px}
.pst{display:grid;grid-template-columns:1fr;gap:4px;font-size:13px;color:var(--ink-2)}
.pst span{display:block;height:10px;border-radius:99px;background:var(--gold);position:relative;max-width:100%}
.pst:nth-child(2) span{background:var(--ink)}
.pst span b{display:none}
.pst em{font-style:normal}
.pst:first-child span{width:80%}.pst:nth-child(2) span{width:20%}

.fmore{margin-top:18px;color:var(--ink-2);font-size:15px}
.fmore a{color:var(--gold-deep);border-bottom:1px solid var(--gold-soft)}
.vpage{padding-top:56px}
.vpage h1{font-size:clamp(28px,3.4vw,42px);font-weight:800;line-height:1.08;margin-top:14px;max-width:26ch}

/* анкета на разбор */
.razbor{padding:56px 0 40px}
.razbor .wrap{display:grid;grid-template-columns:5fr 7fr;gap:48px;align-items:start}
.rintro h1{font-size:clamp(28px,3.4vw,42px);font-weight:800;line-height:1.08;margin-top:14px}
.rintro p{color:var(--ink-2);margin-top:16px;max-width:52ch}.rintro p b{color:var(--ink);font-weight:600}
.rform{background:var(--white);border:1.5px solid var(--line);border-radius:var(--r);padding:26px 28px;display:grid;gap:18px;box-shadow:var(--shadow-card)}
.rq{display:grid;gap:8px}.rq span{font:600 15.5px/1.4 var(--font-display)}
.rq textarea,.rq select,.rcontact input{font:500 15.5px/1.4 var(--font-body);padding:12px 14px;border:1.5px solid var(--line);border-radius:var(--r-sm);background:var(--paper);color:var(--ink);width:100%}
.rq textarea:focus,.rq select:focus,.rcontact input:focus{border-color:var(--gold);outline:0}
.rcontact{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding-top:6px;border-top:1px solid var(--line)}
.rcontact label{display:grid;gap:6px;font-size:13.5px;color:var(--ink-2)}.rcontact .opt{color:var(--ink-3);font-size:12px}
.rform .chk{display:grid;grid-template-columns:20px 1fr;gap:10px;align-items:start;font-size:13.5px;color:var(--ink-2)}
.rform .chk input{width:18px;height:18px;margin-top:2px;accent-color:var(--gold)}.rform .chk a{color:var(--gold-deep);border-bottom:1px solid var(--gold-soft)}
.rdone{background:var(--white);border:1.5px solid var(--line);border-radius:var(--r);padding:32px}
.rdone h2{font-size:clamp(24px,2.6vw,32px);font-weight:800;line-height:1.1;margin:10px 0 12px}.rdone p{color:var(--ink-2);margin-bottom:18px}
@media (max-width:900px){.razbor .wrap{grid-template-columns:1fr;gap:24px}.rform{padding:20px 18px}.rcontact{grid-template-columns:1fr}}

.under a{color:var(--gold-deep);border-bottom:1px solid var(--gold-soft)}