:root{--blue:#064f91;--navy:#082e59;--light:#eef7ff;--text:#0a315e;--line:#dceaf7}
*{box-sizing:border-box} body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--text);background:#fff}
a{text-decoration:none;color:inherit}.wrap{max-width:1220px;margin:auto;padding:0 24px}
.top{display:flex;align-items:center;justify-content:space-between;gap:28px;padding:14px 0}
.logo{width:390px;max-width:48%;height:auto}.contact{display:flex;gap:28px;font-size:15px;align-items:center}
nav{background:linear-gradient(90deg,#f5faff,#eaf5ff);border-top:1px solid #edf4fa;border-bottom:1px solid #d8e8f6}
nav .wrap{display:flex;justify-content:space-between;align-items:center}.navlink{padding:17px 20px;font-weight:700}.navlink:hover,.navlink.active{background:var(--blue);color:#fff;border-radius:7px}
.hero{background:linear-gradient(115deg,#ffffff 0%,#f4faff 52%,#dceeff 100%);min-height:420px;display:flex;align-items:center}
.hero-copy{max-width:600px;padding:58px 0}.hero h1{font-family:Georgia,serif;font-size:54px;line-height:1.02;margin:0 0 18px;color:#082e59}
.hero p{font-size:20px;line-height:1.5}.buttons{display:flex;gap:14px;margin:25px 0}.btn{padding:14px 25px;border-radius:7px;border:1px solid var(--blue);font-weight:700}.primary{background:var(--blue);color:#fff}
.checks{display:flex;gap:24px;flex-wrap:wrap;font-size:14px}.checks span:before{content:"✓";color:#0872cf;font-weight:bold;margin-right:8px}
.cards{background:#f1f8fe;padding:26px 0}.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.card{background:white;padding:24px;border-radius:10px;box-shadow:0 2px 12px #0b4d8120;min-height:205px}.icon{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:#0874c9;color:#fff;font-size:27px}.card h3{font-size:20px}.card p{font-size:14px;line-height:1.5;color:#375c7e}.more{color:#006ec7;font-weight:700;font-size:14px}
.strip{background:#e6f4ff;padding:25px 0}.strip .wrap{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}.strip h3{margin:0 0 5px}
footer{background:linear-gradient(90deg,#0c3966,#07315d);color:#fff;padding:30px 0 18px}footer .cols{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:35px}footer p{line-height:1.6;margin:4px 0}.copyright{margin-top:25px;padding-top:15px;border-top:1px solid #ffffff22;font-size:12px}
.pagehero{background:#eef7ff;padding:50px 0}.pagehero h1{font-family:Georgia,serif;font-size:45px;margin:0 0 12px}.content{padding:42px 0;max-width:900px}.content h2{color:#073f76}.content p,.content li{line-height:1.7}
@media(max-width:850px){.contact{display:none}.logo{max-width:100%;width:360px}nav .wrap{overflow:auto;justify-content:flex-start}.navlink{white-space:nowrap;padding:14px}.hero h1{font-size:39px}.grid{grid-template-columns:1fr 1fr}.strip .wrap,footer .cols{grid-template-columns:1fr}.hero{background:#f5faff}.hero-copy{padding:40px 0}}
@media(max-width:520px){.grid{grid-template-columns:1fr}.buttons{flex-direction:column}.hero h1{font-size:34px}.wrap{padding:0 17px}}

.hero .wrap{position:relative;width:100%}
.hero .wrap{position:relative;width:100%}.hero-copy{position:relative;z-index:2}

/* Version 2.2 hero */
.hero{
  min-height:400px;
  background:
    linear-gradient(90deg,rgba(255,255,255,.98) 0%,rgba(255,255,255,.92) 36%,rgba(255,255,255,.12) 61%),
    url('assets/hero-laptop-kaffe-smartphone.png') right center/auto 100% no-repeat,
    #f4f9fd;
}
.hero-copy{max-width:610px;padding:45px 0 32px}
@media(max-width:850px){
 .hero{background:
   linear-gradient(rgba(255,255,255,.93),rgba(255,255,255,.93)),
   url('assets/hero-laptop-kaffe-smartphone.png') center/cover no-repeat}
}

/* Version 2.5 - burger-menu på tablet/mobil */
.burger{
 display:none;
 width:46px;height:42px;
 margin:7px 17px 7px auto;
 padding:9px 10px;
 border:0;border-radius:7px;
 background:#064f91;
 cursor:pointer;
}
.burger span{
 display:block;height:3px;
 margin:4px 0;border-radius:3px;
 background:#fff;
 transition:.2s ease;
}
@media(max-width:850px){
 nav{position:relative}
 nav .wrap.nav-menu{
   display:none;
   overflow:visible;
   padding:8px 17px 14px;
   flex-direction:column;
   align-items:stretch;
   background:#eef7ff;
 }
 nav .wrap.nav-menu.open{display:flex}
 .burger{display:block}
 .navlink{
   display:block;
   width:100%;
   padding:13px 15px;
   border-bottom:1px solid #d8e8f6;
   border-radius:5px;
 }
 .navlink:last-child{border-bottom:0}
 .navlink.active{background:#064f91;color:#fff}
 .burger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
 .burger.open span:nth-child(2){opacity:0}
 .burger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
}