/* ==========================================================================
   ГЕОПИР — страница «Одна услуга»
   Десктоп собран по координатам Figma (фрейм 2855:918, 1920×11460).
   Разделы: описание услуги → преимущества → ключевые проекты → технология.
   ========================================================================== */

.sec-one > .container,
.sec-adv2 > .container,
.sec-prj > .container,
.sec-tech2 > .container{position:relative;height:100%}

/* --------------------------------------------------------------------------
   1. Первый экран
   -------------------------------------------------------------------------- */
.srv-hero .hero__title{top:calc(285.84px * var(--s));width:calc(1304px * var(--s));font-size:calc(70px * var(--s))}
.srv-hero .hero__badge{top:calc(642px * var(--s))}

/* --------------------------------------------------------------------------
   2. Описание услуги
   -------------------------------------------------------------------------- */
.sec-one{position:relative;height:calc(1332px * var(--s))}   /* было 1952: убрана панель .one-panel (620px) */

.one-eyebrow{position:absolute;left:0;top:calc(194.38px * var(--s))}
.one-h2{position:absolute;left:0;top:calc(222.46px * var(--s));width:calc(1326px * var(--s))}
.one-lead{
  position:absolute;left:0;top:calc(298.38px * var(--s));width:calc(1177px * var(--s));
  font-weight:400;font-size:calc(20px * var(--s));line-height:1.4;color:var(--ink);
}

.one-desc-h2{position:absolute;left:0;top:calc(463.46px * var(--s));width:calc(395px * var(--s))}
.one-cols{position:absolute;left:0;top:calc(551.38px * var(--s));width:100%}
.one-col{
  position:absolute;top:0;width:calc(834px * var(--s));
  font-weight:400;font-size:calc(20px * var(--s));line-height:1.4;color:var(--ink);
}
.one-col--1{left:0}
.one-col--2{left:calc(887px * var(--s))}
.one-cols__rule{
  position:absolute;left:calc(860px * var(--s));top:calc(-6.38px * var(--s));
  width:1px;height:calc(175px * var(--s));background:#D9D9D9;
}

.one-boxes{position:absolute;left:0;top:calc(812px * var(--s));width:100%;height:calc(520px * var(--s))}
.one-box{
  position:absolute;top:0;width:calc(850px * var(--s));height:calc(520px * var(--s));
  border-radius:calc(20px * var(--s));background:#fff;
}
.one-box--orange{left:0;border:1px solid var(--orange)}
.one-box--blue{left:calc(870px * var(--s));border:1px solid var(--blue)}
.one-box__title{
  position:absolute;left:calc(55px * var(--s));top:calc(56.6px * var(--s));
  font-weight:700;font-size:calc(26px * var(--s));line-height:1;color:var(--ink);text-transform:uppercase;
}
.one-box--orange .one-box__title{width:calc(312px * var(--s))}
.one-box--blue .one-box__title{width:calc(741px * var(--s))}
.one-box__rule{
  position:absolute;display:block;left:calc(55px * var(--s));top:calc(124px * var(--s));
  width:calc(62.5px * var(--s));height:1px;background:var(--rule);
}
.one-list{position:absolute;left:calc(55px * var(--s));top:calc(160px * var(--s));width:calc(735px * var(--s));margin:0;padding:0;list-style:none}
.one-list li{
  position:relative;min-height:calc(20px * var(--s));padding-left:calc(39px * var(--s));
  display:flex;align-items:center;
  font-weight:400;font-size:calc(18px * var(--s));line-height:1.2;color:var(--ink);
}
.one-list li + li{margin-top:calc(20px * var(--s))}
.one-list li::before{
  content:"";position:absolute;left:0;top:calc(50% - 10px * var(--s));
  width:calc(21.3px * var(--s));height:calc(20px * var(--s));
  background:url(../img/srv-check.svg) center/contain no-repeat;
}
/* в макете строки списка стоят на сетке 40px, третья занимает две строки */
.one-box--orange .one-list li:nth-child(1){margin-top:0}
.one-box--orange .one-list li:nth-child(3){min-height:calc(31px * var(--s));align-items:flex-start}
.one-box--orange .one-list li:nth-child(3)::before{top:calc(6px * var(--s))}
.one-box--orange .one-list li:nth-child(4){margin-top:calc(38px * var(--s))}
.one-box--blue .one-list li + li{margin-top:calc(20px * var(--s))}

