/* ============================================================
   MVBH Design System — tokens + base
   Brand: deep plum / mauve / cream / peach / teal
   Type: Cormorant Garamond (display) + Work Sans (body)
   ============================================================ */
:root{
  /* palette */
  --plum:#30172a; --plum-2:#4a2240; --plum-3:#1a0e17;
  --mauve:#a2898b; --mauve-soft:#c9b4b6;
  --cream:#e0dccf; --cream-light:#f4f1ea;
  --peach:#f9a45b; --teal:#82c0c7;
  --off-white:#fafafa;
  --line:rgba(48,23,42,0.12);
  /* readable ink — solid, not diluted */
  --ink:#2a1a26; --ink-soft:#3d2636; --ink-mute:#5c4651;
  /* type */
  --font-display:'Cormorant Garamond',Georgia,serif;
  --font-body:'Work Sans',-apple-system,BlinkMacSystemFont,sans-serif;
  /* fluid scale */
  --text-xs:clamp(0.75rem,0.7rem + 0.2vw,0.8rem);
  --text-sm:clamp(0.85rem,0.8rem + 0.3vw,0.95rem);
  --text-base:clamp(1.02rem,0.97rem + 0.25vw,1.12rem);
  --text-lg:clamp(1.25rem,1rem + 0.9vw,1.6rem);
  --text-xl:clamp(1.8rem,1.3rem + 1.8vw,2.6rem);
  --text-2xl:clamp(2.4rem,1.5rem + 3.2vw,4rem);
  --text-hero:clamp(3rem,1rem + 6.5vw,6.5rem);
  /* spacing */
  --s-2:0.5rem;--s-3:0.75rem;--s-4:1rem;--s-6:1.5rem;--s-8:2rem;
  --s-10:2.5rem;--s-12:3rem;--s-16:4rem;--s-20:5rem;--s-24:6rem;--s-32:8rem;
  /* shadows */
  --shadow-sm:0 1px 2px rgba(48,23,42,0.06);
  --shadow-md:0 8px 28px rgba(48,23,42,0.10);
  --shadow-lg:0 24px 60px rgba(48,23,42,0.16);
  --radius:14px; --radius-lg:22px; --radius-pill:999px;
  --ease:cubic-bezier(0.16,1,0.3,1);
  --wrap:min(1200px,92%);
  --wrap-narrow:min(820px,90%);
}
[data-theme="dark"]{
  --plum:#1a0e17; --plum-2:#2a1522;
  --cream:#22141d; --cream-light:#1c1019;
  --off-white:#14090f; --line:rgba(255,255,255,0.10);
  --mauve-soft:#c9b4b6;
  --ink:#f5efe9; --ink-soft:#d8c9cd; --ink-mute:#b3a0a6;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body{font-family:var(--font-body);font-size:var(--text-base);line-height:1.7;color:var(--ink);background:var(--off-white);overflow-x:hidden}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:600;line-height:1.1;text-wrap:balance;letter-spacing:-0.01em}
p{text-wrap:pretty;max-width:68ch}
::selection{background:var(--mauve);color:#fff}
.wrap{width:var(--wrap);margin-inline:auto}
.wrap-narrow{width:var(--wrap-narrow);margin-inline:auto}
.eyebrow{font-family:var(--font-body);font-size:var(--text-xs);font-weight:600;letter-spacing:0.22em;text-transform:uppercase;color:var(--mauve)}
.serif-em{font-style:italic;color:var(--mauve)}
.lead{font-size:var(--text-lg);color:var(--ink-soft);font-weight:400}
/* reveal animation — progressive enhancement: content visible by default, hidden only when JS adds reveal-ready */
.reveal{opacity:1;transform:none;transition:opacity .8s var(--ease),transform .8s var(--ease)}
html.reveal-ready .reveal:not(.in){opacity:0;transform:translateY(28px)}
html.reveal-ready .reveal.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){html.reveal-ready .reveal{opacity:1!important;transform:none!important;transition:none!important}html{scroll-behavior:auto}}