

/* ============================================================
   IHR DESIGN SYSTEM · за Brand Book v1.1 (Aug 2026)
   Master principle: якщо дизайн розумний, але заважає зрозуміти
   ідею — спрощуй.
   ============================================================ */

:root{
  /* 10 · COLOR SYSTEM */
  --ink:#171717;        /* authority: текст, обкладинки, hero-моменти */
  --bone:#F3EFE6;       /* editorial warmth: секційні паузи, callouts */
  --paper:#FBFAF6;      /* default: довге читання, більшість веб-поверхонь */
  --gold:#B48A47;       /* human judgment/choice/consequence · ≤5% композиції */
  --slate:#6C7480;      /* вторинний текст (Paper only, не на Bone) */
  --steel:#AAB2BB;      /* вторинний текст на Ink · невизначеність у даних */
  --goldbg:#EFE3CF;     /* takeaway-фон (з плейбука) */
  /* functional UI — utilities, не бренд-кольори */
  --link:#315E75; --success:#2E6A4D; --warning:#8B641C; --error:#9B3F3F;
  --maxw:720px; --wide:1040px;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* 12 · TYPOGRAPHY — Inter only. Body ≥16px (digital rule) */
body{
  font-family:'Helvetica Neue',Helvetica,Arial,sans-serif; /* рішення синку 31.08: Helvetica замість Inter — оновити брендбук */
  background:var(--paper); color:var(--ink);
  font-size:16px; line-height:1.5;         /* body 16/24 */
  -webkit-font-smoothing:antialiased;
}
h1{font-size:clamp(32px,4.6vw,48px);line-height:1.02;font-weight:600;letter-spacing:-.028em;margin-bottom:22px}
h2{font-size:clamp(24px,3vw,30px);line-height:1.07;font-weight:600;letter-spacing:-.022em;margin-bottom:16px}
h3{font-size:19px;line-height:1.3;font-weight:600;margin-bottom:8px}
p{margin-bottom:14px}
p:last-child{margin-bottom:0}
.lead{font-size:19px;line-height:1.5}
.meta{font-size:12px;line-height:1.34}
a{color:inherit}
a:focus-visible,button:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
img,svg{max-width:100%;height:auto;display:block}

/* labels на світлому — Ink (Gold on Paper 3.02:1 = fail; ніколи gold для дрібних лейблів) */
.eyebrow{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink);font-weight:600;margin-bottom:14px}
.ink .eyebrow{color:var(--gold)}  /* Gold on Ink 5.69:1 = pass */
.muted{color:var(--slate)}        /* лише Paper, не критичний текст */
.ink .muted{color:var(--steel)}   /* Steel on Ink 8.36:1 = pass */

/* nav — operational lockup zone: symbol + name, без gold rule-dot */
.nav{background:var(--paper);border-bottom:1px solid var(--bone);position:sticky;top:0;z-index:10}
.nav-inner{max-width:var(--wide);margin:0 auto;padding:14px 24px;display:flex;align-items:center;gap:28px;flex-wrap:wrap}
.logo{font-weight:600;letter-spacing:.01em;text-decoration:none;font-size:15px}
.nav-links{display:flex;gap:20px;margin-left:auto;flex-wrap:wrap}
.nav-links a{text-decoration:none;font-size:14.5px;color:var(--slate)}
.nav-links a:hover,.nav-links a[aria-current]{color:var(--ink)}

/* layout: Paper default · Bone паузи · Ink authority */
.section{padding:64px 24px}
.section.ink{background:var(--ink);color:var(--paper)}
.section.bone{background:var(--bone)}
.inner{max-width:var(--maxw);margin:0 auto}
.inner.wide{max-width:var(--wide)}
.divider{height:1px;background:var(--bone);max-width:var(--maxw);margin:0 auto}

ul.dash{list-style:none}
ul.dash li{padding-left:22px;position:relative;margin-bottom:10px}
ul.dash li::before{content:"—";position:absolute;left:0;color:var(--gold)}

/* buttons — serious publication, не SaaS: прямокутні, без тіней */
.btns{display:flex;gap:14px;flex-wrap:wrap;margin-top:26px}
.btn{display:inline-block;text-decoration:none;font-weight:600;font-size:15.5px;
  padding:13px 24px;border:1.5px solid var(--ink);border-radius:2px}
