/* ============================================================================
   SOEB DESIGN SYSTEM — v4.0.0 production layer
   ----------------------------------------------------------------------------
   The approved "quiet green, loud numbers" system, translated from the signed-
   off Phase 2 prototypes. Loaded AFTER style.css (see soeb_scripts) so it wins
   the cascade at equal specificity without !important.

   Contents
     1. Tokens (--soeb-*)            — global; plugins may consume these later
     2. Primitives                   — .soeb-btn / labels / numerics / ledger
     3. Editorial components         — callouts, rec rows, index, toolrow
     4. Homepage (.soeb-hp)          — Stage B surfaces
     5. Article masthead overrides   — Stage C (restyles .soeb-article__hero)
     6. Energy-Saving Planner reskin — Stage D (restyles .soeb-energy-plan)
     7. Referral bar (.octo-ref)     — on-system + compact mobile
     8. Print styles                 — "Print my plan"

   Rules of engagement (per implementation brief):
   - No !important. No overrides of plugin-internal UI. New selectors are
     namespaced or scoped to surfaces this phase migrates.
   - Legacy CSS in style.css is left in place; this layer only overrides the
     specific migrated surfaces above.
   ============================================================================ */

/* ── 1. TOKENS ─────────────────────────────────────────────────────────── */
:root{
  --soeb-forest:#15271C;
  --soeb-forest-2:#1E3226;
  --soeb-pine:#274C37;
  --soeb-green:#2F6C4C;
  --soeb-mint:#4FC795;
  --soeb-mint-tint:#E3EFE6;
  --soeb-ink:#12211A;
  --soeb-ink-soft:#4A5850;
  --soeb-mist:#C6D4C9;
  --soeb-paper:#FFFFFF;
  --soeb-ground:#F3F6F1;
  --soeb-line:#DCE4DB;
  --soeb-line-dark:rgba(255,255,255,.12);
  --soeb-neg:#B4452F;
  --soeb-neg-tint:#F9ECE8;
  --soeb-warn:#8A5A00;
  --soeb-warn-tint:#FBF3DE;
  --soeb-numeral:#7E9486;          /* oversized editorial numerals (AA-large) */

  --soeb-font:'Schibsted Grotesk',-apple-system,'Helvetica Neue',Arial,sans-serif;
  --soeb-mono:'IBM Plex Mono',ui-monospace,Menlo,monospace;

  --soeb-space-1:4px;--soeb-space-2:8px;--soeb-space-3:12px;--soeb-space-4:16px;
  --soeb-space-5:24px;--soeb-space-6:32px;--soeb-space-7:48px;--soeb-space-8:64px;--soeb-space-9:96px;

  --soeb-w-site:1320px;--soeb-w-standard:1040px;--soeb-w-narrow:760px;--soeb-w-article:1148px;

  --soeb-radius-pill:999px;--soeb-radius-card:16px;--soeb-radius-control:12px;
  --soeb-bw:1.5px;
  --soeb-shadow-float:0 8px 24px rgba(18,33,26,.12);
}

/* Anchor targets + focused fields never land under the sticky referral bar. */
html{scroll-padding-bottom:110px}

/* Upright guard — UI typography is never italic. Semantic <em>/<i> inside
   article prose keeps its meaning. */
body,button,input,select,textarea,
.site-header,.site-footer,.main-nav,.header-cta,
.soeb-hp,.soeb-art__head,.soeb-btn,.soeb-label,.soeb-eyebrow,.soeb-num,
.soeb-energy-plan,.octo-ref,
h1,h2,h3,h4,h5,h6{font-style:normal}

/* ── 2. PRIMITIVES ─────────────────────────────────────────────────────── */
.soeb-label{font-family:var(--soeb-mono);font-size:.72rem;font-weight:500;letter-spacing:.08em;text-transform:uppercase}
.soeb-eyebrow{font-family:var(--soeb-mono);font-size:.72rem;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--soeb-green)}
.soeb-on-dark .soeb-eyebrow{color:var(--soeb-mint)}

.soeb-num{font-variant-numeric:tabular-nums lining-nums;font-weight:700;letter-spacing:-.02em;line-height:1}
.soeb-stat-hero{font-size:clamp(3.4rem,6vw,5.4rem);letter-spacing:-.03em}
.soeb-stat-xl{font-size:3.2rem}
.soeb-stat-lg{font-size:2.2rem}
.soeb-stat-md{font-size:1.5rem}
.soeb-unit{font-size:.4em;font-weight:500;color:var(--soeb-ink-soft);letter-spacing:0;margin-left:3px}
.soeb-unit--word{margin-left:.35em}
.soeb-stat-hero .soeb-unit{font-size:.32em}
.soeb-on-dark .soeb-unit{color:var(--soeb-mist)}

.soeb-delta{display:inline-flex;align-items:center;gap:4px;font-family:var(--soeb-mono);font-size:.72rem;font-weight:500;padding:4px 11px;border-radius:var(--soeb-radius-pill)}
.soeb-delta--up{background:var(--soeb-neg-tint);color:var(--soeb-neg)}      /* price up = costs more */
.soeb-delta--down{background:var(--soeb-mint-tint);color:var(--soeb-pine)}
.soeb-delta--flat{background:var(--soeb-ground);color:var(--soeb-ink-soft)}

