:root{font-family:Arial Black;line-height:1;font-weight:200;color-scheme:light dark;color:#ffffffde;background-color:#121a27;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}.btn{border-radius:24px;border:2px solid #87a6ed;padding:.6em 1.25em;font-size:1rem;font-weight:200;font-family:sans-serif;color:#87a6ed;background-color:#121a27;cursor:pointer;transition:background-color .1s,color .1s}.btn:hover{background-color:#394b74}.app button{border-radius:24px;border:2px solid;border-color:#87a6ed;padding:.6em 1.2em;font-size:1em;font-weight:100;font-family:Verdana;color:#87a6ed;cursor:pointer;transition:border-color .1s}.app button:hover{background-color:#394b74}button{appearance:none;-webkit-appearance:none;background:none;border:none;padding:0;font:inherit;color:inherit}input,textarea,select{appearance:none;-webkit-appearance:none;background:none;border:none;padding:0;margin:0;font:inherit;color:inherit;outline:none}.container{margin:0 auto}@keyframes intro-page-animation{0%{background-position:0%}50%{background-position:100%}to{background-position:0%}}.intro-page{display:flex;align-items:center;flex-direction:column;background:linear-gradient(45deg,#121a27,#24406e 100%,#121a27 0%);background-size:200%;background-repeat:repeat;min-height:clamp(30vh,40vh,90vh);animation:intro-page-animation 20s linear infinite}.profile-pic{width:clamp(150px,40vw,450px);height:clamp(150px,40vw,450px);border-radius:100%;object-fit:cover;margin:5% 0;border:2px solid #355cb8}.introduction{margin-top:3% 0 5% 0;font-size:clamp(1rem,6vw,4rem);text-align:center}.sub-introduction{margin:3% 0 5%;font-size:clamp(.5rem,3vw,1.5rem);text-align:center;max-width:70%}.project-page{display:flex;align-items:center;flex-direction:column;background:#192430}.project-intro{margin-top:5%;font-size:clamp(1rem,5vw,4rem)}.project-container{width:70%;padding:5% 0 0}.project-card{display:flex;align-items:center;flex-direction:row;margin:20px;padding:2%;border-radius:1.5rem;background:linear-gradient(135deg,#2a405e,#36598a);border:2px solid #2f4461}.project-card:hover{transform:translateY(-5px);box-shadow:0 8px 30px #415b80;border-color:#507ab5;cursor:pointer}.project-card img{height:40%;max-width:40%;aspect-ratio:3 / 3;object-fit:cover;object-position:left center;border-radius:.75rem}.project-info{padding:0 0 0 5%}.project-info h3{margin:0 0 3%;font-size:clamp(.8rem,2vw,3rem);color:#e0e7ff;line-height:1.3}.project-info p{margin:0 5% 2% 0;line-height:1.6;color:#c4d0e8;font-size:clamp(.65rem,1.5vw,1.5rem)}.skills-page{display:flex;align-items:center;flex-direction:column;background:#121a26;min-height:50vh}.skills-intro{font-size:50px;margin-top:5%}.skills-container{margin-top:2%;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:16px;width:70%}.skills-item{margin:1%;padding:25px;border-radius:40px;color:#000;background-color:#63b1ba}.skills-item:hover{transform:scale(1.3) rotate(-4deg)}.hh .intro-page{min-height:95vh;padding:4rem 1.5rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.5rem;background:linear-gradient(135deg,#0f172a,#1e293b,#334155);color:#e5e7eb;position:relative;overflow:hidden}.hh .intro-page:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 20% 50%,rgba(59,130,246,.1),transparent 50%),radial-gradient(circle at 80% 50%,rgba(139,92,246,.1),transparent 50%);pointer-events:none}.hh .intro{font-size:clamp(1.5rem,5vw,3rem);font-weight:800;max-width:1000px;text-align:center;line-height:1.2;background:linear-gradient(to right,#e5e7eb,#fff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;padding:20px}.hh .author{font-size:1.25rem;color:#cbd5e1;max-width:800px;text-align:center;font-weight:300}.hh .content-page{padding:5rem 4rem;max-width:1200px;margin:0 auto;display:flex;flex-direction:column;gap:4rem;background:linear-gradient(to bottom,#1e293b,#0f172a);min-height:100vh}.hh .why,.how{font-size:2rem;font-weight:800;color:#f1f5f9;margin-bottom:1.5rem;position:relative;padding-left:1.5rem}.hh .why:before,.how:before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:5px;height:70%;background:linear-gradient(to bottom,#3b82f6,#8b5cf6);border-radius:999px;box-shadow:0 0 10px #3b82f680}.hh .why-answered{font-size:1.125rem;line-height:1.9;color:#cbd5e1;padding:2rem;background:#1e293b99;border-radius:1rem;border:1px solid rgba(59,130,246,.2);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.hh .how-answered{display:flex;flex-direction:column;gap:1.5rem}.hh .how-step{padding:1.75rem 2rem;background:#1e293b99;border-radius:1rem;line-height:1.75;color:#e2e8f0;box-shadow:0 4px 16px #0000004d;border-left:4px solid #3b82f6;border:1px solid rgba(59,130,246,.2);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all .3s ease}.hh .front-image{width:100%;max-width:600px;height:auto;border-radius:50%;box-shadow:0 8px 32px #0000004d,0 0 0 8px #ffffff1a;transition:transform .3s ease,box-shadow .3s ease;position:relative;z-index:1}.hh .front-image:hover{transform:scale(1.05) rotate(2deg);box-shadow:0 12px 40px #0006,0 0 0 8px #ffffff26}.hh img{width:100%;max-width:600px;aspect-ratio:4 / 3;object-fit:cover;border-radius:1rem;box-shadow:0 12px 32px #00000059;border:1px solid rgba(59,130,246,.25);margin:2rem auto;display:block}.hh video{width:100%;max-width:600px;aspect-ratio:4 / 3;object-fit:cover;border-radius:1rem;box-shadow:0 12px 32px #00000059;border:1px solid rgba(59,130,246,.25);margin:2rem auto;display:block}.purt .intro-page{min-height:95vh;padding:4rem 1.5rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.5rem;background:linear-gradient(135deg,#0f172a,#1e293b,#334155);color:#e5e7eb;position:relative;overflow:hidden}.purt .intro-page:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 20% 50%,rgba(59,130,246,.1),transparent 50%),radial-gradient(circle at 80% 50%,rgba(139,92,246,.1),transparent 50%);pointer-events:none}.purt .intro{font-size:clamp(1.5rem,5vw,3rem);font-weight:800;max-width:1000px;text-align:center;line-height:1.2;background:linear-gradient(to right,#e5e7eb,#fff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;padding:20px}.purt .author{font-size:1.25rem;color:#cbd5e1;max-width:800px;text-align:center;font-weight:300}.purt .content-page{padding:5rem 4rem;max-width:1200px;margin:0 auto;display:flex;flex-direction:column;gap:4rem;background:linear-gradient(to bottom,#1e293b,#0f172a);min-height:100vh}.purt .why,.how{font-size:2rem;font-weight:800;color:#f1f5f9;margin-bottom:1.5rem;position:relative;padding-left:1.5rem}.purt .why:before,.how:before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:5px;height:70%;background:linear-gradient(to bottom,#3b82f6,#8b5cf6);border-radius:999px;box-shadow:0 0 10px #3b82f680}.purt .why-answered{font-size:1.125rem;line-height:1.9;color:#cbd5e1;padding:2rem;background:#1e293b99;border-radius:1rem;border:1px solid rgba(59,130,246,.2);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.purt .how-answered{display:flex;flex-direction:column;gap:1.5rem}.purt .how-step{padding:1.75rem 2rem;background:#1e293b99;border-radius:1rem;line-height:1.75;color:#e2e8f0;box-shadow:0 4px 16px #0000004d;border-left:4px solid #3b82f6;border:1px solid rgba(59,130,246,.2);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all .3s ease}.purt .front-image{width:100%;max-width:600px;height:auto;border-radius:50%;box-shadow:0 8px 32px #0000004d,0 0 0 8px #ffffff1a;transition:transform .3s ease,box-shadow .3s ease;position:relative;z-index:1}.purt .front-image:hover{transform:scale(1.05) rotate(2deg);box-shadow:0 12px 40px #0006,0 0 0 8px #ffffff26}.purt img{width:100%;max-width:600px;aspect-ratio:4 / 3;object-fit:cover;border-radius:1rem;box-shadow:0 12px 32px #00000059;border:1px solid rgba(59,130,246,.25);margin:2rem auto;display:block}.purt video{width:100%;max-width:600px;aspect-ratio:4 / 3;object-fit:cover;border-radius:1rem;box-shadow:0 12px 32px #00000059;border:1px solid rgba(59,130,246,.25);margin:2rem auto;display:block}.title{display:flex;align-items:center;flex-direction:column}
