/* Patrick Krisch Website · Startseite Service-Carousel & Kontakt · Stand 2026-09-10 */

/* Carousel-Kopf: Pfeile rechtsbündig auf Höhe des Kickers statt unter der H2. */
@media (min-width:821px){
  #leistungen>.container{position:relative}
  .service-carousel-controls{
    position:absolute;
    top:-10px;
    right:0;
    z-index:5;
    margin:0;
  }

  /* Auf Desktop dient die Karte als Drag-Fläche; nur „Mehr erfahren“ navigiert. */
  .service-grid.service-track .service-visual-link{
    pointer-events:none;
    cursor:grab;
  }
}

@media (min-width:1041px){
  /* Alle drei Bereiche beginnen oben auf derselben visuellen Linie. */
  .contact-panel .contact-block{
    justify-content:flex-start;
    padding:42px 30px 32px;
  }

  /* Ablauf bewusst als sekundären, aber klar erkennbaren Informationsbereich absetzen. */
  .contact-panel .contact-next{
    position:relative;
    isolation:isolate;
    border-left:0;
    background:
      radial-gradient(circle at 92% 12%,rgba(74,180,235,.22),transparent 32%),
      radial-gradient(circle at 8% 92%,rgba(13,192,183,.24),transparent 38%),
      linear-gradient(145deg,#071f4d 0%,#0a4278 58%,#087d91 100%);
    color:#f3fbff;
  }
  .contact-panel .contact-next::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:-1;
    pointer-events:none;
    opacity:.34;
    background-image:radial-gradient(circle,rgba(194,239,246,.48) 1px,transparent 1.4px);
    background-size:16px 16px;
    mask-image:linear-gradient(135deg,#000 0,transparent 62%);
  }
  .contact-next-kicker{margin-bottom:18px;color:#86e3e5;font-size:11px}
  .contact-next-list{gap:16px}
  .contact-next-list li{grid-template-columns:31px 1fr;gap:11px}
  .contact-next-num{
    width:30px;
    height:30px;
    border-color:rgba(150,232,235,.78);
    background:rgba(255,255,255,.06);
    color:#d7fbfb;
    font-size:11px;
  }
  .contact-next-copy strong{margin:1px 0 3px;color:#fff;font-size:13px;line-height:1.28}
  .contact-next-copy span{color:rgba(231,244,255,.78);font-size:11px;line-height:1.4}
}

@media (max-width:820px){
  /* Auf gestapelten Layouts bleibt der Ablauf hell und fügt sich in den normalen Seitenfluss ein. */
  .contact-panel .contact-next{background:var(--surface)}
}