.hero-container{background-color:var(--background-color);color:var(--text-color)}.hero-container h1 i{color:var(--text-color)}h1{font-size:3rem}.hero-container h1 i{position:relative;display:inline-block;overflow:hidden;margin-bottom:-10px}.hero-container h1 i:after{content:"";position:absolute;left:0;bottom:2px;width:100%;height:2px;background-color:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .7s ease;transition-delay:.5s}.main:hover .hero-container h1 i:after{transform:scaleX(1)}.hover-text{color:var(--text-color);background-color:var(--background-color)}[data-theme=dark] .hover-text{color:#fff;background-color:var(--background-color)}.hero-image-container{position:relative;display:flex;flex-direction:column;align-items:center;padding-bottom:3rem}.p5-sketch{display:flex;justify-content:center;align-items:center;width:100%;overflow-x:hidden;opacity:.9}.p5-sketch canvas{display:block;margin:0}.hover-text{position:absolute;color:#131313;font-size:.75rem;background-color:var(--background-color);padding:.5rem 1rem;border-radius:5px;box-shadow:5px 5px 15px #000;transform:translate(1%,-10%);pointer-events:none}.about{background-color:var(--background-color);color:var(--text-color)}.about a{color:var(--accent-color)}.about{margin:3rem 1rem}.about p{font-size:1.5rem}.about i{font-size:1rem}.about a{text-decoration-color:#4d7292;color:#4d7292}.separator{width:100%;height:2px;color:#252525;padding:0}#bot{margin-top:2rem}.projects-container{background-color:var(--background-color);color:var(--text-color)}.project{position:relative;padding:.1rem 1rem 1.2rem 1.75rem;cursor:pointer;font-size:1.3rem;border-radius:4px;transition:box-shadow .3s ease;background-color:var(--background-color);color:var(--text-color);border:none}.project i{color:var(--text-color);transition:color .3s ease}[data-theme=dark] .project:hover i{color:#a2a2a2}.project p{font-size:clamp(.75rem,1.25vw,2rem)}.projects-container h2{color:var(--text-color)}.project:hover{box-shadow:inset 0 0 12px var(--shadow);background-color:var(--secondary-color)}.projects-container h2{position:relative;display:inline-block;overflow:hidden;font-size:2.5rem}.projects-container h2:after{content:"";position:absolute;left:0;bottom:2px;width:100%;height:2px;background-color:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .5s ease;transition-delay:.35s}.projects-container:hover h2:after{transform:scaleX(1)}.project h3{margin-bottom:-7px}.project i{color:#6c706ece;font-family:Courier New,Courier,monospace;font-weight:400;font-size:smaller}.tags{display:flex;gap:.5rem}.tag{background-color:#5a59594c;padding:.3rem .5rem;border-radius:4px;font-size:clamp(.5rem,1vw,.75rem);opacity:.9}.tag-react{background-color:#339bb4;color:#e4f0f0}.tag-vue{background-color:#41b883;color:#c6f0dd}.tag-html{background-color:#e34c26;color:#fec8ba}.tag-css{background-color:#639;color:#e1c4ff}.tag-js{background-color:#f8e14b;color:#7b6b03}.tag-pfive{background-color:#da3960;color:#ffc8d6}.tag-wp{background-color:#21759b;color:#ccecfb}.tag-php{background-color:#8993be;color:#d4dcfe}.project-preview{position:fixed;width:clamp(298px,30vw,500px);height:auto;aspect-ratio:298 / 184;border:2px solid #292929;border-radius:10px;pointer-events:none;z-index:10;overflow:hidden;box-shadow:2px 4px 25px #00000080}.project-preview video{object-fit:cover;width:100%;height:100%;border-radius:10px}.contact-container{background-color:var(--background-color);color:var(--text-color)}.contact-container h2{color:var(--text-color);transition:color .3s ease}.contact-container i,.contact-container a{color:var(--text-color)}.contact-container h2{position:relative;display:inline-block;overflow:hidden;font-size:2.5rem}.contact-container h2:after{content:"";position:absolute;left:0;bottom:2px;width:100%;height:2px;background-color:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .4s ease;transition-delay:.3s}.contact-container:hover h2:after{transform:scaleX(1)}.contact-container p{font-size:1rem;margin:20px 0 10px}.email-section{width:min-content;display:flex;align-items:center;gap:1rem;padding-left:15px;margin-bottom:3rem;border-radius:5px;font-size:1rem;box-shadow:inset 0 0 5px 1px #2f465a45;color:#555;background-color:#dde3e9}.email{font-weight:700}.copy-button{min-width:7rem;padding:.5rem 1rem;font-size:.9rem;text-align:left;color:#e7e6e6;background-color:#4d7292;border:none;border-radius:5px;cursor:pointer;box-shadow:-2px 0 5px #0000005e;transition:background-color .3s ease}.copy-button:hover{background-color:#43627e}.copy-button i{margin-right:5px;color:#fff}.contact-links{display:flex;gap:1.5rem;margin:2.5rem 0 1rem}.contact-links b{font-weight:300}.contact-links a{font-size:1.2rem;text-decoration:none;display:flex;align-items:center;gap:.5rem;transition:color .3s ease}.contact-links i{transition:color .3s ease}.contact-links a:hover,.contact-links a:hover i{color:#4d7292}:root{--background-color: rgb(206, 214, 217);--project-color: rgb(206, 214, 217);--text-color: rgb(61, 63, 63);--accent-color: #4d72925b;--secondary-color: rgb(206, 214, 217);--shadow: rgb(61, 63, 63);--font-family: "Roboto Mono"}[data-theme=dark]{--background-color: rgb(18, 18, 18);--text-color: rgb(191, 189, 187);--accent-color: #1e2d3d;--secondary-color: #44494c65;--shadow: rgb(5, 6, 9)}body{background-color:var(--background-color);color:var(--text-color);font-family:var(--font-family);transition:background-color .3s ease,color .3s ease}.app{background-color:var(--background-color);color:var(--text-color);box-shadow:0 0 250px 190px var(--background-color)}h1,h2,h3,p,i,a{color:var(--text-color)}h1,h2{margin-bottom:.5rem}p{margin-bottom:1rem}.app{max-width:800px;min-width:200px;margin:0 auto;text-align:left;color:#3d3f3f;background-color:var(--background-color);-webkit-box-shadow:0 0 200 150px #f5f5f5;box-shadow:0 0 250px 190px var(--background-color);padding:1rem 0 4rem}.theme-toggle{position:fixed;top:1rem;right:1rem;width:80px;height:40px;background:var(--secondary-color);border:none;border-radius:40px;box-shadow:inset 0 3px 10px #0006,inset 0 -3px 20px #fff6;cursor:pointer;transition:all .3s ease-in-out;display:flex;align-items:center;justify-content:space-between;padding:5px;z-index:9999}.theme-toggle:after{content:"";position:absolute;width:35px;height:35px;top:50%;left:5px;transform:translateY(-50%);background:linear-gradient(180deg,#5f84a5bb,#4d7292d0);border-radius:50%;box-shadow:-3px -3px 10px #00000040,3px 3px 20px #00000040;transition:all .35s ease-in-out}.theme-toggle i{font-size:1.4rem;position:absolute;top:50%;transform:translateY(-50%);transition:color .3s ease-in-out}.theme-toggle .sun{right:10px;color:var(--text-color)}.theme-toggle .moon{left:10px;color:var(--text-color)}[data-theme=dark] .theme-toggle{background:#242424}[data-theme=dark] .theme-toggle:after{left:calc(100% - 40px);background:linear-gradient(180deg,#777,#3a3a3a)}[data-theme=dark] .theme-toggle .sun{color:#5d5d5d}[data-theme=dark] .theme-toggle .moon{color:#fff}@media (max-width: 600px){.app{box-shadow:none}body{overflow-x:scroll}.about,.projects-container,.contact-container{transform:translate(40px)}.about{margin-right:4rem}.about p{font-size:1rem;padding-right:4rem}.project h3,.project p,.tags{padding-right:4rem}.project:hover{box-shadow:none}.project-preview,.contact-links b{display:none}.contact-links i{font-size:1.6rem}h1{font-size:1.75rem}h2,h3{font-size:1rem}p{font-size:.75rem}.theme-toggle{width:60px;height:30px;top:.5rem;right:.5rem}.theme-toggle:after{width:26px;height:26px;left:3px}.theme-toggle i{font-size:1rem}.theme-toggle .sun{right:6px}.theme-toggle .moon{left:6px}[data-theme=dark] .theme-toggle:after{left:calc(100% - 29px)}}