/* Страница направления практики (practice/*.html), раскладка «Карта стадий»: процесс как золотой путь со станциями */
body.subpage { background: #151617; }
main ol { list-style: none; margin: 0; padding: 0; }
.pr-sec { position: relative; }
.pr-sec .heading { margin-top: 0; }
.pr-label { font: 400 calc(11.5 * var(--u)) / calc(16 * var(--u)) var(--label-font); letter-spacing: 0.18em; text-transform: uppercase; }
.pr-num { color: var(--gold); }
.pr-title { font: 500 calc(20 * var(--u)) / calc(26 * var(--u)) var(--sans); color: #f3f3f2; }
.pr-p { font: 400 calc(15 * var(--u)) / calc(24 * var(--u)) var(--sans); color: var(--text); text-wrap: pretty; }
.pr-btn { position: static; display: inline-flex; height: calc(50 * var(--u)); }
.pr-link .link__arrow { width: calc(15.4 * var(--u)); height: calc(8.75 * var(--u)); }
.pr-phone { white-space: nowrap; color: var(--gold); transition: color .25s ease; }
.pr-phone:hover { color: #e6cba6; }

/* Хлебные крошки */
.pr-crumbs { display: flex; align-items: center; gap: calc(12 * var(--u)); color: var(--muted); }
.pr-crumbs a { transition: color .25s ease; }
.pr-crumbs a:hover { color: var(--gold); }
.pr-crumbs__sep { color: var(--gold-dim); }
.pr-crumbs [aria-current] { color: #cfcfce; }

/* Листы с волнистым краем: маска на подложке, золотая нить отдельным слоем поверх шва */
.pr-sheet { position: relative; margin-inline: calc(-110 * var(--u)); padding-inline: calc(110 * var(--u)); }
.pr-sheet__bg { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.pr-sheet > :not(.pr-sheet__bg, .pr-sheet__line) { position: relative; }
.pr-sheet__line { position: absolute; left: 0; width: 100%; pointer-events: none; background: 0 0 / 100% 100% no-repeat; }
.pr-sheet--w1 .pr-sheet__bg { -webkit-mask: var(--wave-1-mask) 0 0 / 100% calc(712 * var(--u)) no-repeat, linear-gradient(#000, #000) 0 calc(700 * var(--u)) / 100% calc(100% - 700 * var(--u)) no-repeat; mask: var(--wave-1-mask) 0 0 / 100% calc(712 * var(--u)) no-repeat, linear-gradient(#000, #000) 0 calc(700 * var(--u)) / 100% calc(100% - 700 * var(--u)) no-repeat; }
.pr-sheet--w1 .pr-sheet__line { top: calc(11 * var(--u)); height: calc(245 * var(--u)); background-image: var(--wave-1-line); }
.pr-sheet--w2 .pr-sheet__bg { -webkit-mask: var(--wave-2-mask) 0 0 / 100% calc(612 * var(--u)) no-repeat, linear-gradient(#000, #000) 0 calc(600 * var(--u)) / 100% calc(100% - 600 * var(--u)) no-repeat; mask: var(--wave-2-mask) 0 0 / 100% calc(612 * var(--u)) no-repeat, linear-gradient(#000, #000) 0 calc(600 * var(--u)) / 100% calc(100% - 600 * var(--u)) no-repeat; }
.pr-sheet--w2 .pr-sheet__line { top: calc(23 * var(--u)); height: calc(140 * var(--u)); background-image: var(--wave-2-line); }
.pr-sheet--w3 .pr-sheet__bg { -webkit-mask: var(--wave-3-mask) 0 0 / 100% calc(452 * var(--u)) no-repeat, linear-gradient(#000, #000) 0 calc(440 * var(--u)) / 100% calc(100% - 440 * var(--u)) no-repeat; mask: var(--wave-3-mask) 0 0 / 100% calc(452 * var(--u)) no-repeat, linear-gradient(#000, #000) 0 calc(440 * var(--u)) / 100% calc(100% - 440 * var(--u)) no-repeat; }
.pr-sheet--w3 .pr-sheet__line { top: calc(7 * var(--u)); height: calc(164 * var(--u)); background-image: var(--wave-3-line); }

/* Первый экран: текст слева, шахматы справа растворяются в графит.
   Высоты первого экрана считаются в --hu: меньшее из масштаба по ширине и высоты окна, поэтому на ноутбуках
   с невысоким окном (MacBook Air 13″: 1440×790, 1470×830) экран целиком помещается вместе с волной перехода */
.pr-hero { --hu: min(var(--u), calc(100svh / 900)); position: relative; margin: calc(-170 * var(--u)) calc(-110 * var(--u)) 0; padding: calc(170 * var(--hu)) calc(110 * var(--u)) calc(56 * var(--hu)); min-height: calc(740 * var(--hu)); box-sizing: border-box; }
.pr-hero__img { position: absolute; right: 0; top: 0; width: calc(880 * var(--u)); height: calc(700 * var(--hu)); object-fit: cover; object-position: 72% 40%;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, rgba(0, 0, 0, .5) 24%, #000 48%), linear-gradient(180deg, #000 58%, transparent 100%); -webkit-mask-composite: source-in;
  mask-image: linear-gradient(90deg, transparent 0, rgba(0, 0, 0, .5) 24%, #000 48%), linear-gradient(180deg, #000 58%, transparent 100%); mask-composite: intersect; }
.pr-hero__body { position: relative; width: calc(520 * var(--u)); }
.pr-hero .kicker { margin-top: calc(64 * var(--hu)); }
.pr-h1 { margin-top: calc(22 * var(--hu)); font: 400 calc(71 * var(--hu)) / calc(84 * var(--hu)) var(--serif); letter-spacing: 0.045em; text-transform: uppercase; color: #f7f7f6; }
.pr-h1 .gold { color: #e3c7a1; }
/* Длинные названия направлений («Споры с контролирующими органами», «Репутация и трансграничные вопросы»):
   заголовок мельче и шире, чтобы длинные слова не рвались и не срезались */
.pr-hero__body:has(.pr-h1--long) { width: calc(640 * var(--u)); }
.pr-h1--long { font-size: calc(50 * var(--hu)); line-height: calc(60 * var(--hu)); letter-spacing: 0.03em; }
/* Кадр фото первого экрана под предмет конкретного направления */
.pr-hero--civil .pr-hero__img { object-position: 100% 40%; }
.pr-hero .lead { margin-top: calc(28 * var(--hu)); width: calc(480 * var(--u)); text-wrap: pretty; }
.pr-actions { display: flex; align-items: center; gap: calc(32 * var(--u)); margin-top: calc(40 * var(--hu)); }

/* Стадии: горизонтальный золотой путь с четырьмя станциями */
.pr-stages { margin-top: calc(-10 * var(--u)); padding-top: calc(240 * var(--u)); padding-bottom: calc(140 * var(--u)); }
.pr-stages .pr-sheet__bg { background: linear-gradient(180deg, #17181a 0%, #151618 30%, #141517 100%); }
.pr-route { position: relative; margin-top: calc(64 * var(--u)); }
.pr-route__line { position: absolute; left: 0; right: calc(2 * var(--u)); top: calc(39 * var(--u)); height: 1px; background: linear-gradient(90deg, rgba(201, 166, 124, .45), rgba(214, 180, 138, .8) 50%, rgba(226, 196, 156, .95)); }
.pr-route__arrow { position: absolute; right: 0; top: calc(34.5 * var(--u)); width: calc(16 * var(--u)); height: calc(10 * var(--u)); fill: none; stroke: #e2c49c; stroke-width: 1.1; overflow: visible; }
.pr-route ol { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); column-gap: calc(48 * var(--u)); }
.pr-station__head { display: flex; align-items: baseline; gap: calc(12 * var(--u)); color: #cfcfce; }
.pr-station__node { display: block; width: calc(11 * var(--u)); height: calc(11 * var(--u)); margin-top: calc(18 * var(--u)); box-sizing: border-box; border: 1px solid var(--gold); border-radius: 50%; background: radial-gradient(circle, var(--gold) 0 calc(1.6 * var(--u)), #17181a calc(2.2 * var(--u))); }
.pr-station .pr-title { margin-top: calc(30 * var(--u)); min-height: calc(52 * var(--u)); }
.pr-station .pr-p { margin-top: calc(14 * var(--u)); }

/* Когда обращаются: шесть ситуаций 3×2 между волосными линиями */
.pr-cases-block { margin-top: calc(140 * var(--u)); }
.pr-cases { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: calc(56 * var(--u)); border-top: 1px solid rgba(201, 166, 124, 0.22); }
.pr-case { padding: calc(34 * var(--u)) calc(40 * var(--u)) calc(40 * var(--u)); border-left: 1px solid rgba(201, 166, 124, 0.22); }
.pr-case:nth-child(3n+1) { padding-left: 0; border-left: 0; }
.pr-case:nth-child(3n) { padding-right: 0; }
.pr-case:nth-child(n+4) { border-top: 1px solid rgba(201, 166, 124, 0.22); }
.pr-case .pr-title { margin-top: calc(14 * var(--u)); }
.pr-case .pr-p { margin-top: calc(12 * var(--u)); }

/* Если это происходит сейчас: отдельный лист на мраморе */
.pr-urgent { padding-top: calc(170 * var(--u)); padding-bottom: calc(230 * var(--u)); }
.pr-urgent .pr-sheet__bg { background: #131415; }
.pr-urgent__ground { position: absolute; inset: 0; background: url("assets/faq/faq-library.webp") left center / auto 150% no-repeat; }
.pr-urgent__tone { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(19, 20, 21, 0.3) 0%, rgba(19, 20, 21, 0.62) 24%, rgba(19, 20, 21, 0.94) 40%, #131415 52%); }
.pr-urgent__grid { display: grid; grid-template-columns: calc(380 * var(--u)) calc(690 * var(--u)); justify-content: space-between; align-items: start; }
.pr-urgent__phone { display: grid; grid-template-columns: calc(22 * var(--u)) auto; column-gap: calc(16 * var(--u)); align-items: center; margin-top: calc(44 * var(--u)); }
.pr-urgent__phone .contact__icon { margin: 0; }
.pr-urgent__phone .pr-phone { font: 500 calc(34 * var(--u)) / calc(40 * var(--u)) var(--sans); letter-spacing: 0.01em; }
.pr-steps { border-bottom: 1px solid rgba(201, 166, 124, 0.3); }
.pr-step { display: grid; grid-template-columns: calc(64 * var(--u)) minmax(0, 1fr); align-items: baseline; padding: calc(22 * var(--u)) 0; border-top: 1px solid rgba(201, 166, 124, 0.3); }
.pr-step .lead { text-wrap: pretty; }

/* Как строится работа, вопросы, публикации, другие направления */
.pr-rest { margin-top: calc(-110 * var(--u)); padding-top: calc(190 * var(--u)); }
.pr-rest .pr-sheet__bg { background: linear-gradient(180deg, #161718 0%, #151617 40%); }
.pr-work { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); column-gap: calc(48 * var(--u)); margin-top: calc(56 * var(--u)); }
.pr-work li { padding-top: calc(24 * var(--u)); border-top: 1px solid rgba(201, 166, 124, 0.3); }
.pr-work__head { display: flex; align-items: baseline; gap: calc(14 * var(--u)); }
.pr-work .pr-p { margin-top: calc(12 * var(--u)); color: var(--muted); }
.pr-split { display: grid; grid-template-columns: calc(340 * var(--u)) calc(760 * var(--u)); justify-content: space-between; align-items: start; margin-top: calc(140 * var(--u)); }
.pr-split .link { margin-top: calc(32 * var(--u)); }
.pr-split .faq__list { position: static; width: auto; }
.pr-split .pubs { position: static; width: auto; }
.pr-others { margin-top: calc(140 * var(--u)); }
.pr-others__head { display: flex; justify-content: space-between; align-items: flex-end; }
.pr-others .paths { position: static; width: auto; margin-top: calc(48 * var(--u)); grid-template-columns: repeat(3, minmax(0, 1fr)); }
.pr-path { display: flex; flex-direction: column; flex: 1; }
.pr-path__foot { position: relative; display: flex; justify-content: space-between; align-items: flex-end; gap: calc(24 * var(--u)); margin-top: calc(-16 * var(--u)); }
.pr-path__foot .path__title { margin-top: 0; }
.pr-path__foot .pub__arrow { flex: none; margin-bottom: calc(8 * var(--u)); }
.pr-path:is(:hover, :focus-visible) .pub__arrow { transform: translateX(calc(4 * var(--u))); }

/* Призыв */
.pr-cta { margin-top: calc(50 * var(--u)); padding-top: calc(220 * var(--u)); }
.pr-cta .pr-sheet__bg { background: linear-gradient(180deg, #141415 0%, #151617 100%); }
.pr-cta__grid { display: grid; grid-template-columns: calc(520 * var(--u)) calc(470 * var(--u)); justify-content: space-between; align-items: end; }
.pr-cta .pr-p { margin-top: calc(24 * var(--u)); }
.pr-cta__actions { display: flex; flex-direction: column; align-items: flex-start; gap: calc(28 * var(--u)); }
.pr-cta__actions .contact__line { font-size: inherit; }
.pr-note { margin-top: calc(72 * var(--u)); font: 400 calc(13.5 * var(--u)) / calc(20 * var(--u)) var(--sans); color: var(--muted); }
.canvas--sub .site-footer { margin-top: calc(56 * var(--u)); }

/* Телефоны и планшеты: одна колонка, стадии — вертикальной нитью */
@media (max-width: 1099px) {
  .page .pr-sheet { margin-inline: 0; padding-inline: max(var(--pad), env(safe-area-inset-left)) max(var(--pad), env(safe-area-inset-right)); margin-top: -44px; }
  .page .pr-sheet__line { display: none; }
  .page .pr-sheet::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 60px; z-index: 2; pointer-events: none; background: 0 0 / 100% 100% no-repeat; }
  .page .pr-sheet--w1::before { background-image: var(--wave-a-line); }
  .page .pr-sheet--w2::before { background-image: var(--wave-b-line); }
  .page .pr-sheet--w3::before { background-image: var(--wave-c-line); }
  .page .pr-sheet--w1 .pr-sheet__bg { -webkit-mask: var(--wave-a-mask) 0 0 / 100% 60px no-repeat, linear-gradient(#000, #000) 0 59px / 100% calc(100% - 59px) no-repeat; mask: var(--wave-a-mask) 0 0 / 100% 60px no-repeat, linear-gradient(#000, #000) 0 59px / 100% calc(100% - 59px) no-repeat; }
  .page .pr-sheet--w2 .pr-sheet__bg { -webkit-mask: var(--wave-b-mask) 0 0 / 100% 60px no-repeat, linear-gradient(#000, #000) 0 59px / 100% calc(100% - 59px) no-repeat; mask: var(--wave-b-mask) 0 0 / 100% 60px no-repeat, linear-gradient(#000, #000) 0 59px / 100% calc(100% - 59px) no-repeat; }
  .page .pr-sheet--w3 .pr-sheet__bg { -webkit-mask: var(--wave-c-mask) 0 0 / 100% 60px no-repeat, linear-gradient(#000, #000) 0 59px / 100% calc(100% - 59px) no-repeat; mask: var(--wave-c-mask) 0 0 / 100% 60px no-repeat, linear-gradient(#000, #000) 0 59px / 100% calc(100% - 59px) no-repeat; }
  .page .pr-label { font-size: 11px; line-height: 1.5; }
  .page .pr-title { font-size: 19px; line-height: 1.35; }
  .page .pr-p { font-size: 15px; line-height: 1.6; }
  .page .pr-link .link__arrow { width: 16px; height: 10px; }
  .page .pr-hero { min-height: 0; margin: 0; padding: 0 max(var(--pad), env(safe-area-inset-right)) 72px max(var(--pad), env(safe-area-inset-left)); }
  .page .pr-hero__img { position: relative; right: auto; top: auto; width: calc(100% + 2 * var(--pad)); max-width: none; height: min(84vw, 50svh); margin-inline: calc(-1 * var(--pad)); object-position: 70% 40%;
    -webkit-mask-image: linear-gradient(180deg, #000 55%, transparent 100%); -webkit-mask-composite: source-over; mask-image: linear-gradient(180deg, #000 55%, transparent 100%); mask-composite: add; }
  .page .pr-hero__body { width: auto; margin-top: -28px; }
  .page .pr-crumbs { flex-wrap: wrap; gap: 8px; }
  .page .pr-crumbs a { padding-block: 12px; margin-block: -12px; }
  .page .pr-hero .kicker { margin-top: 20px; }
  .page .pr-h1 { margin-top: 12px; font-size: clamp(40px, 11.5vw, 72px); line-height: 1.05; letter-spacing: 0.02em; }
  .page .pr-hero .lead { width: auto; margin-top: 18px; }
  .page .pr-h1--long { font-size: clamp(22px, 6.6vw, 56px); line-height: 1.12; letter-spacing: 0.02em; }
  .page .pr-hero--civil .pr-hero__img { object-position: 100% 40%; }
  .page .pr-hero--regulatory .pr-hero__img { object-position: 40% 40%; }
  .page .pr-actions { flex-direction: column; align-items: flex-start; gap: 6px; margin-top: 28px; }
  .page .pr-btn { width: 100%; max-width: 380px; height: 54px; justify-content: center; }
  .page .pr-stages { padding-top: 96px; padding-bottom: 72px; }
  .page .pr-route { align-self: stretch; margin-top: 28px; }
  .page .pr-route__line { left: 5px; right: auto; top: 8px; bottom: 8px; width: 1px; height: auto; background: linear-gradient(180deg, rgba(201, 166, 124, .45), rgba(214, 180, 138, .8) 50%, rgba(226, 196, 156, .95)); }
  .page .pr-route__arrow { display: none; }
  .page .pr-route ol { grid-template-columns: 1fr; row-gap: 32px; }
  .page .pr-station { position: relative; padding-left: 30px; }
  .page .pr-station__node { position: absolute; left: 0; top: 4px; width: 11px; height: 11px; margin-top: 0; background: radial-gradient(circle, var(--gold) 0 1.6px, #17181a 2.2px); }
  .page .pr-station .pr-title { min-height: 0; margin-top: 8px; }
  .page .pr-station .pr-p { margin-top: 8px; }
  .page .pr-cases-block { align-self: stretch; margin-top: 64px; }
  .page .pr-cases { grid-template-columns: 1fr; margin-top: 24px; }
  .page .pr-case, .page .pr-case:nth-child(3n+1), .page .pr-case:nth-child(3n), .page .pr-case:nth-child(n+4) { padding: 20px 0 22px; border-left: 0; border-top: 1px solid rgba(201, 166, 124, 0.22); }
  .page .pr-case:first-child { border-top: 0; }
  .page .pr-case .pr-title, .page .pr-case .pr-p { margin-top: 8px; }
  .page .pr-urgent { padding-top: 96px; padding-bottom: 80px; }
  .page .pr-urgent__ground { background-position: left top; background-size: auto 440px; }
  .page .pr-urgent__tone { background: linear-gradient(180deg, rgba(19, 20, 21, 0.62) 0, rgba(19, 20, 21, 0.9) 220px, #131415 440px); }
  .page .pr-urgent__grid { display: flex; flex-direction: column; align-items: stretch; align-self: stretch; }
  .page .pr-urgent__phone { grid-template-columns: 22px auto; column-gap: 12px; margin-top: 20px; }
  .page .pr-urgent__phone .pr-phone { font-size: 24px; line-height: 1.3; }
  .page .pr-steps { margin-top: 28px; }
  .page .pr-step { grid-template-columns: 40px minmax(0, 1fr); padding: 16px 0; }
  .page .pr-step .lead { margin-top: 0; font-size: 16px; line-height: 1.55; }
  .page .pr-rest { padding-top: 96px; padding-bottom: 72px; }
  .page .pr-work { align-self: stretch; grid-template-columns: 1fr; margin-top: 20px; }
  .page .pr-work li { padding: 16px 0 18px; }
  .page .pr-work__head { gap: 12px; }
  .page .pr-work .pr-p { margin-top: 6px; }
  .page .pr-split { display: flex; flex-direction: column; align-self: stretch; margin-top: 64px; }
  .page .pr-split .link { margin-top: 12px; }
  .page .pr-split .faq__list { margin-top: 24px; }
  .page .pr-split .pubs { margin-top: 20px; }
  .page .pr-others { align-self: stretch; margin-top: 64px; }
  .page .pr-others__head { flex-direction: column; align-items: flex-start; gap: 4px; }
  .page .pr-others .paths { grid-template-columns: 1fr; row-gap: 20px; margin-top: 20px; }
  .page .pr-path__foot { gap: 16px; margin-top: -10px; }
  .page .pr-cta { padding-top: 96px; padding-bottom: 24px; }
  .page .pr-cta__grid { display: flex; flex-direction: column; align-items: stretch; align-self: stretch; }
  .page .pr-cta .pr-p { margin-top: 14px; }
  .page .pr-cta__actions { gap: 18px; margin-top: 24px; }
  .page .pr-note { margin-top: 36px; font-size: 13px; line-height: 1.6; }
}
