/* ============================================================
   ТОКЕНЫ
   ============================================================ */
:root{
  /* ТЁПЛАЯ БУМАГА · ЧЕРНИЛЬНАЯ СИНЬ · СЛИВА
     Фон снят с фона студийного портрета.
     Тёмный - цвет стены за стеллажом со второй фотографии.
     Слива - выбор Ренаты, единственный насыщенный цвет на странице. */
  --bg:#F2F1ED;           /* бумага с фотографии */
  --bg-soft:#EAE8E2;      /* приглушённая полоса */
  --surface:#F7F6F2;      /* врезки */
  --ink:#16252F;          /* чернильная синь со стены */
  --ink-2:#48575F;        /* второстепенный текст */
  --ink-3:#5F6D76;        /* подписи и метки */
  --rule:#D9D6CF;         /* линии - тёплые */
  --rule-soft:#E6E3DC;
  --accent:#50394F;       /* слива: кнопки и ссылки */
  --accent-deep:#3C2B3C;  /* слива глубже - фон при наведении */
  --accent-soft:rgba(80,57,79,.10);
  --gap-color:var(--bg);  /* цвет зазора между кнопкой и обводкой */
  --clay-ink:#50394F;     /* нумерация и метки - та же слива, без разбавленных копий */
  --clay-soft:rgba(80,57,79,.09);
  --olive-ink:#5F6D76;    /* надзаголовки - в чернильном семействе */
  --on-accent:#F2F1ED;
  --shade:#182B39;        /* тёмные развороты - стена, чернильная синь */
  --shade-ink:#F2F1ED;
  --shade-ink-2:#9EAAB2;
  --shade-rule:rgba(242,241,237,.20);
  --shade-accent:#C9A0B4;

  --serif:"Literata","PT Serif",Georgia,"Times New Roman",serif;
  --sans:"Manrope","Helvetica Neue",Arial,sans-serif;

  --measure:34rem;
  --page:76rem;
  --rail:11rem;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#121A20;
    --bg-soft:#172128;
    --surface:#1B262D;
    --ink:#E8E7E2;
    --ink-2:#A9B4BB;
    --ink-3:#818E96;
    --rule:rgba(232,231,226,.17);
    --rule-soft:rgba(232,231,226,.09);
    --accent:#C9A0B4;
    --accent-deep:#A87C92;
    --gap-color:var(--bg);
    --accent-soft:rgba(201,160,180,.14);
    --clay-ink:#C9A0B4;
    --clay-soft:rgba(201,160,180,.12);
    --olive-ink:#8E9AA2;
    --on-accent:#121A20;
    --shade:#1E2B35;
    --shade-ink:#F2F1ED;
    --shade-ink-2:#9EAAB2;
    --shade-rule:rgba(242,241,237,.18);
    --shade-accent:#C9A0B4;
  }
}
:root[data-theme="dark"]{
  --bg:#121A20;
  --bg-soft:#172128;
  --surface:#1B262D;
  --ink:#E8E7E2;
  --ink-2:#A9B4BB;
  --ink-3:#818E96;
  --rule:rgba(232,231,226,.17);
  --rule-soft:rgba(232,231,226,.09);
  --accent:#C9A0B4;
  --accent-deep:#A87C92;
  --gap-color:var(--bg);
  --accent-soft:rgba(201,160,180,.14);
  --clay-ink:#C9A0B4;
  --clay-soft:rgba(201,160,180,.12);
  --olive-ink:#8E9AA2;
  --on-accent:#121A20;
  --shade:#1E2B35;
  --shade-ink:#F2F1ED;
  --shade-ink-2:#9EAAB2;
  --shade-rule:rgba(242,241,237,.18);
  --shade-accent:#C9A0B4;
}

/* ============================================================
   ОСНОВА
   ============================================================ */
*{box-sizing:border-box}
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--sans);
  font-weight:350;
  font-size:1.0625rem;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{max-width:100%;display:block}
a{color:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}

