*{
    box-sizing:border-box;
}

:root{
    --blue:#006fae;
    --blue-dark:#064c73;
    --green:#248657;
    --green-dark:#176642;
    --bg:#f4f7f9;
    --card:#ffffff;
    --text:#263238;
    --muted:#62727a;
    --border:#dbe4e9;
}

body{
    margin:0;
    background:var(--bg);
    color:var(--text);
    font-family:Arial,"Segoe UI",sans-serif;
    line-height:1.65;
}

a{
    color:var(--blue);
}

.hero{
    background:linear-gradient(135deg,var(--blue-dark),var(--blue));
    color:white;
    padding:58px 22px;
}

.hero-inner,
.content,
.footer-inner{
    width:min(1160px,calc(100% - 40px));
    margin:0 auto;
}

.hero h1{
    margin:0 0 15px;
    font-size:2.55rem;
    line-height:1.12;
}

.hero p{
    max-width:830px;
    margin:0;
    font-size:1.12rem;
}

.breadcrumb{
    margin-bottom:18px;
    font-size:.92rem;
}

.breadcrumb a{
    color:#fff;
}

.content{
    padding-top:38px;
    padding-bottom:70px;
}

.section{
    margin-bottom:35px;
}

.panel{
    background:var(--card);
    border:1px solid var(--border);
    border-radius:12px;
    padding:27px;
    box-shadow:0 3px 14px rgba(0,0,0,.04);
}

.grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
    gap:19px;
}

.card{
    background:var(--card);
    border:1px solid var(--border);
    border-radius:11px;
    padding:21px;
}

.card h3{
    margin-top:8px;
    color:var(--blue-dark);
}

.badge{
    display:inline-block;
    padding:5px 10px;
    margin:0 5px 6px 0;
    border-radius:999px;
    background:#e9f3f8;
    color:var(--blue-dark);
    font-size:.82rem;
    font-weight:bold;
}

.badge.green{
    background:#e9f6ef;
    color:var(--green-dark);
}

.action{
    display:inline-block;
    margin-top:8px;
    padding:10px 15px;
    border-radius:7px;
    background:var(--blue);
    color:#fff;
    text-decoration:none;
    font-weight:bold;
}

.action.disabled{
    background:#8b9aa1;
    cursor:default;
}

.path{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    align-items:center;
}

.path-step{
    background:#fff;
    border:1px solid var(--border);
    border-radius:8px;
    padding:10px 13px;
}

.arrow{
    color:var(--muted);
}

.business{
    border-left:5px solid var(--green);
    background:#f0faf5;
}

.note{
    color:var(--muted);
    font-size:.92rem;
}

footer{
    background:#263238;
    color:#fff;
}

.footer-inner{
    padding-top:25px;
    padding-bottom:25px;
}

footer a{
    color:#fff;
}

@media(max-width:650px){
    .hero h1{
        font-size:2rem;
    }

    .hero-inner,
    .content,
    .footer-inner{
        width:min(100% - 28px,1160px);
    }
}


/* ===== SEMATRAIN FI QUIZ START ===== */

.fi-learning-goals{
    margin:18px 0 0;
    padding-left:22px;
}

.fi-learning-goals li{
    margin-bottom:8px;
}

.fi-callout{
    margin:24px 0;
    padding:20px 22px;
    border-radius:9px;
    background:#eef6fb;
    border-left:5px solid #006fae;
}

.fi-callout--critical{
    background:#fff8e8;
    border-left-color:#d59a00;
}

.fi-callout--practice{
    background:#f0faf5;
    border-left-color:#248657;
}

.fi-quiz-wrap{
    margin:36px 0;
    background:#fff;
    border:1px solid #dbe4e9;
    border-radius:12px;
    overflow:hidden;
    box-shadow:0 3px 14px rgba(0,0,0,.04);
}

.fi-quiz-head{
    padding:25px 27px 20px;
    background:#f8fafb;
    border-bottom:1px solid #dbe4e9;
}

