:root{--bg-primary: #181818;--bg-secondary: #1d1d1d;--text-primary: #ffffff;--text-secondary: #747474ff;--bg-btn-primary: #000000;--bg-btn-primary-hover: #222222;--bg-btn-secondary: #ffffff;--text-oposite: #000000;--bg-baseColor: #252525;--bg-activeColor: #a1a1a1;--title-backdrop: linear-gradient(to right, rgba(255, 255, 255, .05) 0%, rgba(255, 255, 255, .03) 50%, rgba(255, 255, 255, .01) 100%);--bg-projects: linear-gradient(to bottom, var(--bg-primary) 0%, var(--bg-secondary) 100%);--bg-header: #7575751e;--bg-project-card: #202020;--bg-project-card-img: linear-gradient(to right, rgba(255, 255, 255, .04) 1px, transparent 1px), linear-gradient(to bottom, rgba(255, 255, 255, .04) 1px, transparent 1px);--project-number: #272727;--bg-project-tag: rgb(56, 56, 56);--bg-project-tag-border: rgb(136, 136, 136);--box-shadow: 0 5px 10px rgba(0, 0, 0, .3);--box-shadow-hover-avatar: 0 10px 30px rgba(141, 141, 141, .6);--box-shadow-hover-floating-icon: 0 0 20px rgba(155, 155, 155, .8);font-family:sans-serif}html.dark{--bg-primary: #181818;--bg-secondary: #1d1d1d;--text-primary: #ffffff;--text-secondary: #747474ff;--bg-btn-primary: #000000;--bg-btn-primary-hover: #222222;--bg-btn-secondary: #ffffff;--text-oposite: #000000;--bg-baseColor: #252525;--bg-activeColor: #a1a1a1;--title-backdrop: linear-gradient(to right, rgba(255, 255, 255, .05) 0%, rgba(255, 255, 255, .03) 50%, rgba(255, 255, 255, .01) 100%);--bg-projects: linear-gradient(to bottom, var(--bg-primary) 0%, var(--bg-secondary) 100%);--bg-header: #7575751e;--bg-hover-header: rgba(255, 255, 255, .15);--bg-project-card: #202020;--bg-project-card-img: linear-gradient(to right, rgba(255, 255, 255, .04) 1px, transparent 1px), linear-gradient(to bottom, rgba(255, 255, 255, .04) 1px, transparent 1px);--project-number: #272727;--bg-project-tag: rgb(56, 56, 56);--bg-project-tag-border: rgb(136, 136, 136);--box-shadow: 0 5px 10px rgba(0, 0, 0, .3);--box-shadow-hover-avatar: 0 10px 30px rgba(141, 141, 141, .6);--box-shadow-hover-floating-icon: 0 0 20px rgba(155, 155, 155, .8)}html.light{--bg-primary: #ffffff;--bg-secondary: rgb(247, 247, 247);--text-primary: #000000;--text-secondary: #747474ff;--bg-btn-primary: #ffffff;--bg-btn-primary-hover: #d6d6d6;--bg-btn-secondary: #000000;--text-oposite: #ffffff;--bg-baseColor: #dfdfdf;--bg-activeColor: #464646;--title-backdrop: linear-gradient(to right, rgba(0, 0, 0, .08) 0%, rgba(0, 0, 0, .05) 50%, rgba(0, 0, 0, .03) 100%);--bg-projects: linear-gradient(to bottom, var(--bg-primary) 0%, var(--bg-secondary) 100%);--bg-header: #00000015;--bg-hover-header: rgba(100, 100, 100, .15);--bg-project-card: #e4e4e4;--bg-project-card-img: linear-gradient(to right, rgba(0, 0, 0, .06) 1px, transparent 1px), linear-gradient(to bottom, rgba(0, 0, 0, .06) 1px, transparent 1px);--project-number: #d6d6d6;--bg-project-tag: rgb(196, 196, 196);--bg-project-tag-border: rgb(80, 80, 80);--box-shadow: 0 5px 10px rgba(0, 0, 0, .3);--box-shadow-hover-avatar: 0 10px 30px rgba(0, 0, 0, 1);--box-shadow-hover-floating-icon: 0 0 20px rgba(0, 0, 0, 1)}html,body,#root{min-height:100vh;margin:0;padding:0;background:var(--bg-primary);font-family:Montserrat,sans-serif;transition:background-color .4s ease,color .4s ease,border-color .4s ease}.background-container{position:absolute;inset:0;width:100%;height:100dvh;z-index:0;pointer-events:none;overflow:hidden}.content{position:relative}.main-content{display:flex;flex-direction:column;justify-content:center;margin:0 auto;width:100%}.index-container{display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--text-primary);text-align:center;height:100svh;width:75%;margin:0 auto;scroll-margin-top:100px;gap:120px;padding-top:50px}.index-main-content{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-between;width:100%}.avatar-content{display:flex;position:relative;order:2}.floating-icon{position:absolute;width:35px;height:35px;padding:10px;border-radius:50%;background:var(--text-primary);border:2px solid var(--text-secondary);color:var(--text-oposite);display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:600;font-family:monospace;box-shadow:0 5px 20px #0006;transition:all .3s ease}.floating-icon:hover{transform:scale(1.1);border-color:var(--text-primary);box-shadow:var(--box-shadow-hover-floating-icon);z-index:20}@keyframes floating-icon-heroIn{to{opacity:1}}.icon-1{top:10%;left:-12%;transform:translate(-50%);opacity:0;animation:float 3s ease-in-out infinite,floating-icon-heroIn 1s ease forwards;animation-delay:.15s}.icon-2{top:0;right:-10%;opacity:0;animation:float 3.5s ease-in-out infinite,floating-icon-heroIn 1s ease forwards;animation-delay:.25s}.icon-3{bottom:-5%;left:-2%;transform:translate(-50%);opacity:0;animation:float 3.9s ease-in-out infinite,floating-icon-heroIn 1s ease forwards;animation-delay:.45s}.icon-4{bottom:5%;right:-2%;transform:translateY(-50%);opacity:0;animation:float 3s ease-in-out infinite,floating-icon-heroIn 1s ease forwards;animation-delay:.55s}@keyframes float{0%,to{transform:translate(-50%) translateY(0)}50%{transform:translate(-50%) translateY(-10px)}}.avatar-wrapper{width:380px;height:380px;border-radius:50%;border:8px solid var(--text-primary);overflow:hidden;margin:auto 80px auto 0;transition:transform .3s ease,box-shadow .3s ease,border-color .4s ease;box-shadow:0 6px 30px #64646499;animation:avatar-heroIn .5s ease forwards;opacity:0;transform:translateY(150px)}@keyframes avatar-heroIn{to{opacity:1;transform:translateY(0)}}.avatar-wrapper:hover{transform:scale(1.05);box-shadow:var(--box-shadow-hover-avatar)}.avatar-wrapper img{width:100%;height:100%;object-fit:cover}.buttons-container{display:flex;flex-direction:row;gap:30px;align-items:center}.icon-btn{margin-right:10px}.btn-primary,.btn-secondary{display:flex;align-items:center;justify-content:center;padding:13px 22px;border:none;border-radius:10px;font-size:16px;font-weight:600;cursor:pointer;transition:all .3s ease;text-decoration:none}.btn-primary{background-color:var(--bg-btn-primary);color:var(--text-primary);box-shadow:var(--box-shadow)}.btn-secondary{background-color:var(--bg-btn-secondary);color:var(--text-oposite);box-shadow:var(--box-shadow)}.btn-primary:hover{background-color:var(--bg-btn-primary-hover);transform:translateY(-3px)}.btn-secondary:hover{background-color:var(--text-oposite);transform:translateY(-3px);color:var(--text-primary)}.social-contact{display:flex;flex-direction:row;gap:15px}.social-icon{fill:var(--text-primary);transition:all .3s ease}.social-icon:hover{transform:scale(1.1)}@keyframes text-heroIn{to{transform:translate(0)}}.presentation-container{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:25px;max-width:50%;order:1}.title,.sub-title{color:var(--text-primary);margin:0}.title{font-size:60px;font-weight:800;margin-bottom:16px;transform:translate(-100vw);animation:text-heroIn .4s ease forwards}.sub-title{font-size:30px;color:var(--text-secondary);font-weight:700;transform:translate(-100vw);animation:text-heroIn .4s ease forwards;animation-delay:.1s}.description-content{font-size:18px;font-weight:500;text-align:start;color:var(--text-secondary);max-width:70%;line-height:1.6;transform:translate(-100vw);animation:text-heroIn .4s ease forwards;animation-delay:.3s}.span-text{color:var(--text-primary)}.text-content{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;text-align:start}.slider-scrolldown-container{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:40px;width:100%}.slider-wrapper{width:100%;mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,1) 15%,rgba(0,0,0,1) 85%,transparent 100%);-webkit-mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,1) 15%,rgba(0,0,0,1) 85%,transparent 100%)}.scrolldown-container{margin:0;display:flex;justify-content:center;align-items:center}.scrolldown-btn{appearance:none;border:none;background:transparent;cursor:pointer;padding:5px 5px 10px}.scrolldown-img{width:40px;height:auto;color:var(--text-primary);animation:bounce 1.8s infinite}@keyframes bounce{0%,to{transform:translateY(-8px)}50%{transform:translateY(6px)}}.projects-container{width:75%;margin:0 auto}.projects-section{padding-top:40px;min-height:100dvh;background:var(--bg-projects);scroll-margin-top:10px;transition:background-color .4s ease}.about-section{background:var(--bg-primary);padding-top:60px;scroll-margin-top:-5px;transition:background-color .4s ease;min-height:100vh}.about-btn-container{display:flex;align-items:start;justify-content:flex-start;flex-direction:column;gap:10px}.about-container{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:100px;width:75%;margin:80px auto}.about-img{width:350px;height:350px;border-radius:50%}.about-description-container{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:flex-start;margin-bottom:30px;gap:30px}.btn-about-cv-container{display:flex;justify-content:flex-start;align-items:center}.skills-section{background:var(--bg-secondary);min-height:100dvh;transition:background-color .4s ease}.skills-container{display:flex;flex-direction:column;justify-content:center;align-items:center;margin:50px auto 0;width:75%}.contact-section{background:var(--bg-primary);height:auto;transition:background-color .4s ease}.contact-container{width:75%;margin:100px auto}.title-backdrop{display:flex;justify-content:center;position:relative;z-index:1}.title-backdrop:before{content:attr(data-text);text-transform:uppercase;position:absolute;top:50%;left:50%;transform:translateY(-50%) translate(-50%);font-size:80px;font-weight:900;white-space:nowrap;z-index:-1;pointer-events:none;background:var(--title-backdrop);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.title-backdrop h2{color:var(--text-primary);font-size:48px;font-weight:700;position:relative;z-index:2;transition:color .4s ease}.section-description{margin:0 auto;color:var(--text-secondary);text-align:center;font-size:20px;width:50%;line-height:1.5}.footer{border-top:1px solid rgb(63,63,63);padding:20px 0}.footer-container{display:flex;align-items:center;justify-content:space-between;margin:0 auto;width:75%}.btn-footer{appearance:none;border:none;background:none;cursor:pointer}.buttons-container-footer{display:flex;flex-direction:row;gap:40px;align-items:center;justify-content:center;margin-top:60px}.creator{display:flex;align-items:center;justify-content:center}.creator img{width:18px;height:18px}.creator span{color:var(--text-secondary);margin-left:20px;font-size:14px}.social-links-footer{display:flex;align-items:center;justify-content:center;gap:15px}.social-links-footer a{padding:5px}.social-links-footer a i svg{color:var(--text-secondary);width:24px;height:24px;transition:all .3s ease}.social-links-footer a:hover i svg{color:var(--text-primary)}@media(max-width:1800px){.index-container,.projects-container,.about-container,.skills-container,.contact-container{width:90%}}@media(max-width:768px){.index-container{padding-top:0;gap:25px}.presentation-container{gap:15px;max-width:100%;order:2}.skills-container{width:90%}.slider-scrolldown-container{gap:10px}.avatar-content{order:1}.index-main-content{justify-content:center;margin-top:0;margin-bottom:0;gap:30px;width:100%}.floating-icon{width:25px;height:25px;padding:10px;font-size:20px}.avatar-wrapper{display:flex;align-items:center;justify-content:center;width:280px;height:280px;margin:0}.icon-1{top:1%;left:5%}.icon-2{top:8%;right:-15%}.icon-3{bottom:5%;left:-3%}.icon-4{bottom:-5%;right:-8%}.title{font-size:30px;margin-bottom:10px}.sub-title{font-size:20px;font-weight:700}.description-content{display:none}.description-content p{margin:10px 0}.text-content{margin-bottom:0}.buttons-container{display:flex;justify-content:center;width:100%;gap:10px}.social-icon{width:25px;height:25px}.btn-primary,.btn-secondary{justify-content:center;padding:13px 19px;font-size:14px;font-weight:600;width:50%}.btn-primary svg,.btn-secondary svg{width:17px;height:17px}.slider-wrapper{width:100%;margin:0}.scrolldown-container{margin:0 0 25px}.scrolldown-img{width:30px;height:auto}.title-backdrop:before{font-size:55px;font-weight:900}.title-backdrop h2{font-size:38px}.section-description{font-size:15px;width:75%}.about-container{flex-direction:column;gap:30px;width:90%;margin:40px auto 80px}.about-description-container{justify-content:center;margin-bottom:50px}.btn-about-cv-container{align-items:center;justify-content:center;width:100%}.contact-container{margin:80px auto;width:90%}.buttons-container-footer{gap:10px}.footer-container{width:90%}.creator{text-wrap:nowrap}.creator img{width:16px;height:16px}.creator span{display:none}.social-links-footer{gap:10px}.social-links-footer a{padding:5px}.social-links-footer a i svg{width:20px;height:20px}}.dot-grid{display:flex;align-items:center;justify-content:center;height:100%;width:100%;position:relative}.dot-grid__wrap{width:100%;height:100%;position:relative}.dot-grid__canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.header-pill{position:sticky;top:20px;width:100%;max-width:1600px;max-height:auto;left:0;right:0;margin:0 auto;padding:10px 40px;display:flex;align-items:center;justify-content:space-between;border:1px solid transparent;gap:1rem;transition:all .3s ease,max-width .3s ease;z-index:10}.header-pill.scrolled{background:var(--bg-header);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-radius:50px;border:1px solid #271e3754;max-width:750px}.header-container{width:100%;display:flex;justify-content:space-between}.name-container{display:flex;align-items:center;cursor:pointer;padding:5px}.name{gap:.5rem;font-size:25px;letter-spacing:.02em;color:var(--text-primary);transition:all .3s ease}.header-pill.scrolled .name{font-size:18px}.header-nav-desktop{position:absolute;left:50%;transform:translate(-50%)}.header-list-desktop{list-style:none;display:flex;gap:10px;margin:0;padding:0}.header-nav-desktop button{display:inline-block;padding:10px 15px;border-radius:999px;font-size:20px;font-weight:500;color:var(--text-primary);background:transparent;text-decoration:none;text-wrap:nowrap;transition:all .3s ease;appearance:none;border:none;cursor:pointer}.header-nav-desktop button:hover{background:var(--bg-hover-header)}.header-pill.scrolled .header-nav-desktop button{font-size:15px}.theme-container{display:flex;align-items:center;justify-content:center;width:40px;height:40px}.theme-toggle{position:relative;background:transparent;border:none;appearance:none;cursor:pointer;display:flex;align-items:center;justify-content:center;width:100%;height:100%}.theme-toggle:hover .theme-icon.show{transform:rotate(-30deg)}.theme-icon{position:absolute;height:40px;width:40px;opacity:0;transform-origin:center;transform:rotate(-360deg) scale(.8);transition:all .5s ease}.theme-icon.show{opacity:1;transform:rotate(0) scale(1)}.header-pill.scrolled .theme-icon{height:35px;width:35px}.burger-button-container,.menu-mobile,.theme-container-mobile{display:none}@media(max-width:768px){.header-list-mobile{list-style:none;display:flex;flex-direction:column;gap:10px;margin:15px 0;padding:0}.header-nav-mobile button{display:inline-block;padding:10px 15px;width:100%;text-align:start;border-radius:999px;font-size:20px;font-weight:500;color:var(--text-primary);background:transparent;text-decoration:none;text-wrap:nowrap;transition:all .3s ease;appearance:none;border:none;cursor:pointer}.header-nav-mobile button:hover{background:var(--bg-hover-header)}.header-pill.open:not(.header-pill.scrolled){background:var(--bg-header);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-radius:50px}.burger-button-container{display:flex;align-items:center;gap:20px}.theme-container{display:none}.theme-container-mobile{display:flex;align-items:center;justify-content:center;width:40px;height:40px}.menu-mobile.open{display:flex;flex-direction:column;align-items:start}.header-pill{flex-direction:column;max-width:85vw;padding:10px 25px;gap:0}.header-pill.scrolled{max-width:75vw}.header-list-desktop{display:none}}.burger-button{all:unset;display:flex;flex-direction:column;position:relative;cursor:pointer;width:40px;height:30px;justify-content:space-between;z-index:99;transition:all .3s ease}.burger-button span{width:40px;height:5px;background:var(--text-secondary);border-radius:100px;display:inline-block;transition:.3s ease;left:0}.burger-button.open .top{transform:translateY(12px) rotate(45deg);transform-origin:center;width:auto}.burger-button.open .bottom{transform:translateY(-13px) rotate(-45deg);transform-origin:center;width:auto;box-shadow:0 0 10px #495057}.burger-button.open .middle{transform:translate(-20px);opacity:0}.slider-container{width:100%;overflow:hidden;position:relative;padding:10px 0}.slider-track{display:flex;animation:scroll 20s linear infinite;width:fit-content}.slider-container:hover .slider-track{animation-play-state:paused}@keyframes scroll{0%{transform:translate(0)}to{transform:translate(calc(-1 * var(--shift, 0px)))}}.tech-card{display:flex;flex-direction:column;align-items:center;margin-right:100px;transition:all .3s ease;color:var(--text-secondary)}.tech-card:hover{transform:translateY(-5px)}.tech-card:hover .tech-icon{color:var(--text-primary)}@media(max-width:768px){.tech-card{margin-right:80px}.tech-card svg{width:26px;height:26px}}.about-card{display:flex;flex-direction:column;align-items:start;justify-content:flex-start;height:auto;width:280px}.about-card-title-container{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:10px}.about-card-icon{display:flex;align-items:center;justify-content:center;height:38px;width:38px;padding:10px;background:#000;border-radius:50%}.about-card-icon svg{height:25px;width:25px;fill:#fff}.about-card-title{font-size:18px;color:var(--text-primary)}.about-card-description{font-size:14px;color:var(--text-secondary);line-height:1.8}.pill-toggle{display:inline-flex;align-items:center;justify-content:center;height:50px;width:300px;padding:6px;border-radius:99px;background:var(--text-oposite);gap:4px;margin-top:60px;margin-bottom:40px;box-shadow:var(--box-shadow)}.pill-btn{display:flex;align-items:center;justify-content:center;gap:8px;border-radius:999px;border:none;height:100%;width:100%;background:transparent;color:var(--text-primary);cursor:pointer;font-size:16px;font-weight:600;transition:all .2s ease}.pill-btn.active{background:var(--text-primary);color:var(--text-oposite)}.pill-btn:hover:not(.active){background:var(--bg-hover-header)}.skills-cards-container{display:flex;flex-wrap:wrap;flex-direction:row;align-items:center;justify-content:center;gap:40px;margin-bottom:100px}.skills-card{display:flex;flex-direction:column;align-items:start;justify-content:space-around;background:var(--bg-primary);height:310px;width:350px;border-radius:15px;padding:25px;gap:20px;box-shadow:var(--box-shadow);transition:all .3s ease}.skills-card:hover{transform:translateY(-3px);box-shadow:0 10px 30px #0000008c}.skills-card-title-container{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:10px}.skills-card-icon{display:flex;align-items:center;justify-content:center;height:38px;width:38px;padding:10px;background:var(--text-primary);border-radius:50%}.skills-card-icon svg{height:29px;width:29px;fill:var(--text-oposite)}.skills-card-title{font-size:18px;color:var(--text-primary)}.skills-items-container{width:100%;display:flex;align-items:center;justify-content:flex-start;gap:15px;flex-wrap:wrap;margin-bottom:20px}.skill-item{display:flex;flex:0 0 calc(50% - 34px);padding:12px;border-radius:15px;justify-content:center;align-items:center;gap:8px;text-align:center;background:transparent;border:1px solid var(--text-secondary);color:var(--text-primary);transition:all .3s ease}.skill-item:hover{transform:scale(1.05);border-color:var(--text-primary)}.soft-skills-card{display:flex;flex-direction:column;align-items:center;justify-content:space-around;background:var(--bg-primary);height:180px;max-width:350px;border-radius:15px;padding:25px;box-shadow:var(--box-shadow);transition:all .3s ease}.soft-skills-card:hover{transform:translateY(-3px);box-shadow:0 10px 30px #0000008c}.soft-skills-card-title-container{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px}.soft-skills-card-icon{display:flex;align-items:center;justify-content:center;height:38px;width:38px;padding:10px;background:var(--text-primary);border-radius:50%}.soft-skills-card-icon svg{height:29px;width:29px;fill:var(--text-oposite)}.soft-skills-card-title{font-size:20px;color:var(--text-primary);margin:0}.soft-skills-description-container{width:100%;display:flex;align-items:center;justify-content:flex-start;gap:15px;flex-wrap:wrap;margin-bottom:20px}.soft-skills-description{color:var(--text-secondary);text-align:center;margin:10px 0 0;font-size:14px;line-height:1.5}@media(max-width:768px){.skills-card{width:100%}}.projects-pin{position:relative;padding:0}.projects-stack{position:relative;padding-top:10px;padding-bottom:10px}.project-card{position:sticky;position:-webkit-sticky;top:100px;height:75vh;width:100%;margin-bottom:130px;color:#fff;display:flex;flex-direction:column;justify-content:center;opacity:1}@media(max-width:768px){.project-card{top:17%}.projects-stack{padding-top:60px}}.tags{display:flex;flex-wrap:wrap;gap:10px;margin:20px 0}.tag{display:flex;align-items:center;justify-content:center;background:var(--bg-project-tag);border:1px solid var(--bg-project-tag-border);padding:6px 16px;border-radius:20px;font-size:14px;font-weight:500;color:var(--text-primary)}.project-1{position:relative;display:grid;grid-template-columns:1fr 1fr;align-items:center;height:90%;width:auto}.project-image-1{position:relative;aspect-ratio:16 / 9;height:95%;width:auto;border-radius:20px;overflow:hidden}.project-image-1 img{width:100%;height:100%;object-fit:cover;transition:transform .3s ease}.project-1:hover .project-image-1 img{transform:scale(1.01)}.project-information-1{position:relative;display:flex;flex-direction:column;justify-content:space-between;background-color:var(--bg-project-card);background-image:var(--bg-project-card-img);background-size:70px 70px;border:1px solid rgba(255,255,255,.1);border-radius:30px;padding:44px;z-index:2;box-shadow:0 10px 30px #00000080;height:60%;width:750px;transition:background-color .4s ease}.project-number{position:absolute;top:20px;left:30px;font-size:120px;font-weight:900;opacity:1;line-height:1;z-index:0;color:var(--project-number)}.project-type{position:absolute;top:44px;right:44px;font-size:20px;background:var(--bg-project-tag);border:1px solid var(--bg-project-tag-border);padding:6px 16px;border-radius:20px;font-weight:800;color:var(--text-primary)}.project-information-1 h3{position:relative;z-index:1;font-size:42px;margin:12px 0;color:var(--text-primary)}.project-information-1 p{font-size:17px;line-height:1.8;opacity:.8;margin:20px 0;color:var(--text-secondary)}.project-links{display:flex;gap:20px}.project-links svg{transition:all .3s ease}.project-link-github{background:#000;border:1px solid #000000;color:#fff;box-shadow:var(--box-shadow)}.project-link-demo{background:#fff;border:1px solid #8b8b8b;color:#111;box-shadow:var(--box-shadow)}.project-link-github,.project-link-demo{display:flex;align-items:center;padding:5px 11px;gap:8px;border-radius:10px;text-decoration:none;font-weight:600;transition:all .3s ease;cursor:pointer}.project-link-github svg{fill:#fff}.project-link-demo svg{fill:#111}.project-link-github:hover{background:#363636;border-color:#363636;color:#fff}.project-link-github:hover svg{fill:#fff}.project-link-demo:hover{background:#000;border-color:#000;color:#fff}.project-link-demo:hover svg{fill:#fff}@media(max-width:768px){.project-1{grid-template-columns:1fr;justify-content:center;width:100%}.project-image-1{justify-self:center;height:auto;width:100%}.project-information-1{justify-self:center;justify-content:space-between;background-size:55px 55px;padding:20px;height:450px;width:80%;flex-direction:column}.project-number{top:60px;left:25px;font-size:90px}.project-type{position:absolute;top:20px;right:50%;transform:translate(50%);font-size:16px}.project-information-1 h3{margin-top:68px;font-size:22px}.project-information-1 p{margin-top:30px;min-height:110px;max-height:110px;overflow-y:scroll}.project-information-1 p:after{content:"";position:sticky;bottom:0;display:block;height:30px;background:linear-gradient(to bottom,rgba(0,0,0,0),var(--bg-project-card))}.tag{padding:4px 10px;font-size:12px}.project-links{justify-content:center;align-items:center;gap:10px}.project-links svg{width:20px;height:20px}.project-link-github,.project-link-demo{align-items:center;justify-content:center;padding:6px 12px;gap:5px;font-weight:600;font-size:16px}}
