/* Prospero Deck System - Base Styles
   Brand: Geist headings, Lora body, Prospero Blue #1a365d, cream/linen tones
*/

:root {
  /* Brand Colors */
  --prospero-blue: #1a365d;
  --prospero-blue-light: #2c5282;
  --cream: #faf8f5;
  --linen: #f5f3f0;
  --text-dark: #1a202c;
  --text-muted: #4a5568;

  /* Typography */
  --font-heading: 'Geist', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-body: 'Lora', Georgia, serif;

  /* Spacing */
  --space-xs: 0.5rem;
  --space-sm: 1rem;
  --space-md: 2rem;
  --space-lg: 4rem;
  --space-xl: 6rem;
}

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

html {
  scroll-behavior: smooth;
}

body {
  font-family: var(--font-body);
  font-size: 1.125rem;
  line-height: 1.7;
  color: var(--text-dark);
  background-color: var(--cream);
}

/* Typography */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading);
  font-weight: 500;
  line-height: 1.2;
  color: var(--prospero-blue);
}

h1 {
  font-size: clamp(2.5rem, 5vw, 4rem);
  letter-spacing: -0.02em;
}

h2 {
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  margin-bottom: var(--space-sm);
}

/* Layout */
.container {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 var(--space-md);
}

section {
  padding: var(--space-lg) 0;
}

/* Hero */
.hero {
  min-height: 60vh;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  background: linear-gradient(180deg, var(--linen) 0%, var(--cream) 100%);
}

.hero h1 {
  margin-bottom: var(--space-sm);
}

.lead {
  font-size: 1.5rem;
  color: var(--prospero-blue-light);
  margin-bottom: var(--space-xs);
}

.subtitle {
  color: var(--text-muted);
  font-size: 1rem;
}

/* Status Section */
.status {
  background: white;
  border-top: 1px solid var(--linen);
}

.status-list {
  list-style: none;
  max-width: 400px;
}

.status-list li {
  padding: var(--space-xs) 0;
  display: flex;
  align-items: center;
  gap: var(--space-sm);
}

.check {
  color: #38a169;
  font-weight: bold;
}

.pending {
  color: var(--text-muted);
}

/* Data Check Section */
.data-check {
  background: var(--linen);
}

.data-counts {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-md);
  margin-top: var(--space-sm);
}

.data-counts li {
  background: white;
  padding: var(--space-sm) var(--space-md);
  border-radius: 8px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.08);
}

.data-counts strong {
  color: var(--prospero-blue);
  font-family: var(--font-heading);
  font-size: 1.5rem;
  display: block;
}

/* Responsive */
@media (max-width: 768px) {
  section {
    padding: var(--space-md) 0;
  }

  .hero {
    min-height: 50vh;
  }
}
