@keyframes draw{to{stroke-dashoffset:0}}.imageContainer{width:100%;height:auto;min-height:0;box-shadow:none;background:0 0;border:0;border-radius:0;grid-area:pic;place-self:center stretch;padding:0;position:relative;overflow:visible}.imageContainer:after{content:"";pointer-events:none;mix-blend-mode:screen;background:0 0;display:none;position:absolute;inset:0}.imageContainer #profilePicture{justify-content:center;align-items:flex-end;width:100%;height:100%;display:flex}.imageContainer svg{transform-origin:top;filter:none;width:100%;height:100%;overflow:visible;transform:scale(1.14)}.imageContainer .face_svg__cls-1{opacity:1;transition:fill .3s,stroke .3s,opacity .3s;animation:4s forwards draw;fill:none!important;stroke:#111318!important;stroke-width:1.2px!important}.imageContainer.drawn .face_svg__cls-1{stroke-dashoffset:0!important;animation:none!important}.imageContainer path.face_svg__cls-1:first-of-type{animation-delay:0s}.imageContainer path.face_svg__cls-1:nth-of-type(2){animation-delay:.7s}.imageContainer path.face_svg__cls-1:nth-of-type(3){animation-delay:1.2s}@media (width<=768px){.imageContainer{z-index:1;justify-self:center;width:min(78vw,360px);height:auto;min-height:320px;position:relative}.imageContainer svg{width:118%}}@keyframes fadeInOpacity{0%{opacity:0}to{opacity:1}}.details{width:100%;max-width:320px;box-shadow:none;color:#30333c;background:0 0;border:0;border-radius:0;grid-area:details;place-self:center end;padding:0;transition:background-color .45s,border-color .45s,border-radius .45s,box-shadow .45s,color .45s}.details #personalDetailsDiv{text-align:right;flex-direction:column;gap:2px;display:grid}.details h1,.details p{transition:color .45s,font-size .45s,font-weight .45s}.details #name{opacity:0;order:3;margin:0;font-size:3rem;font-weight:600;line-height:.94;animation:1s 3s forwards fadeInOpacity}.details #about{color:#30333c;opacity:0;order:1;margin:0;font-size:1.5rem;font-weight:400;line-height:1.4;animation:1s 2s forwards fadeInOpacity}.details #role{color:#ba6f6f;text-transform:none;opacity:0;order:2;margin:0;font-size:1.2rem;font-weight:400;line-height:1.4;animation:1s 2.5s forwards fadeInOpacity}@media (width<=768px){.details{z-index:2;max-width:100%;position:relative;top:auto}.details #personalDetailsDiv{text-align:left}.details #name{font-size:2.45rem;line-height:1}}.button{color:#111318;text-transform:none;cursor:pointer;background:#ececec;border:0 solid #0000;border-left:1px solid #111318;border-right:1px solid #111318;border-radius:5px;justify-content:center;align-items:center;width:auto;min-height:34px;margin:5px;padding:6px 16px;font-weight:400;text-decoration:none;transition:background-color .2s,color .2s,border-color .2s,transform .2s;display:inline-flex}.button:hover{color:#111318;background:#fff}.button:active{transform:translateY(1px)}.button:focus-visible{outline-offset:2px;outline:2px solid #ba6f6f}@keyframes portfolioFadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.portfolio{width:100%;max-width:320px;box-shadow:none;text-align:left;background:0 0;border:0;border-radius:0;flex-direction:column-reverse;grid-area:portfolio;place-self:end start;padding:0;transition:background-color .45s,border-color .45s,border-radius .45s,box-shadow .45s,color .45s;display:flex}.portfolio h3{color:#ba6f6f;text-transform:none;margin:0 0 12px;font-size:1.25rem;font-weight:700}.portfolio ul{flex-wrap:wrap;gap:0;margin:0;padding:0;list-style:none;display:flex}.portfolio li{display:block}@media (width<=768px){.portfolio{max-width:100%}}.modal{z-index:1000;opacity:0;background:#0c0e12a3;justify-content:center;align-items:center;padding:20px;animation:.22s forwards portfolioFadeIn;display:flex;position:fixed;inset:0}.modalContent{color:#1d2028;background:#fbf8f2;border:1px solid #111318;border-radius:8px;width:min(920px,100vw - 32px);height:min(82vh,820px);padding:32px;position:relative;overflow:auto;box-shadow:0 24px 80px #00000061}.modalContent h1,.modalContent h2,.modalContent h3{color:#ba6f6f}.modalContent img{max-width:100%;height:auto}.modalContent figure{max-width:100%}@media (width<=768px){.modalContent{padding:22px}}.closeButton{float:right;color:#111318;cursor:pointer;background:#ececec;border:0 solid #0000;border-radius:5px;min-width:36px;min-height:36px;margin:-18px -18px 10px 12px;font-weight:700;position:sticky;top:0}.closeButton:hover{color:#111318;background:#fff}.closeButton:focus-visible{outline-offset:2px;outline:2px solid #ba6f6f}.contacts{width:100%;max-width:320px;box-shadow:none;text-align:right;background:0 0;border:0;border-top:1px solid #111318;border-radius:0;grid-area:contacts;place-self:start end;padding:10px 0 0;transition:background-color .45s,border-color .45s,border-radius .45s,box-shadow .45s,color .45s}.contacts h3{color:#ba6f6f;text-transform:none;margin:0 0 12px;font-size:1.25rem;font-weight:700}.contacts ul{flex-wrap:wrap;justify-content:flex-end;gap:0;margin:0;padding:0;list-style:none;display:flex}.contacts li{display:block}@media (width<=768px){.contacts{text-align:left;max-width:100%}.contacts ul{justify-content:flex-start}}.skills{width:100%;max-width:310px;box-shadow:none;text-align:left;background:0 0;border:0;border-top:1px solid #111318;border-radius:0;grid-area:skills;place-self:start;padding:10px 0 0;transition:background-color .45s,border-color .45s,border-radius .45s,box-shadow .45s,color .45s}.skills h3{color:#ba6f6f;text-transform:none;margin:0 0 14px;font-size:1.08rem;font-weight:600}.skills ul{scrollbar-width:none;gap:8px;max-height:165px;margin:0;padding:0;list-style:none;display:grid;overflow-y:auto}.skills ul::-webkit-scrollbar{display:none}.skills li{min-width:0}.skillLabel{color:#30333c;justify-content:space-between;gap:12px;font-size:.9rem;display:flex}.skillLevel{color:#77716c}.progressBar{background:#d8a5a5;border-radius:999px;width:100%;height:2px;margin-top:5px;overflow:hidden}.progressFill{border-radius:inherit;background:#111318;height:100%;transition:width .3s ease-in}@media (width<=768px){.skills{max-width:100%}}.content{box-sizing:border-box;color:#30333c;background-color:#fbf8f2;grid-template-columns:repeat(12,minmax(0,1fr));grid-template-areas:"details details details details pic pic pic pic portfolio portfolio portfolio portfolio""contacts contacts contacts contacts pic pic pic pic skills skills skills skills";align-items:center;gap:26px 30px;min-height:100vh;margin:0 auto;padding:56px;font-family:Montserrat,Arial,sans-serif;display:grid;position:relative;overflow:visible}.content figure{margin-right:15px}.content figcaption{color:#77716c;text-align:center;font-size:.8rem}.content a{color:inherit}.content h1,.content h2,.content h3,.content p{margin-top:0}@media (width<=768px){.content{grid-template-columns:1fr;grid-template-areas:"pic""details""skills""portfolio""contacts";gap:18px;min-height:auto;padding:32px 18px}}