h1,h2,h3,h4{font-family:var(--serif);font-weight:400;text-wrap:balance;margin:0;line-height:1.15}
h1{font-size:clamp(2.3rem,5.2vw,3.9rem);letter-spacing:-.015em}
h2{font-size:clamp(1.65rem,3.2vw,2.4rem);letter-spacing:-.01em}
h3{font-size:1.32rem;line-height:1.3}
h4{font-family:var(--sans);font-size:.95rem;font-weight:600;letter-spacing:.01em}
p{margin:0}

/* выделенное слово в заголовке первого экрана */
.hl{font-style:normal;color:var(--accent)}

.eyebrow{
  font-family:var(--sans);
  font-size:.7rem;
  font-weight:600;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--olive-ink);
}
.lede{font-family:var(--serif);font-size:clamp(1.15rem,2vw,1.4rem);line-height:1.55;color:var(--ink-2);font-weight:300}
.small{font-size:.9rem;color:var(--ink-3);line-height:1.6}
.measure{max-width:var(--measure)}
em{font-style:italic}

/* поле для будущих данных */
.fill{
  background:var(--clay-soft);
  color:var(--clay-ink);
  padding:0 .3em;
  font-family:var(--sans);
  font-size:.9em;
  border-bottom:1px dashed var(--clay-ink);
  box-decoration-break:clone;-webkit-box-decoration-break:clone;
}

/* ============================================================
   ШАПКА
   ============================================================ */
.top{
  position:sticky;top:0;z-index:60;
  background:color-mix(in srgb, var(--bg) 88%, transparent);
  backdrop-filter:saturate(140%) blur(10px);
  border-bottom:1px solid var(--rule-soft);
}
.top-in{
  max-width:var(--page);margin:0 auto;padding:0 1.5rem;
  height:4.5rem;display:flex;align-items:center;gap:1.5rem;
}
.brand{
  font-family:var(--serif);font-size:1.06rem;letter-spacing:.01em;
  text-decoration:none;white-space:nowrap;line-height:1.15;
}
.brand span{display:block;font-family:var(--sans);font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-3);margin-top:.15rem}
nav.main{margin-left:auto;display:flex;align-items:center;gap:.35rem}
.navlink{
  font-size:.9rem;text-decoration:none;color:var(--ink-2);
  padding:.5rem .7rem;border-radius:0;position:relative;background:none;border:0;
  font-family:var(--sans);cursor:pointer;
}
.navlink:hover{color:var(--ink)}
.navlink[aria-current="true"]{color:var(--ink)}
.navlink[aria-current="true"]::after{
  content:"";position:absolute;left:.7rem;right:.7rem;bottom:.15rem;height:1px;background:var(--accent);
}
.has-menu{position:relative}
.menu{
  position:absolute;top:calc(100% + .4rem);left:-.5rem;min-width:19rem;
  background:var(--surface);border:1px solid var(--rule);
  padding:.4rem;display:none;box-shadow:0 18px 40px -28px rgba(0,0,0,.5);
}
.has-menu.open .menu{display:block}
.menu a{
  display:block;text-decoration:none;padding:.6rem .7rem;line-height:1.35;
}
.menu a:hover{background:var(--bg-soft)}
.menu a b{display:block;font-family:var(--serif);font-weight:400;font-size:1rem}
.menu a i{display:block;font-style:normal;font-size:.8rem;color:var(--ink-3);margin-top:.1rem}
.chev{display:inline-block;margin-left:.3rem;font-size:.6rem;vertical-align:.1em;color:var(--ink-3)}

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  font-family:var(--sans);font-size:.9rem;font-weight:500;
  padding:.78rem 1.4rem;text-decoration:none;cursor:pointer;border-radius:3px;
  background:var(--accent);color:var(--on-accent);border:1px solid var(--accent);
  /* в покое - ничего лишнего; кольцо нулевой ширины, чтобы было чему расти */
  box-shadow:0 0 0 0 var(--gap-color), 0 0 0 0 var(--accent);
  transition:box-shadow .24s cubic-bezier(.2,.7,.3,1), transform .24s cubic-bezier(.2,.7,.3,1), background .2s ease;
}
.btn:hover,.btn:focus-visible{
  background:var(--accent-deep);
  box-shadow:0 0 0 3px var(--gap-color), 0 0 0 4px var(--accent);
  transform:translateY(-1px);
}
.btn:focus-visible{outline:none}
.btn:active{transform:translateY(0)}
.btn.ghost{
  background:transparent;color:var(--ink);border-color:var(--rule);
  box-shadow:0 0 0 0 var(--gap-color), 0 0 0 0 var(--rule);
}
.btn.ghost:hover,.btn.ghost:focus-visible{
  background:transparent;border-color:var(--ink);
  box-shadow:0 0 0 3px var(--gap-color), 0 0 0 4px var(--rule);
}
.btn.small{padding:.58rem 1.05rem;font-size:.85rem}
@media (prefers-reduced-motion:reduce){.btn,.btn:hover,.btn:focus-visible{transform:none}}

