*{box-sizing:border-box;margin:0;padding:0}.home-container{min-height:100vh;background:linear-gradient(135deg,#1e1e2f,#3b3b5c);color:#f0f0f5;display:flex;flex-direction:column;align-items:center}.container{max-width:900px;width:90%;padding:2rem 1rem}.hero-header{text-align:center;padding:6rem 2rem 0rem}.hero-header h1{font-size:3rem;font-weight:700;letter-spacing:1.5px;margin-bottom:.5rem;background:linear-gradient(90deg,#ff6f61,#ffa07a);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.hero-header p{font-size:1.3rem;color:#f0e6e6cc;margin-bottom:1.5rem;font-weight:500}.btn-primary{display:inline-block;background-color:#ff6f61;color:#fff;padding:.8rem 2rem;border-radius:25px;font-size:1.1rem;font-weight:600;cursor:pointer;text-decoration:none;box-shadow:0 5px 15px #ff6f6166;transition:background-color .3s ease,box-shadow .3s ease}.btn-primary:hover{background-color:#ff3b2f;box-shadow:0 8px 25px #ff3b2f99}section h2{font-size:2rem;font-weight:700;margin-bottom:1.8rem;text-align:center;letter-spacing:2px;position:relative}section h2:after{content:"";display:block;width:60px;height:3px;background-color:#ff6f61;margin:8px auto 0;border-radius:2px}section p{max-width:700px;margin:0 auto;font-size:1.1rem;color:#d7d7e2;text-align:center;line-height:1.8}.about-section.no-image{margin-top:5rem;text-align:center;padding:0 1rem}.about-text{font-size:1.2rem;max-width:750px;margin:0 auto;line-height:1.9;color:#dcdcef}.about-text .highlight{color:#ff9a86;font-weight:600;margin:0 4px}#skills,#knowledge{margin-top:4rem;text-align:center}.skills-grid{margin-top:2rem;display:flex;flex-wrap:wrap;justify-content:center;gap:1.5rem}.skill-card{background:#2d2d4a;padding:1rem 2rem;border-radius:16px;display:flex;align-items:center;gap:.8rem;box-shadow:0 5px 15px #0000004d;transition:transform .3s ease,box-shadow .3s ease;transform-origin:center}.skill-icon,.skill-label{transition:transform .3s ease;transform-origin:center}.skill-icon{font-size:1.8rem;display:inline-block}.skill-label{color:#ff9a86;font-weight:600;font-size:1.15rem;white-space:nowrap}.skill-card:hover{transform:translateY(-5px) scale(1.1);box-shadow:0 10px 25px #ff6f6166}.skill-card:hover .skill-icon,.skill-card:hover .skill-label{transform:scale(1.2)}#experience{padding-top:3rem;margin-top:2rem;text-align:center}.experience-list{display:flex;flex-direction:column;align-items:center;gap:2.5rem}.experience-card{background:#2d2d4a;padding:1.5rem 2rem;border-radius:16px;box-shadow:0 6px 20px #00000059;transition:transform .3s ease}.experience-card:hover{transform:translateY(-5px);box-shadow:0 10px 25px #ff6f6166}.experience-card h3{font-size:1.2rem;color:#ff9a86;margin-bottom:.4rem}.experience-card .exp-duration{font-size:1rem;font-weight:600;color:#ffa07a;margin-bottom:.8rem}.experience-card .exp-detail{font-size:.95rem;color:#ddd;line-height:1.6}.experience-card:hover h3,.experience-card:hover .exp-duration,.experience-card:hover .exp-detail{transform:scale(1.05);transition:transform .3s ease}#projects{margin-top:5rem;text-align:center}.projects-list{display:flex;flex-direction:column;gap:2rem;margin-top:2rem}.project-card{background:#2d2d4a;padding:1.5rem;border-radius:16px;box-shadow:0 6px 20px #00000059;display:flex;flex-direction:column;align-items:flex-start;text-align:left;transition:transform .3s ease,box-shadow .3s ease}.project-card:hover{transform:translateY(-5px);box-shadow:0 10px 25px #ff6f6166}.project-header{display:flex;align-items:center;gap:.8rem;margin-bottom:.8rem}.project-icon{width:2rem;height:2rem;transition:transform .3s ease}.project-title{font-weight:700;font-size:1.2rem;color:#ff9a86}.project-desc{font-size:1rem;color:#ccc;line-height:1.6;margin-bottom:1rem}.project-footer{display:flex;justify-content:flex-end;width:100%;margin-top:1rem}.project-card:hover .project-icon{transform:scale(1.2)}.project-card:hover .project-title,.project-card:hover .project-desc{transform:scale(1.05);transition:transform .3s ease}.arrow-up{font-size:2rem;color:#ff6f61;margin:-1.5rem 0;animation:arrowBounce 1.5s infinite}@keyframes arrowBounce{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}@media (max-width: 600px){.experience-card,.project-card{padding:1rem}.experience-card h3,.project-title{font-size:1rem}.experience-card .exp-detail,.project-desc{font-size:.9rem}.btn-primary{font-size:.95rem;padding:.6rem 1.2rem}.project-footer{justify-content:center}}.hero-section{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;padding:8rem 2rem 4rem;min-height:80vh;background:linear-gradient(135deg,#1e1e2f 50%,#2c2c47 50%);clip-path:polygon(0 0,100% 0,100% 85%,0 100%);color:#f0f0f5;margin-top:4rem}.hero-text{flex:1;padding:2rem;text-align:center}.hero-text h1{font-size:3.2rem;font-weight:800;background:linear-gradient(90deg,#ff6f61,#ffa07a);-webkit-background-clip:text;-webkit-text-fill-color:transparent;text-shadow:0 0 10px rgba(255,111,97,.3)}.typewriter-role{font-size:1.4rem;color:#e0e0f0;margin:1rem 0 1.5rem;font-weight:500}.hero-subtext{font-size:1.1rem;color:#d0d0e0;max-width:600px;margin:1rem auto;text-align:center;line-height:1.6}.hero-buttons{display:flex;gap:1rem;justify-content:center;margin-top:1.5rem}.btn-primary{background:linear-gradient(to right,#ff6f61,#ffa07a);color:#fff;padding:.8rem 2rem;border-radius:25px;font-size:1.1rem;font-weight:600;text-decoration:none;box-shadow:0 6px 15px #ff6f6166;transition:all .3s ease}.btn-primary:hover{background-color:#ff3b2f;box-shadow:0 10px 25px #ff3b2f99}.btn-secondary{background:transparent;border:2px solid #ff6f61;color:#ff6f61;padding:.8rem 2rem;border-radius:25px;font-size:1.1rem;font-weight:600;text-decoration:none;transition:all .3s ease}.btn-secondary:hover{background-color:#ff6f61;color:#fff;box-shadow:0 6px 15px #ff6f6166}.hero-image{flex:1;display:flex;justify-content:center;padding:2rem}.hero-image img{width:220px;height:220px;border-radius:50%;object-fit:cover;border:5px solid #ff6f61;box-shadow:0 0 25px #ff6f6180}.hero-image:hover img{box-shadow:0 0 25px #ff6f61b3}.social-icons{display:flex;justify-content:center;gap:1.2rem;margin-top:1.5rem}.social-icons a{transition:transform .2s ease}.social-icons a:hover{transform:scale(1.2)}@media (max-width: 1024px){.hero-section{flex-direction:column;align-items:center;text-align:center;clip-path:none;padding:6rem 1rem 3rem}.hero-text,.hero-image{flex:unset;width:100%;padding:1rem}.hero-text h1{font-size:2.4rem}.typewriter-role{font-size:1.2rem}.hero-subtext{font-size:1rem;padding:0 1rem}.hero-image img{width:180px;height:180px}}@media (max-width: 600px){.hero-text h1{font-size:2rem}.typewriter-role{font-size:1.1rem}.hero-buttons{flex-direction:column;align-items:center;gap:.75rem}.btn-primary,.btn-secondary{width:90%;text-align:center}.hero-image img{width:140px;height:140px}}.hero-image-wrapper{position:relative;display:flex;justify-content:center;align-items:center;padding:2rem}.profile-with-icons{position:relative;width:220px;height:220px}.profile-image{width:100%;height:100%;object-fit:cover;border-radius:50%;border:5px solid #ff6f61;box-shadow:0 0 25px #ff6f6180}.icon{position:absolute;width:36px;height:36px}.top-left{top:-20px;left:-20px}.top-right{top:-20px;right:-20px}.bottom-left{bottom:-20px;left:-20px}.bottom-right{bottom:-20px;right:-20px}@media (max-width: 768px){.profile-with-icons{width:160px;height:160px}.icon{width:28px;height:28px}.top-left,.top-right,.bottom-left,.bottom-right{top:auto;bottom:auto;transform:scale(.9)}.top-left{top:-15px;left:-15px}.top-right{top:-15px;right:-15px}.bottom-left{bottom:-15px;left:-15px}.bottom-right{bottom:-15px;right:-15px}}@media (max-width: 480px){.profile-with-icons{width:130px;height:130px}.icon{width:24px;height:24px}.top-left,.top-right,.bottom-left,.bottom-right{top:auto;bottom:auto}.top-left{top:-12px;left:-12px}.top-right{top:-12px;right:-12px}.bottom-left{bottom:-12px;left:-12px}.bottom-right{bottom:-12px;right:-12px}}.hero-contact{margin-top:1.5rem;font-size:1rem;color:#d0d0e0;text-align:left;line-height:1.6;padding-left:2rem}.hero-contact a{background:linear-gradient(to right,#ff6f61,#ffa07a);-webkit-background-clip:text;-webkit-text-fill-color:transparent;font-weight:600;text-decoration:none}.hero-contact a:hover{text-decoration:underline}@media (max-width: 768px){.hero-contact{padding-left:1rem;text-align:center}}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.bounce{animation:bounce 2s infinite ease-in-out}.piano-text{text-align:center;font-size:1.18rem;color:#d0d0e0;max-width:650px;margin:1.5rem auto;line-height:1.7;display:flex;flex-wrap:wrap;justify-content:center}.wave-char{display:inline-block;animation:waveUpDown .6s ease-in-out forwards}@keyframes waveUpDown{0%{transform:translateY(0)}20%{transform:translateY(-2px)}40%{transform:translateY(0)}60%{transform:translateY(2px)}80%{transform:translateY(0)}to{transform:translateY(0)}}@media (max-width: 600px){.piano-text{font-size:1.13rem}}html,body{margin:0;padding:0;background-color:#0b3c5d;height:100%;width:100%;overflow-x:hidden}#root{min-height:100vh;width:100%;background-color:#0b3c5d}