.work{

    width:min(1500px,90vw);

    margin:140px auto 0;

}

.work-menu{

    display:flex;

    justify-content:center;

    gap:70px;

    margin-bottom:50px;

}

.work-menu button{

    background:none;

    border:none;

    font:inherit;

    font-size:18px;

    letter-spacing:2px;

    cursor:pointer;

    padding-bottom:8px;

    position:relative;

}

.work-menu button::after{

    content:"";

    position:absolute;

    left:0;

    bottom:0;

    width:100%;

    height:1px;

    background:#111;

    transform:scaleX(0);

    transform-origin:left;

    transition:transform .25s;

}

.work-menu button:hover::after{

    transform:scaleX(1);

}

.work-menu button.active::after{

    transform:scaleX(1);

}

.work-layout{

    display:grid;

    grid-template-columns:2fr 1fr;

    gap:50px;

}

.work-image img{

    width:100%;

    height:65vh;

    object-fit:cover;

}

.work-info h2{

    font-size:45px;

    font-weight:300;

    line-height:1.05;

    margin-bottom:25px;

}

.work-info p{
   line-height:1.6;
      margin-bottom:10px;

}

.work-info ul{

    margin-top:0;

    margin-bottom:18px;

    padding-left:22px;

    line-height:1.7;

}
/* ==========================================
   MOBIL - JAK PRACUJI
========================================== */

@media (max-width:900px){

    .work{

        width:92%;
        margin:105px auto 40px;

    }


    /* ---------- PODMENU ---------- */

   .work-menu{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    column-gap:20px;

    row-gap:22px;

    width:100%;

    margin-bottom:32px;

    align-items:start;

}

    .work-menu button{

    display:block;

    width:100%;

    min-width:0;

    background:none;

    border:none;

    color:#111;

    font-size:13px;

    line-height:1.3;

    letter-spacing:.8px;

    text-align:center;

    white-space:normal;

    padding:0 8px 7px;

}


    /* ---------- OBSAH ---------- */

    .work-layout{

        display:block;

        width:100%;

    }


    /* ---------- OBRÁZEK ---------- */

    .work-image{

        display:block;

        width:100%;

        margin:0 0 24px;

    }

    .work-image img{

        display:block;

        width:100%;

        height:auto;

        max-width:100%;

        max-height:none;

        object-fit:contain;

        object-position:center;

        border-radius:4px;

    }


    /* ---------- TEXT ---------- */

    .work-info{

        display:block;

        width:100%;

        margin:0;

    }

    .work-info h2{

        font-size:30px;

        line-height:1.15;

        font-weight:300;

        margin-bottom:18px;

    }

    .work-info p{

        font-size:16px;

        line-height:1.55;

        margin-bottom:14px;

    }

    .work-info ul{

        font-size:16px;

        line-height:1.55;

        padding-left:22px;

        margin-bottom:20px;

    }

    #work-extra{

        font-size:16px;

        line-height:1.55;

    }

}