*{box-sizing:border-box;margin:0;padding:0}html{overflow:hidden}a,button{-webkit-tap-highlight-color:rgba(0,0,0,0)}@keyframes bg-move{0%{transform:translate(0, 0)}100%{transform:translate(-40px, -40px)}}body{background-color:#1a1515;background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" viewBox="0 0 40 40"><circle cx="20" cy="20" r="1.5" fill="%23aa8c32" opacity="0.15"/><circle cx="10" cy="10" r="1.5" fill="%23aa8c32" opacity="0.15"/><circle cx="30" cy="30" r="1.5" fill="%23aa8c32" opacity="0.15"/></svg>');background-size:20px 20px;background-repeat:repeat;color:#f0e6be;font-family:"Poppins",sans-serif;font-size:16px;line-height:1.6;position:relative}body::before{content:"";position:fixed;top:0;left:0;width:200vw;height:200vh;pointer-events:none;z-index:0;background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" viewBox="0 0 40 40"><circle cx="20" cy="20" r="1.5" fill="%23aa8c32" opacity="0.08"/><circle cx="10" cy="10" r="1.5" fill="%23aa8c32" opacity="0.08"/><circle cx="30" cy="30" r="1.5" fill="%23aa8c32" opacity="0.08"/></svg>');background-size:40px 40px;background-repeat:repeat;opacity:.7;animation:bg-move 12s linear infinite}nav{position:fixed;left:16px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:16px;background-color:#2a2525;padding:12px;border-radius:999px;box-shadow:0 2px 4px rgba(0,0,0,.2);z-index:1000}nav #nav-track{position:absolute;background-color:#aa8c32;top:12px;left:12px;width:36px;height:36px;border-radius:50%;transition:all 400ms cubic-bezier(0.34, 1.56, 0.64, 1);z-index:0}nav a{opacity:.5;color:#f0e6be;text-decoration:none;width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:opacity 300ms ease-out,color 300ms ease-out;z-index:1}nav a:hover{opacity:1}nav a.active{opacity:1;color:#1a1515}nav a i{font-size:1.5rem}main{width:100vw;height:100vh;position:relative}main section{width:100vw;height:100vh;display:flex;flex-direction:column;justify-content:flex-start;align-items:center;padding:92px 40px;gap:16px;position:absolute;inset:0;overflow-y:auto;opacity:0;pointer-events:none;transition:opacity 300ms ease-in-out}main section.active{opacity:1;pointer-events:auto;z-index:1}main section#home{justify-content:center}main section#home #logo{width:500px;max-width:100%;fill:#f0e6be}@keyframes drop-in{0%{opacity:0;transform:translateY(-100%)}60%{opacity:1;transform:translateY(10%)}80%{transform:translateY(-5%)}100%{opacity:1;transform:translateY(0)}}main section#home #logo path{opacity:0;transform-origin:50% 50%;animation:drop-in .8s cubic-bezier(0.34, 1.56, 0.64, 1) forwards}main section#home #logo path:nth-child(1){animation-delay:.1s}main section#home #logo path:nth-child(2){animation-delay:.2s}main section#home #logo path:nth-child(3){animation-delay:.3s}main section#home #logo path:nth-child(4){animation-delay:.4s}main section#home #logo path:nth-child(5){animation-delay:.5s}main section#home #logo path:nth-child(6){animation-delay:.6s}main section#home #socials{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;position:relative}@keyframes cover-expand{0%{width:0;height:0;opacity:0}75%{width:100%;height:100%;opacity:1}100%{width:0;height:0}}@keyframes fade-in{to{opacity:1;pointer-events:auto}}main section#home #socials:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:0;height:0;background-color:#aa8c32;border-radius:999px;animation:cover-expand 1.4s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;z-index:100}main section#home #socials a{position:relative;display:flex;align-items:center;justify-content:center;width:64px;height:48px;text-decoration:none;z-index:2;opacity:0;animation:fade-in 0s forwards;animation-delay:1s;pointer-events:none}main section#home #socials a svg{width:24px;height:24px;fill:#f0e6be;flex-shrink:0}main section#home #socials #handle-tooltip{position:absolute;height:48px;width:0;background-color:#aa8c32;border-radius:999px;transition:all 300ms cubic-bezier(0.34, 1.56, 0.64, 1);z-index:1;pointer-events:none;color:#f0e6be;font-weight:700;white-space:nowrap;line-height:48px;opacity:0}main section h2{font-size:3rem;margin-bottom:32px;color:#f0e6be}main section .card-container{display:flex;flex-wrap:wrap;justify-content:center;gap:16px;width:100%;max-width:1000px}main section .card{background-color:#3c3535;color:#f0e6be;padding:32px;border-radius:16px;box-shadow:0 4px 8px rgba(0,0,0,.2);text-align:center;flex:1;min-width:300px;transition:outline-color 300ms ease-out,box-shadow 300ms ease-out;display:flex;flex-direction:column;align-items:center;gap:8px;outline:solid rgba(0,0,0,0) 2px}main section .card:hover{outline-color:#c8aa55;box-shadow:0 8px 16px rgba(0,0,0,.2)}main section .card i{font-size:2.5rem;margin-bottom:8px;color:#c8aa55}main section .card h3{font-size:1.5rem;font-weight:700}main section .card p{margin-bottom:16px;max-width:250px}main section .card a{color:#f0e6be;text-decoration:none;font-weight:700;transition:color 300ms ease-out}main section .card a:hover{color:#c8aa55}main section .card pre{text-align:left;white-space:pre-wrap;word-break:break-all;background-color:#5a5139;color:#f0e6be;padding:16px;border-radius:8px;margin-bottom:16px;font-size:.8rem;width:100%}main section .card button{background-color:#c8aa55;color:#1a1515;border:none;padding:12px 24px;border-radius:999px;font-weight:700;cursor:pointer;transition:background-color 300ms ease-out;display:inline-flex;align-items:center;gap:8px}main section .card button:hover{background-color:hsl(44.347826087,51.1111111111%,39.1176470588%)}main section .card button i{font-size:1.2rem;margin:0;color:#1a1515}@media(max-width: 768px){nav{left:50%;top:auto;bottom:16px;transform:translateX(-50%);flex-direction:row}main section h2{font-size:2.5rem}}
