:root{
    --hng-red:#d31f26;
    --hng-red-dark:#b91319;
    --text:#151d28;
    --muted:#596574;
    --border:#d9dee5;
    --surface:#ffffff;
    --surface-soft:rgba(250,251,252,.94);
    --danger-bg:#f8d7da;
    --danger-border:#f5c2c7;
    --danger-text:#842029;
}

*{
    box-sizing:border-box;
}

html{
    min-height:100%;
    background:#eef1f4;
}

body{
    margin:0;
    min-height:100vh;
    color:var(--text);
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
    background:
        linear-gradient(rgba(255,255,255,.58),rgba(255,255,255,.58)),
        url("../images/schule.jpg") center center/cover fixed no-repeat;
}

a{
    color:inherit;
}

.site-header{
    position:relative;
    z-index:2;
    background:rgba(255,255,255,.98);
    border-bottom:4px solid var(--hng-red);
    box-shadow:0 4px 18px rgba(0,0,0,.08);
}

.site-header__inner{
    width:min(1200px,calc(100% - 38px));
    min-height:142px;
    margin:0 auto;
    padding:18px 0 24px;
    display:flex;
    align-items:center;
    gap:24px;
}

.site-header__logo{
    width:118px;
    height:118px;
    object-fit:contain;
    flex:0 0 auto;
}

.site-header__name{
    font-size:clamp(1.8rem,3.4vw,3rem);
    font-weight:800;
    line-height:1.06;
    letter-spacing:-.045em;
}

.site-header__city{
    margin-top:7px;
    color:var(--muted);
    font-size:clamp(1.05rem,2vw,1.5rem);
}

.page{
    width:min(840px,calc(100% - 30px));
    margin:62px auto 58px;
}

.page--form{
    width:min(980px,calc(100% - 30px));
}

.portal-card{
    overflow:hidden;
    border-radius:26px;
    background:rgba(255,255,255,.965);
    border:1px solid rgba(255,255,255,.88);
    box-shadow:0 24px 72px rgba(17,29,42,.23);
    backdrop-filter:blur(5px);
}

.portal-card__inner{
    padding:clamp(28px,5vw,54px);
}

.portal-title{
    margin:0;
    text-align:center;
    color:var(--hng-red);
    font-size:clamp(2rem,4.5vw,3.35rem);
    line-height:1.08;
    letter-spacing:-.035em;
}

.portal-title span{
    display:block;
    margin-top:10px;
    font-size:.7em;
}

.title-divider{
    display:grid;
    grid-template-columns:1fr auto 1fr;
    align-items:center;
    gap:20px;
    margin:28px 0 30px;
}

.title-divider span{
    height:2px;
    background:var(--hng-red);
}

.title-divider i{
    width:18px;
    height:18px;
    display:block;
    background:var(--hng-red);
    transform:rotate(45deg);
}

.welcome{
    text-align:center;
    max-width:660px;
    margin:0 auto 34px;
}

.welcome h2{
    margin:0 0 12px;
    font-size:clamp(1.55rem,3vw,2.05rem);
}

.welcome p{
    margin:8px 0;
    font-size:1.06rem;
    line-height:1.52;
}

.access-panel{
    padding:clamp(24px,4vw,34px);
    text-align:center;
    border:1px solid var(--border);
    border-radius:18px;
    background:var(--surface-soft);
}

.access-panel__icon{
    width:58px;
    height:58px;
    margin:0 auto 12px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:var(--hng-red);
    color:#fff;
}

.access-panel h2{
    margin:0 0 8px;
    font-size:1.55rem;
}

.access-panel>p{
    margin:0 0 22px;
    color:var(--muted);
    line-height:1.45;
}

.access-form{
    display:grid;
    gap:15px;
}

.access-form input{
    width:100%;
    height:56px;
    padding:0 17px;
    border:1px solid #bec6d0;
    border-radius:10px;
    background:#fff;
    color:var(--text);
    font:inherit;
    font-size:1.05rem;
    outline:none;
}

.access-form input:focus{
    border-color:var(--hng-red);
    box-shadow:0 0 0 4px rgba(211,31,38,.12);
}

