/* Свой электрик — демо. Мир: московские сумерки, свет только в окнах. */
@font-face{font-family:Jost;font-style:normal;font-weight:100 900;font-display:swap;src:url(fonts/jost-cyrillic.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Jost;font-style:normal;font-weight:100 900;font-display:swap;src:url(fonts/jost-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:Jost;font-style:normal;font-weight:100 900;font-display:swap;src:url(fonts/jost-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  --dusk-0:#17164A; --dusk-1:#1E1C58; --dusk-2:#29266F; --dusk-3:#363288;
  --light:#FFD47F; --light-hi:#FFF3D4;
  --paper:#F1EFF7; --ink:#1D1A44; --ink-2:#4A4670;
  --on-dusk:#FFF6E7; --on-dusk-2:#D9D4F3; --label:#FFCF7A;
  --pad:clamp(16px,5vw,80px);
  --ease:cubic-bezier(.16,1,.3,1);
}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scrollbar-color:var(--dusk-3) var(--dusk-0)}
body{margin:0;font-family:Jost,system-ui,sans-serif;font-size:19px;line-height:1.5;font-weight:420;color:var(--ink);background:var(--paper);font-feature-settings:"kern","liga"}
::selection{background:var(--light);color:var(--dusk-0)}
:focus-visible{outline:3px solid var(--light);outline-offset:3px;border-radius:3px}
button{font:inherit;color:inherit}
a{color:inherit;text-underline-offset:.22em}
p,dd,li{text-wrap:pretty}

.plaque{margin:0;padding:8px var(--pad);font-size:14px;line-height:1.35;text-align:center;background:var(--dusk-0);color:var(--on-dusk-2)}

/* шапка */
.hdr{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:clamp(14px,2.4vw,32px);padding:12px var(--pad);background:var(--dusk-1);color:var(--on-dusk);box-shadow:0 1px 0 var(--dusk-1),0 2px 0 rgba(8,6,36,.35)}
.logo{display:flex;align-items:center;gap:10px;font-size:21px;font-weight:600;letter-spacing:-.01em;text-decoration:none;white-space:nowrap}
.ico{width:26px;height:26px;flex:none}
.nav{display:flex;gap:clamp(16px,2vw,30px);margin-left:auto}
.nav a{color:var(--on-dusk-2);text-decoration:none;font-size:17px;padding:6px 0}
.nav a:hover{color:var(--on-dusk)}
.hdr-tel{display:flex;align-items:center;gap:8px;font-weight:500;text-decoration:none;white-space:nowrap}
.hdr-tel svg{width:20px;height:20px;flex:none}
.hdr-menu{display:none;background:none;border:1.5px solid rgba(217,212,243,.4);border-radius:6px;padding:6px 14px;font-size:16px;cursor:pointer}

/* «горящее окно» — главная кнопка */
.btn-lit{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 26px;border:0;border-radius:6px;cursor:pointer;text-decoration:none;
  font-weight:600;font-size:18px;color:var(--dusk-0);white-space:nowrap;
  background:radial-gradient(120% 160% at 50% 30%,var(--light-hi) 0%,#FFE2A2 55%,var(--light) 100%);
  box-shadow:0 10px 24px -12px rgba(6,4,30,.7);transition:transform .2s var(--ease),box-shadow .3s var(--ease),filter .3s}
.btn-lit:hover{filter:brightness(1.06);box-shadow:0 14px 30px -12px rgba(6,4,30,.8)}
.btn-lit:active{transform:translateY(1px)}
.hdr-go{min-height:44px;padding:0 18px;font-size:16px}

/* первый экран: небо, текст слева, дом справа */
.hero{position:relative;display:grid;grid-template-columns:minmax(0,540px) minmax(0,1fr);grid-template-rows:auto auto auto 1fr;grid-template-areas:"text house" "hint house" "picks house" "cases house";
  column-gap:clamp(24px,4vw,64px);min-height:calc(100svh - 104px);padding-left:var(--pad);overflow:hidden;color:var(--on-dusk);
  background:
    radial-gradient(38% 26% at 68% 6%,rgba(132,120,224,.34),rgba(132,120,224,0) 70%),
    radial-gradient(70% 55% at 82% 108%,rgba(238,160,150,.5),rgba(238,160,150,0) 72%),
    radial-gradient(55% 60% at 104% 62%,rgba(146,104,206,.42),rgba(146,104,206,0) 70%),
    linear-gradient(180deg,#1A1953 0%,#221F65 40%,#2B2877 75%,#332F86 100%)}
.hero-text{grid-area:text;padding-top:clamp(36px,6vh,72px)}
h1{margin:0;font-size:clamp(40px,4.2vw,62px);line-height:1.02;font-weight:560;letter-spacing:-.022em;text-wrap:balance;max-width:14ch}
.lead{margin:20px 0 0;max-width:40ch;font-size:clamp(18px,1.4vw,20px);line-height:1.45;color:var(--on-dusk-2)}
.hero-cta{display:flex;flex-wrap:wrap;align-items:center;gap:14px 26px;margin-top:26px}
.tel{font-size:21px;font-weight:500;text-decoration:none;border-bottom:1.5px solid rgba(255,246,231,.35);padding-bottom:2px}
.tel:hover{border-color:var(--on-dusk)}
.sample{margin:14px 0 0;font-size:14px;color:var(--on-dusk-2)}
.hint .narrow{display:none}
.hint{grid-area:hint;margin:clamp(28px,5vh,52px) 0 0;padding-top:20px;border-top:1px solid rgba(217,212,243,.16);font-size:17px;line-height:1.4;color:var(--label);max-width:40ch}
.picks{grid-area:picks;list-style:none;margin:10px 0 0;padding:0 0 32px;display:flex;flex-wrap:wrap;align-content:flex-start;gap:2px 16px}
.picks button{padding:4px 0;background:none;border:0;border-bottom:1px dashed rgba(217,212,243,.5);cursor:pointer;font-size:16px;color:var(--on-dusk-2)}
.picks button:hover{color:var(--on-dusk)}
.picks button[aria-pressed="true"]{color:var(--light);border-bottom-color:var(--light)}
.picks .pick-other{display:inline-flex;align-items:center;gap:7px;color:var(--light);border-bottom:1px solid rgba(255,212,127,.55)}
.picks .pick-other svg{width:15px;height:15px}
.nav-go{display:none}
.hero-house{grid-area:house;position:relative;min-height:calc(100svh - 104px);min-width:0;perspective:1100px;perspective-origin:20% 100%}
.facade{position:absolute;inset:0;display:block;width:100%;height:100%;transform:rotateX(8deg) rotateY(-8deg);transform-origin:40% 100%}

/* рассказ окна: на широком экране — карточка у окна, на узком — под домом */
.cases{grid-area:cases;padding:0 0 40px;max-width:540px}
.case{font-size:15.5px;line-height:1.42;color:var(--on-dusk-2)}
.case p{margin:8px 0 0}
.case b{color:var(--label);font-weight:600}
.case-t{margin:0 0 4px;font-size:21px;line-height:1.18;font-weight:540;letter-spacing:-.01em;color:var(--on-dusk);text-wrap:balance}
.case-t::before{content:"«"}.case-t::after{content:"»"}
.case .case-p{margin-top:12px;color:var(--on-dusk);font-weight:500}
.case-p span{font-weight:400;font-size:14px;color:var(--on-dusk-2)}
.case-go{margin-top:10px;padding:6px 0;background:none;border:0;cursor:pointer;font-weight:600;color:var(--light);text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:6px}
.case-go:hover{color:var(--light-hi)}
@media (min-width:1200px){
  .js .cases{grid-area:auto;position:absolute;z-index:5;width:340px;padding:18px 20px 14px;border-radius:12px;
    background:rgba(20,19,64,.95);box-shadow:0 26px 60px -18px rgba(6,4,30,.75),0 0 0 1px rgba(255,212,127,.22);
    transition:left .45s var(--ease),top .45s var(--ease),opacity .3s}
  .js .cases:not([data-side]){opacity:0}
  .js .cases::before{content:"";position:absolute;top:var(--py,40px);width:14px;height:14px;background:inherit;transform:rotate(45deg);box-shadow:inherit}
  .js .cases[data-side="right"]::before{left:-7px;box-shadow:-1px 1px 0 0 rgba(255,212,127,.22)}
  .js .cases[data-side="left"]::before{right:-7px;box-shadow:1px -1px 0 0 rgba(255,212,127,.22)}
  .js .cases[data-side="below"]::before{top:-7px;left:var(--px,40px);box-shadow:-1px -1px 0 0 rgba(255,212,127,.22)}
  .js .cases[data-side="above"]::before{top:auto;bottom:-7px;left:var(--px,40px);box-shadow:1px 1px 0 0 rgba(255,212,127,.22)}
}

/* дом: окна-кнопки, свет как состояние */
.facade .story{cursor:pointer;outline:none}
.facade .hit{fill:rgba(255,240,210,0);stroke:rgba(255,241,210,0);stroke-width:2.5;transition:stroke .3s,fill .3s}
.facade .story:hover .hit,.facade .story:focus-visible .hit{fill:rgba(255,240,210,.08);stroke:rgba(255,241,210,.6)}
.facade .story.is-sel .hit{fill:rgba(255,240,210,.1);stroke:var(--light-hi)}
.facade .lit{transition:opacity .7s var(--ease)}
.facade.has-sel .lit{opacity:.46}
.facade.has-sel .bloom{opacity:.3;transition:opacity .7s var(--ease)}
.facade.has-sel .story.is-sel .lit{opacity:1}
.facade.dusk .lit:not(.on){opacity:0;transition:none}
.fixlight{opacity:0;transition:opacity .9s var(--ease)}
.story.fixed .fixlight{opacity:1}
.flick{animation:flick 2.9s steps(1,end) infinite}
.blink{animation:blink 6.5s infinite}
.tv{animation:tv 3.4s steps(1,end) infinite}
.phone{animation:phone 5s ease-in-out infinite alternate}
.smoke{animation:smoke 3.4s ease-in-out infinite}
.story.fixed .phone,.story.fixed .smoke{opacity:0;animation:none}
@keyframes flick{0%{opacity:1}7%{opacity:.2}9%{opacity:1}33%{opacity:.55}35%{opacity:1}60%{opacity:.12}62%{opacity:.9}64%{opacity:.25}66%{opacity:1}}
@keyframes blink{0%,60%{opacity:1}62%,84%{opacity:0}86%,100%{opacity:1}}
@keyframes tv{0%{opacity:.95}22%{opacity:.6}46%{opacity:1}71%{opacity:.72}86%{opacity:.9}}
@keyframes phone{0%{transform:translate(0,0)}55%{transform:translate(12px,5px)}100%{transform:translate(24px,-2px)}}
@keyframes smoke{0%{opacity:0;transform:translateY(8px)}35%{opacity:.9}100%{opacity:0;transform:translateY(-10px)}}

/* сцены одного вечера: светлые — «в квартире», тёмные — «за окном» */
.defs{position:absolute;width:0;height:0;overflow:hidden}
.scene{padding:clamp(64px,8vw,112px) var(--pad);scroll-margin-top:64px}
.scene.dark{background:var(--dusk-1);color:var(--on-dusk)}
.scene h2{margin:0;font-size:clamp(32px,3.6vw,54px);line-height:1.04;font-weight:560;letter-spacing:-.02em;text-wrap:balance;max-width:20ch}
.scene .intro{margin:18px 0 0;max-width:52ch;font-size:clamp(18px,1.5vw,21px);color:var(--ink-2)}
.scene.dark .intro{color:var(--on-dusk-2)}
.note{margin:28px 0 0;font-size:14px;color:var(--ink-2)}
.dark .note{color:var(--on-dusk-2)}

/* шапка раздела: текст слева, нарисованный мастер справа */
.sec-head{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:clamp(20px,4vw,64px)}
.side-grid{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(28px,5vw,80px);align-items:start}
.side-grid > .drawn{position:sticky;top:110px;margin-top:24px}
.side-grid .figure{width:clamp(170px,16vw,230px)}
.sec-head .figure.half{width:clamp(150px,13vw,190px)}
.drawn{margin:0;display:grid;justify-items:center;gap:8px}
.drawn .figure{display:block;width:clamp(150px,15vw,210px);height:auto}
.drawn figcaption{max-width:22ch;font-size:13px;line-height:1.35;text-align:center;color:var(--ink-2)}

/* страшилки: зачёркнутая фраза → правило мастера */
.scares{list-style:none;margin:clamp(36px,5vw,64px) 0 0;padding:0;display:grid;gap:clamp(20px,2.4vw,30px);max-width:1040px}
.scares li{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(16px,4vw,64px);align-items:baseline;padding-top:clamp(20px,2.4vw,30px);border-top:1px solid rgba(74,70,112,.09)}
.scare{position:relative;margin:0;font-size:clamp(22px,2.2vw,32px);line-height:1.2;font-weight:450;letter-spacing:-.01em;color:#5E5A84;text-wrap:balance}
.scare::before{content:"«"}.scare::after{content:"»"}
.scares{--strike:rgba(226,163,58,.85)}
.scare s{text-decoration:none;background:linear-gradient(var(--strike),var(--strike)) 0 60%/100% 2.5px no-repeat}
@supports (animation-timeline:view()){  /* зачёркивание дорисовывается при прокрутке; где не умеют — сразу зачёркнуто */
  .scare s{animation:strike linear both;animation-timeline:view();animation-range:entry 10% entry 100%}
  .yours .light{animation:switch-on linear both;animation-timeline:view();animation-range:entry 60% cover 40%}
}
@keyframes strike{from{background-size:0 2.5px}to{background-size:100% 2.5px}}
@keyframes switch-on{from{opacity:0}to{opacity:1}}
.rule{margin:0;font-size:clamp(18px,1.55vw,22px);line-height:1.45;font-weight:460;color:var(--ink)}

/* цены по срочности: три состояния света */
.tiers{display:grid;grid-template-columns:minmax(0,1.22fr) minmax(0,1fr) minmax(0,1fr);gap:clamp(18px,2vw,28px);align-items:start;margin-top:clamp(32px,4vw,52px);--wall:linear-gradient(180deg,#7477B4,#5E61A2 70%,#53558F)}
/* цены — карточки: «сейчас» тёмная, шире и с коралловой рамкой, остальные светлые */
.tier{border-radius:14px;overflow:hidden;background:#FFF;box-shadow:0 1px 0 rgba(29,26,68,.06),0 18px 40px -26px rgba(29,26,68,.45)}
.tier-wall{display:flex;justify-content:center;padding:18px 18px 0;background:var(--wall)}
.tier-wall .win{display:block;width:min(100%,200px);height:auto}
.tier-in{padding:20px 24px 26px}
.tier-now{background:var(--dusk-1);color:var(--on-dusk);box-shadow:0 0 0 2px rgba(255,150,120,.75),0 26px 50px -26px rgba(29,26,68,.7)}
.tier-now .tier-in > p,.tier-now .prices small{color:var(--on-dusk-2)}
.tier-now .prices li::after{border-bottom-color:rgba(217,212,243,.35)}
.tier-now h3{color:#FFB4A3}
.tier-now .tier-wall{padding-top:24px;background:linear-gradient(180deg,#4A4C8C,#3B3D7E)}

.tier h3{margin:0;font-size:clamp(22px,1.9vw,27px);line-height:1.15;font-weight:560;letter-spacing:-.01em;text-wrap:balance}
.tier > p{margin:10px 0 0;font-size:17px;color:var(--ink-2)}
.prices{list-style:none;margin:18px 0 0;padding:0;display:grid;gap:9px}
.prices li{display:flex;align-items:baseline;gap:10px;font-size:17px;line-height:1.35}
.prices li::after{content:"";order:1;flex:1;border-bottom:1.5px dotted rgba(74,70,112,.4);transform:translateY(-4px);min-width:16px}
.prices b{order:2;font-weight:560;white-space:nowrap}
.prices small{display:block;font-size:14px;color:var(--ink-2)}
.price-notes span{white-space:nowrap}
.price-notes{list-style:none;margin:clamp(32px,4vw,52px) 0 0;padding:20px 0 0;border-top:1px solid rgba(74,70,112,.18);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 40px;font-size:16px;color:var(--ink-2)}

/* из чего чек: окно кухни, сумма на слагаемые и бумажный чек справа */
.chek-grid{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"head paper" "sum sum" "note note";column-gap:clamp(28px,4vw,64px);align-items:center}
.chek-grid .chek-head{grid-area:head}
.chek-grid .paper{grid-area:paper}
.chek-grid .sum{grid-area:sum}
.chek-grid .note{grid-area:note}
.paper{margin:0;width:clamp(250px,22vw,300px);padding:22px 22px 30px;background:#FFFDF6;color:var(--ink);transform:rotate(2deg);
  box-shadow:0 26px 50px -24px rgba(4,3,24,.8);font-variant-numeric:tabular-nums;
  -webkit-mask:conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) 50%/16px 100%;mask:conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) 50%/16px 100%}
.paper-head{display:flex;justify-content:space-between;gap:12px;margin:0 0 14px;padding-bottom:10px;border-bottom:1.5px dashed rgba(29,26,68,.25);font-size:15px}
.paper-head span{color:var(--ink-2)}
.paper ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.paper li{display:flex;justify-content:space-between;gap:12px;font-size:15px;line-height:1.3}
.paper li b,.paper-total b{font-weight:560;white-space:nowrap}
.paper-total{display:flex;justify-content:space-between;margin:14px 0 0;padding-top:10px;border-top:1.5px dashed rgba(29,26,68,.25);font-size:19px;font-weight:560}
.paper-foot{margin:10px 0 0;font-size:12.5px;color:var(--ink-2)}
.chek-head{display:flex;align-items:center;gap:clamp(20px,3vw,40px)}
.chek-head .win{flex:none;order:-1;width:clamp(110px,12vw,170px);height:auto;border-radius:4px}
.sum{display:flex;flex-wrap:wrap;align-items:flex-start;gap:6px clamp(10px,1.4vw,22px);margin:clamp(32px,4vw,52px) 0 0;padding:0;list-style:none}
.sum li{display:flex;flex-direction:column;gap:6px;font-size:clamp(30px,3.6vw,54px);line-height:1;font-weight:500;letter-spacing:-.02em;color:var(--on-dusk)}
.sum li small{max-width:14ch;font-size:15px;line-height:1.3;font-weight:420;letter-spacing:0;color:var(--on-dusk-2)}
.sum .op{color:var(--label);font-weight:400}
.sum .total{color:var(--light)}

/* родителям */
.parents{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1fr);gap:clamp(32px,6vw,96px);align-items:center}
.parents .win{width:100%;height:auto;border-radius:8px;box-shadow:0 30px 60px -30px rgba(23,22,74,.6)}
.marks{list-style:none;margin:26px 0 0;padding:0;display:grid;gap:14px;max-width:56ch}
.marks li{position:relative;padding-left:34px;font-size:18px;line-height:1.45}
.marks b{font-weight:600}
.marks li::before{content:"";position:absolute;left:0;top:.3em;width:18px;height:16px;border-radius:2px;
  background:linear-gradient(90deg,transparent 7px,var(--frame,#FFF) 7px 9px,transparent 9px),linear-gradient(transparent 6px,var(--frame,#FFF) 6px 8px,transparent 8px),radial-gradient(circle at 50% 40%,#FFE3A8,#F0A14E)}

/* мастер */
.master{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1fr);gap:clamp(32px,6vw,96px);align-items:start}
.door{width:100%;height:auto;border-radius:8px}
.master figure,.parents figure{margin:0}
.master figcaption{margin-top:12px;font-size:14px;color:var(--on-dusk-2)}
.does p{margin:0 0 10px;font-size:15px;color:var(--on-dusk-2)}
.facts{margin:26px 0 0;display:grid;grid-template-columns:auto 1fr;gap:10px 22px;font-size:17px}
.facts dt{color:var(--on-dusk-2)}
.facts dd{margin:0;color:var(--label)}
.does{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:34px}
.does h3{margin:0 0 10px;font-size:21px;font-weight:560}
.does .marks{margin:0;gap:9px}
.does .marks li{font-size:17px;color:var(--on-dusk-2)}

/* вопросы и страшилки: текст слева, нарисованный мастер справа (липнет, пока читаете) */

/* вопросы */
.faq{margin-top:clamp(32px,4vw,52px);max-width:860px;border-top:1px solid rgba(74,70,112,.2)}
.faq details{border-bottom:1px solid rgba(74,70,112,.2)}
.faq summary{display:flex;justify-content:space-between;gap:24px;padding:20px 0;cursor:pointer;list-style:none;font-size:clamp(19px,1.6vw,23px);line-height:1.3;font-weight:520}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";flex:none;width:18px;height:18px;margin-top:5px;background:linear-gradient(var(--ink),var(--ink)) center/18px 2px no-repeat,linear-gradient(var(--ink),var(--ink)) center/2px 18px no-repeat;transition:transform .3s var(--ease)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{margin:0 0 22px;max-width:64ch;font-size:18px;color:var(--ink-2)}

/* вызов: ночной дом и форма */
.call{position:relative;display:grid;grid-template-columns:minmax(0,560px) minmax(0,1fr);column-gap:clamp(24px,4vw,64px);padding-right:0;overflow:hidden;
  background:radial-gradient(60% 50% at 80% 110%,rgba(170,120,190,.32),transparent 70%),linear-gradient(180deg,#12113D 0%,#17164A 60%,#1E1B58 100%)}
.call-house{position:relative;min-height:640px;perspective:1100px;perspective-origin:20% 100%;margin-bottom:calc(-1 * clamp(64px,8vw,112px))}
.call-house .facade{transform:rotateX(8deg) rotateY(-8deg);transform-origin:40% 100%}
.form{margin-top:30px;display:grid;gap:18px;max-width:520px}
.field{display:grid;gap:6px;align-content:start}
.field label,.field .lbl{font-size:16px;font-weight:500;color:var(--on-dusk)}
.field small{font-size:14px;color:var(--on-dusk-2)}
.field input,.field textarea{width:100%;padding:13px 14px;border:1.5px solid transparent;border-radius:6px;background:var(--paper);color:var(--ink);font:inherit;font-size:18px;line-height:1.35}
.field textarea{min-height:84px;resize:vertical}
.field input::placeholder,.field textarea::placeholder{color:#6E6A92}
.field input:focus,.field textarea:focus{outline:3px solid var(--light);outline-offset:1px}
.field [aria-invalid="true"]{border-color:#FF9F8A}
.err{margin:0;font-size:15px;color:#FFB4A3}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.check{display:grid;grid-template-columns:22px 1fr;gap:12px;align-items:start;font-size:16px;line-height:1.45;color:var(--on-dusk-2)}
.check input{width:20px;height:20px;margin:2px 0 0;accent-color:var(--light)}
.check a{color:var(--on-dusk)}
.check.off{opacity:.5}
.form .btn-lit{justify-self:start;margin-top:6px}
.form-demo{margin:14px 0 0;font-size:14px;color:var(--on-dusk-2)}
.form .form-demo{margin:0}
.policy{margin:-6px 0 0 34px;font-size:15px;color:var(--on-dusk-2)}
.policy a{color:var(--on-dusk)}
.smoke-line{display:flex;gap:10px;align-items:flex-start;margin:14px 0 0;max-width:52ch;font-size:15.5px;line-height:1.45;color:#FFB4A3}
.smoke-line svg{flex:none;width:18px;height:18px;margin-top:2px}
.dlg-call .smoke-line{margin:12px 0 0;padding:10px 12px;border-radius:8px;background:rgba(255,120,90,.1)}
.case-chip{display:none;align-items:center;gap:10px;justify-self:start;padding:6px 8px 6px 12px;border-radius:6px;background:rgba(255,212,127,.14);color:var(--light);font-size:15px}
.case-chip.on{display:inline-flex}
.case-chip button{display:inline-flex;border:0;background:none;color:var(--on-dusk-2);cursor:pointer;padding:6px}
.case-chip button svg{width:14px;height:14px}
.case-chip button:hover{color:var(--on-dusk)}

/* окно «Вызвать мастера»: ночь, как у дома внизу; на телефоне — на весь экран */
.dlg.dlg-call{width:min(620px,calc(100vw - 32px));max-width:none;max-height:calc(100dvh - 32px);overflow:auto;padding:24px 32px 30px;border-radius:12px;background:var(--dusk-1);color:var(--on-dusk);box-shadow:0 30px 80px -20px rgba(4,3,24,.8),0 0 0 1px rgba(255,212,127,.18)}
.dlg-call::backdrop{background:rgba(10,9,36,.76)}
.dlg-head{display:flex;justify-content:space-between;align-items:center;gap:16px}
.dlg.dlg-call h2{margin:0;font-size:clamp(26px,3vw,32px);color:var(--on-dusk)}
.dlg-x{flex:none;display:grid;place-items:center;width:44px;height:44px;padding:0;border:1.5px solid rgba(217,212,243,.3);border-radius:8px;background:none;color:var(--on-dusk);cursor:pointer}
.dlg-x:hover{border-color:var(--on-dusk-2)}
.dlg-x svg{width:16px;height:16px}
.dlg-call .intro{margin:10px 0 0;font-size:17px;color:var(--on-dusk-2)}
.dlg-call .form{max-width:none;margin-top:22px}
.dlg-call .form-demo{color:var(--on-dusk-2)}

/* текст для поиска — под кнопкой вызова у ночного дома */
.seo{margin-top:clamp(36px,5vw,56px);padding-top:24px;border-top:1px solid rgba(217,212,243,.16);max-width:60ch;color:var(--on-dusk-2);font-size:16px;line-height:1.55}
.seo h3{margin:0;font-size:22px;line-height:1.2;font-weight:560;color:var(--on-dusk)}
.seo h4{margin:18px 0 4px;font-size:17px;font-weight:600;color:var(--label)}
.seo p{margin:0}
.seo .seo-note{margin-top:16px;font-size:13px}

/* письма в окне «не отправлено» */
.dlg-letters{max-width:min(760px,calc(100vw - 24px));max-height:calc(100svh - 32px);overflow:auto}
.letters{display:grid;gap:16px;margin:18px 0 0}
.dlg-foot{position:sticky;bottom:-30px;margin:0 -30px -30px;padding:16px 30px 24px;background:linear-gradient(rgba(241,239,247,0),var(--paper) 30%)}
.letter{padding:18px 20px;border-radius:8px;background:#FFF;box-shadow:0 1px 0 rgba(23,22,74,.08),0 12px 30px -18px rgba(23,22,74,.4)}
.letter h3{margin:0 0 10px;font-size:15px;font-weight:600;color:var(--ink-2)}
.letter dl{margin:0 0 12px;display:grid;grid-template-columns:auto 1fr;gap:4px 12px;font-size:15px}
.letter dt{color:var(--ink-2)}.letter dd{margin:0;color:var(--ink);word-break:break-word}
.letter pre{margin:0;font:inherit;font-size:16px;line-height:1.5;white-space:pre-wrap;color:var(--ink)}
.letter.skip{background:transparent;box-shadow:none;border:1.5px dashed rgba(74,70,112,.35)}

/* подвал: кто и как связаться, услуги со ссылками, документы и реквизиты; плашка */
.foot{background:var(--dusk-0);color:var(--on-dusk-2)}
.foot-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr) minmax(0,1fr);gap:28px clamp(28px,4vw,64px);padding:48px var(--pad) 18px;font-size:16px}
.foot-col p{margin:10px 0 0}
.foot-col h3{margin:4px 0 12px;font-size:15px;font-weight:600;letter-spacing:.01em;color:var(--on-dusk)}
.foot-col ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.foot a{color:var(--on-dusk);text-decoration:none}
.foot a:hover{text-decoration:underline}
.foot .logo{color:var(--on-dusk)}
.foot-tel{font-size:19px;font-weight:500}
.foot .foot-go{min-height:44px;padding:0 18px;font-size:16px;color:var(--dusk-0);margin-top:6px}
.foot .foot-go:hover{text-decoration:none}

/* правовые страницы и 404 */
.doc{max-width:760px;margin:0 auto;padding:clamp(48px,7vw,96px) var(--pad)}
.doc h1{font-size:clamp(32px,3.6vw,48px);max-width:none}
.doc h2{margin:36px 0 10px;font-size:24px;line-height:1.2;font-weight:560}
.doc p,.doc li{font-size:18px;line-height:1.55}
.doc .sample-top{margin:0 0 28px;padding:12px 16px;border-radius:6px;background:#E6E2F3;color:var(--ink);font-size:16px}
.lost{display:grid;place-items:center;text-align:center;min-height:70svh;padding:64px var(--pad);background:var(--dusk-1);color:var(--on-dusk)}
.lost .win{width:min(260px,60vw);height:auto;margin:0 auto 28px;border-radius:6px}

.foot .plaque{padding:18px var(--pad) 24px;background:none}

.dlg{max-width:min(480px,calc(100vw - 32px));padding:30px;border:0;border-radius:10px;background:var(--paper);color:var(--ink);box-shadow:0 30px 80px -20px rgba(10,8,40,.6)}
.dlg::backdrop{background:rgba(14,13,48,.62)}
.dlg h2{margin:0 0 12px;font-size:26px;line-height:1.15;font-weight:560;outline:none}
.dlg-letters p{margin:0 0 14px;color:var(--ink-2)}

@media (max-width:1180px){
  .nav{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;gap:0;padding:6px var(--pad) 18px;background:var(--dusk-1);box-shadow:0 18px 30px -18px rgba(0,0,0,.5)}
  .nav.open{display:flex}
  .nav a{padding:12px 0;font-size:19px;border-bottom:1px solid rgba(217,212,243,.12)}
  .hdr-tel{margin-left:auto}
  .hdr-menu{display:inline-flex}
  .nav.open .nav-go{display:inline-flex;align-self:flex-start;margin-top:16px;padding:0 22px;color:var(--dusk-0);border:0}
}
@media (max-width:860px){
  .hdr{gap:12px}
  .hdr-tel span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
  .hdr-tel svg{width:24px;height:24px}
  .hdr-go{display:none}
  .plaque{padding:6px var(--pad);font-size:12.5px}
  .hero{grid-template-columns:minmax(0,1fr);grid-template-rows:none;grid-template-areas:"text" "house" "cases" "picks";padding:0 var(--pad);min-height:0}
  .hero-text{padding-top:20px}
  h1{font-size:34px}
  .lead{margin-top:12px;font-size:17px}
  .hero-cta{flex-wrap:nowrap;gap:14px;margin-top:20px}
  .hero-cta .btn-lit{padding:0 18px;font-size:17px}
  .tel{font-size:18px}
  .sample{margin-top:10px;font-size:13px}
  .hint{grid-area:house;align-self:start;z-index:2;margin:0;padding:12px 0 0;border:0;font-size:16px;pointer-events:none}
  .hint .narrow{display:inline}
  .hint .wide{display:none}
  .picks{padding-bottom:36px}
  .hero-house{height:min(128vw,500px);min-height:0;margin:18px calc(-1 * var(--pad)) 0;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;overscroll-behavior-x:contain;perspective:none}
  .hero-house::-webkit-scrollbar{display:none}
  .facade{position:static;width:auto;height:100%;transform:none}
  .cases{padding:22px 0 8px}
}
@media (max-width:860px){
  .scares li{grid-template-columns:1fr;gap:8px}
  .tiers,.price-notes{grid-template-columns:1fr}
  .sec-head{grid-template-columns:minmax(0,1fr) 108px;align-items:center;gap:14px}
  .drawn .figure{width:108px}
  .drawn figcaption{font-size:11.5px}
  .chek-grid{grid-template-columns:1fr;grid-template-areas:"head" "paper" "note";row-gap:24px}
  .chek-grid .sum{display:none} /* на узком экране — только бумажный чек: равенство повторяет его цифры */
  .side-grid{grid-template-columns:1fr}
  .paper{width:min(300px,100%);justify-self:center;transform:rotate(1deg)}
  .side-grid > .drawn{position:static;margin-top:0;justify-self:start}
  .side-grid .figure{width:130px}
  .sec-head .figure.half{width:104px}
  .foot-grid{grid-template-columns:1fr}
  .tier .win{width:min(100%,220px)}
  .parents,.master{grid-template-columns:1fr}
  .parents .win{max-width:300px}
  .door{max-width:420px}
  .does{grid-template-columns:1fr}
  .call{grid-template-columns:minmax(0,1fr);padding-right:var(--pad)}
  .call-house{min-height:0;height:min(90vw,420px);margin:40px calc(-1 * var(--pad)) calc(-1 * clamp(64px,8vw,112px));perspective:none;overflow:hidden}
  .call-house .facade{position:absolute;inset:0;width:100%;height:100%;transform:none}
  .facts{grid-template-columns:1fr;gap:2px}
  .facts dd{margin-bottom:10px}
  .chek-head{align-items:flex-start;gap:18px}
  .chek-head .win{width:84px;margin-top:6px}
  .row2{grid-template-columns:1fr}
  .dlg.dlg-call{width:100vw;max-width:none;height:100dvh;max-height:none;margin:0;border-radius:0;padding:16px 16px 28px}
}
@media (prefers-reduced-motion:reduce){
  .scare s,.yours .light{animation:none}
  html{scroll-behavior:auto}
  .flick,.blink,.tv,.phone,.smoke{animation:none}
  .flick{opacity:.55}
  .facade .lit,.fixlight{transition:none}
}