/* Landing-mode adaptation for shared sub-pages.
   body[data-mode] is set from localStorage.pb-landing (a = Klar, b = Statement, c = Editorial).
   Sub-pages are authored in mode a; b and c are layered on top.
   Note: the runtime serializes inline styles React-style ("color: var(--primary)", "background: rgb(255, 255, 255)"),
   so attribute selectors below use that spacing. */

/* ---------- b: Statement (dark petrol, pills, big type) ---------- */
body[data-mode="b"]{
  background:var(--primary-deep)!important;color:#fff;
  --ink:#fff;--text-1:#D7E3E0;--text-2:#BFD3CF;--text-3:#8FA5A1;
  --surface:#0F3536;--surface-2:#123C3D;--border:rgba(255,255,255,.12);--border-2:rgba(255,255,255,.3);
  --img-bg:#123C3D;--accent-soft:rgba(143,211,199,.16);
}
body[data-mode="b"] a{color:#fff}
body[data-mode="b"] nav a{color:var(--on-dark-2)}
body[data-mode="b"] [style*="background: rgb(255, 255, 255)"]{background:#0F3536!important}
body[data-mode="b"] [style*="background: rgb(238, 235, 227)"]{background:rgba(255,255,255,.15)!important}
body[data-mode="b"] [style*="color: var(--primary)"]{color:#fff!important}
body[data-mode="b"] [style*="color: rgb(26, 26, 26)"]{color:#fff!important}
body[data-mode="b"] [style*="color: rgb(176, 175, 168)"]{color:#8FA5A1!important;border-color:rgba(255,255,255,.25)!important}
body[data-mode="b"] input,body[data-mode="b"] select,body[data-mode="b"] textarea{background:#0F3536!important;color:#fff!important;border-color:rgba(255,255,255,.2)!important}
body[data-mode="b"] input::placeholder,body[data-mode="b"] textarea::placeholder{color:#8FA5A1}
body[data-mode="b"] nav>a svg rect[rx="8"]{fill:#F3EEE4!important}
body[data-mode="b"] nav>a svg path{stroke:#072526!important}
body[data-mode="b"] a[style*="background: var(--primary)"],body[data-mode="b"] button[style*="background: var(--primary)"]{background:#fff!important;color:var(--primary-deep)!important;border-radius:999px!important}
body[data-mode="b"] nav a[style*="background: var(--primary)"],body[data-mode="b"] nav a[style*="background: var(--accent)"]{background:var(--cta)!important;color:#fff!important;border-radius:999px!important}
body[data-mode="b"] a[style*="background: var(--cta)"],body[data-mode="b"] button[style*="background: var(--cta)"]{border-radius:999px!important}
body[data-mode="b"] a[style*="border: 1.5px solid var(--border-2)"]{border-radius:999px!important;color:#fff!important}
body[data-mode="b"] h1{letter-spacing:-.04em!important}
body[data-mode="b"] [style*="box-shadow: rgba(14, 59, 60"]{box-shadow:0 12px 40px rgba(0,0,0,.35)!important}
body[data-mode="b"] section[style*="background: var(--primary); color: rgb(255, 255, 255)"],body[data-mode="b"] section[style*="background: var(--primary); border-radius"],body[data-mode="b"] div[style*="background: var(--primary); color: rgb(255, 255, 255); border-radius: 16px"]{background:#0A2F30!important;border:1px solid rgba(255,255,255,.1)}
body[data-mode="b"] [style*="background: var(--text-3)"]{background:#3C5C5A!important}

/* ---------- c: Editorial (sand, serif headlines, pills, 6px radius) ---------- */
body[data-mode="c"]{background:var(--surface)!important}
body[data-mode="c"] h1,body[data-mode="c"] h2,body[data-mode="c"] h3{font-family:'Instrument Serif',Georgia,serif!important;font-weight:400!important;letter-spacing:-.015em!important}
body[data-mode="c"] h1{font-size:72px!important;line-height:1.02!important}
body[data-mode="c"] h2{font-size:44px!important;line-height:1.1!important}
body[data-mode="c"] nav{border-bottom:0!important;height:80px!important}
body[data-mode="c"] nav>a svg{display:none}
body[data-mode="c"] nav>a span{font:400 30px 'Instrument Serif',Georgia,serif!important;letter-spacing:-.01em!important}
body[data-mode="c"] nav a[style*="background: var(--primary)"],body[data-mode="c"] nav a[style*="background: var(--accent)"]{background:transparent!important;color:var(--primary)!important;border:1.5px solid var(--primary)!important;border-radius:999px!important;padding:11px 20px!important}
body[data-mode="c"] a[style*="background: var(--cta)"],body[data-mode="c"] button[style*="background: var(--cta)"]{background:var(--primary)!important;border-radius:999px!important}
body[data-mode="c"] a[style*="background: var(--primary)"]:not(nav a),body[data-mode="c"] button[style*="background: var(--primary)"]{border-radius:999px!important}
body[data-mode="c"] a[style*="border: 1.5px solid var(--border-2)"]{border-radius:999px!important}
body[data-mode="c"] img{border-radius:6px!important}
body[data-mode="c"] [style*="border-radius: 16px"],body[data-mode="c"] [style*="border-radius: 14px"],body[data-mode="c"] [style*="border-radius: 20px"]{border-radius:6px!important}
body[data-mode="c"] [style*="background: var(--surface-2)"]{background:#EDE6D8!important}
body[data-mode="c"] section[style*="background: var(--surface)"]{background:#fff!important}
body[data-mode="c"] div[style*="background: var(--surface); border-radius"]{background:#fff!important;border:1px solid var(--border)}
body[data-mode="c"] [style*="letter-spacing: 0.1em; text-transform: uppercase"]{color:var(--cta)!important}
body[data-mode="c"] nav>a{color:var(--primary)}

/* c: CTA buttons inside dark boxes become sand pills (as on the 1c landing) */
body[data-mode="c"] [style*="background: var(--primary)"] a[style*="background: var(--cta)"],body[data-mode="c"] [style*="background: var(--primary)"] button[style*="background: var(--cta)"]{background:var(--surface)!important;color:var(--primary)!important}
body[data-mode="c"] [style*="background: var(--primary)"] a[style*="background: var(--primary)"]{background:var(--surface)!important;color:var(--primary)!important}