/* Fjord – lyst, luftigt, nordisk. Serif-overskrifter, fjordblå accent, okker prikker på kortet. */
:root {
  --c-bg: #f5f7f8; --c-surface: #e8eef1; --c-ink: #1d2d38; --c-muted: #5b6d79; --c-line: #d3dde3;
  --c-accent: #2f5d7c; --c-accent-ink: #fff;
  --c-header-bg: rgba(245,247,248,.95); --c-header-ink: #1d2d38; --c-menu-bg: #ffffff; --c-menu-ink: #1d2d38;
  --hero-overlay: linear-gradient(180deg, rgba(20,35,45,.15), rgba(20,35,45,.55));
  --hero-fallback: #2f5d7c;
  --map-land: #d6e0e6; --map-visited: #2f5d7c; --map-stroke: #f5f7f8; --map-point: #d39b2a; --map-home: #b5452f; --map-hover: #aab9c2;
  --f-head: "Fraunces", Georgia, serif;
  --f-body: "Instrument Sans", system-ui, sans-serif;
  --radius: 10px; --header-h: 72px;
}
body { line-height: 1.7; }
/* Headeren er hvid tekst over foto, men mørk når den bliver solid */
.site-header { color: #fff; }
.site-header.scrolled, body.hero-none .site-header, .nav-open .site-header { color: var(--c-header-ink); border-bottom: 1px solid var(--c-line); }
.brand-name { font-weight: 600; font-size: 1.5rem; }
.menu-d1, .menu-d2 { border-radius: 10px; border: 1px solid var(--c-line); box-shadow: 0 12px 30px rgba(29,45,56,.12); }

.hero-title { font-weight: 400; letter-spacing: -.01em; }
.hero-large .hero-title { font-size: clamp(2.8rem, 7.5vw, 5.6rem); max-width: 14ch; line-height: 1.02; }
.hero-small { min-height: clamp(280px, 40vh, 420px); }
h2, .section-title, .chart figcaption { font-weight: 400; }

/* Fliser med tekst under billedet i stedet for over */
.tile { color: var(--c-ink); background: #fff; border: 1px solid var(--c-line); grid-template-rows: 220px auto; min-height: 0; }
.tile::after { display: none; }
.tile-img { position: relative; inset: auto; z-index: 0; background-color: var(--c-surface); }
.tile-body { align-self: start; padding: 1rem 1.25rem 1.25rem; background: #fff; position: relative; }
.tile-type { color: var(--c-muted); }
.tile-title { font-weight: 400; font-size: 1.45rem; }

.stat-row { border-radius: var(--radius); }
.stat-num { font-weight: 400; }
.ingredients { background: #fff; border: 1px solid var(--c-line); }
.steps li::before { background: transparent; color: var(--c-accent); border: 1.5px solid var(--c-accent); font-weight: 600; }
.recipe-tips { background: #fff; border-radius: 0 var(--radius) var(--radius) 0; }
.btn { border-radius: 999px; }
.site-footer { background: #e8eef1; }