.layer .glyph{width:56px;height:56px;border-radius:var(--r-md);background:var(--g);flex:none;display:grid;place-items:center;color:var(--milk)}
.layer .glyph svg{width:28px;height:28px}
@media (max-width:900px){.layer .glyph{width:44px;height:44px;border-radius:var(--r-input)}
.layer .glyph svg{width:22px;height:22px}
.layer p{grid-column:2}
}
.label, .eyebrow, .eyebrow-pill, .fld label, .hero .eyebrow-pill, footer h4, p.eyebrow-pill{font-size:var(--fs-12);font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.hero .inner{position:relative;z-index:1;width:100%;text-align:center;pointer-events:none;padding-top:26px;padding-bottom:90px}
.hero .lead{max-width:40em;text-wrap:balance}
@media (max-width:600px){.hero .inner{padding-top:26px;padding-bottom:80px}
}
/* Шапка над стартовым экраном прозрачная; фон с размытием появляется при скролле */
header.top.glass{background:transparent}
header.top.glass .wrap{position:relative;max-width:none}
header.top.glass nav.menu{position:absolute;left:50%;translate:-50% 0;margin:0}
header.top.glass::before{background:var(--milk-86);opacity:0;transition:opacity .35s ease}
header.top.glass.scrolled::before,body.mnav-lock header.top.glass::before{opacity:1}
/* Стартовый экран заходит под шапку, --top-h — её высота */
.hero-c{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:center;margin-top:calc(-1 * var(--top-h,76px));min-height:clamp(620px,100svh,980px);background:var(--cream)}
.hero-c .comp{position:absolute;z-index:1;top:var(--top-h,76px);right:0;bottom:0;width:46%;display:grid;grid-template-columns:repeat(3,1fr)}
.hero-c .comp>div{position:relative;overflow:hidden;animation:heroCol 1s cubic-bezier(.22,.8,.24,1) both}
.hero-c .comp>.c2{animation-delay:.12s}
.hero-c .comp>.c3{animation-delay:.24s}
.hero-c .c1{background:var(--brown)}
.hero-c .c1::before{content:"";position:absolute;left:0;top:50%;width:94%;aspect-ratio:1/2;translate:0 -50%;background:var(--sand);border-radius:0 999px 999px 0;transform-origin:left center;animation:heroPop .9s cubic-bezier(.22,.8,.24,1) .55s both}
.hero-c .c2{background:var(--pink)}
.hero-c .c2 i{position:absolute;left:3%;width:94%;aspect-ratio:1;border-radius:50%;animation:heroPop .8s cubic-bezier(.22,.8,.24,1) .7s both}
.hero-c .c2 .sun{top:31%;background:var(--terra)}
.hero-c .c2 .dome{bottom:0;translate:0 62%;background:var(--olive);animation-delay:.85s}
.hero-c .c3{background:var(--sky)}
.hero-c .c3 .arch{position:absolute;top:0;left:0;right:0;height:72%;background:var(--cream);border-radius:0 0 999px 999px;transform-origin:top center;animation:heroDrop .9s cubic-bezier(.22,.8,.24,1) .8s both}
@keyframes heroCol{from{clip-path:inset(100% 0 0 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes heroPop{from{opacity:0;scale:.4}to{opacity:1;scale:1}}
@keyframes heroDrop{from{scale:1 0}to{scale:1 1}}
.hero-c .content{position:relative;z-index:2;width:54%;display:flex;flex-direction:column;gap:28px;padding:calc(var(--top-h,76px) + 48px) var(--gut) 64px}
.hero-c .eyebrow{font-size:var(--fs-13);letter-spacing:.1em;color:var(--terra-d)}
.hero-c .lead{max-width:600px;font-size:clamp(17px,1.45vw,20px);line-height:1.55;color:var(--brown)}
.hero-c .ctas{display:flex;flex-wrap:wrap;gap:12px}
.hero-c .btn{justify-content:center;height:54px;padding:0 28px;letter-spacing:.1em;background:var(--ink);color:var(--cream)}
.hero-c .btn:hover{background:var(--brown)}
.hero-c .btn.ghost{background:transparent;color:var(--brown);box-shadow:inset 0 0 0 1.5px var(--brown)}
.hero-c .btn.ghost:hover{background:var(--brown);color:var(--cream)}
.hero-c .facts{display:flex;flex-wrap:wrap;gap:6px 22px;font-size:var(--fs-14);line-height:1.4;color:var(--brown)}
.hero-c .facts span{display:inline-flex;align-items:center;gap:8px}
.hero-c .facts span::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--terra)}
@media (max-width:860px){.hero-c{min-height:0}
.hero-c .comp{position:relative;top:auto;order:2;width:100%;height:280px}
.hero-c .content{width:100%;padding:calc(var(--top-h,76px) + 40px) var(--gut) 48px}
}
@media (max-width:520px){.hero-c .ctas{flex-direction:column}
.hero-c .btn{width:100%;height:50px;padding:0 22px}
}
@media (min-width:761px){#os .sec-head,#security .sec-head,#pricing .n-band .sec-head{grid-template-columns:auto auto;justify-content:start}
#os .sec-head .desc,#security .sec-head .desc,#pricing .n-band .sec-head .desc{max-width:none;width:0;min-width:100%}
}
.step h3{font-size:var(--fs-16);font-weight:700}
.step p{font-size:var(--fs-16);color:var(--brown)}
.layers{display:grid;gap:0;border-top:1.5px solid var(--ink)}
.layer{display:grid;grid-template-columns:76px 1.1fr 1.4fr 132px;gap:24px 32px;align-items:center;padding-block:30px;border-bottom:1px solid var(--line)}
.layer h3{font-size:var(--h4);text-transform:uppercase}
.layer p{font-size:var(--fs-16);max-width:36em;color:var(--brown)}
a.layer.is-link{position:relative;transition:background .25s}
a.layer.is-link::before{content:"";position:absolute;inset:0 calc(var(--gut) * -.5);border-radius:var(--r-md);background:var(--paper);opacity:0;transition:opacity .25s;z-index:-1}
a.layer.is-link:hover::before{opacity:1}
a.layer.is-link:hover h3{color:var(--terra)}
.layers{position:relative;z-index:0}
.status.go{background:var(--terra);color:var(--milk);box-shadow:none;display:inline-flex;gap:8px;align-items:center}
/* текст бейджа поднят на 1px (паддинг 5/7 у .status), шеврон возвращён на 1px вниз — по центру */
.status.go i{display:inline-flex;position:relative;top:1px;font-style:normal;transition:transform .25s}
.status.go i svg{width:14px;height:14px}
a.layer.is-link:hover .status.go i{transform:translateX(4px)}
@media (max-width:900px){.layer{grid-template-columns:48px 1fr}
}
.layer h3{font-weight:400;letter-spacing:.02em;line-height:1.2}
.st{font-style:normal;font-weight:700;font-size:var(--fs-12);letter-spacing:.08em;text-transform:uppercase;padding:4px 10px;border-radius:var(--r-pill);white-space:nowrap}
.st.ok{background:var(--olive-12);color:var(--brown)}
.st.part{background:var(--sand);color:var(--brown)}

/* ===== 06 «Тарифы»: вариант N из _experiments/pricing-variants-branding-v2.html — оборот блокнота и белая панель на три колонки ===== */
#pricing{--olive-ink:#4F5830;padding-top:0;padding-bottom:clamp(48px,6vw,80px);border-top:0}
#about{border-top:0}
#pricing .sprite{position:absolute}
#pricing .ic{width:18px;height:18px;flex:none;fill:currentColor}
/* модули блокнота */
#pricing .k-nb{display:grid;grid-template-rows:repeat(3,1fr);overflow:hidden}
#pricing .k-r{position:relative;display:block;overflow:hidden;background:var(--bg)}
#pricing .k-r>i{position:absolute;display:block;background:var(--c)}
#pricing .k-b1{--bg:linear-gradient(90deg,var(--terra) 50%,var(--cream) 50%)}#pricing .k-b1 .a{--c:var(--sand);left:0;bottom:0;height:100%;aspect-ratio:1;border-top-right-radius:100%}#pricing .k-b1 .b{--c:var(--sky);left:50%;top:0;height:100%;width:25%;border-radius:0 999px 999px 0}#pricing .k-b1 .c{--c:var(--sky);left:75%;top:0;height:100%;width:25%;border-radius:0 999px 999px 0}
#pricing .k-b2{--bg:var(--pink)}#pricing .k-b2 .a{--c:var(--olive);left:0;top:0;height:100%;width:96%;border-radius:0 999px 999px 0}
#pricing .k-b3{--bg:var(--brown)}#pricing .k-b3 .a{--c:var(--pink);left:0;top:0;height:100%;width:48%;border-radius:0 999px 999px 0}#pricing .k-b3 .b{--c:var(--sky);left:50%;top:0;height:100%;aspect-ratio:1;border-radius:50%}
/* полоса с заголовком на кремовом листе */
#pricing{background:var(--cream)}
#pricing .n-band{position:relative;isolation:isolate;overflow:hidden;padding-block:clamp(48px,6vw,80px) clamp(130px,13vw,180px)}
#pricing .pv2-n-nb{position:absolute;inset:0;z-index:-1}
#pricing .n-band .sec-head{margin-bottom:0;padding:clamp(24px,3vw,40px);background:var(--cream);border-radius:var(--r-card)}
#pricing .n-band .num{color:var(--cream);-webkit-text-stroke:1.5px rgba(90,63,49,.25)}
#pricing .n-band .eyebrow,#pricing .n-band .desc{color:var(--ink)}
/* панель тарифов */
#pricing .n-panel{position:relative;margin-top:calc(-1 * clamp(80px,8vw,120px));display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-radius:var(--r-panel);background:var(--milk);box-shadow:0 8px 28px rgba(46,33,26,.1)}
#pricing .n-col{display:flex;flex-direction:column;padding:clamp(28px,3.2vw,44px);border-left:1px solid var(--line)}
#pricing .n-col:first-child{border-left:0}
#pricing .n-col .btn{margin-top:36px;width:100%;justify-content:center}
#pricing .pc-name{margin:0;color:var(--terra);font-size:var(--fs-18);font-weight:700;letter-spacing:.08em;text-transform:uppercase}
#pricing .pc-aud{margin:14px 0 0;font-size:var(--fs-16);color:var(--brown)}
#pricing .pc-cap-em{display:flex;align-items:center;gap:8px;margin:14px 0 0;font-size:var(--fs-13);font-weight:400;letter-spacing:.04em;text-transform:uppercase;color:rgba(46,33,26,.8)}
#pricing .pc-cap-em .ic{width:20px;height:20px;color:var(--terra)}
#pricing .pc-price{margin:16px 0 0;font-size:clamp(30px,2.6vw,40px);line-height:1;font-variant-numeric:tabular-nums}
#pricing .pc-price small{display:inline-block;margin-left:8px;font-size:var(--fs-13);letter-spacing:.04em;text-transform:uppercase;opacity:.8}
#pricing .pc-price.is-text{font-size:clamp(22px,2vw,28px);line-height:1.15;font-variant-numeric:normal}
#pricing .pc-note{margin:14px 0 0;font-size:var(--fs-13);color:rgba(46,33,26,.8)}
#pricing .pc-feat{list-style:none;margin:22px 0 0;padding:0;display:grid;gap:10px;font-size:var(--fs-14);flex:1;align-content:end}
#pricing .pc-feat li{position:relative;padding-left:18px}
#pricing .pc-feat li::before{content:"";position:absolute;left:0;top:8px;width:6px;height:6px;border-radius:50%;background:var(--terra)}
/* билет: годовая оплата + подарок */
#pricing .dl-ticket{position:relative;margin-top:20px;border-radius:var(--r-md);background:var(--olive-12)}
#pricing .dl-ticket .top{padding:14px 20px 16px}
#pricing .dl-sum{margin:0;font-size:var(--fs-14);line-height:22px;color:var(--olive-ink)}
#pricing .dl-sum b{display:inline;margin:0 8px 0 0;font-size:var(--fs-18);line-height:1;font-weight:700;color:var(--olive-ink);font-variant-numeric:tabular-nums}
#pricing .dl-ticket .perf{position:relative;height:0;margin:0 14px;border-top:2px dashed rgba(79,88,48,.4)}
#pricing .dl-ticket .perf i{position:absolute;top:-11px;width:20px;height:20px;border-radius:50%;background:var(--milk)}
#pricing .dl-ticket .perf i:first-child{left:-24px}
#pricing .dl-ticket .perf i:last-child{right:-24px}
#pricing .dl-ticket .gift{display:flex;align-items:center;gap:10px;margin:0;padding:14px 20px 16px;font-size:var(--fs-14);line-height:22px;font-weight:700;color:var(--olive-ink)}
@media (max-width:960px){
  #pricing .n-panel{grid-template-columns:1fr}
  #pricing .n-col{border-left:0;border-top:1px solid var(--line)}
  #pricing .n-col:first-child{border-top:0}
}

/* Блок 01 — Философия проекта (как слайд 2 презентации: Cygre Book, пропорции 1664px-колонки) */
#manifest{background:var(--sand)}
#manifest .num{color:transparent;-webkit-text-stroke:1.5px rgba(90,63,49,.25)}
#manifest .eyebrow{color:var(--brown)}
#manifest .sec-head h2{color:var(--brown)}
#manifest .sec-head .desc{grid-column:1/-1;max-width:none;margin-top:clamp(24px,3vw,48px);container-type:inline-size}
#manifest .body-text{margin:0;max-width:none;padding-bottom:calc(20/1664*100cqw);font-family:var(--sans-book);font-weight:400;font-size:max(16px,calc(28/1664*100cqw));line-height:1.55;letter-spacing:calc(.6/1664*100cqw);color:var(--brown)}
#manifest .body-text:first-child{padding-bottom:calc(56/1664*100cqw);font-size:max(17px,calc(30/1664*100cqw));line-height:1.6}

/* Блок 04 — список в тех же стилях, что .layers в блоке 05 (снимаем переопределения #fgos h3/p) */
#fgos .layers .layer h3{margin:0;font-size:var(--h4);font-weight:400;line-height:1.2;letter-spacing:.02em;text-transform:uppercase;color:var(--ink)}
#fgos .layers .layer p{margin:0;font-size:var(--fs-16);line-height:inherit;max-width:36em;color:var(--brown)}
@media (min-width:901px){#fgos .layers .layer p{grid-column:3/-1;max-width:none}}
@font-face{font-family:"Cygre";font-style:normal;font-weight:600;font-display:swap;src:url("../../fonts/Cygre-SemiBold.woff2") format("woff2")}
#fgos .layers .layer h3 strong{font-weight:600}

/* Главная: без разделительных линий между блоками (линия перед footer остаётся) */
.sec{border-top:0}

/* Блок 04 — шапка как в 05: подпись, описание, отступы, цифра */
section#fgos .sec-head{margin-bottom:56px}
section#fgos .sec-head .eyebrow{font-size:var(--fs-12);line-height:1.6;letter-spacing:.08em}
section#fgos .sec-head .desc{margin-top:16px;font-size:var(--fs-16);line-height:1.6}
section#fgos .num{color:var(--paper);-webkit-text-stroke:1.5px var(--line)}

/* Блок 03 — «Пять вопросов» (как слайд 4 презентации) */
#questions{background:var(--sand);color:var(--brown);padding-bottom:clamp(12px,1.5vw,24px);overflow:hidden}
#questions .eyebrow,#questions .sec-head h2{color:var(--brown)}
#questions .num{color:transparent;-webkit-text-stroke:1.5px rgba(90,63,49,.25)}
#questions .sec-head{margin-bottom:clamp(20px,2.4vw,32px)}
#questions .q-list{list-style:none;margin:0 0 0 34%;padding:0;display:grid;gap:clamp(10px,1vw,14px);max-width:62em}
#questions .q-list li{display:grid;grid-template-columns:clamp(40px,4.5vw,72px) 1fr;gap:clamp(14px,1.6vw,24px);align-items:start;font-size:clamp(17px,1.4vw,20px);line-height:1.5;letter-spacing:.02em;color:var(--brown)}
#questions .q-list li::before{content:"";border-top:1px solid var(--brown);margin-top:calc(.5lh + .125em - .5px)}
#questions .q-wordmark{display:block;width:calc(100% - 2 * clamp(12px,2.1vw,40px));height:auto;margin:clamp(48px,7vw,110px) auto 0;color:var(--brown)}
@media (max-width:900px){#questions .q-list{margin-left:0}}