/*

    Diese Datei beinhaltet alle Styles der Komponenten.
    Jede Komponente wird am Beginn mit der Bezeichnung in Uppercase gestartet.
    Jede Zeile muss mit dem HTML Element und der Komponenten-Bezeichnung ( zb a.tf-button ) beginnen.

*/



/* CONTENT */

section.tf-content {
    /*padding-top: 1em;
    padding-bottom: 1em;*/
    font-size: 1.2rem;
    line-height: 1.7rem;
    font-weight: 300;
    overflow: visible;
}

section.tf-content.grey {
    background-color: var(--background-grey);
}

section.tf-content.lightblue {
    background-color: var(--light-blue);
}

section.tf-content.gruen{
    background-color: var(--vf-gruen);
}

section.tf-content.blue {
    background-color: var(--textcolor);
    color: white;
}
section.tf-content.dark-off-white{
    background-color: var(--background-dark-off-white);
}

section.tf-content.white {
    background-color: white;
}

section.tf-content > .wrapper {
    position: relative;
    margin: auto;
    width: min( 90vw, 1400px );
    padding-top: 4rem;
    padding-bottom: 4rem;
}

section.tf-content.small-padding > .wrapper {
    padding-top: 2rem;
    padding-bottom: 2rem;
}

section.tf-content.small-padding-bottom > .wrapper {
    padding-bottom: 2rem;
}

section.tf-content.extra-margin-top > .wrapper {
    margin-top: 4rem;
}

section.tf-content.compact-centered > .wrapper {
    max-width: 950px;
}

section.tf-content > .wrapper > *:not(:first-child) {
    margin-top: 2rem;
}

section.tf-content > .wrapper > *:not(:last-child) {
    margin-bottom: 2rem;
}

section.tf-content > .wrapper > *.no-margin-top {
    margin-top: 0px;
}

section.tf-content > .wrapper > *.no-margin-bottom {
    margin-bottom: 0px;
}

section.tf-content > .wrapper h2 {
    letter-spacing: -0.01em;
    font-size: 2rem;
    line-height: 2.5rem;
    /* margin-top: -0.4rem;
    margin-bottom: calc( 3rem - 0.4rem ); */
    max-width: 1500px;
    display: flex;
    align-items: center;
    gap: 1.5rem;
    text-wrap: balance;
    font-weight: bold;
}
section.tf-content > .wrapper h2:has(span.title-block){
    align-items: start;
}
section.tf-content > .wrapper h2 span.title-block{
    display: flex;
    flex-direction: column;
}
section.tf-content > .wrapper h2 span.title-block small{
    font-weight:400;
    opacity: 0.5;
    font-size: 1.3rem;
}

section.tf-content > .wrapper h2.centered {
    max-width: unset;
    justify-content: center;
    text-align: center;
}



section.tf-content > .wrapper h2.centered.compact {
    max-width: 650px;
    margin-left: auto;
    margin-right: auto;
}

/*section.tf-content > .wrapper h2.no-margin-top {
    margin-top: 0px;
}*/

section.tf-content > .wrapper h2.light {
    font-size: 1.9rem;
    font-weight: 300;
}

section.tf-content > .wrapper h2:last-child {
    margin-bottom: -0.4rem;
}

section.tf-content > .wrapper h2 img,
section.tf-content > .wrapper h2 svg {
    display: block;
    width: 2.5rem;
    height: 2.5rem;
    margin-top: 0px !important;
    margin-bottom: 0px !important;
}

section.tf-content > .wrapper h3 {
    font-size: 1.5rem;
    line-height: 1.875rem;
    letter-spacing: -0.01em;
    margin-top: -0.2rem;
    margin-bottom: 1.25rem;
    max-width: 1000px;
    font-weight: bold;
    text-wrap: balance;

    display: flex;
    align-items: center;
    gap: 1rem;
}

section.tf-content > .wrapper h3.centered {
    flex-direction: column;
    text-align: center;
}

section.tf-content > .wrapper h3.light {
    font-weight: 300;
}

section.tf-content > .wrapper h3.centered.compact {
    max-width: 650px;
    margin-left: auto;
    margin-right: auto;
}

section.tf-content > .wrapper h3 img,
section.tf-content > .wrapper h3 svg {
    display: block;
    width: 2rem;
    height: 2rem;
    margin-top: 0px !important;
    margin-bottom: 0px !important;
}

section.tf-content > .wrapper h3.centered img,
section.tf-content > .wrapper h3.centered svg {
    width: 4.5rem;
    height: 4.5rem;
}

section.tf-content > .wrapper h3 .thin {
    font-weight: 300;
}

