/* ======================================
   tutorials.css – Seite "Tutorials"
   passt zu tutorials.php (Klassen!)
====================================== */

.tutorials-area{
  display: grid;
  grid-template-columns: 560px 1fr 640px; /* Bild | Liste | Kacheln */
  gap: 34px;
  align-items: start;
  position: relative;
  z-index: 1;
}

/* links: Bild */
.tutorials-left{
  padding: 0 0 0 120px;
  position: relative;
  z-index: 1;
}

.tutorials-img{
  width: 100%;
  height: auto;
  display: block;
  max-width: 340px;
  margin-top: 8px; /* rückt näher ans Menü */
  pointer-events: none;
}

/* Mitte: Überschrift + Liste */
.tutorials-mid{
  padding-top: 0;
  position: relative;
  z-index: 20;
}

.tutorials-h2{
  margin: 0 0 14px 26px;
  text-align: left;
  font-size: 2.4rem;
  color: #8fb0ff;
  position: relative;
  z-index: 21;
}

/* Liste */
.tutorials-list{
  margin: 0;
  padding-left: 48px;
  font-size: 1.4rem;
  color: #499dce;
  line-height: 1.15;
  position: relative;
  z-index: 21;
}

.tutorials-list li{
  margin: 2px 0;
  position: relative;
  z-index: 22;
}

.tutorials-list a{
  color: #d7e3ff;
  text-decoration: none;
  position: relative;
  z-index: 23;
  pointer-events: auto;
  cursor: pointer;
}

.tutorials-list a:hover,
.tutorials-list a:focus{
  color: #9fb8ff;
  text-decoration: underline;
}