/* index.css — Utbrutt fra index.html sin tidligere embedded <style>-blokk, som en
   streng Content-Security-Policy (style-src) ikke tillater. Ligger i
   public_html/default/. */

:root {
  --ink: #1a1410; --parchment: #f5f0e8; --cream: #faf8f3;
  --gold: #b8913a; --gold-light: #d4aa5a; --seal: #8b1a1a;
  --muted: #6b6255; --border: #d6cbb8; --step-inactive: #c8bfb0;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { font-family: 'Cormorant Garamond', Georgia, serif; background: var(--cream); color: var(--ink); min-height: 100vh; }
header { background: var(--ink); color: var(--parchment); padding: 2rem 2rem 1.6rem; display: flex; align-items: baseline; gap: 1.5rem; border-bottom: 3px solid var(--gold); }
.logo-mark { font-size: 2.6rem; font-weight: 300; letter-spacing: -0.03em; line-height: 1; margin: 0; }
.logo-mark span { color: var(--gold); font-style: italic; }
.logo-sub { font-family: 'DM Mono', monospace; font-size: 0.65rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--step-inactive); margin-top: 0.25rem; }
.seal-badge { margin-left: auto; width: 64px; height: 64px; border-radius: 50%; border: 2px solid var(--gold); display: flex; align-items: center; justify-content: center; flex-direction: column; text-align: center; font-family: 'DM Mono', monospace; font-size: 0.48rem; letter-spacing: 0.08em; color: var(--gold); text-transform: uppercase; line-height: 1.4; }
.progress-bar { background: var(--ink); padding: 0.75rem 2rem; display: flex; gap: 0; overflow-x: auto; }
.step-pill { display: flex; align-items: center; gap: 0.5rem; font-family: 'DM Mono', monospace; font-size: 0.6rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--step-inactive); padding-right: 1.5rem; white-space: nowrap; }
.step-pill::after { content: '›'; margin-left: 1rem; color: #444; }
.step-pill:last-child::after { display: none; }
.step-pill.active { color: var(--gold); }
.step-pill.done { color: #6b8c6b; }
.step-pill.done[role="button"] { cursor: pointer; }
.step-pill.done[role="button"]:hover, .step-pill.done[role="button"]:focus-visible { text-decoration: underline; }
.step-num { width: 18px; height: 18px; border-radius: 50%; border: 1px solid currentColor; display: flex; align-items: center; justify-content: center; font-size: 0.55rem; }
main { max-width: 760px; margin: 3rem auto; padding: 0 1.5rem 4rem; }
.section-title { font-size: 0.65rem; font-family: 'DM Mono', monospace; letter-spacing: 0.2em; text-transform: uppercase; color: var(--gold); margin-bottom: 0.5rem; }
.tid-estimat { color: var(--muted); letter-spacing: 0.05em; text-transform: none; font-style: italic; }
h2 { font-size: 2rem; font-weight: 300; line-height: 1.2; margin-bottom: 0.5rem; }
.intro-text { font-size: 1rem; color: var(--muted); font-style: italic; margin-bottom: 2.5rem; line-height: 1.7; border-left: 2px solid var(--border); padding-left: 1rem; }
.card { background: white; border: 1px solid var(--border); border-top: 3px solid var(--gold); padding: 2rem 2.5rem; margin-bottom: 1.5rem; box-shadow: 0 2px 12px rgba(0,0,0,0.04); }
.card.card-good { border-top: 3px solid #4a7a4a; }
.card-title { font-size: 1.3rem; font-weight: 400; margin-bottom: 1.5rem; display: flex; align-items: center; gap: 0.6rem; border-bottom: 1px solid var(--border); padding-bottom: 0.75rem; }
.card-icon { color: var(--gold); font-size: 1.1rem; }
.card-icon.good { color: #4a7a4a; }
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1.2rem; margin-bottom: 1.2rem; }
.field-row.single { grid-template-columns: 1fr; }
.field { display: flex; flex-direction: column; gap: 0.35rem; }
label { font-family: 'DM Mono', monospace; font-size: 0.62rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); }
label .optional-tag { color: var(--step-inactive); text-transform: none; letter-spacing: 0; font-style: italic; font-family: 'Cormorant Garamond', serif; font-size: 0.75rem; }
label .required-tag { color: var(--seal); text-transform: none; letter-spacing: 0; font-style: italic; font-family: 'Cormorant Garamond', serif; font-size: 0.75rem; }
input[type="text"], input[type="tel"], select, textarea {
  font-family: 'Cormorant Garamond', serif; font-size: 1rem; padding: 0.6rem 0.8rem;
  border: 1px solid var(--border); background: var(--cream); color: var(--ink); outline: none;
  transition: border-color 0.2s; width: 100%;
}
input:focus, select:focus, textarea:focus { border-color: var(--gold); background: white; }
input.input-error, select.input-error { border-color: var(--seal); background: #fff5f5; }
.field-hint { font-family: 'DM Mono', monospace; font-size: 0.55rem; color: var(--step-inactive); letter-spacing: 0.05em; }
.field-error { font-family: 'DM Mono', monospace; font-size: 0.62rem; color: var(--seal); letter-spacing: 0.03em; margin-top: 0.15rem; display:block; }
.radio-group { display: flex; gap: 1rem; flex-wrap: wrap; }
.radio-label { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 1rem; padding: 0.5rem 1rem; border: 1px solid var(--border); background: var(--cream); transition: all 0.15s; }
.radio-label:hover { border-color: var(--gold); }
.radio-label input[type="radio"] { accent-color: var(--gold); }
.radio-label.selected { border-color: var(--gold); background: #fdf8ec; }
.info-box { background: #f0ece0; border-left: 3px solid var(--gold); padding: 0.9rem 1.2rem; margin: 1rem 0; font-style: italic; font-size: 0.95rem; color: var(--muted); line-height: 1.6; }
.checkbox-label-rad { display: flex; align-items: center; gap: 0.5rem; margin-top: 0.75rem; text-transform: none; font-size: 0.9rem; letter-spacing: normal; font-family: 'Cormorant Garamond', Georgia, serif; }
.checkbox-auto { width: auto; }
.success-box { background: #f0f7f0; border-left: 3px solid #2a5a2a; padding: 0.9rem 1.2rem; margin: 1rem 0; font-size: 0.95rem; color: #2a5a2a; line-height: 1.6; }
.samtykke-boks { background: var(--cream); border: 1px solid var(--border); padding: 1rem 1.2rem; margin: 1.2rem 0; }
.samtykke-label { display: flex; align-items: flex-start; gap: 0.7rem; cursor: pointer; font-size: 0.9rem; line-height: 1.55; color: var(--muted); }
.samtykke-label input[type="checkbox"] { margin-top: 0.2rem; width: 17px; height: 17px; accent-color: var(--gold); cursor: pointer; flex-shrink: 0; }
.samtykke-label a { color: var(--gold); }
.samtykke-boks.feil { border-color: var(--seal); background: #fff5f5; }
.warning-box { background: #fdf0f0; border-left: 3px solid var(--seal); padding: 0.9rem 1.2rem; margin: 1rem 0; font-size: 0.92rem; color: #6b1a1a; line-height: 1.6; }
.info-box a, .warning-box a { color: var(--gold); font-weight: 600; white-space: nowrap; }
.warning-box strong.label { display: inline-block; background: var(--seal); color: white; font-family: 'DM Mono', monospace; font-size: 0.55rem; letter-spacing: 0.1em; text-transform: uppercase; padding: 0.15rem 0.5rem; margin-right: 0.5rem; }
.blocking-banner { background: var(--seal); color: white; padding: 1rem 1.5rem; margin-bottom: 1.5rem; display: flex; align-items: flex-start; gap: 0.9rem; font-size: 0.95rem; line-height: 1.5; }
.blocking-banner .icon { font-size: 1.4rem; flex-shrink: 0; }
.rådighet-box { border: 2px solid var(--gold); background: #fdf8ec; padding: 1.5rem 2rem; margin-bottom: 1.5rem; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1rem; }
.rådighet-label { font-size: 0.85rem; color: var(--muted); font-style: italic; max-width: 400px; }
.rådighet-amount { font-size: 2.8rem; font-weight: 300; letter-spacing: -0.02em; color: var(--ink); }
.rådighet-fordelt { font-family: 'DM Mono', monospace; font-size: 0.7rem; letter-spacing: 0.05em; margin-top: 0.3rem; }
.rådighet-fordelt.ok { color: #4a7a4a; }
.rådighet-fordelt.over { color: var(--seal); font-weight: bold; }
.btn-primary { background: var(--ink); color: var(--parchment); border: none; padding: 0.9rem 2.5rem; font-family: 'DM Mono', monospace; font-size: 0.7rem; letter-spacing: 0.18em; text-transform: uppercase; cursor: pointer; transition: background 0.2s; display: inline-flex; align-items: center; gap: 0.75rem; }
.btn-primary:hover { background: #2d2720; }
.btn-primary:disabled { background: #a89e8f; cursor: not-allowed; }
.btn-gold { background: var(--gold); color: white; border: none; padding: 1rem 2.5rem; font-family: 'DM Mono', monospace; font-size: 0.7rem; letter-spacing: 0.18em; text-transform: uppercase; cursor: pointer; transition: background 0.2s; display: inline-flex; align-items: center; gap: 0.75rem; }
.btn-gold:hover { background: var(--gold-light); }
.btn-outline { background: transparent; color: var(--muted); border: 1px solid var(--border); padding: 0.75rem 1.5rem; font-family: 'DM Mono', monospace; font-size: 0.65rem; letter-spacing: 0.14em; text-transform: uppercase; cursor: pointer; transition: all 0.2s; }
.btn-outline:hover { border-color: var(--ink); color: var(--ink); }
.btn-remove { background: transparent; border: 1px solid var(--seal); color: var(--seal); padding: 0.35rem 0.8rem; font-family: 'DM Mono', monospace; font-size: 0.55rem; letter-spacing: 0.08em; text-transform: uppercase; cursor: pointer; }
.btn-remove:hover { background: var(--seal); color: white; }
/* Vipps-knapp: utformet identisk med Justify sin (id.justify.no) — offisiell Vipps-oransje
   (#ff5b24), helt rund pille (border-radius 9999px), fet hvit tekst, og selve Vipps-
   ordmerket (ikke bare symbolet) i hvitt til høyre for teksten. Ordmerket er hentet
   direkte fra Vipps sine egne offisielle utviklerressurser (developer.vippsmobilepay.com). */
.btn-vipps { display: inline-flex; align-items: center; justify-content: center; gap: 0.5em; background: #ff5b24; color: #fff !important; font-family: 'DM Mono', monospace; font-weight: 700; text-decoration: none !important; border: none; border-radius: 9999px; cursor: pointer; transition: background 0.15s ease; white-space: nowrap; }
.btn-vipps:hover { background: #e6501f; }
.btn-vipps svg { flex-shrink: 0; display: block; }
.btn-vipps-header { font-size: 0.68rem; letter-spacing: 0.02em; padding: 0.55rem 1rem; }
.btn-vipps-header svg { width: 34px; height: auto; }
.btn-vipps-banner { font-size: 0.85rem; letter-spacing: 0.01em; padding: 0.85rem 1.6rem; }
.btn-vipps-banner svg { width: 46px; height: auto; }
.btn-row { display: flex; gap: 1rem; align-items: center; margin-top: 2rem; flex-wrap: wrap; }
.price-box { border: 1px solid var(--gold); padding: 1.5rem 2rem; display: flex; align-items: center; justify-content: space-between; margin: 1.5rem 0; background: #fdf8ec; }
.price-label { font-size: 0.85rem; color: var(--muted); font-style: italic; }
.price-amount { font-size: 2.5rem; font-weight: 300; letter-spacing: -0.02em; }
.price-mva { font-family: 'DM Mono', monospace; font-size: 0.6rem; color: var(--step-inactive); margin-top: 0.2rem; }
.vipps-section { text-align: center; padding: 2rem; border: 1px dashed var(--border); margin: 1.5rem 0; background: white; }
.vipps-logo { font-size: 2.2rem; font-weight: 600; letter-spacing: -0.02em; color: #ff5b24; margin-bottom: 0.5rem; font-family: Arial, sans-serif; }
.vipps-number { font-family: 'DM Mono', monospace; font-size: 1.8rem; letter-spacing: 0.1em; color: var(--ink); margin: 0.75rem 0; font-weight: 400; }
.vipps-instruction { font-style: italic; color: var(--muted); font-size: 0.95rem; line-height: 1.7; margin: 0.5rem 0 1.5rem; }
.vipps-ref { font-family: 'DM Mono', monospace; font-size: 0.65rem; letter-spacing: 0.14em; color: var(--muted); background: var(--cream); padding: 0.4rem 0.8rem; display: inline-block; border: 1px solid var(--border); }
.confirm-row { display: flex; gap: 0.75rem; margin: 1.5rem 0; align-items: flex-end; flex-wrap: wrap; }
.confirm-row .field { flex: 1; min-width: 200px; }
.download-section { text-align: center; padding: 3rem 2rem; background: white; border: 1px solid var(--border); border-top: 4px solid #4a7a4a; }
.download-icon { font-size: 3.5rem; margin-bottom: 1rem; }
.download-title { font-size: 1.8rem; font-weight: 300; margin-bottom: 0.5rem; color: #2a5a2a; }
.download-sub { font-style: italic; color: var(--muted); margin-bottom: 2rem; }
.btn-download { background: #2a5a2a; color: white; border: none; padding: 1.1rem 3rem; font-family: 'DM Mono', monospace; font-size: 0.72rem; letter-spacing: 0.18em; text-transform: uppercase; cursor: pointer; display: inline-flex; align-items: center; gap: 0.75rem; font-weight: 400; }
.btn-download:hover { background: #3a7a3a; }
.step { display: none; animation: fadeIn 0.3s ease; }
.step.active { display: block; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
.divider { border: none; border-top: 1px solid var(--border); margin: 1.5rem 0; }
.gjenstand-item { border: 1px solid var(--border); padding: 1.25rem 1.5rem; margin-bottom: 1rem; background: var(--cream); }
.gjenstand-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 0.75rem; }
.gjenstand-header span { font-family: 'DM Mono', monospace; font-size: 0.6rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); }
.seo-footer { margin-top: 4rem; padding-top: 2rem; border-top: 1px solid var(--border); }
.seo-footer h2 { font-size: 1.4rem; font-weight: 300; margin-bottom: 1rem; }
.seo-footer h3 { font-size: 1.1rem; font-weight: 400; color: var(--ink); margin: 1.5rem 0 0.5rem; }
.seo-footer p { font-size: 0.95rem; color: var(--muted); line-height: 1.8; margin-bottom: 1rem; }

.hero-section { max-width: 760px; margin: 0 auto; padding: 3rem 1.5rem 0; }
.hero-title { font-size: 2.6rem; font-weight: 300; line-height: 1.15; margin-bottom: 1rem; }
.hero-title em { font-style: italic; color: var(--gold); }
.hero-lede { font-size: 1.15rem; color: var(--muted); font-style: italic; line-height: 1.7; margin-bottom: 2rem; max-width: 620px; }
.hero-start-knapp { margin-bottom: 2rem; text-decoration: none; }
.hero-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; margin-bottom: 2rem; }
.hero-card { background: white; border: 1px solid var(--border); border-top: 3px solid var(--gold); padding: 1.5rem 1.5rem; }
.hero-card-icon { font-size: 1.6rem; margin-bottom: 0.75rem; display: block; }
.hero-card h3 { font-size: 1rem; font-weight: 600; margin-bottom: 0.5rem; color: var(--ink); }
.hero-card p { font-size: 0.88rem; color: var(--muted); line-height: 1.6; margin: 0; }
.hero-jurist-banner {
  background: linear-gradient(135deg, #fdf8ec 0%, #f5ecd8 100%); border: 2px solid var(--gold);
  padding: 1.5rem 2rem; margin-bottom: 2.5rem; display: flex; align-items: center; gap: 1.25rem;
}
.hero-jurist-icon { font-size: 2.2rem; flex-shrink: 0; }
.hero-jurist-text { font-size: 0.98rem; line-height: 1.6; color: var(--ink); }
.hero-jurist-text strong { color: var(--gold); }
.hero-start-row { text-align: center; margin-bottom: 3rem; }
/* Eksempelboks: bilde av et ferdig testament (uleselig tekst) som lenker til /eksempel-testament.php. Brukes på forsiden og i betalingssteget. */
.eksempel-boks {
  display: flex; align-items: center; gap: 1.25rem; text-decoration: none; color: var(--ink);
  background: white; border: 1px solid var(--border); border-top: 3px solid var(--gold);
  padding: 1rem 1.25rem; margin-bottom: 2.5rem;
}
.eksempel-boks:hover { border-color: var(--gold); }
.eksempel-boks-bilde { width: 220px; max-width: 45%; height: auto; flex-shrink: 0; user-select: none; -webkit-user-drag: none; }
.eksempel-boks-tekst { display: flex; flex-direction: column; gap: 0.35rem; line-height: 1.45; }
.eksempel-boks-tekst strong { font-size: 1.15rem; font-weight: 600; }
.eksempel-boks-tekst span { font-size: 0.95rem; color: var(--muted); }
.eksempel-boks-liten { margin-bottom: 1.5rem; padding: 0.75rem 1rem; }
.eksempel-boks-liten .eksempel-boks-bilde { width: 150px; }
@media (max-width: 700px) {
  .eksempel-boks { flex-direction: column; text-align: center; }
  .eksempel-boks-bilde { width: 100%; max-width: 360px; }
  .eksempel-boks-liten { flex-direction: row; text-align: left; }
  .eksempel-boks-liten .eksempel-boks-bilde { width: 38%; max-width: 38%; }
}
@media (max-width: 700px) {
  .hero-grid { grid-template-columns: 1fr; }
  .hero-jurist-banner { flex-direction: column; text-align: center; }
  .hero-title { font-size: 1.9rem; }
  /* .radio-label er normalt kun så bred som egen tekst (flex-item uten flex-grow) —
     på smale skjermer stables valgene, og da blir arealet til høyre for teksten
     visuelt en del av "valget" uten faktisk å være klikkbart. Strekkes derfor til
     full bredde og økes til minst 44px høyde (anbefalt minimum touch-mål for
     Apple/Google) for å fjerne denne "døde sonen" og gjøre valgene lettere å treffe. */
  .radio-group { flex-direction: column; }
  .radio-label { width: 100%; min-height: 44px; }
}
/* ─── FAQ-BOKS (forhåndsdefinerte spørsmål/svar) ─── */
.faq-knapp {
  position: fixed;
  bottom: 6.5rem;
  right: 1.5rem;
  height: 52px;
  padding: 0 1.4rem;
  border-radius: 26px;
  background: var(--gold);
  color: white;
  border: none;
  font-family: 'DM Mono', monospace;
  font-size: 0.75rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  cursor: pointer;
  z-index: 500;
  box-shadow: 0 4px 20px rgba(184,145,58,0.45);
  display: flex;
  align-items: center;
  gap: 0.6rem;
  animation: faq-puls 2.5s ease-in-out infinite;
}
.faq-knapp .faq-knapp-icon {
  width: 26px; height: 26px;
  border-radius: 50%;
  background: white;
  color: var(--gold);
  display: flex; align-items: center; justify-content: center;
  font-size: 1rem; font-weight: 700;
  flex-shrink: 0;
}
.faq-knapp:hover { background: var(--gold-light); }
@keyframes faq-puls {
  0%, 100% { box-shadow: 0 4px 20px rgba(184,145,58,0.45); }
  50% { box-shadow: 0 4px 26px rgba(184,145,58,0.75); }
}
.faq-panel {
  position: fixed;
  bottom: 11.5rem;
  right: 1.5rem;
  width: 420px;
  max-height: 620px;
  background: white;
  border: 1px solid var(--border);
  border-top: 4px solid var(--gold);
  box-shadow: 0 12px 48px rgba(0,0,0,0.28);
  z-index: 500;
  display: none;
  flex-direction: column;
  overflow: hidden;
}
.faq-panel.apen { display: flex; }
.faq-header {
  background: var(--ink);
  color: white;
  padding: 1rem 1.25rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-shrink: 0;
}
.faq-header span { font-family: 'DM Mono', monospace; font-size: 0.8rem; letter-spacing: 0.05em; }
.faq-lukk { background: none; border: none; color: white; font-size: 1.2rem; cursor: pointer; line-height: 1; }
.faq-body { padding: 1rem; overflow-y: auto; flex: 1; }
.faq-sporsmal {
  width: 100%;
  text-align: left;
  background: var(--cream);
  border: 1px solid var(--border);
  padding: 0.7rem 0.9rem;
  margin-bottom: 0.6rem;
  cursor: pointer;
  font-family: 'Cormorant Garamond', serif;
  font-size: 0.92rem;
  color: var(--ink);
}
.faq-sporsmal:hover { border-color: var(--gold); }
.faq-svar {
  background: #fdf8ec;
  border-left: 3px solid var(--gold);
  padding: 0.8rem 1rem;
  margin: -0.3rem 0 0.9rem;
  font-size: 0.88rem;
  color: var(--muted);
  line-height: 1.6;
  display: none;
}
.faq-svar.vist { display: block; }
.faq-svar a { color: var(--gold); font-weight: 600; }
.faq-tilbake {
  background: none;
  border: none;
  color: var(--gold);
  font-family: 'DM Mono', monospace;
  font-size: 0.7rem;
  letter-spacing: 0.05em;
  cursor: pointer;
  padding: 0 0 0.5rem;
  display: none;
}
.faq-tilbake.vist { display: block; }
.faq-footer {
  padding: 0.75rem 1.25rem;
  border-top: 1px solid var(--border);
  font-size: 0.72rem;
  color: var(--step-inactive);
  font-style: italic;
  flex-shrink: 0;
}

/* ─── CHAT-WIDGET ─── */
.chat-knapp {
  position: fixed;
  bottom: 1.5rem;
  right: 1.5rem;
  height: 56px;
  padding: 0 1.5rem;
  border-radius: 28px;
  background: var(--ink);
  color: white;
  border: 2px solid var(--gold);
  font-family: 'DM Mono', monospace;
  font-size: 0.78rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  cursor: pointer;
  z-index: 500;
  box-shadow: 0 4px 20px rgba(0,0,0,0.3);
  display: flex;
  align-items: center;
  gap: 0.6rem;
}
.chat-knapp:hover { background: #2d2720; }
.chat-status-prikk {
  width: 10px; height: 10px;
  border-radius: 50%;
  background: #7a7a7a;
  flex-shrink: 0;
}
.chat-status-prikk.apen { background: #4a9a4a; box-shadow: 0 0 8px #4a9a4a; animation: chat-puls 2s ease-in-out infinite; }
@keyframes chat-puls {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.5; }
}
.chat-panel {
  position: fixed;
  bottom: 6.5rem;
  right: 1.5rem;
  width: 360px;
  max-height: 540px;
  background: white;
  border: 1px solid var(--border);
  border-top: 4px solid var(--ink);
  box-shadow: 0 12px 48px rgba(0,0,0,0.28);
  z-index: 501;
  display: none;
  flex-direction: column;
  overflow: hidden;
}
.chat-panel.apen { display: flex; }
.chat-header {
  background: var(--ink);
  color: white;
  padding: 1rem 1.25rem;
  flex-shrink: 0;
}
.chat-header-top { display: flex; justify-content: space-between; align-items: center; }
.chat-header-top span { font-family: 'DM Mono', monospace; font-size: 0.8rem; letter-spacing: 0.05em; }
.chat-header-sub { font-size: 0.72rem; color: var(--step-inactive); margin-top: 0.3rem; font-style: italic; }
.chat-knapp-avatar {
  width: 32px; height: 32px; border-radius: 50%;
  object-fit: cover; object-position: center 20%;
  border: 2px solid var(--gold); flex-shrink: 0;
}
.chat-header-person { display: flex; align-items: flex-start; gap: 0.75rem; }
.chat-header-person > div { flex: 1; min-width: 0; }
.chat-header-avatar {
  width: 42px; height: 42px; border-radius: 50%;
  object-fit: cover; object-position: center 20%;
  border: 2px solid var(--gold); flex-shrink: 0; margin-top: 0.1rem;
}
.chat-lukk { background: none; border: none; color: white; font-size: 1.2rem; cursor: pointer; line-height: 1; }
.chat-meldinger-omrade { flex: 1; padding: 1rem; overflow-y: auto; min-height: 200px; }
.chat-melding { max-width: 82%; padding: 0.6rem 0.9rem; margin-bottom: 0.6rem; font-size: 0.88rem; line-height: 1.5; border-radius: 2px; }
.chat-melding.besokende { background: #f0ece0; margin-left: auto; }
.chat-melding.admin { background: var(--ink); color: white; margin-right: auto; }
.chat-tom { color: var(--step-inactive); font-size: 0.85rem; font-style: italic; text-align: center; padding: 2rem 1rem; }
.chat-input-rad {
  display: flex;
  gap: 0.5rem;
  padding: 0.85rem;
  border-top: 1px solid var(--border);
  flex-shrink: 0;
}
.chat-input-rad textarea {
  flex: 1;
  resize: none;
  border: 1px solid var(--border);
  padding: 0.55rem 0.7rem;
  font-family: 'Cormorant Garamond', serif;
  font-size: 0.9rem;
}
.chat-input-rad button {
  background: var(--gold);
  color: white;
  border: none;
  padding: 0 1.2rem;
  cursor: pointer;
  font-family: 'DM Mono', monospace;
  font-size: 0.65rem;
  text-transform: uppercase;
}
.chat-skjema-felt {
  padding: 0.85rem;
  border-top: 1px solid var(--border);
  flex-shrink: 0;
}
.chat-skjema-felt input {
  width: 100%;
  box-sizing: border-box;
  padding: 0.55rem 0.7rem;
  border: 1px solid var(--border);
  font-family: 'Cormorant Garamond', serif;
  font-size: 0.9rem;
  margin-bottom: 0.5rem;
}
@media (max-width: 480px) {
  .chat-panel { width: calc(100vw - 2rem); right: 1rem; bottom: 4.5rem; }
  .chat-knapp {
    right: 1rem; bottom: 1rem;
    height: 48px; width: 48px; padding: 0;
    justify-content: center; gap: 0;
  }
  .chat-knapp-avatar { width: 28px; height: 28px; }
  .chat-status-prikk { position: absolute; top: 4px; right: 4px; }
  #chat-knapp-tekst { display: none; }
}

@media (max-width: 480px) {
  .faq-panel { width: calc(100vw - 2rem); right: 1rem; bottom: 8.5rem; }
  .faq-knapp {
    right: 1rem; bottom: 5rem;
    height: 44px; width: 44px; padding: 0;
    justify-content: center; gap: 0;
    animation: none;
  }
  #faq-knapp-tekst { display: none; }
}

@media (max-width: 560px) {
  .field-row { grid-template-columns: 1fr; }
  header { flex-wrap: wrap; }
  .seal-badge { width: 50px; height: 50px; }
  main { margin: 1.5rem auto; }
  .card { padding: 1.5rem 1.25rem; }
  .rådighet-box { flex-direction: column; align-items: flex-start; }
}

/* ─── Ordbok: klikkbare fagord med forklaring ─── */
.ordbok-ord {
  cursor: pointer;
  text-decoration: underline dotted var(--gold);
  text-underline-offset: 3px;
  text-decoration-thickness: 1.5px;
}
.ordbok-ord:hover, .ordbok-ord:focus-visible {
  color: var(--gold);
  outline: none;
}
.ordbok-overlay {
  display: none;
  position: fixed; inset: 0;
  background: rgba(26, 20, 16, 0.55);
  z-index: 200;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
}
.ordbok-overlay.apen { display: flex; }
.ordbok-modal {
  position: relative;
  background: var(--parchment);
  border: 1px solid var(--border);
  border-top: 3px solid var(--gold);
  max-width: 420px;
  width: 100%;
  padding: 2rem 1.75rem 1.75rem;
  box-shadow: 0 12px 40px rgba(0,0,0,0.25);
}
.ordbok-lukk {
  position: absolute;
  top: 0.6rem; right: 0.6rem;
  background: none; border: none;
  font-size: 1.4rem; line-height: 1;
  color: var(--muted);
  cursor: pointer;
  padding: 0.3rem 0.5rem;
}
.ordbok-lukk:hover { color: var(--ink); }
.ordbok-tittel {
  font-family: 'DM Mono', monospace;
  font-size: 0.65rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 0.7rem;
}
.ordbok-tekst {
  font-size: 1.05rem;
  line-height: 1.65;
}

/* Erstatter tidligere JavaScript-styrt element.style.display = 'none'/'block'/'flex' —
   CSP (style-src) tillater ikke direkte stil-manipulasjon fra JavaScript, verken via
   attributtet style="..." eller via .style-egenskapen. setVis() (se skriptet) veksler
   denne klassen i stedet. !important sikrer at den alltid vinner uansett hvilken annen
   klasse elementet også har (f.eks. .price-box sin egen display:flex) — akkurat slik
   inline style (høyest presedens) gjorde tidligere. */
.js-skjult { display: none !important; }

/* Erstatter tidligere inline style="..."-attributter i selve HTML-markeringen —
   CSP (style-src) tillater ikke inline style. Noen gjenbruker mønstre fra felles.css
   (lastet inn i index.html), resten er sidespesifikke. */
.kunde-status-posisjon { margin-left: 1rem; text-align: right; white-space: nowrap; }
.logg-inn-forklaring-stil { display: block; color: var(--parchment); opacity: 0.6; font-size: 0.62rem; letter-spacing: 0.02em; margin-top: 0.35rem; font-family: 'DM Mono', monospace; }
.innlogget-omraade-stil { font-family: 'DM Mono', monospace; font-size: 0.68rem; letter-spacing: 0.03em; }
.navn-visning-stil { color: var(--parchment); opacity: 0.85; }
.lenke-parchment { color: var(--parchment); text-decoration: underline; }
.lenke-parchment-svak { color: var(--parchment); opacity: 0.7; text-decoration: underline; }
.varsel-boks-stil { padding: 1rem 1.5rem; margin: 1.5rem auto 0; max-width: 900px; font-size: 0.95rem; }
.vipps-login-banner-stil { background: #fff8f2; border: 1px solid #ffcbb3; padding: 1.1rem 1.6rem; margin: 1.5rem auto 0; max-width: 900px; display: flex; align-items: center; gap: 1.2rem; flex-wrap: wrap; }
.flex-shrink-0 { flex-shrink: 0; }
.fill-vipps { fill: #ff5b24; }
.fill-white { fill: #fff; }
.vipps-banner-tekst { margin: 0; flex: 1; min-width: 220px; font-size: 0.95rem; color: var(--ink); }
.kladd-varsel-boks-stil { background: #fdf8ec; border: 1px solid var(--gold); border-left: 4px solid var(--gold); padding: 1.3rem 1.6rem; margin: 1.5rem auto 0; max-width: 900px; }
.mr-0-8 { margin-right: 0.8rem; }
.arveveiviser-plug-tekst { font-size: 0.95rem; color: var(--muted); margin-top: -0.5rem; margin-bottom: 2rem; }
.hjelpetekst-italic-mb1 { font-size: 0.9rem; color: var(--muted); font-style: italic; margin-bottom: 1rem; }
.liste-innrykk { margin: 0.5rem 0 0 1.3rem; line-height: 1.8; }
.footer-stil { text-align: center; padding: 2rem 0 1rem; margin-top: 2rem; border-top: 1px solid var(--border); font-family: 'DM Mono', monospace; font-size: 0.72rem; color: var(--step-inactive); letter-spacing: 0.03em; }
.footer-logo-boks-stor { margin-top: 2rem; padding-top: 1.5rem; border-top: 1px solid var(--border); max-width: 480px; margin-left: auto; margin-right: auto; }
.footer-logo-img-stor { height: 44px; width: auto; margin-bottom: 1rem; }
.footer-tagline { font-family: 'Cormorant Garamond', serif; font-size: 0.95rem; line-height: 1.6; color: var(--muted); font-style: italic; letter-spacing: normal; margin-bottom: 1rem; }
.footer-kontakt-info { font-family: 'DM Mono', monospace; font-size: 0.7rem; letter-spacing: 0.03em; color: var(--step-inactive); line-height: 1.9; }
.mt-0-75 { margin-top: 0.75rem; }
.mt-0-75-mb-0 { margin-top: 0.75rem; margin-bottom: 0; }
.mb-0-75 { margin-bottom: 0.75rem; }
.ml-auto { margin-left: auto; }
.checkbox-label-flex { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; }
.w-auto { width: auto; }
.faq-sporsmal-static { cursor: default; font-weight: 600; }

/* ═══════════════════════════════════════════════════════════════════════
   Enklere visning: sammenleggbare avsnitt og mobiltilpasning
   Over 95 % av trafikken fra annonsene kommer fra mobil, og første skjerm hadde
   for mye informasjon uten tydelige overganger. Mobilreglene ligger samlet i
   @media-blokken til slutt; PC/Mac-visningen er uendret.
   ═══════════════════════════════════════════════════════════════════════ */

.kun-mobil { display: none; }
.seo-footer a { color: var(--gold); }


/* Spørsmål/svar nederst — ser ut som tidligere h3 på PC, trekkspill på mobil. */
.seo-sporsmal > summary { font-size: 1.1rem; font-weight: 400; color: var(--ink); margin: 1.5rem 0 0.5rem; cursor: pointer; list-style: none; }
.seo-sporsmal > summary::-webkit-details-marker { display: none; }

@media (max-width: 700px) {
  html { font-size: 112.5%; }
  .kun-mobil { display: block; }

  /* Topp: kompakt, ingen støy */
  header { padding: 1.1rem 1.25rem; gap: 0.75rem; flex-wrap: wrap; }
  .logo-mark { font-size: 2.1rem; }
  .logo-sub, .seal-badge, #logg-inn-lenke, #logg-inn-forklaring { display: none; }

  /* Første skjerm: overskrift, én setning, én stor knapp, pris */
  .hero-section { padding: 2.25rem 1.25rem 0; }
  .hero-title { font-size: 2.4rem; line-height: 1.12; margin-bottom: 1.25rem; }
  .hero-lede { display: none; }
  .hero-lede-kort { font-size: 1.25rem; line-height: 1.55; color: var(--muted); font-style: italic; margin-bottom: 2rem; }
  .hero-start-knapp { display: flex; width: 100%; justify-content: center; padding: 1.35rem 1rem; font-size: 0.8rem; margin-bottom: 1.25rem; text-align: center; }
  .hero-pris-linje { font-size: 1.05rem; line-height: 1.55; color: var(--muted); text-align: center; margin-bottom: 2.5rem; }

  /* Boksene (hva du får, trygt innenfor loven, jurist inkludert) vises alltid — de bygger tillit */
  .hero-mer { margin-bottom: 3rem; }
  .arveveiviser-plug-tekst { font-size: 1.1rem; line-height: 1.6; margin-bottom: 1.5rem; }
  .hero-grid { gap: 1.5rem; margin-bottom: 2rem; }
  .hero-card { padding: 1.5rem; }
  .hero-card h3 { font-size: 1.2rem; }
  .hero-card p { font-size: 1.05rem; }
  .hero-jurist-banner { padding: 1.5rem; }

  /* Vipps-banner og stegindikator er skjult; innlogging ligger som lenke under skjemaet */
  .progress-bar { display: none; }
  .vipps-lenke-mobil { font-size: 1.05rem; color: var(--muted); margin-top: 1.5rem; }

  /* Skjemaet: større tekst og mer luft */
  main { margin: 2.5rem auto; padding: 0 1.25rem 3rem; }
  .section-title { font-size: 0.8rem; margin-bottom: 1rem; }
  h2 { font-size: 2rem; line-height: 1.2; margin-bottom: 1.25rem; }
  .intro-text { font-size: 1.15rem; margin-bottom: 2.25rem; }
  .card { padding: 1.75rem 1.4rem; margin-bottom: 2.25rem; }
  .card-title { font-size: 1.5rem; margin-bottom: 1.75rem; }
  .field-row { margin-bottom: 1.75rem; gap: 1.75rem; }
  label { font-size: 0.8rem; letter-spacing: 0.08em; }
  .field-hint { font-size: 0.75rem; }
  .field-error { font-size: 0.8rem; }
  input[type="text"], input[type="tel"], input[type="email"], select, textarea { font-size: 1.2rem; padding: 0.95rem 1rem; }
  .radio-label { font-size: 1.15rem; padding: 0.95rem 1.1rem; min-height: 54px; }
  .info-box, .warning-box, .success-box { font-size: 1.05rem; line-height: 1.6; padding: 1.2rem 1.3rem; margin: 1.75rem 0; }
  .btn-row { flex-direction: column; align-items: stretch; gap: 1.25rem; margin-top: 2.5rem; }
  .btn-primary, .btn-gold, .btn-outline, .btn-download { width: 100%; justify-content: center; text-align: center; padding: 1.25rem 1rem; font-size: 0.8rem; }
  .price-box { flex-direction: column; align-items: flex-start; gap: 0.75rem; padding: 1.5rem; }

  /* Spørsmål/svar nederst som tydelige, store trekkspill */
  .seo-footer { margin-top: 3.5rem; }
  .seo-footer h2 { font-size: 1.7rem; margin-bottom: 1.25rem; }
  .seo-footer p { font-size: 1.1rem; line-height: 1.7; }
  .seo-sporsmal { border-top: 1px solid var(--border); }
  .seo-sporsmal:last-of-type { border-bottom: 1px solid var(--border); }
  .seo-sporsmal > summary { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin: 0; padding: 1.25rem 0; font-size: 1.3rem; line-height: 1.35; }
  .seo-sporsmal > summary::after { content: '+'; font-size: 1.8rem; color: var(--gold); line-height: 1; flex-shrink: 0; }
  .seo-sporsmal[open] > summary::after { content: '\2212'; }
  .seo-sporsmal > p { margin-bottom: 1.5rem; }

  /* Flytende knapper skal ikke dekke innhold: FAQ-knappen skjules, chat forblir (liten) */
  .faq-knapp { display: none; }
  .chat-knapp { right: 1rem; bottom: 1rem; height: 52px; width: 52px; padding: 0; justify-content: center; gap: 0; }
  .chat-knapp-avatar { width: 32px; height: 32px; }
  #chat-knapp-tekst { display: none; }
}

/* ─── Kontakt oss nederst, ingen blå lenker, luftigere tekstseksjon ─── */
.seo-footer a { color: #8b6f2a; }
.kontakt-lenke {
  display: block; max-width: 420px; margin: 0 auto 2rem; padding: 1.1rem 1rem; text-align: center;
  border: 1px solid var(--ink); color: var(--ink); text-decoration: none;
  font-family: 'DM Mono', monospace; font-size: 0.8rem; letter-spacing: 0.12em; text-transform: uppercase;
}
.kontakt-lenke:hover { background: var(--ink); color: var(--parchment); }

@media (max-width: 700px) {
  .kontakt-lenke { padding: 1.35rem 1rem; font-size: 0.85rem; margin-bottom: 2.5rem; }
  .footer-stil { padding-top: 3rem; font-size: 0.85rem; }
  .footer-lenker { display: flex; flex-direction: column; align-items: center; gap: 1.1rem; }
  .footer-lenker .skille-punkt { display: none; }
  .footer-lenker a { padding: 0.4rem 0; font-size: 0.95rem; }
  .footer-tagline { font-size: 1.05rem; line-height: 1.7; margin-bottom: 1.5rem; }
  .footer-kontakt-info { font-size: 0.85rem; }

  /* Tekstseksjonen: større overskrifter og tydelig luft mellom delene */
  .seo-footer { margin-top: 4.5rem; padding-top: 3rem; }
  .seo-footer h2 { font-size: 2.1rem; line-height: 1.2; margin-bottom: 1.75rem; }
  .seo-footer > p { font-size: 1.15rem; line-height: 1.75; margin-bottom: 2.75rem; }
  .seo-sporsmal > summary { padding: 1.6rem 0; font-size: 1.45rem; line-height: 1.3; }
  .seo-sporsmal > p { font-size: 1.1rem; line-height: 1.75; margin-bottom: 2rem; }
}

/* ─── Bunnfelt (mørkt, lenkene rett under hverandre) og "Nyttige artikler" ─── */
.sidefot { margin-top: 4rem; border-top: 1px solid var(--border); text-align: center; }
.sidefot-om { max-width: 480px; margin: 0 auto; padding: 3rem 1.5rem 2.5rem; }
.sidefot-org { font-family: 'DM Mono', monospace; font-size: 0.7rem; letter-spacing: 0.03em; color: var(--muted); margin: 0; }
.footer-bunn { background: var(--ink); padding: 2.5rem 1.5rem 3rem; display: flex; flex-direction: column; align-items: center; }
.footer-bunn-lenke {
  display: block; width: 100%; max-width: 420px; padding: 1.2rem 1rem; text-align: center;
  color: var(--parchment); text-decoration: none; border-bottom: 1px solid rgba(245, 240, 232, 0.18);
  font-family: 'DM Mono', monospace; font-size: 0.8rem; letter-spacing: 0.1em; text-transform: uppercase;
}
.footer-bunn-lenke:hover { color: var(--gold-light); }
.footer-bunn-kontakt { border: 1px solid var(--gold); color: var(--gold-light); margin-bottom: 1.25rem; }
.footer-bunn-copy { margin: 2rem 0 0; font-family: 'DM Mono', monospace; font-size: 0.68rem; letter-spacing: 0.04em; color: var(--step-inactive); }

.artikler { margin-top: 4rem; padding-top: 2.5rem; border-top: 1px solid var(--border); }
.artikler > summary { font-size: 1.5rem; font-weight: 300; cursor: pointer; list-style: none; }
.artikler > summary::-webkit-details-marker { display: none; }
.artikler ul { margin: 1.5rem 0 0 1.4rem; }
.artikler li { margin-bottom: 0.9rem; line-height: 1.5; }
.artikler a { color: #8b6f2a; text-decoration: underline; }

@media (max-width: 700px) {
  /* Mer luft mellom knapp, tekst og pris */
  .hero-lede-kort { margin-bottom: 2.5rem; }
  .hero-start-knapp { margin-bottom: 1.75rem; }
  .hero-pris-linje { margin-bottom: 3.25rem; }
  .hero-mer { margin-bottom: 3.5rem; }
  .vipps-lenke-mobil { margin-top: 2.25rem; margin-bottom: 1rem; line-height: 1.6; }
  .btn-row { margin-top: 3rem; }
  .seo-sporsmal > summary { padding: 1.75rem 0; }

  /* Bunnfeltet: store trykkflater, lenkene rett under hverandre */
  .sidefot { margin-top: 3.5rem; }
  .footer-bunn { padding: 2.5rem 1.25rem 3.5rem; }
  .footer-bunn-lenke { padding: 1.4rem 1rem; font-size: 0.9rem; min-height: 60px; }
  .footer-bunn-copy { font-size: 0.8rem; }

  /* Nyttige artikler: sammenleggbar, store rader og god luft mellom kulepunktene */
  .artikler { margin-top: 4rem; padding-top: 0; border-top: none; }
  .artikler > summary { display: flex; align-items: center; justify-content: space-between; gap: 1rem; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); padding: 1.75rem 0; font-size: 1.45rem; line-height: 1.3; }
  .artikler > summary::after { content: '+'; font-size: 1.8rem; color: var(--gold); line-height: 1; flex-shrink: 0; }
  .artikler[open] > summary::after { content: '\2212'; }
  .artikler ul { margin: 2rem 0 0 1.3rem; }
  .artikler li { font-size: 1.15rem; line-height: 1.5; margin-bottom: 1.4rem; padding-left: 0.2rem; }
}

/* Vipps-innlogging på mobil: liten knapp med Vipps-logo under Steg 1 (den store boksen er skjult) */
@media (max-width: 700px) {
  .vipps-lenke-mobil { display: flex; flex-direction: column; align-items: flex-start; gap: 1rem; margin-top: 2.5rem; font-size: 1.05rem; color: var(--muted); }
  .btn-vipps-mobil { font-size: 0.95rem; letter-spacing: 0.01em; padding: 0.85rem 1.4rem; }
  .btn-vipps-mobil svg { width: 44px; height: auto; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   Gjenstander/pengebeløp (steg 3): kort tekst som standard, utdyping bak "les mer"
   ═══════════════════════════════════════════════════════════════════════════ */
.gjenstand-kort { font-size: 1.05rem; color: var(--ink); line-height: 1.55; margin-bottom: 0.75rem; }
.les-mer { margin: 0 0 1.25rem; border-left: 2px solid var(--gold); padding-left: 1rem; }
.les-mer > summary { cursor: pointer; list-style: none; font-size: 1.05rem; color: var(--ink); padding: 0.4rem 0; display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.les-mer > summary::-webkit-details-marker { display: none; }
.les-mer > summary::after { content: '+'; font-size: 1.5rem; color: var(--gold); line-height: 1; flex-shrink: 0; }
.les-mer[open] > summary::after { content: '\2212'; }
.les-mer-innhold { padding: 0.5rem 0 0.25rem; }
.les-mer-innhold p { font-size: 1rem; line-height: 1.6; color: var(--muted); margin-bottom: 0.75rem; }
.gjenstand-item .les-mer { margin: 0.5rem 0 0; }

@media (max-width: 700px) {
  .gjenstand-kort { font-size: 1.2rem; line-height: 1.55; margin-bottom: 1.25rem; }
  .les-mer { margin-bottom: 1.75rem; padding-left: 1.1rem; }
  .les-mer > summary { font-size: 1.25rem; padding: 0.9rem 0; min-height: 48px; }
  .les-mer > summary::after { font-size: 1.8rem; }
  .les-mer-innhold p { font-size: 1.15rem; line-height: 1.6; margin-bottom: 1rem; }
  .gjenstand-item { padding: 1.5rem 1.25rem; margin-bottom: 1.5rem; }
  .gjenstand-header { margin-bottom: 1.25rem; }
  .gjenstand-header span { font-size: 0.85rem; }
  .btn-remove { font-size: 0.8rem; padding: 0.7rem 1.1rem; }
  label .optional-tag { font-size: 1rem; }
  #gjenstand-seksjon .btn-outline { margin-top: 0.5rem; }
  .gjenstand-item .radio-label { font-size: 0.75rem; letter-spacing: 0.01em; padding-left: 0.9rem; padding-right: 0.6rem; overflow-wrap: anywhere; }
  .field-row { grid-template-columns: minmax(0, 1fr); }
  .field { min-width: 0; }
  .field input[type="text"] { width: 100%; min-width: 0; }
}
.les-mer-fordeling { margin-top: 1.25rem; }

@media (max-width: 700px) {
  /* Korte hjelpetekster under feltene var 0.75rem — for små på mobil */
  .field-hint { font-size: 0.95rem; line-height: 1.5; }
  .les-mer .warning-box, .les-mer .info-box { margin: 0.75rem 0; }
}
@media (max-width: 700px) {
  .rådighet-label { font-size: 1.05rem; font-style: normal; }
}
@media (max-width: 700px) {
  label .required-tag { font-size: 1rem; }
  .checkbox-label-rad, .checkbox-label-flex { font-size: 1.15rem; line-height: 1.4; gap: 0.75rem; }
  .samtykke-label { font-size: 1.05rem; gap: 0.85rem; }
  .samtykke-label input[type="checkbox"] { width: 24px; height: 24px; margin-top: 0.1rem; }
}
@media (max-width: 700px) {
  .hero-jurist-text { font-size: 1.15rem; }
}

/* Avkrysningsbokser: større og lette å treffe (forskudd på arv, særeie, samtykker) */
input[type="checkbox"].checkbox-auto,
input[type="checkbox"].w-auto,
.samtykke-label input[type="checkbox"] { width: 20px; height: 20px; accent-color: var(--gold); cursor: pointer; flex-shrink: 0; }
@media (max-width: 700px) {
  input[type="checkbox"].checkbox-auto,
  input[type="checkbox"].w-auto,
  .samtykke-label input[type="checkbox"] { width: 24px; height: 24px; margin-top: 0; }
  .samtykke-label input[type="checkbox"] { margin-top: 0.05rem; }
  .checkbox-label-rad, .checkbox-label-flex { gap: 1rem; align-items: center; }
}
/* Samtykketekstene arvet «label»-stilen (store bokstaver, bokstavavstand) og var vanskelige å lese */
.samtykke-label { font-family: 'Cormorant Garamond', Georgia, serif; text-transform: none; letter-spacing: normal; }
@media (max-width: 700px) {
  .samtykke-label { font-size: 1.15rem; line-height: 1.5; }
}
/* Særeie-avkrysningen arvet «label»-stilen (store bokstaver, mono) — samme skrift som forskudd-avkrysningen */
.checkbox-label-flex { font-family: 'Cormorant Garamond', Georgia, serif; text-transform: none; letter-spacing: normal; font-size: 0.9rem; }
@media (max-width: 700px) {
  .checkbox-label-flex { font-size: 1.15rem; line-height: 1.4; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   Vipps-innlogging øverst på alle steg og alle enheter (lagre fremgangen)
   ═══════════════════════════════════════════════════════════════════════════ */
.vipps-login-banner-stil { margin: 0 auto; max-width: none; border-width: 0 0 1px 0; padding: 0.9rem 2rem; justify-content: center; }
.vipps-login-banner-stil .vipps-banner-tekst { flex: 0 1 auto; }
.banner-kort { display: none; }
.innlogget-bar-stil { text-align: center; font-size: 0.95rem; color: #3b6b3b; background: #f1f7ee; border-bottom: 1px solid #cfe3c8; padding: 0.55rem 1.25rem; }
@media (max-width: 700px) {
  .vipps-login-banner-stil { padding: 1rem 1.25rem 1.1rem; flex-direction: column; align-items: stretch; gap: 0.75rem; text-align: left; }
  .vipps-login-banner-stil > svg { display: none; }
  .vipps-login-banner-stil .vipps-banner-tekst { font-size: 1.05rem; line-height: 1.45; min-width: 0; }
  .vipps-login-banner-stil .btn-vipps-banner { font-size: 0.95rem; padding: 0.8rem 1rem; }
  .vipps-login-banner-stil .btn-vipps-banner svg { width: 48px; }
  .banner-lang { display: none; }
  .banner-kort { display: inline; }
  .innlogget-bar-stil { font-size: 1rem; }
}
/* Innloggingsknappen ligger nå i boksen under topplinjen på alle steg og enheter — ikke i topplinjen i tillegg */
#logg-inn-lenke, #logg-inn-forklaring { display: none; }
@media (min-width: 701px) {
  .vipps-login-banner-stil { flex-wrap: nowrap; gap: 1.25rem; }
  .vipps-login-banner-stil .btn-vipps-banner { flex-shrink: 0; white-space: nowrap; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   Første skjerm for en ny besøkende (regel-skeptisk-forstegangsbesokende):
   pris, tillit og start først; Vipps-innlogging som liten lenke på steg 1
   ═══════════════════════════════════════════════════════════════════════════ */
body.steg-1 #vipps-login-banner { display: none; }
.hero-logg-inn { font-size: 0.95rem; color: var(--muted); margin: 1.25rem 0 0; }
.hero-tillit { font-size: 0.9rem; line-height: 1.5; color: var(--muted); text-align: center; margin-bottom: 1.5rem; text-wrap: balance; }
@media (max-width: 700px) {
  .hero-pris-linje { margin-bottom: 0.6rem; }
  .hero-tillit { font-size: 0.88rem; line-height: 1.4; margin-bottom: 1rem; }
  .hero-lede-kort { margin-bottom: 1.5rem; }
  .hero-start-knapp { margin-bottom: 1rem; }
  .hero-logg-inn { font-size: 1.05rem; text-align: center; margin-top: 0.5rem; margin-bottom: 2rem; }
}

/* ═══ Sikre småfeil (arbeidsliste fase 2) ═══ */
/* Hjelpetekst og «(valgfritt)» var lysegrå (kontrast ca. 1,7:1) — mørkere, ca. 4,6:1 mot bakgrunnen */
.field-hint, label .optional-tag { color: #7a6f60; }
/* Skjult for øyet, men fortsatt lest opp av skjermlesere (når spørsmålet allerede står som overskrift) */
.kun-skjermleser { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
/* Artikkeltekst og spørsmål/svar hører til forsiden — skjules når kunden er forbi steg 1 */
body:not(.steg-1) .seo-footer { display: none; }
@media (max-width: 700px) {
  /* Plass nederst så chat-knappen aldri dekker «Neste»-knapper eller tekst */
  main { padding-bottom: 7rem; }
}
/* Betalingssiden: «Betal med Vipps» er den tydeligste knappen, «Tilbake» er rolig */
#btn-bekreft-betaling { background: #ff5b24; color: #fff; font-size: 0.95rem; font-weight: 600; padding: 1.4rem 1.5rem; width: 100%; }
#btn-bekreft-betaling:hover { background: #e6501f; }
#step-5 > .btn-row .btn-outline { opacity: 0.85; font-size: 0.7rem; padding: 0.9rem 1rem; }

/* ═══ Gjensidig testament (samboere/ektepar) ═══ */
.hero-gjensidig-knapp { display: inline-flex; align-items: center; justify-content: center; text-align: center; text-decoration: none; line-height: 1.4; margin-left: 1rem; margin-bottom: 2rem; }
.gjensidig-banner { margin-bottom: 1.5rem; }
.gjensidig-banner a { color: var(--gold); text-decoration: underline; white-space: normal; }
.hero-gjensidig-boks { margin-top: 1.25rem; }
@media (max-width: 700px) {
  .hero-gjensidig-knapp { display: flex; width: 100%; margin-left: 0; margin-top: 0; margin-bottom: 1.1rem; padding: 1rem 0.9rem; font-size: 0.78rem; letter-spacing: 0.06em; }
  .hero-start-knapp { margin-bottom: 0.75rem; }
  .gjensidig-banner { font-size: 1.05rem; }
}

/* Oppsummering av det som mangler, rett over Neste-knappen */
.steg-feil { margin-top: 2rem; padding: 1rem 1.2rem; background: #fff5f5; border: 1px solid var(--seal); border-left-width: 5px; color: var(--ink); font-size: 1rem; line-height: 1.5; }
.steg-feil strong { display: block; color: var(--seal); margin-bottom: 0.4rem; font-size: 1.05rem; }
.steg-feil ul { margin: 0; padding-left: 1.2rem; }
.steg-feil li { margin: 0.3rem 0; }
.steg-feil a { color: var(--ink); text-decoration: underline; text-underline-offset: 2px; }
.steg-feil + .btn-row { margin-top: 1rem; }

/* Delen du selv bestemmer over, i ord + eksempel med egen formue */
.rådighet-box-ord { flex-direction: column; align-items: flex-start; }
.rådighet-ord { font-size: 2rem; line-height: 1.15; }
.rådighet-box-ord .rådighet-label { font-size: 1.05rem; font-style: normal; color: var(--ink); max-width: none; }
.formue-eksempel-resultat ul { margin: 0.4rem 0 0.6rem; padding-left: 1.2rem; }
.formue-eksempel-resultat li { margin: 0.3rem 0; }

/* Valgfri Vipps-innlogging rett under Neste-knappen i steg 1 */
.vipps-steg1 { margin-top: 1.1rem; text-align: center; }
.vipps-steg1-lenke { display: inline-flex; align-items: center; gap: 0.6rem; color: var(--ink); text-decoration: none; font-size: 1.05rem; }
.vipps-steg1-lenke:hover span { text-decoration: underline; }
.vipps-steg1-lenke .vipps-ikon { flex-shrink: 0; display: block; }
.vipps-steg1-lenke .fill-vipps { fill: #ff5b24; }
.vipps-steg1-lenke .fill-white { fill: #fff; }
.vipps-valgfritt { color: var(--muted); }
.vipps-steg1-kort { margin: 0.45rem 0 0; color: var(--muted); font-size: 0.95rem; line-height: 1.4; }
.vipps-steg1-info { max-width: 34rem; margin: 0.4rem auto 0; text-align: left; }
body:not(.steg-1) .vipps-steg1 { display: none; }
/* Mobil, steg 1: mindre luft mellom navnefeltet og «Neste», slik at ønskeboksen kommer nærmere første skjerm */
@media (max-width: 700px) {
  body.steg-1 #step-1 .btn-row { margin-top: 1.1rem; }
  body.steg-1 .vipps-steg1 { margin-top: 0.7rem; }
}

/* Gjensidig testament: spørsmålet om ulik fordeling til barna er uaktuelt (partneren arver friarven) */
body.gjensidig-modus #ulik-fordeling-seksjon { display: none; }

/* Gjensidig testament, runde 2: tydelig melding om at det nå er partnerens tur */
.gjensidig-runde2 { border: 2px solid var(--gold); background: #fdf8ec; padding: 1.1rem 1.3rem; margin: 0 0 1.5rem; color: var(--ink); line-height: 1.5; }
.gjensidig-runde2-tittel { font-size: 1.5rem; margin-bottom: 0.4rem; }
.gjensidig-runde2 p { margin: 0.4rem 0 0; font-size: 1.05rem; }

/* Forsiden: navnefeltet (steg 1) ligger rett under overskriften; forklaringsboksene kommer under det */
.hero-mer-seksjon { max-width: 760px; margin: 0 auto; padding: 0 1.5rem; }
.hero-section { padding-bottom: 0.5rem; }
@media (max-width: 600px) {
  .hero-mer-seksjon { padding: 0 1.25rem; }
  #step-1 .intro-text { display: none; }
}

@media (max-width: 600px) {
  /* Første skjermbilde på mobil: overskrift, kort ingress og navnefeltet — ikke bare tekst */
  .hero-section { padding-top: 1.25rem; }
  .hero-title { font-size: 2rem; margin-bottom: 0.75rem; }
  .hero-lede-kort { font-size: 1.1rem; line-height: 1.5; margin-bottom: 1rem; }
  body.steg-1 .progress-bar { display: none; }
  #step-1 > h2 { display: none; }
  #step-1 .section-title { margin-top: 0.25rem; }
  .hero-mer-seksjon .hero-gjensidig-knapp { margin-top: 1.5rem; }
}


/* «Hvem lager du testament for?» — synlig, men kompakt */
#gjensidig-kort .card-title { margin-bottom: 1rem; padding-bottom: 0.6rem; }
#gjensidig-kort .radio-group { gap: 0.6rem; }
#gjensidig-kort .radio-label { padding-top: 0.85rem; padding-bottom: 0.85rem; }
#gjensidig-kort .field-hint { margin-top: 0.6rem; }
#step-1 .card > .field-row { margin-bottom: 0.4rem; }

/* Prøvepris (kr 100) */
.pilot-banner { background: #fdf8ec; border-top: 3px solid var(--gold); border-bottom: 3px solid var(--gold); color: var(--ink); padding: 0.9rem 1.25rem; text-align: center; font-size: 1.05rem; line-height: 1.45; }
.pilot-banner .pilot-banner-tittel { display: block; font-size: 1.3rem; margin-bottom: 0.2rem; }
.pris-gammel { text-decoration: line-through; color: var(--muted); font-size: 0.6em; margin-right: 0.4em; }
.pilot-skala { display: flex; gap: 0.5rem; margin: 0.4rem 0; }
.pilot-skala label { flex: 1; text-align: center; }
.pilot-skala input { position: absolute; opacity: 0; }
.pilot-skala span { display: block; padding: 0.8rem 0; border: 1px solid var(--border); background: var(--cream); cursor: pointer; font-size: 1.1rem; }
.pilot-skala input:checked + span { background: var(--gold); color: #fff; border-color: var(--gold); }
.pilot-skala input:focus-visible + span { outline: 2px solid var(--ink); }
#step-6.pilot-last-ned-sperret .btn-download, #step-6.pilot-last-ned-sperret .partner-nedlasting { display: none; }

.pilot-banner .pilot-logg-inn { display: inline-block; margin-top: 0.4rem; color: var(--ink); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }

/* Tilbud: stor boks som åpnes når besøkende trykker Neste i steg 1 */
.pilot-overlay { display: none; position: fixed; inset: 0; background: rgba(26, 20, 16, 0.68); z-index: 300; align-items: center; justify-content: center; padding: 1rem; overflow-y: auto; }
.pilot-overlay.apen { display: flex; }
.pilot-modal { position: relative; background: var(--parchment); border: 1px solid var(--border); border-top: 6px solid var(--gold); max-width: 460px; width: 100%; max-height: 100%; overflow-y: auto; padding: 2.1rem 1.2rem 1rem; box-shadow: 0 14px 50px rgba(0,0,0,0.35); text-align: center; }
.pilot-modal-lukk { position: absolute; top: 0.4rem; right: 0.5rem; background: none; border: none; font-size: 1.6rem; line-height: 1; color: var(--muted); cursor: pointer; padding: 0.4rem 0.6rem; }
.pilot-modal-lukk:hover { color: var(--ink); }
.pilot-merke { display: inline-block; background: var(--seal); color: #fff; font-family: 'DM Mono', monospace; font-size: 0.68rem; letter-spacing: 0.12em; text-transform: uppercase; padding: 0.35rem 0.8rem; margin-bottom: 0.9rem; }
.pilot-pris-stor { font-size: 3.6rem; line-height: 1; font-weight: 600; color: var(--ink); margin: 0.2rem 0 0.2rem; }
.pilot-pris-stor .pris-gammel { font-size: 1.3rem; display: block; margin: 0 0 0.2rem; }
.pilot-pris-under { font-size: 1.05rem; color: var(--muted); margin-bottom: 0.8rem; }
.pilot-modal h2 { font-size: 1.45rem; line-height: 1.25; margin-bottom: 0.7rem; font-weight: 600; }
.pilot-tid { background: #fdf8ec; border: 1px solid var(--gold); padding: 0.5rem 0.6rem; margin: 0.2rem 0 1rem; font-size: 1.02rem; line-height: 1.4; }
.pilot-tid strong { font-family: 'DM Mono', monospace; font-size: 1.25rem; }
.pilot-vilkar { text-align: left; margin: 1rem 0 0.4rem; padding-left: 1.3rem; font-size: 1.02rem; line-height: 1.45; }
.pilot-vilkar li { margin-bottom: 0.4rem; }
.pilot-modal .btn-vipps { white-space: normal; display: flex; width: 100%; justify-content: center; padding: 1rem 1rem; font-size: 1.05rem; }
.pilot-fortsett { display: block; width: 100%; margin-top: 0.7rem; background: none; border: none; color: var(--muted); font-family: inherit; font-size: 1rem; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; padding: 0.6rem; }
.pilot-fortsett:hover { color: var(--ink); }
.pilot-modal .btn-primary { width: 100%; justify-content: center; }
.pilot-modal .btn-vipps svg { width: 52px; height: auto; }
.pris-gammel-linje { text-decoration: line-through; }
.pilot-steg5 { background: #fdf8ec; border: 2px solid var(--gold); padding: 1rem 1.1rem 1.1rem; margin-bottom: 1.2rem; text-align: center; }
.pilot-steg5-tittel { display: block; font-size: 1.25rem; margin-bottom: 0.3rem; }
.pilot-steg5 p { margin: 0 0 0.9rem; font-size: 1.05rem; line-height: 1.45; }
.pilot-steg5 .btn-vipps { white-space: normal; text-align: center; padding: 0.9rem 1rem; font-size: 0.95rem; }
.pilot-steg5 .btn-vipps svg { width: 50px; height: auto; }

/* Tillitslinje under ingressen på forsiden: hvem som kvalitetssikrer, og firmaet bak */
.hero-kvalitet { font-size: 1rem; line-height: 1.5; color: var(--ink); margin: -0.6rem 0 1.4rem; max-width: 620px; }
.hero-kvalitet a { color: var(--ink); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--gold); }
@media (max-width: 600px) { .hero-kvalitet { font-size: 0.95rem; margin: -0.4rem 0 1rem; } }

/* Steg 3: enklere fordeling */
.steg3-tid-vipps { font-size: 1rem; color: var(--muted); margin: -1rem 0 1.5rem; line-height: 1.5; }
.steg3-tid-vipps a { color: var(--ink); text-decoration: underline; text-underline-offset: 3px; }
.mottaker-andel-hint { font-size: 1rem; color: var(--muted); font-style: italic; margin: 0 0 1rem; line-height: 1.5; }
.mottaker-flere { margin-top: 0.4rem; margin-bottom: 0; }
.mottaker-flere > summary { color: var(--ink); font-size: 1.05rem; line-height: 1.4; }
.mottaker-flere .flere-undertittel { font-size: 0.95rem; color: var(--muted); }
.mottaker-flere .flere-status { font-size: 0.9rem; color: var(--gold); font-style: italic; }
.gjenstand-details { margin-bottom: 1.5rem; }
.gjenstand-details > summary { font-size: 1.1rem; }

/* Utskrift i posten (steg 5) */
#post-felter { margin-top: 1.1rem; }


/* ─── «Send meg lenken» (index-lenke.js): diskret tekstlenke under Neste i steg 2 og 3, og et lite panel ─── */
.send-lenke-rad { margin-top: 0.9rem; text-align: center; font-size: 0.95rem; }
.send-lenke-rad a { color: var(--muted); text-decoration: underline; text-underline-offset: 3px; }
.send-lenke-rad a:hover { color: var(--ink); }

body.lenke-aapen { overflow: hidden; }
.lenke-bakgrunn {
  position: fixed; inset: 0; z-index: 1200; background: rgba(26, 20, 16, 0.55);
  display: flex; align-items: center; justify-content: center; padding: 1rem; overflow-y: auto;
}
.lenke-bakgrunn.js-skjult { display: none !important; }
.lenke-innhold {
  position: relative; width: 100%; max-width: 420px; background: white; border: 1px solid var(--border); border-top: 3px solid var(--gold);
  padding: 1.5rem 1.25rem 1.25rem;
}
.lenke-innhold h2 { font-size: 1.5rem; font-weight: 400; margin: 0 2rem 1rem 0; }
.lenke-lukk {
  position: absolute; top: 0.4rem; right: 0.5rem; width: 2.5rem; height: 2.5rem; background: none; border: 0; cursor: pointer;
  font-size: 1.8rem; line-height: 1; color: var(--muted);
}
.lenke-faner { display: flex; gap: 0.4rem; margin-bottom: 1rem; }
.lenke-fane {
  flex: 1; padding: 0.6rem 0.4rem; background: var(--parchment); border: 1px solid var(--border); cursor: pointer;
  font-family: inherit; font-size: 0.95rem; color: var(--ink);
}
.lenke-fane.aktiv { background: white; border-color: var(--gold); border-bottom: 3px solid var(--gold); font-weight: 600; }
.lenke-felt { margin-bottom: 0.9rem; }
.lenke-felt label { display: block; font-family: 'DM Mono', monospace; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--muted); margin-bottom: 0.35rem; }
.lenke-felt input {
  width: 100%; padding: 0.8rem 0.9rem; font-family: inherit; font-size: 1.05rem; background: var(--parchment); border: 1px solid var(--border);
}
.lenke-paaminnelse { margin-bottom: 0.9rem; }
.lenke-bakgrunn #lenke-feil { min-height: 0; margin-bottom: 0.6rem; }
.lenke-bakgrunn .btn-primary { width: 100%; }
.lenke-merk { margin-top: 0.9rem; font-size: 0.9rem; color: var(--muted); line-height: 1.5; }
.lenke-ferdig p { margin-bottom: 1rem; line-height: 1.6; }
.lenke-ferdig .btn-outline { width: 100%; }
/* Honeypot: ligger utenfor skjermen i stedet for display:none, så roboter tror feltet er ekte. Mennesker ser det aldri. */
.lenke-honning { position: absolute; left: -9999px; top: auto; width: 1px; height: 1px; overflow: hidden; }

/* ─── Første skjerm på mobil: navnefeltet skal være synlig uten å rulle ───
   Målt i admin (21.10.2026): 185 av 211 reelle besøk stoppet uten å skrive navn, og 171 rørte ingen felt. Før denne endringen lå navnefeltet under
   skjermkanten på en 390 × 664 px mobil. Samme innhold, tettere avstander og litt mindre overskrift. PC/Mac er uendret. */
@media (max-width: 600px) {
  header { padding: 0.65rem 1.25rem; }
  .logo-mark { font-size: 1.9rem; }
  .hero-section { padding-top: 0.9rem; padding-bottom: 0; }
  .hero-title { font-size: 1.7rem; line-height: 1.12; margin-bottom: 0.5rem; }
  .hero-lede-kort { font-size: 1rem; line-height: 1.4; margin-bottom: 0.5rem; }
  .hero-kvalitet { font-size: 0.85rem; line-height: 1.4; margin: 0 0 0.5rem; }
  body.steg-1 main { margin-top: 0.6rem; }
  #step-1 .section-title { margin: 0 0 0.35rem; font-size: 0.68rem; }
  #step-1 .card { padding: 0.9rem 1.1rem 1.1rem; margin-bottom: 1rem; }
  #step-1 .card-title { font-size: 1.2rem; margin-bottom: 0.7rem; padding-bottom: 0.5rem; }
  #step-1 .field-row { margin-bottom: 0; }
}

/* Liten tekstlenke under «Neste» i steg 1: eksempel på et ferdig testament (åpnes i ny fane, så navnet blir stående) */
.eksempel-lenke-rad { margin: 0.9rem 0 0; text-align: center; font-size: 0.95rem; }
.eksempel-lenke-rad a { color: var(--muted); text-decoration: underline; text-underline-offset: 3px; }
.eksempel-lenke-rad a:hover { color: var(--ink); }

/* ═══ Lesbarhet og luft (30.10.2026) ═══
   PC/Mac hadde fortsatt svært liten skrift (hjelpetekster 8,8 px, ledetekster 9,9 px, stegindikator 9,6 px) og lite luft mellom punktene
   under «Neste». Mobil (som bruker html 112,5 %) er allerede større, men fikk litt mer luft mellom blokkene. */
@media (min-width: 701px) {
  .field-hint { font-size: 0.85rem; line-height: 1.5; letter-spacing: 0.02em; margin-top: 0.4rem; display: block; }
  label { font-size: 0.78rem; letter-spacing: 0.1em; }
  label .optional-tag, label .required-tag { font-size: 0.95rem; }
  .field-error { font-size: 0.85rem; }
  .step-pill { font-size: 0.72rem; }
  .section-title { font-size: 0.78rem; }
  .hero-card h3 { font-size: 1.1rem; }
  .hero-card p { font-size: 1rem; }
  .hero-logg-inn, .eksempel-lenke-rad, .vipps-steg1-kort { font-size: 1.05rem; }
  .vipps-steg1 { margin-top: 1.5rem; }
  .eksempel-lenke-rad { margin-top: 1.25rem; }
  .hero-mer-seksjon .hero-gjensidig-knapp { margin: 1.75rem 0 0; }
  .hero-mer-seksjon .hero-logg-inn { margin-top: 1.75rem; }
  .hero-grid { margin-top: 2.5rem; }
}
@media (max-width: 700px) {
  body.steg-1 .vipps-steg1 { margin-top: 1.2rem; }
  body.steg-1 .eksempel-lenke-rad { margin-top: 1.2rem; }
  .hero-mer-seksjon .hero-gjensidig-knapp { margin-bottom: 1.5rem; font-size: 0.85rem; }
  .hero-mer-seksjon .hero-logg-inn { margin-bottom: 1.75rem; }
  label { font-size: 0.85rem; }
}

/* Steg 2 og utover: tilbudet og Vipps-innloggingen er én kort linje; vilkårene ligger bak «Vilkår og frist» */
body.pilot-synlig #vipps-login-banner { display: none; }
.pilot-banner { padding: 0.55rem 1.25rem 0.5rem; }
.pilot-banner .pilot-linje { display: block; font-size: 1.1rem; line-height: 1.4; margin: 0; padding: 0.4rem 0; color: var(--ink); text-decoration: none; }
.pilot-banner a.pilot-linje { text-decoration: underline; text-underline-offset: 3px; }
.pilot-banner .pilot-vilkar-mer { margin: 0.1rem 0 0; font-size: 0.95rem; line-height: 1.5; color: var(--muted); }
.pilot-banner .pilot-vilkar-mer summary { cursor: pointer; display: inline-block; min-height: 32px; padding: 0.3rem 0; text-decoration: underline; text-underline-offset: 3px; }
.pilot-banner .pilot-vilkar-mer p { margin: 0.2rem 0 0.4rem; text-align: left; }

/* Eksempel-testamentet (uskarpt forhåndsvisning): på mobil som liten miniatyr ved siden av teksten, med ramme, så det ikke ser ut som en tom hvit flate */
.eksempel-boks-bilde { border: 1px solid var(--border); background: #f3efe6; }
@media (max-width: 700px) {
  .eksempel-boks { flex-direction: row; text-align: left; align-items: center; gap: 1rem; }
  .eksempel-boks-bilde { width: 40%; max-width: 40%; }
}

/* Gjensidig i steg 1: partnerens navn spørres først i steg 2 (feltet i steg 1 er skjult), så valget blir kort og «Neste» ikke havner to skjermer ned */
.gjensidig-info { margin: 0.8rem 0 0.4rem; font-size: 1.02rem; line-height: 1.5; color: var(--ink); }

/* Mobil, steg 1 med «gjensidig»: valget tar mindre plass, så «Neste» ikke havner to skjermer ned */
@media (max-width: 700px) {
  #gjensidig-kort .radio-label { font-size: 0.9rem; letter-spacing: 0.01em; padding: 0.75rem 0.9rem; min-height: 48px; }
  #gjensidig-partner-felt .les-mer { display: none; }
}

/* Gjensidig testament med mottakere: bare gjenstander og andeler vises, ikke valget om å fordele etter loven */
body.gjensidig-modus #fri-del-fordeling-card,
body.gjensidig-modus #lov-uten-effekt-advarsel,
body.gjensidig-modus #livsarving-ekstra-container,
body.gjensidig-modus #mottaker-seksjon-tittel { display: none !important; }

/* Gjensidig testament i runde 2 (eller når begge er fylt ut): valget «Bare meg / gjensidig» vises ikke, så det ikke kan slås av ved en feil */
body.gjensidig-laast #gjensidig-kort { display: none !important; }