/* Shared header + slide-in menu for all pages */
.top-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.brand { color: var(--ink); }

.menu-btn {
  display: inline-flex; align-items: center; gap: 10px;
  background: none; border: 0; border-bottom: 3px solid transparent;
  padding: 8px 2px 6px; margin: -8px 0 -6px;
  font: inherit; font-weight: 700; font-size: 1.05rem; color: var(--ink);
  cursor: pointer;
}
.menu-btn[aria-expanded="true"] { border-bottom-color: var(--ink); }
.burger { display: inline-flex; flex-direction: column; gap: 4px; width: 22px; }
.burger span { display: block; height: 3px; background: var(--ink); border-radius: 2px; }

.menu-backdrop {
  position: fixed; inset: 0; z-index: 40;
  background: rgba(28, 36, 48, .45);
  opacity: 0; pointer-events: none; transition: opacity .2s ease;
}
.menu-backdrop.open { opacity: 1; pointer-events: auto; }

.menu-panel {
  position: fixed; top: 0; bottom: 0; left: 0; z-index: 50;
  width: min(380px, 88vw);
  background: var(--paper, #fff); color: var(--ink);
  display: flex; flex-direction: column;
  overflow-y: auto;
  transform: translateX(-102%); transition: transform .25s ease;
  box-shadow: 8px 0 30px -12px rgba(28, 36, 48, .4);
}
.menu-panel.open { transform: none; }

.menu-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 22px 20px; background: var(--platform, #e6ecee);
}
.menu-close {
  background: none; border: 0; font: inherit; font-weight: 700; color: var(--ink);
  cursor: pointer; padding: 6px 2px; display: inline-flex; align-items: center; gap: 6px;
}
.menu-close span { font-size: 1.5rem; line-height: 1; font-weight: 400; }

.menu-main { list-style: none; margin: 0; padding: 0; }
.menu-main li { border-bottom: 1px solid var(--line, #c9d3d7); }
.menu-main a {
  display: block; padding: 18px 20px;
  font-size: 1.2rem; font-weight: 650; text-decoration: none; color: var(--ink);
}
.menu-main a:hover { background: var(--platform, #e6ecee); }

.menu-label {
  margin: 0; padding: 22px 20px 6px;
  font-size: .8rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  color: var(--muted, #56616d);
}
.menu-guides { border-top: 1px solid var(--line, #c9d3d7); }
.menu-guides a { font-size: 1.05rem; padding: 14px 20px; }

.menu-cta-wrap { padding: 24px 20px 8px; }
.menu-cta {
  display: block; text-align: center; text-decoration: none;
  background: var(--signal, #f2c230); color: var(--ink);
  border: 2px solid var(--ink); border-radius: 6px; box-shadow: 0 4px 0 var(--ink);
  padding: 14px 18px; font-weight: 750;
}
.menu-cta:hover { background: var(--signal-dark, #d9a913); }

.menu-sub { list-style: none; margin: 0; padding: 20px 20px 0; }
.menu-sub li { margin-bottom: 10px; }
.menu-sub a { color: var(--muted, #56616d); }

.menu-social { margin: auto 0 0; padding: 24px 20px 32px; border-top: 1px solid var(--line, #c9d3d7); }
.menu-social a { font-weight: 650; color: var(--ink); }

body.menu-open { overflow: hidden; }

@media (prefers-reduced-motion: reduce) {
  .menu-panel, .menu-backdrop { transition: none; }
}

/* "Del Afgiftsklage" button (share.js) */
.share-btn {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--paper, #fff); color: var(--ink);
  border: 2px solid var(--ink); border-radius: 6px;
  padding: 10px 16px; font: inherit; font-weight: 700; cursor: pointer;
}
.share-btn:hover { background: var(--platform, #e6ecee); }
.share-btn svg { width: 18px; height: 18px; flex: none; }
.share-msg { display: block; margin-top: 8px; font-size: .92rem; font-weight: 600; color: var(--ok, #2f6b4f); }
.share-msg:empty { display: none; }
.menu-share { padding: 20px 20px 0; }
.menu-share p { margin: 0 0 10px; color: var(--muted, #56616d); font-size: .95rem; }
.share-box { margin-top: 26px; padding-top: 20px; border-top: 1px solid var(--line, #c9d3d7); }
.share-box p { margin: 0 0 10px !important; color: var(--muted, #56616d); }

/* Language switch in the header */
.top-right { display: flex; align-items: center; gap: 14px; }
.lang-link {
  font-weight: 650; font-size: .9rem; color: var(--ink); text-decoration: none;
  border: 1.5px solid var(--line, #c9d3d7); border-radius: 999px; padding: 3px 11px; background: var(--paper, #fff);
}
.lang-link:hover { border-color: var(--ink); }