/* ТЗ-37: на десктопе каждый блок помещается в окно по высоте. Только >= 901px; мобилу не трогаем.
   Принцип: отступы и крупные заголовки считаются от высоты окна (vh), тексты не режем. Подключается последним. */
@media (min-width:901px){
  .pg{--sec-y:clamp(30px,5.2vh,60px)}
  .pg .section-head{margin-bottom:clamp(16px,3.2vh,40px)}
  .pg .section h2{font-size:clamp(30px,min(4.6vw,7vh),60px)}
  .pg .section-head .lead{margin-top:clamp(10px,1.8vh,22px)}
}

/* ───── цены (таблица: /seo, /website) ───── */
@media (min-width:901px){
  .pg .sec--pricing .pt th,.pg .sec--pricing .pt td{padding:clamp(6px,1.3vh,16px) 18px;font-size:clamp(14.5px,1.9vh,16.5px);line-height:1.35}
  .pg .sec--pricing .pt thead th,.pg .sec--pricing .pt thead td{padding-top:clamp(8px,1.6vh,22px);padding-bottom:clamp(8px,1.8vh,26px)}
  .pg .sec--pricing .pt-price{font-size:clamp(32px,min(4vw,6.2vh),54px)}
  .pg .sec--pricing .pt-name{font-size:clamp(17px,min(1.8vw,2.8vh),24px)}
  .pg .sec--pricing .pt-col{gap:5px}
  .pg .sec--pricing .pt-sub{font-size:clamp(12px,1.55vh,13.5px)}
  .pg .sec--pricing .pt-ck{width:22px;height:22px}
  .pg .sec--pricing .pt-anchor{margin-top:clamp(12px,2.4vh,28px);padding:clamp(9px,1.6vh,18px) 22px}
  .pg .sec--pricing .pt-anchor p{font-size:clamp(15px,2.1vh,19px)}
  .pg .sec--pricing .pt-anchor + .pt-foot,.pg .sec--pricing .pt-foot{margin-top:clamp(10px,2vh,24px)}
  .pg .sec--pricing .pt-foot{gap:10px 40px}
  .pg .sec--pricing .pt-foot p{font-size:clamp(14.5px,1.9vh,16.5px)}
  .pg .sec--pricing .pt-foot .pt-note{margin-top:4px;font-size:clamp(12.5px,1.7vh,14.5px)}
  .pg .sec--pricing .pt-spot{top:-8px;bottom:-8px}
}
@media (min-width:901px){
  .pg .sec--pricing .section-head{max-width:none}
  .pg .sec--pricing .section-head h2{font-size:clamp(28px,min(3.3vw,5.2vh),46px)}
  .pg .sec--pricing .ptable{max-width:1240px}
  .pg .sec--pricing .pt-foot{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center}
}
@media (min-width:901px){
  .pg .sec--pricing .pt-sub{max-width:none}
  .pg .sec--pricing .pt-price{font-size:clamp(30px,min(3.4vw,5vh),48px)}
  .pg .sec--pricing .pt col.pt-l{width:22%}
  .pg .sec--pricing .pt-foot p{max-width:none}
  .pg .sec--pricing .pt-foot > div{display:grid;gap:2px}
  .pg .sec--pricing .pt-foot .pt-note{margin-top:0;line-height:1.35}
}
@media (min-width:901px){
  .pg .sec--pricing .pt th,.pg .sec--pricing .pt td{padding-top:clamp(5px,.95vh,12px);padding-bottom:clamp(5px,.95vh,12px);line-height:1.3}
  .pg .sec--pricing .pt-anchor{margin-top:clamp(10px,1.8vh,20px);padding:clamp(7px,1.2vh,12px) 22px}
  .pg .sec--pricing .pt-anchor p{line-height:1.35}
  .pg .sec--pricing .pt-foot p{font-size:clamp(13.5px,1.7vh,15.5px)}
  .pg .sec--pricing .pt-foot .pt-note{font-size:clamp(12px,1.5vh,13.5px)}
  .pg .sec--pricing .pt-foot{margin-top:clamp(8px,1.6vh,18px)}
}

