/* Sikkr Verktøy – felles stil */
:root {
  --teal: #0A5A55;
  --teal-2: #0D9E94;
  --teal-bg: rgba(13, 158, 148, 0.10);
  --bg: #DCE4E9;
  --bg-2: #C8D4DC;
  --card: #FFFFFF;
  --ink: #0D1E2A;
  --muted: #52606B;
  --line: #D3DCE2;
  --dark: #0D1E2A;
  --kritisk: #B42318;
  --hoy: #C4320A;
  --middels: #B54708;
  --lav: #475467;
  --info: #667085;
  --ok: #067647;
  --mono: 'JetBrains Mono', Consolas, 'Courier New', monospace;
  --body: 'DM Sans', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif;
  --r: 10px;
}
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; }
body { background: var(--bg); color: var(--ink); font-family: var(--body); font-size: 16px; line-height: 1.6; -webkit-font-smoothing: antialiased; }
a { color: var(--teal); }
h1, h2, h3 { line-height: 1.2; margin: 0 0 .5em; }
h1 { font-size: clamp(1.8rem, 4.5vw, 2.8rem); font-weight: 700; letter-spacing: -0.01em; }
h2 { font-size: 1.35rem; }
h3 { font-size: 1.05rem; }
p { margin: 0 0 1em; }
.mono { font-family: var(--mono); }
.muted { color: var(--muted); }
.wrap { max-width: 1040px; margin: 0 auto; padding: 0 20px; }

/* Nav */
.nav { position: sticky; top: 0; z-index: 50; background: rgba(200, 212, 220, .94); backdrop-filter: blur(12px); border-bottom: 1px solid rgba(10, 90, 85, .18); }
.nav .wrap { display: flex; align-items: center; justify-content: space-between; height: 62px; gap: 16px; }
.logo { font-family: var(--mono); font-weight: 700; letter-spacing: .08em; font-size: 1.1rem; color: var(--ink); text-decoration: none; }
.logo .cur { color: var(--teal); animation: blink 1s step-end infinite; }
@keyframes blink { 50% { opacity: 0; } }
.nav-links { display: flex; gap: 22px; align-items: center; }
.nav-links a { font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); text-decoration: none; }
.nav-links a:hover, .nav-links a.aktiv { color: var(--teal); }
@media (max-width: 640px) { .nav-links a.skjul-mobil { display: none; } .nav-links { gap: 14px; } }

/* Knapper og skjema */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; font: 600 .95rem var(--body); padding: 12px 20px; border-radius: 6px; border: 1px solid var(--teal); background: var(--teal); color: #fff; cursor: pointer; text-decoration: none; transition: background .15s, transform .05s; }
.btn:hover { background: #084a46; }
.btn:active { transform: translateY(1px); }
.btn:disabled { opacity: .55; cursor: not-allowed; }
.btn.sek { background: transparent; color: var(--teal); }
.btn.sek:hover { background: var(--teal-bg); }
.btn.liten { padding: 7px 12px; font-size: .85rem; }
.btn svg { width: 18px; height: 18px; flex: none; }
input[type=text], input[type=email], input[type=tel], input[type=number], input[type=date], select, textarea {
  width: 100%; font: 400 1rem var(--body); color: var(--ink); background: #fff; border: 1px solid #B9C6CF; border-radius: 6px; padding: 11px 12px; }
textarea { min-height: 84px; resize: vertical; }
input:focus, select:focus, textarea:focus, .btn:focus-visible, .chk:focus-within { outline: 2px solid var(--teal-2); outline-offset: 1px; }
label.felt { display: block; font-size: .85rem; font-weight: 600; margin-bottom: 14px; }
label.felt > span { display: block; margin-bottom: 5px; }
.chk { display: flex; gap: 10px; align-items: flex-start; font-size: .92rem; cursor: pointer; padding: 6px 0; }
.chk input { margin-top: 4px; width: 17px; height: 17px; accent-color: var(--teal); flex: none; }
.rad { display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px; }
@media (max-width: 640px) { .rad { grid-template-columns: 1fr; } }

.kort { background: var(--card); border-radius: var(--r); padding: 24px; box-shadow: 0 1px 2px rgba(13, 30, 42, .06), 0 6px 24px rgba(13, 30, 42, .05); }
.merke { display: inline-block; font: 700 .68rem var(--body); text-transform: uppercase; letter-spacing: .06em; padding: 3px 9px; border-radius: 20px; white-space: nowrap; }
.m-kritisk { background: #FEE4E2; color: var(--kritisk); }
.m-hoy { background: #FFE6D5; color: var(--hoy); }
.m-middels { background: #FEF0C7; color: var(--middels); }
.m-lav { background: #EAECF0; color: var(--lav); }
.m-info { background: #F2F4F7; color: var(--info); }
.m-ok { background: #DCFAE6; color: var(--ok); }
.eyebrow { font-family: var(--mono); font-size: .78rem; letter-spacing: .14em; text-transform: uppercase; color: var(--teal); margin-bottom: 10px; }
.feil { color: var(--kritisk); font-size: .92rem; }
.fot { padding: 40px 0 50px; color: var(--muted); font-size: .82rem; }
.fot a { color: var(--muted); }
.skjult { display: none !important; }
