html{scrollbar-color:#23cfdf #0b0e17;scrollbar-width:thin}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:#080b1a}::-webkit-scrollbar-thumb{background:linear-gradient(#23cfdf 0%,#ad222f 100%);border:2px solid #080b1a;border-radius:20px}::-webkit-scrollbar-thumb:hover{background:linear-gradient(#38bdf8 0%,#d92638 100%)}html,body,#wrapper{width:100dvw;height:100dvh;margin:0;padding:0;font-family:Manrope,sans-serif;overflow:hidden}#wrapper{color:#fff;background-image:url(/web_bg.png);background-repeat:no-repeat;background-size:cover;grid-template-rows:min-content 1fr;grid-template-columns:1fr;display:grid}nav{padding:5px 20px}nav ul{justify-content:space-between;align-items:center;gap:100px;width:100%;margin:0;padding:0;list-style-type:none;display:flex}nav ul #nephilaX{align-items:center;gap:20px;margin-right:auto;font-size:30px;display:flex}#nephilaXLink{background:linear-gradient(90deg,#23cfdf 0%,#ad222f 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text}nav #logoHolder{width:60px;height:60px;position:relative}nav img{width:100%;height:100%;display:block;position:absolute;top:0;left:0}nav #spiderImg{cursor:pointer;transition:transform .1s linear}nav #string{transform-origin:top;background-color:#23cfdf;width:1px;transition:transform .1s linear;position:absolute;top:35%;left:50%}#string:hover{background-color:#fe5641}nav:has(#spiderImg:hover) #string{background-color:#fe5641}nav ul a{color:#fff;font-weight:700;text-decoration:none}nav ul a:hover{background:linear-gradient(90deg,#23cfdf 0%,#ad222f 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text}#content{grid-template-rows:1fr min-content;grid-template-columns:1fr;padding:10px 10px 10px 100px;display:grid;overflow:auto}.pageHeader{color:#fff;text-align:center;padding:100px 20px;position:relative;overflow:hidden}.pageHeader h1{background:linear-gradient(90deg,#23cfdf 0%,#ad222f 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;width:fit-content;margin:0 auto 24px;font-size:10vmin;font-weight:700;line-height:1.2}.pageHeader p{color:#94a3b8;max-width:600px;margin:0 auto;font-size:1.1rem;line-height:1.6}.articleContainer{flex-direction:column;gap:20px;display:flex}.articleContainer>article{max-width:600px}.articleContainer>article:nth-child(odd){align-self:flex-start}.articleContainer>article:nth-child(2n){align-self:flex-end}.projectsContainer{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:30px;display:grid}.projectCard{grid-template-rows:min-content min-content min-content auto min-content;gap:16px;width:100%;max-width:380px;display:grid}.card{box-sizing:border-box;z-index:1;background:#0b0e17;border-radius:20px;padding:16px;position:relative}.card:before{content:"";z-index:-1;background:linear-gradient(135deg,#23cfdf 0%,#080b1a 40% 60%,#ad222f 100%);border-radius:21.5px;position:absolute;inset:-1.5px}.projectPreview{aspect-ratio:16/10;object-fit:cover;border-radius:12px;width:100%;display:block}.projectName{color:#fff;margin:0;font-size:1.5rem;font-weight:600}.projectDescription{color:#94a3b8;-webkit-line-clamp:5;-webkit-box-orient:vertical;margin:0;font-size:.95rem;line-height:1.5;display:-webkit-box;overflow:hidden}.projectStack{flex-wrap:wrap;justify-content:space-evenly;gap:8px;margin:0;padding:0;list-style:none;display:flex}.projectStack li{background:#111625;border:1px solid #ffffff14;border-radius:12px;justify-content:center;align-items:center;width:50px;height:50px;display:flex}.projectStack li img{object-fit:contain;width:24px;height:24px}.projectLink{text-align:center;color:#fff;box-sizing:border-box;background:linear-gradient(#0f1422,#0f1422) padding-box padding-box,linear-gradient(90deg,#23cfdf,#ad222f) border-box;border:1px solid #0000;border-radius:12px;width:100%;padding:15px;font-size:.95rem;font-weight:500;text-decoration:none;display:block;position:relative}.projectLink:hover{background:linear-gradient(90deg,#23cfdf,#ad222f) border-box}#projectContainer{flex-direction:column;gap:20px;max-width:1000px;margin:0 auto;display:flex}#projectHeader{grid-template:"title preview"min-content"link preview"min-content/1fr 1fr;gap:20px;display:grid}#projectTitle{background:linear-gradient(90deg,#23cfdf 0%,#ad222f 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;grid-area:title;align-self:end;width:fit-content;margin:0;font-size:10vmin;font-weight:700}#projectPreview{grid-area:preview}#projectPreview img{aspect-ratio:16/10;object-fit:cover;border-radius:12px;width:100%}#projectHeader .projectLink{grid-area:link;width:fit-content;height:fit-content}.sectionTitle{text-align:center;color:#94a3b8;font-size:20px}#projectDescription{text-align:justify}#projectStackList{justify-content:space-evenly;gap:8px;display:flex}#projectStackList img{aspect-ratio:1;object-fit:contain;width:5vmin;max-width:50px;height:5vmin;max-height:50px}#projectDevelopersList{grid-template-columns:1fr 1fr;gap:25px;display:grid}#noProject{justify-content:center;align-items:center;display:flex}#noProject h1{background:linear-gradient(90deg,#23cfdf 0%,#ad222f 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;font-size:50px}.pageFooter{box-sizing:border-box;color:#94a3b8;flex-direction:column;align-items:center;gap:24px;width:100%;padding:40px 20px 20px;display:flex}.footerContent{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:20px;width:100%;display:flex}.footerBrand h3{background:linear-gradient(90deg,#23cfdf 0%,#ad222f 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;width:min-content;margin:0 0 6px;font-size:1.25rem;font-weight:700}.footerBrand p{color:#64748b;margin:0;font-size:.9rem}.footerLinks{gap:20px;display:flex}.footerLinks a{color:#94a3b8;font-size:.95rem;text-decoration:none;transition:color .2s}.footerLinks a:hover{color:#fff}.footerDivider{background:linear-gradient(90deg,#0000,#23cfdf4d,#ad222f4d,#0000);width:100%;height:1px}.footerBottom{text-align:center;color:#64748b;font-size:.85rem}.footerBottom p{margin:0}@media (orientation:portrait){#projectHeader{grid-template:"title"min-content"preview"min-content"link"min-content/1fr}#projectHeader .projectLink{width:100%}#projectDevelopersList{grid-template-columns:1fr}}
