/* ===================================================================
   Resolveit — Theme (clean + fixed)
   - Fix: Bootstrap dropdown under "Ressurser" blir ikke klippet av hero
   - Ryddet duplikater / motstridende blokker
   =================================================================== */

/* ------------------------ Variabler ------------------------ */
:root{
  --bg:#f6f9fc;
  --fg:#0c1b27;
  --muted:#4f5b66;
  --accent:#2f8cff;
  --stroke:#e6edf3;
  --radius:14px;

  --bubble:rgba(12,27,39,.05);
  --bubble2:rgba(12,27,39,.07);

  /* overlap mellom hero og neste seksjon */
  --hero-overhang: 48px;

  /* hero height tuning (brukes av inline vars i HTML også) */
  --hero-shift: 240px;
}

/* ------------------------ Base ------------------------ */
html,body{height:100%}
html{ font-size:13px; }
@media (min-width:1200px){
  html{ font-size:13.25px; }
}

body{
  background: radial-gradient(700px 340px at 80% -10%, #dff0ff 0%, transparent 50%), var(--bg);
  color:var(--fg);
  font-family:system-ui,-apple-system,"Segoe UI",Inter,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

/* Bootstrap knappfarge */
.btn-primary{background:var(--accent);border-color:var(--accent)}

/* ------------------------ Navbar ------------------------ */
.navbar{
  /* Viktig: over hero (dropdowns) */
  position: relative;
  z-index: 1080;

  border-bottom:1px solid rgba(0,0,0,.06);

  /* "tøffere" uttrykk */
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  background: rgba(255,255,255,0.94);

  padding-top:.8rem;
  padding-bottom:.8rem;
}

.navbar-brand img{height:40px; width:auto; object-fit:contain}

.brand-text{
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:.85rem;
  color:#111;
}

.navbar .nav-link{
  color:#111 !important;
  font-size:1rem;
  font-weight:500;
  letter-spacing:.02em;
  padding:.5rem .75rem;
  transition:color .15s ease;
  position:relative;
}

@media (min-width:992px){
  .navbar .nav-link{font-size:1.06rem}
}

.navbar .nav-link:hover,
.navbar .nav-link:focus{
  color:var(--accent) !important;
}

.navbar .nav-link::after{
  content:"";
  position:absolute;
  left:0;
  bottom:-2px;
  width:0;
  height:2px;
  background:var(--accent);
  transition: width .25s ease;
}

.navbar .nav-link:hover::after,
.navbar .nav-link:focus::after{
  width:100%;
}

.navbar .nav-link.active{
  color:var(--accent) !important;
}

.navbar .nav-link.active::after{
  width:100%;
}

.navbar .btn{
  font-size:.8rem;
  text-transform:uppercase;
  letter-spacing:.08em;
}

/* Dropdown meny må ligge over alt visuelt */
.dropdown-menu{
  z-index: 1090;
}

/* ------------------------ Chips / Kort ------------------------ */
.chip{
  display:inline-block;
  background:#fff;
  border:1px solid var(--stroke);
  border-radius:999px;
  padding:.35rem .75rem;
  color:#2b4456;
  font-size:.9rem;
}

.bubble-card{
  position:relative;
  background:#fff;
  border:1px solid var(--stroke);
  border-radius:var(--radius);
  box-shadow:0 10px 40px rgba(12,27,39,.08);
}

.bubble-card::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
  background:
    radial-gradient(140px 70px at 12% 18%, var(--bubble2), transparent 60%),
    radial-gradient(160px 70px at 88% 14%, var(--bubble), transparent 60%),
    radial-gradient(130px 90px at 50% 120%, var(--bubble), transparent 60%);
}

.glass{
  background:#fff;
  border:1px solid var(--stroke);
  border-radius:var(--radius);
  box-shadow:0 6px 28px rgba(14,30,37,.08);
}

.subtle{color:var(--muted)}
.footer{border-top:1px solid var(--stroke); color:#5b6772}

/* ------------------------ HERO ------------------------ */
.hero{
  position:relative;

  /* FIX: dropdown skal ikke klippes */
  overflow: visible;

  padding-top:96px;
  padding-bottom: calc(220px + var(--hero-overhang));
  z-index:0;
}

/* Hvis du vil “klippe” KUN egne lag i hero (ikke dropdown): */
.hero.hero--bubbles::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  background:
    radial-gradient(220px 110px at 14% 18%, var(--bubble2), transparent 60%),
    radial-gradient(260px 120px at 86% 12%, var(--bubble), transparent 60%),
    radial-gradient(220px 120px at 50% 120%, var(--bubble), transparent 60%);
}

.hero.hero--parallax{
  background-image: var(--hero-img);
  background-position: var(--hero-pos, 50% 35%);
  background-size: cover;
  background-repeat: no-repeat;
}

@media (min-width:992px){
  .hero.hero--parallax{ background-attachment: fixed; }
}

.hero .hero-overlay{
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background: linear-gradient(
    to bottom,
    rgba(255,255,255,.95) 0%,
    rgba(255,255,255,.80) 26%,
    rgba(255,255,255,.62) 55%,
    rgba(255,255,255,.78) 85%,
    rgba(255,255,255,.92) 100%
  );
}

.hero > .container{ position:relative; z-index:2; }

.hero .hero-text{
  display:inline-block;
  background:rgba(255,255,255,.70);
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
  border-radius:14px;
  padding:18px 22px;
  box-shadow:0 8px 30px rgba(15,25,40,.10);
  max-width:100%;
  margin-top:0; /* du hadde en override senere – samlet her */
}

.hero .display-5{font-size:2.35rem; line-height:1.15;}
.hero .lead{font-size:1.05rem;}

@media (min-width:992px){
  .hero{
    padding-top:108px;
    padding-bottom: calc(260px + var(--hero-overhang));
  }
  .hero .display-5{font-size:2.6rem;}
}

/* “Tall” variant – konsistent */
.hero.hero--tall{
  --hero-shift: 200px;
  --hero-overhang: 48px;
}

/* Mobil: litt mindre overlap */
@media (max-width:991.98px){
  :root{ --hero-overhang: 40px; }
}

/* ------------------------ Seksjonen etter hero ------------------------ */
/* Standard: ingen overlap */
.section--after-hero{
  position:relative;
  z-index:4;
  margin-top: 0;
  padding-top:8px;
  padding-bottom:18px;
}

/* Kun når seksjonen kommer direkte etter hero: overlap */
.hero + .section--after-hero{
  margin-top: calc(-1 * var(--hero-overhang));
}

.section--after-hero .row{
  --bs-gutter-x:1.1rem;
  --bs-gutter-y:1.1rem;
}

.section--after-hero .bubble-card{
  padding:1rem 1.1rem;
}

/* ------------------------ Småjusteringer ------------------------ */
.table thead th{border-bottom:2px solid var(--stroke)}
.table-primary th{background:#eaf3ff}


/* --- FIX: dropdown skal ligge over hero og være klikkbar --- */
.navbar {
  position: relative;
  z-index: 2000;
}

.navbar .dropdown-menu {
  position: absolute;
  z-index: 2001;
}
/* Forside-fix: hero-lag skal aldri fange klikk over navbar/dropdown */
.hero-overlay,
.hero.hero--bubbles::before {
  pointer-events: none !important;
}

/* Tving dropdown over hero (forsiden) */
.navbar { position: relative; z-index: 2000; }
.navbar .dropdown-menu { z-index: 2001; }

/* === FINAL FIX: Forside dropdown + hero === */

/* Hero må ALDRI klippe navbar-dropdown */
section.hero {
  overflow: visible !important;
}

/* Ingen hero-lag skal kunne ta klikk */
section.hero::before,
section.hero .hero-overlay {
  pointer-events: none !important;
}

/* Navbar og dropdown over ALT */
#site-header,
.navbar {
  position: relative;
  z-index: 3000 !important;
}

.navbar .dropdown-menu {
  z-index: 3001 !important;
}
