/* Jämförelsesidor (t.ex. /seo-byra/seo-byraer-gavle/): transparensruta, byråkort med för-/nackdelar.
   Bygger enbart på tokens från styles.css. */
.nb-transparens{background:var(--sun-tint);border-radius:var(--radius-md);padding:18px 22px;margin:24px 0 0;max-width:680px}
.nb-transparens h2{margin:0 0 6px;font:700 17px/1.3 var(--font-display);color:var(--text-heading)}
.nb-transparens p{margin:6px 0 0;font:400 15px/1.6 var(--font-sans);color:var(--text-body)}
.nb-transparens a{color:var(--text-heading)}
.nb-granskning{font:500 14px/1.5 var(--font-sans);color:var(--text-muted);margin:14px 0 0}
.nb-criteria{margin:18px 0 0;padding-left:22px;display:grid;gap:10px;max-width:640px}
.nb-criteria li{font:400 16px/1.6 var(--font-sans);color:var(--text-body)}
.nb-agencies{display:grid;gap:22px;margin-top:28px}
.nb-agency{background:var(--surface-card);border:1px solid var(--line-strong);border-radius:var(--radius-md);padding:26px clamp(18px,3vw,32px)}
.nb-agency h2{margin:0;font:700 24px/1.25 var(--font-display);color:var(--text-heading)}
.nb-agency h3{margin:20px 0 4px;font:700 17px/1.3 var(--font-display);color:var(--text-heading)}
.nb-agency .nb-bestfor{margin:10px 0 0;font:400 16px/1.6 var(--font-sans);color:var(--text-body);max-width:680px}
.nb-agency .nb-bestfor strong{background:var(--sun-tint);padding:1px 6px;border-radius:4px}
.nb-agency .sec-body{max-width:680px}
.nb-proscons{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:8px 28px}
.nb-proscons ul{margin:6px 0 0;padding-left:20px;display:grid;gap:6px}
.nb-proscons li{font:400 15px/1.55 var(--font-sans);color:var(--text-body)}
.nb-written{font:500 14px/1.5 var(--font-sans);color:var(--text-muted);margin:18px 0 0}
@media (max-width:640px){.nb-agency h2{font-size:21px}}