/* Shared navigation: direct links on desktop, a quiet two-row header on mobile. */
.site-header { gap:20px; }
.site-header nav { gap:20px; }
.site-header .nav-calculator,.site-header nav a[href$="/wissen"] { font-weight:600; }
.site-header .nav-gram-short { display:none; }
.site-header .nav-gram-full { display:inline; }
.menu-toggle { display:inline-flex; align-items:center; justify-content:center; gap:5px; min-height:44px; padding:6px 2px; border:0; border-radius:6px; text-decoration:none; font-size:.78rem; color:var(--muted); flex-shrink:0; }
.menu-toggle .icon { width:19px; height:19px; }
.js .compact-controls { display:none!important; }
.compact-control { position:relative; display:grid; place-items:center; flex:0 0 36px; width:36px; min-width:0; height:44px; overflow:hidden; color:var(--muted); border-radius:6px; }
.compact-control:hover { background:var(--wash); color:var(--wine); }
.compact-control select { position:absolute; inset:0; appearance:none; -webkit-appearance:none; box-sizing:border-box; width:100%; min-width:0; max-width:100%; height:100%; margin:0; padding:0; border:0; font-size:16px; opacity:0; }
.compact-control:focus-within { outline:3px solid var(--wine); outline-offset:2px; }
.compact-control [data-currency-symbol] { font-size:1.15rem; line-height:1; }
.compact-control .icon { width:19px; height:19px; }
.menu-toggle:hover,.menu-toggle[aria-expanded=true] { background:var(--wash); color:var(--wine); }
.header-controls-slot:empty { display:none; }
.menu-open { overflow:hidden; }
.site-menu { position:fixed; inset:0 0 0 auto; margin:0; width:min(420px,100%); max-width:100%; height:100%; height:100dvh; max-height:100%; padding:28px; border:0; border-left:1px solid var(--line); background:var(--paper); color:var(--ink); overflow-y:auto; overscroll-behavior:contain; box-shadow:-12px 0 50px #0002; }
.site-menu::backdrop { background:rgb(20 15 18 / .5); }
.site-menu-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:24px; }
.site-menu-heading p { font-size:1.5rem; font-weight:600; letter-spacing:-.03em; }
.site-menu-heading form { margin:0; }
.menu-close { display:grid; place-items:center; width:44px; height:44px; border:1px solid var(--control); border-radius:50%; background:var(--surface); }
.menu-close:hover { background:var(--wash); }
.site-menu-links { display:grid; }
.site-menu-links a { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:20px 4px; border-bottom:1px solid var(--line); text-decoration:none; }
.site-menu-links strong { display:block; font-size:1.05rem; font-weight:600; }
.site-menu-links small { display:block; margin-top:5px; color:var(--muted); font-size:.8rem; line-height:1.5; }
.site-menu-links a:hover,.site-menu-links a[aria-current] { color:var(--wine); }
.site-menu-links a[aria-current] strong { text-decoration:underline; text-underline-offset:5px; }
.menu-settings { display:none; margin-top:30px; padding:20px; border-radius:12px; background:var(--wash); }
.menu-settings > p { font-size:.8rem; color:var(--muted); margin-bottom:14px; }
.menu-settings .header-controls { flex-direction:column; align-items:stretch; gap:14px; }
.menu-settings label { display:flex; justify-content:space-between; gap:16px; }
.menu-settings label > .sr-only { position:static!important; width:auto!important; height:auto!important; margin:0!important; overflow:visible!important; clip:auto!important; white-space:normal!important; font-size:.85rem; }
.menu-settings .theme-control > .icon { display:none; }
.menu-settings select { font-size:16px; min-width:106px; padding-left:12px; }
.site-menu-legal { display:flex; flex-wrap:wrap; gap:8px 24px; margin-top:26px; font-size:.8rem; color:var(--muted); }
.site-menu-legal a { display:inline-flex; align-items:center; min-height:44px; }
@media(max-width:1200px) {
  .site-header.wrap { width:calc(100% - 40px); }
  .site-header { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px 16px; min-height:0; padding-block:16px 6px; }
  .site-header .brand { font-size:1.55rem; gap:9px; }
  .site-header .brand svg { width:32px; height:33px; }
  .menu-toggle { grid-column:2; grid-row:1; justify-self:end; }
  .site-header nav { grid-column:1; grid-row:2; width:100%; margin:0; justify-content:flex-start; gap:8px clamp(12px,3vw,24px); }
  .js .compact-controls { display:flex!important; grid-column:2; grid-row:2; justify-self:end; gap:0; margin-right:-8px; }
  html:not(.js) .site-header nav { grid-column:1 / -1; }
  .site-header nav a { min-height:44px; font-size:.9rem; }
  .site-header .nav-gram,.site-header .nav-app { display:none; }
  .js .header-controls-slot { display:none; }
  .js .menu-settings { display:block; }
}
@media(max-width:360px) {
  .site-header.wrap { width:calc(100% - 32px); }
  .site-header .brand { font-size:1.35rem; }
  .site-header .brand svg { width:28px; height:29px; }
  .site-menu { padding:22px; }
}
@media(prefers-reduced-motion:no-preference) {
  .site-menu[open] { animation:menu-enter .2s ease-out; }
  @keyframes menu-enter { from { transform:translateX(100%); } to { transform:translateX(0); } }
}
@media print { .site-menu { display:none!important; } }
