/* Demons tema, Northtrail Outdoor: skog, sand och glöd. Ersätter theme-vizsla.css när config.json har "theme": "northtrail". */
@import url("https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700&display=swap");

:root {
  --raspberry: #d4692a; --raspberry-hi: #e27a37; --raspberry-lo: #c05a1f;
  --brown: #1e3a2b; --brown-2: #142a1f;
  --blue: #2f6b7a; --blue-dark: #1d4a56;
  --beige: #e6dec5; --cream: #f3efe2; --blush: #eef2e8; --line: #e1d9c6;
  --head: "Barlow Condensed", "Zilla Slab", Georgia, sans-serif;
}

/* Höjdkurvor på sandfärgad karta i stället för rutig duk */
body { background-color: #ebe4d1; background-image: url("topo-northtrail.svg"); background-size: 520px 520px; }

h1, h2, h3 { letter-spacing: .01em; }
h2 { font-weight: 700; text-transform: uppercase; letter-spacing: .03em; }

.wordmark {
  color: var(--brown); text-shadow: none; text-transform: uppercase; letter-spacing: .06em; font-size: 2.3rem;
  display: inline-flex; align-items: center; gap: 10px;
}
/* Fjälltopp framför namnet */
.wordmark::before {
  content: ""; width: 34px; height: 26px; flex: none;
  background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 34 26'%3E%3Cpath d='M0 26 L12 6 L18 15 L23 9 L34 26Z' fill='%231e3a2b'/%3E%3Cpath d='M12 6 L16 12.5 L13.5 11 L12 13 L10 11 L8.6 11.7Z' fill='%23f3efe2'/%3E%3Ccircle cx='27' cy='5' r='3.2' fill='%23d4692a'/%3E%3C/svg%3E");
}
.brand-sub { background: var(--raspberry); text-transform: uppercase; letter-spacing: .08em; font-size: .85rem; }
.fetched, .source-pick, .lang-pick { background-color: rgba(243, 239, 226, .92); }

.sheet { border-radius: 14px 14px 0 0; box-shadow: 0 10px 40px rgba(20, 42, 31, .18); }
.pagenav { background: linear-gradient(180deg, #24432f, var(--brown-2)); }
.pages a { text-transform: uppercase; letter-spacing: .05em; font-size: .92rem; }
.pagesub { border-bottom-color: #d6cba9; }

.cover-photo { background: #22402f; }
.cover-overlay { background: linear-gradient(180deg, rgba(12, 26, 19, 0) 30%, rgba(12, 26, 19, .82) 100%); }
.cover-title {
  color: #f4ead5; text-transform: uppercase; letter-spacing: .02em;
  text-shadow: 0 2px 0 rgba(20, 42, 31, .9), 0 6px 22px rgba(0, 0, 0, .45);
}
.cover-overlay .cover-eyebrow { color: #f0b26b; }

.demo-banner { background: var(--brown-2); color: #f3efe2; text-align: center; font-size: .9rem; padding: 6px 12px; }
.demo-banner b { color: #f0b26b; }