/* Главная — артборды «Главная · 1440» и «Главная · телефон 390». Общее (шапка, кнопки, подвал, вопросы) — в site.css. */

/* Первый экран: заголовок, четыре портрета, вводный абзац, факты, кнопки, водяной знак справа */
.hero { position: relative; overflow: hidden; background: var(--green); color: var(--on-g); }
.hero__wm { width: 540px; right: -80px; top: 54px; opacity: .055; }
.hero__in { padding-top: 60px; padding-bottom: 60px; }
.hero__title { font: 400 66px/1.12 var(--serif); letter-spacing: -.005em; max-width: 1080px; text-wrap: balance; }
.hero__grid { display: grid; grid-template-columns: minmax(0, 1fr) 456px; gap: 40px; margin-top: 46px; align-items: start; }
.team { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.team li { display: flex; flex-direction: column; gap: 14px; }
.team img { width: 100%; height: auto; aspect-ratio: 218 / 300; object-fit: cover; object-position: 50% 30%; background: #1b3d34; }
.team__name { font-size: 18px; font-weight: 600; line-height: 1.3; }
.team__role { font-size: 14px; color: var(--on-g-3); margin-top: 4px; white-space: nowrap; }
.hero__side { display: flex; flex-direction: column; }
.hero__rule { width: 200px; margin-bottom: 34px; }
.hero__lead { font: 400 22px/1.5 var(--serif); color: var(--on-g); }
.hero__facts { display: grid; grid-template-columns: auto auto auto; margin-top: 40px; font-size: 15px; line-height: 1.45; color: var(--on-g-2); white-space: nowrap; }
.hero__facts > div:first-child { padding-right: 18px; border-right: 1px solid var(--g-line-2); }
.hero__facts .hero__fact-mid { padding: 0 18px; border-right: 1px solid var(--g-line-2); display: flex; align-items: center; }
.hero__facts > div:last-child { padding-left: 18px; }
.hero__btns { display: flex; gap: 14px; margin-top: 44px; flex-wrap: wrap; }
@media (max-width: 1200px) and (min-width: 901px) { .hero__grid { grid-template-columns: minmax(0, 1fr) 400px; } .hero__facts { white-space: normal; } }
/* 901–1100 px (холст их не рисует): портреты во всю ширину, вводный абзац и кнопки под ними */
@media (max-width: 1100px) and (min-width: 901px) { .hero__grid { grid-template-columns: 1fr; } .hero__side { max-width: 640px; } }
@media (max-width: 900px) {
  .hero__wm { width: 300px; right: -70px; top: 2px; opacity: .06; }
  .hero__in { padding-top: 32px; padding-bottom: 40px; }
  .hero__title { font-size: 37px; letter-spacing: 0; text-wrap: wrap; }
  .hero__grid { display: block; margin-top: 28px; }
  .team { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 10px; }
  .team li { gap: 10px; }
  .team img { aspect-ratio: 3 / 4; object-position: 50% 25%; }
  .team__name { font-size: 15px; line-height: normal; }
  .team__role { font-size: 13px; margin-top: 2px; }
  .hero__rule { width: 120px; margin: 32px 0 22px; }
  .hero__lead { font-size: 19px; }
  .hero__dl { margin-top: 24px; font-size: 15px; }
  .hero__dl > div { display: flex; justify-content: space-between; gap: 12px; border-top: 1px solid var(--g-line-2); padding: 12px 0; }
  .hero__dl > div:last-child { border-bottom: 1px solid var(--g-line-2); }
  .hero__dl dt { color: var(--on-g-3); }
  .hero__dl dd { white-space: nowrap; }
  .hero__btns { display: grid; gap: 10px; margin-top: 28px; }
}

/* I · Практика: заголовок по центру между линейками с ромбами, 8 услуг с пиктограммами */
.prac { padding: 96px 0 104px; }
.prac__eb { margin-bottom: 28px; }
.prac__head { display: flex; align-items: center; gap: 40px; }
.prac__line { flex: 1; display: flex; align-items: center; }
.prac__line .rule { flex: 1; }
.prac h2 { font: 400 64px/1 var(--serif); color: var(--green); }
.prac__intro { margin: 24px auto 0; text-align: center; font-size: 17px; line-height: 1.55; color: var(--ink-2); max-width: 640px; }
.svcs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 80px; margin-top: 56px; }
.svc { border-top: 1px solid var(--line); padding: 28px 0 30px; display: grid; grid-template-columns: 64px minmax(0, 1fr); row-gap: 10px; align-content: start; }
.svc > * { grid-column: 2; }
.svc .ico { grid-column: 1; grid-row: 1 / span 3; align-self: start; margin-top: -2px; width: 40px; height: 40px; fill: none; stroke: var(--brass-dk); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.svc h3 { font: 400 28px/1.15 var(--serif); color: var(--green); }
.svc p { font: 400 16px/1.55 var(--sans); color: var(--ink-2); max-width: 520px; }
.svc__row { display: flex; gap: 24px; align-items: baseline; }
.price { font: 500 15px/1.4 var(--sans); color: var(--green); font-variant-numeric: tabular-nums; white-space: nowrap; }
.more { font: 500 15px/1.4 var(--sans); color: var(--green); white-space: nowrap; }
@media (max-width: 900px) {
  .prac { padding: 56px 0; }
  .prac__eb { margin-bottom: 20px; }
  .prac__head { gap: 14px; }
  .prac h2 { font-size: 40px; line-height: normal; }
  .prac__intro { margin: 16px 0 28px; font-size: 15px; }
  .svcs { display: block; margin-top: 0; }
  .svc { display: flex; flex-direction: column; gap: 8px; padding: 22px 0 24px; }
  .svc:last-child { border-bottom: 1px solid var(--line); }
  .svc .ico { width: 34px; height: 34px; margin: 0; }
  .svc h3 { font-size: 24px; line-height: 1.2; }
  .svc p { font-size: 15px; }
  .svc__row { justify-content: space-between; gap: 12px; }
}

/* Полоса-фото переговорной */
.band { position: relative; background: var(--green); contain-intrinsic-size: auto 620px; }
.band img { display: block; width: 100%; height: 620px; object-fit: cover; object-position: 50% 55%; }
.band figcaption { position: absolute; right: 48px; bottom: 22px; font-size: 12px; letter-spacing: .04em; color: rgba(241, 239, 230, .82); }
@media (max-width: 900px) {
  .band { contain-intrinsic-size: auto 300px; }
  .band img { height: 300px; object-position: 38% 55%; }
  .band figcaption { right: 16px; bottom: 12px; font-size: 11px; letter-spacing: 0; }
}

/* II · Как работаем: принципы и факты */
.how { background-color: var(--paper); border-bottom: 1px solid var(--line-2); padding: 104px 0; position: relative; overflow: hidden; }
.how__grid { display: grid; grid-template-columns: 5fr 7fr; gap: 80px; }
.how__eb { margin-bottom: 30px; }
.how h2 { font: 400 52px/1.12 var(--serif); color: var(--green); text-wrap: balance; }
.how__lead { margin-top: 28px; font-size: 17px; line-height: 1.6; color: var(--ink-2); max-width: 440px; }
.how__items { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 48px; }
.how__item { border-top: 1px solid var(--brass); padding: 26px 0 36px; }
.how__item:nth-child(n + 3) { padding-bottom: 0; }
.how__item h3 { font: 400 25px/normal var(--serif); color: var(--green); }
.how__item p { margin-top: 12px; font-size: 16px; line-height: 1.6; color: var(--ink-2); }
.how__factswrap { margin-top: 80px; }
.how__facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--brass); border-bottom: 1px solid var(--line); }
.how__facts > div { padding: 36px 40px 34px; display: flex; flex-direction: column; gap: 10px; border-left: 1px solid var(--line); }
.how__facts > div:first-child { padding-left: 0; border-left: 0; }
.how__num { font: 300 76px/1 var(--serif); color: var(--green); white-space: nowrap; }
.how__lbl { font-size: 15px; color: var(--ink-2); }
.how__note { margin-top: 14px; text-align: right; font-size: 14px; color: var(--ink-3); }
@media (max-width: 900px) {
  .how { padding: 56px 0; }
  .how__grid { display: block; }
  .how__eb { margin-bottom: 22px; }
  .how h2 { font-size: 34px; text-wrap: wrap; }
  .how__lead { margin: 18px 0 8px; font-size: 16px; }
  .how__items { display: block; margin-top: 20px; }
  .how__item, .how__item:nth-child(n + 3) { padding: 20px 0 22px; }
  .how__item:last-child { padding-bottom: 0; }
  .how__item h3 { font-size: 22px; }
  .how__item p { margin-top: 8px; font-size: 15px; }
  .how__factswrap { margin-top: 40px; }
  .how__facts { display: block; border-bottom: 0; }
  .how__facts > div, .how__facts > div:first-child { flex-direction: row; align-items: baseline; justify-content: space-between; gap: 12px; padding: 16px 0; border-left: 0; border-bottom: 1px solid var(--line); }
  .how__num { font-size: 52px; }
  .how__lbl { font-size: 14px; text-align: right; }
  .how__note { margin-top: 12px; text-align: left; font-size: 13px; }
}