/* подпись под ссылкой на оформление Fix-Pack на geo.annakotsur.com (RU /seo, /audit) */
.geo-note{display:block;margin-top:6px;font-size:13px;line-height:1.35;font-weight:400;color:var(--text-3)}
@media (min-width:901px){
  .pg .sec--pricing .pt th,.pg .sec--pricing .pt td{font-size:clamp(14px,1.62vh,16px)}
  .pg .sec--pricing .pt col.pt-l{width:20%}
  .pg .sec--pricing .pt-foot > div{max-width:none}
}
@media (min-width:901px){
  .pg .sec--pricing .pt th,.pg .sec--pricing .pt td{font-size:clamp(13.5px,1.55vh,15.5px);padding-top:clamp(4px,.8vh,9px);padding-bottom:clamp(4px,.8vh,9px)}
  .pg .sec--pricing .pt thead th,.pg .sec--pricing .pt thead td{padding-top:clamp(6px,1.2vh,16px);padding-bottom:clamp(6px,1.4vh,18px)}
  .pg .sec--pricing .pt-price{font-size:clamp(28px,min(3.2vw,4.7vh),44px)}
  .pg .sec--pricing .pt-sub{font-size:clamp(11.5px,1.4vh,13px)}
}

/* ───── пример отчёта (/seo) ───── */
@media (min-width:901px){
  .pg .sec--report-example .section-head{max-width:none;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:clamp(24px,4vw,64px);align-items:start}
  .pg .sec--report-example .section-head h2{grid-column:1 / -1;font-size:clamp(28px,min(3.3vw,5vh),46px)}
  .pg .sec--report-example .section-head .lead{margin-top:clamp(8px,1.6vh,16px);font-size:clamp(15px,2vh,19px)}
  .pg .sec--report-example .report-learn{margin-top:clamp(8px,1.6vh,16px);font-size:clamp(15px,2vh,19px);max-width:none}
  .pg .sec--report-example .report{font-size:clamp(13px,1.6vh,14.5px);line-height:1.3}
  .pg .sec--report-example .report th,.pg .sec--report-example .report td{padding:clamp(5px,.95vh,11px) 14px}
  .pg .sec--report-example .report td:first-child{width:32%}
  .pg .sec--report-example .report .report-total td{padding-top:clamp(7px,1.2vh,14px);padding-bottom:clamp(7px,1.2vh,14px)}
  .pg .sec--report-example .sec-after{margin-top:clamp(8px,1.6vh,18px)}
}

/* ───── инвестиция (/seo): график + тезисы + «реальный случай» + плашка ───── */
@media (min-width:901px){
  .pg .sec--invest .inv-grid{gap:clamp(24px,4vw,72px);align-items:center}
  .pg .sec--invest .inv-chart svg{max-height:clamp(170px,31vh,320px);width:auto;max-width:100%;margin:0 auto}
  .pg .sec--invest .inv-text{gap:clamp(10px,1.8vh,24px)}
  .pg .sec--invest .inv-t{font-size:clamp(18px,min(2vw,3vh),28px)}
  .pg .sec--invest .inv-proof{margin-top:clamp(14px,2.6vh,32px);padding:clamp(12px,2.2vh,26px) clamp(20px,2.6vw,34px)}
  .pg .sec--invest .inv-proof p{font-size:clamp(15px,2vh,19px);line-height:1.42}
  .pg .sec--invest .cta-row{margin-top:clamp(10px,1.8vh,24px)}
}

/* ───── «Что входит» (/audit): карточки с картинкой слева, две строки по три; иконка, заголовок и текст от верхнего края (Anna 23.10) ───── */
@media (min-width:901px){
  .pg .sec--included > .wrap > .section-head{margin-bottom:clamp(12px,2.4vh,28px)}
  .pg .sec--included .section-head .lead{margin-top:clamp(6px,1.2vh,14px);font-size:clamp(15px,2vh,19px)}
  .pg .sec--included .incl-cards{gap:clamp(10px,1.8vh,22px)}
  .pg .sec--included .incl-card{display:grid;grid-template-columns:minmax(0,40%) minmax(0,1fr);grid-template-rows:auto 1fr;column-gap:clamp(10px,1.2vw,18px);align-items:start;padding:clamp(10px,1.8vh,18px) clamp(12px,1.2vw,18px)}
  .pg .sec--included .incl-card .jr-art{grid-column:1;grid-row:1 / -1;margin:0;align-self:start}
  .pg .sec--included .incl-card h3{grid-column:2;grid-row:1;align-self:start;margin:0 0 6px;font-size:clamp(17px,1.5vw,21px)}
  .pg .sec--included .incl-card p{grid-column:2;grid-row:2;align-self:start;font-size:clamp(13px,1.55vh,15px);line-height:1.4}
  .pg .sec--included .cta-row{margin-top:clamp(12px,2.4vh,28px)}
}