.access-form button{
    width:min(300px,100%);
    min-height:54px;
    margin:2px auto 0;
    padding:0 24px;
    border:0;
    border-radius:10px;
    background:linear-gradient(180deg,#de2a31,var(--hng-red));
    color:#fff;
    font:inherit;
    font-size:1.1rem;
    font-weight:800;
    cursor:pointer;
    box-shadow:0 9px 18px rgba(211,31,38,.23);
}

.access-form button:hover{
    background:var(--hng-red-dark);
}

.notice{
    margin-top:16px;
    padding:17px 18px;
    display:flex;
    align-items:center;
    gap:15px;
    border-radius:11px;
    text-align:left;
    line-height:1.45;
}

.notice--success{
    color:#176b34;
    background:#e8f6ec;
    border:1px solid #b9ddc4;
}

.notice--error{
    color:var(--danger-text);
    background:var(--danger-bg);
    border:1px solid var(--danger-border);
}

.notice__symbol{
    width:40px;
    height:40px;
    flex:0 0 auto;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:#2f994d;
    color:#fff;
    font-size:1.45rem;
    font-weight:800;
}

.info-grid{
    margin-top:26px;
    display:grid;
    grid-template-columns:repeat(3,1fr);
    overflow:hidden;
    border:1px solid #f1b9bc;
    border-radius:17px;
    background:#fff4f4;
}

.info-item{
    min-width:0;
    padding:23px 19px 25px;
    text-align:center;
}

.info-item+.info-item{
    border-left:1px solid #efb6b9;
}

.info-item__icon{
    width:44px;
    height:44px;
    margin:0 auto 8px;
    color:var(--hng-red);
    display:grid;
    place-items:center;
}

.info-item h3{
    margin:7px 0 8px;
    font-size:1.08rem;
}

.info-item p{
    margin:0;
    line-height:1.43;
    font-size:.95rem;
}

.info-item a,
.info-item__highlight{
    color:var(--hng-red);
    font-weight:800;
    overflow-wrap:anywhere;
}

.question-icon{
    border-radius:50%;
    background:var(--hng-red);
    color:#fff;
    font-size:1.8rem;
    font-weight:900;
}

.step-header{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:32px;
    margin-bottom:32px;
    padding-bottom:28px;
    border-bottom:1px solid var(--border);
}

.step-header h1{
    margin:5px 0 10px;
    font-size:clamp(1.9rem,4vw,2.8rem);
    line-height:1.1;
}

.step-header p{
    max-width:630px;
    margin:0;
    color:var(--muted);
    line-height:1.5;
}

.step-label{
    color:var(--hng-red);
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.06em;
    font-size:.82rem;
}

.step-indicator{
    display:flex;
    align-items:center;
    flex:0 0 auto;
    padding-top:8px;
}

.step-indicator span{
    width:38px;
    height:38px;
    display:grid;
    place-items:center;
    border:2px solid #c9cfd6;
    border-radius:50%;
    background:#fff;
    color:#7b8490;
    font-weight:800;
}

.step-indicator span.active,
.step-indicator span.done{
    border-color:var(--hng-red);
    background:var(--hng-red);
    color:#fff;
}

.step-indicator i{
    width:34px;
    height:2px;
    background:#c9cfd6;
}

.step-indicator i.active-line{
    background:var(--hng-red);
}

.error-list{
    margin:0 0 24px;
}

.error-list ul{
    margin:8px 0 0 20px;
    padding:0;
}

.registration-form{
    display:grid;
    gap:24px;
}

.form-section{
    padding:26px;
    border:1px solid var(--border);
    border-radius:18px;
    background:var(--surface-soft);
}

.form-section__heading{
    display:flex;
    align-items:flex-start;
    gap:14px;
    margin-bottom:22px;
}

.form-section__heading h2{
    margin:0 0 5px;
    font-size:1.35rem;
}

.form-section__heading p{
    margin:0;
    color:var(--muted);
    line-height:1.45;
}

.section-number{
    width:36px;
    height:36px;
    display:grid;
    place-items:center;
    flex:0 0 auto;
    border-radius:50%;
    background:var(--hng-red);
    color:#fff;
    font-weight:800;
}

.form-grid{
    display:grid;
    gap:18px;
}

.form-grid--two{
    grid-template-columns:repeat(2,minmax(0,1fr));
}

.field label{
    display:block;
    margin-bottom:8px;
    font-weight:750;
}

.field input,
.field select{
    width:100%;
    height:54px;
    padding:0 15px;
    border:1px solid #bec6d0;
    border-radius:10px;
    background:#fff;
    color:var(--text);
    font:inherit;
    font-size:1rem;
    outline:none;
}

.field input:focus,
.field select:focus{
    border-color:var(--hng-red);
    box-shadow:0 0 0 4px rgba(211,31,38,.12);
}

.day-grid{
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:12px;
}

.day-card{
    position:relative;
    min-height:135px;
    padding:18px 12px 14px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    border:2px solid #d9dee5;
    border-radius:14px;
    background:#fff;
    cursor:pointer;
    transition:.15s ease;
}

.day-card:hover{
    border-color:#eda7aa;
    transform:translateY(-1px);
}

.day-card input{
    position:absolute;
    opacity:0;
    pointer-events:none;
}

.day-card__check{
    width:30px;
    height:30px;
    margin-bottom:10px;
    display:grid;
    place-items:center;
    border:2px solid #c8ced6;
    border-radius:50%;
    color:transparent;
    font-weight:900;
}

.day-card strong{
    font-size:1rem;
}

.day-card small{
    margin-top:7px;
    color:var(--muted);
    line-height:1.35;
    font-weight:400;
}

.day-card:has(input:checked){
    border-color:var(--hng-red);
    background:#fff5f5;
    box-shadow:0 0 0 3px rgba(211,31,38,.09);
}

.day-card:has(input:checked) .day-card__check{
    border-color:var(--hng-red);
    background:var(--hng-red);
    color:#fff;
}

.day-card--required small{
    color:#a9191f;
    font-weight:700;
}

.rule-box{
    margin-top:18px;
    padding:15px 17px;
    border-left:4px solid var(--hng-red);
    border-radius:8px;
    background:#fff5f5;
    line-height:1.5;
}

.form-actions{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:16px;
    margin-top:4px;
}

.button-primary,
.button-secondary{
    min-height:52px;
    padding:0 22px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:10px;
    font:inherit;
    font-weight:800;
    text-decoration:none;
    cursor:pointer;
}

.button-primary{
    border:0;
    background:linear-gradient(180deg,#de2a31,var(--hng-red));
    color:#fff;
    box-shadow:0 9px 18px rgba(211,31,38,.2);
}

.button-primary:hover{
    background:var(--hng-red-dark);
}

.button-secondary{
    border:1px solid #c3cad2;
    background:#fff;
    color:var(--text);
}

.summary-card{
    margin-bottom:22px;
    padding:22px;
    border:1px solid var(--border);
    border-radius:15px;
    background:#fafbfc;
}

.summary-card h2{
    margin:0 0 15px;
}

.summary-card dl{
    margin:0;
}

.summary-card dl div{
    display:grid;
    grid-template-columns:120px 1fr;
    gap:18px;
    padding:10px 0;
    border-top:1px solid #e4e8ec;
}

.summary-card dl div:first-child{
    border-top:0;
}

.summary-card dt{
    font-weight:800;
}

.summary-card dd{
    margin:0;
}

.site-footer{
    background:linear-gradient(180deg,#d72229,#bd141a);
    color:#fff;
}

.site-footer__inner{
    width:min(1200px,calc(100% - 36px));
    min-height:134px;
    margin:0 auto;
    padding:23px 0;
    display:grid;
    grid-template-columns:1.15fr .9fr 1fr;
    align-items:center;
    gap:30px;
}

.footer-address,
.footer-contact__row,
.footer-brand{
    display:flex;
    align-items:center;
}

.footer-address{
    gap:16px;
    line-height:1.55;
}

.footer-pin{
    width:22px;
    height:22px;
    border:6px solid #fff;
    border-radius:50% 50% 50% 0;
    transform:rotate(-45deg);
    flex:0 0 auto;
}

.footer-contact{
    display:flex;
    flex-direction:column;
    gap:14px;
}

.footer-contact__row{
    gap:13px;
}

.footer-contact a{
    color:#fff;
    font-weight:600;
}

.footer-brand{
    justify-content:flex-end;
    gap:18px;
    line-height:1.5;
    font-size:1.03rem;
}

.footer-brand img{
    width:84px;
    height:84px;
    object-fit:contain;
}

.sr-only{
    position:absolute;
    width:1px;
    height:1px;
    padding:0;
    margin:-1px;
    overflow:hidden;
    clip:rect(0,0,0,0);
    white-space:nowrap;
    border:0;
}

@media(max-width:850px){
    .day-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .day-card:last-child{
        grid-column:1 / -1;
    }
}

@media(max-width:780px){
    .site-header__inner{
        min-height:108px;
        gap:15px;
    }

    .site-header__logo{
        width:82px;
        height:82px;
    }

    .page{
        margin:35px auto;
    }

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

    .info-item+.info-item{
        border-left:0;
        border-top:1px solid #efb6b9;
    }

    .site-footer__inner{
        grid-template-columns:1fr;
        gap:17px;
        text-align:center;
    }

    .footer-address,
    .footer-contact__row,
    .footer-brand{
        justify-content:center;
    }
}

@media(max-width:680px){
    .step-header{
        flex-direction:column;
    }

    .form-grid--two{
        grid-template-columns:1fr;
    }

    .form-actions{
        flex-direction:column-reverse;
        align-items:stretch;
    }

    .button-primary,
    .button-secondary{
        width:100%;
    }
}

@media(max-width:500px){
    .site-header__inner{
        width:min(100% - 22px,1200px);
        min-height:92px;
    }

    .site-header__logo{
        width:66px;
        height:66px;
    }

    .site-header__name{
        font-size:1.33rem;
    }

    .site-header__city{
        font-size:1rem;
    }

    .page{
        width:min(100% - 16px,840px);
        margin-top:24px;
    }

    .portal-card{
        border-radius:18px;
    }

    .portal-card__inner{
        padding:25px 17px;
    }

    .portal-title{
        font-size:1.9rem;
    }

    .welcome p{
        font-size:.98rem;
    }

    .access-panel{
        padding:22px 16px;
    }
}

@media(max-width:470px){
    .day-grid{
        grid-template-columns:1fr;
    }

    .day-card:last-child{
        grid-column:auto;
    }

    .form-section{
        padding:20px 15px;
    }
}


/* ==========================================================
   VERSION 3.0 – MODERNE AG-AUSWAHL
   ========================================================== */

.page--form{
    width:min(1120px,calc(100% - 30px));
}

.student-summary--modern{
    margin:0 0 30px;
    padding:18px 22px;
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    column-gap:34px;
    row-gap:12px;
    border:1px solid #bfd8ef;
    border-radius:16px;
    background:#f5faff;
}

.student-summary__icon{
    width:46px;
    height:46px;
    display:grid;
    place-items:center;
    flex:0 0 auto;
    border-radius:50%;
    background:#176fc1;
    color:#fff;
}

.student-summary--modern strong,
.student-summary__item{
    position:relative;
    white-space:nowrap;
}

.student-summary__item{
    color:var(--muted);
    font-weight:700;
}

.student-summary--modern strong:not(:last-child)::after,
.student-summary__item:not(:last-child)::after{
    content:"";
    position:absolute;
    right:-18px;
    top:50%;
    width:4px;
    height:4px;
    border-radius:50%;
    background:#8793a1;
    transform:translateY(-50%);
}

.choice-section--modern{
    padding:30px;
    background:#fff;
    box-shadow:0 8px 24px rgba(17,29,42,.06);
}

.choice-section--modern .form-section__heading{
    margin-bottom:30px;
}

.choice-section--modern .form-grid{
    margin-bottom:24px;
}

.activity-list--modern{
    display:grid;
    grid-template-columns:1fr;
    gap:0;
    margin-top:6px;
}

.activity-card--modern{
    display:grid;
    grid-template-columns:72px minmax(0,1fr);
    gap:22px;
    padding:24px 0;
    border:0;
    border-top:1px solid #e3e7eb;
    border-radius:0;
    background:transparent;
}

.activity-card--modern:first-child{
    border-top:0;
}

.activity-card__symbol{
    width:64px;
    height:64px;
    display:grid;
    place-items:center;
    border-radius:16px;
    background:#fff3d8;
    color:#d98b00;
    font-size:1.55rem;
    font-weight:900;
}

.activity-card--modern:nth-child(2n) .activity-card__symbol{
    background:#e7f7ed;
    color:#1f8a48;
}

.activity-card--modern:nth-child(3n) .activity-card__symbol{
    background:#f0eafa;
    color:#7041b8;
}

.activity-card__body{
    min-width:0;
}

.activity-card--modern h3{
    margin:0 0 10px;
    font-size:1.3rem;
}

.activity-card--modern p{
    margin:0 0 16px;
    color:var(--text);
    font-size:1rem;
    line-height:1.58;
}

.activity-meta--modern{
    display:flex;
    flex-wrap:wrap;
    gap:10px 28px;
    color:var(--muted);
    font-size:.95rem;
}

.activity-meta--modern span{
    display:inline-block;
}

.choice-section--unesco{
    margin-top:28px;
    padding:30px;
    border-color:#d9e1e8;
    background:#fff;
    box-shadow:0 8px 24px rgba(17,29,42,.06);
}

@media(max-width:760px){
    .student-summary--modern strong::after,
    .student-summary__item::after{
        display:none;
    }

    .activity-card--modern{
        grid-template-columns:1fr;
    }

    .activity-card__symbol{
        width:54px;
        height:54px;
    }
}


/* ==========================================================
   VERSION 3.1 – MODERNE PRÜF- UND ABSENDESEITE
   ========================================================== */

.review-card{
    margin-bottom:28px;
    padding:30px;
    border:1px solid #d9dee5;
    border-radius:20px;
    background:#fff;
    box-shadow:0 8px 24px rgba(17,29,42,.06);
}

.review-card__header{
    margin-bottom:24px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
}

.review-card__heading{
    display:flex;
    align-items:center;
    gap:14px;
}

.review-card__heading h2{
    margin:0;
    font-size:clamp(1.55rem,3vw,2rem);
}

.review-card__icon{
    width:50px;
    height:50px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:#fff0f0;
    color:var(--hng-red);
    font-weight:900;
}

.review-card__icon--purple{
    background:#f1ebfb;
    color:#7041b8;
}

.review-card__edit{
    color:var(--hng-red);
    font-weight:800;
    text-decoration:none;
}

.review-card__edit:hover{
    text-decoration:underline;
}

.review-personal-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:0 34px;
}

.review-personal-item{
    min-width:0;
    padding:18px 0;
    border-top:1px solid #e3e7eb;
}

.review-personal-item:nth-child(-n+2){
    border-top:0;
}

.review-personal-item--wide{
    grid-column:1/-1;
}

.review-personal-item__label{
    display:block;
    margin-bottom:6px;
    color:var(--muted);
    font-size:.88rem;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.035em;
}

.review-personal-item strong{
    display:block;
    min-width:0;
    font-size:1.05rem;
    line-height:1.45;
    overflow-wrap:anywhere;
}

.review-choice-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:0;
}

.review-choice-card{
    position:relative;
    min-width:0;
    padding:6px 26px 8px;
    border-left:1px solid #e3e7eb;
}

.review-choice-card:first-child{
    border-left:0;
    padding-left:0;
}

.review-choice-card:last-child{
    padding-right:0;
}

.review-choice-card__day{
    display:inline-grid;
    place-items:center;
    min-width:44px;
    height:34px;
    margin-bottom:10px;
    padding:0 12px;
    border-radius:999px;
    background:var(--hng-red);
    color:#fff;
    font-weight:900;
}

.review-choice-card--wednesday .review-choice-card__day{
    background:#7041b8;
}

.review-choice-card--thursday .review-choice-card__day{
    background:#2680c9;
}

.review-choice-card h3{
    margin:0 0 16px;
    font-size:1.12rem;
}

.review-choice-card__wish{
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    gap:10px;
    align-items:start;
    margin-top:12px;
}

.review-choice-card__wish>span{
    width:30px;
    height:30px;
    display:grid;
    place-items:center;
    border:2px solid currentColor;
    border-radius:50%;
    color:var(--hng-red);
    font-weight:900;
}

.review-choice-card--thursday .review-choice-card__wish>span{
    color:#2680c9;
}

.review-choice-card__wish p{
    margin:3px 0 0;
    line-height:1.45;
}

.review-choice-card__unesco{
    line-height:1.45;
}

.review-choice-card__unesco strong{
    display:block;
    margin-bottom:6px;
    color:#7041b8;
    font-size:1.08rem;
}

.review-choice-card__unesco p{
    margin:0 0 6px;
    color:var(--muted);
}

.review-choice-card__unesco small{
    color:var(--muted);
}

.final-confirmation-form--modern{
    display:grid;
    gap:16px;
}

.confirmation-check--modern{
    padding:18px 20px;
    border:1px solid #cfd9e3;
    background:#fff;
}

.important-box{
    padding:18px 20px;
    display:grid;
    grid-template-columns:44px minmax(0,1fr);
    gap:16px;
    align-items:center;
    border:1px solid #f1b9bc;
    border-left:5px solid var(--hng-red);
    border-radius:12px;
    background:#fff5f5;
    line-height:1.5;
}

.important-box__icon{
    width:44px;
    height:44px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:var(--hng-red);
    color:#fff;
    font-size:1.25rem;
    font-weight:900;
}

.form-actions--modern{
    margin-top:2px;
}

.form-actions--modern .button-primary{
    min-width:340px;
}

@media(max-width:850px){
    .review-choice-grid{
        grid-template-columns:1fr;
    }

    .review-choice-card,
    .review-choice-card:first-child,
    .review-choice-card:last-child{
        padding:20px 0;
        border-left:0;
        border-top:1px solid #e3e7eb;
    }

    .review-choice-card:first-child{
        padding-top:0;
        border-top:0;
    }
}

@media(max-width:680px){
    .review-card{
        padding:22px 17px;
    }

    .review-card__header{
        align-items:flex-start;
    }

    .review-personal-grid{
        grid-template-columns:1fr;
    }

    .review-personal-item,
    .review-personal-item:nth-child(-n+2){
        border-top:1px solid #e3e7eb;
    }

    .review-personal-item:first-child{
        border-top:0;
    }

    .review-personal-item--wide{
        grid-column:auto;
    }

    .important-box{
        grid-template-columns:1fr;
    }

    .form-actions--modern .button-primary{
        min-width:0;
    }
}


/* ==========================================================
   VERSION 3.2 – MODERNE ABSCHLUSSSEITE MIT AG-WÜNSCHEN
   ========================================================== */

.success-hero{
    display:grid;
    grid-template-columns:90px minmax(0,1fr) minmax(280px,360px);
    gap:26px;
    align-items:center;
    margin-bottom:28px;
}

.success-hero__check{
    width:82px;
    height:82px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:linear-gradient(180deg,#35a65a,#278546);
    color:#fff;
    font-size:2.6rem;
    font-weight:900;
    box-shadow:0 14px 30px rgba(39,133,70,.22);
}

.success-hero__label{
    color:#278546;
}

.success-hero__content h1{
    margin:6px 0 10px;
    font-size:clamp(2.1rem,4vw,3.2rem);
    line-height:1.06;
    letter-spacing:-.04em;
}

.success-hero__content p{
    margin:0;
    color:var(--muted);
    font-size:1.08rem;
    line-height:1.5;
}

.success-number{
    padding:20px 22px;
    display:grid;
    gap:5px;
    border:1px solid #b9ddc4;
    border-radius:16px;
    background:#eff9f2;
}

.success-number span{
    color:#28643a;
    font-size:.92rem;
    font-weight:800;
}

.success-number strong{
    color:#176b34;
    font-size:1.45rem;
    letter-spacing:.045em;
}

.success-card{
    margin-bottom:24px;
    padding:28px;
    border:1px solid #d9dee5;
    border-radius:20px;
    background:#fff;
    box-shadow:0 8px 24px rgba(17,29,42,.06);
}

.success-card__header{
    margin-bottom:22px;
    display:flex;
    align-items:center;
    gap:14px;
}

.success-card__header h2{
    margin:0;
    font-size:clamp(1.55rem,3vw,2rem);
}

.success-card__icon{
    width:46px;
    height:46px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:#e9f7ee;
    color:#278546;
    font-weight:900;
}

.success-card__icon--red{
    background:#fff0f0;
    color:var(--hng-red);
}

.success-details-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:16px;
}

.success-detail{
    min-width:0;
    padding:18px 20px;
    border:1px solid #e1e6eb;
    border-radius:14px;
    background:#fafbfc;
}

.success-detail--wide{
    grid-column:1/-1;
}

.success-detail span{
    display:block;
    margin-bottom:6px;
    color:var(--muted);
    font-size:.86rem;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.035em;
}

.success-detail strong{
    display:block;
    min-width:0;
    line-height:1.45;
    overflow-wrap:anywhere;
}

.success-choice-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:18px;
}