.btn.primary{background:var(--ink);color:var(--paper)}
.btn.primary:hover{background:#000}
.btn.ghost:hover{background:var(--bone)}
.ink .btn{border-color:var(--paper)}
.ink .btn.primary{background:var(--paper);color:var(--ink)}
.ink .btn.ghost{color:var(--paper)}
.ink .btn.ghost:hover{background:rgba(255,255,255,.08)}

/* cards — лише коли інформація справді модульна */
.grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:22px;margin-top:34px}
.card{background:var(--paper);border:1px solid var(--bone);padding:26px 24px;border-top:2px solid var(--ink)}
.bone .card{border-color:#e6e0d2}
.card .go{display:inline-block;margin-top:14px;font-size:14.5px;font-weight:600;text-decoration:none;color:var(--link)}

/* СЛОВНИК БЛОКІВ (з плейбука — впізнаваність між книжкою і сайтом) */
.mycase{background:#fff;border:1px solid var(--bone);border-top:2px solid var(--ink);padding:26px 24px;margin:26px 0}
.bankcase{background:var(--bone);border-left:3px solid var(--gold);padding:26px 24px;margin:26px 0}
.hint{background:#fff;border:1px solid var(--steel);border-left:3px solid var(--slate);padding:22px 24px;margin:26px 0}
.takeaway{background:var(--goldbg);border-top:2px solid var(--gold);padding:26px 24px;margin:26px 0}
.tag{display:block;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink);font-weight:600;margin-bottom:10px}

/* pricing / sessions */
.tiers{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:22px;margin-top:34px}
.tier{background:var(--paper);border:1px solid #e6e0d2;padding:28px 26px;display:flex;flex-direction:column}
.tier .size{font-size:34px;font-weight:600;line-height:1;color:var(--gold)}  /* display text: gold ok */
.tier .name{font-size:19px;font-weight:600;margin:8px 0 2px}
.tier .price{font-size:24px;font-weight:600;margin:2px 0}
.tier .meta,.tier .sub{font-size:13px;color:var(--slate);margin-bottom:14px}
.tier p{font-size:15.5px}
.tier ul{margin-top:auto;padding-top:14px;font-size:14.5px;list-style:none}
.tier ul li{padding-left:18px;position:relative;margin-bottom:6px}
.tier ul li::before{content:"·";position:absolute;left:2px;color:var(--gold);font-weight:700}
.tier .btn{margin-top:18px;text-align:center}

/* evidence trace: signal→evidence→judgment→decision→consequence */
.trace{display:flex;gap:0;margin:30px 0;flex-wrap:wrap}
.trace .node{flex:1;min-width:110px;border-top:1.5px solid var(--ink);padding:16px 12px 0 0;position:relative}
.trace .node::before{content:"";width:9px;height:9px;background:var(--ink);border-radius:50%;position:absolute;top:-5px;left:0}
.trace .node.gold::before{background:var(--gold);border-radius:0}
.trace .node b{display:block;font-size:13px;letter-spacing:.08em;text-transform:uppercase}
.trace .node span{font-size:13px;color:var(--slate)}
.ink .trace .node{border-color:var(--paper)}
.ink .trace .node::before{background:var(--paper)}
.ink .trace .node.gold::before{background:var(--gold)}
.ink .trace .node span{color:var(--steel)}

/* week timeline (консалтинг S) */
.week{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:0;margin-top:30px;border-top:2px solid var(--paper)}
.section:not(.ink) .week{border-color:var(--ink)}
.day{padding:22px 20px 0 0}
.day .dot{width:11px;height:11px;background:var(--paper);border-radius:50%;margin:-28px 0 16px}
.section:not(.ink) .day .dot{background:var(--ink)}
.day:last-child .dot{background:var(--gold);border-radius:0}
.day h3{font-size:16px}
.day p{font-size:15px}

/* faq */
.faq{margin-top:26px}
.faq details{border-top:1px solid var(--bone);padding:16px 0}
.faq details:last-child{border-bottom:1px solid var(--bone)}
.faq summary{font-weight:600;cursor:pointer;font-size:16px}
.faq details p{margin-top:10px;font-size:15.5px;color:var(--slate)}

/* footer */
.footer{background:var(--ink);color:var(--steel);padding:44px 24px;font-size:14px}
.footer a{color:var(--steel);text-decoration:none}
.footer a:hover{color:var(--paper)}
.note{font-size:13px;color:var(--slate)}
.route-wrap{margin:38px 0 6px}

/* styleguide swatches */
.swatches{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px;margin:24px 0}
.swatch{border:1px solid var(--bone)}
.swatch .chip{height:74px}
.swatch .info{padding:10px 12px;font-size:12.5px;background:#fff}

@media(max-width:640px){
  .section{padding:48px 20px}
}

/* faq v2 — чистіший вигляд */
.faq{margin-top:26px;border-top:1px solid #e2dccc}
.faq details{border-bottom:1px solid #e2dccc;padding:0}
.faq details:last-child{border-bottom:1px solid #e2dccc}
.faq summary{list-style:none;cursor:pointer;font-weight:600;font-size:16px;
  padding:18px 40px 18px 0;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:4px;top:50%;transform:translateY(-52%);
  color:var(--gold);font-size:22px;font-weight:400;line-height:1}
.faq details[open] summary::after{content:"−"}
.faq details p{padding:0 0 20px;font-size:15.5px;color:var(--ink);max-width:62ch}

/* архітектура: шість ліній картками */
.lines{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:18px;margin-top:28px}
.line{display:block;background:var(--paper);border:1px solid #e6e0d2;border-top:2px solid var(--ink);
  padding:20px 20px 18px;text-decoration:none}
.line[href]:hover{border-top-color:var(--gold)}
.line .idx{display:block;font-size:13px;font-weight:600;color:var(--gold);letter-spacing:.1em;margin-bottom:10px}
.line b{display:block;font-size:17px;margin-bottom:6px}
.line span:not(.idx){font-size:14px;color:var(--slate);line-height:1.45}

/* ===== дизайн-прохід: редакційність ===== */
::selection{background:var(--gold);color:var(--ink)}
h1{font-size:clamp(34px,5.2vw,58px)}
.lead{color:var(--slate)}
.ink .lead{color:var(--steel)}

/* асиметрична редакційна сітка */
.split{display:grid;grid-template-columns:minmax(180px,240px) minmax(0,1fr);gap:20px 48px;align-items:start}
.split h2{position:sticky;top:84px}
@media(max-width:760px){.split{grid-template-columns:1fr}.split h2{position:static}}

/* засновниця: фото + текст */
.founder{display:grid;grid-template-columns:minmax(220px,340px) minmax(0,1fr);gap:44px;align-items:center}
.founder-photo{margin:0;position:relative}
.founder-photo img{width:100%;height:auto;display:block}
.founder-photo::after{content:"";position:absolute;left:0;right:34%;bottom:-10px;height:3px;background:var(--gold)}
@media(max-width:700px){.founder{grid-template-columns:1fr}.founder-photo{max-width:340px}}

/* три питання дослідження */
.qcards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:22px;margin-top:30px}
.qcard{border-top:2px solid var(--ink);padding-top:18px}
.qcard .qnum{display:block;font-size:30px;font-weight:600;color:var(--gold);letter-spacing:-.02em;margin-bottom:12px}
.qcard p{font-size:15.5px}

/* стрілка на первинних CTA */
.btn .arr{display:inline-block;transition:transform .15s ease;margin-left:2px}
.btn:hover .arr{transform:translateX(4px)}
@media (prefers-reduced-motion:reduce){.btn .arr{transition:none}.btn:hover .arr{transform:none}}

/* редакційний футер */
.foot-grid{display:grid;grid-template-columns:minmax(220px,1.4fr) 1fr 1fr;gap:40px;align-items:start}
.foot-brand img{margin-bottom:16px}
.foot-line{color:var(--paper);font-weight:600;font-size:15px;line-height:1.45}
.foot-nav a,.foot-legal a{display:block;color:var(--steel);text-decoration:none;font-size:14px;margin-bottom:9px}
.foot-nav a:hover,.foot-legal a:hover{color:var(--paper)}
.foot-legal .copy{display:block;color:#7d858f;font-size:12.5px;margin-top:16px}
@media(max-width:700px){.foot-grid{grid-template-columns:1fr 1fr}.foot-brand{grid-column:1/-1}}

/* лінки-переходи в картках: підкреслення замість синього */
.card .go{color:var(--ink);border-bottom:1.5px solid var(--gold);padding-bottom:2px}
.card .go:hover{color:var(--gold)}

/* ===== v6: живі елементи, двомовність ===== */
.nav-links .lang{font-weight:600;color:var(--ink);border:1px solid var(--ink);padding:3px 9px;border-radius:2px;font-size:12.5px;letter-spacing:.06em}
.nav-links .lang:hover{background:var(--ink);color:var(--paper)}
h1.display{font-size:clamp(36px,6vw,66px);letter-spacing:-.03em;max-width:16ch}
h2.quote{font-size:clamp(24px,3.4vw,36px);max-width:28ch}
.hero-s{padding-top:72px}
.split-hero{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:40px;margin-top:10px}
@media(max-width:760px){.split-hero{grid-template-columns:1fr;gap:6px}}
.ink-inset{background:var(--ink);color:var(--paper);padding:34px 28px 24px;margin-top:22px}

/* reveal on scroll */

/* інтерактивний маршрут */
.route .rt-node{cursor:pointer;transition:r .15s,transform .15s}
.route .rt-node:hover,.route .rt-node:focus,.route .rt-node.on{fill:#B48A47;outline:none}
.route circle.rt-node.on{r:8}
.route .rt-label.on{fill:#FBFAF6;font-weight:600}
.rt-panel{margin-top:14px;border-top:1px solid rgba(251,250,246,.25);padding-top:16px;min-height:96px}
.rt-tag{color:var(--gold)!important}
.rt-lie{font-size:20px;font-weight:600;line-height:1.3;margin-bottom:6px;color:var(--paper)}
.rt-why{color:var(--steel);font-size:15px}
.rt-hint{color:#7d858f;margin-top:8px}
.section:not(.ink) .rt-panel .rt-lie{color:var(--paper)}

/* хмара викривлень */
.cloud{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:baseline;margin-top:28px;padding:26px 0;border-top:1px solid var(--bone);border-bottom:1px solid var(--bone)}
.bw{background:none;border:0;padding:0;font-family:inherit;color:var(--ink);cursor:pointer;line-height:1.1;font-weight:500}
.bw.s1{font-size:14px;color:var(--slate)} .bw.s2{font-size:17px} .bw.s3{font-size:21px;font-weight:600} .bw.s4{font-size:26px;font-weight:600;letter-spacing:-.01em} .bw.s5{font-size:32px;font-weight:600;letter-spacing:-.02em}
.bw:hover,.bw.on{color:var(--gold)}
.bw:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.cloud-panel{margin-top:18px;min-height:56px}
.cloud-panel p{font-size:17px}

/* Reason / Judge / Decide */
.rjd{margin-top:26px;border-top:2px solid var(--ink);padding-top:4px}
.rjd-tab{background:none;border:0;font-family:inherit;font-weight:600;font-size:15px;letter-spacing:.06em;text-transform:uppercase;padding:14px 22px 12px 0;cursor:pointer;color:var(--slate);border-bottom:2px solid transparent;margin-bottom:-2px}
.rjd-tab[aria-selected="true"]{color:var(--ink);border-bottom-color:var(--gold)}
.rjd-body{padding:16px 0 0;font-size:18px;min-height:56px}

/* аудиторія: hover відкриває страх */
.auds{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px;margin-top:26px}
.aud{border-top:2px solid var(--ink);padding:16px 0 0;cursor:default;transition:border-color .2s}
.aud h3{font-size:16.5px}
.aud p{font-size:14.5px;color:var(--slate);margin-bottom:6px}
.aud .fear{color:var(--ink);font-weight:600;max-height:0;overflow:hidden;opacity:0;transition:max-height .3s ease,opacity .3s ease}
.aud:hover,.aud:focus{border-top-color:var(--gold);outline:none}
.aud:hover .fear,.aud:focus .fear{max-height:80px;opacity:1}
@media (hover:none){.aud .fear{max-height:80px;opacity:1}}

/* квіз розміру */
.quiz{margin-top:44px;border:1px solid #e6e0d2;border-top:2px solid var(--ink);padding:26px 24px;background:var(--paper)}
.quiz h3{margin-bottom:14px}
.qq{margin-bottom:16px}
.qq p{margin-bottom:8px;font-size:15.5px}
.qopts{display:flex;gap:8px;flex-wrap:wrap}
.qopts button{font-family:inherit;font-size:14px;padding:8px 14px;border:1.5px solid var(--ink);background:var(--paper);cursor:pointer;border-radius:2px}
.qopts button.on{background:var(--ink);color:var(--paper)}
.qres{margin-top:14px;font-weight:600;min-height:24px;border-left:3px solid var(--gold);padding-left:14px}
.qres:empty{border:0;padding:0}

/* self-check дослідження */
.selfcheck{margin-top:26px;border-top:2px solid var(--ink);padding-top:18px}
.tg{display:flex;gap:12px;align-items:flex-start;padding:10px 0;border-bottom:1px solid #e6e0d2;cursor:pointer;font-size:15.5px}
.tg input{accent-color:#B48A47;width:18px;height:18px;margin-top:2px}
.scres{margin-top:16px;font-weight:600;border-left:3px solid var(--gold);padding-left:14px}

/* новини */
.news{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:22px;margin-top:28px}
.newsi{border-top:2px solid var(--ink);padding-top:14px}
.newsi .meta{display:block;color:var(--slate);margin-bottom:10px;font-size:12.5px;letter-spacing:.04em}
.newsi h3{font-size:17px}
.newsi p{font-size:15px}

/* ротатор питань (сесії) */
.rotator{position:relative}
.rql{list-style:none;position:relative;min-height:150px;margin-top:8px}
.rq{position:absolute;left:0;right:0;top:0;font-size:clamp(22px,3vw,34px);font-weight:600;line-height:1.2;letter-spacing:-.02em;color:var(--paper);opacity:0;transform:translateY(18px);transition:opacity .5s ease,transform .5s ease;pointer-events:none;max-width:22ch}
.rq::before{content:"“";color:var(--gold)}
.rq::after{content:"”";color:var(--gold)}
.rq.on{opacity:1;transform:none;pointer-events:auto}
.rq.out{opacity:0;transform:translateY(-18px)}
.rq-next{background:none;border:1px solid var(--paper);color:var(--paper);font-family:inherit;font-weight:600;font-size:14px;padding:9px 16px;border-radius:2px;cursor:pointer;margin-top:10px}
.rq-next:hover{background:var(--paper);color:var(--ink)}
@media (prefers-reduced-motion:reduce){.rql{min-height:0}.rq{position:static;opacity:1;transform:none;font-size:18px;margin-bottom:12px;max-width:none}.rq-next{display:none}}

/* ===== v8 ===== */
.logo{display:flex;align-items:center;gap:10px}
.lockup{display:flex;align-items:center;gap:16px;margin-bottom:26px}
.lockup span{font-size:clamp(18px,2.4vw,26px);font-weight:600;letter-spacing:-.01em}
.hero-s h1.display{max-width:none;font-size:clamp(34px,5.6vw,80px);line-height:1;letter-spacing:-.035em;text-wrap:balance}

/* акваріум викривлень */
.cloud{justify-content:center;text-align:center;background:var(--bone);border:0;padding:44px 28px;gap:14px 26px;margin-top:30px;position:relative;overflow:hidden}
.cloud::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,var(--bone),transparent 12%,transparent 88%,var(--bone))}
.bw{position:relative;font-style:normal;letter-spacing:-.01em;animation:drift var(--dur,9s) ease-in-out var(--del,0s) infinite alternate;transition:color .2s,transform .2s}
.bw.s1{color:#8a919b} .bw.s2{color:var(--slate)} .bw.s3,.bw.s4,.bw.s5{color:var(--ink)}
.bw:hover,.bw:focus-visible,.bw.on{color:var(--gold);transform:scale(1.12);animation-play-state:paused;z-index:2}
@keyframes drift{from{translate:0 0}to{translate:var(--dx,6px) var(--dy,-5px)}}
@media (prefers-reduced-motion:reduce){.bw{animation:none}}
.cloud-panel{text-align:center;margin-top:20px;min-height:64px}
.cloud-panel .tag{color:var(--gold);font-size:13px}
.cloud-panel p{font-size:19px;font-weight:500;max-width:48ch;margin:0 auto}

/* одна думка наскрізь */
.one-thought{padding:88px 24px;border-top:3px solid var(--gold)}
.one-thought .big{font-size:clamp(26px,4vw,46px);font-weight:600;line-height:1.12;letter-spacing:-.025em;color:var(--paper);max-width:24ch;margin:0 0 22px}
.one-thought .muted{max-width:60ch}

/* курси */
.courses{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:22px;margin-top:30px}
.course{background:var(--paper);border:1px solid #e6e0d2;border-top:2px solid var(--ink);padding:24px 22px}
.course .idx{display:block;font-size:13px;font-weight:600;color:var(--gold);letter-spacing:.1em;margin-bottom:10px}
.course h3{font-size:18px;margin-bottom:10px}
.course p{font-size:15px}
.course .who{color:var(--slate);margin-top:10px}


/* ===== v9 ===== */
/* вітер в акваріумі */
.bw{animation:drift var(--dur,7s) ease-in-out var(--del,0s) infinite alternate}
@keyframes drift{
  0%{translate:0 0;rotate:0deg}
  50%{translate:calc(var(--dx,10px)*.6) calc(var(--dy,-8px)*-.8);rotate:-1.2deg}
  100%{translate:var(--dx,12px) var(--dy,-9px);rotate:1.2deg}
}
/* ротатор: стек у гріді, висота = найдовше питання, кнопка нижче, текст на всю ширину */
.rql{display:grid;min-height:0;margin-top:14px}
.rq{grid-area:1/1;position:static;max-width:none;font-size:clamp(22px,3.1vw,40px);line-height:1.18}
.rq-next{margin-top:26px}
@media (prefers-reduced-motion:reduce){.rql{display:block}}
/* відступи: рівний ритм */
.section{padding:72px 24px}
.section.bone{padding:64px 24px}
.hero-s{padding-top:80px;padding-bottom:64px}
.section .eyebrow+h1,.section .eyebrow+h2{margin-top:2px}
.lead+p{margin-top:6px}
.btns{margin-top:30px}
.trace{margin:34px 0 8px}
.trace+.note,.trace+p{margin-top:16px}
.grid3,.tiers,.lines,.courses,.qcards,.news{margin-top:30px}
.mycase,.bankcase,.hint,.takeaway{margin:30px 0}
.takeaway+h2{margin-top:36px}
.split h2{margin-bottom:0}
.route-wrap{margin:34px 0 10px}
.route-wrap.cycle{margin-bottom:0}
.cloud{margin-top:34px}
.quiz{margin-top:48px}
.selfcheck{margin-top:30px}
.founder{gap:48px}
@media(max-width:640px){.section,.section.bone{padding:52px 20px}.hero-s{padding-top:56px}.one-thought{padding:64px 20px}}

/* ===== v10 ===== */
.bw{cursor:pointer}
.modal{position:fixed;inset:0;z-index:50;display:flex;align-items:center;justify-content:center;padding:20px}
.modal[hidden]{display:none}
.modal-back{position:absolute;inset:0;background:rgba(23,23,23,.72)}
.modal-box{position:relative;background:var(--paper);color:var(--ink);max-width:720px;width:100%;padding:34px 34px 30px;border-top:3px solid var(--gold);max-height:90vh;overflow:auto}
.modal-box h3{font-size:clamp(24px,3vw,32px);letter-spacing:-.02em;margin:6px 0 10px}
.modal-box .bm-def{font-size:18px;color:var(--slate);margin-bottom:22px}
.bm-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;border-top:1px solid var(--bone);padding-top:20px}
.bm-grid p{font-size:15.5px}
.modal-x{position:absolute;top:12px;right:14px;background:none;border:0;font-size:28px;line-height:1;cursor:pointer;color:var(--slate);font-family:inherit}
.modal-x:hover{color:var(--ink)}
@media(max-width:600px){.bm-grid{grid-template-columns:1fr}.modal-box{padding:26px 20px}}
.course .ctype{display:inline-block;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink);border:1px solid var(--ink);padding:3px 8px;margin-bottom:12px}


/* ===== v11 (синк 31.08) ===== */
.hero-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(200px,.7fr);gap:40px;align-items:center}
.hero-mark{justify-self:end;width:min(260px,100%);height:auto;opacity:.95}
@media(max-width:760px){.hero-grid{grid-template-columns:1fr}.hero-mark{width:120px;justify-self:start;order:-1}}
.hero-s h1.display{font-size:clamp(34px,5vw,68px)}
.pprice{font-size:22px;font-weight:600;margin:6px 0 4px}
.pprice s{color:var(--slate);font-weight:400;margin-right:6px}
.pprice .note{font-weight:400;font-size:13px}
.ink .pprice s{color:var(--steel)}
.products .card{display:flex;flex-direction:column}
.products .card .btn{margin-top:auto;align-self:flex-start}
.products .card .tag{margin-bottom:8px}
.cover{margin:0;justify-self:end;width:min(260px,100%)}
.cover-ph{aspect-ratio:1/1.414;background:var(--paper);color:var(--ink);border:1px solid var(--bone);padding:22px 18px;display:flex;flex-direction:column;justify-content:space-between}
.cover-ph span{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--slate)}
.cover-ph b{font-size:clamp(22px,2.6vw,30px);line-height:1.02;letter-spacing:-.02em}
.btn.small{font-size:13.5px;padding:9px 14px;margin-top:14px;display:inline-block}
.split-hero h2{margin-bottom:0}
.lines .line{cursor:default}
.btn s{text-decoration:line-through;opacity:.55;margin-right:4px}


/* ===================== BRAND BOOK v3.0 (Sept 2026) =====================
   Display: Lora · Text: Helvetica Neue/Arial · Eyebrow: mono, caps, +16%
   Prямі кути, одне золото на поверхню, 60/40 асиметрія, Bone = пауза */
body{font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;font-size:17px;line-height:1.55}
h1,h2,.display,.quote,.big,.rq,.rt-lie,.tier .size,.qcard .qnum,.cover-ph b{font-family:'Lora',Georgia,'Times New Roman',serif}
h1{font-weight:500;letter-spacing:-.015em;line-height:1.04}
h2{font-weight:600;letter-spacing:-.004em;line-height:1.2;font-size:clamp(26px,3vw,30px)}
h3{font-family:'Helvetica Neue',Helvetica,Arial,sans-serif}
h1.display{font-weight:500;font-size:clamp(36px,5.2vw,72px);letter-spacing:-.015em}
h2.quote{font-weight:500;font-size:clamp(26px,3.4vw,40px);max-width:none}
.one-thought .big{font-weight:500}
.eyebrow,.tag,.line .idx,.course .idx,.ctype,.newsi .meta,.trace .node b,.rt-tag,.cloud-panel .tag,.day h3{font-family:'Liberation Mono','Courier New',monospace;letter-spacing:.16em;text-transform:uppercase;font-weight:400;font-size:11px}
.eyebrow{color:var(--slate);margin-bottom:16px}
.ink .eyebrow{color:var(--gold)}
.tag{color:var(--ink)}
.line .idx,.course .idx{color:var(--gold);font-size:14px}
.btn,.card,.tier,.line,.course,.mycase,.bankcase,.hint,.takeaway,.qopts button,.rq-next,.modal-box,.nav-links .lang,.quiz{border-radius:0}
.btn{font-weight:600}
.card,.tier,.line,.course{background:var(--paper);border:0;border-top:1px solid var(--ink);padding-left:0;padding-right:0}
.bone .card,.bone .tier,.bone .line,.bone .course{background:transparent}
.grid3,.tiers,.lines,.courses{gap:28px 36px}
.cover{justify-self:start;width:min(320px,100%)}
.cover img{display:block;width:100%;height:auto;box-shadow:0 1px 0 rgba(23,23,23,.15)}
.hero-grid.cover-left{grid-template-columns:minmax(220px,.75fr) minmax(0,1.25fr);align-items:start}
.hero-grid.cover-left .cover{width:min(360px,100%)}
.hero-grid.cover-left .btns{margin-top:18px}
.lockup img{height:60px;width:auto}
.lockup-wide{display:block;width:min(420px,100%);height:auto;margin-bottom:24px}
.aud .fear{max-height:0}
.aud:hover .fear,.aud:focus .fear{max-height:220px}
@media (hover:none){.aud .fear{max-height:220px}}
/* екосистема */
.eco{margin:30px 0 10px}
/* принципи «як ми працюємо» — коротко */
.principles{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:26px 32px;margin-top:26px}
.principle{border-top:1px solid var(--ink);padding-top:14px}
.principle b{display:block;margin-bottom:6px}
.principle p{font-size:15px;color:var(--slate);margin:0}
/* AI — три рядки */
.three{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:24px 36px;margin-top:26px}
.three div{border-top:1px solid rgba(251,250,246,.35);padding-top:12px;font-size:15.5px}
.three b{display:block;color:var(--paper);margin-bottom:4px}
/* курси: кнопки в одну лінію */
.course{display:flex;flex-direction:column;padding:18px 0 22px}
.course .btn{margin-top:auto;align-self:flex-start}
.course .who{margin-bottom:18px}
/* голосування за курс */
.poll{margin-top:26px;border-top:1px solid var(--ink);padding-top:20px}
.poll-opts{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px;margin-top:14px}
.poll-opts button{font-family:inherit;font-size:15px;text-align:left;padding:12px 14px;border:1px solid var(--ink);background:var(--paper);cursor:pointer}
.poll-opts button.on{background:var(--ink);color:var(--paper)}
.poll-res{margin-top:14px;font-weight:600;min-height:24px}
/* відгуки */
.quotes{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:26px 36px;margin-top:28px}
.qt{border-top:1px solid var(--ink);padding-top:14px}
.qt p{font-family:'Lora',Georgia,serif;font-size:17px;line-height:1.45;margin-bottom:8px}
.qt .meta{font-family:'Liberation Mono','Courier New',monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--slate)}
.ink .qt{border-color:rgba(251,250,246,.35)}
.ink .qt .meta{color:var(--steel)}
/* чим я допомагаю */
.help{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:18px 36px;margin-top:26px}
.help div{border-top:1px solid var(--ink);padding-top:12px;font-size:15.5px}
.help b{display:block;margin-bottom:4px}
/* маршрут живий */
.route .rt-node{transition:none}
/* research cover card */
.rcover{background:var(--bone);padding:26px 24px 20px;width:min(360px,100%)}
.rcover .eyebrow{margin-bottom:10px}
.rcover h3{font-family:'Lora',Georgia,serif;font-weight:500;font-size:24px;line-height:1.15;margin:12px 0 6px}
.rcover .meta{font-family:'Liberation Mono','Courier New',monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--slate)}
/* сторінка курсу */
.modules{margin-top:26px}
.modules div{display:grid;grid-template-columns:44px 1fr;gap:16px;border-top:1px solid var(--bone);padding:14px 0}
.modules .idx{font-family:'Liberation Mono','Courier New',monospace;color:var(--gold);font-size:13px;letter-spacing:.1em}
.modules b{display:block;margin-bottom:3px}
.modules p{font-size:15px;color:var(--slate);margin:0}

.bone .cloud{background:var(--paper)}
.bone .cloud::before{background:linear-gradient(90deg,var(--paper),transparent 12%,transparent 88%,var(--paper))}
.hero-grid .hero-mark{align-self:center}

.hero-mark.line-mark{width:min(300px,100%);opacity:1}
.lockup-wide{width:min(360px,100%)}



/* IHR site v13 · Brand Book v3.0 · Ink-first homepage
   Gold = human judgment, one per surface. Navy = evidence, light surfaces only (provisional, v3.1 decision). */
:root{
  --ink:#171717; --bone:#F3EFE6; --paper:#FBFAF6; --gold:#B48A47;
  --slate:#6C7480; --steel:#AAB2BB; --navy:#14274A; --gold12:#F2ECE1;
  --link:#315E75;
  --wide:1120px; --read:720px; --nav:64px;
  --sans:'Helvetica Neue',Helvetica,Arial,sans-serif;
  --serif:'Lora',Georgia,'Times New Roman',serif;
  --mono:'Liberation Mono',Menlo,Consolas,'Courier New',monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:var(--nav)}
body{font-family:var(--sans);font-size:17px;line-height:1.55;color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased}
img,svg{display:block;max-width:100%;height:auto}
a{color:inherit}
a:focus-visible,button:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
::selection{background:var(--gold);color:var(--ink)}
p{margin-bottom:14px}p:last-child{margin-bottom:0}

/* type scale — four levels */
h1,h2,.display{font-family:var(--serif);font-weight:500;letter-spacing:-.015em;line-height:1.04;text-wrap:balance}
h1{font-size:clamp(40px,5.8vw,70px)}
h2{font-size:clamp(28px,3.2vw,34px);font-weight:600;letter-spacing:-.004em;line-height:1.18;margin-bottom:18px}
h2.display{font-size:clamp(36px,5.4vw,66px);font-weight:500;letter-spacing:-.015em;line-height:1.04}
h3{font-family:var(--sans);font-weight:700;font-size:17px;line-height:1.35;margin-bottom:8px}
.lead{font-size:19px;line-height:1.5;color:var(--slate);max-width:60ch}
.ink .lead{color:var(--steel)}
.meta{font-size:13px;line-height:1.5;color:var(--slate)}
.ink .meta{color:var(--steel)}
.eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--slate);margin-bottom:16px}
.ink .eyebrow{color:var(--steel)}
.ev{color:var(--navy)}                 /* evidence marker on light surfaces */

/* surfaces */
.ink{background:var(--ink);color:var(--paper)}
.bone{background:var(--bone)}
.inner{max-width:var(--read);margin:0 auto;padding:0 24px}
.inner.wide{max-width:var(--wide)}
.section{padding:88px 0}
.section.tight{padding:64px 0}
@media(max-width:640px){.section{padding:60px 0}.section.tight{padding:48px 0}}

/* nav */
.nav{position:sticky;top:0;z-index:30;background:var(--ink);color:var(--paper)}
.nav .inner{height:var(--nav);display:flex;align-items:center;gap:24px;position:relative}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;font-weight:700;font-size:15px;letter-spacing:.01em;white-space:nowrap}
.brand img{width:26px;height:auto}
.nav-links{margin-left:auto;display:flex;align-items:center;gap:20px}
.nav-links a{text-decoration:none;font-size:14.5px;color:var(--steel);padding:4px 0;border-bottom:1.5px solid transparent;white-space:nowrap}
.nav-links a:hover{color:var(--paper)}
.nav-links a[aria-current="true"]{color:var(--paper);border-bottom-color:var(--paper)}
.nav-links .lang{font-family:var(--mono);font-size:11px;letter-spacing:.16em;border:1px solid var(--steel);padding:5px 9px;color:var(--paper);margin-left:6px}
.nav-links .lang:hover{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.menu-btn{display:none;margin-left:auto;width:44px;height:44px;background:none;border:0;cursor:pointer;padding:10px;flex-direction:column;justify-content:center;gap:5px}
.menu-btn span{display:block;height:1.5px;background:var(--paper);transition:transform .25s ease,opacity .2s ease}
.menu-btn[aria-expanded="true"] span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.menu-btn[aria-expanded="true"] span:nth-child(2){opacity:0}
.menu-btn[aria-expanded="true"] span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
@media(max-width:1180px){
  .menu-btn{display:flex}
  .nav-links{display:none;position:absolute;left:0;right:0;top:var(--nav);background:var(--ink);flex-direction:column;align-items:stretch;gap:0;padding:8px 24px 20px;border-top:1px solid rgba(251,250,246,.14)}
  .nav-links.open{display:flex}
  .nav-links a{font-size:17px;padding:13px 0;border-bottom:1px solid rgba(251,250,246,.14)}
  .nav-links a[aria-current="true"]{border-bottom-color:rgba(251,250,246,.14);color:var(--paper);font-weight:700}
  .nav-links .lang{align-self:flex-start;margin:16px 0 0;font-size:11px;padding:7px 12px;border:1px solid var(--steel)}
}
@media(max-width:480px){.brand span{font-size:14px}}

/* hero */
.hero{display:flex;flex-direction:column;justify-content:space-between;padding:56px 0 36px}
.hero-grid{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,4fr);gap:48px;align-items:center}
.hero h1{max-width:15ch}
html[lang="uk"] .hero h1{font-size:clamp(34px,4.5vw,58px);max-width:18ch}
.hero .btns{margin-top:30px}
.hero .btns .btn{padding:12px 20px;font-size:15px}
.hero .lead{margin-top:22px;font-size:18px}
.hero h1 .w{display:inline-block;opacity:0;transform:translateY(.35em)}
.js.loaded .hero h1 .w{opacity:1;transform:none;transition:opacity .55s ease,transform .55s cubic-bezier(.2,.7,.2,1);transition-delay:calc(var(--i)*60ms)}
.hero .lead{opacity:0}
.js.loaded .hero .lead{opacity:1;transition:opacity .7s ease .9s}
.no-js .hero h1 .w,.no-js .hero .lead{opacity:1;transform:none}

/* the gate: many signals → one judgment → one consequence */
.gate-fig{width:100%;max-width:560px;justify-self:end}
.gate-fig .gl{stroke:var(--paper);stroke-width:1.5;fill:none;stroke-dasharray:420;stroke-dashoffset:420}
.gate-fig .go{stroke:var(--paper);stroke-width:1.5;fill:none;stroke-dasharray:200;stroke-dashoffset:200}
.gate-fig .gs{fill:var(--paper);opacity:0}
.gate-fig .gq{fill:var(--gold);transform-box:fill-box;transform-origin:center;transform:rotate(45deg) scale(0)}
.gate-fig .gc{fill:none;stroke:var(--paper);stroke-width:1.5;opacity:0}
.gate-fig text{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;fill:var(--steel);text-transform:uppercase}
.js.loaded .gate-fig .gs{opacity:1;transition:opacity .4s ease;transition-delay:calc(.3s + var(--i)*.07s)}
.js.loaded .gate-fig .gl{stroke-dashoffset:0;transition:stroke-dashoffset 1s ease;transition-delay:calc(.7s + var(--i)*.06s)}
.js.loaded .gate-fig .gq{transform:rotate(45deg) scale(1);transition:transform .5s cubic-bezier(.2,.8,.3,1.2) 1.9s}
.js.loaded .gate-fig .go{stroke-dashoffset:0;transition:stroke-dashoffset .7s ease 2.3s}
.js.loaded .gate-fig .gc{opacity:1;transition:opacity .4s ease 2.9s}
.no-js .gate-fig .gs,.no-js .gate-fig .gc{opacity:1}
.no-js .gate-fig .gl,.no-js .gate-fig .go{stroke-dashoffset:0}
.no-js .gate-fig .gq{transform:rotate(45deg) scale(1)}

/* chapter index at the bottom of the hero */
.index{margin-top:56px;border-top:1px solid rgba(251,250,246,.28);display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.index a{display:block;padding:18px 24px 20px 0;text-decoration:none;border-right:1px solid rgba(251,250,246,.14);border-bottom:1px solid rgba(251,250,246,.14)}
.index a:nth-child(3n){border-right:0}
.index a:nth-child(n+4){border-bottom:0}
.index a:not(:nth-child(3n+1)){padding-left:24px}
.index .n{font-family:var(--mono);font-size:11px;letter-spacing:.16em;color:var(--steel);display:block;margin-bottom:10px}
.index b{display:block;font-size:16px;margin-bottom:4px}
.index span:not(.n){font-size:14.5px;color:var(--steel)}
.index a:hover b{text-decoration:underline;text-underline-offset:4px}
@media(max-width:820px){.hero-grid{grid-template-columns:1fr;gap:36px}.gate-fig{justify-self:start;max-width:420px}.index{grid-template-columns:1fr}.index a{border-right:0!important;border-bottom:1px solid rgba(251,250,246,.14)!important;padding-left:0!important}}

/* statement bands */
.statement{padding:120px 0;background:var(--bone);color:var(--ink)}
.statement .display{max-width:22ch}
@media(max-width:640px){.statement{padding:80px 0}}

/* chapters: sticky Ink opener, Paper body slides over it */
.ch{position:relative}
.ch-open{position:sticky;top:var(--nav);min-height:calc(100vh - var(--nav));display:flex;align-items:flex-start;z-index:1;padding:88px 0 64px}
.ch-open .lead{margin-top:22px}
.ch-body{position:relative;z-index:2;background:var(--paper);padding:80px 0 96px}
.ch-body.bone{background:var(--bone)}
.open-grid{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,4fr);gap:56px;align-items:end;width:100%}
.open-grid .lead{max-width:56ch}
@media(max-width:820px){.open-grid{grid-template-columns:1fr;gap:32px}.ch-open{min-height:0;padding:80px 0}}

/* evidence label — CONTEXT · SOURCE · LIMITATION · CONFIDENCE */
.evidence{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 28px;border-top:1px solid rgba(251,250,246,.28);padding-top:22px}
.evidence dt{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--steel);margin-bottom:6px}
.evidence dd{font-size:15px;line-height:1.45}
.light .evidence{border-color:var(--ink)}
.light .evidence dt{color:var(--navy)}

/* research questions */
.qs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 36px;margin-top:40px}
.q{border-top:1px solid var(--ink);padding-top:18px}
.q .qn{font-family:var(--mono);font-size:11px;letter-spacing:.16em;color:var(--slate);display:block;margin-bottom:14px}
.q h3{font-family:var(--serif);font-weight:500;font-size:22px;line-height:1.25;letter-spacing:-.005em;margin-bottom:16px}
.q .prior{border-left:2px solid var(--navy);padding-left:14px;cursor:pointer}
.q .prior .pl{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--navy);display:block}
.q .prior p{font-size:15.5px;max-height:0;overflow:hidden;opacity:0;margin-top:0;transition:max-height .35s ease,opacity .3s ease,margin-top .3s ease}
.q:hover .prior p,.q:focus-within .prior p,.q.on .prior p{max-height:200px;opacity:1;margin-top:8px}
@media(hover:none){.q .prior p{max-height:200px;opacity:1;margin-top:8px}}
@media(max-width:820px){.qs{grid-template-columns:1fr;gap:28px}}

/* buttons — publication, not SaaS */
.btns{display:flex;gap:14px;flex-wrap:wrap;margin-top:34px;align-items:center}
.btn{display:inline-block;text-decoration:none;font-weight:700;font-size:15.5px;padding:13px 22px;border:1.5px solid var(--ink);background:transparent;color:var(--ink);font-family:var(--sans);cursor:pointer;border-radius:0}
.btn.primary{background:var(--ink);color:var(--paper)}
.btn.primary:hover{background:#000}
.btn:not(.primary):hover{background:var(--bone)}
.ink .btn{border-color:var(--paper);color:var(--paper)}
.ink .btn.primary{background:var(--paper);color:var(--ink)}
.ink .btn.primary:hover{background:#fff}
.ink .btn:not(.primary):hover{background:rgba(251,250,246,.1)}
.btn s{text-decoration:line-through;opacity:.55;margin-right:4px;font-weight:400}
.btns .note{font-size:13px;color:var(--slate)}
.ink .btns .note{color:var(--steel)}

/* playbook feature (start here) */
.feature{display:grid;grid-template-columns:minmax(200px,3fr) minmax(0,7fr);gap:48px;align-items:center}
.cover{width:min(300px,100%);box-shadow:0 1px 0 rgba(23,23,23,.15)}
.feature h2{margin-top:6px}
.price{font-family:var(--serif);font-size:24px;font-weight:500;margin:18px 0 0}
.price s{color:var(--slate);font-weight:400;margin-right:6px}
@media(max-width:700px){.feature{grid-template-columns:1fr;gap:28px}.cover{width:min(220px,100%)}}

/* course list — rows, not cards */
.rows{border-top:1px solid var(--ink);margin-top:8px}
.row{display:grid;grid-template-columns:48px minmax(0,1fr) 140px;gap:16px 20px;align-items:start;padding:20px 0;border-bottom:1px solid var(--ink);text-decoration:none;color:inherit}
.row .idx{font-family:var(--mono);font-size:12px;letter-spacing:.14em;color:var(--slate);padding-top:6px}
.row .cell{display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.row .name{font-family:var(--serif);font-size:22px;font-weight:500;line-height:1.2;letter-spacing:-.005em}
.row .ctype{display:inline-block;font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink);border:1px solid var(--ink);padding:3px 8px}
.row .status{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--slate);text-align:right;padding-top:7px}
.row.live .status{color:var(--ink)}
a.row:hover .name{text-decoration:underline;text-underline-offset:5px}
@media(max-width:600px){.row{grid-template-columns:40px 1fr}.row .status{grid-column:2;text-align:left;padding-top:0}}

/* packages */
.packs{border-top:1px solid var(--ink);margin-top:36px}
.pack{display:grid;grid-template-columns:70px 180px minmax(0,1fr) 110px;gap:18px;align-items:baseline;padding:22px 0;border-bottom:1px solid var(--ink)}
.pack .size{font-family:var(--serif);font-size:34px;font-weight:500;line-height:1}
.pack .pname{font-weight:700}
.pack p{font-size:15.5px;margin:0}
.pack .dur{font-size:13px;color:var(--slate);text-align:right;font-family:var(--mono);letter-spacing:.08em;text-transform:uppercase}
@media(max-width:700px){.pack{grid-template-columns:50px 1fr;gap:6px 14px}.pack p,.pack .dur{grid-column:2}.pack .dur{text-align:left}}

/* four canonical blocks (site ↔ playbook) */
.rule{background:var(--paper);border:1px solid var(--steel);border-left:3px solid var(--slate);padding:22px 24px;margin-top:36px;max-width:var(--read)}
.rule .tag,.tag{display:block;font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink);margin-bottom:10px}
.mycase{border-top:2px solid var(--ink);padding-top:20px}
.sign{font-size:13px;color:var(--slate);margin-top:18px}

/* route: eight stages, a lie at each */
.route-wrap{margin-top:36px}
.route{width:100%;height:auto}
.route polyline{stroke:var(--ink);stroke-width:1.6;fill:none;stroke-dasharray:1400;stroke-dashoffset:1400}
.route.drawn polyline{stroke-dashoffset:0;transition:stroke-dashoffset 2.2s ease}
.route .rt-node{cursor:pointer}
.route .rt-hit{fill:transparent;cursor:pointer}
.route .rt-label{cursor:pointer}
.route circle.rt-node{fill:var(--ink)}
.route circle.rt-node.on{r:8}
.route rect.rt-node{fill:var(--gold)}
.route .rt-label{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;fill:var(--slate)}
.route .rt-label.on{fill:var(--ink)}
.route .rt-node:focus{outline:none}
.rt-panel{margin-top:10px;border-top:1px solid var(--ink);padding-top:18px;min-height:150px;max-width:var(--read)}
.rt-stage{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--slate);margin-bottom:8px}
.rt-stage:empty{display:none}
.rt-lie{font-family:var(--serif);font-size:24px;font-weight:500;line-height:1.25;margin-bottom:8px}
.rt-why{font-size:16px;color:var(--slate);margin-bottom:10px}
.rt-what{font-size:15.5px;border-left:2px solid var(--navy);padding-left:14px;color:var(--ink)}
.rt-what:empty{display:none}
.rt-panel.idle .rt-lie{font-size:18px;font-family:var(--sans);font-weight:400;color:var(--slate)}
.rt-panel.idle .tag{visibility:hidden}
.rt-hint{font-size:13px;color:var(--slate);margin-top:14px}
.no-js .route polyline{stroke-dashoffset:0}

