.jobs-page{
    background:#faf8f6;
}

.jobs-title{
    font-size:2rem;
    margin-bottom:16px;
    color:#222;
}

.jobs-subtitle{
    margin:auto;
    font-size:1.05rem;
    line-height:1.7;
    color:#666;
}

.jobs-list{
    max-width:950px;
    margin:auto;
}

.job-card{
    background:#fff;
    border-radius:24px;
    padding:24px;
    border:1px solid #eee;
    transition:all .25s ease;
    box-shadow:0 4px 18px rgba(0,0,0,.03);
}

.job-card:hover{
    transform:translateY(-3px);
    border-color:#B84221;
    box-shadow:0 12px 35px rgba(0,0,0,.08);
}

.job-icon{
    width:68px;
    height:68px;
    border-radius:20px;
    background:#fff3ef;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:30px;
    color:#B84221;
}

.job-title{
    font-size:1.15rem;
    font-weight:700;
    color:#222;
    margin-bottom:5px;
}

.job-location{
    color:#777;
    font-size:.95rem;
}

.job-location i{
    margin-right:4px;
}

.job-salary{
    color:#B84221;
    font-size:1rem;
    font-weight:700;
    white-space:nowrap;
}

.job-description{
    margin-top:14px;
    color:#555;
    line-height:1.6;
    font-size:.97rem;
}

@media(max-width:768px){

    .jobs-page{
        padding-top:30px!important;
        padding-bottom:30px!important;
    }

    .job-card{
        padding:18px;
        border-radius:20px;
    }

    .job-icon{
        width:56px;
        height:56px;
        font-size:24px;
        border-radius:16px;
    }

    .job-title{
        font-size:1rem;
    }

    .job-description{
        font-size:.92rem;
    }

    .jobs-subtitle{
        font-size:.95rem;
    }

}


.job-wrapper{
    max-width:950px;
    margin:auto;
}

.job-back{
    color:#666;
    text-decoration:none;
    font-weight:500;
}

.job-back:hover{
    color:#B84221;
}

.job-header{
    display:flex;
    gap:24px;
    align-items:flex-start;
    background:#fff;
    border-radius:28px;
    padding:32px;
    margin-bottom:24px;
    box-shadow:0 8px 30px rgba(0,0,0,.05);
}

.job-header-icon{
    width:88px;
    height:88px;
    border-radius:24px;
    background:#fff3ef;
    color:#B84221;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:40px;
    flex-shrink:0;
}

.job-page-title{
    font-size:2rem;
    margin-bottom:10px;
}

.job-page-location{
    color:#666;
    font-size:1rem;
}

.job-page-salary{
    font-size:1.3rem;
    font-weight:800;
    color:#B84221;
    white-space:nowrap;
}

.job-info-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
    gap:18px;
    margin-bottom:32px;
}

.job-info-card{
    background:#fff;
    border-radius:22px;
    padding:24px;
    box-shadow:0 4px 20px rgba(0,0,0,.04);
}

.job-info-label{
    color:#888;
    font-size:.9rem;
    margin-bottom:6px;
}

.job-info-value{
    font-weight:700;
    color:#222;
}

.job-image img{
    width:100%;
    border-radius:28px;
    display:block;
}

.job-content{
    background:#fff;
    border-radius:28px;
    padding:36px;
    line-height:1.8;
    color:#444;
    box-shadow:0 8px 30px rgba(0,0,0,.05);
}

.job-contact-box{
    margin-top:28px;
    background:#B84221;
    border-radius:28px;
    padding:36px;
    color:#fff;
}

.job-contact-title{
    font-size:1.7rem;
    font-weight:800;
    margin-bottom:10px;
}

.job-contact-text{
    opacity:.9;
    margin-bottom:24px;
}

.job-contact-actions{
    display:flex;
    gap:14px;
    flex-wrap:wrap;
}

@media(max-width:768px){

    .job-header{
        flex-direction:row;
        gap:16px;
        padding:22px;
    }

    .job-header-icon{
        width:55px;
        height:55px;
        border-radius:18px;
        font-size:28px;
    }

    .job-page-title{
        font-size:1.5rem;
        margin-bottom:6px;
        line-height:1.2;
    }

    .job-page-location{
        font-size:.92rem;
    }

    .job-page-salary{
        width:100%;
        margin-top:14px;
        padding-top:14px;
        border-top:1px solid rgba(0,0,0,.06);
        font-size:1.1rem;
    }

}

.btn-telegram{
    background:#229ED9;
    border-color:#229ED9;
    color:#fff;
}

.btn-telegram:hover{
    background:#1b8cc2;
    border-color:#1b8cc2;
    color:#fff;
}

.btn-telegram:focus,
.btn-telegram:active{
    background:#1b8cc2!important;
    border-color:#1b8cc2!important;
    color:#fff!important;
    box-shadow:none!important;
}

.jobs-filter{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
}

.jobs-filter-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:10px 18px;
    border-radius:999px;
    background:#fff;
    border:1px solid #eee;
    color:#444;
    text-decoration:none;
    font-weight:600;
    transition:all .2s ease;
}

.jobs-filter-btn:hover{
    color:#B84221;
    border-color:#B84221;
}

.jobs-filter-btn.active{
    background:#B84221;
    border-color:#B84221;
    color:#fff;
}
