*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:root{--text-primary: #111111;--text-secondary: #777777;--text-tertiary: #888888;--text-muted: #999999;--border: #ececec;--border-hover: #cccccc;--bg-page: #fafafa;--bg-card: #ffffff;--bg-header: rgba(255, 255, 255, .92);--card-shadow: rgba(0, 0, 0, .04);--transition-speed: .3s}[data-theme=dark]{--text-primary: #f0f0f0;--text-secondary: #aaaaaa;--text-tertiary: #888888;--text-muted: #666666;--border: #2a2a2a;--border-hover: #444444;--bg-page: #121212;--bg-card: #1a1a1a;--bg-header: rgba(18, 18, 18, .92);--card-shadow: rgba(0, 0, 0, .4)}body{font-family:Outfit,system-ui,-apple-system,sans-serif;background-color:var(--bg-page);color:var(--text-primary);line-height:1.6;min-height:100vh;transition:background-color var(--transition-speed) ease,color var(--transition-speed) ease}a{text-decoration:none;color:inherit}img{max-width:100%;display:block}@keyframes fadeUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.app-container{display:flex;min-height:100vh;flex-direction:row;background-color:var(--bg-page);color:var(--text-primary);transition:background-color var(--transition-speed) ease,color var(--transition-speed) ease}.brand-panel{width:32%;min-width:320px;max-width:400px;height:100vh;position:sticky;top:0;background-color:var(--bg-card);border-right:1px solid var(--border);padding:4rem 2.5rem;display:flex;flex-direction:column;justify-content:space-between;box-sizing:border-box;transition:background-color var(--transition-speed) ease,border-color var(--transition-speed) ease;z-index:10}.brand-header{display:flex;justify-content:flex-end;margin-bottom:2rem}.theme-toggle-btn{background:var(--bg-page);border:1px solid var(--border);color:var(--text-primary);width:44px;height:44px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s cubic-bezier(.16,1,.3,1);box-shadow:0 4px 12px var(--card-shadow);padding:0}.theme-toggle-btn:hover{border-color:var(--border-hover);transform:scale(1.08) rotate(15deg);background-color:var(--bg-card)}.brand-content{flex:1;display:flex;flex-direction:column;justify-content:center;margin-bottom:2rem}.logo-wrapper{margin-bottom:2rem;display:inline-block}.brand-logo{height:80px;width:auto;transition:transform .4s cubic-bezier(.16,1,.3,1)}.brand-panel:hover .brand-logo{transform:scale(1.03)}[data-theme=dark] .brand-logo{filter:invert(1) brightness(.95)}.brand-title{font-size:3.25rem;font-weight:700;letter-spacing:-.04em;line-height:1.1;margin-bottom:.5rem}.brand-tagline{font-size:.8rem;color:var(--text-muted);letter-spacing:.15em;text-transform:uppercase;font-weight:600;margin-bottom:2rem}.brand-divider{width:60px;height:4px;background-color:var(--text-primary);margin-bottom:2rem;border-radius:2px}.brand-description{font-size:1rem;color:var(--text-secondary);line-height:1.7;font-weight:350;max-width:380px}.brand-footer-desktop{margin-top:auto}.brand-copy{font-size:.8rem;color:var(--text-muted);font-weight:400;letter-spacing:.01em}.projects-panel{flex:1;padding:6rem 3rem;display:flex;flex-direction:column;gap:3rem;box-sizing:border-box;overflow-y:auto}.projects-header{animation:fadeUp .8s cubic-bezier(.16,1,.3,1) both}.projects-badge{display:inline-block;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--text-secondary);padding:.35rem .85rem;background-color:var(--bg-card);border:1px solid var(--border);border-radius:20px;margin-bottom:1rem}.projects-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem;width:100%}.project-card{display:flex;flex-direction:column;align-items:flex-start;background-color:var(--bg-card);border:1px solid var(--border);border-radius:20px;padding:2.25rem 1.75rem;text-decoration:none;color:inherit;box-shadow:0 4px 20px var(--card-shadow);transition:all .4s cubic-bezier(.16,1,.3,1);box-sizing:border-box;animation:fadeUp .8s cubic-bezier(.16,1,.3,1) both;animation-delay:calc(var(--card-index) * .15s);position:relative;height:100%}.project-card:hover{transform:translateY(-6px);border-color:var(--border-hover);box-shadow:0 20px 44px var(--card-shadow)}.card-brand-header{display:flex;align-items:center;gap:.35rem;font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;font-weight:600;color:var(--text-muted);margin-bottom:.5rem}.card-brand-dot{font-size:1rem;color:var(--text-primary);line-height:1}.card-brand-name{font-weight:600}.card-project-title{font-size:1.65rem;font-weight:700;letter-spacing:-.03em;line-height:1.1;color:var(--text-primary);margin:0 0 .5rem;transition:color var(--transition-speed) ease}.card-project-tagline{font-size:.75rem;color:var(--text-muted);letter-spacing:.12em;text-transform:uppercase;font-weight:600;margin:0 0 1.25rem}.card-project-divider{width:40px;height:3px;background-color:var(--text-primary);margin-bottom:1.25rem;border-radius:1.5px;transition:width .3s cubic-bezier(.16,1,.3,1)}.project-card:hover .card-project-divider{width:70px}.card-project-description{font-size:.9rem;color:var(--text-secondary);line-height:1.6;font-weight:350;margin:0 0 2rem}.card-footer{width:100%;margin-top:auto}.card-visit-link{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font-size:.8rem;font-weight:600;color:var(--text-primary);padding:.45rem 1.25rem;border:1.5px solid var(--text-primary);border-radius:30px;background-color:transparent;transition:all .3s ease;width:100%;box-sizing:border-box}.card-visit-link svg{transition:transform .3s ease}.project-card:hover .card-visit-link{background-color:var(--text-primary);color:var(--bg-card)}.project-card:hover .card-visit-link svg{transform:translate(4px)}.brand-footer-mobile{display:none}@media(max-width:992px){.app-container{flex-direction:column}.brand-panel{width:100%;max-width:100%;min-width:unset;height:auto;position:relative;border-right:none;border-bottom:1px solid var(--border);padding:3rem 2rem 2.5rem}.brand-header{position:absolute;top:2rem;right:2rem;margin-bottom:0}.brand-content{margin-bottom:0;align-items:center;text-align:center}.logo-wrapper{margin-bottom:1.5rem}.brand-title{font-size:2.75rem}.brand-divider{margin:1.25rem auto}.brand-description{max-width:500px}.brand-footer-desktop{display:none}.projects-panel{padding:4rem 2rem 5rem;gap:2.5rem}.projects-header{text-align:center}.projects-grid{display:flex;flex-direction:column;gap:1.5rem;margin:0 auto;width:100%;max-width:600px}.brand-footer-mobile{display:block;text-align:center;margin-top:2rem;border-top:1px solid var(--border);padding-top:2rem;width:100%;max-width:720px;margin-left:auto;margin-right:auto}}@media(max-width:640px){.project-card{padding:1.75rem 1.5rem}.brand-title{font-size:2.25rem}}
