/* ===== «Våre sponsorer» nederst på forsiden og «Om parken» (sponsorer.js) =====
   Logoene står på hvite flater, så de er like tydelige i mørkt tema. Antall kolonner settes i sponsorer.js (--kol),
   så radene blir jevne (8 → 4 over 4), og en rad som ikke blir full, sentreres, så raden alltid er symmetrisk. */

.sponsors{padding:44px 0 18px;background:var(--bg-alt);border-top:1px solid var(--line)}
.ads + .sponsors{border-top:0;padding-top:16px}
.sponsors + footer{border-top:0}
.sp-head{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;margin-bottom:20px}
.sponsors h2{font-family:var(--display);text-transform:uppercase;letter-spacing:.14em;font-size:12px;font-weight:600;color:var(--accent)}
.sp-takk{font-size:13px;color:var(--muted)}
.sp-logos{--gap:12px;list-style:none;display:flex;flex-wrap:wrap;justify-content:center;gap:var(--gap)}
.sp-logos li{flex:0 0 calc((100% - (var(--kol,4) - 1) * var(--gap)) / var(--kol,4));min-width:0}
.sp-logos a,.sp-logos .sp-flis{position:relative;display:grid;place-items:center;height:116px;padding:18px 22px 26px;border-radius:16px;
  background:#fff;box-shadow:0 0 0 1px rgba(14,26,43,.07),0 1px 2px rgba(14,26,43,.05);overflow:hidden}
.sp-logos a{transition:transform .25s cubic-bezier(.32,.72,0,1),box-shadow .25s}
.sp-logos img{display:block;max-width:min(78%,190px);max-height:46px;object-fit:contain;transition:transform .25s cubic-bezier(.32,.72,0,1)}
.sp-logos img.hoy{max-height:66px}
.sp-navn{font-family:var(--display);text-transform:uppercase;letter-spacing:.06em;font-weight:600;font-size:15px;line-height:1.15;text-align:center;color:#0e1a2b}
/* «Se profil» / «Nettside» kommer fram nederst på flisen når musen er over eller den har fokus */
.sp-hint{position:absolute;left:0;right:0;bottom:10px;text-align:center;font-family:var(--display);font-size:11px;font-weight:600;
  letter-spacing:.1em;text-transform:uppercase;color:#003765;opacity:0;transform:translateY(4px);transition:opacity .2s,transform .25s cubic-bezier(.32,.72,0,1)}
@media (hover:hover){
  .sp-logos a:hover{transform:translateY(-3px);box-shadow:0 0 0 1px rgba(14,26,43,.08),0 12px 28px rgba(14,26,43,.14)}
  .sp-logos a:hover img{transform:translateY(-6px) scale(1.03)}
  .sp-logos a:hover .sp-hint{opacity:1;transform:none}
}
.sp-logos a:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.sp-logos a:focus-visible img{transform:translateY(-6px)}
.sp-logos a:focus-visible .sp-hint{opacity:1;transform:none}
.sp-logos a:active{transform:scale(.98)}
@media (max-width:760px){
  .sp-logos{--kol:2;--gap:10px}
  .sp-logos a,.sp-logos .sp-flis{height:92px;padding:14px 16px}
  .sp-logos img{max-height:38px}
  .sp-logos img.hoy{max-height:56px}
}
@media (prefers-reduced-motion:reduce){
  .sp-logos a,.sp-logos img,.sp-hint{transition:none}
  .sp-logos a:hover,.sp-logos a:hover img,.sp-logos a:focus-visible img{transform:none}
}
