/* =============================================================
   SNELGROVE ICE CREAM — Design Tokens
   Nostalgic & Retro, Est. 1929
   Official Brand Color Palette applied.
   Typography: GT America (body), Brandon Grotesque (headings), FunkiDori (accent).
   ============================================================= */

:root {
  /* --- Official Brand Colors --- */
  --color-cherry:       #EF433A;   /* Cherry on Top — primary CTA / red */
  --color-cherry-dark:  #C9322A;   /* Darker cherry for hover states */
  --color-cherry-light: #FDECEA;   /* Very light cherry tint */

  --color-blueberry:    #264E7B;   /* Blueberry — dark navy, headers & dark sections */
  --color-blueberry-dark: #1A3856; /* Deeper navy for hover */
  --color-blueberry-light:#E8EFF7; /* Light navy tint */

  --color-candy-pink:   #F7D2DF;   /* Candy Pink — accent / highlight */
  --color-banana-split: #F4E6AC;   /* Banana Split — warm yellow/gold accent */
  --color-banana-dark:  #C9B56A;   /* Deeper banana for text on light */

  --color-vanilla:      #FCF0E4;   /* Vanilla — warm page background */
  --color-melted:       #FAEEEE;   /* Melted Ice Cream — alternate section bg */

  --color-pistachio:    #BACEAF;   /* Pistachio — green accent */
  --color-mint-chip:    #E3EFD3;   /* Mint Chip — light green bg */

  /* --- Neutral / Text --- */
  --color-white:        #FFFFFF;
  --color-off-white:    #FDFAF7;
  --color-text:         #264E7B;   /* Default body text = Blueberry */
  --color-text-mid:     #4A6E91;   /* Mid-tone text */
  --color-text-light:   #8AAABF;   /* Muted text */
  --color-border:       #EDE0D8;   /* Subtle border */

  /* --- Semantic aliases --- */
  --color-primary:      var(--color-cherry);
  --color-primary-dark: var(--color-cherry-dark);
  --color-bg:           var(--color-vanilla);
  --color-bg-alt:       var(--color-melted);
  --color-accent:       var(--color-banana-split);
  --color-accent-dark:  var(--color-banana-dark);
  --color-dark:         var(--color-blueberry);
  --color-dark-deep:    var(--color-blueberry-dark);

  /* --- Typography --- */
  --font-display:       'Brandon Grotesque', 'Helvetica Neue', sans-serif;  /* headings — Medium 500 / Bold 700 */
  --font-script:        'FunkiDori', cursive;                               /* decorative brand accent (stamps, taglines) */
  --font-body:          'GT America', 'Helvetica Neue', sans-serif;         /* body copy */

  /* --- Font Sizes --- */
  --text-xs:    0.75rem;
  --text-sm:    0.875rem;
  --text-base:  1rem;
  --text-lg:    1.125rem;
  --text-xl:    1.25rem;
  --text-2xl:   1.5rem;
  --text-3xl:   1.875rem;
  --text-4xl:   2.25rem;
  --text-5xl:   3rem;
  --text-6xl:   3.75rem;
  --text-7xl:   4.5rem;

  /* --- Spacing --- */
  --space-1:    0.25rem;
  --space-2:    0.5rem;
  --space-3:    0.75rem;
  --space-4:    1rem;
  --space-5:    1.25rem;
  --space-6:    1.5rem;
  --space-8:    2rem;
  --space-10:   2.5rem;
  --space-12:   3rem;
  --space-16:   4rem;
  --space-20:   5rem;
  --space-24:   6rem;
  --space-32:   8rem;

  /* --- Border Radius --- */
  --radius-sm:  4px;
  --radius-md:  8px;
  --radius-lg:  16px;
  --radius-xl:  24px;
  --radius-full: 9999px;

  /* --- Shadows (tinted with blueberry) --- */
  --shadow-sm:  0 1px 3px rgba(38, 78, 123, 0.10);
  --shadow-md:  0 4px 12px rgba(38, 78, 123, 0.14);
  --shadow-lg:  0 8px 24px rgba(38, 78, 123, 0.18);
  --shadow-xl:  0 16px 48px rgba(38, 78, 123, 0.22);

  /* --- Transitions --- */
  --transition-fast:   150ms ease;
  --transition-base:   250ms ease;
  --transition-slow:   400ms ease;

  /* --- Layout --- */
  --container-max:     1200px;
  --container-wide:    1440px;
  --nav-height:        80px;
}