:root {
  /* Base type */
  --font-sans: 'Quicksand', sans-serif;
  --font-logo: 'Vibes', cursive;

  /* Type scale */
  
  --font-size-h1: 3.052rem;
  --font-size-h2: 2.441rem;
  --font-size-h3: 1.953rem;
  --font-size-h5: 1.563rem;
  --font-size-ul: 1.25rem;  /*20px*/
  --font-size-p: 1rem; /*16px*/
  --font-size-small: 0.875rem; /*14px*/
  --font-size-too-small: 0.64rem;
  --line-height: 1.5;

  /* Primary (orange family) */
  --primary-50:  #FBE7E5;
  --primary-100: #FEC7B7;
  --primary-200: #FDA289;
  --primary-300: #FB7D5A;
  --primary-400: #FA5F36;
  --primary-500: #F84011; /* main */
  --primary-600: #ED3A0D;
  --primary-700: #df3307;
  --primary-800: #D12C03;
  --primary-900: #B81d00;

  

  /* Accent (green family) */
  --accent-50:  #e6f1ec;
  --accent-100: #c1dcd0;
  --accent-200: #9ec6b4;
  --accent-300: #80AF99;
  --accent-400: #6F9E87;
  --accent-500: #618E76; /* main accent */
  --accent-600: #59816B;
  --accent-700: #50715E;
  --accent-800: #476252;
  --accent-900: #36463B;

  --accent-extra: #4ca67c;

  /* Neutral scale (light -> dark) */
  --neutral-50:  #FFFAEF; /* floral white */
  --neutral-100: #FFF6F0;
  --neutral-200: #F6F1E6;
  --neutral-300: #ECE7D9;
  --neutral-400: #E2DDCF;
  --neutral-500: #D8D3C3;
  --neutral-600: #CFC9B8;
  --neutral-700: #BFB8A7;
  --neutral-800: #9D9485;
  --neutral-900: #8C8275;

  /* Semantic tokens */
  --color-bg: var(--neutral-50);
  --color-surface: var(--neutral-100);
  --color-border: var(--neutral-300);
  --color-text: #1E1E1E;
  --color-text-muted: #BAB5B5;
  --color-accent: var(--accent-500);
  --color-primary: var(--primary-400);
  --color-error: var(--primary-800);
  --color-card: #fffff7;
  

  /* Spacing scale */
  --space-xs: 0.5rem;
  --space-s: 1rem;
  --space-m: 2rem;
  --space-l: 4rem;

  --block-padding:  6.1rem;
  --small-padding: 3.5rem;
  --inline-padding: 10.8rem;
  --main-padding: 2.75rem;

  /* Radii, shadows, borders, transitions */
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.06);
  --shadow-md: 0 6px 18px rgba(7, 7, 7, 0.06);
  --border-width: 1px;
  --transition-fast: 180ms;
  --transition: 280ms cubic-bezier(.2,.9,.2,1);
}
