@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Playfair+Display:ital,wght@0,400..900;1,400..900&display=swap');

* {
  box-sizing: border-box;
  -webkit-font-smoothing: antialiased;
  scrollbar-width: thin;
  scrollbar-color: #843587 transparent;
}

html {
  overflow-x: hidden;
  scroll-behavior: smooth;
}

body {
  margin: 0;
  padding: 0;
}

::-webkit-scrollbar {
  width: 10px;
}

::-webkit-scrollbar-track {
  background: #f5f5f5;
  border-radius: 5px;
}

::-webkit-scrollbar-thumb {
  background-color: #843587; /* Cortera primærfarve */
  border-radius: 10px;
  border: 2px solid #f5f5f5; /* giver luft omkring */
}

::-webkit-scrollbar-thumb:hover {
  background-color: #A843AC; /* Sekundærfarve ved hover */
}

p {
  font-family: 'Inter';
  font-weight: 700;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  font-family: 'Inter', sans-serif;
  letter-spacing: -0.01em;
  width:100vw;
}

p.white {
  color:#ffffff;
}

p.black {
  color:#000000;
}

header {
  position: relative;
  max-height:100vh;
  height:100vh;
  overflow:hidden;
}

video {
  width:100%;
  height:100%;
  z-index: -1;
  object-fit:cover;
}

section {
  display: flex;
  align-content: center;
  flex-wrap: wrap;
  min-width:100vw;
  height:100vh;
  padding:0;
}

.desktop_only {
  display:block;
}

.mobile_only {
  display:none;
}

@media (max-width: 768px) {
  .scroll {
    display: none;
  }
}

@media (max-width: 1024px) {
  .desktop_only {
    display:none;
  }
  header {
    display: flex;
    align-content: center;
    flex-wrap: wrap;
    height:auto;
  }
  section {
    height:auto;
  }
  .mobile_only {
    display: block;
  }
  video {
    object-fit:contain;
  }
}

.scroll {
  position: sticky;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%);
  width: 30px;
  height: 30px;
  opacity: 0.7;
  animation: bounce 2s infinite;
  z-index: 2;
}

@keyframes bounce {
  0%, 100% {
    transform: translateX(-50%) translateY(0);
  }
  50% {
    transform: translateX(-50%) translateY(10px);
  }
}