.cours-card :is(h1,h2,h3,h4,h5,h6,p){
  margin: 0;
  padding: 0;
  text-align: center;
}

.cours-stitch{
  gap: 8px;
}

.details-wrapper{
  gap: 20px;
}

.kurs_liste_container{
  background-color:#FFFDF4 ;
}


.cours-card{
  --stitch-color: #1d78be;
  --card-image: none;

  position: relative;
  width: 360px;
  padding: 10px;
  display: flex;
  flex-direction: column;
  align-items: stretch;

  border-radius: 25px;
   background: var(--card-bg);
  box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
}

.cours-stitch{
  position: relative;
  overflow: hidden;
  border-radius: 23px;
}


.cours-card > *{
  position: relative;
  z-index: 1;
}

.booking-wrapper p{
  text-align: center;

}







.cours-card--1{
  --stitch-color: #FFFFFF;
  --card-image: url("/wp-content/themes/bonniekleid/assets/patch_bg/Patch_1.jpg");
}

.cours-card--2{
  --stitch-color: #AFCFB4;
  --card-image: url("/wp-content/themes/bonniekleid/assets/patch_bg/Patch_2.jpg");
}

.cours-card--3{
  --stitch-color: #EAB7A4;
  --card-image: url("/wp-content/themes/bonniekleid/assets/patch_bg/Patch_3.jpg");
}

.cours-card--4{
  --stitch-color: #FFB28A;
  --card-image: url("/wp-content/themes/bonniekleid/assets/patch_bg/Patch_4.jpg");
}

.cours-card--5{
  --stitch-color: #92A38B;
  --card-image: url("/wp-content/themes/bonniekleid/assets/patch_bg/Patch_5.jpg");
}

.cours-card--6{
  --stitch-color: #A29586;
  --card-image: url("/wp-content/themes/bonniekleid/assets/patch_bg/Patch_6.jpg");
}

.cours-card--7{
  --stitch-color: #FFFFFF;
  --card-image: url("/wp-content/themes/bonniekleid/assets/patch_bg/Patch_8.jpg");
}

.cours-card--8{
  --stitch-color: #886969;
  --card-image: url("/wp-content/themes/bonniekleid/assets/patch_bg/Patch_7.jpg");
}






/*

.cours-card--1{
  --card-bg: #F1DDED;
  --stitch-color: #B994B2;
  --card-image: url("/wp-content/themes/dein-theme/img/patch-1.webp");
}

.cours-card--3{
  --card-bg: #DBF0D2;
  --stitch-color: #92A38B;
  --card-image: url("/wp-content/themes/dein-theme/img/patch-3.webp");
}

.cours-card--4{
  --card-bg: #F1E2D1;
  --stitch-color: #A29586;
  --card-image: url("/wp-content/themes/dein-theme/img/patch-3.webp");
}

.cours-card--5{
  --card-bg: #D6D8F8;
  --stitch-color: #9FA1B4;
  --card-image: url("/wp-content/themes/dein-theme/img/patch-3.webp");
}

.cours-card--6{
  --card-bg: #F0D2D2;
  --stitch-color: #A58282;
  --card-image: url("/wp-content/themes/dein-theme/img/patch-3.webp");
}

.cours-card--7{
  --card-bg: #F9F6CE;
  --stitch-color: #BEBB7B;
  --card-image: url("/wp-content/themes/dein-theme/img/patch-3.webp");
}

*/

.cours-card::before{
  content:"";
  position:absolute;
  inset: 0;
  background: var(--card-image);
  border-radius: 25px;
  background-size: cover;
  background-position: center;
  pointer-events:none;
  z-index: 0;
}



.cours-stitch::before{
  content:"";
  position:absolute;
  inset: 0;
  pointer-events:none;
  z-index: 5;

  --c: var(--stitch-color);
  --w: 2px;
  --dash: 15px;
  --gap: 15px;

  background:
    repeating-linear-gradient(
      90deg,
      var(--c) 0 var(--dash),
      transparent 0 calc(var(--dash) + var(--gap))
    )
    top / 100% var(--w) no-repeat,

    repeating-linear-gradient(
      90deg,
      var(--c) 0 var(--dash),
      transparent 0 calc(var(--dash) + var(--gap))
    )
    bottom / 100% var(--w) no-repeat,

    repeating-linear-gradient(
      180deg,
      var(--c) 0 var(--dash),
      transparent 0 calc(var(--dash) + var(--gap))
    )
    left / var(--w) 100% no-repeat,

    repeating-linear-gradient(
      180deg,
      var(--c) 0 var(--dash),
      transparent 0 calc(var(--dash) + var(--gap))
    )
    right / var(--w) 100% no-repeat;
}