.burger{display:none;margin-left:auto;background:none;border:1px solid var(--rule);padding:.55rem .7rem;cursor:pointer;color:var(--ink);font-size:.85rem;font-family:var(--sans)}

/* мобильное меню */
.mobile{display:none;border-bottom:1px solid var(--rule-soft);background:var(--bg)}
.mobile.open{display:block}
.mobile a{display:block;text-decoration:none;padding:.85rem 1.5rem;border-top:1px solid var(--rule-soft);font-size:1rem}
.mobile .grp{padding:1rem 1.5rem .2rem;border-top:1px solid var(--rule-soft)}

/* ============================================================
   СЕТКА СТРАНИЦЫ
   ============================================================ */
main{display:block}
.page{display:block}
[id^="a-"]{scroll-margin-top:6rem}
@keyframes fade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

.wrap{max-width:var(--page);margin:0 auto;padding:0 1.5rem}
.band{padding-block:clamp(3.5rem,8vw,6.5rem);border-top:1px solid var(--rule-soft)}
.band.tight{padding-block:clamp(2.5rem,5vw,4rem)}
.band.first{border-top:0}
.band.soft{background:var(--bg-soft);--gap-color:var(--bg-soft)}
.band.shade{background:var(--shade);color:var(--shade-ink);border-top:0;--gap-color:var(--shade)}
.band.shade.quote-band{padding-block:clamp(5rem,11vw,9rem)}
.band.shade .eyebrow{color:var(--shade-ink-2)}
.band.shade .lede,.band.shade .small{color:var(--shade-ink-2)}
.band.shade a{color:var(--shade-accent)}
.band.shade .rule{background:var(--shade-rule)}

/* разворот: узкий рельс + контент */
.spread{display:grid;grid-template-columns:var(--rail) minmax(0,1fr);gap:clamp(1.5rem,4vw,3.5rem)}
.rail{padding-top:.45rem}
.rail .eyebrow{display:block}
.rail .railnote{display:block;margin-top:.6rem;}
.rail > .railnote:first-child{margin-top:0;}
.rail .railnote{font-size:.8rem;color:var(--ink-3);line-height:1.5}
.stack{display:flex;flex-direction:column;gap:1.4rem;align-items:flex-start}
.stack.wide{gap:2.2rem}
.rule{height:1px;background:var(--rule);width:100%}

@media (max-width:860px){
  .spread{grid-template-columns:1fr;gap:1rem}
  .rail{padding-top:0}
}

/* ============================================================
   ГЕРОЙ
   ============================================================ */
.hero{padding-block:clamp(1.8rem,4vw,3.2rem) clamp(3rem,6vw,4.5rem)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.95fr);gap:clamp(2rem,5vw,4rem);align-items:end}
.hero h1{margin-top:1.2rem}
.hero .lede{margin-top:1.6rem;max-width:32rem}
.hero-cta{display:flex;flex-wrap:wrap;gap:1.1rem;margin-top:2.2rem}
.hero-meta{display:flex;flex-wrap:wrap;gap:.5rem 1.6rem;margin-top:2.2rem;padding-top:1.2rem;border-top:1px solid var(--rule-soft);font-size:.85rem;color:var(--ink-3)}
.hero-meta a{color:var(--ink-3);text-decoration:none;border-bottom:1px solid var(--rule);transition:color .18s ease,border-color .18s ease}
.hero-meta a:hover{color:var(--accent);border-bottom-color:var(--accent)}
.hero-meta a::after{content:" ↗";font-size:.85em;opacity:.6}
@media (max-width:860px){.hero-grid{grid-template-columns:1fr}}

