/* ===== WebVærk Help Center — pro design ===== */
:root{
  --navy:#0A1628;
  --navy-700:#13243B;
  --navy-600:#1B3150;
  --line:rgba(151,196,219,0.18);
  --paper:#F4F6F9;
  --card:#FFFFFF;
  --ink:#0B1E2B;
  --ink-soft:#55708A;
  --amber:#FF7A2E;
  --amber-dark:#E2611B;
  --ok:#3FA873;
  --radius:10px;
  --maxw:1120px;
  font-size:16px;
}
*{box-sizing:border-box;margin:0;padding:0;}
body{font-family:'IBM Plex Sans',system-ui,sans-serif;color:var(--ink);background:var(--paper);line-height:1.65;-webkit-font-smoothing:antialiased;}
h1,h2,h3,h4,.logo,.eyebrow,.btn{font-family:'Space Grotesk',system-ui,sans-serif;}
a{color:inherit;text-decoration:none;}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px;}
svg{display:block;}

/* ===== NAV ===== */
.nav{background:var(--navy);position:sticky;top:0;z-index:60;border-bottom:1px solid var(--line);}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;height:68px;}
.logo{display:flex;align-items:center;gap:10px;color:#fff;font-size:1.15rem;font-weight:700;}
.logo .mark{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;background:#fff;color:var(--navy);font-weight:700;font-size:0.9rem;border-radius:7px;transition:transform .25s,background .25s;}
.logo:hover .mark{transform:rotate(90deg);background:var(--amber);}
.nav-right{display:flex;align-items:center;gap:20px;}
.nav-right a:not(.btn){color:#C6D6E6;font-size:0.92rem;transition:color .2s;}
.nav-right a:not(.btn):hover{color:#fff;}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:600;font-size:0.9rem;padding:10px 20px;border:1px solid transparent;border-radius:8px;cursor:pointer;transition:all .2s;}
.btn-amber{background:var(--amber);color:#1A0E05;}
.btn-amber:hover{background:var(--amber-dark);box-shadow:0 10px 24px -10px rgba(255,122,46,0.6);transform:translateY(-1px);}
.btn-ghost{background:transparent;color:#fff;border-color:var(--line);}
.btn-ghost:hover{border-color:#fff;}

/* ===== HERO ===== */
.hero{background:var(--navy);color:#fff;padding:84px 0 92px;text-align:center;position:relative;overflow:hidden;}
.hero::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% -10%,rgba(255,122,46,0.14),transparent 55%);pointer-events:none;}
.hero .wrap{position:relative;z-index:1;}
.eyebrow{display:inline-flex;align-items:center;gap:10px;justify-content:center;color:var(--amber);font-size:0.76rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;margin-bottom:18px;}
.eyebrow::before,.eyebrow.center::after{content:"";width:24px;height:1px;background:var(--amber);}
.hero h1{font-size:2.9rem;font-weight:700;letter-spacing:-0.025em;margin-bottom:14px;line-height:1.1;}
.hero p.sub{color:#AFC4D8;font-size:1.1rem;max-width:580px;margin:0 auto 36px;}

/* ===== SØGEBAR (funktionel) ===== */
.search{position:relative;max-width:600px;margin:0 auto;}
.search-box{display:flex;align-items:center;gap:14px;background:#fff;border-radius:12px;padding:16px 20px;box-shadow:0 22px 50px -20px rgba(0,0,0,0.55);}
.search-box svg{flex-shrink:0;stroke:var(--ink-soft);}
.search-box input{border:none;outline:none;flex:1;font-size:1.05rem;font-family:inherit;color:var(--ink);background:transparent;}
.search-results{position:absolute;left:0;right:0;top:calc(100% + 8px);background:#fff;border-radius:12px;box-shadow:0 22px 50px -16px rgba(0,0,0,0.35);overflow:hidden;text-align:left;display:none;z-index:5;}
.search-results.show{display:block;}
.search-results a{display:flex;align-items:center;gap:12px;padding:13px 20px;border-bottom:1px solid #EEF2F6;color:var(--ink);font-size:0.95rem;transition:background .15s;}
.search-results a:last-child{border-bottom:none;}
.search-results a:hover{background:var(--paper);}
.search-results a .tag{margin-left:auto;font-size:0.72rem;color:var(--amber-dark);font-weight:600;background:rgba(255,122,46,0.1);padding:2px 9px;border-radius:20px;white-space:nowrap;}
.search-results .empty{padding:16px 20px;color:var(--ink-soft);font-size:0.92rem;}

/* ===== SECTIONS ===== */
.section{padding:70px 0;}
.section.alt{background:#fff;}
.section-head{text-align:center;max-width:640px;margin:0 auto 46px;}
.section-head .eyebrow{color:var(--amber-dark);}
.section-head .eyebrow::before{background:var(--amber-dark);}
.section-head h2{font-size:1.9rem;color:var(--navy);margin-bottom:10px;letter-spacing:-0.02em;}
.section-head p{color:var(--ink-soft);}

/* ===== KATEGORIKORT ===== */
.cat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;}
.cat-card{display:block;background:var(--card);border:1px solid #E4EAF0;border-radius:var(--radius);padding:34px 30px;transition:all .22s;}
.cat-card:hover{transform:translateY(-5px);box-shadow:0 20px 40px -18px rgba(10,22,40,0.22);border-color:#D2DCE7;}
.cat-ico{width:56px;height:56px;border-radius:12px;background:rgba(255,122,46,0.1);display:flex;align-items:center;justify-content:center;margin-bottom:20px;}
.cat-ico svg{width:30px;height:30px;stroke:var(--amber);fill:none;stroke-width:1.8;}
.cat-card h3{font-size:1.3rem;color:var(--amber);font-weight:700;margin-bottom:8px;}
.cat-card p{color:var(--ink-soft);font-size:0.96rem;}
.cat-card .more{display:inline-block;margin-top:16px;color:var(--navy);font-weight:600;font-size:0.9rem;}
.cat-card:hover .more{color:var(--amber-dark);}

/* ===== POPULÆRE ARTIKLER ===== */
.pop-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px 28px;max-width:920px;margin:0 auto;}
.pop-item{display:flex;align-items:center;gap:14px;background:var(--card);border:1px solid #E4EAF0;border-radius:8px;padding:16px 18px;transition:all .18s;}
.pop-item:hover{border-color:var(--amber);transform:translateX(3px);}
.pop-item svg{width:18px;height:18px;stroke:var(--amber);fill:none;stroke-width:2;flex-shrink:0;}
.pop-item span{font-size:0.96rem;color:var(--navy);font-weight:500;}
.pop-item .arrow{margin-left:auto;color:var(--ink-soft);}

/* ===== KONTAKT SUPPORT ===== */
.contact-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;max-width:820px;margin:0 auto;}
.contact-box{background:var(--navy);color:#fff;border-radius:var(--radius);padding:36px 32px;text-align:center;transition:transform .2s;}
.contact-box:hover{transform:translateY(-4px);}
.contact-box .c-ico{width:54px;height:54px;border-radius:12px;background:rgba(255,122,46,0.16);display:flex;align-items:center;justify-content:center;margin:0 auto 18px;}
.contact-box .c-ico svg{width:28px;height:28px;stroke:var(--amber);fill:none;stroke-width:1.8;}
.contact-box h3{font-size:1.25rem;margin-bottom:8px;}
.contact-box p{color:#AFC4D8;font-size:0.94rem;margin-bottom:22px;}

/* ===== ARTIKEL-SIDER ===== */
.subhero{background:var(--navy);color:#fff;padding:60px 0 66px;}
.subhero .wrap{display:flex;align-items:center;gap:24px;}
.subhero .s-ico{width:72px;height:72px;border-radius:16px;background:rgba(255,122,46,0.14);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.subhero .s-ico svg{width:38px;height:38px;stroke:var(--amber);fill:none;stroke-width:1.7;}
.subhero h1{font-size:2.3rem;letter-spacing:-0.02em;margin-bottom:6px;}
.subhero p{color:#AFC4D8;font-size:1.05rem;max-width:620px;}
.breadcrumb{background:#fff;border-bottom:1px solid #E4EAF0;}
.breadcrumb .wrap{padding-top:14px;padding-bottom:14px;font-size:0.86rem;color:var(--ink-soft);}
.breadcrumb a{color:var(--amber-dark);font-weight:500;}
.articles{max-width:800px;margin:0 auto;padding:54px 0 30px;}
.article{background:var(--card);border:1px solid #E4EAF0;border-radius:var(--radius);margin-bottom:14px;overflow:hidden;transition:border-color .2s;}
.article[open]{border-color:#D2DCE7;box-shadow:0 10px 26px -16px rgba(10,22,40,0.18);}
.article summary{cursor:pointer;list-style:none;padding:22px 26px;font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:1.08rem;color:var(--navy);display:flex;justify-content:space-between;align-items:center;gap:18px;}
.article summary::-webkit-details-marker{display:none;}
.article summary::after{content:"";width:11px;height:11px;border-right:2px solid var(--amber);border-bottom:2px solid var(--amber);transform:rotate(45deg);transition:transform .2s;flex-shrink:0;margin-top:-4px;}
.article[open] summary::after{transform:rotate(-135deg);margin-top:4px;}
.article summary:hover{color:var(--amber-dark);}
.article-body{padding:0 26px 24px;color:var(--ink-soft);font-size:0.98rem;}
.article-body p{margin-bottom:13px;}
.article-body strong{color:var(--ink);}
.article-body ul,.article-body ol{margin:0 0 13px 22px;}
.article-body li{margin-bottom:7px;}
.article-body h4{color:var(--navy);font-size:1rem;margin:16px 0 8px;}
.callout{background:rgba(255,122,46,0.08);border-left:3px solid var(--amber);padding:14px 18px;border-radius:8px;margin:14px 0;color:var(--ink);font-size:0.95rem;}
.callout.info{background:rgba(28,49,80,0.06);border-left-color:var(--navy-600);}

/* ===== HJALP DETTE IKKE ===== */
.nohelp{max-width:800px;margin:10px auto 70px;background:var(--navy);color:#fff;border-radius:var(--radius);padding:34px;text-align:center;}
.nohelp h3{font-size:1.35rem;margin-bottom:8px;}
.nohelp p{color:#AFC4D8;margin-bottom:22px;}
.nohelp .btn-row{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}

/* ===== FOOTER ===== */
.foot{background:var(--navy);color:#9FBBCD;padding:40px 0;font-size:0.9rem;border-top:1px solid var(--line);}
.foot .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:18px;align-items:center;}
.foot a{color:#C6D6E6;}
.foot a:hover{color:var(--amber);}

/* ===== RESPONSIVE ===== */
@media(max-width:760px){
  .cat-grid,.pop-grid,.contact-grid{grid-template-columns:1fr;}
  .hero h1{font-size:2.1rem;}
  .subhero .wrap{flex-direction:column;text-align:center;}
  .subhero p{margin:0 auto;}
  .nav-right a:not(.btn){display:none;}
}
