/* =========================================================
   Комаров П. А. — банкротство и реструктуризация долгов

   Система наследует юридический проект СБПР (juristi.elkojer.ru):
   Prata + Manrope, ink/bone, крупный дисплейный кегль, киккеры
   «01 /», волосяные линейки, hover-заливка строк снизу вверх.

   Отличие — цвет. Акцент взят пипеткой из эмблемы Комарова:
   #1B6961 (птица) и #8E8F92 (цепь). Жёлтого СБПР здесь нет.

   Собственный приём проекта: ссылка на норму закона в левой
   колонке каждой строки. Это то, чем юрист отличается от
   конторы «спишем долги под ключ», и это можно проверить.
   ========================================================= */

@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600&family=Prata&display=swap');

:root{
  --ink:       #101614;
  --ink-2:     #171F1C;
  --paper:     #EDEAE2;
  --paper-2:   #E0DCD2;

  --jade:      #1B6961;   /* эмблема: заливки, панели, кнопки  */
  --jade-lit:  #4E9E90;   /* тот же цвет, поднятый для тёмного */
  --steel:     #8E8F92;   /* цепь                              */

  --line-dark:  rgba(237,234,226,.18);
  --line-light: rgba(16,22,20,.18);
  --mute-dark:  rgba(237,234,226,.60);
  --mute-light: #5D5F59;

  --err: #C4634C;

  --serif: 'Prata', 'Times New Roman', Georgia, serif;
  --sans:  'Manrope', 'Segoe UI', system-ui, sans-serif;

  --pad: clamp(20px, 4vw, 68px);
  --sec: clamp(84px, 10.5vw, 168px);
}

*,*::before,*::after{ box-sizing:border-box }
[hidden]{ display:none !important }

html{ scroll-behavior:smooth; background:var(--ink); -webkit-text-size-adjust:100% }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto } }

body{
  margin:0; background:var(--paper); color:var(--ink);
  font:400 16px/1.5 var(--sans); overflow-x:hidden;
}
body.menu-open{ position:fixed; inset:0; width:100%; overflow:hidden }

img{ max-width:100%; display:block }
a{ color:inherit; text-decoration:none }
button,input,textarea{ font:inherit }
button{ color:inherit }
::selection{ background:var(--jade); color:var(--paper) }

h1,h2,h3{ margin:0; font-weight:400; font-family:var(--serif) }
p{ margin:0 0 1em } p:last-child{ margin-bottom:0 }

.skip{ position:fixed; left:12px; top:-60px; z-index:200; padding:10px 16px; background:var(--jade); color:var(--paper) }
.skip:focus{ top:12px }

:where(a,button,input,textarea,summary,label.opt):focus-visible{ outline:2px solid var(--jade-lit); outline-offset:3px }

/* дисплейный кегль — главный носитель характера */
.display{ font:400 clamp(40px,6.8vw,104px)/.98 var(--serif); letter-spacing:-.045em; margin:0 }
.display--hero{ font-size:clamp(46px,8vw,128px); line-height:.92; letter-spacing:-.05em }
.display em{ font-style:normal; color:var(--jade) }
.section-dark .display em, .hero .display em{ color:var(--jade-lit) }

.kicker{ margin:0 0 clamp(30px,3.4vw,44px); font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--mute-light) }
.section-dark .kicker{ color:rgba(237,234,226,.5) }
.lede{ font-size:clamp(15px,1.3vw,17px); line-height:1.6; color:var(--mute-light); max-width:56ch }
.section-dark .lede{ color:var(--mute-dark) }

.section{ padding:var(--sec) var(--pad) }
.section-dark{ background:var(--ink); color:var(--paper) }
.section-paper2{ background:var(--paper-2) }

/* мелкая служебная подпись — норма закона, срок, разряд */
.tag{ font-size:10.5px; letter-spacing:.13em; text-transform:uppercase; line-height:1.45 }
.tag b{ display:block; font-weight:500; color:var(--jade) }
.section-dark .tag b, .hero .tag b{ color:var(--jade-lit) }
.tag span{ display:block; color:var(--mute-light) }
.section-dark .tag span, .hero .tag span{ color:rgba(237,234,226,.45) }

/* =========================================================
   ШАПКА САЙТА
   ========================================================= */
