*{margin:0;padding:0;box-sizing:border-box}html{width:100vw;min-height:100vh;overflow-x:hidden;background:#333646}body{color:#fff;font-family:Inter,sans-serif}::selection{background:orange;color:#fff}section{padding:90px clamp(100px,(100vw - 1920px) / 2,1000px);overflow:hidden}section section{padding:0}section h2.sectionTitle{display:flex;align-items:center;gap:10px;color:#9697a0;margin-bottom:40px;font-size:20px}section h2.sectionTitle span{width:10px;height:5px;background:#9697a0}@media only screen and (max-width: 700px){section{padding:2rem}}figure.logo{width:100px;height:100px;background:orange;border-radius:0 50% 50%;position:relative}figure.logo:after{position:absolute;content:"";width:60%;height:25%;bottom:10%;left:50%;transform:translate(-50%);background:#333646;border-radius:0 0 30px 30px}figure.logo:before{z-index:1;position:absolute;content:"";width:60%;height:25%;bottom:35%;left:50%;transform:translate(-50%);background:orange;border-radius:0 0 30px 30px;transition:transform .15s ease-in-out}figure.logo:hover:before{transform:translate(-50%,50%)}.timeline-wrapper{display:grid;grid-template-columns:1fr 1fr;gap:100px;background:#252734}@media only screen and (max-width: 1300px){.timeline-wrapper{grid-template-columns:1fr}}div.socials{display:flex;gap:1.5rem}figure{display:block}figure img{display:block;width:100%;height:100%;object-fit:cover}figure img.contain{object-fit:contain}figure img.cover{object-fit:cover}p{white-space:pre-line}.language-switcher{position:absolute;top:10px;right:20px;cursor:pointer}.language-switcher img{width:30px;height:30px}section.home{display:grid;grid-template-columns:auto 1fr;gap:11rem}section.home h1.title{position:relative;font-size:120px;font-weight:700;width:max-content;margin:70px 0 40px}section.home h1.title:before{content:"";position:absolute;left:0;bottom:-5px;height:10px;width:120px;background:orange}section.home h1.title:after{content:"";display:inline-block;vertical-align:baseline;width:16px;height:16px;margin-top:5px;margin-left:5px;background:orange;border-radius:50%}section.home .socials{opacity:.5}section.home .introduction{margin-top:80px}section.home .introduction .subtitle{font-size:60px;margin-bottom:5px}section.home .introduction .subtitle .Typewriter{display:inline;white-space:pre-wrap;font-weight:700;color:orange}section.home .introduction .subtitle.nowrap,section.home .introduction .subtitle.nowrap .Typewriter{white-space:nowrap}@media only screen and (max-width: 1440px){section.home{gap:6rem}section.home h1.title{font-size:100px;margin-bottom:20px}section.home .introduction h2.subtitle{font-size:45px}section.home .socials figure{width:30px;height:30px}}@media only screen and (max-width: 1000px){section.home{gap:4rem}section.home h1.title{font-size:70px}section.home .introduction{margin-top:10px}section.home .introduction h2.subtitle{font-size:35px}}@media only screen and (max-width: 900px){section.home h1.title{font-size:50px}section.home h1.title:before{height:5px}}@media only screen and (max-width: 700px){section.home{grid-template-columns:1fr}section.home .logo{width:75px;height:75px}section.home h1.title{margin-top:20px;font-size:60px}}section.skills{background:#252734;overflow:hidden}section.skills .skills-wrapper{display:flex;gap:30px;justify-content:space-between;flex-wrap:nowrap}section.skills .skills-wrapper .skillCard{flex-shrink:0;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:20px 10px;width:180px;height:270px;border:2px solid #76767d;border-radius:30px}section.skills .skills-wrapper .skillCard:first-of-type{border-color:orange}section.skills .skills-wrapper .skillCard figure{height:100px;overflow:hidden;margin-bottom:20px}section.skills .skills-wrapper .skillCard figure img{object-fit:contain;align-self:center}section.skills .skills-wrapper .skillCard .percentage{font-size:43px;font-weight:700;color:orange}section.skills .skills-wrapper .skillCard .title{font-size:18px;font-weight:400;white-space:nowrap}@media only screen and (max-width: 800px) and (min-width: 700px){section.skills .skillCard[data-nr="2"]{display:none}}@media only screen and (max-width: 1010px) and (min-width: 700px){section.skills .skillCard[data-nr="3"]{display:none}}@media only screen and (max-width: 1220px) and (min-width: 700px){section.skills .skillCard[data-nr="4"]{display:none}}@media only screen and (max-width: 1430px) and (min-width: 700px){section.skills .skillCard[data-nr="5"]{display:none}}@media only screen and (max-width: 1440px){section.skills .skills-wrapper .skillCard{height:210px;width:160px}section.skills .skills-wrapper .skillCard figure{height:65px}section.skills .skills-wrapper .skillCard .percentage{font-size:35px}section.skills .skills-wrapper .skillCard .title{font-size:15px}}@media only screen and (max-width: 700px){section.skills .skills-wrapper{overflow-y:scroll;padding-bottom:20px}}section.projects article{display:flex;flex-direction:row;gap:2.5rem;flex-wrap:nowrap;padding:20px 100px;overflow:hidden}section.projects article:not(:last-of-type){border-bottom:1px solid #76767d}section.projects article:nth-child(2n){flex-flow:row-reverse}section.projects article figure{flex-shrink:0;max-width:500px}section.projects article figure img{object-fit:contain}section.projects article .project-info{display:flex;gap:1rem;flex-direction:column;flex-shrink:1}section.projects article .project-info h3{font-size:30px;flex-shrink:0;text-transform:uppercase}section.projects article .project-info p{flex-grow:1}section.projects article .skills{display:flex;gap:.5rem 1rem;flex-shrink:0;flex-wrap:wrap}section.projects article .skills h4{display:block;width:max-content;background:transparent;height:38px;line-height:36px;border-radius:19px;padding:0 18px;border:1px solid #ffa500;font-weight:700}section.projects article .skills h4:first-of-type{background:orange}section.projects .more{text-align:center;font-weight:700;color:orange;font-size:16px;margin-top:50px;font-style:italic}@media only screen and (max-width: 1300px){section.projects article{padding:20px 0}section.projects .project-info h3{font-size:25px!important}section.projects .project-info p{font-size:14px}section.projects figure{width:fit-content;height:200px}}@media only screen and (max-width: 1000px){section.projects article{padding:30px 0;flex-direction:column!important}}section.footer{display:flex;flex-direction:column;gap:80px;align-items:center}section.footer div.contact h3.title{font-size:30px}section.footer div.contact a{color:orange;font-weight:700;text-decoration:underline}section.footer div.logo-wrapper{display:flex;flex-direction:column;align-items:center;gap:35px}section.footer div.logo-wrapper h3{font-weight:300;text-align:center}section.footer div.logo-wrapper h3 b{font-weight:700}section.footer div.socials figure{width:30px;height:30px}section.footer div.socials figure img{object-fit:contain}.timeline .timelineRow:first-of-type .period{color:orange}.timeline .timelineRow:first-of-type .timeline-event{background:orange}.timeline .timelineRow:last-of-type .timeline-info{padding-bottom:0}.timeline .timelineRow{display:grid;grid-template-columns:120px 16px auto;gap:2rem}.timeline .timelineRow .period{text-align:right;font-size:14px;font-weight:400;color:#9697a0;text-transform:uppercase}.timeline .timelineRow figure.timeline-event{display:block;width:16px;height:16px;border-radius:50%;margin-top:2px;border:1px solid #ffa500;background:#252734;z-index:1}.timeline .timelineRow .timeline-info{display:flex;position:relative;flex-direction:column;padding-bottom:50px}.timeline .timelineRow .timeline-info:before{position:absolute;content:"";left:calc(-2rem - 8px);top:4px;width:1px;height:100%;background:#76767d}.timeline .timelineRow .timeline-info h3.title{font-size:24px;text-transform:uppercase}.timeline .timelineRow .timeline-info h4.subtitle{font-size:16px;font-weight:200;text-transform:uppercase}.timeline .timelineRow .timeline-info p.text{margin-top:5px;color:#9697a0;font-size:18px}@media only screen and (max-width: 550px){.timeline .timelineRow{gap:1rem;grid-template-columns:70px 13px auto}.timeline .timelineRow figure.timeline-event{width:13px;height:13px}.timeline .timelineRow .period{font-size:12px}.timeline .timelineRow .timeline-info:before{left:calc(-1rem - 7px)}.timeline .timelineRow .timeline-info h3.title{font-size:18px}.timeline .timelineRow .timeline-info h4.subtitle{font-size:16px}.timeline .timelineRow .timeline-info p.text{font-size:14px}}