*{box-sizing:border-box;margin:0;padding:0}:root{--color-bg:#060c18;--color-surface:#0c1830;--color-primary:#1e4080;--color-accent:#00d4ff;--color-text:#eef3fa}@font-face{font-family:"Playfair Display", serif;font-style:normal;font-weight:400;src:url(/fonts/PlayfairDisplay-Regular.ttf)format("truetype")}@font-face{font-family:"Space Grotesk", serif;font-style:normal;font-weight:400;src:url(/fonts/SpaceGrotesk-Regular.ttf)format("truetype")}.btn-primary{background:var(--color-primary);color:var(--color-text)}body{background:var(--color-bg);color:var(--color-text);font-family:Space Grotesk,serif}.about-wrapper{width:100%}.about-container{align-items:center;max-width:1200px;margin:0 auto;padding:20px;display:flex}.image-wrapper{flex:1;justify-content:center;align-items:center;display:flex}.image-container{background-color:#8a2be2;border-radius:50%;width:50vh;height:50vh;overflow:hidden;box-shadow:0 0 20px #ffffff80}.image-container img{object-fit:cover;width:100%;height:100%}.about-content{flex:1}.about-content h2{margin-bottom:10px;font-size:36px;line-height:40px}.about-content p{color:#fff9;font-size:18px;line-height:30px}.about-experience{gap:20px;margin-top:20px;display:flex}.experience-item{text-align:center;color:#fff6;border:1px solid #ffffff0d;border-radius:10px;flex-direction:column;flex:1;gap:10px;padding:20px 10px;font-size:14px;line-height:20px;display:flex}.experience-item span{color:var(--color-accent);font-size:30px;font-weight:700;line-height:36px}@media (width<=768px){.about-container{flex-direction:column;gap:20px}.about-experience{flex-direction:column}}.experience-wrapper{max-width:1200px;margin:0 auto;padding:0 20px}.experience-header{text-align:center;margin:40px 0}.experience-container{grid-template-columns:repeat(2,1fr);gap:20px 40px;display:grid;position:relative}.experience-container:before{content:"";border-left:1px solid var(--color-accent);position:absolute;top:0;bottom:0;left:50%;transform:translate(-50%)}.experience-container>:first-child{grid-area:1/1;margin-right:20px}.experience-container>:nth-child(2){grid-area:2/2;margin-left:20px}.experience-container>:nth-child(3){grid-area:3/1;margin-right:20px}.experience-container>:nth-child(4){grid-area:4/2;margin-left:20px}.experience-item{text-align:left;flex-direction:column;justify-content:start;padding:20px;display:flex}.experience-period{width:fit-content;color:var(--color-accent);background-color:#00d4ff1a;border-radius:5px;padding:5px 10px;font-size:12px;line-height:16px}.experience-position{color:#fff;margin-top:10px;font-size:18px;font-weight:700;line-height:28px}.experience-company{color:var(--color-secondary);margin-bottom:7px;font-size:17px;line-height:24px}.experience-roles{font-size:14px;line-height:22.75px}.experience-container>*{position:relative}.experience-container>:before{content:"";background:var(--color-accent);z-index:1;border-radius:50%;width:15px;height:15px;position:absolute;top:40px;transform:translate(-50%)}.experience-container>:nth-child(odd):before{margin-left:40px;left:100%}.experience-container>:nth-child(2n):before{margin-right:25px;right:100%}.hero-wrapper{justify-content:center;align-items:center;height:calc(100vh - 80px);display:flex}.hero-container{text-align:center;flex-direction:column;justify-content:start;align-items:center;min-width:50%;min-height:50%;padding:20px;display:flex}.welcome{color:#00d4ff;font-size:22px;font-weight:700;line-height:24px}.name{font-size:72px;line-height:90px}.name span{background:linear-gradient(90deg,#3a7ff2,#7d7cf9);-webkit-text-fill-color:transparent;-webkit-background-clip:text}.typer{color:#e4e7e4;margin:20px 0;font-size:30px;line-height:36px}.desc{color:gray;margin:20px 0;font-size:18px;line-height:28px}.hero-button{background:var(--color-accent);color:#000;cursor:pointer;border:none;border-radius:20px;margin-top:15px;padding:10px 20px;font-size:16px}.navbar-wrapper{z-index:1000;background-color:#060c18f2;width:100%;position:sticky;top:0;box-shadow:0 2px 4px #0000001a}.navbar-container{max-width:1200px;color:var(--color-text);justify-content:space-between;align-items:center;margin:0 auto;padding:20px;display:flex}.logo{cursor:pointer}.logo h1{font-size:24px;font-weight:700}.nav-list{color:var(--color-text);list-style:none;display:flex}.nav-list a{color:var(--color-text);margin:0 15px;text-decoration:none}.skills-wrapper{max-width:1200px;margin:0 auto;padding:0 20px}.skills-header{text-align:center;margin:40px 0;font-size:36px;font-weight:700;line-height:40px}.skill-section ul{list-style:none}.skill-section h2{color:var(--color-accent);margin:15px 0;font-size:14px;line-height:20px}.skill-title{align-items:center;gap:10px;margin-bottom:10px;display:flex}.skill-meter{background-color:#fff6;border-radius:20px;width:100%;height:6px}.skill-level{background-color:var(--color-accent);border-radius:20px;height:100%}.skills-list{grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;display:grid}.skill-item{border:1px solid #ffffff0d;border-radius:10px;flex-direction:column;gap:10px;padding:20px;display:flex}