.fi-quiz-head h2{
    margin-top:5px;
}

.fi-quiz-kicker{
    display:inline-block;
    padding:5px 10px;
    border-radius:999px;
    background:#e9f6ef;
    color:#176642;
    font-size:.83rem;
    font-weight:bold;
    text-transform:uppercase;
    letter-spacing:.03em;
}

.fi-quiz-origin{
    font-size:.88rem;
    color:#62727a;
}

.fi-quiz{
    padding:0 27px 27px;
}

.fi-question{
    min-width:0;
    margin:0;
    padding:26px 0;
    border:0;
    border-bottom:1px solid #e2e8ec;
}

.fi-question:last-of-type{
    border-bottom:0;
}

.fi-question legend{
    width:100%;
    padding:0;
    font-weight:bold;
    font-size:1.04rem;
}

.fi-question__number{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:31px;
    height:31px;
    margin-right:8px;
    border-radius:50%;
    background:#064c73;
    color:#fff;
}

.fi-question__type{
    margin:9px 0 14px;
    color:#62727a;
    font-size:.88rem;
}

.fi-options{
    display:grid;
    gap:9px;
}

.fi-option{
    display:flex;
    gap:11px;
    align-items:flex-start;
    padding:12px 14px;
    background:#f8fafb;
    border:1px solid #dbe4e9;
    border-radius:8px;
    cursor:pointer;
}

.fi-option:hover{
    border-color:#006fae;
}

.fi-option input{
    margin-top:5px;
    flex:0 0 auto;
}

.fi-question.is-correct{
    background:#f5fbf7;
}

.fi-question.is-wrong{
    background:#fff9f2;
}

.fi-feedback{
    margin-top:15px;
    padding:15px 17px;
    border-radius:8px;
    background:#eef6fb;
}

.fi-question.is-correct .fi-feedback{
    background:#eaf7ef;
}

.fi-question.is-wrong .fi-feedback{
    background:#fff1df;
}

.fi-feedback__source{
    margin-top:9px;
    font-size:.88rem;
}

.fi-quiz__actions{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-top:24px;
}

.fi-button{
    border:0;
    border-radius:7px;
    padding:11px 16px;
    cursor:pointer;
    font:inherit;
    font-weight:bold;
}

.fi-button--primary{
    background:#006fae;
    color:#fff;
}

.fi-button--secondary{
    background:#e7edf0;
    color:#263238;
}

.fi-quiz__result{
    margin:20px 0 0;
    padding:16px;
    border-radius:8px;
    background:#f0faf5;
    font-weight:bold;
}

.fi-source-box{
    margin-top:32px;
    padding:20px 22px;
    border:1px solid #dbe4e9;
    border-radius:9px;
    background:#f8fafb;
}

/* ===== SEMATRAIN FI QUIZ END ===== */


/* ===== FI NO SUBMIT START ===== */

.fi-no-submit{
    margin:18px 0;
    padding:15px 17px;
    background:#eef6fb;
    border-left:5px solid #006fae;
    border-radius:8px;
}

.fi-no-submit strong{
    color:#064c73;
}

/* ===== FI NO SUBMIT END ===== */


/* ===== FI VALUE CHAIN START ===== */

.fi-value-chain{
    display:flex;
    flex-wrap:wrap;
    align-items:stretch;
    gap:10px;
    margin:22px 0;
}

.fi-value-step{
    flex:1 1 145px;
    min-width:140px;
    padding:16px;
    background:#fff;
    border:1px solid #dbe4e9;
    border-radius:9px;
}

.fi-value-step strong{
    display:block;
    margin-bottom:7px;
    color:#064c73;
}

.fi-value-step span{
    display:block;
    font-size:.92rem;
}

.fi-value-arrow{
    display:flex;
    align-items:center;
    justify-content:center;
    color:#62727a;
    font-size:1.3rem;
    font-weight:bold;
}

