/* chistodzen.ru «ЧистоДзен» — «Листья и вода». Тёмный фон, тонкие высокие заголовки Alumni Sans, разреженные капсы Montserrat, мята.
   Правило плавности: всё, что движется, двигается только через transform и opacity. Размытие и тени слоёв первого
   экрана запечены в картинки (src/bake.py), у карточек нет backdrop-filter. Всё движение — под классом .has-motion,
   который ставится только когда JS жив и не включено «уменьшить движение». */
:root{
  --bg:#03120b;--bg2:#061a10;--card:#0a2116;--ink:#f2fff8;--muted:#b9d6c6;--mint:#8dffd1;--mint-ink:#03120b;
  --line:rgba(255,255,255,.14);--line2:rgba(255,255,255,.08);
  --font:Montserrat,system-ui,-apple-system,"Segoe UI",sans-serif;--disp:"Alumni Sans",Impact,sans-serif;
  --wrap:1240px;--gutter:max(clamp(16px,4vw,48px),env(safe-area-inset-left,0px),env(safe-area-inset-right,0px));--r:24px;
  --ease:cubic-bezier(.16,1,.3,1);--ease-io:cubic-bezier(.65,0,.35,1);
  color-scheme:dark;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scrollbar-width:thin;scrollbar-color:#1d3a2b var(--bg)}
body{font-family:var(--font);font-weight:400;font-size:17px;line-height:1.65;color:var(--ink);background:var(--bg);overflow-x:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
body::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:url(/assets/img/grain.png);opacity:.9}
::selection{background:var(--mint);color:var(--mint-ink)}
::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:var(--bg)}::-webkit-scrollbar-thumb{background:#1d3a2b;border-radius:10px;border:2px solid var(--bg)}
img,picture,svg{display:block;max-width:100%}
.sr{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--mint);outline-offset:3px;border-radius:4px}
.skip{position:fixed;left:16px;top:-80px;z-index:100;background:var(--mint);color:var(--mint-ink);padding:10px 16px;border-radius:999px;font-weight:600;font-size:13px;text-decoration:none;transition:top .4s var(--ease)}
.skip:focus{top:16px}
:is(a,button,input,select,textarea,summary){scroll-margin-top:96px}
@media (max-width:700px){:is(a,button,input,select,textarea,summary){scroll-margin-top:80px;scroll-margin-bottom:84px}}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter)}
.wrap--narrow{max-width:900px}

/* ---------- типографика ---------- */
.kicker{font-weight:500;font-size:12px;letter-spacing:.32em;text-transform:uppercase;color:var(--mint);padding-left:.32em}
.kicker__n{color:var(--muted);letter-spacing:.14em}
.kicker__rule{display:inline-block;vertical-align:middle;width:44px;height:1px;margin:0 16px 0 10px;background:var(--mint);opacity:.7;transform-origin:left center}
.h{font-family:var(--disp);font-weight:300;font-size:clamp(52px,7vw,112px);line-height:.95;letter-spacing:.04em;text-transform:uppercase;margin-top:18px;text-wrap:balance}
.u{text-transform:none}
.h .w{display:inline-block;overflow:hidden;vertical-align:top;padding:.18em 0 .14em;margin:-.18em 0 -.14em}
.h .w>span{display:inline-block}
.h--page{font-size:clamp(44px,6vw,84px)}
h3{font-family:var(--disp);font-weight:400;font-size:clamp(26px,2.4vw,34px);line-height:1;letter-spacing:.03em;text-transform:uppercase}
.sec__text{margin-top:22px;max-width:620px;color:#cfe6da;font-weight:300;font-size:clamp(18px,1.45vw,21px);line-height:1.55;text-wrap:pretty}
.sec__head{margin-bottom:clamp(40px,5.5vw,72px)}
.link{position:relative;font-weight:500;font-size:12px;letter-spacing:.24em;text-transform:uppercase;text-decoration:none;padding-bottom:6px;color:#fff;transition:color .4s var(--ease)}
.link::after{content:"";position:absolute;left:0;right:.24em;bottom:0;height:1px;background:rgba(255,255,255,.4);transform-origin:right;transition:transform .7s var(--ease),background-color .4s}
.link:hover{color:var(--mint)}
.link:hover::after{background:var(--mint);animation:underline .9s var(--ease)}
@keyframes underline{0%{transform:scaleX(1);transform-origin:right}45%{transform:scaleX(0);transform-origin:right}55%{transform:scaleX(0);transform-origin:left}100%{transform:scaleX(1);transform-origin:left}}

/* ---------- кнопки ---------- */
.pill{position:relative;isolation:isolate;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:999px;border:0;cursor:pointer;font-weight:600;font-size:13px;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;white-space:nowrap;transition:box-shadow .6s var(--ease),background-color .4s,color .4s,border-color .4s}
.pill>span{position:relative;display:inline-block}
.pill--mint{padding:20px 38px;background:var(--mint);color:var(--mint-ink);box-shadow:0 0 50px rgba(141,255,209,.28),0 18px 40px rgba(0,0,0,.4)}
.pill--mint::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.7) 50%,transparent 70%);transform:translate3d(-120%,0,0);transition:transform 1.1s var(--ease)}
.pill--ghost{padding:13px 24px;color:#fff;border:1px solid rgba(255,255,255,.4);background:rgba(3,18,11,.35)}
@media (hover:hover){
  .pill--mint:hover{box-shadow:0 0 80px rgba(141,255,209,.45),0 24px 48px rgba(0,0,0,.45)}
  .pill--mint:hover::after{transform:translate3d(120%,0,0)}
  .pill--ghost:hover{border-color:var(--mint);color:var(--mint)}
}
[data-magnetic]{will-change:transform}
.glass{position:relative;isolation:isolate;background:linear-gradient(180deg,rgba(255,255,255,.056),rgba(255,255,255,.022));border:1px solid var(--line);border-radius:var(--r);box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 40px 80px -40px rgba(0,0,0,.55);transition:border-color .6s var(--ease)}
.glass::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;pointer-events:none;background:radial-gradient(460px circle at var(--x,50%) var(--y,0%),rgba(141,255,209,.1),transparent 62%);opacity:0;transition:opacity .7s var(--ease)}
@media (hover:hover){.glass:hover{border-color:rgba(141,255,209,.24)}.glass:hover::before{opacity:1}}