.success-choice{
    min-width:0;
    padding:20px;
    border:1px solid #e0e5ea;
    border-radius:16px;
    background:#fff;
}

.success-choice--tuesday{
    border-color:#f3c1c4;
    background:#fffafa;
}

.success-choice--wednesday{
    border-color:#d9c9ef;
    background:#fcfaff;
}

.success-choice--thursday{
    border-color:#bdd9f2;
    background:#f9fcff;
}

.success-choice__day{
    display:inline-grid;
    place-items:center;
    min-width:44px;
    height:34px;
    padding:0 12px;
    border-radius:999px;
    background:var(--hng-red);
    color:#fff;
    font-weight:900;
}

.success-choice--wednesday .success-choice__day{
    background:#7041b8;
}

.success-choice--thursday .success-choice__day{
    background:#2680c9;
}

.success-choice h3{
    margin:12px 0 16px;
    font-size:1.16rem;
}

.success-choice__wish{
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    gap:10px;
    align-items:start;
    padding:12px 0;
    border-top:1px dashed #e2e6ea;
}

.success-choice__wish:first-of-type{
    border-top:0;
}

.success-choice__wish>span{
    width:30px;
    height:30px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:var(--hng-red);
    color:#fff;
    font-weight:900;
}

.success-choice--thursday .success-choice__wish>span{
    background:#2680c9;
}

