

.hcp-section.hcp-venues-map {
  position: relative;
  z-index: 3;

  margin-top: -1px;
  padding: 68px 0 86px;

  overflow: visible !important;

  background: transparent !important;
  color: var(--hcp-black, #000);
}




.hcp-section.hcp-venues-map::before {
  content: "";
  position: absolute;
  inset: -46px 0;
  z-index: 0;

  background-color: var(--hcp-paper, #f6f6f5);

  background-image:
    linear-gradient(
      rgba(255, 255, 255, 0.4),
      rgba(255, 255, 255, 0.4)
    ),
    var(--hcp-paper-image, none);

  background-position: center, center;
  background-size: cover, cover;
  background-repeat: no-repeat, no-repeat;

  clip-path: polygon(
    0 46px,
    100% 0,
    100% calc(100% - 46px),
    0 100%
  );

  pointer-events: none;
}



.hcp-section.hcp-venues-map > .hcp-container {
  position: relative;
  z-index: 2;

  overflow: visible !important;
}




@media (max-width: 991px) {

  .hcp-section.hcp-venues-map {
    padding: 54px 0 65px;
  }

  .hcp-section.hcp-venues-map::before {
    inset: -36px 0;

    clip-path: polygon(
      0 36px,
      100% 0,
      100% calc(100% - 36px),
      0 100%
    );
  }

}




@media (max-width: 600px) {

  .hcp-section.hcp-venues-map {
    padding: 48px 0 56px;
  }

  .hcp-section.hcp-venues-map::before {
    inset: -28px 0;

    clip-path: polygon(
      0 28px,
      100% 0,
      100% calc(100% - 28px),
      0 100%
    );
  }

}




.hcp-venue-directory {
  padding: 0 0 116px;

  background: var(--hcp-black, #000);
  color: var(--hcp-black, #000);
}


.hcp-venue-directory__grid {
  display: grid;

  grid-template-columns:
    repeat(4, minmax(0, 1fr));

  gap: 18px;

  align-items: start;
}


.hcp-venue-directory__card {
  min-width: 0;

  overflow: hidden;

  background:
    var(--hcp-paper, #f6f6f5);
}




.hcp-venue-directory__media {
  position: relative;

  overflow: hidden;

  aspect-ratio: 1.55 / 1;

  background: #222;
}


.hcp-venue-directory__image {
  display: block;

  width: 100%;
  height: 100%;

  object-fit: cover;

  transition:
    transform 250ms ease;
}


.hcp-venue-directory__card:hover
.hcp-venue-directory__image {
  transform: scale(1.035);
}




.hcp-venue-directory__district {
  position: absolute;

  top: 0;
  right: 0;

  padding: 5px 10px;

  background: var(--hcp-white, #fff);
  color: var(--hcp-accent, #009ca9);

  font-size: 15px;
  font-weight: 700;
  line-height: 1;

  text-transform: uppercase;
}




.hcp-venue-directory__body {
  padding: 18px 18px 16px;

  background:
    var(--hcp-paper, #f6f6f5);

  color:
    var(--hcp-black, #000);
}


.hcp-venue-directory__name {
  margin: 0 0 10px;

  font-size: 31px;
  font-weight: 700;
  line-height: .96;

  text-transform: uppercase;
}


.hcp-venue-directory__address {
  margin: 0 0 10px;

  font-size: 16px;
  line-height: 1.35;
}


.hcp-venue-directory__website {
  display: inline-block;

  color:
    var(--hcp-accent, #009ca9);

  font-size: 15px;
  font-weight: 700;

  text-decoration: none;
}


.hcp-venue-directory__website:hover {
  text-decoration: underline;
  text-underline-offset: 3px;
}




.hcp-venue-directory__social {
  display: flex;

  gap: 7px;

  margin-top: 8px;

  color:
    var(--hcp-accent, #009ca9);
}


.hcp-venue-directory__social a {
  display: inline-flex;

  align-items: center;
  justify-content: center;

  color: inherit;

  text-decoration: none;
}




@media (max-width: 1199px) {

  .hcp-venue-directory__name {
    font-size: 27px;
  }

  .hcp-venue-directory__body {
    min-height: 240px;
  }

}




@media (max-width: 991px) {

  .hcp-venue-directory__grid {
    grid-template-columns:
      repeat(2, minmax(0, 1fr));

    gap: 22px;
  }

}




@media (max-width: 600px) {

  .hcp-venue-directory {
    padding-bottom: 80px;
  }


  .hcp-venue-directory__grid {
    grid-template-columns: 1fr;

    gap: 18px;
  }


  .hcp-venue-directory__media {
    aspect-ratio: 1.55 / 1;
  }


  .hcp-venue-directory__body {
    min-height: 0;

    padding: 17px;
  }


  .hcp-venue-directory__name {
    font-size: 29px;
  }

}




.hcp-venues-faq {
  padding: 22px 0 145px;

  background:
    var(--hcp-black, #000);

  color:
    var(--hcp-white, #fff);
}


.hcp-venues-faq
.hcp-container.hcp-venues-faq__grid {
  display: grid;

  grid-template-columns:
    340px
    minmax(0, 1fr);

  gap: 90px;

  align-items: start;

  width:
    calc(
      100% -
      var(--hcp-gutter) * 2
    );
}




.hcp-venues-faq__intro {
  position: relative;

  min-width: 0;
  min-height: 440px;
}


.hcp-venues-faq__label {
  display: inline-block;

  margin-bottom: 8px;

  padding: 4px 8px;

  background:
    var(--hcp-accent, #009ca9);

  color:
    var(--hcp-white, #fff);

  font-size: 15px;
  font-weight: 700;
  line-height: 1;

  text-transform: uppercase;
}


.hcp-venues-faq__title {
  display: table;

  margin: 0;

  padding: 5px 10px;

  background:
    var(--hcp-white, #fff);

  color:
    var(--hcp-black, #000);

  font-size: 34px;
  font-weight: 700;
  line-height: 1;

  text-transform: uppercase;
}




.hcp-venues-faq__questionmark {
  position: absolute;

  top: 116px;
  left: 58px;

  color: transparent;

  -webkit-text-stroke:
    3px
    var(--hcp-accent, #009ca9);

  font-size: 250px;
  font-weight: 700;
  line-height: .9;

  pointer-events: none;
}




.hcp-venues-faq__items {
  width: 100%;
  min-width: 0;

  padding-top: 36px;
}


.hcp-faq-item {
  width: 100%;

  border-bottom:
    1px solid
    rgba(255, 255, 255, .75);
}




.hcp-faq-item__button {
  display: flex;

  align-items: center;
  justify-content: space-between;

  gap: 30px;

  width: 100%;

  padding: 18px 0;

  border: 0;

  background: transparent;

  color:
    var(--hcp-white, #fff);

  font: inherit;

  font-size: 17px;
  font-weight: 700;
  line-height: 1.3;

  text-align: left;
  text-transform: uppercase;

  cursor: pointer;
}


.hcp-faq-item__button > span:first-child {
  flex: 1 1 auto;

  min-width: 0;
}




.hcp-faq-item__sign {
  display: flex;

  flex: 0 0 27px;

  align-items: center;
  justify-content: center;

  width: 27px;
  height: 27px;

  border-radius: 50%;

  background:
    var(--hcp-white, #fff);

  color:
    var(--hcp-accent, #009ca9);

  font-size: 24px;
  font-weight: 700;
  line-height: 1;

  transition:
    transform 250ms ease;
}


.hcp-faq-item.is-open
.hcp-faq-item__sign {
  transform: rotate(180deg);
}




.hcp-faq-item__answer {
  overflow: hidden;

  max-height: 0;

  padding:
    0
    58px
    0
    0;

  opacity: 0;
  visibility: hidden;

  transition:
    max-height 350ms ease,
    padding-bottom 350ms ease,
    opacity 220ms ease,
    visibility 0s linear 350ms;
}


.hcp-faq-item.is-open
.hcp-faq-item__answer {
  padding-bottom: 22px;

  opacity: 1;
  visibility: visible;

  transition:
    max-height 350ms ease,
    padding-bottom 350ms ease,
    opacity 220ms ease,
    visibility 0s linear 0s;
}


.hcp-faq-item__answer p {
  margin: 0;

  font-size: 16px;
  line-height: 1.5;
}


.hcp-faq-item__answer p + p {
  margin-top: 12px;
}


.hcp-faq-item__answer a {
  color: inherit;

  text-decoration: underline;
  text-underline-offset: 3px;
}




@media (max-width: 1199px) {

  .hcp-venues-faq
  .hcp-container.hcp-venues-faq__grid {
    grid-template-columns:
      290px
      minmax(0, 1fr);

    gap: 60px;
  }

}




@media (max-width: 991px) {

  .hcp-venues-faq {
    padding-bottom: 110px;
  }


  .hcp-venues-faq
  .hcp-container.hcp-venues-faq__grid {
    grid-template-columns:
      230px
      minmax(0, 1fr);

    gap: 42px;
  }


  .hcp-venues-faq__questionmark {
    left: 22px;

    font-size: 210px;
  }

}




@media (max-width: 600px) {

  .hcp-venues-faq {
    padding:
      20px
      0
      92px;
  }


  .hcp-venues-faq
  .hcp-container.hcp-venues-faq__grid {
    grid-template-columns: 1fr;

    gap: 18px;
  }


  .hcp-venues-faq__intro {
    min-height: 210px;
  }


  .hcp-venues-faq__questionmark {
    top: 28px;
    right: 16px;
    left: auto;

    font-size: 180px;
  }


  .hcp-venues-faq__items {
    padding-top: 0;
  }


  .hcp-faq-item__button {
    gap: 18px;

    font-size: 15px;
  }


  .hcp-faq-item__answer {
    padding-right: 20px;
  }

}




#hcp-live-ticket {
  --live-ticket-accent:
    var(--hcp-accent, #009ca9);

  --live-ticket-accent-dark:
    #007c88;

  --live-ticket-black:
    var(--hcp-black, #000);

  --live-ticket-white:
    var(--hcp-white, #fff);


  position: relative;
  z-index: 1;

  isolation: isolate;

  display: flex;

  align-items: center;
  justify-content: center;

  width: 100%;
  min-height: 610px;

  padding:
    110px
    0
    120px;

  overflow: hidden;

  background:
    linear-gradient(
      rgba(0, 124, 136, .55),
      rgba(0, 124, 136, .55)
    ),
    url("https://beyl5.myrdbx.io/wp-content/uploads/2026/09/hcp-ticket-cta-hintergrund.webp")
    center center / cover
    no-repeat;

  color:
    var(--live-ticket-white);
}




#hcp-live-ticket,
#hcp-live-ticket *,
#hcp-live-ticket *::before,
#hcp-live-ticket *::after {
  box-sizing: border-box;
}




#hcp-live-ticket::before {
  content: "";

  position: absolute;

  top: -1px;
  right: 0;
  left: 0;

  z-index: 1;

  width: 100%;
  height: 52px;

  background:
    var(--live-ticket-black);

  
  clip-path: polygon(
    0 0,
    100% 0,
    100% 80%,
    0 100%
  );

  pointer-events: none;
}




#hcp-live-ticket::after {
  content: "";

  position: absolute;

  right: 0;
  bottom: -1px;
  left: 0;

  z-index: 1;

  width: 100%;
  height: 52px;

  background:
    var(--live-ticket-black);

  clip-path: polygon(
    0 20%,
    100% 0,
    100% 100%,
    0 100%
  );

  pointer-events: none;
}




@media (max-width: 991px) {

  #hcp-live-ticket {
    min-height: 540px;

    padding:
      100px
      0
      110px;
  }


  #hcp-live-ticket::before,
  #hcp-live-ticket::after {
    height: 44px;
  }

}




@media (max-width: 767px) {

  #hcp-live-ticket {
    min-height: 500px;

    padding:
      90px
      0
      100px;

    background-position:
      center center;
  }


  #hcp-live-ticket::before,
  #hcp-live-ticket::after {
    height: 36px;
  }

}




@media (max-width: 480px) {

  #hcp-live-ticket {
    min-height: 470px;

    padding:
      82px
      0
      92px;
  }


  #hcp-live-ticket::before,
  #hcp-live-ticket::after {
    height: 30px;
  }

}




@media (prefers-reduced-motion: reduce) {

  .hcp-venue-directory__image,
  .hcp-faq-item__answer,
  .hcp-faq-item__sign,
  .hcp-live-ticket__button {
    transition: none;
  }

}