.site-header{
  position:fixed; z-index:100; inset:0 0 auto; height:86px; padding:0 var(--pad);
  display:flex; align-items:center; justify-content:space-between;
  color:var(--paper); transition:background .3s, height .3s;
}
.site-header.scrolled{ height:68px; background:rgba(16,22,20,.97); backdrop-filter:blur(16px); border-bottom:1px solid var(--line-dark) }
.brand{ display:flex; align-items:center; gap:12px; position:relative; z-index:2 }
.brand-mark{ height:38px; width:auto; flex:none; object-fit:contain }
.brand-text{ font-size:10.5px; line-height:1.2; text-transform:uppercase; letter-spacing:.14em; max-width:150px }
.brand-text b{ display:block; font-weight:600; letter-spacing:.1em }
.brand-text i{ font-style:normal; color:rgba(237,234,226,.55) }

.nav{ display:flex; align-items:center; gap:clamp(16px,2.2vw,38px) }
.nav a{ font-size:12px; text-transform:uppercase; letter-spacing:.1em; position:relative; white-space:nowrap }
.nav a::after{ content:''; position:absolute; left:0; right:100%; bottom:-5px; height:1px; background:var(--jade-lit); transition:right .25s }
.nav a:hover::after{ right:0 }

.header-cta{
  display:inline-flex; align-items:center; gap:10px; padding:11px 18px;
  border:1px solid rgba(237,234,226,.45); border-radius:50px;
  font-size:11.5px; text-transform:uppercase; letter-spacing:.1em; white-space:nowrap;
  transition:background .25s, color .25s, border-color .25s;
}
.header-cta:hover{ background:var(--jade); border-color:var(--jade); color:var(--paper) }
.icon-arrow{ width:15px; height:15px; flex:none; fill:none; stroke:currentColor; stroke-width:1.5 }

.menu-toggle{ display:none; width:46px; height:46px; padding:0; border:1px solid rgba(237,234,226,.4); border-radius:50%; background:none; position:relative; z-index:102 }
.menu-toggle span, .menu-toggle::before{ content:''; position:absolute; left:13px; width:20px; height:1px; background:currentColor; transition:transform .3s, top .3s }
.menu-toggle span{ top:19px } .menu-toggle::before{ top:26px }
.menu-open .menu-toggle span{ top:22px; transform:rotate(45deg) }
.menu-open .menu-toggle::before{ top:22px; transform:rotate(-45deg) }

.mobmenu{
  position:fixed; inset:0; z-index:101; background:var(--ink); color:var(--paper);
  padding:110px var(--pad) 40px; display:flex; flex-direction:column; gap:2px; overflow:auto;
}
.mobmenu a{ padding:15px 0; border-bottom:1px solid var(--line-dark); font:400 clamp(23px,5.4vw,32px)/1.15 var(--serif) }
.mobmenu .mobmenu-phone{ margin-top:24px; border:0; color:var(--jade-lit) }

/* =========================================================
   ГЕРОЙ
   ========================================================= */
.hero{
  min-height:100svh; background:var(--ink); color:var(--paper);
  padding:132px var(--pad) 40px; display:grid; grid-template-rows:1fr auto;
  position:relative; isolation:isolate; overflow:hidden;
}
.hero-art{ position:absolute; inset:0; z-index:-1; overflow:hidden; background:var(--ink) }
/* световые плоскости — приём СБПР, здесь построен на зелёном */
.hero-art::before{
  content:''; position:absolute; width:44vw; height:124vh; right:8vw; top:-12vh;
  background:linear-gradient(128deg, rgba(237,234,226,.10), rgba(237,234,226,.004) 66%);
  transform:skew(-10deg); border-left:1px solid rgba(237,234,226,.09);
}
.hero-art::after{
  content:''; position:absolute; width:20vw; height:78vh; right:23vw; bottom:-12vh;
  background:linear-gradient(90deg, rgba(27,105,97,.13), rgba(8,12,11,.94));
  border-left:1px solid rgba(78,158,144,.30); transform:skewY(-7deg);
}
.hero-image{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center;
  filter:saturate(.8) contrast(1.08); transform:scale(1.015);
}
.image-shade{
  position:absolute; inset:0;
  background:linear-gradient(90deg, rgba(8,12,11,.9) 0%, rgba(8,12,11,.5) 48%, rgba(8,12,11,.22) 100%),
             linear-gradient(0deg, rgba(8,12,11,.78) 0%, transparent 46%);
}
.hero-mark{
  position:absolute; right:-5vw; bottom:-12vh; top:auto;
  width:min(44vw,520px); opacity:.085; filter:grayscale(.5) brightness(1.6);
  pointer-events:none;
}
.grain{
  position:absolute; inset:0; pointer-events:none; opacity:.11; mix-blend-mode:soft-light;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.38'/%3E%3C/svg%3E");
}

