/* Seitenbausteine (aus den bisherigen Fusion-Builder-Seiten). Werte aus dem Original gemessen. */
:root{--accent:#d74b41}

/* Container */
.fc{position:relative;padding-left:30px;padding-right:30px;background-repeat:no-repeat}
.fc-in{max-width:1170px;margin:0 auto;container-type:inline-size}
.fc-100{padding-left:0;padding-right:0}
.fc-100 .fc-in{max-width:none}
.fc-fullh{min-height:100vh;display:flex;align-items:center}
.fc-fullh>.fc-in{width:100%}
.fc:not(.fc-flex) .fr{display:block}
.fc:not(.fc-flex) .fr::after{content:"";display:table;clear:both}

/* Zeile / Spalten */
.fr{display:flex;flex-wrap:wrap;align-items:var(--ai,flex-start);justify-content:var(--jc,normal)}
.fc-flex .fr{width:104cqw;max-width:none;margin-left:-2cqw;margin-right:-2cqw}
.fcol{width:var(--w,100%);margin-bottom:20px;display:flex;flex-direction:column;position:relative;min-width:0}
.fcol-in{display:flow-root;flex:1 1 auto;min-width:0}
.fc-flex .fcol-in{margin-left:var(--sl,2cqw);margin-right:var(--sr,2cqw);width:auto}
.fc:not(.fc-flex) .fcol{float:left;margin-right:4%}
.fc:not(.fc-flex) .fcol[style*="--last"]{margin-right:0}
.fcol-center .fcol-in{display:flex;flex-direction:column;justify-content:center}
.fcol .fcol-in[style*="min-height"]{display:flex;flex-direction:column;justify-content:var(--jc,flex-start)}
.fcol-link{position:absolute;inset:0;z-index:2}
.fcol>.fcol-in>*{max-width:100%}
.fc-flex .fr-inner{width:auto;margin:0}
.fc-flex .fcol-inner>.fcol-in{margin:0}
.fcol-inner{float:left;margin-right:4%}
.fcol-inner[style*="--last"]{margin-right:0}
.fr-inner::after{content:"";display:table;clear:both}
.fr-inner{display:block}

/* Titel */
.ftitle{margin:0 0 31px;font:700 34.2px/1.17 var(--f-bold);color:var(--accent)}
.ftitle-1{font-size:54px;line-height:1.3}.ftitle-3{font-size:26.1px;line-height:1.2}.ftitle-4{font-size:23.4px;line-height:1.2}.ftitle-5{font-size:18px;line-height:1.5}.ftitle-6{font-size:14px;line-height:1.5}

/* Text */
.ft{margin:0;display:flow-root}
.ft p{margin:0 0 20px}
.ft>p:last-child{margin-bottom:20px}
.ft h1,.ft h2,.ft h3,.ft h4{font-family:var(--f-bold)}
.ft h2{font-size:34.2px;line-height:1.4;color:var(--accent);margin:0 0 17.1px}
.ft h3{font-size:26.1px;line-height:1.4;color:var(--accent);margin:0 0 13.05px}
.ft ul,.ft ol{margin:18px 0;padding-left:40px}
.ft a{color:var(--primary-2)}

/* Button */
.fbtn-wrap{display:inline}
.fbtn{--btn-bg:#d74b42;--btn-fg:#fff;--btn-bd:transparent;--btn-r:0;--btn-bw:0px;
  display:inline-flex;align-items:center;justify-content:center;text-align:center;text-decoration:none;cursor:pointer;
  font:700 14px/1.2 Lato,var(--f-body);padding:13px 29px;color:var(--btn-fg);background:var(--btn-bg);
  border:var(--btn-bw) solid var(--btn-bd);border-radius:var(--btn-r)}
/* Kein Hover-Effekt: Text, Hintergrund und Rahmen bleiben immer gleich (Textfarbe schlägt allgemeine Link-Farben). */
a.fbtn,a.fbtn:hover,a.fbtn:focus,a.fbtn:active,a.fbtn:visited{color:var(--btn-fg,#fff)!important;background:var(--btn-bg);border-color:var(--btn-bd);text-decoration:none!important}
a.fbtn span,a.fbtn:hover span{color:inherit!important}
.fbtn-small{font-size:12px;padding:9px 20px}
.fbtn-medium{font-size:13px;padding:11px 23px}
.fbtn-large{font-size:21.6px;padding:17.76px 44.4px;line-height:1.2}
.fbtn-xlarge{font-size:18px;padding:17px 40px}
.fbtn-stretch{display:flex;width:100%}
.fbtn-wrap.fbtn-center{display:block;text-align:center}
.fbtn-wrap.fbtn-right{display:block;text-align:right}
.fbtn-wrap.fbtn-left{display:block;text-align:left}

/* Bilder */
.fimg{display:inline-block;max-width:100%;line-height:0}
.fimg img{max-width:100%;height:auto;display:inline}
.fimg-center{display:table;margin-left:auto;margin-right:auto}
.fimg-right{display:table;margin-left:auto}
.fimg-left{display:table;margin-right:auto}
.fimg-bottomshadow img,.fimg-glow img{box-shadow:0 4px 12px rgba(0,0,0,.25)}
.fsep{border-top:1px solid #e0dede;margin:30px 0}
.fsep-none{border-top:0}
.fsep-double{border-top:3px double #e0dede}

/* Checkliste */
.fcheck{list-style:none;margin:0 0 20px;padding:0}
.fcheck li{position:relative;padding-left:2.2em;margin:0 0 12px;line-height:1.5}
.fcheck li::before{content:"\2713";position:absolute;left:0;top:.05em;width:1.6em;height:1.6em;line-height:1.6em;text-align:center;font-size:.85em;color:var(--ic,#fff);background:var(--cc,var(--accent));border-radius:50%}

/* Lightbox-Vorschaubild */
.flightbox{position:relative;display:inline-block;line-height:0}
.flightbox.is-playing{display:block;position:relative;width:100%;padding-top:56.25%;background:#000;line-height:0}
.flightbox.is-playing iframe{position:absolute;left:0;top:0;width:100%;height:100%;border:0}
.flightbox .play{position:absolute;left:50%;top:50%;width:68px;height:68px;margin:-34px 0 0 -34px;border-radius:50%;background:rgba(0,0,0,.6)}
.flightbox .play::after{content:"";position:absolute;left:27px;top:20px;border-left:22px solid #fff;border-top:14px solid transparent;border-bottom:14px solid transparent}

/* Tagline-Box (Kaufbox mit Button) */

/* Responsive Spalten. Die Breiten für Tablet/Handy (--wm/--ws) gelten nur für die jeweilige Spalte selbst, nicht für verschachtelte Spalten darin (benutzerdefinierte Eigenschaften werden sonst vererbt). */
.fcol>.fcol-in{--wm:initial;--ws:initial}
@media (max-width:1024px){.fcol{width:var(--wm,var(--w,100%))}}
@media (max-width:640px){.fcol,.fc:not(.fc-flex) .fcol{width:var(--ws,100%);float:none;margin-right:0}
  .hide-s{display:none}}
@media (min-width:641px) and (max-width:1024px){.hide-m{display:none}}
@media (min-width:1025px){.hide-l{display:none}}

/* Zitate */
.ft blockquote,.post-content blockquote{margin:36px 40px;padding:15px;border-left:4px solid var(--primary);background:#f6f6f6;font-style:italic}
.ft blockquote p:last-child,.post-content blockquote p:last-child{margin-bottom:0}

/* Standardtypografie für Freitext/HTML-Blöcke auf Seiten (wie im Original) */
.landing-content p{margin:0 0 20px}
.landing-content h1,.landing-content h2,.landing-content h3,.landing-content h4{font-family:var(--f-bold);color:var(--heading)}
.landing-content h2:not(.ftitle){font-size:34.2px;line-height:1.4;margin:0 0 17.1px;color:var(--accent)}
.landing-content h3:not(.ftitle){font-size:26.1px;line-height:1.41;margin:0 0 13.05px;color:var(--accent)}
.landing-content h4:not(.ftitle){font-size:23.4px;line-height:1.2;margin:0 0 14.04px}
.landing-content ul,.landing-content ol{margin:18px 0;padding-left:40px}
.landing-content a{color:var(--primary-2)}
.landing-content .ftitle{color:var(--accent)}

/* Beitragslisten (Blog-Elemente) */
.fblog-list{display:block}
.fblog-medium .fpost{display:flex;gap:25px;margin:0 4.36px 65px;align-items:flex-start}
.fblog-medium .fpost-img{flex:0 0 320px;line-height:0}
.fblog-medium .fpost-img img{width:320px;height:180px;object-fit:cover}
.fblog-medium .fpost-body{flex:1;min-width:0}
.fpost-title{font:700 27px/1.4 var(--f-bold);margin:0 0 25px;color:var(--heading)}
.fpost-title a{color:var(--heading);text-decoration:none}
.fpost-excerpt{margin:0 0 20px}
.fpost-excerpt a{color:var(--primary-2)}
.fblog-grid{display:flex;flex-wrap:wrap;margin:-20px -20px 0}
.fblog-grid .fpost{padding:20px;width:33.3333%}
.fblog-cols-2 .fpost{width:50%}.fblog-cols-4 .fpost{width:25%}
.fblog-grid .fpost-img{display:block;line-height:0}
.fblog-grid .fpost-img img{width:100%;height:auto;aspect-ratio:355/200;object-fit:cover}
.fblog-grid .fpost-body{padding:30px 25px 20px;text-align:center}
.fblog-grid .fpost-title{margin:0 0 5px}
@media (max-width:800px){.fblog-medium .fpost{display:block}.fblog-medium .fpost-img{display:block}.fblog-medium .fpost-img img{width:100%;height:auto}.fblog-grid .fpost{width:100%}}

.ftagline{--tl-bd:var(--primary);background:#f6f6f6;padding:28px 28px 27px 31px;margin:28px 0;text-align:center}
.ftagline-left{text-align:left}.ftagline-right{text-align:right}
.ftagline-hl-top{border-top:3px solid var(--tl-bd)}.ftagline-hl-left{border-left:3px solid var(--tl-bd)}
.ftagline-hl-bottom{border-bottom:3px solid var(--tl-bd)}.ftagline-hl-right{border-right:3px solid var(--tl-bd)}
.ftagline h2{margin:0;font:700 34.2px/1.4 var(--f-bold);color:var(--accent)}
.ftagline-desc{margin-top:7.56px}
.ftagline-desc p{margin:0 0 20px}
.ftagline-btn .fbtn-wrap{display:block;text-align:center}
@media (max-width:640px){.ftagline{padding:20px 16px}.ftagline h2{font-size:26px}.ftagline-btn .fbtn{width:100%}}

/* Produktboxen auf der Startseite: Hover-Effekt */
.fcol-card{box-shadow:0 0 10px rgba(0,0,0,.25);transition:transform .25s ease,box-shadow .25s ease}
.fcol-card:hover{transform:translateY(-6px);box-shadow:0 10px 24px rgba(0,0,0,.28)!important}
@media (prefers-reduced-motion:reduce){.fcol-card{transition:none}.fcol-card:hover{transform:none}}
.fblog-list.is-collapsed .fpost.fpost-extra{display:none!important}
.fblog-more{margin:34px 0 10px}

/* Lange Wörter (z. B. „Bewerbungsformular“ in großen Überschriften) umbrechen statt die Seite zu verbreitern */
.post-content,.landing-content,.ft,.entry-title,.ftitle{overflow-wrap:break-word}
.entry-title,.ftitle,.ft h1,.ft h2,.ft h3,.ft h4,.post-content h1,.post-content h2,.post-content h3,.post-content h4{-webkit-hyphens:auto;hyphens:auto}

/* Tablet (641–1024 px): Vier- und Fünfer-Reihen mit Text werden zweispaltig, sonst sind die Spalten nur ~110 px breit */
@media (min-width:641px) and (max-width:1024px){
  .fc-flex .fcol[style*="--wm:25%"],.fc-flex .fcol[style*="--wm:20%"]{width:50%}
  .fc:not(.fc-flex) .fcol[style*="--wm:25%"],.fc:not(.fc-flex) .fcol[style*="--wm:20%"]{width:48%}
}

/* Grüne Upsell-Buttons: weißer Text braucht einen dunkleren Grünton (Kontrast) */
.fbtn[style*="--btn-bg:#8bc34a"]{--btn-bg:#3f7d14!important}

/* Handy: Zitate und Teilnehmerstimmen nutzen die volle Breite (kein seitlicher Einzug von 40 px) */
@media (max-width:640px){
  .ft blockquote,.post-content blockquote,.ftesti-item{margin-left:0;margin-right:0}
}
