:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;background-color:#1b1e23;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}main{margin:40px 50px}header{display:flex;flex-direction:row;justify-content:end;color:#f5f5f5;gap:24px;font-size:medium}header li{cursor:pointer;display:flex;align-items:center;gap:6px}header li{list-style:none}.devPhoto{width:210px;height:220px}.name_card{color:#cac7c7}h4{color:#cac7c7;margin:25px 0 5px}a{text-decoration:none;color:#f5f5f5;font-size:small}a:hover,a:visited,a:active{color:#f5f5f5}.link_wrapper{display:flex;flex-direction:row;gap:24px}.link_wrapper a{margin:3px;color:#7ee7ff}.link_wrapper li{display:flex;font-size:small}.skill-badge{background-color:#1b1e23;padding:2px 8px;border-radius:4px;box-shadow:0 4px 6px #1b1e23,0 1px 3px #00000014;transition:transform .2s,box-shadow .2s;color:#f5f5f5db;border:.5px solid rgba(245,245,245,.785)}.skill-badge:hover{transform:translateY(-2px);box-shadow:0 6px 10px #00000026,0 2px 5px #0000001a;cursor:pointer;background-color:#f5f5f5;color:#000}.overlay-transparent-to-semi{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#11131700;z-index:2;pointer-events:none;animation:transparentToSemi 3s ease-in-out forwards}@keyframes transparentToSemi{0%{background-color:#11131700;pointer-events:none}99%{background-color:#111317cc;pointer-events:none}to{background-color:#111317cc;pointer-events:auto}}.overlay-semi-to-transparent{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#111317b3;z-index:2;pointer-events:auto;animation:semiToTransparent 4s ease-in-out forwards}@keyframes semiToTransparent{0%{background-color:#111317b3;pointer-events:auto}99%{background-color:#11131700;pointer-events:none}to{background-color:#11131700;pointer-events:none;z-index:0}}.contact_form{display:flex;flex-direction:column;justify-content:center;position:fixed;top:50%;left:50%;transform:translate(-50%,-60%);width:85%;max-width:400px;padding:20px 45px;background-color:#11131770;gap:12px;opacity:0;animation:slideIn 1.2s ease-out forwards;z-index:4}@keyframes slideIn{0%{transform:translate(-50%,-80%);opacity:0}60%{transform:translate(-50%,-55%);opacity:.8}to{transform:translate(-50%,-50%);opacity:1}}.contact_form input{padding:14px;height:19px;background-color:#f5f5f5;border-radius:8px;border:none;color:#1b1e23}.contact_form input:focus{box-shadow:none;outline:2px solid #7ee7ff;color:#1b1e23;cursor:pointer}.contact_form textarea{padding:14px;background-color:#f5f5f5;border-radius:8px;color:#1b1e23;border:none}.contact_form textarea:focus{box-shadow:none;outline:2px solid #7ee7ff}.contact_form button{border-radius:8px;background-color:#7ee7ff;height:50px;color:#1b1e23;font-size:larger;cursor:pointer}.contact_form button:active{border-radius:8px;background-color:#7ee7ff;height:48px;transition:ease-in-out;color:#1b1e23;font-size:larger;cursor:pointer}.close_btn,.close_btn:hover{display:flex;justify-content:end;color:#7ee7ff;margin-bottom:15px;cursor:pointer}.error_message{color:red;display:flex;gap:12px;justify-content:center;align-items:center}.success_message{color:#03ae03;display:flex;gap:12px;justify-content:center;align-items:center;color:#f5f5f5}@media screen and (max-width: 640px){header{cursor:pointer;display:flex;align-items:center;gap:24px;justify-content:center;margin-bottom:50px}.centralize_content{text-align:center}.link_wrapper{justify-content:center}}.portfolio-modal{background:#18181b;color:#fff;border-radius:16px;box-shadow:0 8px 32px #00000040;width:85%;max-width:80%;padding:2rem 2rem 1.5rem;box-sizing:border-box;max-height:85vh;overflow-y:auto}.portfolio-modal::-webkit-scrollbar{width:8px}.portfolio-modal::-webkit-scrollbar-track{background:#1a1a1a;border-radius:4px}.portfolio-modal::-webkit-scrollbar-thumb{background:#3a3a3a;border-radius:4px;transition:background .2s}.portfolio-modal::-webkit-scrollbar-thumb:hover{background:#4a4a4a}.portfolio-modal{scrollbar-width:thin;scrollbar-color:#2d2d2d #1a1a1a}@keyframes slideOut{0%{transform:translate(-50%,-50%);opacity:1}to{transform:translate(-50%,-80%);opacity:0}}@keyframes overlayDelayedFadeOut{0%{background-color:#111317cc;pointer-events:auto}23%{background-color:#111317cc;pointer-events:auto}to{background-color:#11131700;pointer-events:none;z-index:0}}.overlay-portfolio-closing{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#111317cc;z-index:2;pointer-events:auto;animation:overlayDelayedFadeOut 5.2s ease-in-out forwards}.close-btn{position:absolute;top:1rem;right:1.2rem;background:none;border:none;font-size:2rem;color:#7ee7ff;cursor:pointer;transition:color .2s}.close-btn:hover{color:#ffb86b}.projects-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.2rem;margin-top:1.2rem}.projects-list:hover .project-card:not(:hover){opacity:.6;transform:scale(.98)}.project-card{background:#23232b;border-radius:10px;padding:1rem;box-shadow:0 2px 8px #0000001a;display:flex;flex-direction:column;gap:.5rem;transition:all .3s ease;cursor:pointer;border:1px solid transparent}.project-card:hover{transform:translateY(-4px);box-shadow:0 8px 25px #0003;background:#2a2a35;opacity:1}.project-header{display:flex;align-items:center;justify-content:space-between;gap:.5rem;flex-wrap:wrap}.project-link{color:#7ee7ff;font-weight:700;text-decoration:none;transition:color .2s}.project-link:hover{color:#ffb86b;text-decoration:underline}.project-tag{padding:.15em .6em;border-radius:999px;font-size:.75em;font-weight:600;background:#18181b;margin-left:.5em;box-shadow:0 0 0 2px #0000000d;white-space:nowrap;flex-shrink:0}.project-tech{font-size:.95em;color:#a1a1aa}.project-desc{font-size:.85em;color:#e0e0e0d5;line-height:1.4}@media (max-width: 1200px){.projects-list{grid-template-columns:repeat(3,1fr)}}@media (max-width: 900px){.portfolio-modal{width:95%;padding:1.5rem 1rem 1rem}.projects-list{grid-template-columns:repeat(2,1fr);gap:1rem}.close-btn{top:.5rem;right:.8rem;font-size:1.8rem}}@media (max-width: 600px){.portfolio-modal{width:98%;padding:1rem .75rem .75rem}.projects-list{grid-template-columns:1fr;gap:.8rem}.project-card{padding:.75rem}.project-tag{font-size:.7em;padding:.1em .5em;margin-left:.3em}.project-header{gap:.3rem}.project-desc{font-size:.8em}.close-btn{top:.5rem;right:.5rem;font-size:1.5rem}}