/* Setoria: страницы и блоки содержания */
@font-face{font-family:"Inter Tight";font-weight:900;font-display:swap;src:url(fonts/inter-tight-cyrillic-900-normal.woff2) format("woff2");unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Inter Tight";font-weight:900;font-display:swap;src:url(fonts/inter-tight-latin-900-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2122}
@font-face{font-family:"Inter Tight";font-weight:700;font-display:swap;src:url(fonts/inter-tight-cyrillic-700-normal.woff2) format("woff2");unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Inter Tight";font-weight:700;font-display:swap;src:url(fonts/inter-tight-latin-700-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2122}
@font-face{font-family:"Onest";font-weight:400;font-display:swap;src:url(fonts/onest-cyrillic-400-normal.woff2) format("woff2");unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Onest";font-weight:400;font-display:swap;src:url(fonts/onest-latin-400-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2122}
@font-face{font-family:"Onest";font-weight:500;font-display:swap;src:url(fonts/onest-cyrillic-500-normal.woff2) format("woff2");unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Onest";font-weight:500;font-display:swap;src:url(fonts/onest-latin-500-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2122}

:root{
  --ink:#11174A; --acc:#3B4CFF; --paper:#EFEBE3; --paper2:#E6E1D6; --deep:#05061A; --deep2:#0B0E2A;
  --fg-dk:#ECEAF4; --mut-dk:#A7ABCE; --mut-lt:#4D5378; --line-lt:rgba(17,23,74,.16); --line-dk:rgba(236,234,244,.16);
  --f-head:"Inter Tight",system-ui,sans-serif; --f-body:"Onest",system-ui,sans-serif;
  --pad:clamp(16px,4.2vw,64px); --maxw:1440px;
}
html{-webkit-text-size-adjust:100%}
body.sx{margin:0;background:var(--paper);color:var(--ink);overflow-x:hidden}
.sx{font-family:var(--f-body);font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased}
.sx *{box-sizing:border-box}
.sx a{color:inherit}
.sx :focus-visible{outline:2px solid var(--acc);outline-offset:3px;border-radius:4px}
.sx .wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--pad)}
.sx .wrap.narrow{max-width:900px}
.sx .lt{background:var(--paper);color:var(--ink)}
.sx .dk{background:var(--deep);color:var(--fg-dk)}
.sx section.blk{padding:clamp(72px,10vw,150px) 0;position:relative}
.sx section.blk.tight{padding:clamp(36px,4.6vw,72px) 0}
.sx section.page-top{padding-top:clamp(110px,12vw,170px);padding-bottom:clamp(40px,5vw,72px)}
.sx h1,.sx h2,.sx h3,.sx h4{font-family:var(--f-head);font-weight:700;letter-spacing:-.018em;margin:0;text-wrap:balance}
.sx .big{line-height:1.02;font-size:clamp(40px,6.2vw,96px);margin:0 0 24px}
.sx .case-h{font-size:clamp(36px,5vw,76px);max-width:18ch}
.sx .doc-h{font-size:clamp(34px,4.4vw,60px)}
.sx .mid{font-size:clamp(26px,2.8vw,40px);line-height:1.1}
.sx h3{line-height:1.12}
.sx p.lead{font-size:clamp(18px,1.55vw,22px);line-height:1.5;max-width:44ch;margin:0}
.sx p.lead.wide{max-width:62ch}
.sx .lt .mut{color:var(--mut-lt)} .sx .dk .mut{color:var(--mut-dk)}
.sx .btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 28px;border-radius:999px;font:500 16px var(--f-body);text-decoration:none;border:1px solid currentColor;background:transparent;color:inherit;cursor:pointer;transition:background .25s,color .25s,border-color .25s}
.sx .btn.fill{background:var(--acc);border-color:var(--acc);color:#F4F3FA}
.sx .btn:hover{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.sx .dk .btn:hover{background:var(--fg-dk);border-color:var(--fg-dk);color:var(--ink)}
.sx .btn.fill:hover{background:#2E3DE6;border-color:#2E3DE6;color:#fff}
.sx .row-btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.sx .tl{display:inline-block;text-underline-offset:4px;padding:10px 0;font-weight:500}
.sx .crumbs{font-size:14px;color:var(--mut-lt);margin-bottom:28px;display:flex;flex-wrap:wrap;gap:6px}
.sx .crumbs a{text-underline-offset:3px}
.sx .ws-dir{display:block;font-size:14px;color:var(--mut-dk)}
.sx .lt .ws-dir{color:var(--mut-lt)}
.sx .ig-note{font-size:13px;color:var(--mut-lt);margin:0;padding:0 0 28px}

/* две колонки: заголовок слева, текст справа */
.sx .two{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,5vw,80px);align-items:start}
.sx .two .big{font-size:clamp(36px,4.2vw,64px);margin:0}
.sx .prose{max-width:68ch}
.sx .prose p{margin:0 0 1.05em}
.sx .prose a{text-underline-offset:3px;text-decoration-thickness:1px}
.sx .doc h2{font-size:24px;margin:36px 0 10px}
.sx .dotless{list-style:none;margin:0;padding:0;border-top:1px solid var(--line-lt);max-width:68ch}
.sx .dotless li{padding:14px 0;border-bottom:1px solid var(--line-lt)}
.sx .links a{text-underline-offset:3px}

/* услуги */
.sx .sgs{margin-top:clamp(40px,5vw,72px);border-top:1px solid var(--line-lt)}
.sx .sg{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(16px,4vw,64px);padding:clamp(24px,3vw,44px) 0;border-bottom:1px solid var(--line-lt)}
.sx .sg>h3,.sx .sg-h{font-size:clamp(28px,3.1vw,46px);line-height:1.05}
.sx .sg ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:clamp(18px,2.2vw,32px)}
.sx .sg a{display:block;text-decoration:none;height:100%}
.sx .sg h4,.sx .sg li h3{font-size:20px;line-height:1.2;margin:0 0 8px;transition:color .2s}
.sx .sg a:hover h4,.sx .sg a:hover h3{color:var(--acc)}
.sx .sg p{margin:0;font-size:15px;color:var(--mut-lt);line-height:1.45}
.sx .rel{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:24px}
.sx .rel a{text-decoration:none}.sx .rel h4{font-size:20px;margin-bottom:8px}.sx .rel a:hover h4{color:var(--acc)}.sx .rel p{margin:0;font-size:15px;color:var(--mut-lt)}

/* кейсы на главной */
.sx .cts{display:flex;flex-direction:column;gap:clamp(56px,7vw,110px);margin:clamp(40px,5vw,72px) 0}
.sx .ct{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(24px,4vw,64px);align-items:center}
.sx .ct.rev .ct-img{order:2}
.sx .ct-img{display:block;border-radius:6px;overflow:hidden;background:var(--deep2)}
.sx .ct-img img{width:100%;height:auto;display:block;transition:transform 1.1s cubic-bezier(.2,.7,.2,1)}
.sx .ct-img:hover img{transform:scale(1.02)}
.sx .ct h3{font-size:clamp(26px,2.8vw,42px);margin:10px 0 14px}
.sx .ct h3 a{text-decoration:none}
.sx .ct p{margin:0 0 8px;color:var(--mut-dk);max-width:48ch}

/* как работаем */
.sx .steps{list-style:none;margin:0;padding:0;border-top:1px solid var(--line-lt)}
.sx .steps li{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:8px 28px;padding:20px 0;border-bottom:1px solid var(--line-lt)}
.sx .steps h3{font-size:20px;line-height:1.25}
.sx .steps p{margin:0;color:var(--mut-lt)}

/* вопросы */
.sx .faq{border-top:1px solid var(--line-lt)}
.sx .faq details{border-bottom:1px solid var(--line-lt)}
.sx .faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:24px;padding:20px 0;font:500 clamp(17px,1.4vw,20px)/1.35 var(--f-body)}
.sx .faq summary::-webkit-details-marker{display:none}
.sx .faq summary::after{content:"+";color:var(--acc);font-size:24px;line-height:1;transition:transform .3s}
.sx .faq details[open] summary::after{transform:rotate(45deg)}
.sx .faq p{margin:0 0 22px;max-width:66ch;color:var(--mut-lt)}

/* контакт */
.sx .contact{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,6vw,96px);align-items:start}
.sx form.brief{display:grid;gap:18px}
.sx form.brief label{display:grid;gap:8px;font-size:14px;color:var(--mut-dk)}
.sx form.brief input,.sx form.brief textarea{width:100%;font:400 17px var(--f-body);color:var(--fg-dk);background:rgba(236,234,244,.05);border:1px solid var(--line-dk);border-radius:8px;padding:14px 16px;min-height:52px}
.sx form.brief textarea{min-height:130px;resize:vertical}
.sx form.brief input:focus,.sx form.brief textarea:focus{outline:2px solid var(--acc);outline-offset:0;border-color:transparent}
.sx form.brief .agree{display:flex;gap:12px;align-items:flex-start;font-size:13px;line-height:1.45}
.sx form.brief .agree input{width:20px;height:20px;min-height:0;margin:2px 0 0;accent-color:var(--acc);flex:none}
.sx form.brief .status{min-height:22px;font-size:14px;margin:0;color:#BFC6FF}
.sx form.brief .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.sx .channels{list-style:none;margin:32px 0 0;padding:0;border-top:1px solid var(--line-dk)}
.sx .channels a{display:flex;justify-content:space-between;gap:16px;padding:18px 0;border-bottom:1px solid var(--line-dk);text-decoration:none;font:500 18px var(--f-body)}
.sx .channels a:hover{color:#BFC6FF}
.sx .channels small{font-size:15px;font-weight:400;color:var(--mut-dk)}

/* подвал */
.sx footer.foot{background:var(--deep);color:var(--fg-dk);padding:64px 0 32px;border-top:1px solid var(--line-dk)}
.sx .foot-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:32px}
.sx .foot h4{font-weight:700;font-size:16px;margin:0 0 14px}
.sx .foot ul{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.sx .foot ul a{text-decoration:none;color:var(--mut-dk);font-size:15px}
.sx .foot ul a:hover{color:var(--fg-dk)}
.sx .foot-mid{display:flex;flex-wrap:wrap;gap:20px 40px;align-items:center;justify-content:space-between;margin-top:56px}
.sx .foot .logo{font-family:var(--f-head);font-weight:900;font-size:44px;letter-spacing:-.085em;line-height:1;text-decoration:none}
.sx .foot-c{display:flex;flex-wrap:wrap;gap:8px 28px}.sx .foot-c a{text-underline-offset:3px;padding:8px 0}
.sx .foot-legal{display:flex;flex-wrap:wrap;gap:12px 28px;justify-content:space-between;margin-top:32px;padding-top:20px;border-top:1px solid var(--line-dk);font-size:13px;color:var(--mut-dk)}
.sx .foot-legal a{color:var(--mut-dk)}
.sx .foot-legal .ll{display:flex;flex-wrap:wrap;gap:6px 20px}

/* страница работ */
.sx .chips{display:flex;flex-wrap:wrap;gap:8px;margin:36px 0 0}
.sx .chips button{font:500 14px var(--f-body);min-height:44px;padding:0 18px;border-radius:999px;border:1px solid var(--line-lt);background:transparent;color:var(--ink);cursor:pointer}
.sx .chips button[aria-pressed=true]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.sx .grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(24px,2.6vw,40px) clamp(16px,2vw,28px);margin-top:44px}
.sx .grid.three{margin-top:28px}
.sx .card{grid-column:span 4;display:flex;flex-direction:column;gap:8px}
.sx .card.wide{grid-column:span 8}
.sx .grid.three .card{grid-column:span 4}
.sx .card .img{all:unset;cursor:zoom-in;display:block;border-radius:6px;overflow:hidden;aspect-ratio:3/2;background:var(--paper2);margin-bottom:6px}
.sx .card a.img{cursor:pointer}
.sx .card .img:focus-visible{outline:2px solid var(--acc);outline-offset:3px}
.sx .card img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.sx .card .img:hover img{transform:scale(1.025)}
.sx .card h3{font-size:21px}.sx .card h3 a{text-decoration:none}.sx .card h3 a:hover{color:var(--acc)}
.sx .card p{margin:0;color:var(--mut-lt);font-size:15px;line-height:1.45}
.sx .card .dir{font-size:13px;color:var(--mut-lt)}
.sx .card[hidden]{display:none}
.sx .sec-h{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:12px}
.sx dialog.lb{border:0;padding:0;background:var(--deep);color:var(--fg-dk);max-width:min(1200px,94vw);width:100%;border-radius:10px;font-family:var(--f-body)}
.sx dialog.lb::backdrop{background:rgba(5,6,26,.82)}
.sx dialog.lb img{width:100%;height:auto;display:block}
.sx dialog.lb .lb-meta{padding:22px 28px 26px;display:grid;gap:10px;justify-items:start}
.sx dialog.lb h3{font-size:26px}
.sx dialog.lb p{margin:0}
.sx dialog.lb ul.did{margin:0;padding-left:18px;color:var(--mut-dk)}
.sx dialog.lb .x{position:absolute;top:12px;right:12px;width:44px;height:44px;border-radius:50%;border:0;background:rgba(5,6,26,.7);color:#fff;font-size:22px;cursor:pointer}

/* кейс */
.sx .case-meta{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px 32px;margin:36px 0 clamp(32px,4vw,56px);padding:20px 0;border-top:1px solid var(--line-lt);border-bottom:1px solid var(--line-lt)}
.sx .case-meta dt{font-size:13px;color:var(--mut-lt);margin-bottom:4px}.sx .case-meta dd{margin:0}.sx .case-meta a{text-underline-offset:3px}
.sx .case-hero{border-radius:8px;overflow:hidden}.sx .case-hero img{width:100%;height:auto;display:block}
.sx .gal{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(16px,2vw,28px);align-items:start}
.sx .gal figure{margin:0}.sx .gal figure:only-child{grid-column:1/-1}
.sx .gal img{width:100%;height:auto;display:block;border-radius:6px}
.sx .gal figcaption{margin-top:8px;font-size:14px;color:var(--mut-lt)}
.sx .mets{list-style:none;margin:24px 0;padding:0;border-top:1px solid var(--line-lt)}
.sx .mets li{display:grid;grid-template-columns:minmax(120px,auto) 1fr;gap:6px 24px;padding:12px 0;border-bottom:1px solid var(--line-lt);align-items:baseline}
.sx .mets b{font-family:var(--f-head);font-weight:700;font-size:24px;white-space:nowrap}
.sx .mets span{color:var(--mut-lt);font-size:15px}
.sx .next{display:grid;gap:14px;justify-items:start}
.sx .next-a{font-family:var(--f-head);font-weight:700;font-size:clamp(28px,4vw,56px);line-height:1.05;letter-spacing:-.018em;text-decoration:none;max-width:22ch}
.sx .next-a:hover{color:var(--acc)}

/* шапка */
.sx .topbar{position:fixed;inset:0 0 auto 0;z-index:30;display:flex;justify-content:space-between;align-items:center;padding:14px var(--pad);background:rgba(239,235,227,.9);backdrop-filter:blur(8px);color:var(--ink)}
.sx .topbar .logo{font-family:var(--f-head);font-weight:900;font-size:28px;letter-spacing:-.085em;text-decoration:none}
.sx .topbar nav{display:flex;gap:clamp(14px,2.4vw,32px);align-items:center}
.sx .topbar nav a{text-decoration:none;font-size:15px;padding:12px 0;font-weight:500}
.sx .topbar nav a[aria-current]{text-decoration:underline;text-underline-offset:4px}
.sx .skip{position:absolute;left:-9999px;top:8px;z-index:99;background:var(--acc);color:#fff;padding:10px 16px;border-radius:6px}
.sx .skip:focus{left:8px}

/* уведомление о cookies */
.ck{position:fixed;left:16px;right:16px;bottom:16px;z-index:60;margin-left:auto;max-width:440px;background:#11174A;color:#ECEAF4;border-radius:10px;padding:14px 16px;font:400 14px/1.45 Onest,system-ui,sans-serif;box-shadow:0 12px 40px rgba(5,6,26,.45)}
.ck p{margin:0 0 10px}.ck a{color:inherit}
.ck div{display:flex;flex-wrap:wrap;gap:8px}
.ck button{min-height:40px;padding:0 14px;border-radius:999px;border:1px solid rgba(236,234,244,.4);background:transparent;color:inherit;font:500 14px Onest,system-ui,sans-serif;cursor:pointer}
.ck button[data-v=all]{background:#ECEAF4;color:#11174A;border-color:#ECEAF4}

@media (max-width:1000px){
  .sx .two{grid-template-columns:1fr}
  .sx .ct,.sx .ct.rev{grid-template-columns:1fr}.sx .ct.rev .ct-img{order:0}
  .sx .sg{grid-template-columns:1fr}
  .sx .contact{grid-template-columns:1fr}
  .sx .foot-grid{grid-template-columns:1fr 1fr}
  .sx .card,.sx .card.wide,.sx .grid.three .card{grid-column:span 6}
  .sx .case-meta{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .sx{font-size:16px}
  .sx .steps li{grid-template-columns:1fr}
  .sx .card,.sx .card.wide,.sx .grid.three .card{grid-column:span 12}
  .sx .gal{grid-template-columns:1fr}
  .sx .foot-grid{grid-template-columns:1fr 1fr;gap:28px 20px}
  .sx .case-meta{grid-template-columns:1fr}
  .sx .topbar .logo{font-size:25px}
  .sx .topbar nav{gap:14px}.sx .topbar nav a{font-size:14px}
}
@media (prefers-reduced-motion:reduce){.sx *{transition-duration:.01ms!important}}