html{scroll-behavior:smooth}*{margin:0;padding:0;box-sizing:border-box;font-family:Fira Code}.fira-code{font-family:Fira Code,monospace;font-optical-sizing:auto;font-weight:400;font-style:normal}body{display:flex;flex-direction:column;background-color:#121913}span{color:#4f772d}.app-container{width:100%;height:100%}.click-effect{position:fixed;pointer-events:none}.click-effect-line{position:absolute;background:#ffffffb3;width:2px;height:0;top:50%;transform:translateY(-50%);animation:click-effect-expand 1s ease-out}.click-effect-line:nth-child(1){left:-8px;animation-delay:0s}.click-effect-line:nth-child(2){left:-4px;animation-delay:.1s}.click-effect-line:nth-child(3){left:0;animation-delay:.2s}.click-effect-line:nth-child(4){left:4px;animation-delay:.3s}.click-effect-line:nth-child(5){left:8px;animation-delay:.4s}@keyframes click-effect-expand{0%{height:0;opacity:1}50%{height:15px;opacity:.7}to{height:30px;opacity:0}}.navigation-container{display:flex!important;justify-content:space-between!important;padding:20px 10px;background-color:#132a13;position:sticky;top:0;z-index:10;width:100%;max-width:100%;box-sizing:border-box}.first-section{display:flex;align-items:center;gap:0px 10px;color:#ecf39e}.second-section{display:flex;align-items:center;gap:0px 10px}@media (min-width: 600px){.sidebar-nav{display:none}}.second-section .button:hover{color:#ecf39e;cursor:pointer}.button{border:none;background-color:#132a13;color:#abb2bf;cursor:pointer;pad:10px;font-size:1.2rem}@media (max-width: 600px){.button{border:none;background-color:#132a13;color:#abb2bf;cursor:pointer;padding:10px;font-size:1.3rem;width:100%;text-align:left}}.header-container{display:flex;justify-content:space-between;align-items:center;min-height:80vh;width:100%;padding:0 20px;box-sizing:border-box;color:#fff;background-color:#0000004d}.text-container{display:flex;flex-direction:column;justify-content:center;align-items:center;flex:1;height:100%;max-width:800px;gap:20px}.text-container p{font-size:1.5rem}.photo-container{flex:1;display:flex;justify-content:center;align-items:center}.logo-img{max-width:500px;height:auto}@media (max-width: 600px){.header-container{flex-direction:column;justify-content:center;align-items:center;padding:40px 20px;min-height:auto;text-align:center}.title{font-size:1.5rem}.text-container{max-width:100%;gap:16px;font-size:1rem;text-align:left}.text-container p{font-size:1rem;line-height:1.5}.photo-container{margin-top:15%;width:80%}.logo-img{max-width:80%;height:auto}}.title-container{display:flex;flex-direction:column;align-items:center;justify-content:center;max-width:100%;padding:20px 40px;color:#fff;font-size:1.5rem}.title-name{display:flex;align-items:center;width:100%}hr{flex-grow:1;border:none;height:2px;background-color:#4f772d;margin-left:10px}@media (max-width: 600px){.title-container{font-size:1.1rem;padding-top:10%;padding-bottom:10%;padding-left:1%;display:flex;flex-direction:column;align-items:start;justify-content:start}.title-name{text-align:left}}.about-container{color:#fff;min-height:80vh;display:flex;flex-direction:column;justify-content:center;padding:0 40px}.about-title{margin-bottom:40px}.about-text{line-height:1.6;margin-bottom:20px;font-size:1.2rem}.about-container h3,.about-container h1{margin-bottom:20px;color:#ecf39e}@media (max-width: 600px){.about-container{padding:0 20px;min-height:auto;justify-content:flex-start}.about-title{font-size:1.5rem;margin-bottom:20px;text-align:center}.about-text{font-size:1rem;line-height:1.5;margin-bottom:16px;text-align:justify}.about-container h1,.about-container h3{font-size:1.3rem;text-align:center}}.projects-title-container{background-color:#0000004d}.project-container{width:100%;display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:minmax(300px,auto);gap:10px;padding-left:20px;box-sizing:border-box;background-color:#0000004d}.description-container{display:flex;flex-direction:column;justify-content:center;align-items:start;gap:20px;padding:0 10px}.description-container button{padding:5px 20px;background-color:#121913;color:#fff;border:2px solid #4f772d;margin-bottom:10px}.description-container button:hover{transform:scale(1.1);cursor:pointer}.card{width:100%;max-width:100%;box-sizing:border-box;align-self:start}@media (max-width: 600px){.project-container{grid-template-columns:1fr;grid-auto-rows:auto;padding-left:10px;gap:20px}.description-container{align-items:center;text-align:center;padding:0 20px}.description-container button{width:100%;max-width:250px;font-size:1rem}.card{width:100%;max-width:100%;margin:0 auto}}.card-container{display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;color:#fff;border:2px solid #4f772d;padding:10px;max-width:400px;height:auto}.image-container,.tech-container,.description-container{padding:10px}.tech-container,.description-container{margin-top:10px}.image-container{position:relative;display:flex;justify-content:center;align-items:center;width:100%;height:250px;border:2px solid white;overflow:hidden}.image-container img{width:auto;max-width:100%;height:auto;max-height:250px;object-fit:contain}.project-image{position:absolute;width:100%;height:100%;object-fit:contain;transition:opacity .5s ease-in-out}.logo-img{opacity:1;z-index:1}.landing-img{opacity:0;z-index:0}.card-container:hover .landing-img{opacity:1;transition:opacity .5s ease-in-out}.card-container:hover .logo-img{opacity:0;transition:opacity .5s ease-in-out}.tech-container{max-width:100%;max-height:100%;border-left:2px solid white;border-right:2px solid white}.description-container{max-width:100%;max-height:100%;border:2px solid white}.description-container button:hover{transform:none;color:#ecf39e;cursor:pointer}.card-container:hover{transform:scale(1.02);transition:transform .2s ease-in-out}.skill-container{min-height:70vh;max-width:100%;display:flex;justify-content:space-between;color:#fff}.tech-container{padding:0 10px;display:flex;align-items:center}.interactive-container{flex:1;display:flex;align-items:center;justify-content:center}.skill-card-container{flex:1;display:grid;grid-template-columns:repeat(3,1fr);gap:20px;justify-content:center;align-items:center}@media (max-width: 600px){.skill-container{flex-direction:column;align-items:center;justify-content:flex-start;padding:40px 20px;min-height:auto;text-align:center}.interactive-container{width:100%;margin-bottom:30px}.skill-card-container{grid-template-columns:1fr;gap:16px;width:100%;padding:0 10px}.tech-container{justify-content:center;padding:0 10px}}.card-skill-container:hover .skill-card-title-container,.card-skill-container:hover .skill-card-text-container{border-color:#ecf39e;box-shadow:0 0 10px #ecf39e}.skill-card-title{text-align:center}.skill-card-title-container{border:2px solid white}.skill-card-text-container{border:2px solid white;border-top:none}.skill-card-word:before{content:"* ";color:var(--accent-color)}.skill-card-container{padding:20px;gap:20px}.skill-card-container li{list-style-type:none}.card-skill-container{transition:transform .3s ease}.card-skill-container:hover{transform:scale(1.05)}.cube-container{perspective:1000px;display:flex;flex-direction:column;justify-content:space-around;align-items:center;height:100vh;width:100%;opacity:0;transition:opacity 1s ease-out}.cube{will-change:transform;width:180px;height:180px;position:relative;transform-style:preserve-3d}.cube-container.visible{opacity:1}.cube-button{background-color:#121913;border:2px solid white;color:#fff;padding:10px;font-size:1.25rem;cursor:pointer;transition:transform .3s ease}.cube-button:hover{transform:scale(1.1)}.face{position:absolute;width:180px;height:180px;background-color:#fff3;display:flex;align-items:center;justify-content:center;border:2px solid #ecf39e;box-shadow:0 0 20px #ecf39e;font-size:20px;font-weight:700}.front{transform:rotateY(0) translateZ(90px)}.back{transform:rotateY(180deg) translateZ(90px)}.right{transform:rotateY(90deg) translateZ(90px)}.left{transform:rotateY(-90deg) translateZ(90px)}.top{transform:rotateX(90deg) translateZ(90px)}.bottom{transform:rotateX(-90deg) translateZ(90px)}.animated{animation:rotateCube 15s infinite linear}@keyframes rotateCube{0%{transform:rotateX(0) rotateY(0)}to{transform:rotateX(360deg) rotateY(360deg)}}.contact-container{display:flex;flex-direction:column;min-height:30vh;font-size:1.2rem;align-items:center;justify-content:center;background-color:#0000004d}.contact-title-container{background-color:#0000004d}.contact-info-container{color:#fff;display:flex;justify-content:space-around}.contact-text{max-width:50%}.contact-card{border:1px solid #ecf39e;height:50%;padding:10px;display:flex;flex-direction:column;justify-content:space-between;gap:10px}.contact-card p{padding:10px;text-align:center;font-weight:700}.contact-icon-container{display:flex;flex-direction:column;align-items:center}.icon-text{gap:5px;padding:0 10px;display:flex;align-items:center;justify-content:center}.icon-text p{font-weight:400;color:#ecf39e}.icon-text a{text-decoration:none;color:#fff}.icon-text a:hover{color:#ecf39e}.icon-envelope{color:#ecf39e;height:1rem}.copy-button{background-color:#121913;color:#fff;border:none;padding:5px 20px;cursor:pointer}.copy-button img{height:1rem}.sound-container{position:relative;flex:1 1;display:flex;justify-content:center;align-items:center;height:100%;overflow:hidden}.sound{position:absolute;height:50px;background-color:#ecf39e;clip-path:polygon(0% 50%,1% 0%,1% 50%,2% 0%,2% 50%,3% 0%,3% 50%,4% 0%,4% 50%,5% 0%,5% 50%,6% 0%,6% 50%,7% 0%,7% 50%,8% 0%,8% 50%,9% 0%,9% 50%,10% 0%,10% 50%,11% 0%,11% 50%,12% 0%,12% 50%,13% 0%,13% 50%,14% 0%,14% 50%,15% 0%,15% 50%,16% 0%,16% 50%,17% 0%,17% 50%,18% 0%,18% 50%,19% 0%,19% 50%,20% 0%,20% 50%,21% 0%,21% 50%,22% 0%,22% 50%,23% 0%,23% 50%,24% 0%,24% 50%,25% 0%,25% 50%,26% 0%,26% 50%,27% 0%,27% 50%,28% 0%,28% 50%,29% 0%,29% 50%,30% 0%,30% 50%,31% 0%,31% 50%,32% 0%,32% 50%,33% 0%,33% 50%,34% 0%,34% 50%,35% 0%,35% 50%,36% 0%,36% 50%,37% 0%,37% 50%,38% 0%,38% 50%,39% 0%,39% 50%,40% 0%,40% 50%,41% 0%,41% 50%,42% 0%,42% 50%,43% 0%,43% 50%,44% 0%,44% 50%,45% 0%,45% 50%,46% 0%,46% 50%,47% 0%,47% 50%,48% 0%,48% 50%,49% 0%,49% 50%,50% 0%,50% 50%,51% 0%,51% 50%,52% 0%,52% 50%,53% 0%,53% 50%,54% 0%,54% 50%,55% 0%,55% 50%,56% 0%,56% 50%,57% 0%,57% 50%,58% 0%,58% 50%,59% 0%,59% 50%,60% 0%,60% 50%,61% 0%,61% 50%,62% 0%,62% 50%,63% 0%,63% 50%,64% 0%,64% 50%,65% 0%,65% 50%,66% 0%,66% 50%,67% 0%,67% 50%,68% 0%,68% 50%,69% 0%,69% 50%,70% 0%,70% 50%,71% 0%,71% 50%,72% 0%,72% 50%,73% 0%,73% 50%,74% 0%,74% 50%,75% 0%,75% 50%,76% 0%,76% 50%,77% 0%,77% 50%,78% 0%,78% 50%,79% 0%,79% 50%,80% 0%,80% 50%,81% 0%,81% 50%,82% 0%,82% 50%,83% 0%,83% 50%,84% 0%,84% 50%,85% 0%,85% 50%,86% 0%,86% 50%,87% 0%,87% 50%,88% 0%,88% 50%,89% 0%,89% 50%,90% 0%,90% 50%,91% 0%,91% 50%,92% 0%,92% 50%,93% 0%,93% 50%,94% 0%,94% 50%,95% 0%,95% 50%,96% 0%,96% 50%,97% 0%,97% 50%,98% 0%,98% 50%,99% 0%,99% 50%,100% 100%,100% 50%,100% 100%,98% 50%,99% 100%,97% 50%,98% 100%,96% 50%,97% 100%,95% 50%,96% 100%,94% 50%,95% 100%,93% 50%,94% 100%,92% 50%,93% 100%,91% 50%,92% 100%,90% 50%,91% 100%,89% 50%,90% 100%,88% 50%,89% 100%,87% 50%,88% 100%,86% 50%,87% 100%,85% 50%,86% 100%,84% 50%,85% 100%,83% 50%,84% 100%,82% 50%,83% 100%,81% 50%,82% 100%,80% 50%,81% 100%,79% 50%,80% 100%,78% 50%,79% 100%,77% 50%,78% 100%,76% 50%,77% 100%,75% 50%,76% 100%,74% 50%,75% 100%,73% 50%,74% 100%,72% 50%,73% 100%,71% 50%,72% 100%,70% 50%,71% 100%,69% 50%,70% 100%,68% 50%,69% 100%,67% 50%,68% 100%,66% 50%,67% 100%,65% 50%,66% 100%,64% 50%,65% 100%,63% 50%,64% 100%,62% 50%,63% 100%,61% 50%,62% 100%,60% 50%,61% 100%,59% 50%,60% 100%,58% 50%,59% 100%,57% 50%,58% 100%,56% 50%,57% 100%,55% 50%,56% 100%,54% 50%,55% 100%,53% 50%,54% 100%,52% 50%,53% 100%,51% 50%,52% 100%,50% 50%,51% 100%,49% 50%,50% 100%,48% 50%,49% 100%,47% 50%,48% 100%,46% 50%,47% 100%,45% 50%,46% 100%,44% 50%,45% 100%,43% 50%,44% 100%,42% 50%,43% 100%,41% 50%,42% 100%,40% 50%,41% 100%,39% 50%,40% 100%,38% 50%,39% 100%,37% 50%,38% 100%,36% 50%,37% 100%,35% 50%,36% 100%,34% 50%,35% 100%,33% 50%,34% 100%,32% 50%,33% 100%,31% 50%,32% 100%,30% 50%,31% 100%,29% 50%,30% 100%,28% 50%,29% 100%,27% 50%,28% 100%,26% 50%,27% 100%,25% 50%,26% 100%,24% 50%,25% 100%,23% 50%,24% 100%,22% 50%,23% 100%,21% 50%,22% 100%,20% 50%,21% 100%,19% 50%,20% 100%,18% 50%,19% 100%,17% 50%,18% 100%,16% 50%,17% 100%,15% 50%,16% 100%,14% 50%,15% 100%,13% 50%,14% 100%,12% 50%,13% 100%,11% 50%,12% 100%,10% 50%,11% 100%,9% 50%,10% 100%,8% 50%,9% 100%,7% 50%,8% 100%,6% 50%,7% 100%,5% 50%,6% 100%,4% 50%,5% 100%,3% 50%,4% 100%,2% 50%,3% 100%,1% 50%,2% 100%,0% 50%);width:100%;animation:slideIn 2s ease-in-out infinite}@keyframes slideIn{0%{transform:translate(100%)}50%{transform:translate(0)}to{transform:translate(-100%)}}@media (max-width: 600px){.contact-container{padding:40px 20px;font-size:1rem;min-height:auto;text-align:center}.contact-info-container{flex-direction:column;align-items:center;gap:20px;padding:20px 0}.contact-text{max-width:100%;padding:0 20px;display:flex;flex-direction:column;align-items:center;gap:30px}.contact-card{width:100%;height:auto;padding:20px}.contact-card p{font-size:1rem;padding:8px}.contact-icon-container{width:100%;margin-top:20px}.icon-text{flex-direction:column;gap:10px;padding:10px 0}.copy-button{width:100%;max-width:250px;font-size:1rem;margin-top:10px}.sound-container{height:60px;margin-top:30px}.sound{height:40px}}.footer-container{color:#fff;border-top:2px solid rgba(255,255,255,.2);padding:40px 20px}.footer-content{max-width:1200px;margin:0 auto;text-align:center;display:flex;flex-direction:column;gap:10px}.footer-text{font-size:.9rem;opacity:.7}.footer-copyright{font-size:.85rem;opacity:.5}.navigation-container{position:sticky;top:0;z-index:60;background-color:#132a13;padding:10px 10px 10px 50px;display:flex;justify-content:space-between;align-items:center}.hamburger-button{position:fixed;left:10px;z-index:100;font-size:1.8rem;background:none;border:none;color:#ecf39e;cursor:pointer}.sidebar{position:fixed;top:60px;left:-100%;width:70%;background-color:#121913;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding:20px;transition:left .3s ease-in-out;z-index:50;border-top:1px solid #ecf39e}.sidebar.open{left:0}.sidebar-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#0006;z-index:40}.sidebar a{color:#fff;text-decoration:none;margin-bottom:20px;font-size:1.2rem}.sidebar a:hover{color:#ecf39e}.logo{margin-left:20px;font-size:1.2rem;color:#ecf39e}
