*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:#07131d}
body{font-family:Arial,Helvetica,sans-serif}
.page{
  position:relative;
  width:100%;
  max-width:1448px;
  margin:0 auto;
  min-height:100vh;
  background:#07131d;
  overflow:hidden;
}
.reference{
  display:block;
  width:100%;
  height:auto;
  position:relative;
  z-index:2;
}
.footer-fill{
  position:absolute;
  z-index:1;
  left:0;right:0;
  top:74.6%;
  bottom:0;
  background:
    radial-gradient(circle at 84% 62%, rgba(20,75,110,.11), transparent 17%),
    #07131d;
}
.hotspot{
  position:absolute;
  z-index:5;
  display:block;
  border-radius:8px;
}
.hotspot:focus-visible{
  outline:3px solid #11a7ef;
  outline-offset:2px;
}

/* Procentkoordinater mot referensbilden 1448 × 1086 */
.nav-om{left:34.2%;top:1.6%;width:7.0%;height:4.8%}
.nav-omraden{left:42.1%;top:1.6%;width:8.0%;height:4.8%}
.nav-foretag{left:50.8%;top:1.6%;width:7.0%;height:4.8%}
.nav-karriar{left:58.2%;top:1.6%;width:5.2%;height:4.8%}
.nav-nyheter{left:64.1%;top:1.6%;width:5.6%;height:4.8%}
.nav-kontakt{left:70.2%;top:1.6%;width:5.4%;height:4.8%}
.nav-cta{left:80.4%;top:1.3%;width:10.7%;height:5.0%}

.hero-cta{left:12.4%;top:31.4%;width:15.2%;height:4.4%}

.academy{left:11.6%;top:37.7%;width:18.0%;height:20.4%}
.bokforing{left:30.8%;top:37.7%;width:18.1%;height:20.4%}
.sso{left:50.1%;top:37.7%;width:18.0%;height:20.4%}
.digital{left:69.3%;top:37.7%;width:18.1%;height:20.4%}

.newsletter{left:67.3%;top:77.4%;width:7.7%;height:3.2%}
.footer-email{left:60.0%;top:88.5%;width:9%;height:2.0%}

@media (max-width:900px){
  .page{max-width:none}
  .reference{
    width:1360px;
    max-width:none;
    transform-origin:top left;
    transform:scale(calc(100vw / 1360));
  }
  .page{
    height:calc(1360px * .75 * (100vw / 1360));
    min-height:0;
  }
  .hotspot{display:none}
}