/* --- Generel styling / tokens --- */
    body {
      background: #f9fafb;
      color: #111827;
    }
    .centrer-word {
      font-family: 'Montserrat', ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, 'Helvetica Neue', Arial, 'Noto Sans', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
      font-weight: 200;
      letter-spacing: 0.3em;
      text-transform: uppercase;
      color: #00567F;
    }

    /* Cards, glas osv – Tesla-agtig lethed */
    .glass {
      backdrop-filter: blur(10px);
      background: rgba(255,255,255,.7);
      box-shadow: 0 2px 8px rgba(0,0,0,0.05);
    }
    .card {
      transition: all .25s ease;
      border: 1px solid rgba(0,0,0,0.08);
      box-shadow: 0 1px 2px rgba(0,0,0,0.05);
      background: #fff;
    }
    .card:hover {
      transform: translateY(-2px);
      box-shadow: 0 4px 10px rgba(0,0,0,0.08);
    }
    .card-active {
      border-color: rgb(0 86 127);
      box-shadow: 0 0 0 3px rgba(0, 86, 127, .15);
    }
    button, .rounded-md, .rounded-lg {
      border-radius: 6px;
    }

    /* Slider styling */
    input[type="range"] {
      -webkit-appearance: none;
      appearance: none;
      height: 6px;
      background: #e5e7eb;
      border-radius: 9999px;
      width: 100%;
      outline: none;
    }
    input[type="range"]::-webkit-slider-thumb {
      -webkit-appearance: none;
      appearance: none;
      width: 18px;
      height: 18px;
      border-radius: 50%;
      background: #00567F;
      cursor: pointer;
      border: 2px solid #fff;
      box-shadow: 0 1px 2px rgba(0,0,0,.15);
      transition: transform .1s ease;
    }
    input[type="range"]::-webkit-slider-thumb:hover {
      transform: scale(1.15);
    }
    .slider-wrap { position: relative; }
    .slider-tip {
      position: absolute;
      top: -38px;
      transform: translateX(-50%);
      font-size: 12px;
      color: #fff;
      background: #111827;
      padding: 6px 10px;
      border-radius: 6px;
      white-space: nowrap;
      pointer-events: none;
      box-shadow: 0 4px 10px rgba(0,0,0,.15);
    }
    .slider-tip.hidden { display: none; }
    .slider-tip::after {
      content: "";
      position: absolute;
      left: 50%;
      transform: translateX(-50%);
      bottom: -5px;
      border-width: 6px;
      border-style: solid;
      border-color: #111827 transparent transparent transparent;
    }

    /* Pris-animation */
    @keyframes pulsePrice {
      0% {opacity:.6; transform:translateY(2px)}
      100% {opacity:1; transform:translateY(0)}
    }
    .price-animate { animation: pulsePrice .25s ease; }

    /* Modal (feature-oversigt) */
    .modal-enter { opacity: 0; transform: translateY(8px) scale(.98); }
    .modal-enter-active { opacity: 1; transform: translateY(0) scale(1); transition: all .18s ease; }

    /* Badges til funktionskort */
    .feature-badge{
      display:inline-block;
      font-size:11px;
      line-height:1;
      padding:4px 8px;
      border-radius:6px;
      border:1px solid;
      white-space:nowrap;
    }
    .badge-included{
      background:#EAF7EF; color:#166534; border-color:#A7E3BD;
    }
    .badge-tilkob{
      background:#E6F3F8; color:#00567F; border-color:#B5D9E6;
    }
    .feature-category + .feature-category{ margin-top:2rem; }

    /* Accordion til Tilføjelser (Step 3) */
    .acc-arrow { transition: transform .2s ease; }
    .acc-open .acc-arrow { transform: rotate(180deg); }
    .acc-body { display: none; }
    .acc-open .acc-body { display: block; }

    /* Tab indikator i sammenligningsmodal */
    .tab-btn.active { position: relative; }

    /* Branchefarver */
.solution-card {
  border-top-width: 3px;
}

/* Farvemapping pr. løsning */
.sol-itsupport {
  border-top-color: #0073A9;
}
.sol-drift {
  border-top-color: #649F81;
}
.sol-byg {
  border-top-color: #C47B52;
}
.sol-landskab {
  border-top-color: #59A5A1;
}
.sol-projekt {
  border-top-color: #8E7CAE;
}
.sol-energi {
  border-top-color: #D1BF5D;
}

/* Badge-farver (små tags, hvis du vil bruge dem senere) */
.badge-itsupport { color:#0073A9; background:#E3F3FB; border-color:#93B6CA; }
.badge-drift     { color:#356B52; background:#E4F2EB; border-color:#649F81; }
.badge-byg       { color:#7C4A2D; background:#F5E7DE; border-color:#C47B52; }
.badge-landskab  { color:#1F6B66; background:#E1F4F3; border-color:#59A5A1; }
.badge-projekt   { color:#4E3A86; background:#ECE7FA; border-color:#8E7CAE; }
.badge-energi    { color:#7A6C26; background:#F7F2D9; border-color:#D1BF5D; }

/* Generel badge-stil, hvis du vil kombinere med ovenstående */
.solution-pill {
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:4px 8px;
  border-radius:9999px;
  border-width:1px;
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:0.06em;
}

.nav-link {
  position: relative;
  transition: color .25s ease;
}

.nav-link::after {
  content: "";
  position: absolute;
  bottom: -3px;
  left: 0;
  width: 0%;
  height: 2px;
  background: #0073A9;
  transition: width .25s ease;
  border-radius: 2px;
}

.nav-link:hover {
  color: #0073A9;
}

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

.carousel-dot {
  width: 8px;
  height: 8px;
  border-radius: 9999px;
  background: #d1d5db; /* grå-300 */
  border: none;
  padding: 0;
  transition: background .2s ease, transform .2s ease;
}

.carousel-dot-active {
  background: #0073A9;  /* Centrér blå */
  transform: scale(1.3);
}