#root{min-height:100vh}:root{--background:#0b0e0c;--surface:#121815;--surface-light:#18211c;--text:#f6f1e6;--muted-text:#a8ada5;--emerald:#2f8f70;--emerald-light:#4fb98f;--brass:#c7a35b;--border:#29342e}*{box-sizing:border-box}html{scroll-behavior:smooth}body{background-color:var(--background);color:var(--text);margin:0;font-family:Arial,sans-serif}.portfolio{width:100%;min-height:100vh}main{background-color:var(--surface);width:100%;margin:0;padding:0 28px}section{border-top:1px solid var(--border);width:100%;padding:80px 0}section h2{color:var(--text);text-align:center;margin:0 0 28px;font-size:2.5rem}section p{color:var(--muted-text);line-height:1.7}.site-nav{background-color:var(--surface);border-bottom:1px solid var(--border);grid-template-columns:auto auto 1fr;align-items:center;width:100%;min-height:110px;padding:0 28px;display:grid}.site-brand{color:var(--text);white-space:nowrap;justify-self:start;font-size:2rem;font-weight:700;text-decoration:none}.site-links{justify-content:flex-start;gap:34px;margin-left:40px;display:flex}.social-links{justify-content:flex-end;gap:28px;display:flex}.site-links a,.social-links a{color:var(--text);align-items:center;gap:8px;font-size:1.1rem;font-weight:600;text-decoration:none;transition:color .2s;display:inline-flex}.site-links a:hover,.social-links a:hover{color:var(--brass)}.social-icon{width:20px;height:20px;transition:color .2s,transform .2s}.social-links a:hover .social-icon{transform:translateY(-2px)}@media (width<=800px){.site-nav{grid-template-columns:1fr auto;gap:20px;padding:24px}.site-brand{font-size:1.5rem}.site-links{grid-area:2/1/auto/-1;justify-content:flex-start;gap:22px;margin-left:0}.social-links{gap:18px}}@media (width<=500px){.site-nav{flex-direction:column;align-items:flex-start;gap:20px;display:flex}.site-links,.social-links{flex-wrap:wrap;justify-content:flex-start;margin-left:0}.site-brand{font-size:1.4rem}.site-links{gap:18px}.social-links{gap:20px}}.intro{background-color:var(--background);text-align:left;width:100%;min-height:560px;margin:0;padding:80px 380px 100px 28px;position:relative}.intro-line{color:var(--text);letter-spacing:-2px;margin:0;font-size:4rem;font-weight:700;line-height:1.15}.intro-reveal,.intro-title{animation:1.2s both blurToClear}.intro-title{margin-top:28px}@keyframes blurToClear{0%{opacity:0;filter:blur(12px);transform:translateY(8px)}to{opacity:1;filter:blur();transform:translateY(0)}}.intro-description{max-width:700px;color:var(--muted-text);margin:32px 0 0;font-size:1.05rem;line-height:1.7}.intro-buttons{justify-content:flex-start;gap:16px;margin-top:32px;display:flex}.intro-buttons a{border:1px solid var(--brass);color:var(--text);border-radius:6px;padding:12px 20px;text-decoration:none;transition:all .3s}.intro-buttons a:first-child{background-color:var(--brass);color:#10130f}.intro-buttons a:hover{background-color:var(--emerald);border-color:var(--emerald);color:var(--text)}.profile-photo{z-index:2;object-fit:cover;object-position:center top;border:2px solid #c7a35b99;border-radius:28px;width:300px;height:360px;position:absolute;top:100px;right:8%;box-shadow:0 24px 55px #00000073}@media (width<=900px){.intro{padding-right:28px}.profile-photo{margin:50px auto 0;display:block;position:relative;top:auto;right:auto}}@media (width<=600px){.intro{min-height:auto;padding:60px 0 70px}.intro-line{font-size:2.7rem}.intro-title{margin-top:20px}.intro-buttons{flex-wrap:wrap}.profile-photo{width:250px;height:300px}}#about{padding:80px 0;position:relative}#about:before{content:"";background-color:var(--emerald);width:2px;position:absolute;top:145px;bottom:60px;left:0}#about h2{color:var(--brass);text-align:left;margin:0 0 28px}#about p{max-width:850px;color:var(--muted-text);margin:0 0 16px;padding-left:40px;font-size:1.1rem;line-height:1.8}#about p:last-child{margin-bottom:0}@media (width<=600px){#about{padding:60px 0}#about:before{top:125px;bottom:45px}#about p{padding-left:24px;font-size:1rem}}#skills{padding:80px 0}#skills h2{color:var(--brass);text-align:left;margin:0 0 36px}.skills-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;display:grid}.skill-card{border:1px solid var(--border);background-color:var(--background);border-radius:16px;min-height:270px;padding:28px 30px}.skill-card h3{color:var(--emerald-light);letter-spacing:1.5px;text-transform:uppercase;margin:0 0 24px;font-size:1rem;font-weight:700}.skill-items{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}.skill-items span{border:1px solid var(--border);background-color:var(--surface-light);min-height:58px;color:var(--text);border-radius:10px;align-items:center;gap:10px;padding:10px 12px;font-size:.92rem;line-height:1.3;transition:border-color .2s,background-color .2s,transform .2s;display:flex}.skill-items span:hover{border-color:var(--brass);background-color:#202a23;transform:translateY(-2px)}.skill-logo{flex-shrink:0;width:23px;height:23px}.java-logo{color:#e76f51}.javascript-logo{color:#f7d038}.sql-logo{color:#c7a35b}.html-logo{color:#e76f51}.css-logo{color:#4da6ff}.spring-logo{color:#6db33f}.react-logo{color:#61dafb}.node-logo{color:#79c267}.mysql-logo,.postgres-logo{color:#6fa8dc}.git-logo,.github-logo{color:#f27c4a}.maven-logo{color:#e76f51}.firebase-logo{color:#f7c843}.vscode-logo{color:#4da6ff}.idea-logo{color:#ff7b9c}@media (width<=1100px){.skills-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=600px){#skills{padding:60px 0}.skills-grid{grid-template-columns:1fr}.skill-card{min-height:auto;padding:24px 20px}}#projects{padding:80px 0}#projects h2{color:var(--brass);text-align:left;margin:0 0 36px}.project-card,.portfolio-project-card{border:1px solid var(--border);background-color:var(--background);border-radius:18px;grid-template-columns:1.1fr .9fr;align-items:center;gap:44px;padding:32px;display:grid}.portfolio-project-card{margin-top:32px}.project-gallery{background-color:#080a09;border:1px solid #c7a35b73;border-radius:16px;min-width:0;padding:14px;box-shadow:0 14px 35px #0000004d}.gallery-main,.main-project-image{aspect-ratio:16/9;border:1px solid var(--border);background-color:#050605;border-radius:10px;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.gallery-frame{width:100%;height:100%}.gallery-main img,.main-project-image img,.gallery-frame img{object-fit:contain;width:100%;height:100%;display:block}.gallery-arrow{z-index:2;border:1px solid var(--border);width:40px;height:40px;color:var(--brass);cursor:pointer;background-color:#000000bf;border-radius:50%;justify-content:center;align-items:center;font-size:1.25rem;display:flex;position:absolute;top:50%;transform:translateY(-50%)}.gallery-arrow:hover{background-color:var(--brass);color:#111}.gallery-arrow-left{left:14px}.gallery-arrow-right{right:14px}.gallery-thumbnails,.project-thumbnails{grid-template-columns:repeat(5,1fr);gap:10px;margin-top:14px;display:grid}.gallery-thumbnail,.project-thumbnail{cursor:pointer;opacity:.6;background-color:#080a09;border:2px solid #0000;border-radius:7px;height:68px;padding:0;overflow:hidden}.gallery-thumbnail:hover,.gallery-thumbnail.active,.project-thumbnail:hover,.active-thumbnail{border-color:var(--brass);opacity:1}.gallery-thumbnail img,.project-thumbnail img{object-fit:cover;width:100%;height:100%}.project-content{padding:10px 0}.project-content h3{color:var(--text);margin:0 0 20px;font-size:2.3rem}.project-description,.project-contribution{color:var(--muted-text);margin:0;font-size:.98rem;line-height:1.7}.project-contribution{margin-top:18px}.project-technologies{flex-wrap:wrap;gap:9px;display:flex}.project-technologies span{border:1px solid var(--border);background-color:var(--surface-light);color:var(--emerald-light);border-radius:6px;padding:8px 12px;font-size:.85rem}.project-button{border:1px solid var(--brass);background-color:var(--brass);color:#111;border-radius:6px;margin-top:28px;padding:12px 20px;font-weight:700;text-decoration:none;transition:background-color .2s,color .2s,transform .2s;display:inline-block}.project-button:hover{color:var(--brass);background-color:#0000;transform:translateY(-2px)}.device-showcase{background:linear-gradient(145deg,#18211c,#080a09);border:1px solid #c7a35b73;border-radius:16px;flex-direction:column;align-items:center;padding:28px 24px 0;display:flex;box-shadow:0 18px 35px #0000004d}.desktop-monitor{background-color:#050605;border:2px solid #333c35;border-radius:10px 10px 4px 4px;width:100%;overflow:hidden;box-shadow:0 12px 25px #0006}.monitor-screen{aspect-ratio:16/9;background-color:#050605;overflow:hidden}.monitor-screen img{object-fit:contain;width:100%;height:100%;display:block}.monitor-stand{clip-path:polygon(35% 0,65% 0,100% 100%,0 100%);background:linear-gradient(90deg,#0000 0%,#303a32 25% 75%,#0000 100%);width:18%;height:34px}.monitor-base{background-color:#303a32;border-radius:10px 10px 0 0;width:42%;height:8px;margin-bottom:2px}.portfolio-project-card .project-content{padding:0}.portfolio-project-card .project-content h3{margin:0;line-height:1.2}.portfolio-project-card .project-technologies{margin-top:14px}.portfolio-project-card .project-description{margin:20px 0 0;line-height:1.7}@media (width<=1100px){.project-card,.portfolio-project-card{grid-template-columns:1fr}}@media (width<=600px){#projects{padding:60px 0}.project-card,.portfolio-project-card{gap:28px;padding:18px}.project-gallery{padding:9px}.gallery-thumbnails,.project-thumbnails{gap:6px}.gallery-thumbnail,.project-thumbnail{height:48px}.project-content h3,.portfolio-project-card .project-content h3{font-size:1.8rem}.device-showcase{padding:18px 14px 0}}#education{padding:60px 0}#education h2{color:var(--brass);text-align:left;margin:0 0 28px}.education-timeline{width:100%;max-width:none;margin:0;position:relative}.education-timeline:before{content:"";background-color:var(--border);width:1px;position:absolute;top:24px;bottom:24px;left:178px}.education-item{grid-template-columns:140px 76px 1fr;gap:0;margin-bottom:54px;display:grid;position:relative}.education-item:last-child{margin-bottom:0}.education-date{color:var(--brass);text-align:right;padding-top:5px;font-size:.95rem;font-weight:700;line-height:1.5}.education-date span{color:var(--muted-text);font-size:.8rem;font-weight:400;display:block}.education-marker{z-index:1;border:1px solid var(--brass);background-color:var(--background);width:38px;height:38px;color:var(--brass);border-radius:50%;justify-content:center;align-items:center;margin:0 auto;font-size:1rem;display:flex;position:relative}.education-details{padding-left:24px}.education-school{color:var(--emerald-light);margin:0 0 8px;font-size:1.15rem;font-weight:700}.education-details h3{color:var(--text);margin:0 0 8px;font-size:1.25rem}.education-minor{color:var(--muted-text);margin:0}.education-details h4{color:var(--brass);letter-spacing:1px;text-transform:uppercase;margin:24px 0 12px;font-size:.9rem}.coursework-list{flex-wrap:wrap;gap:9px;display:flex}.coursework-list span{border:1px solid var(--border);background-color:var(--surface-light);color:var(--muted-text);border-radius:6px;padding:8px 12px;font-size:.85rem}@media (width<=700px){#education{padding:45px 0}.education-timeline:before{left:18px}.education-item{grid-template-columns:38px 1fr;gap:16px}.education-date{text-align:left;grid-area:1/2;padding:0}.education-marker{grid-area:1/1/span 2;margin:0}.education-details{grid-area:2/2;padding-left:0}.education-school{margin-top:18px}}#experience{padding:60px 0}#experience h2{color:var(--brass);text-align:left;margin:0 0 28px}.experience-list{flex-direction:column;gap:18px;display:flex}.experience-card{border:1px solid var(--border);background-color:var(--background);border-radius:14px;grid-template-columns:58px 1fr;align-items:start;gap:22px;padding:26px 30px;transition:border-color .25s,background-color .25s,transform .25s;display:grid}.experience-card:hover{border-color:var(--brass);background-color:var(--surface-light);transform:translateY(-3px)}.experience-icon{width:48px;height:48px;color:var(--brass);background-color:#18251f;border:1px solid #c7a35b99;border-radius:50%;justify-content:center;align-items:center;font-size:1.25rem;display:flex}.experience-content{min-width:0}.experience-heading{justify-content:space-between;align-items:flex-start;gap:20px;display:flex}.experience-card h3{color:var(--text);margin:0 0 6px;font-size:1.35rem}.experience-company{color:var(--emerald-light);margin:0 0 14px;font-size:.95rem;font-weight:600}.experience-date{color:var(--brass);letter-spacing:.5px;text-align:right;flex-shrink:0;font-size:.85rem;font-weight:700}.experience-description{max-width:850px;color:var(--muted-text);margin:0;line-height:1.6}.experience-skills{flex-wrap:wrap;gap:9px;margin-top:18px;display:flex}.experience-skills span{border:1px solid var(--border);background-color:var(--surface);color:var(--muted-text);border-radius:6px;padding:7px 11px;font-size:.82rem}@media (width<=600px){#experience{padding:45px 0}.experience-card{grid-template-columns:1fr;gap:16px;padding:22px}.experience-icon{width:42px;height:42px;font-size:1rem}.experience-heading{flex-direction:column;gap:8px}.experience-date{text-align:left}.experience-card h3{font-size:1.2rem}}#interests{padding:60px 0}#interests h2{color:var(--brass);text-align:left;margin:0 0 28px}.interests-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;display:grid}.interest-card{border:1px solid var(--border);background-color:var(--background);text-align:center;border-radius:14px;padding:24px 20px;transition:border-color .25s,background-color .25s,transform .25s}.interest-card:hover{border-color:var(--brass);background-color:var(--surface-light);transform:translateY(-3px)}.interest-icon{margin-bottom:14px;font-size:2rem}.interest-card h3{color:var(--text);margin:0 0 10px;font-size:1.1rem}.interest-card p{color:var(--muted-text);margin:0;font-size:.9rem;line-height:1.6}@media (width<=1100px){.interests-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (width<=700px){.interests-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=450px){#interests{padding:45px 0}.interests-grid{grid-template-columns:1fr}}#contact{padding:60px 0}#contact h2{color:var(--brass);text-align:left;margin:0 0 28px}.contact-description{max-width:650px;color:var(--muted-text);margin:0;line-height:1.7}.contact-links{flex-wrap:wrap;gap:14px;margin-top:24px;display:flex}.contact-links a{border:1px solid var(--brass);color:var(--brass);border-radius:6px;padding:11px 18px;font-weight:700;text-decoration:none;transition:background-color .2s,color .2s,transform .2s}.contact-links a:hover{background-color:var(--brass);color:#111;transform:translateY(-2px)}@media (width<=450px){#contact{padding:45px 0}.contact-links{flex-direction:column;align-items:flex-start}}footer{border-top:1px solid var(--border);background-color:var(--background);width:100%;color:var(--muted-text);text-align:center;padding:40px 28px}footer p{margin:0}@media (width<=600px){footer{padding:32px 20px}}
