.fsbuilder-heading {
  font-size: var(--fsbuilder-font-size, 32px);
  margin: 0;
  line-height: 1.3;
}

/* Tablet */
@media (min-width: 769px) and (max-width: 1024px) {
  .fsbuilder-heading {
    font-size: var(
      --fsbuilder-font-size-tablet,
      var(--fsbuilder-font-size, 32px)
    );
    line-height: var(--fsbuilder-line-height-tablet, var(--fsbuilder-line-height, 1.3)) !important;
    text-align: var(--fsbuilder-heading-align-tablet, var(--fsbuilder-heading-align, left)) !important;
  }
}

@media (min-width: 769px) and (max-width: 1024px) {
  .fsbuilder-heading.fsbuilder-heading--tablet-spacing {
    margin-top: var(--fsbuilder-heading-margin-top-tablet, var(--fsbuilder-heading-margin-top, 0px)) !important;
    margin-bottom: var(--fsbuilder-heading-margin-bottom-tablet, var(--fsbuilder-heading-margin-bottom, 0px)) !important;
    margin-left: min(var(--fsbuilder-heading-margin-left-tablet, var(--fsbuilder-heading-margin-left, 0px)), 50%) !important;
    margin-right: min(var(--fsbuilder-heading-margin-right-tablet, var(--fsbuilder-heading-margin-right, 0px)), 50%) !important;
    max-width: calc(100% - min(var(--fsbuilder-heading-margin-left-tablet, var(--fsbuilder-heading-margin-left, 0px)), 50%) - min(var(--fsbuilder-heading-margin-right-tablet, var(--fsbuilder-heading-margin-right, 0px)), 50%)) !important;
  }

  .fsbuilder-text.fsbuilder-text--tablet-spacing {
    margin-top: var(--fsbuilder-text-margin-top-tablet, var(--fsbuilder-text-margin-top, 0px)) !important;
    margin-bottom: var(--fsbuilder-text-margin-bottom-tablet, var(--fsbuilder-text-margin-bottom, 0px)) !important;
    margin-left: min(var(--fsbuilder-text-margin-left-tablet, var(--fsbuilder-text-margin-left, 0px)), 50%) !important;
    margin-right: min(var(--fsbuilder-text-margin-right-tablet, var(--fsbuilder-text-margin-right, 0px)), 50%) !important;
    max-width: calc(100% - min(var(--fsbuilder-text-margin-left-tablet, var(--fsbuilder-text-margin-left, 0px)), 50%) - min(var(--fsbuilder-text-margin-right-tablet, var(--fsbuilder-text-margin-right, 0px)), 50%)) !important;
  }

  .fsbuilder-text.fsbuilder-text--tablet-typography {
    font-size: var(--fsbuilder-text-font-size-tablet, var(--fsbuilder-text-font-size, inherit)) !important;
    line-height: var(--fsbuilder-text-line-height-tablet, var(--fsbuilder-text-line-height, normal)) !important;
    text-align: var(--fsbuilder-text-align-tablet, var(--fsbuilder-text-align, left)) !important;
  }

  .fsbuilder-sec.fsbuilder-section--tablet-min-height {
    min-height: var(--fsbuilder-section-tablet-min-height) !important;
  }

  .fsbuilder-sec.fsbuilder-section--tablet-background {
    background-image: var(--fsbuilder-section-tablet-background-image) !important;
    background-size: var(--fsbuilder-section-tablet-background-size) !important;
    background-position: var(--fsbuilder-section-tablet-background-position) !important;
    background-repeat: var(--fsbuilder-section-tablet-background-repeat) !important;
  }

  .fsbuilder-sec.fsbuilder-section--tablet-padding {
    padding-left: var(--fsbuilder-section-tablet-padding) !important;
    padding-right: var(--fsbuilder-section-tablet-padding) !important;
  }

  .fsbuilder-sec.fsbuilder-section--tablet-image-layout {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    padding: 0 !important;
    background-image: none !important;
  }

  .fsbuilder-sec.fsbuilder-section--tablet-image-layout > .fsbuilder-mobile-section-image {
    display: block;
    width: 100%;
    height: var(--fsbuilder-section-tablet-separated-image-height, 300px);
    min-height: var(--fsbuilder-section-tablet-separated-image-height, 300px);
    flex: 0 0 var(--fsbuilder-section-tablet-separated-image-height, 300px);
    background-image: var(--fsbuilder-section-tablet-separated-image, none);
    background-size: var(--fsbuilder-section-tablet-separated-image-size, cover);
    background-position: var(--fsbuilder-section-tablet-separated-image-position, 50% 50%);
    background-repeat: no-repeat;
  }

  .fsbuilder-sec.fsbuilder-section--tablet-image-layout > .fsbuilder-section-container {
    width: 100%;
    padding: var(--fsbuilder-section-tablet-content-padding-top, 0)
      var(--fsbuilder-section-tablet-content-padding-right, 0)
      var(--fsbuilder-section-tablet-content-padding-bottom, 0)
      var(--fsbuilder-section-tablet-content-padding-left, 0);
    box-sizing: border-box;
  }

  .fsbuilder-sec.fsbuilder-section--tablet-image-top > .fsbuilder-mobile-section-image,
  .fsbuilder-sec.fsbuilder-section--tablet-image-bottom > .fsbuilder-section-container {
    order: 0;
  }

  .fsbuilder-sec.fsbuilder-section--tablet-image-top > .fsbuilder-section-container,
  .fsbuilder-sec.fsbuilder-section--tablet-image-bottom > .fsbuilder-mobile-section-image {
    order: 1;
  }

  .fsbuilder-col.fsbuilder-col--tablet-offset {
    top: 0 !important;
    left: var(--fsbuilder-column-offset-x-tablet, 0px) !important;
    margin-top: calc(var(--fsbuilder-column-margin-top, 0px) + var(--fsbuilder-column-offset-y-tablet, 0px)) !important;
  }

  .fsbuilder-content-stage {
    overflow-x: clip;
  }

  .fsbuilder-col.fsbuilder-col--tablet-width {
    width: var(--fsbuilder-column-width-tablet) !important;
    max-width: var(--fsbuilder-column-width-tablet) !important;
    flex: 0 0 var(--fsbuilder-column-width-tablet) !important;
  }

  .fsbuilder-w-cta.fsbuilder-cta--tablet-align {
    text-align: var(--fsbuilder-button-align-tablet) !important;
  }

  .fsbuilder-cta__btn.fsbuilder-cta__btn--tablet-font-size {
    font-size: var(--fsbuilder-button-font-size-tablet) !important;
  }

  .fsbuilder-cta__btn.fsbuilder-cta__btn--tablet-padding-x {
    padding-left: var(--fsbuilder-button-padding-x-tablet) !important;
    padding-right: var(--fsbuilder-button-padding-x-tablet) !important;
  }

  .fsbuilder-cta__btn.fsbuilder-cta__btn--tablet-padding-y {
    padding-top: var(--fsbuilder-button-padding-y-tablet) !important;
    padding-bottom: var(--fsbuilder-button-padding-y-tablet) !important;
  }

  .fsbuilder-cta__btn.fsbuilder-cta__btn--tablet-width {
    display: var(--fsbuilder-button-display-tablet) !important;
    width: var(--fsbuilder-button-width-tablet) !important;
    max-width: 100% !important;
  }
}

