/* ============================================================
   You're Not Alone — sidernes vokabular, delt af ALLE shells.
   Loades efter components.css og før app.css / public.css / panel.css.

   Her bor det, der er bundet til bestemte sider (hero, trin, peers, priser,
   FAQ, bånd, kort …) — u-scopet, så samme side ser ens ud uanset om den
   vises for en gæst (_PublicLayout) eller en indlogget (_Layout).
   Aldrig dublere en components.css-selektor her: filen loader efter, og
   ville stille overskrive den på app-siderne.
   ============================================================ */

/* ============================================================
   1. Layout-primitiver (siderne selv)
   ============================================================ */
.pub-container { width:100%; max-width:var(--container); margin-inline:auto; padding-inline:var(--gutter); }
.pub-container--wide { max-width:var(--container-wide); }
.pub-container--full { max-width:none; }
.pub-prose { max-width:var(--measure); }
.pub-prose > * + * { margin-top:1em; }
.pub-prose h2 { margin-top:2.2em; }
.pub-prose h3 { margin-top:1.6em; }
.pub-prose ul, .pub-prose ol { padding-left:1.3em; color:var(--pub-ink-2); }
.pub-prose li + li { margin-top:.35em; }
.pub-stack { display:flex; flex-direction:column; gap:var(--sp-4); }
.pub-cluster { display:flex; flex-wrap:wrap; gap:var(--sp-3); align-items:center; }
.pub-center { text-align:center; }
.section--band { background:var(--pub-surface); border-block:1px solid var(--pub-line); }
.section--soft { background:var(--pub-green-soft); }
/* Nestede sektioner (fx grupperne i _PriceGrid) */
.section .section h2 { font-size:var(--fs-h3); margin-bottom:var(--sp-4); }
.page-head--center { margin-inline:auto; text-align:center; }

