/** * Esteri theme — visual layer. * * theme.json owns global tokens (palette, font families, sizes, layout). * This file owns: * 1. Lovable-source CSS-variable polyfill (--wire-edge, hero gradients, --radius). * 2. Reusable pattern primitives ported from `source/src/index.css` * (.wire-label, .tile-engineered, .wire-section, .wire-container). * 3. Theme-side overrides for core blocks (button, link, group) where * theme.json alone isn't enough. * * Block-specific CSS (mega-menu rendering, sticky CTA, carousel scroll-snap, * etc.) lives in the companion plugin sl-esteri-core, scoped to each block's * class prefix. */ /* ─── Global border-box reset (port of Tailwind Preflight) ────────── * The Lovable source is Tailwind, whose Preflight applies * *, ::before, ::after { box-sizing: border-box } * to EVERY element. This port originally dropped that global invariant * and sprinkled `box-sizing: border-box` on individual components * instead — so any element the port forgot defaulted to the browser's * `content-box`. That silently broke every width-capping rail emitted * as a BARE

from a dynamic block's render.php (`.wire-container`, * `.esteri-breadcrumbs`, the product-grid filter/listing): `max-width` * capped only their content box, the +2×--wire-edge padding pushed them * past the cap to full-bleed, and `margin-inline:auto` could no longer * centre them — so those rails sat ~--wire-edge left of every * core-block rail (which DID inherit border-box from WP's `.wp-block-*` * reset). Restoring the global reset is the load-bearing fix: it matches * the source, fixes the whole class at once, and makes the scattered * per-component `box-sizing` patches (e.g. the carousel-nav rule below) * redundant. Do not remove. (Caught on /tuotteet/:category rails, * 2026-06-07 — see skill-additions/dynamic-block-full-bleed-bands.md.) */ *, *::before, *::after { box-sizing: border-box; } /* ─── Form-control font inheritance (port of Tailwind Preflight) ───── * Sibling to the box-sizing reset above, and dropped from the original * port for the same reason. Tailwind Preflight applies * button, input, optgroup, select, textarea { font-family: inherit } * so native controls render in the body font (Inter). Without it, every *