        html {
            scroll-behavior: smooth;
        }

        body {
            color: #333;
        }

        /* --- Farver --- */
        :root {
            --profakt-blue: #013c74;
            --profakt-green: #5cc35c;
        }

        /* Navbar */
        .navbar {
            background: white;
            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
            height: 80px;
        }

        .navbar-brand .navbar-item img {
            height: 64px !important;
            width: auto;
            max-height: none;
        }

        .navbar-item:hover {
            background-color: #f7f7f7;
        }

        .navbar a.navbar-item.is-active {
            color: var(--profakt-blue);
            font-weight: 600;
        }

        /* Hero med baggrundsbillede + overlay */
        .hero {
            position: relative;
            background: url('bg.webp') center center / cover no-repeat;
            color: white;
        }

        .hero::before {
            content: "";
            position: absolute;
            inset: 0;
            background: rgba(1, 60, 116, 0.75);
            /* Blåt overlay med 75% opacitet */
            z-index: 0;
        }

        .hero .hero-body {
            position: relative;
            z-index: 1;
        }

        .hero .title {
            color: white;
            letter-spacing: -0.02em;
        }

        .hero .subtitle {
            color: #eaeaea;
        }

        .hero .button.is-primary {
            background-color: var(--profakt-green);
            border-color: transparent;
            color: white;
        }

        .hero .button.is-primary:hover {
            background-color: #4cb04c;
        }


        /* Sektioner */
        .section-title {
            text-align: center;
            font-weight: 600;
            font-size: 1.8rem;
            color: var(--profakt-blue);
            margin-bottom: 2rem;
        }

        .icon-box {
            font-size: 3rem;
            color: var(--profakt-green);
            margin-bottom: 0.5rem;
        }

        .service-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
            transition: all 0.3s ease;
        }

        /* Knapper globalt */
        .button.is-primary {
            background-color: var(--profakt-green);
            border-color: transparent;
            color: white;
        }

        .button.is-primary:hover {
            background-color: #4cb04c;
        }

        /* Footer */
        footer {
            background: var(--profakt-blue);
            color: #d9d9d9;
            padding: 3rem 1.5rem;
        }

        footer a {
            color: var(--profakt-green);
        }

        footer a:hover {
            color: white;
        }

        .team-photo {
            border-radius: 50%;
            max-width: 120px;
            margin-bottom: 1rem;
            border: 3px solid var(--profakt-green);
        }

        /* Feedback box styling */
#formMessage {
  margin-top: 1.5rem;
  opacity: 0;
  transform: translateY(-10px);
  transition: all 0.4s ease;
  border-radius: 8px;
}

/* Når beskeden bliver vist */
#formMessage.show {
  opacity: 1;
  transform: translateY(0);
}

/* Animation for fade out */
@keyframes fadeOut {
  from { opacity: 1; transform: translateY(0); }
  to { opacity: 0; transform: translateY(-10px); }
}