@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap";*{box-sizing:border-box;margin:0;padding:0}body{color:#e0e0e0;background:#0a0a0a;min-height:100vh;font-family:Inter,system-ui,sans-serif;overflow-x:hidden}#root{flex-direction:column;min-height:100vh;display:flex}.page{flex-direction:column;align-items:center;min-height:100vh;display:flex;position:relative}.bg-grid{pointer-events:none;z-index:0;background-image:linear-gradient(#ffffff05 1px,#0000 1px),linear-gradient(90deg,#ffffff05 1px,#0000 1px);background-size:60px 60px;position:fixed;inset:0}.hero{text-align:center;z-index:1;padding:80px 24px 40px;position:relative}.hero-title{letter-spacing:-1.5px;color:#fff;margin-bottom:0;font-size:3.5rem;font-weight:700}.cards-container{z-index:1;flex-direction:column;gap:32px;width:100%;max-width:700px;padding:40px 24px 60px;display:flex;position:relative}.card{color:inherit;border-radius:16px;flex:1;min-height:260px;text-decoration:none;transition:transform .3s,box-shadow .3s;position:relative;overflow:hidden}.card:hover{transform:translateY(-4px)}.card-bg{z-index:0;position:absolute;inset:0}.card-bg svg{width:100%;height:100%;position:absolute;inset:0}.card-content{z-index:1;text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:20px;height:100%;padding:40px;display:flex;position:relative}.card-logo{flex-shrink:0;justify-content:center;align-items:center;width:120px;height:120px;display:flex}.card-logo img{object-fit:contain;max-width:100%;max-height:100%}.card-text{flex:1}.card-text h2{margin-bottom:8px;font-size:1.5rem;font-weight:600}.card-text p{opacity:.85;margin-bottom:16px;font-size:.9rem;line-height:1.5}.card-cta{letter-spacing:.5px;font-size:.85rem;font-weight:600;transition:letter-spacing .2s}.card:hover .card-cta{letter-spacing:1.5px}.card-aminos{background:linear-gradient(135deg,#0a0a0a 0%,#141414 50%,#0e0e0e 100%);border:1px solid #ffffff1f;overflow:hidden;box-shadow:0 4px 24px #0006}.card-aminos:before{content:"";z-index:0;opacity:0;background:linear-gradient(125deg,#0000 20%,#ff00800a 30%,#00c8ff0f 40%,#78ff640a 50%,#ffc8000a 60%,#0000 70%);transition:opacity .4s;position:absolute;inset:0}.card-aminos:hover:before{opacity:1}.card-aminos:after{content:"";-webkit-mask-composite:xor;opacity:0;z-index:2;pointer-events:none;background:linear-gradient(135deg,#ffffff1a,#ff008026,#00c8ff33,#78ff6426,#ffc80026,#ffffff1a) 0 0/300% 300%;border-radius:16px;padding:1px;transition:opacity .4s;animation:4s infinite hologramShift;position:absolute;inset:-1px;-webkit-mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);-webkit-mask-position:0 0,0 0;mask-position:0 0,0 0;-webkit-mask-size:auto,auto;mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;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-aminos:hover:after{opacity:1}@keyframes hologramShift{0%,to{background-position:0%}50%{background-position:100%}}.card-aminos:hover{border-color:#fff3;box-shadow:0 8px 40px #00000080,0 0 30px #00c8ff0f,0 0 60px #ff00800a}.card-aminos .card-text h2{color:#fff}.card-aminos .card-text p{color:#b0b0b0}.card-aminos .card-cta{color:#fff}.card-bg-aminos{color:#fff9}.card-aminos .card-logo img{filter:none}.card-arts{background:linear-gradient(135deg,#1a1f16 0%,#1e2818 50%,#1c2216 100%);border:1px solid #8fa88233;box-shadow:0 4px 24px #8fa88214}.card-arts:hover{border-color:#8fa88266;box-shadow:0 8px 40px #8fa8822e}.card-arts .card-text h2{color:#d4e4c8}.card-arts .card-text p{color:#a8bf97}.card-arts .card-cta{color:#8fa882}.card-bg-arts{color:#8fa882;background:radial-gradient(at 80% 80%,#8fa8820f 0%,#0000 60%),radial-gradient(at 20% 20%,#a8bf970d 0%,#0000 60%)}.footer{text-align:center;z-index:1;margin-top:auto;padding:32px 24px;position:relative}.footer p{color:#555;font-size:.8rem}@media (width<=768px){.hero{padding:60px 20px 30px}.hero-title{font-size:2.4rem}.hero-tagline{font-size:1rem}.cards-container{gap:20px;padding:20px 16px 40px}.card-content{gap:16px;padding:24px}.card-logo{width:80px;height:80px}.card-text h2{font-size:1.2rem}}
