/* Z_rhythm · ритм экранов: фоны / отступы / размерности / зигзаг / появление. Сборка кладёт стили в head, скрипт в конец body. Копирайт не трогаем. */
/* ===== Z · ритм страницы. Порядок: hero(W) → #standoff(D) → #private(P) → #directions(W) → #polygon(P) → #rating(D) → #certs(W) → #skillmap(P) → #red(W) → #author(D) → #speakers(P) → #materials(W) → #price(P) → footer(D) ===== */

/* --- заголовки: чередование 44 / 52 (вес 500 — как в каноне) --- */
#private h2.disp,#certs h2.disp,#red h2.disp,#speakers h2.disp,#price h2.disp{font-size:clamp(30px,4.4vw,52px)}
#directions h2.disp,#skillmap h2.disp,#author h2.disp,#materials h2.disp,#polygon h2.disp{font-size:clamp(28px,4vw,44px)}

/* --- #private · paper · 96 · карточки полосами-зигзагом (картинка слева / справа) --- */
#private.sec-pad{background:var(--paper);border-top:1px solid var(--line2);padding:96px 0}
#private .cb-two{grid-template-columns:1fr;gap:20px;margin-top:40px}
#private .cb-card{display:grid;grid-template-columns:300px minmax(0,1fr);column-gap:48px;align-items:center;padding:32px 44px}
#private .cb-card>.cb-ill{grid-row:1/span 3;margin:0;justify-content:center;align-self:center}
#private .cb-card>.cb-ill img{height:240px}
#private .cb-card:nth-child(2){grid-template-columns:minmax(0,1fr) 300px}
#private .cb-card:nth-child(2)>*{grid-column:1}
#private .cb-card:nth-child(2)>.cb-ill{grid-column:2;grid-row:1/span 3}
#private .cb-def,#private .cb-list{max-width:660px}
@media(max-width:800px){
  #private.sec-pad{padding:64px 0}
  #private .cb-card,#private .cb-card:nth-child(2){grid-template-columns:1fr;padding:28px}
  #private .cb-card:nth-child(2)>*{grid-column:auto}
  #private .cb-card>.cb-ill,#private .cb-card:nth-child(2)>.cb-ill{grid-row:auto;grid-column:auto;margin:-4px 0 16px}
  #private .cb-card>.cb-ill img{height:190px}
}

