/* ══════════════════════════════════════════════════════════════
   Адвокат Коробов В. В.
   Кремовая бумага · чёрная печать · оранжево-жёлтый акцент.
   Секции переключают тему классами band-dark / band-accent.
   ══════════════════════════════════════════════════════════════ */

:root{
  /* светлая тема — базовая */
  --bg:            #F4EFE0;
  --bg-2:          #EBE4D2;
  --fg:            #14140F;
  --fg-2:          #56534A;
  --fg-3:          #8B8577;
  --accent:        #C07A0C;   /* читаемый на кремовом */
  --accent-hi:     #E9A02A;   /* цвет с постера — плашки и линии */
  --hair:          rgba(20,20,15,.16);
  --hair-accent:   rgba(192,122,12,.42);
  --solid-bg:      #14140F;
  --solid-fg:      #F4EFE0;
  --scan-bg:       #E4DCC9;

  --disp:  'Playfair Display', 'Times New Roman', Georgia, serif;
  /* Заголовки разделов и вводный абзац — геометрический гротеск.
     Имя на главной намеренно осталось антиквой: это подпись, а не заголовок. */
  --head:  'Manrope', 'IBM Plex Sans', -apple-system, Arial, sans-serif;
  --sans:  'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mono:  'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace;

  --hd-h: 68px;
  --pad:  clamp(20px, 4vw, 56px);
  --ease: cubic-bezier(.2,.6,.3,1);
}

.band-dark{
  --bg:          #14140F;
  --bg-2:        #1B1B15;
  --fg:          #F4EFE0;
  --fg-2:        #A8A395;
  --fg-3:        #77726A;
  --accent:      #E9A02A;
  --accent-hi:   #F2B44A;
  --hair:        rgba(244,239,224,.16);
  --hair-accent: rgba(233,160,42,.4);
  --solid-bg:    #F4EFE0;
  --solid-fg:    #14140F;
  --scan-bg:     #E4DCC9;
  background:var(--bg); color:var(--fg);
}

.band-accent{
  --bg:          #E9A02A;
  --bg-2:        #E9A02A;
  --fg:          #17130A;
  --fg-2:        #4C3B12;
  --fg-3:        #6E571C;
  --accent:      #17130A;
  --accent-hi:   #17130A;
  --hair:        rgba(23,19,10,.26);
  --hair-accent: rgba(23,19,10,.38);
  --solid-bg:    #17130A;
  --solid-fg:    #F4EFE0;
  --scan-bg:     #F4EFE0;
  background:var(--bg); color:var(--fg);
}

*,*::before,*::after{ box-sizing:border-box; }

html{
  scroll-behavior:smooth; scroll-padding-top:var(--hd-h); background:#14140F;
  overflow-x:hidden; overflow-x:clip;
}
@media (prefers-reduced-motion:reduce){ html{ scroll-behavior:auto; } }

body{
  margin:0; background:var(--bg); color:var(--fg);
  font-family:var(--sans); font-size:16px; font-weight:400; line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden; overflow-x:clip;
}
body.lock{ overflow:hidden; }

img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
h1,h2,h3{ margin:0; font-weight:400; }
dl,dd,dt,p,ul,li{ margin:0; }
ul{ list-style:none; padding:0; }

.wrap{ width:min(1320px, 100% - calc(var(--pad) * 2)); margin-inline:auto; }

