body {
    margin: 0;
    padding: 0;
    background: #000;
    font-family: "Segoe UI", sans-serif;
    min-height: 100vh;
    overflow: hidden; /* Standard: ingen scroll på desktop */
  }
  
  .overlay {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    z-index: 10;
    background: rgba(0,0,0,0.6);
    padding: 1rem 2rem;
    border-radius: 12px;
    color: #fff;
    max-width: 90%;
  }
  
  .overlay h1 {
    font-size: clamp(1.8rem, 5vw, 2.5rem);
    margin: 0;
  }
  
  .overlay p {
    font-size: clamp(1rem, 3vw, 1.2rem);
    margin-top: 10px;
    opacity: 0.9;
  }
  
  /* Grid der fylder hele baggrunden */
  .image-grid {
    position: fixed;
    inset: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); /* Fleksibelt: auto-tilpas kolonner */
    gap: 2px;
    z-index: 1;
    overflow: hidden; /* Standard: ingen scroll på desktop */
  }
  
  .image-grid img {
    width: 100%;
    aspect-ratio: 1 / 1;   /* Gør billeder kvadratiske */
    object-fit: cover;     /* Beskær så cellen fyldes uden kanter */
    opacity: 0.85;         /* Lidt gennemsigtig for dybde */
    transition: transform 0.3s ease; /* Blød animation */
    
    /* Start-rotation og animation */
    transform: rotate(var(--start-rotation));
    animation: oscillate var(--duration) infinite alternate ease-in-out;
  }
  
  /* Keyframes for oscillation (frem og tilbage rotation) */
  @keyframes oscillate {
    0% {
      transform: rotate(calc(var(--start-rotation) - var(--amplitude)));
    }
    100% {
      transform: rotate(calc(var(--start-rotation) + var(--amplitude)));
    }
  }
  
  .image-grid img:hover {
    animation-play-state: paused; /* Stop animation ved hover */
    transform: scale(1.05) !important; /* Zoom ved hover (overstyr) */
    z-index: 2; /* Bring til forgrunden */
  }
  
  /* Mobil-specifik: Gør grid scrollbart, mens overlay er fixed */
  @media (max-width: 600px) {
    body {
      overflow-y: auto; /* Tillad vertical scroll */
    }
    .image-grid {
      position: relative; /* Ikke fixed – lad det flyde naturligt */
      height: auto; /* Højde baseret på indhold (mange rækker) */
      overflow: visible; /* Tillad indhold at overstige */
      inset: auto; /* Fjern fixed-positionering */
    }
  }
  
  /* Hvis du vil tvinge færre på meget små skærme */
  @media (max-width: 400px) {
    .image-grid {
      grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); /* Mindre min-bredde */
    }
  }