/* ==========================================================================
   DwellSpace — design tokens (colors + typography).
   Values match the apps/web Tailwind theme tokens 1:1 so marketing and
   portal feel like the same brand. Referenced by every marketing page
   and by the Login/Signup mocks.
   ========================================================================== */

:root {
  /* Ink — copy + foreground */
  --ds-ink:            #0A1A12;
  --ds-ink-muted:      #4B5A52;
  --ds-ink-soft:       #6B7A72;

  /* Surfaces — light mode */
  --ds-surface:        #F8FAF9;
  --ds-surface-raised: #FFFFFF;
  --ds-surface-sunken: #EDF2EE;

  /* Hairlines */
  --ds-hairline:        #DCE3DE;
  --ds-hairline-strong: #C7D0CA;

  /* Brand — deep forest + supporting tints */
  --ds-brand:       #2F5D3A;
  --ds-brand-deep:  #1F4028;
  --ds-brand-light: #9CCCA6;
  --ds-brand-tint:  #D7E4D8;
  --ds-brand-wash:  #F1F6F0;

  /* Dark sections */
  --ds-ink-surface:        #0A1A12;
  --ds-ink-surface-raised: #13261B;
  --ds-ink-hairline:       #1F3226;

  /* Typography stacks — Google Fonts loaded per page */
  --font-sans:    "Inter", ui-sans-serif, system-ui, sans-serif;
  --font-display: "Playfair Display", Georgia, "Times New Roman", serif;
  --font-mono:    "JetBrains Mono", ui-monospace, SFMono-Regular, monospace;

  /* Shadows */
  --shadow-card:   0 1px 2px rgba(10, 26, 18, 0.04), 0 12px 32px -16px rgba(10, 26, 18, 0.1);
  --shadow-raised: 0 2px 4px rgba(10, 26, 18, 0.06), 0 32px 60px -28px rgba(10, 26, 18, 0.2);
  --shadow-brand:  0 10px 30px -12px rgba(47, 93, 58, 0.45);
}