/* анимация появления */
.rise{opacity:0;transform:translateY(14px);animation:rise .9s cubic-bezier(.2,.7,.3,1) forwards}
.rise:nth-child(1){animation-delay:.05s}
.rise:nth-child(2){animation-delay:.14s}
.rise:nth-child(3){animation-delay:.23s}
.rise:nth-child(4){animation-delay:.32s}
@keyframes rise{to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){
  .rise{animation:none;opacity:1;transform:none}
  .page.active{animation:none}
}


/* фотографии */
.photo{position:relative;width:100%;background-color:var(--bg-soft);background-size:cover;border:0}
.photo.studio{-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 9%),linear-gradient(to right,transparent 0,#000 7%,#000 94%,transparent 100%);-webkit-mask-composite:source-in;mask-image:linear-gradient(to bottom,transparent 0,#000 9%),linear-gradient(to right,transparent 0,#000 7%,#000 94%,transparent 100%);mask-composite:intersect;background-image:url(/img/studio.jpg);background-position:50% 22%}
.photo.office{background-image:url(/img/office.jpg);background-position:50% 40%}
.photo.p45{aspect-ratio:4/5}
.photo.p32{aspect-ratio:3/2}
.photo.p11{aspect-ratio:1/1}
.photo.p219{aspect-ratio:21/9}

/* ============================================================
   СЛОТЫ ПОД ФОТО
   ============================================================ */
.ph{
  position:relative;width:100%;
  background:
    repeating-linear-gradient(-45deg,transparent 0 13px,var(--rule-soft) 13px 14px),
    var(--clay-soft);
  border:1px solid var(--rule);
  display:grid;place-items:center;padding:1.25rem;
}
.ph-label{
  font-family:var(--sans);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--clay-ink);background:var(--bg);padding:.45rem .7rem;border:1px solid var(--rule-soft);
  text-align:center;line-height:1.5;max-width:100%;
}
.band.shade .ph-label{background:var(--shade);color:var(--shade-ink-2);border-color:var(--shade-rule)}
.band.shade .ph{border-color:var(--shade-rule)}
.ph.p45{aspect-ratio:4/5}
.ph.p11{aspect-ratio:1/1}
.ph.p32{aspect-ratio:3/2}
.ph.p169{aspect-ratio:16/9}
.ph.p219{aspect-ratio:21/9}

/* ============================================================
   КАРТОЧКИ ФОРМАТОВ
   ============================================================ */
.formats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--rule);border:1px solid var(--rule)}
.fmt{
  background:transparent;padding:clamp(1.5rem,3vw,2.2rem);
  display:flex;flex-direction:column;gap:.75rem;text-decoration:none;
  transition:background .2s ease;min-height:100%;position:relative;
}
.fmt::before{
  content:"";width:1.8rem;height:2px;background:var(--accent);
  margin-bottom:.35rem;transition:width .25s ease;
}
.fmt:hover::before{width:3.2rem}
.fmt:hover{background:var(--surface)}
.fmt .k{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--olive-ink);font-weight:600}
.fmt h3{margin:0}
.fmt p{color:var(--ink-2);font-size:.95rem}
.fmt .go{margin-top:auto;padding-top:.9rem;font-size:.85rem;color:var(--accent);font-weight:500}
.fmt .go::after{content:" →"}
@media (max-width:720px){.formats{grid-template-columns:1fr}}

/* статья */
.article{max-width:34rem;display:flex;flex-direction:column;gap:1.25rem}
.article p{line-height:1.75}
.article h3{margin:1.8rem 0 -.35rem;font-size:1.2rem}
.article ul{margin:0;padding-left:1.2rem;display:flex;flex-direction:column;gap:.6rem}
.article li{line-height:1.7;padding-left:.2rem}
.article li::marker{color:var(--clay-ink)}
.article h4{margin:1.4rem 0 -.5rem;font-size:1.04rem;color:var(--ink);font-family:var(--sans);font-weight:600;letter-spacing:.01em}
.article .last{font-family:var(--serif);font-size:1.15rem;line-height:1.55;font-weight:300;color:var(--ink);border-top:1px solid var(--rule-soft);padding-top:1.4rem;margin-top:1rem}
.back{display:inline-block;font-size:.85rem;color:var(--ink-3);text-decoration:none;margin-bottom:1.5rem}
.back:hover{color:var(--ink)}
.back::before{content:"← "}
.note-item.live h3{color:var(--ink)}
.note-item.live .go{display:block;margin-top:.6rem;font-size:.85rem;color:var(--accent);font-weight:500}
.note-item.live .go::after{content:" →"}