.success-choice__wish small{
    display:block;
    margin-bottom:3px;
    color:var(--muted);
}

.success-choice__wish strong{
    display:block;
    overflow-wrap:anywhere;
}

.success-choice__unesco{
    line-height:1.45;
}

.success-choice__unesco strong{
    display:block;
    margin-bottom:7px;
    color:#7041b8;
    font-size:1.08rem;
}

.success-choice__unesco p{
    margin:0 0 6px;
    color:var(--muted);
}

.success-choice__unesco small{
    color:var(--muted);
}

.success-note{
    margin-bottom:24px;
    padding:18px 20px;
    display:grid;
    grid-template-columns:44px minmax(0,1fr);
    gap:16px;
    align-items:center;
    border:1px solid #f1b9bc;
    border-left:5px solid var(--hng-red);
    border-radius:12px;
    background:#fff5f5;
    line-height:1.5;
}

.success-note__icon{
    width:44px;
    height:44px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:var(--hng-red);
    color:#fff;
    font-weight:900;
}

.success-actions{
    justify-content:flex-start;
}

.success-actions .button-primary,
.success-actions .button-secondary{
    min-width:230px;
}

@media(max-width:900px){
    .success-hero{
        grid-template-columns:80px minmax(0,1fr);
    }

    .success-number{
        grid-column:1/-1;
    }

    .success-choice-grid{
        grid-template-columns:1fr;
    }
}

