/*
 * Forsiden, versjon 2. Lastes etter home.css og spotlight.css.
 *
 * - Toppen har samme oppsett før og etter at banneret er lastet, og plassen til
 *   banneret er reservert. Før byttet hele hero-området form når spotlight.js var
 *   ferdig, og Lighthouse målte et layoutskift på 0,21.
 * - Én farge: svart, som resten av nettstedet (ikke mørkegrønt).
 * - Merkevarebåndet ruller av seg selv; banneret har ingen pause-knapp.
 */

/* ── Topp: samme form før og etter banneret ─────────────────────────── */
.home-modern .hero { padding: 28px 0; }
.home-modern .hero .container.hero-grid { display: flex; flex-direction: column; gap: 22px; align-items: stretch; }
.home-modern .hero-left { display: grid; grid-template-columns: 1fr; align-items: center; gap: 16px; }
.home-modern .hero-title { margin: 0; max-width: none; font-size: clamp(34px, 3.8vw, 50px); line-height: 1.16; letter-spacing: -.035em; color: #171a18; }
.home-modern .hero-title br { display: none; }
.home-modern .hero-title strong,
.home-modern.spotlight-ready .hero-title strong { display: inline; margin-right: 0; }
.home-modern .hero-title strong::after { display: none; }
.home-modern .hero-btns { margin: 0; justify-content: flex-end; }
.home-modern .hero-stats { grid-column: 1 / -1; margin: 0 !important; padding: 12px 0 0; max-width: none; border-top: 1px solid #dcdcd8; }
.home-modern .hero-stats .stat { display: flex; align-items: baseline; gap: 7px; padding-right: 22px; margin-right: 22px; }
.home-modern .hero-stats .stat-n { font-size: 26px; font-weight: 600; line-height: 1.2; color: #171a18; }
.home-modern .hero-stats .stat-l { font-size: 15px; font-weight: 500; color: #333; margin: 0; }
.home-modern .hero-right { width: 100%; max-width: none; margin: 0; min-height: 446px; }
/* Den statiske reserveversjonen vises bare hvis banneret ikke kan lastes (home-v2.js). */
.home-modern .hero-right > .banner-wrap { display: none; }
.home-modern.no-spotlight .hero-right > .banner-wrap:not([hidden]) { display: flex; }
.home-modern.no-spotlight .hero-right { min-height: 0; }
@media (max-width: 860px) {
  .home-modern .hero-left { text-align: center; gap: 14px; }
  .home-modern .hero-stats { justify-content: center; }
  .home-modern .hero-title { font-size: 35px; }
  .home-modern .hero-right { min-height: 446px; }
}

/* Plassholderen i HTML-en har samme mål som banneret, så ingenting flytter seg når
   spotlight.js bytter den ut. */
.home-modern.no-spotlight .spotlight-skeleton { display: none; }
@media (max-width: 620px) {
  .home-modern .hero-right { min-height: 586px; }
}

/* Bekk 26 uses its original white logo on the photo, without a separate logo row. */

/* ── Én farge: svart ────────────────────────────────────────────────── */
.spotlight .spotlight-cta { background: #111; }
.spotlight .spotlight-cta:hover { background: #333; }
.spotlight-heading span { color: #555; }
.spotlight-copy > p { color: #444; }
.home-modern .co-card.dark { background: #111; border-color: #111; }
.home-modern .co-card.dark .co-foot-label { color: #c8c8c8; }
.home-modern .co-foot-label { color: #555; }

/* Kontrast (WCAG AA). */
.home-modern .logos-heading { color: #555; }
.home-modern .svc-badge { color: #555; border-color: #bbb; }

/* One logo set scrolls back and forth within its real bounds; no empty tail. */
.home-modern .logos-section { width:calc(100% - 2 * var(--site-gutter)); max-width:calc(var(--site-width) - 2 * var(--site-gutter)); margin-inline:auto; border:1px solid #dddeda; border-radius:12px; overflow:hidden; }
.home-modern .logos-navigation { width:100%; margin:0; padding:0; }
.home-modern .logos-section > .logos-track-wrap { padding-inline:0; }
.home-modern .logos-navigation .logos-track-wrap { min-width:0; width:100%; margin:0; padding:0; overflow-x:auto; overflow-y:hidden; scrollbar-width:none; scroll-snap-type:none; scroll-behavior:auto; scroll-padding-inline:0; }
.home-modern .logos-navigation .logos-track-wrap::-webkit-scrollbar { display:none; width:0; height:0; }
.home-modern .logos-navigation .logo-item { scroll-snap-align:start; }
.home-modern .logos-track-wrap:focus-visible { outline:2px solid #192b20; outline-offset:3px; }
.home-modern .logos-heading { display:flex; align-items:center; justify-content:center; gap:8px; }
