/* One visual language for the editorial pages: the same palette, rhythm and card system as the home page. */
:root { --unify-ink:#0b343d; --unify-deep:#082f38; --unify-paper:#f6f8f2; --unify-lime:#c9f06d; --unify-green:#3d7b68; --unify-line:#d1dfd4; }
.content-page { background:var(--unify-paper); color:var(--unify-ink); }
.content-page :is(h1,h2,h3) { text-wrap:balance; }
.content-page :is(.finance-page,.battery-page,.energy-plan-page,.knowledge-page,.congestion-page) { color:var(--unify-ink); }

/* Shared high-contrast introduction used by all detail pages. */
:is(.finance-hero,.battery-hero,.plan-hero,.knowledge-hero,.congestion-hero) { position:relative; isolation:isolate; background-color:var(--unify-deep); }
:is(.finance-hero,.battery-hero,.plan-hero,.knowledge-hero,.congestion-hero)::before { content:""; position:absolute; z-index:0; inset:0; opacity:.38; background-image:linear-gradient(#6f978f26 1px,transparent 1px),linear-gradient(90deg,#6f978f26 1px,transparent 1px),radial-gradient(circle at 8% 85%,#558e5c49,transparent 29%); background-size:72px 72px,72px 72px,auto; pointer-events:none; }
:is(.finance-hero,.battery-hero,.plan-hero,.knowledge-hero,.congestion-hero)>.shell { position:relative; z-index:1; }
:is(.finance-page,.battery-page,.energy-plan-page,.knowledge-page,.congestion-page) :is(h1,h2) { font-weight:750; letter-spacing:-.065em; }
:is(.finance-page,.battery-page,.energy-plan-page,.knowledge-page,.congestion-page) :is(.eyebrow,.plan-kicker) { font-size:10px; font-weight:850; letter-spacing:.14em; }

/* The same restrained, square card system as the homepage. */
:is(.finance-route,.finance-investment,.finance-steps li,.battery-cases article,.battery-route__steps li,.plan-card-grid article,.plan-info-panel,.knowledge-grid a,.congestion-cards article) { border-radius:0; box-shadow:none; }
:is(.finance-route,.finance-investment,.finance-steps li,.battery-cases article,.battery-route__steps li,.plan-card-grid article,.knowledge-grid a,.congestion-cards article) { border-color:var(--unify-line); }
.finance-route:hover,.battery-cases article:hover,.plan-card-grid article:hover,.knowledge-grid a:hover { border-color:#91b58d; }

/* Keep explanatory areas airy and recognisable throughout the site. */
:is(.finance-fit,.battery-dimension,.plan-highlight,.knowledge-content,.congestion-explain) { background:#f3f7ef; }
:is(.finance-section,.battery-page .section-space,.plan-section,.plan-highlight,.plan-faq,.knowledge-content,.congestion-explain) { padding-block:clamp(76px,8vw,124px); }
:is(.finance-section-heading,.battery-section-heading,.plan-section-intro,.knowledge-intro,.congestion-intro) { margin-bottom:clamp(36px,4vw,56px); }
:is(.finance-section-heading>p,.battery-section-heading>p,.plan-section-intro>p,.knowledge-intro>p,.congestion-intro>p) { color:#567369; }

/* CTA treatment matches the home page and remains readable on every background. */
.content-page :is(.primary-button,.plan-button,.home-button) { border-radius:2px; font-weight:800; letter-spacing:0; }
.content-page :is(.primary-button,.plan-button,.home-button):focus-visible { outline:3px solid var(--unify-lime); outline-offset:3px; }
.content-page :is(.text-link,.plan-text-link,.finance-inline-link) { font-weight:800; }

/* End sections are deliberately consistent: a clear dark close with a lime action. */
:is(.battery-final,.finance-final,.plan-final,.congestion-final) { background:var(--unify-deep); }
:is(.battery-final,.finance-final,.plan-final,.congestion-final) :is(.primary-button,.plan-button,.home-button) { background:var(--unify-lime); color:var(--unify-ink); }
.knowledge-final { background:#dff0b8; }

@media (max-width:900px) {
  :is(.finance-section,.battery-page .section-space,.plan-section,.plan-highlight,.plan-faq,.knowledge-content,.congestion-explain) { padding-block:72px; }
}

@media (max-width:560px) {
  :is(.finance-page,.battery-page,.energy-plan-page,.knowledge-page,.congestion-page) :is(h1,h2) { letter-spacing:-.055em; }
  :is(.finance-hero,.battery-hero,.plan-hero,.knowledge-hero,.congestion-hero)::before { background-size:44px 44px,44px 44px,auto; }
}