/* Arvklar — designsystem
   Retning: norsk skjema, ikke SaaS. Papir, blekk, gul lapp.
   UI: Source Sans 3 (som NAV/Skatteetaten). Dokumentet: Tinos (Times-metrikk). */

@font-face{font-family:"Source Sans 3";font-style:normal;font-weight:400 700;font-display:swap;src:url(fonts/sourcesans3-400.woff2) format("woff2")}
@font-face{font-family:"Tinos";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/tinos-400.woff2) format("woff2")}
@font-face{font-family:"Tinos";font-style:normal;font-weight:700;font-display:swap;src:url(fonts/tinos-700.woff2) format("woff2")}

:root{
  --paper:#F5F6F4;
  --sheet:#FFFFFF;
  --ink:#1B2A3A;
  --ink-2:#3A4959;
  --muted:#65717D;
  --rule:#CAD3DA;
  --field:#9DB7CC;
  --note:#F6DE73;
  --note-ink:#3F3600;
  --focus:#2F6F8F;
  --ok:#3E6B3A;
  --err:#9B3B2B;
  --font-ui:"Source Sans 3","Source Sans Pro",system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-doc:"Tinos","Times New Roman",Times,serif;
  --measure:62ch;
  --r:2px;
}

*{box-sizing:border-box}
html{font-size:19px;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font-ui);line-height:1.55;font-weight:400}
img,svg{max-width:100%;display:block}
a{color:var(--ink);text-decoration-thickness:1.5px;text-underline-offset:3px}
a:hover{color:var(--focus)}
:focus-visible{outline:3px solid var(--note);outline-offset:2px}
::selection{background:var(--note);color:var(--ink)}

h1,h2,h3{font-weight:600;letter-spacing:-.012em;line-height:1.15;margin:0 0 .5em}
h1{font-size:clamp(1.9rem,3.6vw,2.75rem);max-width:20ch}
h2{font-size:clamp(1.45rem,2.4vw,1.9rem);max-width:28ch}
h3{font-size:1.15rem;margin-bottom:.35em}
p{margin:0 0 1em;max-width:var(--measure)}
ul,ol{max-width:var(--measure);padding-left:1.3em}
li{margin:.3em 0}
small,.small{font-size:.86rem}
.muted{color:var(--muted)}
.lead{font-size:1.18rem;max-width:56ch}

.wrap{max-width:1180px;margin:0 auto;padding:0 24px}
.narrow{max-width:760px}

/* Topplinje */
.top{border-bottom:1px solid var(--rule);background:var(--paper)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:64px}
.brand{font-weight:700;font-size:1.25rem;text-decoration:none;letter-spacing:-.01em;display:inline-flex;align-items:baseline;gap:.4em}
.brand i{display:inline-block;width:.55em;height:.55em;background:var(--note);border:1.5px solid var(--ink);transform:translateY(-1px)}
.nav{display:flex;gap:22px;flex-wrap:wrap}
.nav a{text-decoration:none;font-weight:600;font-size:.98rem}
.nav a[aria-current="page"]{box-shadow:inset 0 -3px 0 var(--note)}
@media (max-width:640px){.top .wrap{flex-wrap:wrap;padding-top:12px;padding-bottom:10px;min-height:0}.brand{width:100%}.nav{gap:14px}.nav a{font-size:.92rem}}

/* Skjemahode */
.formhead{font-size:.86rem;color:var(--ink-2);display:flex;flex-wrap:wrap;gap:.35em 1.2em;padding:18px 0 0}
.formhead b{font-weight:600;color:var(--ink)}

/* Hero */
.hero{padding:28px 0 56px}
.hero .grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:56px;align-items:start}
@media (max-width:900px){.hero .grid{grid-template-columns:1fr;gap:40px}}

/* Første spørsmål i hero */
.firstq{margin-top:28px;padding:22px 24px;background:var(--sheet);border:1px solid var(--rule)}
.firstq label{display:block;font-weight:600;margin-bottom:.5em;font-size:1.05rem}
.row{display:flex;gap:12px;flex-wrap:wrap;align-items:stretch}
.row .in{flex:1 1 240px}

