/* Шаблон «Комплекс услуг» (страницы услуг). Основа — макет «Купить 1С» v2.
   Размеры в rem: на сайте html{font-size:1.25vw}, до 767px — 4.62vw; одна точка перелома 767px + планшет 768–1199px. */
/* Токены: фирменные цвета из руководства по бренду + цвета сайта */
.lp{--green:#4F9F43;--green-brand:#5E9A40;--green-dark:#204535;--lime:#BDE04D;--lime-2:#9DBC3F;--lime-3:#CCD13A;
    --tint-1:#E9F0D2;--tint-2:#F3F7E6;--ink:#19171B;--gray:#F0F0F0;--line:#DADADA;}
.lp section.lp-sec{padding:6.6667rem 0}
.lp .lp-head{display:grid;grid-template-columns:1fr 1fr;gap:2.2222rem;align-items:end;margin-bottom:2.6667rem}
.lp .lp-head h2{font-size:1.7778rem;line-height:1.25;letter-spacing:.02em;margin:0;font-weight:500}
.lp .lp-head p{margin:0;opacity:.7;font-size:1rem;line-height:1.5}
.lp p{font-size:1rem;line-height:1.5}
.lp .muted{opacity:.7}

/* шапка страницы: дополнение к #titlePage */
#titlePage .lp-lead{margin-top:1.7778rem;max-width:38rem;font-size:1.3333rem;line-height:1.35;font-weight:300}
#titlePage .button_line{gap:.8889rem;flex-wrap:wrap}
#titlePage .lp-facts{display:flex;gap:3.5556rem;margin-top:3.5556rem;flex-wrap:wrap}
#titlePage .lp-facts div{max-width:12rem;font-size:.8333rem;line-height:1.4;opacity:.8}
#titlePage .lp-facts b{display:block;font-size:1.7778rem;font-weight:500;line-height:1.1;margin-bottom:.2222rem;opacity:1}

/* карточки — та же логика, что .pattern-grid .item */
.lp .lp-grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:1.7778rem}
.lp .lp-grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.7778rem}
.lp .lp-card{background:var(--gray);border-radius:.2222rem;padding:1.3333rem;display:flex;flex-direction:column;gap:.6667rem;min-height:15rem;color:var(--ink);text-decoration:none;transition:background .2s}
.lp .lp-card .name{font-size:1.2222rem;font-weight:500;line-height:1.25}
.lp .lp-card p{margin:0;font-size:.8889rem;opacity:.7}
.lp .lp-card .ico{margin-top:auto;width:2.6667rem;height:2.6667rem}
.lp .lp-card.accent{background:var(--tint-1)}
.lp .lp-card .big{font-size:2.2222rem;font-weight:500;color:var(--green);line-height:1}

