/* =============================================
   Starter Theme — Clean & Minimal, Light Mode
   ============================================= */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

:root {
  --color-primary: #10b981;
  --color-primary-dark: #059669;
  --color-secondary: #6366f1;
  --color-bg: #ffffff;
  --color-bg-alt: #f8fafc;
  --color-surface: #ffffff;
  --color-text: #1e293b;
  --color-text-muted: #64748b;
  --color-border: #e2e8f0;
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --radius: 12px;
  --radius-sm: 8px;
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.05);
  --shadow-md: 0 4px 6px -1px rgba(0,0,0,0.07), 0 2px 4px -2px rgba(0,0,0,0.05);
  --shadow-lg: 0 10px 15px -3px rgba(0,0,0,0.08), 0 4px 6px -4px rgba(0,0,0,0.04);
  --max-width: 1200px;
  --transition: 0.2s ease;
}

*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

body {
  font-family: var(--font-sans);
  color: var(--color-text);
  background: var(--color-bg);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

img { max-width: 100%; height: auto; display: block; }
a { color: var(--color-primary); text-decoration: none; transition: color var(--transition); }
a:hover { color: var(--color-primary-dark); }

.container {
  max-width: var(--max-width);
  margin: 0 auto;
  padding: 0 24px;
}

/* Rich text content */
.rich-text h2 { font-size: 1.5rem; margin: 1.5em 0 0.5em; font-weight: 700; }
.rich-text h3 { font-size: 1.25rem; margin: 1.5em 0 0.5em; font-weight: 600; }
.rich-text p { margin-bottom: 1em; line-height: 1.8; color: var(--color-text-muted); }
.rich-text ul, .rich-text ol { margin: 0 0 1em 1.5em; }
.rich-text li { margin-bottom: 0.25em; }
.rich-text img { border-radius: var(--radius); margin: 1.5em 0; }
.rich-text blockquote {
  border-left: 3px solid var(--color-primary);
  padding: 0.5em 1.5em;
  margin: 1.5em 0;
  color: var(--color-text-muted);
  font-style: italic;
}