@font-face {
    font-family: 'BergenSans';
    src: url('../fonts/BergenSans-Bold.ttf') format('truetype');
    font-style: normal;
}

 * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        body {
            font-family: 'BergenSans';
        }

        .hero {
            position: relative;
            width: 100%;
            height: 98vh;
            overflow: hidden;
        }

        /* Desktop Image */
        .hero-desktop {
            display: block;
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        /* Mobile Image */
        .hero-mobile {
            display: none;
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        /* Image Overlay */
        .hero::after {
            content: "";
            position: absolute;
            inset: 0;
            background: rgba(0, 0, 0, 0.25);
            z-index: 1;
        }

        /* Button Position */
        .hero-btn {
            position: absolute;
            left: 50%;
    bottom: 8%;
    transform: translateX(-50%);
            z-index: 2;

            display: inline-block;
            padding: 0.5em 1.2em;

            background: #f7941d;
            color: #000000;
            text-decoration: none;

            font-size: 1.5rem;
            font-weight: 600;
            border-radius: 999em;

            transition: 0.3s ease;
            cursor: pointer;
        }

        /* Tablet */
        @media (max-width: 1024px) {
            .hero {
                height: 98vh;
            }

            .hero-btn {
                left: 7%;
                bottom: 10%;
            }
        }

        /* Mobile */
        @media (max-width: 767px) {
            .hero {
                height: 98vh;
            }

            .hero-desktop {
                display: none;
            }

            .hero-mobile {
                display: block;
            }

            .hero-btn {
                left: 50%;
                bottom: 6%;
                transform: translateX(-50%);
                text-align: center;
                font-size: 1.5rem;
            }
        }

        /* Small Mobile */
        @media (max-width: 480px) {
            .hero {
                height: 98vh;
            }
        }

/* ---------- Footer ---------- */
footer {
  background-color: #bd43d2;
  padding: 4px;
  padding-bottom: calc(6px + env(safe-area-inset-bottom, 0px));
  flex-shrink: 0;
}

.links {
  display: flex;
  justify-content: center;
}

footer .links a {
  color: #fff;
  font-size: 18px;
  text-decoration: none;
  padding: 5px 12px;                  /* bigger tap target on mobile */
}

footer .links a:hover,
footer .links a:focus-visible {
  text-decoration: none;
}

/* ---------- Mobile ---------- */
@media screen and (max-width: 768px) {

 

  footer .links a {
    font-size: 16px;
  }
}

