Initial project push.

theme/partials/base.scss

@@ -0,0 +1,82 @@
+:root {
+  /* Primary Colors */
+  --color-sage-green: #7A9B8E;
+  --color-warm-stone: #8B7E74;
+  
+  /* Neutrals */
+  --color-soft-cream: #F5F3EF;
+  --color-light-gray: #E8E6E1;
+  --color-charcoal: #4A4A48;
+  --color-medium-gray: #878580;
+  
+  /* Accent */
+  --color-terracotta: #C77E68;
+  
+  /* Data Visualization */
+  --color-dusty-blue: #8A9BA8;
+  --color-muted-olive: #A8A070;
+  --color-soft-clay: #B89485;
+  
+  /* Semantic Variables (optional - map to use cases) */
+  --color-primary: var(--color-sage-green);
+  --color-secondary: var(--color-warm-stone);
+  --color-accent: var(--color-terracotta);
+  --color-background: var(--color-soft-cream);
+  --color-surface: var(--color-light-gray);
+  --color-text-primary: var(--color-charcoal);
+  --color-text-secondary: var(--color-medium-gray);
+
+  /* Font Family */
+  --font-family: 'Jost', sans-serif;
+  --font-size: 16px;
+
+  /* Font Weights */
+  --font-weight-light: 300;
+  --font-weight-regular: 400;
+  --font-weight-bold: 700;
+
+  /* Font Sizes */
+  --font-size-small: 0.8rem;
+  --font-size-medium: 1rem;
+  --font-size-large: 1.2rem;
+
+  /* Line Heights */
+  --line-height-small: 1.2;
+  --line-height-medium: 1.4;
+  --line-height-large: 1.6;
+}
+
+a.btn {
+  display: flex;
+  gap: 3px;
+  align-items: center;
+  text-decoration: none;
+  border-radius: 8px;
+  padding: 0.5rem 1rem;
+  transition: all 0.2s ease;
+  color: var(--color-soft-cream);
+
+  &-accent {
+    background: var(--color-accent);
+
+    &:hover {
+      background: var(--color-secondary);
+    }
+  }
+
+  &-primary {
+    background: var(--color-primary);
+
+    &:hover {
+      background: var(--color-secondary);
+    }
+  }
+
+  &-soft-clay {
+    background: var(--color-soft-clay);
+
+    &:hover {
+      background: var(--color-secondary);
+    }
+  }
+}