/* CSS Document */

/*til layout på projektsider*/	
@media (min-width: 580px) {

	#falck{
		color:#000;
	}	
.header-container {
  display: grid;
  grid-template-columns: 1fr 2fr; /* matcher page-layout */
  gap: 40px; /* samme som .page-layout */
  align-items: center;
}

.header-container h1 {
  grid-column: 2 / 3; /* starter i kolonne 2 */
  justify-self: start; /* flugter venstre kant */
  margin-left: 0px;
  margin-bottom: 10px;	
}	
 .header-container h1 {
    color: #fff; /* skjul h1 på skærme bredere end 580px */
  }	

	h1{
		margin-bottom: 10px;
	}	

.page-layout {
    display: grid;
    grid-template-columns: 1fr 2fr; /* tekst 1/3, billede 2/3 */
    gap: 40px;
    grid-template-areas: "text image";
	margin: 10px;
    /* fjern align-items: start; da vi styrer med grid-area */
  }

	.forside{
		padding: 0px;
	}	
  .page-text {
  grid-column: 1;           /* tekst i venstre kolonne */
  position: sticky;         /* gør den sticky */
  top: 70px;                /* afstand fra toppen af viewport */
  align-self: start;        /* starter øverst i grid-cellen */  
  }

	#cv {
		position: relative;
		top: 0px;
	}	

  .page-images {
    grid-area: image;
	width: 100%;
  display: flex;       /* flex-container */
  flex-wrap: wrap;     /* flere billeder på række */
  gap: 10px;           /* afstand mellem billeder */  
  }

  .page-images img {
    width: 100%;
    display: block;
    height: auto;
  }

  .page-text > h2:first-of-type {
    margin-top: 0;      /* fjern margin */
    padding-top: 0;     /* tilføj evt. padding hvis nødvendigt */
  }

  .page-text > h2:not(:first-of-type) {
    margin-top: 20px;   /* de andre h2’er får normal afstand */
  }	
}