section.tf-content > .wrapper h4 {
    font-size: 1.2rem;
    line-height: 1.7rem;
    font-weight: bold;
    max-width: 1000px;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

section.tf-content > .wrapper h4 img,
section.tf-content > .wrapper h4 svg {
    fill: var( --textcolor );
    display: block;
    width: 1.5rem;
    height: 1.5rem;
    margin-top: 0px !important;
    margin-bottom: 0px !important;
}

section.tf-content > .wrapper h4:not(:first-child) {
    margin-top: 3rem;
}

section.tf-content > .wrapper h4.numbered {
    display: flex;
    gap: 1rem;
    align-items: center;
}

section.tf-content > .wrapper h4.numbered.red {
    color: var(--main-color);
}

section.tf-content > .wrapper h4.numbered .number {
    background-color: var(--textcolor);
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
}

section.tf-content > .wrapper h4.numbered.red .number {
    background-color: var(--main-color);
}

section.tf-content > .wrapper h4.centered {
    max-width: unset;
    justify-content: center;
    text-align: center;
}

section.tf-content > .wrapper p, div.tf-modal div.wrapper div.content div.tf-impulse div.description div.scrollwrapper p {
    max-width: 1000px;
    font-size: 1.2rem;
    line-height: 1.7rem;
    font-weight: 300;
}

section.tf-content > .wrapper p.centered {
    max-width: unset;
    text-align: center;
}

section.tf-content > .wrapper p.sub-headline {
    margin-top: -1rem !important;
    margin-bottom: 2.5rem !important;
}

div.tf-modal div.wrapper div.content div.tf-impulse div.description div.scrollwrapper h3.teaser-headline {
    margin-top: 15em;
    margin-bottom: 0.5em;
}

section.tf-content > .wrapper p:not(:first-child) {
    margin-top: 1.25rem;
}

section.tf-content div.tf-cardgrid div.tf-card p {
    margin-top: 0rem;
}


section.tf-content > .wrapper p:not(:last-child) {
    margin-bottom: 1.7rem;
}

section.tf-content > .wrapper p + .tf-card {
    margin-top: 3rem;
}

section.tf-content > .wrapper p.small {
    font-size: 1rem;
    line-height: 1.4rem;
}

section.tf-content > .wrapper p.smaller-bottom-margin{
    margin-bottom: 0em;
}

section.tf-content > .wrapper p.smaller-bottom-margin + ul:not(:first-child) {
    margin-top: 1.5rem;
}

section.tf-content > .wrapper p.smaller-bottom-margin + ul.compact {
    margin-top: 0.5rem;
}

section.tf-content > .wrapper p.small:not(:first-child) {
    margin-top: 1.0rem;
}

section.tf-content > .wrapper p.small:not(:last-child) {
    margin-bottom: 1.0rem;
}

section.tf-content > .wrapper p.balanced {
    text-wrap: balance;
}

section.tf-content > .wrapper p.separated {
    margin-top: 2rem;
    padding-top: 1.8rem;
    border-top: var( --border-thinline-black );
}

section.tf-content > .wrapper ul {
    max-width: 1000px;
}

section.tf-content > .wrapper ul.compact:not(:first-child) {
    margin-top: 0rem;
}

section.tf-content > .wrapper ul:not(:first-child) {
    margin-top: 2rem;
}

section.tf-content > .wrapper ul:not(:last-child) {
    margin-bottom: 2rem;
}

section.tf-content > .wrapper ul li + li {
    margin-top: 1.5rem;
}

section.tf-content > .wrapper ul.compact li + li {
    margin-top: 0.5rem;
}


section.tf-content > .wrapper ul.checkmark_list,
section.tf-content > .wrapper ul.checkmark-list {
    list-style: none;
}

section.tf-content > .wrapper ul.checkmark-list.small {
    font-size: 1rem;
    line-height: 1.4rem;
}

section.tf-content > .wrapper ul.checkmark-list.compact li:not(:first-child) {
    margin-top: 0.5rem;
}

section.tf-content > .wrapper ul .checkmark {
    padding-left: calc( 20px + 1rem );
    position: relative;
}

section.tf-content > .wrapper ul.checkmark-list.compact .checkmark {
    padding-left: calc( 20px + 0.75rem );
}

section.tf-content > .wrapper ul.checkmark-list.small .checkmark {
    padding-left: calc( 20px + 0.5rem );
}

section.tf-content > .wrapper ul .checkmark::before {
    content: '';
    background-size: 20px;
    background-image: url(/img/Icons/Checkmark_red.svg);
    background-repeat: no-repeat;
    position: absolute;
    top: 3px;
    left: 0;
    height: 20px;
    width: 20px;
}

section.tf-content > .wrapper ul.checkmark-list.small .checkmark::before {
    top: 1px;
}

section.tf-content > .wrapper img {
    display: block;
    border-radius: none;
    width: 100%;
    height: auto;
    padding: 0px;
    margin: 0px;
}

section.tf-content > .wrapper img:not(:first-child) {
    margin-top: 2rem;
}

section.tf-content > .wrapper img:not(:last-child) {
    margin-bottom: 2rem;
}

section.tf-content .tf-button + .tf-button {
    margin-top: 2rem;
}

section.tf-content .tf-card + .tf-button {
    margin-top: 2rem;
}

section.tf-content > .wrapper h2 + div.tf-columns:not(:first-child) {
    margin-top: 0rem;
}

section.tf-content + section.tf-content:not( .no-top-border ) > .wrapper,
.tf-jumpaction + section.tf-content:not( .grey ):not( .no-top-border ) > .wrapper {
    border-top: var( --border-thinline-black );
}

section.tf-content:has( + .tf-jumpaction ) > .wrapper {
    border-bottom: var( --border-thinline-black );
}

section.tf-content:not( .grey ) + section.tf-content.grey > .wrapper,
section.tf-content:not( .lightblue ) + section.tf-content.lightblue > .wrapper,
section.tf-content:not( .blue ) + section.tf-content.blue > .wrapper,
section.tf-content.lightblue + section.tf-content:not( .lightblue ) > .wrapper {
    border-top: none;
}

section.tf-content.not-separated > .wrapper {
    border-top: none !important;
    padding-top: 2rem;
    padding-bottom: 2rem;
}


@media only screen and (max-width: 550px) {

    section.tf-content > .wrapper h2 {
        font-size: 1.5rem;
        line-height: 1.875rem;
        gap: 1rem;
    }

    section.tf-content > .wrapper h2.light {
        font-size: 1.4rem;
        line-height: 1.875rem;
    }
    
}



/* COLUMNS */

div.tf-columns {
    display: flex;
    gap: 4rem;
}

div.tf-columns.vertical-centered {
    align-items: center;
}

div.tf-columns:not(:first-child) {
    margin-top: 3rem;
}

div.tf-columns:not(:last-child) {
    margin-bottom: 3rem;
}

div.tf-columns .column {
    position: relative;
    flex-basis: 0;
    flex-grow: 1;
    flex-shrink: 0;
}

div.tf-columns .column.content-right {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

div.tf-columns .column.one-third,
div.tf-columns .column.two-third {
    flex-grow: 0;
    flex-shrink: 1;
}

div.tf-columns .column.one-third {
    flex-basis: 33.33333333%;
}

div.tf-columns .column.one-third svg{
    height: 100%;
    width: 100%;
}

div.tf-columns .column.two-third {
    flex-basis: 66.66666666%;
}

div.tf-columns .column.one-quarter,
div.tf-columns .column.three-quarter {
    flex-grow: 0;
    flex-shrink: 1;
}

div.tf-columns .column.one-quarter {
    flex-basis: 25%;
}

div.tf-columns .column.three-quarter {
    flex-basis: 75%;
}

div.tf-columns.separated .column:not( :last-child )::before {
    content: "";
    display: block;
    position: absolute;
    right: -2rem;
    top: 0px;
    height: 100%;
    border-left: var( --border-thinline-black );
}

@media only screen and (max-width: 1150px) {

    div.tf-columns {
        flex-direction: column;
        gap: 3rem;
        /*align-items: center;*/
    }

    div.tf-columns.reverse-on-mobile {
        flex-direction: column-reverse;
    }
    
    /*div.tf-columns .column {
        max-width: 500px;
    }*/
    
    div.tf-columns .column {
        flex-basis: 100%;
    }
    
    div.tf-columns .column.one-quarter {
        max-width: 400px;
    }
    
    div.tf-columns .column.one-third {
        max-width: 400px;
    }
    
    div.tf-columns.separated .column:not( :last-child )::before {
        display: none;
    }

    div.tf-columns .column.content-right {
        align-items: flex-start;
    }

}



/* EXPAND */

div.tf-expand {
    
}

div.tf-expand .tf-expand-default {

}

div.tf-expand .tf-expand-expanded {
    display: none;
}

div.tf-expand .tf-expand-content {
    display: none;
    height: 0px;
    transition: height .3s;
    overflow: hidden;
}

div.tf-expand.state-expanded .tf-expand-default {
    display: none;
}

div.tf-expand.state-expanded .tf-expand-expanded {
    display: block;
}

div.tf-expand .tf-expand-content > .wrapper {
    border-top: var( --border-thinline-black );
    padding-top: 2rem;
    margin-top: 2rem;
    padding-bottom: 0px;
    margin-bottom: 0px;
    width: 100%;
}

div.tf-expand .tf-expand-default .button-replacement,
div.tf-expand .tf-expand-expanded .button-replacement {
    cursor: pointer;
}



/* SLIDER */


div.tf-slider {
    overflow: hidden;    
}

div.tf-slider .strip {
    display: flex;
    transition: transform .4s;
}

div.tf-slider ul.dots {
    position: relative;
    width: 100% !important;
    margin: 0;
    list-style: none;
    max-width: none;
    display: flex;
    justify-content: center;
    height: 50px;
    align-items: center;
    margin-top: 2rem !important;
    margin-bottom: 0px !important;
}

div.tf-slider ul.dots.disabled {
    opacity: .2;
}

div.tf-slider ul.dots li {
    margin: 0px;
    position: relative;
}

div.tf-slider ul.dots li + li {
    margin-top: 0px;
}

div.tf-slider ul.dots li {
    width: 1.25rem;
    height: 1.25rem;
}

div.tf-slider ul.dots li button {
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: transparent;
    border-radius: 50%;
    border: none;
    left: 0px;
    top: 0px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}

div.tf-slider ul.dots.disabled li button {
    cursor: default;
}

div.tf-slider ul.dots li button::before {
    content: "";
    display: block;
    width: 0.25rem;
    height: 0.25rem;
    background-color: black;
    border-radius: 50%;
    opacity: 0.2;
    transition: opacity .2s;
}

div.tf-slider ul.dots li.selected button::before {
    opacity: 1;
}

div.tf-slider .arrows {
    position: absolute;
    height: 50px;
    width: 50px;
    background-color: transparent;
    border: var( --border-thinoutline-black );
    border-radius: 50%;
    bottom: 0px;
    cursor: pointer;
    transition: background-color .2s, border .2s, opacity .2s;
}



div.tf-slider .arrows:not( .disabled ):hover {
    background-color: var( --textcolor );
}

div.tf-slider .arrows.disabled {
    opacity: 0.2;
    pointer-events: none;
}

div.tf-slider .arrows.left {
    left: 0px;
}

div.tf-slider .arrows.right {
    left: calc( 50px + 1rem );
}

div.tf-slider .arrows::before {
    content: "";
    display: block;
    position: absolute;
    width: 14px;
    height: 14px;
    rotate: 45deg;
    top: 17px;
    transition: border-color .2s;
}

div.tf-slider .arrows.left::before {
    right: 14px;
    border-left: 2px solid var( --textcolor );
    border-bottom: 2px solid var( --textcolor );
}

div.tf-slider .arrows.right::before {
    left: 14px;
    border-right: 2px solid var( --textcolor );
    border-top: 2px solid var( --textcolor );
}

div.tf-slider .arrows:hover::before {
    border-color: white;
}

@media only screen and (max-width: 550px) {

    div.tf-slider ul.dots {
        margin-top: calc( 1rem + 50px + 2rem ) !important;
    }
    
    div.tf-slider .arrows {
        bottom: calc( 50px + 1rem );
    }
    
    div.tf-slider .arrows.left {
        left: calc( 50% - 50px - 0.5rem );
    }
    
    div.tf-slider .arrows.right {
        left: calc( 50% + 0.5rem );
    }

}


/* IMAGE WITH ICON */

div.tf-image-with-icon {
    margin-bottom: 2rem;
}

div.tf-image-with-icon img {
    margin-bottom: 0px !important;
    border-radius: 1rem;
}

div.tf-image-with-icon .icon-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: auto;
    height: 4rem;
    width: 4rem;
    background-color: white;
    margin-top: -2rem;
    position: relative;
    border-radius: 50%;
    box-shadow: var( --box-shadow-card );
}

div.tf-image-with-icon .icon-wrapper img {
    border-radius: 0px;
    margin-bottom: 0;
    width: 2.5rem;
    height: 2.5rem;
}

/* KASPAR's CHAOS AREA */

h4.k-eyebrow-headline{
    color: var(--main-color);
    margin-bottom: 0.25em !important;
}

section.blue h4.k-eyebrow-headline{
    color: var(--secondary-color);
}


h4.k-eyebrow-headline + h2 {
  margin-top: 0 !important;
}

div.k-vision-pills{
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 2rem;
}

div.k-vision-pills span.k-vision-pill{
    background: rgba(155, 161, 177, 0.1);
    border: 1px solid var(--textcolor-soft);
    color: var(--textcolor);
    border-radius: 50px;
    padding: 3px 12px;
    font-size: 0.75rem;
    font-weight: 700;
}

span.k-vision-pill.no {
    text-decoration: line-through;
    opacity: 0.5;
}


div.k-module-list{
    border-top: 1px solid #e9e3d9;
    margin-top: 0.5rem;
    display: flex;
    flex-direction: column;
    gap: 0;
}

div.k-module-list .k-module-item {
    /* background: var(--background-off-white); */
    /* border-radius: 12px;
    padding: 1rem 1.2rem; */
    display: flex;
    flex-direction: row;;
    align-items: center;
    gap: 1.25rem;
    border: 1px solid var(--background-grey);
        border-radius: 1rem;
    /* border: 1.5px solid var(--background-off-white); */
}

div.k-module-item.tf-course-card {
    border: none;
    border-bottom: 1px solid #e9e3d9;
    border-radius: 0; 
    padding-top: 1em;
    padding-bottom: 1em;
}

div.k-module-list .k-module-item .k-module-num {
    width: 32px;
    height: 32px;
    background: var(--main-color);
    border-radius: 8px;
    color: white;
    display: flex;

    justify-content: center;
    font-size: 0.85rem;
    font-weight: 800;
    flex-shrink: 0;
}

@media only screen and (max-width: 700px) {
    div.k-module-list .k-module-item {
        flex-direction: column;
    }

    div.k-module-list .k-module-item .thumbnail {
        width: 100% !important;
    }

    .k-preise-grid {
        grid-template-columns: 1fr !important;
        gap: 0.75rem;
    }
}

div.k-module-content{
    width: 100%;
    padding: 1em 1em 1em 0;
    display: flex;
    gap: 1em;
    justify-content: space-between;
    align-items: center;
}


div.k-module-list .k-module-item .k-module-texts h5.k-module-subtitle{
font-size: 1rem;
color: var(--textcolor-medium-soft);
    font-weight: 400;
}
div.k-module-list .k-module-item .k-module-texts h4{
margin-top: 0em;
}

div.k-module-list .k-module-item .k-module-texts button{
margin-top: 1em;
}

div.k-module-list .k-module-item .thumbnail{
    width: 200px;
}

div.k-module-list .k-module-item .thumbnail .play{ 
    width:35px;
    height:35px;
}

div.k-module-list .k-module-item .thumbnail .label{ 
    font-size: 0.8rem;
    top: calc(50% + 20px);
}

ul.checkmark-list.k-dreamresults li+li{
    margin-top: 0.75em !important;
}

ul.checkmark-list.k-dreamresults li{
    background: rgba(255, 255, 255, 0.07);
    border-radius: 14px;
    padding: 1.2rem 1.5rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    display: flex;
    align-items: flex-start;
    gap: 1rem;
}

ul.checkmark-list.k-dreamresults li div.k-result-check{
    width: 28px;
    height: 28px;
    background: var(--secondary-color);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 0.9rem;
    margin-top: 2px;
    color: var(--textcolor);
}

ul.checkmark-list.k-dreamresults li p{
margin-top: 0 !important;
}

div.tf-card.off-white{
    background-color: var(--background-off-white);
}

.k-preise-grid {
    display: grid;
    grid-template-columns: 1fr 1.4fr;
    gap: 1.5rem;
    margin-top: 1rem;
}

.k-preise-grid .k-preis-card {
    border-radius: 20px;
    padding: 2.5rem;
    border: 1px solid #e9e3d9;
    background-color: white;
    color: var(--textcolor) !important;

    display: flex;
    flex-direction: column;
}
.k-preise-grid .k-preis-card a.tf-button{
    margin-top: auto !important;
}


.k-preise-grid .k-preis-card h4{
    margin-top: 0 !important;
    margin-bottom: 1em;
    color: var(--textcolor-medium-soft);
}

.k-preise-grid .k-preis-card h3{
    margin-bottom: 0 !important;
}

.k-preise-grid .k-preis-card h3+p{
    margin-top: 0 !important;
    color: var(--textcolor-soft);
}


.k-preise-grid .k-preis-card.featured {
    border: 2px solid var(--main-color);
    box-shadow: 0 24px 48px -24px rgba(255, 47, 35, .35);
    position: relative;
}

.k-preis-badge {
    position: absolute;
    top: -14px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--main-color);
    color: white;
    font-size: 0.75rem;
    font-weight: 800;
    padding: 5px 16px;
    border-radius: 20px;
    white-space: nowrap;
}