/* Knapper på grøn flade */
.on-green .btn-primary { background:#fff; color:var(--pub-green-ink); }
.on-green .btn-primary:hover { background:var(--pub-green-soft); color:var(--pub-green-ink); }
.on-green .btn-ghost { color:#fff; border-color:rgba(255,255,255,.55); }
.on-green .btn-ghost:hover { background:rgba(255,255,255,.12); border-color:#fff; color:#fff; }

/* ============================================================
   2. Hero (forsiden)
   ============================================================ */
.pub-hero { padding-block:var(--sp-8) var(--sp-8); }
.pub-hero__grid { display:grid; grid-template-columns:minmax(0,11fr) minmax(0,9fr); gap:var(--sp-8); align-items:center; }
.pub-hero h1 { font-size:var(--fs-display); max-width:14ch; margin-bottom:.4em; }
.pub-hero h1 em { font-style:normal; color:var(--pub-green); }
.pub-hero .lead { max-width:38ch; font-size:var(--fs-lg); margin-bottom:var(--sp-5); }
.pub-hero__actions { display:flex; flex-wrap:wrap; gap:var(--sp-3); margin-bottom:var(--sp-6); }
.pub-reassure { list-style:none; padding:0; margin:calc(var(--sp-5) * -1) 0 var(--sp-6); display:flex; flex-wrap:wrap; gap:.4rem var(--sp-4); font-size:var(--fs-sm); color:var(--pub-ink-2); }
.pub-reassure li { display:inline-flex; align-items:center; gap:.4rem; }
.pub-reassure li::before { content:""; width:16px; height:16px; border-radius:50%; background:var(--pub-green-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23143f37' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/10px no-repeat; flex:none; }
.pub-hero__quote { display:grid; grid-template-columns:auto 1fr; gap:.7rem; align-items:start; max-width:44ch; color:var(--pub-ink-2); font-size:var(--fs-base); }
.pub-hero__quote svg { width:22px; height:22px; color:var(--pub-green-2); margin-top:.15em; }
.pub-hero__quote p { margin:0; font-style:italic; }
.pub-hero__quote small { display:block; font-style:normal; color:var(--pub-muted); margin-top:.35rem; }
.pub-figure { margin:0; border-radius:var(--r-md); overflow:hidden; box-shadow:var(--shadow-2); background:var(--pub-surface-2); }
.pub-figure img { width:100%; height:100%; object-fit:cover; aspect-ratio:3/2; }
.pub-figure--portrait img { aspect-ratio:3/4; }
.pub-figure figcaption { font-size:var(--fs-xs); color:var(--pub-muted); padding:.5rem .9rem; background:var(--pub-surface); border-top:1px solid var(--pub-line); }
@media (max-width:960px) {
    .pub-hero { padding-block:var(--sp-6) var(--sp-7); }
    .pub-hero__grid { grid-template-columns:minmax(0,1fr); gap:var(--sp-6); }
    .pub-hero__grid > figure { order:-1; }
    .pub-hero .pub-figure img { aspect-ratio:4/5; object-position:center 30%; }
    .pub-hero h1 { max-width:none; }
    .pub-hero__actions .btn { flex:1 1 auto; }
}

/* ============================================================
   3. Trin — ét sammenhængende forløb (forside, Help, Optjening, Careers)
   ============================================================ */
.pub-steps { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--sp-5); counter-reset:step; position:relative; }
.pub-steps::before { content:""; position:absolute; left:12.5%; right:12.5%; top:22px; height:2px; background:var(--pub-line-2); }
.pub-steps::after { content:""; position:absolute; left:12.5%; width:calc(75% * var(--progress, 0)); top:22px; height:2px; background:var(--pub-green); transition:width .25s ease-out; }
.pub-step { position:relative; padding-top:var(--sp-7); }
.pub-step::before { counter-increment:step; content:counter(step); position:absolute; top:0; left:calc(50% - 22px); width:44px; height:44px; border-radius:50%;
    display:grid; place-items:center; background:var(--pub-surface); border:2px solid var(--pub-line-2); color:var(--pub-green-ink); font-weight:700; font-size:var(--fs-base);
    transition:background-color .25s ease, border-color .25s ease, color .25s ease, box-shadow .25s ease; }
.pub-step.is-current::before { background:var(--pub-green); border-color:var(--pub-green); color:#fff; box-shadow:0 0 0 6px var(--pub-green-soft); }
.pub-step h3 { font-size:var(--fs-h3); text-align:center; margin-bottom:.3em; }
.pub-step p { text-align:center; font-size:var(--fs-base); margin:0; }
@media (max-width:960px) {
    .pub-steps { grid-template-columns:minmax(0,1fr); gap:var(--sp-4); }
    .pub-steps::before { left:22px; right:auto; top:0; bottom:0; width:2px; height:auto; }
    .pub-steps::after { left:22px; top:0; width:2px; height:calc(100% * var(--progress, 0)); transition:height .25s ease-out; }
    .pub-step { padding:0 0 0 var(--sp-8); }
    .pub-step::before { left:0; top:-2px; }
    .pub-step h3, .pub-step p { text-align:left; }
}
/* Lodret variant (i kort, korte lister) — samme grammatik, altid stakket */
.pub-steps--list { grid-template-columns:minmax(0,1fr); gap:var(--sp-4); margin-bottom:var(--sp-5); }
.pub-steps--list::before { left:20px; right:auto; top:0; bottom:0; width:2px; height:auto; }
.pub-steps--list .pub-step { padding:0 0 0 var(--sp-8); }
.pub-steps--list .pub-step::before { left:0; top:-2px; width:40px; height:40px; }
.pub-steps--list .pub-step h3 { text-align:left; font-size:var(--fs-lg); }
.pub-steps--list .pub-step p { text-align:left; font-size:var(--fs-base); }
/* Lodret variant har sin egen progress-linje — ellers ville den vandrette (top:22px) tegnes hen over listen. */
.pub-steps--list::after { left:20px; top:0; width:2px; height:calc(100% * var(--progress, 0)); transition:height .25s ease-out; }
.pub-joblist { list-style:none; padding:0; margin:0; display:flex; flex-direction:column; }
.pub-joblist li { display:flex; flex-direction:column; gap:.1rem; padding:.7rem 0; border-bottom:1px solid var(--pub-line); }
.pub-joblist li:last-child { border-bottom:0; }

/* ============================================================
   4. Kort-ekstra, liste-kort, aktiviteter
   ============================================================ */
.card--status .pub-status-akut { font-size:var(--fs-sm); color:var(--pub-ink-2); margin-top:var(--sp-6); padding-top:var(--sp-4); border-top:1px solid var(--pub-line); }
.vm-card .vm-badge, .vm-badge { display:inline-block; font-size:var(--fs-sm); font-weight:600; color:var(--pub-green-ink); margin-bottom:.5rem; }
.map-empty { text-align:center; padding:var(--sp-6); color:var(--pub-ink-2); }
.card.job-card, .card.resource-card { display:flex; flex-direction:column; }
.pub-card__title { font-size:var(--fs-h3); margin-bottom:.2rem; }
.pub-card__meta { margin-bottom:var(--sp-3); }
.pub-card__tags { margin-bottom:var(--sp-3); }
.pub-card__note { font-size:var(--fs-sm); margin-bottom:var(--sp-3); }
.pub-card__cta { align-self:flex-start; margin-top:auto; }
.act-grid { display:grid; gap:var(--sp-5); grid-template-columns:repeat(auto-fill,minmax(min(360px,100%),1fr)); }
.act-card { padding:0; overflow:hidden; display:flex; flex-direction:column; }
.act-media { position:relative; aspect-ratio:5/3; overflow:hidden; background:var(--pub-surface-2); }
.act-media img { width:100%; height:100%; object-fit:cover; display:block; }
.act-media-fallback { display:grid; place-items:center; background:var(--pub-green-soft); }
.act-media-fallback > span { font-size:3.4rem; font-weight:600; color:var(--pub-green-ink); opacity:.7; }
.act-joined { position:absolute; top:.7rem; right:.7rem; box-shadow:var(--shadow-1); }
.act-body { padding:var(--sp-5); display:flex; flex-direction:column; flex:1; gap:0; }
.act-body form, .act-body > a.btn { margin-top:auto; align-self:flex-start; }

/* ============================================================
   5. Peers (_PubPeerCard)
   ============================================================ */
.pub-peer { display:flex; flex-direction:column; background:var(--pub-surface); border:1px solid var(--pub-line); border-radius:var(--r-md); overflow:hidden;
    box-shadow:var(--shadow-1); transition:box-shadow .2s ease, transform .2s ease; position:relative; }
.pub-peer:hover { box-shadow:var(--shadow-2); transform:translateY(-2px); }
.pub-peer__photo { aspect-ratio:4/3; background:var(--pub-surface-2); overflow:hidden; }
.pub-peer__photo img { width:100%; height:100%; object-fit:cover; object-position:center 20%; }
.pub-peer__photo--initials { display:grid; place-items:center; font-size:2.5rem; font-weight:600; color:var(--pub-green-ink); background:var(--pub-green-soft); }
.pub-peer__body { padding:var(--sp-5); display:flex; flex-direction:column; gap:.6rem; flex:1; }
.pub-peer__name { font-size:var(--fs-lg); font-weight:600; color:var(--pub-ink); margin:0; }
.pub-peer__title { color:var(--pub-muted); font-size:var(--fs-sm); margin:-.35rem 0 0; }
.pub-peer__meta { display:flex; align-items:center; gap:.4rem; color:var(--pub-ink-2); font-size:var(--fs-sm); }
.pub-peer__meta svg { width:16px; height:16px; color:var(--pub-green-2); flex:none; }
.pub-peer__bio { font-size:var(--fs-base); color:var(--pub-ink-2); margin:0; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.pub-peer__foot { margin-top:auto; padding-top:.4rem; display:flex; align-items:center; justify-content:space-between; gap:.6rem; }
.pub-peer .fav-toggle { position:absolute; top:.6rem; right:.6rem; z-index:1; width:40px; height:40px; border-radius:50%; border:0; background:color-mix(in srgb, var(--pub-surface) 85%, transparent);
    color:var(--pub-muted); font-size:1.2rem; display:grid; place-items:center; box-shadow:var(--shadow-1); }
.pub-peer .fav-toggle svg { width:20px; height:20px; }
.pub-peer .fav-toggle.on { color:var(--pub-danger); }
.pub-peer .fav-toggle.on svg { fill:currentColor; }
.pub-peer__synthetic { position:absolute; left:.6rem; top:.6rem; font-size:.7rem; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--pub-ink-2);
    background:color-mix(in srgb, var(--pub-surface) 85%, transparent); padding:.2em .55em; border-radius:var(--r-pill); }

/* ============================================================
   6. Priser (_PriceGrid + forsidens inline-kort)
   ============================================================ */
.price-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--sp-5); align-items:stretch; }
.price-grid.fill { grid-template-columns:repeat(auto-fit, minmax(250px, 1fr)); }
.price-card { display:flex; flex-direction:column; position:relative; padding:var(--sp-6) var(--sp-5) var(--sp-5); }
.price-card.featured { border-color:var(--pub-green); box-shadow:var(--shadow-2); }
.price-ribbon { position:absolute; top:-13px; left:var(--sp-5); background:var(--pub-green); color:#fff; font-size:var(--fs-xs); font-weight:600;
    padding:.3em .8em; border-radius:var(--r-pill); }
.price-kind { color:var(--pub-green-ink); font-weight:600; font-size:var(--fs-sm); }
.price-name { font-size:var(--fs-lg); font-weight:600; color:var(--pub-ink); margin:0 0 .25rem; line-height:1.25; }
.price-amount { font-size:2.25rem; font-weight:600; color:var(--pub-ink); margin:.2rem 0; letter-spacing:-.02em; font-variant-numeric:tabular-nums; }
.price-amount span { font-size:var(--fs-sm); color:var(--pub-muted); font-weight:400; letter-spacing:0; }
.price-vat { font-size:var(--fs-xs); color:var(--pub-muted); margin:-.15rem 0 .2rem; }
.price-features { list-style:none; padding:0; margin:var(--sp-4) 0 var(--sp-5); display:flex; flex-direction:column; gap:.55rem; }
.price-features li { display:flex; gap:.55rem; align-items:flex-start; font-size:var(--fs-base); color:var(--pub-ink-2); }
.price-features li::before { content:""; flex:none; width:18px; height:18px; margin-top:.2em; border-radius:50%; background:var(--pub-green-soft);
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23143f37' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E");
    background-size:12px; background-position:center; background-repeat:no-repeat; }
.price-card .btn { margin-top:auto; }
/* Kompakte prisrækker (grupper uden feature-punkter) */
.price-rows { list-style:none; padding:0; margin:0; display:flex; flex-direction:column; background:var(--pub-surface); border:1px solid var(--pub-line); border-radius:var(--r-md); box-shadow:var(--shadow-1); overflow:hidden; }
.price-row { display:grid; grid-template-columns:minmax(0,1.6fr) minmax(0,1fr) auto; align-items:center; gap:var(--sp-4); padding:var(--sp-4) var(--sp-5); border-top:1px solid var(--pub-line); }
.price-row:first-child { border-top:0; }
.price-row.featured { background:var(--pub-green-soft); }
.price-row__name { display:flex; align-items:center; gap:var(--sp-3); flex-wrap:wrap; font-size:var(--fs-base); color:var(--pub-ink); }
.price-row .price-ribbon { position:static; transform:none; }
.price-row__amount { display:flex; align-items:baseline; gap:.5rem; flex-wrap:wrap; }
.price-row__amount .price-amount { font-size:var(--fs-h3); margin:0; }
.price-row__amount .price-vat { margin:0; }
.price-row__cta { justify-self:end; }
.price-row .btn-stack { min-height:44px; }
@media (max-width:720px) {
    .price-row { grid-template-columns:minmax(0,1fr) auto; }
    .price-row__name { grid-column:1 / -1; }
    .price-row__cta .btn { min-height:44px; }
}
@media (max-width:1024px) { .price-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:640px) { .price-grid, .price-grid.fill { grid-template-columns:minmax(0,1fr); } }

/* ============================================================
   7. FAQ (native details)
   ============================================================ */
.pub-faq { display:flex; flex-direction:column; border-top:1px solid var(--pub-line); max-width:var(--measure); }
.grid-split > .pub-faq { max-width:none; }
.pub-faq__item { border-bottom:1px solid var(--pub-line); }
.pub-faq__item > summary { list-style:none; cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:var(--sp-4); padding:var(--sp-4) 0; font-weight:600; font-size:var(--fs-lg); color:var(--pub-ink); }
.pub-faq__item > summary::-webkit-details-marker { display:none; }
.pub-faq__item > summary svg { width:22px; height:22px; flex:none; color:var(--pub-green-2); transition:transform .2s ease; }
.pub-faq__item[open] > summary svg { transform:rotate(45deg); }
.pub-faq__item > div { padding:0 0 var(--sp-5); color:var(--pub-ink-2); max-width:var(--measure); }

/* ============================================================
   8. Bånd, citat, lister, vision/mission, afslutning
   ============================================================ */
.pub-band { background:var(--pub-green); color:#fff; border-radius:var(--r-lg); padding:var(--sp-8) var(--sp-7); }
.pub-band h2, .pub-band h3 { color:#fff; }
.pub-band p { color:rgba(255,255,255,.86); }
.pub-band a:not(.btn) { color:#fff; }
.pub-band--soft { background:var(--pub-green-soft); color:var(--pub-ink); }
.pub-band--soft h2, .pub-band--soft h3 { color:var(--pub-ink); }
.pub-band--soft p { color:var(--pub-ink-2); }
.pub-band--soft a:not(.btn) { color:var(--pub-green-ink); }
@media (max-width:720px) { .pub-band { padding:var(--sp-6) var(--sp-5); border-radius:var(--r-md); } }

.pub-pullquote { font-size:var(--fs-h3); font-weight:500; color:var(--pub-ink); max-width:32ch; line-height:1.35; margin:0; text-wrap:balance; }
.pub-pullquote--green { color:var(--pub-green-ink); }
.pub-offer { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:var(--sp-7); align-items:center; }
.offer-teaser-list { list-style:none; padding:0; margin:0 0 var(--sp-5); display:flex; flex-direction:column; gap:.7rem; }
.offer-teaser-list li { display:flex; gap:.7rem; align-items:flex-start; font-size:var(--fs-lg); color:var(--pub-ink); }
.offer-teaser-list li::before { content:""; flex:none; width:24px; height:24px; margin-top:.15em; border-radius:50%; background:var(--pub-green-soft);
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23143f37' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E");
    background-size:14px; background-position:center; background-repeat:no-repeat; }
@media (max-width:960px) { .pub-offer { grid-template-columns:minmax(0,1fr); gap:var(--sp-5); } }

/* "Ikke som … / Men som …"-listen på Services */
.pub-notlist { list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:var(--sp-3); }
.pub-notlist li { display:flex; align-items:center; gap:var(--sp-3); padding:var(--sp-4) var(--sp-5); border-radius:var(--r-md); font-size:var(--fs-lg); }
.pub-notlist li::before { content:""; flex:none; width:26px; height:26px; border-radius:50%; background-size:14px; background-position:center; background-repeat:no-repeat; }
.pub-notlist__no { background:var(--pub-surface); border:1px solid var(--pub-line); color:var(--pub-muted); }
.pub-notlist__no::before { background-color:var(--pub-surface-2); background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235c6864' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6 6 18'/%3E%3C/svg%3E"); }
.pub-notlist__yes { background:var(--pub-green-soft); color:var(--pub-green-ink); font-weight:600; }
.pub-notlist__yes::before { background-color:var(--pub-green); background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E"); }
/* De tre løfter */
.pub-promises { list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--sp-5); counter-reset:promise; }
.pub-promises li { counter-increment:promise; padding:var(--sp-5); border-top:2px solid var(--pub-green); font-size:var(--fs-h3); font-weight:600; color:var(--pub-ink); line-height:1.3; text-wrap:balance; }
@media (max-width:720px) { .pub-promises { grid-template-columns:minmax(0,1fr); gap:var(--sp-3); } .pub-promises li { font-size:var(--fs-lg); padding:var(--sp-4) 0; } }

.pub-vm { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:var(--sp-7); }
.pub-vm h3 { font-size:var(--fs-lg); color:var(--pub-green-ink); margin-bottom:.2em; }
.pub-vm p { font-size:var(--fs-base); }
@media (max-width:720px) { .pub-vm { grid-template-columns:minmax(0,1fr); gap:var(--sp-5); } }

.pub-close { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); gap:var(--sp-7); align-items:center; }
.pub-close__akut { font-size:var(--fs-sm); color:var(--pub-ink-2); display:flex; gap:.6rem; align-items:flex-start; padding:var(--sp-4); background:var(--pub-amber-soft); border-radius:var(--r-md); }
.pub-close__akut svg { width:22px; height:22px; color:var(--pub-amber); flex:none; margin-top:.1em; }
@media (max-width:960px) { .pub-close { grid-template-columns:minmax(0,1fr); gap:var(--sp-5); } }

/* ============================================================
   9. Enkelt opslag, søgning
   ============================================================ */
.pub-post { max-width:820px; }
.pub-post__main { display:flex; flex-direction:column; gap:var(--sp-3); }
.pub-post__title { font-size:var(--fs-h2); margin:0; }
.pub-post__who { display:flex; justify-content:space-between; align-items:center; gap:var(--sp-3); flex-wrap:wrap; font-size:var(--fs-sm); color:var(--pub-muted); padding-top:var(--sp-3); border-top:1px solid var(--pub-line); }
.pub-post__who a { color:inherit; }
.pub-post__own { display:flex; gap:var(--sp-3); align-items:flex-start; padding-top:var(--sp-3); border-top:1px solid var(--pub-line); }
.pub-post__own details { flex:1; }
.pub-post__own summary { cursor:pointer; font-weight:600; color:var(--pub-green-ink); font-size:var(--fs-sm); }
.pub-post__replies-head { font-size:var(--fs-h3); margin:var(--sp-7) 0 var(--sp-4); }
.pub-reply p { color:var(--pub-ink); }

/* Søgning */
.pub-search { display:flex; gap:var(--sp-3); align-items:stretch; max-width:640px; }
.pub-search input { flex:1; min-width:0; border-radius:var(--r-pill) !important; padding-inline:1.2em !important; }
.pub-results__head { font-size:var(--fs-h3); margin:var(--sp-7) 0 var(--sp-4); }
.pub-results { display:grid; grid-template-columns:repeat(auto-fill,minmax(min(380px,100%),1fr)); gap:var(--sp-3); }
.pub-result { display:flex; flex-direction:column; gap:.3rem; text-decoration:none; color:var(--pub-ink); padding:var(--sp-4) var(--sp-5); }
.pub-result:hover { text-decoration:none; color:var(--pub-ink); }
.pub-result--row { flex-direction:row; align-items:center; gap:var(--sp-4); }
.pub-result__title { font-weight:600; font-size:var(--fs-lg); display:inline-flex; align-items:center; gap:.5rem; flex-wrap:wrap; }
.pub-result__meta { color:var(--pub-muted); font-size:var(--fs-sm); }

/* ============================================================
   10. Peer-profil (Map/Peer)
   ============================================================ */
.pub-peer-head { display:grid; grid-template-columns:240px minmax(0,1fr); gap:var(--sp-6); align-items:start; }
.pub-peer-head h1 { font-size:var(--fs-h2); margin-bottom:.2em; }
.pub-peer-head__photo { box-shadow:var(--shadow-2); }
.pub-sticky { position:sticky; top:calc(var(--header-h) + var(--sp-4)); }
.pub-video { display:flex; align-items:center; gap:var(--sp-4); width:100%; text-align:left; padding:var(--sp-4) var(--sp-5); border:1px solid var(--pub-line); border-radius:var(--r-md);
    background:var(--pub-surface); color:var(--pub-ink); font-weight:600; font-size:var(--fs-base); transition:border-color .15s ease, box-shadow .15s ease; }
.pub-video:hover { border-color:var(--pub-green); box-shadow:var(--shadow-1); }
.pub-video__play { width:48px; height:48px; border-radius:50%; background:var(--pub-green); color:#fff; display:grid; place-items:center; flex:none; }
.pub-video__play svg { width:22px; height:22px; margin-left:2px; }
@media (max-width:720px) {
    .pub-peer-head { grid-template-columns:minmax(0,1fr); }
    .pub-peer-head__photo { max-width:60%; }
    .pub-sticky { position:static; }
}

/* ============================================================
   11. Kort (Leaflet + OpenStreetMap) — Map/Index
   ============================================================ */
.map-wrap { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); gap:var(--sp-5); align-items:start; }
.map-wrap--solo { grid-template-columns:minmax(0,1fr); }
.map-wrap--solo .map-list { display:none; }
.map-stage { position:relative; background:var(--pub-surface); border:1px solid var(--pub-line); border-radius:var(--r-md); padding:.35rem; box-shadow:var(--shadow-1); }
.map-canvas { height:600px; border-radius:calc(var(--r-md) - 4px); overflow:hidden; z-index:1; }
.map-canvas .leaflet-container { height:100%; width:100%; font:inherit; background:var(--pub-surface-2); }
.map-canvas .leaflet-popup-content { font:inherit; font-size:var(--fs-sm); }
.map-canvas .leaflet-popup-content a { color:var(--pub-green-ink); font-weight:600; }
.map-canvas .leaflet-bar a { color:var(--pub-ink); }
.peer-pin-wrap { background:transparent; border:0; }
.peer-pin { position:relative; width:60px; height:60px; cursor:pointer; transform-origin:50% 100%; transition:transform .16s ease; filter:drop-shadow(0 4px 6px rgba(28,36,34,.35)); }
.peer-pin::after { content:""; position:absolute; left:50%; bottom:-11px; transform:translateX(-50%); border-left:11px solid transparent; border-right:11px solid transparent; border-top:16px solid #fff; }
.peer-pin-face { position:relative; z-index:1; display:grid; place-items:center; width:60px; height:60px; border-radius:50%; background:var(--pub-green); color:#fff; font-weight:600; font-size:1.25rem; border:3px solid #fff; }
.peer-pin-face.photo { background-size:cover; background-position:center 20%; color:transparent; font-size:0; }
.leaflet-marker-icon.active .peer-pin, .peer-pin:hover { transform:scale(1.12); }
.map-list { display:flex; flex-direction:column; gap:.6rem; max-height:608px; overflow-y:auto; padding-right:.25rem; }
.map-item { display:flex; gap:.8rem; align-items:center; padding:.75rem; border:1px solid var(--pub-line); border-radius:var(--r-md); background:var(--pub-surface); cursor:pointer;
    transition:border-color .15s ease, box-shadow .15s ease, background-color .15s ease; }
.map-item:hover, .map-item.active { border-color:var(--pub-green-2); box-shadow:var(--shadow-1); }
.map-item.active { box-shadow:0 0 0 2px var(--pub-green-soft), var(--shadow-1); }
.map-item.hide { display:none; }
.map-item > div:nth-child(2) { min-width:0; flex:1; }
.map-item .avatar { width:48px; height:48px; font-size:1rem; }
.map-item .peer-name { font-size:var(--fs-base); }
.map-item .tag-row { margin-top:.3rem; }
.map-contact { flex:none; }
@media (max-width:960px) {
    .map-wrap { grid-template-columns:minmax(0,1fr); }
    .map-canvas { height:60vh; min-height:380px; }
    .map-list { max-height:none; overflow:visible; }
}