/* Ľahký režim: rovnaký vzhľad, menej práce pre grafickú kartu.
   Žiary sú farebné prechody namiesto filter:blur, sklo okien a hlavičky je krycejšie namiesto backdrop-filter. */

/* žiary na pozadí: pevné vrstvy bez rozostrenia, ostávajú na vlastnej vrstve a pri skrolovaní sa neprekresľujú */
body::before,body::after{filter:none;border-radius:0;will-change:transform;transform:translateZ(0);contain:strict}
body::before{width:980px;height:980px;left:-400px;top:-20px;
  background:radial-gradient(closest-side,rgba(43,108,176,.56) 0,rgba(43,108,176,.56) 36%,rgba(43,108,176,.28) 63%,rgba(43,108,176,0) 100%);opacity:1}
body::after{width:880px;height:880px;right:-340px;top:-160px;
  background:radial-gradient(closest-side,rgba(123,182,240,.28) 0,rgba(123,182,240,.28) 32%,rgba(123,182,240,.14) 63%,rgba(123,182,240,0) 100%);opacity:1}

/* žiary za sekciami: statické prechody, bez filter:blur */
.hero .demo::before,.client-row .p::before,.hero-demo::before,.app::before,.xb-band::before,.xh-hero::before,.xh-hero::after{filter:none;transform:scale(1.4)}
.hero .demo::before,.hero-demo::before{background:radial-gradient(closest-side,rgba(123,182,240,.34),rgba(123,182,240,0))}
.client-row .p::before{background:radial-gradient(closest-side,rgba(43,108,176,.5),rgba(43,108,176,0))}
.app::before{background:radial-gradient(closest-side,rgba(123,182,240,.22),rgba(123,182,240,0))}
.xb-band::before{background:radial-gradient(closest-side,#2B6CB0 0,#2B6CB0 35%,rgba(43,108,176,.5) 65%,rgba(43,108,176,0) 100%);opacity:.35}
.xh-hero::before{background:radial-gradient(closest-side,#2B6CB0 0,#2B6CB0 35%,rgba(43,108,176,.5) 65%,rgba(43,108,176,0) 100%);opacity:.4}
.xh-hero::after{background:radial-gradient(closest-side,#7BB6F0 0,#7BB6F0 35%,rgba(123,182,240,.5) 65%,rgba(123,182,240,0) 100%);opacity:.16}

/* sklo: bez backdrop-filter, o niečo krycejšie pozadie, aby vyzeralo rovnako */
header.top{background:rgba(14,27,46,.92);backdrop-filter:none;-webkit-backdrop-filter:none}
.glass,.cal,.cal-card,.xh-win,.xb-win{backdrop-filter:none;-webkit-backdrop-filter:none}
.glass{background:rgba(20,36,58,.8)}
.cal{background:rgba(20,36,58,.82)}

@media (max-width:900px){
  body::before,body::after{display:none}
}
html,body{overflow-x:clip}
/* bez rozostrenia nesmie byť cez sklo vidieť obsah pod ním */
.xh-win,.xb-win{background:rgb(19,34,56)}
.cal-card{background:rgba(20,36,58,.97)}
.glass{background:rgba(20,36,58,.9)}
.cal{background:rgba(20,36,58,.9)}
header.top{background:rgba(14,27,46,.95)}