.hero-top{ display:grid; grid-template-columns:minmax(0,1fr) 250px; gap:30px; align-items:end }
.eyebrow{ margin:0 0 20px; font-size:11px; letter-spacing:.17em; text-transform:uppercase; display:flex; align-items:center; gap:12px }
.eyebrow::before{ content:''; width:30px; height:1px; background:var(--jade-lit); flex:none }
.hero h1{ max-width:16ch }
.hero-side{ align-self:center; max-width:230px; font-size:14px; line-height:1.55; color:rgba(237,234,226,.72) }
.hero-side strong{ display:block; font-weight:500; color:var(--paper); margin-bottom:8px }

.hero-bottom{ padding-top:36px; border-top:1px solid var(--line-dark); display:flex; justify-content:space-between; align-items:flex-end; gap:24px }
.hero-meta{ display:flex; gap:clamp(20px,4vw,64px) }
.round-link{
  width:92px; aspect-ratio:1; border-radius:50%; border:1px solid rgba(237,234,226,.5);
  display:grid; place-items:center; flex:none; transition:background .3s, color .3s, transform .3s, border-color .3s;
}
.round-link:hover{ background:var(--jade); border-color:var(--jade); transform:rotate(7deg) }
.round-link svg{ width:24px; height:24px; fill:none; stroke:currentColor; stroke-width:1.4 }

/* =========================================================
   БЕГУЩАЯ СТРОКА — что перестаёт происходить
   ========================================================= */
.ticker{ overflow:hidden; background:var(--jade); color:var(--paper); border-block:1px solid var(--ink); padding:13px 0 }
.ticker-track{ display:flex; width:max-content; animation:ticker 34s linear infinite }
.ticker-item{ font-size:11.5px; letter-spacing:.11em; text-transform:uppercase; white-space:nowrap; padding-right:34px }
.ticker-item::after{ content:'§'; margin-left:34px; font-family:var(--serif); opacity:.55 }
@keyframes ticker{ to{ transform:translateX(-50%) } }
@media (prefers-reduced-motion: reduce){ .ticker-track{ animation:none } }

/* =========================================================
   СТРОКИ-ПЕРЕЧНИ (последствия, договор)
   ========================================================= */
.rows{ list-style:none; margin:0; padding:0; border-top:1px solid var(--line-dark) }
.section:not(.section-dark) .rows{ border-top-color:var(--line-light) }

.row{
  display:grid; grid-template-columns:132px minmax(0,1fr) minmax(0,360px); gap:clamp(18px,2.6vw,40px);
  align-items:start; padding:clamp(26px,3vw,38px) 0; border-bottom:1px solid var(--line-dark);
  position:relative; transition:color .3s, padding .3s;
}
.section:not(.section-dark) .row{ border-bottom-color:var(--line-light) }
.row::before{
  content:''; position:absolute; inset:0; background:var(--jade); transform:scaleY(0);
  transform-origin:bottom; transition:transform .35s cubic-bezier(.2,.8,.2,1); z-index:0;
}
.row > *{ position:relative; z-index:1 }
@media (hover:hover){
  .row:hover::before{ transform:scaleY(1) }
  .row:hover{ color:var(--paper); padding-inline:20px }
  .row:hover .tag b{ color:var(--paper) }
  .row:hover .tag span, .row:hover .row-text{ color:rgba(237,234,226,.78) }
}
.row-title{ font:400 clamp(23px,3.1vw,44px)/1.06 var(--serif); letter-spacing:-.03em }
.row-text{ font-size:13.5px; line-height:1.62; color:var(--mute-light); margin:0 }
.section-dark .row-text{ color:rgba(237,234,226,.55) }

@media (max-width:900px){
  .row{ grid-template-columns:1fr; gap:12px; padding-inline:0 !important }
  .row:hover{ padding-inline:0 }
}

/* =========================================================
   ТЕЗИС
   ========================================================= */
.thesis{ display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); gap:clamp(28px,6vw,90px); align-items:end }
.thesis .lede{ margin:0 }
.marks{ display:flex; flex-wrap:wrap; gap:10px; margin:clamp(34px,4vw,54px) 0 0; list-style:none; padding:0 }
.marks li{
  padding:9px 17px; border:1px solid var(--line-light); border-radius:50px;
  font-size:11px; letter-spacing:.13em; text-transform:uppercase;
}
.section-dark .marks li{ border-color:var(--line-dark) }

/* =========================================================
   ПРОЦЕСС
   ========================================================= */
