/* Страницы систем: один файл вместо отдельных page.css. Классы у каждой страницы свои. */


/* ---- osveshchenie-page.css ---- */
/* Автоматизация освещения */

body:has(.os-hero-full){overflow-x:hidden}
.uni-main:has(.os-hero-full){padding-top:0}
.uni-main:has(.os-hero-full) .uni-wrap:first-child{padding-top:0}
.uni-main:has(.os-hero-full) .uni-title{display:none}
.uni-main .uni-wrap > .os-hero-full{margin-top:0 !important}

.os-sec{padding:20px 0}
.os-h2{margin:0 0 12px;font:700 clamp(22px,3vw,32px)/1.2 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.os-sub{margin:0 0 22px;max-width:820px;font:400 clamp(14px,1.6vw,17px)/1.6 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}
.os-btn{cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;font:600 16px/1 'VelaSans',system-ui,sans-serif;color:#fff;border:0;padding:16px 28px;border-radius:14px;background:linear-gradient(90deg,#7F6BFF,#5548AA);box-shadow:0 8px 24px rgba(127,107,255,.35);transition:filter .15s ease,transform .15s ease;text-decoration:none}
.os-btn:hover{filter:brightness(1.08);transform:translateY(-2px)}
.os-btn--ghost{background:transparent;border:1px solid rgba(255,255,255,.35);box-shadow:none}
.os-btn--ghost:hover{background:rgba(255,255,255,.08)}

.os-hero-full{position:relative;left:50%;right:50%;width:100vw;margin-left:-50vw;margin-right:-50vw;height:600px;min-height:500px;display:flex;align-items:center;overflow:hidden;color:#eef0f6;background:#0e1018 center/cover no-repeat}
.os-hero-overlay{position:absolute;inset:0;background:linear-gradient(105deg,rgba(8,10,16,.82) 0%,rgba(8,10,16,.55) 48%,rgba(8,10,16,.35) 100%);z-index:1}
.os-hero-in{position:relative;z-index:2;width:1600px;max-width:88%;margin:0 auto;padding:0 20px}
.os-hero-title{margin:0 0 18px;max-width:900px;font:600 clamp(30px,5vw,48px)/1.12 'VelaSans',system-ui,sans-serif;letter-spacing:-.6px;color:#fff}
.os-hero-lead{margin:0 0 34px;max-width:680px;font:400 clamp(17px,2vw,24px)/1.3 'VelaSans',system-ui,sans-serif;color:#c8c8d2}
.os-hero-actions{display:flex;flex-wrap:wrap;gap:16px}
.os-hero-actions .btn{padding:15px 28px !important;min-width:210px;justify-content:center}
@media (max-width:600px){.os-hero-full{height:auto;min-height:0;padding:96px 0 64px}.os-hero-actions .btn{min-width:0;width:100%}}

/* Цифры на стыке hero и следующего блока */
.os-sec--stats{position:relative;z-index:5;margin-top:-56px;padding-top:0;padding-bottom:8px}
@media (max-width:600px){.os-sec--stats{margin-top:-36px}}

.os-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:0;padding:22px;border-radius:20px;background:linear-gradient(135deg,rgba(20,22,32,.92),rgba(18,16,28,.88));border:1px solid rgba(127,107,255,.28);backdrop-filter:blur(12px);box-shadow:0 16px 40px rgba(0,0,0,.35)}
.os-stat{text-align:center;padding:8px;border-radius:14px;transition:transform .25s ease,background .25s ease}
.os-stat:hover{transform:translateY(-4px);background:rgba(255,255,255,.05)}
.os-stat-num{font:800 clamp(26px,3.6vw,42px)/1 'VelaSans',system-ui,sans-serif;background:linear-gradient(90deg,#CFC7FF,#7F6BFF);-webkit-background-clip:text;background-clip:text;color:transparent}
.os-stat-label{margin:8px 0 0;font:500 13px/1.4 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.72)}
@media (max-width:760px){.os-stats{grid-template-columns:1fr 1fr}}

/* Interactive light stage */
.os-demo{display:grid;grid-template-columns:1.35fr .9fr;gap:22px;align-items:stretch}
@media (max-width:900px){.os-demo{grid-template-columns:1fr}}

.os-stage{
  position:relative;overflow:hidden;border-radius:20px;border:1px solid rgba(255,255,255,.12);
  min-height:420px;background:#12141c;
  --ceil:.35;
  --sofa:.4;
  --accent:.25;
  --spot:.15;
  --warm:.55;
  --amb:.35;
}
.os-stage[data-mode="morning"]{--ceil:.85;--sofa:.55;--accent:.3;--spot:.2;--warm:.75;--amb:.7}
.os-stage[data-mode="cinema"]{--ceil:.05;--sofa:.08;--accent:.7;--spot:.15;--warm:.35;--amb:.12}
.os-stage[data-mode="evening"]{--ceil:.45;--sofa:.7;--accent:.55;--spot:.4;--warm:.95;--amb:.5}
.os-stage[data-mode="party"]{--ceil:.9;--sofa:.8;--accent:.95;--spot:.85;--warm:.4;--amb:.85}
.os-stage[data-mode="away"]{--ceil:.08;--sofa:.05;--accent:.12;--spot:.55;--warm:.45;--amb:.1}
.os-stage[data-mode="night"]{--ceil:.12;--sofa:.2;--accent:.25;--spot:.65;--warm:.7;--amb:.22}

.os-room{
  position:absolute;inset:0;
  background:
    linear-gradient(180deg,rgba(10,12,18,calc(.75 - var(--amb)*.45)),rgba(10,12,18,calc(.55 - var(--amb)*.3))),
    url('https://test.maybesmart.ru/wp-content/themes/maybesmart/assets/images/osvesh.jpg') center/cover no-repeat;
  transition:filter .7s ease;
  filter:brightness(calc(.55 + var(--amb)*.55)) saturate(calc(.9 + var(--warm)*.2));
}

.os-glow{
  position:absolute;border-radius:50%;pointer-events:none;z-index:1;
  transition:opacity .7s ease,transform .7s ease,filter .7s ease;
  mix-blend-mode:screen;
}
.os-glow--ceil{
  left:10%;right:10%;top:-12%;height:48%;
  background:radial-gradient(ellipse at 50% 75%,rgba(255,236,200,calc(var(--ceil)*.55)),transparent 72%);
  opacity:var(--ceil);
}
.os-glow--sofa{
  left:4%;width:52%;bottom:0;height:55%;
  background:radial-gradient(ellipse at 40% 35%,rgba(255,210,150,calc(var(--sofa)*.5)),transparent 70%);
  opacity:var(--sofa);
}
.os-glow--accent{
  right:6%;width:42%;top:20%;height:50%;
  background:radial-gradient(ellipse at 55% 45%,rgba(200,180,255,calc(var(--accent)*.45)),transparent 70%);
  opacity:var(--accent);
}
.os-glow--spot{
  left:35%;width:30%;bottom:-5%;height:60%;
  background:radial-gradient(ellipse at 50% 90%,rgba(255,244,210,calc(var(--spot)*.4)),transparent 65%);
  opacity:var(--spot);
}

/* Мягкие шары света по ландшафту — без «палочек» */
.os-lamp{
  position:absolute;z-index:2;pointer-events:none;border-radius:50%;
  background:radial-gradient(circle at 40% 35%,#fff8e8 0%,#ffe2a8 35%,rgba(255,200,120,.15) 70%,transparent 100%);
  transition:opacity .7s ease,transform .7s ease,filter .7s ease,box-shadow .7s ease;
  filter:blur(.3px);
}
.os-lamp::after{
  content:"";position:absolute;left:50%;top:50%;width:220%;height:220%;margin:-110% 0 0 -110%;
  border-radius:50%;
  background:radial-gradient(circle,rgba(255,220,160,.55),transparent 68%);
  transition:opacity .7s ease;
}
.os-lamp--1{left:18%;bottom:22%;width:18px;height:18px;opacity:calc(.25 + var(--sofa)*.75);box-shadow:0 0 28px rgba(255,210,140,calc(var(--sofa)*.9))}
.os-lamp--2{left:32%;bottom:28%;width:14px;height:14px;opacity:calc(.2 + var(--ceil)*.7);box-shadow:0 0 22px rgba(255,220,160,calc(var(--ceil)*.8))}
.os-lamp--3{left:48%;bottom:24%;width:16px;height:16px;opacity:calc(.2 + var(--spot)*.8);box-shadow:0 0 26px rgba(255,210,150,calc(var(--spot)*.85))}
.os-lamp--4{right:28%;bottom:30%;width:13px;height:13px;opacity:calc(.15 + var(--accent)*.7);box-shadow:0 0 24px rgba(210,190,255,calc(var(--accent)*.75))}
.os-lamp--5{right:16%;bottom:20%;width:20px;height:20px;opacity:calc(.2 + var(--warm)*.55 * var(--amb));box-shadow:0 0 32px rgba(255,200,140,calc(var(--amb)*.9))}
.os-stage[data-mode="cinema"] .os-lamp{opacity:.08;filter:blur(1px) brightness(.4)}
.os-stage[data-mode="cinema"] .os-lamp--4{opacity:calc(.35 + var(--accent)*.5);filter:blur(.2px) brightness(1.1)}
.os-stage[data-mode="away"] .os-lamp{opacity:.06}
.os-stage[data-mode="away"] .os-lamp--2,
.os-stage[data-mode="away"] .os-lamp--5{opacity:.45;animation:osPulse 2.8s ease-in-out infinite}
.os-stage[data-mode="night"] .os-lamp{opacity:.12}
.os-stage[data-mode="night"] .os-lamp--1,
.os-stage[data-mode="night"] .os-lamp--3{opacity:.55}
@keyframes osPulse{0%,100%{opacity:.25;transform:scale(1)}50%{opacity:.7;transform:scale(1.08)}}

.os-hint{
  position:absolute;left:16px;right:16px;bottom:16px;z-index:4;
  padding:12px 14px;border-radius:12px;
  background:rgba(12,14,20,.72);border:1px solid rgba(255,255,255,.12);
  backdrop-filter:blur(8px);
  font:500 13px/1.4 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.82);
}
.os-hint b{color:#CFC7FF;font-weight:600}

.os-panel{
  display:flex;flex-direction:column;gap:12px;
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.12);
  border-radius:20px;padding:22px;
}
.os-panel h3{margin:0;font:700 20px/1.3 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.os-panel > p{margin:0;font:400 14px/1.55 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}
.os-modes{display:grid;gap:10px;margin-top:4px}
.os-mode{
  text-align:left;cursor:pointer;border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.03);border-radius:14px;padding:12px 14px;
  color:#eef0f6;transition:border-color .2s ease,background .2s ease,transform .2s ease;
}
.os-mode:hover,.os-mode.is-act{
  border-color:rgba(169,154,255,.55);background:rgba(127,107,255,.14);transform:translateX(3px);
}
.os-mode strong{display:block;font:600 15px/1.3 'VelaSans',system-ui,sans-serif;margin:0 0 4px;color:#fff}
.os-mode span{display:block;font:400 13px/1.45 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}
.os-explain{
  margin-top:auto;padding:14px;border-radius:14px;
  background:linear-gradient(135deg,rgba(127,107,255,.16),rgba(85,72,170,.08));
  border:1px solid rgba(127,107,255,.28);
  min-height:96px;
}
.os-explain h4{margin:0 0 6px;font:700 15px/1.3 'VelaSans',system-ui,sans-serif;color:#CFC7FF}
.os-explain p{margin:0;font:400 13px/1.5 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.78)}

.os-cases{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media (max-width:900px){.os-cases{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.os-cases{grid-template-columns:1fr}}
.os-case{
  position:relative;overflow:hidden;min-height:210px;border-radius:18px;
  border:0;background:#14151b center/cover no-repeat;
  transition:transform .2s ease;
}
.os-case::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(11,12,15,.2) 0%,rgba(11,12,15,.55) 45%,rgba(11,12,15,.92) 100%);
  transition:background .2s ease;
}
.os-case:hover{transform:translateY(-5px)}
.os-case:hover::before{background:linear-gradient(180deg,rgba(11,12,15,.2) 0%,rgba(85,72,170,.35) 50%,rgba(11,12,15,.94) 100%)}
.os-case-body{position:relative;z-index:1;padding:20px;display:flex;flex-direction:column;justify-content:flex-end;height:100%;min-height:210px;border:0}
.os-case h3{margin:0;font:700 17px/1.3 'VelaSans',system-ui,sans-serif;color:#fff}
.os-case p{margin:8px 0 0;font:400 13px/1.5 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.82)}
.os-case-tag{
  align-self:flex-start;margin:0 0 12px;font:600 11px/1 'VelaSans',system-ui,sans-serif;
  color:#CFC7FF;background:rgba(127,107,255,.22);border:1px solid rgba(127,107,255,.4);
  padding:6px 10px;border-radius:999px;
}

.os-types{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
@media (max-width:900px){.os-types{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.os-types{grid-template-columns:1fr}}
.os-type{
  padding:20px;border-radius:18px;background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.1);transition:transform .2s ease,border-color .2s ease;
}
.os-type:hover{transform:translateY(-4px);border-color:rgba(127,107,255,.5)}
.os-type-ic{
  width:44px;height:44px;border-radius:12px;margin:0 0 14px;
  display:grid;place-items:center;color:#CFC7FF;
  background:rgba(127,107,255,.16);border:1px solid rgba(127,107,255,.3);
}
.os-type-ic svg{width:22px;height:22px}
.os-type h3{margin:0 0 8px;font:700 16px/1.3 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.os-type p{margin:0;font:400 13px/1.55 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}

.os-checks{display:grid;gap:9px;margin:0;padding:0;list-style:none}
.os-checks li{display:flex;gap:10px;align-items:flex-start;font:400 14px/1.5 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.85)}
.os-checks li::before{
  content:"";flex:0 0 18px;height:18px;margin-top:1px;border-radius:50%;
  border:1px solid rgba(169,154,255,.45);
  background:rgba(169,154,255,.18) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23A99AFF" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"><path d="M20 6 9 17l-5-5"/></svg>') center/10px no-repeat;
}

.os-benefits{display:grid;grid-template-columns:1.1fr 1fr;gap:22px;align-items:center}
@media (max-width:800px){.os-benefits{grid-template-columns:1fr}}
.os-benefits-visual{
  min-height:280px;border-radius:20px;border:0;
  background:#14151b center/cover no-repeat;position:relative;overflow:hidden;
}
.os-benefits-visual::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 30%,rgba(12,12,18,.75));
}

.os-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;counter-reset:os}
.os-step{position:relative;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.10);border-radius:18px;padding:24px 20px;transition:transform .2s ease,border-color .2s ease}
.os-step:hover{transform:translateY(-4px);border-color:rgba(127,107,255,.5)}
.os-step::before{counter-increment:os;content:"0" counter(os);display:block;font:800 28px/1 'VelaSans',system-ui,sans-serif;background:linear-gradient(90deg,#CFC7FF,#7F6BFF);-webkit-background-clip:text;background-clip:text;color:transparent;margin:0 0 12px}
.os-step h3{margin:0 0 8px;font:700 16px/1.3 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.os-step p{margin:0;font:400 13px/1.55 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}
@media (max-width:900px){.os-steps{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.os-steps{grid-template-columns:1fr}}

.os-cta{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;padding:30px;border-radius:20px;background:linear-gradient(135deg,rgba(127,107,255,.18),rgba(85,72,170,.10));border:1px solid rgba(127,107,255,.30)}
.os-cta h3{margin:0;font:700 clamp(20px,2.6vw,26px)/1.2 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.os-cta p{margin:8px 0 0;max-width:560px;font:400 15px/1.55 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.74)}
.os-cta-btns{display:flex;flex-wrap:wrap;gap:12px}
@media (max-width:520px){.os-cta-btns{width:100%}.os-cta .os-btn{width:100%}}


/* ---- klimat-page.css ---- */
/* Климат-контроль */

body:has(.kk-hero-full){overflow-x:hidden}
.uni-main:has(.kk-hero-full){padding-top:0}
.uni-main:has(.kk-hero-full) .uni-wrap:first-child{padding-top:0}
.uni-main:has(.kk-hero-full) .uni-title{display:none}
.uni-main .uni-wrap > .kk-hero-full{margin-top:0 !important}

.kk-sec{padding:20px 0}
.kk-h2{margin:0 0 12px;font:700 clamp(22px,3vw,32px)/1.2 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.kk-sub{margin:0 0 22px;max-width:820px;font:400 clamp(14px,1.6vw,17px)/1.6 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}
.kk-btn{cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;font:600 16px/1 'VelaSans',system-ui,sans-serif;color:#fff;border:0;padding:16px 28px;border-radius:14px;background:linear-gradient(90deg,#7F6BFF,#5548AA);box-shadow:0 8px 24px rgba(127,107,255,.35);transition:filter .15s ease,transform .15s ease;text-decoration:none}
.kk-btn:hover{filter:brightness(1.08);transform:translateY(-2px)}
.kk-btn--ghost{background:transparent;border:1px solid rgba(255,255,255,.35);box-shadow:none}
.kk-btn--ghost:hover{background:rgba(255,255,255,.08)}

.kk-hero-full{position:relative;left:50%;right:50%;width:100vw;margin-left:-50vw;margin-right:-50vw;height:600px;min-height:500px;display:flex;align-items:center;overflow:hidden;color:#eef0f6;background:#0e1018 center/cover no-repeat}
.kk-hero-overlay{position:absolute;inset:0;background:linear-gradient(105deg,rgba(8,10,16,.82) 0%,rgba(8,10,16,.55) 48%,rgba(8,10,16,.35) 100%);z-index:1}
.kk-hero-in{position:relative;z-index:2;width:1600px;max-width:88%;margin:0 auto;padding:0 20px}
.kk-hero-title{margin:0 0 18px;max-width:900px;font:600 clamp(30px,5vw,48px)/1.12 'VelaSans',system-ui,sans-serif;letter-spacing:-.6px;color:#fff}
.kk-hero-lead{margin:0 0 34px;max-width:680px;font:400 clamp(17px,2vw,24px)/1.3 'VelaSans',system-ui,sans-serif;color:#c8c8d2}
.kk-hero-actions{display:flex;flex-wrap:wrap;gap:16px}
.kk-hero-actions .btn{padding:15px 28px !important;min-width:210px;justify-content:center}
@media (max-width:600px){.kk-hero-full{height:auto;min-height:0;padding:96px 0 64px}.kk-hero-actions .btn{min-width:0;width:100%}}

.kk-sec--stats{position:relative;z-index:5;margin-top:-56px;padding-top:0;padding-bottom:8px}
@media (max-width:600px){.kk-sec--stats{margin-top:-36px}}

.kk-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:0;padding:22px;border-radius:20px;background:linear-gradient(135deg,rgba(20,22,32,.92),rgba(18,16,28,.88));border:1px solid rgba(127,107,255,.28);backdrop-filter:blur(12px);box-shadow:0 16px 40px rgba(0,0,0,.35)}
.kk-stat{text-align:center;padding:8px;border-radius:14px;transition:transform .25s ease,background .25s ease}
.kk-stat:hover{transform:translateY(-4px);background:rgba(255,255,255,.05)}
.kk-stat-num{font:800 clamp(26px,3.6vw,42px)/1 'VelaSans',system-ui,sans-serif;background:linear-gradient(90deg,#CFC7FF,#7F6BFF);-webkit-background-clip:text;background-clip:text;color:transparent}
.kk-stat-label{margin:8px 0 0;font:500 13px/1.4 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.72)}
@media (max-width:760px){.kk-stats{grid-template-columns:1fr 1fr}}

.kk-demo{display:grid;grid-template-columns:1.4fr .85fr;gap:22px;align-items:stretch}
@media (max-width:960px){.kk-demo{grid-template-columns:1fr}}

.kk-stage{
  position:relative;overflow:hidden;border-radius:20px;
  min-height:460px;padding:22px;
  display:grid;grid-template-rows:auto 1fr auto;gap:16px;
  background:
    radial-gradient(ellipse at 20% 0%,rgba(255,140,80,.12),transparent 45%),
    radial-gradient(ellipse at 90% 100%,rgba(90,160,255,.12),transparent 40%),
    linear-gradient(160deg,#141621 0%,#0e1018 55%,#12141c 100%);
  --warm:.4;--cool:.2;--floor:.3;--air:.25;--amb:.5;--temp:22;
}
.kk-stage[data-mode="comfort"]{--warm:.35;--cool:.25;--floor:.4;--air:.35;--amb:.55;--temp:22}
.kk-stage[data-mode="heat"]{--warm:.95;--cool:.05;--floor:.65;--air:.15;--amb:.7;--temp:24}
.kk-stage[data-mode="cool"]{--warm:.06;--cool:.95;--floor:.08;--air:.5;--amb:.55;--temp:20}
.kk-stage[data-mode="floor"]{--warm:.5;--cool:.1;--floor:.98;--air:.2;--amb:.55;--temp:23}
.kk-stage[data-mode="air"]{--warm:.2;--cool:.4;--floor:.15;--air:.98;--amb:.65;--temp:21}
.kk-stage[data-mode="away"]{--warm:.1;--cool:.08;--floor:.05;--air:.12;--amb:.3;--temp:18}

.kk-stage-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;position:relative;z-index:2}
.kk-chips{display:flex;flex-wrap:wrap;gap:8px}
.kk-chip{
  display:flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);
  font:500 12px/1 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.65);
  transition:border-color .35s ease,background .35s ease,color .35s ease;
}
.kk-chip b{color:#CFC7FF;font-weight:700}
.kk-chip.is-hot{border-color:rgba(255,170,100,.4);background:rgba(255,140,60,.12);color:#FFE2C2}
.kk-chip.is-cold{border-color:rgba(120,180,255,.4);background:rgba(90,160,255,.12);color:#D7EBFF}
.kk-chip.is-live{border-color:rgba(169,154,255,.45);background:rgba(127,107,255,.16);color:#EEF0F6}

.kk-stage-mid{
  position:relative;z-index:2;display:grid;grid-template-columns:auto 1fr;gap:20px;align-items:center;
  min-height:240px;
}
@media (max-width:640px){.kk-stage-mid{grid-template-columns:1fr;justify-items:center}}

.kk-dial{
  position:relative;width:180px;height:180px;flex:0 0 auto;
  border-radius:50%;
  background:
    radial-gradient(circle at 50% 50%,rgba(20,22,32,.92) 0 58%,transparent 59%),
    conic-gradient(from 220deg,
      rgba(90,160,255,.85) 0deg,
      rgba(169,154,255,.9) 70deg,
      rgba(255,170,100,.9) 150deg,
      rgba(255,120,70,.5) 200deg,
      rgba(255,255,255,.08) 200deg 360deg);
  box-shadow:0 0 0 1px rgba(255,255,255,.1),0 20px 50px rgba(0,0,0,.35);
  transition:filter .5s ease,box-shadow .5s ease;
}
.kk-stage[data-mode="heat"] .kk-dial{filter:saturate(1.2) brightness(1.05);box-shadow:0 0 0 1px rgba(255,170,100,.25),0 0 40px rgba(255,140,60,.22)}
.kk-stage[data-mode="cool"] .kk-dial{filter:saturate(1.15) hue-rotate(-8deg);box-shadow:0 0 0 1px rgba(120,180,255,.28),0 0 40px rgba(90,160,255,.22)}
.kk-stage[data-mode="away"] .kk-dial{filter:saturate(.7) brightness(.85)}
.kk-dial-inner{
  position:absolute;inset:18px;border-radius:50%;
  background:linear-gradient(160deg,#171925,#0f1118);
  border:1px solid rgba(255,255,255,.08);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
}
.kk-dial-temp{
  font:800 clamp(40px,6vw,52px)/.95 'VelaSans',system-ui,sans-serif;
  background:linear-gradient(90deg,#CFC7FF,#7F6BFF);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  transition:transform .35s ease;
}
.kk-dial-temp span{font-size:.45em;margin-left:2px}
.kk-dial-label{margin-top:4px;font:500 12px/1.2 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.6)}
.kk-dial-needle{
  position:absolute;left:50%;top:50%;width:3px;height:72px;margin-left:-1.5px;margin-top:-72px;
  transform-origin:bottom center;border-radius:3px;
  background:linear-gradient(180deg,#CFC7FF,rgba(127,107,255,.2));
  box-shadow:0 0 12px rgba(169,154,255,.45);
  transition:transform .7s cubic-bezier(.4,0,.2,1);
  pointer-events:none;
}
.kk-stage[data-mode="comfort"] .kk-dial-needle{transform:rotate(8deg)}
.kk-stage[data-mode="heat"] .kk-dial-needle{transform:rotate(48deg)}
.kk-stage[data-mode="cool"] .kk-dial-needle{transform:rotate(-42deg)}
.kk-stage[data-mode="floor"] .kk-dial-needle{transform:rotate(28deg)}
.kk-stage[data-mode="air"] .kk-dial-needle{transform:rotate(-12deg)}
.kk-stage[data-mode="away"] .kk-dial-needle{transform:rotate(-58deg)}

.kk-plan{
  display:grid;grid-template-columns:1.2fr 1fr;grid-template-rows:1fr 1fr;gap:10px;width:100%;min-height:210px;
}
.kk-room-card{
  position:relative;overflow:hidden;border-radius:16px;padding:14px;
  background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);
  display:flex;flex-direction:column;justify-content:space-between;min-height:96px;
  transition:border-color .4s ease,background .4s ease,transform .35s ease,box-shadow .4s ease;
}
.kk-room-card::before{
  content:"";position:absolute;inset:auto 0 0 0;height:42%;
  background:linear-gradient(0deg,rgba(255,160,90,calc(var(--floor)*.45)),transparent);
  opacity:0;transition:opacity .5s ease;pointer-events:none;
}
.kk-room-card strong{position:relative;z-index:1;font:700 14px/1.2 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.kk-room-card span{position:relative;z-index:1;font:500 12px/1.3 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.55)}
.kk-room-card em{position:relative;z-index:1;font:800 18px/1 'VelaSans',system-ui,sans-serif;font-style:normal;color:#CFC7FF}
.kk-room-card.is-warm{background:rgba(255,140,60,.12);border-color:rgba(255,170,100,.35);box-shadow:inset 0 0 30px rgba(255,140,60,.08)}
.kk-room-card.is-cool{background:rgba(90,160,255,.12);border-color:rgba(120,180,255,.35);box-shadow:inset 0 0 30px rgba(90,160,255,.08)}
.kk-room-card.is-floor::before{opacity:1}
.kk-room-card.is-air{border-color:rgba(169,154,255,.4);background:rgba(127,107,255,.1)}
.kk-room-card.is-off{opacity:.55;filter:saturate(.6)}

.kk-fx{position:absolute;inset:0;pointer-events:none;z-index:1;overflow:hidden}
.kk-heat-bit,.kk-cool-bit{
  position:absolute;border-radius:50%;opacity:0;transition:opacity .4s ease;
}
.kk-heat-bit{
  width:8px;height:8px;background:radial-gradient(circle,#ffb36a,transparent 70%);
  animation:kkRise 2.8s ease-in infinite;
}
.kk-cool-bit{
  width:6px;height:14px;border-radius:8px;background:linear-gradient(180deg,rgba(180,220,255,.7),transparent);
  animation:kkFall 2.4s linear infinite;
}
.kk-stage[data-mode="heat"] .kk-heat-bit,
.kk-stage[data-mode="floor"] .kk-heat-bit{opacity:.85}
.kk-stage[data-mode="cool"] .kk-cool-bit,
.kk-stage[data-mode="air"] .kk-cool-bit{opacity:.75}
.kk-heat-bit:nth-child(1){left:18%;bottom:18%;animation-delay:0s}
.kk-heat-bit:nth-child(2){left:28%;bottom:22%;animation-delay:.4s}
.kk-heat-bit:nth-child(3){left:38%;bottom:16%;animation-delay:.9s}
.kk-heat-bit:nth-child(4){left:48%;bottom:24%;animation-delay:1.2s}
.kk-cool-bit:nth-child(5){left:55%;top:8%;animation-delay:0s}
.kk-cool-bit:nth-child(6){left:65%;top:4%;animation-delay:.5s}
.kk-cool-bit:nth-child(7){left:75%;top:10%;animation-delay:1s}
.kk-cool-bit:nth-child(8){left:85%;top:6%;animation-delay:1.4s}
@keyframes kkRise{0%{transform:translateY(0) scale(.7);opacity:0}20%{opacity:.9}100%{transform:translateY(-110px) scale(1.2);opacity:0}}
@keyframes kkFall{0%{transform:translateY(0);opacity:0}15%{opacity:.8}100%{transform:translateY(130px);opacity:0}}

.kk-stage-bot{position:relative;z-index:2}
.kk-systems{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
@media (max-width:560px){.kk-systems{grid-template-columns:1fr 1fr}}
.kk-sys{
  text-align:center;padding:10px 8px;border-radius:14px;
  background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);
  font:600 12px/1.2 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.5);
  transition:all .35s ease;
}
.kk-sys small{display:block;margin-top:4px;font:500 11px/1.2 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.4)}
.kk-sys.is-on{color:#fff;border-color:rgba(169,154,255,.45);background:rgba(127,107,255,.16)}
.kk-sys.is-on small{color:#CFC7FF}

.kk-panel{
  display:flex;flex-direction:column;gap:12px;
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.12);
  border-radius:20px;padding:22px;
}
.kk-panel h3{margin:0;font:700 20px/1.3 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.kk-panel > p{margin:0;font:400 14px/1.55 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}
.kk-modes{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:4px}
@media (max-width:520px){.kk-modes{grid-template-columns:1fr}}
.kk-mode{
  text-align:left;cursor:pointer;border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.03);border-radius:14px;padding:12px 14px;
  color:#eef0f6;transition:border-color .2s ease,background .2s ease,transform .2s ease;
}
.kk-mode:hover,.kk-mode.is-act{
  border-color:rgba(169,154,255,.55);background:rgba(127,107,255,.14);transform:translateY(-2px);
}
.kk-mode strong{display:block;font:600 14px/1.3 'VelaSans',system-ui,sans-serif;margin:0 0 3px;color:#fff}
.kk-mode span{display:block;font:400 12px/1.4 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.65)}
.kk-explain{
  margin-top:auto;padding:14px;border-radius:14px;
  background:linear-gradient(135deg,rgba(127,107,255,.16),rgba(85,72,170,.08));
  border:1px solid rgba(127,107,255,.28);
  min-height:96px;
}
.kk-explain h4{margin:0 0 6px;font:700 15px/1.3 'VelaSans',system-ui,sans-serif;color:#CFC7FF}
.kk-explain p{margin:0;font:400 13px/1.5 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.78)}

/* Сутки климата */
.kk-day{
  display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:6px;
}
@media (max-width:800px){.kk-day{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.kk-day{grid-template-columns:1fr}}
.kk-day-item{
  position:relative;overflow:hidden;border-radius:18px;padding:20px 18px;
  background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);
  transition:transform .2s ease,border-color .2s ease,background .2s ease;
}
.kk-day-item:hover{transform:translateY(-4px);border-color:rgba(127,107,255,.45);background:rgba(127,107,255,.1)}
.kk-day-time{font:700 12px/1 'VelaSans',system-ui,sans-serif;letter-spacing:.04em;text-transform:uppercase;color:#A99AFF;margin:0 0 10px}
.kk-day-item h3{margin:0 0 8px;font:700 17px/1.25 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.kk-day-item p{margin:0;font:400 13px/1.5 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}
.kk-day-temp{
  position:absolute;right:14px;top:14px;font:800 22px/1 'VelaSans',system-ui,sans-serif;
  background:linear-gradient(90deg,#CFC7FF,#7F6BFF);-webkit-background-clip:text;background-clip:text;color:transparent;
}

.kk-cases{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media (max-width:900px){.kk-cases{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.kk-cases{grid-template-columns:1fr}}
.kk-case{
  position:relative;overflow:hidden;min-height:210px;border-radius:18px;
  border:0;background:#14151b center/cover no-repeat;
  transition:transform .2s ease;
}
.kk-case::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(11,12,15,.2) 0%,rgba(11,12,15,.55) 45%,rgba(11,12,15,.92) 100%);
  transition:background .2s ease;
}
.kk-case:hover{transform:translateY(-5px)}
.kk-case:hover::before{background:linear-gradient(180deg,rgba(11,12,15,.2) 0%,rgba(85,72,170,.35) 50%,rgba(11,12,15,.94) 100%)}
.kk-case-body{position:relative;z-index:1;padding:20px;display:flex;flex-direction:column;justify-content:flex-end;height:100%;min-height:210px;border:0}
.kk-case h3{margin:0;font:700 17px/1.3 'VelaSans',system-ui,sans-serif;color:#fff}
.kk-case p{margin:8px 0 0;font:400 13px/1.5 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.82)}
.kk-case-tag{
  align-self:flex-start;margin:0 0 12px;font:600 11px/1 'VelaSans',system-ui,sans-serif;
  color:#CFC7FF;background:rgba(127,107,255,.22);border:1px solid rgba(127,107,255,.4);
  padding:6px 10px;border-radius:999px;
}

.kk-types{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
@media (max-width:900px){.kk-types{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.kk-types{grid-template-columns:1fr}}
.kk-type{
  padding:20px;border-radius:18px;background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.1);transition:transform .2s ease,border-color .2s ease;
}
.kk-type:hover{transform:translateY(-4px);border-color:rgba(127,107,255,.5)}
.kk-type-ic{
  width:44px;height:44px;border-radius:12px;margin:0 0 14px;
  display:grid;place-items:center;color:#CFC7FF;
  background:rgba(127,107,255,.16);border:1px solid rgba(127,107,255,.3);
}
.kk-type-ic svg{width:22px;height:22px}
.kk-type h3{margin:0 0 8px;font:700 16px/1.3 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.kk-type p{margin:0;font:400 13px/1.55 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}

.kk-checks{display:grid;gap:9px;margin:0;padding:0;list-style:none}
.kk-checks li{display:flex;gap:10px;align-items:flex-start;font:400 14px/1.5 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.85)}
.kk-checks li::before{
  content:"";flex:0 0 18px;height:18px;margin-top:1px;border-radius:50%;
  border:1px solid rgba(169,154,255,.45);
  background:rgba(169,154,255,.18) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23A99AFF" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"><path d="M20 6 9 17l-5-5"/></svg>') center/10px no-repeat;
}

.kk-benefits{display:grid;grid-template-columns:1.1fr 1fr;gap:22px;align-items:center}
@media (max-width:800px){.kk-benefits{grid-template-columns:1fr}}
.kk-benefits-visual{
  min-height:280px;border-radius:20px;border:0;
  background:#14151b center/cover no-repeat;position:relative;overflow:hidden;
}
.kk-benefits-visual::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 30%,rgba(12,12,18,.75));
}

.kk-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;counter-reset:kk}
.kk-step{position:relative;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.10);border-radius:18px;padding:24px 20px;transition:transform .2s ease,border-color .2s ease}
.kk-step:hover{transform:translateY(-4px);border-color:rgba(127,107,255,.5)}
.kk-step::before{counter-increment:kk;content:"0" counter(kk);display:block;font:800 28px/1 'VelaSans',system-ui,sans-serif;background:linear-gradient(90deg,#CFC7FF,#7F6BFF);-webkit-background-clip:text;background-clip:text;color:transparent;margin:0 0 12px}
.kk-step h3{margin:0 0 8px;font:700 16px/1.3 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.kk-step p{margin:0;font:400 13px/1.55 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}
@media (max-width:900px){.kk-steps{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.kk-steps{grid-template-columns:1fr}}

.kk-cta{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;padding:30px;border-radius:20px;background:linear-gradient(135deg,rgba(127,107,255,.18),rgba(85,72,170,.10));border:1px solid rgba(127,107,255,.30)}
.kk-cta h3{margin:0;font:700 clamp(20px,2.6vw,26px)/1.2 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.kk-cta p{margin:8px 0 0;max-width:560px;font:400 15px/1.55 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.74)}
.kk-cta-btns{display:flex;flex-wrap:wrap;gap:12px}
@media (max-width:520px){.kk-cta-btns{width:100%}.kk-cta .kk-btn{width:100%}}


/* ---- bezopasnost-page.css ---- */
/* Системы безопасности */

body:has(.bz-hero-full){overflow-x:hidden}
.uni-main:has(.bz-hero-full){padding-top:0}
.uni-main:has(.bz-hero-full) .uni-wrap:first-child{padding-top:0}
.uni-main:has(.bz-hero-full) .uni-title{display:none}
.uni-main .uni-wrap > .bz-hero-full{margin-top:0 !important}

.bz-sec{padding:20px 0}
.bz-h2{margin:0 0 12px;font:700 clamp(22px,3vw,32px)/1.2 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.bz-sub{margin:0 0 22px;max-width:820px;font:400 clamp(14px,1.6vw,17px)/1.6 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}
.bz-btn{cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;font:600 16px/1 'VelaSans',system-ui,sans-serif;color:#fff;border:0;padding:16px 28px;border-radius:14px;background:linear-gradient(90deg,#7F6BFF,#5548AA);box-shadow:0 8px 24px rgba(127,107,255,.35);transition:filter .15s ease,transform .15s ease;text-decoration:none}
.bz-btn:hover{filter:brightness(1.08);transform:translateY(-2px)}
.bz-btn--ghost{background:transparent;border:1px solid rgba(255,255,255,.35);box-shadow:none}
.bz-btn--ghost:hover{background:rgba(255,255,255,.08)}

.bz-hero-full{position:relative;left:50%;right:50%;width:100vw;margin-left:-50vw;margin-right:-50vw;height:600px;min-height:500px;display:flex;align-items:center;overflow:hidden;color:#eef0f6;background:#0e1018 center/cover no-repeat}
.bz-hero-overlay{position:absolute;inset:0;background:linear-gradient(105deg,rgba(8,10,16,.82) 0%,rgba(8,10,16,.55) 48%,rgba(8,10,16,.35) 100%);z-index:1}
.bz-hero-in{position:relative;z-index:2;width:1600px;max-width:88%;margin:0 auto;padding:0 20px}
.bz-hero-title{margin:0 0 18px;max-width:900px;font:600 clamp(30px,5vw,48px)/1.12 'VelaSans',system-ui,sans-serif;letter-spacing:-.6px;color:#fff}
.bz-hero-lead{margin:0 0 34px;max-width:680px;font:400 clamp(17px,2vw,24px)/1.3 'VelaSans',system-ui,sans-serif;color:#c8c8d2}
.bz-hero-actions{display:flex;flex-wrap:wrap;gap:16px}
.bz-hero-actions .btn{padding:15px 28px !important;min-width:210px;justify-content:center}
@media (max-width:600px){.bz-hero-full{height:auto;min-height:0;padding:96px 0 64px}.bz-hero-actions .btn{min-width:0;width:100%}}

.bz-sec--stats{position:relative;z-index:5;margin-top:-56px;padding-top:0;padding-bottom:8px}
@media (max-width:600px){.bz-sec--stats{margin-top:-36px}}
.bz-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:0;padding:22px;border-radius:20px;background:linear-gradient(135deg,rgba(20,22,32,.92),rgba(18,16,28,.88));border:1px solid rgba(127,107,255,.28);backdrop-filter:blur(12px);box-shadow:0 16px 40px rgba(0,0,0,.35)}
.bz-stat{text-align:center;padding:8px;border-radius:14px;transition:transform .25s ease,background .25s ease}
.bz-stat:hover{transform:translateY(-4px);background:rgba(255,255,255,.05)}
.bz-stat-num{font:800 clamp(26px,3.6vw,42px)/1 'VelaSans',system-ui,sans-serif;background:linear-gradient(90deg,#CFC7FF,#7F6BFF);-webkit-background-clip:text;background-clip:text;color:transparent}
.bz-stat-label{margin:8px 0 0;font:500 13px/1.4 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.72)}
@media (max-width:760px){.bz-stats{grid-template-columns:1fr 1fr}}

.bz-demo{display:grid;grid-template-columns:1.4fr .85fr;gap:22px;align-items:stretch}
@media (max-width:960px){.bz-demo{grid-template-columns:1fr}}

.bz-stage{
  position:relative;overflow:hidden;border-radius:20px;min-height:460px;padding:20px;
  display:grid;grid-template-rows:auto 1fr auto;gap:14px;
  background:
    radial-gradient(ellipse at 15% 0%,rgba(127,107,255,.14),transparent 42%),
    radial-gradient(ellipse at 90% 100%,rgba(90,200,140,.08),transparent 40%),
    linear-gradient(160deg,#141621 0%,#0e1018 55%,#12141c 100%);
  transition:background .5s ease;
}
.bz-stage[data-mode="alarm"]{
  background:
    radial-gradient(ellipse at 50% 20%,rgba(255,80,80,.18),transparent 50%),
    linear-gradient(160deg,#1a1214,#0e1018 55%,#12141c);
}
.bz-stage[data-mode="leak"]{
  background:
    radial-gradient(ellipse at 70% 80%,rgba(90,170,255,.16),transparent 45%),
    linear-gradient(160deg,#12161c,#0e1018 55%,#12141c);
}
.bz-stage[data-mode="away"],.bz-stage[data-mode="night"]{
  background:
    radial-gradient(ellipse at 20% 0%,rgba(127,107,255,.2),transparent 45%),
    linear-gradient(160deg,#141621,#0e1018 55%,#12141c);
}

.bz-top{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;position:relative;z-index:2}
.bz-shield{
  display:flex;align-items:center;gap:12px;padding:10px 14px;border-radius:16px;
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);
  transition:border-color .4s ease,background .4s ease,box-shadow .4s ease;
}
.bz-shield-ic{
  width:42px;height:42px;border-radius:12px;display:grid;place-items:center;
  background:rgba(127,107,255,.18);color:#CFC7FF;transition:background .4s ease,color .4s ease;
}
.bz-shield-ic svg{width:22px;height:22px}
.bz-shield strong{display:block;font:700 15px/1.2 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.bz-shield span{display:block;font:500 12px/1.3 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.55);margin-top:2px}
.bz-stage[data-mode="home"] .bz-shield,.bz-stage[data-mode="away"] .bz-shield,.bz-stage[data-mode="night"] .bz-shield{
  border-color:rgba(100,210,150,.35);background:rgba(80,180,120,.1);box-shadow:0 0 24px rgba(80,180,120,.12);
}
.bz-stage[data-mode="home"] .bz-shield-ic,.bz-stage[data-mode="away"] .bz-shield-ic,.bz-stage[data-mode="night"] .bz-shield-ic{
  background:rgba(80,180,120,.2);color:#B8F0D0;
}
.bz-stage[data-mode="off"] .bz-shield{border-color:rgba(255,255,255,.12)}
.bz-stage[data-mode="alarm"] .bz-shield{
  border-color:rgba(255,110,110,.5);background:rgba(255,80,80,.14);box-shadow:0 0 28px rgba(255,80,80,.2);
  animation:bzPulse 1.2s ease-in-out infinite;
}
.bz-stage[data-mode="alarm"] .bz-shield-ic{background:rgba(255,90,90,.25);color:#FFC0C0}
.bz-stage[data-mode="leak"] .bz-shield{
  border-color:rgba(120,180,255,.45);background:rgba(90,160,255,.12);
}
.bz-stage[data-mode="leak"] .bz-shield-ic{background:rgba(90,160,255,.22);color:#D7EBFF}
@keyframes bzPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.015)}}

.bz-pill{
  display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:999px;
  font:600 12px/1 'VelaSans',system-ui,sans-serif;
  background:rgba(127,107,255,.16);border:1px solid rgba(127,107,255,.35);color:#CFC7FF;
}
.bz-stage[data-mode="alarm"] .bz-pill{background:rgba(255,80,80,.16);border-color:rgba(255,120,120,.4);color:#FFC0C0}
.bz-stage[data-mode="leak"] .bz-pill{background:rgba(90,160,255,.16);border-color:rgba(120,180,255,.4);color:#D7EBFF}
.bz-stage[data-mode="home"] .bz-pill,.bz-stage[data-mode="away"] .bz-pill,.bz-stage[data-mode="night"] .bz-pill{
  background:rgba(80,180,120,.14);border-color:rgba(100,210,150,.35);color:#B8F0D0;
}

.bz-mid{position:relative;z-index:2;display:grid;grid-template-columns:1.2fr .9fr;gap:14px;min-height:260px}
@media (max-width:700px){.bz-mid{grid-template-columns:1fr}}

.bz-map{
  position:relative;border-radius:18px;min-height:250px;overflow:hidden;
  background:
    linear-gradient(135deg,rgba(255,255,255,.03),rgba(255,255,255,.01)),
    #161822;
  border:1px solid rgba(255,255,255,.08);
}
.bz-map-grid{
  position:absolute;inset:16px;display:grid;grid-template-columns:1.1fr 1fr;grid-template-rows:1fr 1fr;gap:8px;
}
.bz-cell{
  position:relative;border-radius:12px;background:rgba(255,255,255,.03);
  border:1px dashed rgba(255,255,255,.1);padding:10px;
  transition:border-color .35s ease,background .35s ease,box-shadow .35s ease;
}
.bz-cell strong{display:block;font:700 12px/1.2 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}
.bz-cell.is-watch{border-style:solid;border-color:rgba(169,154,255,.4);background:rgba(127,107,255,.1)}
.bz-cell.is-ok{border-style:solid;border-color:rgba(100,210,150,.35);background:rgba(80,180,120,.08)}
.bz-cell.is-alert{border-style:solid;border-color:rgba(255,110,110,.5);background:rgba(255,80,80,.12);box-shadow:inset 0 0 24px rgba(255,80,80,.1)}
.bz-cell.is-water{border-style:solid;border-color:rgba(120,180,255,.45);background:rgba(90,160,255,.12)}

.bz-dot{
  position:absolute;width:12px;height:12px;border-radius:50%;z-index:2;
  background:#A99AFF;box-shadow:0 0 0 4px rgba(169,154,255,.2);
  transition:background .35s ease,box-shadow .35s ease,transform .35s ease;
}
.bz-dot::after{
  content:attr(data-label);position:absolute;left:50%;bottom:calc(100% + 6px);transform:translateX(-50%);
  white-space:nowrap;padding:4px 8px;border-radius:8px;
  background:rgba(12,14,20,.85);border:1px solid rgba(255,255,255,.1);
  font:600 10px/1 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.8);
  opacity:0;pointer-events:none;transition:opacity .2s ease;
}
.bz-dot:hover::after,.bz-dot.is-on::after{opacity:1}
.bz-dot.is-on{background:#7DDBA8;box-shadow:0 0 0 4px rgba(125,219,168,.25)}
.bz-dot.is-alert{background:#FF7A7A;box-shadow:0 0 0 5px rgba(255,120,120,.28);animation:bzBlink 1s ease-in-out infinite}
.bz-dot.is-water{background:#5AA8FF;box-shadow:0 0 0 5px rgba(90,168,255,.28);animation:bzBlink 1.2s ease-in-out infinite}
@keyframes bzBlink{0%,100%{transform:scale(1)}50%{transform:scale(1.25)}}

.bz-dot--door{left:8%;top:48%}
.bz-dot--win1{left:42%;top:12%}
.bz-dot--win2{right:12%;top:18%}
.bz-dot--motion{left:55%;top:52%}
.bz-dot--leak{left:22%;bottom:14%}
.bz-dot--smoke{right:28%;top:40%}
.bz-dot--cam{right:10%;bottom:16%}

.bz-side{display:flex;flex-direction:column;gap:10px}
.bz-sensors{display:grid;gap:8px}
.bz-sensor{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:10px 12px;border-radius:12px;
  background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);
  font:600 13px/1.2 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.65);
  transition:all .35s ease;
}
.bz-sensor small{font:500 11px/1 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.4)}
.bz-sensor.is-ok{border-color:rgba(100,210,150,.35);color:#EEF0F6;background:rgba(80,180,120,.1)}
.bz-sensor.is-ok small{color:#7DDBA8}
.bz-sensor.is-alert{border-color:rgba(255,110,110,.45);color:#EEF0F6;background:rgba(255,80,80,.12)}
.bz-sensor.is-alert small{color:#FF9B9B}
.bz-sensor.is-water{border-color:rgba(120,180,255,.4);color:#EEF0F6;background:rgba(90,160,255,.12)}
.bz-sensor.is-water small{color:#8EB6FF}
.bz-sensor.is-off{opacity:.55}

.bz-feed{
  margin-top:auto;padding:12px;border-radius:14px;min-height:84px;
  background:rgba(0,0,0,.25);border:1px solid rgba(255,255,255,.08);
}
.bz-feed-title{margin:0 0 8px;font:600 11px/1 'VelaSans',system-ui,sans-serif;letter-spacing:.04em;text-transform:uppercase;color:rgba(238,240,246,.45)}
.bz-feed-item{font:500 12px/1.45 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.75);margin:0 0 4px}
.bz-feed-item b{color:#CFC7FF;font-weight:600}
.bz-stage[data-mode="alarm"] .bz-feed-item b{color:#FF9B9B}
.bz-stage[data-mode="leak"] .bz-feed-item b{color:#8EB6FF}

.bz-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;position:relative;z-index:2}
@media (max-width:560px){.bz-actions{grid-template-columns:1fr 1fr}}
.bz-act{
  text-align:center;padding:10px 8px;border-radius:12px;
  background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);
  font:600 12px/1.2 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.5);
  transition:all .35s ease;
}
.bz-act small{display:block;margin-top:4px;font:500 11px/1.2 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.35)}
.bz-act.is-on{color:#fff;border-color:rgba(169,154,255,.45);background:rgba(127,107,255,.16)}
.bz-act.is-on small{color:#CFC7FF}
.bz-stage[data-mode="alarm"] .bz-act.is-on{border-color:rgba(255,120,120,.45);background:rgba(255,80,80,.14)}
.bz-stage[data-mode="alarm"] .bz-act.is-on small{color:#FFC0C0}

.bz-panel{
  display:flex;flex-direction:column;gap:12px;
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.12);
  border-radius:20px;padding:22px;
}
.bz-panel h3{margin:0;font:700 20px/1.3 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.bz-panel > p{margin:0;font:400 14px/1.55 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}
.bz-modes{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:4px}
@media (max-width:520px){.bz-modes{grid-template-columns:1fr}}
.bz-mode{
  text-align:left;cursor:pointer;border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.03);border-radius:14px;padding:12px 14px;
  color:#eef0f6;transition:border-color .2s ease,background .2s ease,transform .2s ease;
}
.bz-mode:hover,.bz-mode.is-act{
  border-color:rgba(169,154,255,.55);background:rgba(127,107,255,.14);transform:translateY(-2px);
}
.bz-mode strong{display:block;font:600 14px/1.3 'VelaSans',system-ui,sans-serif;margin:0 0 3px;color:#fff}
.bz-mode span{display:block;font:400 12px/1.4 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.65)}
.bz-explain{
  margin-top:auto;padding:14px;border-radius:14px;
  background:linear-gradient(135deg,rgba(127,107,255,.16),rgba(85,72,170,.08));
  border:1px solid rgba(127,107,255,.28);min-height:96px;
}
.bz-explain h4{margin:0 0 6px;font:700 15px/1.3 'VelaSans',system-ui,sans-serif;color:#CFC7FF}
.bz-explain p{margin:0;font:400 13px/1.5 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.78)}

.bz-layers{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;counter-reset:bzlayer}
@media (max-width:900px){.bz-layers{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.bz-layers{grid-template-columns:1fr}}
.bz-layer{
  position:relative;overflow:hidden;border-radius:18px;padding:22px 18px;
  background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);
  transition:transform .2s ease,border-color .2s ease,background .2s ease;
}
.bz-layer:hover{transform:translateY(-4px);border-color:rgba(127,107,255,.45);background:rgba(127,107,255,.1)}
.bz-layer::before{
  counter-increment:bzlayer;content:"0" counter(bzlayer);
  display:block;font:800 24px/1 'VelaSans',system-ui,sans-serif;
  background:linear-gradient(90deg,#CFC7FF,#7F6BFF);-webkit-background-clip:text;background-clip:text;color:transparent;margin:0 0 12px;
}
.bz-layer h3{margin:0 0 8px;font:700 16px/1.25 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.bz-layer p{margin:0;font:400 13px/1.5 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}

.bz-cases{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media (max-width:900px){.bz-cases{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.bz-cases{grid-template-columns:1fr}}
.bz-case{
  position:relative;overflow:hidden;min-height:210px;border-radius:18px;
  border:0;background:#14151b center/cover no-repeat;transition:transform .2s ease;
}
.bz-case::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(11,12,15,.2) 0%,rgba(11,12,15,.55) 45%,rgba(11,12,15,.92) 100%);
  transition:background .2s ease;
}
.bz-case:hover{transform:translateY(-5px)}
.bz-case:hover::before{background:linear-gradient(180deg,rgba(11,12,15,.2) 0%,rgba(85,72,170,.35) 50%,rgba(11,12,15,.94) 100%)}
.bz-case-body{position:relative;z-index:1;padding:20px;display:flex;flex-direction:column;justify-content:flex-end;height:100%;min-height:210px;border:0}
.bz-case h3{margin:0;font:700 17px/1.3 'VelaSans',system-ui,sans-serif;color:#fff}
.bz-case p{margin:8px 0 0;font:400 13px/1.5 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.82)}
.bz-case-tag{
  align-self:flex-start;margin:0 0 12px;font:600 11px/1 'VelaSans',system-ui,sans-serif;
  color:#CFC7FF;background:rgba(127,107,255,.22);border:1px solid rgba(127,107,255,.4);
  padding:6px 10px;border-radius:999px;
}

.bz-types{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
@media (max-width:900px){.bz-types{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.bz-types{grid-template-columns:1fr}}
.bz-type{
  padding:20px;border-radius:18px;background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.1);transition:transform .2s ease,border-color .2s ease;
}
.bz-type:hover{transform:translateY(-4px);border-color:rgba(127,107,255,.5)}
.bz-type-ic{
  width:44px;height:44px;border-radius:12px;margin:0 0 14px;
  display:grid;place-items:center;color:#CFC7FF;
  background:rgba(127,107,255,.16);border:1px solid rgba(127,107,255,.3);
}
.bz-type-ic svg{width:22px;height:22px}
.bz-type h3{margin:0 0 8px;font:700 16px/1.3 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.bz-type p{margin:0;font:400 13px/1.55 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}

.bz-checks{display:grid;gap:9px;margin:0;padding:0;list-style:none}
.bz-checks li{display:flex;gap:10px;align-items:flex-start;font:400 14px/1.5 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.85)}
.bz-checks li::before{
  content:"";flex:0 0 18px;height:18px;margin-top:1px;border-radius:50%;
  border:1px solid rgba(169,154,255,.45);
  background:rgba(169,154,255,.18) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23A99AFF" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"><path d="M20 6 9 17l-5-5"/></svg>') center/10px no-repeat;
}

.bz-benefits{display:grid;grid-template-columns:1.1fr 1fr;gap:22px;align-items:center}
@media (max-width:800px){.bz-benefits{grid-template-columns:1fr}}
.bz-benefits-visual{
  min-height:280px;border-radius:20px;border:0;
  background:#14151b center/cover no-repeat;position:relative;overflow:hidden;
}
.bz-benefits-visual::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 30%,rgba(12,12,18,.75));
}

.bz-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;counter-reset:bz}
.bz-step{position:relative;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.10);border-radius:18px;padding:24px 20px;transition:transform .2s ease,border-color .2s ease}
.bz-step:hover{transform:translateY(-4px);border-color:rgba(127,107,255,.5)}
.bz-step::before{counter-increment:bz;content:"0" counter(bz);display:block;font:800 28px/1 'VelaSans',system-ui,sans-serif;background:linear-gradient(90deg,#CFC7FF,#7F6BFF);-webkit-background-clip:text;background-clip:text;color:transparent;margin:0 0 12px}
.bz-step h3{margin:0 0 8px;font:700 16px/1.3 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.bz-step p{margin:0;font:400 13px/1.55 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}
@media (max-width:900px){.bz-steps{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.bz-steps{grid-template-columns:1fr}}

.bz-cta{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;padding:30px;border-radius:20px;background:linear-gradient(135deg,rgba(127,107,255,.18),rgba(85,72,170,.10));border:1px solid rgba(127,107,255,.30)}
.bz-cta h3{margin:0;font:700 clamp(20px,2.6vw,26px)/1.2 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.bz-cta p{margin:8px 0 0;max-width:560px;font:400 15px/1.55 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.74)}
.bz-cta-btns{display:flex;flex-wrap:wrap;gap:12px}
@media (max-width:520px){.bz-cta-btns{width:100%}.bz-cta .bz-btn{width:100%}}


/* ---- shtory-page.css ---- */
/* Управление шторами и жалюзи */

body:has(.sz-hero-full){overflow-x:hidden}
.uni-main:has(.sz-hero-full){padding-top:0}
.uni-main:has(.sz-hero-full) .uni-wrap:first-child{padding-top:0}
.uni-main:has(.sz-hero-full) .uni-title{display:none}
.uni-main .uni-wrap > .sz-hero-full{margin-top:0 !important}

.sz-sec{padding:28px 0}
.sz-h2{margin:0 0 12px;font:700 clamp(22px,3vw,32px)/1.2 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.sz-sub{margin:0 0 22px;max-width:820px;font:400 clamp(14px,1.6vw,17px)/1.6 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}
.sz-btn{cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;font:600 16px/1 'VelaSans',system-ui,sans-serif;color:#fff;border:0;padding:16px 28px;border-radius:14px;background:linear-gradient(90deg,#7F6BFF,#5548AA);box-shadow:0 8px 24px rgba(127,107,255,.35);transition:filter .15s ease,transform .15s ease;text-decoration:none}
.sz-btn:hover{filter:brightness(1.08);transform:translateY(-2px)}
.sz-btn--ghost{background:transparent;border:1px solid rgba(255,255,255,.35);box-shadow:none}
.sz-btn--ghost:hover{background:rgba(255,255,255,.08)}

.sz-hero-full{position:relative;left:50%;right:50%;width:100vw;margin-left:-50vw;margin-right:-50vw;height:600px;min-height:500px;display:flex;align-items:center;overflow:hidden;color:#eef0f6;background:#0e1018 center/cover no-repeat}
.sz-hero-overlay{position:absolute;inset:0;background:linear-gradient(105deg,rgba(8,10,16,.82) 0%,rgba(8,10,16,.55) 48%,rgba(8,10,16,.35) 100%);z-index:1}
.sz-hero-in{position:relative;z-index:2;width:1600px;max-width:88%;margin:0 auto;padding:0 20px 48px}

.sz-hero-kicker{display:inline-flex;align-items:center;gap:8px;margin:0 0 16px;padding:7px 12px;border-radius:999px;font:600 12px/1 'VelaSans',system-ui,sans-serif;letter-spacing:.04em;text-transform:uppercase;color:#CFC7FF;background:rgba(127,107,255,.16);border:1px solid rgba(127,107,255,.35)}
.sz-hero-kicker i{width:8px;height:8px;border-radius:50%;background:#7DDBA8;box-shadow:0 0 0 0 rgba(125,219,168,.7);animation:szPulse 1.8s ease infinite}
@keyframes szPulse{0%{box-shadow:0 0 0 0 rgba(125,219,168,.65)}70%{box-shadow:0 0 0 10px rgba(125,219,168,0)}100%{box-shadow:0 0 0 0 rgba(125,219,168,0)}}
.sz-hero-title{margin:0 0 18px;max-width:860px;font:600 clamp(30px,5vw,48px)/1.12 'VelaSans',system-ui,sans-serif;letter-spacing:-.6px;color:#fff}
.sz-hero-lead{margin:0 0 34px;max-width:660px;font:400 clamp(17px,2vw,24px)/1.3 'VelaSans',system-ui,sans-serif;color:#c8c8d2}
.sz-hero-actions{display:flex;flex-wrap:wrap;gap:16px}
.sz-hero-actions .btn{padding:15px 28px !important;min-width:210px;justify-content:center}
@media (max-width:600px){.sz-hero-full{height:auto;min-height:0;padding:96px 0 80px}.sz-hero-actions .btn{min-width:0;width:100%}}

.sz-sec--stats{position:relative;z-index:5;margin-top:-56px;padding-top:0;padding-bottom:8px}
@media (max-width:600px){.sz-sec--stats{margin-top:-36px}}
.sz-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:0;padding:22px;border-radius:20px;background:linear-gradient(135deg,rgba(20,22,32,.96),rgba(18,16,28,.94));border:1px solid rgba(127,107,255,.28);backdrop-filter:blur(12px);box-shadow:0 16px 40px rgba(0,0,0,.35)}

.sz-stat{text-align:center;padding:8px;border-radius:14px;transition:transform .25s ease,background .25s ease}
.sz-stat:hover{transform:translateY(-4px);background:rgba(255,255,255,.05)}
.sz-stat-num{font:800 clamp(26px,3.6vw,42px)/1 'VelaSans',system-ui,sans-serif;background:linear-gradient(90deg,#CFC7FF,#7F6BFF);-webkit-background-clip:text;background-clip:text;color:transparent}
.sz-stat-label{margin:8px 0 0;font:500 13px/1.4 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.72)}
@media (max-width:760px){.sz-stats{grid-template-columns:1fr 1fr}}

/* Interactive curtain stage */
.sz-demo{display:grid;grid-template-columns:1.35fr .9fr;gap:22px;align-items:stretch}
@media (max-width:900px){.sz-demo{grid-template-columns:1fr}}

.sz-stage{
  position:relative;overflow:hidden;border-radius:20px;border:1px solid rgba(255,255,255,.12);
  min-height:420px;background:#12141c;
  --open: .28;
  --tilt: 0deg;
  --glow: .55;
}
.sz-stage[data-mode="morning"]{--open:.92;--tilt:0deg;--glow:.95}
.sz-stage[data-mode="cinema"]{--open:.06;--tilt:0deg;--glow:.18}
.sz-stage[data-mode="sun"]{--open:.42;--tilt:55deg;--glow:.7}
.sz-stage[data-mode="away"]{--open:.08;--tilt:0deg;--glow:.22}
.sz-stage[data-mode="energy"]{--open:.2;--tilt:35deg;--glow:.35}
.sz-stage[data-mode="privacy"]{--open:.12;--tilt:0deg;--glow:.25}

.sz-room{
  position:absolute;inset:0;
  background:
    linear-gradient(180deg,rgba(18,20,28,.15),rgba(18,20,28,.55)),
    url('https://test.maybesmart.ru/wp-content/themes/maybesmart/assets/images/kv2.jpg') center/cover no-repeat;
}
.sz-window{
  position:absolute;left:12%;right:12%;top:10%;bottom:18%;
  border-radius:10px;overflow:hidden;
  box-shadow:0 0 0 1px rgba(255,255,255,.18),0 20px 50px rgba(0,0,0,.45);
  background:#1a2230;
}
.sz-sky{
  position:absolute;inset:0;
  background:
    radial-gradient(ellipse at 50% 20%,rgba(255,220,160,calc(var(--glow)*.55)),transparent 55%),
    linear-gradient(180deg,#7aa7d9 0%,#c9dff5 42%,#e8f0fa 100%);
  transition:opacity .7s ease,filter .7s ease;
  filter:brightness(calc(.45 + var(--glow)*.7));
}
.sz-view{
  position:absolute;inset:0;
  background:url('https://test.maybesmart.ru/wp-content/themes/maybesmart/assets/images/gruziadom.jpeg') center/cover no-repeat;
  opacity:calc(.25 + var(--glow)*.55);
  transition:opacity .7s ease;
  mix-blend-mode:soft-light;
}
.sz-glass{
  position:absolute;inset:0;
  background:linear-gradient(120deg,rgba(255,255,255,.18),transparent 40%,rgba(255,255,255,.06));
  pointer-events:none;
}
.sz-sill{
  position:absolute;left:8%;right:8%;bottom:12%;height:18px;border-radius:6px;
  background:linear-gradient(180deg,#2a2d38,#1a1c24);
  box-shadow:0 8px 20px rgba(0,0,0,.35);
}

.sz-curtain{
  position:absolute;top:0;bottom:0;width:54%;
  background:
    repeating-linear-gradient(90deg,
      #3a2f6b 0px,#3a2f6b 10px,
      #2f2758 10px,#2f2758 20px);
  box-shadow:inset -10px 0 24px rgba(0,0,0,.35),0 10px 30px rgba(0,0,0,.35);
  transition:transform .85s cubic-bezier(.4,0,.2,1),filter .6s ease;
  z-index:2;
}
.sz-curtain::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(255,255,255,.08),transparent 30%,rgba(0,0,0,.25));
  pointer-events:none;
}
.sz-curtain::after{
  content:"";position:absolute;top:0;bottom:0;width:14px;
  background:linear-gradient(90deg,rgba(207,199,255,.35),rgba(85,72,170,.1));
  opacity:.7;
}
.sz-curtain--left{left:0;transform-origin:left center;transform:scaleX(calc(1 - var(--open)*.85));border-radius:0 4px 4px 0}
.sz-curtain--left::after{right:0}
.sz-curtain--right{right:0;transform-origin:right center;transform:scaleX(calc(1 - var(--open)*.85));border-radius:4px 0 0 4px}
.sz-curtain--right::after{left:0}

.sz-blinds{
  position:absolute;inset:4% 6%;
  display:flex;flex-direction:column;gap:3px;z-index:1;
  pointer-events:none;opacity:0;transition:opacity .45s ease;
}
.sz-stage[data-mode="sun"] .sz-blinds,
.sz-stage[data-mode="energy"] .sz-blinds{opacity:.9}
.sz-slat{
  flex:1;border-radius:2px;
  background:linear-gradient(180deg,rgba(230,232,240,.55),rgba(170,175,190,.35));
  transform:rotateX(var(--tilt));
  transform-origin:center top;
  transition:transform .7s ease;
  box-shadow:0 1px 0 rgba(255,255,255,.25);
}

.sz-rail{
  position:absolute;left:10%;right:10%;top:8.5%;height:8px;z-index:3;
  border-radius:4px;background:linear-gradient(180deg,#cfc7ff,#7f6bff);
  box-shadow:0 4px 14px rgba(127,107,255,.35);
}

.sz-hint{
  position:absolute;left:16px;right:16px;bottom:16px;z-index:4;
  padding:12px 14px;border-radius:12px;
  background:rgba(12,14,20,.72);border:1px solid rgba(255,255,255,.12);
  backdrop-filter:blur(8px);
  font:500 13px/1.4 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.82);
}
.sz-hint b{color:#CFC7FF;font-weight:600}

.sz-panel{
  display:flex;flex-direction:column;gap:12px;
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.12);
  border-radius:20px;padding:22px;
}
.sz-panel h3{margin:0;font:700 20px/1.3 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.sz-panel > p{margin:0;font:400 14px/1.55 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}
.sz-modes{display:grid;gap:10px;margin-top:4px}
.sz-mode{
  text-align:left;cursor:pointer;border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.03);border-radius:14px;padding:12px 14px;
  color:#eef0f6;transition:border-color .2s ease,background .2s ease,transform .2s ease;
}
.sz-mode:hover,.sz-mode.is-act{
  border-color:rgba(169,154,255,.55);background:rgba(127,107,255,.14);transform:translateX(3px);
}
.sz-mode strong{display:block;font:600 15px/1.3 'VelaSans',system-ui,sans-serif;margin:0 0 4px;color:#fff}
.sz-mode span{display:block;font:400 13px/1.45 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}
.sz-explain{
  margin-top:auto;padding:14px;border-radius:14px;
  background:linear-gradient(135deg,rgba(127,107,255,.16),rgba(85,72,170,.08));
  border:1px solid rgba(127,107,255,.28);
  min-height:96px;
}
.sz-explain h4{margin:0 0 6px;font:700 15px/1.3 'VelaSans',system-ui,sans-serif;color:#CFC7FF}
.sz-explain p{margin:0;font:400 13px/1.5 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.78)}

/* Use cases */
.sz-cases{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media (max-width:900px){.sz-cases{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.sz-cases{grid-template-columns:1fr}}
.sz-case{
  position:relative;overflow:hidden;min-height:210px;border-radius:18px;
  border:1px solid rgba(255,255,255,.12);background:#14151b center/cover no-repeat;
  transition:transform .2s ease,border-color .2s ease;
}
.sz-case::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(11,12,15,.2) 0%,rgba(11,12,15,.55) 45%,rgba(11,12,15,.92) 100%);
  transition:background .2s ease;
}
.sz-case:hover{transform:translateY(-5px);border-color:rgba(127,107,255,.55)}
.sz-case:hover::before{background:linear-gradient(180deg,rgba(11,12,15,.2) 0%,rgba(85,72,170,.35) 50%,rgba(11,12,15,.94) 100%)}
.sz-case-body{position:relative;z-index:1;padding:20px;display:flex;flex-direction:column;justify-content:flex-end;height:100%;min-height:210px}
.sz-case h3{margin:0;font:700 17px/1.3 'VelaSans',system-ui,sans-serif;color:#fff}
.sz-case p{margin:8px 0 0;font:400 13px/1.5 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.82)}
.sz-case-tag{
  align-self:flex-start;margin:0 0 12px;font:600 11px/1 'VelaSans',system-ui,sans-serif;
  color:#CFC7FF;background:rgba(127,107,255,.22);border:1px solid rgba(127,107,255,.4);
  padding:6px 10px;border-radius:999px;
}

/* Types */
.sz-types{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
@media (max-width:900px){.sz-types{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.sz-types{grid-template-columns:1fr}}
.sz-type{
  padding:20px;border-radius:18px;background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.1);transition:transform .2s ease,border-color .2s ease;
}
.sz-type:hover{transform:translateY(-4px);border-color:rgba(127,107,255,.5)}
.sz-type-ic{
  width:44px;height:44px;border-radius:12px;margin:0 0 14px;
  display:grid;place-items:center;color:#CFC7FF;
  background:rgba(127,107,255,.16);border:1px solid rgba(127,107,255,.3);
}
.sz-type-ic svg{width:22px;height:22px}
.sz-type h3{margin:0 0 8px;font:700 16px/1.3 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.sz-type p{margin:0;font:400 13px/1.55 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}

.sz-checks{display:grid;gap:9px;margin:0;padding:0;list-style:none}
.sz-checks li{display:flex;gap:10px;align-items:flex-start;font:400 14px/1.5 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.85)}
.sz-checks li::before{
  content:"";flex:0 0 18px;height:18px;margin-top:1px;border-radius:50%;
  border:1px solid rgba(169,154,255,.45);
  background:rgba(169,154,255,.18) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23A99AFF" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"><path d="M20 6 9 17l-5-5"/></svg>') center/10px no-repeat;
}

.sz-benefits{display:grid;grid-template-columns:1.1fr 1fr;gap:22px;align-items:center}
@media (max-width:800px){.sz-benefits{grid-template-columns:1fr}}
.sz-benefits-visual{
  min-height:280px;border-radius:20px;border:1px solid rgba(255,255,255,.12);
  background:#14151b center/cover no-repeat;position:relative;overflow:hidden;
}
.sz-benefits-visual::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 30%,rgba(12,12,18,.75));
}

.sz-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;counter-reset:sz}
.sz-step{position:relative;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.10);border-radius:18px;padding:24px 20px;transition:transform .2s ease,border-color .2s ease}
.sz-step:hover{transform:translateY(-4px);border-color:rgba(127,107,255,.5)}
.sz-step::before{counter-increment:sz;content:"0" counter(sz);display:block;font:800 28px/1 'VelaSans',system-ui,sans-serif;background:linear-gradient(90deg,#CFC7FF,#7F6BFF);-webkit-background-clip:text;background-clip:text;color:transparent;margin:0 0 12px}
.sz-step h3{margin:0 0 8px;font:700 16px/1.3 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.sz-step p{margin:0;font:400 13px/1.55 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}
@media (max-width:900px){.sz-steps{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.sz-steps{grid-template-columns:1fr}}

.sz-cta{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;padding:32px;border-radius:22px;background:linear-gradient(135deg,rgba(127,107,255,.2),rgba(85,72,170,.08));border:1px solid rgba(127,107,255,.3);position:relative;overflow:hidden}
.sz-cta h3{margin:0;font:700 clamp(20px,2.6vw,26px)/1.2 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.sz-cta p{margin:8px 0 0;max-width:560px;font:400 15px/1.55 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.74)}
.sz-cta-btns{display:flex;flex-wrap:wrap;gap:12px}
@media (max-width:520px){.sz-cta-btns{width:100%}.sz-cta .sz-btn{width:100%}}


/* ---- multirum-page.css ---- */
/* Мультирум и аудио */

body:has(.mr-hero-full){overflow-x:hidden}
.uni-main:has(.mr-hero-full){padding-top:0}
.uni-main:has(.mr-hero-full) .uni-wrap:first-child{padding-top:0}
.uni-main:has(.mr-hero-full) .uni-title{display:none}
.uni-main .uni-wrap > .mr-hero-full{margin-top:0 !important}

.mr-sec{padding:28px 0}
.mr-h2{margin:0 0 12px;font:700 clamp(22px,3vw,32px)/1.2 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.mr-sub{margin:0 0 22px;max-width:820px;font:400 clamp(14px,1.6vw,17px)/1.6 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}
.mr-btn{cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;font:600 16px/1 'VelaSans',system-ui,sans-serif;color:#fff;border:0;padding:16px 28px;border-radius:14px;background:linear-gradient(90deg,#7F6BFF,#5548AA);box-shadow:0 8px 24px rgba(127,107,255,.35);transition:filter .15s ease,transform .15s ease;text-decoration:none}
.mr-btn:hover{filter:brightness(1.08);transform:translateY(-2px)}
.mr-btn--ghost{background:transparent;border:1px solid rgba(255,255,255,.35);box-shadow:none}
.mr-btn--ghost:hover{background:rgba(255,255,255,.08)}

.mr-hero-full{position:relative;left:50%;right:50%;width:100vw;margin-left:-50vw;margin-right:-50vw;height:600px;min-height:500px;display:flex;align-items:center;overflow:hidden;color:#eef0f6;background:#0e1018 center/cover no-repeat}
.mr-hero-overlay{position:absolute;inset:0;background:linear-gradient(105deg,rgba(8,10,16,.82) 0%,rgba(8,10,16,.55) 48%,rgba(8,10,16,.35) 100%);z-index:1}
.mr-hero-in{position:relative;z-index:2;width:1600px;max-width:88%;margin:0 auto;padding:0 20px 48px}

.mr-hero-kicker{display:inline-flex;align-items:center;gap:8px;margin:0 0 16px;padding:7px 12px;border-radius:999px;font:600 12px/1 'VelaSans',system-ui,sans-serif;letter-spacing:.04em;text-transform:uppercase;color:#CFC7FF;background:rgba(127,107,255,.16);border:1px solid rgba(127,107,255,.35)}
.mr-hero-kicker i{width:8px;height:8px;border-radius:50%;background:#7DDBA8;box-shadow:0 0 0 0 rgba(125,219,168,.7);animation:mrPulse 1.8s ease infinite}
@keyframes mrPulse{0%{box-shadow:0 0 0 0 rgba(125,219,168,.65)}70%{box-shadow:0 0 0 10px rgba(125,219,168,0)}100%{box-shadow:0 0 0 0 rgba(125,219,168,0)}}
.mr-hero-title{margin:0 0 18px;max-width:900px;font:600 clamp(30px,5vw,48px)/1.12 'VelaSans',system-ui,sans-serif;letter-spacing:-.6px;color:#fff}
.mr-hero-lead{margin:0 0 34px;max-width:680px;font:400 clamp(17px,2vw,24px)/1.3 'VelaSans',system-ui,sans-serif;color:#c8c8d2}
.mr-hero-actions{display:flex;flex-wrap:wrap;gap:16px}
.mr-hero-actions .btn{padding:15px 28px !important;min-width:210px;justify-content:center}
@media (max-width:600px){.mr-hero-full{height:auto;min-height:0;padding:96px 0 80px}.mr-hero-actions .btn{min-width:0;width:100%}}

.mr-sec--stats{position:relative;z-index:5;margin-top:-56px;padding-top:0;padding-bottom:8px}
@media (max-width:600px){.mr-sec--stats{margin-top:-36px}}
.mr-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:0;padding:22px;border-radius:20px;background:linear-gradient(135deg,rgba(20,22,32,.96),rgba(18,16,28,.94));border:1px solid rgba(127,107,255,.28);backdrop-filter:blur(12px);box-shadow:0 16px 40px rgba(0,0,0,.35)}

.mr-stat{text-align:center;padding:8px;border-radius:14px;transition:transform .25s ease,background .25s ease}
.mr-stat:hover{transform:translateY(-4px);background:rgba(255,255,255,.05)}
.mr-stat-num{font:800 clamp(26px,3.6vw,42px)/1 'VelaSans',system-ui,sans-serif;background:linear-gradient(90deg,#CFC7FF,#7F6BFF);-webkit-background-clip:text;background-clip:text;color:transparent}
.mr-stat-label{margin:8px 0 0;font:500 13px/1.4 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.72)}
@media (max-width:760px){.mr-stats{grid-template-columns:1fr 1fr}}

/* Interactive rooms */
.mr-demo{display:grid;grid-template-columns:1.35fr .9fr;gap:22px;align-items:stretch}
@media (max-width:960px){.mr-demo{grid-template-columns:1fr}}

.mr-plan{
  position:relative;overflow:hidden;border-radius:20px;
  min-height:460px;padding:22px;
  background:
    radial-gradient(ellipse at 20% 10%,rgba(127,107,255,.18),transparent 50%),
    radial-gradient(ellipse at 80% 90%,rgba(85,72,170,.16),transparent 45%),
    #12141c;
}
.mr-plan-grid{
  display:grid;grid-template-columns:1.2fr 1fr 1fr;grid-template-rows:1.1fr .9fr .85fr;
  gap:12px;height:100%;min-height:416px;
}
.mr-room{
  position:relative;overflow:hidden;border:0;border-radius:16px;cursor:pointer;
  background:rgba(255,255,255,.04);color:#eef0f6;text-align:left;padding:16px;
  display:flex;flex-direction:column;justify-content:space-between;
  transition:background .25s ease,transform .25s ease,box-shadow .25s ease;
}
.mr-room::before{
  content:"";position:absolute;inset:0;opacity:0;
  background:linear-gradient(145deg,rgba(127,107,255,.28),rgba(85,72,170,.08));
  transition:opacity .25s ease;
}
.mr-room:hover,.mr-room.is-act{
  transform:translateY(-2px);
  box-shadow:0 12px 32px rgba(85,72,170,.28);
  background:rgba(127,107,255,.12);
}
.mr-room:hover::before,.mr-room.is-act::before{opacity:1}
.mr-room > *{position:relative;z-index:1}
.mr-room--living{grid-column:1 / 3;grid-row:1 / 2}
.mr-room--kitchen{grid-column:3 / 4;grid-row:1 / 2}
.mr-room--bed{grid-column:1 / 2;grid-row:2 / 3}
.mr-room--bath{grid-column:2 / 3;grid-row:2 / 3}
.mr-room--kids{grid-column:3 / 4;grid-row:2 / 3}
.mr-room--terrace{grid-column:1 / 4;grid-row:3 / 4}

.mr-room-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.mr-room-name{font:700 15px/1.2 'VelaSans',system-ui,sans-serif;color:#fff}
.mr-room-track{
  font:500 12px/1.3 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.55);
  max-width:70%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  opacity:0;transform:translateY(4px);transition:opacity .25s ease,transform .25s ease,color .25s ease;
}
.mr-room.is-act .mr-room-track,.mr-room:hover .mr-room-track{
  opacity:1;transform:none;color:#CFC7FF;
}

.mr-eq{display:flex;align-items:flex-end;gap:3px;height:28px}
.mr-eq i{
  display:block;width:3px;border-radius:2px;background:rgba(169,154,255,.35);
  height:20%;transition:background .2s ease;
}
.mr-room.is-act .mr-eq i,.mr-room:hover .mr-eq i{
  background:#A99AFF;animation:mrEq 1s ease-in-out infinite;
}
.mr-room.is-act .mr-eq i:nth-child(1),.mr-room:hover .mr-eq i:nth-child(1){animation-delay:0s;height:45%}
.mr-room.is-act .mr-eq i:nth-child(2),.mr-room:hover .mr-eq i:nth-child(2){animation-delay:.1s;height:80%}
.mr-room.is-act .mr-eq i:nth-child(3),.mr-room:hover .mr-eq i:nth-child(3){animation-delay:.2s;height:55%}
.mr-room.is-act .mr-eq i:nth-child(4),.mr-room:hover .mr-eq i:nth-child(4){animation-delay:.05s;height:95%}
.mr-room.is-act .mr-eq i:nth-child(5),.mr-room:hover .mr-eq i:nth-child(5){animation-delay:.15s;height:40%}
@keyframes mrEq{
  0%,100%{transform:scaleY(.45)}
  50%{transform:scaleY(1)}
}

.mr-plan-hint{
  position:absolute;left:22px;right:22px;bottom:22px;z-index:2;
  padding:12px 14px;border-radius:12px;pointer-events:none;
  background:rgba(12,14,20,.72);backdrop-filter:blur(8px);
  font:500 13px/1.4 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.82);
}
.mr-plan-hint b{color:#CFC7FF;font-weight:600}
.mr-plan .mr-room--terrace{padding-bottom:56px}

.mr-panel{
  display:flex;flex-direction:column;gap:10px;
  background:rgba(255,255,255,.03);border-radius:20px;padding:22px;
}
.mr-panel h3{margin:0;font:700 20px/1.3 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.mr-panel > p{margin:0;font:400 14px/1.55 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}
.mr-modes{display:grid;gap:6px;margin-top:4px}
.mr-mode{
  text-align:left;cursor:pointer;border:0;border-left:2px solid transparent;
  background:transparent;border-radius:12px;padding:11px 12px 11px 14px;
  color:#eef0f6;transition:background .2s ease,transform .2s ease,border-color .2s ease;
}
.mr-mode:hover,.mr-mode.is-act{
  background:rgba(127,107,255,.14);border-left-color:#A99AFF;transform:translateX(2px);
}
.mr-mode strong{display:block;font:600 15px/1.3 'VelaSans',system-ui,sans-serif;margin:0 0 3px;color:#fff}
.mr-mode span{display:block;font:400 13px/1.45 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}
.mr-explain{
  margin-top:auto;padding:14px;border-radius:14px;
  background:linear-gradient(135deg,rgba(127,107,255,.16),rgba(85,72,170,.08));
  min-height:110px;
}
.mr-explain h4{margin:0 0 6px;font:700 15px/1.3 'VelaSans',system-ui,sans-serif;color:#CFC7FF}
.mr-explain p{margin:0;font:400 13px/1.5 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.78)}

.mr-cases{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media (max-width:900px){.mr-cases{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.mr-cases{grid-template-columns:1fr}}
.mr-case{
  position:relative;overflow:hidden;min-height:220px;border-radius:18px;
  background:#14151b center/cover no-repeat;transition:transform .2s ease;
}
.mr-case::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(11,12,15,.2) 0%,rgba(11,12,15,.55) 45%,rgba(11,12,15,.92) 100%);
}
.mr-case:hover{transform:translateY(-5px)}
.mr-case:hover::before{background:linear-gradient(180deg,rgba(11,12,15,.2) 0%,rgba(85,72,170,.35) 50%,rgba(11,12,15,.94) 100%)}
.mr-case-body{position:relative;z-index:1;padding:20px;display:flex;flex-direction:column;justify-content:flex-end;height:100%;min-height:220px}
.mr-case-tag{
  align-self:flex-start;margin:0 0 12px;font:600 11px/1 'VelaSans',system-ui,sans-serif;
  color:#CFC7FF;background:rgba(127,107,255,.22);padding:6px 10px;border-radius:999px;
}
.mr-case h3{margin:0;font:700 17px/1.3 'VelaSans',system-ui,sans-serif;color:#fff}
.mr-case p{margin:8px 0 0;font:400 13px/1.5 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.82)}

.mr-feats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
@media (max-width:900px){.mr-feats{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.mr-feats{grid-template-columns:1fr}}
.mr-feat{
  padding:20px;border-radius:18px;background:rgba(255,255,255,.03);
  transition:transform .2s ease,background .2s ease;
}
.mr-feat:hover{transform:translateY(-4px);background:rgba(127,107,255,.1)}
.mr-feat-ic{
  width:44px;height:44px;border-radius:12px;margin:0 0 14px;
  display:grid;place-items:center;color:#CFC7FF;background:rgba(127,107,255,.16);
}
.mr-feat-ic svg{width:22px;height:22px}
.mr-feat h3{margin:0 0 8px;font:700 16px/1.3 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.mr-feat p{margin:0;font:400 13px/1.55 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}

.mr-checks{display:grid;gap:9px;margin:0;padding:0;list-style:none}
.mr-checks li{display:flex;gap:10px;align-items:flex-start;font:400 14px/1.5 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.85)}
.mr-checks li::before{
  content:"";flex:0 0 18px;height:18px;margin-top:1px;border-radius:50%;
  border:1px solid rgba(169,154,255,.45);
  background:rgba(169,154,255,.18) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23A99AFF" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"><path d="M20 6 9 17l-5-5"/></svg>') center/10px no-repeat;
}

.mr-split{display:grid;grid-template-columns:1.05fr 1fr;gap:22px;align-items:center}
@media (max-width:800px){.mr-split{grid-template-columns:1fr}}
.mr-split-visual{
  min-height:280px;border-radius:20px;
  background:#14151b center/cover no-repeat;position:relative;overflow:hidden;
}
.mr-split-visual::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 30%,rgba(12,12,18,.7));
}

.mr-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;counter-reset:mr}
.mr-step{position:relative;background:rgba(255,255,255,.03);border-radius:18px;padding:24px 20px;transition:transform .2s ease,background .2s ease}
.mr-step:hover{transform:translateY(-4px);background:rgba(127,107,255,.1)}
.mr-step::before{counter-increment:mr;content:"0" counter(mr);display:block;font:800 28px/1 'VelaSans',system-ui,sans-serif;background:linear-gradient(90deg,#CFC7FF,#7F6BFF);-webkit-background-clip:text;background-clip:text;color:transparent;margin:0 0 12px}
.mr-step h3{margin:0 0 8px;font:700 16px/1.3 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.mr-step p{margin:0;font:400 13px/1.55 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}
@media (max-width:900px){.mr-steps{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.mr-steps{grid-template-columns:1fr}}

.mr-cta{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;padding:32px;border-radius:22px;background:linear-gradient(135deg,rgba(127,107,255,.2),rgba(85,72,170,.08));border:1px solid rgba(127,107,255,.3);position:relative;overflow:hidden}
.mr-cta h3{margin:0;font:700 clamp(20px,2.6vw,26px)/1.2 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.mr-cta p{margin:8px 0 0;max-width:560px;font:400 15px/1.55 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.74)}
.mr-cta-btns{display:flex;flex-wrap:wrap;gap:12px}
@media (max-width:520px){.mr-cta-btns{width:100%}.mr-cta .mr-btn{width:100%}}


/* ---- voice-page.css ---- */
/* Интеграции с голосовыми ассистентами */

body:has(.va-hero-full){overflow-x:hidden}
.uni-main:has(.va-hero-full){padding-top:0}
.uni-main:has(.va-hero-full) .uni-wrap:first-child{padding-top:0}
.uni-main:has(.va-hero-full) .uni-title{display:none}
.uni-main .uni-wrap > .va-hero-full{margin-top:0 !important}

.va-sec{padding:28px 0}
.va-h2{margin:0 0 12px;font:700 clamp(22px,3vw,32px)/1.2 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.va-sub{margin:0 0 22px;max-width:820px;font:400 clamp(14px,1.6vw,17px)/1.6 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}
.va-btn{cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;font:600 16px/1 'VelaSans',system-ui,sans-serif;color:#fff;border:0;padding:16px 28px;border-radius:14px;background:linear-gradient(90deg,#7F6BFF,#5548AA);box-shadow:0 8px 24px rgba(127,107,255,.35);transition:filter .15s ease,transform .15s ease;text-decoration:none}
.va-btn:hover{filter:brightness(1.08);transform:translateY(-2px)}
.va-btn--ghost{background:transparent;border:1px solid rgba(255,255,255,.35);box-shadow:none}
.va-btn--ghost:hover{background:rgba(255,255,255,.08)}

.va-hero-full{position:relative;left:50%;right:50%;width:100vw;margin-left:-50vw;margin-right:-50vw;height:600px;min-height:500px;display:flex;align-items:center;overflow:hidden;color:#eef0f6;background:#0e1018 center/cover no-repeat}
.va-hero-overlay{position:absolute;inset:0;background:linear-gradient(105deg,rgba(8,10,16,.82) 0%,rgba(8,10,16,.55) 48%,rgba(8,10,16,.35) 100%);z-index:1}
.va-hero-in{position:relative;z-index:2;width:1600px;max-width:88%;margin:0 auto;padding:0 20px 48px}

.va-hero-kicker{display:inline-flex;align-items:center;gap:8px;margin:0 0 16px;padding:7px 12px;border-radius:999px;font:600 12px/1 'VelaSans',system-ui,sans-serif;letter-spacing:.04em;text-transform:uppercase;color:#CFC7FF;background:rgba(127,107,255,.16);border:1px solid rgba(127,107,255,.35)}
.va-hero-kicker i{width:8px;height:8px;border-radius:50%;background:#7DDBA8;box-shadow:0 0 0 0 rgba(125,219,168,.7);animation:vaPulse 1.8s ease infinite}
@keyframes vaPulse{0%{box-shadow:0 0 0 0 rgba(125,219,168,.65)}70%{box-shadow:0 0 0 10px rgba(125,219,168,0)}100%{box-shadow:0 0 0 0 rgba(125,219,168,0)}}
.va-hero-title{margin:0 0 18px;max-width:920px;font:600 clamp(28px,4.6vw,48px)/1.12 'VelaSans',system-ui,sans-serif;letter-spacing:-.6px;color:#fff}
.va-hero-lead{margin:0 0 34px;max-width:700px;font:400 clamp(17px,2vw,24px)/1.3 'VelaSans',system-ui,sans-serif;color:#c8c8d2}
.va-hero-actions{display:flex;flex-wrap:wrap;gap:16px}
.va-hero-actions .btn{padding:15px 28px !important;min-width:210px;justify-content:center}
@media (max-width:600px){.va-hero-full{height:auto;min-height:0;padding:96px 0 80px}.va-hero-actions .btn{min-width:0;width:100%}}

.va-sec--stats{position:relative;z-index:5;margin-top:-56px;padding-top:0;padding-bottom:8px}
@media (max-width:600px){.va-sec--stats{margin-top:-36px}}
.va-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:0;padding:22px;border-radius:20px;background:linear-gradient(135deg,rgba(20,22,32,.96),rgba(18,16,28,.94));border:1px solid rgba(127,107,255,.28);backdrop-filter:blur(12px);box-shadow:0 16px 40px rgba(0,0,0,.35)}

.va-stat{text-align:center;padding:8px;border-radius:14px;transition:transform .25s ease,background .25s ease}
.va-stat:hover{transform:translateY(-4px);background:rgba(255,255,255,.05)}
.va-stat-num{font:800 clamp(26px,3.6vw,42px)/1 'VelaSans',system-ui,sans-serif;background:linear-gradient(90deg,#CFC7FF,#7F6BFF);-webkit-background-clip:text;background-clip:text;color:transparent}
.va-stat-label{margin:8px 0 0;font:500 13px/1.4 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.72)}
@media (max-width:760px){.va-stats{grid-template-columns:1fr 1fr}}

.va-assist{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
@media (max-width:700px){.va-assist{grid-template-columns:1fr}}
.va-assist-item{
  display:flex;align-items:center;gap:14px;padding:18px 20px;border-radius:18px;
  background:rgba(255,255,255,.03);transition:transform .2s ease,background .2s ease;
}
.va-assist-item:hover{transform:translateY(-3px);background:rgba(127,107,255,.12)}
.va-assist-ic{
  flex:0 0 48px;width:48px;height:48px;border-radius:14px;
  display:grid;place-items:center;background:rgba(127,107,255,.14);
}
.va-assist-ic img{width:24px;height:24px;object-fit:contain;display:block}
.va-assist-item small{display:block;font:500 12px/1.2 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.55);margin:0 0 4px}
.va-assist-item strong{display:block;font:700 17px/1.2 'VelaSans',system-ui,sans-serif;color:#fff}

/* Interactive voice demo */
.va-demo{display:grid;grid-template-columns:1.15fr 1fr;gap:22px;align-items:stretch}
@media (max-width:960px){.va-demo{grid-template-columns:1fr}}

.va-stage{
  position:relative;overflow:hidden;border-radius:20px;min-height:460px;
  background:
    radial-gradient(ellipse at 50% 0%,rgba(127,107,255,.22),transparent 55%),
    #12141c;
  padding:28px 24px 24px;display:flex;flex-direction:column;gap:18px;
}
.va-mic{
  align-self:center;width:88px;height:88px;border-radius:50%;
  display:grid;place-items:center;color:#CFC7FF;
  background:linear-gradient(145deg,rgba(127,107,255,.35),rgba(85,72,170,.15));
  box-shadow:0 0 0 0 rgba(169,154,255,.45);
  transition:box-shadow .35s ease,transform .25s ease;
}
.va-stage.is-listen .va-mic{
  animation:vaPulse 1.6s ease-out infinite;
  transform:scale(1.04);
}
.va-mic svg{width:36px;height:36px}
@keyframes vaPulse{
  0%{box-shadow:0 0 0 0 rgba(169,154,255,.45)}
  70%{box-shadow:0 0 0 28px rgba(169,154,255,0)}
  100%{box-shadow:0 0 0 0 rgba(169,154,255,0)}
}

.va-phrase{
  text-align:center;min-height:64px;
  font:600 clamp(18px,2.4vw,26px)/1.35 'VelaSans',system-ui,sans-serif;color:#fff;
}
.va-phrase span{color:#A99AFF}

.va-react{
  display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:auto;
}
.va-chip{
  display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:14px;
  background:rgba(255,255,255,.04);color:rgba(238,240,246,.55);
  font:500 13px/1.3 'VelaSans',system-ui,sans-serif;
  transition:background .25s ease,color .25s ease,transform .25s ease;
}
.va-chip.is-on{
  background:rgba(127,107,255,.18);color:#EEF0F6;transform:translateY(-1px);
}
.va-chip-dot{
  flex:0 0 8px;width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.25);
}
.va-chip.is-on .va-chip-dot{background:#A99AFF;box-shadow:0 0 0 4px rgba(169,154,255,.2)}

.va-panel{
  display:flex;flex-direction:column;gap:10px;
  background:rgba(255,255,255,.03);border-radius:20px;padding:22px;
}
.va-panel h3{margin:0;font:700 20px/1.3 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.va-panel > p{margin:0;font:400 14px/1.55 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}
.va-cmds{display:grid;gap:6px;margin-top:4px}
.va-cmd{
  text-align:left;cursor:pointer;border:0;border-left:2px solid transparent;
  background:transparent;border-radius:12px;padding:11px 12px 11px 14px;
  color:#eef0f6;transition:background .2s ease,transform .2s ease,border-color .2s ease;
}
.va-cmd:hover,.va-cmd.is-act{
  background:rgba(127,107,255,.14);border-left-color:#A99AFF;transform:translateX(2px);
}
.va-cmd strong{display:block;font:600 15px/1.3 'VelaSans',system-ui,sans-serif;margin:0 0 3px;color:#fff}
.va-cmd span{display:block;font:400 13px/1.45 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}
.va-explain{
  margin-top:auto;padding:14px;border-radius:14px;
  background:linear-gradient(135deg,rgba(127,107,255,.16),rgba(85,72,170,.08));
  min-height:110px;
}
.va-explain h4{margin:0 0 6px;font:700 15px/1.3 'VelaSans',system-ui,sans-serif;color:#CFC7FF}
.va-explain p{margin:0;font:400 13px/1.5 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.78)}

.va-cases{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media (max-width:900px){.va-cases{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.va-cases{grid-template-columns:1fr}}
.va-case{
  position:relative;overflow:hidden;min-height:220px;border-radius:18px;
  background:#14151b center/cover no-repeat;transition:transform .2s ease;
}
.va-case::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(11,12,15,.2) 0%,rgba(11,12,15,.55) 45%,rgba(11,12,15,.92) 100%);
}
.va-case:hover{transform:translateY(-5px)}
.va-case:hover::before{background:linear-gradient(180deg,rgba(11,12,15,.2) 0%,rgba(85,72,170,.35) 50%,rgba(11,12,15,.94) 100%)}
.va-case-body{position:relative;z-index:1;padding:20px;display:flex;flex-direction:column;justify-content:flex-end;height:100%;min-height:220px}
.va-case-tag{
  align-self:flex-start;margin:0 0 12px;font:600 11px/1 'VelaSans',system-ui,sans-serif;
  color:#CFC7FF;background:rgba(127,107,255,.22);padding:6px 10px;border-radius:999px;
}
.va-case h3{margin:0;font:700 17px/1.3 'VelaSans',system-ui,sans-serif;color:#fff}
.va-case p{margin:8px 0 0;font:400 13px/1.5 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.82)}

.va-feats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
@media (max-width:900px){.va-feats{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.va-feats{grid-template-columns:1fr}}
.va-feat{
  padding:20px;border-radius:18px;background:rgba(255,255,255,.03);
  transition:transform .2s ease,background .2s ease;
}
.va-feat:hover{transform:translateY(-4px);background:rgba(127,107,255,.1)}
.va-feat-ic{
  width:44px;height:44px;border-radius:12px;margin:0 0 14px;
  display:grid;place-items:center;color:#CFC7FF;background:rgba(127,107,255,.16);
}
.va-feat-ic svg{width:22px;height:22px}
.va-feat h3{margin:0 0 8px;font:700 16px/1.3 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.va-feat p{margin:0;font:400 13px/1.55 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}

.va-checks{display:grid;gap:9px;margin:0;padding:0;list-style:none}
.va-checks li{display:flex;gap:10px;align-items:flex-start;font:400 14px/1.5 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.85)}
.va-checks li::before{
  content:"";flex:0 0 18px;height:18px;margin-top:1px;border-radius:50%;
  border:1px solid rgba(169,154,255,.45);
  background:rgba(169,154,255,.18) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23A99AFF" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"><path d="M20 6 9 17l-5-5"/></svg>') center/10px no-repeat;
}

.va-split{display:grid;grid-template-columns:1.05fr 1fr;gap:22px;align-items:center}
@media (max-width:800px){.va-split{grid-template-columns:1fr}}
.va-split-visual{
  min-height:280px;border-radius:20px;
  background:#14151b center/cover no-repeat;position:relative;overflow:hidden;
}
.va-split-visual::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 30%,rgba(12,12,18,.7));
}

.va-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;counter-reset:va}
.va-step{position:relative;background:rgba(255,255,255,.03);border-radius:18px;padding:24px 20px;transition:transform .2s ease,background .2s ease}
.va-step:hover{transform:translateY(-4px);background:rgba(127,107,255,.1)}
.va-step::before{counter-increment:va;content:"0" counter(va);display:block;font:800 28px/1 'VelaSans',system-ui,sans-serif;background:linear-gradient(90deg,#CFC7FF,#7F6BFF);-webkit-background-clip:text;background-clip:text;color:transparent;margin:0 0 12px}
.va-step h3{margin:0 0 8px;font:700 16px/1.3 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.va-step p{margin:0;font:400 13px/1.55 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}
@media (max-width:900px){.va-steps{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.va-steps{grid-template-columns:1fr}}

.va-cta{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;padding:32px;border-radius:22px;background:linear-gradient(135deg,rgba(127,107,255,.2),rgba(85,72,170,.08));border:1px solid rgba(127,107,255,.3);position:relative;overflow:hidden}
.va-cta h3{margin:0;font:700 clamp(20px,2.6vw,26px)/1.2 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.va-cta p{margin:8px 0 0;max-width:560px;font:400 15px/1.55 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.74)}
.va-cta-btns{display:flex;flex-wrap:wrap;gap:12px}
@media (max-width:520px){.va-cta-btns{width:100%}.va-cta .va-btn{width:100%}}


/* ---- uchastok-page.css ---- */
/* Автоматизация для участков */

body:has(.au-hero-full){overflow-x:hidden}
.uni-main:has(.au-hero-full){padding-top:0}
.uni-main:has(.au-hero-full) .uni-wrap:first-child{padding-top:0}
.uni-main:has(.au-hero-full) .uni-title{display:none}
.uni-main .uni-wrap > .au-hero-full{margin-top:0 !important}

.au-sec{padding:28px 0}
.au-h2{margin:0 0 12px;font:700 clamp(22px,3vw,32px)/1.2 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.au-sub{margin:0 0 22px;max-width:820px;font:400 clamp(14px,1.6vw,17px)/1.6 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}
.au-btn{cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;font:600 16px/1 'VelaSans',system-ui,sans-serif;color:#fff;border:0;padding:16px 28px;border-radius:14px;background:linear-gradient(90deg,#7F6BFF,#5548AA);box-shadow:0 8px 24px rgba(127,107,255,.35);transition:filter .15s ease,transform .15s ease;text-decoration:none}
.au-btn:hover{filter:brightness(1.08);transform:translateY(-2px)}
.au-btn--ghost{background:transparent;border:1px solid rgba(255,255,255,.35);box-shadow:none}
.au-btn--ghost:hover{background:rgba(255,255,255,.08)}

.au-hero-full{position:relative;left:50%;right:50%;width:100vw;margin-left:-50vw;margin-right:-50vw;height:600px;min-height:500px;display:flex;align-items:center;overflow:hidden;color:#eef0f6;background:#0e1018 center/cover no-repeat}
.au-hero-overlay{position:absolute;inset:0;background:linear-gradient(105deg,rgba(8,10,16,.82) 0%,rgba(8,10,16,.55) 48%,rgba(8,10,16,.35) 100%);z-index:1}
.au-hero-in{position:relative;z-index:2;width:1600px;max-width:88%;margin:0 auto;padding:0 20px 48px}

.au-hero-kicker{display:inline-flex;align-items:center;gap:8px;margin:0 0 16px;padding:7px 12px;border-radius:999px;font:600 12px/1 'VelaSans',system-ui,sans-serif;letter-spacing:.04em;text-transform:uppercase;color:#CFC7FF;background:rgba(127,107,255,.16);border:1px solid rgba(127,107,255,.35)}
.au-hero-kicker i{width:8px;height:8px;border-radius:50%;background:#7DDBA8;box-shadow:0 0 0 0 rgba(125,219,168,.7);animation:auPulse 1.8s ease infinite}
@keyframes auPulse{0%{box-shadow:0 0 0 0 rgba(125,219,168,.65)}70%{box-shadow:0 0 0 10px rgba(125,219,168,0)}100%{box-shadow:0 0 0 0 rgba(125,219,168,0)}}
.au-hero-title{margin:0 0 18px;max-width:900px;font:600 clamp(30px,5vw,48px)/1.12 'VelaSans',system-ui,sans-serif;letter-spacing:-.6px;color:#fff}
.au-hero-lead{margin:0 0 34px;max-width:680px;font:400 clamp(17px,2vw,24px)/1.3 'VelaSans',system-ui,sans-serif;color:#c8c8d2}
.au-hero-actions{display:flex;flex-wrap:wrap;gap:16px}
.au-hero-actions .btn{padding:15px 28px !important;min-width:210px;justify-content:center}
@media (max-width:600px){.au-hero-full{height:auto;min-height:0;padding:96px 0 80px}.au-hero-actions .btn{min-width:0;width:100%}}

.au-sec--stats{position:relative;z-index:5;margin-top:-56px;padding-top:0;padding-bottom:8px}
@media (max-width:600px){.au-sec--stats{margin-top:-36px}}
.au-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:0;padding:22px;border-radius:20px;background:linear-gradient(135deg,rgba(20,22,32,.96),rgba(18,16,28,.94));border:1px solid rgba(127,107,255,.28);backdrop-filter:blur(12px);box-shadow:0 16px 40px rgba(0,0,0,.35)}

.au-stat{text-align:center;padding:8px;border-radius:14px;transition:transform .25s ease,background .25s ease}
.au-stat:hover{transform:translateY(-4px);background:rgba(255,255,255,.05)}
.au-stat-num{font:800 clamp(26px,3.6vw,42px)/1 'VelaSans',system-ui,sans-serif;background:linear-gradient(90deg,#CFC7FF,#7F6BFF);-webkit-background-clip:text;background-clip:text;color:transparent}
.au-stat-label{margin:8px 0 0;font:500 13px/1.4 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.72)}
@media (max-width:760px){.au-stats{grid-template-columns:1fr 1fr}}

/* Interactive plot */
.au-demo{display:grid;grid-template-columns:1.4fr .85fr;gap:22px;align-items:stretch}
@media (max-width:960px){.au-demo{grid-template-columns:1fr}}

.au-map{
  position:relative;overflow:hidden;border-radius:20px;
  min-height:460px;background:#10131a;
}
.au-map-bg{
  position:absolute;inset:0;
  background:
    linear-gradient(105deg,rgba(10,12,18,.25) 0%,rgba(10,12,18,.55) 100%),
    url('https://test.maybesmart.ru/wp-content/themes/maybesmart/assets/images/gruziadom.jpeg') center/cover no-repeat;
  transform:scale(1.02);transition:filter .45s ease,transform .6s ease;
}
.au-map.is-hot .au-map-bg{filter:brightness(.78) saturate(1.08);transform:scale(1.05)}
.au-map-grid{display:none}

.au-zone{
  position:absolute;width:auto;height:auto;padding:0;margin:0;
  border:0;background:transparent;cursor:pointer;z-index:2;
  display:flex;align-items:center;gap:10px;
  transform:translate(-50%,-50%);
  transition:transform .25s ease;
}
.au-zone:hover,.au-zone.is-act{transform:translate(-50%,-50%) scale(1.06);z-index:3}
.au-zone .au-pulse{
  position:relative;flex:0 0 14px;width:14px;height:14px;border-radius:50%;
  background:#A99AFF;box-shadow:0 0 0 0 rgba(169,154,255,.55);
  animation:auPulse 2.2s ease-out infinite;
}
.au-zone.is-act .au-pulse,.au-zone:hover .au-pulse{
  background:#CFC7FF;box-shadow:0 0 0 6px rgba(127,107,255,.25);
  animation:none;
}
.au-zone-label{
  font:600 13px/1 'VelaSans',system-ui,sans-serif;color:#fff;
  padding:8px 12px;border-radius:999px;
  background:rgba(12,14,20,.72);backdrop-filter:blur(8px);
  box-shadow:0 8px 24px rgba(0,0,0,.35);
  white-space:nowrap;pointer-events:none;
  opacity:.88;transition:opacity .2s ease,background .2s ease,color .2s ease;
}
.au-zone:hover .au-zone-label,.au-zone.is-act .au-zone-label{
  opacity:1;background:rgba(127,107,255,.92);color:#fff;
}
.au-zone--gate{left:14%;top:22%}
.au-zone--light{left:48%;top:20%}
.au-zone--lawn{left:28%;top:52%}
.au-zone--pool{left:72%;top:48%}
.au-zone--path{left:24%;top:78%}
.au-zone--cam{left:70%;top:78%}

@keyframes auPulse{
  0%{box-shadow:0 0 0 0 rgba(169,154,255,.55)}
  70%{box-shadow:0 0 0 14px rgba(169,154,255,0)}
  100%{box-shadow:0 0 0 0 rgba(169,154,255,0)}
}

.au-map-hint{
  position:absolute;left:14px;right:14px;bottom:14px;z-index:3;
  padding:12px 14px;border-radius:12px;
  background:rgba(12,14,20,.72);
  backdrop-filter:blur(8px);
  font:500 13px/1.4 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.82);
}
.au-map-hint b{color:#CFC7FF;font-weight:600}

.au-panel{
  display:flex;flex-direction:column;gap:10px;
  background:rgba(255,255,255,.03);
  border-radius:20px;padding:22px;
}
.au-panel h3{margin:0;font:700 20px/1.3 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.au-panel > p{margin:0;font:400 14px/1.55 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}
.au-zones-list{display:grid;gap:6px;margin-top:4px}
.au-zone-btn{
  text-align:left;cursor:pointer;border:0;
  background:transparent;border-radius:12px;padding:11px 12px 11px 14px;
  color:#eef0f6;transition:background .2s ease,transform .2s ease;
  border-left:2px solid transparent;
}
.au-zone-btn:hover,.au-zone-btn.is-act{
  background:rgba(127,107,255,.14);border-left-color:#A99AFF;transform:translateX(2px);
}
.au-zone-btn strong{display:block;font:600 15px/1.3 'VelaSans',system-ui,sans-serif;margin:0 0 3px;color:#fff}
.au-zone-btn span{display:block;font:400 13px/1.45 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}
.au-explain{
  margin-top:auto;padding:14px;border-radius:14px;
  background:linear-gradient(135deg,rgba(127,107,255,.16),rgba(85,72,170,.08));
  min-height:110px;
}
.au-explain h4{margin:0 0 6px;font:700 15px/1.3 'VelaSans',system-ui,sans-serif;color:#CFC7FF}
.au-explain p{margin:0;font:400 13px/1.5 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.78)}

.au-sys{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media (max-width:900px){.au-sys{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.au-sys{grid-template-columns:1fr}}
.au-sys-card{
  position:relative;overflow:hidden;min-height:230px;border-radius:18px;
  border:0;background:#14151b center/cover no-repeat;
  transition:transform .2s ease;
}
.au-sys-card::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(11,12,15,.2) 0%,rgba(11,12,15,.55) 45%,rgba(11,12,15,.92) 100%);
}
.au-sys-card:hover{transform:translateY(-5px)}
.au-sys-card:hover::before{background:linear-gradient(180deg,rgba(11,12,15,.2) 0%,rgba(85,72,170,.35) 50%,rgba(11,12,15,.94) 100%)}
.au-sys-body{position:relative;z-index:1;padding:20px;display:flex;flex-direction:column;justify-content:flex-end;height:100%;min-height:230px}
.au-sys-body h3{margin:0;font:700 17px/1.3 'VelaSans',system-ui,sans-serif;color:#fff}
.au-sys-body p{margin:8px 0 0;font:400 13px/1.5 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.82)}

.au-cases{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
@media (max-width:700px){.au-cases{grid-template-columns:1fr}}
.au-case{
  display:flex;gap:14px;align-items:flex-start;padding:18px;
  border-radius:18px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.1);
  transition:transform .2s ease,border-color .2s ease;
}
.au-case:hover{transform:translateY(-3px);border-color:rgba(127,107,255,.5)}
.au-case-ic{
  flex:0 0 44px;width:44px;height:44px;border-radius:12px;
  display:grid;place-items:center;color:#CFC7FF;
  background:rgba(127,107,255,.16);border:1px solid rgba(127,107,255,.3);
}
.au-case-ic svg{width:22px;height:22px}
.au-case h3{margin:0 0 6px;font:700 16px/1.3 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.au-case p{margin:0;font:400 13px/1.55 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}

.au-checks{display:grid;gap:9px;margin:0;padding:0;list-style:none}
.au-checks li{display:flex;gap:10px;align-items:flex-start;font:400 14px/1.5 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.85)}
.au-checks li::before{
  content:"";flex:0 0 18px;height:18px;margin-top:1px;border-radius:50%;
  border:1px solid rgba(169,154,255,.45);
  background:rgba(169,154,255,.18) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23A99AFF" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"><path d="M20 6 9 17l-5-5"/></svg>') center/10px no-repeat;
}

.au-split{display:grid;grid-template-columns:1.05fr 1fr;gap:22px;align-items:center}
@media (max-width:800px){.au-split{grid-template-columns:1fr}}
.au-split-visual{
  min-height:280px;border-radius:20px;border:1px solid rgba(255,255,255,.12);
  background:#14151b center/cover no-repeat;position:relative;overflow:hidden;
}
.au-split-visual::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 30%,rgba(12,12,18,.7));
}

.au-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;counter-reset:au}
.au-step{position:relative;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.10);border-radius:18px;padding:24px 20px;transition:transform .2s ease,border-color .2s ease}
.au-step:hover{transform:translateY(-4px);border-color:rgba(127,107,255,.5)}
.au-step::before{counter-increment:au;content:"0" counter(au);display:block;font:800 28px/1 'VelaSans',system-ui,sans-serif;background:linear-gradient(90deg,#CFC7FF,#7F6BFF);-webkit-background-clip:text;background-clip:text;color:transparent;margin:0 0 12px}
.au-step h3{margin:0 0 8px;font:700 16px/1.3 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.au-step p{margin:0;font:400 13px/1.55 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}
@media (max-width:900px){.au-steps{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.au-steps{grid-template-columns:1fr}}

.au-cta{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;padding:32px;border-radius:22px;background:linear-gradient(135deg,rgba(127,107,255,.2),rgba(85,72,170,.08));border:1px solid rgba(127,107,255,.3);position:relative;overflow:hidden}
.au-cta h3{margin:0;font:700 clamp(20px,2.6vw,26px)/1.2 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.au-cta p{margin:8px 0 0;max-width:560px;font:400 15px/1.55 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.74)}
.au-cta-btns{display:flex;flex-wrap:wrap;gap:12px}
@media (max-width:520px){.au-cta-btns{width:100%}.au-cta .au-btn{width:100%}}


/* ---- energomonitoring-page.css ---- */
/* Энергомониторинг */

body:has(.em-hero-full){overflow-x:hidden}
.uni-main:has(.em-hero-full){padding-top:0}
.uni-main:has(.em-hero-full) .uni-wrap:first-child{padding-top:0}
.uni-main:has(.em-hero-full) .uni-title{display:none}
.uni-main .uni-wrap > .em-hero-full{margin-top:0 !important}

.em-sec{padding:20px 0}
.em-h2{margin:0 0 12px;font:700 clamp(22px,3vw,32px)/1.2 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.em-sub{margin:0 0 22px;max-width:820px;font:400 clamp(14px,1.6vw,17px)/1.6 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}
.em-btn{cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;font:600 16px/1 'VelaSans',system-ui,sans-serif;color:#fff;border:0;padding:16px 28px;border-radius:14px;background:linear-gradient(90deg,#7F6BFF,#5548AA);box-shadow:0 8px 24px rgba(127,107,255,.35);transition:filter .15s ease,transform .15s ease;text-decoration:none}
.em-btn:hover{filter:brightness(1.08);transform:translateY(-2px)}
.em-btn--ghost{background:transparent;border:1px solid rgba(255,255,255,.35);box-shadow:none}
.em-btn--ghost:hover{background:rgba(255,255,255,.08)}

.em-hero-full{position:relative;left:50%;right:50%;width:100vw;margin-left:-50vw;margin-right:-50vw;height:600px;min-height:500px;display:flex;align-items:center;overflow:hidden;color:#eef0f6;background:#0e1018 center/cover no-repeat}
.em-hero-overlay{position:absolute;inset:0;background:linear-gradient(105deg,rgba(8,10,16,.82) 0%,rgba(8,10,16,.55) 48%,rgba(8,10,16,.35) 100%);z-index:1}
.em-hero-in{position:relative;z-index:2;width:1600px;max-width:88%;margin:0 auto;padding:0 20px}
.em-hero-title{margin:0 0 18px;max-width:900px;font:600 clamp(30px,5vw,48px)/1.12 'VelaSans',system-ui,sans-serif;letter-spacing:-.6px;color:#fff}
.em-hero-lead{margin:0 0 34px;max-width:680px;font:400 clamp(17px,2vw,24px)/1.3 'VelaSans',system-ui,sans-serif;color:#c8c8d2}
.em-hero-actions{display:flex;flex-wrap:wrap;gap:16px}
.em-hero-actions .btn{padding:15px 28px !important;min-width:210px;justify-content:center}
@media (max-width:600px){.em-hero-full{height:auto;min-height:0;padding:96px 0 64px}.em-hero-actions .btn{min-width:0;width:100%}}

.em-sec--stats{position:relative;z-index:5;margin-top:-56px;padding-top:0;padding-bottom:8px}
@media (max-width:600px){.em-sec--stats{margin-top:-36px}}
.em-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:0;padding:22px;border-radius:20px;background:linear-gradient(135deg,rgba(20,22,32,.92),rgba(18,16,28,.88));border:1px solid rgba(127,107,255,.28);backdrop-filter:blur(12px);box-shadow:0 16px 40px rgba(0,0,0,.35)}
.em-stat{text-align:center;padding:8px;border-radius:14px;transition:transform .25s ease,background .25s ease}
.em-stat:hover{transform:translateY(-4px);background:rgba(255,255,255,.05)}
.em-stat-num{font:800 clamp(26px,3.6vw,42px)/1 'VelaSans',system-ui,sans-serif;background:linear-gradient(90deg,#CFC7FF,#7F6BFF);-webkit-background-clip:text;background-clip:text;color:transparent}
.em-stat-label{margin:8px 0 0;font:500 13px/1.4 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.72)}
@media (max-width:760px){.em-stats{grid-template-columns:1fr 1fr}}

/* Demo dashboard */
.em-demo{display:grid;grid-template-columns:1.45fr .85fr;gap:22px;align-items:stretch}
@media (max-width:960px){.em-demo{grid-template-columns:1fr}}

.em-stage{
  position:relative;overflow:hidden;border-radius:20px;min-height:460px;padding:22px;
  display:grid;grid-template-rows:auto auto 1fr auto;gap:16px;
  background:
    radial-gradient(ellipse at 10% 0%,rgba(127,107,255,.16),transparent 42%),
    radial-gradient(ellipse at 100% 80%,rgba(255,170,100,.08),transparent 40%),
    linear-gradient(160deg,#141621 0%,#0e1018 60%,#12141c 100%);
}
.em-stage[data-mode="peak"]{background:radial-gradient(ellipse at 80% 10%,rgba(255,120,70,.18),transparent 45%),linear-gradient(160deg,#1a1418,#0e1018 60%,#12141c)}
.em-stage[data-mode="eco"]{background:radial-gradient(ellipse at 20% 0%,rgba(90,200,140,.14),transparent 45%),linear-gradient(160deg,#12181a,#0e1018 60%,#12141c)}
.em-stage[data-mode="alert"]{background:radial-gradient(ellipse at 50% 0%,rgba(255,90,90,.16),transparent 50%),linear-gradient(160deg,#1a1214,#0e1018 60%,#12141c)}

.em-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
@media (max-width:560px){.em-kpis{grid-template-columns:1fr}}
.em-kpi{
  padding:14px 16px;border-radius:16px;
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);
  transition:border-color .35s ease,background .35s ease;
}
.em-kpi small{display:block;font:500 11px/1.2 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.5);margin:0 0 6px}
.em-kpi strong{
  display:block;font:800 clamp(22px,3vw,28px)/1 'VelaSans',system-ui,sans-serif;
  background:linear-gradient(90deg,#CFC7FF,#7F6BFF);-webkit-background-clip:text;background-clip:text;color:transparent;
}
.em-kpi span{display:block;margin-top:4px;font:500 12px/1.3 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.55)}
.em-stage[data-mode="peak"] .em-kpi--power{border-color:rgba(255,160,100,.4);background:rgba(255,120,70,.1)}
.em-stage[data-mode="eco"] .em-kpi--power{border-color:rgba(100,210,150,.35);background:rgba(80,180,120,.1)}
.em-stage[data-mode="alert"] .em-kpi--power{border-color:rgba(255,110,110,.45);background:rgba(255,80,80,.12)}

.em-mid{display:grid;grid-template-columns:160px 1fr;gap:18px;align-items:center}
@media (max-width:640px){.em-mid{grid-template-columns:1fr;justify-items:center}}

.em-gauge{
  position:relative;width:150px;height:150px;border-radius:50%;
  background:
    radial-gradient(circle at 50% 50%,#12141c 0 56%,transparent 57%),
    conic-gradient(from 210deg,#7F6BFF 0deg,var(--em-g1,#A99AFF) var(--em-arc,90deg),rgba(255,255,255,.08) var(--em-arc,90deg) 300deg,transparent 300deg 360deg);
  box-shadow:0 0 0 1px rgba(255,255,255,.1),0 16px 40px rgba(0,0,0,.3);
  transition:filter .45s ease,--em-arc .7s cubic-bezier(.4,0,.2,1);
}
.em-stage[data-mode="now"]{--em-arc:95deg;--em-g1:#A99AFF}
.em-stage[data-mode="peak"]{--em-arc:210deg;--em-g1:#FF9B6A}
.em-stage[data-mode="eco"]{--em-arc:55deg;--em-g1:#7DDBA8}
.em-stage[data-mode="night"]{--em-arc:70deg;--em-g1:#8EB6FF}
.em-stage[data-mode="away"]{--em-arc:35deg;--em-g1:#CFC7FF}
.em-stage[data-mode="alert"]{--em-arc:260deg;--em-g1:#FF7A7A}
.em-gauge-inner{
  position:absolute;inset:18px;border-radius:50%;
  background:linear-gradient(160deg,#171925,#0f1118);
  border:1px solid rgba(255,255,255,.08);
  display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;
}
.em-gauge-val{
  font:800 32px/1 'VelaSans',system-ui,sans-serif;
  background:linear-gradient(90deg,#CFC7FF,#7F6BFF);-webkit-background-clip:text;background-clip:text;color:transparent;
}
.em-gauge-val span{font-size:.42em;margin-left:2px}
.em-gauge-label{margin-top:4px;font:500 11px/1.2 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.55)}

.em-chart{
  display:flex;align-items:flex-end;gap:6px;height:150px;width:100%;padding:8px 4px 0;
  border-radius:16px;background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.07);
}
.em-bar{
  flex:1;border-radius:8px 8px 4px 4px;min-width:0;
  background:linear-gradient(180deg,rgba(169,154,255,.85),rgba(85,72,170,.35));
  height:var(--h,40%);
  transition:height .7s cubic-bezier(.4,0,.2,1),background .4s ease,filter .35s ease;
  position:relative;
}
.em-bar.is-peak{background:linear-gradient(180deg,rgba(255,170,110,.9),rgba(200,90,50,.4));filter:brightness(1.05)}
.em-bar.is-low{background:linear-gradient(180deg,rgba(125,219,168,.8),rgba(60,140,100,.3))}
.em-bar::after{
  content:attr(data-h);position:absolute;left:50%;bottom:100%;transform:translate(-50%,-4px);
  font:600 9px/1 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.4);opacity:0;transition:opacity .2s ease;
  white-space:nowrap;
}
.em-bar:hover::after{opacity:1}

.em-cats{display:grid;gap:10px}
.em-cat{display:grid;grid-template-columns:90px 1fr 48px;gap:10px;align-items:center}
.em-cat-name{font:600 13px/1.2 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.75)}
.em-cat-track{height:10px;border-radius:999px;background:rgba(255,255,255,.06);overflow:hidden}
.em-cat-fill{
  height:100%;border-radius:999px;width:var(--w,40%);
  background:linear-gradient(90deg,#7F6BFF,#A99AFF);
  transition:width .7s cubic-bezier(.4,0,.2,1);
}
.em-cat[data-cat="climate"] .em-cat-fill{background:linear-gradient(90deg,#FF8A5B,#FFB48A)}
.em-cat[data-cat="light"] .em-cat-fill{background:linear-gradient(90deg,#F0D26A,#FFE9A8)}
.em-cat[data-cat="other"] .em-cat-fill{background:linear-gradient(90deg,#5AA8FF,#A8D0FF)}
.em-cat-pct{font:700 13px/1 'VelaSans',system-ui,sans-serif;color:#CFC7FF;text-align:right}

.em-status{
  display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  padding:12px 14px;border-radius:14px;
  background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);
  font:500 13px/1.4 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7);
}
.em-status b{color:#CFC7FF}
.em-badge{
  display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;
  font:600 11px/1 'VelaSans',system-ui,sans-serif;letter-spacing:.02em;
  background:rgba(127,107,255,.18);border:1px solid rgba(127,107,255,.35);color:#CFC7FF;
}
.em-stage[data-mode="peak"] .em-badge{background:rgba(255,140,70,.16);border-color:rgba(255,160,100,.4);color:#FFD0B0}
.em-stage[data-mode="eco"] .em-badge{background:rgba(80,180,120,.16);border-color:rgba(100,210,150,.35);color:#B8F0D0}
.em-stage[data-mode="alert"] .em-badge{background:rgba(255,80,80,.16);border-color:rgba(255,120,120,.4);color:#FFC0C0}

.em-panel{
  display:flex;flex-direction:column;gap:12px;
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.12);
  border-radius:20px;padding:22px;
}
.em-panel h3{margin:0;font:700 20px/1.3 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.em-panel > p{margin:0;font:400 14px/1.55 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}
.em-modes{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:4px}
@media (max-width:520px){.em-modes{grid-template-columns:1fr}}
.em-mode{
  text-align:left;cursor:pointer;border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.03);border-radius:14px;padding:12px 14px;
  color:#eef0f6;transition:border-color .2s ease,background .2s ease,transform .2s ease;
}
.em-mode:hover,.em-mode.is-act{
  border-color:rgba(169,154,255,.55);background:rgba(127,107,255,.14);transform:translateY(-2px);
}
.em-mode strong{display:block;font:600 14px/1.3 'VelaSans',system-ui,sans-serif;margin:0 0 3px;color:#fff}
.em-mode span{display:block;font:400 12px/1.4 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.65)}
.em-explain{
  margin-top:auto;padding:14px;border-radius:14px;
  background:linear-gradient(135deg,rgba(127,107,255,.16),rgba(85,72,170,.08));
  border:1px solid rgba(127,107,255,.28);min-height:96px;
}
.em-explain h4{margin:0 0 6px;font:700 15px/1.3 'VelaSans',system-ui,sans-serif;color:#CFC7FF}
.em-explain p{margin:0;font:400 13px/1.5 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.78)}

/* Leak / waste cards */
.em-leaks{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
@media (max-width:800px){.em-leaks{grid-template-columns:1fr}}
.em-leak{
  position:relative;overflow:hidden;border-radius:18px;padding:22px 20px;
  background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);
  transition:transform .2s ease,border-color .2s ease,background .2s ease;
}
.em-leak:hover{transform:translateY(-4px);border-color:rgba(127,107,255,.45);background:rgba(127,107,255,.1)}
.em-leak-num{
  font:800 28px/1 'VelaSans',system-ui,sans-serif;margin:0 0 10px;
  background:linear-gradient(90deg,#CFC7FF,#7F6BFF);-webkit-background-clip:text;background-clip:text;color:transparent;
}
.em-leak h3{margin:0 0 8px;font:700 17px/1.25 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.em-leak p{margin:0;font:400 13px/1.5 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}

.em-cases{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media (max-width:900px){.em-cases{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.em-cases{grid-template-columns:1fr}}
.em-case{
  position:relative;overflow:hidden;min-height:210px;border-radius:18px;
  border:0;background:#14151b center/cover no-repeat;transition:transform .2s ease;
}
.em-case::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(11,12,15,.2) 0%,rgba(11,12,15,.55) 45%,rgba(11,12,15,.92) 100%);
  transition:background .2s ease;
}
.em-case:hover{transform:translateY(-5px)}
.em-case:hover::before{background:linear-gradient(180deg,rgba(11,12,15,.2) 0%,rgba(85,72,170,.35) 50%,rgba(11,12,15,.94) 100%)}
.em-case-body{position:relative;z-index:1;padding:20px;display:flex;flex-direction:column;justify-content:flex-end;height:100%;min-height:210px;border:0}
.em-case h3{margin:0;font:700 17px/1.3 'VelaSans',system-ui,sans-serif;color:#fff}
.em-case p{margin:8px 0 0;font:400 13px/1.5 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.82)}
.em-case-tag{
  align-self:flex-start;margin:0 0 12px;font:600 11px/1 'VelaSans',system-ui,sans-serif;
  color:#CFC7FF;background:rgba(127,107,255,.22);border:1px solid rgba(127,107,255,.4);
  padding:6px 10px;border-radius:999px;
}

.em-types{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
@media (max-width:900px){.em-types{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.em-types{grid-template-columns:1fr}}
.em-type{
  padding:20px;border-radius:18px;background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.1);transition:transform .2s ease,border-color .2s ease;
}
.em-type:hover{transform:translateY(-4px);border-color:rgba(127,107,255,.5)}
.em-type-ic{
  width:44px;height:44px;border-radius:12px;margin:0 0 14px;
  display:grid;place-items:center;color:#CFC7FF;
  background:rgba(127,107,255,.16);border:1px solid rgba(127,107,255,.3);
}
.em-type-ic svg{width:22px;height:22px}
.em-type h3{margin:0 0 8px;font:700 16px/1.3 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.em-type p{margin:0;font:400 13px/1.55 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}

.em-checks{display:grid;gap:9px;margin:0;padding:0;list-style:none}
.em-checks li{display:flex;gap:10px;align-items:flex-start;font:400 14px/1.5 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.85)}
.em-checks li::before{
  content:"";flex:0 0 18px;height:18px;margin-top:1px;border-radius:50%;
  border:1px solid rgba(169,154,255,.45);
  background:rgba(169,154,255,.18) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23A99AFF" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"><path d="M20 6 9 17l-5-5"/></svg>') center/10px no-repeat;
}

.em-benefits{display:grid;grid-template-columns:1.1fr 1fr;gap:22px;align-items:center}
@media (max-width:800px){.em-benefits{grid-template-columns:1fr}}
.em-benefits-visual{
  min-height:280px;border-radius:20px;border:0;
  background:#14151b center/cover no-repeat;position:relative;overflow:hidden;
}
.em-benefits-visual::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 30%,rgba(12,12,18,.75));
}

.em-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;counter-reset:em}
.em-step{position:relative;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.10);border-radius:18px;padding:24px 20px;transition:transform .2s ease,border-color .2s ease}
.em-step:hover{transform:translateY(-4px);border-color:rgba(127,107,255,.5)}
.em-step::before{counter-increment:em;content:"0" counter(em);display:block;font:800 28px/1 'VelaSans',system-ui,sans-serif;background:linear-gradient(90deg,#CFC7FF,#7F6BFF);-webkit-background-clip:text;background-clip:text;color:transparent;margin:0 0 12px}
.em-step h3{margin:0 0 8px;font:700 16px/1.3 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.em-step p{margin:0;font:400 13px/1.55 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}
@media (max-width:900px){.em-steps{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.em-steps{grid-template-columns:1fr}}

.em-cta{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;padding:30px;border-radius:20px;background:linear-gradient(135deg,rgba(127,107,255,.18),rgba(85,72,170,.10));border:1px solid rgba(127,107,255,.30)}
.em-cta h3{margin:0;font:700 clamp(20px,2.6vw,26px)/1.2 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.em-cta p{margin:8px 0 0;max-width:560px;font:400 15px/1.55 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.74)}
.em-cta-btns{display:flex;flex-wrap:wrap;gap:12px}
@media (max-width:520px){.em-cta-btns{width:100%}.em-cta .em-btn{width:100%}}


/* ---- proektirovanie-page.css ---- */
/* Проектирование умного дома */

body:has(.pr-hero-full){overflow-x:hidden}
.uni-main:has(.pr-hero-full){padding-top:0}
.uni-main:has(.pr-hero-full) .uni-wrap:first-child{padding-top:0}
.uni-main:has(.pr-hero-full) .uni-title{display:none}
.uni-main .uni-wrap > .pr-hero-full{margin-top:0 !important}

.pr-rv{opacity:1}
.pr-js .pr-rv{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .7s ease}
.pr-js .pr-rv.is-in{opacity:1;transform:none}
@keyframes prFade{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.pr-eyebrow{display:inline-flex;align-items:center;gap:8px;font:700 13px/1 'VelaSans',system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#A99AFF;margin:0 0 14px}
.pr-eyebrow::before{content:"";width:26px;height:2px;border-radius:2px;background:linear-gradient(90deg,#7F6BFF,#5548AA)}

.pr-sec{padding:28px 0}
.pr-h2{margin:0 0 12px;font:700 clamp(22px,3vw,32px)/1.2 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.pr-sub{margin:0 0 22px;max-width:820px;font:400 clamp(14px,1.6vw,17px)/1.6 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}
.pr-btn{cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;font:600 16px/1 'VelaSans',system-ui,sans-serif;color:#fff;border:0;padding:16px 28px;border-radius:14px;background:linear-gradient(90deg,#7F6BFF,#5548AA);box-shadow:0 8px 24px rgba(127,107,255,.35);transition:filter .15s ease,transform .15s ease;text-decoration:none}
.pr-btn:hover{filter:brightness(1.08);transform:translateY(-2px)}
.pr-btn--ghost{background:transparent;border:1px solid rgba(255,255,255,.35);box-shadow:none;color:#fff}
.pr-btn--ghost:hover{background:rgba(255,255,255,.08)}

.pr-hero-full{position:relative;left:50%;right:50%;width:100vw;margin-left:-50vw;margin-right:-50vw;height:600px;min-height:500px;display:flex;align-items:center;overflow:hidden;color:#eef0f6;background:#0e1018 center/cover no-repeat}
.pr-hero-overlay{position:absolute;inset:0;z-index:1;background:linear-gradient(105deg,rgba(8,10,16,.82) 0%,rgba(8,10,16,.55) 48%,rgba(8,10,16,.35) 100%)}
.pr-hero-in{position:relative;z-index:2;width:1600px;max-width:88%;margin:0 auto;padding:0 20px 48px}
.pr-hero-kicker{display:inline-flex;align-items:center;gap:8px;margin:0 0 16px;padding:7px 12px;border-radius:999px;font:600 12px/1 'VelaSans',system-ui,sans-serif;letter-spacing:.04em;text-transform:uppercase;color:#CFC7FF;background:rgba(127,107,255,.16);border:1px solid rgba(127,107,255,.35)}
.pr-hero-kicker i{width:8px;height:8px;border-radius:50%;background:#7DDBA8;box-shadow:0 0 0 0 rgba(125,219,168,.7);animation:prPulse 1.8s ease infinite}
@keyframes prPulse{0%{box-shadow:0 0 0 0 rgba(125,219,168,.65)}70%{box-shadow:0 0 0 10px rgba(125,219,168,0)}100%{box-shadow:0 0 0 0 rgba(125,219,168,0)}}
.pr-hero-title{margin:0 0 18px;max-width:900px;font:600 clamp(30px,5vw,48px)/1.12 'VelaSans',system-ui,sans-serif;letter-spacing:-.6px;color:#fff}
.pr-hero-lead{margin:0 0 34px;max-width:680px;font:400 clamp(17px,2vw,24px)/1.3 'VelaSans',system-ui,sans-serif;color:#c8c8d2}
.pr-hero-actions{display:flex;flex-wrap:wrap;gap:16px}
.pr-hero-actions .btn{padding:15px 28px !important;min-width:210px;justify-content:center}
@media (max-width:600px){.pr-hero-full{height:auto;min-height:0;padding:96px 0 80px}.pr-hero-actions .btn{min-width:0;width:100%}}

.pr-sec--stats{position:relative;z-index:5;margin-top:-56px;padding-top:0;padding-bottom:8px}
@media (max-width:600px){.pr-sec--stats{margin-top:-36px}}
.pr-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:0;padding:22px;border-radius:20px;background:linear-gradient(135deg,rgba(20,22,32,.96),rgba(18,16,28,.94));border:1px solid rgba(127,107,255,.28);backdrop-filter:blur(12px);box-shadow:0 16px 40px rgba(0,0,0,.35)}
.pr-stat{text-align:center;padding:8px;border-radius:14px;transition:transform .25s ease,background .25s ease}
.pr-stat:hover{transform:translateY(-4px);background:rgba(255,255,255,.05)}
.pr-stat-num{font:800 clamp(26px,3.6vw,42px)/1 'VelaSans',system-ui,sans-serif;background:linear-gradient(90deg,#CFC7FF,#7F6BFF);-webkit-background-clip:text;background-clip:text;color:transparent}
.pr-stat-label{margin:8px 0 0;font:500 13px/1.4 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.72)}
@media (max-width:760px){.pr-stats{grid-template-columns:1fr 1fr}}

@media (prefers-reduced-motion:reduce){
  .pr-hero-kicker i,.pr-js .pr-rv{animation:none!important;transition:none;opacity:1;transform:none}
}

/* вкладки «что проектируем» — как сегмент-кнопки на главной */
.pr-seg{display:flex;gap:6px;border-bottom:1px solid rgba(127,107,255,.35);overflow-x:auto;scrollbar-width:none;margin:0 0 26px}
.pr-seg::-webkit-scrollbar{display:none}
.pr-seg button{flex:0 0 auto;border:0;background:transparent;color:#8b8b96;padding:10px 14px;font:500 17px/1.2 'VelaSans',system-ui,sans-serif;cursor:pointer;border-bottom:2px solid transparent;white-space:nowrap;transition:color .2s ease,border-color .2s ease}
.pr-seg button:hover{color:#eef0f6}
.pr-seg button[aria-pressed="true"]{color:#A99AFF;border-bottom-color:#A99AFF}
.pr-sys-pane{display:none}
.pr-sys-pane.is-act{display:grid;grid-template-columns:auto 1fr;gap:22px;align-items:start;animation:prFade .45s ease;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);border-radius:22px;padding:28px}
.pr-sys-pane h3{margin:0 0 8px;font:700 21px/1.3 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.pr-sys-pane .pr-sys-desc{margin:0 0 16px;font:400 15px/1.6 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.72)}
.pr-checks{display:grid;grid-template-columns:1fr 1fr;gap:10px 18px;margin:0;padding:0;list-style:none}
.pr-checks li{display:flex;gap:10px;align-items:flex-start;font:400 15px/1.5 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.85)}
.pr-checks li::before{content:"";flex:0 0 18px;height:18px;margin-top:2px;border-radius:50%;background:rgba(169,154,255,.18) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23A99AFF" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"><path d="M20 6 9 17l-5-5"/></svg>') center/10px no-repeat;border:1px solid rgba(169,154,255,.45)}
.pr-ico{display:inline-flex;align-items:center;justify-content:center;width:64px;height:64px;border-radius:17px;color:#C7BCFF;background:linear-gradient(135deg,rgba(127,107,255,.24),rgba(85,72,170,.18));border:1px solid rgba(127,107,255,.35);transition:transform .25s ease}
.pr-ico svg{width:30px;height:30px}
.pr-sys-nav{display:flex;gap:10px;justify-content:flex-end;margin:16px 0 0}
.pr-nav-btn{cursor:pointer;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.25);background:transparent;color:#CFC7FF;display:inline-flex;align-items:center;justify-content:center;transition:background .2s ease,border-color .2s ease}
.pr-nav-btn:hover{background:rgba(127,107,255,.2);border-color:rgba(127,107,255,.55)}
.pr-nav-btn svg{width:20px;height:20px}
@media (max-width:680px){.pr-sys-pane.is-act{grid-template-columns:1fr}.pr-checks{grid-template-columns:1fr}}

/* этапы — интерактивная лента как на главной */
.pr-stg{display:grid;grid-template-columns:1fr 1.1fr;gap:28px;align-items:start}
.pr-stg-item{cursor:pointer;border-left:2px solid rgba(255,255,255,.14);padding:13px 0 13px 18px;transition:border-color .25s ease,background .25s ease;border-radius:0 12px 12px 0}
.pr-stg-item:hover{background:rgba(255,255,255,.04)}
.pr-stg-item .pr-stg-n{font:700 14px/1 'VelaSans',system-ui,sans-serif;color:#7F6BFF;letter-spacing:.06em}
.pr-stg-item h3{margin:6px 0 0;font:600 17px/1.3 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.6);transition:color .25s ease}
.pr-stg-item.is-act{border-left-color:#7F6BFF;background:rgba(127,107,255,.08)}
.pr-stg-item.is-act h3{color:#fff}
.pr-stg-sub{max-height:0;overflow:hidden;transition:max-height .45s ease;font:400 14px/1.55 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}
.pr-stg-view{position:sticky;top:96px;overflow:hidden;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);border-radius:22px;padding:28px;min-height:250px}
.pr-stg-track{height:4px;border-radius:2px;background:rgba(255,255,255,.12);margin:0 0 24px;overflow:hidden}
.pr-stg-fill{height:100%;width:0;border-radius:2px;background:linear-gradient(90deg,#7F6BFF,#A99AFF)}
.pr-stg-big{position:absolute;right:22px;top:34px;font:800 92px/1 'VelaSans',system-ui,sans-serif;background:linear-gradient(180deg,rgba(207,199,255,.35),rgba(127,107,255,.05));-webkit-background-clip:text;background-clip:text;color:transparent;pointer-events:none}
.pr-stg-body.is-swap{animation:prFade .4s ease}
.pr-stg-title{margin:0 0 10px;max-width:75%;font:700 24px/1.25 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.pr-stg-desc{margin:0;max-width:85%;font:400 16px/1.6 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.75)}
.pr-stg-hint{margin:22px 0 0;font:500 13px/1 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.45)}
@media (max-width:920px){.pr-stg{grid-template-columns:1fr}.pr-stg-view{display:none}.pr-stg-item.is-act .pr-stg-sub{max-height:160px;margin-top:8px}}
@media (min-width:921px){.pr-stg-sub{display:none}}

/* сравнение «без проекта / с проектом» */
.pr-cmp{max-width:860px;margin:0 auto}
.pr-toggle{position:relative;display:flex;margin:0 auto 26px;width:max-content;max-width:100%;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);border-radius:999px;padding:5px}
.pr-toggle::before{content:"";position:absolute;top:5px;bottom:5px;left:5px;width:calc(50% - 5px);border-radius:999px;background:linear-gradient(90deg,#7F6BFF,#5548AA);transition:transform .35s cubic-bezier(.4,0,.2,1)}
.pr-toggle.is-b::before{transform:translateX(100%)}
.pr-toggle button{position:relative;z-index:1;flex:1 1 auto;border:0;background:transparent;cursor:pointer;font:600 15px/1 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.65);padding:12px 26px;border-radius:999px;transition:color .25s ease;white-space:nowrap}
.pr-toggle button[aria-pressed="true"]{color:#fff}
.pr-cmp-pane{display:none;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);border-radius:22px;padding:26px}
.pr-cmp-pane.is-act{display:block}
.pr-cmp-row{display:flex;gap:12px;align-items:flex-start;padding:11px 0;font:400 16px/1.5 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.85)}
.pr-cmp-row + .pr-cmp-row{border-top:1px solid rgba(255,255,255,.08)}
.pr-cmp-pane.is-act .pr-cmp-row{animation:prFade .4s ease both}
.pr-cmp-pane.is-act .pr-cmp-row:nth-child(2){animation-delay:.05s}
.pr-cmp-pane.is-act .pr-cmp-row:nth-child(3){animation-delay:.1s}
.pr-cmp-pane.is-act .pr-cmp-row:nth-child(4){animation-delay:.15s}
.pr-cmp-pane.is-act .pr-cmp-row:nth-child(5){animation-delay:.2s}
.pr-x,.pr-v{flex:0 0 22px;height:22px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;margin-top:1px}
.pr-x{background:rgba(255,99,99,.15);border:1px solid rgba(255,99,99,.4);color:#ff8f8f}
.pr-v{background:rgba(169,154,255,.15);border:1px solid rgba(169,154,255,.45);color:#A99AFF}
.pr-x svg,.pr-v svg{width:11px;height:11px}

/* CTA + выбор систем */
.pr-cta{padding:clamp(48px,7vw,86px) 0;text-align:center;background:
  linear-gradient(135deg,rgba(127,107,255,.35),rgba(85,72,170,.15)),
  radial-gradient(700px 380px at 80% 20%,rgba(127,107,255,.4),transparent 60%),#16141f}
.pr-cta h2{margin:0;font:800 clamp(26px,4vw,44px)/1.15 'VelaSans',system-ui,sans-serif;color:#fff}
.pr-cta p{margin:14px auto 0;max-width:640px;font:400 clamp(15px,1.7vw,18px)/1.6 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.85)}
.pr-chips{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:28px 0 0}
.pr-chip{cursor:pointer;display:inline-flex;align-items:center;gap:8px;font:600 14px/1 'VelaSans',system-ui,sans-serif;color:#CFC7FF;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.2);padding:11px 16px;border-radius:999px;transition:background .2s ease,color .2s ease,border-color .2s ease,transform .15s ease}
.pr-chip:hover{transform:translateY(-2px);border-color:rgba(127,107,255,.6)}
.pr-chip svg{width:13px;height:13px;opacity:0;transform:scale(.3);transition:opacity .2s ease,transform .2s ease}
.pr-chip.is-on{color:#fff;background:linear-gradient(90deg,#7F6BFF,#5548AA);border-color:transparent}
.pr-chip.is-on svg{opacity:1;transform:none}
.pr-note{margin:16px 0 0;font:500 14px/1.4 'VelaSans',system-ui,sans-serif;color:#CFC7FF;min-height:20px}
.pr-cta-actions{justify-content:center;display:flex;flex-wrap:wrap;gap:14px;margin:24px 0 0}
.pr-cta small{display:block;margin:16px 0 0;font:400 13px/1.4 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.6)}

@media (prefers-reduced-motion:reduce){
  .pr-orb,.pr-gw,.pr-badge--gift{animation:none!important}
  .pr-js .pr-rv{transition:none;opacity:1;transform:none}
}


/* ---- modernizaciya-page.css ---- */
/* Модернизация существующего умного дома */

body:has(.md-hero-full){overflow-x:hidden}
.uni-main:has(.md-hero-full){padding-top:0}
.uni-main:has(.md-hero-full) .uni-wrap:first-child{padding-top:0}
.uni-main:has(.md-hero-full) .uni-title{display:none}
.uni-main .uni-wrap > .md-hero-full{margin-top:0 !important}

.md-sec{padding:28px 0}
.md-h2{margin:0 0 12px;font:700 clamp(22px,3vw,32px)/1.2 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.md-sub{margin:0 0 22px;max-width:820px;font:400 clamp(14px,1.6vw,17px)/1.6 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}
.md-btn{cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;font:600 16px/1 'VelaSans',system-ui,sans-serif;color:#fff;border:0;padding:16px 28px;border-radius:14px;background:linear-gradient(90deg,#7F6BFF,#5548AA);box-shadow:0 8px 24px rgba(127,107,255,.35);transition:filter .15s ease,transform .15s ease;text-decoration:none}
.md-btn:hover{filter:brightness(1.08);transform:translateY(-2px)}
.md-btn--ghost{background:transparent;border:1px solid rgba(255,255,255,.35);box-shadow:none}
.md-btn--ghost:hover{background:rgba(255,255,255,.08)}
.md-btn--sm{padding:11px 18px;font-size:14px;border-radius:12px}

.md-hero-full{
  position:relative;left:50%;right:50%;width:100vw;margin-left:-50vw;margin-right:-50vw;
  min-height:620px;display:flex;align-items:center;overflow:hidden;color:#eef0f6;
  background:#0a0c14;
}
.md-hero-bg{
  position:absolute;inset:0;z-index:0;
  background:
    radial-gradient(ellipse at 15% 20%,rgba(127,107,255,.28),transparent 42%),
    radial-gradient(ellipse at 85% 70%,rgba(255,140,80,.12),transparent 40%),
    linear-gradient(120deg,#0a0c14 0%,#12141c 50%,#0e1018 100%);
}
.md-hero-grid{
  position:absolute;inset:0;z-index:1;opacity:.35;pointer-events:none;
  background-image:
    linear-gradient(rgba(169,154,255,.08) 1px,transparent 1px),
    linear-gradient(90deg,rgba(169,154,255,.08) 1px,transparent 1px);
  background-size:48px 48px;
  mask-image:radial-gradient(ellipse at 60% 40%,#000 20%,transparent 75%);
}
.md-hero-overlay{position:absolute;inset:0;z-index:2;background:linear-gradient(105deg,rgba(8,10,16,.75) 0%,rgba(8,10,16,.35) 55%,transparent 100%)}
.md-hero-in{position:relative;z-index:3;width:1600px;max-width:88%;margin:0 auto;padding:100px 20px 80px;display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center}
@media (max-width:960px){.md-hero-in{grid-template-columns:1fr;padding:96px 20px 64px}}
.md-hero-kicker{
  display:inline-flex;align-items:center;gap:8px;margin:0 0 16px;padding:7px 12px;border-radius:999px;
  font:600 12px/1 'VelaSans',system-ui,sans-serif;letter-spacing:.04em;text-transform:uppercase;
  color:#CFC7FF;background:rgba(127,107,255,.16);border:1px solid rgba(127,107,255,.35);
}
.md-hero-title{margin:0 0 18px;max-width:640px;font:600 clamp(30px,5vw,48px)/1.12 'VelaSans',system-ui,sans-serif;letter-spacing:-.6px;color:#fff}
.md-hero-lead{margin:0 0 28px;max-width:560px;font:400 clamp(16px,1.8vw,20px)/1.4 'VelaSans',system-ui,sans-serif;color:#c8c8d2}
.md-hero-actions{display:flex;flex-wrap:wrap;gap:14px}
.md-hero-actions .btn{padding:15px 28px !important;min-width:200px;justify-content:center}
@media (max-width:600px){.md-hero-actions .btn{min-width:0;width:100%}}

.md-hero-card{
  position:relative;border-radius:24px;padding:22px;overflow:hidden;
  background:rgba(18,20,28,.72);border:1px solid rgba(255,255,255,.12);
  backdrop-filter:blur(16px);box-shadow:0 24px 60px rgba(0,0,0,.4);
}
.md-hero-card-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 16px}
.md-hero-card-top strong{font:700 14px/1.2 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.md-toggle{
  display:inline-flex;padding:4px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);
}
.md-toggle button{
  cursor:pointer;border:0;background:transparent;color:rgba(238,240,246,.55);
  font:600 12px/1 'VelaSans',system-ui,sans-serif;padding:8px 14px;border-radius:999px;transition:all .25s ease;
}
.md-toggle button.is-act{background:rgba(127,107,255,.35);color:#fff}

.md-stack{position:relative;display:grid;gap:10px;min-height:220px}
.md-app{
  display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);
  transition:opacity .4s ease,transform .4s ease,border-color .4s ease;
}
.md-app i{
  flex:0 0 36px;width:36px;height:36px;border-radius:10px;display:grid;place-items:center;
  font:800 11px/1 'VelaSans',system-ui,sans-serif;color:#fff;
}
.md-app strong{display:block;font:700 13px/1.2 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.md-app span{display:block;font:500 11px/1.3 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.5);margin-top:2px}
.md-app--warn i{background:linear-gradient(135deg,#FF8A5B,#C45A30)}
.md-app--mute i{background:linear-gradient(135deg,#6a7088,#3d4254)}
.md-app--ok i{background:linear-gradient(135deg,#7F6BFF,#5548AA)}
.md-hero-card[data-view="before"] .md-app--new{opacity:0;transform:translateY(8px);pointer-events:none;position:absolute}
.md-hero-card[data-view="after"] .md-app--old{opacity:.25;filter:grayscale(1);transform:scale(.98)}
.md-hero-card[data-view="after"] .md-app--new{opacity:1;transform:none;position:relative}
.md-hero-note{margin:14px 0 0;font:500 12px/1.4 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.55)}
.md-hero-note b{color:#CFC7FF}

.md-sec--stats{position:relative;z-index:5;margin-top:-48px;padding-top:0;padding-bottom:8px}
@media (max-width:600px){.md-sec--stats{margin-top:-28px}}
.md-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:0;padding:22px;border-radius:20px;background:linear-gradient(135deg,rgba(20,22,32,.94),rgba(18,16,28,.9));border:1px solid rgba(127,107,255,.28);backdrop-filter:blur(12px);box-shadow:0 16px 40px rgba(0,0,0,.35)}
.md-stat{text-align:center;padding:8px;border-radius:14px;transition:transform .25s ease,background .25s ease}
.md-stat:hover{transform:translateY(-4px);background:rgba(255,255,255,.05)}
.md-stat-num{font:800 clamp(26px,3.6vw,42px)/1 'VelaSans',system-ui,sans-serif;background:linear-gradient(90deg,#CFC7FF,#7F6BFF);-webkit-background-clip:text;background-clip:text;color:transparent}
.md-stat-label{margin:8px 0 0;font:500 13px/1.4 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.72)}
@media (max-width:760px){.md-stats{grid-template-columns:1fr 1fr}}

/* Diagnostic demo */
.md-diag{display:grid;grid-template-columns:1fr 1.15fr;gap:22px;align-items:stretch}
@media (max-width:960px){.md-diag{grid-template-columns:1fr}}
.md-pain{
  display:flex;flex-direction:column;gap:10px;padding:22px;border-radius:20px;
  background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.1);
}
.md-pain h3{margin:0;font:700 20px/1.3 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.md-pain > p{margin:0 0 6px;font:400 14px/1.5 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.65)}
.md-pain-btn{
  text-align:left;cursor:pointer;border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.03);border-radius:14px;padding:13px 14px;color:#eef0f6;
  transition:border-color .2s ease,background .2s ease,transform .2s ease;
}
.md-pain-btn:hover,.md-pain-btn.is-act{
  border-color:rgba(169,154,255,.55);background:rgba(127,107,255,.14);transform:translateX(3px);
}
.md-pain-btn strong{display:block;font:600 14px/1.3 'VelaSans',system-ui,sans-serif;margin:0 0 3px}
.md-pain-btn span{display:block;font:400 12px/1.4 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.6)}

.md-plan{
  position:relative;overflow:hidden;border-radius:20px;padding:22px;min-height:420px;
  display:flex;flex-direction:column;gap:16px;
  background:
    radial-gradient(ellipse at 90% 0%,rgba(127,107,255,.18),transparent 45%),
    linear-gradient(160deg,#141621,#0e1018 60%,#12141c);
  border:1px solid rgba(255,255,255,.1);
}
.md-plan-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap}
.md-plan-head h3{margin:0;font:700 18px/1.3 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.md-plan-head p{margin:6px 0 0;max-width:420px;font:400 13px/1.5 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.65)}
.md-plan-tag{
  padding:7px 12px;border-radius:999px;font:600 11px/1 'VelaSans',system-ui,sans-serif;
  color:#CFC7FF;background:rgba(127,107,255,.18);border:1px solid rgba(127,107,255,.35);white-space:nowrap;
}
.md-modules{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
@media (max-width:560px){.md-modules{grid-template-columns:1fr}}
.md-mod{
  display:none;padding:14px;border-radius:16px;background:rgba(127,107,255,.12);border:1px solid rgba(169,154,255,.4);
  animation:mdModIn .45s ease;
}
.md-mod.is-on{display:block}
@keyframes mdModIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.md-mod strong{display:block;font:700 14px/1.25 'VelaSans',system-ui,sans-serif;color:#fff;margin:0 0 4px}
.md-mod span{display:block;font:400 12px/1.45 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.65)}
.md-plan-products{display:flex;flex-wrap:wrap;gap:10px;margin-top:auto}
.md-chip-prod{
  display:flex;align-items:center;gap:10px;padding:8px 12px 8px 8px;border-radius:14px;text-decoration:none;
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);color:#EEF0F6;
  transition:border-color .2s ease,transform .2s ease,background .2s ease;
}
.md-chip-prod:hover{border-color:rgba(169,154,255,.5);background:rgba(127,107,255,.12);transform:translateY(-2px)}
.md-chip-prod img{width:40px;height:40px;border-radius:10px;object-fit:cover;background:#1a1c24}
.md-chip-prod b{display:block;font:600 12px/1.2 'VelaSans',system-ui,sans-serif}
.md-chip-prod small{display:block;font:500 11px/1.2 'VelaSans',system-ui,sans-serif;color:#A99AFF;margin-top:2px}

/* Paths / packages */
.md-paths{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media (max-width:900px){.md-paths{grid-template-columns:1fr}}
.md-path{
  position:relative;overflow:hidden;border-radius:22px;padding:26px 22px;
  background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.1);
  display:flex;flex-direction:column;gap:14px;transition:transform .2s ease,border-color .2s ease;
}
.md-path:hover{transform:translateY(-5px);border-color:rgba(127,107,255,.45)}
.md-path--hot{background:linear-gradient(160deg,rgba(127,107,255,.18),rgba(85,72,170,.06));border-color:rgba(127,107,255,.4)}
.md-path-badge{
  align-self:flex-start;padding:6px 10px;border-radius:999px;font:600 11px/1 'VelaSans',system-ui,sans-serif;
  color:#CFC7FF;background:rgba(127,107,255,.2);border:1px solid rgba(127,107,255,.35);
}
.md-path h3{margin:0;font:700 22px/1.2 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.md-path > p{margin:0;font:400 14px/1.55 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}
.md-path ul{margin:0;padding:0;list-style:none;display:grid;gap:8px}
.md-path li{display:flex;gap:8px;align-items:flex-start;font:400 13px/1.45 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.82)}
.md-path li::before{content:"";flex:0 0 8px;height:8px;margin-top:5px;border-radius:50%;background:#A99AFF;box-shadow:0 0 0 3px rgba(169,154,255,.2)}
.md-path-price{margin-top:auto;font:800 20px/1 'VelaSans',system-ui,sans-serif;background:linear-gradient(90deg,#CFC7FF,#7F6BFF);-webkit-background-clip:text;background-clip:text;color:transparent}
.md-path-price small{font:500 13px/1 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.55);margin-left:6px}

/* Keep / replace */
.md-matrix{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media (max-width:720px){.md-matrix{grid-template-columns:1fr}}
.md-matrix-col{border-radius:20px;padding:24px;border:1px solid rgba(255,255,255,.1)}
.md-matrix-col--keep{background:linear-gradient(160deg,rgba(80,180,120,.1),rgba(255,255,255,.02))}
.md-matrix-col--change{background:linear-gradient(160deg,rgba(127,107,255,.12),rgba(255,255,255,.02))}
.md-matrix-col h3{margin:0 0 14px;font:700 18px/1.3 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.md-matrix-col ul{margin:0;padding:0;list-style:none;display:grid;gap:10px}
.md-matrix-col li{font:400 14px/1.5 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.78);padding-left:18px;position:relative}
.md-matrix-col--keep li::before{content:"";position:absolute;left:0;top:7px;width:8px;height:8px;border-radius:50%;background:#7DDBA8}
.md-matrix-col--change li::before{content:"";position:absolute;left:0;top:7px;width:8px;height:8px;border-radius:50%;background:#A99AFF}

/* Timeline */
.md-timeline{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;counter-reset:mdt}
@media (max-width:1000px){.md-timeline{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.md-timeline{grid-template-columns:1fr}}
.md-tl{
  position:relative;border-radius:18px;padding:22px 18px;background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.08);transition:transform .2s ease,border-color .2s ease;
}
.md-tl:hover{transform:translateY(-4px);border-color:rgba(127,107,255,.45)}
.md-tl::before{
  counter-increment:mdt;content:"0" counter(mdt);display:block;margin:0 0 12px;
  font:800 24px/1 'VelaSans',system-ui,sans-serif;background:linear-gradient(90deg,#CFC7FF,#7F6BFF);-webkit-background-clip:text;background-clip:text;color:transparent;
}
.md-tl h3{margin:0 0 8px;font:700 16px/1.25 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.md-tl p{margin:0;font:400 13px/1.5 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}

/* Products grid */
.md-products{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
@media (max-width:1000px){.md-products{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.md-products{grid-template-columns:1fr}}
.md-prod{
  display:flex;flex-direction:column;border-radius:18px;overflow:hidden;text-decoration:none;color:inherit;
  background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.1);
  transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease;
}
.md-prod:hover{transform:translateY(-5px);border-color:rgba(127,107,255,.5);box-shadow:0 16px 40px rgba(0,0,0,.25)}
.md-prod-img{aspect-ratio:1;background:#161822;display:grid;place-items:center;padding:18px}
.md-prod-img img{width:100%;height:100%;object-fit:contain}
.md-prod-body{padding:16px;display:flex;flex-direction:column;gap:8px;flex:1}
.md-prod-tag{align-self:flex-start;font:600 10px/1 'VelaSans',system-ui,sans-serif;letter-spacing:.04em;text-transform:uppercase;color:#A99AFF}
.md-prod h3{margin:0;font:700 15px/1.3 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.md-prod p{margin:0;font:400 12px/1.45 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.6);flex:1}
.md-prod-price{font:800 16px/1 'VelaSans',system-ui,sans-serif;color:#CFC7FF}

/* Cases */
.md-cases{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media (max-width:900px){.md-cases{grid-template-columns:1fr}}
.md-case{
  position:relative;overflow:hidden;min-height:240px;border-radius:20px;border:0;
  background:#14151b center/cover no-repeat;transition:transform .2s ease;
}
.md-case::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(11,12,15,.15) 0%,rgba(11,12,15,.55) 40%,rgba(11,12,15,.94) 100%);
}
.md-case:hover{transform:translateY(-5px)}
.md-case-body{position:relative;z-index:1;padding:22px;display:flex;flex-direction:column;justify-content:flex-end;height:100%;min-height:240px;border:0}
.md-case-tag{align-self:flex-start;margin:0 0 12px;font:600 11px/1 'VelaSans',system-ui,sans-serif;color:#CFC7FF;background:rgba(127,107,255,.22);border:1px solid rgba(127,107,255,.4);padding:6px 10px;border-radius:999px}
.md-case h3{margin:0;font:700 18px/1.3 'VelaSans',system-ui,sans-serif;color:#fff}
.md-case p{margin:8px 0 0;font:400 13px/1.5 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.82)}

/* FAQ */
.md-faq{display:grid;gap:10px}
.md-faq details{
  border-radius:16px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.1);padding:0 18px;
  transition:border-color .2s ease,background .2s ease;
}
.md-faq details[open]{border-color:rgba(127,107,255,.4);background:rgba(127,107,255,.08)}
.md-faq summary{
  cursor:pointer;list-style:none;padding:18px 0;font:700 16px/1.35 'VelaSans',system-ui,sans-serif;color:#EEF0F6;
  display:flex;align-items:center;justify-content:space-between;gap:16px;
}
.md-faq summary::-webkit-details-marker{display:none}
.md-faq summary::after{content:"+";font:700 22px/1 'VelaSans',system-ui,sans-serif;color:#A99AFF}
.md-faq details[open] summary::after{content:"–"}
.md-faq details p{margin:0 0 18px;font:400 14px/1.6 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.72);max-width:820px}

.md-cta{
  display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;padding:32px;
  border-radius:22px;background:linear-gradient(135deg,rgba(127,107,255,.2),rgba(85,72,170,.08));
  border:1px solid rgba(127,107,255,.3);
}
.md-cta h3{margin:0;font:700 clamp(20px,2.6vw,28px)/1.2 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.md-cta p{margin:8px 0 0;max-width:560px;font:400 15px/1.55 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.74)}
.md-cta-btns{display:flex;flex-wrap:wrap;gap:12px}
@media (max-width:520px){.md-cta-btns{width:100%}.md-cta .md-btn{width:100%}}


/* ---- dispetcherizaciya-page.css ---- */
/* Диспетчеризация инженерных систем */

body:has(.dp-hero-full){overflow-x:hidden}
.uni-main:has(.dp-hero-full){padding-top:0}
.uni-main:has(.dp-hero-full) .uni-wrap:first-child{padding-top:0}
.uni-main:has(.dp-hero-full) .uni-title{display:none}
.uni-main .uni-wrap > .dp-hero-full{margin-top:0 !important}

.dp-sec{padding:28px 0}
.dp-h2{margin:0 0 12px;font:700 clamp(22px,3vw,32px)/1.2 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.dp-sub{margin:0 0 22px;max-width:820px;font:400 clamp(14px,1.6vw,17px)/1.6 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}
.dp-btn{cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;font:600 16px/1 'VelaSans',system-ui,sans-serif;color:#fff;border:0;padding:16px 28px;border-radius:14px;background:linear-gradient(90deg,#7F6BFF,#5548AA);box-shadow:0 8px 24px rgba(127,107,255,.35);transition:filter .15s ease,transform .15s ease;text-decoration:none}
.dp-btn:hover{filter:brightness(1.08);transform:translateY(-2px)}
.dp-btn--ghost{background:transparent;border:1px solid rgba(255,255,255,.35);box-shadow:none}
.dp-btn--ghost:hover{background:rgba(255,255,255,.08)}
.dp-btn--sm{padding:11px 18px;font-size:14px;border-radius:12px}

/* ——— Hero ——— */
.dp-hero-full{
  position:relative;left:50%;right:50%;width:100vw;margin-left:-50vw;margin-right:-50vw;
  min-height:640px;display:flex;align-items:center;overflow:hidden;color:#eef0f6;
  background:#080a12 url("../images/kv2.jpg") center / cover no-repeat;
}
.dp-hero-bg{
  position:absolute;inset:0;z-index:0;
  background:
    radial-gradient(ellipse at 20% 30%,rgba(127,107,255,.22),transparent 45%),
    radial-gradient(ellipse at 80% 20%,rgba(80,200,180,.08),transparent 40%),
    radial-gradient(ellipse at 70% 80%,rgba(255,120,80,.06),transparent 42%),
    linear-gradient(125deg,rgba(8,10,18,.78) 0%,rgba(16,19,28,.55) 55%,rgba(10,12,20,.72) 100%);
}
.dp-hero-scan{
  position:absolute;inset:0;z-index:1;pointer-events:none;opacity:.5;
  background:linear-gradient(180deg,transparent 0%,rgba(169,154,255,.08) 48%,transparent 52%);
  background-size:100% 220%;
  animation:dpScan 5.5s linear infinite;
}
@keyframes dpScan{0%{background-position:0 -40%}100%{background-position:0 140%}}
.dp-hero-overlay{position:absolute;inset:0;z-index:2;background:linear-gradient(105deg,rgba(8,10,16,.78) 0%,rgba(8,10,16,.35) 52%,transparent 100%)}
.dp-hero-in{position:relative;z-index:3;width:1600px;max-width:88%;margin:0 auto;padding:100px 20px 80px;display:grid;grid-template-columns:1fr 1.05fr;gap:36px;align-items:center}
@media (max-width:980px){.dp-hero-in{grid-template-columns:1fr;padding:96px 20px 64px}}
.dp-hero-kicker{
  display:inline-flex;align-items:center;gap:8px;margin:0 0 16px;padding:7px 12px;border-radius:999px;
  font:600 12px/1 'VelaSans',system-ui,sans-serif;letter-spacing:.04em;text-transform:uppercase;
  color:#CFC7FF;background:rgba(127,107,255,.16);border:1px solid rgba(127,107,255,.35);
}
.dp-hero-kicker i{
  width:8px;height:8px;border-radius:50%;background:#7DDBA8;
  box-shadow:0 0 0 0 rgba(125,219,168,.7);animation:dpPulse 1.8s ease infinite;
}
@keyframes dpPulse{0%{box-shadow:0 0 0 0 rgba(125,219,168,.65)}70%{box-shadow:0 0 0 10px rgba(125,219,168,0)}100%{box-shadow:0 0 0 0 rgba(125,219,168,0)}}
.dp-hero-title{margin:0 0 18px;max-width:560px;font:600 clamp(28px,4.6vw,46px)/1.12 'VelaSans',system-ui,sans-serif;letter-spacing:-.5px;color:#fff}
.dp-hero-lead{margin:0 0 28px;max-width:520px;font:400 clamp(16px,1.8vw,19px)/1.45 'VelaSans',system-ui,sans-serif;color:#c8c8d2}
.dp-hero-actions{display:flex;flex-wrap:wrap;gap:14px}
.dp-hero-actions .btn{padding:15px 28px !important;min-width:200px;justify-content:center}
@media (max-width:600px){.dp-hero-actions .btn{min-width:0;width:100%}}

/* Hero live panel */
.dp-panel{
  position:relative;border-radius:24px;padding:18px;overflow:hidden;
  background:rgba(14,16,24,.82);border:1px solid rgba(255,255,255,.12);
  backdrop-filter:blur(16px);box-shadow:0 28px 70px rgba(0,0,0,.45);
}
.dp-panel::before{
  content:"";position:absolute;inset:-40% -20%;pointer-events:none;opacity:.35;
  background:conic-gradient(from 0deg,transparent 0 70%,rgba(127,107,255,.25) 78%,transparent 88%);
  animation:dpSpin 14s linear infinite;
}
@keyframes dpSpin{to{transform:rotate(360deg)}}
.dp-panel-in{position:relative;z-index:1}
.dp-panel-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 14px}
.dp-panel-top strong{font:700 13px/1.2 'VelaSans',system-ui,sans-serif;color:#EEF0F6;letter-spacing:.02em}
.dp-live{
  display:inline-flex;align-items:center;gap:7px;padding:6px 10px;border-radius:999px;
  font:700 11px/1 'VelaSans',system-ui,sans-serif;color:#7DDBA8;background:rgba(125,219,168,.12);border:1px solid rgba(125,219,168,.35);
}
.dp-live::before{content:"";width:7px;height:7px;border-radius:50%;background:#7DDBA8;animation:dpBlink 1.2s ease infinite}
@keyframes dpBlink{0%,100%{opacity:1}50%{opacity:.35}}
.dp-clock{font:600 12px/1 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.55);font-variant-numeric:tabular-nums}

.dp-radar{
  position:relative;height:260px;border-radius:18px;overflow:hidden;margin:0 0 12px;
  background:
    radial-gradient(circle at 50% 55%,rgba(127,107,255,.18),transparent 55%),
    linear-gradient(160deg,#12141e,#0c0e16);
  border:1px solid rgba(255,255,255,.08);
}
.dp-radar-grid{
  position:absolute;inset:0;opacity:.4;pointer-events:none;
  background-image:
    linear-gradient(rgba(169,154,255,.1) 1px,transparent 1px),
    linear-gradient(90deg,rgba(169,154,255,.1) 1px,transparent 1px);
  background-size:28px 28px;
}
.dp-radar-sweep{
  position:absolute;left:50%;top:55%;width:140%;height:140%;transform:translate(-50%,-50%);
  background:conic-gradient(from 0deg,transparent 0deg,rgba 300deg,rgba(127,107,255,.22) 360deg);
  animation:dpSpin 4.5s linear infinite;pointer-events:none;opacity:.7;
  mask-image:radial-gradient(circle,transparent 8%,#000 9%,#000 48%,transparent 49%);
}
.dp-hub{
  position:absolute;left:50%;top:55%;transform:translate(-50%,-50%);
  width:64px;height:64px;border-radius:50%;display:grid;place-items:center;z-index:3;
  background:linear-gradient(145deg,#7F6BFF,#5548AA);color:#fff;
  font:800 11px/1 'VelaSans',system-ui,sans-serif;letter-spacing:.04em;
  box-shadow:0 0 0 0 rgba(127,107,255,.55),0 0 40px rgba(127,107,255,.45);
  animation:dpHub 2.4s ease-in-out infinite;
}
@keyframes dpHub{
  0%,100%{box-shadow:0 0 0 0 rgba(127,107,255,.5),0 0 36px rgba(127,107,255,.4)}
  50%{box-shadow:0 0 0 14px rgba(127,107,255,0),0 0 48px rgba(127,107,255,.55)}
}
.dp-hub span{display:block;text-align:center}
.dp-svg{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none}
.dp-svg path{
  fill:none;stroke:rgba(169,154,255,.45);stroke-width:1.5;stroke-dasharray:6 8;
  animation:dpDash 2.2s linear infinite;
}
@keyframes dpDash{to{stroke-dashoffset:-28}}
.dp-node{
  position:absolute;z-index:2;display:flex;flex-direction:column;align-items:center;gap:4px;
  transform:translate(-50%,-50%);cursor:default;
}
.dp-node-dot{
  width:14px;height:14px;border-radius:50%;background:#A99AFF;
  box-shadow:0 0 0 4px rgba(169,154,255,.2);transition:background .3s ease,box-shadow .3s ease,transform .3s ease;
  animation:dpNodeFloat 3.2s ease-in-out infinite;
}
.dp-node:nth-child(odd) .dp-node-dot{animation-delay:.4s}
.dp-node:nth-child(3n) .dp-node-dot{animation-delay:.9s}
@keyframes dpNodeFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
.dp-node strong{
  font:600 10px/1 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.85);
  padding:4px 8px;border-radius:8px;background:rgba(10,12,18,.75);border:1px solid rgba(255,255,255,.1);
  white-space:nowrap;
}
.dp-node.is-ok .dp-node-dot{background:#7DDBA8;box-shadow:0 0 0 4px rgba(125,219,168,.22)}
.dp-node.is-warn .dp-node-dot{background:#FFB86B;box-shadow:0 0 0 4px rgba(255,184,107,.25);animation:dpNodeWarn .9s ease infinite}
.dp-node.is-alert .dp-node-dot{background:#FF6B7A;box-shadow:0 0 0 5px rgba(255,107,122,.3);animation:dpNodeWarn .55s ease infinite}
@keyframes dpNodeWarn{0%,100%{transform:scale(1)}50%{transform:scale(1.25)}}

.dp-node--heat{left:18%;top:28%}
.dp-node--vent{left:82%;top:26%}
.dp-node--water{left:14%;top:72%}
.dp-node--power{left:86%;top:70%}
.dp-node--lock{left:50%;top:16%}

.dp-chips{display:flex;flex-wrap:wrap;gap:8px}
.dp-chip{
  display:inline-flex;align-items:center;gap:6px;padding:7px 11px;border-radius:12px;
  font:600 11px/1 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.8);
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);
  animation:dpChipIn .6s ease both;
}
.dp-chip:nth-child(2){animation-delay:.1s}
.dp-chip:nth-child(3){animation-delay:.2s}
.dp-chip:nth-child(4){animation-delay:.3s}
@keyframes dpChipIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.dp-chip b{color:#CFC7FF;font-variant-numeric:tabular-nums}
.dp-chip--up b{color:#7DDBA8}
.dp-chip--down b{color:#FFB86B}

/* Stats */
.dp-sec--stats{position:relative;z-index:5;margin-top:-48px;padding-top:0;padding-bottom:8px}
@media (max-width:600px){.dp-sec--stats{margin-top:-28px}}
.dp-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:0;padding:22px;border-radius:20px;background:linear-gradient(135deg,rgba(20,22,32,.94),rgba(18,16,28,.9));border:1px solid rgba(127,107,255,.28);backdrop-filter:blur(12px);box-shadow:0 16px 40px rgba(0,0,0,.35)}
.dp-stat{text-align:center;padding:8px;border-radius:14px;transition:transform .25s ease,background .25s ease}
.dp-stat:hover{transform:translateY(-4px);background:rgba(255,255,255,.05)}
.dp-stat-num{font:800 clamp(26px,3.6vw,42px)/1 'VelaSans',system-ui,sans-serif;background:linear-gradient(90deg,#CFC7FF,#7F6BFF);-webkit-background-clip:text;background-clip:text;color:transparent}
.dp-stat-label{margin:8px 0 0;font:500 13px/1.4 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.72)}
@media (max-width:760px){.dp-stats{grid-template-columns:1fr 1fr}}

/* Demo */
.dp-demo{display:grid;grid-template-columns:1.2fr .8fr;gap:22px;align-items:stretch}
@media (max-width:980px){.dp-demo{grid-template-columns:1fr}}
.dp-stage{
  position:relative;overflow:hidden;border-radius:22px;padding:20px;min-height:480px;
  display:flex;flex-direction:column;gap:14px;
  background:linear-gradient(165deg,#141621,#0e1018 55%,#12141c);
  border:1px solid rgba(255,255,255,.1);
  transition:border-color .35s ease,box-shadow .35s ease;
}
.dp-stage[data-mode="alarm"]{border-color:rgba(255,107,122,.45);box-shadow:0 0 40px rgba(255,107,122,.12)}
.dp-stage[data-mode="peak"]{border-color:rgba(255,184,107,.4);box-shadow:0 0 40px rgba(255,184,107,.1)}
.dp-stage-flash{
  position:absolute;inset:0;pointer-events:none;opacity:0;z-index:0;
  background:radial-gradient(ellipse at 50% 30%,rgba(255,107,122,.2),transparent 60%);
  transition:opacity .4s ease;
}
.dp-stage[data-mode="alarm"] .dp-stage-flash{opacity:1;animation:dpFlash 1.4s ease infinite}
@keyframes dpFlash{0%,100%{opacity:.55}50%{opacity:1}}

.dp-stage-top{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.dp-status-pill{
  display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;
  font:700 12px/1 'VelaSans',system-ui,sans-serif;color:#7DDBA8;
  background:rgba(125,219,168,.12);border:1px solid rgba(125,219,168,.35);
  transition:color .3s ease,background .3s ease,border-color .3s ease;
}
.dp-status-pill::before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor;animation:dpBlink 1.4s ease infinite}
.dp-stage[data-mode="alarm"] .dp-status-pill{color:#FF6B7A;background:rgba(255,107,122,.12);border-color:rgba(255,107,122,.4)}
.dp-stage[data-mode="peak"] .dp-status-pill{color:#FFB86B;background:rgba(255,184,107,.12);border-color:rgba(255,184,107,.4)}
.dp-stage[data-mode="night"] .dp-status-pill{color:#A99AFF;background:rgba(127,107,255,.14);border-color:rgba(127,107,255,.35)}
.dp-stage-meta{font:500 12px/1.3 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.55)}

.dp-board{position:relative;z-index:1;display:grid;grid-template-columns:1.1fr .9fr;gap:14px;flex:1}
@media (max-width:720px){.dp-board{grid-template-columns:1fr}}

.dp-schematic{
  position:relative;border-radius:18px;min-height:280px;overflow:hidden;
  background:
    radial-gradient(ellipse at 50% 40%,rgba(127,107,255,.12),transparent 55%),
    linear-gradient(160deg,#181a24,#101218);
  border:1px solid rgba(255,255,255,.08);
}
.dp-floor{
  position:absolute;left:12%;right:12%;top:18%;bottom:14%;
  border:1px solid rgba(255,255,255,.12);border-radius:12px;
  background:rgba(255,255,255,.02);
}
.dp-floor::before,.dp-floor::after{
  content:"";position:absolute;background:rgba(255,255,255,.08);
}
.dp-floor::before{left:38%;top:0;bottom:0;width:1px}
.dp-floor::after{left:0;right:0;top:48%;height:1px}
.dp-sys{
  position:absolute;display:flex;flex-direction:column;align-items:center;gap:6px;
  transform:translate(-50%,-50%);transition:transform .35s ease;
}
.dp-sys:hover{transform:translate(-50%,-50%) scale(1.06)}
.dp-sys-ring{
  width:52px;height:52px;border-radius:50%;display:grid;place-items:center;
  background:rgba(20,22,32,.9);border:2px solid rgba(169,154,255,.35);
  position:relative;transition:border-color .35s ease,box-shadow .35s ease;
}
.dp-sys-ring::before{
  content:"";position:absolute;inset:-5px;border-radius:50%;
  border:1px solid rgba(169,154,255,.2);
  animation:dpRing 2.8s ease-in-out infinite;
}
@keyframes dpRing{0%,100%{transform:scale(1);opacity:.6}50%{transform:scale(1.12);opacity:1}}
.dp-sys.is-ok .dp-sys-ring{border-color:rgba(125,219,168,.55);box-shadow:0 0 20px rgba(125,219,168,.15)}
.dp-sys.is-warn .dp-sys-ring{border-color:rgba(255,184,107,.6);box-shadow:0 0 22px rgba(255,184,107,.2)}
.dp-sys.is-alert .dp-sys-ring{border-color:rgba(255,107,122,.7);box-shadow:0 0 26px rgba(255,107,122,.25);animation:dpShake .5s ease}
@keyframes dpShake{0%,100%{transform:translateX(0)}25%{transform:translateX(-2px)}75%{transform:translateX(2px)}}
.dp-sys-ring svg{width:22px;height:22px;color:#CFC7FF}
.dp-sys.is-ok .dp-sys-ring svg{color:#7DDBA8}
.dp-sys.is-warn .dp-sys-ring svg{color:#FFB86B}
.dp-sys.is-alert .dp-sys-ring svg{color:#FF6B7A}
.dp-sys strong{font:600 11px/1 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.85);text-shadow:0 2px 8px #000}
.dp-sys small{font:500 10px/1 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.5);font-variant-numeric:tabular-nums}
.dp-sys--heat{left:28%;top:30%}
.dp-sys--vent{left:72%;top:30%}
.dp-sys--water{left:28%;top:72%}
.dp-sys--power{left:72%;top:72%}
.dp-sys--core{left:50%;top:50%}
.dp-sys--core .dp-sys-ring{
  width:60px;height:60px;background:linear-gradient(145deg,rgba(127,107,255,.35),rgba(85,72,170,.2));
  border-color:rgba(169,154,255,.6);
}

.dp-flow{
  position:absolute;inset:0;pointer-events:none;z-index:0;
}
.dp-flow path{
  fill:none;stroke:rgba(125,219,168,.35);stroke-width:2;stroke-dasharray:5 10;
  animation:dpDash 1.6s linear infinite;
}
.dp-stage[data-mode="alarm"] .dp-flow path{stroke:rgba(255,107,122,.45)}
.dp-stage[data-mode="peak"] .dp-flow path{stroke:rgba(255,184,107,.4)}
.dp-stage[data-mode="night"] .dp-flow path{stroke:rgba(169,154,255,.4);animation-duration:3s}

.dp-side{display:flex;flex-direction:column;gap:12px}
.dp-gauges{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.dp-gauge{
  border-radius:16px;padding:14px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);
}
.dp-gauge small{display:block;font:500 11px/1 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.5);margin:0 0 8px}
.dp-gauge strong{display:block;font:800 22px/1 'VelaSans',system-ui,sans-serif;color:#EEF0F6;font-variant-numeric:tabular-nums}
.dp-gauge strong span{font-size:13px;font-weight:600;color:rgba(238,240,246,.5);margin-left:4px}
.dp-bar{
  margin-top:10px;height:6px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden;
}
.dp-bar i{
  display:block;height:100%;width:var(--w,40%);border-radius:999px;
  background:linear-gradient(90deg,#7F6BFF,#A99AFF);
  transition:width .7s cubic-bezier(.22,1,.36,1);
  box-shadow:0 0 12px rgba(127,107,255,.4);
}
.dp-stage[data-mode="alarm"] .dp-gauge--water .dp-bar i{background:linear-gradient(90deg,#FF6B7A,#FFB86B)}
.dp-stage[data-mode="peak"] .dp-gauge--power .dp-bar i{background:linear-gradient(90deg,#FFB86B,#FF8A5B)}

.dp-feed{
  flex:1;border-radius:16px;padding:12px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);
  display:flex;flex-direction:column;min-height:160px;overflow:hidden;
}
.dp-feed-title{font:700 12px/1 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7);margin:0 0 10px;letter-spacing:.04em;text-transform:uppercase}
.dp-feed-list{display:flex;flex-direction:column;gap:8px;overflow:hidden}
.dp-feed-item{
  display:grid;grid-template-columns:52px 1fr;gap:8px;padding:8px 10px;border-radius:12px;
  background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);
  animation:dpFeedIn .45s ease both;
}
@keyframes dpFeedIn{from{opacity:0;transform:translateX(12px)}to{opacity:1;transform:none}}
.dp-feed-item b{font:700 11px/1.3 'VelaSans',system-ui,sans-serif;color:#A99AFF;font-variant-numeric:tabular-nums}
.dp-feed-item span{font:500 12px/1.35 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.78)}
.dp-feed-item.is-alert{border-color:rgba(255,107,122,.35);background:rgba(255,107,122,.08)}
.dp-feed-item.is-alert b{color:#FF6B7A}
.dp-feed-item.is-warn{border-color:rgba(255,184,107,.3);background:rgba(255,184,107,.08)}
.dp-feed-item.is-warn b{color:#FFB86B}

.dp-actions{position:relative;z-index:1;display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
@media (max-width:560px){.dp-actions{grid-template-columns:1fr 1fr}}
.dp-act{
  padding:12px 10px;border-radius:14px;text-align:center;
  background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);
  font:600 12px/1.2 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.45);
  transition:all .35s ease;
}
.dp-act small{display:block;margin-top:4px;font:500 10px/1 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.4)}
.dp-act.is-on{color:#EEF0F6;border-color:rgba(169,154,255,.45);background:rgba(127,107,255,.16);box-shadow:0 0 20px rgba(127,107,255,.12)}
.dp-act.is-on small{color:#CFC7FF}
.dp-act.is-fire{color:#fff;border-color:rgba(255,107,122,.5);background:rgba(255,107,122,.2);animation:dpPulseAct 1s ease infinite}
@keyframes dpPulseAct{0%,100%{transform:scale(1)}50%{transform:scale(1.03)}}

.dp-panel-modes{
  border-radius:22px;padding:22px;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.1);
  display:flex;flex-direction:column;gap:12px;
}
.dp-panel-modes h3{margin:0;font:700 20px/1.3 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.dp-panel-modes > p{margin:0;font:400 14px/1.5 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.65)}
.dp-modes{display:grid;gap:8px}
.dp-mode{
  text-align:left;cursor:pointer;border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.03);border-radius:14px;padding:13px 14px;color:#eef0f6;
  transition:border-color .2s ease,background .2s ease,transform .2s ease;
}
.dp-mode:hover,.dp-mode.is-act{
  border-color:rgba(169,154,255,.55);background:rgba(127,107,255,.14);transform:translateX(3px);
}
.dp-mode strong{display:block;font:600 14px/1.3 'VelaSans',system-ui,sans-serif;margin:0 0 3px}
.dp-mode span{display:block;font:400 12px/1.4 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.6)}
.dp-explain{
  margin-top:auto;padding:14px;border-radius:14px;
  background:rgba(127,107,255,.1);border:1px solid rgba(127,107,255,.25);
}
.dp-explain h4{margin:0 0 6px;font:700 14px/1.3 'VelaSans',system-ui,sans-serif;color:#CFC7FF}
.dp-explain p{margin:0;font:400 13px/1.5 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.72)}

/* Systems grid */
.dp-systems{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
@media (max-width:900px){.dp-systems{grid-template-columns:1fr}}
.dp-system{
  position:relative;overflow:hidden;border-radius:20px;padding:24px 22px;
  background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.1);
  transition:transform .25s ease,border-color .25s ease;
}
.dp-system:hover{transform:translateY(-5px);border-color:rgba(127,107,255,.45)}
.dp-system::after{
  content:"";position:absolute;right:-30px;top:-30px;width:110px;height:110px;border-radius:50%;
  background:radial-gradient(circle,rgba(127,107,255,.2),transparent 70%);
  transition:transform .4s ease;
}
.dp-system:hover::after{transform:scale(1.35)}
.dp-system-ic{
  position:relative;z-index:1;width:44px;height:44px;border-radius:14px;margin:0 0 14px;
  display:grid;place-items:center;background:rgba(127,107,255,.16);border:1px solid rgba(127,107,255,.3);color:#CFC7FF;
}
.dp-system-ic svg{width:22px;height:22px}
.dp-system h3{position:relative;z-index:1;margin:0 0 8px;font:700 18px/1.25 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.dp-system p{position:relative;z-index:1;margin:0;font:400 14px/1.55 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}

/* Response timeline */
.dp-response{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;counter-reset:dpr}
@media (max-width:900px){.dp-response{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.dp-response{grid-template-columns:1fr}}
.dp-step{
  position:relative;border-radius:18px;padding:22px 18px;background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.08);overflow:hidden;
  transition:transform .25s ease,border-color .25s ease;
}
.dp-step:hover{transform:translateY(-4px);border-color:rgba(127,107,255,.45)}
.dp-step::before{
  counter-increment:dpr;content:"0" counter(dpr);display:block;margin:0 0 12px;
  font:800 24px/1 'VelaSans',system-ui,sans-serif;background:linear-gradient(90deg,#CFC7FF,#7F6BFF);-webkit-background-clip:text;background-clip:text;color:transparent;
}
.dp-step h3{margin:0 0 8px;font:700 16px/1.25 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.dp-step p{margin:0;font:400 13px/1.5 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}
.dp-step-line{
  position:absolute;left:0;right:0;bottom:0;height:3px;
  background:linear-gradient(90deg,transparent,#7F6BFF,transparent);
  background-size:200% 100%;animation:dpLine 2.8s linear infinite;opacity:.6;
}
@keyframes dpLine{to{background-position:-200% 0}}

/* Benefits strip */
.dp-benefits{
  display:grid;grid-template-columns:1.05fr 1fr;gap:22px;align-items:center;
  border-radius:22px;overflow:hidden;padding:0;
}
@media (max-width:860px){.dp-benefits{grid-template-columns:1fr}}
.dp-benefits-visual{
  min-height:320px;border-radius:20px;background:#14151b center/cover no-repeat;position:relative;overflow:hidden;
}
.dp-benefits-visual::after{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(180deg,rgba(11,12,15,.2),rgba(11,12,15,.75)),
    radial-gradient(ellipse at 30% 40%,rgba(127,107,255,.25),transparent 50%);
}
.dp-benefits-visual .dp-overlay-card{
  position:absolute;z-index:1;left:20px;right:20px;bottom:20px;padding:16px;border-radius:16px;
  background:rgba(12,14,20,.78);border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(10px);
  animation:dpFloatCard 4s ease-in-out infinite;
}
@keyframes dpFloatCard{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.dp-overlay-card strong{display:block;font:700 14px/1.3 'VelaSans',system-ui,sans-serif;color:#fff;margin:0 0 4px}
.dp-overlay-card span{font:500 12px/1.4 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}
.dp-checks{margin:0;padding:0;list-style:none;display:grid;gap:12px}
.dp-checks li{
  position:relative;padding:14px 16px 14px 44px;border-radius:14px;
  font:400 15px/1.45 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.85);
  background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);
  transition:border-color .2s ease,transform .2s ease;
}
.dp-checks li:hover{border-color:rgba(127,107,255,.4);transform:translateX(4px)}
.dp-checks li::before{
  content:"";position:absolute;left:16px;top:50%;transform:translateY(-50%);
  width:14px;height:14px;border-radius:50%;background:#7DDBA8;
  box-shadow:0 0 0 4px rgba(125,219,168,.18);
}

/* Cases */
.dp-cases{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media (max-width:900px){.dp-cases{grid-template-columns:1fr}}
.dp-case{
  position:relative;overflow:hidden;min-height:240px;border-radius:20px;border:0;
  background:#14151b center/cover no-repeat;transition:transform .2s ease;
}
.dp-case::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(11,12,15,.15) 0%,rgba(11,12,15,.55) 40%,rgba(11,12,15,.94) 100%);
}
.dp-case:hover{transform:translateY(-5px)}
.dp-case-body{position:relative;z-index:1;padding:22px;display:flex;flex-direction:column;justify-content:flex-end;height:100%;min-height:240px}
.dp-case-tag{align-self:flex-start;margin:0 0 12px;font:600 11px/1 'VelaSans',system-ui,sans-serif;color:#CFC7FF;background:rgba(127,107,255,.22);border:1px solid rgba(127,107,255,.4);padding:6px 10px;border-radius:999px}
.dp-case h3{margin:0;font:700 18px/1.3 'VelaSans',system-ui,sans-serif;color:#fff}
.dp-case p{margin:8px 0 0;font:400 13px/1.5 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.82)}

/* FAQ */
.dp-faq{display:grid;gap:10px}
.dp-faq details{
  border-radius:16px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.1);padding:0 18px;
  transition:border-color .2s ease,background .2s ease;
}
.dp-faq details[open]{border-color:rgba(127,107,255,.4);background:rgba(127,107,255,.08)}
.dp-faq summary{
  cursor:pointer;list-style:none;padding:18px 0;font:700 16px/1.35 'VelaSans',system-ui,sans-serif;color:#EEF0F6;
  display:flex;align-items:center;justify-content:space-between;gap:16px;
}
.dp-faq summary::-webkit-details-marker{display:none}
.dp-faq summary::after{content:"+";font:700 22px/1 'VelaSans',system-ui,sans-serif;color:#A99AFF}
.dp-faq details[open] summary::after{content:"–"}
.dp-faq details p{margin:0 0 18px;font:400 14px/1.6 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.72);max-width:820px}

.dp-cta{
  display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;padding:32px;
  border-radius:22px;background:linear-gradient(135deg,rgba(127,107,255,.2),rgba(85,72,170,.08));
  border:1px solid rgba(127,107,255,.3);position:relative;overflow:hidden;
}
.dp-cta::before{
  content:"";position:absolute;width:200px;height:200px;border-radius:50%;right:-40px;top:-60px;
  background:radial-gradient(circle,rgba(169,154,255,.25),transparent 70%);
  animation:dpHub 3s ease-in-out infinite;
}
.dp-cta h3{position:relative;margin:0;font:700 clamp(20px,2.6vw,28px)/1.2 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.dp-cta p{position:relative;margin:8px 0 0;max-width:560px;font:400 15px/1.55 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.74)}
.dp-cta-btns{position:relative;display:flex;flex-wrap:wrap;gap:12px}
@media (max-width:520px){.dp-cta-btns{width:100%}.dp-cta .dp-btn{width:100%}}

/* Reveal on scroll */
.dp-reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease}
.dp-reveal.is-in{opacity:1;transform:none}
.dp-reveal-delay-1{transition-delay:.1s}
.dp-reveal-delay-2{transition-delay:.2s}
.dp-reveal-delay-3{transition-delay:.3s}

@media (prefers-reduced-motion:reduce){
  .dp-hero-scan,.dp-panel::before,.dp-radar-sweep,.dp-hub,.dp-svg path,.dp-node-dot,
  .dp-live::before,.dp-status-pill::before,.dp-sys-ring::before,.dp-flow path,
  .dp-act.is-fire,.dp-step-line,.dp-benefits-visual .dp-overlay-card,.dp-cta::before,
  .dp-scan,.dp-stage-flash{animation:none !important}
  .dp-reveal{opacity:1;transform:none;transition:none}
}


/* ---- besprovodnoj-page.css ---- */
/* Беспроводной умный дом */

body:has(.bw-hero-full){overflow-x:hidden}
.uni-main:has(.bw-hero-full){padding-top:0}
.uni-main:has(.bw-hero-full) .uni-wrap:first-child{padding-top:0}
.uni-main:has(.bw-hero-full) .uni-title{display:none}
.uni-main .uni-wrap > .bw-hero-full{margin-top:0 !important}

.bw-sec{padding:28px 0}
.bw-h2{margin:0 0 12px;font:700 clamp(22px,3vw,32px)/1.2 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.bw-sub{margin:0 0 22px;max-width:820px;font:400 clamp(14px,1.6vw,17px)/1.6 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}
.bw-btn{cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;font:600 16px/1 'VelaSans',system-ui,sans-serif;color:#fff;border:0;padding:16px 28px;border-radius:14px;background:linear-gradient(90deg,#7F6BFF,#5548AA);box-shadow:0 8px 24px rgba(127,107,255,.35);transition:filter .15s ease,transform .15s ease;text-decoration:none}
.bw-btn:hover{filter:brightness(1.08);transform:translateY(-2px)}
.bw-btn--ghost{background:transparent;border:1px solid rgba(255,255,255,.35);box-shadow:none}
.bw-btn--ghost:hover{background:rgba(255,255,255,.08)}
.bw-btn--sm{padding:11px 18px;font-size:14px;border-radius:12px}

/* ——— Hero ——— */
.bw-hero-full{
  position:relative;left:50%;right:50%;width:100vw;margin-left:-50vw;margin-right:-50vw;
  height:600px;min-height:500px;display:flex;align-items:center;overflow:hidden;color:#eef0f6;
  background:#0e1018 center/cover no-repeat;
  margin-bottom:0;
}
.bw-hero-overlay{
  position:absolute;inset:0;z-index:1;
  background:linear-gradient(105deg,rgba(8,10,16,.82) 0%,rgba(8,10,16,.55) 48%,rgba(8,10,16,.35) 100%);
}
.bw-hero-in{position:relative;z-index:2;width:1600px;max-width:88%;margin:0 auto;padding:0 20px 48px}
.bw-hero-kicker{
  display:inline-flex;align-items:center;gap:8px;margin:0 0 16px;padding:7px 12px;border-radius:999px;
  font:600 12px/1 'VelaSans',system-ui,sans-serif;letter-spacing:.04em;text-transform:uppercase;
  color:#CFC7FF;background:rgba(127,107,255,.16);border:1px solid rgba(127,107,255,.35);
}
.bw-hero-kicker i{
  width:8px;height:8px;border-radius:50%;background:#7DDBA8;
  box-shadow:0 0 0 0 rgba(125,219,168,.7);animation:bwPulse 1.8s ease infinite;
}
@keyframes bwPulse{0%{box-shadow:0 0 0 0 rgba(125,219,168,.65)}70%{box-shadow:0 0 0 10px rgba(125,219,168,0)}100%{box-shadow:0 0 0 0 rgba(125,219,168,0)}}
.bw-hero-title{margin:0 0 18px;max-width:860px;font:600 clamp(30px,5vw,48px)/1.12 'VelaSans',system-ui,sans-serif;letter-spacing:-.6px;color:#fff}
.bw-hero-lead{margin:0 0 34px;max-width:660px;font:400 clamp(17px,2vw,24px)/1.3 'VelaSans',system-ui,sans-serif;color:#c8c8d2}
.bw-hero-actions{display:flex;flex-wrap:wrap;gap:16px}
.bw-hero-actions .btn{padding:15px 28px !important;min-width:210px;justify-content:center}
@media (max-width:600px){
  .bw-hero-full{height:auto;min-height:0;padding:96px 0 80px}
  .bw-hero-actions .btn{min-width:0;width:100%}
}

/* Hero live panel */
.bw-panel{
  position:relative;border-radius:24px;padding:18px;overflow:hidden;
  background:rgba(14,16,24,.82);border:1px solid rgba(255,255,255,.12);
  backdrop-filter:blur(16px);box-shadow:0 28px 70px rgba(0,0,0,.45);
}
.bw-panel::before{
  content:"";position:absolute;inset:-40% -20%;pointer-events:none;opacity:.35;
  background:conic-gradient(from 0deg,transparent 0 70%,rgba(127,107,255,.25) 78%,transparent 88%);
  animation:bwSpin 14s linear infinite;
}
@keyframes bwSpin{to{transform:rotate(360deg)}}
.bw-panel-in{position:relative;z-index:1}
.bw-panel-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 14px}
.bw-panel-top strong{font:700 13px/1.2 'VelaSans',system-ui,sans-serif;color:#EEF0F6;letter-spacing:.02em}
.bw-live{
  display:inline-flex;align-items:center;gap:7px;padding:6px 10px;border-radius:999px;
  font:700 11px/1 'VelaSans',system-ui,sans-serif;color:#7DDBA8;background:rgba(125,219,168,.12);border:1px solid rgba(125,219,168,.35);
}
.bw-live::before{content:"";width:7px;height:7px;border-radius:50%;background:#7DDBA8;animation:bwBlink 1.2s ease infinite}
@keyframes bwBlink{0%,100%{opacity:1}50%{opacity:.35}}
.bw-clock{font:600 12px/1 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.55);font-variant-numeric:tabular-nums}

.bw-mesh{
  position:relative;height:260px;border-radius:18px;overflow:hidden;margin:0 0 12px;
  background:
    radial-gradient(circle at 50% 55%,rgba(127,107,255,.18),transparent 55%),
    linear-gradient(160deg,#12141e,#0c0e16);
  border:1px solid rgba(255,255,255,.08);
}
._bw-mesh-grid-old{
  position:absolute;inset:0;opacity:.4;pointer-events:none;
  background-image:
    linear-gradient(rgba(169,154,255,.1) 1px,transparent 1px),
    linear-gradient(90deg,rgba(169,154,255,.1) 1px,transparent 1px);
  background-size:28px 28px;
}
.bw-mesh-wave-legacy{
  position:absolute;left:50%;top:55%;width:140%;height:140%;transform:translate(-50%,-50%);
  background:conic-gradient(from 0deg,transparent 0deg,rgba 300deg,rgba(127,107,255,.22) 360deg);
  animation:bwSpin 4.5s linear infinite;pointer-events:none;opacity:.7;
  mask-image:radial-gradient(circle,transparent 8%,#000 9%,#000 48%,transparent 49%);
}
.bw-hub{
  position:absolute;left:50%;top:55%;transform:translate(-50%,-50%);
  width:64px;height:64px;border-radius:50%;display:grid;place-items:center;z-index:3;
  background:linear-gradient(145deg,#7F6BFF,#5548AA);color:#fff;
  font:800 11px/1 'VelaSans',system-ui,sans-serif;letter-spacing:.04em;
  box-shadow:0 0 0 0 rgba(127,107,255,.55),0 0 40px rgba(127,107,255,.45);
  animation:bwHub 2.4s ease-in-out infinite;
}
@keyframes bwHub{
  0%,100%{box-shadow:0 0 0 0 rgba(127,107,255,.5),0 0 36px rgba(127,107,255,.4)}
  50%{box-shadow:0 0 0 14px rgba(127,107,255,0),0 0 48px rgba(127,107,255,.55)}
}
.bw-hub span{display:block;text-align:center}
.bw-svg{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none}
.bw-svg path{
  fill:none;stroke:rgba(169,154,255,.45);stroke-width:1.5;stroke-dasharray:6 8;
  animation:bwDash 2.2s linear infinite;
}
@keyframes bwDash{to{stroke-dashoffset:-28}}
.bw-node{
  position:absolute;z-index:2;display:flex;flex-direction:column;align-items:center;gap:4px;
  transform:translate(-50%,-50%);cursor:default;
}
.bw-node-dot{
  width:14px;height:14px;border-radius:50%;background:#A99AFF;
  box-shadow:0 0 0 4px rgba(169,154,255,.2);transition:background .3s ease,box-shadow .3s ease,transform .3s ease;
  animation:bwNodeFloat 3.2s ease-in-out infinite;
}
.bw-node:nth-child(odd) .bw-node-dot{animation-delay:.4s}
.bw-node:nth-child(3n) .bw-node-dot{animation-delay:.9s}
@keyframes bwNodeFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
.bw-node strong{
  font:600 10px/1 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.85);
  padding:4px 8px;border-radius:8px;background:rgba(10,12,18,.75);border:1px solid rgba(255,255,255,.1);
  white-space:nowrap;
}
.bw-node.is-ok .bw-node-dot{background:#7DDBA8;box-shadow:0 0 0 4px rgba(125,219,168,.22)}
.bw-node.is-warn .bw-node-dot{background:#FFB86B;box-shadow:0 0 0 4px rgba(255,184,107,.25);animation:bwNodeWarn .9s ease infinite}
.bw-node.is-alert .bw-node-dot{background:#FF6B7A;box-shadow:0 0 0 5px rgba(255,107,122,.3);animation:bwNodeWarn .55s ease infinite}
@keyframes bwNodeWarn{0%,100%{transform:scale(1)}50%{transform:scale(1.25)}}

.bw-node--heat{left:18%;top:28%}
.bw-node--vent{left:82%;top:26%}
.bw-node--water{left:14%;top:72%}
.bw-node--power{left:86%;top:70%}
.bw-node--lock{left:50%;top:16%}

.bw-chips{display:flex;flex-wrap:wrap;gap:8px}
.bw-chip{
  display:inline-flex;align-items:center;gap:6px;padding:7px 11px;border-radius:12px;
  font:600 11px/1 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.8);
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);
  animation:bwChipIn .6s ease both;
}
.bw-chip:nth-child(2){animation-delay:.1s}
.bw-chip:nth-child(3){animation-delay:.2s}
.bw-chip:nth-child(4){animation-delay:.3s}
@keyframes bwChipIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.bw-chip b{color:#CFC7FF;font-variant-numeric:tabular-nums}
.bw-chip--up b{color:#7DDBA8}
.bw-chip--down b{color:#FFB86B}

/* Stats */
.bw-sec--stats{position:relative;z-index:5;margin-top:-56px;padding-top:0;padding-bottom:8px}
@media (max-width:600px){.bw-sec--stats{margin-top:-36px}}
.bw-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:0;padding:22px;border-radius:20px;background:linear-gradient(135deg,rgba(20,22,32,.96),rgba(18,16,28,.94));border:1px solid rgba(127,107,255,.28);backdrop-filter:blur(12px);box-shadow:0 16px 40px rgba(0,0,0,.35)}
.bw-stat{text-align:center;padding:8px;border-radius:14px;transition:transform .25s ease,background .25s ease}
.bw-stat:hover{transform:translateY(-4px);background:rgba(255,255,255,.05)}
.bw-stat-num{font:800 clamp(26px,3.6vw,42px)/1 'VelaSans',system-ui,sans-serif;background:linear-gradient(90deg,#CFC7FF,#7F6BFF);-webkit-background-clip:text;background-clip:text;color:transparent}
.bw-stat-label{margin:8px 0 0;font:500 13px/1.4 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.72)}
@media (max-width:760px){.bw-stats{grid-template-columns:1fr 1fr}}

/* Demo */
.bw-demo{display:grid;grid-template-columns:1.2fr .8fr;gap:22px;align-items:stretch}
@media (max-width:980px){.bw-demo{grid-template-columns:1fr}}
.bw-stage{
  position:relative;overflow:hidden;border-radius:22px;padding:20px;min-height:480px;
  display:flex;flex-direction:column;gap:14px;
  background:linear-gradient(165deg,#141621,#0e1018 55%,#12141c);
  border:1px solid rgba(255,255,255,.1);
  transition:border-color .35s ease,box-shadow .35s ease;
}
.bw-stage[data-mode="alarm"]{border-color:rgba(255,107,122,.45);box-shadow:0 0 40px rgba(255,107,122,.12)}
.bw-stage[data-mode="peak"]{border-color:rgba(255,184,107,.4);box-shadow:0 0 40px rgba(255,184,107,.1)}
.bw-stage-flash{
  position:absolute;inset:0;pointer-events:none;opacity:0;z-index:0;
  background:radial-gradient(ellipse at 50% 30%,rgba(255,107,122,.2),transparent 60%);
  transition:opacity .4s ease;
}
.bw-stage[data-mode="alarm"] .bw-stage-flash{opacity:1;animation:bwFlash 1.4s ease infinite}
@keyframes bwFlash{0%,100%{opacity:.55}50%{opacity:1}}

.bw-stage-top{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.bw-status-pill{
  display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;
  font:700 12px/1 'VelaSans',system-ui,sans-serif;color:#7DDBA8;
  background:rgba(125,219,168,.12);border:1px solid rgba(125,219,168,.35);
  transition:color .3s ease,background .3s ease,border-color .3s ease;
}
.bw-status-pill::before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor;animation:bwBlink 1.4s ease infinite}
.bw-stage[data-mode="alarm"] .bw-status-pill{color:#FF6B7A;background:rgba(255,107,122,.12);border-color:rgba(255,107,122,.4)}
.bw-stage[data-mode="peak"] .bw-status-pill{color:#FFB86B;background:rgba(255,184,107,.12);border-color:rgba(255,184,107,.4)}
.bw-stage[data-mode="night"] .bw-status-pill{color:#A99AFF;background:rgba(127,107,255,.14);border-color:rgba(127,107,255,.35)}
.bw-stage-meta{font:500 12px/1.3 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.55)}

.bw-board{position:relative;z-index:1;display:grid;grid-template-columns:1.1fr .9fr;gap:14px;flex:1}
@media (max-width:720px){.bw-board{grid-template-columns:1fr}}

.bw-schematic{
  position:relative;border-radius:18px;min-height:280px;overflow:hidden;
  background:
    radial-gradient(ellipse at 50% 40%,rgba(127,107,255,.12),transparent 55%),
    linear-gradient(160deg,#181a24,#101218);
  border:1px solid rgba(255,255,255,.08);
}
.bw-floor{
  position:absolute;left:12%;right:12%;top:18%;bottom:14%;
  border:1px solid rgba(255,255,255,.12);border-radius:12px;
  background:rgba(255,255,255,.02);
}
.bw-floor::before,.bw-floor::after{
  content:"";position:absolute;background:rgba(255,255,255,.08);
}
.bw-floor::before{left:38%;top:0;bottom:0;width:1px}
.bw-floor::after{left:0;right:0;top:48%;height:1px}
.bw-sys{
  position:absolute;display:flex;flex-direction:column;align-items:center;gap:6px;
  transform:translate(-50%,-50%);transition:transform .35s ease;
}
.bw-sys:hover{transform:translate(-50%,-50%) scale(1.06)}
.bw-sys-ring{
  width:52px;height:52px;border-radius:50%;display:grid;place-items:center;
  background:rgba(20,22,32,.9);border:2px solid rgba(169,154,255,.35);
  position:relative;transition:border-color .35s ease,box-shadow .35s ease;
}
.bw-sys-ring::before{
  content:"";position:absolute;inset:-5px;border-radius:50%;
  border:1px solid rgba(169,154,255,.2);
  animation:bwRing 2.8s ease-in-out infinite;
}
@keyframes bwRing{0%,100%{transform:scale(1);opacity:.6}50%{transform:scale(1.12);opacity:1}}
.bw-sys.is-ok .bw-sys-ring{border-color:rgba(125,219,168,.55);box-shadow:0 0 20px rgba(125,219,168,.15)}
.bw-sys.is-warn .bw-sys-ring{border-color:rgba(255,184,107,.6);box-shadow:0 0 22px rgba(255,184,107,.2)}
.bw-sys.is-alert .bw-sys-ring{border-color:rgba(255,107,122,.7);box-shadow:0 0 26px rgba(255,107,122,.25);animation:bwShake .5s ease}
@keyframes bwShake{0%,100%{transform:translateX(0)}25%{transform:translateX(-2px)}75%{transform:translateX(2px)}}
.bw-sys-ring svg{width:22px;height:22px;color:#CFC7FF}
.bw-sys.is-ok .bw-sys-ring svg{color:#7DDBA8}
.bw-sys.is-warn .bw-sys-ring svg{color:#FFB86B}
.bw-sys.is-alert .bw-sys-ring svg{color:#FF6B7A}
.bw-sys strong{font:600 11px/1 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.85);text-shadow:0 2px 8px #000}
.bw-sys small{font:500 10px/1 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.5);font-variant-numeric:tabular-nums}
.bw-sys--heat{left:28%;top:30%}
.bw-sys--vent{left:72%;top:30%}
.bw-sys--water{left:28%;top:72%}
.bw-sys--power{left:72%;top:72%}
.bw-sys--core{left:50%;top:50%}
.bw-sys--core .bw-sys-ring{
  width:60px;height:60px;background:linear-gradient(145deg,rgba(127,107,255,.35),rgba(85,72,170,.2));
  border-color:rgba(169,154,255,.6);
}

.bw-flow{
  position:absolute;inset:0;pointer-events:none;z-index:0;
}
.bw-flow path{
  fill:none;stroke:rgba(125,219,168,.35);stroke-width:2;stroke-dasharray:5 10;
  animation:bwDash 1.6s linear infinite;
}
.bw-stage[data-mode="alarm"] .bw-flow path{stroke:rgba(255,107,122,.45)}
.bw-stage[data-mode="peak"] .bw-flow path{stroke:rgba(255,184,107,.4)}
.bw-stage[data-mode="night"] .bw-flow path{stroke:rgba(169,154,255,.4);animation-duration:3s}

.bw-side{display:flex;flex-direction:column;gap:12px}
.bw-gauges{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.bw-gauge{
  border-radius:16px;padding:14px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);
}
.bw-gauge small{display:block;font:500 11px/1 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.5);margin:0 0 8px}
.bw-gauge strong{display:block;font:800 22px/1 'VelaSans',system-ui,sans-serif;color:#EEF0F6;font-variant-numeric:tabular-nums}
.bw-gauge strong span{font-size:13px;font-weight:600;color:rgba(238,240,246,.5);margin-left:4px}
.bw-bar{
  margin-top:10px;height:6px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden;
}
.bw-bar i{
  display:block;height:100%;width:var(--w,40%);border-radius:999px;
  background:linear-gradient(90deg,#7F6BFF,#A99AFF);
  transition:width .7s cubic-bezier(.22,1,.36,1);
  box-shadow:0 0 12px rgba(127,107,255,.4);
}
.bw-stage[data-mode="alarm"] .bw-gauge--water .bw-bar i{background:linear-gradient(90deg,#FF6B7A,#FFB86B)}
.bw-stage[data-mode="peak"] .bw-gauge--power .bw-bar i{background:linear-gradient(90deg,#FFB86B,#FF8A5B)}

.bw-feed{
  flex:1;border-radius:16px;padding:12px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);
  display:flex;flex-direction:column;min-height:160px;overflow:hidden;
}
.bw-feed-title{font:700 12px/1 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7);margin:0 0 10px;letter-spacing:.04em;text-transform:uppercase}
.bw-feed-list{display:flex;flex-direction:column;gap:8px;overflow:hidden}
.bw-feed-item{
  display:grid;grid-template-columns:52px 1fr;gap:8px;padding:8px 10px;border-radius:12px;
  background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);
  animation:bwFeedIn .45s ease both;
}
@keyframes bwFeedIn{from{opacity:0;transform:translateX(12px)}to{opacity:1;transform:none}}
.bw-feed-item b{font:700 11px/1.3 'VelaSans',system-ui,sans-serif;color:#A99AFF;font-variant-numeric:tabular-nums}
.bw-feed-item span{font:500 12px/1.35 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.78)}
.bw-feed-item.is-alert{border-color:rgba(255,107,122,.35);background:rgba(255,107,122,.08)}
.bw-feed-item.is-alert b{color:#FF6B7A}
.bw-feed-item.is-warn{border-color:rgba(255,184,107,.3);background:rgba(255,184,107,.08)}
.bw-feed-item.is-warn b{color:#FFB86B}

.bw-actions{position:relative;z-index:1;display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
@media (max-width:560px){.bw-actions{grid-template-columns:1fr 1fr}}
.bw-act{
  padding:12px 10px;border-radius:14px;text-align:center;
  background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);
  font:600 12px/1.2 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.45);
  transition:all .35s ease;
}
.bw-act small{display:block;margin-top:4px;font:500 10px/1 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.4)}
.bw-act.is-on{color:#EEF0F6;border-color:rgba(169,154,255,.45);background:rgba(127,107,255,.16);box-shadow:0 0 20px rgba(127,107,255,.12)}
.bw-act.is-on small{color:#CFC7FF}
.bw-act.is-fire{color:#fff;border-color:rgba(255,107,122,.5);background:rgba(255,107,122,.2);animation:bwPulseAct 1s ease infinite}
@keyframes bwPulseAct{0%,100%{transform:scale(1)}50%{transform:scale(1.03)}}

.bw-panel-modes{
  border-radius:22px;padding:22px;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.1);
  display:flex;flex-direction:column;gap:12px;
}
.bw-panel-modes h3{margin:0;font:700 20px/1.3 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.bw-panel-modes > p{margin:0;font:400 14px/1.5 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.65)}
.bw-modes{display:grid;gap:8px}
.bw-mode{
  text-align:left;cursor:pointer;border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.03);border-radius:14px;padding:13px 14px;color:#eef0f6;
  transition:border-color .2s ease,background .2s ease,transform .2s ease;
}
.bw-mode:hover,.bw-mode.is-act{
  border-color:rgba(169,154,255,.55);background:rgba(127,107,255,.14);transform:translateX(3px);
}
.bw-mode strong{display:block;font:600 14px/1.3 'VelaSans',system-ui,sans-serif;margin:0 0 3px}
.bw-mode span{display:block;font:400 12px/1.4 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.6)}
.bw-explain{
  margin-top:auto;padding:14px;border-radius:14px;
  background:rgba(127,107,255,.1);border:1px solid rgba(127,107,255,.25);
}
.bw-explain h4{margin:0 0 6px;font:700 14px/1.3 'VelaSans',system-ui,sans-serif;color:#CFC7FF}
.bw-explain p{margin:0;font:400 13px/1.5 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.72)}

/* Systems grid */
.bw-systems{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
@media (max-width:900px){.bw-systems{grid-template-columns:1fr}}
.bw-system{
  position:relative;overflow:hidden;border-radius:20px;padding:24px 22px;
  background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.1);
  transition:transform .25s ease,border-color .25s ease;
}
.bw-system:hover{transform:translateY(-5px);border-color:rgba(127,107,255,.45)}
.bw-system::after{
  content:"";position:absolute;right:-30px;top:-30px;width:110px;height:110px;border-radius:50%;
  background:radial-gradient(circle,rgba(127,107,255,.2),transparent 70%);
  transition:transform .4s ease;
}
.bw-system:hover::after{transform:scale(1.35)}
.bw-system-ic{
  position:relative;z-index:1;width:44px;height:44px;border-radius:14px;margin:0 0 14px;
  display:grid;place-items:center;background:rgba(127,107,255,.16);border:1px solid rgba(127,107,255,.3);color:#CFC7FF;
}
.bw-system-ic svg{width:22px;height:22px}
.bw-system h3{position:relative;z-index:1;margin:0 0 8px;font:700 18px/1.25 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.bw-system p{position:relative;z-index:1;margin:0;font:400 14px/1.55 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}

/* Response timeline */
.bw-response{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;counter-reset:dpr}
@media (max-width:900px){.bw-response{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.bw-response{grid-template-columns:1fr}}
.bw-step{
  position:relative;border-radius:18px;padding:22px 18px;background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.08);overflow:hidden;
  transition:transform .25s ease,border-color .25s ease;
}
.bw-step:hover{transform:translateY(-4px);border-color:rgba(127,107,255,.45)}
.bw-step::before{
  counter-increment:dpr;content:"0" counter(dpr);display:block;margin:0 0 12px;
  font:800 24px/1 'VelaSans',system-ui,sans-serif;background:linear-gradient(90deg,#CFC7FF,#7F6BFF);-webkit-background-clip:text;background-clip:text;color:transparent;
}
.bw-step h3{margin:0 0 8px;font:700 16px/1.25 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.bw-step p{margin:0;font:400 13px/1.5 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}
.bw-step-line{
  position:absolute;left:0;right:0;bottom:0;height:3px;
  background:linear-gradient(90deg,transparent,#7F6BFF,transparent);
  background-size:200% 100%;animation:bwLine 2.8s linear infinite;opacity:.6;
}
@keyframes bwLine{to{background-position:-200% 0}}

/* Benefits strip */
.bw-benefits{
  display:grid;grid-template-columns:1.05fr 1fr;gap:22px;align-items:center;
  border-radius:22px;overflow:hidden;padding:0;
}
@media (max-width:860px){.bw-benefits{grid-template-columns:1fr}}
.bw-benefits-visual{
  min-height:320px;border-radius:20px;background:#14151b center/cover no-repeat;position:relative;overflow:hidden;
}
.bw-benefits-visual::after{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(180deg,rgba(11,12,15,.2),rgba(11,12,15,.75)),
    radial-gradient(ellipse at 30% 40%,rgba(127,107,255,.25),transparent 50%);
}
.bw-benefits-visual .bw-overlay-card{
  position:absolute;z-index:1;left:20px;right:20px;bottom:20px;padding:16px;border-radius:16px;
  background:rgba(12,14,20,.78);border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(10px);
  animation:bwFloatCard 4s ease-in-out infinite;
}
@keyframes bwFloatCard{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.bw-overlay-card strong{display:block;font:700 14px/1.3 'VelaSans',system-ui,sans-serif;color:#fff;margin:0 0 4px}
.bw-overlay-card span{font:500 12px/1.4 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.7)}
.bw-checks{margin:0;padding:0;list-style:none;display:grid;gap:12px}
.bw-checks li{
  position:relative;padding:14px 16px 14px 44px;border-radius:14px;
  font:400 15px/1.45 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.85);
  background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);
  transition:border-color .2s ease,transform .2s ease;
}
.bw-checks li:hover{border-color:rgba(127,107,255,.4);transform:translateX(4px)}
.bw-checks li::before{
  content:"";position:absolute;left:16px;top:50%;transform:translateY(-50%);
  width:14px;height:14px;border-radius:50%;background:#7DDBA8;
  box-shadow:0 0 0 4px rgba(125,219,168,.18);
}

/* Cases */
.bw-cases{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media (max-width:900px){.bw-cases{grid-template-columns:1fr}}
.bw-case{
  position:relative;overflow:hidden;min-height:240px;border-radius:20px;border:0;
  background:#14151b center/cover no-repeat;transition:transform .2s ease;
}
.bw-case::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(11,12,15,.15) 0%,rgba(11,12,15,.55) 40%,rgba(11,12,15,.94) 100%);
}
.bw-case:hover{transform:translateY(-5px)}
.bw-case-body{position:relative;z-index:1;padding:22px;display:flex;flex-direction:column;justify-content:flex-end;height:100%;min-height:240px}
.bw-case-tag{align-self:flex-start;margin:0 0 12px;font:600 11px/1 'VelaSans',system-ui,sans-serif;color:#CFC7FF;background:rgba(127,107,255,.22);border:1px solid rgba(127,107,255,.4);padding:6px 10px;border-radius:999px}
.bw-case h3{margin:0;font:700 18px/1.3 'VelaSans',system-ui,sans-serif;color:#fff}
.bw-case p{margin:8px 0 0;font:400 13px/1.5 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.82)}

/* FAQ */
.bw-faq{display:grid;gap:10px}
.bw-faq details{
  border-radius:16px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.1);padding:0 18px;
  transition:border-color .2s ease,background .2s ease;
}
.bw-faq details[open]{border-color:rgba(127,107,255,.4);background:rgba(127,107,255,.08)}
.bw-faq summary{
  cursor:pointer;list-style:none;padding:18px 0;font:700 16px/1.35 'VelaSans',system-ui,sans-serif;color:#EEF0F6;
  display:flex;align-items:center;justify-content:space-between;gap:16px;
}
.bw-faq summary::-webkit-details-marker{display:none}
.bw-faq summary::after{content:"+";font:700 22px/1 'VelaSans',system-ui,sans-serif;color:#A99AFF}
.bw-faq details[open] summary::after{content:"–"}
.bw-faq details p{margin:0 0 18px;font:400 14px/1.6 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.72);max-width:820px}

.bw-cta{
  display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;padding:32px;
  border-radius:22px;background:linear-gradient(135deg,rgba(127,107,255,.2),rgba(85,72,170,.08));
  border:1px solid rgba(127,107,255,.3);position:relative;overflow:hidden;
}
.bw-cta::before{
  content:"";position:absolute;width:200px;height:200px;border-radius:50%;right:-40px;top:-60px;
  background:radial-gradient(circle,rgba(169,154,255,.25),transparent 70%);
  animation:bwHub 3s ease-in-out infinite;
}
.bw-cta h3{position:relative;margin:0;font:700 clamp(20px,2.6vw,28px)/1.2 'VelaSans',system-ui,sans-serif;color:#EEF0F6}
.bw-cta p{position:relative;margin:8px 0 0;max-width:560px;font:400 15px/1.55 'VelaSans',system-ui,sans-serif;color:rgba(238,240,246,.74)}
.bw-cta-btns{position:relative;display:flex;flex-wrap:wrap;gap:12px}
@media (max-width:520px){.bw-cta-btns{width:100%}.bw-cta .bw-btn{width:100%}}

/* Reveal on scroll */
.bw-reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease}
.bw-reveal.is-in{opacity:1;transform:none}
.bw-reveal-delay-1{transition-delay:.1s}
.bw-reveal-delay-2{transition-delay:.2s}
.bw-reveal-delay-3{transition-delay:.3s}

@media (prefers-reduced-motion:reduce){
  .bw-hero-scan,.bw-panel::before,.bw-mesh-wave-legacy,.bw-hub,.bw-svg path,.bw-node-dot,
  .bw-live::before,.bw-status-pill::before,.bw-sys-ring::before,.bw-flow path,
  .bw-act.is-fire,.bw-step-line,.bw-benefits-visual .bw-overlay-card,.bw-cta::before,
  .bw-hero-scan,.bw-panel::before,.bw-mesh-wave,.bw-hub,.bw-svg path,.bw-node-dot,
  .bw-live::before,.bw-status-pill::before,.bw-sys-ring::before,.bw-flow path,
  .bw-act.is-fire,.bw-step-line,.bw-benefits-visual .bw-overlay-card,.bw-cta::before,
  .bw-stage-flash{animation:none !important}
  .bw-reveal{opacity:1;transform:none;transition:none}
}


/* Wireless mesh extras */
.bw-mesh{
  position:relative;height:260px;border-radius:18px;overflow:hidden;margin:0 0 12px;
  background:
    radial-gradient(circle at 50% 55%,rgba(127,107,255,.2),transparent 55%),
    linear-gradient(160deg,#12141e,#0c0e16);
  border:1px solid rgba(255,255,255,.08);
}
.bw-mesh-grid{
  position:absolute;inset:0;opacity:.35;pointer-events:none;
  background-image:
    radial-gradient(circle at 50% 55%,transparent 20%,rgba(169,154,255,.08) 21%,transparent 22%),
    radial-gradient(circle at 50% 55%,transparent 35%,rgba(169,154,255,.07) 36%,transparent 37%),
    radial-gradient(circle at 50% 55%,transparent 50%,rgba(169,154,255,.06) 51%,transparent 52%);
}
.bw-mesh-wave{
  position:absolute;left:50%;top:55%;width:40px;height:40px;border-radius:50%;
  border:1px solid rgba(169,154,255,.45);transform:translate(-50%,-50%);
  animation:bwWave 2.8s ease-out infinite;pointer-events:none;
}
.bw-mesh-wave:nth-child(2){animation-delay:.7s}
.bw-mesh-wave:nth-child(3){animation-delay:1.4s}
@keyframes bwWave{
  0%{width:40px;height:40px;opacity:.7}
  100%{width:260px;height:260px;opacity:0}
}
.bw-hub span{font-size:10px;letter-spacing:.06em}
.bw-node--light{left:18%;top:28%}
.bw-node--sensor{left:82%;top:26%}
.bw-node--switch{left:14%;top:72%}
.bw-node--climate{left:86%;top:70%}
.bw-node--lock{left:50%;top:16%}

.bw-sys--light{left:28%;top:30%}
.bw-sys--sensor{left:72%;top:30%}
.bw-sys--switch{left:28%;top:72%}
.bw-sys--climate{left:72%;top:72%}
.bw-sys--hub{left:50%;top:50%}
.bw-sys--hub .bw-sys-ring{
  width:60px;height:60px;background:linear-gradient(145deg,rgba(127,107,255,.35),rgba(85,72,170,.2));
  border-color:rgba(169,154,255,.6);
}

.bw-stage[data-mode="expand"]{border-color:rgba(169,154,255,.4);box-shadow:0 0 40px rgba(127,107,255,.12)}
.bw-stage[data-mode="scene"]{border-color:rgba(125,219,168,.35);box-shadow:0 0 40px rgba(125,219,168,.1)}
.bw-stage[data-mode="mesh"]{border-color:rgba(255,184,107,.35)}
.bw-stage[data-mode="voice"] .bw-status-pill{color:#A99AFF;background:rgba(127,107,255,.14);border-color:rgba(127,107,255,.35)}


/* ---- provodnoj-page.css ---- */
/* Проводной умный дом — stats как pr-stat на «Проектирование» */

body:has(.wr-hero){overflow-x:hidden}
.uni-main:has(.wr-hero){padding-top:0}
.uni-main:has(.wr-hero) .uni-wrap:first-child{padding-top:0}
.uni-main:has(.wr-hero) .uni-title{display:none}
.uni-main .uni-wrap > .wr-hero{margin-top:0 !important}

/* Header is already in flow. ACF sets padding: clamp(66px, 11vw, 140px) as overlay offset. */
.wr-hero{
  padding:0 !important;
  min-height:600px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.wr-rv{opacity:1}
.wr-js .wr-rv{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .7s ease}
.wr-js .wr-rv.is-in{opacity:1;transform:none}

.wr-stats-band{position:relative;z-index:5;padding:0 0 8px}
.uni-main:has(.wr-hero) .uni-wrap .wr-stats-band,
.wr-full.wr-stats-band{margin-top:-56px !important}
@media (max-width:600px){
  .uni-main:has(.wr-hero) .uni-wrap .wr-stats-band,
  .wr-full.wr-stats-band{margin-top:-36px !important}
}

.wr-stats{
  display:grid !important;
  grid-template-columns:repeat(4,1fr) !important;
  gap:14px !important;
  margin:0 !important;
  padding:22px !important;
  border-radius:20px !important;
  background:linear-gradient(135deg,rgba(20,22,32,.96),rgba(18,16,28,.94)) !important;
  border:1px solid rgba(127,107,255,.28) !important;
  backdrop-filter:blur(12px);
  box-shadow:0 16px 40px rgba(0,0,0,.35) !important;
}

.wr-stat{
  text-align:center !important;
  padding:8px !important;
  border-radius:14px !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  transition:transform .25s ease,background .25s ease !important;
}

.wr-stat:hover{
  transform:translateY(-4px) !important;
  background:rgba(255,255,255,.05) !important;
}

.wr-stat-num{
  font:800 clamp(26px,3.6vw,42px)/1 'VelaSans',system-ui,sans-serif !important;
  background:linear-gradient(90deg,#CFC7FF,#7F6BFF) !important;
  -webkit-background-clip:text !important;
  background-clip:text !important;
  color:transparent !important;
}

.wr-stat-label{
  margin:8px 0 0 !important;
  font:500 13px/1.4 'VelaSans',system-ui,sans-serif !important;
  color:rgba(238,240,246,.72) !important;
}

@media (max-width:760px){
  .wr-stats{grid-template-columns:1fr 1fr !important}
}

@media (prefers-reduced-motion:reduce){
  .wr-js .wr-rv{animation:none!important;transition:none;opacity:1;transform:none}
}