/* Felter */
.in,select.in,textarea.in{font:inherit;font-size:1rem;color:var(--ink);background:#fff;border:2px solid var(--ink-2);border-radius:var(--r);padding:11px 13px;width:100%;min-height:52px}
textarea.in{min-height:120px;resize:vertical}
select.in{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%);background-position:calc(100% - 20px) 22px,calc(100% - 14px) 22px;background-size:6px 6px;background-repeat:no-repeat;padding-right:40px}
.in::placeholder{color:#8A96A1}

.btn{font:inherit;font-weight:600;font-size:1.02rem;color:var(--paper);background:var(--ink);border:2px solid var(--ink);border-radius:var(--r);padding:12px 22px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:.5em;min-height:52px;white-space:nowrap}
.btn:hover{background:#0F1C2A;border-color:#0F1C2A;color:#fff}
.btn-2{background:transparent;color:var(--ink)}
.btn-2:hover{background:#fff;color:var(--ink);border-color:var(--ink)}
.btn[disabled]{opacity:.55;cursor:not-allowed}

.hint{font-size:.9rem;color:var(--muted);margin:.7em 0 0}

/* Gul lapp: lovhenvisninger og små merknader */
.note{background:var(--note);color:var(--note-ink);padding:12px 16px;font-size:.95rem;max-width:var(--measure);margin:1em 0}
.note b{font-weight:700}
.note.tight{display:inline-block;padding:4px 10px;margin:0;font-size:.86rem}

/* Dokumentarket */
.dok{background:var(--sheet);color:#111;font-family:var(--font-doc);font-size:.92rem;line-height:1.5;padding:40px 42px 36px;border:1px solid var(--rule);box-shadow:0 1px 0 #d8dee3,0 18px 30px -26px rgba(27,42,58,.45);position:relative}
.dok:before{content:"";position:absolute;inset:auto 0 -6px 6px;height:6px;background:#e7ebee;border:1px solid var(--rule);border-top:0;z-index:-1}
.dok h4{font-family:var(--font-doc);font-weight:700;letter-spacing:.14em;text-transform:uppercase;text-align:center;font-size:1.05rem;margin:0 0 1.2em}
.dok p{margin:0 0 .85em;max-width:none}
.dok .sec{font-weight:700;margin:1.1em 0 .3em}
.dok ul{margin:.2em 0 .8em;padding-left:1.2em}
.dok li{margin:.15em 0}
.dok .f{display:inline-block;min-width:9ch;border-bottom:1.5px dotted #7F8B96;padding:0 .2em;line-height:1.2;color:#111}
.dok .f.on{border-bottom-color:transparent;background:#FBF3C7;font-weight:700}
.dok .sign{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:1.6em}
.dok .line{border-bottom:1px solid #111;height:34px;margin-bottom:4px}
.dok .cap{font-size:.78rem;color:#444}
.dok .vitne{margin-top:1.4em;padding-top:1em;border-top:1px solid #bbb}
.dok .stamp{position:absolute;right:26px;top:22px;font-family:var(--font-ui);font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2);border:1.5px solid var(--ink-2);padding:3px 8px;border-radius:2px;background:#fff}
@media (max-width:900px){.dok{padding:28px 22px}}

/* Seksjoner */
section{padding:52px 0}
section+section{border-top:1px solid var(--rule)}
.cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:start}
@media (max-width:900px){.cols{grid-template-columns:1fr;gap:28px}}

/* Innholdsliste med paragrafnummer — tallene er dokumentets egne */
.innhold{list-style:none;padding:0;margin:0;max-width:var(--measure)}
.innhold li{display:grid;grid-template-columns:3.2em 1fr;gap:10px;padding:14px 0;border-top:1px solid var(--rule);margin:0}
.innhold li:last-child{border-bottom:1px solid var(--rule)}
.innhold .num{font-family:var(--font-doc);font-size:1.05rem;color:var(--ink-2)}
.innhold b{display:block;font-weight:600}

/* Krav-liste (gyldighet) */
.krav{list-style:none;padding:0;margin:0;max-width:var(--measure)}
.krav li{padding:10px 0 10px 34px;position:relative;margin:0}
.krav li:before{content:"";position:absolute;left:0;top:16px;width:18px;height:18px;border:2px solid var(--ink);border-radius:2px;background:#fff}
.krav li:after{content:"";position:absolute;left:6px;top:18px;width:6px;height:10px;border:solid var(--ink);border-width:0 2.5px 2.5px 0;transform:rotate(45deg)}

/* Pris */
.pris{display:grid;grid-template-columns:auto 1fr;gap:36px;align-items:start;max-width:820px}
@media (max-width:700px){.pris{grid-template-columns:1fr}}
.pris .tall{font-size:clamp(2.6rem,6vw,4rem);font-weight:700;letter-spacing:-.03em;line-height:1;white-space:nowrap}
.pris .tall small{font-size:.35em;font-weight:600;letter-spacing:0;display:block;margin-top:.4em;color:var(--muted)}
.pris ul{margin:0 0 1em}

/* FAQ */
details{border-top:1px solid var(--rule);max-width:var(--measure)}
details:last-of-type{border-bottom:1px solid var(--rule)}
summary{cursor:pointer;font-weight:600;padding:16px 0;font-size:1.05rem;list-style:none;display:flex;justify-content:space-between;gap:16px}
summary::-webkit-details-marker{display:none}
summary:after{content:"+";font-weight:400;color:var(--muted)}
details[open] summary:after{content:"–"}
details p{padding-bottom:12px}

/* Bunn */
footer{border-top:1px solid var(--rule);padding:34px 0 48px;font-size:.92rem;color:var(--ink-2)}
footer .wrap{display:grid;grid-template-columns:1fr 1fr;gap:24px}
@media (max-width:700px){footer .wrap{grid-template-columns:1fr}}
footer a{margin-right:18px}

/* Skjema (start) */
.flow{padding:24px 0 64px}
.flow .grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:56px;align-items:start}
@media (max-width:900px){.flow .grid{grid-template-columns:1fr}.flow .side{order:2}}
.flow .side{position:sticky;top:24px}
.steg{font-size:.9rem;color:var(--muted);margin-bottom:6px}
.q{margin:0 0 22px}
.q h2{font-size:1.5rem;max-width:30ch}
.q .forklar{max-width:56ch}
.field{margin:18px 0}
.field>label,.field>.lbl{display:block;font-weight:600;margin-bottom:.45em}
.opt{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border:2px solid var(--rule);border-radius:var(--r);background:#fff;margin:8px 0;cursor:pointer}
.opt:hover{border-color:var(--ink-2)}
.opt input{width:22px;height:22px;margin:3px 0 0;flex:none;accent-color:var(--ink)}
.opt span{flex:1}
.opt small{display:block;color:var(--muted)}
.opt:has(input:checked){border-color:var(--ink);background:#FBF3C7}
.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.err{color:var(--err);font-weight:600;margin:.4em 0 0}

/* Oppsummering */
.sum{list-style:none;padding:0;margin:0 0 1em;max-width:var(--measure)}
.sum li{display:grid;grid-template-columns:minmax(120px,.42fr) 1fr;gap:12px;padding:9px 0;border-top:1px solid var(--rule);margin:0}
.sum li:last-child{border-bottom:1px solid var(--rule)}
.sum .k{color:var(--muted)}

/* Bestilling / venteliste */
.done{background:var(--sheet);border:1px solid var(--rule);padding:26px 28px;max-width:640px}

.skip{position:absolute;left:-9999px}
.skip:focus{left:16px;top:12px;background:#fff;padding:8px 12px;z-index:10}

@media (prefers-reduced-motion:no-preference){
  .dok .f.on{transition:background .25s ease}
}
@media print{.top,.firstq,.actions,footer,.side .hint{display:none}.dok{box-shadow:none;border:0}}