/* numbers with denominators */
.nums{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:36px 32px;margin-top:40px}
.num{border-top:1px solid var(--ink);padding-top:18px}
.num .big{font-family:var(--serif);font-size:clamp(48px,6vw,72px);font-weight:500;line-height:1;letter-spacing:-.02em}
.num .what{font-size:16px;margin:10px 0 12px}
.num .den{font-size:14px;line-height:1.5;color:var(--navy);border-top:1px solid var(--steel);padding-top:12px}
@media(max-width:820px){.nums{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:460px){.nums{grid-template-columns:1fr}}

/* founder */
.founder{display:grid;grid-template-columns:minmax(220px,4fr) minmax(0,6fr);gap:56px;align-items:center}
.founder-photo{position:relative;max-width:420px}
.founder-photo::after{content:"";position:absolute;left:0;right:38%;bottom:-12px;height:3px;background:var(--gold)}
@media(max-width:760px){.founder{grid-template-columns:1fr;gap:40px}.founder-photo{max-width:320px}}

/* finale: circle is an input, square is a decision */
.finale{padding:120px 0 110px;text-align:center}
.gate{display:flex;flex-direction:column;align-items:center}
.gate-stage{position:relative;width:min(640px,100%);min-height:260px;display:flex;align-items:center;justify-content:center}
.gate-btn{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:220px;height:220px;border-radius:50%;background:var(--paper);border:0;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;z-index:1;transition:width .55s cubic-bezier(.2,.8,.2,1),height .55s cubic-bezier(.2,.8,.2,1),border-radius .55s ease}
.gate-btn img{width:92px;height:auto;transition:transform .25s ease,opacity .25s ease}
.gate-btn:hover img{transform:scale(1.06)}
.gate-cap{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--steel);margin-top:28px;transition:opacity .3s ease}
.gate-panel{position:relative;z-index:2;visibility:hidden;opacity:0;text-align:left;width:100%;padding:44px 40px 40px;color:var(--ink);transition:opacity .4s ease .35s,visibility 0s linear .35s}
.gate-panel h3{font-family:var(--serif);font-weight:500;font-size:clamp(28px,3.4vw,38px);letter-spacing:-.01em;line-height:1.1;margin-bottom:10px}
.gate-panel p{color:var(--slate);font-size:16px}
.gate-panel .btns{margin-top:26px}
.gate-panel .btn{border-color:var(--ink);color:var(--ink)}
.gate-panel .btn.primary{background:var(--ink);color:var(--paper)}
.gate.open .gate-btn{width:100%;height:100%;border-radius:0;cursor:default}
.gate.open .gate-btn img{opacity:0}
.gate.open .gate-panel{visibility:visible;opacity:1}
.gate.open .gate-cap{opacity:0}
@media(max-width:560px){.gate-panel{padding:32px 24px}}