ul.k-preis-features {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 0.7rem;
    margin-bottom: 2rem;
    margin-top: 0 !important;
}

ul.k-preis-features li {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 1rem;
    font-weight: 700;
    color: var(--text-color);
}

ul.k-preis-features li+li{
    margin-top: 0 !important;
}

ul.k-preis-features li .check {
    color: var(--success-green);
}

ul.k-preis-features li .cross {
    color: var(--textcolor-soft);
}

ul.k-preis-features li.k-inactive{
    color: var(--textcolor-soft);
}

h3.k-price span + span{
    color: var(--textcolor-soft);
    font-weight: 600;
    font-size: 1rem;
}

.k-preise-grid .k-preis-card a.tf-button{
    margin-top: 1em;
    width: 100%;
    display: inline-flex;
  align-items: center;
  justify-content: center;
}

span.k-learnings-pill{
    background: white; 
    border: 1px solid #c5d4e6; 
    border-radius: 999px; 
    padding: 6px 12px 6px 9px; 
    font-size: 14px; 
    color: var(--textcolor); 
    display: inline-flex; 
    align-items: center; 
    gap: 6px;
}

section.tf-hero span.k-learnings-pill{
    background: rgba(255, 255, 255, .13);; 
    border: 1px solid rgba(255, 255, 255, .3);
    color: white;
}



.k-klartext-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
    justify-items: flex-start;
}

.k-klartext-grid .tf-card+.tf-card{
    margin: 0!important;
}

.k-klartext-item {
    border-radius: 12px;
    padding: 2rem;
}

.k-klartext-header {
    display: flex;
    align-items: start;
    gap: 1rem;
}

.k-klartext-header svg {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
}

.k-klartext-grid .tf-card h3 {
    margin: 0 !important;
    line-height: 1.3;
    font-size: 1.25rem;
}


/* Tablet: kleinere Abstände, Cards etwas kompakter */
@media (max-width: 1024px) {
    .k-klartext-grid {
        gap: 1.5rem;
    }
    
    .k-klartext-item {
        padding: 1.75rem;
    }
    
    .k-klartext-header svg {
        width: 36px;
        height: 36px;
    }
    
    .k-klartext-item h3 {
        font-size: 1.15rem;
    }
}

/* Mobile: einspaltig */
@media (max-width: 768px) {
    .k-klartext-grid {
        grid-template-columns: 1fr;
        gap: 1.25rem;
    }
    
    .k-klartext-item {
        padding: 1.5rem;
    }
    
    .k-klartext-header {
        gap: 0.85rem;
        margin-bottom: 0.85rem;
    }
    
    .k-klartext-header svg {
        width: 32px;
        height: 32px;
    }
    
    .k-klartext-item h3 {
        font-size: 1.1rem;
    }
    
    .k-klartext-item p {
        font-size: 0.95rem;
    }
}

/* Sehr schmale Screens (z.B. iPhone SE) */
@media (max-width: 380px) {
    .k-klartext-item {
        padding: 1.25rem;
    }
    
    .k-klartext-header {
        gap: 0.75rem;
    }
    
    .k-klartext-header svg {
        width: 28px;
        height: 28px;
    }
}

.k-tl-questions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-bottom: 14px;
}

.k-tl-q-card {
  background: #fff;
  border: 1px solid rgba(26, 48, 86, 0.12);
  border-radius: 12px;
  padding: 20px;
}


.k-tl-q-text {
  font-size: 1rem !important;
  font-weight: 600 !important;
  line-height: 1.45;
  margin: 0 !important;
}

/* Ergebnis-Box (dunkelblau, mit Icon) */
.k-tl-result {
  background: #1a3056;
  color: #fff;
  border-radius: 12px;
  padding: 18px 20px;
  display: flex;
  align-items: center;
  gap: 16px;
}

.k-tl-result-icon {
  flex-shrink: 0;
  width: 42px;
  height: 42px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.1);
  display: flex;
  align-items: center;
  justify-content: center;
}

.k-tl-result-icon svg {
  width: 22px;
  height: 22px;
}

.k-tl-result-text {
  flex: 1;
}

.k-tl-result-text p{
    margin: 0 !important;
    
}

.k-tl-result-eyebrow {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #ff8a82;
  margin-bottom: 4px;
}

.k-tl-result-headline {

  margin: 0 !important;
}

.k-tl-result-sub {
  font-size: 13px;
  color: rgba(255, 255, 255, 0.7);
  margin: 4px 0 0;
}

/* Mobile: Fragen untereinander */
@media (max-width: 600px) {
  .k-tl-questions {
    grid-template-columns: 1fr;
  }
}

/* === Stats: 3 Zahlen-Kacheln (5 / 3 / 1+) === */
.k-tl-stats {

  --k-red-soft: #fdf1ec;       /* heller Container-Hintergrund */
  --k-navy: #1c2a4a;
  display: flex;
  align-items: stretch;
  background: var(--k-red-soft);
  border-radius: 18px;
  padding: 28px 16px;
  gap: 0;
}
.k-tl-stat {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 4px 24px;
  position: relative;
}
/* Trennstriche zwischen den Items */
.k-tl-stat + .k-tl-stat::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  height: 56px;
  width: 1px;
  background: rgba(232, 70, 42, 0.18);
}
.k-tl-icon {
  flex: 0 0 auto;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  border: 2px solid var(--main-color);
  color: var(--main-color);
}
/* erstes Icon gefüllt */
.k-tl-stat:first-child .k-tl-icon {
  background: var(--main-color);
  border-color: var(--main-color);
  color: #fff;
}
.k-tl-icon svg { width: 26px; height: 26px; display: block; }
.k-tl-text { display: flex; flex-direction: column; line-height: 1.15; }
.k-tl-stat-num {
  font-size: 2rem;
  font-weight: 800;
  color: var(--main-color);
  letter-spacing: -0.01em;
}
.k-tl-stat-label {
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--k-navy);
  margin-top: 2px;
}

