*{margin:0;padding:0;box-sizing:border-box}:root{--cream: #f5f1e8;--black: #1a1a1a;--gray: #666666;--light-gray: #e0e0e0;--white: #ffffff;--accent: #ff6b6b;--orange-dot: #ff9a62}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:var(--black);line-height:1.6;background:var(--white);overflow-x:hidden}.app{min-height:100vh;display:flex;flex-direction:column}.container{max-width:1400px;margin:0 auto;padding:0 2rem;width:100%}.header{background:var(--white);border-bottom:1px solid var(--light-gray);position:sticky;top:0;z-index:100}.header .container{max-width:1200px;margin:0 auto;padding:1.2rem 1rem;display:flex;align-items:center;justify-content:space-between}.logo{font-size:1.4rem;font-weight:500;color:var(--black)}.nav{display:flex;gap:3rem}.nav a{color:var(--black);text-decoration:none;font-weight:400;font-size:.95rem;transition:opacity .3s ease;letter-spacing:.5px;text-align:center}.nav a:hover{opacity:.6}.availability-badge{display:flex;align-items:center;gap:.5rem;font-size:.9rem;white-space:nowrap}.menu-btn{display:none;background:none;border:none;font-size:1.6rem;cursor:pointer}.mobile-nav{display:none}@media(max-width:768px){.menu-btn{display:block}.nav,.availability{display:none}.mobile-nav{display:flex;flex-direction:column;gap:1rem;padding:1rem 1.25rem;background:var(--white);border-top:1px solid var(--light-gray)}.mobile-nav a{color:var(--black);text-decoration:none;font-weight:400;font-size:1rem;letter-spacing:.5px;padding:.5rem 0;transition:opacity .3s ease}.mobile-nav a:hover{opacity:.6}}.hero{background:var(--cream);width:100%;padding:6rem 0 4rem;min-height:auto;display:flex;align-items:center;overflow-x:hidden}.hero-content{max-width:100%}.hero-image{width:min(320px,100%);aspect-ratio:1/1;overflow:hidden;margin:0 auto}.hero-image img{width:100%;height:100%;object-fit:cover;display:block}.hero-bottom{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:3rem;gap:1rem}.hero-statement{flex:1}.statement-large{font-size:4rem;font-weight:900;line-height:.9;letter-spacing:-2px;margin-bottom:.2rem}.statement-name{font-size:4rem;font-weight:900;line-height:.9;letter-spacing:-2px;margin-bottom:.25rem}.hero-role{text-align:right;flex:1}.role-title{font-size:4.5rem;font-weight:900;line-height:1;letter-spacing:-1px}.hero-description{text-align:right;font-size:1rem;color:var(--black);line-height:1.6}.hero-description p{margin:0}section{padding:6rem 0}.section-title{font-size:3rem;font-weight:900;text-align:center;margin-bottom:4rem;color:var(--black);letter-spacing:-1px}.projects{background:var(--white)}.projects-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:2rem}.project-card{background:var(--white);border-radius:12px;overflow:hidden;border:1px solid var(--light-gray);transition:transform .3s ease,box-shadow .3s ease}.project-card:hover{transform:translateY(-4px);box-shadow:0 12px 24px #0000001a}.divider{width:80%;margin:2rem auto;border:none;border-bottom:1px solid #ddd}.project-image img{width:100%;height:225px;object-fit:cover;border-radius:.5rem}.project-content{padding:2rem}.project-title{font-size:1.75rem;font-weight:700;margin-bottom:1rem;color:var(--black)}.project-description{color:var(--gray);margin-bottom:1.5rem;line-height:1.7;font-size:.95rem}.project-tech{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.5rem}.tech-tag{background:var(--cream);color:var(--black);padding:.375rem .875rem;border-radius:6px;font-size:.8rem;font-weight:500}.project-links{display:flex;gap:1.5rem}.projects-featured-grid{display:flex;flex-direction:column;gap:1.5rem;margin-bottom:4rem}.featured-project-card{background:var(--white);border:1px solid var(--light-gray);border-top:3px solid var(--black);border-radius:12px;padding:2.5rem 3rem;transition:transform .3s ease,box-shadow .3s ease}.featured-project-card:hover{transform:translateY(-4px);box-shadow:0 12px 24px #0000001a}.featured-project-title{font-size:1.85rem;font-weight:900;margin-bottom:.75rem;letter-spacing:-.5px;color:var(--black)}.featured-project-tagline{color:var(--gray);font-size:1rem;line-height:1.7;margin-bottom:1.5rem;max-width:720px}.subsection-title{font-size:1.5rem;font-weight:700;letter-spacing:-.5px;margin-bottom:2rem;color:var(--black)}.project-link{color:var(--black);text-decoration:none;font-weight:600;font-size:.9rem;transition:opacity .3s ease}.project-link:hover{opacity:.6}.about{background:var(--cream)}.about-content{display:grid;grid-template-columns:1.2fr 1fr;gap:4rem;max-width:1200px;margin:0 auto}.about-text p{margin-bottom:1.5rem;color:var(--gray);font-size:1.05rem;line-height:1.8}.skills-heading{font-size:1.25rem;font-weight:700;margin-bottom:1.5rem;letter-spacing:.5px}.skills-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem}.skill-item{background:var(--white);padding:.875rem 1.25rem;border-radius:8px;text-align:center;font-weight:500;font-size:.9rem;border:1px solid var(--light-gray)}.contact{background:var(--white)}.contact-content{display:grid;grid-template-columns:1fr 1.2fr;gap:4rem;max-width:1200px;margin:0 auto}.contact-heading{font-size:2rem;font-weight:700;margin-bottom:1.5rem;letter-spacing:-.5px}.contact-text{color:var(--gray);margin-bottom:2.5rem;line-height:1.8;font-size:1.05rem}.contact-details{display:flex;flex-direction:column;gap:1.5rem}.contact-item{display:flex;flex-direction:column;gap:.5rem}.contact-label{font-size:.75rem;font-weight:700;letter-spacing:1px;color:var(--gray)}.contact-item a,.contact-item span{color:var(--black);text-decoration:none;font-size:1.05rem;transition:opacity .3s ease}.contact-item a:hover{opacity:.6}.contact-form{background:var(--cream);padding:2.5rem;border-radius:12px}.form-group{margin-bottom:1.5rem}.form-group label{display:block;margin-bottom:.5rem;font-weight:600;color:var(--black);font-size:.9rem}.form-group input,.form-group textarea{width:100%;padding:.875rem 1rem;border:1px solid var(--light-gray);border-radius:8px;font-size:1rem;font-family:inherit;transition:border-color .3s ease;background:var(--white)}.form-group input:focus,.form-group textarea:focus{outline:none;border-color:var(--black)}.form-group textarea{resize:vertical}.btn{padding:1rem 2rem;border-radius:8px;font-weight:700;text-decoration:none;display:inline-block;transition:all .3s ease;border:none;cursor:pointer;font-size:.9rem;letter-spacing:.5px;width:100%}.btn-primary{background:var(--black);color:var(--white)}.btn-primary:hover{opacity:.85}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.submit-message{margin-top:1rem;padding:.875rem;background:var(--black);color:var(--white);border-radius:8px;text-align:center;font-size:.9rem}.footer{background:var(--black);color:var(--white);padding:2.5rem 0;margin-top:auto}.footer .container{display:flex;justify-content:space-between;align-items:center}.footer p{font-size:.9rem;opacity:.7}.social-links{display:flex;gap:2rem}.social-links a{color:var(--white);text-decoration:none;transition:opacity .3s ease;font-size:.9rem}.social-links a:hover{opacity:.6}@media(max-width:1024px){.hero-title{font-size:4rem}.statement-large,.statement-name{font-size:3rem}.role-title{font-size:2.75rem}.projects-grid{grid-template-columns:1fr}}@media(max-width:768px){.featured-project-card{padding:2rem 1.5rem}}@media(max-width:768px){.container{padding:0 1.5rem}.nav{gap:1.5rem}.nav a{font-size:.85rem}.hero{padding:5rem 0 4rem}.hero-title{font-size:3rem;margin-bottom:2.5rem}.hero-bottom{flex-direction:column;gap:2rem}.statement-large,.statement-name{font-size:2.5rem}.role-title{font-size:2.25rem}.hero-description{text-align:left}.section-title{font-size:2.25rem}.about-content,.contact-content{grid-template-columns:1fr;gap:2.5rem}.skills-grid{grid-template-columns:1fr}.footer .container{flex-direction:column;gap:1.5rem;text-align:center}section{padding:4rem 0}}@media(max-width:480px){.container{padding:0 1rem}.hero-title{font-size:2.5rem}.statement-large,.statement-name{font-size:2rem}.role-title,.section-title{font-size:1.75rem}.contact-form{padding:1.5rem}}.project-detail{background:var(--white)}.project-hero{background:var(--cream);padding:6rem 0 4rem}.back-link{display:inline-block;margin-bottom:1.5rem;text-decoration:none;color:var(--black);font-size:.9rem;font-weight:500;opacity:.7}.back-link:hover{opacity:1}.project-detail-title{font-size:3.5rem;font-weight:900;letter-spacing:-1px;margin-bottom:1rem}.project-tagline{font-size:1.1rem;color:var(--gray);max-width:700px;margin-bottom:2rem}.project-meta{display:flex;gap:2rem;font-size:.9rem;color:var(--gray)}.project-section{padding:6rem 0}.bg-light{background:var(--cream)}.container-narrow{max-width:900px;margin:0 auto;padding:0 2rem}.section-heading{font-size:2.25rem;font-weight:900;letter-spacing:-.5px;margin-bottom:2.5rem}.project-text{font-size:1.05rem;color:var(--gray);line-height:1.8}.problem-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:2rem}.problem-card{background:var(--white);padding:2rem;border-radius:12px;border:1px solid var(--light-gray)}.problem-card h3{font-size:1.1rem;font-weight:700;margin-bottom:.75rem}.features-list{display:flex;flex-direction:column;gap:2.5rem}.feature-item{display:flex;gap:1.5rem}.feature-number{font-size:1.25rem;font-weight:900;color:var(--gray)}.feature-content h3{font-size:1.15rem;font-weight:700;margin-bottom:.5rem}.feature-content p{color:var(--gray);line-height:1.7}.tech-categories{display:grid;grid-template-columns:repeat(2,1fr);gap:2rem}.tech-category-title{font-size:1rem;font-weight:700;margin-bottom:.75rem}.tech-tags{display:flex;flex-wrap:wrap;gap:.5rem}.learning-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:2rem}.learning-card{background:var(--white);padding:2rem;border-radius:12px;border:1px solid var(--light-gray)}.learning-card h3{margin-bottom:.75rem}.learning-points{margin-top:1rem;padding-left:1.2rem;color:var(--gray)}.learning-points li{margin-bottom:.5rem}.project-cta{background:var(--black);color:var(--white);padding:5rem 0;text-align:center}.project-cta h2{font-size:2.25rem;margin-bottom:1rem}.project-cta p{opacity:.8;margin-bottom:2rem}.cta-buttons{display:flex;justify-content:center;gap:1.5rem}.btn-secondary{background:transparent;border:1px solid var(--white);color:var(--white)}.btn-secondary:hover{opacity:.7}@media(max-width:768px){.problem-grid,.tech-categories,.learning-grid{grid-template-columns:1fr}.project-detail-title{font-size:2.5rem}.feature-item,.cta-buttons{flex-direction:column}}.screenshots-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:2rem}.screenshot-card{background:var(--white);border-radius:12px;border:1px solid var(--light-gray);overflow:hidden;transition:transform .3s ease,box-shadow .3s ease}.screenshot-card:hover{transform:translateY(-4px);box-shadow:0 12px 24px #00000014}.screenshot-card img{width:100%;height:260px;object-fit:cover;display:block}.screenshot-caption{padding:1rem 1.25rem;font-size:.9rem;color:var(--gray)}