/* footer */
.footer{background:var(--ink);color:var(--steel);padding:56px 0 44px;font-size:14px;border-top:1px solid rgba(251,250,246,.14)}
.foot-grid{display:grid;grid-template-columns:minmax(220px,1.4fr) 1fr 1fr;gap:40px;align-items:start}
.foot-brand img{width:36px;margin-bottom:16px}
.foot-line{color:var(--paper);font-weight:700;font-size:15px;line-height:1.45}
.foot-nav a,.foot-legal a{display:block;color:var(--steel);text-decoration:none;margin-bottom:9px}
.foot-nav a:hover,.foot-legal a:hover{color:var(--paper)}
.foot-legal .copy{display:block;color:#7d858f;font-size:12.5px;margin-top:16px}
@media(max-width:700px){.foot-grid{grid-template-columns:1fr 1fr}.foot-brand{grid-column:1/-1}}

/* bias aquarium — carried from v12, re-tokenised */
.cloud{display:flex;flex-wrap:wrap;justify-content:center;text-align:center;gap:14px 26px;align-items:baseline;margin-top:36px;padding:44px 28px;position:relative;overflow:hidden;background:var(--paper)}
.bw{background:none;border:0;padding:0;font-family:var(--sans);color:var(--ink);cursor:pointer;line-height:1.1;font-weight:500;position:relative;letter-spacing:-.01em;animation:drift var(--dur,7s) ease-in-out var(--del,0s) infinite alternate;transition:color .2s,transform .2s}
.bw.s1{font-size:14px;color:#8a919b}.bw.s2{font-size:17px;color:var(--slate)}.bw.s3{font-size:21px;font-weight:700}.bw.s4{font-size:26px;font-weight:700}.bw.s5{font-size:32px;font-weight:700;letter-spacing:-.02em}
.bw:hover,.bw:focus-visible,.bw.on{color:var(--gold);transform:scale(1.12);animation-play-state:paused;z-index:2}
@keyframes drift{0%{translate:0 0;rotate:0deg}50%{translate:calc(var(--dx,10px)*.6) calc(var(--dy,-8px)*-.8);rotate:-1.2deg}100%{translate:var(--dx,12px) var(--dy,-9px);rotate:1.2deg}}
.cloud-panel{text-align:center;margin-top:20px;min-height:64px}
.cloud-panel .tag{color:var(--ink);font-size:11px;display:block}
.cloud-panel p{font-size:19px;font-weight:500;max-width:48ch;margin:0 auto}
.modal{position:fixed;inset:0;z-index:50;display:flex;align-items:center;justify-content:center;padding:20px}
.modal[hidden]{display:none}
.modal-back{position:absolute;inset:0;background:rgba(23,23,23,.72)}
.modal-box{position:relative;background:var(--paper);color:var(--ink);max-width:720px;width:100%;padding:34px 34px 30px;border-top:3px solid var(--gold);max-height:90vh;overflow:auto}
.modal-box h3{font-family:var(--serif);font-weight:500;font-size:clamp(24px,3vw,32px);letter-spacing:-.01em;margin:6px 0 10px}
.modal-box .bm-def{font-size:18px;color:var(--slate);margin-bottom:22px}
.bm-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;border-top:1px solid var(--bone);padding-top:20px}
.bm-grid p{font-size:15.5px}
.modal-x{position:absolute;top:12px;right:14px;background:none;border:0;font-size:28px;line-height:1;cursor:pointer;color:var(--slate);font-family:inherit}
.modal-x:hover{color:var(--ink)}
@media(max-width:600px){.bm-grid{grid-template-columns:1fr}.modal-box{padding:26px 20px}}

/* reduced motion: nothing moves that the person did not ask to move */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .hero h1 .w,.hero .lead{opacity:1!important;transform:none!important;transition:none!important}
  .gate-fig .gs,.gate-fig .gc{opacity:1!important;transition:none!important}
  .gate-fig .gl,.gate-fig .go{stroke-dashoffset:0!important;transition:none!important}
  .gate-fig .gq{transform:rotate(45deg) scale(1)!important;transition:none!important}
  .route polyline{stroke-dashoffset:0!important;transition:none!important}
  .bw{animation:none!important;transition:none!important}
  .q .prior{transition:none}
  .gate-btn,.gate-btn img,.gate-panel,.gate-cap{transition:none!important}
  .ch-open{position:relative;top:auto;min-height:0}
}


