/* ============================================================
   You're Not Alone — det offentlige shell (_PublicLayout + _BusinessLayout).
   Loades SIDST: efter tokens → base → components.css → pages.css, så
   .public-overrides herunder vinder over components.

   Vokabularet (knapper, kort, chips, formularer, footer …) bor u-scopet i
   components.css; sidernes egne klasser (hero, trin, priser, kort …) i pages.css.
   Her er kun selve shellet: header, navigation, akut-knap, mobilmenu — og de få
   layout-regler hvor gæstesiderne bevidst afviger fra app-shellet.
   ============================================================ */

/* ============================================================
   1. Gæste-overrides: sektioner som fuldbredde-bånd med luft, ikke margin-blokke
   ============================================================ */
.pub-main { min-height:60vh; }
.public .section { padding-block:var(--sp-8); margin-bottom:0; }
.public .section--tight { padding-block:var(--sp-6); margin-bottom:0; }
/* Nestede sektioner (fx grupperne i _PriceGrid) er tætte — kun den ydre bærer luften. */
.public .section .section { padding-block:var(--sp-4) var(--sp-5); margin-bottom:0; }
@media (max-width:720px) { .public .section { padding-block:var(--sp-7); } }
/* Gæstesiderne er bygget til auto-fit og et bredere split-gap end app-siderne. */
.public .grid-auto { grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); }
.public .grid-split { gap:var(--sp-7); }
.public .grid-split.wide { grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
@media (max-width:720px) { .public .grid-split, .public .grid-split.wide { grid-template-columns:minmax(0,1fr); } }

/* ============================================================
   2. Header + navigation
   ============================================================ */
.pub-header { position:sticky; top:0; z-index:1000; background:var(--pub-surface); border-bottom:1px solid var(--pub-line); }
.pub-header__inner { max-width:var(--container-wide); margin-inline:auto; padding-inline:var(--gutter); height:var(--header-h);
    display:flex; align-items:center; gap:var(--sp-5); }
.pub-brand { display:flex; align-items:center; gap:.6rem; text-decoration:none; color:var(--pub-ink); font-weight:600; font-size:1.25rem; flex:none; letter-spacing:-.01em; }
.pub-brand:hover { color:var(--pub-ink); text-decoration:none; }
.pub-brand img { width:40px; height:40px; border-radius:50%; box-shadow:var(--shadow-1); }
.pub-brand span span { color:var(--pub-green); }

.pub-nav { display:flex; align-items:center; gap:.15rem; margin-inline:auto; }
.pub-nav > a, .pub-dd > summary { display:inline-flex; align-items:center; gap:.3em; padding:.55em .85em; border-radius:var(--r-pill);
    color:var(--pub-ink-2); font-weight:500; font-size:var(--fs-base); text-decoration:none; white-space:nowrap; transition:background-color .15s ease, color .15s ease; }
.pub-nav > a:hover, .pub-dd > summary:hover, .pub-dd[open] > summary { background:var(--pub-surface-2); color:var(--pub-ink); }
.pub-nav > a[aria-current="page"], .pub-dd.is-active > summary { color:var(--pub-green-ink); background:var(--pub-green-soft); font-weight:600; }
.pub-dd { position:relative; }
.pub-dd > summary { list-style:none; cursor:pointer; }
.pub-dd > summary::-webkit-details-marker { display:none; }
.pub-dd > summary svg { width:1em; height:1em; transition:transform .15s ease; opacity:.7; }
.pub-dd[open] > summary svg { transform:rotate(180deg); }
.pub-dd__menu { position:absolute; left:0; top:calc(100% + 8px); min-width:240px; background:var(--pub-surface); border:1px solid var(--pub-line);
    border-radius:var(--r-md); box-shadow:var(--shadow-3); padding:.4rem; display:flex; flex-direction:column; gap:.1rem; z-index:1001; }
.pub-dd__menu a { padding:.6rem .8rem; border-radius:var(--r-sm); color:var(--pub-ink); text-decoration:none; font-weight:500; font-size:var(--fs-sm); display:flex; flex-direction:column; gap:.05rem; }
.pub-dd__menu a small { color:var(--pub-muted); font-weight:400; font-size:var(--fs-xs); }
.pub-dd__menu a:hover, .pub-dd__menu a[aria-current="page"] { background:var(--pub-green-soft); color:var(--pub-green-ink); }
.pub-dd__menu hr { margin:.3rem 0; }

.pub-actions { display:flex; align-items:center; gap:.4rem; flex:none; }
.pub-actions .btn-ghost { border-color:transparent; }
.pub-actions .btn-ghost:hover { border-color:var(--pub-line-2); }

/* Mobil-menu */
.pub-menu-toggle { display:none; width:48px; height:48px; border:0; background:transparent; border-radius:var(--r-sm); color:var(--pub-ink); flex:none; place-items:center; }
.pub-menu-toggle svg { width:26px; height:26px; }
.pub-menu-toggle .ic-close { display:none; }
.pub-header.is-open .pub-menu-toggle .ic-open { display:none; }
.pub-header.is-open .pub-menu-toggle .ic-close { display:block; }

@media (max-width:1100px) {
    .pub-nav > a, .pub-dd > summary { padding-inline:.65em; font-size:var(--fs-sm); }
    .pub-actions .pub-login { display:none; }
}
@media (max-width:960px) {
    .pub-header__inner { height:var(--header-h-sm); gap:var(--sp-3); }
    .pub-brand { font-size:1.1rem; }
    .pub-brand img { width:34px; height:34px; }
    .pub-brand span { display:none; }
    .pub-menu-toggle { display:grid; margin-left:auto; order:3; }
    .pub-actions { order:2; margin-left:auto; }
    .pub-actions .pub-login { display:none; }
    .public .universe-bar a { display:none; }
    .pub-nav { display:none; }
    .pub-header.is-open .pub-nav { display:flex; flex-direction:column; align-items:stretch; gap:.15rem;
        position:fixed; left:0; right:0; top:var(--header-h-sm); bottom:0; overflow-y:auto; z-index:999;
        background:var(--pub-surface); padding:var(--sp-4) var(--gutter) var(--sp-8); border-top:1px solid var(--pub-line); }
    .pub-header.is-open .pub-nav > a, .pub-header.is-open .pub-dd > summary { font-size:var(--fs-lg); padding:.8em .9em; border-radius:var(--r-md); }
    .pub-header.is-open .pub-dd__menu { position:static; box-shadow:none; border:0; background:var(--pub-surface-2); border-radius:var(--r-md); margin:.2rem 0 .5rem; padding:.4rem; }
    .pub-header.is-open .pub-dd__menu a { font-size:var(--fs-base); padding:.75rem .9rem; }
    .pub-nav__mobile-only { display:flex; flex-direction:column; gap:.15rem; margin-top:var(--sp-4); padding-top:var(--sp-4); border-top:1px solid var(--pub-line); }
    .pub-nav__mobile-only .btn { min-height:52px; }
    body.pub-menu-open { overflow:hidden; }
}
@media (min-width:961px) { .pub-nav__mobile-only { display:none; } }

/* Erhvervsuniversets nav er en .pub-nav — kun det aktive punkt har egen regel. */
.pub-nav.biz-nav > a.active { color:var(--pub-green-ink); background:var(--pub-green-soft); font-weight:600; }
.public .biz-suffix { color:var(--pub-muted); font-size:var(--fs-sm); font-weight:500; }