/* Responsive: 2×2 auf kleineren Screens */
@media (max-width: 760px) {
  .k-tl-stats { flex-wrap: wrap; padding: 20px 8px; }
  .k-tl-stat { flex: 0 0 50%; padding: 16px; }
  .k-tl-stat + .k-tl-stat::before { display: none; }
}
@media (max-width: 440px) {
  .k-tl-stat { flex: 0 0 100%; }
}

.k-ersttermin-eyebrow {
    font-size: 0.875rem;
    font-weight: 500;
    color: #D85A30;
    margin: 0 0 0.5rem;
}

.k-ersttermin-headline {
    font-size: 1.75rem;
    margin: 0 0 2rem;
    letter-spacing: -0.01em;
}

.k-ersttermin-card {
    background: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 12px;
    overflow: hidden;
    display: grid;
    grid-template-columns: 240px 1fr;
}

.k-ersttermin-person {
    background: #FAECE7;
    padding: 2rem 1.5rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.k-ersttermin-foto {
    width: 140px;
    height: 140px;
    border-radius: 50%;
    border: 4px solid #ffffff;
    margin-bottom: 1rem;
    object-fit: cover;
}

h4.k-ersttermin-name {
    color: #4A1B0C;
    margin: 0 !important;
}


p.k-ersttermin-rolle {
    color: #993C1D;
    margin: 0 !important;
}

.k-ersttermin-content {
    padding: 2.5rem;
    color: var(--textcolor) !important;
}

.k-ersttermin-meta {
    list-style: none;
    padding: 0;
    margin: 0 0 1.5rem;
    display: flex;
    gap: 1.5rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

ul li.k-ersttermin-meta-item {
    display: flex;
    flex-direction: column;
}

ul li.k-ersttermin-meta-item + li.k-ersttermin-meta-item{
    margin-top: 0 !important;
}

.k-ersttermin-meta-label {
    font-size: 0.6875rem;
    color: var(--textcolor-medium-soft);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 0.25rem;
}

.k-ersttermin-meta-value {
    font-size: 0.875rem;
    font-weight: 500;
}

.k-ersttermin-text {
    font-size: 1rem;
    line-height: 1.7;
    margin: 0 0 1.5rem;
}

.k-ersttermin-text-muted {
    font-size: 0.9375rem;
    color: var(--textcolor-medium-soft);
    margin-bottom: 2rem;
}

@media (max-width: 640px) {
    .k-ersttermin-card {
        grid-template-columns: 1fr;
    }

    .k-ersttermin-content {
        padding: 1.5rem;
    }

    .k-ersttermin-meta {
        flex-wrap: wrap;
        gap: 1rem;
    }
}

  .k-mock-visual {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 2rem 0;
    padding: 0.5rem 0;
  }
  .k-mock-visual svg {
    max-width: 100%;
    height: auto;
  }
  .k-mock-caption {
    font-size: 11px;
    fill: var(--color-text-tertiary);
    letter-spacing: 0.04em;
  }
  .k-mock-possibility {
    font-size: 17px;
    line-height: 1.65;
    color: var(--color-text-primary);
    margin: 0;
  }
  .k-mock-accent {
    color: var(--main-color);
  }

  section.tf-content > .wrapper h2 .k-accent {
    color: var(--main-color);
}
 
/* betonter "Gute Nachricht"-Satz */
section.tf-content > .wrapper p.k-lead-strong {
    font-weight: 600;
}
 
 
/* --- Start-Sektion: Foto im Magazin-Layout --- */
.k-photo {
    position: relative;
    margin: 0;
}
 
section.tf-content > .wrapper .k-photo img {
    width: 100%;
    aspect-ratio: 4 / 5;
    max-height: 460px;
    object-fit: cover;
    border-radius: 1rem;
    margin: 0 !important;
}
 
.k-photo-tag {
    position: absolute;
    top: 1rem;
    left: 1rem;
    background: #EFB535;
    color: var(--textcolor);
    font-size: 0.75rem;
    font-weight: 700;
    padding: 5px 12px;
    border-radius: 50px;
}
 
.k-photo-caption {
    margin-top: 0.65rem;
    font-size: 0.9rem;
    color: var(--textcolor-soft);
}
 
 
/* --- Kategorien-Sektion: Kachelraster --- */
.k-cat-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
}
 
/* sub-headline liefert den Abstand schon, daher kein zusätzlicher */
section.tf-content > .wrapper > .k-cat-grid {
    margin-top: 0;
}
 
.k-cat-card {
background-color: white;
    color: var(--textcolor);
    box-shadow: var(--box-shadow-card);
    border-radius: 1rem;
    overflow: hidden;
}
 
 
section.tf-content > .wrapper .k-cat-card img {

    margin: 0 !important;
}
 
.k-cat-body {
    padding: 0.9rem 1.15rem 1.2rem;
}
 
section.tf-content > .wrapper h4.k-cat-title {
    font-size: 1.1rem;
    margin: 0 0 0.3rem !important;
}
 
section.tf-content > .wrapper p.k-cat-text {
    font-size: 1rem;
    line-height: 1.45;
    color: var(--textcolor-soft);
    margin: 0 !important;
}
 
 
/* --- Responsiv --- */
@media only screen and (max-width: 900px) {
    .k-cat-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}
 
@media only screen and (max-width: 560px) {
    .k-cat-grid {
        grid-template-columns: 1fr;
    }
}

div.k-module-item div.kurs-nr{
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: var(--background-off-white);
    border: 1px solid #e9e3d9;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;

}
div.k-module-item div.kurs-nr p{
        font-weight: 700;
    font-size: 1.05rem;
    color: var(--main-color);
}


.wrapper.schmal {
    max-width: 1000px;
}

.k-marquee{position:relative;
    -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
            mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
    overflow:hidden;}
.k-track{display:flex;gap:.9rem;width:max-content;}

@media only screen and (max-width: 560px) {
    .k-track span.k-chip {
        font-size: .7rem;
        padding: .25rem .5rem .25rem .3rem;
    }

    .k-track span.k-chip img{
        font-size: .7rem;
        padding: .25rem .5rem .25rem .3rem;
        width: 32px;
    height: 25px;
    }

    p.k-p{
        font-size: 1rem;
    }

    .k-step{
        gap: 10px;
    }

    .k-result{
        flex-direction: column;
        align-items: start !important;
    }
}

@media only screen and (max-width: 560px) {
    div.k-module-content {
flex-direction: column;
align-items: unset;
    }
}


.k-row1{animation:k-left 90s linear infinite;}
.k-row2{animation:k-right 90s linear infinite;margin-top:.9rem;}
.k-row3{animation:k-left 90s linear infinite;margin-top:.9rem;}
.k-marquee:hover .k-track{animation-play-state:paused;}
  
@keyframes k-left{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes k-right{from{transform:translateX(-50%)}to{transform:translateX(0)}}

.k-chip{display:inline-flex;align-items:center;gap:.6rem;white-space:nowrap;
    padding:.45rem .95rem .45rem .45rem;border:1px solid #e6e3dd;border-radius:16px;
    background:#fff;font-size:.95rem;font-weight:500;}

  section.tf-content > .wrapper img.k-chip-thumb{flex:0 0 auto;display:block;width:52px;height:32px;border-radius:9px;
    object-fit:contain;padding:5px;background-color:var(--light-blue);}

  


@media (prefers-reduced-motion:reduce){
    .k-marquee{overflow-x:auto;}
    .k-track{animation:none;}
  }

h2 .accent{color:var(--main-color);}

.k-principles-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:28px;
}

.k-principle{
    position:relative;

    display:grid;
    grid-template-columns:1fr;

    border-radius: 1rem;

    border:1px solid #e8e8e8;
    overflow:hidden;

    transition:.2s ease;
}

div.k-principle__content div.payoff{
    border-top: 1px dotted var(--textcolor-medium-soft);
    margin-top: 10px;
    padding-top: 10px;
}

div.k-principle__content div.payoff h4{
    text-decoration: double;
    color: var(--main-color);
    font-size: 0.8rem;
    text-transform: uppercase;
}

div.k-principle__content div.payoff p{
    color: var(--textcolor);
    font-size: 1.1rem;
}

.k-principle .k-principle-head img{
    margin-top: 0 !important;
}


.k-principle__number{
    position:absolute;
    top:24px;
    left:24px;

    width:50px;
    height:50px;

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

    border-radius:14px;
    border: 1px solid rgba(255,255,255,0.5);

    color:#fff;
    font-weight:700;
    font-size:20px;
}

.k-principle__content{
    display:flex;
    flex-direction:column;

padding: 1.5em;
}

.k-principle__content h3{
    margin:0 0 12px !important;

    font-size:22px;
    line-height:1.15;
    font-weight:700;

    color:#1d315d;
}

.k-principle__content p{
    margin:0 !important;

    font-size:16px;
    line-height:1.55;

    color:var(--textcolor-medium-soft);
}

.k-principle__icon{
    margin-top:auto;

    width:58px;
    height:58px;

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

    background:#fff;
    border-radius:16px;

    box-shadow:0 6px 18px rgba(0,0,0,.05);
}

.k-principle__icon svg{
    width:24px;
    height:24px;
    color:#1d315d;
}

.k-principle__image{
    align-self:start;

    width:100%;
    height:150px;

    border-radius:18px;
    overflow:hidden;
}

.k-principle__image img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}

/* Farbvarianten */

.k-principle--yellow{
    background:#fffbf2;
}

.k-principle--yellow .k-principle__number{
    background:#f5b400;
}

.k-principle--blue{
    background:#f4f8ff;
}

.k-principle--blue .k-principle__number{
    background:#377dff;
}

.k-principle--green{
    background:#f4fbf2;
}

.k-principle--green .k-principle__number{
    background:#63c15f;
}

.k-principle--purple{
    background:#faf5ff;
}

.k-principle--purple .k-principle__number{
    background:#9b6df1;
}

.k-principle--orange{
    background:#fff8f0;
}

.k-principle--orange .k-principle__number{
    background:#ff923d;
}

.k-principle--pink{
    background:#fff5f8;
}

.k-principle--pink .k-principle__number{
    background:#ff6ea0;
}

/* Tablet */

@media (max-width:1200px){

    .k-principles-grid{
        grid-template-columns:1fr 1fr;
    }

}

/* Mobile */

@media (max-width:768px){

    .k-principles-grid{
        grid-template-columns:1fr;
    }

    .k-principle{
        grid-template-columns:1fr;
    }

    .k-principle__image{
        order:-1;
        height:220px;
    }

    .k-principle__content{
        margin-top:20px;
    }

}

/*

    SO FUNKTIONIERT'S — Ablauf-Section
    Komplettes CSS, passend zum bereinigten HTML.

    Markenfarben (bei Bedarf auf deine Variablen mappen):
      var(--main-color)  -> --main-color (Rot)
      #1a3056  -> --textcolor (Navy)
      #EFB535  -> --secondary-color (Gelb)

*/


/* GRUNDGERÜST + ZEITSTRAHL */

.k-wrap{
    position: relative;
    margin-top: 2.5rem;
}

.k-line{
    position: absolute;
    left: 21px;
    top: 24px;
    bottom: 26px;
    width: 2px;
    background: #e6e1d8;
    z-index: 0;
}

.k-step{
    display: flex;
    gap: 20px;
    position: relative;
    padding-bottom: 35px;
}

.k-step:last-child{
    padding-bottom: 0;
}


/* NUMMERN-KREIS */

.k-gutter{
    flex: 0 0 44px;
    display: flex;
    justify-content: center;
    padding-top: 2px;
}

.k-num{
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--main-color);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 17px;
    font-weight: 600;
    position: relative;
    z-index: 1;
}

