/* ==========================================================================
   Radiant Living Family Care — Global Design Tokens
   Extracted from DESIGN-REFERENCE/src/Site.jsx and styles.css
   ========================================================================== */

:root {
  /* Committed light design — keep form controls light even on dark-mode OS */
  color-scheme: light;

  /* Color Palette */
  --cream:            #FBF8F3; /* Primary page background */
  --parchment:        #F1EADE; /* Panels, tag chips, accented rows */
  --parchment-warm:   #E4D8C7; /* Image placeholder frames & selection highlight */
  --white:            #FFFFFF; /* Card background on parchment */
  
  /* Text & Neutral Tones */
  --ink:              #16242F; /* Primary body text & dark headings */
  --slate-1:          #33454F; /* Navigation links */
  --slate-2:          #4A5A66; /* Long-form body copy */
  --slate-3:          #5A6B78; /* Captions, metadata, and subnotes */
  
  /* Navy Brand & Button Tones */
  --navy:             #1F3343; /* Deep navy sections, buttons, accent lines */
  --navy-hover:       #26404F; /* Navy button hover state */
  --dark-bg:          #16242F; /* Dark utility bar background */
  --dark-fg:          rgba(251,248,243,.72); /* Utility bar text */
  
  /* Terracotta Brand & Accent Tones */
  --terracotta:       #A65C3E; /* Primary CTA button background & brand accent */
  --terracotta-hover: #C77A56; /* Terracotta button hover */
  --terracotta-deep:  #8E4C31; /* Inline link color & light italic text */
  --blush:            #E8B396; /* Hero italic accent on dark navy */
  
  /* Semantic Badges & Indicator Tones */
  --sage:             #7FB069; /* Live availability dot pulse */
  --sage-solid:       #5C8A4E; /* Availability dot on light backgrounds */
  --sage-deep:        #41603A; /* Good-fit badge text */
  --sage-chip-bg:     #EAF0E6; /* Good-fit panel background */
  --amber-deep:       #8A5B24; /* Timing warning text */
  --amber-chip-bg:    #F7EEDD; /* Amber panel background */
  --red-deep:         #8A4B3C; /* Not-the-right-fit text */
  --red-chip-bg:      #F6E7E1; /* Red panel background */

  /* Typography Stacks */
  --font-serif:       Newsreader, Georgia, serif;
  --font-sans:        'Instrument Sans', system-ui, -apple-system, sans-serif;

  /* Layout & Geometry */
  --max-width:        1160px;
  --pad-x:            clamp(20px, 5vw, 56px);
  --pad-y-std:        clamp(48px, 6vw, 80px);
  --pad-y-hero:       clamp(56px, 7vw, 100px);
  
  /* Radii */
  --radius-card:      14px;
  --radius-tile:      6px;
  --radius-pill:      999px;
  --radius-arch:      6px 6px 190px 190px;
}
