*{
    box-sizing:border-box;
}

body{
    margin:0;
    background:#f4f7fa;
    color:#263443;
    font-family:Arial,Helvetica,sans-serif;
}

.page-wrapper{
    width:min(1180px,calc(100% - 30px));
    margin:25px auto;
}

.application-header{
    display:flex;
    align-items:center;
    gap:24px;
    background:#fff;
    border:1px solid #dce5ed;
    border-radius:14px;
    padding:22px 28px;
    margin-bottom:18px;
}

.logo-area{
    flex:0 0 135px;
    text-align:center;
}

.ssbec-logo{
    max-width:125px;
    max-height:85px;
    object-fit:contain;
}

.header-content{
    flex:1;
}

.society-name{
    color:#526a7a;
    font-size:13px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.25px;
}

.header-content h1{
    color:#28188a;
    font-size:26px;
    margin:7px 0;
}

.header-content p{
    margin:0;
    color:#667586;
    font-size:13px;
    line-height:1.5;
}

.form-section{
    background:#fff;
    border:1px solid #dce5ed;
    border-radius:14px;
    padding:24px 28px;
    margin-bottom:18px;
}

.section-heading{
    display:flex;
    align-items:flex-start;
    gap:13px;
    margin-bottom:20px;
}

.section-number{
    flex:0 0 34px;
    height:34px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#28188a;
    color:#fff;
    font-weight:700;
}

.section-heading h2{
    margin:1px 0 4px;
    color:#283a4a;
    font-size:19px;
}

.section-heading p{
    margin:0;
    color:#738190;
    font-size:12px;
    line-height:1.5;
}

.form-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:18px 24px;
}

.full-width{
    grid-column:1/-1;
}

.form-group label{
    display:block;
    font-size:12px;
    font-weight:700;
    margin-bottom:7px;
    color:#435465;
}

.form-group input,
.form-group select,
.form-group textarea{
    width:100%;
    border:1px solid #cbd7e2;
    border-radius:7px;
    padding:10px 11px;
    font-size:13px;
    background:#fff;
}

.form-group input:focus,
.form-group select:focus{
    border-color:#6658c9;
    outline:none;
    box-shadow:0 0 0 3px rgba(102,88,201,.10);
}

.form-group small{
    display:block;
    margin-top:5px;
    color:#788696;
    font-size:11px;
}

.required{
    color:#c62828;
}

.notice-box{
    background:#f4f6fb;
    border-left:4px solid #28188a;
    border-radius:6px;
    padding:12px 14px;
    margin-bottom:16px;
    font-size:12px;
    line-height:1.55;
}

.contribution-table-wrap{
    width:100%;
    overflow-x:auto;
    border:1px solid #d8e2eb;
    border-radius:10px;
}

.contribution-table{
    width:100%;
    min-width:900px;
    border-collapse:collapse;
}

.contribution-table th{
    background:#526a7a;
    color:#fff;
    padding:11px 9px;
    font-size:12px;
    text-align:center;
    border-right:1px solid rgba(255,255,255,.18);
}

.contribution-table td{
    padding:11px 9px;
    border-right:1px solid #dce4eb;
    border-bottom:1px solid #dce4eb;
    vertical-align:middle;
}

.contribution-table tbody tr:last-child td{
    border-bottom:0;
}

.select-column{
    width:70px;
}

.select-cell{
    text-align:center;
}

.contribution-enable{
    width:19px;
    height:19px;
    cursor:pointer;
}

.contribution-table select,
.contribution-table input[type="number"]{
    width:100%;
    border:1px solid #cbd7e2;
    border-radius:6px;
    padding:9px 8px;
    font-size:12px;
    background:#fff;
}

.contribution-row.disabled{
    background:#f7f8fa;
}

.contribution-row.disabled select,
.contribution-row.disabled input[type="number"]{
    background:#eef1f4;
    color:#98a2ad;
}

.row-note{
    margin-top:4px;
    color:#7c8996;
    font-size:10px;
}

.money-input{
    display:flex;
    align-items:center;
    gap:6px;
}

.money-input span{
    color:#566777;
    font-size:12px;
    font-weight:700;
}

.difference-cell{
    text-align:center;
}

.difference-value{
    display:inline-block;
    min-width:80px;
    border-radius:20px;
    padding:6px 9px;
    font-size:11px;
    font-weight:700;
    background:#edf1f5;
    color:#5e6d7b;
}

.difference-value.increase{
    background:#e9f6ee;
    color:#187547;
}

.difference-value.reduce{
    background:#fff0ed;
    color:#b33a2e;
}

.choice-group{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
}

.choice-card{
    display:flex!important;
    align-items:flex-start;
    gap:9px;
    border:1px solid #d3dde6;
    border-radius:8px;
    padding:11px;
    cursor:pointer;
    margin:0!important;
}

.choice-card input{
    width:auto!important;
    margin:3px 0 0;
}

.choice-card span{
    flex:1;
}

.choice-card strong{
    display:block;
    font-size:12px;
}

.choice-card small{
    font-weight:400;
    margin-top:3px;
}

.giro-notice{
    margin-top:17px;
    padding:13px 15px;
    background:#fff8e6;
    border:1px solid #ead59a;
    border-radius:8px;
    font-size:12px;
    line-height:1.55;
}

.declaration-box{
    background:#f7f9fc;
    border:1px solid #e0e7ee;
    border-radius:9px;
    padding:17px;
    font-size:12px;
    line-height:1.65;
}

.declaration-box p{
    margin-top:0;
}

.declaration-check{
    display:flex;
    align-items:flex-start;
    gap:9px;
    cursor:pointer;
    font-weight:600;
}

.declaration-check input{
    margin-top:4px;
}

.validation-message{
    margin-top:13px;
    background:#fff0ef;
    border:1px solid #edb8b3;
    border-radius:7px;
    padding:11px 13px;
    color:#a32920;
    font-size:12px;
    font-weight:700;
}

.form-actions{
    display:flex;
    justify-content:flex-end;
    gap:11px;
    margin:22px 0 30px;
}

.btn{
    border:0;
    border-radius:8px;
    padding:11px 20px;
    font-size:13px;
    font-weight:700;
    cursor:pointer;
}

.btn-primary{
    background:#28188a;
    color:#fff;
}

.btn-secondary{
    background:#e9edf2;
    color:#435363;
}

.page-footer{
    display:flex;
    justify-content:space-between;
    width:min(1180px,calc(100% - 30px));
    margin:0 auto 25px;
    color:#7a8793;
    font-size:10px;
}

@media(max-width:700px){
    .application-header{
        flex-direction:column;
        text-align:center;
    }

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

    .full-width{
        grid-column:auto;
    }

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

    .form-actions{
        flex-direction:column;
    }

    .btn{
        width:100%;
    }

    .page-footer{
        flex-direction:column;
        gap:5px;
        text-align:center;
    }
}