@media(max-width:760px){

    .fi-value-chain{
        display:grid;
        grid-template-columns:1fr;
    }

    .fi-value-arrow{
        transform:rotate(90deg);
        min-height:20px;
    }
}

/* ===== FI VALUE CHAIN END ===== */


/* ===== FI ORGCHART START ===== */

.fi-orgchart{
    margin:24px 0;
}

.fi-orgchart__top{
    width:min(320px,100%);
    margin:0 auto;
    padding:17px;
    text-align:center;
    background:#eef6fb;
    border:2px solid #006fae;
    border-radius:9px;
}

.fi-orgchart__top strong,
.fi-orgchart__box strong{
    display:block;
    margin-bottom:6px;
    color:#064c73;
}

.fi-orgchart__top span,
.fi-orgchart__box span{
    display:block;
    font-size:.91rem;
}

.fi-orgchart__line{
    text-align:center;
    padding:8px 0;
    color:#62727a;
    font-size:1.35rem;
    font-weight:bold;
}

.fi-orgchart__departments{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:15px;
}

.fi-orgchart__box{
    padding:17px;
    text-align:center;
    background:#fff;
    border:1px solid #dbe4e9;
    border-radius:9px;
}

@media(max-width:720px){

    .fi-orgchart__departments{
        grid-template-columns:1fr;
    }

}

/* ===== FI ORGCHART END ===== */


/* ===== FI LEARNING PATH START ===== */

.fi-learning-path{
    display:flex;
    flex-wrap:wrap;
    align-items:stretch;
    gap:9px;
    margin:22px 0;
}

.fi-learning-path__step{
    flex:1 1 150px;
    min-width:145px;
    padding:16px;
    background:#fff;
    border:1px solid #dbe4e9;
    border-radius:9px;
}

.fi-learning-path__step strong{
    display:block;
    margin-bottom:7px;
    color:#064c73;
}

.fi-learning-path__step span{
    display:block;
    font-size:.92rem;
}

.fi-learning-path__arrow{
    display:flex;
    align-items:center;
    justify-content:center;
    color:#62727a;
    font-size:1.25rem;
    font-weight:bold;
}

@media(max-width:760px){

    .fi-learning-path{
        display:grid;
        grid-template-columns:1fr;
    }

    .fi-learning-path__arrow{
        transform:rotate(90deg);
        min-height:20px;
    }
}

/* ===== FI LEARNING PATH END ===== */


/* ===== FI PRESENTATION PLAN START ===== */

.fi-presentation-plan{
    display:flex;
    flex-wrap:wrap;
    align-items:stretch;
    gap:9px;
    margin:22px 0;
}

.fi-presentation-plan__block{
    flex:1 1 145px;
    min-width:140px;
    padding:16px;
    background:#fff;
    border:1px solid #dbe4e9;
    border-radius:9px;
}

.fi-presentation-plan__block strong{
    display:block;
    margin-bottom:7px;
    color:#064c73;
}

.fi-presentation-plan__block span{
    display:block;
    font-size:.92rem;
}

.fi-presentation-plan__arrow{
    display:flex;
    align-items:center;
    justify-content:center;
    color:#62727a;
    font-size:1.25rem;
    font-weight:bold;
}

.fi-storyboard{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:12px;
    margin:20px 0;
}

.fi-storyboard__item{
    padding:16px;
    background:#fff;
    border:1px solid #dbe4e9;
    border-radius:9px;
}

.fi-storyboard__item strong{
    display:inline-flex;
    width:29px;
    height:29px;
    align-items:center;
    justify-content:center;
    margin-right:8px;
    border-radius:50%;
    background:#eef6fb;
    color:#064c73;
}

@media(max-width:760px){

    .fi-presentation-plan{
        display:grid;
        grid-template-columns:1fr;
    }

    .fi-presentation-plan__arrow{
        transform:rotate(90deg);
        min-height:20px;
    }

    .fi-storyboard{
        grid-template-columns:1fr;
    }
}

