:root {
      --park: #2d6a4f;
      --earn: #b5541a;
      --build: #1a3a6b;
      --roam: #5b4a8f;
      --dare: #c23b27;
      --ink: #1a1a1a;
      --paper: #fafaf7;
      --paper-mid: #f5f2eb;
      --paper-warm: #ede9e0;
      --border: rgba(26, 26, 26, 0.1);
      --border-mid: rgba(26, 26, 26, 0.15);
      --ink-muted: rgba(26, 26, 26, 0.5);
      --font-display: 'Playfair Display', Georgia, serif;
      --font-body: 'DM Sans', -apple-system, sans-serif;
      --font-mono: 'DM Mono', monospace;
      --radius: 8px;
      --radius-lg: 12px;
      --s3: 0.75rem;
      --s4: 1rem;
      --s5: 1.25rem;
      --s6: 1.5rem;
      --s7: 2rem;
      --s8: 3rem;
    }

    * { margin: 0; padding: 0; box-sizing: border-box; }
    
    body {
      font-family: var(--font-body);
      background: var(--paper);
      color: var(--ink);
      line-height: 1.7;
      font-size: 1rem;
    }

    .richiest-nav {
      background: var(--ink);
      padding: 1rem var(--s6);
    }

    .nav-inner {
      max-width: 1200px;
      margin: 0 auto;
      display: flex;
      align-items: center;
      justify-content: space-between;
    }

    .nav-logo {
      font-family: var(--font-display);
      font-size: 1.5rem;
      font-weight: 700;
      color: var(--paper);
      text-decoration: none;
    }

    .nav-links { display: flex; gap: var(--s6); }

    .nav-links a {
      color: rgba(250, 250, 247, 0.7);
      text-decoration: none;
      font-size: 0.875rem;
    }

    .nav-links a:hover { color: var(--paper); }

    .page-hero {
      background: var(--ink);
      color: var(--paper);
      padding: var(--s8) var(--s6);
    }

    .hero-inner {
      max-width: 800px;
      margin: 0 auto;
    }

    .hero-inner h1 {
      font-family: var(--font-display);
      font-size: 2.5rem;
      font-weight: 700;
      margin-bottom: var(--s4);
    }

    .hero-inner p {
      font-size: 1.125rem;
      color: rgba(250, 250, 247, 0.7);
    }

    .content-section {
      max-width: 800px;
      margin: 0 auto;
      padding: var(--s7) var(--s6);
    }

    .content-section h2 {
      font-family: var(--font-display);
      font-size: 1.75rem;
      margin-bottom: var(--s5);
    }

    .content-section h3 {
      font-family: var(--font-display);
      font-size: 1.25rem;
      margin-top: var(--s7);
      margin-bottom: var(--s4);
    }

    .content-section p {
      margin-bottom: var(--s5);
      color: rgba(26, 26, 26, 0.8);
    }

    .content-section ul {
      margin-bottom: var(--s5);
      padding-left: var(--s6);
    }

    .content-section li { margin-bottom: var(--s3); }

    .comparison-table {
      width: 100%;
      border-collapse: collapse;
      margin-bottom: var(--s6);
    }

    .comparison-table th,
    .comparison-table td {
      padding: var(--s3) var(--s4);
      text-align: left;
      border-bottom: 1px solid var(--border);
    }

    .comparison-table th {
      font-family: var(--font-mono);
      font-size: 0.75rem;
      text-transform: uppercase;
      letter-spacing: 0.1em;
      color: var(--ink-muted);
    }

    .comparison-table td { font-size: 0.875rem; }

    .comparison-table tr.highlight-row {
      background: rgba(45, 106, 79, 0.05);
    }

    .disclosure-box {
      background: var(--paper-warm);
      border-left: 3px solid var(--earn);
      padding: var(--s6) var(--s7);
      margin-bottom: var(--s7);
    }

    .disclosure-box h3 { color: var(--earn); margin-top: 0; }

    .verdict {
      background: var(--paper-warm);
      border-left: 3px solid var(--park);
      padding: var(--s5) var(--s6);
      margin-bottom: var(--s7);
    }

    .verdict strong { display: block; font-family: var(--font-display); margin-bottom: var(--s3); }

    .guide-cta {
      background: var(--ink);
      color: var(--paper);
      padding: var(--s7) var(--s6);
      text-align: center;
    }

    .guide-cta h2 {
      font-family: var(--font-display);
      font-size: 1.75rem;
      margin-bottom: var(--s4);
    }

    .guide-cta p { color: rgba(250, 250, 247, 0.7); margin-bottom: var(--s6); }

    .guide-cta a {
      display: inline-block;
      padding: var(--s4) var(--s7);
      background: var(--paper);
      color: var(--ink);
      text-decoration: none;
      border-radius: var(--radius);
      font-weight: 600;
    }

    .richiest-footer {
      background: var(--ink);
      color: rgba(250, 250, 247, 0.5);
      padding: var(--s7) var(--s6);
    }

    .footer-inner {
      max-width: 1200px;
      margin: 0 auto;
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
      gap: var(--s7);
    }

    .footer-col h4 {
      color: var(--paper);
      font-family: var(--font-mono);
      font-size: 0.75rem;
      text-transform: uppercase;
      letter-spacing: 0.1em;
    }

    .footer-col a {
      display: block;
      color: rgba(250, 250, 247, 0.5);
      text-decoration: none;
      font-size: 0.875rem;
      margin-bottom: var(--s3);
    }

    @media (max-width: 768px) {
      .hero-inner h1 { font-size: 2rem; }
    }