/* ───── «Работы» (/website): карусель ниже по высоте ───── */
@media (min-width:901px){
  .pg .sec--works .cf{--cfw:clamp(260px,min(36vw,50vh),520px)}
  .pg .sec--works .cf-stage{height:calc(var(--cfw) * .78 + 130px)}
  .pg .sec--works .cf-item figcaption{margin-top:clamp(8px,1.6vh,20px)}
  .pg .sec--works .cta-row{margin-top:clamp(10px,2vh,28px)}
}

/* ───── гарантии (/seo): печати ───── */
@media (min-width:901px){
  .pg .sec--guarantee .seals{gap:clamp(20px,3vw,64px)}
  .pg .sec--guarantee .seal{gap:clamp(6px,1.2vh,16px)}
  .pg .sec--guarantee .seal-ring{width:clamp(70px,min(9vw,12.5vh),132px)}
  .pg .sec--guarantee .seal-ring::after{inset:-12px}
  .pg .sec--guarantee .seal h3{margin-top:clamp(4px,1vh,12px);font-size:clamp(19px,min(2.1vw,3vh),28px)}
  .pg .sec--guarantee .seal p{font-size:clamp(14px,1.9vh,18px);line-height:1.4}
  .pg .sec--guarantee .sec-after{margin-top:clamp(10px,2vh,28px);font-size:clamp(13.5px,1.8vh,15.5px)}
  .pg .sec--guarantee .cta-row{margin-top:clamp(10px,2vh,28px)}
}

/* ───── пример плана (/audit) ───── */
@media (min-width:901px){
  .pg .sec--plan-example .section-head .lead{font-size:clamp(15px,2vh,19px);margin-top:clamp(6px,1.2vh,14px)}
  .pg .sec--plan-example .report{font-size:clamp(13px,1.6vh,14.5px);line-height:1.3}
  .pg .sec--plan-example .report th,.pg .sec--plan-example .report td{padding:clamp(5px,1vh,12px) 14px}
  .pg .sec--plan-example .cta-row{margin-top:clamp(10px,2vh,28px)}
}

