html{scroll-behavior:smooth}*{margin:0;padding:0}:root{--blue-primary:#2563eb;--blue-secondary:#3b82f6;--blue-light:#93c5fd;--blue-dark:#1e3a8a;--blue-glow:#3b82f659;--blue-subtle:#3b82f614}@keyframes float{0%,to{transform:translateY(0)rotate(0)}33%{transform:translateY(-22px)rotate(6deg)}66%{transform:translateY(-10px)rotate(-4deg)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse-glow{0%,to{opacity:.4;transform:scale(1)}50%{opacity:.9;transform:scale(1.12)}}@keyframes typewriter{to{width:100%}}@keyframes blink{50%{border-color:#0000}}@keyframes bounce-arrow{0%,to{transform:translateY(0)translate(-50%)}50%{transform:translateY(9px)translate(-50%)}}@keyframes gradient-shift{0%,to{background-position:0%}50%{background-position:100%}}[data-reveal]{opacity:0;transition:opacity .7s,transform .7s;transform:translateY(32px)}[data-reveal].revealed{opacity:1;transform:translateY(0)}[data-reveal][data-delay="100"]{transition-delay:.1s}[data-reveal][data-delay="200"]{transition-delay:.2s}[data-reveal][data-delay="300"]{transition-delay:.3s}[data-reveal][data-delay="400"]{transition-delay:.4s}[data-reveal][data-delay="500"]{transition-delay:.5s}h1,h2,h3,h4,h5,h6{color:#000;font-family:var(--font-heebo), sans-serif;font-weight:700}p{color:#444;font-family:var(--font-nanum), serif;max-width:800px;margin-top:12px;font-weight:400}.nav-link{position:relative}.nav-link:after{content:"";background:var(--blue-light);border-radius:9999px;width:0;height:2px;transition:width .3s;position:absolute;bottom:-4px;left:0}.nav-link:hover:after{width:100%}.nav-logo-text{background:linear-gradient(135deg,#fff,#93c5fd);-webkit-text-fill-color:transparent;letter-spacing:-.02em;font-size:1.2rem;font-weight:800;font-family:var(--font-heebo), sans-serif;-webkit-background-clip:text;background-clip:text}.nav-logo-text-scrolled{background:linear-gradient(135deg,#1e3a8a,#3b82f6);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.hero-section{--mouse-x:50%;--mouse-y:50%}.hero-gradient{background:linear-gradient(135deg,#1e3a8aeb 0%,#2563ebc7 50%,#000000a6 100%)}.hero-mouse-gradient{background:radial-gradient(800px circle at var(--mouse-x) var(--mouse-y), #93c5fd21, transparent 50%);pointer-events:none}.hero-dots{pointer-events:none;background-image:radial-gradient(#ffffff1c 1px,#0000 1px);background-size:38px 38px}.hero-shape{pointer-events:none;background:#ffffff0a;border:1px solid #ffffff17;border-radius:50%;animation:linear infinite float;position:absolute}.hero-shape-1{width:360px;height:360px;animation-duration:9s;top:4%;left:-6%}.hero-shape-2{width:240px;height:240px;animation-duration:13s;animation-delay:-5s;top:55%;right:-2%}.hero-shape-3{width:170px;height:170px;animation-duration:11s;animation-delay:-3s;bottom:18%;left:28%}.hero-shape-4{border-radius:18px;width:90px;height:90px;animation-duration:7s;animation-delay:-1.5s;top:22%;right:22%}.hero-title{font-size:clamp(2.5rem,6vw,5rem);font-family:var(--font-heebo), sans-serif;background:linear-gradient(135deg,#fff 0%,#93c5fd 60%,#bfdbfe 100%);-webkit-text-fill-color:transparent;letter-spacing:-.02em;-webkit-background-clip:text;background-clip:text;margin-bottom:1rem;font-weight:800;animation:.7s both fadeInUp}.hero-subtitle{font-size:clamp(1rem,2.5vw,1.35rem);font-family:var(--font-nanum), serif;color:#ffffffe0;white-space:nowrap;border-right:2px solid #93c5fdbf;max-width:fit-content;margin-top:0;margin-bottom:2rem;animation:2.2s steps(50,end) .5s both typewriter,.8s step-end .5s infinite blink;overflow:hidden}.hero-cta{color:#fff;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);font-family:var(--font-heebo), sans-serif;cursor:pointer;background:#ffffff1a;border:2px solid #ffffff8c;border-radius:9999px;padding:.75rem 2.25rem;font-size:1rem;font-weight:600;transition:all .3s;animation:.6s 2.6s both fadeInUp}.hero-cta:hover{color:var(--blue-dark);background:#fff;border-color:#fff;transform:translateY(-3px);box-shadow:0 12px 35px #00000040}.hero-fade-bottom{pointer-events:none;z-index:2;background:linear-gradient(#0000,#fff);height:100px;position:absolute;bottom:0;left:0;right:0}.hero-scroll-indicator{cursor:pointer;z-index:5;flex-direction:column;align-items:center;gap:4px;animation:2.2s ease-in-out infinite bounce-arrow;display:flex;position:absolute;bottom:2.5rem;left:50%;transform:translate(-50%)}.hero-scroll-line{background:linear-gradient(#0000,#ffffffa6);width:1px;height:38px}.hero-scroll-dot{background:#ffffffbf;border-radius:50%;width:6px;height:6px}#aboutmepic{-o-object-fit:cover;object-fit:cover;border-radius:50%;width:150px;min-width:150px;height:150px;transition:transform .4s,box-shadow .4s;box-shadow:0 0 0 4px #3b82f640,0 0 30px #3b82f62e}#aboutmepic:hover{transform:scale(1.08);box-shadow:0 0 0 6px #3b82f673,0 0 50px #3b82f652}.aboutmecontainer{background:#fff;border:1px solid #3b82f624;border-radius:18px;flex-direction:row;align-items:center;gap:2.5rem;max-width:1000px;margin:4rem auto 1rem;padding:2.5rem;transition:box-shadow .3s,transform .3s;display:flex;box-shadow:0 4px 30px #3b82f617,0 1px 8px #0000000d}.aboutmecontainer:hover{transform:translateY(-3px);box-shadow:0 10px 50px #3b82f629,0 2px 12px #0000000f}.aboutme-text h1{text-align:left;background:linear-gradient(135deg, #111, var(--blue-primary));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:.25rem}.aboutme-text h5{color:var(--blue-dark);margin-top:.75rem;font-size:1.05rem}.aboutme-divider{background:linear-gradient(90deg, var(--blue-primary), var(--blue-light));border-radius:9999px;width:40px;height:3px;margin:.9rem 0 .25rem}.section-three-container{background:linear-gradient(135deg,#f0f7ff 0%,#eff6ff 100%);flex-direction:column;padding:4rem 1rem;display:flex;position:relative;overflow:hidden}.section-three-container:before{content:"";pointer-events:none;background:radial-gradient(#3b82f60f 0%,#0000 70%);width:55%;height:200%;position:absolute;top:-40%;left:-15%}.section-three-container h1{text-align:center;background:linear-gradient(135deg, var(--blue-dark), var(--blue-secondary));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:.4rem;font-size:2.2rem}.skills-subtitle{text-align:center;color:#6b7280;font-family:var(--font-nanum), serif;margin-top:0;margin-bottom:0;font-size:1rem}.skill-item{cursor:pointer;min-width:88px;transform-style:preserve-3d;will-change:transform;background:#fff;border:1px solid #3b82f61a;border-radius:14px;flex-direction:column;align-items:center;gap:.6rem;padding:1.25rem 1rem;display:flex;box-shadow:0 2px 12px #3b82f612}.section-three-container img{-o-object-fit:contain;object-fit:contain;width:52px;height:52px;transition:transform .2s}.skill-item:hover img{transform:translateZ(8px)scale(1.1)}.skill-name{font-family:var(--font-heebo), sans-serif;color:#555;font-size:.78rem;font-weight:600;transition:color .2s}.skill-item:hover .skill-name{color:var(--blue-primary)}.work-exp-container{flex-direction:column;display:flex}.example-img{-o-object-fit:cover;object-fit:cover;border-radius:14px 0 0 14px;width:320px;min-width:320px;height:220px;transition:opacity .3s,transform .4s;display:flex}.heading-text{text-align:center;background:linear-gradient(135deg, #111, var(--blue-primary));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin:3rem 0 1rem;font-size:2.2rem}.work{transform-style:preserve-3d;will-change:transform;background:#fff;border:1px solid #3b82f624;border-radius:18px;margin-bottom:1.25rem;display:flex;overflow:hidden;box-shadow:0 4px 20px #3b82f614,0 1px 6px #0000000a}.work-text{flex-direction:column;justify-content:center;gap:.5rem;padding:1.5rem;display:flex}.work-text h1{background:linear-gradient(135deg, #111, var(--blue-primary));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:1.4rem}.work-description{justify-content:center;padding:0 1rem;display:flex}.view-project-btn{background:linear-gradient(135deg, var(--blue-dark), var(--blue-secondary));color:#fff;font-family:var(--font-heebo), sans-serif;border-radius:9999px;width:fit-content;margin-top:1rem;padding:.5rem 1.3rem;font-size:.9rem;font-weight:600;text-decoration:none;transition:all .25s;display:inline-block;box-shadow:0 4px 15px #2563eb47}.view-project-btn:hover{transform:translate(4px);box-shadow:0 6px 25px #2563eb6b}.contact-wrapper{background:linear-gradient(135deg,#f0f7ff 0%,#eff6ff 100%);width:100%;padding:2rem 0 4rem;position:relative;overflow:hidden}.contact-wrapper:after{content:"";pointer-events:none;background:radial-gradient(circle,#3b82f612,#0000 70%);border-radius:50%;width:380px;height:380px;position:absolute;bottom:-100px;right:-80px}.contact-section{z-index:1;flex-direction:column;align-items:center;gap:1rem;width:100%;max-width:700px;padding:0 1rem;display:flex;position:relative}.contact-subtitle{text-align:center;color:#555;margin-top:0;margin-bottom:.5rem;font-size:1rem}.contact-section iframe{border:1px solid #3b82f62e;border-radius:16px;max-width:100%;box-shadow:0 4px 30px #3b82f61a}.contact-divider{background:linear-gradient(90deg, var(--blue-primary), var(--blue-light));border-radius:9999px;width:60px;height:3px;margin:.5rem 0}.contact-links-heading{color:var(--blue-dark);letter-spacing:.07em;text-transform:uppercase;font-size:1.05rem;font-weight:700}.socials-container{gap:1.25rem;padding:.5rem 0 1rem}.socials-container img{filter:grayscale(.2);height:54px;padding:5px;transition:filter .3s,transform .25s}.socials-container img:hover{filter:grayscale(0);transform:scale(1.2)translateY(-5px)}.resume-section{background-color:#fff;padding:1rem 1rem 3rem}.resume-container{flex-direction:column;gap:1.5rem;max-width:860px;margin:0 auto;display:flex}.resume-block{background:#fff;border:1px solid #3b82f621;border-radius:16px;padding:1.75rem 2rem;transition:box-shadow .3s,transform .3s;box-shadow:0 2px 16px #3b82f612}.resume-block:hover{transform:translateY(-2px);box-shadow:0 8px 35px #3b82f621}.resume-block-title{font-family:var(--font-heebo), sans-serif;text-transform:uppercase;letter-spacing:.1em;color:var(--blue-primary);border-bottom:2px solid #3b82f624;margin-bottom:1.25rem;padding-bottom:.5rem;font-size:.85rem;font-weight:700}.resume-item{margin-bottom:1.5rem}.resume-item:last-child{margin-bottom:0}.resume-item-header{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:.25rem;margin-bottom:.4rem;display:flex}.resume-item-org{font-family:var(--font-heebo), sans-serif;color:#000;font-size:1.05rem;font-weight:700}.resume-item-role{font-family:var(--font-heebo), sans-serif;color:#333;margin-top:0;font-size:.95rem;font-weight:600}.resume-item-date{font-family:var(--font-heebo), sans-serif;color:#888;font-size:.85rem}.resume-item-link{font-family:var(--font-heebo), sans-serif;color:var(--blue-primary);font-size:.85rem;text-decoration:underline;transition:color .2s}.resume-item-link:hover{color:var(--blue-dark)}.resume-item-desc{color:#555;margin-top:.25rem;font-size:.95rem}.resume-item-list{flex-direction:column;gap:.3rem;margin-top:.25rem;padding-left:1.25rem;display:flex}.resume-item-list li{font-family:var(--font-nanum), serif;color:#555;font-size:.95rem}.resume-skills-grid{flex-wrap:wrap;gap:.6rem;display:flex}.resume-skill-tag{font-family:var(--font-heebo), sans-serif;color:var(--blue-dark);cursor:default;background:#3b82f612;border:1px solid #3b82f633;border-radius:9999px;padding:.3rem .9rem;font-size:.82rem;font-weight:600;transition:background .2s,color .2s,transform .2s,border-color .2s}.resume-skill-tag:hover{background:var(--blue-primary);color:#fff;border-color:var(--blue-primary);transform:translateY(-2px)}.resume-download{justify-content:center;margin-top:.5rem;display:flex}.resume-download-btn{color:#fff;background:linear-gradient(135deg, var(--blue-dark), var(--blue-secondary));border:none;text-decoration:none;transition:all .3s;display:inline-block;box-shadow:0 4px 18px #2563eb4d}.resume-download-btn:hover{color:#fff;transform:translateY(-2px);box-shadow:0 8px 28px #2563eb6b}.popup{background-color:#00000080;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:fixed;top:0;left:0}.popup-content{background-color:#fff;border:1px solid #3b82f633;border-radius:14px;padding:20px;box-shadow:0 8px 40px #3b82f633}@media (max-width:700px){.work{flex-direction:column}.example-img{width:100%;min-width:unset;border-radius:14px 14px 0 0;height:200px}.aboutmecontainer{text-align:center;flex-direction:column;gap:1.5rem;padding:1.75rem}.aboutme-text h1{text-align:center}.aboutme-divider{margin:.9rem auto .25rem}}