@import"https://fonts.googleapis.com/css2?family=Kanit:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Quicksand:wght@300..700&display=swap";html{scroll-behavior:smooth}body{margin:0;overflow-x:hidden;box-sizing:border-box;background-color:#14121d;color:#fff;font-family:Quicksand,sans-serif;font-optical-sizing:auto;font-style:normal;font-weight:400;font-size:1rem;background:#a36de0;background:linear-gradient(140deg,#a36de0,#431973 5%,#1d0537,#160928 25%,#140922 40%,#160f22 60%,#0c0b14 90%);background-repeat:no-repeat;background-size:cover}footer{background-color:#0c0b14}@media (min-width: 480px){header{min-width:380px}}@media (min-width: 844px){header{padding-inline:16px;margin-inline:auto;max-width:744px}}@media (min-width: 1220px){header{max-width:1120px}}section{padding-inline:16px;margin:80px;margin-inline:auto}@media (min-width: 480px){section{min-width:380px}}@media (min-width: 844px){section{max-width:744px}}@media (min-width: 1220px){section{max-width:1120px}}h1,h2,h3,h4,h5,h6,p,ul{margin:0}h1{font-family:Kanit,sans-serif;font-style:normal;font-weight:600;font-size:2.98rem}h2{font-family:Kanit,sans-serif;font-style:normal;font-weight:600;font-size:2.48rem}h3{font-family:Kanit,sans-serif;font-style:normal;font-weight:600;font-size:2.07rem}h4{font-family:Kanit,sans-serif;font-style:normal;font-weight:600;font-size:1.72rem}h5{font-family:Kanit,sans-serif;font-style:normal;font-weight:600;font-size:1.44rem}h6{font-family:Kanit,sans-serif;font-style:normal;font-weight:600;font-size:1.2rem}.text_center{text-align:center}.p_large{font-family:Quicksand,sans-serif;font-optical-sizing:auto;font-style:normal;font-weight:400;font-size:1.2rem}ul{list-style:none;padding:0}a{color:#fff;text-decoration-color:#0000;transition:color .35s ease-in-out,text-decoration-color .35s ease-in-out;text-decoration-thickness:2px}a:hover{transition:color .35s ease-in-out,text-decoration-color .35s ease-in-out;text-decoration-color:#5ee779;color:#5ee779}button{background:none;color:inherit;border:none;padding:0;font:inherit;cursor:pointer;outline:inherit}.bnt_deafult{width:fit-content;background:linear-gradient(90deg,#76bf87,#4bb574,#21946c 66%,#0f7867);color:#fff;border:none;border-radius:8px;padding:16px;font-family:Kanit,sans-serif;font-style:normal;font-weight:600;font-size:1.2rem;text-decoration-line:underline;text-decoration-color:#0000;text-decoration-thickness:2px;transition:text-decoration-color .35s ease-in-out,box-shadow .35s ease-in-out}.bnt_deafult-highlight{box-shadow:0 0 16px #5ee779}.bnt_deafult:hover{transition:text-decoration-color .35s ease-in-out,box-shadow .35s ease-in-out;text-decoration-color:#fff;box-shadow:0 0 16px #5ee779}.return_to_top{display:none}@media (min-width: 1220px){.return_to_top{display:block;cursor:pointer;position:fixed;bottom:60px;right:60px}}.header{position:relative;z-index:1}.header__mobile{background-color:#14121d;position:relative;z-index:3;display:flex;align-items:center;justify-content:space-between;padding:16px;border-bottom:2px solid white}@media (min-width: 844px){.header__mobile{display:none}}.header__dropdown{position:absolute;width:100%;background-color:#0c0b14;border-bottom:2px solid white;text-align:center;font-family:Kanit,sans-serif;font-style:normal;font-weight:600;font-size:1.72rem;padding:40px;padding-inline:0}@media (min-width: 844px){.header__dropdown{display:none}}.header__dropdown ul{display:flex;flex-direction:column;gap:32px}.header__desktop{display:none}@media (min-width: 844px){.header__desktop{display:flex;align-items:center;justify-content:space-between;padding:32px;padding-inline:0;border-radius:8px}.header__desktop a{display:flex;align-items:center}}.header__nav ul{display:flex;flex-direction:row;gap:32px}.header__nav a{font-family:Kanit,sans-serif;font-style:normal;font-weight:600;font-size:1.2rem}@keyframes wave__effect{0%,to{transform:translateY(0)}50%{transform:translateY(-1rem)}}@media (min-width: 1220px){.hero h1{font-size:5rem}}.hero__info{width:100%;padding-bottom:40px;display:flex;flex-direction:column;gap:32px;align-items:center;justify-content:center}@media (min-width: 1220px){.hero__info{grid-column:2/12}}.hero__info-highlight{color:#5ee779}.hero__info-highlight span:nth-child(1){display:inline-block;animation:wave__effect 2.5s ease-in-out infinite;animation-delay:.2s}.hero__info-highlight span:nth-child(2){display:inline-block;animation:wave__effect 2.5s ease-in-out infinite;animation-delay:.4s}.hero__info-highlight span:nth-child(3){display:inline-block;animation:wave__effect 2.5s ease-in-out infinite;animation-delay:.6s}.hero__info-highlight span:nth-child(4){display:inline-block;animation:wave__effect 2.5s ease-in-out infinite;animation-delay:.8s}.hero__info-highlight span:nth-child(5){display:inline-block;animation:wave__effect 2.5s ease-in-out infinite;animation-delay:1s}.hero__info-highlight span:nth-child(6){display:inline-block;animation:wave__effect 2.5s ease-in-out infinite;animation-delay:1.2s}.about{display:flex;flex-direction:column;gap:32px}.about__img{max-width:100%;display:block;margin:auto}.about__content{display:flex;flex-direction:column;gap:32px}@media (min-width: 1220px){.about__content{flex-direction:row;align-items:center}}.about__text,.skills,.skills__container{display:flex;flex-direction:column;gap:32px}@media (min-width: 1220px){.skills__container{display:grid;grid-template-columns:repeat(12,1fr)}}.skills__code,.skills__design{display:flex;flex-direction:column;gap:8px}.skills__code img,.skills__design img{width:64px}@media (min-width: 1220px){.skills__code{grid-column:1/8}}@media (min-width: 1220px){.skills__design{grid-column:8/13}}.skills__collection{background-color:#0c0b14;display:flex;flex-wrap:wrap;gap:32px;padding:32px;border-radius:16px;border:2px solid #ffffff}.skills__icon{display:flex;flex-direction:column;gap:4px;align-items:center;transform:translateY(0);transition:transform .3s ease-in-out;text-align:center;font-weight:600}.skills__icon img{border-radius:8px;transition:background-color .5s ease-in-out,box-shadow .3s ease-in-out}.skills__icon:hover{transition:transform .3s ease-in-out;transform:translateY(-5px)}.skills__icon:hover img{transition:background-color .3s ease-in-out,box-shadow .5s ease-in-out;background-color:#5ee779;box-shadow:0 0 16px #5ee779}.projects{display:flex;flex-direction:column;gap:32px}.projects__list{display:flex;flex-direction:column;gap:80px}.project{display:flex;flex-direction:column;gap:32px}@media (min-width: 1220px){.project{display:grid;grid-template-columns:repeat(12,1fr)}}.project__info{display:flex;flex-direction:column;gap:16px}@media (min-width: 1220px){.project__info{gap:32px;grid-column:1/5;justify-content:center}}.project__cta{display:flex;flex-wrap:wrap;justify-content:center;gap:32px}@media (min-width: 1220px){.project__cta{justify-content:space-between}}.project__thumbnail{border:2px solid #ffffff;border-radius:32px;background-color:#fff}@media (min-width: 1220px){.project__thumbnail{width:100%;grid-column:5/13}}@media (min-width: 1220px){.project:nth-child(2n) .project__thumbnail{grid-column:1/9;grid-row:1}}@media (min-width: 1220px){.project:nth-child(2n) .project__info{grid-column:9/13}}.contact{display:flex;flex-direction:row;gap:8px;align-items:center}.footer{display:flex;flex-direction:column;gap:40px;align-items:center;padding:40px;padding-inline:0;margin-inline:auto}@media (min-width: 480px){.footer{min-width:380px}}@media (min-width: 844px){.footer{max-width:744px}}@media (min-width: 1220px){.footer{max-width:1120px}}@media (min-width: 844px){.footer{flex-direction:row;justify-content:space-between;align-items:start}}.footer__logo-container{display:flex;flex-direction:column;gap:8px;align-items:center}@media (min-width: 844px){.footer__logo-container{align-items:start}}.footer__socials{display:flex;flex-direction:row;gap:32px}.footer__socials img{border-bottom:2px solid rgba(255,255,255,0);transition:border-bottom .3s ease-in-out}.footer__socials img:hover{transition:border-bottom .3s ease-in-out;border-bottom:2px solid #5EE779}.footer__icons8{display:flex;flex-direction:column}.footer__icons8 a{text-decoration:underline}.footer__nav{display:flex;flex-direction:column;gap:16px}.footer__nav ul{display:flex;flex-direction:column;gap:16px;align-items:center}.footer__contact{display:flex;flex-direction:column;gap:8px;align-items:center}@media (min-width: 844px){.footer__contact{align-items:start}}.go_back{position:sticky;top:0;z-index:1}@media (min-width: 844px){.go_back{margin-inline:auto;width:min(100%,1120px)}}.go_back button{width:100%;border-radius:0}@media (min-width: 844px){.go_back button{border-radius:0 0 8px 8px}}.project_info{display:flex;flex-direction:column;gap:80px}.project_info__thumbnail{border:2px solid #ffffff;border-radius:16px;background-color:#fff}.project_info__content{display:flex;flex-direction:column;gap:32px}.project_info__header{display:flex;flex-direction:column;gap:32px;align-items:center}@media (min-width: 844px){.project_info__header{flex-direction:row;justify-content:space-between}}.project_info__header button{width:100%}@media (min-width: 844px){.project_info__header button{width:fit-content}}.project_info__description{display:flex;flex-direction:column;gap:32px}@media (min-width: 844px){.project_info__description{display:grid;grid-template-columns:repeat(12,1fr)}.project_info__description :nth-child(odd){grid-column:1/7}.project_info__description :nth-child(2n){grid-column:7/13}}.project_info__text{display:flex;flex-direction:column;gap:16px}.project_info__tools{display:flex;flex-direction:row;gap:32px;flex-wrap:wrap;height:fit-content}.project_info__gallery{display:grid;grid-template-columns:repeat(12,1fr);gap:16px}@media (min-width: 844px){.project_info__gallery{gap:32px}}.project_info__gallery img{border:2px solid #ffffff;border-radius:16px;background-color:#fff;box-sizing:border-box;width:100%;grid-column:span 12}@media (min-width: 844px){.project_info__gallery .img__desktop{grid-column:span 6}}.project_info__gallery .img__mobile{grid-column:span 6}@media (min-width: 844px){.project_info__gallery .img__mobile{grid-column:span 3}}.error{height:100vh;padding-inline:16px;display:flex;flex-direction:column;gap:32px;align-items:center;justify-content:center}.error__info{display:flex;flex-direction:column;gap:4px;align-items:center}.error__info-highlight{color:#5ee779;border-radius:16px;padding:16px;box-shadow:0 0 16px #5ee779}
