*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:root{--paper:#FFFDF5;--black:#1A1A1A;--dark:#3D3D3D;--lime:#BFFF00;--light:#F0EDE5;--gray:#6B6B6B;--orange:#FF5733}
body{background:var(--paper);color:var(--dark);font-family:'IBM Plex Sans',sans-serif;font-size:16px;line-height:1.7;-webkit-font-smoothing:antialiased;overflow-x:hidden}
.hero{min-height:100vh;display:flex;align-items:center;padding:0 60px;background-image:repeating-linear-gradient(0deg,transparent,transparent 19.5px,#E8E4DC 19.5px,#E8E4DC 20px),repeating-linear-gradient(90deg,transparent,transparent 19.5px,#E8E4DC 19.5px,#E8E4DC 20px);background-size:20px 20px}
.hero-inner{position:relative}
.name{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:120px;color:var(--black);letter-spacing:-0.02em;line-height:1}
.highlight-wrap{position:relative;display:inline-block}
.highlight{position:absolute;bottom:-2px;left:-4px;right:-8px;height:40px;background:var(--lime);z-index:-1;transform:translate(4px,4px)}
.subtitle{font-family:'IBM Plex Mono',monospace;font-size:13px;color:var(--gray);margin-top:16px;letter-spacing:0.02em}
.arrow-down{display:block;margin-top:32px}
.about{max-width:1060px;margin:0 auto;padding:80px 60px}
.broken-grid{display:flex;gap:5%;align-items:flex-start}
.col-left{width:55%}
.col-right{width:40%;margin-top:60px;position:relative}
h2{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:48px;color:var(--black);letter-spacing:-0.02em;margin-bottom:24px}
.tag-list{display:flex;flex-wrap:wrap;gap:8px}
.tag{font-family:'IBM Plex Mono',monospace;font-size:13px;color:var(--gray);background:var(--light);padding:2px 8px;display:inline-block}
.tag.accent-orange{color:var(--orange)}
.arrow-side{position:absolute;top:-30px;right:0}
.projects{max-width:1060px;margin:0 auto;padding:80px 60px}
.project-stack{position:relative;margin-top:40px}
.project-card{border:3px solid var(--black);padding:32px;margin-bottom:-20px;background:var(--paper);position:relative;box-shadow:6px 6px 0px var(--black);transition:transform 0.2s,opacity 0.2s}
.rot-pos{transform:rotate(1deg)}
.rot-neg{transform:rotate(-1deg)}
.card-reveal{opacity:0;transform:scale(0.95)}
.card-reveal.in-view{opacity:1}
.card-reveal.in-view.rot-pos{transform:rotate(1deg) scale(1)}
.card-reveal.in-view.rot-neg{transform:rotate(-1deg) scale(1)}
.project-card h3{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:28px;color:var(--black);margin:8px 0}
.project-card p{color:var(--dark);margin-bottom:12px}
.meta{font-family:'IBM Plex Mono',monospace;font-size:13px;color:var(--gray)}
.footer{max-width:1060px;margin:80px auto 0;padding:0 60px 40px}
.footer-line{border-top:3px solid var(--black);margin-bottom:16px}
.footer-row{display:flex;justify-content:space-between;align-items:center}
.footer-name{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:14px;color:var(--black);text-transform:uppercase;letter-spacing:0.04em}
.stamp{transform:rotate(-12deg);transition:transform 0.3s}
.stamp:hover{transform:rotate(0deg)}
@media(max-width:600px){.name{font-size:64px}.hero{padding:0 24px}.broken-grid{flex-direction:column}.col-left,.col-right{width:100%}.col-right{margin-top:32px}.about,.projects,.footer{padding-left:24px;padding-right:24px}h2{font-size:36px}}