/* список текстов */
.notes{display:flex;flex-direction:column}
.note-item{
  display:block;text-decoration:none;padding:1.5rem 0;
  border-top:1px solid var(--rule-soft);transition:padding-left .2s ease;
}
.notes .note-item:last-child{border-bottom:1px solid var(--rule-soft)}
.note-item:hover{padding-left:.6rem}
.note-item h3{max-width:40rem}
.note-item p{margin-top:.5rem;max-width:38rem}

/* «почитать ещё» внизу страниц */
.reads{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2.2rem;width:100%}
.reads a{
  display:flex;flex-direction:column;gap:.55rem;text-decoration:none;min-width:0;
  border-top:1px solid var(--rule);padding-top:1.1rem;
  transition:border-top-color .2s ease;
}
.reads a:hover{border-top-color:var(--accent)}
.reads h4{font-size:1.05rem;line-height:1.35;color:var(--ink)}
.reads p{font-size:.88rem;color:var(--ink-3);line-height:1.6}
.reads .go{font-family:var(--sans);font-size:.78rem;letter-spacing:.08em;color:var(--accent);margin-top:.2rem}
.reads a:hover .go{text-decoration:underline;text-underline-offset:3px}
@media(max-width:860px){.reads{grid-template-columns:1fr;gap:1.7rem}}

a.ext{color:var(--accent);text-decoration:none;border-bottom:1px solid var(--accent-soft);font-size:.9em}
a.ext:hover{border-bottom-color:var(--accent)}
a.ext::after{content:" ↗";font-size:.85em;opacity:.7}

/* врезка-примечание */
.note{
  border:1px solid var(--rule);border-left:2px solid var(--clay-ink);
  background:var(--surface);padding:1.3rem 1.5rem;min-width:0;
  display:flex;flex-direction:column;gap:.7rem;
}
.note h4{color:var(--ink)}

/* статус набора */
.status{
  display:inline-flex;align-items:center;gap:.6rem;
  border:1px solid var(--rule);padding:.5rem .9rem;
  font-size:.82rem;letter-spacing:.02em;color:var(--ink-2);
}
.status .dot{width:6px;height:6px;background:var(--clay-ink);border-radius:50%;flex:none}

/* прошедшие ретриты */
.past{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;width:100%}
.past li{
  display:grid;grid-template-columns:13rem minmax(0,1fr);gap:1.5rem;
  padding:1.6rem 0;border-top:1px solid var(--rule-soft);
}
.past li:last-child{border-bottom:1px solid var(--rule-soft)}
.past .when{display:flex;flex-direction:column;gap:.2rem;padding-top:.15rem}
.past .when b{font-weight:600;font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;color:var(--clay-ink)}
.past .when span{font-size:.85rem;color:var(--ink-3);line-height:1.45}
.past .what{display:flex;flex-direction:column;gap:.5rem;min-width:0}
.past .what h3{margin:0}
.past .meta{font-size:.82rem;color:var(--ink-3);letter-spacing:.01em}
.k{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--olive-ink);font-weight:600}
@media (max-width:720px){.past li{grid-template-columns:1fr;gap:.6rem}}

/* ============================================================
   СПИСКИ
   ============================================================ */
.reasons{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 2.5rem;list-style:none;padding:0;margin:0}
.reasons li{padding:.85rem 0;border-bottom:1px solid var(--rule-soft);font-size:1rem;color:var(--ink-2)}
@media (max-width:720px){.reasons{grid-template-columns:1fr}}