/* Flat statistic ledger — dividers, never cards */
.soeb-ledger{display:flex}
.soeb-ledger>div{flex:1;padding:0 var(--soeb-space-5)}
.soeb-ledger>div+div{border-left:1px solid var(--soeb-line)}
.soeb-ledger>div:first-child{padding-left:0}
.soeb-on-dark .soeb-ledger>div+div{border-left-color:var(--soeb-line-dark)}
.soeb-stat-label{font-family:var(--soeb-mono);font-size:.72rem;letter-spacing:.07em;text-transform:uppercase;color:var(--soeb-ink-soft);display:block;margin-bottom:8px}
.soeb-on-dark .soeb-stat-label{color:var(--soeb-mist)}
@media(max-width:640px){
  .soeb-ledger{flex-wrap:wrap;row-gap:var(--soeb-space-5)}
  .soeb-ledger>div{flex:1 1 45%;padding:0}
  .soeb-ledger>div+div{border-left:0}
}

/* Buttons — the ONLY button system for migrated surfaces */
.soeb-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:15px 30px;border-radius:var(--soeb-radius-pill);border:var(--soeb-bw) solid transparent;
  font-family:var(--soeb-font);font-size:.97rem;font-weight:600;text-decoration:none;line-height:1;letter-spacing:.005em;cursor:pointer;
  transition:background .18s ease,border-color .18s ease,color .18s ease,transform .06s ease}