/* ===== v13 overrides for v12 components (after v13.css) ===== */
/* rhythm: sections are full-bleed, .inner carries the 24px */
.section,.section.bone,.section.ink,.section.tight,.hero-s{padding:88px 0}
.section.bone{padding:72px 0}
.one-thought{padding:96px 0}
@media(max-width:640px){.section,.section.bone,.section.ink,.hero-s{padding:56px 0}.one-thought{padding:64px 0}}

/* inner page opener: Ink, one claim */
.page-open{padding:96px 0 80px}
.page-open h1,.page-open h1.display{font-family:var(--serif);font-weight:500;font-size:clamp(38px,5.4vw,66px);letter-spacing:-.015em;line-height:1.04;max-width:none;margin-bottom:0}
.page-open h1.long,.page-open h1.long.display{font-size:clamp(30px,3.9vw,50px)}
.page-open .lead{max-width:60ch;margin-top:22px}
.page-open .eyebrow{margin-bottom:18px}
.page-open .hero-grid{gap:48px}
.page-open .btns{margin-top:32px}
@media(max-width:640px){.page-open{padding:64px 0 56px}}

/* Brand Book v3.0: no gold in small labels on light; one gold per surface */
.line .idx,.course .idx,.modules .idx{color:var(--slate)}
.tier .size,.qcard .qnum{color:var(--ink)}
ul.dash li::before{color:var(--ink)}
.tier ul li::before{color:var(--slate)}
.faq summary::after{color:var(--ink)}
.card .go{border-bottom-color:var(--ink)}
.card .go:hover{color:var(--slate)}
.cloud-panel .tag{color:var(--ink)}
.tg input{accent-color:var(--ink)}
.ink .eyebrow{color:var(--steel)}
.rt-tag{color:inherit!important}