/* ───── конструктор сайта (/website): форма и результат в окно ───── */
@media (min-width:901px){
  .pg .sec--calc-form .section-head .lead{margin-top:clamp(6px,1.2vh,14px);font-size:clamp(15px,2vh,19px)}
  .pg .sec--calc-form .section-head{margin-bottom:clamp(10px,2vh,24px)}
  .sec--calc-form .calc{padding:clamp(14px,2.4vh,30px) clamp(20px,2.4vw,36px)}
  .sec--calc-form .calc-form{gap:clamp(8px,1.5vh,20px)}
  .sec--calc-form .calc-f{gap:5px}
  .sec--calc-form .calc-f > legend,.sec--calc-form .calc-f > label{font-size:clamp(14px,1.8vh,15.5px)}
  .sec--calc-form .calc-types{gap:clamp(6px,1.1vh,10px)}
  .sec--calc-form .calc-tc{padding:clamp(6px,1.2vh,13px) 15px;gap:1px}
  .sec--calc-form .calc-chks{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:clamp(5px,.9vh,8px)}
  .sec--calc-form .calc-chk > span{display:flex;width:100%;padding-top:clamp(5px,.9vh,9px);padding-bottom:clamp(5px,.9vh,9px);font-size:clamp(13px,1.7vh,14.5px)}
  .sec--calc-form .calc-hint{font-size:clamp(11.5px,1.5vh,13px)}
  .sec--calc-form .calc-res{padding:clamp(12px,2vh,26px) clamp(16px,1.6vw,26px)}
  .sec--calc-form .calc-send h3{margin-bottom:clamp(6px,1.2vh,12px)}
  .sec--calc-form .calc-mail{gap:clamp(6px,1.1vh,12px)}
}
@media (min-width:901px){
  .pg .sec--calc-form .section-head{max-width:none;display:grid;grid-template-columns:minmax(0,auto) minmax(0,1fr);column-gap:clamp(20px,3vw,48px);align-items:end}
  .pg .sec--calc-form .section-head .lead{margin:0;padding-bottom:.35em;max-width:46ch}
  .sec--calc-form .calc-chks{align-items:start}
  .sec--calc-form fieldset.calc-f:nth-of-type(2) .calc-chks{grid-template-columns:repeat(3,minmax(0,1fr))}
  .sec--calc-form .calc-chk > span{padding-left:34px;padding-right:10px}
}
@media (min-width:901px){
  .sec--calc-form .calc-grid{grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:clamp(20px,2.6vw,40px)}
  .sec--calc-form .calc-chks{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
  .sec--calc-form fieldset.calc-f:nth-of-type(2) .calc-chks{grid-template-columns:repeat(3,minmax(0,1fr))}
  .sec--calc-form .calc-chk{min-width:0}
}
@media (min-width:901px){
  .sec--calc-form .calc-grid{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr)}
  .sec--calc-form .calc-chks{grid-template-columns:repeat(auto-fill,minmax(190px,1fr))}
  .sec--calc-form .calc-pills{gap:6px}
  .sec--calc-form .calc-pill{min-height:clamp(38px,5.4vh,46px);padding:6px 10px;font-size:14px;gap:6px}
  .sec--calc-form .calc-pill > span{gap:6px}
  .sec--calc-form .calc-mail input[type="text"],.sec--calc-form .calc-mail input[type="email"],.sec--calc-form .calc-mail input[type="tel"],.sec--calc-form .calc-mail input[type="url"]{min-height:clamp(38px,5.4vh,48px)}
  .sec--calc-form .calc-go{min-height:clamp(44px,6vh,54px)}
  .sec--calc-form .calc-send h3{font-size:clamp(17px,2.4vh,22px)}
}
@media (min-width:901px) and (max-height:900px){
  .sec--calc-form .calc-chk > span{padding-top:4px;padding-bottom:4px;font-size:13px;line-height:1.3}
  .sec--calc-form .calc-chk > span::before{left:10px}
  .sec--calc-form .calc-chk > span{padding-left:31px}
  .sec--calc-form .calc-chk i{font-size:11.5px}
  .sec--calc-form .calc-tc{padding-top:5px;padding-bottom:5px}
  .sec--calc-form .calc-form{gap:clamp(7px,1.3vh,11px)}
  .sec--calc-form .calc-f > legend,.sec--calc-form .calc-f > label{margin-bottom:0}
  .sec--calc-form .calc-f{gap:4px}
  .sec--calc-form .calc{padding-top:12px;padding-bottom:12px}
}
@media (min-width:901px) and (max-height:800px){.sec--calc-form .calc-chk > span{font-size:12.5px}}

/* ───── «Что входит» (/de/website): лист и список ───── */
@media (min-width:901px){
  .pg .sec--included .doc-sheet{width:min(100%,clamp(150px,30vh,330px))}
  .pg .sec--included > .wrap > .section-head{margin-bottom:clamp(10px,2vh,40px)}
  .pg .sec--included > .wrap > .doc-sheet{margin-bottom:clamp(10px,2vh,40px)}
  .pg .sec--included .section-head h2{font-size:clamp(28px,min(3.8vw,6vh),54px)}
  .pg .sec--included .body-h3{font-size:clamp(18px,2.6vh,26px);margin-top:0}
  .pg .sec--included .incl--icons li{padding-top:clamp(8px,1.6vh,22px);padding-bottom:clamp(8px,1.6vh,22px);font-size:clamp(15px,2vh,21px)}
  .pg .sec--included .incl--icons .ic{width:clamp(34px,5vh,44px);height:clamp(34px,5vh,44px)}
  .pg .sec--included .sec-after{margin-top:clamp(8px,1.6vh,22px)}
}

