/* ====================================================================================================== File: eco.css Path: /assets/css/eco/eco.css Version: v1.1.1 Issued: 2026-07-21 Owner: Buktika Webdesk (Binka) Scope: Page-specific token binding for /eco/eco.html - the ECO pillar page. Per _page-template.css convention: page CSS overrides --page-accent (and siblings) binding only; structure comes from global.css + partials/public-entity.css. Notes: No commissioned photography exists yet for this entity - the hero uses a linear-gradient() built from the existing eco and restoration colour tokens (already defined in global.css for the Eco/Restoration channel badges used elsewhere on the site, e.g. Viridians jurisdiction cards) rather than a photo. Changelog: v1.1.1 (2026-07-21): Root cause of the long-standing hero-image anomaly found and fixed. An earlier version of this comment block described the colour tokens using a pattern that combined a trailing asterisk with a following forward slash. That two-character combination is the CSS block-comment terminator, so it closed this comment far earlier than intended, leaving several lines - including the .page-eco rule below - to be parsed as invalid CSS and discarded by the browser's error recovery. The .hero-wrap rule below still worked because it sits after the point where a later, unrelated comment closed normally and parsing resynced. Confirmed via the browser CSSOM: this file was parsing to one rule instead of two, and --page-bg and its sibling tokens were empty on as a result. Fix: reworded this comment to avoid the terminator pattern entirely; no rule changed. Full forensic detail is in the outer-repo implementation report rather than here, specifically to avoid repeating the same character pattern inside this file. Regression check: this file must parse to exactly two top-level rules. v1.1.0 (2026-07-21): Batch 2 consolidation (public-entity.css v1.1.0) moved the generic .entity-page { background; color } and .entity-page .sdx-btn-primary rules to the shared partial; this file keeps only its --page-* token bindings for those. Deliberately NOT consolidated: .page-eco .hero-wrap stays fully self-contained here, including background-size/position/min-height that are otherwise identical to the shared .entity-page .hero-wrap rule. v1.0.3 (2026-07-21): background-image set directly on .page-eco .hero-wrap instead of via a --hero-image custom-property indirection, as a workaround while the real cause (see v1.1.1 above) was still unknown. Superseded below. v1.0.2 (2026-07-21): Simplified to a two-stop gradient (superseded by v1.0.3). v1.0.1 (2026-07-21): Merged the two consecutive ".page-eco" rule blocks into one (kept). ====================================================================================================== */ .page-eco { --page-bg: var(--sdx-color-shell-bg); --page-primary: var(--sdx-color-eco-muted); --page-secondary: var(--sdx-color-eco-mint); --page-accent: var(--sdx-color-leaf-green); --page-depth: var(--sdx-color-eco-dark-base); } /* Deliberately self-contained — see v1.1.0 changelog above. Do not split this rule across files or route it through --hero-image; both have previously broken this specific page. */ .page-eco .hero-wrap { background-image: linear-gradient(135deg, var(--sdx-color-eco-dark-base) 0%, var(--sdx-color-eco-muted) 55%, var(--sdx-color-restoration-glow) 100%); background-size: cover; background-position: center; min-height: 420px; }