/* ===================================================== */
/* PROSJEKTER GRID                                       */
/* ===================================================== */

.project-grid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap:28px;
  margin-top:40px;
}

/* ===================================================== */
/* PROSJEKTKORT                                          */
/* ===================================================== */

.project{
  background:#111;
  border-radius:12px;
  overflow:hidden;
  transition:transform .25s ease, box-shadow .25s ease;
}

/* Gjør hele kortet klikkbart */
.project a{
  display:block;
  text-decoration:none;
  color:inherit;
  height:100%;
}

/* Hover-effekt */
.project:hover{
  transform:translateY(-6px);
  box-shadow:0 12px 28px rgba(0,0,0,0.4);
}

/* Bilde */
.project img{
  width:100%;
  height:220px;
  object-fit:cover;
  display:block;
}

/* Tekstdel */
.project-body{
  padding:20px;
}

.project-body h2{
  margin:0 0 12px 0;
  font-size:1.4rem;
}

.project-body p{
  margin:0;
  line-height:1.6;
  opacity:0.9;
}

/* Status-badge */
.status{
  display:inline-block;
  margin-top:10px;
  font-size:.85rem;
  opacity:.7;
}

/* ===================================================== */
/* INTRO                                                  */
/* ===================================================== */

.projects-page .intro{
  max-width:900px;
  margin:60px auto 40px auto;
}

.projects-page .intro p{
  font-size:1.05rem;
  line-height:1.7;
  opacity:.85;
}

/* ===================================================== */
/* RESPONSIVE                                             */
/* ===================================================== */

@media (max-width:700px){

  .project img{
    height:180px;
  }

  .project-body{
    padding:16px;
  }

}