.cours-stitch::after{
  content:"";
  position:absolute;
  inset: 0;
  pointer-events:none;
  z-index: 6;

  --c: var(--stitch-color);
  --w: 2px;
  --r: 23px;

  --a1: 15deg;
  --a2: 75deg;

  background:
    conic-gradient(
      from 270deg,
      transparent 0deg var(--a1),
      var(--c) var(--a1) var(--a2),
      transparent var(--a2) 360deg
    )
    top left / calc(var(--r) * 2) calc(var(--r) * 2) no-repeat,

    conic-gradient(
      from 0deg,
      transparent 0deg var(--a1),
      var(--c) var(--a1) var(--a2),
      transparent var(--a2) 360deg
    )
    top right / calc(var(--r) * 2) calc(var(--r) * 2) no-repeat,

    conic-gradient(
      from 90deg,
      transparent 0deg var(--a1),
      var(--c) var(--a1) var(--a2),
      transparent var(--a2) 360deg
    )
    bottom right / calc(var(--r) * 2) calc(var(--r) * 2) no-repeat,

    conic-gradient(
      from 180deg,
      transparent 0deg var(--a1),
      var(--c) var(--a1) var(--a2),
      transparent var(--a2) 360deg
    )
    bottom left / calc(var(--r) * 2) calc(var(--r) * 2) no-repeat;

  mask:
    radial-gradient(
      circle at 50% 50%,
      transparent calc(var(--r) - var(--w)),
      black calc(var(--r) - var(--w)) var(--r),
      transparent var(--r)
    )
    top left / calc(var(--r) * 2) calc(var(--r) * 2) no-repeat,

    radial-gradient(
      circle at 50% 50%,
      transparent calc(var(--r) - var(--w)),
      black calc(var(--r) - var(--w)) var(--r),
      transparent var(--r)
    )
    top right / calc(var(--r) * 2) calc(var(--r) * 2) no-repeat,

    radial-gradient(
      circle at 50% 50%,
      transparent calc(var(--r) - var(--w)),
      black calc(var(--r) - var(--w)) var(--r),
      transparent var(--r)
    )
    bottom right / calc(var(--r) * 2) calc(var(--r) * 2) no-repeat,

    radial-gradient(
      circle at 50% 50%,
      transparent calc(var(--r) - var(--w)),
      black calc(var(--r) - var(--w)) var(--r),
      transparent var(--r)
    )
    bottom left / calc(var(--r) * 2) calc(var(--r) * 2) no-repeat;

  -webkit-mask:
    radial-gradient(
      circle at 50% 50%,
      transparent calc(var(--r) - var(--w)),
      black calc(var(--r) - var(--w)) var(--r),
      transparent var(--r)
    )
    top left / calc(var(--r) * 2) calc(var(--r) * 2) no-repeat,

    radial-gradient(
      circle at 50% 50%,
      transparent calc(var(--r) - var(--w)),
      black calc(var(--r) - var(--w)) var(--r),
      transparent var(--r)
    )
    top right / calc(var(--r) * 2) calc(var(--r) * 2) no-repeat,

    radial-gradient(
      circle at 50% 50%,
      transparent calc(var(--r) - var(--w)),
      black calc(var(--r) - var(--w)) var(--r),
      transparent var(--r)
    )
    bottom right / calc(var(--r) * 2) calc(var(--r) * 2) no-repeat,

    radial-gradient(
      circle at 50% 50%,
      transparent calc(var(--r) - var(--w)),
      black calc(var(--r) - var(--w)) var(--r),
      transparent var(--r)
    )
    bottom left / calc(var(--r) * 2) calc(var(--r) * 2) no-repeat;
}





