*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

body{
    background:#111;
    color:white;
    font-family:Arial, Helvetica, sans-serif;
}

a{
    text-decoration:none;
}

section{
    padding:100px 0;
}

/* ========================= NAVBAR ========================= */

.navbar{
    background:#111;
}

.navbar-brand{
    font-size:20px;
    font-weight:700;
    letter-spacing:1px;
}

.nav-link{
    color:#d6d6d6 !important;
    margin:0 12px;
    transition:.3s;
}

.nav-link:hover{
    color:#ffffff !important;
}

.btn-outline-light{
    border-radius:50px;
    padding:10px 24px;
}

/* ========================= HERO SECTION ========================= */
.hero{
    display:flex; align-items:center;
}
.hero-subtitle{
    color:#b5b5b5;
    font-size:18px;
    letter-spacing:3px;
    text-transform:uppercase;
}
.hero-title{
    font-size:72px;
    font-weight:700;
    line-height:1.1;
    margin:20px 0;
}
.hero-description{
    color:#bfbfbf;
    max-width:600px;
    font-size:18px;
    line-height:1.8;
    margin-bottom:40px;
}
.hero-button
.btn{
    padding:12px 30px;
    border-radius:50px;
}

/* ========================= ABOUT ========================= */ .about{ padding:120px 0; } .about-title{ font-size:48px; font-weight:700; margin-bottom:35px; } .about-text{ color:#bfbfbf; font-size:18px; line-height:2; margin-bottom:25px; } .about-info h6{ color:#8f8f8f; letter-spacing:2px; font-size:14px; margin-bottom:12px; } .about-info p{ font-size:22px; font-weight:600; }

/* ========================= EXPERIENCE ========================= */ .experience{ padding:120px 0; } .section-title{ font-size:48px; font-weight:700; margin-bottom:60px; } .experience-item{ padding:35px 0; border-bottom:1px solid #2b2b2b; } .experience-header{ display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:20px; } .experience-header h4{ font-size:28px; margin-bottom:6px; } .experience-header h6{ color:#9d9d9d; font-weight:400; } .experience-header span{ color:#b5b5b5; } .experience-item ul{ color:#c7c7c7; line-height:2; } .experience-item li{ margin-bottom:10px; }

/* ========================= SKILLS ========================= */ .skills{ padding:120px 0; } .skill-card{ background:#1b1b1b; border:1px solid #2d2d2d; border-radius:20px; padding:35px; height:100%; transition:.3s; } .skill-card:hover{ transform:translateY(-8px); border-color:#ffffff; } .skill-card h5{ margin-bottom:25px; font-size:18px; letter-spacing:2px; } .skill-card p{ color:#bdbdbd; line-height:1.9; } .skill-list{ display:flex; flex-wrap:wrap; gap:12px; } .skill-list span{ background:#2a2a2a; padding:10px 18px; border-radius:50px; color:white; font-size:14px; }

/* ========================= EDUCATION ========================= */ .education{ padding:120px 0; } .education-card{ margin-top:50px; background:#1b1b1b; border:1px solid #2c2c2c; border-radius:20px; padding:35px; transition:.3s; } .education-card:hover{ transform:translateY(-6px); border-color:#ffffff; } .education-header{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:20px; } .education-header h3{ font-size:30px; margin-bottom:10px; } .education-header h5{ color:#b5b5b5; font-weight:400; } .education-header span{ color:#d0d0d0; font-size:18px; }

/* ========================= CONTACT ========================= */ .contact{ padding:120px 0; } .contact-text{ color:#bdbdbd; margin:30px 0; line-height:1.8; } .contact-item{ margin-bottom:30px; } .contact-item h6{ color:#8f8f8f; letter-spacing:2px; margin-bottom:8px; } .contact-item p{ font-size:18px; } .contact-form{ background:#1b1b1b; padding:40px; border-radius:20px; border:1px solid #2c2c2c; } .contact-form .form-control{ background:#111; border:1px solid #333; color:white; margin-bottom:20px; padding:16px; border-radius:12px; } .contact-form .form-control:focus{ background:#111; color:white; border-color:white; box-shadow:none; } .contact-form textarea{ resize:none; } .contact-form .btn{ border-radius:50px; padding:12px 30px; }

/* ========================= FOOTER ========================= */ .footer{ padding:40px 0; border-top:1px solid #2c2c2c; } .footer h5{ margin-bottom:10px; } .footer p{ color:#9f9f9f; margin:0; } .footer a{ color:white; margin-left:20px; transition:.3s; } .footer a:hover{ color:#9d9d9d; }

html{ scroll-behavior:smooth; }

@media (max-width:992px){ .hero{ text-align:center; } .hero-title{ font-size:52px; } .hero-description{ margin:auto; margin-top:20px; margin-bottom:40px; } }

@media (max-width:768px){ .section-title{ font-size:36px; } .about-title{ font-size:36px; } .hero-title{ font-size:42px; } .footer{ text-align:center; } .footer a{ margin:10px; display:inline-block; } }

/* Active Menu */ .nav-link.active{ color:white !important; font-weight:600; } /* Shadow Navbar */ .shadow-navbar{ box-shadow:0 10px 30px rgba(0,0,0,.3); }