/* ---------- шапка ---------- */
.top{position:fixed;inset:0 0 auto 0;z-index:30;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:24px var(--gutter);transition:transform .9s var(--ease),background-color .6s,padding .6s var(--ease),box-shadow .6s}
.top.is-scrolled{background:rgba(3,18,11,.93);padding-top:13px;padding-bottom:13px;box-shadow:0 1px 0 var(--line2)}
.top.is-hidden{transform:translate3d(0,-110%,0)}
.top:not(.is-scrolled) .logo{text-shadow:0 0 18px rgba(3,18,11,.85),0 0 3px rgba(3,18,11,.7)}
.nav{display:flex;gap:clamp(18px,2.6vw,36px)}
.nav a{position:relative;font-weight:500;font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:var(--muted);text-decoration:none;padding:6px 0;transition:color .4s var(--ease)}
.nav a::after{content:"";position:absolute;left:0;right:.24em;bottom:0;height:1px;background:var(--mint);transform:scaleX(0);transform-origin:right;transition:transform .7s var(--ease)}
.nav a:hover{color:#fff}
.nav a:hover::after{transform:scaleX(1);transform-origin:left}
.burger{display:none;position:relative;width:44px;height:44px;border:1px solid var(--line);border-radius:50%;background:rgba(3,18,11,.4);cursor:pointer}
.burger span:not(.burger__label){position:absolute;left:13px;right:13px;height:1.5px;background:#fff;transition:transform .6s var(--ease),top .6s var(--ease)}
.burger span:nth-child(1){top:17px}.burger span:nth-child(2){top:25px}
.burger[aria-expanded="true"] span:nth-child(1){top:21px;transform:rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){top:21px;transform:rotate(-45deg)}
.burger__label{position:absolute;left:-9999px}
.menu[hidden]{display:none}
.menu{position:fixed;inset:0;z-index:45;background:var(--bg);display:flex;align-items:flex-start;justify-content:center;text-align:center;overflow-y:auto;overscroll-behavior:contain;padding:96px 16px 32px;opacity:0;transition:opacity .55s var(--ease)}
.menu.is-open{opacity:1}
.menu nav{display:flex;flex-direction:column;gap:22px;align-items:center;margin:auto}
@media (max-height:760px){.menu nav{gap:6px}.menu a:not(.pill){font-size:36px;line-height:1.5}.menu .pill{margin-top:10px}}
.menu nav>*{opacity:0;transform:translate3d(0,26px,0);transition:opacity .7s var(--ease),transform .9s var(--ease);transition-delay:calc(var(--i,0) * 55ms + 90ms)}
.menu.is-open nav>*{opacity:1;transform:none}
.menu a:not(.pill){font-family:var(--disp);font-weight:300;font-size:44px;letter-spacing:.08em;text-transform:uppercase;color:#fff;text-decoration:none}
.menu .pill{margin-top:18px}
body.menu-open{overflow:hidden}
body.menu-open .top{z-index:50;transform:none}

/* ---------- первый экран ---------- */
.hero{position:relative;height:150svh;background:var(--bg)}
.hero__pin{position:sticky;top:0;height:100svh;overflow:hidden}
.leaf{position:absolute;inset:0;pointer-events:none;will-change:transform,opacity}
.leaf .layer{width:100%;height:100%;object-fit:cover;object-position:center}
.leaf--back{transform:scale(1.06)}
.hero__veil{position:absolute;inset:0;z-index:2;pointer-events:none;background:var(--bg);opacity:0;will-change:opacity}
.shade{position:absolute;inset:0;pointer-events:none;background:
  radial-gradient(80% 70% at 50% 45%,rgba(3,18,11,0) 30%,rgba(3,18,11,.55) 100%),
  linear-gradient(180deg,rgba(3,18,11,.5) 0%,rgba(3,18,11,0) 30%,rgba(3,18,11,0) 70%,rgba(3,18,11,.85) 100%)}
.glow{position:absolute;border-radius:50%;pointer-events:none}
.glow--1{width:60vw;height:60vw;right:-14vw;top:-20vw;background:radial-gradient(circle,rgba(141,255,209,.22),rgba(141,255,209,.06) 35%,rgba(141,255,209,0) 65%)}
.glow--2{width:48vw;height:48vw;left:-18vw;bottom:-18vw;background:radial-gradient(circle,rgba(125,196,255,.14),rgba(125,196,255,.04) 35%,rgba(125,196,255,0) 65%)}
.hero__light{position:absolute;left:0;top:0;width:70vmax;height:70vmax;margin:-35vmax 0 0 -35vmax;border-radius:50%;pointer-events:none;background:radial-gradient(circle,rgba(141,255,209,.13),rgba(141,255,209,.04) 30%,rgba(141,255,209,0) 60%);opacity:0;transition:opacity 1.6s var(--ease);will-change:transform}
.hero.has-light .hero__light{opacity:1}
.leaf--f2{z-index:2}
.hero__copy{position:relative;z-index:3;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:110px 24px 150px;will-change:transform,opacity}
.display{display:block;font-family:var(--disp);font-weight:200;font-size:clamp(90px,min(14.5vw,30svh),300px);line-height:.86;letter-spacing:.1em;padding-left:.1em;text-transform:uppercase;color:var(--ink);text-shadow:0 0 80px rgba(141,255,209,.25),0 10px 60px rgba(0,0,0,.5)}
.display .ch{display:inline-block}
.display .dw{display:inline-block;white-space:nowrap}
.display .dw--2{color:var(--mint);text-shadow:0 0 90px rgba(141,255,209,.5),0 10px 60px rgba(0,0,0,.5)}
@media (max-width:700px),(orientation:portrait) and (max-width:1100px){.display .dw{display:block}.display{font-size:min(26vw,22svh)}}
.hero__slogan{display:block;margin-top:18px;font-family:var(--disp);font-weight:300;font-size:clamp(22px,2.3vw,36px);line-height:1.1;letter-spacing:.26em;padding-left:.26em;text-transform:uppercase;color:var(--mint);text-shadow:0 0 30px rgba(141,255,209,.35)}
h1{font-weight:inherit;font-size:inherit;line-height:inherit}
.kicker--h1{display:block;margin-top:16px;font-size:clamp(12px,1.05vw,15px);letter-spacing:.42em;padding-left:.42em;color:#fff}
.kseg{white-space:nowrap}
@media (max-width:700px){.kdot--last{display:block;height:6px;font-size:0}}
@media (max-width:374px){.kdot{display:block;height:6px;font-size:0}}
.hero__lead{margin-top:28px;font-weight:300;font-size:clamp(16px,1.3vw,19px);line-height:1.65;color:var(--muted);max-width:620px;text-wrap:balance}
.hero__lead b{font-weight:500;color:#fff}
.cta{display:flex;align-items:center;gap:32px;margin-top:40px;flex-wrap:wrap;justify-content:center}
.hero__foot{position:absolute;left:var(--gutter);right:var(--gutter);bottom:30px;z-index:4;display:flex;justify-content:center;font-weight:500;font-size:11px;letter-spacing:.26em;text-transform:uppercase;color:var(--muted)}
.hero__foot span{padding:0 28px;border-left:1px solid rgba(255,255,255,.22)}
.hero__foot span:first-child{border:0}
.mouse{position:absolute;left:50%;bottom:84px;width:22px;height:36px;margin-left:-11px;border:1.5px solid rgba(255,255,255,.5);border-radius:12px;z-index:4}
.mouse::after{content:"";position:absolute;left:50%;top:7px;width:3px;height:7px;margin-left:-1.5px;background:#fff;border-radius:2px}
.has-motion .mouse::after{animation:dot 2.2s var(--ease-io) infinite}
@keyframes dot{0%{transform:translate3d(0,0,0);opacity:1}60%{transform:translate3d(0,11px,0);opacity:0}61%{transform:translate3d(0,0,0);opacity:0}100%{opacity:1}}

/* вступление первого экрана: буквы поднимаются по одной, потом строка, текст и кнопка, листья оседают (в JS) */
.has-motion:not(.is-ready) .display .ch,
.has-motion:not(.is-ready) :is(.hero__slogan,.kicker--h1,.hero__lead,.cta,.hero__foot,.mouse,.top,.leaf--f1,.leaf--f2){opacity:0}
.has-motion.is-ready .display .ch{animation:rise 1.7s var(--ease) backwards;animation-delay:calc(.15s + var(--i) * 85ms)}
.has-motion.is-ready .hero__slogan{animation:fadeUp 1.3s var(--ease) .6s backwards}
.has-motion.is-ready .kicker--h1{animation:fadeUp 1.3s var(--ease) .75s backwards}
.has-motion.is-ready .hero__lead{animation:fadeUp 1.3s var(--ease) .85s backwards}
.has-motion.is-ready .cta{animation:fadeUp 1.3s var(--ease) 1s backwards}
.has-motion.is-ready :is(.hero__foot,.mouse){animation:fadeIn 1.6s var(--ease) 1.3s backwards}
.has-motion.is-ready .top{animation:fadeIn 1.4s var(--ease) .45s backwards}
/* старт с .02, а не с 0: браузер засчитывает буквы показанными с начала проявления (LCP), а не с конца; глазу разницы нет */
@keyframes rise{from{opacity:.02;transform:translate3d(0,.3em,0) scale(1.06,1.12)}}
@keyframes fadeUp{from{opacity:0;transform:translate3d(0,26px,0)}}
@keyframes fadeIn{from{opacity:0}}
.has-motion .leaf--f1 .layer{animation:sway 17s var(--ease-io) infinite alternate;will-change:transform}
.has-motion .leaf--f2 .layer{animation:sway2 23s var(--ease-io) infinite alternate;will-change:transform}
.hero.is-off .leaf .layer,.hero.is-off .mouse::after,.marquee.is-off .marquee__track{animation-play-state:paused}
@keyframes sway{to{transform:translate3d(-9px,-11px,0) rotate(.35deg) scale(1.012)}}
@keyframes sway2{to{transform:translate3d(11px,7px,0) rotate(-.3deg) scale(1.01)}}

/* ---------- бегущая строка ---------- */
.marquee{position:relative;overflow:hidden;padding:clamp(30px,4.2vw,60px) 0;border-top:1px solid var(--line2);border-bottom:1px solid var(--line2)}
.marquee::before,.marquee::after{content:"";position:absolute;top:0;bottom:0;width:12vw;z-index:1;pointer-events:none}
.marquee::before{left:0;background:linear-gradient(90deg,var(--bg),rgba(3,18,11,0))}
.marquee::after{right:0;background:linear-gradient(270deg,var(--bg),rgba(3,18,11,0))}
.marquee__track{display:flex;width:max-content}
.has-motion .marquee__track{animation:marquee 80s linear infinite;will-change:transform}
.marquee__run{display:flex;align-items:center;flex:none}
.marquee__item{font-family:var(--disp);font-weight:200;font-size:clamp(48px,7.2vw,118px);line-height:1;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;color:transparent;-webkit-text-stroke:1px rgba(242,255,248,.36)}
.marquee__item:nth-child(4n+1){color:var(--ink);-webkit-text-stroke:0}
.marquee__pause{position:absolute;right:max(12px,calc(var(--gutter) - 8px));bottom:10px;z-index:2;width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:rgba(3,18,11,.7);cursor:pointer;opacity:.55;transition:opacity .5s var(--ease),border-color .5s var(--ease)}
.marquee__pause:hover,.marquee__pause:focus-visible{opacity:1;border-color:var(--mint)}
.marquee__pause-i{position:absolute;left:50%;top:50%;width:10px;height:12px;margin:-6px 0 0 -5px;border-left:3px solid #fff;border-right:3px solid #fff}
.marquee__pause[aria-pressed="true"] .marquee__pause-i{width:0;height:0;margin:-7px 0 0 -4px;border-style:solid;border-width:7px 0 7px 12px;border-color:transparent transparent transparent #fff}
html:not(.has-motion) .marquee__pause{display:none}
@media (hover:hover){.has-motion .marquee:hover .marquee__track{animation-play-state:paused}}
.motion-paused .marquee__track,.motion-paused .leaf .layer,.motion-paused .mouse::after{animation-play-state:paused!important}
.marquee__star{font-size:clamp(16px,1.8vw,26px);color:var(--mint);margin:0 clamp(22px,3.2vw,52px)}
@keyframes marquee{to{transform:translate3d(-50%,0,0)}}

/* ---------- секции ---------- */
.sec{position:relative;padding:clamp(76px,9vw,140px) 0}
.sec--intro{padding:clamp(64px,8vw,120px) 0 0}
.intro{font-size:clamp(22px,2.3vw,34px);font-weight:300;line-height:1.45;max-width:980px;color:var(--ink);letter-spacing:-.005em}
.intro__cov{margin-top:clamp(18px,2vw,28px);max-width:760px}                 /* округа Омска (site.json → coverage), пока null — нет */
.has-motion .intro .iw{color:rgba(242,255,248,.52);transition:color .6s var(--ease)}
.has-motion .intro .iw.on{color:var(--ink)}
.intro .iw:first-child{color:var(--mint)}

/* до и после */
.ba{padding:clamp(16px,2vw,24px)}
.ba__tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}
.ba__tabs button{padding:11px 18px;border-radius:999px;border:1px solid var(--line);background:transparent;color:var(--muted);font-weight:500;font-size:12px;letter-spacing:.2em;text-transform:uppercase;cursor:pointer;transition:color .5s var(--ease),background-color .5s var(--ease),border-color .5s var(--ease)}
.ba__tabs button:hover{color:#fff;border-color:rgba(255,255,255,.4)}
.ba__tabs button[aria-selected="true"]{background:var(--mint);color:var(--mint-ink);border-color:var(--mint)}
.js .ba__scenes{display:grid}
.js .ba__scene{grid-area:1/1;transition:opacity .9s var(--ease),visibility 0s linear .9s}
.js .ba__scene:not(.is-active){opacity:0;visibility:hidden}
.js .ba__scene.is-active{transition:opacity .9s var(--ease),visibility 0s}
html:not(.js) .ba__tabs{display:none}
html:not(.js) .ba__scene+.ba__scene,html:not(.js) .ba__range{display:none}
.ba__frame{position:relative;aspect-ratio:3/2;overflow:hidden;border-radius:18px;background:#061a10;user-select:none;-webkit-user-select:none;touch-action:pan-y;--pos:50}
.ba__frame picture,.ba__frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;-webkit-user-drag:none}
.has-motion .ba__frame img{transform:scale(1.045);transition:transform 1.8s var(--ease),opacity 1s var(--ease)}
.has-motion .ba__scene.is-active .ba__frame img{transform:scale(1)}
/* «до» — окно, которое едет влево, а картинка внутри едет вправо на столько же: без clip-path и без left,
   только два встречных transform (в процентах от ширины кадра) — чистая композиция, без перерисовки */
.ba__before{position:absolute;inset:0;overflow:hidden;transform:translate3d(calc((var(--pos) - 100) * 1%),0,0);will-change:transform}
.ba__before>picture{transform:translate3d(calc((100 - var(--pos)) * 1%),0,0);will-change:transform}
.ba__divider{position:absolute;inset:0;pointer-events:none;transform:translate3d(calc(var(--pos) * 1%),0,0);will-change:transform}
.ba__divider::before{content:"";position:absolute;top:0;bottom:0;left:-1px;width:2px;background:#fff;box-shadow:0 0 24px rgba(0,0,0,.6)}
.ba__handle{position:absolute;top:50%;left:0;width:48px;height:48px;border-radius:50%;background:var(--mint);transform:translate(-50%,-50%);box-shadow:0 0 30px rgba(141,255,209,.45),0 10px 30px rgba(0,0,0,.5);transition:transform .5s var(--ease)}
.ba__frame:active .ba__handle{transform:translate(-50%,-50%) scale(.9)}
.ba__handle::before,.ba__handle::after{content:"";position:absolute;top:50%;width:8px;height:8px;border-top:2px solid var(--mint-ink);border-left:2px solid var(--mint-ink)}
.ba__handle::before{left:14px;transform:translateY(-50%) rotate(-45deg)}
.ba__handle::after{right:14px;transform:translateY(-50%) rotate(135deg)}
.ba__label{position:absolute;top:14px;padding:7px 12px;border-radius:999px;background:rgba(3,18,11,.62);border:1px solid rgba(255,255,255,.18);font-weight:600;font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:#fff;pointer-events:none}
.ba__label--before{left:14px;opacity:clamp(0,(var(--pos) - 12) / 8,1)}
.ba__label--after{right:14px;opacity:clamp(0,(88 - var(--pos)) / 8,1)}
.ba__range{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize;-webkit-appearance:none;appearance:none;background:transparent;z-index:2}
.ba__frame:has(.ba__range:focus-visible){outline:2px solid var(--mint);outline-offset:3px}
.ba__caption{margin-top:14px;font-size:15px;color:var(--muted)}
.ba__credit{margin-top:10px;font-size:12px;color:var(--muted);opacity:.8}

/* цена */
.price__grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(20px,3vw,40px);align-items:start}
.calc{padding:clamp(24px,3vw,40px)}
.calc__row{display:grid;grid-template-columns:1fr auto;gap:10px 16px;align-items:center;margin-bottom:28px}
.calc__row label{font-weight:500;font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:var(--muted)}
.calc__val{font-family:var(--disp);font-size:36px;font-weight:300;letter-spacing:.04em;text-align:right;font-variant-numeric:tabular-nums}
.calc__row input[type=range]{grid-column:1/-1;width:100%;height:34px;cursor:pointer;-webkit-appearance:none;appearance:none;background:transparent;--fill:30%}
.calc__row input[type=range]::-webkit-slider-runnable-track{height:2px;border-radius:2px;background:linear-gradient(90deg,var(--mint) var(--fill),rgba(255,255,255,.16) var(--fill))}
.calc__row input[type=range]::-moz-range-track{height:2px;border-radius:2px;background:rgba(255,255,255,.16)}
.calc__row input[type=range]::-moz-range-progress{height:2px;border-radius:2px;background:var(--mint)}
.calc__row input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;margin-top:-10px;border-radius:50%;background:var(--mint);border:0;box-shadow:0 0 0 7px rgba(141,255,209,.12),0 0 26px rgba(141,255,209,.5);transition:box-shadow .5s var(--ease),transform .5s var(--ease)}
.calc__row input[type=range]::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:var(--mint);border:0;box-shadow:0 0 0 7px rgba(141,255,209,.12),0 0 26px rgba(141,255,209,.5)}
.calc__row input[type=range]:focus-visible::-moz-range-thumb{box-shadow:0 0 0 3px var(--bg),0 0 0 5px var(--mint),0 0 26px rgba(141,255,209,.5)}
.calc__row input[type=range]:active::-webkit-slider-thumb{transform:scale(1.15);box-shadow:0 0 0 11px rgba(141,255,209,.16),0 0 34px rgba(141,255,209,.6)}
.calc__row input[type=range]:focus-visible{outline:none}
.calc__row input[type=range]:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 3px var(--bg),0 0 0 5px var(--mint),0 0 26px rgba(141,255,209,.5)}
select,input[type=text],input[type=tel],input[type=number],input[type=date],textarea{width:100%;padding:15px 16px;background:rgba(3,18,11,.55);border:1px solid rgba(141,255,209,.42);border-radius:14px;color:#fff;font-weight:400;font-size:16px;transition:border-color .5s var(--ease),box-shadow .5s var(--ease)}
select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--mint) 50%),linear-gradient(135deg,var(--mint) 50%,transparent 50%);background-position:calc(100% - 22px) 50%,calc(100% - 16px) 50%;background-size:6px 6px;background-repeat:no-repeat;padding-right:44px}
select option{background:var(--card);color:#fff}
select:focus,input:focus,textarea:focus{outline:none;border-color:var(--mint);box-shadow:0 0 0 4px rgba(141,255,209,.1)}
:is(select,input[type=text],input[type=tel],input[type=number],input[type=date],textarea):focus-visible{outline:2px solid var(--mint);outline-offset:2px}
input[type=date]::-webkit-calendar-picker-indicator{opacity:.7}
.check{display:flex;align-items:center;gap:12px;cursor:pointer;font-weight:400;font-size:15px;color:var(--muted)}
.check input{width:20px;height:20px;accent-color:var(--mint);flex:none}
.calc__result{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding-top:24px;border-top:1px solid var(--line);flex-wrap:wrap}
.calc__label{font-weight:500;font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:var(--muted)}
.calc__sum{margin-left:auto;font-family:var(--disp);font-weight:300;font-size:clamp(58px,6vw,88px);line-height:1;letter-spacing:.03em;color:var(--mint);font-variant-numeric:tabular-nums;text-shadow:0 0 40px rgba(141,255,209,.25)}
.calc__note{margin-top:16px;font-size:14px;color:var(--muted)}
.examples{padding-top:8px}
.examples__table{width:100%;margin-top:18px;border-collapse:collapse;font-size:15px}
.examples__table th{text-align:left;font-weight:500;font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--muted);padding:0 0 12px;border-bottom:1px solid var(--line)}
.examples__table td{padding:16px 12px 16px 0;border-bottom:1px solid var(--line2);vertical-align:baseline;color:var(--muted)}
.examples__table td:first-child{color:#fff;font-weight:500}
.t-num{font-family:var(--disp);font-size:28px;font-weight:300;letter-spacing:.03em;color:#fff;white-space:nowrap}
.examples__note{margin-top:14px;font-size:13px;color:var(--muted)}

/* списки: галочки (состав уборок), черточки («Чего не делаем», доплаты) */
.ticks{list-style:none}
.ticks li{position:relative;padding:9px 0 9px 28px;border-top:1px solid var(--line2);font-size:15px;color:var(--muted)}
.ticks li:first-child{border-top:0}
.ticks li::before{content:"";position:absolute;left:4px;top:14px;width:7px;height:12px;border-right:1.5px solid var(--mint);border-bottom:1.5px solid var(--mint);transform:rotate(45deg)}
.limits{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(20px,3vw,40px);margin-top:clamp(40px,5vw,64px);padding-top:clamp(28px,4vw,44px);border-top:1px solid var(--line)}
.limits h3{color:#fff}
.dashes{list-style:none;margin-top:16px}
.dashes li{position:relative;padding:6px 0 6px 26px;color:var(--muted);font-size:15px}
.dashes li::before{content:"";position:absolute;left:0;top:18px;width:14px;height:1px;background:var(--mint)}

/* шаги */
.steps{list-style:none;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:20px}
.step{position:relative;padding:28px 0 0}
.step::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:var(--line);transform-origin:left center}
.step::after{content:"";position:absolute;left:0;top:-3px;width:7px;height:7px;border-radius:50%;background:var(--mint);box-shadow:0 0 14px rgba(141,255,209,.7)}
.step__n{display:block;font-family:var(--disp);font-weight:200;font-size:76px;line-height:.9;color:var(--mint);margin-bottom:16px;letter-spacing:.04em}
.step h3{font-size:24px}
.step p{margin-top:10px;font-size:15px;color:var(--muted)}

/* абонемент */
.sub{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(24px,4vw,56px);padding:clamp(30px,4.5vw,64px);align-items:center;overflow:hidden}
.sub::after{content:"";position:absolute;right:-20%;top:-60%;width:70%;height:180%;z-index:-2;pointer-events:none;background:radial-gradient(closest-side,rgba(141,255,209,.12),rgba(141,255,209,0))}
.sub .sec__head{margin-bottom:0}
.sub .h{font-size:clamp(40px,5vw,74px)}
.sub .ticks{margin-bottom:28px}
.sub .ticks li{font-size:16px;color:#fff}
.sub .pill--mint{white-space:normal;text-align:center;line-height:1.3}

/* вопросы */
.faqs{border-top:1px solid var(--line)}
.faq{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:24px 0;font-weight:500;font-size:clamp(17px,1.4vw,20px);color:#fff;transition:color .5s var(--ease)}
.faq summary::-webkit-details-marker{display:none}
@media (hover:hover){.faq summary:hover{color:var(--mint)}}
.faq__icon{position:relative;flex:none;width:14px;height:14px}
.faq__icon::before,.faq__icon::after{content:"";position:absolute;left:0;top:50%;width:14px;height:1.5px;margin-top:-.75px;background:var(--mint);transition:transform .7s var(--ease)}
.faq__icon::after{transform:rotate(90deg)}
.faq[open] .faq__icon::after{transform:rotate(0deg)}
.faq[open] .faq__icon::before{transform:rotate(180deg)}
.faq__a{overflow:hidden}
.faq__in{padding:0 0 26px;max-width:760px;color:var(--muted)}

/* форма */
.sec--form{overflow:clip}
.sec--form::before{content:"";position:absolute;inset:0;background:url(/assets/img/r/leafbackb-wide-1600.webp) center/cover no-repeat;opacity:.7}
.sec--form::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(3,18,11,0) 0%,rgba(3,18,11,.5) 40%,rgba(3,18,11,.5) 70%,rgba(3,18,11,0) 100%)}
.sec--form::before{-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 28%,#000 72%,transparent 100%);mask-image:linear-gradient(180deg,transparent 0,#000 28%,#000 72%,transparent 100%)}
.sec--form .wrap{position:relative;z-index:1}
.lead__note{margin:22px 0 0;padding-left:14px;border-left:1px solid rgba(141,255,209,.45);font-size:14px;color:var(--muted);max-width:460px}
.lead{padding:clamp(24px,3vw,40px);background:linear-gradient(180deg,rgba(6,26,16,.86),rgba(3,18,11,.9))}
.f2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 16px}
.field{display:block;margin-bottom:18px}
.field>span,.field__l{display:block;font-weight:500;font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--muted);margin-bottom:9px}
.field em{font-style:normal;letter-spacing:0;text-transform:none;opacity:.7}
.field small{display:block;margin-top:7px;font-size:12px;color:var(--muted)}
.field.is-bad input,.field.is-bad select{border-color:#ff8a8a;box-shadow:0 0 0 4px rgba(255,138,138,.12)}
.field .field__err{display:block;margin-top:7px;font-size:14px;color:#ffb3b3}
.field .field__err:empty{display:none}
.consent input[aria-invalid="true"]{border-color:#ff8a8a;box-shadow:0 0 0 4px rgba(255,138,138,.12)}
textarea{resize:vertical;min-height:96px}
.hp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.consent{margin:8px 0 24px;align-items:flex-start}
.consent span{font-size:14px}
.consent a{color:#fff}
.lead__policy{margin:-12px 0 22px 34px;font-size:13px;color:var(--muted)}
.lead__policy a{color:#fff}
.lead__submit{width:100%}
.lead__submit[disabled]{opacity:.6;cursor:default}
.lead__msg{margin-top:16px;font-size:15px;color:#fff;text-align:center}
.lead__msg:empty{margin:0}
.lead__noscript{margin-top:18px;padding:18px 20px;border:1px solid var(--line);border-radius:16px;color:#fff}
.lead__msg.is-fail{color:#ffb3b3}

/* подвал */
.foot{position:relative;padding:clamp(56px,6vw,88px) 0 0;border-top:1px solid var(--line);overflow:hidden}
.foot__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr) minmax(0,1fr);gap:32px;font-size:13px;color:var(--muted)}
.foot__muted{margin-top:10px}
.foot__legal p{margin-bottom:6px;overflow-wrap:break-word}
.foot__links{display:flex;flex-direction:column;gap:10px}
.foot__links a{position:relative;color:#fff;text-decoration:none;align-self:flex-start;padding-bottom:3px}
.foot__links a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--line);transition:background-color .5s var(--ease)}
.foot__links a:hover::after{background:var(--mint)}
.foot__cookie{align-self:flex-start;padding:0 0 3px;border:0;border-bottom:1px solid var(--line);background:none;color:#fff;font-size:inherit;cursor:pointer;transition:border-color .5s var(--ease)}
.foot__cookie:hover{border-color:var(--mint)}
.foot__phone a{font-family:var(--disp);font-size:30px;color:#fff;text-decoration:none;letter-spacing:.04em}
.foot__mark{height:clamp(50px,11vw,190px);margin-top:clamp(40px,6vw,80px);overflow:hidden;pointer-events:none}

/* cookie */
.cookie[hidden]{display:none}
.cookie{position:fixed;left:16px;bottom:16px;z-index:40;max-width:420px;padding:14px 16px;border-radius:16px;font-size:12.5px;line-height:1.5;background:rgba(6,26,16,.97);border:1px solid var(--line);color:var(--muted);box-shadow:0 20px 60px rgba(0,0,0,.5);opacity:0;transform:translate3d(0,24px,0);transition:opacity .9s var(--ease),transform 1s var(--ease)}
.cookie.is-shown{opacity:1;transform:none}
.cookie a{color:#fff}
.cookie__btns{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}
.cookie .pill{padding:9px 14px;font-size:10.5px;letter-spacing:.1em;box-shadow:none}

/* страницы */
.page{padding:150px 0 clamp(70px,8vw,130px)}
.prose{margin-top:34px;max-width:800px;color:var(--muted);overflow-wrap:break-word}   /* длинная почта или реквизиты не распирают 320 px */
.prose h2{font-family:var(--disp);font-weight:400;font-size:30px;letter-spacing:.03em;text-transform:uppercase;color:#fff;margin:38px 0 12px}
.prose p{margin-bottom:12px}
.prose ul{margin:0 0 14px;padding-left:1.2em}
.prose li{margin-bottom:6px}
.prose li::marker{color:var(--mint)}
.prose a{color:#fff}
.prose__date{margin-top:34px;font-size:14px;opacity:.8}
.page--404{min-height:100svh;display:flex;align-items:center}
.display--404{font-family:var(--disp);font-weight:200;font-size:clamp(140px,30vw,360px);line-height:.85;letter-spacing:.06em;color:var(--mint);text-shadow:0 0 80px rgba(141,255,209,.3)}
.page--404 .pill{margin-top:22px}
.display--404{padding-left:0}
.page--404 .wrap{width:100%}

/* ---------- появление при прокрутке ----------
   Крупные блоки (карточки, форма, калькулятор) целиком не анимируются: браузеру пришлось бы в момент старта
   заново растрировать большой слой, и прокрутка запиналась бы. Оживают их лёгкие части — заголовки по словам,
   номера, линии, пункты списков лесенкой. Замер: src/perf_check.mjs --gpu --novsync. */
.has-motion .reveal :is(.kicker,.sec__text,.price__rate,h3,.step__n,.promise p,.step p,.ticks li,.dashes li,.examples__table tr,.pricelist__extras li,.svc__tk,.svc__tn,.svc__tw,.svc__tnum,.calc__row,.calc__result,.team__note,.ba__tabs,.ba__caption,.field,.consent,.lead__submit,.faq summary > span),
.has-motion .reveal:is(.team__note,.lead__note,.intro,.svc__unsure){opacity:0;transform:translate3d(0,22px,0);transition:opacity .85s var(--ease),transform 1s var(--ease);transition-delay:calc(var(--d,0ms) + var(--k,0) * 30ms)}
.has-motion .reveal.is-in :is(.kicker,.sec__text,.price__rate,h3,.step__n,.promise p,.step p,.ticks li,.dashes li,.examples__table tr,.pricelist__extras li,.svc__tk,.svc__tn,.svc__tw,.svc__tnum,.calc__row,.calc__result,.team__note,.ba__tabs,.ba__caption,.field,.consent,.lead__submit,.faq summary > span),
.has-motion .reveal.is-in:is(.team__note,.lead__note,.intro,.svc__unsure){opacity:1;transform:none}
.has-motion .sec__head .sec__text{transition-delay:calc(var(--d,0ms) + 350ms)}
.has-motion .sec__head .kicker__rule{transform:scaleX(0);transition:transform 1.4s var(--ease) .2s}
.has-motion .reveal.is-in .kicker__rule{transform:scaleX(1)}
.has-motion .reveal .h .w>span{transform:translate3d(0,112%,0);transition:transform 1.25s var(--ease);transition-delay:calc(var(--i) * 70ms + 120ms)}
.has-motion .reveal.is-in .h .w>span{transform:none}
.has-motion .step.reveal::before{transform:scaleX(0);transition:transform 1.6s var(--ease);transition-delay:var(--d,0ms)}
.has-motion .step.reveal.is-in::before{transform:scaleX(1)}
.has-motion .glass.reveal{border-color:rgba(255,255,255,.04);transition:border-color 1.6s var(--ease)}
.has-motion .glass.reveal.is-in{border-color:var(--line)}
@media (hover:hover){.has-motion .glass.reveal.is-in:hover{border-color:rgba(141,255,209,.24);transition-duration:.6s}}
.js img.fade{opacity:0;transition:opacity 1.1s var(--ease),transform 1.8s var(--ease)}
.js img.fade.is-loaded{opacity:1}

/* ---------- адаптив ---------- */
@media (max-width:1100px){
  .steps{grid-template-columns:repeat(3,minmax(0,1fr))}
  .foot__grid{grid-template-columns:1fr 1fr}
}
@media (max-width:900px){
  .nav,.top__cta{display:none}
  .burger{display:block}
  .price__grid,.sub,.limits{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr 1fr}
}
@media (max-width:700px){
  body{font-size:16px}
  .top{padding:14px 16px}
  .top.is-scrolled{padding-top:10px;padding-bottom:10px}
  .logo{font-size:28px}
  .display{letter-spacing:.08em}
  .display{font-size:min(26vw,17svh)}
  .hero__slogan{font-size:20px;margin-top:14px;letter-spacing:.2em;padding-left:.2em}
  .kicker--h1{font-size:11px;letter-spacing:.3em}
  .hero__copy{padding:100px 16px 140px;justify-content:flex-start}
  .hero__lead{font-size:15px;margin-top:20px}
  .cta{margin-top:28px;flex-direction:column;gap:18px;width:100%}
  .cta .pill--mint{width:100%;padding:18px}
  .hero__foot{flex-direction:column;align-items:center;gap:8px;font-size:10px;letter-spacing:.2em;bottom:22px}
  .hero__foot span{border:0;padding:0}
  .hero__foot span:nth-child(n+3){display:none}
  .mouse{display:none}
  .glow--1{width:110vw;height:110vw;right:-40vw;top:-30vw}
  .marquee{padding:24px 0}
  .marquee__pause{top:50%;bottom:auto;right:6px;width:36px;height:36px;margin-top:-18px;background:var(--bg);opacity:.85}
  .kicker__rule{width:28px;margin:0 12px 0 8px}
  .steps,.f2,.foot__grid,.price__grid,.sub,.limits{grid-template-columns:minmax(0,1fr)}
  .sub .pill--mint{width:100%}
  .examples__table td{padding-right:8px}
  .t-num{font-size:24px}
  .cookie{left:10px;right:10px;bottom:10px;max-width:none;padding:11px 12px;font-size:11.5px;line-height:1.4;display:flex;align-items:center;gap:10px}
  .cookie p{flex:1;min-width:0}
  .cookie__btns{margin-top:0;flex-direction:column;gap:6px;flex:none}
  .cookie .pill{padding:8px 12px;font-size:10px;letter-spacing:.08em}
  .hero{height:140svh}
  .ba{padding:12px}
  .ba__tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-bottom:12px}
  .ba__tabs button{padding:11px 4px;letter-spacing:.1em;font-size:11px}
  .kicker{letter-spacing:.22em;padding-left:.22em}
  .ba__frame{aspect-ratio:4/3;border-radius:14px}
  .ba__handle{width:42px;height:42px}
  .ba__handle::before{left:12px}.ba__handle::after{right:12px}
  .ba__label{top:10px;padding:6px 10px;font-size:10px}
  .ba__label--before{left:10px}.ba__label--after{right:10px}
}
@media (max-width:700px) and (max-height:700px){
  .hero__foot{display:none}
}
@media (max-height:620px){
  .hero{height:auto}
  .hero__pin{position:relative;height:auto;min-height:100svh}
  .hero__copy{padding:96px 16px 120px}
}
/* ---------- полировка: сетка, цена, команда, обещания, декор ---------- */
/* раскладка «заголовок слева прилипает, содержимое справа» */
.split{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,6vw,110px);align-items:start}
.split>.sec__head{position:sticky;top:120px;margin-bottom:0}
.split .h{font-size:clamp(48px,5.4vw,96px)}
/* огромная мятная цифра в заголовке («3 уборки», «от 200 ₽ за м²»): .h--num — в блоке «уборки» */
.bignum>span{font-weight:200;font-size:2.6em;line-height:.8;color:var(--mint);letter-spacing:.02em;text-shadow:0 0 70px rgba(141,255,209,.35)}
.bignum{padding:.08em 0 .02em}
.h .w.bignum{overflow:visible}
.has-motion .reveal .h .bignum>span{opacity:0;transform:translate3d(0,40%,0);transition:transform 1.25s var(--ease),opacity 1s var(--ease);transition-delay:190ms}
.has-motion .reveal.is-in .h .bignum>span{opacity:1;transform:none}
.sec--price{overflow-x:clip}
.price__grid{position:relative;isolation:isolate}
.price__grid::before{content:"";position:absolute;left:-12%;top:-30%;width:78%;height:160%;z-index:-1;pointer-events:none;background:radial-gradient(closest-side,rgba(141,255,209,.11),rgba(141,255,209,.03) 55%,rgba(141,255,209,0))}
.calc__cta{margin-top:26px;width:100%}
.calc__cta b{font-weight:700}
/* своя галочка: мятная рамка вместо белого системного квадрата */
.check input{appearance:none;-webkit-appearance:none;width:22px;height:22px;flex:none;margin:0;border:1.5px solid rgba(141,255,209,.55);border-radius:7px;background:rgba(3,18,11,.5) center/14px no-repeat;cursor:pointer;transition:background-color .35s var(--ease),border-color .35s var(--ease),box-shadow .35s var(--ease)}
.check input:checked{background-color:var(--mint);border-color:var(--mint);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 8.5l3.2 3L13 4.5' fill='none' stroke='%2303120b' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.check input:focus-visible{outline:2px solid var(--mint);outline-offset:3px}
.consent input{margin-top:1px}
/* общий список «чего не делаем» в две колонки */
.limits{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}
.dashes--2{columns:2;column-gap:40px;margin-top:0}
.dashes--2 li{break-inside:avoid}
/* шаги */
.step__body{display:block}
/* команда: инициалы, залитые листьями, — вместо силуэтов, пока нет фото */
.team{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(14px,2vw,24px)}
.person{padding:14px 14px 24px;text-align:left}
.person__pic{position:relative;aspect-ratio:4/3;border-radius:16px;overflow:hidden;background:radial-gradient(80% 70% at 50% 45%,rgba(141,255,209,.14),rgba(3,18,11,0) 70%),#051710;margin-bottom:20px}
.person__img{width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--ease),opacity 1s var(--ease)}
@media (hover:hover){.person:hover .person__img,.person:hover .person__initial{transform:scale(1.04)}}
.nu{font-weight:inherit;color:var(--mint);text-shadow:0 0 40px rgba(141,255,209,.45)}
.person__initial{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:var(--disp);font-weight:100;font-size:clamp(150px,15vw,240px);line-height:1;color:transparent;
  background:linear-gradient(180deg,rgba(3,18,11,.05),rgba(3,18,11,.45)),url(/assets/img/r/leafback-wide-1100.webp) center/cover;-webkit-background-clip:text;background-clip:text;-webkit-text-stroke:1px rgba(141,255,209,.55);transition:transform 1.4s var(--ease)}
.person__body{padding:0 8px}
.person h3{font-size:38px}
.person .kicker{margin-top:6px;font-size:11px;padding-left:0}
.person p:not(.kicker){margin-top:10px;font-size:15px;color:var(--muted)}
.team__note{margin-top:22px;font-size:14px;color:var(--muted);max-width:640px}
/* обещания — строки: звезда · заголовок · текст; линия прорисовывается при наведении */
.promises{list-style:none;border-top:1px solid var(--line)}
.promise{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(16px,4vw,64px);align-items:baseline;padding:clamp(24px,2.8vw,40px) 0;border-bottom:1px solid var(--line)}
.promise::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:var(--mint);transform:scaleX(0);transform-origin:left center;transition:transform 1.1s var(--ease)}
.promise h3{display:flex;align-items:baseline;gap:18px;font-size:clamp(28px,3vw,46px);font-weight:300;line-height:1}
.promise p{font-size:16px;color:var(--muted);max-width:520px}
@media (hover:hover){.promise:hover::after{transform:scaleX(1)}}
/* абонемент: огромные «−10 %» */
.sub__side{display:flex;flex-direction:column;align-items:flex-start}
.sub__big{font-family:var(--disp);font-weight:200;font-size:clamp(96px,11vw,170px);line-height:.8;color:var(--mint);letter-spacing:.02em;text-shadow:0 0 70px rgba(141,255,209,.35);margin-bottom:26px}
.sub__big span{font-size:.55em;margin-left:.08em}
.sub .pill--mint{align-self:stretch}
/* декоративные листья у краёв разделов (двигаются при прокрутке в JS) */
.sec--promises,.sec--sub{overflow-x:clip}
.deco{position:absolute;inset:0;overflow:visible;overflow-x:clip;pointer-events:none;z-index:0}
.sec>.wrap{position:relative;z-index:1}
.deco__leaf{position:absolute;width:clamp(220px,30vw,460px);height:auto;opacity:.85;will-change:transform;overflow-anchor:none}
.deco--price .deco__leaf{right:-7vw;top:4%;transform:rotate(-8deg)}
.deco--promises .deco__leaf{left:-9vw;top:28%;width:clamp(200px,26vw,400px)}
.deco--sub .deco__leaf{right:-6vw;bottom:-2%;width:clamp(200px,24vw,380px)}
/* мягкие кнопки: маленькая и текстовая */
.pill--sm{padding:9px 16px;font-size:10.5px;letter-spacing:.1em}
.pill--text{background:none;border:0;color:var(--muted);padding-left:6px;padding-right:6px}
.pill--text:hover{color:#fff}
/* липкая кнопка записи на телефоне */
.mcta{display:none}
/* cookie — одна строка, спокойные кнопки */
.cookie{display:flex;align-items:center;gap:14px;max-width:560px}
.cookie p{flex:1;min-width:0}
.cookie__btns{margin-top:0;flex:none;flex-wrap:nowrap}
body.menu-open .cookie,body.menu-open .mcta{visibility:hidden}
/* подвал: слово, залитое листьями */
.foot__word{display:block;font-family:var(--disp);font-weight:100;font-size:clamp(64px,14.5vw,250px);line-height:.8;letter-spacing:.12em;padding-left:.12em;text-align:center;text-transform:uppercase;white-space:nowrap}
.fch{display:inline-block;color:transparent;background:linear-gradient(180deg,rgba(3,18,11,.1),rgba(3,18,11,.6)),url(/assets/img/r/leafback-wide-1100.webp) calc(var(--i) * 12%) 40%/900% auto;
  -webkit-background-clip:text;background-clip:text;-webkit-text-stroke:1px rgba(141,255,209,.45);transform:translate3d(0,16%,0)}
.fch--z{-webkit-text-stroke-color:rgba(141,255,209,.85)}
.foot__slogan{margin-top:10px;font-family:var(--disp);font-weight:300;font-size:22px;line-height:1.1;letter-spacing:.2em;text-transform:uppercase;color:var(--mint)}
.has-motion .foot__mark .fch{transform:translate3d(0,70%,0);transition:transform 1.8s var(--ease);transition-delay:calc(var(--i) * 80ms)}
.has-motion .foot__mark.is-in .fch{transform:translate3d(0,16%,0)}
/* шапка над первым экраном прозрачная, плотная — только ниже */
@media (max-width:1320px){.nav a{letter-spacing:.16em}.nav{gap:clamp(14px,2vw,28px)}}
@media (max-height:800px){.mouse{display:none}}
@media (min-width:1101px),(min-width:901px) and (orientation:landscape){.leaf--f2{z-index:4}}
@media (max-width:1100px){
  .split{grid-template-columns:minmax(0,1fr);gap:0}
  .split>.sec__head{position:static;margin-bottom:clamp(36px,5vw,56px)}
  .limits{grid-template-columns:1fr}
}
@media (max-width:900px){
  .dashes--2{columns:1}
}
@media (max-width:700px){
  .team{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .person{padding:8px 8px 16px}
  .person__pic{aspect-ratio:1/1;margin-bottom:12px}
  .person__initial{font-size:34vw}
  .person h3{font-size:28px}
  .person .kicker{font-size:11px;letter-spacing:.1em;padding-left:0}
  .person p:not(.kicker){font-size:13px}
  .promise{grid-template-columns:1fr;gap:10px}
  .promise h3{font-size:30px}
  .step{display:grid;grid-template-columns:64px minmax(0,1fr);gap:14px;align-items:baseline}
  .step__n{font-size:52px;margin-bottom:0}
  .ba{margin:0 calc(var(--gutter) * -1);border-radius:0;border-left:0;border-right:0}
  .deco__leaf{width:52vw;opacity:.55}
  .deco--price .deco__leaf{right:-18vw;top:1%}
  .deco--promises .deco__leaf{left:-24vw;top:6%}
  .deco--sub .deco__leaf{right:-16vw;bottom:-4%}
  .bignum>span{font-size:2.2em}
  .sub__big{font-size:30vw}
  .mcta{display:flex;position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:35;padding:17px;opacity:0;transform:translate3d(0,140%,0);transition:opacity .6s var(--ease),transform .8s var(--ease)}
  .mcta.is-shown{opacity:1;transform:none}
  .cookie{flex-direction:column;align-items:stretch;gap:8px}
  .cookie__btns{justify-content:flex-end}
}

html:not(.js) .burger,html:not(.js) .calc,html:not(.js) .lead{display:none}

/* ---------- светлячки: точки с ореолом плавают и мерцают; только transform и opacity ----------
   Каждая точка — свой маленький слой: путь (transform) и вспышка (opacity) — две независимые анимации
   с разной длительностью, поэтому рисунок не повторяется. Ореол — радиальный градиент, без filter и box-shadow. */
.ff{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.ff--hero{z-index:3}
.ff--form{z-index:1}
.ff i{position:absolute;left:var(--x);top:var(--y);width:var(--s);height:var(--s);margin:calc(var(--s) / -2) 0 0 calc(var(--s) / -2);border-radius:50%;
  background:radial-gradient(circle,#fffef0 0,#f3ffc4 8%,rgba(222,255,150,.85) 15%,rgba(190,255,160,.36) 30%,rgba(141,255,209,.12) 50%,rgba(141,255,209,0) 70%);opacity:0;will-change:transform,opacity}
.has-motion .ff i{animation:ff-drift var(--dr) var(--ease-io) var(--dl) infinite,ff-blink var(--bl) ease-in-out var(--bd) infinite}
html:not(.has-motion) .ff i{opacity:.55}
.has-motion:not(.is-ready) .ff{opacity:0}
.has-motion.is-ready .ff--hero{animation:fadeIn 2.4s var(--ease) 1.2s backwards}
@keyframes ff-drift{
  0%,100%{transform:translate3d(0,0,0)}
  33%{transform:translate3d(var(--dx1),var(--dy1),0)}
  66%{transform:translate3d(var(--dx2),var(--dy2),0)}}
@keyframes ff-blink{0%,100%{opacity:0}18%{opacity:.95}32%{opacity:.35}46%{opacity:1}70%{opacity:.15}}
.hero.is-off .ff i,.page-head.is-off .ff i,.sec--form.is-off .ff i,.motion-paused .ff i{animation-play-state:paused}
@media (max-width:700px){.ff--hero i:nth-child(n+13),.ff--form i:nth-child(n+7),.ff--page i:nth-child(n+8){display:none}}

/* ---------- телефон ---------- */
.top__tel{display:none;margin-left:auto;margin-right:18px;font-weight:500;font-size:13px;letter-spacing:.08em;color:#fff;text-decoration:none;white-space:nowrap;transition:color .4s var(--ease)}
.top__tel:hover{color:var(--mint)}
@media (min-width:1560px){.top__tel{display:inline-block}}
.menu__tel{margin-top:14px;font-weight:500;font-size:18px;letter-spacing:.06em;color:var(--mint);text-decoration:none}
.lead__note a{color:#fff;white-space:nowrap}
.mcall{display:none}
@media (max-width:700px){
  .mcta--call{right:80px}
  .mcall{display:flex;align-items:center;justify-content:center;position:fixed;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:35;width:58px;height:58px;
    border-radius:50%;border:1px solid var(--mint);background:rgba(3,18,11,.92);color:var(--mint);opacity:0;transform:translate3d(0,140%,0);
    transition:opacity .6s var(--ease),transform .8s var(--ease)}
  .mcall.is-shown{opacity:1;transform:none}
  body.menu-open .mcall{visibility:hidden}
}

/* ---------- логотип: знак-лотос и надпись «ЧИСТОДЗЕН» (src/brand.py) ---------- */
.logo{position:relative;isolation:isolate;display:inline-flex;align-items:center;line-height:0;text-decoration:none}
.logo__img{display:block;height:40px;width:auto}
.logo::before{content:"";position:absolute;inset:-18px -30px;z-index:-1;pointer-events:none;border-radius:50%;
  background:radial-gradient(closest-side,rgba(3,18,11,.82),rgba(3,18,11,.5) 55%,rgba(3,18,11,0));transition:opacity .6s var(--ease)}
.top.is-scrolled .logo::before,.foot .logo::before{opacity:0}
.top.is-scrolled .logo__img{height:36px}
.logo--foot .logo__img{height:auto;width:min(260px,70vw)}
/* над светлыми листьями первого экрана шапка получает мягкую тёмную подложку, чтобы логотип читался */
.top::before{content:"";position:absolute;inset:0 0 -40px;z-index:-1;pointer-events:none;background:linear-gradient(180deg,rgba(3,18,11,.6),rgba(3,18,11,0));opacity:1;transition:opacity .6s var(--ease)}
.top.is-scrolled::before{opacity:0}
.hero__lotus{display:block;width:clamp(120px,11vw,176px);height:auto;margin:0 auto 4px}
.has-motion:not(.is-ready) .hero__lotus{opacity:0}
.has-motion.is-ready .hero__lotus{animation:fadeUp 1.5s var(--ease) .05s backwards}
@media (max-width:700px){.logo__img{height:32px}.top.is-scrolled .logo__img{height:30px}.hero__lotus{width:96px;margin-bottom:0}}
@media (max-height:700px){.hero__lotus{display:none}}

/* число пунктов зоны и звезда обещаний — псевдоэлементами: в тексте заголовка их нет (выдача, скринридеры) */
.has-n::after{content:attr(data-n);font-family:var(--font);font-weight:500;font-size:11px;letter-spacing:.2em;color:var(--muted)}
.promise h3::before{content:"✦";flex:none;font-family:var(--font);font-size:.42em;color:var(--mint);transform:translateY(-.25em);transition:transform .9s var(--ease)}
@media (hover:hover){.promise:hover h3::before{transform:translateY(-.25em) rotate(90deg)}}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .hero{height:auto}
  .hero__pin{position:relative;height:auto;min-height:100svh}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;transition-delay:0s!important}
}

/* ---------- уборки: «3 уборки — одна цена», плитки-поводы с листьями, панель выбранной ---------- */
.h--num{display:flex;align-items:baseline;flex-wrap:wrap;gap:0 .22em}
@media (max-width:374px){.h--num .bignum>span{font-size:2em}}
.sec--svc{overflow-x:clip}
.deco--svc .deco__leaf{left:-8vw;top:14%;width:clamp(200px,24vw,380px)}
@media (min-width:701px){.deco--svc .deco__leaf{left:auto;right:-7vw;top:3%}}
.svc{position:relative;isolation:isolate}
.svc::before{content:"";position:absolute;left:-10%;top:-4%;width:80%;height:60%;z-index:-1;pointer-events:none;
  background:radial-gradient(closest-side,rgba(141,255,209,.10),rgba(141,255,209,0))}  /* неподвижное пятно света, как .price__grid::before */

/* плитки */
.svc__tabs{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-bottom:30px;--sel:0;scroll-margin-top:96px}
html:not(.js) .svc__tabs{display:none}
.svc__tab{position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;gap:8px;
  min-height:260px;padding:28px 28px 26px;text-align:left;font:inherit;color:var(--ink);cursor:pointer;border:1px solid var(--line);border-radius:var(--r);
  background:linear-gradient(180deg,rgba(255,255,255,.056),rgba(255,255,255,.022))}
.svc__tab::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(120% 90% at 20% 0%,rgba(141,255,209,.17),rgba(141,255,209,0) 62%);opacity:0;transition:opacity .8s var(--ease)}
.svc__tab::after{content:"";position:absolute;inset:-1px;z-index:4;pointer-events:none;border-radius:inherit;border:1px solid rgba(141,255,209,.7);
  opacity:0;transition:opacity .6s var(--ease)}
.svc__tab[aria-selected="true"]::before,.svc__tab[aria-selected="true"]::after{opacity:1}
@media (hover:hover){.svc__tab:not([aria-selected="true"]):hover::before{opacity:.5}}
.svc__tnum{position:absolute;left:22px;top:16px;z-index:2;font-family:var(--disp);font-weight:100;font-size:clamp(84px,8.6vw,128px);line-height:.8;
  letter-spacing:.02em;color:transparent;-webkit-text-stroke:1px rgba(141,255,209,.45)}
.svc__tnum::after{content:attr(data-n);position:absolute;inset:0;color:var(--mint);-webkit-text-stroke:0;text-shadow:0 0 50px rgba(141,255,209,.45);
  opacity:0;transition:opacity .7s var(--ease)}
.svc__tab[aria-selected="true"] .svc__tnum::after{opacity:.95}
/* лист: три слоя — у каждого свойства один хозяин. wrap: transform — параллакс (JS), opacity — появление (CSS);
   st: transform и opacity — выбор и наведение (CSS); img.fade: opacity — загрузка */
.svc__leafwrap{position:absolute;right:-16%;top:-20%;width:60%;z-index:1;pointer-events:none;will-change:transform}
.svc__leafst{display:block;transform-origin:60% 40%;transform:scaleX(var(--fx,1)) rotate(-16deg) scale(.88);opacity:.3;
  transition:transform 1.2s var(--ease),opacity .8s var(--ease)}
.svc__leaf{width:100%;height:auto}
@media (hover:hover){.svc__tab:not([aria-selected="true"]):hover .svc__leafst{transform:scaleX(var(--fx,1)) rotate(-10deg) scale(.94);opacity:.5}}
.svc__tab[aria-selected="true"] .svc__leafst{transform:scaleX(var(--fx,1)) rotate(-3deg) scale(1.04);opacity:.95}
.svc__tk,.svc__tn,.svc__tw{position:relative;z-index:3}
.svc__tk{font-weight:500;font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--mint)}
.svc__tn{font-family:var(--disp);font-weight:300;font-size:clamp(32px,3.2vw,46px);line-height:.95;letter-spacing:.04em;text-transform:uppercase;text-shadow:0 2px 18px rgba(4,22,15,.8)}
.svc__tw{font-size:14px;line-height:1.45;color:var(--muted);max-width:30ch}
.svc__dot{display:none}
.svc__glider{position:absolute;left:0;bottom:-14px;width:calc((100% - 32px) / 3);height:2px;border-radius:2px;background:var(--mint);
  transform:translate3d(calc(var(--sel) * (100% + 16px)),0,0);transition:transform .8s var(--ease)}
.svc__glider::after{content:"";position:absolute;left:0;right:0;top:-9px;height:20px;background:radial-gradient(50% 50% at 50% 50%,rgba(141,255,209,.45),rgba(141,255,209,0))}
/* до запуска site.js (класс .js уже стоит): выбрана первая плитка — без прыжка и мигания */
.js .svc:not(.is-tabbed) .svc__tab:first-child::before,.js .svc:not(.is-tabbed) .svc__tab:first-child::after{opacity:1}
.js .svc:not(.is-tabbed) .svc__tab:first-child .svc__tnum::after{opacity:.95}
.js .svc:not(.is-tabbed) .svc__tab:first-child .svc__leafst{transform:scaleX(var(--fx,1)) rotate(-3deg) scale(1.04);opacity:.95}

/* панель */
.svc__panel{padding:clamp(22px,3vw,40px)}
.svc__panel[hidden],.svc__zone[hidden]{display:none}       /* иначе display:grid ниже перебьёт атрибут hidden */
.svc__panel+.svc__panel{margin-top:16px}                    /* без JS панели стоят подряд */
.js .svc__panel+.svc__panel{margin-top:0}
.js .svc:not(.is-tabbed) .svc__panel:not(:first-child){display:none}
.svc__k{margin-bottom:8px}
.svc__head h3{font-size:clamp(34px,3.4vw,52px);font-weight:300}
.svc__when{margin-top:10px;font-size:17px;color:#fff}
.svc__lead{margin-top:8px;font-weight:300;font-size:clamp(17px,1.4vw,21px);line-height:1.5;color:var(--muted)}
/* вид вкладками: повод, название и «когда» уже на плитке — в панели не повторяем (h3 остаётся для скринридера) */
.js .svc__head .svc__k{display:none}
.js .svc__head h3{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@media (min-width:701px){.js .svc__head .svc__when{display:none}.js .svc__lead{margin-top:0}}
.svc__label{margin:22px 0 8px;font-weight:500;font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--muted)}
.svc__points{list-style:none}
.svc__points li{position:relative;padding:7px 0 7px 26px;font-size:15.5px;color:#fff}
.svc__points li::before{content:"";position:absolute;left:3px;top:19px;width:9px;height:1.5px;background:var(--mint)}       /* «Главное» — чёрточка */
.svc__points--plus li::before{width:12px}
.svc__points--plus li::after{content:"";position:absolute;left:3px;top:19px;width:12px;height:1.5px;background:var(--mint);transform:rotate(90deg)}  /* «+» */
.svc__cta{display:flex;align-items:center;gap:18px 26px;flex-wrap:wrap;margin-top:24px}
.svc__legend{display:flex;align-items:center;gap:10px;margin-bottom:16px;font-size:13px;color:var(--muted)}
.svc__plusm{position:relative;flex:none;width:12px;height:12px}
.svc__plusm::before,.svc__plusm::after{content:"";position:absolute;left:0;top:5px;width:12px;height:1.5px;background:var(--mint)}
.svc__plusm::after{transform:rotate(90deg)}
.svc__ztabs{display:none}
.svc__zone h4{display:flex;align-items:baseline;gap:10px;margin-bottom:8px;font-family:var(--disp);font-weight:400;font-size:26px;line-height:1;
  letter-spacing:.04em;text-transform:uppercase;color:var(--mint)}
.svc__zone .ticks li{font-size:14.5px;line-height:1.5}
@media (max-width:700px){html:not(.js) .svc__zone+.svc__zone{margin-top:20px}}   /* без JS зоны на телефоне идут столбиком */
.ticks li.is-plus{color:#fff}                                                     /* «+» ярче галочек */
.ticks li.is-plus::before{left:3px;top:19px;width:12px;height:1.5px;border:0;background:var(--mint);transform:none}
.ticks li.is-plus::after{content:"";position:absolute;left:3px;top:19px;width:12px;height:1.5px;background:var(--mint);transform:rotate(90deg)}
.svc__foot{margin-top:24px;display:grid;gap:16px}
.svc__say{padding-left:16px;border-left:1px solid rgba(141,255,209,.45);font-weight:300;font-size:16px;line-height:1.55;color:var(--muted)}
.svc__say-k{display:block;margin-bottom:6px;font-weight:500;font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--mint)}
.svc__note{position:relative;padding-left:32px;font-size:14px;color:var(--muted)}
.svc__i{position:absolute;left:0;top:1px;width:20px;height:20px;border:1px solid var(--mint);border-radius:50%;font:600 12px/18px var(--font);text-align:center;color:var(--mint)}
.svc__extras .svc__label{margin-top:0}
.dashes--price{margin-top:0}
.dashes--price li{display:flex;justify-content:space-between;gap:12px}
.dashes--price b{flex:none;font-weight:500;color:#fff;white-space:nowrap}
.svc__unsure{margin-top:18px;font-size:15px;color:var(--muted)}
.svc__unsure a{color:#fff}
.svc__ztab{position:relative;isolation:isolate;min-height:44px;padding:10px 4px;border-radius:999px;border:1px solid var(--line);background:transparent;
  color:var(--muted);font:500 11px/1.2 var(--font);letter-spacing:.1em;text-transform:uppercase;cursor:pointer}
.svc__ztab::before{content:"";position:absolute;inset:-1px;z-index:-1;border-radius:inherit;background:var(--mint);opacity:0;transition:opacity .2s var(--ease)}
.svc__ztab[aria-selected="true"],.js .svc:not(.is-tabbed) .svc__ztab:first-child{color:var(--mint-ink);border-color:var(--mint)}
.svc__ztab[aria-selected="true"]::before,.js .svc:not(.is-tabbed) .svc__ztab:first-child::before{opacity:1}

@media (min-width:1101px){
  .svc__panel{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,9fr);gap:0 clamp(28px,3.5vw,56px);align-items:start}
  .svc__panel>*{grid-column:1}
  .svc__scope{grid-column:2;grid-row:1/span 4}
  .svc__panel{grid-template-columns:minmax(0,5fr) minmax(0,9fr);grid-template-rows:auto auto auto 1fr auto}
  .svc__foot{grid-row:5;grid-column:1/-1;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 clamp(28px,3.5vw,56px);align-items:start;margin-top:32px;padding-top:26px;border-top:1px solid var(--line2)}
  .svc__zones{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 clamp(20px,2.4vw,36px)}
}
@media (min-width:701px) and (max-width:1100px){
  .svc__tab{min-height:220px;padding:20px 18px}.svc__tw{font-size:13px}.svc__tnum{font-size:76px;left:16px}
  .svc__tn{font-size:clamp(21px,3vw,28px)}                                          /* «До/после аренды» в одну строку и на 768 */
  .svc__leafwrap{width:66%}
  .svc__points{columns:2;column-gap:24px}.svc__points li{break-inside:avoid}
  .svc__scope{margin-top:26px}
  .svc__zones{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
  .svc__foot{grid-template-columns:1fr 1fr;align-items:start}
  .svc__say,.svc__note{grid-column:1}.svc__extras{grid-column:2;grid-row:1/span 2}
}
@media (max-width:700px){
  .svc__tabs{grid-template-columns:1fr;gap:8px;margin-bottom:14px}
  .svc__tab{min-height:0;height:72px;justify-content:center;gap:3px;padding:10px 72px 10px 50px;border-radius:18px}
  .svc__tw{display:none}
  .svc__tk{font-size:10px;letter-spacing:.22em}
  .svc__tn{font-size:26px}
  .svc__tnum{left:auto;right:14px;top:50%;margin-top:-23px;font-size:56px}
  .svc__leafwrap{right:-24px;top:50%;width:104px;margin-top:-52px;will-change:auto}   /* на телефоне лист плитки без параллакса */
  .svc__dot{display:block;position:absolute;left:18px;top:50%;z-index:3;width:18px;height:18px;margin-top:-9px;border-radius:50%;border:1.5px solid rgba(141,255,209,.55)}
  .svc__dot::after{content:"";position:absolute;inset:3px;border-radius:50%;background:var(--mint);transform:scale(0);transition:transform .4s var(--ease)}
  .svc__tab[aria-selected="true"] .svc__dot::after,.js .svc:not(.is-tabbed) .svc__tab:first-child .svc__dot::after{transform:scale(1)}
  .svc__glider{top:0;bottom:auto;width:3px;height:72px;transform:translate3d(0,calc(var(--sel) * 80px),0)}   /* 72 px строка + 8 px зазор */
  .svc__glider::after{top:0;bottom:0;left:-8px;right:-8px;height:auto}
  .svc__panels{margin:0 calc(var(--gutter) * -1)}
  .svc__panel{border-radius:0;border-left:0;border-right:0;padding:22px var(--gutter)}
  .js .svc__lead{margin-top:6px}
  .svc__cta{gap:20px}.svc__cta .pill{flex:1}
  .svc__scope{margin-top:22px}
  .js .svc__ztabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-bottom:12px}
  .js .svc:not(.is-tabbed) .svc__zone:not(:first-child){display:none}
  .js .svc__zone h4{display:none}                                                  /* название зоны — на переключателе */
  .deco--svc .deco__leaf{left:auto;right:-20vw;top:2%;width:52vw}                            /* после базового правила */
}
@media (max-width:374px){.svc__tn{font-size:23px}.svc__tab{padding-right:62px}.svc__tnum{font-size:48px;margin-top:-20px}}

/* движение раздела «Уборки» (только transform и opacity): лист плитки проявляется — opacity у обёртки
   (transform обёртки — параллакс в JS); части панели и зоны выезжают по классу .is-shown (JS) */
.has-motion .svc__tabs.reveal .svc__leafwrap{opacity:0;transition:opacity 1.2s var(--ease) .25s}
.has-motion .svc__tabs.reveal.is-in .svc__leafwrap{opacity:1}
.has-motion .svc__panel :is(.svc__head > *,.svc__label,.svc__points li,.svc__cta,.svc__legend,.svc__say,.svc__note,.svc__more,.svc__extras li),
.has-motion .svc__zone :is(h4,li){transition:opacity .7s var(--ease),transform .9s var(--ease);transition-delay:calc(var(--k,0) * 32ms)}
.has-motion .svc__panel:not(.is-shown) :is(.svc__head > *,.svc__label,.svc__points li,.svc__cta,.svc__legend,.svc__say,.svc__note,.svc__more,.svc__extras li),
.has-motion .svc__zone:not(.is-shown) :is(h4,li){opacity:0;transform:translate3d(0,18px,0)}

/* калькулятор и форма: группы с legend, таблетки-переключатели, кнопки площади */
fieldset{border:0;padding:0;margin:0;min-width:0}
legend{padding:0}
.calc__row--svc,.calc__row--extras{display:block}
.calc__row legend{display:block;margin-bottom:12px;font-weight:500;font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:var(--muted)}
.calc__row--extras .check{margin-top:12px;align-items:flex-start;font-weight:400;font-size:15px;letter-spacing:0;text-transform:none;color:#fff}  /* .calc__row label делал подписи капсом */
.calc__row--extras .check input{margin-top:1px}
.check__t{display:block}
.calc__only{display:block;margin-top:2px;font-size:12.5px;color:var(--muted)}
.calc__only[hidden]{display:none}
.check input:disabled{cursor:default;opacity:.4}
.check input:disabled+.check__body .check__t{opacity:.55}    /* пометка «только в генеральной» остаётся полной яркости */
.calc__hint{margin-top:12px;font-size:14px;color:var(--muted)}
.calc__from{font-size:.45em;margin-right:.15em;letter-spacing:.06em;color:var(--muted)}
.calc__formula{flex-basis:100%;margin-top:6px;font-size:14px;color:var(--muted);font-variant-numeric:tabular-nums}
.calc__sub{flex-basis:100%;margin-top:4px;font-size:14px;color:var(--mint)}
.calc__presets{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:6px}
.seg{display:grid;gap:8px;grid-template-columns:repeat(3,minmax(0,1fr))}
.seg--4{grid-template-columns:repeat(2,minmax(0,1fr))}
.seg__opt{position:relative;display:block;cursor:pointer}
.seg__opt input{position:absolute;inset:0;z-index:1;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.seg__opt span,.chip{position:relative;isolation:isolate;display:flex;align-items:center;justify-content:center;gap:4px;min-height:48px;padding:10px 12px;
  border-radius:999px;border:1px solid var(--line);background:transparent;color:var(--muted);font:500 11.5px/1.25 var(--font);letter-spacing:.12em;
  text-transform:uppercase;text-align:center;cursor:pointer}
.chip{min-height:44px;flex-wrap:wrap}
.seg__opt span::before,.chip::before{content:"";position:absolute;inset:-1px;z-index:-1;border-radius:inherit;background:var(--mint);opacity:0;transition:opacity .2s var(--ease)}
.seg__opt input:checked+span,.chip[aria-pressed="true"]{color:var(--mint-ink);border-color:var(--mint)}
.seg__opt input:checked+span::before,.chip[aria-pressed="true"]::before{opacity:1}
.seg__opt input:focus-visible+span{outline:2px solid var(--mint);outline-offset:3px}
@media (hover:hover){.seg__opt:hover input:not(:checked)+span,.chip:not([aria-pressed="true"]):hover{color:#fff;border-color:rgba(255,255,255,.4)}}
/* прайс справа */
.pricelist__k2{margin-top:34px}
.pricelist__extras{list-style:none;margin-top:14px}
.pricelist__extras li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 16px;align-items:baseline;padding:14px 0;border-bottom:1px solid var(--line2);font-size:15px;color:#fff}
.pricelist__extras small{grid-column:1/-1;font-size:13px;color:var(--muted)}
.examples__table .t-num small{margin-right:.35em;font-family:var(--font);font-size:12px;letter-spacing:.04em;color:var(--muted)}
/* форма: поле «Уборка» и строка «Расчёт» */
.field--seg{margin-bottom:14px}
.field--seg.is-bad .seg__opt span{border-color:#ff8a8a}
.lead__calc{margin:-2px 0 18px;padding-left:14px;border-left:1px solid rgba(141,255,209,.45);font-size:14px;color:var(--muted)}
.lead__calc a{color:#fff}
@media (max-width:700px){
  .seg--3{grid-template-columns:1fr 1fr}.seg--3 .seg__opt:first-child{grid-column:1/-1}
  .seg__opt span,.chip{font-size:11px;letter-spacing:.06em;padding:8px 6px}
  .chip{flex-direction:column;gap:0}
}
@media (max-width:374px){.seg--4{grid-template-columns:1fr}.examples__table .t-num small{display:block}}

/* 7: кнопки уборок в калькуляторе — длинные названия получают больше места */
@media (min-width:701px){.calc .seg--3{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) minmax(0,1.2fr)}}

/* ---------- страницы уборок, крошки, подвал (SEO-SPEC § 2.3): те же стекло, листья, светлячки и типографика ---------- */
.crumbs{margin-bottom:22px;font-weight:500;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.crumbs ol{list-style:none;display:flex;flex-wrap:wrap;align-items:center}
.crumbs li+li::before{content:"›";margin:0 12px;color:var(--mint)}
.crumbs a{display:inline-block;padding:5px 0;color:#fff;text-decoration:none;border-bottom:1px solid var(--line);transition:color .4s var(--ease),border-color .4s var(--ease)}
.crumbs a:hover{color:var(--mint);border-color:var(--mint)}
/* первый экран: крупный H1 (он и есть LCP), лист у края, свечение, светлячки — без рендеров */
.page-head{position:relative;overflow:clip;padding:clamp(112px,12vw,164px) 0 clamp(8px,2vw,32px)}
.page-head>.wrap{position:relative;z-index:2}
.page-head .glow--1{width:62vw;height:62vw;right:-20vw;top:-28vw}
.page-head .ff{z-index:1}
.deco--head .deco__leaf{right:-6vw;top:88px;width:clamp(160px,21vw,330px);transform:rotate(12deg)}
.page-head__h{font-size:clamp(44px,7.6vw,124px);line-height:.92;margin-top:16px;max-width:15em}
.w--z>span{color:var(--mint);text-shadow:0 0 60px rgba(141,255,209,.4)}
.page-head__grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(28px,5vw,80px);align-items:start;margin-top:clamp(28px,3.4vw,48px)}
.page-head__lead{font-weight:300;font-size:clamp(18px,1.55vw,22px);line-height:1.55;color:#cfe6da;max-width:640px;text-wrap:pretty}
.page-head__cta{justify-content:flex-start;margin-top:34px}
.page-head__card{padding:clamp(22px,2.6vw,34px)}
.page-head__rate{margin:0 0 12px}
.page-head__points li{color:#fff}
/* два абзаца — две колонки, абзац не рвётся посреди фразы */
.page-head__intro{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:12px clamp(24px,4vw,64px);margin-top:clamp(44px,5vw,72px);padding-top:clamp(24px,3vw,34px);border-top:1px solid var(--line);color:var(--muted)}
:is(.page-head__lead,.page-head__intro,.diff,.page-note,.block__body,.svc__note) a{color:#fff;text-decoration-color:rgba(141,255,209,.6);text-underline-offset:3px;transition:color .4s var(--ease)}
:is(.page-head__lead,.page-head__intro,.diff,.page-note,.block__body,.svc__note) a:hover{color:var(--mint)}
.has-motion:not(.is-ready) .page-head :is(.crumbs,.page-head__k,.page-head__lead,.cta,.page-head__card,.page-head__intro),
.has-motion:not(.is-ready) .page-head__h .w>span{opacity:0}
.has-motion.is-ready .page-head__h .w>span{animation:rise 1.5s var(--ease) backwards;animation-delay:calc(.1s + var(--i) * 70ms)}
.has-motion.is-ready .page-head :is(.crumbs,.page-head__k){animation:fadeUp 1.2s var(--ease) .05s backwards}
.has-motion.is-ready .page-head__lead{animation:fadeUp 1.3s var(--ease) .45s backwards}
.has-motion.is-ready .page-head .cta{animation:fadeUp 1.3s var(--ease) .6s backwards}
.has-motion.is-ready .page-head__card{animation:fadeUp 1.4s var(--ease) .7s backwards}
.has-motion.is-ready .page-head__intro{animation:fadeUp 1.4s var(--ease) .85s backwards}
.has-motion.is-ready .ff--page{animation:fadeIn 2.4s var(--ease) .8s backwards}
/* ставка крупно: «от 200 ₽ за м²» (H2 раздела цены на странице уборки — вопрос) */
.price__rate{margin-top:20px;font-family:var(--disp);font-weight:300;font-size:clamp(28px,2.8vw,42px);line-height:1;letter-spacing:.06em;text-transform:uppercase;color:#fff}
.price__rate b{font-weight:200;font-size:2.3em;line-height:.8;color:var(--mint);letter-spacing:.02em;text-shadow:0 0 60px rgba(141,255,209,.35);margin:0 .05em}
/* заголовки разделов страниц уборок длиннее, чем на главной */
.is-svc .sec .h{font-size:clamp(40px,5.2vw,84px)}
.is-svc .split .h{font-size:clamp(38px,4.2vw,68px)}
.is-svc .block .h{font-size:clamp(36px,3.8vw,60px)}
.ticks--lg li{padding:14px 0 14px 34px;font-size:clamp(16px,1.3vw,19px);color:#fff}
.ticks--lg li::before{left:6px;top:21px}
.page-note{margin-top:24px;font-size:15px}
/* что входит: три карточки зон */
.sec--scope{overflow-x:clip}
.deco--scope .deco__leaf{left:-9vw;top:4%;width:clamp(170px,21vw,330px)}
.zones3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.8vw,24px)}
.zone{padding:clamp(22px,2.4vw,32px);overflow:hidden}
.zone h3{display:flex;align-items:baseline;gap:10px;margin-bottom:12px;color:var(--mint)}
.zone__n{position:absolute;right:18px;top:8px;font-family:var(--disp);font-weight:100;font-size:76px;line-height:1;color:transparent;-webkit-text-stroke:1px rgba(141,255,209,.3);pointer-events:none}
.zone .ticks li{font-size:15px;line-height:1.5}
.scope__foot{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px clamp(24px,4vw,64px);margin-top:clamp(24px,3vw,36px);align-items:start}
/* отличие и свой блок */
.diff .sec__text{margin:0 0 20px;max-width:680px}
.diff .svc__points{margin-top:6px;padding-top:12px;border-top:1px solid var(--line)}
.block{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,4vw,64px);padding:clamp(28px,4.4vw,64px);align-items:start;overflow:hidden}
.block::after{content:"";position:absolute;left:-20%;top:-60%;width:70%;height:180%;z-index:-2;pointer-events:none;background:radial-gradient(closest-side,rgba(141,255,209,.12),rgba(141,255,209,0))}
.block .sec__head{margin-bottom:0}
.block__body .sec__text:first-child{margin-top:0}
.limits--page .dashes{margin-top:0}
/* другие уборки: карточки-ссылки с листом, как плитки на главной; кликабельна вся карточка */
.others{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(14px,1.8vw,24px)}
.other{display:flex;flex-direction:column;justify-content:flex-end;gap:8px;min-height:clamp(240px,22vw,300px);padding:clamp(24px,2.6vw,34px);padding-right:90px;overflow:hidden}
.other__leaf{position:absolute;right:-10%;top:-20%;width:50%;z-index:-1;pointer-events:none}
.other .svc__leafst{opacity:.55;transform:scaleX(var(--fx,1)) rotate(-10deg) scale(.92)}
.other__n{margin:-8px 0 auto -4px;padding-bottom:16px;font-family:var(--disp);font-weight:100;font-size:clamp(64px,7vw,110px);line-height:.8;color:transparent;-webkit-text-stroke:1px rgba(141,255,209,.45)}
.other__k{font-weight:500;font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--mint)}
.other__name{font-weight:300;font-size:clamp(30px,3vw,46px);line-height:.95}
.other__name a{color:#fff;text-decoration:none}
.other__name a::after{content:"";position:absolute;inset:0;z-index:3;border-radius:inherit}
.has-motion .reveal.other .other__name{transform:none}            /* сдвиг при появлении сделал бы заголовок рамкой для ::after — кликалось бы только название */
.other__name a:focus-visible{outline:0}
.other:has(a:focus-visible){outline:2px solid var(--mint);outline-offset:3px}
.other__when{font-size:14px;line-height:1.45;color:var(--muted);max-width:34ch}
.other__go{position:absolute;right:24px;bottom:24px;width:46px;height:46px;border:1px solid rgba(141,255,209,.5);border-radius:50%;transition:transform .7s var(--ease)}
.other__go::before,.svc__arrow::before{content:"";position:absolute;left:14px;top:22px;width:17px;height:1.5px;background:var(--mint)}
.other__go::after,.svc__arrow::after{content:"";position:absolute;left:21px;top:18px;width:8px;height:8px;border-top:1.5px solid var(--mint);border-right:1.5px solid var(--mint);transform:rotate(45deg)}
@media (hover:hover){.other:hover .other__go{transform:translate3d(6px,0,0)}.other:hover .svc__leafst{opacity:.95;transform:scaleX(var(--fx,1)) rotate(-3deg) scale(1.04)}.other:hover .other__name a{color:var(--mint)}}
.others__all{margin-top:30px}
/* «Подробнее о …» в панели уборки на главной */
.svc__more{justify-self:start;align-self:start}
.svc__arrow{display:inline-block;position:relative;width:18px;height:10px;margin-left:12px;vertical-align:0}
.svc__arrow::before{left:0;top:4px;width:16px}
.svc__arrow::after{left:9px;top:1px}
@media (min-width:701px){.svc__more{grid-column:1/-1}}
@media (min-width:1101px){.svc__more{grid-row:2;margin-top:6px}}
.examples__table td:first-child small{display:block;margin-top:2px;font-weight:400;font-size:12px;color:var(--muted)}
.foot__svc{display:flex;flex-direction:column;gap:10px;padding-bottom:14px;margin-bottom:4px;border-bottom:1px solid var(--line2)}
.dashes--404{margin:18px 0 4px}
.dashes--404 a{color:#fff}
@media (max-width:900px){
  .page-head__grid,.block{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:700px){
  .page-head{padding:96px 0 56px}
  .zones3,.others,.scope__foot{grid-template-columns:minmax(0,1fr)}
  .page-head__intro{grid-template-columns:minmax(0,1fr);font-size:15px}
  .page-head .glow--1{width:120vw;height:120vw;right:-56vw;top:-46vw}
  .deco--head{display:none}                                   /* на узком экране лист лёг бы под заголовок — остаются свечение и светлячки */
  .crumbs{letter-spacing:.14em}.crumbs ol{display:block}.crumbs li{display:inline}
  .deco--scope .deco__leaf{left:auto;right:-20vw;top:1%;width:46vw}
  .zone__n{font-size:60px}
  .other{min-height:0;padding-right:76px}
  .other__go{right:18px;bottom:18px}
}