
:root {
  --bg: #f7f1e7; --panel: #fffaf2; --panel-2: #f2e7d5; --text: #2f2418; --muted: #6f5a47; --line: #dcc9ae; --accent: #8b5e3c; --accent-2: #b88152; --soft: #efe5d5;
}
* { box-sizing: border-box; } html { scroll-behavior: smooth; }
body { margin:0; font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color:var(--text); background:radial-gradient(circle at top right, rgba(184,129,82,.14), transparent 22%), radial-gradient(circle at top left, rgba(139,94,60,.10), transparent 18%), var(--bg); line-height:1.68; }
.container { width:min(1160px, calc(100vw - 32px)); margin:0 auto; }
.site-header { position:sticky; top:0; z-index:20; backdrop-filter:saturate(140%) blur(8px); background:rgba(247,241,231,.88); border-bottom:1px solid rgba(111,90,71,.12); }
.nav { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:14px 0; }
.brand { font-weight:800; letter-spacing:.01em; color:var(--text); text-decoration:none; font-size:1.05rem; }
.nav-links { display:flex; flex-wrap:wrap; gap:10px; }
.nav-links a { text-decoration:none; color:var(--muted); padding:8px 12px; border-radius:999px; font-size:.95rem; }
.nav-links a:hover, .nav-links a.active { background:var(--soft); color:var(--text); }
.hero { padding:30px 0 20px; }
.card { background:var(--panel); border:1px solid var(--line); border-radius:24px; box-shadow:0 8px 28px rgba(67,44,24,.06); }
.prose { padding:30px; }
.breadcrumbs { font-size:.92rem; color:var(--muted); margin:8px 0 18px; }
.breadcrumbs a { color:var(--muted); text-decoration:none; } .breadcrumbs a:hover { color:var(--text); }
.kicker { color:var(--accent); font-size:.84rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; margin-bottom:10px; }
h1 { font-size:clamp(2rem, 4vw, 3rem); line-height:1.08; margin:0 0 14px; } h2 { font-size:clamp(1.45rem, 2vw, 2rem); margin:28px 0 12px; } h3 { font-size:1.1rem; margin:0 0 10px; }
.lead { font-size:1.05rem; color:var(--muted); margin:0 0 18px; }
.actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:16px; }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; text-decoration:none; border-radius:16px; padding:14px 18px; font-weight:700; }
.btn-primary { background:linear-gradient(135deg, var(--accent), var(--accent-2)); color:white; }
.btn-secondary { background:var(--soft); color:var(--text); border:1px solid var(--line); }
.section { padding:8px 0 10px; }
.grid-3, .grid-2, .grid-4, .term-grid, .hex-list, .stat-grid { display:grid; gap:16px; }
.grid-4 { grid-template-columns:repeat(4,1fr);} .grid-3 {grid-template-columns:repeat(3,1fr);} .grid-2 {grid-template-columns:repeat(2,1fr);} .term-grid {grid-template-columns:repeat(3,1fr);} .hex-list{grid-template-columns:repeat(2,1fr);} .stat-grid{grid-template-columns:repeat(3,1fr); margin-top:16px;}
.info-card,.feature-card,.link-card,.mini-card { padding:20px; }
.info-card p,.feature-card p,.link-card p,.mini-card p,.prose p,.prose li { color:var(--muted); }
.info-card strong,.feature-card strong,.link-card strong,.mini-card strong,.prose strong { color:var(--text); }
.pill-row { display:flex; flex-wrap:wrap; gap:10px; margin:0 0 18px; }
.pill { border:1px solid #ead6b5; background:#fff4e3; color:#6f523a; padding:8px 12px; border-radius:999px; font-size:.9rem; }
.notice { background:#fff7ea; border:1px solid #edd4b1; color:#6a5039; padding:12px 14px; border-radius:16px; }
.tableish { display:grid; gap:12px; } .tableish .row { border:1px solid var(--line); border-radius:16px; padding:14px 16px; background:var(--panel); }
.stat { padding:16px 18px; border-radius:18px; background:#fff7ec; border:1px solid #eed9bb; } .stat b{display:block; font-size:1.25rem; margin-bottom:4px;}
.rel-links { display:flex; flex-wrap:wrap; gap:10px; margin-top:10px; }
.rel-links a{ text-decoration:none; color:var(--accent); background:#fff4e4; border:1px solid #efd7b7; border-radius:999px; padding:6px 10px; font-size:.92rem; }
.hex-item { border:1px solid var(--line); border-radius:18px; padding:16px; background:var(--panel); text-decoration:none; color:inherit; } .hex-item:hover { background:#fff5e7;} .hex-item .meta{ color:var(--muted); font-size:.95rem; margin-bottom:6px; }
.link-card { display:block; text-decoration:none; color:inherit; }
.link-card:hover { background:#fff5e7; }
.cta { margin-top:24px; padding:24px; display:flex; align-items:center; justify-content:space-between; gap:18px; }
blockquote.scripture { margin:0; padding:16px 18px; border-left:4px solid #d6b17e; background:#fff7ed; border-radius:16px; color:#5c4633; }
footer { padding:28px 0 48px; color:var(--muted); } footer .links{ display:flex; flex-wrap:wrap; gap:10px 14px; margin-top:12px;} footer a{color:var(--muted); text-decoration:none;} footer a:hover{color:var(--text);} .small{font-size:.95rem; color:var(--muted);}
@media (max-width:960px){ .grid-4,.grid-3,.grid-2,.term-grid,.hex-list,.stat-grid{grid-template-columns:1fr;} .nav{flex-direction:column; align-items:flex-start;} .cta{flex-direction:column; align-items:flex-start;} }