/* ===== FI PRESENTATION PLAN END ===== */


/* ===== FI QUALITY CYCLE START ===== */

.fi-quality-cycle{
    display:flex;
    flex-wrap:wrap;
    align-items:stretch;
    gap:9px;
    margin:22px 0;
}

.fi-quality-cycle__step{
    flex:1 1 140px;
    min-width:135px;
    padding:16px;
    background:#fff;
    border:1px solid #dbe4e9;
    border-radius:9px;
}

.fi-quality-cycle__step strong{
    display:block;
    margin-bottom:7px;
    color:#064c73;
}

.fi-quality-cycle__step span{
    display:block;
    font-size:.92rem;
}

.fi-quality-cycle__arrow{
    display:flex;
    align-items:center;
    justify-content:center;
    color:#62727a;
    font-size:1.25rem;
    font-weight:bold;
}

.fi-feedback-compare{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:14px;
    margin:20px 0;
}

.fi-feedback-compare__item{
    padding:17px;
    background:#fff;
    border:1px solid #dbe4e9;
    border-radius:9px;
}

.fi-feedback-compare__item strong{
    display:block;
    margin-bottom:8px;
    color:#064c73;
}

@media(max-width:760px){

    .fi-quality-cycle{
        display:grid;
        grid-template-columns:1fr;
    }

    .fi-quality-cycle__arrow{
        transform:rotate(90deg);
        min-height:20px;
    }

    .fi-feedback-compare{
        grid-template-columns:1fr;
    }
}

/* ===== FI QUALITY CYCLE END ===== */


/* ===== FI LF2 FLOW START ===== */

.fi-lf2-flow{
    display:flex;
    flex-wrap:wrap;
    align-items:stretch;
    gap:8px;
    margin:22px 0;
}

.fi-lf2-flow__step{
    flex:1 1 155px;
    min-width:150px;
    padding:15px;
    background:#fff;
    border:1px solid #dbe4e9;
    border-radius:9px;
}

.fi-lf2-flow__step strong{
    display:block;
    margin-bottom:7px;
    color:#064c73;
}

.fi-lf2-flow__step span{
    display:block;
    font-size:.9rem;
}

.fi-lf2-flow__arrow{
    display:flex;
    align-items:center;
    justify-content:center;
    color:#62727a;
    font-weight:bold;
}

.module-card{
    margin:0 0 14px;
    padding:17px;
    background:#fff;
    border:1px solid #dbe4e9;
    border-radius:9px;
}

.module-card__head{
    margin-bottom:8px;
}

@media(max-width:760px){

    .fi-lf2-flow{
        display:grid;
        grid-template-columns:1fr;
    }

    .fi-lf2-flow__arrow{
        transform:rotate(90deg);
        min-height:18px;
    }
}

/* ===== FI LF2 FLOW END ===== */


/* ===== FI CURRICULUM THREAD START ===== */

.fi-curriculum-thread,
.fi-curriculum-overview{
    border-left:4px solid #006fae;
}

.fi-curriculum-thread__eyebrow{
    margin:0 0 6px;
    font-size:.82rem;
    font-weight:700;
    letter-spacing:.04em;
    text-transform:uppercase;
    color:#56717f;
}

.fi-curriculum-thread__grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
    margin:18px 0;
}

.fi-curriculum-thread__grid > div{
    padding:14px;
    background:#f7fafb;
    border:1px solid #dbe4e9;
    border-radius:8px;
}

.fi-curriculum-thread__grid strong{
    display:block;
    margin-bottom:5px;
    color:#064c73;
}

.fi-curriculum-thread__details{
    margin-top:15px;
}

.fi-curriculum-thread__details summary{
    cursor:pointer;
    font-weight:600;
}

.fi-curriculum-overview__list{
    display:grid;
    gap:11px;
    margin:20px 0;
}