@media(max-width:680px){
    .success-hero{
        grid-template-columns:1fr;
        text-align:center;
    }

    .success-hero__check{
        margin:0 auto;
    }

    .success-details-grid{
        grid-template-columns:1fr;
    }

    .success-detail--wide{
        grid-column:auto;
    }

    .success-note{
        grid-template-columns:1fr;
    }

    .success-actions{
        flex-direction:column-reverse;
    }

    .success-actions .button-primary,
    .success-actions .button-secondary{
        width:100%;
        min-width:0;
    }
}


/* ==========================================================
   VERSION 3.3 – KORREKTUR KOPFZEILE AG-AUSWAHL
   ========================================================== */

.student-summary,
.student-summary--modern{
    display:none !important;
}

.student-overview{
    position:relative;
    z-index:1;
    width:100%;
    min-height:0;
    margin:0 0 32px;
    padding:20px 24px;
    display:grid;
    grid-template-columns:54px minmax(180px,1.4fr) minmax(110px,.7fr) minmax(110px,.7fr) minmax(190px,1fr);
    gap:18px 26px;
    align-items:center;
    overflow:visible;
    border:1px solid #b9d7f3;
    border-radius:16px;
    background:#f4f9ff;
    box-shadow:0 6px 18px rgba(35,91,145,.06);
}

