body{
    margin:0;
    font-family: 'Segoe UI', Arial, sans-serif;
    background:#f3f4f6;
    color:#333;
}

/* container */
.container{
    display:flex;
    max-width:1100px;
    margin:50px auto;
    background:#fff;
    border-radius:10px;
    overflow:hidden;
    box-shadow:0 10px 25px rgba(0,0,0,0.08);
}

/* sidebar */
.sidebar{
    width:35%;
    background:#4b2e2e;
    color:white;
    padding:35px 28px;
}

/* profile */
.profile{
    text-align:center;
    margin-bottom:30px;
}

.profile img{
    width:120px;
    height:120px;
    object-fit:cover;
    border-radius:50%;
    border:4px solid rgba(255,255,255,0.3);
    margin-bottom:15px;
}

.profile h1{
    font-size:22px;
    margin-bottom:5px;
    letter-spacing:1px;
}

.position{
    font-size:14px;
    opacity:0.85;
}

/* sidebar titles */
.sidebar h2{
    font-size:16px;
    margin-top:25px;
    border-bottom:1px solid rgba(255,255,255,0.4);
    padding-bottom:6px;
}

/* list */
.sidebar ul{
    padding-left:18px;
}

.sidebar li{
    margin-bottom:7px;
    font-size:14px;
}

/* main content */
.main{
    width:65%;
    padding:40px;
}

/* section spacing */
.main section{
    margin-bottom:35px;
}

/* titles */
.main h2{
    font-size:20px;
    color:#4b2e2e;
    border-bottom:2px solid #4b2e2e;
    padding-bottom:6px;
    margin-bottom:15px;
}

/* project title */
.main h3{
    margin-top:15px;
    margin-bottom:5px;
    color:#333;
}

/* text */
.main p{
    font-size:15px;
    line-height:1.6;
}

.main ul{
    padding-left:18px;
}

.main li{
    margin-bottom:6px;
    font-size:14px;
}

/* hover nhẹ */
li:hover{
    transform:translateX(3px);
    transition:0.2s;
}

/* responsive */
@media (max-width:768px){

.container{
    flex-direction:column;
}

.sidebar{
    width:100%;
}

.main{
    width:100%;
}

}