/* ==========================================================
   BacklinkHub – kompakte Leistungs-Section
   Themen: Backlinks / SEO-Texte / Managed Linkbuilding + Stack
   ========================================================== */

/* Headline */

.services-head{
  max-width:var(--measure);
  margin:0 auto 2rem auto;
  text-align:center;
}

.services-kicker{
  font-size:.8rem;
  letter-spacing:.15em;
  text-transform:uppercase;
  color:var(--muted);
  margin:0 0 .4rem 0;
}

.services-intro{
  margin:.8rem auto 0;
  font-size:.96rem;
}

/* Grid */

.services-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:1.1rem;
}

/* Karten */

.services-card{
  padding:1.2rem 1.3rem;
}

/* Kopfbereich: Icon + Titel + Kurztext */

.services-card-head{
  display:flex;
  align-items:flex-start;
  gap:.75rem;
  margin-bottom:.6rem;
}

.services-card-titleblock{
  flex:1 1 auto;
}

.services-title{
  margin:0 0 .15rem 0;
  font-size:1.05rem;
  font-weight:700;
}

/* Icon-Styling */

.services-icon{
  width:32px;
  height:32px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:
    radial-gradient(circle at 30% 0%, rgba(255,255,255,.18), transparent 65%),
    rgba(17,22,39,.9);
  border:1px solid rgba(255,255,255,.14);
  box-shadow:0 10px 30px rgba(0,0,0,.65);
  flex-shrink:0;
}

.services-icon svg{
  width:18px;
  height:18px;
  color:var(--brand);
}

/* Liste */

.services-list{
  list-style:none;
  margin:.4rem 0 0;
  padding:0;
  display:grid;
  gap:.3rem;
}

.services-list li{
  position:relative;
  padding-left:1rem;
  font-size:.9rem;
  color:var(--muted);
}

.services-list li::before{
  content:"";
  position:absolute;
  left:0;
  top:.55em;
  width:6px;
  height:6px;
  border-radius:999px;
  background:var(--brand);
}

/* Tag-Zeile unten – kompakter Überblick über alle Leistungen */

.services-tags{
  display:flex;
  flex-wrap:wrap;
  gap:.3rem; /* angepasst von .4 auf .3 */
  margin:1.6rem auto 0;
  max-width:var(--measure);
  justify-content:center;
}

.services-tag{
  padding:.28rem .7rem;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(7,10,18,.92);
  font-size:.8rem;
  color:var(--muted);
  white-space:nowrap;
}

/* Responsive */

@media (max-width:900px){
  .services-grid{
    grid-template-columns:1fr;
  }

  .services-tags{
    justify-content:flex-start;
  }
}
