:root{
  --bg:#f7faf7;--bg-2:#edf5f1;--fg:#20363a;--muted:#62767a;
  --line:rgba(31,65,65,.12);--line-2:rgba(31,65,65,.20);
  --violet:#0b716b;--violet-2:#168d82;--violet-lt:#087e76;
  --magenta:#168d82;--pink:#4fae9d;--glass:rgba(255,255,255,.88)
}
body{background:#f7faf7;color:var(--fg)}
body::before{display:none}
.hdr{position:sticky;top:16px;margin-bottom:-62px}
.hdr__island,.hdr.is-scrolled .hdr__island{background:rgba(255,255,255,.92);border-color:rgba(25,76,73,.14);box-shadow:0 12px 42px rgba(26,75,68,.09)}
.hdr__island::before{background:linear-gradient(120deg,rgba(17,128,119,.30),rgba(119,192,164,.12) 55%,transparent 75%)}
.hdr__slogan{color:#85979a}
.hdr__nav a,.hdr__rating{color:#5b7073}
.hdr__nav a:hover{color:#0b716b}
.hdr__nav a.is-active{color:#fff}
.hdr__pill{transition:transform .65s cubic-bezier(.22,1,.36,1),width .65s cubic-bezier(.22,1,.36,1),opacity .3s ease}
.hdr__msg-btn--tg{background:#0b716b;border-color:#0b716b;color:#fff}
.hdr__msg-btn--wa,.hdr__msg-btn--max{background:#f0f6f2;border-color:var(--line);color:#0b716b}
.burger{background:#fff;border-color:var(--line)}
.menu{background:rgba(247,250,247,.96)}
.hero{background:radial-gradient(ellipse 53% 50% at 50% 38%,#d6eee5 0%,#e9f5ed 48%,var(--bg) 100%)}
.wave,.hero__scrim{display:none}
.hero__fade,.hero + .sec::before{display:none}
.hero__title,.hero__badge,.hero__sub,.hero__facts li{text-shadow:none}
.hero__title span{background:linear-gradient(135deg,#116f69,#239e8e);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero__sub{color:#52676b}
.hero__badge,.kicker,.dir__price{background:#e8f4ed;border-color:#bad7cc;color:#176f69}
.dot,.hdr__status-dot{background:#45ad71;box-shadow:0 0 0 4px rgba(69,173,113,.12)}
.hero__facts li{color:#607378}
.hero__facts b,.revs__badge b{color:var(--fg)}
.hero__facts li + li::before{background:var(--line-2)}
.btn--primary{background:#0b716b;color:#fff;box-shadow:0 12px 26px rgba(11,113,107,.17)}
.btn--primary:hover{background:#095f59;box-shadow:0 16px 30px rgba(11,113,107,.22)}
.btn--ghost{background:#fff;color:var(--fg);border-color:var(--line-2)}
.btn--ghost:hover{background:#eff8f3;border-color:#8dbfb0}
.dir,.case__hit,.rev,.price,.proc__step,.faq__i,.who,.frm,.site,.bot,.svc,.live,.cmodal__dialog,.gmodal__dialog,.ckb,.sfaq__i{background:#fff;box-shadow:0 8px 30px rgba(28,79,71,.045)}
.rev{backdrop-filter:none;-webkit-backdrop-filter:none}
.dir:hover,.rev:hover,.faq__i[open]{background:#fff;border-color:#9dcbbd}
.dir::after{background:radial-gradient(420px 220px at 20% 0%,rgba(107,185,157,.16),transparent 65%)}
.case__hit:hover{box-shadow:0 18px 38px rgba(28,79,71,.11)}
.case__media{background:#eaf1ee}
.case__price,.live__go,.site__live,.rev__text em,.rev__check:hover,.ftr__h,.ftr__logo b{color:#087e76}
.chip,.tab,.site__shots{background:#fff;color:#5d7175;border-color:var(--line)}
.chip span{background:#edf4f0;color:#5d7175}
.chip.is-on,.tab.is-on{background:#0b716b;color:#fff;border-color:#0b716b}
.chip.is-on span,.tab.is-on span{background:rgba(255,255,255,.2);color:#fff}
.revs__badge,.faq__ico,.who__avail{background:#e8f4ed;border-color:#bcded0;color:#126f62}
.faq__ico::before,.faq__ico::after{background:#0b716b}
.frm input,.frm select,.frm textarea{background:#f7faf7;color:var(--fg);border-color:var(--line)}
.frm input::placeholder,.frm textarea::placeholder{color:#94a5a7}
.frm input:focus,.frm select:focus,.frm textarea:focus{background:#fff;border-color:#168d82}
.frm select option{background:#fff;color:var(--fg)}
.frm__f > span,.frm__consent,.doc p,.doc li{color:#51676b}
.frm__consent a,.ckb a,.doc a,.calc__intro a,.frm__calc a,.gmodal__head a{color:#087e76}
.cmodal__back,.gmodal__back{background:rgba(17,39,41,.48)}
.cmodal__dialog,.gmodal__dialog{background:#fff}
.cmodal__close,.gmodal__close{background:#f1f6f2;color:var(--fg)}
.ftr{background:linear-gradient(to bottom,transparent,#edf5f0)}
.ckb{border-color:var(--line)}
.ckb p{color:#50666a}
@media(max-width:720px){.hero{background:radial-gradient(ellipse 110% 55% at 50% 35%,#d6eee5 0%,#e9f5ed 58%,var(--bg) 100%)}}
.card,.step{background:#fff;box-shadow:0 8px 30px rgba(28,79,71,.045)}
.card:hover,.step:hover{background:#fff;border-color:#9dcbbd}
.card__stack{color:#71858a}
.card__price b{background:none;color:#0b716b;-webkit-background-clip:initial;background-clip:initial}
/* Personalized hero and contact layout */
.hero__title{font-size:clamp(34px,5.4vw,68px);max-width:1100px;margin-left:auto;margin-right:auto}
.hero__sub{max-width:780px}
.hero__facts li{display:inline-flex;align-items:center;gap:8px;padding:0 16px}
.hero__facts li img{display:block;flex:none}
.chans{grid-template-columns:repeat(2,minmax(0,1fr));max-width:620px}
@media(max-width:680px){
  .hero__title{font-size:clamp(29px,7.5vw,42px);max-width:22ch}
  .hero__sub{max-width:34ch}
  .hero__facts{gap:12px 16px}
  .hero__facts li{padding:0;justify-content:flex-start;gap:7px}
  .hero__facts li img{width:18px;height:18px}
  .chans{grid-template-columns:1fr;max-width:520px}
}
@media(min-width:681px){.hero__title{font-size:clamp(45px,4.35vw,58px)}}
@media(max-width:560px){.hdr{margin-bottom:-52px}}

/* Направления: карточки с отдельными изображениями по референсу. */
.sec>.wrap,.hero__inner{width:min(1400px,calc(100% - 32px))}
.hdr__island{width:min(1400px,100%)}
.sec>.wrap>.kicker{display:table;margin-left:auto;margin-right:auto}
.sec>.wrap>.sec__title,.sec>.wrap>.sec__sub{text-align:center}
.sec>.wrap>.sec__sub{margin-left:auto;margin-right:auto}
@media(max-width:560px){.hdr{padding-inline:16px}}
.ftr>.wrap{width:min(1400px,calc(100% - 32px))}
#directions .sec__sub{max-width:920px}

/* FAQ: intro at left, expandable questions at right. */
#faq>.wrap{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1fr);align-items:start;gap:clamp(36px,5vw,88px)}
#faq .faq__intro{padding:24px 0 0 clamp(0px,3vw,40px);text-align:left}
#faq .faq__eyebrow{display:block;margin-bottom:20px;color:var(--muted);font-size:16px;font-weight:600}
#faq .faq__intro .sec__title{max-width:550px;margin-bottom:20px;font-size:clamp(42px,4.8vw,66px)}
#faq .faq__intro .sec__sub{max-width:510px;margin:0 0 44px;font-size:clamp(17px,1.55vw,21px);line-height:1.55}
#faq .faq__actions{display:flex;align-items:center;flex-wrap:wrap;gap:24px 30px}
#faq .faq__ask{gap:18px;border-radius:18px;padding:17px 28px;background:#245c4b}

/* Юридические документы используют ту же ширину и палитру, что и сайт. */
.legal-header{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-block:34px 22px}
.legal-header__logo{color:var(--fg);font-size:23px;font-weight:800;letter-spacing:-.05em;text-decoration:none}
.legal-header__logo b{color:#087e76}
.legal-header__back{color:#087e76;font-size:14px;font-weight:600;text-decoration:none}
.legal-header__back:hover,.doc__links a:hover{text-decoration:underline;text-underline-offset:4px}
.doc{padding:42px 0 84px}
.doc .wrap{width:min(860px,calc(100% - 32px));max-width:none}
.doc__eyebrow{color:#087e76!important;font-size:12px!important;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.doc h1{margin:10px 0 18px;color:var(--fg);font-size:clamp(36px,5vw,58px);line-height:1.08;letter-spacing:-.045em}
.doc__meta{margin-bottom:32px!important}
.doc__draft{padding:16px 20px;border:1px solid #d7c99e;border-radius:14px;background:#fff9e8;color:#644f26!important}
.doc__content{padding:clamp(24px,4vw,48px);border:1px solid var(--line);border-radius:26px;background:#fff;box-shadow:0 12px 40px rgba(28,79,71,.05)}
.doc__content h2:first-child{margin-top:0}
.doc__content h2{color:var(--fg);font-size:20px;line-height:1.3}
.doc__content p,.doc__content li{font-size:15px;line-height:1.75}
.doc__links{display:flex;flex-wrap:wrap;gap:12px 24px;margin-top:28px}
.doc__links a{color:#087e76;font-size:14px;font-weight:600;text-decoration:none}
.legal-footer{display:flex;justify-content:space-between;gap:20px;padding-block:22px 40px;border-top:1px solid var(--line);color:var(--muted);font-size:13px}
.legal-footer a{color:#087e76}
@media(max-width:600px){.legal-header{padding-top:22px}.doc{padding:28px 0 64px}.doc__content{border-radius:20px}.legal-footer{flex-direction:column}}
#faq .faq__ask:hover{background:#1b4e40}
#faq .faq__ask span{font-size:23px;line-height:1}
#faq .faq__telegram{color:#245c4b;font-size:16px;font-weight:600;text-decoration:none}
#faq .faq__telegram:hover{text-decoration:underline}
#faq .faq__reply{margin-top:22px;color:var(--muted);font-size:14px}
#faq .faq{width:100%;max-width:none;gap:8px}
#faq .faq__i{border-radius:19px;backdrop-filter:none;-webkit-backdrop-filter:none}
#faq .faq__q{min-height:70px;padding:18px 24px;font-size:17px}
#faq .faq__ico{width:34px;height:34px;border:0;background:#e2f1eb}
@media(max-width:820px){
  #faq>.wrap{grid-template-columns:1fr;gap:32px}
  #faq .faq__intro{padding:0}
  #faq .faq__intro .sec__title{max-width:none;font-size:clamp(34px,7vw,50px)}
  #faq .faq__intro .sec__sub{margin-bottom:24px}
}
@media(max-width:560px){
  #faq .faq__actions{gap:18px}
  #faq .faq__q{min-height:64px;padding:16px 18px;font-size:15.5px}
}
#directions .dirs{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:310px 250px;gap:16px}
#directions .dir{display:block;padding:30px 32px;border-radius:24px;background:#fff;backdrop-filter:none;-webkit-backdrop-filter:none;isolation:isolate}
#directions .dir:hover{background:#fff}
#directions .dir::after{display:none}
#directions .dir__content{position:relative;z-index:2;display:flex;flex-direction:column;align-items:flex-start;height:100%}
#directions .dir__name{font-size:15px;margin-bottom:14px}
#directions .dir h3,#directions .dir--lg h3{font-size:clamp(24px,2.2vw,32px);line-height:1.13;margin-bottom:12px}
#directions .dir p{font-size:clamp(14px,1.18vw,17px);line-height:1.48;flex:none}
#directions .dir__price{margin-top:auto;font-size:16px;padding:9px 18px;background:#effaf6;border-color:#c4e2d8}
#directions .dir__visual{position:absolute;z-index:1;display:block;height:auto;max-width:none;pointer-events:none}
#directions .dir--sites .dir__visual{width:90%;right:0;bottom:0}
#directions .dir--sites p{max-width:88%}
#directions .dir--bots .dir__content{max-width:58%}
#directions .dir--bots .dir__visual{width:100%;right:0;bottom:-5%}
#directions .dir--automation .dir__content{max-width:78%}
#directions .dir--automation h3{font-size:clamp(23px,2vw,28px)}
#directions .dir--automation .dir__visual{width:75%;right:0;bottom:0}
#directions .dir--development .dir__content{max-width:55%}
#directions .dir--development .dir__visual{width:42%;right:0;bottom:0}
@media(max-width:1100px){
  #directions .dirs{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:none;grid-auto-rows:360px}
  #directions .dir--lg{grid-row:span 1}
  #directions .dir--wide{grid-column:span 2}
  #directions .dir--development .dir__visual{width:50%;bottom:0}
}
@media(max-width:700px){
  .sec>.wrap{width:calc(100% - 32px)}
  #directions .dirs{grid-template-columns:1fr;grid-auto-rows:auto}
  #directions .dir,#directions .dir--wide{grid-column:auto;min-height:400px;padding:26px;border-radius:22px}
  #directions .dir--sites{min-height:480px}
  #directions .dir--development{min-height:420px}
  #directions .dir h3,#directions .dir--lg h3{font-size:clamp(24px,7vw,31px)}
  #directions .dir p{font-size:15px}
  #directions .dir--sites p{max-width:100%}
  #directions .dir--sites .dir__visual{width:95%;right:0;bottom:0}
  #directions .dir--bots .dir__content{max-width:65%}
  #directions .dir--bots .dir__visual{width:115%;right:-15%;bottom:-4%}
  #directions .dir--automation .dir__content{max-width:74%}
  #directions .dir--automation .dir__visual{width:78%;right:0;bottom:0}
  #directions .dir--development .dir__content{max-width:80%}
  #directions .dir--development .dir__visual{width:78%;right:0;bottom:0}
}

.demo-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.demo-card{min-width:0;overflow:hidden;border:1px solid var(--line);border-radius:24px;background:#fff;box-shadow:0 8px 30px rgba(28,79,71,.045)}
.demo-card__visual{height:230px;display:grid;place-items:center;overflow:hidden;background:linear-gradient(145deg,#eaf5f0,#f7faf7)}
.demo-card__visual img{width:100%;height:100%;object-fit:cover}
.demo-card__body{padding:22px 24px 26px}
.demo-card__label,.demo-review__label{display:inline-block;padding:6px 11px;border:1px solid #c4e2d8;border-radius:999px;background:#effaf6;color:#176f69;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.07em}
.demo-card h3{font-size:23px;line-height:1.2;margin:15px 0 10px}
.demo-card p,.demo-review p{color:var(--muted);line-height:1.55}
.demo-review{min-height:210px;padding:26px;border:1px dashed #b4d6c9;border-radius:24px;background:#fff}
.demo-review h3{font-size:22px;margin:28px 0 10px}
.who__photo--placeholder{display:grid;place-items:center;flex:none;background:#e8f4ed;color:#0b716b;font-size:24px;font-weight:800}
.contact__pending{max-width:620px;margin:0 auto 24px;padding:16px 20px;border:1px solid #c4e2d8;border-radius:16px;background:#effaf6;color:#176f69;text-align:center}
.frm__submit:disabled{opacity:.65;cursor:default;box-shadow:none}
.frm__msg.is-ok{color:#176f69}
.frm__msg.is-err{color:#aa3434}
.cases--demo{grid-template-columns:repeat(3,minmax(0,1fr))}
.cases--demo .case__media{aspect-ratio:4/3;background:#eff8f3}
.cases--demo .case__media img{object-fit:contain}
.revs__more .btn{cursor:default}
@media(max-width:700px){.cases--demo{grid-template-columns:1fr}}
@media(max-width:800px){.demo-grid{grid-template-columns:1fr}.demo-card__visual{height:260px}.demo-review{min-height:0}}

/* Сетка отзывов не пересчитывает колонки во время hover-анимации. */
.revs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;column-count:initial}
.rev{break-inside:auto;margin:0;transition:transform .3s cubic-bezier(.22,1,.36,1),border-color .3s ease,box-shadow .3s ease}
.rev:hover{transform:translateY(-4px);background:#fff;border-color:#9dcbbd;box-shadow:0 14px 32px rgba(28,79,71,.12)}
@media(max-width:1024px){.revs{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:680px){.revs{grid-template-columns:1fr}}

/* У кнопки отправки убрана системная окантовка; клавиатурный focus остаётся доступным. */
.frm__submit{border:0;appearance:none;-webkit-appearance:none}

/* Прайс: нижние две карточки занимают всю ширину ряда. */
.cards{grid-template-columns:repeat(6,minmax(0,1fr))}
.cards>.card{grid-column:span 2}
.cards>.card:nth-child(n+4){grid-column:span 3}
@media(max-width:1024px){
  .cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cards>.card,.cards>.card:nth-child(n+4){grid-column:span 1}
  .cards>.card:last-child{grid-column:1/-1}
}
@media(max-width:700px){
  .cards{grid-template-columns:1fr}
  .cards>.card,.cards>.card:nth-child(n+4),.cards>.card:last-child{grid-column:1/-1}
}
/* Consent-based first-party analytics. */
.cookie-choice{box-sizing:border-box;position:fixed;z-index:10000;left:16px;right:16px;bottom:16px;width:min(832px,calc(100% - 32px));max-width:832px;min-height:152px;margin:auto;padding:22px 26px;display:flex;align-items:center;justify-content:space-between;gap:20px;border:1px solid #303030;border-radius:20px;background:#111;box-shadow:0 16px 45px rgba(0,0,0,.25);color:#f7f7f7;font-family:Onest,system-ui,sans-serif}
.cookie-choice__content{min-width:0;flex:1}
.cookie-choice h2{margin:0 0 8px;font-size:18px;line-height:1.25;font-weight:700;color:#f7f7f7}
.cookie-choice p{margin:0;font-size:13px;line-height:1.45;color:#a7a7a7}
.cookie-choice a{color:#d8bd75;text-decoration:none}
.cookie-choice a:hover{text-decoration:underline}
.cookie-choice__actions{display:flex;align-items:center;gap:8px;flex:none}
.cookie-choice__actions button{min-height:42px;padding:9px 12px;border-radius:10px;font:inherit;font-size:12px;font-weight:600;line-height:1.2;cursor:pointer;transition:background .2s,border-color .2s}
.cookie-choice__opt-in{min-width:144px;border:1px solid #0b716b;background:#0b716b;color:#fff}
.cookie-choice__opt-in:hover{background:#095f59;border-color:#095f59}
.cookie-choice button:focus-visible,.cookie-choice a:focus-visible{outline:2px solid #6dc4b3;outline-offset:3px}
@media(max-width:760px){.cookie-choice{left:10px;right:10px;bottom:10px;width:calc(100% - 20px);min-height:0;flex-direction:column;align-items:stretch;gap:16px;padding:18px;border-radius:18px}.cookie-choice__actions{width:100%}.cookie-choice__actions button{flex:1}}
@media(max-width:430px){.cookie-choice__actions{flex-direction:column}.cookie-choice__actions button{width:100%}}

/* 404 page: the site's existing navigation and footer frame the message. */
.not-found-page{min-height:100svh}
.not-found{min-height:min(740px,calc(100svh - 80px));padding:120px 16px 84px;display:flex;align-items:center;justify-content:center;text-align:center}
.not-found__inner{width:min(680px,100%)}
.not-found__code{margin:0 0 24px;color:#d5e9e2;font-size:clamp(132px,18vw,250px);font-weight:800;letter-spacing:-.075em;line-height:.82;-webkit-text-stroke:2px #0b716b}
.not-found h1{font-size:clamp(32px,4vw,52px);font-weight:800;color:var(--fg)}
.not-found__text{max-width:520px;margin:20px auto 0;color:var(--muted);font-size:clamp(16px,1.5vw,19px);line-height:1.6}
.not-found__actions{display:flex;justify-content:center;flex-wrap:wrap;gap:12px;margin-top:32px}
.not-found-page .ftr{margin-top:0}
@supports(-webkit-text-stroke:2px #0b716b){.not-found__code{color:transparent}}
@media(max-width:560px){.not-found{min-height:620px;padding:130px 20px 72px}.not-found__code{margin-bottom:28px;font-size:clamp(120px,32vw,180px);-webkit-text-stroke:1.5px #0b716b}.not-found__actions .btn{padding:13px 22px;font-size:14px}}