/* Halloween – mørk lilla nat, græskar-orange og giftgrøn. Flagermus flyver over topbilledet, månen lyser. */
:root {
  color-scheme: dark;
  --c-bg: #17121f; --c-surface: #231a30; --c-ink: #f1e9ff; --c-muted: #b4a6c9; --c-line: #372a4a;
  --c-accent: #f07b1d; --c-accent-ink: #17121f;
  --c-header-bg: rgba(23,18,31,.96); --c-header-ink: #f1e9ff; --c-menu-bg: #231a30; --c-menu-ink: #f1e9ff;
  --hero-overlay: linear-gradient(180deg, rgba(40,14,60,.55) 0%, rgba(23,18,31,.25) 50%, rgba(23,18,31,.9) 100%);
  --hero-fallback: #2a1f3a;
  --map-land: #2f2440; --map-visited: #f07b1d; --map-stroke: #17121f; --map-point: #9be15d; --map-home: #f1e9ff; --map-hover: #463759;
  --slime: #9be15d;
  --f-head: "Rubik", system-ui, sans-serif;
  --f-body: "Rubik", system-ui, sans-serif;
  --radius: 8px;
}
a { color: #ffa45c; }
.brand-name { font-weight: 800; }
.brand-name::before { content: ""; display: inline-block; width: 1.05em; height: 1.05em; margin-right: .45em; vertical-align: -.15em;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 5c-1-2 0-3 2-3-1 1-1 2-1 3' stroke='%2366a832' stroke-width='1.6' fill='none'/%3E%3Cellipse cx='8' cy='14' rx='6' ry='8' fill='%23f07b1d'/%3E%3Cellipse cx='16' cy='14' rx='6' ry='8' fill='%23f07b1d'/%3E%3Cellipse cx='12' cy='14' rx='5' ry='8.5' fill='%23ff8f2e'/%3E%3Cpath d='M8 12l2 2H6zM16 12l2 2h-4zM8 17q4 3 8 0l-2 1-2-1-2 1z' fill='%2317121f'/%3E%3C/svg%3E") center/contain no-repeat; }
.menu-d0 > li > a:hover { color: var(--c-accent); text-decoration: none; }
.menu-d1, .menu-d2 { border-top: 3px solid var(--c-accent); }

/* Topbillede: fuldmåne + flagermus */
.hero::before {
  content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 0;
  background: radial-gradient(circle at 82% 26%, #fff7d6 0 46px, rgba(255,240,190,.45) 47px 70px, rgba(255,220,150,.12) 71px 150px, transparent 151px);
}
.hero::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 0;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 20'%3E%3Cpath d='M0 12C6 4 12 4 16 10c2-4 4-4 6-2 2-2 4-2 6 2 4-6 10-6 16 2-6-2-10 0-12 4-4-2-6 0-10 2-4-2-6-4-10-2C10 12 6 10 0 12z' fill='%23100b16'/%3E%3C/svg%3E"),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 20'%3E%3Cpath d='M0 12C6 4 12 4 16 10c2-4 4-4 6-2 2-2 4-2 6 2 4-6 10-6 16 2-6-2-10 0-12 4-4-2-6 0-10 2-4-2-6-4-10-2C10 12 6 10 0 12z' fill='%23100b16'/%3E%3C/svg%3E");
  background-size: 64px 30px, 40px 19px;
  background-repeat: no-repeat;
  background-position: 70% 22%, 86% 38%;
  animation: hw-bats 9s ease-in-out infinite alternate;
}
@keyframes hw-bats { from { background-position: 66% 24%, 90% 40%; } to { background-position: 74% 16%, 82% 32%; } }
.hero-inner { position: relative; z-index: 1; }
.hero-title { font-family: "Creepster", "Rubik", system-ui, sans-serif; font-weight: 400; letter-spacing: .03em; color: #ffb066; text-shadow: 0 0 22px rgba(240,123,29,.55), 0 3px 0 #3a1500; }
.hero-large .hero-title { font-size: clamp(3rem, 8.5vw, 6.2rem); }
.hero-sub { color: #e9dcff; }

/* Indhold */
h2, .section-title, .chart figcaption, .prs h2 { color: #ffb066; }
.section-title::after { content: ""; display: block; width: 72px; height: 4px; margin-top: .5rem; border-radius: 2px; background: linear-gradient(90deg, var(--c-accent), var(--slime)); }
.stat { background: var(--c-surface); }
.stat-num { color: var(--c-accent); }
.tile { border: 1px solid var(--c-line); border-radius: 12px; }
.tile::after { background: linear-gradient(transparent 30%, rgba(23,18,31,.95)); }
.tile:hover { border-color: var(--c-accent); box-shadow: 0 0 0 1px var(--c-accent), 0 0 26px rgba(240,123,29,.35); }
.tile-type { color: var(--slime); }
.btn { border-radius: 999px; font-weight: 800; }
.btn:hover { filter: none; background: #ff9440; }
.btn-quiet { color: var(--c-ink); }
.btn-quiet:hover { background: var(--c-surface); }
.ingredients, .recipe-tips, .recipe-meta, .pr { background: var(--c-surface); }
.steps li::before { background: var(--c-accent); color: var(--c-accent-ink); }
.continents li.on, .chip[aria-pressed="true"] { background: var(--c-accent); border-color: var(--c-accent); color: var(--c-accent-ink); }
.travel-table tbody tr:hover { background: var(--c-surface); }
.filter input { background: var(--c-surface); }
.ingredients input { accent-color: #f07b1d; }
/* Spindelvæv i hjørnet af bunden */
.site-footer { background: #100b16; border: 0; position: relative; overflow: hidden; }
.site-footer::before { content: ""; position: absolute; right: 0; top: 0; width: 120px; height: 120px; opacity: .35;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' fill='none' stroke='%23d9c8f5' stroke-width='.8'%3E%3Cpath d='M100 0L20 80M100 0L0 40M100 0L60 100M100 0L0 0M100 0L100 100'/%3E%3Cpath d='M80 0Q85 12 100 20M60 0Q68 25 100 40M40 0Q52 40 100 60M20 0Q36 54 100 80'/%3E%3C/svg%3E") top right/contain no-repeat; }
.preview-banner, .draft-note { background: #3b2a12; color: #ffd9a8; }
@media (prefers-reduced-motion: reduce) { .hero::after { animation: none; } }
@media print { body { background: #fff; color: #000; } .hero::before, .hero::after, .site-footer::before { display: none; } }