@import"https://fonts.googleapis.com/css2?family=Bevan:ital@0;1&family=DM+Serif+Text:ital@0;1&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Young+Serif&display=swap";:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;font-weight:400;color-scheme:light dark;-webkit-font-smoothing:antialiased;--header-height: 60px}html,body{box-sizing:border-box;height:100%;width:100%;padding:0;margin:0}*,*:before,*:after{box-sizing:inherit}.center{display:flex;flex-direction:column;width:100%;position:relative}.hero-holder{position:sticky;top:calc(-100svh + var(--header-height));height:100svh;overflow:hidden;z-index:10;box-shadow:0 4px 15px #0006}.hero-holder:before{content:"";position:absolute;top:0;left:0;width:100%;height:100vh;background-color:#2b464b;z-index:1;pointer-events:none;opacity:calc(var(--progress) * .7)}p{font-size:1.2rem;font-weight:500;color:#bec32d}h2{font-size:1.5rem;color:#bec32d}.under-photo,.over-photo{position:absolute;top:-10svh;left:0;width:120%;height:120svh;object-fit:cover;object-position:50% 50%}.under-photo{z-index:0}.over-photo{z-index:3;pointer-events:none;filter:brightness(.9)}.content-holder{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;z-index:2}.outline-text,.solid-front-text{z-index:4;pointer-events:none}.outline-text .my-name{color:transparent;-webkit-text-stroke:.001em #545969}.top-text{font-size:clamp(1.5rem,2vw,3rem);color:#6f341d;padding-top:30px;opacity:calc(1 - var(--progress) * 3)}.my-name{font-family:"Young Serif",serif;color:#bec32d;width:100%;text-align:center;margin:0;position:absolute;font-size:max(2.4rem,calc(min(15vw,12rem) - (min(15vw,12rem) - 2rem) * var(--progress)));bottom:max(30px,calc(20svh - (20svh - var(--header-height) / 2) * var(--progress)));transform:translateY(50%);line-height:1;filter:url(#grainy-text)}.outline-front{z-index:6;opacity:calc(1 - var(--progress) * 2)}.solid-front{z-index:7;opacity:min(1,calc(var(--progress) * 1.5))}.app-container{background-color:#1a1a1a;min-height:100vh}.pfp{width:30%}.contact{position:relative;z-index:5;background-color:#0e160f;color:#df1122;min-height:200vh;padding-top:calc(var(--header-height) + 60px);padding-left:5%;padding-right:5%;padding-bottom:60px;display:flex;flex-direction:column;align-items:center}.about-me{width:70%}.arrow{filter:invert(13%) sepia(100%) saturate(7483%) hue-rotate(1deg) brightness(70%) contrast(115%);height:235px}.after{width:100%;display:flex;max-width:1200px;gap:20%;height:fit-content}.title{display:flex;justify-content:center;font-weight:700}.carousel-wrapper{display:flex;align-items:center;justify-content:center;width:80vw;max-width:1200px;gap:15px}.carousel-container{display:flex;gap:1.5rem;overflow-x:auto;scroll-snap-type:x mandatory;-ms-overflow-style:none;scrollbar-width:none;padding:20px 0;width:100%}.carousel-container::-webkit-scrollbar{display:none}.carousel-item{flex:0 0 auto;scroll-snap-align:center}.carousel-item img{width:400px;height:auto;border-radius:8px;box-shadow:0 10px 20px #0009}.carousel-btn{background-color:#bec32d;color:#0e160f;border:none;border-radius:50%;width:50px;height:50px;font-size:2rem;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:transform .2s ease,filter .2s ease}.carousel-btn:hover{transform:scale(1.1);filter:brightness(1.1)}.carousel-btn:active{transform:scale(.95)}@media(max-width:900px){.carousel-wrapper{width:95vw}.carousel-item img{width:300px}.carousel-btn{width:40px;height:40px;font-size:1.5rem}}@media(max-width:900px){.my-name{white-space:normal;font-size:calc(27vw - (27vw - 2rem) * var(--progress));line-height:.85;padding:0 10px}.after{flex-direction:column;align-items:center}.pfp{width:40%}}.sticky-stack-container{display:flex;flex-direction:column;gap:30px;padding-bottom:200px;width:100%;max-width:1000px;margin-top:25px}.stack-card{position:sticky;height:300px;background-color:#24251e;border-radius:20px;display:flex;justify-content:space-between;align-items:center;padding:40px;text-decoration:none;box-shadow:0 -10px 30px #00000080;border:1px solid rgba(255,255,255,.1);overflow:hidden;transition:transform .2s ease}.stack-card:hover{transform:scale(.98)}.card-text h2{font-family:"Young Serif",serif;font-size:3rem;margin:0 0 10px}.card-text p{color:#fff;opacity:.7}.stack-card img{height:120%;width:50%;object-fit:cover;border-radius:10px;transform:rotate(5deg) translateY(20px);box-shadow:-10px 10px 20px #00000080}
