:root{
  --navy:#16233B; --navy-2:#1F3255; --frost:#F6F4EE; --paper:#FBFAF6;
  --amber:#C98A3E; --amber-2:#E0A860; --red:#A83A32; --slate:#5B6472;
  --line:#DEDACD;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--paper); color:var(--navy);
  font-family:'Inter',sans-serif; line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3{font-family:'Fraunces',serif; line-height:1.15; color:var(--navy); font-weight:600;}
a{color:var(--navy);}
.wrap{max-width:920px; margin:0 auto; padding:0 24px;}

header{background:var(--navy); color:var(--frost); padding:18px 0;}
header .wrap{display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px;}
.brand{font-family:'Fraunces',serif; font-weight:600; font-size:1.25rem; color:var(--frost); text-decoration:none;}
.brand span{color:var(--amber-2);}
nav.mainnav{display:flex; gap:22px;}
nav.mainnav a{color:#C7CEDB; text-decoration:none; font-size:0.95rem; font-weight:500;}
nav.mainnav a:hover, nav.mainnav a.active{color:var(--frost);}

.hero{background:var(--navy); color:var(--frost); padding:56px 0 80px;}
.hero h1{font-size:2.5rem; max-width:15ch; color:var(--frost);}
.hero p.lead{margin-top:14px; max-width:52ch; color:#C7CEDB; font-size:1.05rem;}
.page-hero{background:var(--navy); color:var(--frost); padding:48px 0;}
.page-hero h1{font-size:2.1rem; color:var(--frost);}
.page-hero p{margin-top:10px; max-width:56ch; color:#C7CEDB;}

.calc-card{
  background:var(--paper); border-radius:4px; margin-top:-48px;
  box-shadow:0 20px 50px rgba(22,35,59,0.25);
  padding:32px; position:relative;
}
.calc-grid{display:grid; grid-template-columns:1fr 1fr; gap:18px;}
@media(max-width:600px){
  .calc-grid{grid-template-columns:1fr;}
  .hero h1{font-size:1.9rem;}
  .hero{padding:40px 0 64px;}
  .page-hero h1{font-size:1.7rem;}
  nav.mainnav{gap:14px; font-size:0.88rem;}
  header .wrap{justify-content:center; text-align:center;}
  .calc-card{padding:22px 18px; margin-top:-40px;}
  section.content{padding:40px 0;}
  section.content h2{font-size:1.4rem;}
  .zone-table-wrap{overflow-x:auto; -webkit-overflow-scrolling:touch;}
  .zone-table{min-width:480px;}
}
@media(max-width:400px){
  nav.mainnav{gap:10px; font-size:0.82rem;}
  .brand{font-size:1.1rem;}
}
label{display:block; font-size:0.85rem; color:var(--slate); margin-bottom:6px; font-weight:500;}
input, select, textarea{
  width:100%; padding:11px 12px; border:1.5px solid var(--line); border-radius:3px;
  font-family:'Inter',sans-serif; font-size:1rem; background:#fff; color:var(--navy);
}
input:focus, select:focus, textarea:focus{outline:2px solid var(--amber); outline-offset:1px; border-color:var(--amber);}
.field{margin-bottom:0;}
.full{grid-column:1/-1;}

button.calc-btn{
  margin-top:22px; width:100%; padding:15px; background:var(--navy); color:var(--frost);
  border:none; border-radius:3px; font-size:1.05rem; font-weight:600; cursor:pointer;
  font-family:'Inter',sans-serif; transition:background 0.15s;
}
button.calc-btn:hover{background:var(--navy-2);}

.result{margin-top:24px; padding:22px; border-radius:3px; display:none;}
.result.show{display:block;}
.result-winner{font-family:'Fraunces',serif; font-size:1.4rem; margin-bottom:10px;}
.result-row{display:flex; justify-content:space-between; padding:9px 0; border-bottom:1px solid var(--line); font-size:0.95rem;}
.result-row:last-child{border-bottom:none;}
.result.norgespris{background:#FBF3E6; border:1.5px solid var(--amber);}
.result.stotte{background:#EEF1F5; border:1.5px solid var(--navy-2);}
.badge{display:inline-block; font-size:0.75rem; padding:3px 10px; border-radius:20px; background:var(--amber); color:var(--navy); font-weight:600; margin-left:8px;}

section.content{padding:56px 0;}
section.content h2{font-size:1.7rem; margin-bottom:16px;}
section.content p{margin-bottom:14px; max-width:68ch; color:#333;}
section.alt{background:var(--frost);}

.zone-table{width:100%; border-collapse:collapse; margin-top:16px; font-size:0.92rem;}
.zone-table th, .zone-table td{text-align:left; padding:10px 12px; border-bottom:1px solid var(--line);}
.zone-table th{color:var(--slate); font-weight:600; font-size:0.8rem; text-transform:none;}

.faq-item{border-bottom:1px solid var(--line);}
.faq-question{
  width:100%; text-align:left; background:none; border:none; cursor:pointer;
  display:flex; justify-content:space-between; align-items:center; gap:16px;
  padding:18px 4px; font-family:'Inter',sans-serif; font-size:1.05rem; font-weight:600;
  color:var(--navy); font-family:inherit;
}
.faq-question:focus-visible{outline:2px solid var(--amber); outline-offset:2px;}
.faq-icon{flex-shrink:0; width:22px; height:22px; position:relative; transition:transform 0.2s ease;}
.faq-icon::before, .faq-icon::after{content:''; position:absolute; background:var(--navy); border-radius:1px;}
.faq-icon::before{width:14px; height:2px; top:10px; left:4px;}
.faq-icon::after{width:2px; height:14px; top:4px; left:10px; transition:opacity 0.2s ease;}
.faq-item.open .faq-icon{transform:rotate(180deg);}
.faq-item.open .faq-icon::after{opacity:0;}
.faq-answer{
  max-height:0; overflow:hidden; transition:max-height 0.25s ease, padding 0.25s ease;
  padding:0 4px;
}
.faq-item.open .faq-answer{max-height:300px; padding:0 4px 18px;}
.faq-answer p{color:#444; max-width:66ch; margin:0;}

.disclaimer{background:#EEEAE0; border-left:3px solid var(--amber); padding:16px 20px; font-size:0.88rem; color:var(--slate); margin-top:20px; border-radius:2px;}

footer{background:var(--navy); color:#9AA5B8; padding:36px 0; font-size:0.85rem; text-align:center;}
footer .foot-links{margin-bottom:14px; display:flex; gap:18px; justify-content:center; flex-wrap:wrap;}
footer a{color:#C7CEDB;}

.updated{font-size:0.8rem; color:var(--slate); margin-top:8px;}

.contact-card{background:#fff; border:1.5px solid var(--line); border-radius:4px; padding:28px; margin-top:24px;}
.contact-success{display:none; background:#EAF4EC; border:1.5px solid #4C8E5C; color:#2A5E38; padding:16px 18px; border-radius:3px; margin-top:16px;}
.contact-success.show{display:block;}

.value-grid{display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-top:12px;}
@media(max-width:600px){.value-grid{grid-template-columns:1fr;}}
.value-item h3{font-size:1.05rem; margin-bottom:6px;}
.value-item p{color:#444; font-size:0.95rem;}