* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}
html {
    font-size: 100%;
    font-family: 'Inter', sans-serif;
}
body {
    background-color: #101010;
}
main {
    display: flex;
    height: 100vh;
    font-size: max(1vh , 1rem);
    font-weight: 800;
}
main > div {
    margin: auto;
    padding: max(2vh , 2rem);
    display: flex;
    flex-direction: column;
    gap: max(1rem , 1vh);
    width: min(80% , 400px);
    background-color: black;
    border-radius: max(1vh , 1rem);
}
.about-me {
    margin-bottom: max(1vh , 1rem);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    gap: max(0.75vh , 0.75rem);
}
.personal-img {
    width: max(6vh , 70px);
    height: max(6vh , 70px);
    overflow: hidden;
    background: url(img/photo_2026-03-02_13-45-20.jpg) top/cover;
    box-shadow: #c5f82a 0 0 max(0.5rem , 0.5vh);
    border-radius: 50%;
    cursor: pointer;
    transition: all ease 0.3s;
}
.personal-img:hover {
    transform: scale(1.1);
}
.name {
    font-size: max(1.5vh , 1rem);
    font-weight: 800;
    color: #ffffff;
}
.address {
    margin: max(-0.3rem , -0.3vh) 0 max(0.75rem , 0.75vh) 0;
    font-size: max(1.2vh , 0.75rem);
    font-weight: 700;
    color: #c5f82a;
}
.job {
    font-size: max(0.75vh , 0.75rem);
    font-size: max(1.2vh , 0.75rem);
    font-weight: 600;
    color: #acacac;
    letter-spacing: 1.3px;
}
.contact-me {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: max(1rem , 1vh);
}
.contact-me > a {
    padding: max(0.5vh , 0.3rem) 0;
    background-color: black;
    border: #c5f82a solid 2px;
    border-radius: max(1vh , 1rem);
    font-weight: 500;
    color: white;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
}
.contact-me > a:hover {
    background-color: #141414;
    font-weight: 700;
}