/* Первый экран главной: карточка с 3D-сценой из hero-animation.js; без WebGL — картинка hero-fallback.webp. */
.home-hero .gb-stage{position:absolute;left:0;right:0;bottom:-30px;height:340px;z-index:0;pointer-events:none;overflow:hidden;transform:scaleX(-1);transform-origin:center;background:url(../hero-fallback.webp) center bottom/cover no-repeat;
-webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.15) 7%,rgba(0,0,0,.65) 18%,#000 30%,#000 70%,rgba(0,0,0,.65) 82%,rgba(0,0,0,.15) 93%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.15) 7%,rgba(0,0,0,.65) 18%,#000 30%,#000 70%,rgba(0,0,0,.65) 82%,rgba(0,0,0,.15) 93%,transparent 100%)}
.home-hero .gb-stage:has(canvas){background:none}
.home-hero .gb-stage canvas{display:block;width:100%;height:100%}
.gl-fallback .home-hero .gb-stage{background:url(../hero-fallback.webp) center bottom/cover no-repeat}
.gl-fallback .home-hero .gb-stage canvas{display:none}
.home-hero{
  width:calc(100% - 80px);max-width:calc(var(--pg-max) - 80px);
  margin:32px auto 0;height:400px;min-height:400px;
  padding:32px 40px!important;
  justify-content:flex-start;overflow:hidden;
  border:1px solid oklch(from var(--ac) calc(l + var(--k-dir) * 0.1329) calc(c * 0.5939) calc(h + -2.7) / 0.24);border-radius:var(--r-xl);
  background:oklch(calc(var(--k-l0) + var(--k-dir) * 0.0233) calc(0.0406 * var(--k-cs)) calc(270.14 + var(--k-hs)));box-shadow:var(--sh-card);
}
body.has-aside main .home-hero>.pw{position:relative;z-index:1;width:100%;max-width:none;margin:0;padding:0}
.home-hero .home-hero-row{display:block}
.home-hero .home-hero-txt{max-width:700px;text-align:left}
.home-hero .home-cta{justify-content:flex-start}
.home-hero::after{z-index:0;pointer-events:none}
@media (min-width:1280px){
  body.has-aside main .home-hero{width:auto;max-width:none;
    margin-left:calc(50% - min(700px,50%) + var(--gut));
    margin-right:calc(50% - min(700px,50%) + var(--gut) + var(--aside) + var(--aside-gap))}
}
@media (max-width:760px){
  .home-hero{width:calc(100% - 40px);margin:24px auto 0;height:auto;padding:24px 24px 110px!important}
  .home-hero .gb-stage{height:280px;bottom:-16px}
}
@media (max-width:400px){
  .home-hero{padding-inline:20px!important}
  .home-hero .home-cta{flex-wrap:wrap}
}