@import url(https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap);:root{--first-color:#0984e3;--title-color:#2d3436;--text-color:#636e72;--body-color:#f5f5f5;--container-color:#f5f5f5;--body-font:"Be Vietnam Pro",sans-serif;--big-font-size:3.5rem;--h1-font-size:2.25rem;--h2-font-size:1.5rem;--h3-font-size:1.25rem;--normal-font-size:1rem;--small-font-size:0.875rem;--smaller-font-size:0.813rem;--font-regular:400;--font-medium:500;--font-semi-bold:600;--font-bold:700;--shadow:0 5px 15px #0000000d}*{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;scroll-behavior:smooth}body,button,input,textarea{font-family:Be Vietnam Pro,sans-serif;font-family:var(--body-font);font-size:1rem;font-size:var(--normal-font-size)}body{background-color:#f5f5f5;background-color:var(--body-color);color:#636e72;color:var(--text-color);line-height:1.7}h1,h2,h3{font-weight:600;font-weight:var(--font-semi-bold);line-height:1.2}h1,h2,h3,h4,h5,h6{color:#2d3436;color:var(--title-color)}h4,h5,h6{line-height:1.5}a{text-decoration:none}button{border:none;cursor:pointer;outline:none}img{height:auto;max-width:100%;vertical-align:middle}.section-title{font-size:2.25rem}.container{max-width:968px}.main{margin-left:110px}.App{text-align:center}.App-logo{height:40vmin;pointer-events:none}@media (prefers-reduced-motion:no-preference){.App-logo{animation:App-logo-spin 20s linear infinite}}.App-header{align-items:center;background-color:#282c34;color:#fff;display:flex;flex-direction:column;font-size:calc(10px + 2vmin);justify-content:center;min-height:100vh}.App-link{color:#61dafb}@keyframes App-logo-spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.main{margin-top:80px;padding:0 2rem}.section{padding:6rem 0 2rem}.section-title{font-size:var(--h1-font-size);margin-bottom:4rem}.container{margin-left:auto;margin-right:auto;max-width:1200px;padding:0 1rem}.services{background-color:#f8f9fa;padding:6rem 2rem}.services-container{margin:0 auto;max-width:1200px}.services-grid{grid-gap:2rem;display:grid;gap:2rem;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));margin-top:3rem}.service-card{background:#fff;border-radius:15px;box-shadow:0 5px 15px #0000000d;padding:2rem;text-align:center;transition:all .3s ease}.service-card:hover{box-shadow:0 8px 25px #0000001a;transform:translateY(-10px)}.service-icon{font-size:3rem;margin-bottom:1.5rem}.service-title{color:#2d3436;font-size:1.5rem;margin-bottom:1rem}.service-description{color:#636e72;font-size:1rem;line-height:1.6}@media (max-width:768px){.services{padding:4rem 1rem}.services-grid{gap:1.5rem;grid-template-columns:1fr}.service-card{padding:1.5rem}}.about{background-color:#fff;overflow:hidden;padding:6rem 2rem;position:relative}.about:before{animation:pulse 8s ease-in-out infinite alternate;background:radial-gradient(circle at 10% 20%,#ffb6c11a 0,#0000 30%),radial-gradient(circle at 90% 80%,#add8e61a 0,#0000 30%);content:"";height:100%;left:0;position:absolute;top:0;width:100%;z-index:0}.about-container{margin:0 auto;max-width:1200px;position:relative;z-index:1}.section-title{animation:fadeIn .8s ease-out;color:#2d3436;font-size:2.5rem;margin-bottom:3rem;position:relative;text-align:center}.section-title:after{animation:expandWidth 1s ease-out .5s forwards;background-color:#0984e3;bottom:-10px;content:"";height:3px;left:50%;position:absolute;transform:translateX(-50%);width:50px}.about-content{grid-gap:4rem;align-items:center;display:grid;gap:4rem;grid-template-columns:1fr 2fr}.about-image{animation:slideInLeft .8s ease-out;position:relative}.image-container{border-radius:20px;box-shadow:0 15px 30px #00000026;overflow:hidden;position:relative;transition:all .5s ease}.image-container:hover{box-shadow:0 20px 40px #0003;transform:translateY(-10px)}.about-image img{display:block;height:auto;transition:transform .5s ease;width:100%}.image-container:hover img{transform:scale(1.05)}.image-overlay{background:linear-gradient(180deg,#0000 50%,#0000004d);height:100%;left:0;position:absolute;top:0;width:100%;z-index:1}.image-decoration{border-radius:50%;position:absolute;z-index:0}.circle-1{background:#ffb6c133;height:100px;right:-20px;top:-20px;width:100px}.circle-2{background:#add8e633;bottom:-15px;height:70px;left:-15px;width:70px}.about-text{animation:slideInRight .8s ease-out;display:flex;flex-direction:column;gap:2rem}.about-subtitle{color:#2d3436;display:inline-block;font-size:2rem;margin-bottom:1rem;position:relative}.about-subtitle:after{animation:expandWidth 1s ease-out .8s forwards;background-color:#0984e3;bottom:-5px;content:"";height:3px;left:0;position:absolute;width:0}.about-description{color:#636e72;font-size:1.1rem;line-height:1.8;margin-bottom:1rem}.personal-info{grid-gap:1rem;display:grid;gap:1rem;grid-template-columns:repeat(2,1fr);margin-bottom:1.5rem}.info-item{align-items:center;display:flex;gap:.5rem}.info-label{color:#2d3436;font-weight:600;min-width:80px}.info-value{color:#636e72}.skills{margin-top:1rem}.skills h4{color:#2d3436;font-size:1.5rem;margin-bottom:1.5rem}.skills h4:after{bottom:-5px;height:2px;left:0}.skill-cards{grid-gap:1.5rem;display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));margin-top:1rem}.skill-card{animation:fadeIn .5s ease-out;animation-fill-mode:both;background-color:#fff;border:2px solid #0000;border-radius:15px;box-shadow:0 5px 15px #0000000d;height:140px;margin:0 auto;overflow:hidden;padding:1.5rem;position:relative;text-align:center;transition:all .3s ease;width:140px}.skill-card:hover{box-shadow:0 15px 30px #0000001a;transform:translateY(-10px)}.skill-icon{font-size:2.5rem;margin-bottom:1rem;transition:all .3s ease}.skill-card:hover .skill-icon{transform:scale(1.2) rotate(5deg)}.skill-name{color:#2d3436;font-size:1rem;transition:all .3s ease}.skill-card.html{background:linear-gradient(135deg,#fff5f2,#fff);border-color:#e34f26}.skill-card.html .skill-icon{color:#e34f26}.skill-card.css{background:linear-gradient(135deg,#f0f4ff,#fff);border-color:#264de4}.skill-card.css .skill-icon{color:#264de4}.skill-card.js{background:linear-gradient(135deg,#fffbe6,#fff);border-color:#f7df1e}.skill-card.js .skill-icon{color:#f7df1e}.skill-card.react{background:linear-gradient(135deg,#e6fbff,#fff);border-color:#61dafb}.skill-card.react .skill-icon{color:#61dafb}.skill-card.redux{background:linear-gradient(135deg,#f5f0ff,#fff);border-color:#764abc}.skill-card.redux .skill-icon{color:#764abc}.skill-card.responsive{background:linear-gradient(135deg,#e6fff9,#fff);border-color:#00b894}.skill-card.responsive .skill-icon{color:#00b894}.skill-card.git{background:linear-gradient(135deg,#fff0ed,#fff);border-color:#f05032}.skill-card.git .skill-icon{color:#f05032}.skill-card.uiux{background:linear-gradient(135deg,#f3f1ff,#fff);border-color:#6c5ce7}.skill-card.uiux .skill-icon{color:#6c5ce7}.about-stats{grid-gap:2rem;display:grid;gap:2rem;grid-template-columns:repeat(3,1fr);margin-top:2rem}.stat{animation:fadeIn .5s ease-out;animation-fill-mode:both;background-color:#f8f9fa;border-radius:10px;padding:1.5rem;text-align:center;transition:all .3s ease}.stat:first-child{animation-delay:.9s}.stat:nth-child(2){animation-delay:1s}.stat:nth-child(3){animation-delay:1.1s}.stat:hover{background-color:#f1f2f6;box-shadow:0 10px 20px #0000001a;transform:translateY(-5px)}.stat-number{color:#0984e3;display:block;font-size:2.5rem;font-weight:700;margin-bottom:.5rem}.stat-label{color:#636e72;font-size:1rem}@media (max-width:992px){.about-content{gap:3rem;grid-template-columns:1fr}.about-image{margin:0 auto;max-width:500px}.personal-info{grid-template-columns:1fr}.skill-cards{gap:1rem;grid-template-columns:repeat(auto-fill,minmax(120px,1fr))}.skill-card{height:120px;padding:1rem;width:120px}.skill-icon{font-size:2rem}}@media (max-width:768px){.about{padding:4rem 1rem}.section-title{font-size:2rem}.about-subtitle{font-size:1.8rem}.about-stats{gap:1rem;grid-template-columns:1fr}.stat{padding:1rem}.skill-cards{gap:.8rem;grid-template-columns:repeat(auto-fill,minmax(100px,1fr))}.skill-card{height:100px;padding:.8rem;width:100px}.skill-icon{font-size:1.8rem}.skill-name{font-size:.9rem}}.about-experience{margin-top:2.5rem}.experience-title{color:#111;font-size:2.5rem;font-weight:700;margin-bottom:2.5rem}.experience-timeline{list-style:none;margin:0;padding:0}.timeline-item{align-items:flex-start;display:flex;flex-direction:row;margin-bottom:3rem;position:relative}.timeline-left{color:#b0b3b8;flex-shrink:0;font-size:1.1rem;padding-right:30px;position:relative;text-align:right;width:220px}.timeline-year{font-size:1.2rem;font-weight:700;margin-bottom:1.2rem}.timeline-arrow{color:#111;display:flex;font-size:1.2rem;justify-content:flex-end;margin:.5rem 0}.timeline-company{color:#b0b3b8;font-size:1.1rem;margin-top:1.2rem;white-space:pre-line}.timeline-right{border-left:2px solid #e0e0e0;flex:1 1;min-height:120px;padding-left:30px}.timeline-title{color:#0099e6;font-size:1.5rem;font-weight:700;margin-bottom:1rem;text-transform:uppercase}.timeline-desc{color:#222;font-size:1.1rem;line-height:1.6}@media (max-width:768px){.timeline-item{align-items:flex-start;flex-direction:column}.timeline-left,.timeline-right{border:none;padding:0;text-align:left;width:100%}.timeline-right{border-left:none;margin-top:1rem;padding-left:0}}.portfolio{background-color:#fff;padding:6rem 2rem}.portfolio-container{margin:0 auto;max-width:1200px}.portfolio-filters{display:flex;gap:1rem;justify-content:center;margin-bottom:3rem}.filter-btn{background:#0000;border:none;border-radius:50px;color:#636e72;cursor:pointer;font-size:1rem;font-weight:500;padding:.8rem 1.5rem;transition:all .3s ease}.filter-btn:hover{color:#0984e3}.filter-btn.active{background-color:#0984e3;color:#fff}.portfolio-grid{grid-gap:1.5rem;display:grid;gap:1.5rem;grid-template-columns:repeat(3,1fr)}.portfolio-item{border-radius:15px;box-shadow:0 5px 15px #0000001a}.portfolio-image,.portfolio-item{overflow:hidden;position:relative}.portfolio-image img{height:200px;object-fit:cover;transition:transform .3s ease;width:100%}.portfolio-overlay{align-items:center;background:#0984e3e6;display:flex;height:100%;justify-content:center;left:0;opacity:0;position:absolute;top:0;transition:opacity .3s ease;width:100%}.portfolio-item:hover .portfolio-overlay{opacity:1}.portfolio-item:hover .portfolio-image img{transform:scale(1.1)}.portfolio-info{color:#fff;padding:1.5rem;text-align:center}.portfolio-info h3{font-size:1.3rem;margin-bottom:.8rem}.portfolio-info p{font-size:.9rem;line-height:1.6;margin-bottom:1.2rem}.portfolio-tech{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center;margin-bottom:1.5rem}.tech-tag{background:#fff3;padding:.3rem .8rem}.portfolio-link,.tech-tag{border-radius:50px;font-size:.9rem}.portfolio-link{background:#fff;color:#0984e3;display:inline-block;font-weight:500;padding:.6rem 1.2rem;text-decoration:none;transition:all .3s ease}.portfolio-link:hover{background:#f1f2f6;transform:translateY(-2px)}@media (max-width:768px){.portfolio{padding:4rem 1rem}.portfolio-filters{flex-wrap:wrap}.filter-btn{font-size:.9rem;padding:.6rem 1.2rem}.portfolio-grid{grid-template-columns:1fr}.portfolio-info{padding:1.5rem}}@media (max-width:992px){.portfolio-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:576px){.portfolio-grid{grid-template-columns:1fr}}.home{align-items:center;background:#f5f5f5;display:flex;justify-content:center;min-height:100vh;overflow:hidden;padding:2rem;position:relative}.home:before{animation:rotate 10s linear infinite;background:radial-gradient(circle at 20% 30%,#0984e31a 0,#0000 50%),radial-gradient(circle at 80% 70%,#0984e31a 0,#0000 50%);content:"";height:200%;width:200%}.home:before,.particle{position:absolute;z-index:0}.particle{animation:float 8s ease-in-out infinite;border-radius:50%;box-shadow:0 0 16px 4px #ffffff2e,0 0 32px 8px currentColor;filter:blur(1.5px) brightness(1.2);opacity:.7;pointer-events:none}.particle-blue{animation-duration:7s;background:#4fc3f7;color:#4fc3f7;height:14px;left:10%;top:12%;width:14px}.particle-pink{animation-duration:9s;background:#ff6bcb;color:#ff6bcb;height:18px;left:80%;top:60%;width:18px}.particle-yellow{animation-duration:8s;background:#ffe066;color:#ffe066;height:10px;left:30%;top:40%;width:10px}.particle-green{animation-duration:10s;background:#63e6be;color:#63e6be;height:16px;left:20%;top:70%;width:16px}.particle-purple{animation-duration:11s;background:#b197fc;color:#b197fc;height:12px;left:70%;top:30%;width:12px}.particle-orange{animation-duration:12s;background:#ffb56b;color:#ffb56b;height:20px;left:40%;top:80%;width:20px}.particle:nth-of-type(8){left:60%;top:15%}.particle:nth-of-type(9){left:15%;top:55%}.particle:nth-of-type(10){left:70%;top:80%}.particle:nth-of-type(11){left:80%;top:25%}.particle:nth-of-type(12){left:50%;top:65%}.particle:nth-of-type(13){left:85%;top:45%}.particle:nth-of-type(14){left:35%;top:10%}.gradient-bg{animation:gradientShift 5s ease infinite;background:linear-gradient(45deg,#f5f5f5cc,#ebebebcc 50%,#e1e1e1cc),repeating-linear-gradient(45deg,#0000,#0000 10px,#0984e308 0,#0984e308 20px);background-size:200% 200%,40px 40px}.gradient-bg,.home:after{height:100%;left:0;position:absolute;top:0;width:100%;z-index:0}.home:after{animation:pulse 8s ease-in-out infinite alternate;background:radial-gradient(circle at 10% 20%,#ffb6c126 0,#0000 30%),radial-gradient(circle at 90% 80%,#add8e626 0,#0000 30%),radial-gradient(circle at 50% 50%,#ffdab91a 0,#0000 50%);content:""}.floating-element{border-radius:50%;box-shadow:0 0 32px 12px currentColor,0 0 64px 24px currentColor;filter:blur(6px) brightness(1.3);opacity:.5;pointer-events:none;position:absolute;z-index:0}.floating-element:nth-child(9){animation:float3D 12s ease-in-out infinite;background:#ffb6c14d;height:20px;left:25%;top:15%;width:20px}.floating-element:nth-child(10){animation:float3D 15s ease-in-out infinite reverse;background:#add8e64d;height:15px;left:35%;top:75%;width:15px}.floating-element:nth-child(11){animation:float3D 10s ease-in-out infinite;background:#ffdab94d;height:25px;left:65%;top:45%;width:25px}.floating-element:nth-child(12){animation:float3D 14s ease-in-out infinite reverse;background:#dda0dd4d;height:18px;left:85%;top:25%;width:18px}.light-beam{animation:moveBeam 15s linear infinite;background:radial-gradient(circle,#fff3 0,#0000 70%);height:150px;pointer-events:none;position:absolute;width:150px;z-index:0}.light-beam:nth-child(13){left:10%;top:10%;transform:rotate(30deg)}.light-beam:nth-child(14){animation-delay:-7s;left:80%;top:70%;transform:rotate(-45deg)}@keyframes pulse{0%{opacity:.5;transform:scale(1)}50%{opacity:.8;transform:scale(1.05)}to{opacity:.5;transform:scale(1)}}@keyframes float3D{0%{transform:translateY(0) translateX(0) translateZ(0) rotate(0deg)}25%{transform:translateY(-30px) translateX(15px) translateZ(20px) rotate(90deg)}50%{transform:translateY(0) translateX(30px) translateZ(0) rotate(180deg)}75%{transform:translateY(30px) translateX(15px) translateZ(-20px) rotate(270deg)}to{transform:translateY(0) translateX(0) translateZ(0) rotate(1turn)}}@keyframes moveBeam{0%{transform:translate(0) rotate(0deg)}25%{transform:translate(100px,50px) rotate(90deg)}50%{transform:translate(200px) rotate(180deg)}75%{transform:translate(100px,-50px) rotate(270deg)}to{transform:translate(0) rotate(1turn)}}@keyframes gradientShift{0%{background-position:0 50%,0 0}50%{background-position:100% 50%,20px 20px}to{background-position:0 50%,0 0}}@keyframes rotate{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.home-container{align-items:center;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background-color:#ffffffb3;border-radius:20px;box-shadow:0 10px 30px #0000001a;display:flex;gap:2rem;max-width:1200px;padding:2rem;position:relative;width:100%;z-index:1}.home-intro{display:flex;flex:1 1;justify-content:center}.home-content{animation:fadeIn .5s ease-in;max-width:500px;text-align:left}.home-title{display:flex;flex-direction:column;gap:.5rem;margin-bottom:2rem}.greeting{animation:slideInLeft .4s ease-out .1s both;color:#636e72;display:inline-block;font-size:1.5rem;font-weight:400;position:relative}.greeting:after{animation:expandWidth 1s ease-out 1s forwards;background-color:#0984e3;bottom:-5px;content:"";height:2px;left:0;position:absolute;width:0}@keyframes expandWidth{to{width:100%}}.name{animation:slideInRight .4s ease-out .2s both;color:#2d3436;display:inline-block;font-size:2.5rem;font-weight:900;margin:.5rem 0;position:relative}.name:before{animation:shine 3s infinite;background:linear-gradient(90deg,#0000,#fff6,#0000);content:"";height:100%;left:-100%;position:absolute;top:0;width:100%}@keyframes shine{0%{left:-100%}20%{left:100%}to{left:100%}}.role{animation:slideInLeft .4s ease-out .3s both;color:#0984e3;display:inline-block;font-size:2rem;font-weight:600;position:relative}.role:after{animation:expandWidth 1s ease-out 1.2s forwards;background-color:#0984e3;bottom:-5px;content:"";height:3px;position:absolute;right:0;width:0}.home-description{animation:fadeIn .5s ease-out .4s both;color:#636e72;font-size:1.2rem;line-height:1.6;margin-bottom:2rem;position:relative}.home-description:before{animation:fadeIn 1s ease-out 1s both;color:#5f91ff33;content:'"';font-size:3rem;left:-15px;position:absolute;top:-20px}.home-buttons{animation:fadeIn .5s ease-out .5s both;display:flex;gap:1rem;margin-bottom:2rem}.btn{border:none;border-radius:50px;cursor:pointer;font-size:1rem;font-weight:600;overflow:hidden;padding:.8rem 2rem;position:relative;transition:all .3s ease;z-index:1}.btn:before{background:#ffffff1a;content:"";height:100%;left:0;position:absolute;top:0;transform:scaleX(0);transform-origin:right;transition:transform .5s ease;width:100%;z-index:-1}.btn:hover:before{transform:scaleX(1);transform-origin:left}.primary-btn{background:#0984e3;box-shadow:0 4px 15px #0984e34d;color:#fff}.primary-btn:hover{background:#0773c5;box-shadow:0 8px 20px #0984e366;transform:translateY(-5px)}.secondary-btn{background:#0000;border:2px solid #0984e3;color:#0984e3}.secondary-btn:hover{background:#0984e3;box-shadow:0 8px 20px #0984e333;color:#fff;transform:translateY(-5px)}.social-links{animation:fadeIn .5s ease-out .6s both;display:flex;gap:1.5rem}.social-link{color:#2d3436;display:inline-block;font-size:1.5rem;position:relative;transition:all .3s ease}.social-link:before{background:#0984e31a;border-radius:50%;content:"";height:100%;position:absolute;transform:scale(0);transition:transform .3s ease;width:100%;z-index:-1}.social-link:hover{color:#0984e3;transform:translateY(-5px) rotate(10deg)}.social-link:hover:before{transform:scale(1.5)}.home-visual{flex:1 1;height:500px}.home-visual,.profile-container{align-items:center;display:flex;justify-content:center;position:relative}.profile-container{height:100%;width:100%}.profile-image{animation:fadeIn .5s ease-out .25s both;border:5px solid #fff3;border-radius:50%;box-shadow:0 10px 30px #0000004d;height:300px;overflow:hidden;position:relative;transition:all .3s ease;width:300px;z-index:2}.profile-image:before{background:linear-gradient(135deg,#5f91ff33,#0000);content:"";height:100%;left:0;opacity:0;position:absolute;top:0;transition:opacity .5s ease;width:100%;z-index:1}.profile-image:hover:before{opacity:1}.profile-image img{filter:brightness(.95) contrast(1.05);height:100%;object-fit:cover;transition:transform .5s ease;width:100%}.profile-image:hover{border-color:#5f91ff80;box-shadow:0 15px 35px #0006;transform:translateY(-10px)}.profile-image:hover img{transform:scale(1.05)}.profile-decoration{border-radius:50%;position:absolute;z-index:1}.circle-1{animation:float 6s ease-in-out infinite alternate;background:#5f91ff1a;height:150px;left:20%;top:20%;width:150px}.circle-2{animation:float 8s ease-in-out infinite alternate-reverse;background:#5f91ff26;bottom:20%;height:100px;right:20%;width:100px}.circle-3{animation:float 7s ease-in-out infinite alternate;background:#5f91ff33;height:70px;right:10%;top:50%;width:70px}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInLeft{0%{opacity:0;transform:translateX(-25px)}to{opacity:1;transform:translateX(0)}}@keyframes slideInRight{0%{opacity:0;transform:translateX(25px)}to{opacity:1;transform:translateX(0)}}@keyframes float{0%{transform:translateY(0) scale(1)}50%{transform:translateY(-18px) scale(1.15)}to{transform:translateY(0) scale(1)}}@media (max-width:992px){.home-container{flex-direction:column;padding:1.5rem}.home-content{text-align:center}.home-buttons,.social-links{justify-content:center}.home-visual{height:400px;margin-top:2rem}.profile-image{height:250px;width:250px}}@media (max-width:768px){.name{font-size:2.5rem}.role{font-size:1.5rem}.home-buttons{flex-direction:column}.btn{width:100%}.home-visual{height:350px}.profile-image{height:200px;width:200px}.circle-1{height:100px;width:100px}.circle-2{height:80px;width:80px}.circle-3{height:60px;width:60px}}ul{list-style:none}.example-1{align-items:center;display:flex;justify-content:center}.example-1 .icon-content{margin:0 10px;position:relative}.example-1 .icon-content .tooltip{background-color:#000;border-radius:5px;color:#fff;font-size:14px;left:50%;opacity:0;padding:6px 10px;position:absolute;top:-30px;transform:translateX(-50%);transition:all .3s ease;visibility:hidden}.example-1 .icon-content:hover .tooltip{opacity:1;top:-50px;visibility:visible}.example-1 .icon-content .link{align-items:center;background-color:#fff;border-radius:50%;color:#4d4d4d;display:flex;height:50px;justify-content:center;transition:all .3s ease-in-out;width:50px}.example-1 .icon-content .link:hover{box-shadow:3px 2px 45px 0 #0000001f}.example-1 .icon-content .link svg{height:30px;width:30px}.example-1 .icon-content .link[data-social=github]:hover{color:#090909}.example-1 .icon-content .link[data-social=facebook]:hover{color:#08c}.contact{background-color:#f8f9fa;padding:6rem 2rem}.contact-container{margin:0 auto;max-width:1200px}.contact-content{grid-gap:4rem;display:grid;gap:4rem;grid-template-columns:1fr 2fr;margin-top:3rem}.contact-info{display:flex;flex-direction:column;gap:2rem}.contact-item{align-items:flex-start;background:#fff;border-radius:15px;box-shadow:0 5px 15px #0000000d;display:flex;gap:1.5rem;padding:1.5rem;transition:all .3s ease}.contact-item:hover{box-shadow:0 8px 25px #0000001a;transform:translateY(-5px)}.contact-icon{color:#0984e3;font-size:2rem}.contact-text h3{color:#2d3436;font-size:1.2rem;margin-bottom:.5rem}.contact-text p{color:#636e72;line-height:1.6}.contact-form{background:#fff;border-radius:15px;box-shadow:0 5px 15px #0000000d;padding:2rem}.form-group{margin-bottom:1.5rem}.form-group input,.form-group textarea{border:1px solid #e1e1e1;border-radius:8px;font-size:1rem;padding:1rem;transition:all .3s ease;width:100%}.form-group input:focus,.form-group textarea:focus{border-color:#0984e3;box-shadow:0 0 0 2px #0984e31a;outline:none}.form-group textarea{height:150px;resize:vertical}.submit-btn{background:#0984e3;border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:1rem;font-weight:500;padding:1rem;transition:all .3s ease;width:100%}.submit-btn:hover{background:#0873c4;transform:translateY(-2px)}@media (max-width:992px){.contact-content{gap:2rem;grid-template-columns:1fr}.contact-info{flex-direction:row;flex-wrap:wrap}.contact-item{flex:1 1 300px}}@media (max-width:768px){.contact{padding:4rem 1rem}.contact-item{padding:1rem}.contact-form{padding:1.5rem}}.header{background-color:var(--body-color);box-shadow:0 1px 4px #0000000d;left:0;position:fixed;top:0;width:100%;z-index:100}.nav{column-gap:1rem;height:80px;justify-content:space-between}.nav,.nav__logo{align-items:center;display:flex}.nav__logo{gap:1rem}.nav__profile-img{border:2px solid var(--first-color);border-radius:50%;height:45px;overflow:hidden;width:45px}.nav__profile-img img{height:100%;object-fit:cover;width:100%}.nav__profile-info{display:flex;flex-direction:column}.nav__profile-name{color:var(--title-color);font-size:1rem;font-weight:500;margin-bottom:.2rem}.nav__profile-role{color:var(--first-color);font-size:.8rem;font-weight:400}.nav__list,.nav__menu{align-items:center;display:flex}.nav__list{gap:2rem}.nav__link{align-items:center;border-radius:6px;color:var(--title-color);display:flex;font-size:.938rem;font-weight:500;gap:.5rem;padding:.5rem;transition:.3s}.nav__link i{font-size:1.25rem}.active-link,.nav__link:hover{background:#0984e314;color:var(--first-color)}.nav__social{align-items:center;display:flex;gap:1rem}.nav__social-link{color:var(--title-color);font-size:1.25rem;transition:.3s}.nav__social-link:hover{color:var(--first-color);transform:translateY(-2px)}.nav__close,.nav__toggle{display:none}@media screen and (max-width:968px){.nav{padding:0 1rem}.nav__social{display:none}}@media screen and (max-width:767px){.nav__menu{background-color:var(--body-color);border-radius:1rem 0 0 1rem;box-shadow:-2px 0 4px #0000001a;height:100%;padding:4rem 0 0 3rem;position:fixed;right:-100%;top:0;transition:.3s;width:80%}.show-menu{right:0}.nav__profile-info{display:none}.nav__list{flex-direction:column;row-gap:1.5rem}.nav__link{font-weight:var(--font-medium);text-transform:capitalize}.nav__close,.nav__link{color:var(--title-color)}.nav__close{cursor:pointer;display:block;font-size:1.5rem;position:absolute;right:1.5rem;top:1.5rem}.nav__close:hover{color:var(--first-color)}.nav__toggle{align-items:center;background:#0984e314;border-radius:6px;color:var(--title-color);cursor:pointer;display:flex;font-size:1.25rem;height:40px;justify-content:center;transition:.3s;width:40px}.nav__toggle:hover{background:var(--first-color);color:#fff}}@media screen and (max-width:350px){.nav__menu{padding:4rem .5rem 2rem 1.5rem}.nav__list{row-gap:1rem}}.skills{margin:0 auto;max-width:1200px;padding:4rem 2rem}.skills-container{background:linear-gradient(145deg,#4a4a4a,#5d5d5d);border:1px solid #ffffff1a;border-radius:20px;box-shadow:0 15px 30px #0003;padding:3rem;transition:all .3s ease}.skills-container:hover{box-shadow:0 20px 40px #0000004d;transform:translateY(-5px)}.skills h4{color:#fff;display:inline-block;font-size:2.5rem;margin-bottom:3rem;position:relative;text-align:center;width:100%}.skills h4:after{animation:expandWidth 1s ease-out 1s forwards;background-color:#0984e3;bottom:-10px;content:"";height:3px;left:50%;position:absolute;transform:translateX(-50%);width:0}.skill-cards{flex-wrap:wrap;gap:1.2rem}.skill-card,.skill-cards{display:flex;justify-content:center}.skill-card{align-items:center;background:#23272f;border:2px solid #ffffff1f;border-radius:18px;box-shadow:0 4px 24px 0 #0000001f;cursor:pointer;flex-direction:column;height:200px;margin-bottom:1.2rem;transition:box-shadow .3s,border .3s,background .3s,transform .2s;width:200px}.skill-card:hover{background:#2d323c;border:2.5px solid #fff;box-shadow:0 8px 32px 0 #00000038;transform:translateY(-8px) scale(1.04)}.skill-image{display:block;height:64px;margin-bottom:1.2rem;object-fit:contain;width:64px}.skill-name{color:#fff;font-size:1.1rem;font-weight:600;letter-spacing:.5px;text-align:center}.skill-card:first-child{animation-delay:.1s}.skill-card:nth-child(2){animation-delay:.2s}.skill-card:nth-child(3){animation-delay:.3s}.skill-card:nth-child(4){animation-delay:.4s}.skill-card:nth-child(5){animation-delay:.5s}.skill-card:nth-child(6){animation-delay:.6s}.skill-card:nth-child(7){animation-delay:.7s}.skill-card:nth-child(8){animation-delay:.8s}@media (max-width:1200px){.skill-card{height:180px;width:180px}}@media (max-width:900px){.skill-card{height:160px;max-width:180px;min-width:140px;width:45vw}}@media (max-width:600px){.skill-card{height:140px;max-width:300px;min-width:120px;width:90vw}}
/*# sourceMappingURL=main.46d48093.css.map*/