@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap";.hero{min-height:100vh;display:flex;align-items:center;position:relative}.hero-content{padding:120px 0}.hero-title{font-size:clamp(60px,12vw,180px);font-weight:600;line-height:.9;letter-spacing:-.03em;margin-bottom:40px;overflow:hidden}.hero-title span{display:block;overflow:hidden}.hero-subtitle{font-size:clamp(16px,2vw,20px);color:var(--color-text-secondary);font-weight:400;max-width:500px;letter-spacing:-.01em}.hero-scroll{position:absolute;bottom:60px;left:60px;display:flex;align-items:center;gap:20px;font-size:12px;text-transform:uppercase;letter-spacing:.1em;color:var(--color-text-secondary)}.hero-scroll-line{width:1px;height:60px;background:var(--color-border);animation:scrollLine 2s ease-in-out infinite}@keyframes scrollLine{0%,to{transform:scaleY(.3);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}}@media (max-width: 768px){.hero{min-height:100vh}.hero-content{padding:60px 0 100px}.hero-title{margin-bottom:20px}.hero-subtitle{max-width:100%}.hero-scroll{left:20px;bottom:30px}.hero-scroll-line{height:40px}}.about{padding:120px 0;border-top:1px solid var(--color-border);position:relative}.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:120px}.about-title{font-size:14px;text-transform:uppercase;letter-spacing:.1em;color:var(--color-text-secondary);margin-bottom:40px;font-weight:500}.about-description{font-size:clamp(24px,3vw,36px);line-height:1.4;font-weight:400;letter-spacing:-.02em}.skills-title{font-size:14px;text-transform:uppercase;letter-spacing:.1em;color:var(--color-text-secondary);margin-bottom:40px;font-weight:500}.skills-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}.skill-item{font-size:16px;padding:16px 0;border-bottom:1px solid var(--color-border);transition:color .3s ease}.skill-item:hover{color:var(--color-text-secondary)}@media (max-width: 968px){.about{padding:60px 0}.about-grid{grid-template-columns:1fr;gap:60px}.skills-grid{grid-template-columns:1fr}.about-title,.skills-title{margin-bottom:24px;font-size:12px}.about-description{font-size:clamp(20px,5vw,28px)}.skill-item{font-size:14px;padding:12px 0}}@media (max-width: 768px){.about{padding:40px 0 80px}.about-grid{gap:30px}.skills-grid{grid-template-columns:repeat(2,1fr);gap:12px}.skill-item{font-size:13px;padding:10px 0}.about-title,.skills-title{margin-bottom:20px}}.marquee-container{width:100%;overflow:hidden;padding:60px 0;border-top:1px solid var(--color-border);border-bottom:1px solid var(--color-border)}.marquee{overflow:hidden;white-space:nowrap}.marquee-content{display:inline-flex;gap:60px;will-change:transform}.marquee-item{font-size:clamp(32px,5vw,64px);font-weight:500;letter-spacing:-.02em;color:var(--color-text);opacity:.15;transition:opacity .3s ease}.marquee-item:hover{opacity:1}@media (max-width: 768px){.marquee-container{padding:30px 0;margin-bottom:20px}.marquee-content{gap:30px}.marquee-item{font-size:clamp(24px,8vw,40px)}}.details-panel-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#00000080;z-index:2000;opacity:0;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);pointer-events:none;transition:opacity .3s ease}.details-panel-overlay[style*="opacity: 1"],.details-panel-overlay[style*="opacity:1"]{pointer-events:auto}.details-panel{position:fixed;top:0;left:0;width:500px;max-width:90vw;height:100vh;background:var(--color-bg);border-right:1px solid var(--color-border);z-index:2001;overflow-y:auto;overflow-x:hidden;padding:60px 40px;transform:translate(-100%);will-change:transform;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}.details-panel-close{position:absolute;top:24px;right:24px;width:40px;height:40px;display:flex;align-items:center;justify-content:center;border:1px solid var(--color-border);color:var(--color-text);transition:all .3s ease}.details-panel-close:hover{border-color:var(--color-text);transform:rotate(90deg)}.details-panel-content{display:flex;flex-direction:column;gap:40px}.detail-section{padding-bottom:40px;border-bottom:1px solid var(--color-border)}.detail-section:last-child{border-bottom:none;padding-bottom:0}.detail-section-title{font-size:12px;text-transform:uppercase;letter-spacing:.1em;color:var(--color-text-secondary);font-weight:500;margin-bottom:20px}.detail-section-text{font-size:16px;line-height:1.6;color:var(--color-text);font-weight:400;letter-spacing:-.01em}.detail-stack{display:flex;flex-wrap:wrap;gap:8px}.detail-stack-item{font-size:13px;padding:8px 16px;border:1px solid var(--color-border);color:var(--color-text-secondary);transition:all .3s ease}.detail-stack-item:hover{border-color:var(--color-text-secondary);color:var(--color-text)}.detail-features{list-style:none;display:flex;flex-direction:column;gap:16px}.detail-feature-item{font-size:15px;line-height:1.6;color:var(--color-text);padding-left:20px;position:relative}.detail-feature-item:before{content:"—";position:absolute;left:0;color:var(--color-text-secondary)}.detail-links{display:flex;flex-direction:column;gap:16px}.detail-link{display:inline-flex;align-items:center;justify-content:space-between;font-size:16px;color:var(--color-text);padding:16px 0;border-bottom:1px solid var(--color-border);transition:all .3s ease}.detail-link:hover{padding-left:12px;border-bottom-color:var(--color-text)}.detail-link svg{opacity:0;transform:rotate(-45deg);transition:all .3s ease}.detail-link:hover svg{opacity:1;transform:rotate(0)}@media (max-width: 768px){.details-panel{width:100vw;max-width:100vw;padding:40px 20px}.details-panel-close{top:16px;right:16px}.details-panel-content{gap:30px}.detail-section{padding-bottom:30px}}.project-detail-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:var(--color-bg);z-index:1000;opacity:0;overflow-y:auto;overflow-x:hidden}.project-detail-close{position:fixed;top:60px;right:60px;display:flex;align-items:center;gap:12px;font-size:14px;text-transform:uppercase;letter-spacing:.1em;color:var(--color-text);z-index:1001;padding:12px 24px;border:1px solid var(--color-border);transition:all .3s ease}.project-detail-close:hover{border-color:var(--color-text);gap:16px}.project-detail-container{position:relative;width:100%;min-height:100vh}.project-detail-image{position:absolute;width:80vw;max-width:1200px;aspect-ratio:16 / 9;background:#111;border:none;border-top:1px solid var(--color-border);border-bottom:1px solid var(--color-border);overflow:hidden;will-change:transform,left,top}.project-detail-image img{width:100%;height:100%;object-fit:cover;pointer-events:none;display:block}.project-detail-info{position:fixed;bottom:0;left:0;right:0;padding:40px 60px;background:linear-gradient(to top,var(--color-bg) 70%,transparent);z-index:1001}.project-detail-info-content{max-width:800px;margin:0 auto;text-align:center}.project-detail-title{font-size:clamp(32px,5vw,56px);font-weight:500;letter-spacing:-.02em;margin-bottom:12px}.project-detail-subtitle{font-size:clamp(14px,2vw,18px);color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.1em;margin-bottom:24px}.project-detail-tags{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-bottom:24px}.project-detail-more{display:inline-flex;align-items:center;gap:12px;padding:12px 24px;border:1px solid var(--color-border);background:transparent;color:var(--color-text);font-size:14px;text-transform:uppercase;letter-spacing:.1em;font-weight:500;transition:all .3s ease;margin-top:8px;cursor:pointer;z-index:1002;position:relative}.project-detail-more:hover{border-color:var(--color-text);gap:16px}.project-detail-more svg{transition:transform .3s ease}.project-detail-more:hover svg{transform:translate(4px,-4px)}.project-detail-tag{font-size:12px;padding:6px 16px;border:1px solid var(--color-border);color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.05em}.project-detail-scroll-indicator{position:fixed;right:60px;top:50%;transform:translateY(-50%);z-index:1001;display:flex;flex-direction:column;align-items:center;gap:12px;pointer-events:none}.scroll-indicator-content{display:flex;flex-direction:column;align-items:center;gap:12px}.scroll-indicator-text{font-size:12px;text-transform:uppercase;letter-spacing:.15em;color:var(--color-text-secondary);writing-mode:vertical-rl;text-orientation:mixed;font-weight:500}.scroll-indicator-line{width:1px;height:60px;background:var(--color-text-secondary);transform-origin:top}@media (max-width: 768px){.project-detail-close{top:16px;right:16px;padding:10px 16px;font-size:12px;gap:8px}.project-detail-close svg{width:18px;height:18px}.project-detail-image{width:95vw!important;max-width:none!important}.project-detail-info{padding:24px 20px}.project-detail-info-content{text-align:center;max-width:100%}.project-detail-title{font-size:clamp(24px,8vw,32px);margin-bottom:8px}.project-detail-subtitle{font-size:12px;margin-bottom:16px}.project-detail-tags{justify-content:center;gap:8px;margin-bottom:20px}.project-detail-tag{font-size:11px;padding:4px 12px}.project-detail-more{padding:10px 20px;font-size:12px;gap:8px}.project-detail-more svg{width:16px;height:16px}.project-detail-scroll-indicator{right:16px;display:none}.scroll-indicator-line{height:40px}}.works{height:100vh;overflow:hidden;position:relative}.works-header{position:absolute;top:0;left:0;width:100%;padding:60px 0;z-index:10}.works-header .container{display:flex;flex-direction:column;gap:8px;align-items:flex-start}.works-title{font-size:14px;text-transform:uppercase;letter-spacing:.1em;color:var(--color-text-secondary);font-weight:500}.works-hint{font-size:12px;text-transform:uppercase;letter-spacing:.1em;color:var(--color-text-secondary);opacity:.5;animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{opacity:.5}50%{opacity:1}}.works-scroll{display:flex;gap:60px;padding:180px 60px 60px;height:100%;will-change:transform}.work-item{flex-shrink:0;width:600px;display:flex;flex-direction:column;gap:30px;cursor:pointer;transition:transform .3s cubic-bezier(.4,0,.2,1);position:relative;will-change:transform}.work-item:hover{transform:translateY(-8px)}.work-image{width:100%;height:450px;overflow:hidden;background:#111;border-radius:0;position:relative;border:none;will-change:transform}.work-image img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.4,0,.2,1),filter .3s ease;will-change:transform}.work-item:hover .work-image img{transform:scale(1.02);filter:brightness(.8)}.work-view-more{position:absolute;bottom:24px;right:24px;display:flex;align-items:center;gap:12px;padding:12px 24px;background:transparent;color:var(--color-text);font-size:14px;text-transform:uppercase;letter-spacing:.1em;font-weight:500;border:1px solid var(--color-border);opacity:0;transform:translateY(10px);transition:all .3s ease;pointer-events:none}.work-item:hover .work-view-more{opacity:1;transform:translateY(0);border-color:var(--color-text-secondary)}.work-view-more svg{transition:transform .3s ease}.work-item:hover .work-view-more svg{transform:translate(4px,-4px)}.work-info{display:flex;flex-direction:column;gap:12px}.work-title{font-size:24px;font-weight:500;letter-spacing:-.01em;transition:color .3s ease}.work-item:hover .work-title{color:var(--color-text-secondary)}.work-subtitle{font-size:14px;color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.05em}.work-tags{display:flex;gap:12px;flex-wrap:wrap;margin-top:8px}.work-tag{font-size:12px;color:var(--color-text-secondary);padding:6px 12px;border:1px solid var(--color-border);border-radius:20px;transition:all .3s ease}.work-item:hover .work-tag{border-color:var(--color-text-secondary)}@media (max-width: 768px){.works{height:auto;overflow:visible;min-height:auto}.works-header{position:relative;padding:40px 0 20px}.works-scroll{flex-direction:column;padding:20px 20px 40px;gap:40px;transform:none!important;height:auto}.work-item{width:100%;gap:20px}.work-image{height:250px}.work-title{font-size:20px}.work-subtitle{font-size:12px}.work-tags{gap:8px}.work-tag{font-size:11px;padding:4px 10px}.works-hint{display:none}}.contact{min-height:100vh;display:flex;align-items:center;padding:120px 0;border-top:1px solid var(--color-border)}.contact-title{font-size:clamp(48px,8vw,120px);font-weight:500;line-height:1;letter-spacing:-.03em;margin-bottom:80px}.contact-links{display:flex;flex-direction:column;gap:0;margin-bottom:120px}.contact-link{display:flex;align-items:center;justify-content:space-between;font-size:clamp(32px,5vw,64px);font-weight:400;padding:30px 0;border-bottom:1px solid var(--color-border);transition:all .3s ease;letter-spacing:-.02em;color:var(--color-text);opacity:1}.contact-link:first-child{border-top:1px solid var(--color-border)}.contact-link svg{opacity:0;transform:rotate(-45deg);transition:all .3s ease}.contact-link:hover{padding-left:20px;color:var(--color-text-secondary)}.contact-link:hover svg{opacity:1;transform:rotate(0)}.contact-footer{font-size:14px;color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.1em}@media (max-width: 768px){.contact{padding:40px 0;min-height:auto}.contact-title{margin-bottom:40px;font-size:clamp(32px,10vw,48px)}.contact-links{margin-bottom:60px}.contact-link{padding:16px 0;font-size:clamp(24px,6vw,32px)}}.app{width:100%;min-height:100vh}.container{max-width:1400px;margin:0 auto;padding:0 60px}@media (max-width: 768px){.container{padding:0 20px}}*{margin:0;padding:0;box-sizing:border-box}:root{--color-bg: #0a0a0a;--color-text: #ffffff;--color-text-secondary: #888888;--color-accent: #ffffff;--color-border: rgba(255, 255, 255, .1)}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;background:var(--color-bg);color:var(--color-text);line-height:1.6;overflow-x:hidden}::selection{background:var(--color-text);color:var(--color-bg)}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}button{font-family:inherit;cursor:pointer;border:none;background:none}html.lenis{height:auto}.lenis.lenis-smooth{scroll-behavior:auto}.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}.lenis.lenis-stopped{overflow:hidden}.lenis.lenis-scrolling iframe{pointer-events:none}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:4px;transition:background .3s ease}::-webkit-scrollbar-thumb:hover{background:#fff3}::-webkit-scrollbar-thumb:active{background:#ffffff4d}*{scrollbar-width:thin;scrollbar-color:var(--color-border) transparent}*::-webkit-scrollbar-corner{background:transparent}