.student-overview__icon{
    width:50px;
    height:50px;
    display:grid;
    place-items:center;
    align-self:center;
    border-radius:50%;
    background:#2378c5;
    color:#fff;
    font-size:1.2rem;
    font-weight:900;
    line-height:1;
}

.student-overview__entry{
    min-width:0;
    padding-left:22px;
    border-left:1px solid #cddfec;
}

.student-overview__entry--name{
    padding-left:0;
    border-left:0;
}

.student-overview__entry span{
    display:block;
    margin:0 0 4px;
    color:#667487;
    font-size:.78rem;
    font-weight:800;
    line-height:1.2;
    letter-spacing:.045em;
    text-transform:uppercase;
}

.student-overview__entry strong{
    display:block;
    min-width:0;
    margin:0;
    color:#182231;
    font-size:1rem;
    font-weight:800;
    line-height:1.35;
    white-space:normal;
    overflow-wrap:anywhere;
}

.student-overview + .notice,
.student-overview + form,
.student-overview ~ .registration-form{
    position:relative;
    z-index:0;
}

@media(max-width:900px){
    .student-overview{
        grid-template-columns:50px repeat(2,minmax(0,1fr));
    }

    .student-overview__entry--term{
        grid-column:2/-1;
    }

    .student-overview__entry:nth-of-type(2){
        padding-left:0;
        border-left:0;
    }
}