.steps{list-style:none;counter-reset:s;padding:0;margin:0;display:flex;flex-direction:column}
.steps li{
  counter-increment:s;display:grid;grid-template-columns:2.6rem 1fr;gap:1.2rem;
  padding:1.4rem 0;border-top:1px solid var(--rule-soft);
}
.steps li:last-child{border-bottom:1px solid var(--rule-soft)}
.steps li > *{grid-column:2}
.steps li::before{
  grid-column:1;grid-row:1 / span 2;
  content:counter(s,decimal-leading-zero);
  font-family:var(--sans);font-size:.75rem;font-weight:600;letter-spacing:.1em;
  color:var(--clay-ink);padding-top:.35rem;font-variant-numeric:tabular-nums;
}
.steps h4{margin-bottom:.25rem}
.steps p{color:var(--ink-2);font-size:.95rem}

/* принципы подхода */
.principles{list-style:none;counter-reset:pr;padding:0;margin:0;display:flex;flex-direction:column;width:100%}
.principles li{
  counter-increment:pr;display:grid;grid-template-columns:3rem 1fr;gap:1.4rem;
  padding:2.1rem 0;border-top:1px solid var(--rule-soft);
}
.principles li:last-child{border-bottom:1px solid var(--rule-soft)}
.principles li > *{grid-column:2;min-width:0}
.principles li::before{
  grid-column:1;grid-row:1 / span 4;
  content:counter(pr,decimal-leading-zero);
  font-family:var(--sans);font-size:.75rem;font-weight:600;letter-spacing:.1em;
  color:var(--clay-ink);padding-top:.45rem;font-variant-numeric:tabular-nums;
}
.principles h3{font-size:clamp(1.2rem,2vw,1.45rem);margin-bottom:.75rem}
.principles p{color:var(--ink-2);max-width:var(--measure)}
.principles p + p{margin-top:.8rem}
@media(max-width:640px){
  .principles li{grid-template-columns:2rem 1fr;gap:.9rem;padding:1.7rem 0}
}

.facts{width:100%;border-collapse:collapse;font-size:.95rem}
.facts th,.facts td{text-align:left;padding:.85rem 0;border-bottom:1px solid var(--rule-soft);vertical-align:top}
.facts th{font-weight:500;color:var(--ink-3);width:12rem;font-size:.85rem;letter-spacing:.01em}
.facts td{color:var(--ink-2)}
@media (max-width:560px){
  .facts th,.facts td{display:block;width:auto;border:0;padding:.15rem 0}
  .facts th{padding-top:.9rem}
  .facts tr{display:block;padding-bottom:.9rem;border-bottom:1px solid var(--rule-soft)}
}

.notlist{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.7rem}
.notlist li{padding-left:1.5rem;position:relative;color:var(--ink-2);font-size:.98rem}
.notlist li::before{content:"—";position:absolute;left:0;color:var(--clay-ink)}

/* заголовок раздела во всю ширину */
.sechead{
  display:flex;flex-wrap:wrap;align-items:baseline;gap:.6rem 2rem;
  padding-bottom:1.1rem;margin-bottom:clamp(1.6rem,3vw,2.4rem);
  border-bottom:1px solid var(--rule);
}
.sechead .small{max-width:26rem}

/* кнопка на тёмном развороте */
.band.shade .btn{background:transparent;border-color:var(--shade-rule);color:var(--shade-ink);box-shadow:0 0 0 0 var(--shade), 0 0 0 0 var(--shade-rule)}
.band.shade .btn:hover,.band.shade .btn:focus-visible{background:transparent;border-color:var(--shade-ink);color:var(--shade-ink);box-shadow:0 0 0 3px var(--shade), 0 0 0 4px var(--shade-rule)}
.band.shade .btn:hover{opacity:.88}
.band.shade .btn.ghost{background:transparent;color:var(--shade-ink);border-color:var(--shade-rule)}

/* цитата */
.quote{max-width:48rem}
.quote p{font-family:var(--serif);font-size:clamp(1.7rem,4vw,2.8rem);line-height:1.28;font-weight:300;letter-spacing:-.012em}
.quote cite{display:block;margin-top:1.5rem;font-style:normal;font-family:var(--sans);font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:var(--shade-ink-2)}