.process{ border-top:1px solid var(--line-light) }
.section-dark .process{ border-top-color:var(--line-dark) }
.process-row{
  display:grid; grid-template-columns:132px minmax(0,1fr) minmax(240px,380px); gap:clamp(18px,2.6vw,40px);
  padding:clamp(26px,3vw,36px) 0; border-bottom:1px solid var(--line-light); align-items:start;
}
.section-dark .process-row{ border-bottom-color:var(--line-dark) }
.process-title{ font:400 clamp(24px,3.4vw,50px)/1.02 var(--serif); letter-spacing:-.035em }
.process-text{ font-size:13.5px; line-height:1.62; color:var(--mute-light); margin:0 }
.section-dark .process-text{ color:rgba(237,234,226,.55) }

/* рубеж: работа продолжается после завершения процедуры */
.milestone{
  display:flex; align-items:center; gap:18px; margin:clamp(34px,4vw,52px) 0 clamp(20px,2.4vw,30px);
  font-size:10.5px; letter-spacing:.18em; text-transform:uppercase; color:var(--jade);
}
.section-dark .milestone{ color:var(--jade-lit) }
.milestone::after{ content:''; flex:1; height:1px; background:currentColor; opacity:.4 }
.process--after{ border-top:0 }
.process--after .process-row{ border-bottom:0 }
.process--after .process-title{ color:var(--jade) }
.section-dark .process--after .process-title{ color:var(--jade-lit) }

@media (max-width:900px){ .process-row{ grid-template-columns:1fr; gap:12px } }

/* =========================================================
   ДЕЛА
   ========================================================= */
.cases-grid{ display:grid; grid-template-columns:repeat(12,1fr); gap:clamp(16px,2vw,30px) }
.case-card{ grid-column:span 5; margin-bottom:clamp(34px,5vw,60px) }
.case-card:nth-child(3n+2){ grid-column:7 / span 6; margin-top:clamp(40px,10vw,140px) }
.case-card:nth-child(3n+3){ grid-column:2 / span 7 }

.case-visual{
  aspect-ratio:4/3; position:relative; overflow:hidden; background:#1C2522;
  border:1px solid var(--line-dark); display:grid; place-items:center;
}
.case-card:nth-child(2n) .case-visual{ background:#232D2A }
.case-card:nth-child(3n) .case-visual{ background:#19211E }
.case-visual::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(125deg, rgba(16,22,20,.2) 20%, rgba(27,105,97,.16)), linear-gradient(0deg, rgba(16,22,20,.42), transparent 48%);
}
.case-sum{
  position:relative; z-index:2; margin:0; padding:0 8%;
  font:400 clamp(30px,4.4vw,60px)/1 var(--serif); letter-spacing:-.05em;
  color:var(--paper); text-align:center; font-variant-numeric:tabular-nums; padding-bottom:6%;
}
.case-visual::before{
  content:attr(data-mark); position:absolute; inset:auto 6% 2% auto; z-index:2;
  font:400 clamp(44px,5.6vw,104px)/1 var(--serif); color:rgba(237,234,226,.13); letter-spacing:-.08em;
}
.case-info{ display:grid; grid-template-columns:1fr auto; gap:10px; padding-top:18px; border-top:1px solid var(--line-dark); margin-top:16px }
.case-title{ font:400 clamp(21px,2.4vw,36px)/1.12 var(--serif); letter-spacing:-.03em }
.case-tag{ font-size:10px; text-transform:uppercase; letter-spacing:.1em; color:rgba(237,234,226,.45); text-align:right; padding-top:6px }
.case-result{ grid-column:1/-1; margin:8px 0 0; font-size:13.5px; line-height:1.6; color:rgba(237,234,226,.55) }

@media (max-width:900px){
  .case-card, .case-card:nth-child(3n+2), .case-card:nth-child(3n+3){ grid-column:1/-1; margin-top:0 }
}

/* =========================================================
   ЦИТАТА — полосный акцент
   ========================================================= */
.quote{
  margin:0; min-height:66vh; display:grid; place-items:center; text-align:center;
  background:var(--jade); color:var(--paper); padding:clamp(70px,9vw,120px) var(--pad);
  position:relative; overflow:hidden;
}
.quote::before{
  content:'§'; position:absolute; font:400 min(64vw,820px)/1 var(--serif);
  color:rgba(237,234,226,.09); transform:rotate(-7deg); pointer-events:none;
}
.quote blockquote{ position:relative; margin:0; max-width:20ch; font:400 clamp(36px,5.6vw,86px)/1.04 var(--serif); letter-spacing:-.04em }
.quote figcaption{ position:relative; margin-top:clamp(22px,2.6vw,34px); font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:rgba(237,234,226,.7) }

/* =========================================================
   ПОКАЗАТЕЛИ
   ========================================================= */
.stats{ display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line-dark); border-left:1px solid var(--line-dark) }
.stat{ min-height:240px; padding:26px; border-right:1px solid var(--line-dark); border-bottom:1px solid var(--line-dark); display:flex; flex-direction:column; justify-content:space-between; gap:24px }
.stat-value{ font:400 clamp(46px,6.4vw,104px)/1 var(--serif); letter-spacing:-.06em; color:var(--jade-lit) }
.stat-label{ max-width:230px; font-size:13px; line-height:1.55; color:rgba(237,234,226,.6) }
.stats-note{ margin:22px 0 0; font-size:11.5px; line-height:1.6; color:rgba(237,234,226,.42); max-width:70ch }
@media (max-width:760px){ .stats{ grid-template-columns:1fr } .stat{ min-height:0 } }