/* legacy components on Ink */
.ink .tag{color:var(--steel)}
.ink .route polyline{stroke:var(--paper)}
.ink .route circle.rt-node{fill:var(--paper)}
.ink .route rect.rt-node{fill:var(--gold)}
.ink .route .rt-label{fill:var(--steel)}
.ink .route .rt-label.on{fill:var(--paper)}
.ink .rt-panel{border-color:rgba(251,250,246,.28)}
.ink .rt-why,.ink .rt-hint,.ink .note{color:var(--steel)}
.ink .rt-lie{color:var(--paper)}
.ink .card,.ink .tier,.ink .line,.ink .course{border-top-color:var(--paper);background:transparent}
.ink .qt{border-color:rgba(251,250,246,.35)}

/* who we are + cycle figure (homepage) */
.who .lead{max-width:62ch}
.cycle-wrap{margin:36px 0 20px;max-width:660px}
.cycle{width:100%;height:auto;color:var(--ink)}
.cycle text{font-family:var(--mono);font-size:11px;letter-spacing:.14em;fill:var(--slate);text-transform:uppercase}
.cycle-p{max-width:62ch}

/* the old fade-in is gone: everything is visible without JS */
.reveal{opacity:1;transform:none}

/* styleguide (internal) */
.swatch .info{background:var(--paper);border-top:1px solid var(--bone)}

/* ===== v13.1 ===== */
/* rhythm */
h2{margin-bottom:20px}
.lead{margin-bottom:6px}
.btns{margin-top:36px}
.ch-body .btns{margin-top:40px}
.h2-sub{font-size:clamp(24px,2.6vw,28px);margin:72px 0 12px}
.sub-p{max-width:62ch;color:var(--slate);margin-bottom:8px}
.statement{padding:112px 0}
@media(max-width:640px){.statement{padding:72px 0}.h2-sub{margin-top:52px}}

/* who we are: text left, cycle right */
.who-grid{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:56px;align-items:center}
.who-grid .lead{max-width:none}
.who-grid .cycle-p{max-width:none;margin-top:12px}
.cycle-wrap{margin:0;max-width:none}
@media(max-width:820px){.who-grid{grid-template-columns:1fr;gap:36px}.cycle-wrap{max-width:560px}}

/* research: take part */
.part{margin-top:56px;border-top:1px solid var(--ink);padding-top:24px;max-width:var(--read)}
.part h3{font-family:var(--serif);font-weight:500;font-size:24px;margin-bottom:10px}
.part .btns{margin-top:26px}

/* playbook card in the Ink opener */
.pb-card{display:grid;grid-template-columns:minmax(140px,190px) minmax(0,1fr);gap:24px;align-items:end}
.pb-card .cover{width:100%;box-shadow:none}
.pb-card .price{margin:0 0 6px;color:var(--paper)}
.pb-card .price s{color:var(--steel)}
.pb-card .meta{margin-bottom:0}
.pb-card .btns{margin-top:18px;gap:10px}
.pb-card .btn{padding:11px 16px;font-size:14.5px}
@media(max-width:820px){.pb-card{grid-template-columns:minmax(120px,160px) 1fr}}

/* route section inside the playbook chapter */
.route-wrap{margin-top:8px}
.takeaway{margin:44px 0 0;max-width:var(--read)}
.help{margin-top:8px}

/* cloud section: centred, like the cloud itself */
.cloud-sec h2,.cloud-sec .lead{text-align:center;margin-left:auto;margin-right:auto}
.cloud-sec h2{max-width:26ch}

/* decision making: sessions + packages carried from v12 pages, now on Paper */
.tiers{margin-top:24px}
.tier{border-top:1px solid var(--ink)}
.tier .btn{margin-top:18px}
.quiz-note{margin-top:32px}
.quiz{margin-top:12px}
.faq-split{margin-top:80px;border-top:1px solid var(--ink);padding-top:32px}
.faq-split h2{margin-bottom:0}
.faq{margin-top:0}
.split h2{top:calc(var(--nav) + 20px)}
.rotator{width:100%}
.rotator .eyebrow{margin-bottom:12px}
.rq{font-size:clamp(20px,2.2vw,26px)}
.rq-next{margin-top:22px}

/* community / library items */
.items{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px 32px}
.items.four{grid-template-columns:repeat(2,minmax(0,1fr))}
.item{border-top:1px solid var(--ink);padding-top:18px}
.item b{display:block;font-family:var(--serif);font-weight:500;font-size:22px;line-height:1.2;margin-bottom:10px}
.item p{font-size:16px;color:var(--ink)}
.item .go{display:inline-block;margin-top:12px;font-weight:700;text-decoration:none;border-bottom:1.5px solid var(--ink);padding-bottom:2px}
.item .go:hover{color:var(--slate);border-color:var(--slate)}
@media(max-width:820px){.items,.items.four{grid-template-columns:1fr;gap:28px}}

/* about page opener: text left, lockup right */
.about-open{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,3fr);gap:56px;align-items:center}
.about-open .lockup-wide{width:min(300px,100%);margin:0;justify-self:end}
@media(max-width:760px){.about-open{grid-template-columns:1fr}.about-open .lockup-wide{justify-self:start;width:200px;order:-1}}

