*{padding:0;margin:0;box-sizing:border-box;font-family:Kanit,serif}:root{color-scheme:light;--white: #FFFFFF;--white-secondary:#eeeeee;--white-faded-1: #565656;--white-faded-2: #aaaaaa;--black: #111111;--black-fade: #212529;--black-fade-alternative: #333333;--navbar-black: #222526c2}html{color-scheme:light;forced-color-adjust:none;font-family:sans-serif;scroll-behavior:smooth;scroll-padding-top:70px}.NavBar{position:sticky;top:0;z-index:100}.NavBar-content{width:100%;min-height:70px;background-color:var(--navbar-black);display:flex;flex-direction:row;justify-content:space-between;align-items:center;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.NavBar-logo{padding-left:20px;height:50px;transition:filter .1s ease-out}.NavBar-logo:hover{filter:drop-shadow(0 0 10px var(--white))}.NavBar-items{display:flex;flex-direction:row;justify-content:space-around;padding:10px}.NavBar-items .btn,.NavBar-items .btn-glow{margin-inline:5px}.btn{font:inherit;text-decoration:none;padding:10px;background-color:transparent;color:var(--white);border:1px solid var(--white);border-radius:5px;background-color:#ffffff23}.btn-glow{font:inherit;text-decoration:none;padding:10px;background-color:transparent;color:var(--white);border:1px solid var(--white);border-radius:5px;transition-duration:.1s}.btn-glow:hover{box-shadow:0 0 5px var(--white);text-shadow:0 0 5px var(--white);background-color:#ffffff23}.card-container{display:flex;justify-content:center;gap:30px;flex-wrap:wrap;width:90vw}.card-items{background-color:var(--navbar-black);border:1px solid var(--white-faded-1);border-radius:5px;min-width:350px;padding:20px;text-align:left;transition:border .1s ease-out,box-shadow .1s ease-out,transform .1s ease-out;display:flex;flex-direction:column;justify-content:space-between;cursor:default;overflow:hidden}.card-items img{overflow:hidden}.project-section .card-items{max-width:350px}.card-items:hover{border:1px solid var(--white-faded-2);box-shadow:0 0 8px var(--white-faded-1);transform:translateY(-2px)}.card-items h3{font-size:1.5rem;margin-bottom:10px;color:var(--white)}.card-items p{font-size:1rem;margin-bottom:15px;color:var(--white-secondary)}.card-items ul{list-style:none;padding:0;margin-bottom:15px}.card-items ul li{margin-bottom:8px;font-size:.9rem;color:var(--white-faded-2)}.card-items button{cursor:pointer}.bubble-icons{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:15px}.bubble-icons span{background-color:var(--black-fade-alternative);padding:5px 10px;border-radius:20px;font-size:.85rem;color:var(--white-faded-2);transition:background-color .2s ease}.bubble-icons .special{background-color:var(--white-faded-1);color:var(--white-secondary)}body{background-color:var(--black)}.main{position:relative;top:0;min-height:1000px;width:100%;display:grid;grid-template-rows:auto 1fr auto;background-color:var(--black);color:var(--white)}.hero-section{display:flex;flex-direction:column;margin-top:100px;height:90vh}.hero-section-content{width:100%;display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-around;align-items:center;padding:20px 0 100px}.hero-section-img{background-repeat:no-repeat;width:480px;background-position:center;background-size:contain;margin-top:10px;-webkit-user-drag:none;-ms-user-select:none;-moz-user-select:none;-webkit-user-select:none;user-select:none;transition:transform .5s cubic-bezier(.37,.3,.23,.83)}.hero-section-img:hover{transform:scale(1.01) rotate(.5deg)}.button-wrapper{font-size:1rem}@media (max-width:900px){.hero-section-img{max-width:90vw;margin-top:70px}.hero-section-text span{font-size:1.7rem}.hero-section-text .button-wrapper{font-size:1rem}.profile-name{font-size:2.7rem}}@media (max-width:500px){.NavBar-items{align-self:center}.NavBar-content{overflow:hidden;flex-direction:column;align-items:stretch}.NavBar-logo{align-self:center}.paragraph p{font-size:1.2rem}}@media (max-height:600px){.hero-section,.about-section{height:100%}}@media (max-width:620px){.hit-area,.button-wrapper{display:none}.about-section-content{width:100%}}.hero-section-text{display:flex;flex-direction:column;align-items:start;margin-left:20px}.hero-section-description{margin-bottom:10px}span{color:silver;font-size:2rem}.profile-name{color:var(--white);font-size:3rem;font-weight:700;transition:letter-spacing .5s cubic-bezier(.37,.3,.23,.83)}.profile-name:hover{letter-spacing:.03em}.about-section{height:100vh;width:100%;display:flex;flex-direction:column;justify-content:center;align-items:center}.about-section-content{display:flex;flex-direction:column;justify-content:center;align-items:center;margin:10px 0;width:100%;line-height:1.5}.about-section-content .about-title{color:var(--white);font-weight:700;text-decoration:underline}.about-section-content .paragraph{color:var(--white-secondary);padding:10px 0;font-size:1.2rem;margin-inline:35px;max-width:900px;text-decoration:none;font-weight:350;text-align:justify;text-indent:2rem;transition:color .2s ease;letter-spacing:.01rem}strong{transition:color .2s ease}.paragraph p{margin-bottom:10px}body:has(strong:hover) .paragraph{color:var(--white-faded-1)}strong:hover{color:var(--white)}.skill-section{min-height:100vh;width:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;margin-block:50px}.skill-section-content{min-height:100vh;width:90%;display:flex;flex-direction:column;justify-content:center;align-items:center}.skill-section-content span{color:var(--white);font-weight:700;text-decoration:underline}.project-section{min-height:100vh;width:100%;display:flex;flex-direction:column;justify-content:center;align-items:center}.project-section-content{min-height:100vh;width:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;margin-block:50px}.project-section-content #span{color:var(--white);font-weight:700;text-decoration:underline;margin-bottom:20px}.card-items>div:last-child button{margin-right:20px}.skill-container{width:90%;display:flex;justify-content:center;gap:30px;flex-wrap:wrap;margin:20px}.card{background:var(--black);border:1px solid var(--white);border-radius:6px;width:200px;padding:20px;transition:transform .3s ease,box-shadow .3s ease;max-width:calc(50% - 16px);aspect-ratio:1;display:flex;flex-direction:column;justify-content:center;align-items:center;cursor:default}.card:hover{transform:translateY(-2px);box-shadow:0 2px 10px var(--white-faded-1)}.card h3{margin:0;font-size:1.5rem;color:var(--white)}.card .skill-logo{max-width:50%;-webkit-user-select:none;user-select:none;filter:drop-shadow(0 0 20px var(--white-faded-1)) saturate(100%) brightness(100%);transition:filter .1s ease-out}.card:not(:hover) .skill-logo{filter:drop-shadow(0 0 0 #000) saturate(65%) brightness(75%)}.card p{margin:10px 0;color:var(--white-faded-2)}.form-container{background-color:var(--black);min-height:100vh;display:flex;flex-direction:column;align-items:center;padding:30px 30px 10px}.form-container h1{color:var(--white);font-weight:700;display:inline-block;margin:20px 0;width:200px}form{display:flex;flex-direction:column;margin:10px;min-width:300px}@media (min-width:580px){form{min-width:300px}}@media (min-width:900px){form{min-width:800px}}.formInput{padding-top:10px;margin-top:10px;color:#fff;background:transparent;border-top:none;border-left:none;border-right:none;border-bottom:2px solid #ccc;padding-bottom:10px;outline:none;font-weight:600}.formInput:focus{border-bottom:2px solid var(--white)}.formInput::placeholder{color:var(--white-faded-2)}.formInput:focus::placeholder{color:var(--white)}.form-back-btn{display:flex;justify-content:start;width:100%}.formBtnDiv{display:flex;justify-content:end;margin-top:20px}.formBtnDiv input{min-width:60px;font-size:1.1rem;letter-spacing:.1rem}.recaptcha{margin-top:15px}footer{display:flex;flex-direction:column;align-items:center;justify-content:space-between;background-color:var(--navbar-black);width:100%;bottom:0;margin-top:20px;padding-top:20px}footer .footer-content{display:flex;flex-direction:row;justify-content:space-around;padding:10px;min-width:75%}@media (max-width:900px){footer .footer-content{display:flex;flex-direction:column;align-items:center}}footer .footer-btn{padding:20px;display:flex;flex-direction:column;align-items:flex-start}footer .quote{color:var(--white-faded-2);margin:20px 0;font-size:1.2rem;font-family:cursive;transition:text-shadow .1s ease-out}footer .quote:hover{text-shadow:0 0 10px var(--white)}footer .link-container{padding:10px;position:relative}footer .link-container:before{content:"";border:1px solid var(--white-faded-1);display:block;position:absolute;top:10px;bottom:10px;left:-10px}footer .link-container span{color:var(--white);cursor:default}footer ul{list-style:none}footer li{padding:15px 0}footer .link-container .links{position:relative}footer .link-container a{color:var(--white);text-decoration:none}footer .link-container img{width:40px;margin-right:10px;vertical-align:middle}footer .copyright{margin:20px 0;color:var(--white-faded-1);cursor:default}footer .copyright a{text-decoration:none;color:var(--white-faded-1);transition:color .1s ease-out,text-shadow .1s ease-out}footer .copyright a:hover{color:var(--white-secondary);text-shadow:0 0 10px var(--white-faded-2)}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.2)}}footer .copyright .heart{color:red;margin-inline:3px;font-size:1rem;display:inline-block;animation:pulse 1s infinite ease-in-out}.error-container{min-height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;font-family:Kanit,serif}.error-main{color:var(--white);font-size:2.3rem;font-weight:900}.error-message{color:var(--white-faded-1);padding:10px;max-width:50rem;margin-bottom:10px}.success-container{min-height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center}.success-main{color:var(--white);font-size:2.3rem;font-weight:900;margin-bottom:0}.success-message{color:var(--white-faded-1);padding:10px;max-width:50rem;margin-top:0;margin-bottom:10px}@media (hover: none) and (pointer: coarse){.custom-cursor{display:none!important}}.custom-cursor{position:fixed;top:0;left:0;width:30px;height:30px;background-color:#ffffff8d;border-radius:50%;pointer-events:none;z-index:9999;transform:translate(-50%,-50%);transition:background-color .3s ease,transform .2s ease,opacity .2s,width .3s ease,height .3s ease}body:has(.card-items:hover) .custom-cursor,body:has(.card:hover) .custom-cursor{width:40px;height:40px}.hovering{background-color:#a0d7ffcc;transform:translate(-50%,-50%) scale(1.4)}.hidden{opacity:0;color:transparent}.magnet{transition:transform .3s}.hover-target{color:#00f}.cursor-hide{margin:50px;padding:10px}@keyframes appear{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}.scrollAppear{animation:appear 2s linear;animation-timeline:view();animation-range:entry 0% COVER 45%}.scroll-progress{position:fixed;bottom:0;left:0;width:100%;height:5px;background:#ffffff0d;z-index:1000}.scroll-progress-bar{height:100%;background:linear-gradient(90deg,#ffffff1f,#fff9);width:0%;transition:width .1s ease-out;box-shadow:0 0 10px #ffffff4d}.button-wrapper{position:relative;display:inline-block}.hit-area{position:absolute;top:-70px;left:-48px;right:-48px;bottom:-70px;background:transparent;z-index:1;border-radius:80px;color:transparent}.hr-container{width:80%;max-width:600px;margin:0 auto;display:flex;justify-content:center;align-items:center;min-height:80px;position:relative}@keyframes hrAnimation{0%,to{background-position:right}50%{background-position:left}}hr{margin-inline:auto;border:none;width:95%;height:2px;background:linear-gradient(to right,var(--black-fade) 0%,var(--white-secondary) 25%,var(--black-fade) 50%,var(--white-secondary) 75%,var(--black-fade) 100%);background-size:400%;animation:hrAnimation 15s ease infinite}.blog-section,.blog-section-content{min-height:100vh;width:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;margin-block:50px}.blog-title{color:var(--white);font-weight:700;text-decoration:underline;margin-bottom:40px;font-size:2rem}.blog-container.traditional-feed{display:flex;flex-direction:column;align-items:center;gap:40px;width:90vw;max-width:800px;padding:20px 0}.blog-article-body{padding-inline:10px}.blog-article-body li{margin-left:40px}.blog-container article{width:100%}.blog-post-article{width:100%;background-color:var(--black-fade);border:1px solid var(--black-fade-alternative);border-radius:8px;overflow:hidden;transition:border .2s ease-out,box-shadow .2s ease-out}.blog-post-link{display:block;text-decoration:none;color:inherit;transition:all .2s ease-out}.blog-post-article:hover{border:1px solid var(--white-faded-1);box-shadow:0 0 15px var(--navbar-black)}.blog-post-img-full{width:100%;height:350px;object-fit:cover;transition:filter .3s ease-out,transform .2s ease-in;overflow:hidden;margin-bottom:10px}.blog-post-link:hover .blog-post-img-full{filter:brightness(.85)}.blog-post-card{display:flex;flex-direction:column}.blog-post-main-title{font-size:2.2rem;margin-bottom:15px;color:var(--white);line-height:1.2;transition:color .1s ease-out}.blog-post-link:hover .blog-post-main-title{color:var(--white-secondary);text-decoration:underline}.blog-post-excerpt-full{font-size:1.1rem;margin-bottom:30px;color:var(--white-secondary);line-height:1.6;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2}.read-more-link{font-size:1rem;font-weight:700;align-self:flex-start;color:var(--white);transition:text-shadow .1s ease-out}.blog-post-link:hover .read-more-link{text-shadow:0 0 5px var(--white)}.blog-post-footer{display:flex;justify-content:space-between;align-items:center;position:relative}.blog-post-dates p{margin-bottom:0}.blog-post-footer button,.blog-post-footer a{padding-right:50px}@media (max-width: 700px){.blog-post-footer{display:flex;flex-direction:column;align-items:stretch}.blog-post-footer button,.blog-post-footer a{margin-top:20px}}.blog-post-footer span{position:absolute;font-size:1rem;right:30px;transition:all .2s}.blog-post-footer span:before{position:absolute;top:-2px;right:-10px;content:"";display:inline-block;width:2em;height:2em;background-size:100%;background-image:url(/arrow-right.svg);background-repeat:no-repeat;filter:invert(1)}.blog-post-footer button:hover span,.blog-post-footer a:hover span{right:20px}.blog-post-dates{display:flex;flex-direction:row}@media (max-width:480px){.blog-post-dates{display:flex;flex-direction:column;gap:10px;width:fit-content}}.single-post-section{width:100%;display:flex;flex-direction:column;align-items:center;padding:40px 20px}.post-content-wrapper{width:100%;max-width:900px;padding-bottom:150px}.single-blog-post-dates{width:100%;display:flex;flex-direction:row;margin-bottom:10px;gap:20px;justify-content:flex-end}.date-info{background-color:var(--black-fade-alternative);padding:5px 10px;border-radius:20px;font-size:.85rem;color:var(--white-faded-2);transition:background-color .2s ease;margin-right:10px}.post-page-title{font-size:3rem;font-weight:700;line-height:1.1;color:var(--white);margin-bottom:30px;margin-top:20px}.post-featured-image{margin:30px 0 40px;width:100%}.post-image{width:100%;max-height:500px;object-fit:cover;border-radius:5px;border:1px solid var(--black-fade-alternative)}.image-caption{margin-top:10px;font-size:.9rem;color:var(--white-faded-2);text-align:center}.post-text-content{color:var(--white-secondary);padding:10px 0 50px;font-size:1.2rem;letter-spacing:.01rem;line-height:1.7;font-weight:350}.post-text-content hr{margin-block:20px}.post-text-content a{color:var(--white-secondary)}.post-text-content a[target=_blank]:after{position:absolute;content:"";display:inline-block;width:1em;height:1em;margin-left:.25em;background-size:100%;background-image:url(/external_link_icon.svg);filter:invert(1)}@media (max-width: 600px){.post-page-title{font-size:2.5rem}.post-content-wrapper{padding:0 10px 150px}.post-text-content{font-size:1.05rem}}.loader-div{-webkit-user-select:none;user-select:none;display:flex;flex-direction:column;justify-content:center;align-items:center;height:100vh}.loader{transform:scale(1.1);color:#fff;position:relative;display:inline-block;font-size:3rem;letter-spacing:4px;box-sizing:border-box}.loader:before{content:"";position:absolute;right:70.3px;bottom:19px;min-height:23px;min-width:5.296px;background:currentColor;box-sizing:border-box;animation:animloader1 1s linear infinite alternate}.loader:after{content:"";min-width:10px;height:10px;position:absolute;left:122px;top:15px;border-radius:50%;background:red;box-sizing:border-box;animation:animloader 1s linear infinite alternate}@keyframes animloader{0%{transform:translate(1px) scaleX(1)}14%{transform:translate(-12px,-16px) scaleX(1.05)}28%{transform:translate(-27px,-28px) scaleX(1.07)}42%{transform:translate(-46px,-35px) scaleX(1.1)}57%{transform:translate(-70px,-37px) scaleX(1.1)}71%{transform:translate(-94px,-32px) scaleX(1.07)}85%{transform:translate(-111px,-22px) scaleX(1.05)}to{transform:translate(-123px,-9px) scaleX(1)}}@keyframes animloader1{0%{box-shadow:0 -6px,-120.82px -8px}25%,75%{box-shadow:0 0,-120.82px -8px}to{box-shadow:0 0,-120.82px -16px}}.loader-wait-message{color:var(--white-faded-2);padding-top:10px;font-size:1.5rem}.project-loader-icon{font-size:1rem;display:inline-block;vertical-align:middle;width:1em;height:2.8125em;position:relative;left:35px;top:-2px;border-radius:50% 50% 0 0;border-bottom:.3125em solid #FF3D00;background-color:#fff;background-image:radial-gradient(ellipse at center,#fff 34%,#ff3d00 35%,#ff3d00 54%,#fff 55%),linear-gradient(#FF3D00 .3125em,transparent 0);background-size:.875em .875em;background-position:center .625em,center .0625em;background-repeat:no-repeat;box-sizing:border-box;animation:project-animloader-icon-Back 1s linear infinite alternate}.project-loader-icon:before{content:"";box-sizing:border-box;position:absolute;left:50%;transform:translate(-50%);width:2em;height:1.375em;border-radius:50%;box-shadow:0 .46875em #ff3d00 inset;top:2.09375em}.project-loader-icon:after{content:"";position:absolute;left:50%;transform:translate(-50%) rotate(45deg);width:1.0625em;height:1.0625em;top:112%;background:radial-gradient(ellipse at center,#ffdf00 8%,#f93e0099 24%,#0000);border-radius:50% 50% 0;background-repeat:no-repeat;background-position:-1.375em -1.375em;background-size:3.125em 3.125em;box-shadow:.125em .125em .375em #ff3d0080;box-sizing:border-box;animation:project-animloader-icon 1s linear infinite alternate}@keyframes project-animloader-icon-Back{0%{transform:translateY(-.15625em) translate(5px) rotate(45deg)}to{transform:translateY(0) translate(0) rotate(45deg)}}@keyframes project-animloader-icon{0%{box-shadow:.125em .125em .375em .0625em #ff3d00bf;width:1.0625em;height:1.0625em;background-position:-1.375em -1.375em;background-size:3.125em 3.125em}to{box-shadow:.0625em .0625em .25em #ff3d0080;width:.9375em;height:.875em;background-position:-1.125em -1.125em;background-size:2.5em 2.5em}}.scroll-to-button{position:fixed;bottom:90px;right:30px;font-size:3.5rem;z-index:1;cursor:pointer;padding:10px;transition:opacity .2s ease-in;-webkit-user-drag:none;-ms-user-select:none;-moz-user-select:none;-webkit-user-select:none;user-select:none}.scroll-to-button:before{position:absolute;top:0;right:0;content:"";display:inline-block;width:1em;height:1em;background-size:100%;background-image:url(/arrow-up.svg);background-repeat:no-repeat;filter:drop-shadow(0 0 0 #000000d0) invert(1);transition:filter .1s ease-in}.scroll-to-button:hover:before{filter:drop-shadow(0 3px 10px #000000d0) invert(1)}