body {
    font-family: Arial, sans-serif;
    margin: auto;
    padding: 20px;
}

h1 {
    padding: 0;
    margin: 5px;
    margin-bottom: 30px;
}

h3,
h4,
p {
    padding-left: 10px;
    margin: 5px;
}

h2 {
    margin-left: 10px;
}

.section-heading {
    display: flex;
    align-items: center;
    font-size: 20px;
    font-weight: bold;
}

.icon {
    margin-left: -25px;
    transform: translateX(-5px);
    font-size: 22px;
}

a,
span {

    overflow-wrap: break-word;
}

.container {
    display: flex;
    /* Light border */
    border-radius: 10px;
    /* Rounded corners */
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
    /* Soft shadow */
    padding: 20px;
    /* Inner spacing */
    background: linear-gradient(135deg, #f5f7fa, #c3cfe2, #e2ebf0, #dfe9f3);
    box-sizing: border-box;

}

.left {

    display: flex;
    flex-direction: column;
    flex: 2;
    padding: 20px;
}

.right {
    padding-top: 10px;
    padding-left: 20px;
    flex: 1;
    min-width: 250px;
}

.social-links {
    list-style: none;
    /* dots remove */
    padding-left: 20px;
}

.social-links a {
    text-decoration: none;
    /* underline hat gayi */
    font-weight: bold;
    /* thoda bold text */
    color: #333;
    /* normal text color */
    transition: 0.3s;
    /* smooth hover effect */
}

.social-links a:hover {
    color: #0077b5;
    /* hover pe LinkedIn blue */
    text-decoration: underline;
    /* hover pe underline show ho */
}


.social-links a:visited {
    color: #333;
    /* visited hone ke baad bhi same color */
}


.skills p {
    margin-left: 5px;
    font-size: 16px;
}

.skill-bar {
    background: #ddd;
    border-radius: 10px;
    overflow: hidden;
    height: 6px;
    /* slim line */
    margin-left: 15px;
    width: 90%;
}

.skill-fill {
    height: 6px;
    background: #007bff;
    /* Blue line */
    width: 75%;
    /* Overall percentage */
}


ul {
    list-style-type: disc;
    /* bullet style (circle, square, disc, none) */
}

ul li {
    margin-bottom: 8px;
    /* har list item ke beech vertical space */
    line-height: 1.5;
    /* text height thoda readable banane ke liye */
}

ol li::marker {
    font-weight: bold;
    color: #000;
    /* number ka color (black) */
}

ol {
    margin: 0 0 20px 30px;
    /* top-right-bottom-left margin */
    padding: 0;
    /* default padding hatao */
    list-style-position: outside;
    /* number bahar rahe */
}

ol li {
    margin-bottom: 10px;
    /* har item ke beech space */

}



/* Mobile ke liye */
@media (max-width: 768px) {
    .container {
        flex-direction: column;
        /* ek ke niche ek */
    }

    .left,
    .right {
        flex: 1;
        width: 100%;
    }
}




#OOP {
    width: 90%;
}

#WEB-TECH {
    width: 90%;
}

#DATABSE {
    width: 80%;
}

#JAVA-TECH {
    width: 85%;
}

#FRAMEWORK {
    width: 75%;
}

#ORM {
    width: 80%;
}

#WEB-SERVICE {
    width: 85%;
}

#TOOL {
    width: 95%;
}

#WEB-APP {
    width: 75%;
}


.download-btn {
    padding: 12px 24px;
    background: #4CAF50;
    color: white;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 100px;
}

.download-btn:hover {
    background: #45a049;
    /* thoda dark shade */
    transform: scale(1.05);
    /* halka zoom effect */
}

.download-btn:active {
    background: #3e8e41;
    /* click karne pe aur dark */
    transform: scale(0.98);
    /* thoda press effect */
}


/* Resume footer */
.resume-footer {
    margin-top: 20px;
    padding-top: 12px;
    border-top: 1px solid #e6e9ef;
    /* subtle divider */
    text-align: center;
    font-size: 14px;
    color: #666;
}