.k-num--bonus{
    background: #fff;
    border: 2px solid #EFB535;
    color: #EFB535;
}

.k-num--bonus i{
    font-size: 18px;
}


/* KARTE */

.k-card{
    flex: 1;
    min-width: 0;
    border-radius: 14px;
    padding: 18px 20px;
    background: #fff;
    border: 0.5px solid #e6e1d8;
}

.k-inner{
    display: flex;
    gap: 22px;
    align-items: center;
    flex-wrap: wrap;
}

.k-txt{
    flex: 1;
    min-width: 190px;
}

.k-meta{
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #9b958a;
}

.k-h{
    font-size: 19px;
    font-weight: 500;
    color: #1a3056;
    margin: 3px 0 6px;
    line-height: 1.2;
}

.k-p{
    font-size: 14.5px;
    line-height: 1.6;
    color: #54607a;
    margin: 0;
}

.k-visual{
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
}


/* VARIANTE: SCHRITT 2 (KERNSTÜCK) */

.k-step--feature .k-card{
    background: #eef2f8;
    border-color: #d6e0ef;
    padding: 22px 24px;
}

.k-step--feature .k-meta{
    color: #7d8aa3;
}

.k-step--feature .k-h{
    font-size: 22px;
}

.k-step--feature .k-p{
    color: #46536e;
}


/* VARIANTE: BONUS-BAND */

.k-step--bonus .k-card{
    display: flex;
    align-items: center;
    gap: 15px;
    flex-wrap: wrap;
    background: #fff7e6;
    border-color: #f2e3bf;
    padding: 13px 18px;
}

.k-bonus-icon{
    flex: 0 0 46px;
    height: 46px;
    border-radius: 12px;
    background: #fff;
    border: 0.5px solid #f2e3bf;
    display: flex;
    align-items: center;
    justify-content: center;
}

.k-bonus-icon i{
    font-size: 24px;
    color: #EFB535;
}

.k-bonus-body{
    flex: 1;
    min-width: 200px;
}

.k-step--bonus .k-meta{
    color: #c79a1e;
    font-size: 11.5px;
}

.k-step--bonus .k-h{
    font-size: 16.5px;
    margin: 1px 0 2px;
}

.k-step--bonus .k-p{
    font-size: 13.5px;
    color: #7a6a3e;
}

.k-bonus-pill{
    background: #fff;
    border: 0.5px solid #f2e3bf;
    color: #9a7414;
    font-size: 10.5px;
    font-weight: 500;
    padding: 4px 10px;
    border-radius: 6px;
    display: flex;
    align-items: center;
    gap: 5px;
}

.k-bonus-pill i{
    font-size: 12px;
}


/* VISUAL: ZOOM (SCHRITT 1) */

.k-zoom{
    width: 196px;
    background: #1a3056;
    padding: 7px;
    border-radius: 10px;
    box-sizing: border-box;
}

.k-zoom-dots{
    display: flex;
    gap: 5px;
    margin: 2px 3px 6px;
}

.k-zoom-dots span{
    width: 7px;
    height: 7px;
    border-radius: 50%;
}

