/* BREQNET — Shared Background */

:root {
  background: #f5f5f7;
}

body {
  margin: 0;
  min-height: 100vh;
  background: #f5f5f7;
}

.breqnet-background {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  background: linear-gradient(
    135deg,
    #f9fafc 0%,
    #f4f6fa 52%,
    #f9fafc 100%
  );
}

.breqnet-background .glass {
  position: absolute;
  border: 1px solid rgba(255,255,255,.86);
  border-radius: 23px;
  background: linear-gradient(
    135deg,
    rgba(255,255,255,.66),
    rgba(217,229,244,.30) 72%,
    rgba(255,255,255,.46)
  );
  box-shadow:
    inset 2px 2px 3px rgba(255,255,255,.85),
    12px 20px 45px rgba(100,125,157,.10);
  backdrop-filter: blur(9px);
  -webkit-backdrop-filter: blur(9px);
  transform: skewY(-14deg) rotate(-1deg);
}

.breqnet-background .glass.one {
  left: -8%;
  top: 27%;
  width: 26%;
  height: 39%;
  border-right: 2px solid rgba(35,191,119,.53);
}

.breqnet-background .glass.two {
  left: -13%;
  top: 54%;
  width: 29%;
  height: 31%;
  border-right: 2px solid rgba(164,185,212,.50);
  opacity: .56;
}

.breqnet-background .glass.three {
  right: -8%;
  top: 40%;
  width: 27%;
  height: 37%;
  border-left: 2px solid rgba(166,191,221,.56);
  opacity: .73;
}

@media (max-width: 950px) {
  .breqnet-background .glass.one { left: -16%; }
  .breqnet-background .glass.two { left: -19%; }
  .breqnet-background .glass.three { right: -16%; }
}

@media (max-width: 700px) {
  .breqnet-background .glass { opacity: .25; }
  .breqnet-background .glass.two { display: none; }
}

@media (max-width: 430px) {
  .breqnet-background .glass { display: none; }
}