/* =========================================================
   ОТЗЫВЫ
   ========================================================= */
.revs{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(2,1fr); gap:clamp(28px,4vw,64px) }
.rev{ border-top:1px solid var(--line-light); padding-top:24px }
.section-dark .rev{ border-top-color:var(--line-dark) }
.rev p{ margin:0 0 18px; font:400 clamp(19px,1.9vw,26px)/1.34 var(--serif); letter-spacing:-.02em }
.rev cite{ font-style:normal; font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--mute-light) }
.section-dark .rev cite{ color:rgba(237,234,226,.45) }
@media (max-width:760px){ .revs{ grid-template-columns:1fr } }

/* =========================================================
   ВОПРОСЫ
   ========================================================= */
.faq{ border-top:1px solid var(--line-light) }
.fq{ border-bottom:1px solid var(--line-light) }
.fq summary{
  list-style:none; cursor:pointer; padding:clamp(20px,2.4vw,28px) 52px clamp(20px,2.4vw,28px) 0;
  position:relative; font:400 clamp(19px,2.3vw,32px)/1.14 var(--serif); letter-spacing:-.03em; transition:color .2s;
}
.fq summary::-webkit-details-marker{ display:none }
.fq summary:hover{ color:var(--jade) }
.fq summary::after{ content:''; position:absolute; right:10px; top:50%; width:14px; height:1px; background:var(--jade) }
.fq summary::before{ content:''; position:absolute; right:16px; top:50%; width:1px; height:14px; margin-top:-7px; background:var(--jade); transition:transform .22s }
.fq[open] summary::before{ transform:scaleY(0) }
.fq__body{ padding:0 clamp(0px,8vw,140px) clamp(20px,2.4vw,28px) 0 }
.fq__body p{ font-size:14.5px; line-height:1.68; color:var(--mute-light) }

/* =========================================================
   ФОРМЫ
   ========================================================= */
.field{ display:grid; gap:8px; min-width:0 }
.field label, .field > span:first-child{ font-size:10px; text-transform:uppercase; letter-spacing:.13em; color:var(--mute-light) }
.section-dark .field label, .section-dark .field > span:first-child,
.popup .field label, .popup .field > span:first-child{ color:rgba(237,234,226,.48) }
.field input, .field textarea{
  width:100%; color:inherit; background:transparent; border:0;
  border-bottom:1px solid var(--line-light); border-radius:0; padding:12px 0; outline:none;
  transition:border-color .2s;
}
.section-dark .field input, .section-dark .field textarea,
.popup .field input{ border-bottom-color:rgba(237,234,226,.35) }
.field input::placeholder, .field textarea::placeholder{ color:var(--steel) }
.field input:focus, .field textarea:focus{ border-color:var(--jade) }
.section-dark .field input:focus, .section-dark .field textarea:focus,
.popup .field input:focus{ border-color:var(--jade-lit) }
.field textarea{ resize:vertical; min-height:90px }
.field input[aria-invalid="true"]{ border-color:var(--err) }
.hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden }

.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:11px;
  padding:16px 28px; border:1px solid transparent; border-radius:50px; cursor:pointer;
  font-size:11.5px; text-transform:uppercase; letter-spacing:.11em; white-space:nowrap;
  transition:background .25s, color .25s, border-color .25s;
}
.btn--go{ background:var(--jade); color:var(--paper) }
.btn--go:hover{ background:var(--paper); color:var(--ink) }
.section-dark .btn--go, .popup .btn--go{ background:var(--paper); color:var(--ink) }
.section-dark .btn--go:hover, .popup .btn--go:hover{ background:var(--jade-lit) }
.btn--line{ background:transparent; border-color:var(--line-light) }
.btn--line:hover{ border-color:var(--jade); color:var(--jade) }
.section-dark .btn--line, .popup .btn--line{ border-color:rgba(237,234,226,.4) }
.section-dark .btn--line:hover, .popup .btn--line:hover{ border-color:var(--jade-lit); color:var(--jade-lit) }
.btn--wide{ width:100% }
.btn[disabled]{ opacity:.5; cursor:progress }