.fi-curriculum-overview__item{
    padding:15px 16px;
    background:#fff;
    border:1px solid #dbe4e9;
    border-radius:9px;
}

.fi-curriculum-overview__item strong{
    display:block;
    color:#064c73;
}

.fi-curriculum-overview__item span{
    display:inline-block;
    margin:5px 0 7px;
    font-size:.86rem;
    font-weight:600;
    color:#56717f;
}

@media(max-width:760px){

    .fi-curriculum-thread__grid{
        grid-template-columns:1fr;
    }
}

/* ===== FI CURRICULUM THREAD END ===== */


/* ===== FI REQUIREMENTS FLOW START ===== */

.fi-requirements-flow{
    display:flex;
    flex-wrap:wrap;
    align-items:stretch;
    gap:9px;
    margin:22px 0;
}

.fi-requirements-flow__step{
    flex:1 1 155px;
    min-width:145px;
    padding:16px;
    background:#fff;
    border:1px solid #dbe4e9;
    border-radius:9px;
}

.fi-requirements-flow__step strong{
    display:block;
    margin-bottom:7px;
    color:#064c73;
}

.fi-requirements-flow__step span{
    display:block;
    font-size:.92rem;
}

.fi-requirements-flow__arrow{
    display:flex;
    align-items:center;
    justify-content:center;
    color:#62727a;
    font-size:1.25rem;
    font-weight:bold;
}

.fi-info-status{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:14px;
    margin:20px 0;
}

.fi-info-status__item{
    padding:17px;
    background:#fff;
    border:1px solid #dbe4e9;
    border-radius:9px;
}

.fi-info-status__item strong{
    display:block;
    margin-bottom:7px;
    color:#064c73;
}

@media(max-width:760px){

    .fi-requirements-flow{
        display:grid;
        grid-template-columns:1fr;
    }

    .fi-requirements-flow__arrow{
        transform:rotate(90deg);
        min-height:20px;
    }

    .fi-info-status{
        grid-template-columns:1fr;
    }
}

/* ===== FI REQUIREMENTS FLOW END ===== */


/* ===== FI REQUIREMENT CHAIN START ===== */

.fi-requirement-chain{
    display:flex;
    flex-wrap:wrap;
    align-items:stretch;
    gap:9px;
    margin:22px 0;
}

.fi-requirement-chain__step{
    flex:1 1 175px;
    min-width:160px;
    padding:16px;
    background:#fff;
    border:1px solid #dbe4e9;
    border-radius:9px;
}

.fi-requirement-chain__step strong{
    display:block;
    margin-bottom:7px;
    color:#064c73;
}

.fi-requirement-chain__step span{
    display:block;
    font-size:.92rem;
}

.fi-requirement-chain__arrow{
    display:flex;
    align-items:center;
    justify-content:center;
    color:#62727a;
    font-size:1.25rem;
    font-weight:bold;
}

.fi-requirement-example{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:14px;
    margin:20px 0;
}

.fi-requirement-example > div,
.fi-requirement-sheet > div{
    padding:17px;
    background:#fff;
    border:1px solid #dbe4e9;
    border-radius:9px;
}

.fi-requirement-example strong,
.fi-requirement-sheet strong{
    display:block;
    margin-bottom:7px;
    color:#064c73;
}

.fi-requirement-sheet{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:12px;
    margin:20px 0;
}

.fi-requirement-sheet span{
    display:block;
    font-size:.92rem;
}

@media(max-width:900px){

    .fi-requirement-sheet{
        grid-template-columns:repeat(2,1fr);
    }
}

@media(max-width:760px){

    .fi-requirement-chain{
        display:grid;
        grid-template-columns:1fr;
    }

    .fi-requirement-chain__arrow{
        transform:rotate(90deg);
        min-height:20px;
    }

    .fi-requirement-example,
    .fi-requirement-sheet{
        grid-template-columns:1fr;
    }
}