.k-zoom-dots span:nth-child(1){ background: #ff5b50; }
.k-zoom-dots span:nth-child(2){ background: #EFB535; }
.k-zoom-dots span:nth-child(3){ background: #5dcaa5; }

.k-zoom-screen{
    position: relative;
    height: 96px;
    border-radius: 6px;
    background: #ebf8ff;
    display: flex;
    align-items: center;
    justify-content: center;
}

.k-zoom-screen .ti-user{
    font-size: 42px;
    color: #1a3056;
    opacity: 0.5;
}

.k-zoom-name{
    position: absolute;
    left: 6px;
    bottom: 6px;
    background: rgba(26, 48, 86, 0.9);
    color: #fff;
    font-size: 10px;
    font-weight: 500;
    padding: 2px 7px;
    border-radius: 5px;
}

.k-zoom-live{
    position: absolute;
    right: 6px;
    top: 6px;
    background: var(--main-color);
    color: #fff;
    font-size: 9px;
    font-weight: 500;
    letter-spacing: 0.05em;
    padding: 2px 6px;
    border-radius: 5px;
}


/* VISUAL: KURS-FÄCHER (SCHRITT 2) */

.k-fan{
    position: relative;
    width: 180px;
    height: 120px;
}

.k-fan-card{
    position: absolute;
    width: 118px;
    height: 78px;
    border-radius: 9px;
}

.k-fan-card--back-left{
    left: 0;
    top: 14px;
    background: #eef3da;
    border: 1px solid #d8e3bd;
    transform: rotate(-8deg);
}

.k-fan-card--back-right{
    left: 42px;
    top: 10px;
    background: #dbeafa;
    border: 1px solid #c0d8f3;
    transform: rotate(7deg);
}

.k-fan-card--front{
    left: 22px;
    top: 0;
    background: #fbe0de;
    border: 1px solid #f2c4c0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.k-fan-play{
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: rgba(255, 47, 35, 0.94);
    display: flex;
    align-items: center;
    justify-content: center;
}

.k-fan-play i{
    font-size: 19px;
    color: #fff;
}

.k-fan-label{
    position: absolute;
    left: 34px;
    bottom: -6px;
    background: #1a3056;
    color: #fff;
    font-size: 10.5px;
    font-weight: 500;
    padding: 3px 10px;
    border-radius: 6px;
}


/* VISUAL: DOKUMENT (SCHRITT 3) */

.k-doc{
    position: relative;
    width: 148px;
    height: 108px;
}

.k-doc-back{
    position: absolute;
    left: 30px;
    top: 8px;
    width: 90px;
    height: 90px;
    border-radius: 6px;
    background: #fff;
    border: 1px solid #e6e1d8;
    transform: rotate(6deg);
}

.k-doc-front{
    position: absolute;
    left: 14px;
    top: 2px;
    width: 94px;
    height: 94px;
    border-radius: 6px;
    background: #fff;
    border: 1px solid #e6e1d8;
    transform: rotate(-4deg);
    padding: 12px;
    box-sizing: border-box;
}

.k-doc-bar{
    width: 30px;
    height: 4px;
    border-radius: 3px;
    background: var(--main-color);
    margin-bottom: 9px;
}

.k-doc-line{
    display: flex;
    gap: 5px;
    align-items: center;
    margin-bottom: 7px;
}

.k-doc-line:last-child{
    margin-bottom: 0;
}

.k-doc-check{
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #ebf8ff;
    display: flex;
    align-items: center;
    justify-content: center;
}

.k-doc-check i{
    font-size: 8px;
    color: #1a3056;
}

.k-doc-fill{
    height: 4px;
    border-radius: 3px;
    background: #e9e4db;
    flex: 1;
}

.k-doc-post{
    position: absolute;
    right: -6px;
    bottom: -2px;
    background: #EFB535;
    color: #7a5a08;
    font-size: 9.5px;
    font-weight: 500;
    padding: 3px 8px;
    border-radius: 6px;
    display: flex;
    align-items: center;
    gap: 4px;
}

.k-doc-post i{
    font-size: 11px;
}


/* SCHRITT 3: FRAGEN */

.k-questions{
    display: flex;
    gap: 12px;
    margin-top: 16px;
    flex-wrap: wrap;
}

.k-question{
    flex: 1;
    min-width: 170px;
    background: var(--background-off-white);
    border: 0.5px solid #e6e1d8;
    border-radius: 10px;
    padding: 13px 15px;
}

.k-question-num{
    font-size: 12px;
    font-weight: 500;
    color: var(--main-color);
}

.k-question-text{
    font-size: 15px;
    line-height: 1.5;
    color: #1a3056;
    font-weight: 500;
}


/* SCHRITT 3: ERGEBNIS */

.k-result{
    display: flex;
    gap: 14px;
    align-items: center;
    margin-top: 12px;
    background: #1a3056;
    border-radius: 11px;
    padding: 16px 18px;
}

.k-result-icon{
    flex: 0 0 40px;
    height: 40px;
    border-radius: 9px;
    background: rgba(255, 255, 255, 0.12);
    display: flex;
    align-items: center;
    justify-content: center;
}

.k-result-icon i{
    font-size: 21px;
    color: #fff;
}

.k-result-eyebrow{
    font-size: 11.5px;
    font-weight: 500;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: #ff8a82;
    margin-bottom: 3px;
}

.k-result-headline{
    font-size: 15.5px;
    font-weight: 500;
    color: #fff;
    line-height: 1.35;
}

.k-result-sub{
    font-size: 15px;
    color: #aeb8cc;
}


/* RESPONSIVE */

@media only screen and (max-width: 700px){

    .k-line{
        left: 21px;
    }

    .k-visual{
        flex-basis: 100%;
        justify-content: flex-start;
    }

    .k-question{
        min-width: 0;
        flex-basis: 100%;
    }
}

.single-license {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px;

  margin-top: 24px;
  padding: 14px 18px;

  border: 1px solid rgb(233, 227, 217);
  border-radius: 20px;
  background: white;

  max-width: 800px;
    margin: 0 auto;
    color: var(--textcolor);
}

.single-license__icon {
  width: 30px;
  height: 30px;
  flex-shrink: 0;
}

.single-license__text {
  flex: 1;
  min-width: 170px;
}

.single-license__title {
  display: block;
  font-size: 14px;
  font-weight: 600;
  color: var(--el-navy);
}

.single-license__desc {
  display: block;
  margin-top: 2px;
  font-size: 13px;
}

.single-license__price {
  font-size: 18px;
  font-weight: 600;
}

.single-license__cta {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  white-space: nowrap;

  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
}

.single-license__cta:hover,
.single-license__cta:focus-visible {
  text-decoration: underline;
}

/* ---- Sehr schmale Screens: Preis + CTA rutschen unter den Text ---- */
@media (max-width: 380px) {
  .single-license__price,
  .single-license__cta {
    margin-top: 4px;
  }
}

div.k-trennstrich{
    border-top: var(--border-thinline-black);
    background-color: var(--background-grey);
    margin-top: 1em;
    margin-bottom: 1em;
}

aside.single-license h3{
    color: var(--text-color);
    margin-bottom: 0 !important;
}

aside.single-license p{
    color: var(--textcolor-soft);
    margin: 0 !important;
}

.single-license p.k-price{
    color: var(--text-color);
    font-weight: 600 !important;
}

.k-retention {
	/* Farben zentral – hier anpassen, falls deine Markenwerte abweichen */
	--main-color-light:  #F0997B;
	--k-text:         #FFFFFF;
	--k-text-muted:   rgb(174, 184, 204);
	--k-text-dim:     rgb(174, 184, 204);
	--k-radius:       12px;
}

/* Badge */
.k-badge {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-bottom: 18px;
	padding: 4px 11px;
	border-radius: 999px;
	background: var(--main-color);
	color: white;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.03em;
	text-transform: uppercase;
}
.k-badge svg { width: 14px; height: 14px; }

/* Headline */
.k-headline {
	margin: 0;
	max-width: 24ch;
	font-size: clamp(22px, 3vw, 28px);
	font-weight: 600;
	line-height: 1.25;
}
.k-answer { color: var(--main-color); }

/* Lead */
.k-lead {
	max-width: 56ch;
	margin: 14px 0 26px;
	color: var(--textcolor-medium-soft);
	font-size: 16px;
	line-height: 1.6;
}

/* Timeline */
.k-timeline {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 16px;
}

.k-phase {
	padding: 14px 18px;
	border: 0.5px solid rgba(255, 255, 255, 0.14);
	border-radius: var(--k-radius);
	background: rgba(255, 255, 255, 0.06);
}

.k-phase--highlight {
	display: flex;
	align-items: center;
	gap: 14px;
	flex: 1;
	min-width: 200px;
	border-color: var(--textcolor-soft);
	background: var(--light-blue);
}

.k-phase-title {
	display: block;
	font-size: 17px;
	font-weight: 600;
}
.k-phase-sub {
	display: block;
	margin-top: 2px;
	color: var(--textcolor-soft);
	font-size: 12px;
	letter-spacing: 0.03em;
	text-transform: uppercase;
}
.k-phase-sub--accent {
	text-transform: none;
	letter-spacing: normal;
	font-size: 13px;
	color: var(--textcolor-medium-soft);
}

.k-arrow {
	width: 22px;
	height: 22px;
	flex-shrink: 0;
	color: var(--main-color);
}
.k-infinity {
	width: 30px;
	height: 30px;
	flex-shrink: 0;
	color: var(--main-color);
}

/* Mobil: Timeline gestapelt, Pfeil zeigt nach unten */
@media (max-width: 520px) {
	.k-timeline { flex-direction: column; align-items: stretch; }
	.k-arrow { transform: rotate(90deg); align-self: center; }
	.k-phase { width: 100%; box-sizing: border-box; text-align: center; }
}

p.k-soft-text{
    color: var(--textcolor-medium-soft);
}


.k-feedback-reel-grundausbildung .tf-slider > ul.dots:nth-child(2) { 
  display: none;
}

.k-preise-switch { margin-bottom: 1.5rem; display: flex; gap: 1em;     align-items: center;}
.k-preise-switch-label { margin: 0 !important; font-weight: 600 !important;}
.k-preise-switch-buttons {     
    margin-top: 5px;
    display: grid;
    gap: 0.25rem;
    width: 100%;
    grid-template-columns: 1fr 1fr 1fr; }
.k-size-btn {
    background: transparent;
    color: inherit;
    border: 1px solid currentColor;
    border-radius: 10px;
    padding: 0.3rem 0.8rem;
    font: inherit;
    font-size: 1rem;
    cursor: pointer;
    opacity: 0.6;
    transition: opacity 0.15s, background-color 0.15s;
}
.k-size-btn:hover { opacity: 0.9; }
.k-size-btn.is-active {
    background: var(--main-color);
    border-color: var(--main-color);
    color: #fff;
    font-weight: 500;
    opacity: 1;
}
.k-preise-switch-hint { margin: 0.75rem 0 0; font-size: 0.8rem; opacity: 0.55; max-width: 46em; }
.k-price-regular { margin: -0.5rem 0 1.25rem; font-size: 0.85rem; opacity: 0.6; }

div.k-termin-info{
    margin-top: 2em;
    display: flex;
    gap: 1em;
}

div.k-termin-info img{
    max-width: 3em;
    margin: 0 !important;
}

div.k-termin-info p{
    margin: 0 !important;
}

div.k-schulangebot-preise-container{
    background: var(--background-grey);
    padding: 1.5em;
    border-radius: 15px;
    color: var(--textcolor) !important;
}

@media (max-width: 600px) {
    div.k-schulangebot-preise-container{
    padding: 0.5em;
    }

    .k-preise-grid .k-preis-card{
        padding: 0.75em;
    }

    div.k-preis-card .tf-button{
        font-size: 0.9rem !important;
    }

    ul.k-preis-features{
        margin-top: 0 !important;
    }

    img.k-ersttermin-foto{
        align-self: flex-start;
    }

    div.k-preise-switch{
        align-items: unset;
        flex-direction: column;
    }
}

.k-cert-note {
	display: flex;
	align-items: center;
	gap: 18px;
	background: #fff;
	border-radius: 14px;
	padding: 18px 24px;
	margin-top: 1.5rem;
    box-shadow: var(--box-shadow-card);
}

.k-cert-note svg{
    width: 4.5em;
}

section.tf-content > .wrapper .k-cert-note h3{
   margin-bottom: 0; 
}

section.tf-content > .wrapper .k-cert-note h3 + p{
   margin-top: 10px; 
}

.k-cert-note__mark {
	flex: 0 0 52px;
}


.k-cert-note__text {
	margin: 0;
	font-size: 0.875rem;
	line-height: 1.55;
	color: var(--textcolor-medium-soft);
}

@media (max-width: 600px) {
	.k-cert-note {
		flex-direction: column;
		align-items: flex-start;
		gap: 12px;
	}
}


/* ==========================================================
   LESENDE SCHULE (Schulangebot) – Relaunch Nov 2026
   Das Ziel · So funktioniert's · Danach · Preise
   ========================================================== */





/* ===== SO FUNKTIONIERT'S – neue Visuals ===== */
.k-phase-tag{ display:inline-flex; align-items:center; gap:5px; font-size:0.95rem; font-weight:600; padding:4px 10px; border-radius:6px; margin-bottom:6px; }
.k-phase-tag i{ font-size:13px; }
.k-phase-tag--live{ background:#1a3056; color:#fff; }
.k-phase-tag--kern{ background:#fff; color:#46536e; border:1px solid #d6e0ef; }
.k-phase-tag--after{ background:#e3f1e0; color:#3f6f2a; }

/* Teams im Zoom */
.k-zoom-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:5px; position:relative; }
.k-zoom-tile{ height:44px; border-radius:5px; display:flex; align-items:center; justify-content:center; border:2px solid transparent; }
.k-zoom-tile i{ font-size:20px; color:#1a3056; opacity:.55; }
.k-zoom-tile--a{ background:#FFF5E0; border-color:#ffc700; }
.k-zoom-tile--b{ background:#ebf8ff; border-color:#70a3d8; }
.k-zoom-tile--c{ background:#e3f1e0; border-color:#6ead4a; }
.k-team-legend{ display:flex; gap:4px; justify-content:center; margin-top:8px; }
.k-team-legend span{ padding:2px 5px !important; }
.k-team-legend span{ white-space:nowrap; font-size:0.75rem; font-weight:600; color:#1a3056; padding:2px 7px; border-radius:5px; }
.k-team-legend .a{ background:#FFF5E0; } .k-team-legend .b{ background:#ebf8ff; } .k-team-legend .c{ background:#e3f1e0; }

/* Auswahl 1–2 von 5 */
.k-pick{ position:relative; display:flex; flex-direction:column; align-items:center; gap:10px; }
.k-pick-row{ display:flex; gap:6px; }
.k-pick-thumb{ position:relative; width:38px; height:52px; border-radius:6px; overflow:hidden; background:#e9e4db; opacity:.35; filter:grayscale(1); }
.k-pick-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.k-pick-thumb.is-on{ opacity:1; filter:none; outline:2.5px solid #1a3056; outline-offset:1px; transform:translateY(-4px); }
.k-pick-check{ position:absolute; right:3px; top:3px; width:15px; height:15px; border-radius:50%; background:#1a3056; color:#fff; display:flex; align-items:center; justify-content:center; }
.k-pick-check i{ font-size:10px; }
.k-pick-label{ background:#1a3056; color:#fff; font-size:0.85rem; font-weight:500; padding:3px 10px; border-radius:6px; }
.k-pick--all .k-pick-thumb{ opacity:1; filter:none; }
.k-pick--all .k-pick-label{ background:#3f6f2a; }
.k-pick--all .k-pick-thumb.is-on{ outline:none; transform:none; box-shadow:0 2px 6px rgba(26,48,86,.15); }
.k-pick--all .k-pick-check{ background:#6ead4a; }

/* Brainstorm-Zettel */
.k-notes{ position:relative; width:236px; height:156px; }
.k-note{ position:absolute; width:114px; padding:10px 11px; border-radius:4px; font-size:0.85rem; line-height:1.3; font-weight:600; color:#1a3056; box-shadow:0 3px 8px rgba(26,48,86,.12); }
.k-note--1{ left:0; top:4px; background:#fff3ba; transform:rotate(-5deg); }
.k-note--2{ left:120px; top:0; background:#cddcea; transform:rotate(4deg); }
.k-note--3{ left:52px; top:78px; background:#deece1; transform:rotate(-2deg); }
.k-notes-pill{ position:absolute; right:-4px; bottom:2px; background:#1a3056; color:#fff; font-size:0.8rem; font-weight:500; padding:3px 8px; border-radius:6px; display:flex; gap:4px; align-items:center; }
.k-notes-pill i{ font-size:11px; }

/* Danach – eigener Block */
.k-after{ margin-top:2.75rem; }
.k-after-divider{ display:flex; align-items:center; gap:14px; margin-bottom:1rem; color:#7d8aa3; font-size:1rem; font-weight:600;  }
.k-after-divider::before, .k-after-divider::after{ content:""; flex:1; border-top:1.5px dashed #d3e6cc; }
.k-after-card{ display:flex; gap:20px; align-items:flex-start; background:#f3f9f1; border:0.5px solid #d3e6cc; border-radius:14px; padding:22px 24px; }
.k-after-card .k-inner{ flex:1; min-width:0; }
.k-after-card .k-h{ display:block !important; font-size:1.75rem; font-weight:600; line-height:1.25; max-width:24ch; }
.k-after-answer{ color:#3f6f2a; }
.k-after-card .k-p{ color:#46536e; }
.k-after-icon{ flex:0 0 46px; width:46px; height:46px; border-radius:12px; background:#fff; border:0.5px solid #d3e6cc; display:flex; align-items:center; justify-content:center; }
.k-after-icon i{ font-size:26px; color:#3f6f2a; }

/* Ergebnis-Box ohne Fragen */
.k-step--final .k-result{ margin-top:16px; }


/* ===== PREISE – neues Angebotsmodul ===== */
.k-offer{ display:grid; grid-template-columns:1.1fr 1fr; background:#fff; border-radius:20px; overflow:hidden; color:var(--textcolor); margin-top:1rem; }
.k-offer-left{ padding:2.5rem; }
.k-offer-right{ padding:2.5rem; background:#f4f7fb; border-left:1px solid #e3e9f2; display:flex; flex-direction:column; }
.k-offer-eyebrow{ font-size:1rem; font-weight:600;  color:#7d8aa3; margin:0 0 4px; }
.k-offer-title{ display:block !important; font-size:1.75rem; font-weight:600; line-height:1.2; margin:0 0 6px; color:#1a3056; }
.k-offer-sub{ color:#46536e; font-size:1.2rem; margin:0 0 1.5rem; }
.k-offer-features{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:18px; }
.k-offer-features li{ margin:0 !important; padding:0 !important; display:flex; gap:12px; align-items:flex-start; font-size:1.2rem; line-height:1.45; color:#1a3056; font-weight:500; }
.k-offer-features li i{ flex:0 0 28px; height:28px; border-radius:50%; background:#e3f1e0; color:#3f6f2a; display:flex; align-items:center; justify-content:center; font-size:16px; margin-top:-1px; }
.k-offer-features li small{ display:block; color:#46536e; font-weight:400; font-size:1.05rem; margin-top:2px; }

.k-offer-label{ font-size:1.2rem; font-weight:600; color:#1a3056; margin:0 0 10px; }
.k-offer-options{ display:flex; flex-direction:column; gap:8px; border:0; padding:0; margin:0 0 1.25rem; }
.k-offer-option{ display:flex; align-items:center; gap:12px; width:100%; text-align:left; cursor:pointer; background:#fff; border:1.5px solid #d6dde8; border-radius:12px; padding:12px 14px; font:inherit; color:#1a3056; transition:border-color .15s, box-shadow .15s; }
.k-offer-option:hover{ border-color:#9fb0c9; }
.k-offer-radio{ flex:0 0 20px; height:20px; border-radius:50%; border:2px solid #b9c4d6; display:flex; align-items:center; justify-content:center; box-sizing:border-box; }
.k-offer-option-text{ flex:1; font-size:1.1rem; font-weight:500; }
.k-offer-option-price{ font-size:1.1rem; font-weight:600; color:#54607a; white-space:nowrap; }
.k-offer-option.is-active{ border:2px solid #1a3056; padding:11.5px 13.5px; box-shadow:0 4px 14px -6px rgba(26,48,86,.35); }
.k-offer-option.is-active .k-offer-radio{ border-color:#1a3056; }
.k-offer-option.is-active .k-offer-radio::after{ content:""; width:10px; height:10px; border-radius:50%; background:#1a3056; }
.k-offer-option.is-active .k-offer-option-price{ color:#1a3056; }
.k-offer-option:focus-visible{ outline:3px solid #ffc700; outline-offset:2px; }

.k-offer-total{ border-top:1px solid #e3e9f2; padding-top:1.1rem; margin-top:auto; }
.k-offer-price{ display:block !important; font-size:2.75rem; font-weight:600; line-height:1; color:#1a3056; margin:0; }
.k-offer-price small{ font-size:1rem; font-weight:400; color:#7d8aa3; margin-left:4px; }
.k-offer-price-note{ font-size:1rem; color:#54607a; margin:6px 0 0; }
.k-offer-start{ display:flex; gap:8px; align-items:flex-start; font-size:1rem; color:#54607a; margin:14px 0 16px; }
.k-offer-start i{ font-size:17px; color:#1a3056; }
.k-offer-right .tf-button{ width:100%; justify-content:center; box-sizing:border-box; }

.k-offer-contact{ display:flex; gap:12px; align-items:center; margin-top:16px; }
section.tf-content > .wrapper .k-offer-contact img{ width:44px !important; height:44px !important; flex:0 0 44px; border-radius:50%; object-fit:cover; margin:0 !important; }
.k-offer-contact-text{ margin:0; font-size:1rem; line-height:1.45; color:#3a4a66; }
section.tf-content > .wrapper .k-pick-thumb img{ width:100% !important; height:100% !important; object-fit:cover; margin:0 !important; }

@media (max-width: 800px){
  .k-offer{ grid-template-columns:1fr; }
  .k-offer-left, .k-offer-right{ padding:1.5rem; }
  .k-offer-right{ border-left:0; border-top:1px solid #e3e9f2; }
  .k-offer-right .tf-button{ font-size:1.05rem !important; text-align:center; line-height:1.25; }
}

/* Schriftgrößen der Schritt-Komponente auf Seitenniveau */
#so-funktionierts .k-h{ font-size:1.4rem; line-height:1.3; }
#so-funktionierts .k-step--feature .k-h{ font-size:1.5rem; }
#so-funktionierts .k-p{ font-size:1.1rem; line-height:1.6; color:#46536e; }
#so-funktionierts .k-result-eyebrow{ font-size:0.875rem; }
#so-funktionierts .k-result-headline{ font-size:1.2rem; line-height:1.4; }
#so-funktionierts .k-result-sub{ font-size:1rem; }
#so-funktionierts .k-doc-post{ font-size:0.75rem; }
#so-funktionierts .k-zoom{ width:212px; }


/* ==========================================================
   LESENDE SCHULE – Responsive (Smartphone)
   ========================================================== */
@media (max-width: 700px){


  /* So funktioniert's – Zeitstrahl kompakter */
  #so-funktionierts .k-wrap{ margin-top:1.5rem; }
  #so-funktionierts .k-step{ gap:10px; padding-bottom:22px; }
  #so-funktionierts .k-gutter{ flex:0 0 30px; }
  #so-funktionierts .k-num{ width:30px; height:30px; font-size:15px; }
  #so-funktionierts .k-line{ left:14px; }
  #so-funktionierts .k-card,
  #so-funktionierts .k-step--feature .k-card{ padding:16px; }
  #so-funktionierts .k-inner{ gap:16px; }
  #so-funktionierts .k-txt{ flex:1 1 100%; min-width:0; }
  #so-funktionierts .k-visual{ flex:1 1 100%; justify-content:center; }
  #so-funktionierts .k-h,
  #so-funktionierts .k-step--feature .k-h{ font-size:1.25rem; }
  #so-funktionierts .k-p{ font-size:1.05rem; }
  #so-funktionierts .k-phase-tag{ font-size:0.9rem; }
  #so-funktionierts .k-result{ padding:14px 16px; gap:10px; }
  #so-funktionierts .k-result-icon{ display:none; }
  #so-funktionierts .k-result-headline{ font-size:1.1rem; }

  /* Danach */
  .k-after{ margin-top:2rem; }
  .k-after-card{ flex-direction:column; gap:12px; padding:16px; }
  .k-after-icon{ display:none; }
  .k-after-card .k-h{ font-size:1.4rem; }

  /* Preise */
  .k-offer{ border-radius:16px; }
  .k-offer-left, .k-offer-right{ padding:1.25rem; }
  .k-offer-title{ font-size:1.45rem; }
  .k-offer-sub{ font-size:1.1rem; margin-bottom:1.1rem; }
  .k-offer-features{ gap:14px; }
  .k-offer-features li{ font-size:1.1rem; }
  .k-offer-features li small{ font-size:1rem; }
  .k-offer-label{ font-size:1.1rem; }
  .k-offer-option{ padding:12px; gap:10px; }
  .k-offer-option.is-active{ padding:11.5px; }
  .k-offer-option-text, .k-offer-option-price{ font-size:1rem; }
  .k-offer-price{ font-size:2.25rem; }
  .k-offer-right .tf-button{ height:auto; padding:12px 16px; white-space:normal; line-height:1.3; }

}


/* ===== DAS ZIEL – Versprechen & Aufwand ===== */
.k-goal-points{ display:grid; grid-template-columns:repeat(3,1fr); gap:2rem; margin-top:2rem; padding-bottom:2.5rem; border-bottom:1px solid #e9e3d9; }
.k-goal-point{ display:flex; flex-direction:column; gap:14px; }
.k-goal-icon{ width:52px; height:52px; border-radius:50%; display:flex; align-items:center; justify-content:center; }
.k-goal-icon i{ font-size:26px; color:#1a3056; }
.k-goal-icon--1{ background:#ffe9a8; } .k-goal-icon--2{ background:#cfe8fb; } .k-goal-icon--3{ background:#d6ecce; }
.k-goal-point h3{ display:block !important; font-size:1.375rem !important; line-height:1.3 !important; margin:0 0 6px !important; color:#1a3056; }
.k-goal-point p{ margin:0 !important; font-size:1.1rem; line-height:1.55; color:#3a4a66; }

.k-goal-effort{ display:grid; grid-template-columns:1.1fr 1fr; gap:3rem; align-items:center; margin-top:2.5rem; }
.k-goal-effort-text h3{ display:block !important; font-size:1.75rem !important; line-height:1.3 !important; margin:0 0 12px !important; color:#1a3056; }
.k-goal-effort-text h3 .accent{ color:var(--main-color); }
.k-goal-effort-text > p{ margin:0 0 1.5rem !important; font-size:1.2rem; line-height:1.6; color:#1a3056; }
.k-goal-checks{ list-style:none; margin:0 !important; padding:0 !important; display:flex; flex-direction:column; gap:14px; }
.k-goal-checks li{ margin:0 !important; padding:0 !important; display:flex; gap:12px; align-items:flex-start; font-size:1.1rem; line-height:1.5; color:#1a3056; }
.k-goal-checks li i{ flex:0 0 26px; height:26px; border-radius:50%; background:#d6ecce; color:#2f5a1e; display:flex; align-items:center; justify-content:center; font-size:15px; margin-top:1px; }


@media (max-width: 900px){
  .k-goal-points{ grid-template-columns:1fr; gap:1.25rem; padding-bottom:2rem; }
  .k-goal-point{ flex-direction:row; align-items:flex-start; }
  .k-goal-icon{ flex:0 0 46px; width:46px; height:46px; }
  .k-goal-icon i{ font-size:23px; }
  .k-goal-effort{ grid-template-columns:1fr; gap:2rem; }
}
@media (max-width: 600px){
  .k-goal-point h3{ font-size:1.2rem !important; }
  .k-goal-point p{ font-size:1.05rem; }
  .k-goal-effort-text h3{ font-size:1.4rem !important; }
  .k-goal-effort-text > p{ font-size:1.1rem; }
}

/* Kleine Überschriften ohne Versalien (bestehende Komponenten auf dieser Seite) */
#so-funktionierts .k-result-eyebrow,
#so-funktionierts .k-meta{ text-transform:none; letter-spacing:0; }

/* Preis pro Lehrkraft & Einzellizenz-Karte */
.k-perlk{ display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin-top:12px; font-size:1.05rem; color:#1a3056; }
.k-perlk-label{ font-weight:500; }
.k-perlk s{ color:#7d8aa3; text-decoration-thickness:1.5px; }
.k-perlk strong{ font-weight:700; color:#1a3056; }
.k-offer-price-note{ margin-top:8px !important; }
.k-offer-right .k-offer-total{ margin-top:1.25rem; }
.k-single{ display:flex; align-items:center; justify-content:space-between; gap:2rem; margin-top:2.5rem; padding:1.75rem 2rem; border-radius:20px; border:1.5px solid rgba(255,255,255,.22); background:rgba(255,255,255,.05); color:#fff; }
.k-single-main{ display:flex; gap:16px; align-items:flex-start; }
.k-single-icon{ flex:0 0 48px; height:48px; border-radius:50%; background:rgba(255,255,255,.12); display:flex; align-items:center; justify-content:center; }
.k-single-icon i{ font-size:24px; color:#fff; }
.k-single-eyebrow{ font-size:1rem; font-weight:600; color:#ffc700; margin-bottom:2px; }
#preise .k-single-title{ display:block !important; font-size:1.5rem !important; line-height:1.3 !important; margin:0 0 4px !important; color:#fff; }
.k-single-text{ font-size:1.1rem; line-height:1.5; color:rgba(255,255,255,.88); }
.k-single-list{ list-style:none; margin:10px 0 0 !important; padding:0 !important; display:flex; flex-wrap:wrap; gap:6px 18px; }
.k-single-list li{ margin:0 !important; padding:0 !important; display:flex; align-items:center; gap:6px; font-size:1rem; color:rgba(255,255,255,.88); }
.k-single-list li i{ color:#ffc700; font-size:16px; }
.k-single-buy{ flex:0 0 auto; display:flex; flex-direction:column; align-items:flex-end; gap:12px; }
.k-single-price{ font-size:2rem; font-weight:700; line-height:1; color:#fff; white-space:nowrap; }
.k-single-price small{ font-size:.95rem; font-weight:400; color:rgba(255,255,255,.75); }
@media (max-width:700px){
  .k-single{ flex-direction:column; align-items:stretch; gap:1.25rem; padding:1.25rem; border-radius:16px; }
  .k-single-buy{ flex-direction:row; align-items:center; justify-content:space-between; border-top:1px solid rgba(255,255,255,.15); padding-top:1rem; }
  .k-single-price{ font-size:1.6rem; }
  .k-single-icon{ display:none; }
  .k-single-buy{ flex-wrap:wrap; gap:10px; }
  .k-single-buy .tf-button{ padding-left:18px !important; padding-right:18px !important; }
}
.k-single-buy .tf-button{ white-space:nowrap; }

/* Das Ziel – Vorteile mit Etikett (Variante 1c) */
.k-goal-facts{ background:#1a3056; border-radius:20px; padding:.5rem 2rem; color:#fff; }
.k-goal-fact{ padding:1.5rem 0; border-top:1px solid rgba(255,255,255,.14); }
.k-goal-fact:first-child{ border-top:0; }
.k-goal-fact-head{ display:flex; justify-content:space-between; align-items:flex-start; gap:14px; margin-bottom:6px; }
.k-goal-label{ flex:1; font-size:1.35rem; font-weight:600; line-height:1.3; color:#fff; }
.k-goal-chip{ flex:0 0 auto; display:inline-flex; align-items:center; gap:6px; margin-top:1px; background:#ffc700; color:#1a3056; font-weight:700; font-size:.95rem; line-height:1.2; padding:5px 11px; border-radius:999px; white-space:nowrap; }
.k-goal-chip i{ font-size:16px; }
.k-goal-desc{ font-size:1.1rem; line-height:1.6; color:rgba(255,255,255,.88); }
@media (max-width:600px){
  .k-goal-facts{ padding:.25rem 1.25rem; border-radius:16px; }
  .k-goal-fact-head{ flex-direction:column-reverse; align-items:flex-start; gap:8px; }
  .k-goal-label{ font-size:1.2rem; }
  .k-goal-desc{ font-size:1.05rem; }
}