/* FAQ */
details.q{border-top:1px solid var(--rule-soft)}
details.q:last-of-type{border-bottom:1px solid var(--rule-soft)}
details.q summary{
  cursor:pointer;list-style:none;padding:1.1rem 2rem 1.1rem 0;position:relative;
  font-family:var(--serif);font-size:1.08rem;line-height:1.4;
}
details.q summary::-webkit-details-marker{display:none}
details.q summary::after{content:"+";position:absolute;right:.2rem;top:1.05rem;color:var(--clay-ink);font-family:var(--sans)}
details.q[open] summary::after{content:"–"}
details.q .a{padding:0 2rem 1.3rem 0;color:var(--ink-2);font-size:.97rem;max-width:var(--measure)}

/* тайм-лайн */
.tl{list-style:none;padding:0;margin:0;border-left:1px solid var(--rule);display:flex;flex-direction:column;gap:2rem}
.tl li{padding-left:1.6rem;position:relative}
.tl li::before{content:"";position:absolute;left:-3px;top:.6rem;width:5px;height:5px;background:var(--clay-ink)}
.tl .yr{font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);font-weight:600}
.tl h4{margin:.25rem 0 .3rem}
.tl p{font-size:.94rem;color:var(--ink-2)}

/* ФОРМА */
form.book{display:grid;gap:1.1rem;max-width:32rem}
.field{display:grid;gap:.4rem}
.field label{font-size:.82rem;letter-spacing:.02em;color:var(--ink-3)}
.field input,.field textarea,.field select{
  font-family:var(--sans);font-size:1rem;color:var(--ink);
  background:var(--surface);border:1px solid var(--rule);padding:.75rem .85rem;width:100%;
}
.field textarea{min-height:8rem;resize:vertical;line-height:1.6}
.field input:focus,.field textarea:focus,.field select:focus{outline:2px solid var(--accent);outline-offset:0;border-color:transparent}
.formnote{font-size:.82rem;color:var(--ink-3);max-width:32rem}
.subscribe{display:flex;gap:.6rem;flex-wrap:wrap;align-items:stretch;width:100%;max-width:30rem}
.subscribe input{
  flex:1 1 14rem;min-width:0;font-family:var(--sans);font-size:1rem;color:var(--ink);
  background:var(--surface);border:1px solid var(--rule);padding:.75rem .85rem;
}
.subscribe input:focus{outline:2px solid var(--accent);outline-offset:0;border-color:transparent}
.subscribe .btn{flex:0 0 auto}
.sent{border:1px solid var(--rule);background:var(--surface);padding:1.1rem 1.2rem;font-size:.95rem;display:none}
.sent.on{display:block}

.contact-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:1.2rem}
.contact-list .k{font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.contact-list .v{font-family:var(--serif);font-size:1.15rem;margin-top:.2rem}

.two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(2rem,5vw,4rem)}
.two.narrow{gap:2rem}
.three{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2rem}
@media (max-width:860px){.two,.three{grid-template-columns:1fr}}

/* CTA-полоса */
.cta-band{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:2rem}
.cta-band .t{max-width:30rem}

/* ПОДВАЛ */
footer{border-top:1px solid var(--rule);padding:3.5rem 0 2.5rem;margin-top:0;background:var(--bg-soft)}
.foot{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:2.5rem}
.foot h4{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);font-weight:600;margin-bottom:.9rem}
.foot a{display:block;text-decoration:none;color:var(--ink-2);font-size:.92rem;padding:.22rem 0}
.foot a:hover{color:var(--ink)}
.social{display:flex;gap:.6rem;margin-top:1.3rem}
.foot .social a,.social a{
  display:inline-flex;align-items:center;justify-content:center;width:2.2rem;height:2.2rem;
  border:1px solid var(--rule);border-radius:50%;color:var(--ink-3);padding:0;
  transition:color .2s ease,border-color .2s ease;
}
.foot .social a:hover,.social a:hover{color:var(--accent);border-color:var(--accent)}
.social svg{width:1.05rem;height:1.05rem;display:block}
.legal{margin-top:3rem;padding-top:1.4rem;border-top:1px solid var(--rule-soft);display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;font-size:.8rem;color:var(--ink-3)}
@media (max-width:860px){.foot{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.foot{grid-template-columns:1fr}}

@media (max-width:900px){
  nav.main{display:none}
  .burger{display:block}
}