/* v13.1 · round 2 */
.mycase{background:transparent;border:0;border-top:2px solid var(--ink);padding:22px 0 0;margin:0}
.open-grid{align-items:start}
.ch-open.short{position:relative;top:auto;min-height:0;padding:80px 0 64px}
.ch-open.short + .ch-body{padding-top:64px}
@media (prefers-reduced-motion:reduce){
  .rql{display:grid;min-height:0}
  .rq{grid-area:1/1;position:static;opacity:0;transform:none;transition:none;font-size:clamp(20px,2.2vw,26px);margin:0;max-width:none;pointer-events:none}
  .rq.on{opacity:1;pointer-events:auto}
  .rq-next{display:inline-block}
}
.route-wrap .rt-lie{color:var(--ink)}
.ink .route-wrap .rt-lie{color:var(--paper)}
.route .rt-node:hover,.route .rt-node.on{fill:var(--ink)}
.route circle.rt-node.on{r:8;stroke:var(--paper);stroke-width:2}
.route rect.rt-node:hover,.route rect.rt-node.on{fill:var(--gold);stroke:var(--ink);stroke-width:2}
.ink .route .rt-node:hover,.ink .route circle.rt-node.on{fill:var(--paper);stroke:var(--ink)}

/* ===== v13.2 · 03.09 brainstorm ===== */
/* hero: smaller type so both buttons sit on the first screen */
.hero{padding:48px 0 56px;min-height:0}
.hero h1{font-size:clamp(34px,4.6vw,56px);max-width:16ch}
html[lang="uk"] .hero h1{font-size:clamp(30px,3.9vw,48px);max-width:20ch}
.hero .lead{font-size:17px;max-width:54ch;margin-top:18px}
.hero .btns{margin-top:26px}
.hero-grid{grid-template-columns:minmax(0,11fr) minmax(0,9fr);gap:40px}
.gate-fig{max-width:520px}
@media(max-width:820px){.hero{padding:36px 0 44px}.gate-fig{max-width:360px}}

/* products: its own screen with a headline */
.products .lead{max-width:62ch}
.prods{margin-top:36px;border-top:1px solid var(--ink)}
.prod{display:grid;grid-template-columns:48px 190px minmax(0,1fr) auto;gap:14px 24px;align-items:start;padding:24px 0;border-bottom:1px solid var(--ink);text-decoration:none;color:inherit}
.prod .pn{font-family:var(--mono);font-size:12px;letter-spacing:.14em;color:var(--slate);padding-top:9px}
.prod .pline{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--slate);padding-top:10px}
.prod .pt{font-family:var(--serif);font-size:24px;font-weight:500;line-height:1.2;letter-spacing:-.005em;grid-column:3}
.prod .pd{grid-column:3;font-size:15.5px;color:var(--ink);max-width:58ch}
.prod .pgo{grid-column:4;grid-row:1/3;align-self:start;font-weight:700;font-size:15px;white-space:nowrap;border-bottom:1.5px solid var(--ink);padding:9px 0 2px}
.prod:hover .pt{text-decoration:underline;text-underline-offset:5px}
.prod:hover .pgo{color:var(--slate);border-color:var(--slate)}
@media(max-width:820px){.prod{grid-template-columns:40px 1fr}.prod .pline{grid-column:2}.prod .pt,.prod .pd{grid-column:2}.prod .pgo{grid-column:2;grid-row:auto;justify-self:start}}

/* who we are: cycle labels one step up */
.cycle text{font-size:13px;letter-spacing:.12em}
.who.bone .lead{color:var(--slate)}
.statement.paper{background:var(--paper)}

/* contacts inside the gate panel */
.gate-panel .contacts{margin-top:22px;border-top:1px solid var(--steel);padding-top:14px;display:flex;flex-wrap:wrap;gap:8px 22px}
.gate-panel .contacts a{font-size:14.5px;color:var(--ink);text-decoration:none;border-bottom:1px solid var(--steel)}
.gate-panel .contacts a:hover{border-color:var(--ink)}

/* inner pages: sticky opener, body slides over it (the transition the team liked) */
.page-open{position:sticky;top:var(--nav);z-index:1;min-height:calc(100vh - var(--nav));display:flex;align-items:center}
.page-open .inner{width:100%}
.page-body{position:relative;z-index:2;background:var(--paper)}
.page-open.goldbg{background:var(--goldbg);color:var(--ink)}
.page-open.goldbg .eyebrow{color:var(--slate)}
.page-open.goldbg .lead{color:var(--ink)}
.page-open.goldbg .pprice s{color:var(--slate)}
.page-open.goldbg .meta{color:var(--slate);margin-top:8px}
.page-open.goldbg .btn{border-color:var(--ink);color:var(--ink)}
.page-open.goldbg .btn.primary{background:var(--ink);color:var(--paper)}
.pb-cover{width:min(380px,100%);box-shadow:0 18px 40px -18px rgba(23,23,23,.45),0 1px 0 rgba(23,23,23,.2)}
.page-open .hero-grid.cover-left{grid-template-columns:minmax(220px,4fr) minmax(0,6fr);align-items:center}
@media(max-width:820px){.page-open{position:relative;top:auto;min-height:0}.page-open .hero-grid.cover-left{grid-template-columns:1fr}.pb-cover{width:min(240px,100%)}}
@media (prefers-reduced-motion:reduce){.page-open{position:relative;top:auto;min-height:0}}
.page-open.legal-open{min-height:0;position:relative;top:auto;padding:72px 0 56px}

/* playbook page: route tighter, hairline full width, no stage line */
.route-wrap.tight{margin-top:0}
.route-wrap.tight .route{max-width:900px;margin:0 auto}
.rt-panel.wide{max-width:none;margin-top:4px;min-height:120px}
.rt-panel.wide .rt-lie{font-size:22px}
.route-wrap.tight .rt-hint{margin-top:10px}
.pb-final{text-align:center;padding:112px 0}
.pb-final .display{max-width:none;margin:0 auto 34px}
.btns.center{justify-content:center}
.btn.big{font-size:18px;padding:18px 34px}

/* cloud on the playbook page: no hint line under the aquarium */
.cloud-panel{min-height:0;margin-top:16px}
.cloud-panel:empty{display:none}

/* course pages: the "what's inside" list overflowed — nested divs inherited the grid */
.modules > div{display:grid;grid-template-columns:44px 1fr;gap:16px}
.modules > div > div{display:block;grid-template-columns:none}
.modules .idx{color:var(--slate)}

/* consult page: for-business block */
#business .tiers{margin-top:28px}
#business .tier .meta{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--slate)}
/* rotator on a light surface (consult page: the Ink block after the opener became Bone) */
.section:not(.ink) .rotator .rq{color:var(--ink)}
.section:not(.ink) .rotator .rq::before,.section:not(.ink) .rotator .rq::after{color:var(--gold)}
.section:not(.ink) .rotator .rq-next{border-color:var(--ink);color:var(--ink)}
.section:not(.ink) .rotator .rq-next:hover{background:var(--ink);color:var(--paper)}
.rt-panel.idle .rt-lie{color:var(--ink);font-size:16px}
@media(max-width:820px){.hero-grid{grid-template-columns:1fr;gap:28px}.gate-fig{max-width:340px;justify-self:start}.hero h1,html[lang="uk"] .hero h1{max-width:none}}

/* ===== v13.3 · Figma board 03–04.09 ===== */
/* 1. no overlapping transitions anywhere: openers are ordinary sections */
.page-open,.ch-open,.page-open.legal-open{position:relative;top:auto;min-height:0;z-index:auto;display:block;padding:80px 0 72px}
.page-body{position:static;z-index:auto;background:transparent}
.open-grid{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,4fr);gap:56px;align-items:start}
.open-grid .btns{margin-top:30px}
@media(max-width:820px){.open-grid{grid-template-columns:1fr;gap:32px}.page-open{padding:56px 0 48px}}
.page-open h1.display{font-size:clamp(36px,4.8vw,60px)}
html[lang="uk"] .page-open h1.display{font-size:clamp(32px,4.2vw,54px)}

/* 2. vector logos */
.brand-mark{width:26px;height:auto;display:block}
.foot-mark{width:38px;height:auto;display:block;margin-bottom:16px}
.lockup{width:min(300px,100%);height:auto;justify-self:end}
.home-hero .lockup{width:min(320px,100%)}
.about-open{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,3fr);gap:56px;align-items:center}
@media(max-width:760px){.about-open{grid-template-columns:1fr}.lockup{width:200px;justify-self:start;order:-1}}
.gate-mark{width:92px;height:auto}

/* 3. homepage: hero + products + contacts */
.home-hero{padding:72px 0 64px}
.home-hero h1{font-size:clamp(34px,4.6vw,56px);max-width:16ch}
html[lang="uk"] .home-hero h1{font-size:clamp(30px,3.9vw,48px);max-width:20ch}
.home-hero .lead{max-width:58ch;margin-top:18px}
.home-hero .btns{margin-top:28px}
.products h2{margin-bottom:28px}
.lines{margin-top:0}
.line .idx{color:var(--slate)}
.line.announce{cursor:default}
.line.announce b,.line.announce span{color:var(--slate)}
.soon{display:inline-block;margin-top:10px;font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;font-style:normal;color:var(--ink);border:1px solid var(--ink);padding:3px 8px}
.find .lead{max-width:52ch}
.find .btns{margin-top:28px}

/* 4. playbook: heading close to the top, one stage line, only "buy" */
.tightop{padding-top:48px}
.rt-panel .rt-stage{display:none}
.price .disc{display:inline-block;margin-left:10px;font-family:var(--sans);font-size:13px;font-weight:700;letter-spacing:.02em;border:1px solid currentColor;padding:3px 8px;vertical-align:middle}
.page-open.goldbg .price{color:var(--ink)}
.page-open.goldbg .pb-card .cover{box-shadow:0 18px 40px -18px rgba(23,23,23,.45),0 1px 0 rgba(23,23,23,.2)}

/* 5. consulting: wider text, "30 minutes" on one line, rotator without "next" */
.lead.full,.sub-p.full{max-width:none}
.tier .size{font-size:30px;line-height:1.1;letter-spacing:-.01em}
.rotator .rq-next{display:none}
.rql{min-height:150px}

/* 6. research questions without hidden layers */
.qs.noprior .q{cursor:default}
.qs.noprior .q h3{margin-bottom:0}

