#header--page .region-header {
  font-size: clamp(.8rem, .2963vw + .7407rem, 1rem);
  padding-top: 2em;
  padding-bottom: 1.5em;
}

#block-hpd2026-site-branding {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex: auto;
}

.block-system-branding-block h1 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1em;
  font-family: Montserrat, sans-serif;
  font-weight: 700;
  line-height: 1;
  margin: 0;
  font-size: 1em;
  width: 100%;
  box-sizing: border-box;
  flex-wrap: wrap;
}

.block-system-branding-block h1 a {
  text-decoration: none;
}

.block-system-branding-block h1 a.site-logo {
  width: 30vw;
  min-width: 14rem;
  box-sizing: border-box;
  height: auto;
}

.block-system-branding-block h1 .site-name {
  font-size: 4.625em;
}

.block-system-branding-block h1 .site-slogan {
  font-size: clamp(.75rem, 1.1111vw + .5278rem, 1.5rem);
  display: inline-block;
  flex: 100%;
}

main {
  padding-bottom: var(--box-gap);
}

.wrapper--page {
  max-width: var(--max-width);
  margin: auto;
  padding-left: var(--container-padding);
  padding-right: var(--container-padding);
  box-sizing: border-box;
}

.wrapper--oembed-video,
.media_embed {
  width: 100%;
  height: 0;
  padding-top: calc(100% * var(--resp-16-9));
  position: relative;
}

.wrapper--oembed-video iframe.media-oembed-content,
.media_embed iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.node--type-article.node--view-mode-full>h2 {
  font: var(--font-headline-xxxl);
  margin: 0 0 1.4rem;
}

h2.page-title {
  font: var(--font-headline-xxxl);
  margin: 0 0 1.4rem;
}

.text-formatted>*:first-child,
*>p:first-child {
  margin-top: 0;
}

.text-formatted>*:last-child,
*>p:last-child {
  margin-bottom: 0;
}

figcaption {
  font: 700 var(--font-size-xs)/1.4 var(--font-sans);
}

div[class*=".field--type-text"] *:first-child {
  margin-top: 0;
}

div[class*=".field--type-text"] *:last-child {
  margin-bottom: 0;
}

.region-footer-main {
  font: var(--font-size-s)/1.4 var(--font-sans);
  padding: var(--container-padding) 0;
}

#footer--page .block h2 {
  font: var(--font-blocktitle-bold);
  margin: 0 0 0.5rem;
}

.block h2[class*="fa-"]::after {
  margin-left: 0.5rem;
}

#block-hpd2026-hpd2014-block-1 {
  flex: 1;
}

#block-hpd2026-hpd2014-block-6 {
  max-width: min-content;
}

.region-footer-main {
  display: flex;
  gap: var(--box-gap);
  flex-direction: column;
}

.region-footer-main .block-system-branding-block {
  margin: 0 0 1rem;
}

.node--type-article.node--view-mode-full {
  margin: 0 calc(-1 * var(--container-padding));
  padding: 2rem var(--container-padding);
}

header.view-header {
  margin: var(--box-gap) 0;
}

section.has-aside {
  margin: calc(0.5 * var(--box-gap)) 0;
}

.view-listing__aside {
  flex: 0 0 25%;
  border-left: 1px solid var(--border-color);
  padding-left: calc(0.5 * var(--box-gap));
  box-sizing: border-box;
}

.layout-content.has-sidebar {
  display: grid;
  gap: var(--box-gap);
  grid-template-columns: 1fr;
}

.layout-content.has-sidebar aside {
  display: flex;
  flex-direction: column;
  gap: var(--box-gap);
}

body:not(.page-node-type-author) .layout-content {
  padding: calc(0.5 * var(--box-gap)) 0;
}

.region-before-content .node--view-mode-sticky-teaser .node__content,
.region-content .node--view-mode-sticky-teaser .node__content {
  padding: calc(0.5 * var(--box-gap)) var(--box-gap);
  margin: calc(-0.8 * var(--box-gap)) calc(0.5 * var(--box-gap)) 0;
  position: relative;
}

.has-sidebar aside .block>h2 {
  margin: 0;
  padding: 0.5rem calc(0.25 * var(--box-gap));
  text-align: center;
  text-transform: uppercase;
  font: var(--font-headline-block);

}

.view-spott-sei-dank,
.has-sidebar aside .block-block-content .block-content {
  padding: calc(0.25 * var(--box-gap));
}

/* .views-block--support .view-content {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1px;
  overflow: hidden;
} */
.views-block--support .view-content {
  display: grid;
  grid-template-columns: repeat(1, 1fr);
  gap: 1px;
  overflow: hidden;
}

.views-block--support .views-row {
  /* aspect-ratio: 1 / 1; */
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  position: relative;
}

.views-block--traegerverein .view-content {
  display: grid;
  grid-template-columns: repeat(1fr);
  gap: 1px;
  overflow: hidden;
}

.views-block--traegerverein .views-row {
  aspect-ratio: 2 / 1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  position: relative;
}

#block-hpd2026-mehrausdenrubriken .field--name-field-viewreference {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: calc(0.75 * var(--box-gap));
}

.styled-headline>h2 {
  display: flex;
  align-items: center;
  font: var(--font-headline-xxl);
  gap: 0.5em;
}

.block.styled-headline.preset--center-align {
  margin: var(--box-gap) auto;
  padding: var(--box-gap) 0;
}

