/* Organic Modernism Design System (Updated Colors) */
:root {
  /* Core Colors */
  --chinin-red: #E30613;
  --chinin-red-dark: #b5000b;
  --ceramic-white: #FFFFFF;
  --tertiary-green: #004D40;
  --neutral-light: #F9F9F9;
  --dark-grey: #1a1c1c;
  
  /* Roles */
  --primary: var(--chinin-red);
  --primary-container: var(--chinin-red);
  --on-primary: var(--ceramic-white);
  
  --accent: var(--tertiary-green);
  --on-accent: var(--ceramic-white);
  
  --surface: var(--ceramic-white);
  --on-surface: var(--dark-grey);
  
  --surface-container-lowest: var(--ceramic-white);
  --surface-container-low: var(--neutral-light);
  --surface-container-highest: #eeeeee;
  
  --outline-variant: rgba(26, 28, 28, 0.2); 
  --outline-variant-light: rgba(26, 28, 28, 0.15);

  /* Typography */
  --font-family-base: 'Work Sans', sans-serif;
  --font-family-accent: 'Permanent Marker', cursive;
  
  /* Fluid Typography / Scale */
  --text-base: 1rem;
  --text-label-md: 0.875rem;
  --text-headline-lg: clamp(2rem, 5vw, 3rem);
  --text-display-lg: clamp(3.5rem, 8vw, 5rem);
  
  /* Tracking */
  --tracking-tight: -0.04em;
  --tracking-button: 0.1em;
  
  /* Spacing */
  --spacing-1: 0.25rem;
  --spacing-2: 0.5rem;
  --spacing-4: 1rem;
  --spacing-6: 2rem;
  --spacing-8: 3rem;
  --spacing-12: 4rem;
  --spacing-16: 6rem;
  --spacing-20: 8rem;
  
  /* Radii */
  --radius-sm: 0.25rem;
  --radius-xl: 0.75rem;
  --radius-full: 9999px;
  
  /* Shadows */
  --shadow-ambient: 0 15px 35px rgba(0, 0, 0, 0.05);
  
  /* Transitions */
  --transition-liquid: 400ms cubic-bezier(0.25, 1, 0.5, 1);

}

/* Universal Scroll Tracker Glow */
.motion-tracker {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background-color: var(--primary);
  position: absolute;
  top: 0; left: 0;
  pointer-events: none;
  z-index: 999;
  /* Fake gooey melting trail pointing backward (autoRotated by GSAP) */
  box-shadow: 
    -4px 0px 1px 1px var(--primary),
    -12px 0px 4px 1px var(--primary-container),
    -20px 0px 8px 2px rgba(227,6,19,0.5),
    -30px 0px 12px 3px rgba(227,6,19,0.2);
  filter: drop-shadow(0px 4px 10px rgba(227,6,19,0.6));
}