/* Mobile */
@media (max-width: 768px) {
  .fsbuilder-heading {
    font-size: var(
      --fsbuilder-font-size-mobile,
      calc(
        var(--fsbuilder-font-size, 32px)
        * 0.8
      )
    );
    line-height: var(--fsbuilder-line-height-mobile, var(--fsbuilder-line-height, 1.3)) !important;
    text-align: var(--fsbuilder-heading-align-mobile, var(--fsbuilder-heading-align, left)) !important;
  }

  .fsbuilder-heading.fsbuilder-heading--mobile-spacing {
    margin-top: var(--fsbuilder-heading-margin-top-mobile, var(--fsbuilder-heading-margin-top, 0px)) !important;
    margin-bottom: var(--fsbuilder-heading-margin-bottom-mobile, var(--fsbuilder-heading-margin-bottom, 0px)) !important;
    margin-left: min(var(--fsbuilder-heading-margin-left-mobile, var(--fsbuilder-heading-margin-left, 0px)), 50%) !important;
    margin-right: min(var(--fsbuilder-heading-margin-right-mobile, var(--fsbuilder-heading-margin-right, 0px)), 50%) !important;
    max-width: calc(
      100%
      - min(var(--fsbuilder-heading-margin-left-mobile, var(--fsbuilder-heading-margin-left, 0px)), 50%)
      - min(var(--fsbuilder-heading-margin-right-mobile, var(--fsbuilder-heading-margin-right, 0px)), 50%)
    ) !important;
  }

  .fsbuilder-text.fsbuilder-text--mobile-typography {
    font-size: var(--fsbuilder-text-font-size-mobile, var(--fsbuilder-text-font-size, inherit)) !important;
    line-height: var(--fsbuilder-text-line-height-mobile, var(--fsbuilder-text-line-height, normal)) !important;
    text-align: var(--fsbuilder-text-align-mobile, var(--fsbuilder-text-align, left)) !important;
  }

  .fsbuilder-text.fsbuilder-text--mobile-spacing {
    margin-top: var(--fsbuilder-text-margin-top-mobile, var(--fsbuilder-text-margin-top, 0px)) !important;
    margin-bottom: var(--fsbuilder-text-margin-bottom-mobile, var(--fsbuilder-text-margin-bottom, 0px)) !important;
    margin-left: min(var(--fsbuilder-text-margin-left-mobile, var(--fsbuilder-text-margin-left, 0px)), 50%) !important;
    margin-right: min(var(--fsbuilder-text-margin-right-mobile, var(--fsbuilder-text-margin-right, 0px)), 50%) !important;
    max-width: calc(
      100%
      - min(var(--fsbuilder-text-margin-left-mobile, var(--fsbuilder-text-margin-left, 0px)), 50%)
      - min(var(--fsbuilder-text-margin-right-mobile, var(--fsbuilder-text-margin-right, 0px)), 50%)
    ) !important;
  }

  .fsbuilder-w-cta.fsbuilder-cta--mobile-align {
    text-align: var(--fsbuilder-button-align-mobile) !important;
  }

  .fsbuilder-cta__btn.fsbuilder-cta__btn--mobile-font-size {
    font-size: var(--fsbuilder-button-font-size-mobile) !important;
  }

  .fsbuilder-cta__btn.fsbuilder-cta__btn--mobile-padding-x {
    padding-left: var(--fsbuilder-button-padding-x-mobile) !important;
    padding-right: var(--fsbuilder-button-padding-x-mobile) !important;
  }

  .fsbuilder-cta__btn.fsbuilder-cta__btn--mobile-padding-y {
    padding-top: var(--fsbuilder-button-padding-y-mobile) !important;
    padding-bottom: var(--fsbuilder-button-padding-y-mobile) !important;
  }

  .fsbuilder-cta__btn.fsbuilder-cta__btn--mobile-width {
    display: var(--fsbuilder-button-display-mobile) !important;
    width: var(--fsbuilder-button-width-mobile) !important;
    max-width: 100% !important;
  }
}


