*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{color:#fff;background:#07111f;font-family:Arial,Helvetica,sans-serif}a{text-decoration:none}.navbar{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);z-index:100;background:#07111fd9;justify-content:space-between;align-items:center;width:100%;padding:20px 8%;animation:.8s slideDown;display:flex;position:sticky;top:0}.logo{color:#fff;font-size:25px}.logo span{color:#38bdf8}.nav-links{gap:28px;list-style:none;display:flex}.nav-links a{color:#cbd5e1;font-weight:700;position:relative}.nav-links a:after{content:"";background:#38bdf8;width:0;height:3px;transition:all .3s;position:absolute;bottom:-6px;left:0}.nav-links a:hover{color:#fff}.nav-links a:hover:after{width:100%}.hero{background:radial-gradient(circle at 0 0,#38bdf840,#0000 35%),radial-gradient(circle at 100% 100%,#a855f733,#0000 35%),#07111f;align-items:center;min-height:100vh;padding:90px 8%;display:flex;position:relative;overflow:hidden}.hero-content{z-index:2;max-width:850px;animation:1s fadeUp}.intro-text{color:#38bdf8;margin-bottom:12px;font-size:18px;font-weight:700}.hero h1{margin-bottom:12px;font-size:72px;line-height:1.1}.hero h1 span{color:#38bdf8}.hero h2{color:#cbd5e1;margin-bottom:22px;font-size:34px;animation:2s infinite alternate glowText}.hero-description{color:#cbd5e1;max-width:720px;margin-bottom:35px;font-size:18px;line-height:1.8}.hero-buttons{flex-wrap:wrap;gap:18px;display:flex}.btn{border-radius:40px;padding:15px 28px;font-weight:700;transition:all .3s}.primary-btn{color:#fff;background:linear-gradient(135deg,#38bdf8,#8b5cf6);box-shadow:0 12px 30px #38bdf840}.secondary-btn{color:#38bdf8;border:2px solid #38bdf8}.btn:hover{transform:translateY(-5px)}.primary-btn:hover{box-shadow:0 18px 45px #38bdf866}.secondary-btn:hover{color:#07111f;background:#38bdf8}.hero-shape{opacity:.45;filter:blur(2px);border-radius:50%;animation:6s ease-in-out infinite floatShape;position:absolute}.shape-one{background:#38bdf8;width:260px;height:260px;top:20%;right:10%}.shape-two{background:#8b5cf6;width:180px;height:180px;animation-delay:2s;bottom:16%;right:25%}.section{padding:90px 8%}.section-title{text-align:center;margin-bottom:45px}.section-title p{color:#38bdf8;text-transform:uppercase;letter-spacing:2px;margin-bottom:10px;font-weight:700}.section-title h2{font-size:42px}.about-card{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#ffffff12;border:1px solid #ffffff1f;border-radius:24px;max-width:900px;margin:auto;padding:35px;transition:all .3s;animation:1s fadeUp;box-shadow:0 20px 50px #00000040}.about-card:hover{border-color:#38bdf899;transform:translateY(-8px)}.about-card p{color:#cbd5e1;margin-bottom:18px;font-size:17px;line-height:1.8}.skills-container,.projects-container{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:24px;display:grid}.skill-card{text-align:center;background:#ffffff12;border:1px solid #ffffff1f;border-radius:18px;padding:24px;font-size:18px;font-weight:700;transition:all .3s;animation:1s fadeUp}.skill-card:hover{color:#fff;background:linear-gradient(135deg,#38bdf8,#8b5cf6);transform:translateY(-10px)scale(1.03);box-shadow:0 20px 45px #38bdf840}.project-card{background:#ffffff12;border:1px solid #ffffff1f;border-radius:24px;min-height:320px;padding:30px;transition:all .3s;animation:1s fadeUp;position:relative;overflow:hidden}.project-card:before{content:"";background:linear-gradient(135deg,#38bdf8,#8b5cf6);width:100%;height:6px;position:absolute;top:0;left:0}.project-card:hover{border-color:#38bdf899;transform:translateY(-12px);box-shadow:0 25px 55px #00000059}.project-number{color:#38bdf866;margin-bottom:18px;font-size:34px;font-weight:700}.project-card h3{margin-bottom:15px;font-size:24px}.project-card p{color:#cbd5e1;margin-bottom:15px;line-height:1.7}.tech-text{font-size:15px}.project-card a{color:#38bdf8;font-weight:700}.project-card a:hover{color:#fff}.contact-form{flex-direction:column;gap:18px;max-width:650px;margin:auto;animation:1s fadeUp;display:flex}.contact-form input,.contact-form textarea{color:#fff;background:#ffffff14;border:1px solid #ffffff29;border-radius:14px;outline:none;width:100%;padding:17px;font-size:16px}.contact-form input::placeholder,.contact-form textarea::placeholder{color:#94a3b8}.contact-form input:focus,.contact-form textarea:focus{border-color:#38bdf8;box-shadow:0 0 18px #38bdf840}.contact-form textarea{resize:none;height:150px}.contact-form button{color:#fff;cursor:pointer;background:linear-gradient(135deg,#38bdf8,#8b5cf6);border:none;border-radius:40px;padding:17px;font-size:16px;font-weight:700;transition:all .3s}.contact-form button:hover{transform:translateY(-5px);box-shadow:0 18px 45px #38bdf859}.form-message{text-align:center;color:#38bdf8;margin-top:22px;font-weight:700}.footer{text-align:center;color:#cbd5e1;background:#00000040;padding:28px 8%}.footer p{margin:6px 0}@keyframes fadeUp{0%{opacity:0;transform:translateY(45px)}to{opacity:1;transform:translateY(0)}}@keyframes slideDown{0%{opacity:0;transform:translateY(-35px)}to{opacity:1;transform:translateY(0)}}@keyframes floatShape{0%{transform:translateY(0)translate(0)}50%{transform:translateY(-30px)translate(20px)}to{transform:translateY(0)translate(0)}}@keyframes glowText{0%{text-shadow:0 0 8px #38bdf833}to{text-shadow:0 0 22px #38bdf8b3}}@media screen and (width<=900px){.hero h1{font-size:52px}.hero h2{font-size:28px}.section-title h2{font-size:34px}}@media screen and (width<=768px){.navbar{flex-direction:column;gap:18px}.nav-links{flex-wrap:wrap;justify-content:center;gap:16px}.hero{text-align:center;padding:90px 6%}.hero-content{margin:auto}.hero h1{font-size:42px}.hero h2{font-size:24px}.hero-description{font-size:16px}.hero-buttons{justify-content:center}.section{padding:70px 6%}.shape-one{top:15%;right:-80px}.shape-two{bottom:10%;right:10px}}@media screen and (width<=480px){.hero h1{font-size:36px}.btn{text-align:center;width:100%}.about-card,.project-card{padding:24px}}.response-message{color:#0284c7;margin-top:20px;font-weight:700}