/* Shared by takk.html, personvern.html, 404.html. Uses tokens from tokens.css. */
.narrow{max-width:720px;margin:0 auto;padding:48px 24px 56px;display:flex;flex-direction:column;gap:32px}
h1{margin:0;color:var(--ink)}
h2{margin:0}

/* takk */
.takk__top{display:flex;flex-direction:column;gap:12px}
.takk__title{display:flex;align-items:center;gap:12px}
.takk__title svg{flex:none}
.takk h1{font-size:28px;line-height:1.2;font-weight:600;letter-spacing:-0.01em}
.takk__top p{margin:0;color:var(--text)}
.followup{display:flex;flex-direction:column;gap:32px}
.followup[hidden]{display:none}
.followup__q{display:flex;flex-direction:column;gap:10px}
.followup__q label,.followup__q .q{font-size:19px;font-weight:600;line-height:1.4}
.followup textarea{width:100%;padding:12px 16px;border:1px solid var(--field-line);border-radius:8px;background:#fff;color:var(--ink);font:inherit;line-height:1.5;resize:vertical}
.warn{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:600;color:var(--ink)}
.warn svg{flex:none}
.choices{display:flex;flex-wrap:wrap;gap:12px}
.btn{min-height:48px;min-width:64px;padding:0 22px;border-radius:8px;font:inherit;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px}
.btn--yes{border:1px solid var(--accent);background:var(--accent);color:#fff;font-weight:600}
.btn--yes:hover{background:var(--accent-hover)}
.btn--no{border:1px solid var(--field-line);background:#fff;color:var(--ink);font-weight:500}
.btn--no:hover{background:var(--bg)}
.btn[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:#fff;font-weight:600}
.btn[aria-pressed="true"]::before{content:"\2713"}
.status{margin:0;min-height:1.55em;font-size:15px;color:var(--muted)}

/* personvern */
.back{display:inline-flex;align-items:center;min-height:44px;font-size:15px;font-weight:500}
.intro{display:flex;flex-direction:column;gap:12px}
.personvern h1{font-size:34px;line-height:1.15;font-weight:600;letter-spacing:-0.015em}
.intro p{margin:0;font-size:19px;color:var(--text)}
.callout{padding:14px 18px;background:var(--accent-soft);border-radius:12px;display:flex;align-items:center;gap:12px;font-weight:600}
.callout svg{flex:none}
.rows{display:flex;flex-direction:column;border-bottom:1px solid var(--line)}
.row{padding:18px 0;border-top:1px solid var(--line);display:flex;gap:24px}
.row h2{flex:none;width:190px;font-size:17px;font-weight:600}
.row p{flex:1 1 0;min-width:0;margin:0;color:var(--text)}
.todo{color:var(--brown)}
.fine{margin:0;font-size:15px;color:var(--muted)}
@media (max-width:600px){
  .row{flex-direction:column;gap:4px}
  .row h2{width:auto}
  .personvern h1{font-size:30px}
}

/* 404 */
.notfound{gap:16px}
.notfound h1{font-size:34px;line-height:1.15;font-weight:600;letter-spacing:-0.015em}
.notfound p{margin:0}
.notfound a{display:inline-flex;align-items:center;min-height:44px}
@media (max-width:480px){
  .narrow{padding:32px 16px 40px}
  .takk h1{font-size:24px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}