/* ============================================================
   FS Pagebuilder – Frontend Layout (Section / Columns)
   Minimal responsive contract:
   - Columns stack on mobile
   - Prevent overflow (min-width:0)
============================================================ */

.fsbuilder-content-stage{
  width:100%;
  max-width: var(--fsbuilder-stage-max, 1200px);
  margin-left:auto;
  margin-right:auto;
  padding-left: var(--fsbuilder-stage-pad, 16px);
  padding-right: var(--fsbuilder-stage-pad, 16px);
  box-sizing:border-box;
  display: flow-root;
}

.fsbuilder-sec{ box-sizing:border-box; width:100%; }
.fsbuilder-sec-inner{ width:100%; box-sizing:border-box; }
.fsbuilder-mobile-section-image{ display:none; }

.fsbuilder-widget--inner-section{
  width:var(--fsbuilder-inner-width, 100%);
  align-self:var(--fsbuilder-inner-align, center);
}

.fsbuilder-cols{
  display:flex;
  width:100%;
  box-sizing:border-box;
  align-items:stretch;
  flex-wrap:nowrap;
}

.fsbuilder-col{
  box-sizing:border-box;
  min-width:0; /* wichtig: verhindert Overflow/Quetschen */
}

/* Mobile: Columns stack */
@media (max-width: 768px){
  .fsbuilder-sec.fsbuilder-section--mobile-min-height{
    min-height:var(--fsbuilder-section-mobile-min-height) !important;
  }

  .fsbuilder-sec.fsbuilder-section--mobile-background{
    background-image:var(--fsbuilder-section-mobile-background-image) !important;
    background-size:var(--fsbuilder-section-mobile-background-size) !important;
    background-position:var(--fsbuilder-section-mobile-background-position) !important;
    background-repeat:var(--fsbuilder-section-mobile-background-repeat) !important;
  }

  .fsbuilder-sec.fsbuilder-section--mobile-padding{
    padding-left:var(--fsbuilder-section-mobile-padding) !important;
    padding-right:var(--fsbuilder-section-mobile-padding) !important;
  }

  .fsbuilder-sec.fsbuilder-section--mobile-image-layout{
    display:flex;
    flex-direction:column;
    justify-content:flex-start;
    padding:0 !important;
    background-image:none !important;
  }

  .fsbuilder-sec.fsbuilder-section--mobile-image-layout > .fsbuilder-mobile-section-image{
    display:block;
    width:100%;
    height:var(--fsbuilder-section-separated-image-height, 300px);
    min-height:var(--fsbuilder-section-separated-image-height, 300px);
    flex:0 0 var(--fsbuilder-section-separated-image-height, 300px);
    background-image:var(--fsbuilder-section-separated-image, none);
    background-size:var(--fsbuilder-section-separated-image-size, cover);
    background-position:var(--fsbuilder-section-separated-image-position, 50% 50%);
    background-repeat:no-repeat;
  }

  .fsbuilder-sec.fsbuilder-section--mobile-image-layout > .fsbuilder-section-container{
    width:100%;
    padding:var(--fsbuilder-section-mobile-content-padding-top, 0)
      var(--fsbuilder-section-mobile-content-padding-right, 0)
      var(--fsbuilder-section-mobile-content-padding-bottom, 0)
      var(--fsbuilder-section-mobile-content-padding-left, 0);
    box-sizing:border-box;
  }

  .fsbuilder-sec.fsbuilder-section--mobile-image-top > .fsbuilder-mobile-section-image,
  .fsbuilder-sec.fsbuilder-section--mobile-image-bottom > .fsbuilder-section-container{
    order:0;
  }

  .fsbuilder-sec.fsbuilder-section--mobile-image-top > .fsbuilder-section-container,
  .fsbuilder-sec.fsbuilder-section--mobile-image-bottom > .fsbuilder-mobile-section-image{
    order:1;
  }

  .fsbuilder-cols{
    flex-direction:column;
    gap: var(--fsbuilder-cols-gap-mobile, 0px);
  }
  .fsbuilder-col{
    width:100% !important;
    max-width:100% !important;
    flex: 0 0 auto !important;
    margin-left:0 !important;
    margin-right:0 !important;
    left:0 !important;
  }
  .fsbuilder-col.fsbuilder-col--mobile-offset{
    top:0 !important;
    margin-top:calc(
      var(--fsbuilder-column-margin-top, 0px)
      + var(--fsbuilder-column-offset-y-mobile, 0px)
    ) !important;
  }
  .fsbuilder-col.fsbuilder-col--mobile-width{
    width:var(--fsbuilder-column-width-mobile, 100%) !important;
    max-width:100% !important;
  }

  .fsbuilder-sec.fsbuilder-section--mobile-columns-row > .fsbuilder-section-container > .fsbuilder-sec-inner > .fsbuilder-cols{
    flex-direction:row;
    flex-wrap:nowrap;
    align-items:flex-start;
  }

  .fsbuilder-sec.fsbuilder-section--mobile-columns-row > .fsbuilder-section-container > .fsbuilder-sec-inner > .fsbuilder-cols > .fsbuilder-col{
    width:auto !important;
    max-width:100% !important;
    min-width:0;
    flex:1 1 0 !important;
  }

  .fsbuilder-sec.fsbuilder-section--mobile-columns-row > .fsbuilder-section-container > .fsbuilder-sec-inner > .fsbuilder-cols > .fsbuilder-col.fsbuilder-col--mobile-width{
    width:var(--fsbuilder-column-width-mobile, 100%) !important;
    max-width:var(--fsbuilder-column-width-mobile, 100%) !important;
    flex:0 1 var(--fsbuilder-column-width-mobile, 100%) !important;
  }
}

