/* Design tokens — Marvix Studio brand system */
:root {
  --teal: #006870; --teal-d: #00494f; --teal-dd: #00363b; --teal-ddd: #00282c;
  --cream: #FFEEDE; --cream-l: #fff8f1; --yellow: #FFDA00; --yellow-d: #e6c400;
  --ink: #0a2b2f; --muted: #5b6f72; --line: rgba(0, 54, 59, .12); --white: #fff; --danger: #c62828; --ok: #1b7f4b;

  --font-head: "Outfit", "Segoe UI", system-ui, sans-serif;
  --font-body: "DM Sans", "Segoe UI", system-ui, -apple-system, sans-serif;

  /* fluid type scale */
  --fs-hero: clamp(2.6rem, 1.2rem + 4vw, 4.4rem);
  --fs-h1: clamp(2.1rem, 1.3rem + 3.4vw, 3.9rem);
  --fs-h2: clamp(1.65rem, 1.2rem + 1.9vw, 2.55rem);
  --fs-h3: clamp(1.1rem, 1rem + .4vw, 1.3rem);
  --fs-lead: clamp(1rem, .95rem + .3vw, 1.18rem);

  --gutter: clamp(16px, 4vw, 40px);
  --maxw: 1240px;
  --sec-y: clamp(56px, 8vw, 104px);
  --r-sm: 10px; --r: 16px; --r-lg: 24px; --r-pill: 999px;
  --sh-1: 0 8px 24px rgba(0, 40, 44, .08); --sh-2: 0 18px 44px rgba(0, 40, 44, .16);
  --ease: cubic-bezier(.2, .7, .2, 1);
  --header-h: 72px;
  --safe-b: env(safe-area-inset-bottom, 0px);
}