@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap";:root{--color-bg:#141414;--color-surface:#202020;--color-surface-hover:#2a2a2a;--color-text-primary:#e0e0e0;--color-text-secondary:#a8a8a8;--color-text-muted:#7b7b7b;--color-border:#ffffff14;--color-glass-bg:#2323238c;--color-glass-border:#ffffff14;--color-accent:#6f767e;--font-primary:"Comic Sans MS", "Comic Sans", cursive;--transition-smooth:all .3s cubic-bezier(.4, 0, .2, 1);--shadow-glass:0 8px 32px 0 #0000002e;--shadow-hover:0 12px 48px 0 #00000040;--radius-lg:16px;--radius-md:12px;--radius-sm:8px}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:var(--font-primary);background:var(--color-bg);color:var(--color-text-primary);background-attachment:fixed;min-height:100vh;line-height:1.6;overflow-x:hidden}h1,h2,h3,h4,h5,h6{color:teal;font-weight:600;line-height:1.2}a{color:inherit;text-decoration:none}ul{list-style:none}.glass-card{background:var(--color-glass-bg);-webkit-backdrop-filter:blur(12px);border:1px solid var(--color-glass-border);box-shadow:var(--shadow-glass);border-radius:var(--radius-lg);transition:var(--transition-smooth)}.glass-card:hover{box-shadow:var(--shadow-hover);border-color:#ffffff26;transform:translateY(-4px)}.glass-nav{-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--color-glass-border);background:#191919a6}.glass-button{-webkit-backdrop-filter:blur(8px);border:1px solid var(--color-glass-border);border-radius:var(--radius-sm);color:var(--color-text-primary);cursor:pointer;transition:var(--transition-smooth);background:#2323238c;justify-content:center;align-items:center;gap:.5rem;padding:.75rem 1.5rem;font-weight:500;display:inline-flex}.glass-button:hover{box-shadow:var(--shadow-glass);background:#2d2d2db3;transform:translateY(-2px)}.glass-button-primary{background:var(--color-accent);color:var(--color-text-primary);border:1px solid #ffffff1a}.glass-button-primary:hover{box-shadow:var(--shadow-glass);background:#7a828b}.section-container{max-width:1200px;margin:0 auto;padding:3rem 2rem}.section-title{text-align:left;margin-bottom:3rem;font-family:Algerian,serif;font-size:3.5rem;font-weight:400;display:block;position:relative}.section-subtitle{color:var(--color-text-secondary);letter-spacing:.5px;font-family:Arial Rounded MT Bold,Helvetica Rounded,Arial,sans-serif;font-size:1.2rem;font-weight:400}.name-text{font-family:Franklin Gothic Demi,Franklin Gothic Medium,Arial Narrow,Arial,sans-serif;font-weight:700}.grid{gap:2rem;display:grid}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--color-bg)}::-webkit-scrollbar-thumb{background:var(--color-surface);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--color-surface-hover)}.dock-outer{align-items:center;max-width:100%;margin:0;display:flex}.dock-panel{z-index:1000;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background-color:#19191973;border:1px solid #ffffff14;border-radius:1.5rem;align-items:flex-end;gap:.75rem;width:fit-content;padding:0 .5rem .5rem;display:flex;position:fixed;bottom:1.5rem;left:50%;transform:translate(-50%);box-shadow:0 10px 30px #0003}.dock-item{cursor:pointer;color:var(--color-text-secondary);background-color:#2323238c;border:1px solid #ffffff14;border-radius:50%;outline:none;justify-content:center;align-items:center;transition:color .3s,background-color .3s;display:inline-flex;position:relative;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.dock-item:hover{color:#1a1a1a;background-color:#f5f5dce6}.dock-icon{justify-content:center;align-items:center;display:flex}.dock-label{white-space:pre;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);color:#e0e0e0;pointer-events:none;background-color:#141414e6;border:1px solid #ffffff14;border-radius:.5rem;width:fit-content;padding:.25rem .75rem;font-size:.8rem;position:absolute;top:-2.5rem;left:50%;transform:translate(-50%)}.shiny-text{display:inline-block}.chroma-grid{grid-template-columns:repeat(var(--cols,3), 1fr);box-sizing:border-box;--x:50%;--y:50%;--r:220px;grid-auto-rows:auto;justify-content:center;gap:.75rem;width:100%;max-width:1200px;height:100%;margin:0 auto;padding:0;display:grid;position:relative}@media (width<=1124px){.chroma-grid{grid-template-columns:repeat(auto-fit,minmax(320px,320px));gap:.5rem;padding:.5rem}}@media (width<=480px){.chroma-grid{grid-template-columns:320px;gap:.75rem;padding:1rem}}.chroma-card{background:var(--card-gradient);--mouse-x:50%;--mouse-y:50%;--spotlight-color:#ffffff4d;border:1px solid #333;border-radius:20px;flex-direction:column;width:100%;height:100%;transition:border-color .3s;display:flex;position:relative;overflow:hidden}.chroma-card:hover{border-color:var(--card-border)}.chroma-card:before{content:"";background:radial-gradient(circle at var(--mouse-x) var(--mouse-y), var(--spotlight-color), transparent 70%);pointer-events:none;opacity:0;z-index:2;transition:opacity .5s;position:absolute;inset:0}.chroma-card:hover:before{opacity:1}.chroma-img-wrapper{z-index:0;background:0 0;padding:0;position:absolute;inset:0}.chroma-img-wrapper img{object-fit:cover;width:100%;height:100%;display:block}.chroma-info{z-index:5;color:#fff;box-sizing:border-box;background:linear-gradient(#0000 0%,#00000080 40%,#000000e6 100%);flex-direction:column;width:100%;padding:3rem 1rem 1rem;font-family:system-ui,sans-serif;display:flex;position:absolute;bottom:0;left:0}.chroma-info .role,.chroma-info .handle{color:#aaa}.chroma-overlay{pointer-events:none;z-index:3;-webkit-backdrop-filter:grayscale()brightness(.78);-webkit-mask-image:radial-gradient(circle var(--r) at var(--x) var(--y), transparent 0%, transparent 15%, #0000001a 30%, #00000038 45%, #00000059 60%, #00000080 75%, #000000ad 88%, white 100%);mask-image:radial-gradient(circle var(--r) at var(--x) var(--y), transparent 0%, transparent 15%, #0000001a 30%, #00000038 45%, #00000059 60%, #00000080 75%, #000000ad 88%, white 100%);-webkit-mask-image:radial-gradient(circle var(--r) at var(--x) var(--y), transparent 0%, transparent 15%, #0000001a 30%, #00000038 45%, #00000059 60%, #00000080 75%, #000000ad 88%, white 100%);background:0 0;position:absolute;inset:0}.chroma-fade{pointer-events:none;z-index:4;-webkit-backdrop-filter:grayscale()brightness(.78);-webkit-mask-image:radial-gradient(circle var(--r) at var(--x) var(--y), white 0%, white 15%, #ffffffe6 30%, #ffffffc7 45%, #ffffffa6 60%, #ffffff80 75%, #ffffff52 88%, transparent 100%);mask-image:radial-gradient(circle var(--r) at var(--x) var(--y), white 0%, white 15%, #ffffffe6 30%, #ffffffc7 45%, #ffffffa6 60%, #ffffff80 75%, #ffffff52 88%, transparent 100%);-webkit-mask-image:radial-gradient(circle var(--r) at var(--x) var(--y), white 0%, white 15%, #ffffffe6 30%, #ffffffc7 45%, #ffffffa6 60%, #ffffff80 75%, #ffffff52 88%, transparent 100%);opacity:1;background:0 0;transition:opacity .25s;position:absolute;inset:0}.spotlight-btn{-webkit-backdrop-filter:blur(8px);border-radius:var(--radius-sm,8px);color:var(--color-text-primary,#e0e0e0);cursor:pointer;--mouse-x:50%;--mouse-y:50%;--spotlight-color:#ffffff40;background:#2323238c;border:1px solid #ffffff14;justify-content:center;align-items:center;gap:.5rem;padding:.75rem 1.5rem;font-weight:500;transition:all .3s;display:inline-flex;position:relative;overflow:hidden}.spotlight-btn:before{content:"";background:radial-gradient(circle 80px at var(--mouse-x) var(--mouse-y), var(--spotlight-color), transparent 100%);opacity:0;pointer-events:none;z-index:0;transition:opacity .3s;position:absolute;inset:0}.spotlight-btn>*{z-index:1;position:relative}.spotlight-btn:hover{border-color:#fff3;transform:translateY(-2px);box-shadow:0 8px 32px #0000002e}.spotlight-btn:hover:before{opacity:1}.spotlight-btn.primary{background:var(--color-accent,#6f767e);border-color:#ffffff1a}.spotlight-btn.primary:hover{background:#7a828b}.spotlight-btn.icon-only{border-radius:50%;padding:.75rem}.tilted-card-figure{perspective:800px;border-radius:inherit;flex-direction:column;width:100%;height:100%;margin:0;display:flex;position:relative}.tilted-card-mobile-alert{text-align:center;font-size:.875rem;display:none;position:absolute;top:1rem}@media (width<=640px){.tilted-card-mobile-alert,.tilted-card-caption{display:none}}.tilted-card-inner{transform-style:preserve-3d;border-radius:inherit;width:100%;height:100%;position:relative}.tilted-card-img{object-fit:cover;will-change:transform;border-radius:15px;position:absolute;top:0;left:0;transform:translateZ(0)}.tilted-card-overlay{z-index:2;will-change:transform;position:absolute;top:0;left:0;transform:translateZ(30px)}.tilted-card-caption{pointer-events:none;color:#2d2d2d;opacity:0;z-index:3;background-color:#fff;border-radius:4px;padding:4px 10px;font-size:10px;position:absolute;top:0;left:0}.card-spotlight{border-radius:inherit;--mouse-x:50%;--mouse-y:50%;--spotlight-color:#ffffff0d;flex-direction:column;width:100%;height:100%;display:flex;position:relative;overflow:hidden}.card-spotlight:before{content:"";background:radial-gradient(circle at var(--mouse-x) var(--mouse-y), var(--spotlight-color), transparent 80%);opacity:0;pointer-events:none;z-index:0;transition:opacity .5s;position:absolute;inset:0}.card-spotlight:hover:before,.card-spotlight:focus-within:before{opacity:1}.border-glow-card{--edge-proximity:0;--cursor-angle:45deg;--edge-sensitivity:30;--color-sensitivity:calc(var(--edge-sensitivity) + 20);--border-radius:16px;--glow-padding:40px;--cone-spread:25;border-radius:var(--border-radius);isolation:isolate;border:1px solid var(--color-glass-border);background:var(--card-bg,transparent);flex-direction:column;width:100%;height:100%;display:flex;position:relative;overflow:visible;transform:translateZ(.01px)}.border-glow-card:before,.border-glow-card:after,.border-glow-card>.edge-light{content:"";border-radius:inherit;z-index:-1;pointer-events:none;transition:opacity .25s ease-out;position:absolute;inset:0}.border-glow-card:not(:hover):not(.sweep-active):before,.border-glow-card:not(:hover):not(.sweep-active):after,.border-glow-card:not(:hover):not(.sweep-active)>.edge-light{opacity:0;transition:opacity .75s ease-in-out}.border-glow-card:before{background:linear-gradient(var(--card-bg,transparent) 0 100%) padding-box, linear-gradient(#fff0 0% 100%) border-box, var(--gradient-one,radial-gradient(at 80% 55%, #be85ff 0px, transparent 50%)) border-box, var(--gradient-two,radial-gradient(at 69% 34%, #ff7a93 0px, transparent 50%)) border-box, var(--gradient-three,radial-gradient(at 8% 6%, #8fffad 0px, transparent 50%)) border-box, var(--gradient-four,radial-gradient(at 41% 38%, #47daff 0px, transparent 50%)) border-box, var(--gradient-five,radial-gradient(at 86% 85%, #7af2ff 0px, transparent 50%)) border-box, var(--gradient-six,radial-gradient(at 82% 18%, #ffe74c 0px, transparent 50%)) border-box, var(--gradient-seven,radial-gradient(at 51% 4%, #ff8d70 0px, transparent 50%)) border-box, var(--gradient-base,linear-gradient(#c299ff 0 100%)) border-box;opacity:calc((var(--edge-proximity) - var(--color-sensitivity)) / (100 - var(--color-sensitivity)));-webkit-mask-image:conic-gradient(from var(--cursor-angle) at center, black calc(var(--cone-spread) * 1%), transparent calc((var(--cone-spread) + 15) * 1%), transparent calc((100 - var(--cone-spread) - 15) * 1%), black calc((100 - var(--cone-spread)) * 1%));mask-image:conic-gradient(from var(--cursor-angle) at center, black calc(var(--cone-spread) * 1%), transparent calc((var(--cone-spread) + 15) * 1%), transparent calc((100 - var(--cone-spread) - 15) * 1%), black calc((100 - var(--cone-spread)) * 1%));border:1px solid #0000}.border-glow-card:after{background:var(--gradient-one,radial-gradient(at 80% 55%, #be85ff 0px, transparent 50%)) padding-box, var(--gradient-two,radial-gradient(at 69% 34%, #ff7a93 0px, transparent 50%)) padding-box, var(--gradient-three,radial-gradient(at 8% 6%, #8fffad 0px, transparent 50%)) padding-box, var(--gradient-four,radial-gradient(at 41% 38%, #47daff 0px, transparent 50%)) padding-box, var(--gradient-five,radial-gradient(at 86% 85%, #7af2ff 0px, transparent 50%)) padding-box, var(--gradient-six,radial-gradient(at 82% 18%, #ffe74c 0px, transparent 50%)) padding-box, var(--gradient-seven,radial-gradient(at 51% 4%, #ff8d70 0px, transparent 50%)) padding-box, var(--gradient-base,linear-gradient(#c299ff 0 100%)) padding-box;-webkit-mask-image:linear-gradient(to bottom, black, black), radial-gradient(ellipse at 50% 50%, black 40%, transparent 65%), radial-gradient(ellipse at 66% 66%, black 5%, transparent 40%), radial-gradient(ellipse at 33% 33%, black 5%, transparent 40%), radial-gradient(ellipse at 66% 33%, black 5%, transparent 40%), radial-gradient(ellipse at 33% 66%, black 5%, transparent 40%), conic-gradient(from var(--cursor-angle) at center, transparent 5%, black 15%, black 85%, transparent 95%);mask-image:linear-gradient(to bottom, black, black), radial-gradient(ellipse at 50% 50%, black 40%, transparent 65%), radial-gradient(ellipse at 66% 66%, black 5%, transparent 40%), radial-gradient(ellipse at 33% 33%, black 5%, transparent 40%), radial-gradient(ellipse at 66% 33%, black 5%, transparent 40%), radial-gradient(ellipse at 33% 66%, black 5%, transparent 40%), conic-gradient(from var(--cursor-angle) at center, transparent 5%, black 15%, black 85%, transparent 95%);opacity:calc(var(--fill-opacity,.5) * (var(--edge-proximity) - var(--color-sensitivity)) / (100 - var(--color-sensitivity)));mix-blend-mode:soft-light;border:1px solid #0000;-webkit-mask-composite:source-out,source-over,source-over,source-over,source-over,source-over;mask-composite:subtract,add,add,add,add,add}.border-glow-card>.edge-light{inset:calc(var(--glow-padding) * -1);pointer-events:none;z-index:-1;-webkit-mask-image:conic-gradient(from var(--cursor-angle) at center, black 2.5%, transparent 10%, transparent 90%, black 97.5%);mask-image:conic-gradient(from var(--cursor-angle) at center, black 2.5%, transparent 10%, transparent 90%, black 97.5%);opacity:calc((var(--edge-proximity) - var(--edge-sensitivity)) / (100 - var(--edge-sensitivity)));mix-blend-mode:plus-lighter}.border-glow-card>.edge-light:before{content:"";inset:var(--glow-padding);border-radius:inherit;box-shadow:inset 0 0 0 1px var(--glow-color,#f5daa3), inset 0 0 1px 0 var(--glow-color-60,#f5daa399), inset 0 0 3px 0 var(--glow-color-50,#f5daa380), inset 0 0 6px 0 var(--glow-color-40,#f5daa366), inset 0 0 15px 0 var(--glow-color-30,#f5daa34d), inset 0 0 25px 2px var(--glow-color-20,#f5daa333), inset 0 0 50px 2px var(--glow-color-10,#f5daa31a), 0 0 1px 0 var(--glow-color-60,#f5daa399), 0 0 3px 0 var(--glow-color-50,#f5daa380), 0 0 6px 0 var(--glow-color-40,#f5daa366), 0 0 15px 0 var(--glow-color-30,#f5daa34d), 0 0 25px 2px var(--glow-color-20,#f5daa333), 0 0 50px 2px var(--glow-color-10,#f5daa31a);position:absolute}.border-glow-inner{z-index:1;border-radius:inherit;flex-direction:column;flex:1;height:100%;display:flex;position:relative}:root{--folder-color:#70a1ff;--folder-back-color:#4785ff;--paper-1:#d9d9d9;--paper-2:#e6e6e6;--paper-3:#f2f2f2;--paper-4:#fff}.folder{cursor:pointer;transition:all .2s ease-in;display:inline-block}.folder:not(.folder--click):hover{transform:translateY(-8px)}.folder:not(.folder--click):hover .paper{transform:translate(-50%)}.folder:not(.folder--click):hover .folder__front{transform:skew(15deg)scaleY(.6)}.folder:not(.folder--click):hover .right{transform:skew(-15deg)scaleY(.6)}.folder.open{transform:translateY(-8px)}.folder.open .paper:first-child{height:80%;transform:translate(-140%,-60%)rotate(-15deg)}.folder.open .paper:first-child:hover{z-index:10;transform:translate(-140%,-60%)rotate(-15deg)scale(1.05)}.folder.open .paper:nth-child(2){height:80%;transform:translate(-60%,-90%)rotate(-5deg)}.folder.open .paper:nth-child(2):hover{z-index:10;transform:translate(-60%,-90%)rotate(-5deg)scale(1.05)}.folder.open .paper:nth-child(3){height:80%;transform:translate(20%,-90%)rotate(5deg)}.folder.open .paper:nth-child(3):hover{z-index:10;transform:translate(20%,-90%)rotate(5deg)scale(1.05)}.folder.open .paper:nth-child(4){height:80%;transform:translate(60%,-60%)rotate(15deg)}.folder.open .paper:nth-child(4):hover{z-index:10;transform:translate(60%,-60%)rotate(15deg)scale(1.05)}.folder.open .folder__front{transform:skew(15deg)scaleY(.6)}.folder.open .right{transform:skew(-15deg)scaleY(.6)}.folder__back{background:var(--folder-back-color);border-radius:0 30px 30px;width:400px;height:320px;position:relative}.folder__back:after{z-index:0;content:"";background:var(--folder-back-color);border-radius:15px 15px 0 0;width:120px;height:30px;position:absolute;bottom:98%;left:0}.paper{z-index:2;border-radius:20px;width:85%;height:90%;transition:all .3s ease-in-out;position:absolute;bottom:10%;left:50%;transform:translate(-50%,10%);box-shadow:none!important;background:0 0!important}.paper:nth-child(2){background:var(--paper-2)}.paper:nth-child(3){background:var(--paper-3)}.paper:nth-child(4){background:var(--paper-4)}.folder__front{z-index:3;background:var(--folder-color);transform-origin:bottom;border-radius:15px 30px 30px;width:100%;height:100%;transition:all .3s ease-in-out;position:absolute}.card-swap-container{perspective:900px;margin:0 auto;position:relative;overflow:visible}.card{transform-style:preserve-3d;will-change:transform;backface-visibility:hidden;background:#000;border:1px solid #fff;border-radius:12px;position:absolute;top:50%;left:50%}@media (width<=768px){.card-swap-container{transform:scale(.75)}}@media (width<=480px){.card-swap-container{transform:scale(.55)}}.ferrofluid-container{width:100%;height:100%;position:relative;overflow:hidden}
