:root{--bg-color: rgb(20, 20, 20);--card-color: rgb(23, 23, 23);font-family:chivo,sans-serif}body{background-color:#141414;margin:0;padding:0;overflow-x:hidden}*{box-sizing:border-box}html{scroll-behavior:smooth}button,.card{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}button,.card{min-height:44px;min-width:44px}.card,.spline_container{will-change:transform;backface-visibility:hidden}.menu{display:flex;justify-content:space-between;align-items:center;padding:20px;width:98vw;position:relative;z-index:1000}.menu_middle_buttons button{color:#fff;background-color:transparent;border:none;position:relative;cursor:pointer;transition:color .5s ease,background-color .5s ease;font-size:15px;font-family:chivo,sans-serif;padding-bottom:1px}.menu_middle_buttons button:before{content:"";position:absolute;top:100%;left:50%;width:0;height:2px;background-color:#fff;transition:width .5s ease,left .5s ease}.menu_middle_buttons button:hover:before{width:100%;left:0}.menu_middle_buttons button.active:before{width:100%;left:0}.menu_contact_button button{color:#fff;background-color:transparent;border:1px solid white;cursor:pointer;font-size:15px;border-radius:20px;transition:.3s ease;padding:7px 15px;font-family:chivo,sans-serif}.menu_contact_button button:hover{background-color:#ccc;border:1px solid #ccc;color:#141414}.menu_middle_buttons{display:flex;justify-content:center;flex-grow:1}.mobile-menu-button{display:none;cursor:pointer;z-index:1001}.hamburger{width:30px;height:20px;position:relative;transition:all .3s ease}.hamburger span{display:block;position:absolute;height:3px;width:100%;background:#fff;border-radius:3px;transition:all .3s ease}.hamburger span:nth-child(1){top:0}.hamburger span:nth-child(2){top:8px}.hamburger span:nth-child(3){top:16px}.hamburger.open span:nth-child(1){transform:rotate(45deg);top:8px}.hamburger.open span:nth-child(2){opacity:0}.hamburger.open span:nth-child(3){transform:rotate(-45deg);top:8px}.mobile-menu-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#141414f2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:999;opacity:0;visibility:hidden;transition:all .3s ease;display:flex;align-items:center;justify-content:center}.mobile-menu-overlay.open{opacity:1;visibility:visible}.mobile-menu-content{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%}.mobile-menu-items{display:flex;flex-direction:column;gap:30px;align-items:center}.mobile-menu-item{background:transparent;border:none;color:#fff;font-size:24px;font-family:chivo,sans-serif;cursor:pointer;transition:all .3s ease;position:relative;padding:10px 20px;border-radius:8px}.mobile-menu-item:hover{background-color:#ffffff1a;transform:translateY(-2px)}.mobile-menu-item.active{background-color:#ffffff26;color:#fff}.mobile-menu-item.active:after{content:"";position:absolute;bottom:0;left:50%;transform:translate(-50%);width:60%;height:2px;background-color:#fff;border-radius:1px}.resume-link{text-decoration:none;margin-top:20px}.mobile-resume-button{background-color:transparent;border:2px solid white;color:#fff;padding:12px 30px;border-radius:25px;font-size:18px;font-family:chivo,sans-serif;cursor:pointer;transition:all .3s ease;text-decoration:none}.mobile-resume-button:hover{background-color:#fff;color:#141414;transform:translateY(-2px)}@media (max-width: 768px){.desktop-menu{display:none}.mobile-menu-button{display:block}.menu{padding:15px 20px;width:100vw;justify-content:flex-end}}@media (max-width: 480px){.menu{padding:10px 15px}.mobile-menu-item{font-size:20px;padding:8px 16px}.mobile-resume-button{font-size:16px;padding:10px 25px}.mobile-menu-items{gap:25px}}.card-buttons{display:flex;gap:10px;margin-top:10px}.button{background-color:#ffffff1a;border:none;border-radius:5px;color:#fff;cursor:pointer;font-size:14px;padding:8px 12px;text-decoration:none;transition:transform .3s ease,opacity .3s ease;position:relative;z-index:2;display:inline-flex;align-items:center;justify-content:center}.button:before{border-radius:inherit;content:"";height:100%;left:0;opacity:0;position:absolute;top:0;transition:opacity .5s;width:100%;background:radial-gradient(800px circle at var(--mouse-x) var(--mouse-y),rgba(255,255,255,.06),transparent 40%)}.button:hover{transform:scale(1.05);opacity:1}.button:hover:before{opacity:1}@media (max-width: 768px){.wrap{padding:10px}#cards{grid-template-columns:1fr;gap:15px;padding:10px 10px 100px}.card{width:95%;height:200px}.card.expanded{width:95%;height:auto;min-height:350px;max-width:95vw;transform:none;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:1000;max-height:90vh;overflow-y:auto}.card-image{height:80px}.card-image>i{font-size:4em}.card-info-wrapper{padding:0 15px}.card-info-title>h3{font-size:1em}.card-info-title>h4{font-size:.8em}.card-details{padding:15px;font-size:.9em}}@media (max-width: 480px){.card{height:180px}.card.expanded{width:98%;height:auto;min-height:320px;max-height:85vh}.card-image{height:70px}.card-image>i{font-size:3.5em}.card-info-title>h3{font-size:.9em}.card-info-title>h4{font-size:.75em}.card-details{padding:12px;font-size:.85em}}.wrap{background-color:var(--bg-color);margin:0;height:100vh;display:flex;flex-direction:column;justify-content:flex-start;align-items:center;padding:20px;overflow-y:auto;overflow-x:hidden}#cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;max-width:1000px;width:100%;justify-items:center;align-items:center;padding-bottom:100px}.card-info-title h3,.card-info-title h4{font-family:chivo,sans-serif}.card{background-color:#ffffff1a;border-radius:10px;cursor:pointer;display:flex;height:260px;flex-direction:column;position:relative;width:300px;transition:transform .3s ease,z-index .3s ease,height .3s ease,width .3s ease}.card.expanded{transform:scale(1.1);height:auto;min-height:400px;width:auto;min-width:400px;max-width:90vw;z-index:10;position:relative}.card:hover:before{opacity:1}.card:before,.card:after{border-radius:inherit;content:"";height:100%;left:0;opacity:0;position:absolute;top:0;transition:opacity .5s;width:100%}.card:before{background:radial-gradient(800px circle at var(--mouse-x) var(--mouse-y),rgba(255,255,255,.06),transparent 40%);z-index:3}.card:after{background:radial-gradient(600px circle at var(--mouse-x) var(--mouse-y),rgba(255,255,255,.4),transparent 40%);z-index:1}.card>.card-content{background-color:var(--card-color);border-radius:inherit;display:flex;flex-direction:column;flex-grow:1;top:1px;right:1px;bottom:1px;left:1px;padding:10px;position:absolute;z-index:2;transition:opacity .3s ease}.card-details{color:#f0f0f0;padding:10px;position:absolute;bottom:0;left:0;right:0;z-index:4;opacity:0;transition:opacity .3s ease}.card.expanded .card-details{opacity:1}h1,h2,h3,h4,span{color:#f0f0f0;font-weight:400;margin:0}i{color:#f0f0f0}.card-image{align-items:center;display:flex;height:140px;justify-content:center;overflow:hidden}.card-image>i{font-size:6em;opacity:.25}.card-info-wrapper{align-items:center;display:flex;flex-grow:1;justify-content:flex-start;padding:0 20px}.card-info{align-items:flex-start;display:flex;gap:10px}.card-info>i{font-size:1em;height:20px;line-height:20px}.card-info-title>h3{font-size:1.1em;line-height:20px}.card-info-title>h4{color:#ffffff80;font-size:.85em;margin-top:8px}.card-details{background-color:transparent;padding:20px;font-size:.95em;text-align:left}.card-details p{margin-top:10px;line-height:1.6}.project_instruction{color:#fff;text-align:center;font-size:1.1em}@media (max-width: 768px){.wrap{padding:10px}#cards{grid-template-columns:1fr;gap:10px;padding:10px 10px 100px}.card{width:90%;height:220px}.card.expanded{width:95%;height:auto;min-height:350px;max-width:95vw;transform:none;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:1000;max-height:90vh;overflow-y:auto}.card-image{height:100px}.card-image>i{font-size:4em}.card-info-wrapper{padding:0 15px}.card-info-title>h3{font-size:1em}.card-info-title>h4{font-size:.8em}.card-details{padding:15px;font-size:.9em}}@media (max-width: 480px){.card{height:200px}.card.expanded{width:98%;min-height:320px;max-height:85vh}.card-image{height:80px}.card-image>i{font-size:3.5em}.card-info-title>h3{font-size:.9em}.card-info-title>h4{font-size:.75em}.card-details{padding:12px;font-size:.85em}}.about_page{background-color:var(--bg-color);margin:0;height:100vh;display:flex;flex-direction:column;justify-content:flex-start;align-items:center;padding:20px;overflow:hidden}.fade{transition:opacity .5s ease-in-out;color:#fff;font-size:15px}.fade-in{opacity:1}.fade-out{opacity:0}.about_page_content{display:flex;flex-direction:column;width:30vw;justify-content:center;align-items:center;text-align:center;color:#fff;font-size:30px;z-index:100;position:relative}.name_text{font-size:1em;font-weight:600;margin-bottom:10px;text-shadow:0 0 20px rgba(255,255,255,.3);letter-spacing:1px}.spline_container{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background-color:transparent;width:100vw;height:100vh;display:flex;justify-content:center;align-items:center;z-index:1;pointer-events:none}.about_page_center{display:flex;flex-direction:column;justify-content:center;align-items:center;height:100vh;width:100%;position:relative}@media (max-width: 768px){.about_page{padding:10px}.about_page_content{width:90vw;font-size:24px;z-index:100}.name_text{font-size:2em;margin-bottom:8px}.fade{font-size:14px}.spline_container{width:100vw;height:100vh}}@media (max-width: 480px){.about_page_content{font-size:20px}.name_text{font-size:1.8em;margin-bottom:6px}.fade{font-size:12px}}@media (max-width: 1000px){.about_page_content{width:80vw}}
