/* ============================================================
   Autobedrijf Rietvelden — Design System (residue layer)

   Colors + fonts now live NATIVELY in Astra Global Colors (Customizer)
   and Elementor Global Colors/Typography (Site Settings) — see
   CLAUDE.md §9 for the palette slot map. Base palette, body font, and
   the heading/eyebrow/label/CTA/reveal helper classes were REMOVED
   2026-07-23 (plan Tasks 13/14, "trim to residue"): the native Astra +
   Elementor bindings already reproduce them at higher CSS specificity,
   verified against the live rendered cascade. What remains below is
   ONLY what Astra Free / Elementor Free genuinely cannot do natively.

   RELATIONSHIP TO THE CUSTOM BLOCKS:
     blocks/hero.html is SELF-CONTAINED: it re-declares its own scoped
     tokens (incl. its own `h1 em` / `.rv-eyebrow` italic-accent rules,
     scoped under .rv-hero) and ships its own CSS, so it still works
     even if this file is missing.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400&family=Inter:wght@300;400;500&display=swap');

/* residue after native-hybrid conversion (2026-07-23): colors/fonts now
   live in Astra + Elementor globals; these are the only pieces
   Free-tier cannot express natively. */
::selection{ background:var(--ast-global-color-0); color:var(--ast-global-color-4); }

/* NOTE (2026-07-23): the old `.rv-display em, .rv-accent{ font-style:
   italic; color:var(--accent); }` helper was dropped — verified it
   matches NOTHING live: blocks/hero.html has its own scoped `h1 em`
   rule, and the one other <em> in the rendered pages (Voorraad's "De
   volledige <em>collectie</em>") already carries its own inline
   style="font-style:italic;color:#8278d0", so it does not depend on
   this class either. Safe to remove per the task brief's condition. */

/* Muted lead paragraph — no "muted" global color SLOT exists (CLAUDE.md
   §9 derives alpha via color-mix(), not a static swatch a widget could
   bind to), so this is genuine Free-tier residue.
   IMPORTANT (verified 2026-07-23): the widget WRAPPER ties in
   specificity with Elementor's kit-wide `.elementor-widget-text-editor
   {color:var(--e-global-color-text)}` default (#7A7A7A), which loads
   AFTER this stylesheet in the document — a bare `.rv-lead{color}`
   alone would LOSE that tie and the <p> would inherit #7A7A7A. So the
   color declaration also targets `.rv-lead p` directly (one extra
   element selector => (0,1,1), unconditionally higher specificity than
   the kit's (0,1,0), regardless of load order) to guarantee the muted
   color. Checked against all 5 rv-lead widgets: 4 of them (home,
   inkoop, over-ons, verkocht) have a bare <p> with no inline color of
   its own and rely on this; Voorraad's already carries an inline
   color so is unaffected either way. Font-size/line-height/margin-top
   stay on the wrapper only (as before — they were never applied to
   the <p> directly and are inherited/independent respectively). */
.rv-lead, .rv-lead p{ color:color-mix(in srgb, var(--ast-global-color-2) 55%, transparent); }
.rv-lead{ font-size:16px; line-height:1.9; margin-top:26px; }
.rv-lead a{ color:var(--ast-global-color-0); text-decoration:none; }
.rv-lead a:hover{ color:var(--ast-global-color-2); }