/* --- #directions · white · 64 · сетка 2×2 с воздухом побольше --- */
#directions.nd-sec{background:#fff;padding:64px 0}
#directions .nd-grid{gap:22px;margin-top:34px}
@media(max-width:640px){#directions .nd-grid{gap:14px}}

/* --- #polygon · paper · 120 · картинка справа (как есть) --- */
#polygon.sec-pad{background:var(--paper);border-top:1px solid var(--line2);border-bottom:1px solid var(--line2);padding:120px 0}
@media(max-width:800px){#polygon.sec-pad{padding:72px 0}}

/* --- #rating · ТЁМНЫЙ · 96 · узкий (контент 1040) · подиум белым контуром --- */
#rating.rt-sec{background:radial-gradient(120% 140% at 80% 10%,#1B088D 0%,#0C0922 55%);color:#fff;border:0;padding:96px 0!important}
#rating .wrap{max-width:1120px}
#rating .rt-grid{grid-template-columns:280px minmax(0,1fr);gap:56px}
#rating .rt-h{color:#fff;font-size:clamp(28px,3.6vw,44px);margin:0 0 14px}
#rating .rt-h .b{color:#4D8DFF}
#rating .rt-p{color:#d4d4e0;font-size:17px;margin-bottom:20px}
#rating .rt-tag{color:#fff;border-color:rgba(255,255,255,.32);background:rgba(255,255,255,.1)}
#rating .rt-svg g[stroke]{stroke:#fff}
#rating .rt-svg polygon[fill="url("#rtp-l")"]{fill:rgba(255,255,255,.06)}
#rating .rt-svg polygon[fill="url("#rtp-r")"]{fill:rgba(255,255,255,.14)}
#rating .rt-svg polygon[fill="url("#rtp-t")"]{fill:rgba(255,255,255,.24)}
@media(max-width:700px){#rating.rt-sec{padding:64px 0!important}#rating .rt-grid{grid-template-columns:1fr;gap:20px}}

/* --- #certs · white · 64 · картинка СПРАВА (зигзаг относительно #rating и #skillmap) --- */
#certs.sec-pad{background:#fff;padding:64px 0}
#certs .cert{gap:56px}
#certs .cert>:first-child{order:2}
@media(max-width:900px){#certs .cert>:first-child{order:0}#certs .cert{gap:28px}}

/* --- #skillmap · paper · 120 · плашка СЛЕВА --- */
#skillmap.sec-pad{background:var(--paper);padding:120px 0}
#skillmap .sm-plate{order:-1}
@media(max-width:900px){#skillmap.sec-pad{padding:72px 0}#skillmap .sm-plate{order:0}}

/* --- #red · white · 64 · плотная сетка 3×2 --- */
#red.rd-sec{background:#fff;border-top:0;border-bottom:0;padding:64px 0}
#red .rd-grid{gap:16px;margin-top:30px}

/* --- #author · ТЁМНЫЙ · 96 · фото СПРАВА --- */
#author.sec-pad{background:radial-gradient(120% 140% at 18% 8%,#1B088D 0%,#0C0922 58%);color:#fff;padding:96px 0}
#author h2.disp{color:#fff}
#author h2.disp .b{color:#4D8DFF}
#author .spk-wrap{grid-template-columns:minmax(0,1fr) 280px;gap:56px;margin-top:16px}
#author .spk-wrap>div:first-child{order:2}
#author .spk-name{color:#fff}
#author .spk-role{color:#4D8DFF}
#author .spk-bio{color:#d4d4e0}
#author .spk-creds li{border-color:rgba(255,255,255,.3);color:#fff;background:rgba(255,255,255,.06)}
#author .spk-creds li::before{color:#4D8DFF}
#author .spk-does{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.14)}
#author .spk-does h3{color:#fff}
#author .spk-does li{color:#e6e6f0}
#author .spk-does li svg{stroke:#4D8DFF}
@media(max-width:800px){#author.sec-pad{padding:64px 0}#author .spk-wrap{grid-template-columns:1fr;gap:28px}#author .spk-wrap>div:first-child{order:0}}

/* --- #speakers · paper · 96 · широкая сетка, gap побольше --- */
#speakers.sec-pad{padding-top:56px!important;padding-bottom:56px!important;padding:64px 0;border-bottom:0}
#materials .wrap{max-width:1120px}
#materials .mats-grid{grid-template-columns:260px minmax(0,1fr);gap:48px}
@media(max-width:820px){#materials .mats-grid{grid-template-columns:1fr;gap:20px}}

/* --- #price · paper · 96 --- */
#price.sec-pad{padding:96px 0}
@media(max-width:800px){#price.sec-pad{padding:64px 0}}

/* --- появление: секции и карточки. Класс .reveal ставит скрипт (без JS / при reduced-motion его нет — всё видно сразу); .in добавляет IntersectionObserver --- */
section.reveal>.wrap{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s ease}
section.reveal.in>.wrap{opacity:1;transform:none}
section.reveal .rd-snip,section.reveal .nd-snip,section.reveal .f3-h,section.reveal .sg-cell,section.reveal .cb-card,section.reveal .pblock{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s ease}
section.reveal.in .rd-snip,section.reveal.in .nd-snip,section.reveal.in .f3-h,section.reveal.in .sg-cell,section.reveal.in .cb-card,section.reveal.in .pblock{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){
  section.reveal>.wrap,section.reveal .rd-snip,section.reveal .nd-snip,section.reveal .f3-h,section.reveal .sg-cell,section.reveal .cb-card,section.reveal .pblock{opacity:1!important;transform:none!important;transition:none!important}
}

/* price dark (client) */
#price.sec-pad{background:linear-gradient(135deg,#0b0a2a 0%,#12106a 60%,#1a0f6e 100%)!important;color:#fff}
#price h2.disp{color:#fff}#price h2 .b{color:#4D8DFF}
#price .ada-code{color:#4D8DFF;border-color:rgba(77,141,255,.55)}
#price .pblock{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.18);box-shadow:none}
#price .pblock.best{border-color:#4D8DFF}
#price .pb-t,#price .pb-s{color:rgba(255,255,255,.72)}#price .pb-v{color:#fff}
#price .disc-row{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.14)}
#price .disc-tile{border-color:rgba(255,255,255,.12)}
#price .dt-l,#price .dt-note{color:rgba(255,255,255,.7)}#price .dt-v{color:#4D8DFF}
#price .hf-card{box-shadow:0 30px 80px rgba(0,0,0,.35)}

#price.sec-pad{padding-top:56px!important;padding-bottom:56px!important}

/* author compact (client) */
#author.sec-pad{padding-top:56px!important;padding-bottom:56px!important}
#author .spk-wrap{display:grid!important;grid-template-columns:minmax(0,1fr) 250px!important;gap:44px!important;align-items:start!important}
#author .spk-wrap>div:first-child{order:2}
#author .spk-photo{width:190px!important;height:190px!important}
#author h2.disp{font-size:40px!important;margin-bottom:14px!important}
#author .spk-bio{margin-bottom:14px!important}
@media(max-width:900px){#author .spk-wrap{grid-template-columns:1fr!important}#author .spk-wrap>div:first-child{order:0}}
/* nav cta smaller (client) */
.main-nav{align-items:center!important}
.main-nav .nav-cta{display:inline-flex!important;align-items:center!important;justify-content:center!important;font-size:13px!important;padding:10px 20px!important;height:auto!important;line-height:1.1!important;min-height:0!important;border-radius:10px!important;margin:0 0 0 6px!important;align-self:center!important;transform:none!important;font-weight:500!important}

/* directions 3 cols (client) */
#directions .nd-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
@media(max-width:980px){#directions .nd-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:640px){#directions .nd-grid{grid-template-columns:1fr!important}}