.formnote{ font-size:11px; line-height:1.55; color:var(--mute-light) }
.section-dark .formnote, .popup .formnote{ color:rgba(237,234,226,.45) }
.formnote a{ color:var(--jade); text-decoration:underline; text-underline-offset:2px }
.section-dark .formnote a, .popup .formnote a{ color:var(--jade-lit) }
.formmsg{ min-height:20px; font-size:12.5px; letter-spacing:.02em }
.formmsg.is-ok{ color:var(--jade) }
.formmsg.is-err{ color:var(--err) }
.section-dark .formmsg.is-ok, .popup .formmsg.is-ok{ color:var(--jade-lit) }

/* =========================================================
   ОПРОСНИК
   ========================================================= */
.quiz{ max-width:960px; border-top:1px solid var(--line-light); padding-top:clamp(26px,3vw,38px); position:relative }
.section-dark .quiz{ border-top-color:var(--line-dark) }
.quiz__bar{ position:absolute; top:-1px; left:0; right:0; height:1px; background:transparent }
.quiz__bar-fill{ display:block; height:2px; margin-top:-1px; width:16.6%; background:var(--jade); transition:width .35s ease }
.section-dark .quiz__bar-fill{ background:var(--jade-lit) }
.quiz__count{ font-size:10.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--mute-light); margin:0 0 clamp(20px,2.4vw,30px) }
.section-dark .quiz__count{ color:rgba(237,234,226,.45) }
.quiz__count b{ color:var(--jade); font-weight:500 }
.section-dark .quiz__count b{ color:var(--jade-lit) }

.q{ border:0; margin:0; padding:0; display:none }
.q.is-active{ display:block }
.q legend{ padding:0; font:400 clamp(24px,3.4vw,48px)/1.04 var(--serif); letter-spacing:-.035em; margin-bottom:8px }
.q__hint{ font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--mute-light); margin:0 }
.section-dark .q__hint{ color:rgba(237,234,226,.45) }

.opts{ display:grid; gap:0; margin-top:clamp(22px,2.6vw,32px); border-top:1px solid var(--line-light) }
.section-dark .opts{ border-top-color:var(--line-dark) }
.opts--row{ grid-template-columns:repeat(auto-fit,minmax(190px,1fr)) }
.opt{ position:relative; display:block; cursor:pointer; border-bottom:1px solid var(--line-light) }
.section-dark .opt{ border-bottom-color:var(--line-dark) }
.opt input{ position:absolute; opacity:0; width:0; height:0 }
.opt span{
  display:block; padding:15px 16px; font-size:15px; position:relative;
  background:transparent; transition:background .25s, color .25s, padding-left .25s;
}
.opt span::after{
  content:''; position:absolute; right:18px; top:50%; width:7px; height:7px; margin-top:-4px;
  border-right:1px solid currentColor; border-bottom:1px solid currentColor;
  transform:rotate(-45deg); opacity:0; transition:opacity .25s;
}
@media (hover:hover){ .opt:hover span{ background:var(--jade); color:var(--paper); padding-left:22px } }
.opt:hover span::after{ opacity:.75 }
.opt input:checked + span{ background:var(--jade); color:var(--paper); padding-left:22px }
.opt input:checked + span::after{ opacity:1 }
.opt input:focus-visible + span{ outline:2px solid var(--jade-lit); outline-offset:-2px }
.opts--row .opt{ border-bottom:1px solid var(--line-light) }

.quiz__fields{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(18px,2.4vw,30px); margin-top:clamp(26px,3vw,36px) }
.quiz__nav{ display:flex; gap:10px; margin-top:clamp(26px,3vw,36px); flex-wrap:wrap; align-items:center }
.quiz__done{ max-width:56ch }
.quiz__done h3{ font:400 clamp(28px,3.8vw,54px)/1.02 var(--serif); letter-spacing:-.04em; margin-bottom:18px }
.quiz__done p{ font-size:15px; line-height:1.62; color:var(--mute-light) }
.section-dark .quiz__done p{ color:var(--mute-dark) }
.quiz__done b{ font-weight:500; color:var(--jade) }
.section-dark .quiz__done b{ color:var(--jade-lit) }
@media (max-width:760px){ .quiz__fields{ grid-template-columns:1fr } }

/* =========================================================
   КОНТАКТЫ
   ========================================================= */