@media(max-width:620px){
    .student-overview{
        grid-template-columns:44px minmax(0,1fr);
        gap:14px 16px;
        padding:18px;
    }

    .student-overview__icon{
        width:44px;
        height:44px;
    }

    .student-overview__entry,
    .student-overview__entry--name,
    .student-overview__entry--term{
        grid-column:2;
        padding:10px 0 0;
        border-left:0;
        border-top:1px solid #d5e3ef;
    }

    .student-overview__entry--name{
        padding-top:0;
        border-top:0;
    }
}


/* ----------------------------------------------------------
   Version 4.0: Ganztag und AG-Teilnahme getrennt
---------------------------------------------------------- */

.participation-status{
    display:inline-flex;
    width:max-content;
    margin-top:7px;
    padding:5px 9px;
    border:1px solid;
    border-radius:999px;
    font-size:.76rem;
    font-weight:850;
}

.participation-status--mandatory{
    border-color:#ef969f;
    background:#fff0f1;
    color:#c92b39;
}

.participation-status--optional{
    border-color:#c6b0ef;
    background:#f6f1ff;
    color:#7041b8;
}


/* ----------------------------------------------------------
   Version 4.1: Zweitwunsch nur bei verbindlichem Ganztag
---------------------------------------------------------- */

.success-choice__optional-note{
    display:block;
    margin-top:12px;
    color:var(--muted);
    line-height:1.45;
}


/* ----------------------------------------------------------
   Version 4.2: großzügigere Schüler-Infokarte
---------------------------------------------------------- */

.student-summary-card,
.student-meta-card,
.choice-student-card{
    padding:26px 30px;
}

.student-summary-card__inner,
.student-meta-card__inner,
.choice-student-card__inner{
    display:grid;
    grid-template-columns:72px minmax(220px, 1.35fr) repeat(3, minmax(150px, 1fr));
    align-items:center;
    column-gap:28px;
    row-gap:14px;
}

.student-summary-card__avatar,
.student-meta-card__avatar,
.choice-student-card__avatar{
    width:58px;
    height:58px;
    flex:0 0 58px;
}

.student-summary-card__item,
.student-meta-card__item,
.choice-student-card__item{
    min-width:0;
    padding:4px 0 4px 28px;
    border-left:1px solid #cfe0ef;
}

.student-summary-card__item:first-of-type,
.student-meta-card__item:first-of-type,
.choice-student-card__item:first-of-type{
    padding-left:0;
    border-left:0;
}