.path-frontpage .styled-headline>h2 {
  font: var(--font-headline-xl-plus);
}

.styled-headline.preset--center-align>h2 {
  font-weight: 900;
  padding: 0 0 var(--box-gap);
  margin: 0;
}

.paragraph--type--embed .field--name-field-link {
  display: flex;
  align-items: start;
}

.paragraph--type--embed .field--name-field-link a {
  margin: 0;
}

.styled-headline>h2::after,
.styled-headline.preset--center-align>h2::before,
.paragraph--type--embed .field--name-field-link::before {
  content: "";
  flex: 1;
  height: 2px;
}

#block-hpd-events {
  padding: var(--box-gap) 0;
}

#block-hpd-events>h2 {
  margin-top: 0;
}

#block-hpd-events+#block-hpd2026-popular-content {
  margin-top: 0;
}

.block-views-blockpopular-block-1 .item-list ul {
  display: grid;
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: step-counter;
  gap: calc(0.8 * var(--box-gap));
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  font: var(--font-headline-l);
}

.block-views-blockpopular-block-1 .item-list ul li {
  margin: 0;
  text-align: center;
  counter-increment: step-counter;
  display: flex;
  flex-direction: column;
  justify-content: start;
  position: relative;
}

.block-views-blockpopular-block-1 .item-list ul li::before {
  content: counter(step-counter);
  font: var(--font-headline-m);
  font-size: 2.1rem;
  border-radius: 50%;
  width: 1.8em;
  height: 1.8em;
  line-height: 1.8em;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--light);
  color: var(--hpd-dark);
  margin: 0 auto 0.5em;
}

.layout--grid-1-2 {
  display: grid;
  grid-template-columns: 30% 1fr;
  /* grid-template-columns: minmax(var(--min-container-width), 30%) minmax(var(--min-container-width), 70%); */
  /* minmax(max(var(--min-container-width),30%), 1fr) */
  gap: calc(0.5 * var(--box-gap));
  hyphens: auto;
}

/* Der Footer muss als Bezugspunkt dienen */
#footer--page {
  padding-bottom: 60px;
  /* Platzhalter für den Button schaffen */
}

.c-back-to-top {
  position: fixed;
  bottom: 24px;
  right: 24px;
  z-index: 90;
  width: 44px;
  height: 44px;
  background-color: var(--bright-primary);
  color: var(--max-light);
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);

  /* Standardmäßig unsichtbar */
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s, visibility 0.3s, transform 0.2s, bottom 0.2s;
}

.c-back-to-top svg {
  width: 20px;
  height: 20px;
}

.c-back-to-top.is-visible {
  opacity: 1;
  visibility: visible;
}

.c-back-to-top.is-docked {
  position: absolute;
  bottom: 24px;
}

.c-back-to-top:hover {
  background-color: var(--hpd-dark);
  transform: translateY(-3px);
}

.c-block__footer-link {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5em;
  padding: 0.5em 1em;
}

.region-ads-top,
.region-ads-before-content {
  display: flex;
  justify-content: center;
  align-items: center;
}

.region-ads-top .block-ads,
.region-ads-before-content .block-ads {
  padding: 1rem 0;
}

.block-ads {
  width: fit-content;
}

.block-ads .hint {
  text-align: right;
  font-size: 0.75rem;
  color: var(--hpd-dark);
  margin: 0;
}

#block-hpd2026-views-block-support-block-1-2,
#block-ads-skyscraper{
  display: none;
}
.wrapper--oembed-video{
  position: relative;
  overflow: hidden;
  width: 100%;
  padding-top: calc(100% * var(--resp-16-9));
}

.wrapper--oembed-video iframe.media-oembed-content{
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  border: 0;
}
.wrapper--oembed-video .field--name-field-media-oembed-video{
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
}
.block-ads.block-ads-empty {
  display: none;
}
@media screen and (min-width: 768px) {
  .region-footer-main {
    justify-content: space-between;
    flex-wrap: wrap;
    flex-direction: row;
    gap: var(--box-gap);
  }

  .layout-content.has-sidebar {
    display: grid;
    gap: calc(0.5 * var(--box-gap));
    grid-template-columns: 3fr 1fr;
    border-bottom: 1px solid var(--border-color);
  }

  .path-frontpage .layout-content.has-sidebar:nth-last-of-type(1) {
    border-bottom: none;
  }

  .layout-content.has-sidebar>aside {
    padding-left: calc(0.5*var(--box-gap));
    border-left: 1px solid var(--border-color);
  }

  .layout-content.has-sidebar aside.region-before-content-sidebar {
    justify-content: start;
  }
}

@media screen and (min-width: 1024px) {
#block-hpd2026-views-block-support-block-1-2,
#block-ads-skyscraper{
  display: block;
}

  #block-social {
    display: block;
  }

  section.has-aside {
    display: flex;
    gap: var(--box-gap);
  }

  #header--page .region-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }

  #block-hpd2026-site-branding {
    display: block;
  }

  .block-system-branding-block h1 {
    align-items: center;
    flex-direction: row;
    gap: 0.5em calc(1.2 * var(--box-gap));
    flex-wrap: nowrap;
  }

  .block-system-branding-block h1::after {
    content: "";
  }

  .block-system-branding-block h1 a.site-logo {
    width: 22.3125rem;
    height: auto;
  }

  .block-system-branding-block h1 .site-slogan {
    display: inline-block;
    flex: auto;
  }
}