/* ───── чек-листы (/de/seo, /de/website) ───── */
@media (min-width:901px){
  .pg .sec--checklist .checklist li{padding-top:clamp(9px,1.9vh,30px);padding-bottom:clamp(9px,1.9vh,30px)}
  .pg .sec--checklist .checklist p{font-size:clamp(17px,min(2vw,3vh),26px);line-height:1.25}
}

/* Anna 21.10: «чутка воздуха» перед FAQ — FAQ в один экран не обязан помещаться, поэтому отступы тут свободнее */
@media (min-width:901px){
  .pg .sec--review{padding-bottom:clamp(56px,9vh,110px)}
  .pg .sec--faq{padding-top:clamp(56px,9vh,110px)}
}

/* ───── «экран = экран» (ТЗ-40): на десктопе блок вместе со своей плашкой CTA занимает ровно экран под шапкой, содержимое по центру.
   Блок выше экрана просто остаётся длиннее. Не трогаем: hero, sticky-сцены (путь, стопка, кейсы) и форму (длиннее экрана). FAQ: если короче экрана, тоже по центру экрана, если длиннее, остаётся длиннее. ───── */
@media (min-width:901px){
  .pg main > .section:not(.sec--how):not(.sec--problem):not(.sec--cases):not(.sec--form){
    min-height:calc(100vh - var(--nav-h));min-height:calc(100svh - var(--nav-h));
    display:flex;flex-direction:column;justify-content:center}
  .pg main > .section > .wrap{width:100%}
  /* цены: чуть меньше паддинг, чтобы длинный DE-блок не вылезал за экран */
  .pg main > .sec--pricing{padding-top:clamp(28px,4vh,48px);padding-bottom:clamp(28px,4vh,48px)}
}
}

/* «Что входит» (/audit): больше воздуха, картинка крупнее */
@media (min-width:901px){
  .pg .sec--included:has(.incl-cards){padding-top:clamp(32px,5vh,64px);padding-bottom:clamp(32px,5vh,64px)}
  .pg .sec--included > .wrap > .section-head{margin-bottom:clamp(20px,3.5vh,40px)}
  .pg .sec--included .section-head .lead{margin-top:clamp(10px,1.6vh,18px)}
  .pg .sec--included .incl-cards{gap:clamp(16px,2.4vh,28px)}
  .pg .sec--included .incl-card{grid-template-columns:minmax(0,46%) minmax(0,1fr);column-gap:clamp(14px,1.2vw,22px);padding:clamp(20px,2.6vh,32px) clamp(18px,1.4vw,28px)}
  .pg .sec--included .incl-card{grid-template-rows:auto auto;align-content:center}
  .pg .sec--included .incl-card h3{margin-bottom:8px}
  .pg .sec--included .cta-row{margin-top:clamp(24px,4vh,48px)}
}

/* «Как проходит» (/audit): кнопки внутри экрана пути, под полосой этапов */
@media (min-width:900px) and (prefers-reduced-motion:no-preference){
  html.jr-ok .pg .sec--how .btn-row{order:2;margin-top:clamp(4px,1vh,12px)}
}

/* Anna 21.10: воздух между «Частыми вопросами» и формой заявки */
@media (min-width:901px){
  .pg .sec--faq{padding-bottom:clamp(56px,9vh,110px)}
  .pg .sec--form{padding-top:clamp(56px,9vh,110px)}
}

/* Шов на стыке FAQ → форма (и отзыв на /website): радиальное свечение секции обрывалось по её краю.
   Эллипс теперь целиком внутри секции и затухает до нуля раньше верхней и нижней границы. Все ширины. */
.pg .sec--form{background:radial-gradient(60% 55% at 18% 55%,rgba(99,102,241,.16),transparent 70%)}
.pg .sec--review{background:radial-gradient(60% 70% at 50% 50%,rgba(99,102,241,.20),transparent 70%)}
/* /seo первый экран (ЦБ 12, М): запасные шаги кнопками, а не ссылками в тексте */
.pg .hero-alt{margin-top:16px;gap:10px}
.pg p.hero-p.geo-note{margin-top:10px}