/* Custom Narnia Palette: Mahogany, Linen, Cream Parchment & Crimson */
body {
  font-family: 'Nunito', sans-serif;
  background: #e6dccb;
  background-image: radial-gradient(#d8ccb6 1px, transparent 1px);
  background-size: 20px 20px;
  color: #2c1a0e;
  min-height: 100vh;
}

h1, h2, h3, h4, .font-serif {
  font-family: 'Cinzel', serif;
}

.font-quote {
  font-family: 'Playfair Display', serif;
}

/* Custom Parchment Scrollbar */
::-webkit-scrollbar {
  width: 10px;
}
::-webkit-scrollbar-track {
  background: #e6dccb;
}
::-webkit-scrollbar-thumb {
  background: #bfae95;
  border-radius: 5px;
}
::-webkit-scrollbar-thumb:hover {
  background: #8b1a1a;
}

/* Header Banner Styling */
.narnia-header-bg {
  background-color: #3a2416;
  background-image: linear-gradient(180deg, #3a2416 0%, #2c1a0e 100%);
  border-bottom: 4px solid #c58b2b;
}

/* Layout Button Styling */
.layout-btn.active {
  background-color: #8b1a1a;
  color: #f8f3e6;
  box-shadow: 0 2px 8px rgba(139, 26, 26, 0.3);
}
.layout-btn:not(.active) {
  color: #3a2416;
}
.layout-btn:not(.active):hover {
  background-color: rgba(139, 26, 26, 0.1);
}

/* Spine Timeline Node */
.timeline-node {
  box-shadow: 0 0 10px rgba(197, 139, 43, 0.5);
  background-color: #f8f3e6;
  border-color: #c58b2b;
}

/* Cream Parchment Timeline Cards */
.timeline-card {
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  background-color: #f8f3e6 !important;
  color: #2c1a0e !important;
  border: 1px solid #d4c5ad !important;
  box-shadow: 0 4px 12px rgba(58, 36, 22, 0.08);
}

.timeline-card h3 {
  color: #8b1a1a !important;
}

.timeline-card p {
  color: #3a2416 !important;
}

.timeline-card:hover {
  transform: translateY(-3px);
  border-color: #c58b2b !important;
  box-shadow: 0 10px 22px -4px rgba(58, 36, 22, 0.2);
}

/* Interactive SVG Map Hover Animations */
.map-node circle {
  transition: all 0.3s ease;
}
.map-node:hover circle {
  r: 18;
  filter: drop-shadow(0 0 8px rgba(197, 139, 43, 0.8));
}