@charset "utf-8";

/* ALLGEMEIN */

.section-padding { padding-top: 6rem; padding-bottom: 6rem; }
.section-heading { max-width: 780px; }

@media (max-width: 991.98px) {
  .py-lg-7 { padding-top: 4rem; padding-bottom: 4rem; }
  .section-padding { padding-top: 4.5rem; padding-bottom: 4.5rem; }
}


@media (max-width: 575.98px) {
  .section-padding { padding-top: 3.5rem; padding-bottom: 3.5rem; }
  .planner-card { padding: 1rem; }
  .planner-schedule { padding: .7rem; }
  .planner-cell { min-height: 1.45rem; }
  .planner-avatars { gap: .25rem; padding-top: 1.55rem; }
  .avatar { width: 1.45rem; height: 1.45rem; font-size: .55rem; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}


/* HERO */

.hero-section { background: var(--sm-soft-blue); }

.hero-media{
    display:flex;
}

.hero-image{
    display:block;

    width:100%;
    height:100%;

    object-fit:cover;
    object-position:center;

    max-width:none;
}


/* TRUST */

.trust-section, .cta-section, .site-footer { background: var(--sm-navy); }
.trust-value, .trust-label { display: block; }
.trust-value { margin-bottom: .2rem; font-family: "JetBrains Mono", monospace; font-size: clamp(1.8rem, 4vw, 2.5rem); }
.trust-value-text { font-size: clamp(1.45rem, 3vw, 2rem); }
.trust-label { color: rgb(255 255 255 / 62%); font-size: .85rem; }


/* TIMELINE */

.timeline { position: relative; }
.timeline::before { position: absolute; top: 1.5rem; bottom: 1.5rem; left: 1.6rem; width: 1px; background: rgb(3 19 46 / 14%); content: ""; }
.timeline-item { position: relative; display: flex; gap: 1.25rem; padding: 1rem 0; }
.timeline-icon, .industry-icon { z-index: 1; display: grid; place-items: center; flex: 0 0 auto; width: 3.2rem; height: 3.2rem; color: #fff; font-family: "Sora", sans-serif; font-size: .8rem; font-weight: 700; border: .35rem solid #fff; border-radius: 50%; }
.timeline-item h3 { margin: .25rem 0 .35rem; }
.timeline-item p { margin: 0; color: var(--sm-text); }
.icon-blue { background: var(--sm-primary); }.icon-navy { background: #163262; }.icon-green { background: var(--sm-success); }.icon-orange { background: var(--sm-warning); }

/* FEATURES */

.product-shot { overflow: hidden; border: 1px solid var(--sm-border); border-radius: 1rem; box-shadow: 0 16px 40px rgb(3 19 46 / 10%); }
.feature-list { max-width: 1000px; margin-inline: auto; }
.feature-row { display: flex; gap: 1rem; min-height: 100%; padding: 1.4rem 1rem; border-bottom: 1px solid var(--sm-border); }
.feature-row > span { color: var(--sm-primary); font-size: 1.4rem; }
.feature-row h3 { margin: 0 0 .25rem; font-size: 1rem; }
.feature-row p { margin: 0; color: var(--sm-text); font-size: .87rem; }
.feature-link { padding: 1.4rem 1rem; font-weight: 600; text-decoration: none; }


/* TESTIMONIALS*/

.testimonial-section { background: rgb(78 117 188 / 6%); }
.testimonial { margin: 0; }
.testimonial blockquote { min-height: 5rem; color: var(--sm-navy); font-size: 1.05rem; }
.testimonial figcaption { display: grid; justify-items: center; gap: .3rem; }
.testimonial small { color: var(--sm-text); }
.site-footer { border-top: 1px solid rgb(255 255 255 / 8%); }
.site-footer a { color: #fff; text-decoration: none; }


/* ACCORDION */

.faq-container{
    max-width:1200px;

    margin-inline:auto;
}


/* ---------- Accordion ---------- */

.faq .accordion{
    display:flex;
    flex-direction:column;

    gap:1rem;

    --bs-accordion-border-width:0;
    --bs-accordion-border-radius:0;
    --bs-accordion-inner-border-radius:0;
}


/* ---------- Item ---------- */

.faq .accordion-item{
    overflow:hidden;

    border:0;
    border-radius:1rem;

    background:var(--sm-surface);
}


/* ---------- Button ---------- */

.faq .accordion-button{
    
    color:var(--sm-navy);

    background:var(--sm-surface);

    box-shadow:none;

    font-family:"Sora", sans-serif;
    font-size:1.1rem;
    font-weight:600;

    line-height:1.4;
}


/* geöffnet */

.faq .accordion-button:not(.collapsed){
    color:var(--sm-navy);

    background:var(--sm-surface);

    box-shadow:none;
}


/* Focus */

.faq .accordion-button:focus{
    border-color:transparent;

    box-shadow:none;
}


/* ---------- Bootstrap arrow entfernen ---------- */

.faq .accordion-button::after{
    width:auto;
    height:auto;

    margin-left:auto;

    background:none;

    content:"+";

    color:var(--sm-primary);

    font-family:"IBM Plex Sans", sans-serif;
    font-size:1.6rem;
    font-weight:600;

    line-height:1;

    transform:none;

    transition:transform .2s ease;
}


/* geöffnet */

.faq .accordion-button:not(.collapsed)::after{
    transform:rotate(45deg);
}


/* ---------- Body ---------- */

.faq .accordion-body{
    

    color:var(--sm-text);

    font-size:1rem;
    line-height:1.7;
}


/* ==========================================================
   Tablet
========================================================== */

@media (max-width:991.98px){

    .faq .accordion-button{
        min-height:5.5rem;

        padding:1.5rem 1.75rem;

        font-size:1.05rem;
    }

    .faq .accordion-body{
        padding:0 1.75rem 1.75rem;
    }

}


/* ==========================================================
   Mobile
========================================================== */

@media (max-width:575.98px){

    .faq .accordion{
        gap:.75rem;
    }

    .faq .accordion-item{
        border-radius:.75rem;
    }

    .faq .accordion-button{
        min-height:auto;

        padding:1.25rem 1.25rem;

        font-size:.95rem;
    }

    .faq .accordion-button::after{
        margin-left:1rem;

        font-size:1.4rem;
    }

    .faq .accordion-body{
        padding:0 1.25rem 1.5rem;

        font-size:.95rem;
        line-height:1.6;
    }

}



/* ==========================================================
   Planning Benefits
========================================================== */



.planning-benefits-header{
    max-width:900px;

    margin-bottom:4.5rem;
}



.planning-benefits-header p{
    color:var(--sm-text);

 
    line-height:1.6;
}


/* ---------- Content ---------- */

.planning-benefits-content{
    max-width:1200px;

    margin-inline:auto;
}


/* ---------- List ---------- */

.planning-list{
    display:flex;
    flex-direction:column;
    gap:1.25rem;

    padding:0;
    margin:0;

    list-style:none;
}

.planning-list li{
    display:flex;
    align-items:flex-start;
    gap:1rem;

    color:var(--sm-text);

    font-size:1.05rem;
    line-height:1.5;
}

.planning-list svg{
    flex:0 0 auto;

    width:1.1rem;
    height:1.1rem;

    margin-top:.3rem;

    stroke-width:2.5;
}


/* ---------- Colors ---------- */

.planning-list-green svg{
    color:var(--sm-success);
}

.planning-list-primary svg{
    color:var(--sm-primary);
}


/* ---------- Benefits heading ---------- */

.planning-benefits-title{
    margin-bottom:1.25rem;

    color:var(--sm-navy);

    font-size:1.15rem;
    font-weight:700;
}


/* ==========================================================
   Tablet
========================================================== */

@media (max-width:991.98px){

    .planning-benefits-header{
        margin-bottom:3rem;
    }

}


/* ==========================================================
   Mobile
========================================================== */

@media (max-width:575.98px){

    .planning-benefits-header p{
        font-size:1rem;
    }

    .planning-list{
        gap:1rem;
    }

    .planning-list li{
        font-size:1rem;
    }

}