.student-summary-card__label,
.student-meta-card__label,
.choice-student-card__label{
    display:block;
    margin-bottom:5px;
    font-size:.78rem;
    font-weight:800;
    letter-spacing:.055em;
    line-height:1.2;
    text-transform:uppercase;
    color:#687488;
}

.student-summary-card__value,
.student-meta-card__value,
.choice-student-card__value{
    display:block;
    font-size:1.05rem;
    font-weight:800;
    line-height:1.3;
    color:#182231;
    overflow-wrap:anywhere;
}

@media (max-width: 1100px){
    .student-summary-card__inner,
    .student-meta-card__inner,
    .choice-student-card__inner{
        grid-template-columns:64px repeat(2, minmax(0, 1fr));
        column-gap:22px;
    }

    .student-summary-card__item,
    .student-meta-card__item,
    .choice-student-card__item{
        padding-left:22px;
    }
}

@media (max-width: 760px){
    .student-summary-card,
    .student-meta-card,
    .choice-student-card{
        padding:20px;
    }

    .student-summary-card__inner,
    .student-meta-card__inner,
    .choice-student-card__inner{
        grid-template-columns:54px minmax(0, 1fr);
        column-gap:16px;
        row-gap:18px;
    }

    .student-summary-card__avatar,
    .student-meta-card__avatar,
    .choice-student-card__avatar{
        width:50px;
        height:50px;
        flex-basis:50px;
    }

    .student-summary-card__item,
    .student-meta-card__item,
    .choice-student-card__item{
        grid-column:1 / -1;
        padding:14px 0 0;
        border-left:0;
        border-top:1px solid #dbe6ef;
    }

    .student-summary-card__item:first-of-type,
    .student-meta-card__item:first-of-type,
    .choice-student-card__item:first-of-type{
        padding-top:0;
        border-top:0;
    }
}


/* ==========================================================
   VERSION 5.0 – NEUE ZWEIZEILIGE SCHÜLERKARTE
   ========================================================== */

.student-overview,
.student-summary,
.student-summary--modern{
    display:none !important;
}

.student-profile-card{
    width:100%;
    margin:0 0 34px;
    padding:30px 38px;
    border:1px solid #acd3f4;
    border-radius:20px;
    background:#f3f9ff;
    box-shadow:0 8px 24px rgba(35,91,145,.06);
}

.student-profile-card__top,
.student-profile-card__bottom{
    display:grid;
    grid-template-columns:minmax(0,1.35fr) minmax(230px,.65fr);
    align-items:center;
    column-gap:64px;
}

.student-profile-card__top{
    padding-bottom:28px;
}

.student-profile-card__bottom{
    padding-top:26px;
    border-top:1px solid #d5e5f2;
}

.student-profile-card__identity{
    min-width:0;
    display:flex;
    align-items:center;
    gap:24px;
}

.student-profile-card__avatar{
    width:68px;
    height:68px;
    flex:0 0 68px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:#2378c5;
    color:#fff;
    font-size:1.55rem;
    font-weight:900;
    line-height:1;
    box-shadow:0 5px 14px rgba(35,120,197,.18);
}

.student-profile-card__field{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:6px;
}

.student-profile-card__field span{
    color:#68768a;
    font-size:.8rem;
    font-weight:850;
    line-height:1.15;
    letter-spacing:.055em;
    text-transform:uppercase;
}

.student-profile-card__field strong{
    color:#172131;
    font-size:1.22rem;
    font-weight:850;
    line-height:1.3;
    overflow-wrap:anywhere;
}

.student-profile-card__field--name{
    flex:1 1 auto;
}

.student-profile-card__field--name strong{
    order:1;
    font-size:1.35rem;
}

.student-profile-card__field--name span{
    order:2;
}

.student-profile-card__field--class,
.student-profile-card__field--term{
    padding-left:36px;
    border-left:1px solid #c9ddec;
}

@media(max-width:900px){
    .student-profile-card{
        padding:26px 28px;
    }

    .student-profile-card__top,
    .student-profile-card__bottom{
        grid-template-columns:minmax(0,1fr) minmax(180px,.55fr);
        column-gap:34px;
    }
}

@media(max-width:650px){
    .student-profile-card{
        padding:22px;
    }

    .student-profile-card__top,
    .student-profile-card__bottom{
        grid-template-columns:1fr;
        gap:22px;
    }

    .student-profile-card__top{
        padding-bottom:22px;
    }

    .student-profile-card__bottom{
        padding-top:22px;
    }

    .student-profile-card__field--class,
    .student-profile-card__field--term{
        padding:18px 0 0;
        border-left:0;
        border-top:1px solid #d5e5f2;
    }

    .student-profile-card__avatar{
        width:56px;
        height:56px;
        flex-basis:56px;
        font-size:1.25rem;
    }

    .student-profile-card__identity{
        gap:16px;
    }
}