.App{height:100vh;width:100%;font-family:Roboto,sans-serif}.active{background-color:#c6e2e9}nav{display:flex;background-color:#fff;justify-content:center;align-items:center;color:#000;position:sticky;top:0;font-size:1.5rem;z-index:999}nav ul{position:relative;display:flex;align-items:center;justify-content:space-between}nav ul li{list-style:none}nav ul li a{display:block;text-decoration:none;color:#000;padding:1rem;margin:0 1rem;border-radius:2rem;transition:transform .5s ease}nav ul li a:hover{transform:scale(1.2)}nav .menu{display:none;position:absolute;top:.75rem;right:.1rem;flex-direction:column;justify-content:space-between;width:2.25rem;height:2rem}nav .menu span{height:.4rem;width:100%;background-color:#000;border-radius:.2rem}@media (max-width: 600px){nav .menu{display:flex;z-index:1}nav{flex-direction:column;align-items:flex-start}nav ul{display:none;flex-direction:column;width:80%;margin-bottom:.25rem}nav ul.open{display:flex}nav ul li{width:100%;text-align:center}nav ul li a{margin:.2rem .5rem}}@keyframes slideInFromTop{0%{transform:translateY(-100%);opacity:0}to{transform:translateY(0);opacity:1}}.card{width:40em;margin:1.5rem;border:1px solid #ccc;border-radius:5px;box-shadow:2px 2px 2px #ccc;padding:2rem;background-color:#fff;color:#000;font-size:1rem;font-weight:300;line-height:1.5;letter-spacing:.00938em;display:flex;animation:1s ease-out 0s 1 slideInFromLeft}.card-info-item{margin:1rem}.card-image{width:250px;height:250px;margin-right:1rem;border-radius:50%;align-items:center;justify-content:center}.card-icons{display:flex;margin:1rem}.card-icons a{padding:.5rem;margin:.1rem;border-radius:50%;display:flex;justify-content:center;align-items:center;width:40px;height:40px;color:#000}.card-icons a:hover{background-color:#000;color:#fff}#github-icon{background-color:#fd8a8a;border:.1em solid #FD8A8A;color:#fff}#github-icon:hover{background-color:#fff;color:#fd8a8a}#linkedin-icon{background-color:#9ea1d4;border:.1em solid #9EA1D4;color:#fff}#linkedin-icon:hover{background-color:#fff;color:#9ea1d4}#cv-icon{background-color:#b6cfb6;border:.1em solid #b6cfb6;color:#fff}#cv-icon:hover{background-color:#fff;color:#b6cfb6}@media (max-width: 600px){.card{flex-direction:column;max-width:90vw}}.home{display:flex;justify-content:center;align-items:center;height:50vh}@media (max-width: 600px){.home{height:100%}}@keyframes slideInFromRight{0%{transform:translate(50%);opacity:0}to{transform:translate(0);opacity:1}}.skillSection{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:20px;animation:2s ease-out 0s 1 slideInFromRight}.skill-logos{display:flex;justify-content:center;align-items:center;gap:20px;flex-wrap:wrap}@media (max-width: 600px){.skill-logos img{width:90px;height:auto}}.timeline-container{font-family:Roboto,sans-serif;max-width:500px;margin:0 auto;border-left:4px solid #222;padding-left:25px;background:#fff;animation:1s ease-out 0s 1 slideInFromLeft}.timeline-container h2{font-size:32px;margin:0;color:#00272b;border-bottom:1px solid #eee}.timeline-container .event{box-shadow:0 3px 6px -2px #0003;padding:32px;margin:48px 0;line-height:2;position:relative;transition:all .5s}.timeline-container .event:before{content:"";width:14px;height:14px;border:2px solid #000;position:absolute;left:-36px;border-radius:50%;top:50%;transform:translateY(-50%);background:#fff;transition:all .5s}.timeline-container .event:hover{box-shadow:1px 6px 16px -1px #0000001a}.timeline-container .event:hover:before{background:#ffcaaf}.timeline-container .event .event-date{position:absolute;left:-200px;top:50%;transform:translateY(-50%);font-weight:700;text-align:right}@media (max-width: 850px){.timeline-container{max-width:100%;margin-left:8px}.timeline-container .event .event-date{position:static;margin-bottom:-20px}}@keyframes slideInFromLeft{0%{transform:translate(-50%);opacity:0}to{transform:translate(0);opacity:1}}.moreAboutMe{margin:50px;text-align:center;font-size:20px;font-weight:600;color:#000;animation:1.5s ease-out 0s 1 slideInFromLeft}.moreAboutMe p{font-size:1em;font-weight:400;color:#000;line-height:1.5;background-color:#fff;width:90%;max-width:1500px;margin:auto}.moreAboutMe img{width:200px;height:200px;border-radius:50%}.card-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(325px,1fr));gap:30px;max-width:1200px;margin:0 auto;padding:2rem;box-sizing:border-box;justify-content:center}.project-card3{border-radius:1rem;overflow:hidden;border:1px solid var(--border-color, #ddd);background-color:var(--background-color, #fff);box-shadow:0 1px 2px #0000000d;transition:box-shadow .3s ease;max-width:400px;margin:20px;width:100%}.project-card3:hover{box-shadow:0 4px 12px #00000026}.project-card3__image-container{height:400px;overflow:hidden}.project-card3__image{width:100%;object-fit:cover;transition:transform .5s ease;object-position:top}.project-card3__image-container:hover .project-card3__image{transform:scale(1.05)}.project-card3__content{padding:1.25rem;display:flex;flex-direction:column;justify-content:space-between}.project-card3__tags{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1rem}.project-card3__tag{font-size:.75rem;font-weight:500;padding:.25rem .5rem;border-radius:9999px;background-color:var(--tag-bg, #e0e0e0);color:var(--tag-text, #555);border:1px solid var(--tag-border, #ccc)}.project-card3__title{font-size:1.125rem;font-weight:600;margin-bottom:.25rem;color:var(--text-foreground, #111)}.project-card3__description{font-size:.875rem;color:var(--text-muted, #666);margin-bottom:1rem}.project-card3__links{margin-top:auto;display:flex;gap:1rem}.project-card3__link{color:var(--text-muted, #666);transition:color .3s ease;text-decoration:none}.project-card3__link:hover{color:var(--primary-color, #3b82f6)}.contact-page{display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:1.2em;animation:1.5s ease-out 0s 1 slideInFromRight}.contact-form{display:flex;flex-direction:column;width:50%;margin:0 auto}.contact-form label{margin-bottom:10px}.contact-form input,.contact-form textarea{width:100%;padding:10px;margin-bottom:20px;border:1px solid #ccc;border-radius:4px;font-size:1.1em}.contact-form textarea{resize:vertical;height:150px}.contact-form button{padding:10px 20px;background-color:#f8a49c;color:#fff;border:none;border-radius:15px;cursor:pointer;width:104%;font-size:1.2em;font-weight:700}.contact-form button:hover{background-color:#fff;border:#f8a49c 1px solid;color:#f8a49c}#root{height:100%;width:100%;margin:0;padding:0}.body,html{background:#fff;background-image:radial-gradient(grey 1px,transparent 0);background-size:30px 30px;background-position:-19px -19px;color:#000;font-family:Roboto,sans-serif;font-size:16px;margin:0;padding:0}