/* Autonomous interactive smart-home diagram component. */
/* Source-faithful spacing and marker rules from smarthome_ru_house. */
#smarthome-landing{--sh-blue:#0079ff;--sh-text:#111;--sh-gray:#ececec;--sh-soft:#eaeefa;--sh-max:2050px;color:var(--sh-text);font-family:DINPro,Arial,sans-serif;font-size:21px;line-height:1.42;overflow:hidden}
#smarthome-landing *{box-sizing:border-box}
#smarthome-landing .sh-shell{width:min(80%,var(--sh-max));margin-inline:auto}
#smarthome-landing h1,#smarthome-landing h2,#smarthome-landing h3,#smarthome-landing p{margin-top:0}
#smarthome-landing h2{font-size:clamp(32px,2.5vw,48px);line-height:1.12;margin-bottom:36px}
#smarthome-landing h3{font-size:clamp(21px,1.4vw,28px);line-height:1.2}
#smarthome-landing p{max-width:65ch}
#smarthome-landing img{display:block;max-width:100%}
#smarthome-landing [hidden]{display:none!important}
#smarthome-landing button,#smarthome-landing input,#smarthome-landing select{font:inherit}
#smarthome-landing button{cursor:pointer}
#smarthome-landing :focus-visible{outline:3px solid #0059bc;outline-offset:4px}
#smarthome-landing .sh-section{padding-block:100px}
#smarthome-landing .sh-house{background:#f7f8fb}
#smarthome-landing .sh-tabs{display:flex;flex-wrap:wrap;gap:4px;border-bottom:1px solid #bbb;margin-bottom:40px}
#smarthome-landing .sh-tabs-wrap{position:relative}
#smarthome-landing .sh-tabs-arrow{display:none}
#smarthome-landing .sh-tabs button{border:0;background:transparent;padding:17px 22px 20px;font-weight:700;color:#444;position:relative}
#smarthome-landing .sh-tabs button[aria-selected="true"]{color:#0067da}
#smarthome-landing .sh-tabs button[aria-selected="true"]:after{content:"";position:absolute;bottom:-2px;left:10px;right:10px;height:3px;background:var(--sh-blue)}
#smarthome-landing .sh-house__stage{position:relative;display:grid;grid-template-columns:minmax(0,1fr);gap:24px;align-items:start}
#smarthome-landing .sh-house__image{grid-column:1;grid-row:1;position:relative;width:100%;aspect-ratio:1536/850}
#smarthome-landing .sh-house__image>img{display:block;width:100%;height:100%;object-fit:contain}
#smarthome-landing .sh-house__placeholder{width:100%;height:100%;background:#e4e4e4}
#smarthome-landing .sh-house__overlay{position:absolute;inset:0;pointer-events:none}
#smarthome-landing .sh-house__marker{position:absolute;left:var(--marker-x);top:var(--marker-y);width:44px;height:44px;padding:0;border:0;background:transparent;transform:translate(-50%,-50%);pointer-events:auto;cursor:pointer;display:flex;align-items:center;justify-content:center}
#smarthome-landing .sh-house__marker:before{content:"";display:block;width:18px;height:18px;margin:auto;border-radius:50%;background:var(--sh-blue);box-shadow:0 0 0 5px #fff,0 0 0 9px rgba(0,121,255,.3);animation:sh-pulse 2s ease-out infinite}
#smarthome-landing .sh-hotspots{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
#smarthome-landing .sh-hotspot{min-height:44px;width:100%;border:0;background:transparent;color:#111;display:flex;align-items:center;gap:16px;padding:7px;text-align:left;font-size:18px}
#smarthome-landing .sh-hotspot:hover{color:#0067da}
#smarthome-landing .sh-hotspot:before{content:"";flex:0 0 16px;width:16px;height:16px;border-radius:50%;background:var(--sh-blue);box-shadow:0 0 0 5px #fff,0 0 0 9px rgba(0,121,255,.3);animation:sh-pulse 2s ease-out infinite}
#smarthome-landing .sh-hotspots--plain .sh-hotspot:before,#smarthome-landing .sh-hotspots--comfort .sh-hotspot:before{display:none}
@keyframes sh-pulse{50%{box-shadow:0 0 0 5px #fff,0 0 0 17px rgba(0,121,255,.05)}}
#smarthome-landing .sh-house__message{grid-column:2;grid-row:2;position:relative;width:100%;padding:25px 58px 25px 27px;background:#fff;box-shadow:0 7px 28px #0003;font-size:18px}
#smarthome-landing .sh-house__stage--comfort .sh-house__message{position:absolute;left:calc(var(--message-x, 50%) + 18px);top:var(--message-y, 50%);right:auto;width:min(330px,calc(100% - 48px));z-index:2;transform:translateY(-50%)}
#smarthome-landing .sh-house__message[hidden]{display:none}
#smarthome-landing .sh-house__message h3{font-size:24px;margin-bottom:8px}
#smarthome-landing .sh-house__message p{margin:0}
#smarthome-landing .sh-house__close{position:absolute;right:12px;top:8px;background:transparent;border:0;font-size:30px}
@media(min-width:601px) and (max-width:800px){#smarthome-landing .sh-shell{width:80%}#smarthome-landing .sh-tabs-wrap{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;align-items:start;gap:5px}#smarthome-landing .sh-tabs{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;scroll-behavior:smooth}#smarthome-landing .sh-tabs::-webkit-scrollbar{display:none}#smarthome-landing .sh-tabs button{flex:0 0 calc(100% / 3);padding-inline:4px}#smarthome-landing .sh-tabs-arrow{display:block;width:44px;height:52px;border:0;background:#fff;color:#0067da;font-size:25px}}
@media(max-width:600px){#smarthome-landing{font-size:17px}#smarthome-landing .sh-shell{width:calc(100% - 64px)}#smarthome-landing .sh-section{padding-block:56px}#smarthome-landing .sh-hero,#smarthome-landing .sh-hero__inner{min-height:580px}#smarthome-landing .sh-hero{background-position:64% center}#smarthome-landing .sh-hero__inner{padding-top:50px}#smarthome-landing .sh-hero h1{font-size:33px;max-width:330px;margin-bottom:30px}#smarthome-landing .sh-hero p{font-size:23px;max-width:300px;margin-bottom:30px}#smarthome-landing .sh-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}#smarthome-landing .sh-tabs button{font-size:16px;padding:13px 7px}#smarthome-landing .sh-products,#smarthome-landing .sh-scenarios__grid,#smarthome-landing .sh-partners__grid,#smarthome-landing .sh-reviews__track,#smarthome-landing .sh-meet__grid{grid-template-columns:1fr}#smarthome-landing .sh-steps__grid{grid-template-columns:1fr 1fr}#smarthome-landing .sh-partner__toggle{height:360px}#smarthome-landing .sh-meet__grid img{height:250px}}
@media(max-width:600px){#smarthome-landing .sh-hotspots{grid-template-columns:1fr}}
@media(min-width:401px) and (max-width:600px){#smarthome-landing .sh-shell{width:calc(100% - 80px)}#smarthome-landing .sh-tabs-wrap{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;gap:5px}#smarthome-landing .sh-tabs{display:flex;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;scroll-behavior:smooth}#smarthome-landing .sh-tabs::-webkit-scrollbar{display:none}#smarthome-landing .sh-tabs button{flex:0 0 calc(100% / 3);font-size:14px;padding-inline:2px}#smarthome-landing .sh-tabs-arrow{display:block;width:44px;height:52px;border:0;background:#fff;color:#0067da;font-size:25px}#smarthome-landing .sh-products{grid-template-columns:repeat(2,minmax(0,1fr))}#smarthome-landing .sh-steps__grid{grid-template-columns:1fr}}
@media(max-width:400px){#smarthome-landing .sh-tabs-wrap{display:grid;grid-template-columns:minmax(0,1fr) 44px 44px;gap:4px}#smarthome-landing .sh-tabs{display:flex;flex-wrap:nowrap;overflow:hidden;grid-column:1;grid-row:1;margin-bottom:20px}#smarthome-landing .sh-tabs button{flex:0 0 100%;padding-inline:5px;text-align:left}#smarthome-landing .sh-tabs-arrow{display:block;width:44px;height:52px;border:0;background:#fff;color:#0067da;font-size:25px}#smarthome-landing [data-tabs-prev]{grid-column:2;grid-row:1}#smarthome-landing [data-tabs-next]{grid-column:3;grid-row:1}#smarthome-landing .sh-house__image{width:calc(100% + 80px);margin-left:-40px}#smarthome-landing .sh-videos{grid-template-columns:1fr}}
@media(max-width:360px){#smarthome-landing .sh-shell{width:calc(100% - 48px)}#smarthome-landing .sh-house__image{width:calc(100% + 48px);margin-left:-24px}}
@media(prefers-reduced-motion:reduce){#smarthome-landing .sh-hotspot:before,#smarthome-landing .sh-house__marker:before{animation:none}#smarthome-landing .sh-partner__back{transition:none}}
/* House diagram: full-width image with no visible side legend. */
#smarthome-landing .sh-house__stage{grid-template-columns:minmax(0,1fr)!important}
#smarthome-landing .sh-house__image{grid-column:1!important;grid-row:1!important;width:100%!important}
#smarthome-landing .sh-hotspots{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
#smarthome-landing .sh-house__stage--comfort .sh-house__message{position:absolute!important;left:clamp(12px,calc(var(--message-x, 50%) + 18px),calc(100% - 12px))!important;top:var(--message-y, 50%)!important;right:auto!important;width:min(330px,calc(100% - 24px));transform:none!important}
#smarthome-landing .sh-house__stage--comfort .sh-house__message{grid-column:auto!important;grid-row:auto!important;box-sizing:border-box!important;width:min(330px,calc(100% - 24px));min-width:240px!important}
@media(min-width:1200px){
  #smarthome-landing .sh-tabs{border-bottom:0}
  #smarthome-landing .sh-tabs button{font-weight:400;color:rgba(0,0,0,.5)}
  #smarthome-landing .sh-tabs button[aria-selected=true]{color:#000;font-weight:700}
  #smarthome-landing .sh-tabs button[aria-selected=true]:after{display:none}
  #smarthome-landing .sh-house__stage--comfort .sh-house__message{width:400px;opacity:.9}
  #smarthome-landing .sh-house__stage--comfort .sh-house__message h3{font-size:21px}
  #smarthome-landing .sh-house__stage--comfort .sh-house__message p{font-size:16px}
}

/* Desktop tooltips use the design width; only overflowing tooltips become compact. */
#smarthome-landing .sh-house__stage--comfort .sh-house__message {
    width: 400px;
    max-width: calc(100vw - 32px);
    padding: 20px 42px 20px 20px;
    box-sizing: border-box;
}
#smarthome-landing .sh-house__stage--comfort .sh-house__message--compact {
    min-width: 0 !important;
    max-width: none;
}
/* Full-width desktop tab navigation. */
@media(min-width:801px){
  #smarthome-landing .sh-tabs{flex-wrap:nowrap;justify-content:stretch;width:100%;}
  #smarthome-landing .sh-tabs button{flex:1 1 0;text-align:center;}
}
/* Compact tab navigation when all categories do not fit in one row. */
@media(min-width:401px) and (max-width:800px){
  #smarthome-landing .sh-tabs-wrap{grid-template-columns:minmax(0,1fr) 36px 36px;align-items:center;}
  #smarthome-landing .sh-tabs{grid-column:1;grid-row:1;display:flex;flex-wrap:nowrap;overflow:hidden;margin-bottom:20px;}
  #smarthome-landing .sh-tabs button{flex:0 0 calc(100% / 3);}
  #smarthome-landing [data-tabs-prev]{grid-column:2;grid-row:1;}
  #smarthome-landing [data-tabs-next]{grid-column:3;grid-row:1;}
  #smarthome-landing .sh-tabs-arrow{position:relative;width:36px;height:44px;padding:0;border:0;background:transparent;color:transparent;font-size:0;}
  #smarthome-landing .sh-tabs-arrow:before{content:"";position:absolute;left:8px;top:15px;width:20px;height:11px;background:center/20px 11px no-repeat;}
  #smarthome-landing [data-tabs-prev]:before{background-image:url("house/arrow-prev.svg");transform:rotate(-90deg);}
  #smarthome-landing [data-tabs-next]:before{background-image:url("house/arrow-next.svg");transform:rotate(90deg);}
}
/* Extra-wide layout tuning from 2251px. */
@media(min-width:2251px){
  #smarthome-landing .sh-section{padding-block:120px;}
  #smarthome-landing .sh-house h2{font-size:60px;}
  #smarthome-landing .sh-house h2{margin-bottom:50px;}
  #smarthome-landing .sh-tabs button{font-size:28px;}
  #smarthome-landing .sh-house__message h3{font-size:28px;}
}
/* Use the desktop tab styling below 1200px as well. */
@media(max-width:1199px){
  #smarthome-landing .sh-tabs{border-bottom:0;}
  #smarthome-landing .sh-tabs button{font-weight:400;color:rgba(0,0,0,.5);}
  #smarthome-landing .sh-tabs button[aria-selected="true"]{color:#000;font-weight:700;}
  #smarthome-landing .sh-tabs button[aria-selected="true"]:after{display:none;}
}
/* Scrollable tab navigation below 1200px. */
@media(min-width:801px) and (max-width:1199px){
  #smarthome-landing .sh-tabs-wrap{display:grid;grid-template-columns:minmax(0,1fr) 36px 36px;align-items:center;gap:5px;}
  #smarthome-landing .sh-tabs{grid-column:1;grid-row:1;display:flex;flex-wrap:nowrap;overflow:hidden;margin-bottom:20px;}
  #smarthome-landing .sh-tabs button{flex:0 0 calc(100% / 3);text-align:center;}
  #smarthome-landing [data-tabs-prev]{grid-column:2;grid-row:1;}
  #smarthome-landing [data-tabs-next]{grid-column:3;grid-row:1;}
  #smarthome-landing .sh-tabs-arrow{display:block;position:relative;width:36px;height:44px;padding:0;border:0;background:transparent;color:transparent;font-size:0;}
  #smarthome-landing .sh-tabs-arrow:before{content:"";position:absolute;left:8px;top:15px;width:20px;height:11px;background:center/20px 11px no-repeat;}
  #smarthome-landing [data-tabs-prev]:before{background-image:url("house/arrow-prev.svg");transform:rotate(-90deg);}
  #smarthome-landing [data-tabs-next]:before{background-image:url("house/arrow-next.svg");transform:rotate(90deg);}
}
/* Compact below-image tooltip layout and marker sizing below 1200px. */
@media(max-width:1199px){
  #smarthome-landing .sh-house__stage--comfort{gap:0;}
  #smarthome-landing .sh-house__stage--comfort .sh-house__message{
    position:static!important;
    grid-column:1!important;
    grid-row:2!important;
    left:auto!important;
    top:auto!important;
    right:auto!important;
    width:100%;
    margin-top:30px;
    margin-bottom:50px;
    transform:none!important;
  }
  #smarthome-landing .sh-house__marker:before{width:20px;height:20px;}
  #smarthome-landing .sh-house__marker.is-active:before{width:40px;height:40px;}
}
/* Mobile spacing and active marker size below 1200px. */
@media(max-width:1199px){
  #smarthome-landing .sh-section{padding-block:50px 0;}
  #smarthome-landing .sh-house__marker.is-active:before{width:30px;height:30px;}
}
@media(max-width:1199px){
  #smarthome-landing .sh-house__message .sh-house__close{display:none;}
}
@media(max-width:1199px){
  #smarthome-landing .sh-tabs{overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;touch-action:pan-x;overscroll-behavior-x:contain;}
  #smarthome-landing .sh-tabs::-webkit-scrollbar{display:none;}
}
@media(max-width:1199px){
  #smarthome-landing .sh-tabs-wrap{align-items:start;}
  #smarthome-landing .sh-tabs-arrow{align-self:start;margin-top:8px;}
}
@media(max-width:1199px){
  #smarthome-landing .sh-tabs button{font-size:18px;}
}
@media(max-width:1199px){
  #smarthome-landing .sh-house__message h3{font-size:18px;}
  #smarthome-landing .sh-house__message p{font-size:16px;}
}
/* Single visible tab below 800px. */
@media(min-width:401px) and (max-width:800px){
  #smarthome-landing .sh-tabs button{flex:0 0 100%;}
  #smarthome-landing .sh-tabs{overflow:hidden;}
}
/* Keep one complete category in view after touch navigation below 800px. */
@media(max-width:800px){
  #smarthome-landing .sh-tabs{scroll-snap-type:x mandatory;}
  #smarthome-landing .sh-tabs button{scroll-snap-align:start;scroll-snap-stop:always;}
}

/* Keep category labels left aligned on narrow screens. */
@media(max-width:1199px){
  #smarthome-landing .sh-tabs button{text-align:left;}
}

/* Smaller visible house markers below 800px; retain the 44px click target. */
@media(max-width:799px){
  #smarthome-landing .sh-house__marker:before{width:10px;height:10px;}
  #smarthome-landing .sh-house__marker.is-active:before{width:20px;height:20px;}
}

/* Render the same SVG navigation icons on the narrowest phones. */
@media(max-width:400px){
  #smarthome-landing .sh-tabs-arrow{position:relative;width:44px;height:44px;padding:0;background:transparent;color:transparent;font-size:0;}
  #smarthome-landing .sh-tabs-arrow:before{content:"";position:absolute;left:12px;top:16px;width:20px;height:11px;background:center/20px 11px no-repeat;}
  #smarthome-landing [data-tabs-prev]:before{background-image:url("house/arrow-prev.svg");transform:rotate(-90deg);}
  #smarthome-landing [data-tabs-next]:before{background-image:url("house/arrow-next.svg");transform:rotate(90deg);}
}