*{box-sizing:border-box;margin:0;padding:0}body{background:#0f172a;height:100vh;font-family:Poppins,sans-serif;position:relative;overflow:hidden}body:before,body:after{content:"";filter:blur(120px);opacity:.6;z-index:0;border-radius:50%;width:500px;height:500px;position:absolute}body:before{background:#6366f199;top:-100px;left:-100px}body:after{background:#ec489980;bottom:-100px;right:-100px}.page:before{content:"";filter:blur(120px);background:#22c55e66;border-radius:50%;width:400px;height:400px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.page{z-index:1;justify-content:center;align-items:center;min-height:100vh;display:flex;position:relative}.card{background:#fff;border-radius:24px;width:95%;height:90vh;transition:all .3s;display:flex;position:relative;overflow:hidden;box-shadow:0 30px 80px #0006}.card:before{content:"";-webkit-mask-composite:xor;pointer-events:none;background:linear-gradient(135deg,#6366f1b3,#ec489999,#22c55e99);border-radius:24px;padding:2px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);-webkit-mask-position:0 0,0 0;-webkit-mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.card:hover{transform:translateY(-8px)scale(1.01)}.image-box{width:50%;height:100%}.image-box img{object-fit:cover;width:100%;height:100%}.content{flex-direction:column;justify-content:center;width:50%;padding:50px;display:flex}h1{background:linear-gradient(90deg,#6366f1,#ec4899,#22c55e);-webkit-text-fill-color:transparent;-webkit-background-clip:text;margin-bottom:15px;font-size:44px;font-weight:700}.tag{letter-spacing:2px;color:#6366f1;margin-bottom:10px;font-size:12px}.description{color:#4b5563;margin-bottom:25px;font-size:16px;line-height:1.7}.info{gap:15px;margin-bottom:25px;display:flex}.info div{text-align:center;background:#f3f4f6;border-radius:14px;flex:1;padding:15px;box-shadow:0 6px 12px #00000014}.traits{margin-bottom:25px}.traits span{color:#fff;background:linear-gradient(135deg,#6366f1,#8b5cf6);border-radius:999px;margin:6px;padding:8px 14px;font-size:13px;transition:all .3s;display:inline-block}.traits span:hover{transform:scale(1.1)}button{color:#fff;cursor:pointer;background:linear-gradient(135deg,#22c55e,#06b6d4);border:none;border-radius:14px;padding:14px 26px;font-size:15px;font-weight:500;transition:all .3s}button:hover{transform:translateY(-2px);box-shadow:0 10px 25px #22c55e66}.loading{color:#fff;justify-content:center;align-items:center;height:100vh;font-size:24px;display:flex}body{background-color:#f5f5f5;margin:0}