:root{--bg:#fff;--ink:#1a1a1a;--ink-2:#555;--ink-3:#9a9a9a;--line:#ececec;--orange:#e88a1a;--tint:#fafafa;--sans:var(--font-inter), var(--font-noto-sans-jp), "Inter", "Noto Sans JP", -apple-system, BlinkMacSystemFont, sans-serif}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:var(--sans);color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased;font-size:14px;font-weight:400;line-height:1.8;overflow-x:hidden}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}.container{max-width:960px;margin:0 auto;padding:0 32px}.container-wide{max-width:1200px;margin:0 auto;padding:0 32px}.pc-br{display:inline}@media (max-width:720px){.pc-br{display:none}}.home-nav{z-index:10;color:#fff;justify-content:space-between;align-items:center;padding:24px 40px;transition:color .3s;display:flex;position:fixed;top:0;left:0;right:0}.home-nav.scrolled{color:var(--ink)}.home-nav.scrolled ul a{text-shadow:none}.home-nav .brand{letter-spacing:.18em;text-transform:uppercase;align-items:center;gap:.6em;font-size:13px;font-weight:500;display:inline-flex}.home-nav .brand-logo{flex-shrink:0;width:28px;height:28px;display:block}.home-nav ul{gap:32px;list-style:none;display:flex}.home-nav ul a{letter-spacing:.18em;text-transform:uppercase;opacity:.85;text-shadow:0 0 4px #ffffff8c,0 0 12px #ffffff40;font-size:12px;font-weight:400;transition:text-shadow .25s,opacity .25s}.home-nav ul a:hover{opacity:1;text-shadow:0 0 6px #ffffffb3,0 0 16px #ffffff59}.hero{color:#fff;background-image:linear-gradient(#00000026 0%,#0000000d 40%,#00000059 100%),url(https://images.unsplash.com/photo-1507525428034-b723cf961d3e?auto=format&fit=crop&w=2400&q=80);background-position:50%;background-size:cover;flex-direction:column;justify-content:flex-end;height:100vh;min-height:640px;padding:0 40px 120px;display:flex;position:relative}.hero-inner{width:100%;max-width:960px;margin:0 auto}.hero-label{letter-spacing:.3em;text-transform:uppercase;opacity:.9;margin-bottom:20px;font-size:11px;font-weight:400}.hero h1{letter-spacing:-.02em;margin-bottom:24px;font-size:clamp(40px,7vw,88px);font-weight:300;line-height:1.05}.hero-sub{opacity:.9;max-width:560px;font-size:14px;font-weight:300;line-height:1.9}.hero-scroll{letter-spacing:.3em;text-transform:uppercase;flex-direction:column;align-items:center;gap:.8em;font-size:10px;animation:2.4s ease-in-out infinite hero-scroll-pulse;display:inline-flex;position:absolute;bottom:32px;left:50%;transform:translate(-50%)}.hero-scroll-arrow{animation:1.8s ease-in-out infinite hero-scroll-bounce;display:inline-block}@keyframes hero-scroll-pulse{0%,to{opacity:.5}50%{opacity:.85}}@keyframes hero-scroll-bounce{0%,to{transform:translateY(0)}50%{transform:translateY(6px)}}@media (prefers-reduced-motion:reduce){.hero-scroll,.hero-scroll-arrow{opacity:.75;animation:none}}.home-section{padding:160px 0}.section-label{letter-spacing:.3em;text-transform:uppercase;color:var(--ink-3);margin-bottom:40px;font-size:11px;font-weight:500}.section-title{letter-spacing:-.01em;max-width:720px;margin-bottom:64px;font-size:clamp(28px,3.6vw,44px);font-weight:300;line-height:1.3}.about p{color:var(--ink-2);max-width:820px;margin-bottom:20px;font-weight:400;line-height:2.1}.skills{border-top:1px solid var(--line)}.skills-grid{grid-template-columns:repeat(2,1fr);gap:0;display:grid}.skill{border-bottom:1px solid var(--line);padding:40px 0}.skill:nth-child(odd){padding-right:48px}.skill:nth-child(2n){border-left:1px solid var(--line);padding-left:48px}.skill-num{letter-spacing:.2em;color:var(--ink-3);margin-bottom:12px;font-size:11px}.skill-name{margin-bottom:10px;font-size:18px;font-weight:500}.skill-desc{color:var(--ink-2);font-size:13px;line-height:1.8}.works-grid{grid-template-columns:1fr;gap:24px;display:grid}.work-card{border:1px solid var(--line);background:#fff;border-radius:4px;grid-template-columns:280px 1fr;align-items:center;gap:48px;padding:40px;transition:border-color .25s,transform .25s;display:grid}.work-card:hover{border-color:var(--ink);transform:translateY(-2px)}.work-card-demo{background:#1a1a2e;border-radius:8px;justify-content:center;align-items:center;padding:16px;display:flex}.work-card-demo img{border-radius:4px;width:100%;height:auto}.work-card-body{flex-direction:column;display:flex}@media (max-width:720px){.work-card{grid-template-columns:1fr;gap:28px;padding:28px 24px}}.work-card-header{justify-content:space-between;align-items:center;margin-bottom:28px;display:flex}.work-num{letter-spacing:.2em;color:var(--ink-3);font-size:11px}.work-status{letter-spacing:.15em;text-transform:uppercase;color:var(--ink-2);background:#f5f5f5;border-radius:999px;padding:3px 10px;font-size:10px}.work-status.live{color:var(--orange);background:#e88a1a14}.work-title{letter-spacing:-.01em;margin-bottom:16px;font-size:24px;font-weight:500}.work-desc{color:var(--ink-2);flex-grow:1;margin-bottom:24px;font-size:13.5px;line-height:1.9}.work-tags{flex-wrap:wrap;gap:6px;margin-bottom:24px;display:flex}.work-tag{border:1px solid var(--line);color:var(--ink-2);border-radius:999px;padding:3px 10px;font-size:11px}.work-link{letter-spacing:.15em;text-transform:uppercase;border-bottom:1px solid var(--ink);align-self:flex-start;padding-bottom:4px;font-size:12px}.work-link:hover{color:var(--orange);border-color:var(--orange)}.work-link-arrow{margin-left:.3em;transition:transform .3s;display:inline-block}.work-link:hover .work-link-arrow{transform:translate(4px)}@media (prefers-reduced-motion:reduce){.work-link-arrow{transition:none}.work-link:hover .work-link-arrow{transform:none}}.contact{border-top:1px solid var(--line);text-align:left}.contact-title{letter-spacing:-.01em;max-width:720px;margin-bottom:64px;font-size:clamp(28px,3.6vw,44px);font-weight:300;line-height:1.3}.contact-title .accent{color:var(--orange)}.contact-list{border-top:1px solid var(--line);flex-direction:column;gap:2px;display:flex}.contact-item{border-bottom:1px solid var(--line);grid-template-columns:120px 1fr auto;align-items:center;padding:24px 0;transition:padding .3s;display:grid}.contact-item:hover{padding-left:12px}.contact-label{letter-spacing:.2em;text-transform:uppercase;color:var(--ink-3);font-size:11px}.contact-value{font-size:16px;font-weight:400}.contact-arrow{color:var(--ink-3);font-size:18px}.contact-item:hover .contact-arrow{color:var(--orange)}footer.site-footer{letter-spacing:.15em;color:var(--ink-3);border-top:1px solid var(--line);justify-content:space-between;align-items:center;padding:40px;font-size:11px;display:flex}@media (max-width:720px){.container{padding:0 24px}.home-section{padding:100px 0}.home-nav{padding:20px 24px}.home-nav ul{gap:18px}.hero{padding:0 24px 60px}.skills-grid{grid-template-columns:1fr}.skill:nth-child(odd),.skill:nth-child(2n){border-left:none;padding-left:0;padding-right:0}.contact-item{grid-template-columns:100px 1fr auto}}.case-nav{z-index:10;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);background:#ffffffd9;justify-content:space-between;align-items:center;padding:20px 40px;display:flex;position:sticky;top:0}.case-nav .brand{letter-spacing:.18em;text-transform:uppercase;font-size:13px;font-weight:500}.case-nav .back{letter-spacing:.15em;text-transform:uppercase;color:var(--ink-2);font-size:12px}.case-nav .back:hover{color:var(--orange)}.case-header{border-bottom:1px solid var(--line);padding:120px 0 80px}.case-meta{letter-spacing:.2em;text-transform:uppercase;color:var(--ink-3);align-items:center;gap:16px;margin-bottom:32px;font-size:11px;display:flex}.case-status{letter-spacing:.15em;text-transform:uppercase;color:var(--orange);background:#e88a1a14;border-radius:999px;padding:3px 10px;font-size:10px}.case-title{letter-spacing:-.02em;margin-bottom:28px;font-size:clamp(32px,4vw,52px);font-weight:300;line-height:1.15}.case-tagline{color:var(--ink-2);max-width:640px;line-height:1.9}.summary{border-bottom:1px solid var(--line);grid-template-columns:repeat(4,1fr);gap:0;display:grid}.summary-item{border-left:1px solid var(--line);padding:48px 24px}.summary-item:first-child{border-left:none}.summary-label{letter-spacing:.2em;text-transform:uppercase;color:var(--ink-3);margin-bottom:12px;font-size:10px}.summary-value{color:var(--ink);font-size:14px;font-weight:400;line-height:1.7}.case-section{border-bottom:1px solid var(--line);padding:120px 0}.case-section:last-of-type{border-bottom:none}.case-section .section-title{letter-spacing:-.01em;max-width:720px;margin-bottom:48px;font-size:clamp(28px,3.6vw,40px);font-weight:300;line-height:1.3}.case-section .section-label{margin-bottom:32px}.body-text{color:var(--ink-2);max-width:680px;margin-bottom:20px;line-height:2.1}.demo-row{grid-template-columns:320px 1fr;align-items:center;gap:64px;margin-top:48px;display:grid}.demo-row.reverse{grid-template-columns:1fr 320px}.demo-frame-phone{background:#1a1a2e;border-radius:12px;padding:18px}.demo-frame-phone img{border-radius:6px}.screenshot-frame{border:1px solid var(--line);background:var(--tint);border-radius:8px;margin-top:48px;padding:12px;box-shadow:0 20px 60px #0000000f}.screenshot-frame img{border-radius:4px;width:100%}.screenshot-caption{text-align:center;color:var(--ink-3);letter-spacing:.1em;margin-top:20px;font-size:12px}.features{grid-template-columns:repeat(2,1fr);gap:0;margin-top:48px;display:grid}.feature{border-top:1px solid var(--line);padding:36px 32px 36px 0}.feature:nth-child(2n){border-left:1px solid var(--line);padding-left:32px;padding-right:0}.feature:nth-last-child(-n+2):not(:nth-child(odd):last-child){border-bottom:1px solid var(--line)}.feature-num{letter-spacing:.2em;color:var(--ink-3);margin-bottom:14px;font-size:11px}.feature-name{margin-bottom:10px;font-size:17px;font-weight:500}.feature-desc{color:var(--ink-2);font-size:13.5px;line-height:1.9}.stack-group{margin-bottom:40px}.stack-label{letter-spacing:.2em;text-transform:uppercase;color:var(--ink-3);margin-bottom:14px;font-size:11px}.stack-tags{flex-wrap:wrap;gap:8px;display:flex}.stack-tag{border:1px solid var(--line);color:var(--ink-2);border-radius:999px;padding:6px 14px;font-size:12px}.roles{grid-template-columns:160px 1fr;margin-top:40px;display:grid}.role-item{display:contents}.role-item .role-label{border-top:1px solid var(--line);letter-spacing:.2em;text-transform:uppercase;color:var(--ink-3);padding:20px 0;font-size:11px}.role-item .role-desc{border-top:1px solid var(--line);color:var(--ink-2);padding:20px 0;font-size:14px;line-height:1.9}.role-item:last-child .role-label,.role-item:last-child .role-desc{border-bottom:1px solid var(--line)}.process{grid-template-columns:repeat(2,1fr);margin-top:48px;display:grid}.process-item{border-top:1px solid var(--line);padding:36px 32px 36px 0}.process-item:nth-child(2n){border-left:1px solid var(--line);padding-left:32px;padding-right:0}.process-item:nth-last-child(-n+2){border-bottom:1px solid var(--line)}.process-num{letter-spacing:.2em;color:var(--ink-3);margin-bottom:14px;font-size:11px}.process-name{margin-bottom:10px;font-size:17px;font-weight:500}.process-desc{color:var(--ink-2);font-size:13.5px;line-height:1.9}.cta-back{text-align:center;padding:120px 0}.cta-back .label{letter-spacing:.3em;text-transform:uppercase;color:var(--ink-3);margin-bottom:24px;font-size:11px}.cta-back .link{letter-spacing:-.01em;border-bottom:1px solid var(--ink);padding-bottom:6px;font-size:24px;font-weight:300}.cta-back .link:hover{color:var(--orange);border-color:var(--orange)}@media (max-width:720px){.container-wide{padding:0 24px}.case-section{padding:80px 0}.case-nav{padding:16px 24px}.case-header{padding:80px 0 60px}.summary{grid-template-columns:repeat(2,1fr)}.summary-item:nth-child(3){border-left:none}.demo-row,.demo-row.reverse{grid-template-columns:1fr;gap:40px}.features{grid-template-columns:1fr}.feature:nth-child(2n){border-left:none;padding-left:0}.process{grid-template-columns:1fr}.process-item:nth-child(2n){border-left:none;padding-left:0}.roles{grid-template-columns:1fr}.role-item .role-label{border-bottom:none;padding-bottom:4px}.role-item .role-desc{border-top:none;padding-top:8px}}