/* Zarco Dental — design tokens.
   Imported verbatim from the Claude Design system (zarco-dental-design-system-a87ab8e0).
   Fonts load from the HTML head, not here. */
:root{
  /* Ink — deep clinical navy-slate. The primary dark. */
  --ink-900:#07161E;--ink-800:#0B1F2A;--ink-700:#132E3B;--ink-600:#1D414F;--ink-500:#2C5766;

  /* Teal — the brand primary. Clinical, trustworthy, not corporate blue. */
  --teal-900:#053B39;--teal-800:#075049;--teal-700:#0A6259;--teal-600:#0D7A6E;--teal-500:#129184;
  --teal-400:#3AAFA1;--teal-300:#79CCC1;--teal-200:#B4E5DD;--teal-100:#DDF3EF;--teal-50:#EEF9F7;

  /* Enamel — warm paper neutrals, v3: warmer cream, softer. Never pure white backgrounds. */
  --enamel-000:#FFFFFF;--enamel-050:#FAF7F1;--enamel-100:#F4EFE6;--enamel-200:#E8E2D6;
  --enamel-300:#D9D1C1;--enamel-400:#B9B2A2;--enamel-500:#8C867A;--enamel-600:#645F55;

  /* Signal — a single hot accent, used sparingly for conversion moments. */
  --signal-700:#B33A22;--signal-600:#D9502F;--signal-500:#F0663F;--signal-200:#FBD8CD;--signal-100:#FDECE6;

  /* Semantic aliases */
  --text-heading:var(--ink-900);
  --text-body:var(--ink-600);
  --text-muted:var(--enamel-600);
  --text-inverse:var(--enamel-050);
  --text-inverse-muted:#A8C4C0;
  --text-brand:var(--teal-700);
  --text-link:var(--teal-700);
  --text-link-hover:var(--teal-900);

  --surface-page:var(--enamel-050);
  --surface-card:var(--enamel-000);
  --surface-sunken:var(--enamel-100);
  --surface-brand:var(--teal-700);
  --surface-brand-soft:var(--teal-50);
  --surface-ink:var(--ink-800);

  --border-subtle:var(--enamel-200);
  --border-default:var(--enamel-300);
  --border-strong:var(--ink-700);
  --border-brand:var(--teal-300);
  --border-focus:var(--teal-600);

  --action-primary-bg:var(--teal-700);
  --action-primary-bg-hover:var(--teal-800);
  --action-primary-bg-active:var(--teal-900);
  --action-primary-fg:var(--enamel-050);
  --action-accent-bg:var(--signal-600);
  --action-accent-bg-hover:var(--signal-700);
  --action-disabled-bg:var(--enamel-200);
  --action-disabled-fg:var(--enamel-500);

  --background-primary:var(--enamel-050);
  --background-secondary:var(--enamel-100);
  --background-inverse:var(--ink-900);
  --background-raised:var(--enamel-000);
  --text-primary:var(--ink-900);
  --text-secondary:var(--ink-600);
  --accent-primary:var(--teal-700);
  --accent-subtle:var(--teal-100);
  --accent-inverse:var(--teal-300);
  --border-hairline:var(--enamel-200);
  --border-rule:var(--enamel-300);
  --border-rule-inverse:rgba(255,255,255,.16);

  /* Type */
  --font-display:"Epilogue","Helvetica Neue",Helvetica,sans-serif;
  --font-editorial:"Instrument Serif",Georgia,"Times New Roman",serif;
  --font-sans:"Manrope","Helvetica Neue",Helvetica,sans-serif;
  --font-mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;

  --fw-regular:400;--fw-medium:500;--fw-semibold:600;--fw-bold:700;--fw-black:800;

  --fs-eyebrow:0.75rem;
  --fs-caption:0.8125rem;
  --fs-small:0.875rem;
  --fs-body:1rem;
  --fs-body-lg:1.125rem;
  --fs-lead:1.3125rem;
  --fs-h5:1.25rem;
  --fs-h4:1.5rem;
  --fs-h3:1.9375rem;
  --fs-h2:2.5rem;
  --fs-h1:3.25rem;
  --fs-display:4.5rem;
  --fs-display-xl:6rem;

  --lh-tight:1.02;--lh-heading:1.1;--lh-snug:1.32;--lh-body:1.6;--lh-loose:1.75;

  --ls-display:-0.042em;--ls-heading:-0.028em;--ls-body:-0.006em;--ls-eyebrow:0.14em;--ls-mono:0.02em;

  --type-editorial-scale:1.06;

  /* Spacing — 4px base grid */
  --space-1:2px;--space-2:4px;--space-3:8px;--space-4:12px;--space-5:16px;
  --space-6:20px;--space-7:24px;--space-8:32px;--space-9:40px;--space-10:48px;
  --space-12:56px;--space-14:64px;--space-16:80px;--space-20:96px;--space-24:120px;--space-32:160px;

  --section-y:var(--space-24);
  --section-y-compact:var(--space-16);

  /* Radius — v3: soft. Pills for actions, rounded imagery. */
  --radius-xs:4px;--radius-sm:6px;--radius-md:10px;--radius-lg:14px;--radius-xl:18px;--radius-2xl:26px;--radius-pill:999px;
  --radius-control:999px;--radius-card:16px;--radius-panel:20px;--radius-media:14px;--radius-input:10px;

  /* Elevation — ink-tinted, soft, borders do the separating */
  --shadow-sm:0 1px 3px rgba(7,22,30,.06),0 1px 2px rgba(7,22,30,.04);
  --shadow-md:0 6px 18px -6px rgba(7,22,30,.14),0 2px 6px rgba(7,22,30,.05);
  --shadow-lg:0 18px 40px -14px rgba(7,22,30,.20),0 4px 12px rgba(7,22,30,.06);
  --shadow-xl:0 40px 80px -28px rgba(7,22,30,.28);
  --shadow-focus:0 0 0 3px var(--teal-200);
  --overlay-glass:rgba(251,250,248,.86);
  --blur-glass:blur(14px);
  --scrim-bottom:linear-gradient(to top,rgba(7,22,30,.78) 0%,rgba(7,22,30,.35) 45%,rgba(7,22,30,0) 100%);

  /* Motion */
  --ease-standard:cubic-bezier(.2,.8,.25,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
  --ease-draw:cubic-bezier(.22,1,.36,1);
  --dur-instant:80ms;--dur-fast:140ms;--dur-base:220ms;--dur-slow:380ms;
  --dur-reveal:600ms;--dur-mask:760ms;--dur-draw:900ms;
  --stagger:70ms;--reveal-shift:14px;--arrow-nudge:4px;

  /* Layout */
  --container-max:1200px;
  --container-narrow:760px;
  --container-wide:1440px;
  --header-h:88px;
  --header-h-scrolled:62px;
  --gutter:clamp(16px, 4vw, 48px);
  --z-header:200;--z-overlay:300;
  --rule-accent-thickness:2px;
}

@media (prefers-reduced-motion:reduce){
  :root{
    --dur-instant:0ms;--dur-fast:0ms;--dur-base:0ms;--dur-slow:0ms;
    --dur-reveal:0ms;--dur-mask:0ms;--dur-draw:0ms;--stagger:0ms;--reveal-shift:0px;
  }
}