/* ============================================================
   MENUEN (DE TRE STREGER) OG "BESTIL MAD" SOM DET FØRSTE VALG  (23/10)
   Mikkel: "lav bestil mad mere eksklusiv, da det hele godt kan ligne
   hinanden og være svært at navigere i for kunderne, og lav de tre
   streger-tabben bedre". Én fil til alle sider med skuffen (forsiden,
   historien, h-siderne, menukort, tapas) og bord/.
   Bestil mad er husets røde, som før (Mikkel: "samme farve som før,
   ikke det sorte — men stadig til at finde"): den ene røde knap i
   bjælken og den store røde flade øverst i menuen; Book bord er hvid.
   ============================================================ */


/* ---------- knappen med de tre streger ---------- */
.topbar .g.icn.menu svg{display:none}
.topbar .g.icn.menu::before{content:"";flex:none;width:18px;height:13px;
  background:linear-gradient(currentColor,currentColor) 0 0/100% 2px no-repeat,
             linear-gradient(currentColor,currentColor) 0 50%/72% 2px no-repeat,
             linear-gradient(#d62a3a,#d62a3a) 0 100%/46% 2px no-repeat;border-radius:1px;transition:background-size .3s ease}
.topbar .g.icn.menu:hover::before{background-size:100% 2px,100% 2px,100% 2px}

/* ---------- "Bestil mad" i bjælken (computer) ---------- */
.ny-bestilknap{display:none}
@media (min-width:821px){
  .ny-bestilknap{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 16px 0 12px;margin-right:6px;border-radius:999px;text-decoration:none;
    font:600 14px/1 "Host Grotesk",system-ui,sans-serif;color:#fff;background:linear-gradient(180deg,#e2404f,#b41f2e);
    box-shadow:inset 0 1px .5px rgba(255,255,255,.4),0 0 0 3px rgba(214,42,58,.22),0 8px 20px rgba(214,42,58,.35);transition:transform .2s ease}
  .ny-bestilknap svg{width:18px;height:18px}
  .ny-bestilknap:hover{transform:translateY(-1px)}
  #hd .ny-bestilknap{margin-left:0}
  /* Book bord træder et skridt tilbage, så Bestil mad er den ene røde knap i bjælken */
  html body .topbar a.ny-bord,html body #hd a.ny-bord{background:#fff;color:#b41f2e;box-shadow:inset 0 0 0 1.5px rgba(214,42,58,.35),0 6px 16px rgba(0,0,0,.18)}
}

/* ---------- skuffen ---------- */
.sheet .ny-ark-top{display:grid;grid-template-columns:1.25fr 1fr;gap:10px;margin:4px 0 14px}
.sheet .ny-ark-top a{position:relative;display:grid;align-content:end;gap:3px;min-height:112px;padding:14px 14px 13px;border-radius:20px;text-decoration:none;overflow:hidden}
.sheet .ny-ark-top a svg{position:absolute;top:12px;right:12px;width:28px;height:28px}
.sheet .ny-ark-top b{font:400 26px/.95 "Bebas Neue",sans-serif;letter-spacing:.02em}
.sheet .ny-ark-top small{font:italic 400 12.5px/1.25 "Host Grotesk",system-ui,sans-serif;opacity:.85}
.sheet .ny-ark-bestil{color:#fff;background:radial-gradient(120% 90% at 100% 0,rgba(255,255,255,.18),transparent 55%),linear-gradient(160deg,#e2404f,#b41f2e);
  box-shadow:0 14px 28px -12px rgba(180,31,46,.85),inset 0 1px 0 rgba(255,255,255,.3)}
.sheet .ny-ark-bord{color:#b41f2e;background:#fff;box-shadow:inset 0 0 0 1.5px rgba(214,42,58,.3),0 10px 22px -16px rgba(36,26,23,.5)}
.sheet .ny-ark-gruppe{display:flex;align-items:center;gap:10px;margin:14px 0 2px;padding:0 4px;font:400 13px/1 "Bebas Neue",sans-serif;letter-spacing:.3em;text-transform:uppercase;color:#d62a3a}
.sheet .ny-ark-gruppe::after{content:"";flex:1;height:1px;background:rgba(214,42,58,.25)}
.sheet .ny-ark-nav a{border-radius:12px}
.sheet .ny-ark-nav a.on{background:rgba(214,42,58,.08)}
.sheet .sheet-cta:has(> :only-child){grid-template-columns:1fr;display:grid}
.sheet .sheet-cta:has(> :only-child) .g{width:100%}

/* ============================================================
   BJÆLKEN ER DEN SAMME PÅ DE SIDER, DER IKKE ER LAVET OM ENDNU
   (menukort, tapas, selskaber): røget glas, hvid skrift — som på
   forsiden og undersiderne (topbjaelken.spec.js holder det fast).
   ============================================================ */
body.hav:not(.ny-side):not(.ny-hav):not(.ny-hist){--roeg:rgba(28,20,16,.64);--roeg-kant:inset 0 1px 0 rgba(255,255,255,.22),inset 0 0 0 .5px rgba(255,255,255,.28),0 10px 26px -12px rgba(0,0,0,.45)}
body.hav:not(.ny-side):not(.ny-hav):not(.ny-hist) .topbar.stuck,body.hav:not(.ny-side):not(.ny-hav):not(.ny-hist) .topbar.solid{background:transparent;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
body.hav:not(.ny-side):not(.ny-hav):not(.ny-hist) .topbar.stuck .ordmaerke,body.hav:not(.ny-side):not(.ny-hav):not(.ny-hist) .topbar.solid .ordmaerke{display:inline-flex;align-items:center;min-height:0;height:44px;padding:0 18px;border-radius:999px;color:#fff;text-shadow:0 1px 10px rgba(0,0,0,.35);
  background:var(--roeg);-webkit-backdrop-filter:blur(18px) saturate(160%);backdrop-filter:blur(18px) saturate(160%);box-shadow:var(--roeg-kant)}
body.hav:not(.ny-side):not(.ny-hav):not(.ny-hist) .topbar .g.icn.menu{background:#fff;color:#241a17;-webkit-backdrop-filter:none;backdrop-filter:none}
/* ⚠️ INTET HOP, NÅR BJÆLKEN SÆTTER SIG (topbjaelke.spec.js). havnegrillen.css udligner for et navn,
   der står 40 px højt; det røgede glas-navn er 44 px, så udligningen er 4 px mindre. */
@media (max-width:820px){
  body.ny-side .topbar.stuck:has(.ordmaerke:not(.hjem)){margin-bottom:calc(var(--top-luft) - var(--kompakt-top) + 10px)}
  body.hav:not(.ny-side):not(.ny-hav):not(.ny-hist) .topbar.stuck{margin-bottom:calc(var(--top-luft) - var(--kompakt-top))}
  body.hav:not(.ny-side):not(.ny-hav):not(.ny-hist) .topbar.stuck:has(.ordmaerke:not(.hjem)){margin-bottom:calc(var(--top-luft) - var(--kompakt-top) + 10px)}
}
/* bord/: navnet flugter med forsidens på en computer (forsidens glas-pille står 18 px ude) */
@media (min-width:821px){body.ny-under #hd .logo{margin-left:-18px}}
/* historien og de ikke-omlagte sider: navnet står præcis som forsidens */
@media (min-width:821px){
  body.hav:not(.ny-side):not(.ny-hav):not(.ny-hist) .topbar.stuck .ordmaerke,body.hav:not(.ny-side):not(.ny-hav):not(.ny-hist) .topbar.solid .ordmaerke{margin-left:-18px}
  body.hav:not(.ny-side):not(.ny-hav):not(.ny-hist) .topbar.stuck,body.hav:not(.ny-side):not(.ny-hav):not(.ny-hist) .topbar.solid{padding-top:16px}
}
@media (min-width:821px){body.ny-hav .topbar .ordmaerke{margin-left:-18px}}

/* bestil/ (ikke lavet om endnu): bjælken som forsidens — røget glas, hvid skrift (topbjaelken.spec.js) */
body.underside:not(.ny-under):not(.personale){--roeg:rgba(28,20,16,.64);--roeg-kant:inset 0 1px 0 rgba(255,255,255,.22),inset 0 0 0 .5px rgba(255,255,255,.28),0 10px 26px -12px rgba(0,0,0,.45)}
body.underside:not(.ny-under):not(.personale) #hd.stuck{background:transparent;box-shadow:none}
body.underside:not(.ny-under):not(.personale) #hd .logo,body.underside:not(.ny-under):not(.personale) #hd.stuck .logo{display:inline-flex;align-items:center;height:44px;min-height:0;padding:0 18px;border-radius:999px;
  color:#fff;font:500 21px/1 "Host Grotesk",system-ui,sans-serif;letter-spacing:-.015em;text-shadow:0 1px 10px rgba(0,0,0,.35);
  background:var(--roeg);-webkit-backdrop-filter:blur(18px) saturate(160%);backdrop-filter:blur(18px) saturate(160%);box-shadow:var(--roeg-kant)}
body.underside:not(.ny-under):not(.personale) #hd .burger{background:#fff;color:#241a17;-webkit-backdrop-filter:none;backdrop-filter:none}
@media (min-width:821px){body.underside:not(.ny-under):not(.personale) #hd,body.underside:not(.ny-under):not(.personale) #hd.stuck{padding-top:16px}body.underside:not(.ny-under):not(.personale) #hd .logo{margin-left:-18px}}
/* Menu-knappen er dækkende hvid på de nye sider — sløring bag den kan ikke ses og koster billeder (menu-knap.spec.js) */
body.ny-side .topbar .g.icn.menu,body.ny-hav .topbar .g.icn.menu,body.ny-under #hd .burger{-webkit-backdrop-filter:none;backdrop-filter:none}
/* husets tegninger i menuens to store felter (posen fra bestillingen, bordet fra vejviseren) */
.sheet .ny-ark-top a .ny-ark-ill{position:absolute;top:10px;right:10px;display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:#fbf6ec;box-shadow:0 0 0 3px rgba(255,255,255,.35),0 6px 14px rgba(0,0,0,.18)}
.sheet .ny-ark-top a .ny-ark-ill svg{position:static;width:40px;height:40px}
.sheet .ny-ark-bord .ny-ark-ill{box-shadow:0 0 0 1.5px rgba(214,42,58,.25)}
.sheet .ny-ark-top a{min-height:124px;padding-top:66px}

/* ============================================================
   FOOTEREN I HUSETS UDTRYK  (23/10)
   Mikkel med et skud fra sin iPhone: "bunden skal fixes". Emoji-
   pillerne (😊 🏅) er byttet for husets egne tegninger — smileyen og
   medaljen fra nyhedskortene øverst — og overskrifterne står i Bebas
   som resten af huset. Bunden har plads til den flydende Bestil mad-
   pille OG iPhonens hjemmestreg, så intet ender under pillen.
   ============================================================ */
body.hav footer{padding-top:46px;padding-bottom:calc(max(118px, var(--pille-plads)) + env(safe-area-inset-bottom, 0px))}
body.hav footer h3{margin:8px 0 26px;font:400 clamp(48px,12vw,88px)/.9 "Bebas Neue",sans-serif;letter-spacing:.01em;color:#fbf6ec;text-wrap:balance}
body.hav footer .fcols{gap:6px 24px;font-size:15px}
body.hav footer .fcols b{margin-bottom:4px;font:400 15px/1 "Bebas Neue",sans-serif;letter-spacing:.26em;color:#e8c48f}
body.hav footer .fcols a{padding:8px 0;color:rgba(251,246,236,.84);text-decoration:none}
body.hav footer .fcols a:hover{color:#fff}
.smiley-linje .fod-ill{width:34px;height:34px;padding:2px;border-radius:50%;background:#fbf6ec}
body.hav footer .smiley-linje{display:flex;width:fit-content;max-width:100%;gap:12px;margin:14px 0 0;padding:6px 18px 6px 6px;border-radius:999px;
  font-size:13.5px;line-height:1.35;color:rgba(251,246,236,.92);text-decoration:none;background:rgba(251,246,236,.07);box-shadow:inset 0 0 0 1px rgba(251,246,236,.14)}
body.hav footer .smiley-linje + .smiley-linje{margin-top:10px}
body.hav footer .smiley-linje:hover{background:rgba(251,246,236,.12)}
body.hav footer .legal{margin-top:30px;border-top:1px solid rgba(251,246,236,.12);color:rgba(251,246,236,.6)}
/* bord/ og bestil/ har deres egen footer-opbygning (.fgrid) — samme overskrifter som resten */
body.underside:not(.personale) footer .fgrid h3{font:400 clamp(48px,12vw,88px)/.9 "Bebas Neue",sans-serif;letter-spacing:.01em;color:#fbf6ec}
body.underside:not(.personale) footer .fcol b{font:400 15px/1 "Bebas Neue",sans-serif;letter-spacing:.26em;color:#e8c48f}
body.underside:not(.personale) footer .smiley-linje{color:rgba(251,246,236,.92);background:rgba(251,246,236,.07);box-shadow:inset 0 0 0 1px rgba(251,246,236,.14);padding:6px 18px 6px 6px;gap:12px}