*{box-sizing:border-box;margin:0;padding:0}body{color:#d1d5db;background:#121212;font-family:Arial,sans-serif;line-height:1.7}img{width:100%;display:block}.app-layout{grid-template-columns:320px 1fr;gap:30px;max-width:1400px;margin:auto;padding:5px;display:grid}.sidebar{background:#1f1f1f;border:1px solid #333;border-radius:20px;height:fit-content;padding:30px;position:sticky;top:0}.profile{text-align:center}.profile img{object-fit:cover;border:4px solid #ffbf00;border-radius:50%;width:130px;height:130px;margin:auto}.profile h2{color:#e0e0e0;margin-top:20px}.profile p{color:#ffbf00;background:#2d2d2d;border-radius:8px;margin-top:10px;padding:6px 16px;display:inline-block}.contact-info{border-top:1px solid #333;margin-top:30px;padding-top:25px}.contact-info div{margin-bottom:20px}.contact-info h4{color:#9ca3af;margin-bottom:5px}.contact-info a,.contact-info span{color:#e0e0e0}.social-links{gap:15px;display:flex}.social-links a{color:#ffbf00;border:1px solid #333;border-radius:10px;padding:10px 14px;transition:all .3s}.social-links a:hover{color:#000;background:#ffbf00}.content-area{background:#1f1f1f;border:1px solid #333;border-radius:20px;overflow:hidden}.navbar{background:#222;border-bottom:2px solid #333;justify-content:space-between;align-items:center;padding:20px 30px;display:flex}.logo{color:#e0e0e0}.nav-links{gap:30px;list-style:none;display:flex}.nav-links a{color:#e0e0e0;text-decoration:none;transition:all .3s}.nav-links a:hover,.nav-links .active{color:#ffbf00}.page{padding:5px}.hero-title{color:#e0e0e0;padding-left:5px;font-size:2rem}.hero-text{text-align:justify;color:#a0a0a0;max-width:700px;margin-top:5px;padding-left:5px;padding-right:5px}.section-title{color:#e0e0e0;font-size:2rem}.section-line{background:#ffbf00;border-radius:20px;width:70px;height:5px;margin:5px 0 20px}.about{margin-top:15px}.about p{text-align:justify;color:#a0a0a0}.skills{margin-top:15px}.skills-grid{perspective:1200px;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:20px;display:grid}.skill-card{text-align:center;z-index:1;background:#171717;border:1px solid #2a2a2a;border-radius:18px;flex-direction:column;justify-content:center;min-height:180px;padding:30px;transition:transform .3s,box-shadow .3s;display:flex;position:relative;overflow:hidden}.skill-card:before{content:"";filter:blur(12px);z-index:-2;background:conic-gradient(#ffbf00 0deg 80deg,#0000 80deg 90deg,#2196f3 90deg 170deg,#0000 170deg 180deg,#ffbf00 180deg 260deg,#0000 260deg 270deg,#2196f3 270deg 350deg,#0000 350deg 360deg);width:250%;height:250%;animation:15s linear infinite rotateBorder;position:absolute;top:-75%;left:-75%}.skill-card:after{content:"";z-index:-1;background:#171717;border-radius:16px;position:absolute;inset:2px}.skill-card:hover{transform:translateY(-5px)scale(1.03);box-shadow:0 0 20px #ffbf0040,0 0 35px #2196f340}@keyframes rotateBorder{to{transform:rotate(360deg)}}.skills-grid .skill-card:first-child{animation-delay:.1s}.skills-grid .skill-card:nth-child(2){animation-delay:.2s}.skills-grid .skill-card:nth-child(3){animation-delay:.3s}.skills-grid .skill-card:nth-child(4){animation-delay:.4s}.skills-grid .skill-card:nth-child(5){animation-delay:.5s}.skills-grid .skill-card:nth-child(6){animation-delay:.6s}.skill-card:hover{box-shadow:0 20px 40px #ffbf0026}.skill-card img{object-fit:contain;filter:invert(75%)sepia(50%)saturate(1000%)hue-rotate(350deg)brightness(110%)contrast(101%);width:60px;height:60px;margin:auto;transition:transform .4s}.skill-card:hover img{transform:scale(1.12)}.skill-card h3{color:#a0a0a0;margin-top:10px;font-size:.9rem;transition:color .3s}.skill-card:hover h3{color:#ffbf00}@keyframes cardFadeIn{to{opacity:1;transform:translateY(0)scale(1)}}.projects-grid{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:25px;display:grid}.project-card{z-index:1;background:#171717;border:1px solid #2a2a2a;border-radius:18px;transition:transform .3s;position:relative;overflow:hidden}.project-card:before{content:"";filter:blur(12px);z-index:-2;background:conic-gradient(#ffbf00 0deg 80deg,#0000 80deg 90deg,#2196f3 90deg 170deg,#0000 170deg 180deg,#ffbf00 180deg 260deg,#0000 260deg 270deg,#2196f3 270deg 350deg,#0000 350deg 360deg);width:250%;height:250%;animation:25s linear infinite rotateBorder;position:absolute;top:-75%;left:-75%}.project-card:after{content:"";z-index:-1;background:#171717;border-radius:16px;position:absolute;inset:2px}.project-card:hover{box-shadow:0 20px 40px #ffbf0026}.project-card img{object-fit:cover;border-radius:12px;padding:4px}.project-content{color:#a0a0a0;padding:20px}.project-content h3{color:#e0e0e0;margin-bottom:10px}.tags{flex-wrap:wrap;gap:10px;margin-top:15px;display:flex}.tags span{color:#ffbf00;background:#ffbf001a;border-radius:6px;padding:5px 10px}.project-buttons{flex-wrap:wrap;gap:10px;margin-top:20px;display:flex}.store-btn{color:#000;cursor:pointer;background:#deb027;border:none;border-radius:8px;padding:10px 16px;font-weight:600;transition:all .3s}.store-btn:hover{opacity:.85;transform:translateY(-2px)}.contact-section{padding:10px}.contact-form{flex-direction:column;gap:20px;display:flex}.contact-form input,.contact-form textarea{color:#e0e0e0;background:#171717;border:1px solid #333;border-radius:10px;padding:15px}.contact-form textarea{resize:none;min-height:150px}.contact-form button{cursor:pointer;background:#ffbf00;border:none;border-radius:10px;padding:15px;font-weight:700}.contact-title{color:#e0e0e0;margin-bottom:10px;font-size:28px;font-weight:700}.contact-subtitle{color:#999;margin-bottom:25px;font-size:14px;line-height:1.5}.form-group{text-align:left;flex-direction:column;gap:8px;display:flex}.form-group label{color:#cfcfcf;font-size:14px;font-weight:500}.required{color:#ff4d4f;margin-left:4px;font-weight:700}.contact-form input:focus,.contact-form textarea:focus{border-color:#ffbf00;outline:none;transition:all .2s;box-shadow:0 0 0 2px #ffbf0026}.contact-form button:hover{opacity:.95;transition:all .2s;transform:translateY(-1px)}.contact-success{color:#22c55e;margin-top:10px;font-size:14px}.contact-error{color:#ef4444;margin-top:10px;font-size:14px}@media (width<=992px){.app-layout{grid-template-columns:1fr}.sidebar{position:static}}@media (width<=768px){.navbar{flex-direction:column;gap:15px}.nav-links{flex-wrap:wrap;justify-content:center;gap:15px}.hero-title{font-size:2rem}.page{padding:20px}.projects-grid{grid-template-columns:1fr}.skills-grid{grid-template-columns:1fr 1fr}.sidebar{position:static}}@media (width<=500px){.skills-grid{grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch;gap:10px}.skill-card{flex-direction:column;justify-content:center;min-height:100px;padding:15px 10px;display:flex}.skill-card h3{word-break:break-word;font-size:.75rem;line-height:1.3}.profile img{width:90px;height:90px}.hero-title{font-size:1.6rem}.section-title{font-size:1.5rem}.nav-links a{font-size:14px}.sidebar{position:static}.hero-text,.about p,.about .content{text-align:left}}@media (width<=360px){.app-layout{gap:15px;padding:5px}.sidebar{padding:15px}.profile img{width:80px;height:80px}.page{padding:10px}.hero-title,.section-title{padding-left:0;font-size:1.4rem}.nav-links{gap:8px}.nav-links a{font-size:14px}.skills-grid{grid-template-columns:1fr;gap:8px}.hero-text,.about p,.about .content{text-align:left}}