/* VENDORED from @roamfreevhr/design-system@0.6.0 (dist/roam-free/tokens.css).
   Generated by scripts/sync-tokens.js — do not edit here.
   Change tokens in the design-system repo, publish, bump the version, re-sync. */
/**
 * Do not edit directly, this file was auto-generated.
 */

:root {
  --container-max: 1200px;
  --container-sm: 720px; /** Narrow reading-column max width for prose and single-column forms. Pairs with container.max; the snapshot's bare --container is this repo's container.max and is aliased in compat/roam-free.css. */
  --container-pad: 24px;
  --breakpoint-mobile: 640px;
  --breakpoint-tablet: 768px;
  --breakpoint-desktop: 1024px;
  --motion-duration-fast: 150ms;
  --motion-duration-base: 250ms;
  --motion-duration-slow: 400ms;
  --motion-easing-standard: ease;
  --motion-easing-out: ease-out;
  --motion-easing-in-out: ease-in-out;
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-card: 12px;
  --radius-lg: 16px;
  --radius-pill: 40px;
  --radius-full: 9999px;
  --radius-btn: 8px; /** Buttons and other small interactive controls. Slots cleanly into the 6/8/10/12 ramp. */
  --radius-card-lg: 18px; /** Feature/promo cards. Sits 2px above radius.lg because it was authored against a 14px card in the snapshot while this repo's radius.card is 12px. Use it for cards specifically; for a generic large surface use radius.lg. */
  --radius-hero: 20px; /** Hero panels and full-bleed media blocks - the largest non-pill radius. */
  --space-0: 0px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --type-h1-size: clamp(2rem, 5vw, 3.25rem);
  --type-h2-size: clamp(1.6rem, 3vw, 2.25rem);
  --type-h2-leading: 1.2;
  --type-h3-size: clamp(1.1rem, 1.6vw, 1.35rem);
  --type-h3-leading: 1.3;
  --type-h4-size: 1rem;
  --type-body-size: 1rem;
  --type-small-size: 0.875rem;
  --type-small-leading: 1.55;
  --type-eyebrow-size: 0.72rem;
  --type-eyebrow-tracking: 2.5px; /** Letter-spacing for the eyebrow role. Recovered from the .eyebrow rule in the brand snapshot, which is the only role that sets tracking. text-transform: uppercase is part of that rule too but is not a value - it belongs in a component stylesheet, not a token. */
  --font-size-xs: 12px;
  --font-size-sm: 14px;
  --font-size-base: 16px;
  --font-size-lg: 18px;
  --font-size-xl: 24px;
  --font-size-2xl: 32px;
  --font-size-3xl: 44px;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  --font-leading-tight: 1.15;
  --font-leading-snug: 1.35;
  --font-leading-normal: 1.6;
  --font-family-display: Sora, system-ui, sans-serif;
  --font-family-body: Figtree, system-ui, sans-serif;
  --font-family-brand: Pacifico, cursive;
  --font-family-editorial: Spectral, serif;
  --color-surface: #fdfbf7;
  --color-card: #ffffff;
  --color-white: #ffffff;
  --color-text: #1a1a1a;
  --color-muted: #555555;
  --color-line: #e7e2d8;
  --color-brand: #2c7c73;
  --color-brand-strong: #1f5c55;
  --color-brand-deep: #174742;
  --color-brand-soft: #e8f4f3;
  --color-brand-bright: #3a9b90;
  --color-brand-pale: #e8f5f3;
  --color-brand-mist: #f0f9f8;
  --color-brand-haze: #d4ecea; /** The DEEPEST opaque teal tint - the bottom of the mist/pale/soft group and the last step before the saturated brand-bright. Ordered by lightness the group runs mist L*97.2, pale L*95.6, soft L*95.3, haze L*91.7, then brand-bright drops to L*58.4. Minted because nothing else covers this step: the nearest existing tint is brand-pale at delta-E 5.44, a visibly different colour rather than drift, so the blog table hover had to stay a raw literal through the whole WS1 migration. First and only consumer is that hover state, where it reads as one step deeper than the brand-soft even-row fill. Use it for a tint that must be distinguishable from brand-soft when the two sit adjacent; if the two never touch, prefer brand-soft. */
  --color-accent: #c4a265;
  --color-accent-light: #dcc596;
  --color-neutral-100: #f3f4f6;
  --color-neutral-200: #e5e7eb;
  --color-neutral-300: #d1d5db;
  --color-neutral-400: #9ca3af;
  --color-neutral-500: #6b7280;
  --color-neutral-700: #404040;
  --color-dark-bg: #141414;
  --color-dark-surface: #1e1e1e;
  --color-dark-card: #252525;
  --color-dark-line: rgba(255, 255, 255, 0.08);
  --color-surface-alt: #f9f9f6; /** Alternating SECTION background on the light skin. Not a counterpart to dark-surface: on the light skin, surface is the page ground and surface-alt is a banded section on top of it; on the dark skin, dark-bg is the page ground and dark-surface is the band. */
  --color-surface-stone: #f4efe6; /** The WARM tint. Primarily a section band - it carries .rf-section-stone, .rf-pullquote, .rf-inquiry and the about-page family block - but also the general-purpose pale warm ground, e.g. a badge behind accent text. Second band alongside surface-alt, not a replacement: surface-alt (#f9f9f6) is the near-white quiet band, surface-stone is the warm one used where a section should read as a deliberate pause. Absorbed the retired accent-soft (#F6F0E5) in 0.5.0; the two sat at delta-E 1.15, which is one colour drifted apart rather than two colours. */
  --color-accent-strong: #b8944f; /** Darker gold. Parallels brand-strong on the teal ramp. Not a dark-theme variant - the dark-* prefix is reserved for that. */
  --color-accent-wash: rgba(196, 162, 101, 0.12); /** Translucent gold overlay for gradient stops and washes over any ground. Distinct from surface-stone (#F4EFE6), which is the OPAQUE pale warm tint and cannot be composited. */
  --color-brand-wash: rgba(44, 124, 115, 0.15); /** Translucent teal overlay - the teal partner to accent-wash. Distinct from brand-pale (#E8F5F3), which is the OPAQUE pale teal. */
  --color-dark-card-alt: #2a2a2a; /** Raised/alternate card on the dark skin, one step above dark-card. Fourth stop in the dark elevation ramp: dark-bg -> dark-surface -> dark-card -> dark-card-alt. The light skin has no fourth step. */
  --color-error: #d32f2f; /** Error / destructive foreground on LIGHT surfaces. */
  --color-dark-error: #ef5350; /** Error / destructive foreground on DARK surfaces. Deliberately LIGHTER than color.error - dark-* means 'used on dark', never 'a darker shade of'. success / warning / info are undefined by the brand; do not invent them. */
  --shadow-card: 0 2px 12px rgba(0,0,0,.06);
  --shadow-card-hover: 0 8px 24px rgba(44,124,115,.12);
  --shadow-elev: 0 4px 24px rgba(0,0,0,.08);
  --shadow-gold: 0 2px 16px rgba(196,162,101,.20);
  --shadow-gold-hover: 0 6px 24px rgba(196,162,101,.30);
  --motion-transition-base: var(--motion-duration-base) var(--motion-easing-standard); /** Default transition shorthand. This is the token the snapshot's --ease (.25s ease) actually maps to - the snapshot's name says easing but its value is a full shorthand. */
  --type-h1-weight: var(--font-weight-bold);
  --type-h1-leading: var(--font-leading-tight);
  --type-h2-weight: var(--font-weight-bold);
  --type-h3-weight: var(--font-weight-bold);
  --type-h4-weight: var(--font-weight-semibold);
  --type-h4-leading: var(--font-leading-snug);
  --type-body-weight: var(--font-weight-regular);
  --type-body-leading: var(--font-leading-normal);
  --type-small-weight: var(--font-weight-regular);
  --type-eyebrow-weight: var(--font-weight-bold);
  --gradient-hero: linear-gradient(135deg, var(--color-brand-strong) 0%, var(--color-brand) 100%); /** Primary teal hero gradient. NOTE: the 2026-07-18 snapshot wrote stop 1 as #1F5B54; this repo's canonical dark teal is color.brand-strong (#1f5c55) and compat already maps legacy --teal-dark onto it. Referencing the token keeps one dark teal instead of forking a second. */
  --gradient-dark-hero: radial-gradient(ellipse 80% 60% at 80% 20%, var(--color-accent-wash) 0%, transparent 55%), radial-gradient(ellipse 50% 70% at 10% 85%, rgba(44,124,115,0.10) 0%, transparent 45%), linear-gradient(170deg, #111 0%, var(--color-text) 50%, var(--color-dark-bg) 100%); /** Three-layer dark hero ground. The rgba(44,124,115,0.10) stop is left literal: it is 0.10 alpha, not the 0.15 of color.brand-wash, and a one-off gradient stop does not earn a token. #111 likewise has no token. */
}