/* III · Слово партнёра: портрет в латунной рамке со сдвигом, цитата, подпись Marck Script */
.word { padding: 128px 0 136px; }
.word__grid { display: grid; grid-template-columns: 5fr 7fr; gap: 104px; align-items: center; }
.word__photo { padding: 0 30px 30px 0; }
.word__frame { position: relative; }
.word__frame::before { content: ''; position: absolute; inset: 30px -30px -30px 30px; border: 1px solid var(--brass); }
.word__frame img { position: relative; width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 22%; box-shadow: 0 28px 64px rgba(8, 34, 28, .22); background: #dcd8cb; }
.word__q { margin-top: 44px; position: relative; }
.word__marks { position: absolute; left: -86px; top: 8px; width: 60px; height: 45px; fill: var(--brass); display: block; }
.word__q p { font: 300 40px/1.32 var(--serif); color: var(--green); text-wrap: pretty; }
.word__sign { margin-top: 48px; display: flex; align-items: center; gap: 36px; }
.sig { display: inline-block; font: 400 58px/1 'Marck Script', cursive; color: var(--green); white-space: nowrap; transform: rotate(-5deg); }
.word__who { border-left: 1px solid var(--brass); padding-left: 24px; }
.word__name { font-size: 17px; font-weight: 600; color: var(--ink); }
.word__role { font-size: 14px; color: var(--ink-3); margin-top: 2px; }
@media (max-width: 900px) {
  .word { padding: 64px 0 72px; }
  .word__grid { display: block; }
  .word__photo { padding: 0 18px 18px 0; margin-top: 28px; }
  .word__frame::before { inset: 18px -18px -18px 18px; }
  .word__frame img { aspect-ratio: 4 / 4.4; box-shadow: 0 18px 44px rgba(8, 34, 28, .22); }
  .word__q { margin-top: 36px; padding-left: 44px; }
  .word__marks { left: 0; top: 6px; width: 32px; height: 24px; }
  .word__q p { font-size: 27px; line-height: 1.34; }
  .word__sign { display: block; margin-top: 30px; }
  .sig { font-size: 44px; }
  .word__who { border-left: 0; padding-left: 0; border-top: 1px solid var(--brass); margin-top: 18px; padding-top: 14px; }
  .word__name { font-size: 16px; }
}

/* IV · Дела */
.cases { background: var(--green); color: var(--on-g); padding: 104px 0; }
.cases__eb { margin-bottom: 30px; }
.cases h2 { font: 400 52px/1.1 var(--serif); }
.cases__lead { margin-top: 18px; font-size: 17px; color: var(--on-g-3); }
.cases__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 48px; margin-top: 56px; }
.case { border-top: 1px solid var(--brass); padding-top: 28px; display: flex; flex-direction: column; gap: 22px; }
.case__no { display: flex; align-items: baseline; gap: 14px; }
.case__num { font: 300 54px/.9 var(--serif); color: var(--brass-btn); }
.case h3 { font: 400 27px/1.2 var(--serif); }
.case__b { display: flex; flex-direction: column; gap: 8px; }
.case-k { font: 500 13px/1.3 var(--sans); letter-spacing: .08em; text-transform: uppercase; color: var(--brass-btn); }
.case-k--dim { color: var(--on-g-3); }
.case__b p { font: 400 16px/1.6 var(--sans); color: var(--on-g-2); }
.case__b p.case__res { color: var(--on-g); }
@media (max-width: 900px) {
  .cases { padding: 56px 0; }
  .cases__eb { margin-bottom: 20px; }
  .cases h2 { font-size: 34px; line-height: 1.12; }
  .cases__lead { margin-top: 12px; font-size: 15px; }
  .cases__grid { display: block; margin-top: 0; }
  .case { padding-top: 22px; margin-top: 32px; gap: 16px; }
  .case__no { gap: 12px; }
  .case__num { font-size: 44px; }
  .case h3 { font-size: 23px; }
  .case__b { display: block; }
  .case__b p { margin-top: 6px; }
  .case-k { font-size: 12px; }
  .case__b p { font-size: 15px; }
}

