* {
    box-sizing: border-box;
}

.idqlpCN0F2MmzRMyR_4N {
    display: flex;
    flex-direction: column;
    justify-content: end;
    width: 100%;
    gap: var(--_spacing---space--8);
}

.jFNFsYILT1Md4CDGgYJc {
    display: flex;
    flex-direction: row;
    justify-content: normal;
}

.PxoHY3T66lK4l4XT5qdA {
    display: flex;
    flex-direction: column;
    justify-content: space-between; /* Text links, Pfeil rechts */
    align-items: flex-start; /* optional: Pfeil oben ausrichten */
    width: 100%;
    gap: var(--_spacing---space--1);
}

.zw0v9AhovhN09LzolDg5 {
    display: flex;
    flex: 1;               /* Text nutzt verfügbaren Platz */
    margin: 0;  
    font-family: var(--_typography---font--secondary-family);
    font-size: var(--_typography---font-size--text-small);
    line-height: var(--_typography---line-height--huge);
}

.nrafs3bOjiUOBtwwtcdq {
    display: flex;
    flex-grow: 0;
    flex-shrink: 0;        /* verhindert, dass der Pfeil verkleinert wird */
    justify-content: center;
    align-items: center;
    border-radius: var(--radius--round);
    width: calc(var(--_button-style---size--icon-set-size) + 6px);
    aspect-ratio: 1 / 1;
    padding: 3px;
    background-color: transparent;
    transition: background-color 300ms ease;
    border: 1px solid var(--_theme---background);
}

.nrafs3bOjiUOBtwwtcdq path {
    fill: var(--_theme---text);
    transition: fill 300ms ease;
}

.jFNFsYILT1Md4CDGgYJc:hover .nrafs3bOjiUOBtwwtcdq {
    background-color: var(--_theme---text);
    border: 1px solid var(--_theme---text);
}

.jFNFsYILT1Md4CDGgYJc:hover .nrafs3bOjiUOBtwwtcdq path {
    fill: var(--_theme---background);
}

/* -----------------------------------------------
   Responsive Breakpoints (Desktop-first)
------------------------------------------------ */

/* --- Tablet (≤ 991px) --- */
@media (max-width: 991px) {
}

/* --- Mobile Landscape (≤ 767px) --- */
@media (max-width: 767px) {

    .idqlpCN0F2MmzRMyR_4N {
        gap: var(--_spacing---space--3);
        margin-left: var(--_typography---font-size--display-char);
        width: calc((var(--site--column-width-vw) * 10) + (var(--site--gutter) * 9));
    }

    .PxoHY3T66lK4l4XT5qdA {
        display: inline-flex;
        flex-direction: row-reverse;
        justify-content: start;
        align-items: center;
        gap: var(--_spacing---space--3);
        width: auto;
        padding-bottom: var(--_spacing---space--3);
        border-bottom: 1px solid var(--_theme---text);
    }

    .zw0v9AhovhN09LzolDg5 {
        min-width: calc((var(--site--column-width-vw) * 6) + (var(--site--gutter) * 5));
    }
}

/* --- Mobile Portrait (≤ 478px) --- */
@media (max-width: 478px) {
    .zw0v9AhovhN09LzolDg5 {
        min-width: calc((var(--site--column-width-vw) * 10) + (var(--site--gutter) * 8));
    }
   
}
/* -----------------------------------------------
   SectionWrapper – Gemeinsame Layout-Styles

   Diese Styles werden von allen Sam-Komponenten
   über den SectionWrapper verwendet.
------------------------------------------------ */

/* ------------------ */
/* Section Variables   */
/* ------------------ */

:host {
  --space-section: var(--space-800);
}

/* ------------------ */
/* Section            */
/* ------------------ */

.Nv1DcW1oQwUDoJIqUjNy {
  padding-block: var(--space-section);
  color: var(--_theme---text);
  background-color: var(--_theme---background);
  width: 100%;      /* Wichtig wegen Homepage */
}

/* ------------------ */
/* Container          */
/* ------------------ */

.YbPq4Lt8jgrgLW4JFcwW {
  display: block;
  position: relative;
  width: 100%;
  width: calc(100% - var(--site--margin) * 2);
  max-width: var(--max-width--main, 90rem);
  margin-inline: auto;
  container-type: inline-size;
}

/* ------------------ */
/* Width Variants     */
/* ------------------ */

.dgtDUAgHHVMbOJOtyy1i {
  width: 100%;
  max-width: 100%;
  margin-inline: 0;
}

.So6eYefr1y1ODknjlxun {
  width: 100%;
  width: calc(100% - var(--site--margin) * 2);
  max-width: var(--max-width--main, 90rem);
  margin-inline: auto;
}

.t5zMGS0dcMDkpE6OdZen {
  max-width: inherit;
}

/* ------------------ */
/* Empty State        */
/* ------------------ */

.e3MecLgZI0x6TbiNGvic {
  display: none;
}

/* -----------------------------------------------
   Responsive Breakpoints (Desktop-first)
------------------------------------------------ */

/* --- Tablet (≤ 991px) --- */
@media (max-width: 991px) {
}

/* --- Mobile Landscape (≤ 767px) --- */
@media (max-width: 767px) {
  :host {
    --space-section: var(--space-600);
  }
}

/* --- Mobile Portrait (≤ 478px) --- */
@media (max-width: 478px) {
}
.dbXl2l0n8WmqLDMHZwnQ {
  width: 100%;
  display: block;
}

/* -----------------------------------------------
   Responsive Breakpoints (Desktop-first)
------------------------------------------------ */

/* --- Tablet (≤ 991px) --- */
@media (max-width: 991px) {
}

/* --- Mobile Landscape (≤ 767px) --- */
@media (max-width: 767px) {
}

/* --- Mobile Portrait (≤ 478px) --- */
@media (max-width: 478px) {
}
/* -----------------------------------------------
   Icons – Gemeinsame Grössen-Styles

   var(--_button-style---size--icon-set-size) 
   ist in Webflow hinterlegt
   Alle Icons erben ihre Grösse über .isIconSet.
   Einzelne Komponenten können --icon-set-size lokal
   überschreiben (z.B. Audio-Buttons via Container).
------------------------------------------------ */

.sIkObn96BHKu251A33jn {
  width: var(--_button-style---size--icon-set-size);
  height: var(--_button-style---size--icon-set-size);
  display: block;
  flex-shrink: 0;
}

/* -----------------------------------------------
   Responsive Breakpoints (Desktop-first)
------------------------------------------------ */

/* --- Tablet (≤ 991px) --- */
@media (max-width: 991px) {
}

/* --- Mobile Landscape (≤ 767px) --- */
@media (max-width: 767px) {
}

/* --- Mobile Portrait (≤ 478px) --- */
@media (max-width: 478px) {
}