@import"https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;500;600;700;800&family=Tilt+Neon&display=swap";@property --gradient-angle{syntax: "<angle>"; initial-value: 0deg; inherits: false;}*{margin:0;padding:0;box-sizing:border-box}.home{display:grid;grid-template-columns:45% 50%;place-items:center;gap:50px;background:radial-gradient(circle,#434570 3%,#232439 60%);overflow:hidden;padding:130px 80px}.description{color:#fff;padding:0 50px}.description h1{font-family:Tilt Neon,sans-serif;font-size:clamp(3rem,5vw,4rem);line-height:1.1;margin-bottom:30px}.gradient-text{font-family:Tilt Neon,sans-serif;background-image:linear-gradient(90deg,#76a73f,#338f76 40%,#378da7 50%,#7598f2 70%,#9076ec);color:transparent;background-size:contain;background-clip:text;-webkit-background-clip:text}.description p{font-family:Nunito,sans-serif;font-size:clamp(.9rem,3vw,1.1rem);line-height:1.5;margin-bottom:30px}.btn{display:inline-flex;justify-content:center;align-items:center;gap:8px;background:linear-gradient(90deg,#76a73f,#338f76 40%,#378da7 50%,#7598f2 70%,#9076ec);background-size:200%;background-position:left;color:#fff;font-family:Nunito,sans-serif;font-size:1.1rem;font-weight:600;border:0;padding:14px 28px;border-radius:8px;text-decoration:none;box-shadow:0 6px 8px #00000080,inset 0 2px 2px #fff3;cursor:pointer;transition:all .3s ease-in}.btn:hover{background-position:right;transform:translateY(-2px)}.users-color-container{display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(3,1fr);gap:20px}.item{max-width:120px;aspect-ratio:1/1;box-shadow:0 8px 8px #00000080,inset 0 2px 2px #fff3;animation:fadeIn .5s linear 1 forwards;animation-delay:calc(.2s * var(--i));opacity:0;display:flex;align-items:center;justify-content:center}.item-icon{font-size:2rem;color:#ffffffe6}.item:nth-child(1){background-color:#67d7e1;border-radius:50% 50% 0}.item:nth-child(2){background-color:#7598f2b3;border-radius:50% 50% 0 0}.item:nth-child(3){background-color:#6cc164;border-radius:50%}.item:nth-child(4){background-color:#9076ecb3;border-radius:0 0 0 50%}.item:nth-child(5){background-color:#338f76b3;border-radius:0 50% 50% 0}.item:nth-child(6){background-color:#8071a8;border-radius:0 50% 50%}.item:nth-child(7){background-color:#378da7b3;border-radius:50% 50% 0}.item:nth-child(8){background-color:#fe7519;border-radius:50% 0 0 50%}.item:nth-child(9){background-color:#f5bec3;border-radius:0 50% 50% 0}.item:nth-child(10){background-color:#6dba16b3;border-radius:50%}.item:nth-child(11){background-color:#fcd659;border-radius:50% 0 50% 50%}.item:nth-child(12){background-color:#623ce899;border-radius:50% 0 0}@keyframes fadeIn{0%{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}.card-container{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:20px;width:100%;min-height:100vh;background:radial-gradient(circle,#434570 3%,#232439 60%);overflow:hidden;padding:60px 50px 20px}.card{max-width:300px;aspect-ratio:3/5;border-radius:15px;margin:20px;overflow:hidden;border-top:1px solid rgba(255,255,255,.7);border-left:1px solid rgba(255,255,255,.7);box-shadow:0 8px 10px #00000080,inset 0 2px 2px #fff3;cursor:grab}.content{position:relative;height:100%;display:grid;grid-template-columns:1fr;grid-template-rows:repeat(9,1fr);padding:20px;background:#68686880;-webkit-user-select:none;user-select:none}.content:before,.content:after{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:conic-gradient(from var(--gradient-angle),rgb(109,186,22),rgb(30,119,95),rgb(55,141,167),rgb(59,91,174),rgb(144,118,236),rgb(59,91,174),rgb(55,141,167),rgb(30,119,95),rgb(109,186,22));animation:rotation 8s linear infinite}.content:after{filter:blur(30px)}@keyframes rotation{0%{--gradient-angle: 0deg}to{--gradient-angle: 360deg}}.card-icon{grid-row:1 / 4;display:flex;align-items:center;justify-content:center;font-size:4rem;color:#ffffffe6;background:linear-gradient(135deg,#76a73f4d,#378da74d);border-radius:12px;margin-bottom:10px}.content h1{font-family:Nunito,sans-serif;font-size:1.2rem;color:#fff;text-align:center;grid-row:4 / 5}.content p{font-family:Nunito,sans-serif;font-size:.95rem;font-weight:400;color:#fff;grid-row:5 / 8;line-height:1.5}.btn-grad{background-image:linear-gradient(to right,#ece9e6,#fff 51%,#ece9e6);background-size:200%;background-position:left;padding:8px 12px;color:#000;box-shadow:0 0 5px #eee;outline:0;font-family:Nunito,sans-serif;font-size:.9rem;font-weight:500;grid-row:8 / 9;margin:4px auto 8px;cursor:pointer;text-decoration:none;transition:all .5s ease-in}.btn-grad:hover{background-position:right}.control{display:flex;flex-direction:row;justify-content:center;align-items:center;list-style:none;gap:14px}.control li{position:relative;display:flex;justify-content:center;align-items:center;background:linear-gradient(to bottom,#559b9a,#3b3d8a);box-shadow:0 8px 20px #00000080,inset 0 4px 4px #fff3;padding:12px;border-radius:50%;font-size:1.5rem;color:#fff;cursor:pointer;transition:all .3s ease}.control li:hover{transform:scale(1.1)}.control li:before{position:absolute;content:"";inset:0;background:linear-gradient(to right,#559b9a,#3b3d8a);border-radius:50%;z-index:-1;transition:all .5s ease-in;opacity:0}.control li:hover:before{opacity:1}@media(max-width:1015px){.home{grid-template-columns:45% 50%;gap:50px;padding:140px 50px}}@media(max-width:815px){.home{grid-template-columns:1fr;grid-template-rows:1fr 1fr;grid-template-areas:"userscolorcontainer" "description";gap:30px;padding:90px 80px 70px}.users-color-container{grid-area:userscolorcontainer;gap:20px}.description{grid-area:description;padding:0;text-align:center}}@media(max-width:460px){.home{gap:0;padding:30px 40px}.btn{font-size:1rem;padding:10px 20px}}