/* 7. survey */
.survey{max-width:var(--read)}
.sblock{margin-top:44px}
.sblock h2{font-size:24px;margin-bottom:8px;padding-bottom:12px;border-bottom:1px solid var(--ink)}
.sq{border:0;padding:22px 0 8px;margin:0;border-bottom:1px solid var(--steel)}
.sq legend{font-weight:700;font-size:16.5px;line-height:1.4;padding:0;margin-bottom:12px;display:flex;gap:14px;align-items:baseline}
.sq legend .qn{font-family:var(--mono);font-size:11px;letter-spacing:.14em;color:var(--slate);flex:0 0 auto}
.opts{display:flex;flex-wrap:wrap;gap:8px 10px}
.opt{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--ink);padding:8px 12px;font-size:14.5px;cursor:pointer;background:var(--paper)}
.opt input{margin:0;accent-color:var(--ink)}
.opt:has(input:checked){background:var(--ink);color:var(--paper)}
.opt.check{border:0;padding:6px 0;display:flex}
.contact .fields{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}
.contact label span{display:block;font-size:13px;color:var(--slate);margin-bottom:6px}
.contact input[type=email],.contact input[type=text]{width:100%;border:1px solid var(--ink);background:var(--paper);padding:10px 12px;font:inherit;font-size:15px;border-radius:0}
.sv-thanks{margin-top:24px;border-left:3px solid var(--gold);padding-left:16px;font-size:17px}
@media(max-width:600px){.contact .fields{grid-template-columns:1fr}}
.section:not(.ink) .rt-panel .rt-lie{color:var(--ink)}
.section:not(.ink) .rt-panel.idle .rt-lie{color:var(--ink)}
@media(max-width:760px){.home-hero .lockup{width:180px}}

/* ===== v13.4 · board «правки 2» ===== */
/* homepage hero back to v13.1 (gate figure) with the two buttons */
.hero{padding:56px 0 56px}
.hero h1{max-width:15ch}
.hero .lead{max-width:54ch}
/* announce badge: top right of the Community line, next to the title */
.line b{display:flex;align-items:center;justify-content:space-between;gap:12px}
.line b .soon{margin:0;flex:0 0 auto}
.products.bone{background:var(--bone)}
.products.bone .line{background:transparent}
/* who: cycle labels a touch bigger */
.cycle text{font-size:14px}
.who .lead{color:var(--slate)}
/* consult: rotator centred vertically; same heading style for the three blocks */
.open-grid.centered{align-items:center}
.open-grid.centered .rotator{align-self:center}
.h2-same{font-size:clamp(28px,3.2vw,34px);font-weight:600;letter-spacing:-.004em;line-height:1.18;margin:64px 0 18px}
.lead.full{font-size:19px;line-height:1.5;color:var(--slate)}
/* research: the join block after the statement */
.part.top{margin-top:0;border-top:0;padding-top:0}
/* course pages: index and module title on one baseline */
.modules > div{align-items:baseline}
.modules .idx{line-height:1.35}
.modules b{margin:0}
/* about opener: old layout, no buttons */
.about-open .lockup{width:min(320px,100%)}
/* library heading on one line (EN) */
.page-library .page-open h1.display{max-width:none}

/* ===== v13.5 · board «правки 2», round 3 ===== */
/* playbook: discount as plain text; aquarium fits one screen with its panel */
.price .disc{display:none}
.cloud{padding:26px 22px;gap:8px 18px;max-height:none}
.bw.s1{font-size:12.5px}.bw.s2{font-size:15px}.bw.s3{font-size:18px}.bw.s4{font-size:22px}.bw.s5{font-size:27px}
.cloud-panel{margin-top:14px;min-height:56px}
.cloud-panel p{font-size:17px}
/* consult: who this is for */
.auds-s{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px 24px;margin-top:8px}
.aud-s{border-top:1px solid var(--ink);padding-top:12px}
.aud-s b{display:block;font-size:15.5px;margin-bottom:4px}
.aud-s span{font-size:14.5px;color:var(--slate)}
@media(max-width:820px){.auds-s{grid-template-columns:repeat(2,minmax(0,1fr))}}
.tiers + .btns{margin-top:28px}
/* course pages: dividers between modules */
.modules > div{padding:14px 0;border-bottom:1px solid var(--steel)}
.modules > div:last-child{border-bottom:0}
/* survey: no dividers, options close to the question, gold selection */
.sq{border-bottom:0;padding:18px 0 6px}
.sq legend{margin-bottom:8px}
.sblock h2{border-bottom:1px solid var(--ink)}
.opt:has(input:checked){background:var(--gold);color:var(--ink);border-color:var(--gold)}
.opt input{accent-color:var(--gold)}
.sq{padding:28px 0 2px}
.sq legend{margin-bottom:10px}

/* ===== v13.6 · «правки 4» ===== */
/* survey: options right under the question, air between questions, readable selection (class set by JS, no :has) */
.sq{padding:30px 0 0}
.sq legend{margin-bottom:6px}
.opts{gap:6px 8px}
.opt{padding:7px 11px}
.opt.on,.opt:has(input:checked){background:var(--ink);color:var(--paper);border-color:var(--ink)}
.opt.on input,.opt input{accent-color:var(--ink)}
.opt.on input{accent-color:var(--paper)}
.sblock + .sblock{margin-top:56px}

/* ===== v13.7 · «правки 5» (скріншоти борду) ===== */
/* nav: log in / register */
.nav-auth{display:inline-flex;gap:8px;margin-left:8px}
.nav-links .auth{font-size:13.5px;padding:6px 12px;border:1px solid var(--steel);color:var(--paper);border-bottom-width:1px}
.nav-links .auth:hover{border-color:var(--paper)}
.nav-links .auth.solid{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.nav-links .auth.solid:hover{background:#fff}
@media(max-width:1180px){.nav-auth{margin:16px 0 0;gap:10px}.nav-links .auth{border-bottom-width:1px;padding:10px 16px;font-size:15px}}
/* auth pages */
.auth-form{max-width:520px}
.auth-form .fields{display:grid;gap:16px}
.auth-form label span{display:block;font-size:13px;color:var(--slate);margin-bottom:6px}
.auth-form input[type=email],.auth-form input[type=password],.auth-form input[type=text]{width:100%;border:1px solid var(--ink);background:var(--paper);padding:12px 14px;font:inherit;font-size:16px;border-radius:0}
.auth-form .opt.check{margin-top:14px;align-items:flex-start}
.auth-form .opt.check span{font-size:15px}
.auth-form .opt.check a{color:var(--ink)}
.auth-form .opt.check.req span::after{content:" *";color:var(--gold)}
.auth-form .btns{margin-top:26px}
.auth-links{margin-top:10px;font-size:14px}.auth-links a{color:var(--slate)}
.auth-switch{margin-top:22px;font-size:15px}.auth-switch a{font-weight:700}
.auth-note{margin-top:28px;max-width:52ch}
/* course 1: gold opener, back link, notify form, locked cover */
.course-grid{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:56px;align-items:center}
.course-open .back{display:inline-block;font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;color:var(--slate);margin-bottom:28px}
.course-open .back:hover{color:var(--ink)}
.course-open .lead{color:var(--ink)}
.notify{display:flex;gap:10px;flex-wrap:wrap;margin-top:30px;align-items:stretch}
.notify input[type=email]{flex:1 1 260px;border:1px solid var(--ink);background:var(--paper);padding:12px 14px;font:inherit;font-size:15px;border-radius:0}
.notify .btn{border-color:var(--ink)}
.notify .nt-thanks{flex-basis:100%;margin:6px 0 0}
.locked{position:relative;margin:0;overflow:hidden;background:var(--ink)}
.locked img{width:100%;height:auto;display:block;filter:blur(7px) brightness(.8);transform:scale(1.04)}
.locked .lock{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.locked .lock svg{filter:drop-shadow(0 2px 10px rgba(0,0,0,.4))}
@media(max-width:820px){.course-grid{grid-template-columns:1fr;gap:32px}}
/* programs: rows without pages are plain */
.row:not(.live) .name{color:var(--ink)}

/* ===== v13.8 · «правки 6» ===== */
/* on-site fragment reader */
.reader{padding:56px 0 72px;background:var(--bone)}
.fpages{max-width:820px;margin:0 auto;display:grid;gap:28px}
.fpage{margin:0}
.fpage img{width:100%;height:auto;display:block;box-shadow:0 1px 0 rgba(23,23,23,.18),0 18px 40px -22px rgba(23,23,23,.35);background:var(--paper)}
.fpage figcaption{font-family:var(--mono);font-size:11px;letter-spacing:.14em;color:var(--slate);text-align:right;margin-top:8px}
.pb-final .lead{color:var(--steel)}

/* ===== v13.9 · language switch top-left, log in / register top-right ===== */
.nav .inner{gap:18px}
.nav-lang{order:-1;margin:0 4px 0 0;font-family:var(--mono);font-size:11px;letter-spacing:.16em;border:1px solid var(--steel);padding:5px 9px;color:var(--paper);text-decoration:none}
.nav-lang:hover{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.nav-links{margin-left:auto}
.nav-auth{margin-left:22px}
.nav-links .auth.solid{margin-right:0}
@media(max-width:1180px){.nav-auth{margin:16px 0 0}}
@media(max-width:480px){.nav-lang{padding:4px 7px;font-size:10px}.brand span{font-size:13px}}

/* ===== v13.9 ===== */
/* nav: language switch top-left, log in / register top-right */
.nav .inner{gap:18px}
.lang-left{order:-1;margin:0 4px 0 0}
.nav-links .lang{display:none}
.nav-auth{margin-left:auto;gap:8px}
.nav-links{margin-left:auto}
@media(max-width:1180px){.nav-auth{margin:16px 0 0}.lang-left{margin-right:0}}
/* fragment: the cut PDF embedded directly */
.fembed{max-width:900px;margin:0 auto;background:var(--paper);box-shadow:0 1px 0 rgba(23,23,23,.18),0 18px 40px -22px rgba(23,23,23,.35)}
.fembed iframe{display:block;width:100%;height:calc(100vh - 120px);min-height:640px;border:0}

/* ===== v13.9.1 · nav to the corners ===== */
.nav .inner{max-width:none;padding:0 28px}
.lang-left{margin:0 20px 0 0}
.nav-auth{margin-left:28px}
@media(max-width:1180px){.nav .inner{padding:0 20px}}

