@import url(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&display=swap);:root{--nav-width:5rem}.navbar{background-color:#050505;box-shadow:2px 0 8px #0003;height:100vh;left:0;padding:1rem 0;position:fixed;top:0;width:5rem;width:var(--nav-width);z-index:1000}.nav-core,.navbar{align-items:center;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;display:flex;flex-direction:column;gap:2rem}.nav-core{width:100%}.logo{margin-bottom:3rem}.logo img{height:7.5rem;object-fit:cover;transition:transform 1s ease-in-out;width:auto}.logo img:hover{transform:rotate(180deg)}.nav-item{align-items:center;display:flex;justify-content:center;width:100%}.section-button{color:#828282c3;font-size:clamp(.85rem,1vw,1rem);padding:.75rem .5rem;text-decoration:none;transition:all .3s ease;writing-mode:vertical-rl}.section-button:hover{color:#fff;filter:brightness(1.2);transform:scale(1.05)}.nav-item.active{border-right:.4rem solid #266539;font-weight:700}.nav-item.active .section-button{color:#fff}@media (max-width:1024px) and (min-width:769px){.navbar{padding:.75rem 0;width:5rem;width:var(--nav-width)}.logo{margin-bottom:2.5rem}.logo img{height:6.5rem}.section-button{font-size:clamp(.8rem,1vw,1rem);padding:.7rem .55rem}.nav-core{gap:1.75rem}.nav-item.active{border-right:.35rem solid #266539}}@media (max-width:768px){:root{--nav-width:2.5rem}.navbar{padding:.625rem 0;width:5rem;width:var(--nav-width)}.logo{margin-bottom:2rem}.logo img{height:4.5rem}.section-button{font-size:clamp(.75rem,1vw,.9rem);padding:.5rem .4rem}.nav-core{gap:1.25rem}.nav-item.active{border-right:.3rem solid #266539}}.contact-bar{backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);background:#0f0f0f4d;border-bottom:1px solid #ffffff1a;flex-direction:column;left:0;position:sticky;top:0;width:100%;z-index:1000}.contact-bar,.contact-content{box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;display:flex}.contact-content{align-items:center;flex-direction:row;height:80px;justify-content:space-between;padding:10px}.socials{display:flex;gap:10px;margin-left:20px}.icon{fill:#fff;height:2.4rem;transition:fill 1s ease-in-out;width:2.4rem}.resume-button{margin-left:1rem}.resume,.resume-button{box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box}.resume{border:2px solid #00ff9d;border-radius:4px;color:#00ff9d;font-size:1.2rem;font-weight:700;margin-left:30px;padding:10px 20px;text-decoration:none;transition:background-color .4s ease-in}.resume:hover{background-color:#00ff9d;color:rgba(0,0,0,.444)}.main-page{background:linear-gradient(135deg,#1a1a2e,#16213e);box-sizing:border-box;height:100vh;left:5rem;overflow-x:hidden;overflow-y:auto;position:fixed;scroll-behavior:smooth;top:0;width:calc(100vw - 5rem)}@media (max-width:768px){.main-page{left:2.5rem;width:calc(100vw - 2.5rem)}}.hero-page{align-items:flex-start;background:linear-gradient(135deg,#1a1a2e,#16213e);box-sizing:border-box;color:#fff;display:flex;flex-direction:column;min-height:calc(100vh - 80px);overflow:hidden;padding:0 5vw;position:relative;width:100%}.hero-page .pres{margin-left:4rem;margin-top:1rem;max-width:900px;text-align:left}.hero-page .myName{color:#fff;font-size:5rem;font-weight:900;line-height:1.2;margin-bottom:1rem;text-shadow:0 4px 10px #00ff9d4d;transition:transform .3s ease-in-out}.hero-page .myName:hover{transform:scale(1.02)}.hero-page .bold{color:#00ff9d;font-weight:900}.bold.typewriter{box-shadow:0 4px 10px #00ff9d4d}.hero-page .typewriter{color:#00ff9d;display:inline-block;font-size:1.75rem}.hero-page h4{color:#ddd;font-size:1.6rem;font-weight:600;margin:0 0 1.5rem}.hero-page p{color:#bbb;font-size:1.2rem;line-height:1.7;max-width:600px}.contact-button{background:#00ff9d;border-radius:8px;box-shadow:0 4px 10px #00ff9d4d;color:#1a1a2e;display:inline-block;font-size:1.2rem;font-weight:700;margin-top:1.5rem;padding:12px 20px;text-decoration:none;transition:all .3s ease-in-out}.contact-button:hover{background:#00cc7d;box-shadow:0 6px 15px #00ff9d66;transform:scale(1.05)}.pres>*{animation:fadeInUp .6s ease-out forwards;opacity:0;transform:translateY(20px)}.pres>:first-child{animation-delay:.2s}.pres>:nth-child(2){animation-delay:.4s}.pres>:nth-child(3){animation-delay:.6s}.pres>:nth-child(4){animation-delay:.8s}@keyframes fadeInUp{to{opacity:1;transform:translateY(0)}}@media (max-width:1024px) and (min-width:769px){.hero-page{align-items:flex-start;display:flex;justify-content:center;margin:0;min-height:100vh}.hero-page .pres{margin:0 0 150px;max-width:70%;padding-top:0;text-align:left}.hero-page .myName{font-size:4rem}.hero-page .typewriter{font-size:1.5rem}.hero-page h4{font-size:1.4rem}.hero-page p{font-size:1.1rem;max-width:100%}.contact-button{font-size:1.1rem;padding:10px 18px}}@media (max-width:768px){.hero-page{align-items:center;justify-content:center;padding:0 2rem;text-align:center}.hero-page .pres{margin-left:0;margin-top:0;max-width:100%}.hero-page .myName{font-size:2.5rem}.hero-page .typewriter,.hero-page h4{font-size:1.1rem}.contact-button,.hero-page p{font-size:.9rem}}.header{align-items:center;display:flex;flex-direction:row;padding:0;width:100%}.header hr{background-color:#fff;border:none;box-shadow:0 4px 10px #00ff9d4d;flex-grow:1;height:.25px;margin-left:20px}.header h2{color:#fff;font-family:Kanit,sans-serif;font-size:3.5rem;font-weight:700;letter-spacing:1.5px;margin:0;text-transform:uppercase;white-space:nowrap}@media (max-width:768px){.header h2{font-size:1.5rem}}.skill-ettiquette{align-items:center;background-color:#4b5563;border-radius:20px;box-shadow:0 2px 4px #0000001a;color:#fff;display:inline-flex;font-size:1rem;font-weight:500;justify-content:center;letter-spacing:.5px;padding:10px 15px;text-transform:uppercase;transition:all .3s ease}.skill-ettiquette:hover{background-color:#6b7280;box-shadow:0 4px 8px #00000026;transform:translateY(-2px)}@media (max-width:768px){.skill-ettiquette{font-size:1rem;padding:10px 18px}}.skill-container{box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;margin:20px auto;max-width:800px;padding:0 10px;width:100%}.skill-name{align-items:center;background-color:#e5e7eb;border:none;border-radius:8px;box-sizing:border-box;color:#1f2937;cursor:pointer;display:flex;font-size:1.5rem;justify-content:space-between;padding:12px 20px;text-align:left;transition:background-color .3s ease,transform .2s ease;width:100%}.skill-name:hover{background-color:#d1d5db;transform:scale(1.02)}.skill-name.active{background-color:#9ca3af;color:#fff}.toggle-icon{font-size:1.5rem;font-weight:700;margin-left:10px;transition:transform .3s ease}.skill-name.active .toggle-icon{transform:rotate(180deg)}.skills{display:flex;flex-wrap:wrap;gap:16px;justify-content:center;padding:20px;transition:all .3s ease}.skills.hidden{height:0;opacity:0;overflow:hidden;padding:0}.skills.visible{height:auto;opacity:1}.skills-empty{color:#6b7280;font-size:1.2rem;font-style:italic;padding:20px;text-align:center}@media (max-width:1024px){.skill-container{max-width:600px}.skill-name{font-size:1.4rem;padding:10px 18px}.toggle-icon{font-size:1.3rem}.skills{gap:14px;padding:18px}.skills-empty{font-size:1.1rem}}@media (max-width:768px){.skill-container{max-width:500px;padding:0 8px}.skill-name{font-size:1.3rem;padding:10px 15px}.toggle-icon{font-size:1.2rem}.skills{gap:12px;justify-content:flex-start;padding:15px}.skills-empty{font-size:1rem}}@media (max-width:480px){.skill-container{max-width:100%;padding:0 5px}.skill-name{font-size:1.2rem;padding:8px 12px}.toggle-icon{font-size:1rem;margin-left:8px}.skills{gap:10px;justify-content:center;padding:12px}.skills-empty{font-size:.9rem;padding:15px}}@media (max-width:320px){.skill-name{font-size:1rem;padding:6px 10px}.toggle-icon{font-size:.9rem;margin-left:6px}.skills{gap:8px;padding:10px}}#presentation{box-sizing:border-box;display:flex;justify-content:center;min-height:100vh;padding:80px 20px;width:100%}.content{display:flex;flex-direction:row;flex-wrap:wrap;gap:40px;justify-content:space-between}.text-content{flex:1 1;max-width:100%;min-width:280px}.text-content p{color:#f5f5f5;font-family:Kanit,sans-serif;font-size:1.15rem;font-weight:300;letter-spacing:.3px;line-height:1.8;margin-bottom:24px;max-width:750px;position:relative;text-align:justify}.text-content p:not(:last-child):after{background:#00ff9d;content:"";display:block;height:1px;margin:20px 0 0;opacity:.3;width:50px}.text-content em{color:#aaa;display:block;font-size:1rem;font-style:italic;margin:8px 0 16px}.text-content strong{display:block;font-size:1.2rem;margin-bottom:10px;margin-top:20px}.links,.text-content strong{color:#00ff9d;font-family:Kanit,sans-serif;font-weight:500}.links{font-size:1.5rem;gap:8px;justify-content:flex-start}.links,.presentation-contacts{align-items:center;display:flex;flex-direction:row}.presentation-contacts{flex-wrap:wrap;gap:16px;margin-top:20px}.icon{fill:#f9f9f9;height:32px;transition:transform .3s ease,fill .3s ease;width:32px}.icon:hover{fill:#00ff9d;transform:scale(1.15)}.skills-content{align-items:stretch;display:flex;flex:1 1;flex-direction:column;gap:20px;justify-content:center;min-width:280px}.text-content{animation:fadeIn 1s ease-in-out forwards;opacity:0}.text-content.loaded{opacity:1}@media (max-width:1200px){.container{max-width:1000px;padding:20px}.content{gap:30px}.text-content p{font-size:1.05rem}.links{font-size:1.4rem}.icon{height:30px;width:30px}}@media (max-width:768px){#presentation{padding:60px 15px}.container{max-width:700px;padding:15px}.content{flex-direction:column;gap:20px}.text-content{min-width:100%}.text-content p{font-size:1rem;line-height:1.7}.links{font-size:1.3rem;justify-content:center}.icon{height:28px;width:28px}.skills-content{min-width:100%}}@media (max-width:480px){#presentation{padding:100px 10px}.container{max-width:100%;padding:10px}.content{gap:15px}.text-content p{font-size:.95rem;line-height:1.6;margin-bottom:20px}.links{font-size:1.2rem;gap:6px}.presentation-contacts{gap:12px;justify-content:center}.icon{height:24px;width:24px}}@media (max-width:320px){#presentation{padding:80px 8px}.container{padding:8px}.text-content p{font-size:.9rem}.links{font-size:1.1rem;gap:5px}.icon{height:20px;width:20px}.presentation-contacts{gap:10px}}.project-card{background-color:#fff;border-radius:12px;box-shadow:0 4px 6px #0000001a;cursor:pointer;display:flex;flex-direction:column;max-width:350px;overflow:hidden;transition:transform .3s ease,box-shadow .3s ease;width:100%}.project-card:hover{box-shadow:0 6px 12px #00000026;transform:translateY(-5px)}.project-image{height:200px;overflow:hidden;width:100%}.project-image img{height:100%;object-fit:cover;width:100%}.image-placeholder{align-items:center;background-color:#e5e7eb;color:#6b7280;display:flex;font-size:1rem;font-style:italic;height:100%;justify-content:center;width:100%}.project-content{flex-grow:1;padding:20px}.project-title{color:#1f2937;font-size:1.5rem;font-weight:600;margin:0 0 10px}.project-description{color:#4b5563;font-size:1rem;line-height:1.5;margin:0}.project-links{flex-wrap:wrap;gap:15px;padding:0 20px 20px}.project-link,.project-links{align-items:center;display:flex}.project-link{color:#00ff9d;font-size:1rem;font-weight:500;gap:5px;text-decoration:none;transition:color .3s ease}.project-link:hover{color:#00cc7a}.link-icon{height:24px;width:24px}.no-links{color:#6b7280;font-size:.9rem;font-style:italic}.project-modal{align-items:center;animation:fadeIn .3s ease-in;background-color:#000c;box-sizing:border-box;display:flex;height:100vh;justify-content:center;left:0;margin:0;padding:80px 20px 20px;position:fixed;top:0;width:100vw;z-index:3000000}.project-modal-content{background-color:#fff;border-radius:16px;box-shadow:0 8px 16px #0003;display:flex;flex-direction:column;margin:0 auto;max-height:calc(100vh - 160px);max-width:80%;overflow-y:auto;padding:20px;position:relative}.modal-close{background:none;border:none;color:#1f2937;cursor:pointer;font-size:2rem;position:absolute;right:10px;top:10px;transition:color .3s ease}.modal-close:hover{color:#ef4444}.modal-image{max-height:400px;overflow:hidden;width:100%}.modal-image img{height:100%;object-fit:cover;width:100%}.modal-content{padding:20px;z-index:300000}.modal-title{color:#1f2937;font-size:2rem;font-weight:700;margin:0 0 15px}.modal-description{color:#4b5563;font-size:1.1rem;line-height:1.6;margin:0 0 20px}.modal-links{flex-wrap:wrap;gap:20px}.modal-link,.modal-links{align-items:center;display:flex}.modal-link{color:#00ff9d;font-size:1.1rem;font-weight:500;gap:8px;text-decoration:none;transition:color .3s ease}.modal-link:hover{color:#00cc7a}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@media (max-width:1024px){.project-card{max-width:320px}.project-image{height:180px}.project-title{font-size:1.4rem}.project-description{font-size:.95rem}.project-links{gap:12px;padding:0 15px 15px}.project-link{font-size:.95rem}.link-icon{height:22px;width:22px}.project-modal-content{max-width:700px;padding:15px}.modal-image{max-height:350px}.modal-title{font-size:1.8rem}.modal-description{font-size:1rem}.modal-links{gap:15px}.modal-link{font-size:1rem}}@media (max-width:768px){.project-card{margin:0 auto;max-width:100%}.project-image{height:160px}.project-title{font-size:1.3rem}.project-description{font-size:.9rem}.project-content{padding:15px}.project-links{gap:10px;padding:0 15px 15px}.project-link{font-size:.9rem}.link-icon{height:20px;width:20px}.project-modal-content{margin-left:40px;max-width:500px}.modal-image{max-height:300px}.modal-title{font-size:1.6rem}.modal-description{font-size:.95rem}.modal-links{gap:12px}.modal-link{font-size:.95rem}}@media (max-width:480px){.project-card{max-width:100%}.project-image{height:140px}.project-title{font-size:1.2rem}.project-description{font-size:.85rem;line-height:1.4}.project-content{padding:12px}.project-links{gap:8px;padding:0 12px 12px}.project-link{font-size:.85rem}.link-icon{height:18px;width:18px}.project-modal-content{max-width:95%;padding:10px}.modal-close{font-size:1.8rem;right:8px;top:8px}.modal-image{max-height:250px}.modal-title{font-size:1.4rem}.modal-description{font-size:.9rem}.modal-links{gap:10px}.modal-link{font-size:.9rem}}@media (max-width:320px){.project-card{max-width:100%}.project-image{height:120px}.project-title{font-size:1.1rem}.project-description{font-size:.8rem}.project-content{padding:10px}.project-links{gap:6px;padding:0 10px 10px}.project-link{font-size:.8rem}.link-icon{height:16px;width:16px}.project-modal-content{max-width:80%;padding:50px}.modal-close{font-size:1.6rem;right:6px;top:6px}.modal-image{max-height:200px}.modal-title{font-size:1.2rem}.modal-description{font-size:.85rem}.modal-links{gap:8px}.modal-link{font-size:.85rem}}#projects{align-items:center;color:#fff;display:flex;justify-content:center;min-height:100vh;padding:80px 20px;width:100%}#projects,.container{box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box}.container{max-width:1500px;padding:30px}.projects-section{align-items:center;display:flex;min-height:100vh;padding:80px 20px}.project-list,.projects-section{justify-content:center;width:100%}.project-list{grid-gap:40px;align-items:stretch;display:grid;gap:40px;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));justify-items:center;max-width:1200px;padding:20px 0}.project-list .project-card{background-color:#fff;border-radius:15px;box-shadow:0 8px 24px #0003;max-width:350px;overflow:hidden;transition:transform .3s ease,box-shadow .3s ease;width:100%}.project-list .project-card:hover{box-shadow:0 12px 32px #0000004d;transform:translateY(-8px)}@media (max-width:1024px){#projects{padding:60px 15px}.container{max-width:1000px;padding:20px}.project-list{gap:30px;max-width:900px}.project-list .project-card{max-width:320px}.container .header{font-size:2.2rem}}@media (max-width:768px){#projects{padding:40px 10px}.container{max-width:700px;padding:15px}.project-list{gap:25px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));max-width:600px}.project-list .project-card{border-radius:12px;max-width:100%}.container .header{font-size:2rem}}@media (max-width:480px){#projects{padding:100px 10px}.container{max-width:100%;padding:10px}.project-list{gap:20px;grid-template-columns:1fr;max-width:100%;padding:15px 0}.project-list .project-card{border-radius:10px;box-shadow:0 4px 12px #0000001a;max-width:100%}.project-list .project-card:hover{transform:translateY(-5px)}.container .header{font-size:1.8rem;margin-bottom:30px}}@media (max-width:320px){#projects{padding:80px 8px}.container{padding:8px}.project-list{gap:15px}.project-list .project-card{box-shadow:0 2px 8px #0000001a}.container .header{font-size:1.6rem}}.certifications-section{box-sizing:border-box;color:#fff;justify-content:center;min-height:100vh;padding:80px 20px}.certifications-section,.container{align-items:center;display:flex;width:100%}.container{flex-direction:column;margin:0 auto;max-width:1200px}.container .header{color:#00ff9d;font-family:Kanit,sans-serif;font-size:2.5rem;font-weight:600;margin-bottom:40px;text-align:center}.certifications-list{display:flex;flex-direction:column;gap:20px;list-style:none;max-width:1000px;padding:0;width:100%}.certification-item{background-color:#2d3748;border-radius:10px;cursor:pointer;padding:20px;transition:background-color .3s ease,transform .3s ease}.certification-item:hover{background-color:#3b4b66;transform:translateY(-5px)}.certification-title{color:#00ff9d;font-size:1.5rem;font-weight:600;margin:0 0 5px}.certification-issuer{color:#bbb;font-size:1rem;margin:0 0 5px}.certification-date{color:#888;font-size:.9rem;margin:0}.floating-image{pointer-events:none;position:fixed;z-index:1000}.floating-image img{border-radius:8px;box-shadow:0 4px 12px #0000004d;height:auto;opacity:.9;width:400px}@media (max-width:1024px){.certifications-section{padding:60px 15px}.container{max-width:900px}.certifications-list{max-width:600px}.certification-item{padding:15px}.certification-title{font-size:1.3rem}.floating-image img{width:150px}.container .header{font-size:2.2rem}}@media (max-width:768px){.certifications-section{padding:40px 10px}.container{max-width:600px}.certifications-list{max-width:100%}.certification-item{padding:10px}.certification-title{font-size:1.2rem}.floating-image img{width:120px}.container .header{font-size:2rem}}@media (max-width:480px){.certifications-section{padding:100px 10px}.container{padding:10px}.certifications-list{gap:15px}.certification-item{padding:8px}.certification-title{font-size:1.1rem}.floating-image img{width:100px}.container .header{font-size:1.8rem}}.contact-me{color:#f0f8ff;height:100vh;width:100%}.contact-me,.contact-me-element{align-items:center;display:flex;justify-content:center}.contact-me-element{flex-direction:column;max-width:800px;padding:20px;width:70%}.contact-me-element h1{color:#00ff9d;font-size:7rem;margin-bottom:0}.contact-me-element h1,.contact-me-element h4{font-family:Kanit,sans-serif;text-align:center}.contact-me-element h4{font-size:1.8rem;margin:1rem 0}.contact-me-element h4 a{color:#00ff9d;cursor:pointer;text-decoration:none;transition:all .5s ease-in-out}.contact-me-element h4 a:hover{color:#0fac70}.contact-me-element .mailto{background-color:#00ff9d;border-radius:8px;box-shadow:0 10px 20px #00ff9d4d;color:#000;font-size:1.2rem;font-weight:600;padding:15px 20px;text-decoration:none;transition:all .7s ease-in-out}.contact-me-element .mailto:hover{background-color:#000;border:2px solid #00ff9d;color:#00ff9d}@media (max-width:768px){.contact-me-element{width:90%}.contact-me-element h1{font-size:4rem}.contact-me-element h4{font-size:1.4rem}.contact-me-element .mailto{font-size:1rem;padding:12px 18px}}@media (max-width:480px){.contact-me-element{width:95%}.contact-me-element h1{font-size:2.5rem}.contact-me-element h4{font-size:1rem}.contact-me-element .mailto{font-size:.9rem;padding:10px 15px}}html{font-size:16px;scroll-behavior:smooth}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:linear-gradient(135deg,#1a1a2e,#16213e);font-family:Arial,sans-serif;margin:0;padding:0}.app,body{min-height:100vh;min-width:100vw}.app{display:flex}
/*# sourceMappingURL=main.86ea636d.css.map*/