/* ===== FI REQUIREMENT CHAIN END ===== */


/* ===== FI COMPARE GRID START ===== */

.fi-compare-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:16px;
    margin:20px 0;
}

.fi-compare-grid > div{
    padding:18px;
    background:#fff;
    border:1px solid #dbe4e9;
    border-radius:9px;
}

.fi-compare-grid h3{
    margin-top:0;
    color:#064c73;
}

@media(max-width:760px){

    .fi-compare-grid{
        grid-template-columns:1fr;
    }
}

/* ===== FI COMPARE GRID END ===== */


/* ===== FI PRODUCT COMPARISON START ===== */

.fi-comparison-flow{
    display:flex;
    flex-wrap:wrap;
    align-items:stretch;
    gap:9px;
    margin:22px 0;
}

.fi-comparison-flow__step{
    flex:1 1 175px;
    min-width:160px;
    padding:16px;
    background:#fff;
    border:1px solid #dbe4e9;
    border-radius:9px;
}

.fi-comparison-flow__step strong{
    display:block;
    margin-bottom:7px;
    color:#064c73;
}

.fi-comparison-flow__step span{
    display:block;
    font-size:.92rem;
}

.fi-comparison-flow__arrow{
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:1.25rem;
    font-weight:bold;
    color:#62727a;
}

.fi-table-wrap{
    width:100%;
    overflow-x:auto;
    margin:20px 0;
}

.fi-comparison-table{
    width:100%;
    min-width:720px;
    border-collapse:collapse;
}

.fi-comparison-table th,
.fi-comparison-table td{
    padding:12px 14px;
    text-align:left;
    vertical-align:top;
    border:1px solid #dbe4e9;
}

.fi-comparison-table th{
    font-weight:700;
}

.fi-status-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:14px;
    margin:20px 0;
}

@media(max-width:760px){

    .fi-comparison-flow{
        display:grid;
        grid-template-columns:1fr;
    }

    .fi-comparison-flow__arrow{
        transform:rotate(90deg);
        min-height:20px;
    }

    .fi-status-grid{
        grid-template-columns:1fr;
    }
}

/* ===== FI PRODUCT COMPARISON END ===== */


/* ===== FI NUTZWERTANALYSE START ===== */

.fi-nwa-flow{
    display:flex;
    flex-wrap:wrap;
    align-items:stretch;
    gap:9px;
    margin:22px 0;
}

.fi-nwa-flow__step{
    flex:1 1 150px;
    min-width:145px;
    padding:15px;
    background:#fff;
    border:1px solid #dbe4e9;
    border-radius:9px;
}

.fi-nwa-flow__step strong{
    display:block;
    margin-bottom:7px;
    color:#064c73;
}

.fi-nwa-flow__step span{
    display:block;
    font-size:.92rem;
}

.fi-nwa-flow__arrow{
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:700;
    color:#62727a;
}

.fi-formula{
    margin:18px 0;
    padding:17px;
    border:1px solid #dbe4e9;
    border-radius:9px;
    background:#fff;
    text-align:center;
    font-size:1.05rem;
    line-height:1.8;
}

.fi-score-scale{
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:10px;
    margin:20px 0;
}

.fi-score-scale > div{
    padding:14px;
    border:1px solid #dbe4e9;
    border-radius:9px;
    background:#fff;
    text-align:center;
}

.fi-score-scale strong,
.fi-score-scale span{
    display:block;
}

.fi-score-scale strong{
    margin-bottom:5px;
}

@media(max-width:850px){

    .fi-score-scale{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media(max-width:760px){

    .fi-nwa-flow{
        display:grid;
        grid-template-columns:1fr;
    }

    .fi-nwa-flow__arrow{
        transform:rotate(90deg);
        min-height:18px;
    }
}

@media(max-width:500px){

    .fi-score-scale{
        grid-template-columns:1fr;
    }
}

/* ===== FI NUTZWERTANALYSE END ===== */