.skip{ position:absolute; left:-9999px; }
.skip:focus{ left:0; top:0; z-index:300; background:#14140F; color:#F4EFE0; padding:10px 16px; }
:focus-visible{ outline:2px solid var(--accent); outline-offset:3px; }

/* ── повторяющиеся элементы ───────────────────────────────── */
.kicker{
  font-family:var(--mono); font-size:11px; font-weight:500;
  letter-spacing:.18em; text-transform:uppercase; color:var(--accent);
}
.kicker--in{ display:block; margin:44px 0 18px; color:var(--fg-3); }

.h2{
  font-family:var(--head); font-weight:700;
  font-size:clamp(32px, 4.3vw, 58px);
  line-height:1.08; letter-spacing:-.025em;
}

/* Вводный абзац намеренно набран гротеском, а не антиквой:
   иначе он спорит с заголовками разделов, которые уже Playfair. */
.lede{
  font-family:var(--head); font-weight:600;
  font-size:clamp(20px, 2.15vw, 28px);
  line-height:1.4; letter-spacing:-.02em; color:var(--fg);
}

.prose p{ margin-top:20px; color:var(--fg-2); max-width:62ch; }

.btn{
  display:inline-flex; align-items:center; justify-content:center;
  height:50px; padding:0 30px;
  border:1px solid var(--hair-accent);
  font-family:var(--mono); font-size:12px; font-weight:500;
  letter-spacing:.12em; text-transform:uppercase;
  color:var(--fg); transition:.28s var(--ease);
}
.btn:hover{ background:var(--accent); border-color:var(--accent); color:var(--solid-fg); }
.btn--solid{ background:var(--solid-bg); border-color:var(--solid-bg); color:var(--solid-fg); }
.btn--solid:hover{ background:var(--accent); border-color:var(--accent); color:var(--solid-fg); }

.arrows{ display:flex; }
.arrow{
  width:52px; height:52px; display:grid; place-items:center;
  border:1px solid var(--hair); transition:.25s var(--ease);
}
.arrow + .arrow{ border-left:0; }
.arrow svg{ width:17px; height:17px; fill:none; stroke:var(--accent); stroke-width:1.5; stroke-linecap:square; }
.arrow:hover:not(:disabled){ background:var(--accent); border-color:var(--accent); }
.arrow:hover:not(:disabled) svg{ stroke:var(--solid-fg); }
.arrow:disabled{ opacity:.3; cursor:default; }

/* ══════════════ ШАПКА ══════════════ */
.hd{
  position:fixed; inset:0 0 auto 0; z-index:100; height:var(--hd-h);
  display:flex; align-items:center;
  color:#F4EFE0;
  border-bottom:1px solid transparent; transition:.3s var(--ease);
}
.hd.stuck{
  background:rgba(244,239,224,.94); backdrop-filter:blur(12px);
  color:#14140F; border-bottom-color:rgba(20,20,15,.16);
}
.hd__in{ display:flex; align-items:center; gap:24px; }

.hd__brand{ display:flex; align-items:baseline; gap:10px; flex-shrink:0; }
.hd__brand-name{ font-family:var(--head); font-weight:700; font-size:17.5px; letter-spacing:-.02em; }
.hd__brand-role{ font-family:var(--mono); font-size:10px; font-weight:500; letter-spacing:.2em; text-transform:uppercase; color:#E9A02A; }
.hd.stuck .hd__brand-role{ color:#C07A0C; }

.hd__nav{ display:flex; gap:28px; margin-inline:auto; }
.hd__link{
  font-family:var(--mono); font-size:11.5px; letter-spacing:.13em; text-transform:uppercase;
  opacity:.62; padding:6px 0; position:relative; transition:.25s var(--ease);
}
.hd__link:hover{ opacity:1; }
.hd__link.on{ opacity:1; color:#E9A02A; }
.hd.stuck .hd__link.on{ color:#C07A0C; }
.hd__link.on::after{ content:''; position:absolute; left:0; right:0; bottom:0; height:1px; background:currentColor; }

.hd__tel{ font-family:var(--mono); font-size:12.5px; letter-spacing:.04em; flex-shrink:0; }
.hd__tel:hover{ color:#E9A02A; }
.hd.stuck .hd__tel:hover{ color:#C07A0C; }

.hd__burger{ display:none; flex:0 0 40px; width:40px; height:40px; position:relative; margin-left:auto; }
.hd__burger span{ position:absolute; left:9px; width:22px; height:1.5px; background:currentColor; transition:.3s var(--ease); }
.hd__burger span:nth-child(1){ top:17px; }
.hd__burger span:nth-child(2){ top:23px; }
.hd__burger.on span:nth-child(1){ top:20px; transform:rotate(45deg); }
.hd__burger.on span:nth-child(2){ top:20px; transform:rotate(-45deg); }

/* ══════════════ ГЛАВНАЯ ══════════════ */
.hero{ padding-top:var(--hd-h); }

.hero__grid{
  display:grid; grid-template-columns:1fr minmax(360px, 40%);
  min-height:calc(100svh - var(--hd-h) - 52px);
}

.hero__text{
  padding:clamp(48px, 7vw, 104px) clamp(28px, 5vw, 80px) clamp(48px, 6vw, 88px) var(--pad);
  display:flex; flex-direction:column; justify-content:center;
  max-width:940px; margin-left:max(0px, calc((100vw - 1320px) / 2));
}

.hero__name{
  font-family:var(--head); font-weight:700;
  font-size:clamp(42px, 6.8vw, 104px); line-height:.96; letter-spacing:-.035em;
  margin:28px 0 0;
}
.hero__name-last{
  display:block; color:var(--accent);
  text-shadow:.028em .028em 0 rgba(10,10,7,.9);
}
.hero__name-first{
  display:block; font-family:var(--head); font-weight:500;
  font-size:.32em; line-height:1.15; letter-spacing:-.018em;
  margin-top:.12em; padding-left:.02em; color:var(--fg);
}

.hero__role{
  margin:0; font-family:var(--mono); font-weight:500;
  font-size:clamp(21px, 2.9vw, 40px);
  letter-spacing:.3em; text-transform:uppercase; color:var(--accent);
}

/* Отступ сверху равен отступу имени от строки «Адвокат» —
   имя стоит ровно посередине между надписью и реквизитами. */
.reg{ margin-top:28px; display:grid; max-width:560px; }
.reg > div{
  display:grid; grid-template-columns:minmax(170px, 38%) 1fr; gap:16px;
  padding:11px 0; border-bottom:1px solid var(--hair);
}
.reg dt{ font-family:var(--mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--fg-3); align-self:center; }
.reg dd{ font-family:var(--mono); font-size:14px; letter-spacing:.02em; color:var(--fg); }

.hero__lead{ margin-top:32px; max-width:44ch; color:var(--fg-2); font-size:16.5px; }
.hero__act{ margin-top:34px; display:flex; flex-wrap:wrap; gap:12px; }

.hero__fig{
  margin:0; position:relative; overflow:hidden;
  background:linear-gradient(180deg,#1E1E17,#131310);
  border-left:1px solid var(--hair);
}
/* Фотография показывается как есть: без обесцвечивания,
   растушёвки краёв и цветных наложений. */
.hero__fig img{
  width:100%; height:100%; object-fit:cover; object-position:center 14%;
}
.hero__fig figcaption{
  position:absolute; inset:0; display:none; place-items:center;
  font-family:var(--disp); font-size:clamp(90px, 14vw, 200px); color:rgba(233,160,42,.16);
}
.hero__fig.is-empty img{ display:none; }
.hero__fig.is-empty figcaption{ display:grid; }

.ticker{ display:flex; flex-wrap:wrap; border-top:1px solid var(--hair); background:var(--bg-2); }
.ticker li{
  flex:1 1 auto; padding:16px var(--pad);
  font-family:var(--mono); font-size:11px; letter-spacing:.13em; text-transform:uppercase;
  color:var(--fg-3); white-space:nowrap;
}
.ticker li + li{ border-left:1px solid var(--hair); }

/* ══════════════ Секции и колонки ══════════════ */
.sec{ padding:clamp(72px, 9vw, 132px) 0; }
.sec--rule{ border-top:1px solid var(--hair); }

.cols{ display:grid; grid-template-columns:minmax(150px, 18%) 1fr; gap:clamp(24px, 4vw, 72px); align-items:start; }
.cols__side{ position:sticky; top:calc(var(--hd-h) + 28px); }
.cols--head{ margin-bottom:clamp(40px, 5vw, 68px); }
.cols--head .cols__side{ position:static; }

/* ── Обо мне ── */
.specs{ border-top:1px solid var(--hair); }
.specs > div{
  display:grid; grid-template-columns:minmax(120px, 20%) 1fr; gap:clamp(16px, 3vw, 40px);
  padding:20px 0; border-bottom:1px solid var(--hair);
}
.specs dt{ font-family:var(--mono); font-size:11px; font-weight:500; letter-spacing:.14em; text-transform:uppercase; color:var(--accent); padding-top:3px; }
.specs dd{ color:var(--fg-2); max-width:56ch; }

/* ── Практика ── */
.pract{ margin-top:clamp(40px, 5vw, 72px); border-top:1px solid var(--hair); }
.pract__item{
  display:grid; grid-template-columns:minmax(150px, 18%) 1fr; gap:clamp(24px, 4vw, 72px);
  padding:clamp(36px, 4.5vw, 64px) 0; border-bottom:1px solid var(--hair);
}
.pract__no{
  font-family:var(--disp); font-size:clamp(28px, 3.4vw, 46px); line-height:1;
  color:var(--accent); letter-spacing:.02em;
}
.pract__body h3{
  font-family:var(--head); font-weight:600;
  font-size:clamp(25px, 2.9vw, 38px); line-height:1.15; letter-spacing:-.02em;
}
.pract__lead{ margin-top:18px; color:var(--fg-2); max-width:66ch; }

.articles{ border-top:1px solid var(--hair); }
.articles li{
  display:grid; grid-template-columns:minmax(136px, 168px) 1fr; gap:clamp(14px, 2.5vw, 32px);
  padding:13px 0; border-bottom:1px solid var(--hair);
  transition:.22s var(--ease);
}
.articles li:hover{ background:rgba(192,122,12,.09); }
.articles__no{ font-family:var(--mono); font-size:13px; font-weight:500; letter-spacing:.02em; color:var(--accent); white-space:nowrap; }
.articles__no::before{ content:'ст. '; color:var(--fg-3); font-weight:400; }
.articles__name{ color:var(--fg-2); font-size:15.5px; }

.deflist{ margin-top:26px; border-top:1px solid var(--hair); }
.deflist > div{
  display:grid; grid-template-columns:minmax(190px, 32%) 1fr; gap:clamp(16px, 3vw, 40px);
  padding:18px 0; border-bottom:1px solid var(--hair);
}
.deflist dt{ font-size:15.5px; color:var(--fg); font-weight:500; }
.deflist dd{ color:var(--fg-2); font-size:15.5px; max-width:56ch; }

/* ══════════════ ГОНОРАР ══════════════ */
.fee{ display:grid; grid-template-columns:1fr minmax(230px, 290px); gap:clamp(32px, 5vw, 80px); align-items:start; }
/* У кнопки не было внешнего отступа: он жил на .btn--ink, который
   исчез вместе со старой палитрой, и кнопка села вплотную к тексту. */
.fee__main .btn{ margin-top:32px; }
.fee__side{ border-top:1px solid var(--hair); }
.fee__side > div{ padding:15px 0; border-bottom:1px solid var(--hair); }
.fee__side dt{ font-family:var(--mono); font-size:10.5px; font-weight:500; letter-spacing:.16em; text-transform:uppercase; color:var(--fg-3); }
.fee__side dd{ margin-top:6px; font-size:17px; color:var(--fg); }
.fee__side dd a{ border-bottom:1px solid transparent; transition:.22s var(--ease); }
.fee__side dd a:hover{ border-bottom-color:currentColor; }

/* ══════════════ ДОКУМЕНТЫ ══════════════ */
.docs__head{ display:flex; align-items:flex-end; justify-content:space-between; gap:24px; flex-wrap:wrap; }

.strip{ border-top:1px solid var(--hair); border-bottom:1px solid var(--hair); }
.strip__track{ display:flex; overflow-x:auto; scroll-snap-type:x mandatory; scroll-behavior:smooth; scrollbar-width:none; }
.strip__track::-webkit-scrollbar{ display:none; }

.card{
  margin:0; flex:0 0 clamp(230px, 24vw, 300px); scroll-snap-align:start;
  border-right:1px solid var(--hair); cursor:pointer;
  transition:background .3s var(--ease);
}
.card:first-child{ border-left:1px solid var(--hair); }
.card:hover{ background:rgba(233,160,42,.08); }

.card__img{ aspect-ratio:1/1.32; overflow:hidden; background:var(--scan-bg); }
.card__img img{ width:100%; height:100%; object-fit:cover; object-position:top center; filter:saturate(.7); transition:.6s var(--ease); }
.card:hover .card__img img{ filter:saturate(1) contrast(1.04); transform:scale(1.03); }

.card figcaption{ padding:18px 20px 24px; display:flex; flex-direction:column; gap:8px; }
.card__meta{ font-family:var(--mono); font-size:10.5px; font-weight:500; letter-spacing:.14em; text-transform:uppercase; color:var(--accent); }
.card__name{ font-size:15px; color:var(--fg-2); line-height:1.35; }
.card:hover .card__name{ color:var(--fg); }

/* ══════════════ ОТЗЫВЫ ══════════════ */
.letters{ display:grid; gap:clamp(24px, 3vw, 40px); }

.letter{
  display:grid; grid-template-columns:minmax(190px, 250px) 1fr;
  gap:clamp(26px, 4vw, 60px); align-items:start;
  padding:clamp(26px, 3.2vw, 44px);
  border:1px solid var(--hair);
  background:linear-gradient(150deg, rgba(233,160,42,.13), transparent 62%);
}
.letter--text,
.letter--photo{ grid-template-columns:1fr; }

.letter.is-draft{ border-style:dashed; opacity:.62; }

.letter__scan{
  position:relative; display:block; aspect-ratio:1/1.41; overflow:hidden;
  border:1px solid var(--hair); background:var(--scan-bg);
  transition:.3s var(--ease);
}
.letter__scan img{ width:100%; height:100%; object-fit:cover; object-position:top center; }
.letter__scan-tag{
  position:absolute; inset:auto 0 0 0; padding:9px 0; text-align:center;
  font-family:var(--mono); font-size:9.5px; font-weight:500; letter-spacing:.18em; text-transform:uppercase;
  background:rgba(20,20,15,.84); color:#F4EFE0;
}
.letter__scan:hover{ border-color:var(--hair-accent); }
.letter__scan.is-empty{ background:var(--bg-2); border-style:dashed; pointer-events:none; }
.letter__scan.is-empty img{ display:none; }
.letter__scan.is-empty .letter__scan-tag{ background:none; color:var(--fg-3); inset:auto 0 44% 0; }
.letter__scan--wide{
  aspect-ratio:auto; max-width:560px; margin-top:22px;
}
.letter__scan--wide img{ height:auto; object-fit:contain; }


.letter__badge{
  font-family:var(--mono); font-size:10.5px; font-weight:500; letter-spacing:.18em;
  text-transform:uppercase; color:var(--accent);
}
.letter__quote{ margin:22px 0 0; }
/* Тот же гротеск, что и в описаниях направлений практики.
   Кегль оставлен прежним — поменялось только начертание. */
.letter__quote p{
  font-family:var(--sans); font-weight:400;
  font-size:clamp(19px, 1.95vw, 27px); line-height:1.44;
  letter-spacing:0; color:var(--fg); max-width:46ch; text-indent:-.4em;
}
.letter__quote p:first-child::before{ content:'«'; }
.letter__quote p:last-child::after{ content:'»'; }
.letter__quote p + p{ margin-top:18px; text-indent:0; color:var(--fg-2); }

.letter__sign{
  margin-top:30px; padding-top:22px; border-top:1px solid var(--hair);
  display:flex; align-items:center; gap:16px;
}
.letter__face{
  flex:0 0 64px; width:64px; height:64px; overflow:hidden; border-radius:50%;
  border:1px solid var(--hair-accent); background:var(--bg-2);
}
.letter__face img{ width:100%; height:100%; object-fit:cover; filter:grayscale(1) contrast(1.08); }
.letter__face.is-empty{ display:none; }
.letter__name{ font-size:16px; font-weight:500; color:var(--fg); }
.letter__pos{ margin-top:3px; font-size:13.5px; color:var(--fg-3); }

.words{ margin-top:clamp(52px, 6vw, 88px); }
.words__head{ display:flex; align-items:flex-end; justify-content:space-between; gap:24px; }
.words__head .kicker--in{ margin:0; }

.words__track{ display:flex; overflow-x:auto; scroll-snap-type:x mandatory; scroll-behavior:smooth; scrollbar-width:none; margin-top:22px; border-top:1px solid var(--hair); }
.words__track::-webkit-scrollbar{ display:none; }

.word{
  flex:0 0 clamp(280px, 30vw, 380px); scroll-snap-align:start;
  padding:30px 30px 28px; border-right:1px solid var(--hair);
  display:flex; flex-direction:column;
}
.word:first-child{ border-left:1px solid var(--hair); }
.word.is-empty{ opacity:.55; }
.word__stars{ display:flex; gap:3px; margin-bottom:18px; }
.word__stars i{
  width:15px; height:15px; display:block; background:var(--accent-hi);
  clip-path:polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%,
                    50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%);
}
/* Незакрашенная звезда — та же форма приглушённым тоном,
   чтобы оценка читалась как «4 из 5», а не просто «4». */
.word__stars i.off{ background:rgba(20,20,15,.18); }
/* Отзывы бывают и на тысячу знаков. Без ограничения один такой
   растягивает всю ленту по высоте, поэтому длинные сворачиваем. */
.word__text{
  position:relative; color:var(--fg-2); font-size:15.5px; flex:1;
  max-height:17em; overflow:hidden;
}
.word__text p + p{ margin-top:12px; }
.word__text::after{
  content:''; position:absolute; inset:auto 0 0 0; height:3.2em; pointer-events:none;
  background:linear-gradient(transparent, var(--bg));
  opacity:0; transition:opacity .2s var(--ease);
}
.word.is-clipped .word__text::after{ opacity:1; }
.word.is-open .word__text{ max-height:none; }
.word.is-open .word__text::after{ opacity:0; }

.word__more{
  align-self:flex-start; margin-top:14px; padding:0;
  font-family:var(--mono); font-size:10.5px; font-weight:500;
  letter-spacing:.14em; text-transform:uppercase; color:var(--accent);
  border-bottom:1px solid currentColor;
}
.word__more:hover{ color:var(--fg); }

.word__tags{ display:flex; flex-wrap:wrap; gap:6px; margin-top:16px; }
.word__tags span{
  padding:4px 10px; border:1px solid var(--hair);
  font-family:var(--mono); font-size:10px; letter-spacing:.06em; color:var(--fg-3);
}
.word__by{ margin-top:24px; padding-top:16px; border-top:1px solid var(--hair); display:flex; justify-content:space-between; gap:14px; align-items:baseline; }
.word__by span:first-child{ font-size:15px; font-weight:500; color:var(--fg); }
.word__by span:last-child{ font-family:var(--mono); font-size:10.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--fg-3); }

.words__links{ display:flex; flex-wrap:wrap; align-items:center; gap:14px 24px; margin-top:32px; }
.words__note{ font-size:14.5px; color:var(--fg-2); max-width:46ch; }

/* ══════════════ КОНТАКТЫ ══════════════ */
.contact{ display:grid; grid-template-columns:1fr minmax(320px, 46%); gap:clamp(28px, 4vw, 64px); align-items:start; }

.contact__list{ border-top:1px solid var(--hair); }
.contact__list > div{
  display:grid; grid-template-columns:minmax(120px, 24%) 1fr; gap:clamp(16px, 3vw, 36px);
  padding:20px 0; border-bottom:1px solid var(--hair);
}
.contact__list dt{ font-family:var(--mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--fg-3); padding-top:5px; }
.contact__list dd a{ display:inline-block; font-size:19px; color:var(--fg); border-bottom:1px solid transparent; transition:.22s var(--ease); }
.contact__list dd a:hover{ color:var(--accent); border-bottom-color:currentColor; }
.contact__list dd a + a{ margin-top:6px; }
.contact__note{ display:block; margin-top:8px; font-size:13.5px; color:var(--fg-3); }

.contact__map{ border:1px solid var(--hair); aspect-ratio:4/3.6; }
/* Раньше карта глушилась в серо-сепийный тон — это было уместно,
   пока она показывала просто точку. Теперь в ней карточка организации
   с рейтингом и кнопками, и фильтр ломал её собственные цвета. */
.contact__map iframe{ width:100%; height:100%; border:0; filter:saturate(.92); }

/* ══════════════ ПОДВАЛ ══════════════ */
.ft{ padding:clamp(48px, 6vw, 80px) 0 44px; }
.ft__in{ display:grid; gap:32px; }
.ft__name{ font-family:var(--head); font-weight:700; font-size:21px; letter-spacing:-.02em; }
.ft__reg{ margin-top:8px; font-family:var(--mono); font-size:11.5px; letter-spacing:.06em; line-height:1.8; color:var(--fg-3); }
.ft__nav{ display:flex; flex-wrap:wrap; gap:10px 30px; padding:22px 0; border-block:1px solid var(--hair); }
.ft__nav a{ font-family:var(--mono); font-size:11px; letter-spacing:.13em; text-transform:uppercase; color:var(--fg-2); }
.ft__nav a:hover{ color:var(--accent); }
.ft__note{ font-size:13px; color:var(--fg-3); max-width:78ch; line-height:1.75; }
.ft__copy{ font-family:var(--mono); font-size:11px; color:var(--fg-3); }

/* ══════════════ Нижняя панель на телефоне ══════════════ */
.dock{ position:fixed; inset:auto 0 0 0; z-index:90; display:none; background:#14140F; }
.dock a{
  flex:1; text-align:center; padding:16px 8px;
  font-family:var(--mono); font-size:11.5px; font-weight:500;
  letter-spacing:.14em; text-transform:uppercase; color:#F4EFE0;
}
.dock a:first-child{ background:#E9A02A; color:#17130A; }

/* ══════════════ Просмотр документа ══════════════ */
.lb{
  position:fixed; inset:0; z-index:200; background:rgba(15,15,11,.96);
  color:#F4EFE0;
  display:grid; place-items:center; padding:70px 80px;
  opacity:0; transition:opacity .25s var(--ease);
}
.lb[hidden]{ display:none; }
.lb.show{ opacity:1; }

.lb__stage{ margin:0; display:grid; grid-template-columns:auto minmax(240px, 300px); gap:clamp(24px, 4vw, 56px); align-items:center; max-height:100%; }
.lb__stage img{ max-height:76vh; width:auto; object-fit:contain; background:#E4DCC9; }
.lb__stage figcaption{ max-width:38ch; }
.lb__sub{ font-family:var(--mono); font-size:10.5px; font-weight:500; letter-spacing:.15em; text-transform:uppercase; color:#E9A02A; }
.lb__title{ margin-top:16px; font-family:var(--head); font-weight:600; font-size:clamp(19px, 2vw, 26px); line-height:1.32; letter-spacing:-.015em; }
.lb__pdf{
  display:inline-flex; align-items:center; height:44px; padding:0 24px; margin-top:26px;
  border:1px solid rgba(233,160,42,.45);
  font-family:var(--mono); font-size:11px; font-weight:500; letter-spacing:.13em; text-transform:uppercase; color:#E9A02A;
  transition:.25s var(--ease);
}
.lb__pdf:hover{ background:#E9A02A; border-color:#E9A02A; color:#17130A; }

.lb__x{ position:absolute; top:20px; right:22px; width:48px; height:48px; display:grid; place-items:center; border:1px solid rgba(244,239,224,.2); }
.lb__x svg{ width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.4; }
.lb__x:hover{ border-color:#E9A02A; color:#E9A02A; }

.lb__nav{ position:absolute; top:50%; transform:translateY(-50%); width:48px; height:48px; display:grid; place-items:center; border:1px solid rgba(244,239,224,.2); }
.lb__nav svg{ width:17px; height:17px; fill:none; stroke:#E9A02A; stroke-width:1.5; stroke-linecap:square; }
.lb__nav:hover{ background:#E9A02A; }
.lb__nav:hover svg{ stroke:#17130A; }
.lb__nav--prev{ left:18px; } .lb__nav--next{ right:18px; }

.lb__count{ position:absolute; bottom:24px; left:50%; transform:translateX(-50%); font-family:var(--mono); font-size:11px; letter-spacing:.14em; color:rgba(244,239,224,.5); }

/* ══════════════ Появление ══════════════ */
.rv{ opacity:0; transform:translateY(18px); transition:opacity .8s var(--ease), transform .8s var(--ease); }
.rv.in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){ .rv{ opacity:1; transform:none; transition:none; } }

/* ══════════════ АДАПТИВ ══════════════ */
@media (max-width:1160px){
  .hd__nav{ display:none; }
  .hd__in{ gap:18px; }
  .hd__tel{ margin-left:auto; }
  .hd__burger{ display:block; margin-left:0; }

  .hd__nav.open{
    display:flex; flex-direction:column;
    position:fixed; inset:var(--hd-h) 0 auto 0; margin:0;
    background:#14140F; color:#F4EFE0;
    border-bottom:1px solid rgba(244,239,224,.16);
    padding:0 var(--pad) 20px;
    max-height:calc(100svh - var(--hd-h)); overflow-y:auto;
  }
  .hd__nav.open .hd__link{ padding:18px 0; font-size:13px; opacity:1; border-bottom:1px solid rgba(244,239,224,.16); }
  .hd__nav.open .hd__link.on{ color:#E9A02A; }
  .hd__nav.open .hd__link.on::after{ display:none; }
}

@media (max-width:960px){
  .hero__grid{ grid-template-columns:1fr; min-height:0; }
  .hero__text{ order:2; margin-left:0; padding:clamp(36px,6vw,56px) var(--pad) clamp(44px,6vw,64px); }
  .hero__fig{ order:1; height:min(58svh, 460px); border-left:0; border-bottom:1px solid var(--hair); }
  .hero__fig img{ object-position:center 12%; }

  .cols, .pract__item{ grid-template-columns:1fr; gap:20px; }
  .cols__side{ position:static; }
  .pract__no{ font-size:24px; }
  .letter{ grid-template-columns:1fr; gap:26px; }
  .letter__scan{ max-width:230px; }
  .letter__quote p{ max-width:none; }

  .contact{ grid-template-columns:1fr; }
  .contact__map{ aspect-ratio:4/3; }
  .fee{ grid-template-columns:1fr; }

  .lb{ padding:66px 16px 70px; }
  .lb__stage{ grid-template-columns:1fr; gap:22px; justify-items:center; text-align:center; }
  .lb__stage img{ max-height:52vh; }
  .lb__stage figcaption{ max-width:44ch; }
}

@media (max-width:640px){
  body{ font-size:15.5px; }
  .dock{ display:flex; }
  .hd__tel{ display:none; }
  .hd__burger{ margin-left:auto; }
  .ft{ padding-bottom:82px; }

  .ticker{ display:none; }
  .hero__act{ flex-direction:column; align-items:stretch; }
  .hero__role{ letter-spacing:.3em; }
  .reg > div{ grid-template-columns:1fr; gap:4px; padding:12px 0; }

  .deflist > div,
  .contact__list > div{ grid-template-columns:1fr; gap:7px; }
  .articles li{ grid-template-columns:1fr; gap:4px; padding:14px 0; }

  /* ── Мобильные ленты ──────────────────────────────────────────
     На узком экране длинные текстовые блоки сливаются в сплошную
     простыню. Разбиваем их на карточки и листаем вбок: карточка
     занимает 85% ширины, край следующей видно — это и подсказывает,
     что ленту можно двигать. Отрицательные поля выводят ленту
     за поля страницы, чтобы она шла от края до края экрана. */

  /* «Почему доверители выбирают меня» — отдельные плитки */
  .specs{ border-top:0; display:grid; gap:8px; }
  .specs > div{
    grid-template-columns:1fr; gap:6px;
    padding:16px 18px; border:1px solid var(--hair); border-bottom:1px solid var(--hair);
    background:var(--bg-2);
  }
  .specs dt{ padding-top:0; font-size:11.5px; }
  .specs dd{ color:var(--fg); max-width:none; }

  /* «Практика» — три направления лентой */
  .pract{
    border-top:0; margin-top:28px;
    display:flex; align-items:flex-start; gap:12px;
    overflow-x:auto; scroll-snap-type:x mandatory;
    margin-inline:calc(var(--pad) * -1);
    padding:0 var(--pad);
    /* Без этой строки привязка к точкам прокрутки доводит первую плашку
       вплотную к краю экрана, съедая padding: она выравнивает край
       карточки по краю области прокрутки. scroll-padding сдвигает
       саму эту область, и отступ сохраняется — такой же, как у заголовка. */
    scroll-padding-inline:var(--pad);
    scrollbar-width:none;
  }
  .pract::-webkit-scrollbar{ display:none; }
  .pract__item{
    flex:0 0 85%; scroll-snap-align:start;
    display:block; padding:22px 18px;
    border:1px solid var(--hair); border-bottom:1px solid var(--hair);
    background:var(--bg-2);
  }
  .pract__no{ font-size:20px; margin-bottom:10px; }
  .pract__lead{ margin-top:14px; }
  .articles li:last-child,
  .deflist > div:last-child{ border-bottom:0; }

  .card{ flex-basis:min(72vw, 260px); }
  .word{ flex-basis:min(82vw, 330px); padding:24px 22px; }
  .words__head{ flex-direction:column; align-items:flex-start; gap:16px; }
  .docs__head{ align-items:flex-start; }

  .letter{ padding:22px 20px; }
  .letter__scan{ max-width:180px; }

  .lb__nav{ width:42px; height:42px; }
  .lb__nav--prev{ left:6px; } .lb__nav--next{ right:6px; }
}