/* V · Частые вопросы, водяной знак в левой колонке */
.faqsec { padding: 104px 0; position: relative; overflow: hidden; }
.faqsec__wm { width: 360px; left: 40px; bottom: 56px; opacity: .08; }
.faqsec__grid { display: grid; grid-template-columns: 4fr 8fr; gap: 80px; }
.faqsec__eb { margin-bottom: 30px; }
.faqsec h2 { font: 400 52px/1.1 var(--serif); color: var(--green); }
@media (max-width: 900px) {
  .faqsec { padding: 56px 0; }
  .faqsec__grid { display: block; }
  .faqsec__eb { margin-bottom: 20px; }
  .faqsec h2 { font-size: 34px; line-height: normal; margin-bottom: 24px; }
}

/* Оценочные высоты разделов до отрисовки (content-visibility) — по снятым высотам 1440 и 412 px: прокрутка и якоря без скачков */
.prac.cv { contain-intrinsic-size: auto 1207px; } .how.cv { contain-intrinsic-size: auto 954px; } .word.cv { contain-intrinsic-size: auto 902px; } .cases.cv { contain-intrinsic-size: auto 982px; } .faqsec.cv { contain-intrinsic-size: auto 684px; }
@media (max-width: 900px) { .prac.cv { contain-intrinsic-size: auto 1940px; } .how.cv { contain-intrinsic-size: auto 1224px; } .word.cv { contain-intrinsic-size: auto 1177px; } .cases.cv { contain-intrinsic-size: auto 1727px; } .faqsec.cv { contain-intrinsic-size: auto 714px; } }