.contact-block{ display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); gap:clamp(34px,7vw,110px) }
.contact-copy .display{ margin-bottom:clamp(28px,3.4vw,44px) }
.clist{ list-style:none; margin:0 0 26px; padding:0 }
.contact-line{ display:flex; justify-content:space-between; align-items:baseline; gap:20px; border-top:1px solid var(--line-dark); padding:16px 0; font-size:13.5px }
.contact-line:last-child{ border-bottom:1px solid var(--line-dark) }
.contact-line .k{ font-size:10.5px; text-transform:uppercase; letter-spacing:.13em; color:rgba(237,234,226,.48); flex:none }
.contact-line a{ transition:color .2s }
.contact-line a:hover{ color:var(--jade-lit) }
.contact-subs{ font-size:12.5px; line-height:1.65; color:rgba(237,234,226,.45) }
.contact-subs a{ color:rgba(237,234,226,.8); text-decoration:underline; text-underline-offset:2px }
.contact-subs a:hover{ color:var(--jade-lit) }
.contact-form{ display:grid; gap:clamp(20px,2.6vw,30px); align-content:start }
@media (max-width:900px){ .contact-block{ grid-template-columns:1fr } }

/* =========================================================
   ФУТЕР
   ========================================================= */
.footer{ background:var(--ink); color:rgba(237,234,226,.48); border-top:1px solid var(--line-dark); padding:clamp(46px,5vw,70px) var(--pad) 28px }
.footer-in{ display:grid; grid-template-columns:1fr auto; gap:26px }
.footer-brand{ display:flex; align-items:center; gap:14px }
.footer-brand img{ width:40px; height:40px; object-fit:contain }
.footer-brand p{ margin:0; font-size:13px; line-height:1.55 }
.footer-brand b{ display:block; color:rgba(237,234,226,.85); font-weight:500 }
.footer-nav{ display:flex; flex-direction:column; gap:8px; font-size:12px; text-align:right }
.footer-nav a:hover{ color:var(--jade-lit) }
.footer-copy{ grid-column:1/-1; margin:0; padding-top:22px; border-top:1px solid var(--line-dark); font-size:11.5px; line-height:1.65 }
@media (max-width:760px){ .footer-in{ grid-template-columns:1fr } .footer-nav{ text-align:left } }

/* =========================================================
   ПЛАВАЮЩАЯ КНОПКА, ПОПАП, COOKIE
   ========================================================= */
.fab{ position:fixed; right:20px; bottom:20px; z-index:90; display:flex; flex-direction:column-reverse; align-items:flex-end; gap:9px }
.fab__btn{ width:56px; height:56px; border-radius:50%; border:0; cursor:pointer; background:var(--jade); display:grid; place-items:center; transition:background .25s, transform .25s }
.fab__btn:hover{ background:var(--ink); transform:rotate(7deg) }
.fab__btn svg{ width:23px; height:23px; fill:var(--paper) }
.fab__list{ list-style:none; margin:0; padding:0; display:grid; gap:7px; opacity:0; pointer-events:none; transform:translateY(8px); transition:opacity .2s, transform .2s }
.fab.is-open .fab__list{ opacity:1; pointer-events:auto; transform:none }
.fab__list a{ display:block; padding:11px 18px; border-radius:50px; background:var(--ink); color:var(--paper); font-size:11px; letter-spacing:.11em; text-transform:uppercase; white-space:nowrap }
.fab__list a:hover{ background:var(--jade) }

.popup{ position:fixed; inset:0; z-index:120; display:grid; place-items:center; padding:20px; background:rgba(8,12,11,.82) }
.popup__box{ position:relative; width:min(560px,100%); max-height:92vh; overflow:auto; background:var(--ink); color:var(--paper); border:1px solid var(--line-dark); padding:clamp(28px,4.4vw,48px) }
.popup__x{ position:absolute; right:14px; top:12px; width:38px; height:38px; border:1px solid var(--line-dark); border-radius:50%; background:none; color:rgba(237,234,226,.6); font-size:20px; line-height:1; cursor:pointer }
.popup__x:hover{ color:var(--paper); border-color:var(--jade-lit) }
.popup__ref{ font-size:10.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--jade-lit); margin:0 0 14px }
.popup h2{ font:400 clamp(28px,4vw,46px)/1.02 var(--serif); letter-spacing:-.04em; margin:0 0 14px }
.popup__box > p{ font-size:14px; line-height:1.6; color:rgba(237,234,226,.6); margin:0 0 26px }
.popup__form{ display:grid; gap:22px }

