/* Wolf & Code — утверждённый брендбук, поверх функциональных компонентов сайта. */
:root,html[data-theme="dark"]{--bg:#05060a;--bg-2:#090e14;--bg-3:#141d26;--surface:#111923;--surface-2:#1a1f26;--line:#25303a;--text:#f4f4f1;--text-2:#b5bdc5;--text-3:#94a1ae;--cyan:#00b7ff;--cyan-hi:#69d4ff;--cyan-dim:#28647d;--ink:#05060a;--theme-primary:#00b7ff;--theme-primary-hover:#69d4ff;--theme-primary-ink:#05060a;--theme-focus:#00b7ff;--theme-ghost:#65717c;--theme-ghost-hover:#f4f4f1;--theme-hover-line:#486e82;--theme-link-line:#00b7ff;--display:'Unbounded',system-ui,sans-serif;--radius:12px;--svc-color:#00b7ff;--svc-ink:#00b7ff;--svc-rgb:0 183 255;--r1:#00b7ff;--r2:#00b7ff;--r3:#00b7ff;--r4:#00b7ff;--r5:#00b7ff;--rainbow:linear-gradient(#00b7ff,#00b7ff);--rainbow-smooth:var(--rainbow)}
html[data-theme="light"]{--bg:#f4f4f1;--bg-2:#e9edef;--bg-3:#e0e7eb;--surface:#fff;--surface-2:#dfe8ed;--line:#c1ccd3;--text:#101b24;--text-2:#3d505e;--text-3:#526878;--cyan:#006a95;--cyan-hi:#005477;--cyan-dim:#b4d9e8;--ink:#05060a;--theme-primary:#00b7ff;--theme-primary-hover:#69d4ff;--theme-primary-ink:#05060a;--theme-focus:#006a95;--theme-hover-line:#4f889f}
body{background:var(--bg)}
.rainbow{display:none}
.rb{width:26px;height:2px;border-radius:0;background:var(--cyan)}
.hdr{border-bottom-color:transparent}
.hdr .wrap{width:min(1440px,calc(100% - 64px));padding-block:22px;gap:18px}
.brand{gap:12px;max-width:270px}
.wc-symbol{display:block;width:38px;flex:none}
.wc-symbol img{width:100%;height:auto}
.wc-wordmark{display:block;width:190px;min-width:0}
.wc-wordmark>img{width:100%;height:auto;max-height:40px}
.wc-wordmark small{font:400 9px/1.5 var(--body);letter-spacing:.13em;color:var(--text-2);margin-top:5px;white-space:normal}
.wc-logo-dark{display:none}
html[data-theme="light"] .wc-logo-light{display:none}
html[data-theme="light"] .wc-logo-dark{display:block}
.nav>ul{font-size:13px;gap:20px}
.hdr-tel{font-size:13px;font-weight:500}
.hdr .city-btn{font-size:12px;padding-inline:8px;background:transparent}
.theme-toggle{border-radius:50%;width:36px;height:36px;background:transparent}
.hdr-cta{min-height:40px;font-size:11px;padding-inline:19px}
.btn{font-size:13px;font-weight:500;letter-spacing:.025em;min-height:48px}
.btn-main{box-shadow:none}
.btn-ghost{box-shadow:inset 0 0 0 1px var(--theme-ghost)}
.btn-main::before{content:none}
.h1,.h2,.cm-title{font-weight:800;letter-spacing:-.045em;line-height:1.1}
.h2{font-size:clamp(32px,4vw,54px)}
.h1 em,.h2 em,.cm-title em,.h1 .city,.h1-page em,[class*=svc-] .page-hero .h1 em{font-family:var(--display);font-style:normal;font-weight:800;color:var(--cyan);background:none;padding-bottom:0}
.kicker,.eyebrow{font-size:11px;letter-spacing:.17em;color:var(--text-2)}
.hero::before,html[data-theme="light"] .hero::before{background:radial-gradient(ellipse at 77% 40%,rgb(0 183 255/.12),transparent 58%)}
.hero .grid-bg{display:none}
.hero .wrap{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:64px;min-height:610px;padding-block:48px 56px}
.hero .h1{font-size:clamp(34px,4.4vw,68px);font-weight:800;line-height:1.08;max-width:16ch;margin-top:25px}
.hero .h1 .city{font-size:.75em;line-height:1.15;margin-top:12px;max-width:19ch}
.hero .lead{font-size:18px;line-height:1.55;max-width:46ch;color:var(--text-2);margin-top:25px}
.hero-cta{display:flex;flex-wrap:wrap;gap:16px;margin-top:30px}
.hero-art{aspect-ratio:auto;height:500px;max-width:480px;justify-self:center;animation:none}
.hero-art img{width:100%;height:100%;object-fit:contain;object-position:center;border-radius:0;mask-image:none;-webkit-mask-image:none;filter:drop-shadow(0 24px 35px rgb(0 0 0/.25))}
.hero-facts{gap:28px;margin-top:34px;padding-top:22px}
.hero-facts div{font-size:24px;font-weight:400}
.hero-facts small{font-size:11px;font-weight:400}
.sec{padding-block:80px}
.sec-head{gap:32px;margin-bottom:36px}
.sec-head>p{font-size:15px}
.sec-tight{padding-block:42px}
.home-services{border-block:1px solid var(--line)}
.service-routes{border:0;border-radius:0}
.service-route{border-top:0;background:transparent;padding:8px 28px;gap:12px}
.service-route:first-child{padding-left:0}
.service-route:last-child{padding-right:0}
.service-route:hover{background:transparent}
.wc-service-art{width:96px;height:96px;object-fit:contain;margin-bottom:8px}
.service-route small{font-size:11px;color:var(--text-3)}
.service-route h3{font-size:22px;font-weight:450;overflow-wrap:normal}
.service-route p{font-size:14px;line-height:1.6}
.service-route .tool-go{color:var(--cyan);font-size:12px}
.service-route:nth-child(n+3){border-top:0}
.case,.bcard,.tool-card,.own-product,.cs-feat{border-radius:8px}
.case::before,.bcard::before,.tool-card::before,.cs-feat::before{background:var(--cyan)}
.price strong{font-weight:400}
.prices{background:transparent}
.quick-h,.quick .sum b{font-weight:450}
.step{background:transparent;border-radius:8px}
.studio .pic{border-radius:10px}
.prod.big{background:var(--bg-2);border-color:var(--line)}
.fab-ring{background:conic-gradient(from 0deg,#00b7ff,#a6e7ff,#176789,#00b7ff);box-shadow:0 0 22px rgb(0 183 255/.15)}
.ftr{background:var(--bg-2)}
.ftr .brand{margin-bottom:24px}
.ftr .cols{gap:40px}
@media(min-width:1001px) and (max-width:1500px){.hdr-tel{display:none}.hdr .wrap{gap:14px}.nav>ul{gap:16px}.hdr .brand{max-width:230px}.wc-wordmark{width:172px}}
@media(max-width:1100px){.hero .wrap{gap:28px;min-height:560px}.hero-art{height:430px}.service-route{padding-inline:18px}.service-route h3{font-size:20px}}
@media(max-width:1000px){.hdr .wrap{width:calc(100% - 40px)}.service-route:nth-child(3){border-left:0}.service-route:nth-child(n+3){padding-top:28px}.service-route:nth-child(2){padding-right:0}.service-route:nth-child(3){padding-left:0}}
@media(max-width:760px){.hero .wrap{grid-template-columns:1fr;gap:20px;padding-block:35px 32px;min-height:0}.hero .h1{font-size:clamp(32px,6.5vw,48px);max-width:17ch}.hero .h1 .city{font-size:.75em;max-width:22ch}.hero .lead{font-size:16px;max-width:46ch}.hero-art{height:360px;max-width:320px;width:100%;grid-row:2}.hero-facts{gap:22px}.hero-facts div{font-size:21px}.sec{padding-block:56px}.sec-head{gap:20px}.sec-tight{padding-block:32px}.hero .eyebrow{font-size:9px;letter-spacing:.1em}.hdr .brand{max-width:215px}.wc-symbol{width:32px}.wc-wordmark{width:160px}.brand{gap:10px}.hdr .wrap{padding-block:18px;gap:10px}.hdr .theme-toggle{width:32px;height:32px}.burger{width:40px;height:40px;background:transparent;border:1px solid var(--line);border-radius:50%}.hero-cta .btn{padding-inline:22px;font-size:12px}}
@media(max-width:560px){.service-routes{grid-template-columns:1fr 1fr;gap:28px 18px}.service-route,.service-route:first-child,.service-route:last-child,.service-route:nth-child(n+3){padding:0;border:0}.service-route h3{font-size:18px;overflow-wrap:break-word}.service-route p{font-size:13px}.service-route small{font-size:10px}.wc-service-art{width:78px;height:78px}.service-route .tool-go{font-size:11px;gap:5px}.hdr .wrap{width:calc(100% - 28px)}.wc-wordmark{width:145px}.wc-wordmark small{font-size:8px}.hero-art{height:330px}.hero-facts{gap:18px}.hero-facts div{font-size:20px}.hero-facts small{font-size:10px}.hero-cta{gap:10px}.hero-cta .btn{padding-inline:18px}.h1-page{font-size:28px}.ftr .cols{gap:28px}.mm .brand{max-width:230px}}
@media(prefers-reduced-motion:reduce){.fab-ring{animation:none}}

/* Фактуры из фирменной серии; исходный знак остаётся отдельным изображением. */
.hero{background-image:linear-gradient(90deg,#05060a 4%,rgb(5 6 10/.85) 42%,rgb(5 6 10/.83)),url('../brand/obsidian-prism.webp');background-size:cover;background-position:center}
.hero .h1 .city{font-size:.65em;line-height:1.2;letter-spacing:-.03em}
.btn{font-family:var(--body);font-weight:700;font-size:15px;letter-spacing:normal}
.h2{font-size:clamp(30px,3.8vw,54px);line-height:1.14}
.service-route h3{font-size:clamp(17px,1.4vw,21px);line-height:1.35;font-weight:600}
.service-route .tool-go{color:var(--svc-ink)}
.service-route{border-top:2px solid var(--svc-color);padding-top:18px}
.service-route:nth-child(n+3){border-top:2px solid var(--svc-color)}
.service-route:hover .wc-service-art{transform:translateY(-4px)}
.wc-service-art{transition:transform .25s ease}
.own-page .page-hero .wrap{position:relative;isolation:isolate;overflow:hidden;padding-block:35px;min-height:430px}
.own-page .page-hero .h1,.own-page .page-hero .lead{position:relative;z-index:1;max-width:56%}
.wc-development-art{position:absolute;right:0;top:50%;transform:translateY(-50%);width:48%;height:auto;aspect-ratio:3/2;object-fit:contain;mask-image:linear-gradient(90deg,transparent,#000 16%,#000 91%,transparent),linear-gradient(180deg,transparent,#000 8%,#000 82%,transparent);mask-composite:intersect;z-index:-1}
.sec-lead .lead-form{background:linear-gradient(90deg,rgb(5 6 10/.9),rgb(5 6 10/.4)),url('../brand/stone-arch.webp') center/cover;border-radius:12px;color:#f4f4f1}
.sec-lead .lead-form>div>p,.sec-lead .contacts span{color:#c2cbd3}
.sec-lead .lead-form .wolf-bg{display:none}
.sec-lead .lead-form>form{color:var(--text);background:var(--bg);border:1px solid var(--line);padding:28px;border-radius:10px}
html[data-theme="light"] .hero{background-image:linear-gradient(90deg,#f4f4f1 5%,rgb(244 244 241/.88) 42%,rgb(244 244 241/.3)),url('../brand/obsidian-prism.webp')}
html[data-theme="light"] .sec-lead .h2 em{color:#00b7ff}
@media(max-width:1000px){.service-route:nth-child(3){border-top-color:var(--svc-color)}.own-page .page-hero .h1{font-size:32px}}
@media(max-width:760px){.hero{background-position:65% center}.hero .h1{line-height:1.1}.hero .lead{font-size:17px}.own-page .page-hero .h1,.own-page .page-hero .lead{max-width:100%}.own-page .page-hero .wrap{min-height:0;padding-block:0}.wc-development-art{position:relative;top:auto;right:auto;transform:none;width:100%;height:auto;z-index:0;margin-top:25px;border-radius:0}.sec-lead .lead-form>form{padding:20px}.sec-lead .lead-form{background-position:65% center}}
@media(max-width:560px){.service-route,.service-route:first-child,.service-route:last-child,.service-route:nth-child(n+3){padding-top:14px;border-top:2px solid var(--svc-color)}.service-route h3{font-size:16px}.hero .h1{font-size:32px}.hero .h1 .city{font-size:.7em}.hero-cta .btn{font-size:14px}.h1-page{font-size:28px}.sec-lead .lead-form{padding:24px 18px}.h2{font-size:30px}}
@media(prefers-reduced-motion:reduce){.service-route:hover .wc-service-art{transform:none}}

@media(max-width:380px){.hdr .city-btn{display:none}.hdr .wrap{gap:8px}.hdr .wc-wordmark{width:132px}.hdr .brand{gap:8px}.hero-art{max-width:100%}.hero-facts{gap:16px}.hero-facts div{font-size:18px}}

/* Чёткость изображения и спокойная иерархия деталей. */
.hero-art{max-width:400px;height:520px}
.hero-art img{object-fit:contain;filter:none;mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent),linear-gradient(180deg,transparent,#000 5%,#000 91%,transparent);mask-composite:intersect}
.wc-wordmark>img{max-height:none}
.sec-head>p{line-height:1.75}
.service-route{transition:background-color .25s ease}
.service-route:hover{background:rgb(var(--svc-rgb)/.045)}
.own-product-media{border-radius:12px;background:linear-gradient(145deg,var(--surface),var(--bg));transition:border-color .25s ease}
.own-product:hover .own-product-media{border-color:var(--cyan-dim)}
.own-tools article{transition:border-color .25s ease}
.own-tools article:hover{border-color:var(--cyan)}
.case,.bcard{transition:border-color .25s ease,box-shadow .25s ease}
.case:hover,.bcard:hover{box-shadow:0 16px 36px rgb(0 0 0/.18)}
.fab-ring{animation-duration:22s}
@media(max-width:760px){.hero-art{height:330px;max-width:248px}.hero .wrap{gap:12px}.hero-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.hero-facts div{font-size:clamp(14px,4vw,19px);white-space:nowrap}.hero-facts small{white-space:normal;font-size:10px;line-height:1.5}.hero-cta{margin-top:24px}.own-products{gap:32px}}
@media(prefers-reduced-motion:reduce){.service-route,.own-product-media,.own-tools article,.case,.bcard{transition:none}}

@media(max-width:760px){.hero{background-image:linear-gradient(90deg,#05060a 4%,rgb(5 6 10/.85) 42%,rgb(5 6 10/.83)),image-set(url("../brand/obsidian-prism-640.webp") 1x,url("../brand/obsidian-prism.webp") 2x)}.sec-lead .lead-form{background-image:linear-gradient(90deg,rgb(5 6 10/.9),rgb(5 6 10/.4)),image-set(url("../brand/stone-arch-640.webp") 1x,url("../brand/stone-arch.webp") 2x)}}

html:not([data-theme="light"]) .hero-art{mix-blend-mode:screen}

@media(max-width:380px){.hero-facts div{font-size:12px}.hero-facts{gap:10px}}

/* Один акцент раздела для кнопок, расчёта, ссылок и обратной связи. */
body:is(.svc-dev,.svc-shop,.svc-crm,.svc-seo,.svc-tools,.svc-brand){--cyan:var(--svc-ink);--cyan-hi:color-mix(in srgb,var(--svc-color),white 20%);--cyan-dim:rgb(var(--svc-rgb)/.28);--theme-primary:var(--svc-color);--theme-primary-hover:color-mix(in srgb,var(--svc-color),white 16%);--theme-primary-ink:#05060a;--theme-focus:var(--svc-ink);--theme-hover-line:rgb(var(--svc-rgb)/.6);--theme-link-line:var(--svc-ink);--rainbow:linear-gradient(var(--svc-color),var(--svc-color));--rainbow-smooth:var(--rainbow)}
body[class*="svc-"] .fab-ring{background:conic-gradient(var(--svc-color),color-mix(in srgb,var(--svc-color),white 55%),var(--svc-color));box-shadow:0 0 22px rgb(var(--svc-rgb)/.15)}
body[class*="svc-"] .sec-lead .lead-form{background-image:radial-gradient(ellipse at 0 100%,rgb(var(--svc-rgb)/.13),transparent 65%)}
/* Сцена — часть пространства страницы, без карточки и рамки. */
.svc-page .page-hero,.tool-hero{overflow:hidden}
.svc-page .page-hero::before,.tool-hero::before{background:none}
.svc-hero{position:relative;isolation:isolate;min-height:540px;display:flex;align-items:center;padding-block:24px}
.svc-hero>div:first-child:not(.svc-art){position:relative;z-index:1;width:58%;max-width:760px}
.svc-hero .svc-art{position:absolute;inset:-30px -60px -30px auto;width:100%;max-width:none;height:calc(100% + 60px);aspect-ratio:auto;border:0;border-radius:0;overflow:visible;background:none;z-index:-1;pointer-events:none;mask-image:linear-gradient(90deg,transparent 44%,#000 70%,#000 92%,transparent),linear-gradient(180deg,transparent,#000 12%,#000 82%,transparent);mask-composite:intersect}
.svc-art::before{display:none}
.svc-hero .svc-art img{display:block;width:100%;height:100%;object-fit:contain;object-position:right center;border-radius:0;mask-image:none}
@media(max-width:1100px) and (min-width:861px){.svc-hero>div:first-child:not(.svc-art){width:62%}.svc-hero .svc-art{right:-100px;opacity:.85}}
@media(max-width:860px){.svc-hero{display:flex;flex-direction:column;align-items:stretch;min-height:0;padding-block:0;gap:8px}.svc-hero>div:first-child:not(.svc-art){width:100%;max-width:none}.svc-hero .svc-art,.tool-hero .svc-art{display:block;position:relative;inset:auto;z-index:0;width:100%;max-width:none;height:auto;aspect-ratio:3/2;overflow:hidden;margin:0;mask-image:linear-gradient(90deg,transparent,#000 10%,#000 92%,transparent),linear-gradient(180deg,transparent,#000 14%,#000 80%,transparent)}.svc-hero .svc-art img{width:145%;max-width:none;height:100%;margin-left:-45%;object-fit:cover;object-position:right center}}

/* Единый фон первого экрана разработок, без прямоугольного свечения. */
.own-page .page-hero::before{background:none}
.own-page .page-hero{padding-bottom:24px}

/* Движение следует за действием посетителя; контент остаётся на месте. */
@media(prefers-reduced-motion:no-preference){.svc-art img,.hero-art img,.wc-development-art{transition:translate .45s cubic-bezier(.2,.7,.2,1)}.case img,.own-product-media img{transition:scale .55s cubic-bezier(.2,.7,.2,1)}.case:hover img,.own-product:hover .own-product-media img{scale:1.025}.btn svg,.tool-go svg,.more svg{transition:translate .22s ease}.btn:hover svg,.tool-go:hover svg,.more:hover svg{translate:3px 0}.service-route .wc-service-art{transition:transform .4s ease,filter .4s ease}.service-route:hover .wc-service-art{transform:translateY(-5px) rotate(-3deg);filter:drop-shadow(0 8px 12px rgb(var(--svc-rgb)/.18))}}

/* Просмотр проекта: реальные изображения и изолированный живой сайт. */
 .work-preview{width:calc(100vw - 40px);height:calc(100dvh - 40px);max-width:1600px;max-height:1000px;padding:0;margin:auto;border:1px solid #29313a;border-radius:16px;background:#080d13;color:#f4f4f1;overflow:hidden;box-shadow:0 24px 100px #0008}
.work-preview[open]{display:flex;flex-direction:column}.work-preview::backdrop{background:rgb(0 0 0/.88);backdrop-filter:blur(8px)}
.work-preview-bar{display:flex;align-items:center;gap:12px;min-height:64px;padding:10px 16px;border-bottom:1px solid #202730;flex-shrink:0}
.preview-dots{display:flex;gap:6px}.preview-dots i{width:8px;height:8px;border-radius:50%;background:#ff6057}.preview-dots i:nth-child(2){background:#ffbd2e}.preview-dots i:nth-child(3){background:#28c840}
.preview-address{flex:1;min-width:80px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border:1px solid #242b33;background:#05070b;border-radius:30px;padding:10px 16px;font:400 12px/1.2 var(--body);color:#aab5c1}
.work-preview-controls{display:flex;gap:3px;border:1px solid #242b33;border-radius:30px;padding:3px;flex-shrink:0}
.work-preview button{cursor:pointer;font:500 12px/1.2 var(--body);color:#aab5c1;background:transparent;border:0;border-radius:25px;padding:9px 12px;white-space:nowrap}.work-preview button[aria-pressed="true"]{background:#00b7ff;color:#05060a}.work-preview button:focus-visible,.preview-mode:focus-visible{outline:2px solid #70d4ff;outline-offset:3px}
.preview-mode{font:400 12px/1.2 var(--body);background:#0b1118;color:#aab5c1;border:0;max-width:115px;padding:8px 0;cursor:pointer}.work-preview [data-preview-open]{color:#00b7ff;font-size:22px;text-decoration:none;line-height:1;padding:8px}.work-preview [data-preview-close]{border:1px solid #303943;width:38px;height:38px;padding:0;font-size:24px;color:#e8edf2;flex-shrink:0}
.work-preview-stage{flex:1;min-height:0;position:relative;padding:24px;background:radial-gradient(ellipse at 50% 0%,#0c2533 0%,#05070b 65%)}.work-preview-screen{margin:0 auto;transform-origin:top center;background:white;border-radius:8px;overflow:hidden;box-shadow:0 12px 40px #0006}.work-preview-screen img{display:block;width:100%;height:auto}.work-preview-screen iframe{display:block;width:100%;height:100%;border:0}.work-preview-screen [hidden]{display:none}.case-body .work-preview-trigger{position:relative;z-index:2;grid-column:1/-1;justify-self:start;margin-top:12px;font-size:13px}
.about-wolf-story{display:grid;grid-template-columns:minmax(240px,400px) minmax(0,1fr);gap:clamp(30px,6vw,90px);align-items:center}.about-wolf-story figure{margin:0}.about-wolf-story img{display:block;width:100%;height:auto;border-radius:8px}.about-wolf-story figcaption{margin-top:14px;color:var(--text-2);font-size:14px}.about-wolf-story p{color:var(--text-2);line-height:1.8;font-size:18px}.about-wolf-principles{display:grid;grid-template-columns:1fr 1fr;gap:32px;margin-top:32px}.about-wolf-principles article{border-top:1px solid var(--line);padding-top:24px}.about-wolf-principles h3{font-size:22px}.about-wolf-principles p{color:var(--text-2);line-height:1.75}
@media(max-width:760px){.about-wolf-story,.about-wolf-principles{grid-template-columns:1fr}.about-wolf-story figure{max-width:400px}.about-wolf-story p{font-size:16px}}
@media(max-width:700px){.work-preview{width:100%;height:100dvh;max-height:none;margin:0;border:0;border-radius:0}.work-preview-bar{flex-wrap:wrap;gap:8px;padding:10px;min-height:0}.preview-dots{display:none}.preview-address{order:0;flex:1}.work-preview [data-preview-open]{order:1}.work-preview [data-preview-close]{order:2}.work-preview-controls{order:3;flex:1;justify-content:center}.preview-mode{order:4}.work-preview-stage{padding:10px}}

.about-wolf .page-hero::before{background:none}.about-wolf .hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}

/* SiteRussia: линейные знаки услуг. */
 .service-route .sr-service-icon{display:block;width:48px;height:48px;flex:none;margin-bottom:16px;fill:none;stroke:var(--text);stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round}
.service-route .sr-service-icon .a{stroke:var(--svc-color)}
.service-route:focus-visible{outline:2px solid var(--svc-color);outline-offset:6px}
@media(max-width:560px){.service-route .sr-service-icon{width:40px;height:40px;margin-bottom:10px}}

/* SiteRussia: проекты в движении, самостоятельная подача для российского рынка. */
.sr-film-hero{position:relative;isolation:isolate;overflow:hidden;background:#05060a;color:#f4f4f1}
.hero.sr-film-hero,html[data-theme="light"] .hero.sr-film-hero{background-image:none}
.sr-film-hero::before,.page-hero.sr-film-hero::before{display:none}
.sr-film{position:absolute;inset:0;z-index:-1;pointer-events:none;background:#05060a}
.sr-film>img,.sr-film>video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:70% center}
.sr-film>video{opacity:0;transition:opacity .6s ease}
.sr-video-playing>.sr-film>video{opacity:1}
.sr-film::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#05060a 2%,rgb(5 6 10/.95) 27%,rgb(5 6 10/.75) 48%,rgb(5 6 10/.18) 100%),linear-gradient(0deg,#05060a,transparent 28%,rgb(5 6 10/.12))}
.hero.sr-film-hero .wrap{display:block;min-height:650px;padding-block:72px 48px}
.hero.sr-film-hero .wrap>div{max-width:690px;width:58%}
.hero.sr-film-hero .h1{font-family:var(--body);font-weight:500;font-size:clamp(40px,4.5vw,68px);line-height:1.08;letter-spacing:-.045em;max-width:15ch}
.hero.sr-film-hero .h1 .city{font-family:var(--body);font-weight:450;font-size:.68em;line-height:1.2;max-width:22ch;color:#00b7ff}
.sr-film-hero .lead,.sr-film-hero .kicker,.sr-film-hero .eyebrow,.sr-film-hero .hero-facts small{color:#c3c9d0}
.sr-film-hero .hero-facts{border-color:rgb(255 255 255/.18)}
.sr-film-caption{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:32px;font-size:12px;color:#aeb8c1}
.sr-video-toggle{position:relative;z-index:3;display:inline-flex;align-items:center;justify-content:center;min-height:36px;padding:7px 14px;border:1px solid var(--line);border-radius:24px;background:var(--bg-2);color:var(--text);font:500 12px/1.4 var(--body);cursor:pointer}
.sr-video-toggle:hover{border-color:var(--cyan)}
.sr-video-toggle:focus-visible{outline:2px solid var(--cyan);outline-offset:4px}
.sr-film-hero .sr-video-toggle{background:rgb(5 6 10/.72);color:#f4f4f1;border-color:#64717d}
.sr-work-hero{min-height:420px;padding-block:40px 58px}
.sr-work-hero .sec-head{display:block;margin-top:45px}
.sr-work-hero .sec-head>div{max-width:640px}
.sr-work-hero .h1{font-family:var(--body);font-weight:500;font-size:clamp(40px,5vw,70px)}
.sr-work-hero .h1 em{font-family:inherit;font-weight:inherit;font-style:normal}
.sr-work-hero .sr-video-toggle{margin-top:24px}
.case .scr{position:relative;overflow:hidden;isolation:isolate}
.sr-card-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top;z-index:3;pointer-events:none;opacity:0;transition:opacity .25s ease}
.sr-video-playing .sr-card-video{opacity:1}
.sr-case-actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px;grid-column:1/-1}
.sr-work-search{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin:10px 0 28px}
.sr-work-search label{font-size:14px;font-weight:500}
.sr-work-search input{flex:1;min-width:220px;max-width:560px;border:0;border-bottom:1px solid var(--line);border-radius:0;background:transparent;color:var(--text);font:400 16px/1.5 var(--body);padding:12px 0}
.sr-work-search input:focus{outline:none;border-color:var(--cyan)}
.sr-work-search [data-work-count]{font-size:13px;color:var(--text-2)}
.sr-work-empty{padding:40px 0;color:var(--text-2)}
@media(max-width:760px){.hero.sr-film-hero .wrap{min-height:0;padding-block:42px 38px}.hero.sr-film-hero .wrap>div{width:100%;max-width:580px}.hero.sr-film-hero .h1{font-size:clamp(38px,8.8vw,54px)}.hero.sr-film-hero .lead{font-size:16px}.sr-film::after{background:linear-gradient(90deg,rgb(5 6 10/.94),rgb(5 6 10/.72)),linear-gradient(0deg,#05060a,transparent)}.sr-film-caption{gap:12px;margin-top:24px}.sr-work-hero{min-height:360px}.sr-work-hero .sec-head{margin-top:30px}.sr-work-search{gap:12px}.sr-work-search label{width:100%}.sr-work-search input{width:100%;max-width:none;flex-basis:100%}}
@media(prefers-reduced-motion:reduce){.sr-film>video,.sr-card-video{transition:none}}

/* Каталог: крупное окно работы без вложенных декоративных устройств. */
.show>.case{padding:0;border:0;border-radius:0;background:transparent;align-self:start}
.show>.case .devices{padding:0}
.show>.case .phone{display:none}
.show>.case .browser{border-radius:8px;border:1px solid var(--line);box-shadow:none}
.show>.case .case-body{padding:24px 0 14px}
.show>.case .case-body h3{font-family:var(--body);font-size:26px;font-weight:600;letter-spacing:-.025em}
.show>.case .num{font-family:var(--body);font-size:28px;font-weight:500}
.show>.case:hover{transform:none}
.sr-service-film{padding-bottom:44px;min-height:550px}
.sr-service-film .wrap>div:not(.breadcrumbs){max-width:760px;width:60%}
.sr-service-film .h1{font-family:var(--body);font-weight:500;font-size:clamp(36px,4.2vw,60px);letter-spacing:-.035em}
.sr-service-film .svc-price{color:#f4f4f1}
.sr-service-film .sr-film-caption{width:100%;max-width:none}
.sr-service-film .btn-ghost{color:#f4f4f1}
@media(max-width:760px){.sr-service-film .wrap>div:not(.breadcrumbs){width:100%}.sr-service-film{min-height:0}.sr-service-film .h1{font-size:36px}.show>.case .case-body h3{font-size:23px}.show>.case .case-body{padding-top:18px}}

/* Удобные нажатия на телефоне и ровные действия в карточках. */
@media(max-width:760px){.sr-video-toggle{min-height:44px;padding:10px 16px}.sr-case-actions{align-items:stretch}.sr-case-actions .sr-video-toggle{min-height:48px}.sr-service-film .hero-cta{display:grid;grid-template-columns:1fr;gap:12px}.sr-service-film .hero-cta .btn{width:100%;text-align:center}}

/* Один видимый медиаслой, без старой подсветки всей карточки. */
.case.sr-video-playing .scr img{opacity:0}.case .scr img{scale:1}.case:hover .scr img{scale:1}.show>.case .scr{aspect-ratio:16/9}.show>.case .scr img{object-fit:cover}.show>.case::before,.show>.case::after{display:none}.show>.case:hover{box-shadow:none}