/* схема лицензирования */
.lp .lp-licensing{background:var(--gray);border-radius:1.3333rem}
.lp .lp-scheme{display:grid;grid-template-columns:22rem 1fr;gap:3.5556rem;align-items:start}
.lp .lp-stack{display:flex;flex-direction:column;gap:.5556rem;will-change:transform}
.lp .lp-layers{display:flex;flex-direction:column-reverse;gap:.5556rem}
.lp .lp-stack-note{font-size:.7778rem;margin:.3333rem 0 0;opacity:.7}
.lp .lp-layer{border-radius:.2222rem;padding:1rem 1.2222rem;display:flex;justify-content:space-between;align-items:center;gap:.8889rem;font-weight:500;font-size:.9444rem;border:1px solid #fff;cursor:pointer;transition:transform .2s, box-shadow .2s}
.lp .lp-layer span{font-size:.7778rem;font-weight:300;opacity:.75;text-align:right}
.lp .lp-layer.l4{background:#fff;border:1.5px dashed var(--green)}
.lp .lp-layer.l3{background:var(--tint-2)}
.lp .lp-layer.l2{background:var(--tint-1)}
.lp .lp-layer.l1{background:var(--lime)}
.lp .lp-layer.on{transform:translateX(.4444rem);box-shadow:-.3333rem 0 0 var(--green)}
.lp .lp-steps{display:flex;flex-direction:column;gap:1.1111rem}
.lp .lp-step{background:rgba(255,255,255,.6);border:1px solid #fff;border-radius:.2222rem;padding:1.5556rem 1.7778rem;display:grid;grid-template-columns:3.5556rem 1fr;gap:1.1111rem}
.lp .lp-step .n{font-size:2.2222rem;font-weight:300;color:var(--green);line-height:1}
.lp .lp-step h3{font-size:1.3333rem;font-weight:500;margin:0 0 .5556rem}
.lp .lp-step p{margin:0;font-size:.9444rem}
.lp .lp-tag{display:inline-block;margin-top:.7778rem;font-size:.7778rem;background:#fff;border-radius:2.6667rem;padding:.2222rem .7778rem;color:var(--green)}
.lp .lp-callout{margin-top:1.1111rem;background:var(--green-dark);color:#fff;border-radius:.2222rem;padding:1.3333rem 1.5556rem;display:grid;grid-template-columns:1fr auto;gap:1.3333rem;align-items:center}
.lp .lp-callout .t{font-size:1.1111rem;font-weight:500;margin-bottom:.4444rem}
.lp .lp-callout ul{margin:.4444rem 0 0;padding-left:1.1111rem;font-size:.8333rem;opacity:.9;columns:2;column-gap:1.7778rem}
.lp .lp-callout .button{background:var(--lime)} .lp .lp-callout .button span{color:var(--ink)}

/* типовые ситуации */
.lp .lp-case{border:1px solid var(--line);border-radius:.2222rem;padding:1.5556rem 1.3333rem;display:flex;flex-direction:column;gap:.7778rem}
.lp .lp-case .who{font-size:.8333rem;color:var(--green);font-weight:500}
.lp .lp-case .name{font-size:1.2222rem;font-weight:500;line-height:1.25}
.lp .lp-check{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:.4444rem;font-size:.8889rem}
.lp .lp-check li{display:flex;gap:.5556rem}
.lp .lp-check li::before{content:"";flex:0 0 1rem;height:1rem;margin-top:.1667rem;border-radius:50%;background:var(--green) url("/assets/img/check.svg") center/.5556rem no-repeat}

/* калькулятор — светлый фирменный фон */
.lp .lp-calc{background:linear-gradient(135deg,var(--tint-1) 0%,var(--tint-2) 55%,#fff 100%);border-radius:1.3333rem}
.lp .lp-calc-grid{display:grid;grid-template-columns:1fr 24rem;gap:2.2222rem}
.lp .lp-form{display:grid;grid-template-columns:1fr 1fr;gap:1.5556rem 1.7778rem;align-content:start}
.lp .lp-field.full{grid-column:1/-1}
.lp .lp-field label.cap{display:block;font-size:.7778rem;opacity:.7;margin-bottom:.4444rem}
.lp .lp-field select{width:100%;font:inherit;font-size:1rem;color:var(--ink);background:transparent;border:0;border-bottom:1px solid #8d8d8d;padding:.4444rem 0;outline:none}
.lp .lp-range{display:flex;align-items:center;gap:.8889rem}
.lp .lp-range input{flex:1;accent-color:var(--green)}
.lp .lp-range output{font-size:1.7778rem;font-weight:500;min-width:3.5rem;text-align:right}
.lp .lp-tick{display:flex;gap:.6667rem;align-items:flex-start;font-size:.8889rem;cursor:pointer}
.lp .lp-tick input{accent-color:var(--green);width:1.1111rem;height:1.1111rem;margin-top:.1111rem}
.lp .lp-hint{font-size:.7778rem;color:var(--green-dark);margin-top:.4444rem;min-height:1.1rem}
.lp .lp-result{background:#fff;border-radius:.4444rem;padding:1.5556rem;display:flex;flex-direction:column;gap:.6667rem;box-shadow:0 .6667rem 2.2222rem rgba(32,69,53,.08)}
.lp .lp-result .lp-row{display:flex;justify-content:space-between;gap:.8889rem;font-size:.8889rem;border-bottom:1px solid #eee;padding-bottom:.5556rem}
.lp .lp-result .lp-row span:last-child{white-space:nowrap;font-weight:500}
.lp .lp-result .total{display:flex;justify-content:space-between;align-items:baseline;margin-top:.4444rem}
.lp .lp-result .total b{font-size:2rem;font-weight:500;color:var(--green)}
.lp .lp-result .note{font-size:.7222rem;opacity:.6;margin:0}

/* каталог */
.lp .lp-tabs{display:flex;gap:.4444rem;flex-wrap:wrap;margin-bottom:1.7778rem}
.lp .lp-tab{border:1px solid var(--line);background:#fff;border-radius:2.6667rem;padding:.4444rem 1.2222rem;font:inherit;font-size:.8889rem;cursor:pointer;color:var(--ink)}
.lp .lp-tab.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.lp .lp-prod{background:var(--gray);border-radius:.2222rem;padding:1.3333rem;display:flex;flex-direction:column;gap:.5556rem;min-height:13.8889rem}
.lp .lp-prod .lbl{font-size:.7222rem;color:var(--green);font-weight:500;text-transform:uppercase;letter-spacing:.04em}
.lp .lp-prod .name{font-size:1.1667rem;font-weight:500;line-height:1.25}
.lp .lp-prod p{margin:0;font-size:.8333rem;opacity:.7}
.lp .lp-prod .bottom{margin-top:auto;display:flex;justify-content:space-between;align-items:center;gap:.6667rem;padding-top:.6667rem}
.lp .lp-price{font-size:1.3333rem;font-weight:500;white-space:nowrap}
.lp .lp-price small{display:block;font-size:.7222rem;font-weight:300;opacity:.7}
.lp .lp-prod.hl{background:#fff;box-shadow:inset 0 0 0 2px var(--lime)}
.lp .lp-prod.svc{background:var(--green-dark);color:#fff}
.lp .lp-prod.svc .lbl{color:var(--lime)} .lp .lp-prod.svc p{opacity:.85}
.lp .button.sm{height:auto;padding:.3889rem 1.1111rem .4444rem}
.lp .button.sm span{font-size:.8333rem}
.lp .hidden{display:none!important}
.lp .lp-grid3>*,.lp .lp-grid4>*{min-width:0}
.lp .lp-prod .bottom{flex-wrap:wrap}
.lp .lp-note{margin-top:1.5556rem;font-size:.7778rem;opacity:.65;max-width:50rem}

/* как проходит покупка */
.lp .lp-proc{display:grid;grid-template-columns:repeat(4,1fr);position:relative}
.lp .lp-proc::before{content:"";position:absolute;left:0;right:0;top:1.5rem;height:.3333rem;border-radius:.3333rem;background:var(--lime)}
.lp .lp-pstep{position:relative;padding-right:1.7778rem}
.lp .lp-pstep .dot{width:3.3333rem;height:3.3333rem;border-radius:50%;background:#fff;border:.3333rem solid var(--lime);display:grid;place-items:center;font-weight:500;color:var(--green);margin-bottom:1.3333rem}
.lp .lp-pstep .et{font-size:.7778rem;opacity:.65}
.lp .lp-pstep .name{font-size:1.1111rem;font-weight:500;margin:.3333rem 0 .5556rem}
.lp .lp-pstep p{font-size:.8889rem;opacity:.7}

/* связанные услуги */
.lp .lp-rel .lp-card:hover{background:#E7E7E7}
.lp .lp-rel .more{margin-top:auto;color:var(--green);font-size:.8889rem}

/* ======= мобильная версия: та же точка перелома, что у сайта (767px; там 1rem = 4.62vw) ======= */
@media (max-width:767px){
  .lp section.lp-sec{padding:3.3333rem 0}
  .lp .lp-head{grid-template-columns:1fr;gap:.6667rem;margin-bottom:1.7778rem}
  .lp .lp-head h2{font-size:1.4444rem}
  #titlePage .title h1{font-size:2rem}
  #titlePage .lp-lead{font-size:1.0556rem}
  #titlePage .lp-facts{gap:1.3333rem}
  .lp .lp-grid4,.lp .lp-grid3{grid-template-columns:1fr;gap:.8889rem}
  .lp .lp-card,.lp .lp-prod{min-height:auto}
  .lp .lp-card .ico{margin-top:.6667rem}
  .lp .lp-scheme{grid-template-columns:1fr;gap:1.7778rem}
  .lp .lp-stack{transform:none!important}
  .lp .lp-step{grid-template-columns:1fr;padding:1.2222rem;gap:.4444rem}
  .lp .lp-callout{grid-template-columns:1fr}
  .lp .lp-callout ul{columns:1}
  .lp .lp-calc-grid{grid-template-columns:1fr}
  .lp .lp-form{grid-template-columns:1fr}
  .lp .lp-cap-spacer{display:none}
  .lp #c-send{height:auto;padding:.6667rem 1.3333rem}
  .lp .lp-tick + .lp-tick{margin-top:.6667rem}
  .lp .lp-proc{grid-template-columns:1fr;gap:1.3333rem}
  .lp .lp-proc::before{display:none}
}

/* дополнения к макету */
.lp .d-none{display:none!important}
.lp .lp-step .lp-callout ul{list-style:disc}
.lp .lp-case-note{font-size:.7778rem;margin:0;opacity:.7}
.lp .lp-price.text{font-size:1rem}
.lp .lp-note-date{white-space:nowrap}
.lp .lp-next .n{font-size:1.7778rem;font-weight:300;color:var(--green);line-height:1}
.lp .lp-next .lp-card{min-height:12rem}
.lp .lp-layer:focus-visible,.lp .lp-tab:focus-visible{outline:2px solid var(--green);outline-offset:2px}
.lp #c-send{display:inline-flex}
.lp .lp-tick + .lp-tick{margin-top:.6667rem}
.lp .lp-related .title_wrapper .button_line{margin-top:0}

@media (min-width:768px){.lp .lp-proc{grid-template-columns:repeat(var(--steps,4),1fr)}}

/* планшет: 4 колонки → 2, 3 → 2 */
@media (min-width:768px) and (max-width:1199px){
  .lp .lp-grid4,.lp .lp-grid3{grid-template-columns:repeat(2,1fr)}
  .lp .lp-scheme{grid-template-columns:16rem 1fr;gap:2.2222rem}
  .lp .lp-calc-grid{grid-template-columns:1fr 20rem}
}

/* стрелка в шапке: петля выходит за viewBox SVG — показываем её целиком, шапка не ниже стрелки */
.lp #titlePage .arrow{overflow:visible}
@media (min-width:768px){.lp #titlePage{min-height:47rem}}

/* «Связанные услуги» — сетка карточек как на главной (#services), но без анимации главной */
.lp .lp-related{position:relative;padding:6.6667rem 0}
@media (max-width:767px){.lp .lp-related{padding:3.3333rem 0}}

/* два белых блока подряд — без двойного отступа */
.lp :is(.lp-sec:not(.lp-licensing):not(.lp-calc),.lp-related) + :is(.lp-sec:not(.lp-licensing):not(.lp-calc),.lp-related){padding-top:0}

/* плюсы и минусы в плашках */
.lp .lp-check li.minus::before{background:#B9B9B9 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M2 5h6' stroke='%23fff' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E") center/.5556rem no-repeat}
.lp .lp-check li.minus{opacity:.8}

/* ситуации: рекомендуемый вариант и текст под плашками */
.lp .lp-case{position:relative}
.lp .lp-case.accent{border:2px solid var(--green);background:var(--tint-2)}
.lp .lp-badge{position:absolute;top:0;left:1.3333rem;transform:translateY(-50%);background:var(--green);color:#fff;font-size:.7222rem;font-weight:500;border-radius:2.6667rem;padding:.2222rem .7778rem;white-space:nowrap}
.lp .lp-case.accent .who{margin-top:.4444rem}
.lp .lp-cases-after{margin-top:2.2222rem;padding:1.3333rem 1.7778rem;border-radius:.2222rem;background:var(--gray);font-size:.9444rem;line-height:1.5;max-width:60rem}
.lp .lp-cases-after strong{font-weight:500}
@media (max-width:767px){.lp .lp-case.accent{margin-top:.6667rem}.lp .lp-cases-after{padding:1.1111rem}}

/* схема с пятым уровнем (например, «Варианты обмена» на «Интеграциях») */
.lp .lp-layer.l5{background:var(--green-dark);color:#fff;border-color:var(--green-dark)}
.lp .lp-layer.l5 span{opacity:.85}

/* регистрация в 1С:Фреш — как блок формы заявки сайта (#contactForm) */
.lp .lp-fresh{position:relative;background:#F0F0F0 url(../img/bg_3.webp) top center/cover no-repeat;overflow:hidden;border-radius:1.3333rem;padding:6.6667rem 0}
.no-webp .lp .lp-fresh{background-image:url(../img/bg_3.jpg)}
.lp .lp-fresh .container{position:relative;z-index:1}
.lp .lp-fresh .title{margin-bottom:2.2222rem}
.lp .lp-fresh .title h2{width:24.7222rem;font-size:3.3333rem;line-height:1;letter-spacing:-.02em;margin:0 0 1.3333rem;font-weight:700}
.lp .lp-fresh .title .desc{font-size:1.3333rem;line-height:1.35;max-width:40rem}
.lp .lp-fresh form{width:49.7778rem}
.lp .lp-fresh form input.is-invalid{border-bottom-color:#F32735}
.lp .lp-fresh .fresh-error{margin:0;font-size:.8889rem}
.lp .lp-fresh .button:disabled{opacity:.6;cursor:wait}
.lp .lp-fresh .fresh-note{margin-top:2.2222rem;max-width:49.7778rem;font-size:.8889rem;line-height:1.5;opacity:.8}
.lp .lp-fresh .fresh-note p{margin:0 0 .4444rem}
.lp .lp-fresh .fresh-note a{color:#4F9F43}
.lp .lp-fresh .fresh-arrow{position:absolute;width:32.9444rem;height:40.6111rem;bottom:0;right:1.6667rem;pointer-events:none}
.fresh-modal .modal-body{font-size:.8889rem;line-height:1.5}
.fresh-modal .modal-body ul,.fresh-modal .modal-body ol{padding-left:1.3333rem}
.fresh-modal .modal-body p{margin:0 0 .6667rem}
@media (max-width:767px){
  .lp .lp-fresh{padding:3.3333rem 0}
  .lp .lp-fresh .title h2{width:100%;font-size:1.7778rem;font-weight:500}
  .lp .lp-fresh .title .desc{font-size:1.0556rem}
  .lp .lp-fresh form{width:100%}
  .lp .lp-fresh .fresh-arrow{display:none}
}

/* тарифы 1С:Фреш */
.lp .lp-tariff{position:relative;border:1px solid var(--line);border-radius:.2222rem;padding:1.5556rem 1.3333rem;display:flex;flex-direction:column;gap:.7778rem;background:#fff}
.lp .lp-tariff.accent{border:2px solid var(--green);background:var(--tint-2)}
.lp .lp-tariff .name{font-size:1.5556rem;font-weight:500;line-height:1.2}
.lp .lp-tariff .sum{margin:0;font-size:.8333rem;opacity:.75}
.lp .lp-tariff .lp-price{font-size:1.7778rem;color:var(--green);line-height:1.1;margin-top:.2222rem}
.lp .lp-tariff .lp-price small{color:var(--ink)}
.lp .lp-tariff-periods{list-style:none;margin:0;padding:0;font-size:.8333rem;display:flex;flex-direction:column;gap:.3333rem}
.lp .lp-tariff-periods li{display:flex;justify-content:space-between;gap:.6667rem;border-bottom:1px dashed var(--line);padding-bottom:.3333rem}
.lp .lp-tariff-periods b{font-weight:500;white-space:nowrap}
.lp .lp-tariff .button{margin-top:auto;align-self:flex-start}
.lp .lp-tariffs{align-items:stretch}
@media (max-width:767px){.lp .lp-tariff.accent{margin-top:.6667rem}}