/* --------------------------------------------------------------------------
   3. Какие преимущества
   -------------------------------------------------------------------------- */
.sec-adv2{position:relative;height:calc(3394px * var(--s));overflow:hidden}   /* было 3079: добавлены два заголовка */
.adv2__band{
  position:absolute;left:50%;transform:translateX(-50%);
  top:calc(129px * var(--s));width:100vw;height:calc(3265px * var(--s));background:#F7F7F7;
}
.sec-adv2 > .container{z-index:1}

.adv2__eyebrow{left:calc(2px * var(--s));top:calc(242.38px * var(--s))}
.adv2__h2{position:absolute;left:calc(2px * var(--s));top:calc(270.46px * var(--s));width:calc(526px * var(--s))}
.adv2__lead{top:calc(346.38px * var(--s));left:calc(2px * var(--s))}
.adv2__sub{
  position:absolute;left:calc(492px * var(--s));top:calc(474.07px * var(--s));width:calc(737px * var(--s));
  font-weight:700;font-size:calc(30px * var(--s));line-height:1.4;color:var(--ink);text-align:center;
}

/* сравнительная таблица */
.cmp{
  position:absolute;left:0;top:calc(604px * var(--s));width:calc(1720px * var(--s));
  border-collapse:collapse;table-layout:fixed;
  font-weight:400;font-size:calc(20px * var(--s));line-height:1.4;color:var(--ink);
}
.cmp th,.cmp td{border:1px solid #9A9A9A;text-align:center;vertical-align:middle;padding:0}
.cmp thead th{height:calc(80px * var(--s));background:#FEF4EC;font-weight:400}
.cmp tbody th,.cmp tbody td{height:calc(62px * var(--s));background:#fff;font-weight:400}
.cmp tbody th{background:#fff}
.cmp col:first-child,.cmp th:first-child{width:calc(254px * var(--s))}
.cmp th:nth-child(2),.cmp td:nth-child(2){width:calc(489px * var(--s))}
.cmp th:nth-child(3),.cmp td:nth-child(3){width:calc(488px * var(--s))}
.cmp th:nth-child(4),.cmp td:nth-child(4){width:calc(489px * var(--s))}
.cmp sup{font-size:.7em;vertical-align:super}

/* заголовки подблоков — тот же стиль, что у подзаголовка над таблицей, но на всю ширину */
.adv2__t{
  position:absolute;left:0;width:100%;
  font-weight:700;font-size:calc(30px * var(--s));line-height:1.4;color:var(--ink);text-align:center;
}
.adv2__t--steps{top:calc(2080px * var(--s))}
.adv2__t--nums{top:calc(2640px * var(--s))}

/* три шага — под круговой схемой */
.steps--one{position:absolute;left:0;top:calc(2200px * var(--s));margin-top:0;width:100%}
.steps--one .step__title{top:calc(106.07px * var(--s))}
.steps--one .step__body{top:calc(158.38px * var(--s))}

/* круговая схема */
.dia{
  position:absolute;left:50%;transform:translateX(-50%);top:calc(950px * var(--s));   /* встала на место шагов */
  width:calc(1920px * var(--s));height:calc(614px * var(--s));
}
.dia__c1,.dia__c2,.dia__c3{position:absolute;border-radius:50%;background:#fff}
.dia__c1{left:calc(696px * var(--s));top:calc(139px * var(--s));width:calc(924px * var(--s));height:calc(924px * var(--s))}
.dia__c2{left:calc(304px * var(--s));top:calc(551px * var(--s));width:calc(412px * var(--s));height:calc(412px * var(--s))}
.dia__c3{left:calc(580px * var(--s));top:calc(240px * var(--s));width:calc(760px * var(--s));height:calc(760px * var(--s))}
.dia__photo{
  position:absolute;left:calc(580px * var(--s));top:calc(71px * var(--s));
  width:calc(761px * var(--s));height:calc(929px * var(--s));
}
.dia__conn{position:absolute}
/* у левых групп Figma отдаёт x как правый край bbox — реальный left = x - width */
.dia__conn--tl{left:calc(100px * var(--s));top:0;width:calc(658px * var(--s));height:calc(304px * var(--s))}
.dia__conn--tr{left:calc(1167px * var(--s));top:0;width:calc(658px * var(--s));height:calc(304px * var(--s))}
.dia__conn--bl{left:calc(100px * var(--s));top:calc(382px * var(--s));width:calc(482px * var(--s));height:calc(179px * var(--s))}
.dia__conn--br{left:calc(1343px * var(--s));top:calc(382px * var(--s));width:calc(482px * var(--s));height:calc(179px * var(--s))}

/* .dia__item — абсолютный бокс нулевой ширины (все дети тоже абсолютные),
   поэтому базовый img{max-width:100%} схлопывал бы иконку в 0 */
.dia__ico{position:absolute;max-width:none}   /* координаты внутри своего .dia__item */
.dia__ico--tl{left:calc(-29px * var(--s));top:calc(44px * var(--s));width:calc(60px * var(--s));height:calc(61px * var(--s))}
.dia__ico--tr{left:calc(439px * var(--s));top:calc(42px * var(--s));width:calc(64px * var(--s));height:calc(65px * var(--s))}
.dia__ico--bl{left:calc(-26px * var(--s));top:calc(46px * var(--s));width:calc(54px * var(--s));height:calc(56px * var(--s))}
.dia__ico--br{left:calc(451px * var(--s));top:calc(58px * var(--s));width:calc(63px * var(--s));height:calc(47px * var(--s))}

.dia__item{position:absolute}
.dia__title{
  position:absolute;top:calc(60.07px * var(--s));
  font-weight:400;font-size:calc(30px * var(--s));line-height:1.4;color:var(--blue);white-space:nowrap;
}
.dia__body{
  position:absolute;top:calc(134.04px * var(--s));
  font-weight:400;font-size:calc(15px * var(--s));line-height:1.4;color:var(--ink);
}
.dia__bul{
  position:absolute;top:calc(87px * var(--s));background:var(--orange);
  width:calc(18px * var(--s));height:calc(18px * var(--s));transform:rotate(45deg);
}
.dia__item--tl{left:calc(174px * var(--s));top:0}
.dia__item--tl .dia__title{left:calc(125px * var(--s))}
.dia__item--tl .dia__body{left:calc(100px * var(--s));width:calc(330px * var(--s));text-align:left}
.dia__item--tl .dia__bul{left:calc(96px * var(--s))}

.dia__item--tr{left:calc(1282px * var(--s));top:0}
.dia__item--tr .dia__title{left:calc(182px * var(--s))}
.dia__item--tr .dia__body{left:0;width:calc(369px * var(--s));text-align:right}
.dia__item--tr .dia__bul{left:calc(347px * var(--s))}

.dia__item--bl{left:calc(174px * var(--s));top:calc(380px * var(--s))}
.dia__item--bl .dia__title{left:calc(134px * var(--s))}
.dia__item--bl .dia__body{left:calc(100px * var(--s));width:calc(279px * var(--s));text-align:left}
.dia__item--bl .dia__bul{left:calc(104px * var(--s))}

.dia__item--br{left:calc(1271px * var(--s));top:calc(380px * var(--s))}
.dia__item--br .dia__title{left:calc(129px * var(--s))}
.dia__item--br .dia__body{left:calc(100px * var(--s));width:calc(280px * var(--s));text-align:right}
.dia__item--br .dia__bul{left:calc(358px * var(--s));top:calc(85px * var(--s))}

/* четыре карточки-цифры */
.adv-grid--one{position:absolute;left:calc(1px * var(--s));top:calc(2728px * var(--s));margin-top:0;margin-left:0}

/* --------------------------------------------------------------------------
   4. Ключевые проекты
   -------------------------------------------------------------------------- */
.sec-prj{position:relative;height:calc(1599px * var(--s))}
.prj__eyebrow{left:calc(2px * var(--s));top:calc(106.38px * var(--s))}
.prj__h2{position:absolute;left:calc(2px * var(--s));top:calc(134.46px * var(--s));width:calc(464px * var(--s))}

.prj{position:static}
.prj__meta{position:absolute;left:calc(2px * var(--s));width:calc(559px * var(--s))}
.prj__date{font-weight:400;font-size:calc(20px * var(--s));line-height:1.2;color:var(--ink-soft)}
.prj__title{margin-top:calc(19.5px * var(--s));font-weight:700;font-size:calc(20px * var(--s));line-height:1;color:var(--ink);text-transform:uppercase}
.prj__note{margin-top:calc(17.9px * var(--s));font-weight:400;font-size:calc(20px * var(--s));line-height:1.2;color:var(--ink-soft)}
.prj__head{
  position:absolute;left:calc(725px * var(--s));width:calc(534px * var(--s));
  font-weight:700;font-size:calc(26px * var(--s));line-height:1;color:var(--ink);
}
.prj__body{
  position:absolute;left:calc(725px * var(--s));width:calc(995px * var(--s));
  font-weight:400;font-size:calc(20px * var(--s));line-height:1.4;color:var(--ink);
}
/* Слайдер на slick. Ширина .slick-list на один зазор больше рамки слайдера,
   поэтому при slidesToShow:3 слайд = 549px, а картинка внутри — ровно 530px,
   как в макете; лишний зазор справа обрезается overflow самого списка. */
.prj__slider{position:absolute;left:calc(46px * var(--s));width:calc(1628px * var(--s));height:calc(370px * var(--s))}
.prj__slider .slick-list{width:calc(100% + 19px * var(--s));overflow:hidden}
.prj__slider .slick-slide{padding-right:calc(19px * var(--s))}
.prj__ph{
  display:block;width:100%;height:calc(370px * var(--s));
  object-fit:cover;border-radius:calc(20px * var(--s));
}
.prj__arw{
  position:absolute;z-index:2;width:calc(84px * var(--s));height:calc(84px * var(--s));border-radius:50%;
  background:#fff;border:0;box-shadow:0 4px 16px rgba(0,0,0,.10);cursor:pointer;padding:0;
  transition:background .18s ease;
}
.prj__arw:hover{background:#F4F4F4}
.prj__arw.slick-disabled{opacity:.45;cursor:default}
.prj__arw::before{
  content:"";position:absolute;left:50%;top:50%;width:calc(12px * var(--s));height:calc(12px * var(--s));
  border-left:2px solid #555;border-bottom:2px solid #555;
}
.prj__arw--prev::before{transform:translate(-40%,-50%) rotate(45deg)}
.prj__arw--next::before{transform:translate(-60%,-50%) rotate(-135deg)}
.prj__arw--prev{left:0}                      /* 100px страницы: Figma отдавала 184 = правый край bbox */
.prj__arw--next{left:calc(1636px * var(--s))}

.prj--1 .prj__meta{top:calc(262.38px * var(--s))}
.prj--1 .prj__head{top:calc(283.6px * var(--s))}
.prj--1 .prj__body{top:calc(318.38px * var(--s))}
.prj--1 .prj__slider{top:calc(463px * var(--s))}
.prj--1 .prj__arw{top:calc(606px * var(--s))}

.prj--2 .prj__meta{top:calc(908.38px * var(--s))}
.prj--2 .prj__head{top:calc(929.6px * var(--s))}
.prj--2 .prj__body{top:calc(964.38px * var(--s))}
.prj--2 .prj__slider{top:calc(1109px * var(--s))}
.prj--2 .prj__arw{top:calc(1252px * var(--s))}

/* --------------------------------------------------------------------------
   5. Описание технологии
   -------------------------------------------------------------------------- */
.sec-tech2{position:relative;height:calc(2090px * var(--s));overflow-x:clip}
.tech2__band{
  position:absolute;left:50%;transform:translateX(-50%);top:0;
  width:100vw;height:calc(1990px * var(--s));background:#F7F7F7;
}
.sec-tech2 > .container{z-index:1}

.tech2__eyebrow{left:calc(2px * var(--s));top:calc(113.38px * var(--s))}
.tech2__h2{position:absolute;left:calc(2px * var(--s));top:calc(141.46px * var(--s));width:calc(509px * var(--s))}

.tech2__t1,.tech2__t2,.tech2__seq{
  position:absolute;left:0;font-weight:700;font-size:calc(26px * var(--s));line-height:1;color:var(--ink);
}
.tech2__t1{top:calc(231.6px * var(--s));width:calc(534px * var(--s))}
.tech2__t2{top:calc(1238.6px * var(--s));width:calc(534px * var(--s))}
.tech2__seq{top:calc(1434.6px * var(--s));width:calc(893px * var(--s))}

.tech2__b1,.tech2__b2{
  position:absolute;left:0;width:calc(995px * var(--s));
  font-weight:400;font-size:calc(20px * var(--s));line-height:1.4;color:var(--ink);
}
.tech2__b1{top:calc(302.38px * var(--s))}
.tech2__b2{top:calc(1283.38px * var(--s))}

.tech2__main{
  position:absolute;left:0;top:calc(480px * var(--s));
  width:calc(1237px * var(--s));height:calc(702px * var(--s));object-fit:cover;border-radius:calc(20px * var(--s));
}
.tech2__side{
  position:absolute;left:calc(1273px * var(--s));top:calc(480px * var(--s));
  width:calc(447px * var(--s));height:calc(700px * var(--s));object-fit:cover;border-radius:calc(20px * var(--s));
}

.seq{position:absolute;left:0;top:calc(1505.38px * var(--s));width:calc(995px * var(--s));margin:0;padding:0;list-style:none}
.seq__item{
  position:relative;display:flex;gap:calc(30px * var(--s));
  font-weight:400;font-size:calc(20px * var(--s));line-height:1.4;color:var(--ink);
}
.seq__item b{
  flex:none;width:calc(30px * var(--s));
  font-weight:700;font-size:calc(26px * var(--s));line-height:1;color:var(--ink);
  margin-top:calc(3.22px * var(--s));
}
.seq__item + .seq__item{margin-top:calc(16px * var(--s))}  /* 128px шаг макета минус 112px строчного бокса */
.seq__item span{flex:1 0 0;min-width:0}

.tech2__card{
  position:absolute;left:calc(1273px * var(--s));top:calc(1230px * var(--s));
  width:calc(447px * var(--s));height:calc(610px * var(--s));
  background:#fff;border-radius:calc(20px * var(--s));box-shadow:0 4px 24px rgba(0,0,0,.07);
}
.tech2__card-title{
  position:absolute;left:calc(41px * var(--s));top:calc(65.6px * var(--s));width:calc(341px * var(--s));
  font-weight:700;font-size:calc(26px * var(--s));line-height:1;color:var(--ink);
}
.tech2__card-list{
  position:absolute;left:calc(41px * var(--s));top:calc(224px * var(--s));width:calc(303px * var(--s));
}
.tech2__card-list li + li{margin-top:calc(28px * var(--s))}
.tech2__card-list li{align-items:flex-start;font-size:calc(16px * var(--s))}
.tech2__card-list li::before{top:0}
.tech2__card-btn{
  position:absolute;left:calc(41px * var(--s));top:calc(530px * var(--s));
  width:calc(290px * var(--s));height:calc(56px * var(--s));
}

/* ==========================================================================
   6. АДАПТИВ

   Как и на «Все услуги»: сначала сброс десктопных inset селекторами той же
   специфичности, потом новая геометрия.
   ========================================================================== */
@media (max-width:1659px){

  .sec-one .one-eyebrow,.sec-adv2 .adv2__eyebrow,.sec-prj .prj__eyebrow,.sec-tech2 .tech2__eyebrow,
  .sec-one .one-h2,.sec-one .one-lead,.sec-one .one-desc-h2,
  .sec-adv2 .adv2__h2,.sec-adv2 .adv2__lead,.sec-adv2 .adv2__sub,.sec-adv2 .adv2__t,
  .sec-prj .prj__h2,.sec-tech2 .tech2__h2,
  .sec-one .one-cols,.sec-one .one-col,.sec-one .one-boxes,.sec-one .one-box,
  .sec-one .one-box__title,.sec-one .one-box__rule,.sec-one .one-list,
  .sec-adv2 .cmp,.sec-adv2 .steps--one,.sec-adv2 .adv-grid--one,.sec-adv2 .dia,
  .sec-prj .prj__meta,.sec-prj .prj__head,.sec-prj .prj__body,.sec-prj .prj__slider,
  .sec-tech2 .tech2__t1,.sec-tech2 .tech2__t2,.sec-tech2 .tech2__seq,
  .sec-tech2 .tech2__b1,.sec-tech2 .tech2__b2,.sec-tech2 .tech2__main,
  .sec-tech2 .tech2__side,.sec-tech2 .seq,.sec-tech2 .tech2__card,
  .sec-tech2 .tech2__card-title,.sec-tech2 .tech2__card-list,.sec-tech2 .tech2__card-btn{
    position:relative;inset:auto;width:auto;height:auto;
  }
  .prj--1 .prj__meta,.prj--2 .prj__meta,
  .prj--1 .prj__head,.prj--2 .prj__head,
  .prj--1 .prj__body,.prj--2 .prj__body,
  .prj--1 .prj__slider,.prj--2 .prj__slider{top:auto}

  /* первый экран — как на остальных страницах */
  .srv-hero .hero__title{top:250px;width:100%;font-size:var(--fs-h1)}
  .srv-hero .hero__title br{display:none}   /* переносы из макета 1920 здесь мешают */
  .srv-hero .hero__badge{top:150px}

  .sec-one,.sec-adv2,.sec-prj,.sec-tech2{height:auto;padding-top:var(--sect);padding-bottom:var(--sect)}
  .sec-one{padding-top:32px}
  .sec-one > .container,.sec-adv2 > .container,
  .sec-prj > .container,.sec-tech2 > .container{height:auto}

  .sec-one .one-h2,.sec-adv2 .adv2__h2,.sec-prj .prj__h2,.sec-tech2 .tech2__h2,
  .sec-one .one-desc-h2{margin-top:14px;font-size:var(--fs-h2);max-width:1000px}
  .sec-one .one-lead,.sec-adv2 .adv2__lead{margin-top:16px;font-size:var(--fs-body);max-width:1000px}
  .sec-one .one-desc-h2{margin-top:44px}

  /* две колонки описания */
  .sec-one .one-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap);margin-top:24px}
  .sec-one .one-col{font-size:var(--fs-cap)}
  .one-cols__rule{display:none}

  /* два бокса */
  .sec-one .one-boxes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap);margin-top:44px}
  .sec-one .one-box{padding:28px 28px 32px;border-radius:var(--r)}
  .sec-one .one-box__title{font-size:var(--fs-h3);line-height:1.15}
  .sec-one .one-box__rule{width:62.5px;height:1px;margin-top:16px}
  .sec-one .one-list{margin-top:22px}
  .one-box .one-list li:nth-child(n){
    min-height:0;align-items:flex-start;padding-left:34px;margin-top:0;font-size:var(--fs-cap)}
  .one-box .one-list li:nth-child(n) + li{margin-top:14px}
  .one-box .one-list li:nth-child(n)::before{top:0;width:21px;height:20px}
  .tech2__card-list li{min-height:0;align-items:flex-start;padding-left:34px;font-size:var(--fs-cap)}
  .tech2__card-list li::before{top:0;width:21px;height:20px}

  /* преимущества */
  .adv2__band{top:0;height:100%}
  .sec-adv2 .adv2__sub{margin-top:44px;font-size:var(--fs-h3);line-height:1.3;text-align:center;max-width:900px;margin-inline:auto}

  .sec-adv2 .cmp{margin-top:32px;font-size:var(--fs-cap);width:100%}
  .cmp th,.cmp td{padding:14px 10px}
  .cmp thead th{height:auto}
  .cmp tbody th,.cmp tbody td{height:auto}
  .cmp th:first-child,.cmp td:first-child{width:22%}
  .cmp th:nth-child(2),.cmp td:nth-child(2),
  .cmp th:nth-child(3),.cmp td:nth-child(3),
  .cmp th:nth-child(4),.cmp td:nth-child(4){width:26%}

  .sec-adv2 .adv2__t{margin-top:var(--sect);font-size:var(--fs-h3);line-height:1.3;max-width:900px;margin-inline:auto}
  .sec-adv2 .steps--one{margin-top:36px}
  .steps--one .step__title,.steps--one .step__body{top:auto}
  .sec-adv2 .adv-grid--one{margin-top:36px}

  /* круговая схема раскладывается в сетку 2×2 */
  .sec-adv2 .dia{
    transform:none;
    display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap);margin-top:56px}
  .dia__c1,.dia__c2,.dia__c3,.dia__conn{display:none}
  .dia__photo{
    position:relative;inset:auto;grid-column:1 / -1;order:-1;
    width:100%;max-width:520px;height:auto;margin-inline:auto}
  .dia__item{position:relative;inset:auto;padding-left:56px}
  .dia__ico,.dia__ico--tl,.dia__ico--tr,.dia__ico--bl,.dia__ico--br{
    position:absolute;left:0;top:2px;width:44px;height:auto}
  .dia__title,.dia__item--tl .dia__title,.dia__item--tr .dia__title,
  .dia__item--bl .dia__title,.dia__item--br .dia__title{
    position:relative;inset:auto;left:auto;font-size:var(--fs-h3);white-space:normal}
  .dia__body,.dia__item--tl .dia__body,.dia__item--tr .dia__body,
  .dia__item--bl .dia__body,.dia__item--br .dia__body{
    position:relative;inset:auto;left:auto;width:auto;margin-top:12px;font-size:var(--fs-cap);text-align:left}
  .dia__bul{display:none}

  /* проекты */
  .sec-prj .prj{margin-top:56px}
  .sec-prj .prj__meta{width:auto;max-width:640px}
  .sec-prj .prj__head{margin-top:26px;font-size:var(--fs-h3)}
  .sec-prj .prj__body{margin-top:14px;font-size:var(--fs-cap);max-width:1000px}
  /* .prj__stage — система координат для стрелок: её высота равна высоте
     слайдера, поэтому стрелки центрируются по картинкам на любой ширине */
  .sec-prj .prj__stage{position:relative;margin-top:26px}
  .sec-prj .prj__slider{margin-top:0}
  .prj__slider .slick-list{width:calc(100% + var(--gap))}
  .prj__slider .slick-slide{padding-right:var(--gap)}
  /* height:auto + атрибуты 530×370 у img дают точную пропорцию
     без aspect-ratio, который считался бы вместе с паддингом слайда */
  .prj__ph{width:100%;height:auto;border-radius:var(--r)}
  .sec-prj .prj__arw{
    top:50%;bottom:auto;transform:translateY(-50%);width:64px;height:64px}
  .sec-prj .prj__arw--prev{left:-14px}
  .sec-prj .prj__arw--next{left:auto;right:-14px}
  .prj__arw::before{width:11px;height:11px}

  /* технология */
  .tech2__band{height:100%}
  .sec-tech2 .tech2__t1{margin-top:44px;font-size:var(--fs-h3);line-height:1.15}
  .sec-tech2 .tech2__t2,.sec-tech2 .tech2__seq{margin-top:34px;font-size:var(--fs-h3);line-height:1.15}
  .sec-tech2 .tech2__b1,.sec-tech2 .tech2__b2{margin-top:18px;font-size:var(--fs-cap);max-width:1000px}
  .sec-tech2 .tech2__main{
    margin-top:34px;width:100%;height:auto;aspect-ratio:1237/702;border-radius:var(--r)}
  .sec-tech2 .tech2__side{
    margin-top:var(--gap);width:100%;height:auto;aspect-ratio:1237/440;border-radius:var(--r)}
  .sec-tech2 .seq{margin-top:22px;font-size:var(--fs-cap)}
  .seq__item{gap:18px;font-size:var(--fs-cap)}
  .seq__item b{width:32px;font-size:22px;margin-top:2px}
  .sec-tech2 .tech2__card{
    margin-top:44px;padding:30px 30px 34px;border-radius:var(--r)}
  .sec-tech2 .tech2__card-title{font-size:var(--fs-h3);line-height:1.15}
  .sec-tech2 .tech2__card-list{margin-top:22px;width:auto}
  .sec-tech2 .tech2__card-btn{
    margin-top:26px;width:auto;height:54px;padding:0 26px;font-size:var(--fs-cap)}
}

/* --------------------------------------------------------------------------
   1280 и уже
   -------------------------------------------------------------------------- */
@media (max-width:1279px){
  .srv-hero .hero__title{top:auto;width:auto}
  .srv-hero .hero__badge{top:120px}
  /* поток первого экрана короче абсолютного фото — задаём высоту явно */
  .srv-hero{min-height:calc(var(--hero-h) + 88px)}

}

/* --------------------------------------------------------------------------
   960 и уже
   -------------------------------------------------------------------------- */
@media (max-width:959px){
  .srv-hero{min-height:calc(var(--hero-h) + 64px)}
  .sec-one .one-cols{grid-template-columns:1fr;gap:0}
  .sec-one .one-col + .one-col{margin-top:18px}
  .sec-one .one-boxes{grid-template-columns:1fr}

  .sec-adv2 .dia{grid-template-columns:1fr}
  .dia__photo{max-width:420px}

  .cmp{display:block;overflow-x:auto}
  .cmp thead th,.cmp tbody th,.cmp tbody td{min-width:120px}
}

/* --------------------------------------------------------------------------
   568 и уже
   -------------------------------------------------------------------------- */
@media (max-width:567px){
  .srv-hero{min-height:calc(var(--hero-h) + 56px)}
  .sec-one{padding-top:24px}
  .sec-one .one-box{padding:22px 20px 26px}

  .sec-prj .prj__arw{width:52px;height:52px}
  .prj__arw--prev{left:-10px}
  .prj__arw--next{right:calc(-10px + var(--gap))}

  .sec-tech2 .tech2__card{padding:24px 20px 26px}
  .sec-tech2 .tech2__card-btn{width:100%;padding:0 18px}

  .seq__item b{width:28px;font-size:20px}
}

/* --------------------------------------------------------------------------
   Первый экран на внутренних страницах ниже 1280.
   На главной синий промо-блок намеренно свисает ниже фото — на внутренних
   так быть не должно: фото тянется до низа секции (top задан, bottom:0),
   поэтому контент физически не может выйти за первый экран.
   -------------------------------------------------------------------------- */
@media (max-width:1279px){
  .srv-hero{min-height:calc(var(--hero-h) + 88px)}
  .srv-hero .hero__photo{height:calc(100% - 88px);bottom:0}
  .srv-hero .hero__stage{padding-bottom:110px}
}
@media (max-width:959px){
  .srv-hero{min-height:calc(var(--hero-h) + 64px)}
  .srv-hero .hero__photo{height:calc(100% - 64px)}
  .srv-hero .hero__stage{padding-bottom:80px}
}
@media (max-width:567px){
  .srv-hero{min-height:calc(var(--hero-h) + 56px)}
  .srv-hero .hero__photo{height:calc(100% - 56px)}
  .srv-hero .hero__stage{padding-bottom:60px}
}