.soeb-btn:active{transform:translateY(1px)}
.soeb-btn .soeb-btn-arrow{display:inline-block;transition:transform .18s ease}
.soeb-btn:hover .soeb-btn-arrow{transform:translateX(3px)}
.soeb-btn--primary{background:var(--soeb-pine);color:#fff}
.soeb-btn--primary:hover{background:var(--soeb-forest);color:#fff;text-decoration:none}
.soeb-on-dark .soeb-btn--primary{background:var(--soeb-mint);color:var(--soeb-forest)}
.soeb-on-dark .soeb-btn--primary:hover{background:var(--soeb-mint-tint);color:var(--soeb-forest)}
.soeb-btn--secondary{background:transparent;color:var(--soeb-pine);border-color:currentColor}
.soeb-btn--secondary:hover{background:var(--soeb-mint-tint);color:var(--soeb-pine);text-decoration:none}
.soeb-on-dark .soeb-btn--secondary{color:#fff}
.soeb-on-dark .soeb-btn--secondary:hover{background:rgba(255,255,255,.08);color:#fff}
.soeb-btn--lg{padding:18px 36px;font-size:1.02rem}
.soeb-btn[disabled],.soeb-btn.is-disabled{opacity:.45;pointer-events:none;transform:none}
.soeb-btn:focus-visible{outline:2px solid var(--soeb-green);outline-offset:3px}
.soeb-on-dark .soeb-btn:focus-visible{outline-color:var(--soeb-mint)}

.soeb-arrow-link{font-weight:600;text-decoration:none;display:inline-flex;align-items:center;gap:6px;color:var(--soeb-pine)}
.soeb-arrow-link::after{content:'→';transition:transform .15s ease}
.soeb-arrow-link:hover::after{transform:translateX(3px)}
.soeb-arrow-link:hover{color:var(--soeb-forest);text-decoration:none}
.soeb-on-dark .soeb-arrow-link{color:var(--soeb-mint)}
.soeb-on-dark .soeb-arrow-link:hover{color:var(--soeb-mint-tint)}

/* ── 3. EDITORIAL COMPONENTS ───────────────────────────────────────────── */
/* Callouts — rules not boxes; fill means caution only. Available to editors
   via Custom HTML blocks; documented in the change log. */
.soeb-callout{font-size:1.02rem;line-height:1.6;margin:var(--soeb-space-6) 0}
.soeb-callout .soeb-label{display:block;margin-bottom:10px}
.soeb-callout--key{border-top:2px solid var(--soeb-pine);padding-top:16px;font-size:1.08rem;line-height:1.55}
.soeb-callout--key .soeb-label{color:var(--soeb-pine)}
.soeb-callout--warn{background:var(--soeb-warn-tint);border-radius:var(--soeb-radius-control);padding:20px 24px;color:#4a3a10;font-size:.97rem}
.soeb-callout--warn .soeb-label{color:var(--soeb-warn);margin-bottom:6px}
.soeb-callout--update{border-top:1px solid var(--soeb-line);border-bottom:1px solid var(--soeb-line);padding:16px 0}
.soeb-callout--update .soeb-label{color:var(--soeb-ink-soft);margin-bottom:6px}
.soeb-callout--update .soeb-label b{color:var(--soeb-ink);font-weight:600}

/* In-article statistic block */
.soeb-statblock{margin:var(--soeb-space-7) 0;padding:var(--soeb-space-5) 0;border-top:2px solid var(--soeb-ink);border-bottom:1px solid var(--soeb-line)}
.soeb-statblock>.soeb-label{color:var(--soeb-ink-soft);display:block;margin-bottom:18px}

/* Oversized numbered editorial index */
.soeb-index{border-top:1px solid var(--soeb-line)}
.soeb-index__row{display:grid;grid-template-columns:150px minmax(0,1fr) minmax(0,1.1fr) auto;gap:var(--soeb-space-6);align-items:baseline;
  padding:var(--soeb-space-6) 0;border-bottom:1px solid var(--soeb-line);text-decoration:none;color:var(--soeb-ink)}
.soeb-index__row:hover{color:var(--soeb-ink);text-decoration:none}
.soeb-index__num{font-size:3.6rem;font-weight:400;line-height:1;letter-spacing:-.02em;color:var(--soeb-numeral);font-variant-numeric:tabular-nums;transition:color .18s ease}
.soeb-index__row:hover .soeb-index__num{color:var(--soeb-pine)}
.soeb-index__title{font-size:1.45rem;font-weight:700;letter-spacing:-.015em;line-height:1.15}
.soeb-index__desc{font-size:.97rem;color:var(--soeb-ink-soft);line-height:1.55}
@media(max-width:1024px){
  .soeb-index__row{grid-template-columns:96px minmax(0,1fr) auto}
  .soeb-index__num{grid-column:1;grid-row:1}
  .soeb-index__title{grid-column:2;grid-row:1}
  .soeb-index__row .soeb-arrow-link{grid-column:3;grid-row:1;justify-self:end}
  .soeb-index__desc{grid-column:2;grid-row:2}
}
@media(max-width:640px){
  .soeb-index__row{grid-template-columns:64px minmax(0,1fr);row-gap:8px;padding:var(--soeb-space-5) 0}
  .soeb-index__num{grid-column:1;grid-row:1;font-size:2.2rem}
  .soeb-index__title{grid-column:2;grid-row:1;font-size:1.2rem}
  .soeb-index__desc{grid-column:2;grid-row:2}
  .soeb-index__row .soeb-arrow-link{grid-column:2;grid-row:3;justify-self:start}
}

/* De-carded tool discovery rows */
.soeb-toolrow{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px var(--soeb-space-5);padding:var(--soeb-space-5) 0;border-bottom:1px solid var(--soeb-line);text-decoration:none;color:var(--soeb-ink)}
.soeb-toolrow:first-of-type{padding-top:0}
.soeb-toolrow:hover{text-decoration:none;color:var(--soeb-ink)}
.soeb-toolrow .soeb-label{color:var(--soeb-green)}
.soeb-toolrow h3{font-size:1.12rem;margin:4px 0 0;font-weight:600}
.soeb-toolrow p{grid-column:1;font-size:.92rem;color:var(--soeb-ink-soft);line-height:1.5;margin:0}
.soeb-toolrow .soeb-arrow-link{grid-column:2;grid-row:1 / span 3;align-self:center;font-size:.92rem;white-space:nowrap}
.soeb-toolrow:hover h3{color:var(--soeb-pine)}
@media(max-width:640px){.soeb-toolrow{grid-template-columns:1fr}.soeb-toolrow .soeb-arrow-link{grid-column:1;grid-row:auto;margin-top:6px}}

/* ── 4. HOMEPAGE (.soeb-hp) — Stage B ─────────────────────────────────── */
.soeb-hp{font-family:var(--soeb-font);color:var(--soeb-ink)}
.soeb-hp *{box-sizing:border-box}
.soeb-hp__wrap{max-width:var(--soeb-w-site);margin:0 auto;padding:0 var(--soeb-space-6)}
@media(max-width:640px){.soeb-hp__wrap{padding:0 var(--soeb-space-4)}}

.soeb-hp__hero{background:var(--soeb-forest);color:#fff;padding:var(--soeb-space-8) 0 var(--soeb-space-7)}
.soeb-hp__hero-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:var(--soeb-space-8);align-items:start}
.soeb-hp__title{font-size:clamp(2.6rem,4.8vw,3.9rem);line-height:1.02;font-weight:800;letter-spacing:-.03em;margin:16px 0 0;text-wrap:balance;max-width:11em;color:#fff}
.soeb-hp__title em{font-style:normal;color:var(--soeb-mint)}
.soeb-hp__lead{font-size:1.22rem;line-height:1.5;color:var(--soeb-mist);max-width:30em;margin:var(--soeb-space-5) 0 var(--soeb-space-6)}
.soeb-hp__ctas{display:flex;gap:14px;flex-wrap:wrap;align-items:center}

/* Hero live rail — content is maintained editorial data (see front-page.php) */
.soeb-hp__rail{border-left:1px solid var(--soeb-line-dark);padding-left:var(--soeb-space-6)}
.soeb-hp__rail-item{padding:18px 0;border-bottom:1px solid var(--soeb-line-dark)}
.soeb-hp__rail-item:first-child{padding-top:6px}
.soeb-hp__rail-item:last-child{border-bottom:0}
.soeb-hp__rail-item .soeb-num{color:#fff;display:block;margin-top:8px}
.soeb-hp__rail-sub{display:block;margin-top:6px;font-size:.8rem;color:var(--soeb-mist)}
@media(max-width:1024px){
  .soeb-hp__hero-grid{grid-template-columns:1fr}
  .soeb-hp__rail{border-left:0;padding-left:0;border-top:1px solid var(--soeb-line-dark);padding-top:var(--soeb-space-5);max-width:520px}
}
@media(max-width:640px){.soeb-hp__hero{padding:var(--soeb-space-7) 0 var(--soeb-space-6)}}

.soeb-hp__section{padding:var(--soeb-space-9) 0}
.soeb-hp__section--compact{padding:var(--soeb-space-8) 0}
@media(max-width:640px){.soeb-hp__section{padding:56px 0}.soeb-hp__section--compact{padding:40px 0}}
.soeb-hp__section-head{display:flex;flex-direction:column;gap:10px;margin-bottom:var(--soeb-space-7)}
.soeb-hp h2.soeb-hp__h{font-size:clamp(2rem,3.6vw,2.7rem);line-height:1.08;font-weight:700;letter-spacing:-.02em;margin:0;color:var(--soeb-ink)}

.soeb-hp__tools{background:var(--soeb-ground);border-top:1px solid var(--soeb-line)}
.soeb-hp__tools-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--soeb-space-8);align-items:start}
@media(max-width:1024px){.soeb-hp__tools-grid{grid-template-columns:1fr}}
.soeb-hp__feature{background:var(--soeb-forest);color:#fff;border-radius:var(--soeb-radius-card);padding:var(--soeb-space-7)}
.soeb-hp__feature h3{font-size:1.7rem;letter-spacing:-.02em;margin:12px 0 10px;color:#fff;font-weight:700}
.soeb-hp__feature p{color:var(--soeb-mist);max-width:26em;margin:0}
.soeb-hp__feature .soeb-btn{margin-top:var(--soeb-space-5)}
.soeb-hp__feature-ledger{display:flex;margin-top:var(--soeb-space-6);border-top:1px solid var(--soeb-line-dark);padding-top:var(--soeb-space-5)}
.soeb-hp__feature-ledger>div{flex:1}
.soeb-hp__feature-ledger>div+div{border-left:1px solid var(--soeb-line-dark);padding-left:18px}
.soeb-hp__feature-ledger .soeb-num{color:#fff}

.soeb-hp__guides-grid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:var(--soeb-space-8)}
@media(max-width:1024px){.soeb-hp__guides-grid{grid-template-columns:1fr}}
.soeb-hp__guide{padding:var(--soeb-space-5) 0;border-bottom:1px solid var(--soeb-line)}
.soeb-hp__guide:first-of-type{padding-top:0}
.soeb-hp__guide .soeb-label{color:var(--soeb-ink-soft)}
.soeb-hp__guide h3{margin:8px 0 6px;font-size:1.3rem;letter-spacing:-.015em;font-weight:700}
.soeb-hp__guide h3 a{color:var(--soeb-ink);text-decoration:none}
.soeb-hp__guide h3 a:hover{color:var(--soeb-pine)}
.soeb-hp__guide p{font-size:.95rem;color:var(--soeb-ink-soft);line-height:1.55;max-width:52ch;margin:0}
.soeb-hp__featured{background:var(--soeb-forest);color:#fff;border-radius:var(--soeb-radius-card);padding:var(--soeb-space-6);display:flex;flex-direction:column;gap:12px;margin-top:var(--soeb-space-6)}
.soeb-hp__featured h3{font-size:1.35rem;letter-spacing:-.015em;margin:0;color:#fff;font-weight:700}
.soeb-hp__featured p{color:var(--soeb-mist);margin:0}
.soeb-hp__featured .soeb-btn{align-self:flex-start;margin-top:4px}

.soeb-hp__trust{border-top:1px solid var(--soeb-line);padding:var(--soeb-space-7) 0}
.soeb-hp__trust-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--soeb-space-7)}
.soeb-hp__trust h2{font-size:1.35rem;letter-spacing:-.01em;margin:10px 0 0;font-weight:700}
.soeb-hp__trust p{font-size:.95rem;color:var(--soeb-ink-soft);max-width:58ch;margin:0}
@media(max-width:1024px){.soeb-hp__trust-grid{grid-template-columns:1fr;gap:var(--soeb-space-4)}}

/* ── 5. EDITORIAL ARTICLE SYSTEM — v4.1.0 (.soeb-art) ─────────────────── */
/* Approved editorial exploration translated 1:1. Two surface changes per
   page: pale sage masthead, forest ending band. Rhythm components below are
   available as block patterns (inc/block-patterns.php) — see PATTERNS-GUIDE. */
.soeb-art__container{max-width:1180px;margin:0 auto;padding-left:32px;padding-right:32px}
@media(max-width:640px){.soeb-art__container{padding-left:16px;padding-right:16px}}

/* Masthead — pale sage ground, compact horizontal meta */
.soeb-art__head{background:var(--soeb-ground);border-bottom:1px solid var(--soeb-line)}
.soeb-art__crumbs{font-size:.82rem;color:var(--soeb-ink-soft);padding:18px 0 0}
.soeb-art__crumbs a{color:var(--soeb-ink-soft);text-decoration:none}
.soeb-art__crumbs a:hover{color:var(--soeb-pine);text-decoration:underline}
.soeb-art__crumbs .sep{margin:0 7px}
.soeb-art__mast{padding:40px 0 52px;max-width:880px}
.soeb-art__eyebrow{font-family:var(--soeb-mono);font-size:.72rem;font-weight:500;letter-spacing:.08em;text-transform:uppercase;
  color:var(--soeb-green);text-decoration:none;display:inline-block;margin-bottom:16px;background:transparent;border:0;padding:0}
.soeb-art__eyebrow:hover{color:var(--soeb-pine);text-decoration:underline}
.soeb-art__title{font-family:var(--soeb-font);font-style:normal;font-size:clamp(2.2rem,4.4vw,3.15rem);line-height:1.05;
  letter-spacing:-.028em;font-weight:750;max-width:14.5em;color:var(--soeb-ink);margin:0}
.soeb-art__standfirst{font-size:1.28rem;line-height:1.5;color:var(--soeb-ink-soft);max-width:32em;margin:22px 0 0}
.soeb-art__metaline{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 10px;margin-top:28px;font-size:.9rem;color:var(--soeb-ink-soft)}
.soeb-art__metaline b{color:var(--soeb-ink);font-weight:600}
.soeb-art__dot{color:#A9BAAD}

/* Featured image — optional wide horizontal band below the masthead */
.soeb-art__feat{margin:0;padding:40px 0 0;background:var(--soeb-paper)}
.soeb-art__feat-img{aspect-ratio:21/9;border-radius:var(--soeb-radius-card);overflow:hidden;background:var(--soeb-ground)}
.soeb-art__feat-img img{width:100%;height:100%;object-fit:cover;display:block}
.soeb-art__feat-cap{margin-top:10px;font-size:.82rem;color:var(--soeb-ink-soft)}
@media(max-width:640px){
  .soeb-art__feat{padding-top:24px}
  .soeb-art__feat-img{aspect-ratio:3/2;border-radius:12px}
}

/* Page grid — TOC rail LEFT, 710px reading column, wide breaks right */
.soeb-art__grid{display:grid;grid-template-columns:190px minmax(0,1fr);gap:64px;padding:56px 0 0}
.soeb-art__feat + .soeb-art__container .soeb-art__grid{padding-top:44px}
.soeb-art__main{max-width:960px}
.soeb-art__prose{max-width:710px}
@media(max-width:1100px){
  .soeb-art__grid{grid-template-columns:minmax(0,1fr);gap:0;padding-top:8px}
}

/* TOC — integrated numbered rail (styles the JS-injected .soeb-toc) */
.soeb-art__rail{align-self:start;position:sticky;top:88px;width:auto;min-width:0;max-width:100%}
.soeb-art__rail .soeb-toc{width:auto;min-width:0;max-width:100%}
.soeb-art__rail .soeb-toc{background:transparent;border:0;box-shadow:none;border-radius:0;padding:0}
.soeb-art__rail .soeb-toc__header{padding:0;border:0;background:transparent;margin-bottom:14px;cursor:default}
.soeb-art__rail .soeb-toc__title{font-family:var(--soeb-mono);font-size:.72rem;font-weight:500;letter-spacing:.08em;
  text-transform:uppercase;color:var(--soeb-ink-soft);gap:8px}
.soeb-art__rail .soeb-toc__title svg{display:none}
.soeb-art__rail .soeb-toc__toggle{display:none}
.soeb-art__rail .soeb-toc__list{display:block;border-left:1px solid var(--soeb-line);margin:0;padding:0;list-style:none;overflow:visible;white-space:normal}
.soeb-art__rail .soeb-toc__list li{display:block;flex:none;margin:0;padding:0}
.soeb-art__rail .soeb-toc__list a{display:flex;white-space:normal;width:auto;gap:10px;padding:7px 0 7px 16px;margin-left:-1px;border-left:2px solid transparent;
  font-size:.86rem;line-height:1.4;color:var(--soeb-ink-soft);text-decoration:none;background:transparent}
.soeb-art__rail .soeb-toc__list a .soeb-toc__num{font-family:var(--soeb-mono);font-size:.66rem;color:#A9BAAD;padding:3px 0 0;min-width:14px;
  background:transparent;border:0;box-shadow:none;width:auto;height:auto;min-height:0;border-radius:0;display:inline;flex:0 0 auto;line-height:inherit}
.soeb-art__rail .soeb-toc__list a.active .soeb-toc__num{background:transparent;color:var(--soeb-pine)}
.soeb-art__rail .soeb-toc__list a:hover{color:var(--soeb-pine)}
.soeb-art__rail .soeb-toc__list a.active{color:var(--soeb-pine);font-weight:600;border-left-color:var(--soeb-pine)}
.soeb-art__rail .soeb-toc__list a.active .soeb-toc__num{color:var(--soeb-pine)}
@media(max-width:1100px){
  /* mobile/tablet: ruled collapsible band under the masthead */
  .soeb-art__rail{position:static;margin:24px 0 8px}
  .soeb-art__rail .soeb-toc{border-top:1px solid var(--soeb-line);border-bottom:1px solid var(--soeb-line);padding:14px 0}
  .soeb-art__rail .soeb-toc__header{cursor:pointer;display:flex;justify-content:space-between;align-items:center;margin-bottom:0}
  .soeb-art__rail .soeb-toc__toggle{display:inline-flex;background:none;border:0;color:var(--soeb-ink-soft)}
  .soeb-art__rail .soeb-toc__list{border-left:0;padding-top:10px}
  .soeb-art__rail .soeb-toc__list a{padding-left:0;border-left:0}
}

/* Editorial prose hierarchy — H1 owns the page; H2s step well down */
.soeb-art__prose p{font-size:1.005rem;line-height:1.75}
.soeb-art__prose>p:first-child{font-size:1.14rem;line-height:1.65;color:var(--soeb-ink)}
.soeb-secnum{font-family:var(--soeb-mono);font-size:.7rem;letter-spacing:.09em;color:var(--soeb-green);display:block;margin:60px 0 8px}
.soeb-art__prose h2{font-size:1.45rem;line-height:1.25;letter-spacing:-.014em;font-weight:700;margin:60px 0 14px;max-width:22em;color:var(--soeb-ink)}
.soeb-secnum+h2{margin-top:0}
.soeb-art__prose h3{font-size:1.12rem;line-height:1.35;font-weight:650;margin:34px 0 10px}

/* ── Rhythm components (block patterns) ── */
.soeb-glance{margin:40px 0 8px;border-top:2px solid var(--soeb-ink);padding-top:16px}
.soeb-glance>.soeb-label{color:var(--soeb-ink-soft)}
.soeb-glance-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-top:18px}
.soeb-glance-grid .soeb-stat-label{margin-bottom:6px}
.soeb-glance-grid .soeb-num{font-size:1.7rem}
.soeb-glance-grid .soeb-num--text{font-size:1.15rem;line-height:1.3}
.soeb-glance-note{display:block;font-size:.82rem;color:var(--soeb-ink-soft);margin-top:6px;line-height:1.45}
@media(max-width:820px){.soeb-glance-grid{grid-template-columns:1fr 1fr;gap:20px}}

.soeb-keyfact{margin:34px 0;padding-left:20px;border-left:3px solid var(--soeb-pine)}
.soeb-keyfact .soeb-label{color:var(--soeb-pine);display:block;margin-bottom:8px}
.soeb-keyfact p{font-size:1.1rem;line-height:1.55;margin:0;max-width:34em}

.soeb-checked{margin:30px 0;padding:12px 0;border-top:1px solid var(--soeb-line);border-bottom:1px solid var(--soeb-line);
  font-size:.93rem;line-height:1.6;color:var(--soeb-ink)}
.soeb-checked .soeb-label{color:var(--soeb-ink-soft)}
.soeb-checked .soeb-label b{color:var(--soeb-ink);font-weight:600}

.soeb-caution{margin:34px 0;background:var(--soeb-warn-tint);border-radius:10px;padding:16px 20px;
  font-size:.95rem;line-height:1.6;color:#4a3a10;max-width:38em}
.soeb-caution .soeb-label{color:var(--soeb-warn);display:block;margin-bottom:5px}

.soeb-pullstat{margin:40px 0;display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px 28px;align-items:baseline;
  border-top:1px solid var(--soeb-line);border-bottom:1px solid var(--soeb-line);padding:22px 0}
.soeb-pullstat .soeb-ps-num{font-variant-numeric:tabular-nums;font-weight:700;letter-spacing:-.02em;line-height:1;font-size:3rem;color:var(--soeb-pine)}
.soeb-pullstat .soeb-ps-label{grid-column:1;font-family:var(--soeb-mono);font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:var(--soeb-ink-soft)}
.soeb-pullstat p{grid-column:2;grid-row:1 / span 2;align-self:center;font-size:.95rem;line-height:1.6;color:var(--soeb-ink-soft);margin:0;max-width:30em}
@media(max-width:640px){.soeb-pullstat{grid-template-columns:1fr}.soeb-pullstat p{grid-column:1;grid-row:auto}}

.soeb-toolstep{margin:40px 0;background:var(--soeb-ground);border-radius:12px;padding:20px 24px;
  display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;max-width:710px}
.soeb-toolstep b{display:block;font-size:1.05rem}
.soeb-toolstep span{font-size:.9rem;color:var(--soeb-ink-soft)}
.soeb-toolstep .soeb-btn{flex:0 0 auto}
@media(max-width:640px){.soeb-toolstep .soeb-btn{width:100%;justify-content:center}}

/* Wide data component — breaks right of the reading column */
.soeb-wide{max-width:960px;margin:40px 0}
.soeb-wide>.soeb-label{color:var(--soeb-ink-soft);display:block;margin-bottom:12px}
.soeb-wide-note{font-size:.85rem;color:var(--soeb-ink-soft);margin-top:12px;max-width:60ch}
@media(max-width:1100px){.soeb-wide{max-width:100%}}
@media(max-width:640px){
  .soeb-wide .soeb-tblwrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .soeb-wide table{min-width:560px}
}

/* Ending — forest next-steps band */
.soeb-art__next{background:var(--soeb-forest);color:#fff;border-radius:var(--soeb-radius-card);margin-top:72px}
.soeb-art__next-inner{padding:44px 44px 40px;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:48px}
.soeb-art__next-eyebrow{font-family:var(--soeb-mono);font-size:.72rem;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--soeb-mint)}
.soeb-art__next h2{font-size:1.6rem;letter-spacing:-.018em;color:#fff;margin:12px 0 10px}
.soeb-art__next p{color:var(--soeb-mist);font-size:.98rem;line-height:1.6;margin:0 0 20px;max-width:30em}
.soeb-art__next .soeb-btn{background:var(--soeb-mint);color:var(--soeb-forest)}
.soeb-art__next .soeb-btn:hover{background:var(--soeb-mint-tint);color:var(--soeb-forest)}
.soeb-art__next-list{border-top:1px solid var(--soeb-line-dark)}
.soeb-art__next-list a{display:flex;justify-content:space-between;gap:16px;align-items:baseline;padding:14px 0;
  border-bottom:1px solid var(--soeb-line-dark);color:#fff;text-decoration:none;font-weight:600;font-size:.98rem}
.soeb-art__next-list a small{font-family:var(--soeb-mono);font-size:.68rem;letter-spacing:.07em;text-transform:uppercase;color:var(--soeb-mist);font-weight:500}
.soeb-art__next-list a:hover{color:var(--soeb-mint)}
.soeb-art__next-meta{margin-top:22px;font-size:.82rem;color:var(--soeb-mist)}
@media(max-width:900px){.soeb-art__next-inner{grid-template-columns:1fr;gap:28px;padding:32px 24px}}

/* ── 6. ENERGY-SAVING PLANNER RESKIN — Stage D ────────────────────────── */
/* Restyles the existing wizard markup/classes only. All ids, data-*
   attributes and JS behaviour are untouched. */
.soeb-energy-plan__shell{background:var(--soeb-paper);border:1px solid var(--soeb-line);border-radius:var(--soeb-radius-card);box-shadow:none}
.soeb-energy-plan__top h2{font-family:var(--soeb-mono);font-size:.72rem;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--soeb-green)}
/* Mobile keeps explicit "Step X of 8" context — never the bar alone. */
.soeb-energy-plan__status{font-family:var(--soeb-mono);font-size:.72rem;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--soeb-ink-soft);display:block}
.soeb-energy-plan__progress{height:3px;background:var(--soeb-line);border-radius:var(--soeb-radius-pill);overflow:hidden}
.soeb-energy-plan__progress-bar{background:var(--soeb-pine);border-radius:var(--soeb-radius-pill)}
.soeb-energy-plan__step-heading{font-size:clamp(1.5rem,3vw,2rem);letter-spacing:-.02em;line-height:1.12;color:var(--soeb-ink)}
.soeb-energy-plan__step-copy{color:var(--soeb-ink-soft);font-size:1.02rem}

.soeb-energy-plan__choice{background:var(--soeb-paper);border:var(--soeb-bw) solid var(--soeb-line);border-radius:var(--soeb-radius-control);
  box-shadow:none;min-height:64px;transition:border-color .15s ease,background .15s ease,box-shadow .15s ease}
.soeb-energy-plan__choice:hover{border-color:#AEC2B3;transform:none;box-shadow:none}
.soeb-energy-plan__choice[aria-pressed="true"]{border-color:var(--soeb-pine);background:var(--soeb-mint-tint);box-shadow:inset 0 0 0 .75px var(--soeb-pine)}
.soeb-energy-plan__choice[aria-pressed="true"]::after{
  /* selection communicated by border + tint + tick, never colour alone */
  content:'';width:22px;height:22px;border-radius:50%;background:var(--soeb-pine) no-repeat center/12px
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
  position:absolute;top:14px;right:14px}
.soeb-energy-plan__choice{position:relative}
.soeb-energy-plan__choice:focus-visible{outline:2px solid var(--soeb-green);outline-offset:3px}
.soeb-energy-plan__choice-icon{background:var(--soeb-mint-tint);color:var(--soeb-pine);border-radius:10px}
.soeb-energy-plan__choice-title{font-weight:600;color:var(--soeb-ink)}
.soeb-energy-plan__choice-copy{color:var(--soeb-ink-soft)}

.soeb-energy-plan__button,
.soeb-energy-plan__button--light{background:var(--soeb-pine);color:#fff;border:var(--soeb-bw) solid transparent;border-radius:var(--soeb-radius-pill);
  padding:15px 30px;font-weight:600;font-size:.97rem;letter-spacing:.005em;box-shadow:none;
  transition:background .18s ease,transform .06s ease}
.soeb-energy-plan__button:hover,.soeb-energy-plan__button--light:hover{background:var(--soeb-forest);color:#fff;transform:none;box-shadow:none}
.soeb-energy-plan__button:active{transform:translateY(1px)}
.soeb-energy-plan__button:focus-visible{outline:2px solid var(--soeb-green);outline-offset:3px}
.soeb-energy-plan__text-button{color:var(--soeb-ink-soft);font-weight:600}
.soeb-energy-plan__text-button:hover{color:var(--soeb-pine)}
.soeb-energy-plan__continue-hint{font-size:.87rem;color:var(--soeb-ink-soft)}
.soeb-energy-plan__error{color:var(--soeb-neg);font-weight:500}

/* Results — the personalised dark header + numbered recommendation rows */
.soeb-energy-plan__result{background:transparent;border:0;box-shadow:none;padding:0}
.soeb-energy-plan__result-kicker{font-family:var(--soeb-mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--soeb-mint)}
.soeb-energy-plan__result-head{background:var(--soeb-forest);color:#fff;border-radius:var(--soeb-radius-card);padding:var(--soeb-space-7) var(--soeb-space-6)}
.soeb-energy-plan__result-head h2{color:#fff;font-size:clamp(1.9rem,3.6vw,2.6rem);letter-spacing:-.025em;line-height:1.08}
.soeb-energy-plan__result-intro{color:var(--soeb-mist)}
.soeb-energy-plan__summary{border-top:1px solid var(--soeb-line-dark);margin-top:var(--soeb-space-5);padding-top:var(--soeb-space-4);
  font-family:var(--soeb-mono);font-size:.74rem;letter-spacing:.05em;text-transform:uppercase;color:var(--soeb-mist)}

.soeb-energy-plan__overview-kicker{font-family:var(--soeb-mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--soeb-green)}
.soeb-energy-plan__overview-number{color:var(--soeb-numeral);font-weight:400;font-size:1.6rem;background:transparent;border:0}
.soeb-energy-plan__overview-phase{font-family:var(--soeb-mono);font-size:.74rem;letter-spacing:.05em;text-transform:uppercase;color:var(--soeb-ink-soft)}

.soeb-energy-plan__action-group{margin-top:var(--soeb-space-8)}
.soeb-energy-plan__action-group-head{border-bottom:2px solid var(--soeb-ink);padding-bottom:12px}
.soeb-energy-plan__action-group-head h3{font-size:1.55rem;letter-spacing:-.02em;color:var(--soeb-ink)}
.soeb-energy-plan__group-kicker{font-family:var(--soeb-mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--soeb-green)}
.soeb-energy-plan__group-copy{color:var(--soeb-ink-soft)}

.soeb-energy-plan__accordion{border:0;border-bottom:1px solid var(--soeb-line);border-radius:0;background:transparent;box-shadow:none;padding:0}
.soeb-energy-plan__accordion summary{padding:26px 0;gap:var(--soeb-space-5)}
.soeb-energy-plan__accordion-number{color:var(--soeb-numeral);font-weight:400;font-size:1.9rem;background:transparent;border:0;
  font-variant-numeric:tabular-nums;min-width:44px}
.soeb-energy-plan__accordion-title strong{font-size:1.15rem;letter-spacing:-.01em;color:var(--soeb-ink)}
.soeb-energy-plan__accordion-title small{color:var(--soeb-ink-soft);font-size:.92rem}
.soeb-energy-plan__why{display:block;font-size:.92rem;color:var(--soeb-ink-soft);line-height:1.55;margin-top:4px}
.soeb-energy-plan__why b{color:var(--soeb-pine);font-weight:600}
.soeb-energy-plan__more-label{font-family:var(--soeb-mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--soeb-ink-soft)}

.soeb-energy-plan__small-print{font-size:.85rem;color:var(--soeb-ink-soft)}

/* ── 7. REFERRAL BAR — on-system, compact mobile ──────────────────────── */
.octo-ref{background:var(--soeb-forest-2);border-top:1px solid var(--soeb-line-dark);
  box-shadow:var(--soeb-shadow-float);padding-bottom:env(safe-area-inset-bottom,0px)}
.octo-ref__inner{display:flex;align-items:center;gap:var(--soeb-space-5);padding:14px var(--soeb-space-6)}
.octo-ref__headline{color:#fff;font-family:var(--soeb-font);font-weight:600;font-size:.98rem}
.octo-ref__support{color:var(--soeb-mist);font-size:.82rem}
.octo-ref__cta{background:var(--soeb-mint);color:var(--soeb-forest);border-radius:var(--soeb-radius-pill);
  padding:13px 26px;font-weight:600;font-size:.95rem;box-shadow:none;
  transition:background .18s ease,transform .06s ease}
.octo-ref__cta:hover{background:var(--soeb-mint-tint);color:var(--soeb-forest);transform:none}
.octo-ref__cta:active{transform:translateY(1px)}
.octo-ref__cta:focus-visible{outline:2px solid var(--soeb-mint);outline-offset:3px}
.octo-ref__short{display:none;color:#fff;font-weight:600;font-size:.95rem}
@media(max-width:640px){
  /* MOBILE REQUIREMENT: substantially more compact — one line, one message. */
  .octo-ref__inner{padding:10px var(--soeb-space-4);gap:var(--soeb-space-3);justify-content:space-between}
  .octo-ref__headline,.octo-ref__support{display:none}
  .octo-ref__short{display:block}
  .octo-ref__cta{padding:11px 20px;font-size:.9rem;flex:0 0 auto}
}

/* ── 8. PRINT — "Print my plan" ───────────────────────────────────────── */
@media print{
  .site-header,.site-footer,.octo-ref,.scroll-top,
  .soeb-hp__hero,.soeb-hp__tools,.soeb-hp__guides,.soeb-hp__trust,
  .soeb-energy-plan__steps,.soeb-energy-plan__result-actions{display:none}
  .soeb-energy-plan__result{display:block}
  .soeb-energy-plan__result-head{background:none;color:#000;border:1px solid #000;border-radius:0}
  .soeb-energy-plan__result-head h2,.soeb-energy-plan__result-intro,.soeb-energy-plan__summary{color:#000}
  .soeb-energy-plan__accordion{page-break-inside:avoid}
  .soeb-energy-plan__accordion[open] summary~*{display:block}
}

@media(prefers-reduced-motion:reduce){
  .soeb-btn,.soeb-btn .soeb-btn-arrow,.soeb-arrow-link::after,
  .soeb-energy-plan__choice,.soeb-energy-plan__button,.octo-ref__cta,.soeb-index__num{transition:none}
}