/* Page-specific styles for /verktoy/dora-omfattet.html. Shared foundations live in /v2/. */

    .scope-wrap { padding: var(--s5) 0 var(--s8); }
    .scope-intro { max-width: 64ch; font-size: 1.05rem; line-height: 1.75; color: var(--td-med); margin-bottom: var(--s3); }
    .scope-intro strong { color: var(--td-hi); }
    .scope-note {
      max-width: 70ch; background: color-mix(in srgb, var(--green) 7%, transparent); border: 1px solid color-mix(in srgb, var(--green) 28%, transparent);
      border-left: 3px solid var(--green); border-radius: var(--r2); padding: var(--s2) var(--s3);
      font-size: .88rem; line-height: 1.6; color: var(--td-med); margin-bottom: var(--s5);
    }
    .scope-note strong { color: var(--td-hi); }
    .scope-card { background: var(--dark-2); border: 1px solid var(--bd-dark); border-radius: var(--r3); padding: var(--s5); max-width: 760px; }
    .scope-q { margin-bottom: var(--s4); }
    .scope-q.hidden { display: none; }
    .scope-q-label { font-size: 1.05rem; font-weight: 700; color: var(--td-hi); margin-bottom: var(--s1); letter-spacing: -.01em; }
    .scope-q-help { font-size: .85rem; color: var(--td-lo); margin-bottom: var(--s2); line-height: 1.5; }
    .scope-opts { display: flex; flex-direction: column; gap: .5rem; }
    .scope-opt {
      display: flex; align-items: flex-start; gap: .65rem; padding: .8rem 1rem;
      border: 1.5px solid var(--bd-dark); border-radius: var(--r2); cursor: pointer;
      font-size: .92rem; color: var(--td-med); transition: border-color .15s, background .15s, color .15s;
    }
    .scope-opt:hover { border-color: color-mix(in srgb, var(--cream-0) 25%, transparent); color: var(--td-hi); background: color-mix(in srgb, var(--cream-0) 3%, transparent); }
    .scope-opt input { margin-top: .2rem; accent-color: var(--blue); flex-shrink: 0; }
    .scope-opt.checked { border-color: var(--blue); background: color-mix(in srgb, var(--blue) 8%, transparent); color: var(--td-hi); }
    .scope-actions { display: flex; flex-wrap: wrap; gap: var(--s2); margin-top: var(--s4); align-items: center; }
    .scope-error { color: #E0A94A; font-size: .85rem; }
    .scope-result { display: none; margin-top: var(--s4); border-radius: var(--r3); padding: var(--s4); border: 1px solid var(--bd-dark); }
    .scope-result.show { display: block; }
    .scope-result.tier-full { background: color-mix(in srgb, var(--blue) 8%, transparent); border-color: color-mix(in srgb, var(--blue) 40%, transparent); }
    .scope-result.tier-forenklet { background: color-mix(in srgb, var(--green) 7%, transparent); border-color: color-mix(in srgb, var(--green) 40%, transparent); }
    .scope-result.tier-kritisk { background: rgba(155,138,209,.10); border-color: rgba(155,138,209,.45); }
    .scope-result.tier-indirekte { background: rgba(217,138,61,.08); border-color: rgba(217,138,61,.4); }
    .scope-result.tier-utenfor { background: color-mix(in srgb, var(--cream-0) 4%, transparent); }
    .scope-result-tier { font-family: var(--mono); font-size: .7rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--blue); margin-bottom: var(--s1); }
    .scope-result h2 { font-size: 1.5rem; font-weight: 800; letter-spacing: -.02em; color: var(--td-hi); margin-bottom: var(--s2); }
    .scope-result p { color: var(--td-med); line-height: 1.7; margin-bottom: var(--s2); }
    .scope-result a { color: var(--blue); }
    .scope-result-links { font-size: .88rem; color: var(--td-lo); margin-top: var(--s2); }
    .scope-result-links a { border-bottom: 1px solid transparent; text-decoration: none; }
    .scope-result-links a:hover { border-bottom-color: var(--blue); }
    .scope-result-links .sep { opacity: .3; margin: 0 .35rem; }
    .scope-cta { margin-top: var(--s5); background: var(--dark-2); border: 1px solid var(--bd-dark); border-radius: var(--r3); padding: var(--s4); max-width: 760px; text-align: center; }
    .scope-cta h3 { font-size: 1.2rem; font-weight: 700; margin-bottom: var(--s2); }
    .scope-cta p { color: var(--td-med); line-height: 1.7; margin: 0 auto var(--s3); max-width: 52ch; }
    .scope-cta-actions { display: flex; flex-wrap: wrap; gap: var(--s2); justify-content: center; }
    .scope-disclaimer { font-size: .8rem; color: var(--td-lo); margin-top: var(--s3); max-width: 70ch; line-height: 1.6; }

    @media (prefers-color-scheme: light) {
      .scope-intro { color: var(--tl-med); } .scope-intro strong { color: var(--tl-hi); }
      .scope-note { background: rgba(26,122,69,.07); border-color: rgba(26,122,69,.28); border-left-color: var(--green-on-light); color: var(--tl-med); } .scope-note strong { color: var(--tl-hi); }
      .scope-card, .scope-cta { background: var(--cream-0); border-color: color-mix(in srgb, var(--shadow-color) 8%, transparent); }
      .scope-q-label { color: var(--tl-hi); } .scope-q-help { color: var(--tl-lo); }
      .scope-opt { border-color: color-mix(in srgb, var(--shadow-color) 14%, transparent); color: var(--tl-med); }
      .scope-opt:hover { border-color: color-mix(in srgb, var(--shadow-color) 28%, transparent); color: var(--tl-hi); background: color-mix(in srgb, var(--shadow-color) 3%, transparent); }
      .scope-opt.checked { border-color: var(--blue-on-light); background: color-mix(in srgb, var(--blue-on-light) 8%, transparent); color: var(--tl-hi); }
      .scope-result h2 { color: var(--tl-hi); } .scope-result p { color: var(--tl-med); }
      .scope-result.tier-full { background: color-mix(in srgb, var(--blue-on-light) 8%, transparent); border-color: color-mix(in srgb, var(--blue-on-light) 40%, transparent); }
      .scope-result.tier-forenklet { background: rgba(26,122,69,.07); border-color: rgba(26,122,69,.4); }
      .scope-result-tier { color: var(--blue-on-light); } .scope-result a { color: var(--blue-on-light); }
      .scope-cta p { color: var(--tl-med); } .scope-disclaimer { color: var(--tl-lo); }
    }