/* ============================================================
   CTA (Frontend)
   (gleiches Verhalten wie Canvas: Hover-Farbe + Icon-Reserve)
============================================================ */

.fsbuilder-cta__btn{
  color: var(--fsbuilder-cta-color, inherit);
  position: relative;
}

.fsbuilder-cta__btn:hover{
  color: var(--fsbuilder-cta-hover-color, var(--fsbuilder-cta-color, inherit));
}

.fsbuilder-cta__inner{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:100%;
}

.fsbuilder-cta__icon{
  position:absolute;
  top:50%;
  transform: translateY(-50%);
  width: var(--fsbuilder-cta-icon-size, 18px);
  height: var(--fsbuilder-cta-icon-size, 18px);
  display:inline-flex;
  line-height:0;
}

.fsbuilder-cta__btn:not(.has-icon) .fsbuilder-cta__icon{ display:none; }

.fsbuilder-cta__btn.is-icon-left  .fsbuilder-cta__icon{ left:  var(--fsbuilder-cta-icon-inset, 12px); }
.fsbuilder-cta__btn.is-icon-right .fsbuilder-cta__icon{ right: var(--fsbuilder-cta-icon-inset, 12px); }

.fsbuilder-cta__icon svg{
  width:100%;
  height:100%;
  display:block;
}

.fsbuilder-cta__btn.has-icon{
  --fsbuilder-cta-icon-reserve: calc(var(--fsbuilder-cta-icon-size, 18px) + var(--fsbuilder-cta-icon-gap, 0px));
}

.fsbuilder-cta__label{
  padding-left:  var(--fsbuilder-cta-icon-reserve, 0px);
  padding-right: var(--fsbuilder-cta-icon-reserve, 0px);
}

.fsbuilder-preview-wrap .fsbuilder-content-stage{
  padding-left:0;
  padding-right:0;
}