.cookie{
  position:fixed; left:20px; bottom:20px; z-index:110; width:min(420px,calc(100% - 40px));
  background:var(--ink); color:rgba(237,234,226,.6); border:1px solid var(--line-dark);
  padding:18px 20px; display:flex; gap:16px; align-items:center;
}
.cookie p{ margin:0; font-size:11.5px; line-height:1.55 }
.cookie a{ color:var(--jade-lit); text-decoration:underline; text-underline-offset:2px }
.cookie .btn{ flex:none; padding:11px 18px }

/* =========================================================
   ТЕКСТОВЫЙ ДОКУМЕНТ (privacy.html и подобные)
   ========================================================= */
/* шапка без прилипания: на странице документа ей нечего перекрывать */
.site-header--static{
  position:static; height:68px; background:var(--ink);
  border-bottom:1px solid var(--line-dark);
}
/* на странице документа бургера нет — телефон остаётся видимым */
.site-header--static .header-cta{ display:inline-flex }
@media (max-width:460px){ .site-header--static .header-cta{ padding:9px 13px; font-size:10.5px } }

.doc{ max-width:1000px }
.doc h1{ font:400 clamp(30px,4.2vw,60px)/1.02 var(--serif); letter-spacing:-.04em; margin:0 }
.doc-upd{ margin:18px 0 0; font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--mute-light) }

.doc-note{
  margin:clamp(30px,3.6vw,46px) 0 0; padding:22px 24px;
  border:1px solid var(--line-light); border-left:2px solid var(--jade);
}
.doc-note p{ margin:0; font-size:14px; line-height:1.6; color:var(--mute-light) }
.doc-note b{ font-weight:600; color:var(--ink) }

.doc-body{ margin-top:clamp(40px,5vw,72px); border-top:1px solid var(--line-light) }
.doc-sec{
  display:grid; grid-template-columns:132px minmax(0,1fr); gap:clamp(18px,2.6vw,40px);
  padding:clamp(24px,2.8vw,34px) 0; border-bottom:1px solid var(--line-light);
}
.doc-sec > .tag{ padding-top:6px }
.doc-sec h2{ font:400 clamp(20px,2.2vw,30px)/1.14 var(--serif); letter-spacing:-.03em; margin:0 0 14px }
.doc-sec p, .doc-sec li{ font-size:14.5px; line-height:1.68; color:var(--mute-light) }
.doc-sec ul{ margin:0; padding-left:18px }
.doc-sec li{ margin-bottom:7px }
.doc-sec li::marker{ color:var(--jade) }
.doc-sec a{ color:var(--jade); text-decoration:underline; text-underline-offset:2px }

.back{
  display:inline-flex; align-items:center; gap:10px; margin-top:clamp(34px,4vw,56px);
  font-size:11.5px; text-transform:uppercase; letter-spacing:.11em; color:var(--jade);
}
.back:hover{ color:var(--ink) }

@media (max-width:760px){
  .doc-sec{ grid-template-columns:1fr; gap:12px }
  .doc-sec > .tag{ padding-top:0 }
}

/* =========================================================
   АДАПТИВ
   ========================================================= */
@media (max-width:1080px){
  .nav, .header-cta{ display:none }
  .menu-toggle{ display:block }
  .hero-top{ grid-template-columns:1fr }
  .hero-side{ align-self:start; max-width:44ch }
  .thesis{ grid-template-columns:1fr; align-items:start }
}
@media (max-width:760px){
  .hero{ padding-top:118px; min-height:0 }
  .hero-image{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center;
  filter:saturate(.8) contrast(1.08); transform:scale(1.015);
}
.image-shade{
  position:absolute; inset:0;
  background:linear-gradient(90deg, rgba(8,12,11,.9) 0%, rgba(8,12,11,.5) 48%, rgba(8,12,11,.22) 100%),
             linear-gradient(0deg, rgba(8,12,11,.78) 0%, transparent 46%);
}
.hero-mark{ width:78vw; opacity:.07; right:-18vw; bottom:-4vh }
  .hero-bottom{ flex-direction:column; align-items:flex-start; gap:26px }
  .hero-meta{ flex-wrap:wrap; gap:20px 34px }
  .round-link{ width:74px }
  .cookie{ left:12px; width:calc(100% - 24px); flex-direction:column; align-items:flex-start; gap:12px }
  .fab{ right:14px; bottom:14px }
  .case-info{ grid-template-columns:1fr } .case-tag{ text-align:left; padding-top:0 }
}
@media (max-width:460px){
  .marks li{ font-size:10px; padding:8px 13px }
}

@media print{ .site-header,.fab,.popup,.cookie,.ticker{ display:none } body{ background:#fff; color:#000 } }
