:root{--bg:#fcfcfd;--text:#121420;--muted:#667085;--accent:#1c234f;--pill-bg:#f2f4f7;--border:#e5e7eb;--font-head:"Outfit", sans-serif;--font-body:"Inter", sans-serif}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{background:var(--bg);color:var(--text);font-family:var(--font-body);line-height:1.6;overflow-x:hidden}h1,h2,h3,h4{font-family:var(--font-head);line-height:1.15}.navbar{z-index:50;background:#0d0d0d;border-radius:9999px;justify-content:space-between;align-items:center;gap:2rem;width:min(95vw,860px);padding:.9rem 2rem;transition:opacity .3s;display:flex;position:fixed;top:1.25rem;left:50%;transform:translate(-50%);box-shadow:0 8px 32px #0000002e}.navbar-logo{color:#fff;font-family:var(--font-head);white-space:nowrap;font-size:1rem;font-weight:600}.navbar-links{gap:1.75rem;display:flex}.navbar-links a{color:#a1a1a1;font-size:.9rem;text-decoration:none;transition:color .2s}.navbar-links a:hover{color:#fff}.navbar-cta{color:#fff;text-underline-offset:4px;white-space:nowrap;font-size:.9rem;text-decoration:underline}.hero-spacer{height:250vh}@media (width<=640px){.hero-spacer{height:130vh}}.hero-fixed{z-index:10;justify-content:center;align-items:center;padding-top:70px;display:flex;position:fixed;inset:0}.hero-inner{pointer-events:auto;text-align:center;flex-direction:column;align-items:center;gap:0;display:flex}.hero-row{justify-content:center;align-items:center;gap:2.5rem;display:flex}.hero-photo-frame{flex-shrink:0;justify-content:center;align-items:center;display:flex;position:relative}.hero-photo-bg{background:var(--accent);opacity:.12;z-index:0;border-radius:1.25rem;position:absolute;transform:rotate(-12deg)}.hero-photo{z-index:1;object-fit:contain;flex-shrink:0;position:relative;-webkit-mask-image:radial-gradient(48% 48%,#000 45%,#0000 100%);mask-image:radial-gradient(48% 48%,#000 45%,#0000 100%)}.hero-text{flex-direction:column;align-items:flex-start;gap:.4rem;display:flex}.hero-name{font-family:var(--font-head);letter-spacing:-.03em;color:var(--text);white-space:nowrap;font-weight:800;line-height:1}.hero-role{font-family:var(--font-body);color:var(--accent);letter-spacing:.01em;min-height:1.8rem;font-size:clamp(1rem,2.5vw,1.5rem);font-weight:500}.hero-cursor{color:var(--accent);margin-left:1px;font-weight:300;animation:1s step-end infinite blink;display:inline-block}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}.hero-desc{color:var(--muted);max-width:830px;margin-top:1.5rem;font-size:clamp(1rem,2.5vw,1.5rem)}.hero-actions{gap:1rem;margin-top:1.75rem;display:flex}.btn{font-family:var(--font-body);cursor:pointer;border:none;border-radius:9999px;padding:.7rem 1.9rem;font-size:.95rem;font-weight:500;text-decoration:none;transition:transform .2s,box-shadow .2s;display:inline-block}.btn:hover{transform:scale(1.05)}.btn:active{transform:scale(.97)}.btn-solid{background:var(--accent);color:#fff;box-shadow:0 4px 14px #1c234f33}.btn-solid:hover{box-shadow:0 6px 20px #1c234f4d}.btn-outline{color:var(--accent);border:1.5px solid var(--accent);background:0 0}.btn-outline:hover{background:#1c234f0d}.canvas-wrap{z-index:0;pointer-events:none;position:fixed;inset:0}.sections{z-index:20;background:var(--bg);position:relative}.section{width:100%;max-width:1300px;margin:0 auto;padding:5rem clamp(1.5rem,5vw,5rem)}.section-label{background:var(--pill-bg);color:var(--muted);letter-spacing:.08em;text-transform:uppercase;border-radius:9999px;margin-bottom:1.5rem;padding:.35rem 1rem;font-size:.8rem;font-weight:600;display:inline-block}.section-title{margin-bottom:2.5rem;font-size:clamp(1.8rem,4vw,2.8rem);font-weight:700}.about-text{color:var(--text);max-width:820px;font-size:clamp(1.1rem,2.5vw,1.45rem);line-height:1.75}.about-text strong{color:var(--accent);font-weight:700}.about-badges{flex-wrap:wrap;gap:.6rem;margin-top:2rem;display:flex}.badge{background:var(--pill-bg);color:var(--text);border-radius:9999px;padding:.4rem 1rem;font-size:.85rem;font-weight:500}.timeline{flex-direction:column;gap:0;display:flex}.tl-item{border-bottom:1px solid var(--border);gap:1.25rem;padding:1.5rem 0;display:flex}.tl-item:last-child{border-bottom:none}.tl-logo{background:var(--pill-bg);border:1px solid var(--border);border-radius:6px;justify-content:center;align-items:center;width:48px;min-width:48px;height:48px;font-size:1.25rem;display:flex;overflow:hidden}.tl-logo img{object-fit:contain;width:100%;height:100%}.tl-body{flex:1}.tl-title{color:var(--text);margin-bottom:.2rem;font-size:1.05rem;font-weight:700}.tl-org{color:var(--text);font-size:.92rem;font-weight:500}.tl-meta{color:var(--muted);margin-top:.1rem;font-size:.85rem}.tl-desc{color:var(--text);margin-top:.75rem;padding-left:1.1rem;font-size:.9rem;line-height:1.65}.tl-desc li{margin-bottom:.35rem}.project-tabs{background:var(--pill-bg);border-radius:9999px;gap:.5rem;padding:.35rem;display:flex}.tab-btn{font-family:var(--font-body);color:var(--muted);cursor:pointer;background:0 0;border:none;border-radius:9999px;padding:.6rem 1.2rem;font-size:.9rem;font-weight:600;transition:all .3s}.tab-btn:hover{color:var(--text)}.tab-btn.active{color:var(--text);background:#fff;box-shadow:0 2px 10px #0000000f}.projects-grid{grid-template-columns:repeat(2,1fr);gap:2rem;display:grid}.project-card{border:1px solid var(--border);cursor:pointer;aspect-ratio:4/3;background:#fff;border-radius:1rem;position:relative;overflow:hidden;box-shadow:0 2px 10px #0000000a}.project-thumb{object-fit:cover;width:100%;height:100%;transition:transform .45s cubic-bezier(.4,0,.2,1);position:absolute;inset:0}.project-card:hover .project-thumb{transform:scale(1.04)}.project-title-bar{z-index:2;background:linear-gradient(#0000 0%,#0a0a14b8 100%);padding:2.5rem 1.4rem 1.2rem;transition:opacity .3s;position:absolute;bottom:0;left:0;right:0}.project-card:hover .project-title-bar{opacity:0}.project-title{color:#fff;text-shadow:0 1px 4px #0000004d;font-size:1.15rem;font-weight:700}.project-overlay{z-index:3;background:#fff;flex-direction:column;gap:.65rem;padding:1.4rem 1.4rem 1.25rem;transition:transform .38s cubic-bezier(.4,0,.2,1);display:flex;position:absolute;bottom:0;left:0;right:0;transform:translateY(100%)}.project-card:hover .project-overlay{transform:translateY(0)}.project-overlay .project-title{color:var(--text);text-shadow:none}.project-tags{flex-wrap:wrap;gap:.45rem;display:flex}.project-tag{background:var(--pill-bg);color:var(--muted);border-radius:9999px;padding:.2rem .7rem;font-size:.75rem;font-weight:500}.project-desc{color:var(--muted);font-size:.87rem;line-height:1.55}.project-link{color:var(--accent);align-items:center;gap:.35rem;margin-top:.25rem;font-size:.85rem;font-weight:600;text-decoration:none;transition:gap .2s;display:inline-flex}.project-link:hover{gap:.6rem}.footer{border-top:1px solid var(--border);max-width:1300px;margin:0 auto;padding:6rem clamp(1.5rem,8vw,7rem) 4rem}.contact-container{grid-template-columns:1fr 1fr;align-items:center;gap:4rem;display:grid}.contact-text{text-align:left}.footer-heading{letter-spacing:-.02em;font-size:clamp(2.5rem,6vw,4.5rem);font-weight:800;line-height:1.1}.footer-heading span{color:var(--muted)}.footer-socials{justify-content:flex-start;gap:2rem;display:flex}.footer-socials a{color:var(--text);text-underline-offset:4px;font-size:.95rem;font-weight:500;text-decoration:underline;transition:transform .2s,opacity .2s}.footer-socials a:hover{opacity:.7;transform:scale(1.15)}.contact-form{flex-direction:column;gap:2rem;width:100%;display:flex}.form-group input,.form-group textarea{border:none;border-bottom:1px solid var(--border);width:100%;color:var(--text);font-family:var(--font-body);resize:vertical;background:0 0;padding:.5rem 0;font-size:1rem;transition:all .3s}.form-group input::placeholder,.form-group textarea::placeholder{color:#a1a1aa}.form-group input:focus,.form-group textarea:focus{border-bottom-color:var(--accent);outline:none}@media (width<=640px){.navbar-links{display:none}.hero-row{flex-direction:column;align-items:center;gap:1.25rem}.hero-text{text-align:center;align-items:center}.hero-name{white-space:normal;text-align:center}.hero-role{text-align:center}.hero-desc{padding:0 1rem;font-size:.9rem}.hero-actions{flex-direction:row;justify-content:center;gap:.75rem;width:100%;max-width:350px}.hero-actions .btn{text-align:center;flex:1;width:100%;padding:.7rem .5rem;font-size:.9rem}.sections{padding:0 1rem}.section{padding:3rem 0}.projects-grid{grid-template-columns:1fr}.contact-container{text-align:center;grid-template-columns:1fr;gap:2.5rem}.contact-text{text-align:center}.footer-socials{flex-wrap:wrap;justify-content:center;gap:1.25rem}}
