:root{--paper:#f6f8f8;--ink:#172a32;--muted:#586c76;--line:#ccd7dc;--accent:#225c62;--sans:"Yu Gothic UI","Meiryo",system-ui,sans-serif;--serif:"Yu Mincho","Hiragino Mincho ProN",serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.9}a{color:inherit;text-decoration:none}a:hover{color:var(--accent)}a:focus-visible{outline:3px solid #32939d;outline-offset:5px}img{display:block;max-width:100%}p,h1,h2,h3,h4{margin:0}p+p{margin-top:16px}.wrap{width:min(1120px,calc(100% - 80px));margin-inline:auto}.skip{position:absolute;left:12px;top:-100px;background:var(--ink);color:white;padding:12px;z-index:10}.skip:focus{top:12px}.header{display:flex;align-items:center;justify-content:space-between;gap:30px;min-height:112px;border-bottom:1px solid var(--line)}.brand{font-weight:600;font-size:22px;letter-spacing:.1em;line-height:1.5}.brand span{display:block;font-size:12px;letter-spacing:.23em;font-weight:500;color:var(--muted);margin-top:5px}.header nav{display:flex;gap:32px;flex-wrap:wrap;font-size:14px}.eyebrow{font-size:12px;letter-spacing:.19em;font-weight:600;color:var(--accent)}.intro{padding-block:62px 68px}.intro-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;margin-top:22px}h1{font-family:var(--serif);font-size:clamp(30px,3.5vw,44px);font-weight:500;line-height:1.75;letter-spacing:.045em}.intro-text{padding-top:8px;color:var(--muted)}.intro-text p:first-child{color:var(--ink)}.section-head{display:flex;align-items:baseline;justify-content:space-between;gap:24px;padding-bottom:25px;border-bottom:1px solid var(--line);margin-bottom:30px}h2{font-size:22px;font-weight:600;letter-spacing:.05em}.section-head p{font-size:14px;color:var(--muted)}.work-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px}.work{background:white;border:1px solid var(--line);border-radius:4px;overflow:hidden}.visual{height:300px;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden}.epoke-visual{background:#e4eee9}.epoke-visual img{width:232px;height:232px;object-fit:contain;transform:translateY(-7px)}.diorama-visual{background:#172a32}.diorama-visual img{width:100%;height:100%;object-fit:cover}.visual-label{position:absolute;bottom:15px;left:22px;color:var(--accent);font-size:13px;letter-spacing:.08em}.diorama-visual .visual-label{color:white;background:#172a32dc;padding:0 8px}.work-body{padding:28px 30px 31px}.work-meta{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:13px;color:var(--muted);margin-bottom:14px}.badge{font-size:12px;background:#edf2f3;border:1px solid #d8e2e5;border-radius:3px;padding:2px 9px;white-space:nowrap;color:#46616b}h3{font-size:25px;font-weight:600;line-height:1.5}.work-lead{margin-top:10px;font-size:17px}.work-body>p:not(.work-lead){color:var(--muted);margin-top:15px}.text-link{display:inline-flex;justify-content:space-between;gap:24px;align-items:center;color:var(--accent);margin-top:24px;border-bottom:1px solid #91b1b5;font-size:15px;font-weight:600;padding-bottom:3px}.small-note{font-size:13px;color:var(--muted)}.development-head{display:flex;justify-content:space-between;gap:20px;align-items:baseline;margin-block:50px 21px}.development-head h3{font-size:18px;font-weight:500}.development-head p{font-size:13px;color:var(--muted)}.prototype-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}.prototype{border-top:2px solid #718d98;padding-top:22px}.prototype-top{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:17px}.index{font-family:Georgia,serif;font-size:20px;color:#819aa4}h4{font-size:21px;font-weight:600}.prototype-lead{font-size:15px;margin-top:8px}.prototype>p:last-child{font-size:14px;color:var(--muted);margin-top:12px}.works-note{font-size:12px;color:var(--muted);margin-top:28px;max-width:76em}.works{padding-bottom:70px}.about{background:#172a32;color:#f1f6f7;padding-block:64px}.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px}.about .eyebrow{color:#a5c7cd}.about h2{font-size:23px;margin-top:12px;font-weight:500}.about-copy{color:#c4d6dd}.about-copy p:first-child{color:white;font-size:22px;font-family:var(--serif);line-height:1.8}.about-copy p{font-size:15px}.contact{display:grid;grid-template-columns:1fr 1fr;gap:48px;padding-block:56px}.contact h2{margin-top:8px}.contact-link{display:inline-block;color:var(--accent);border-bottom:1px solid #91b1b5;font-size:19px;line-height:1.6;margin-top:8px;overflow-wrap:anywhere}.contact .small-note{margin-top:16px}.footer{border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:25px;padding-block:28px}.footer p,.footer>a:last-child{font-size:12px;color:var(--muted)}.footer .brand{font-size:18px}
@media(max-width:800px){.wrap{width:calc(100% - 40px)}.header{min-height:100px;align-items:flex-start;padding-block:23px}.header nav{justify-content:flex-end;gap:10px 20px;max-width:250px;font-size:13px}.intro-grid{grid-template-columns:1fr;gap:22px}.intro{padding-block:42px 45px}.intro-text p+p{margin-top:10px}.work-grid{gap:20px}.visual{height:230px}.epoke-visual img{width:185px;height:185px}.work-body{padding:22px}.work-meta{flex-wrap:wrap}.prototype-grid{gap:20px}.prototype-top{align-items:flex-start;flex-wrap:wrap}.about-grid,.contact{gap:28px;grid-template-columns:.8fr 1.2fr}.desktop{display:none}}
@media(max-width:580px){.wrap{width:calc(100% - 36px)}.header{display:block;padding-block:21px}.header nav{max-width:none;justify-content:flex-start;gap:20px;margin-top:22px;font-size:12px}.brand{font-size:21px}h1{font-size:30px}.section-head{display:block;margin-bottom:20px;padding-bottom:16px}.section-head p{margin-top:8px}.work-grid{grid-template-columns:1fr;gap:24px}.visual{height:270px}.epoke-visual img{width:210px;height:210px}.work-body{padding:23px}.development-head{display:block;margin-top:36px}.development-head p{margin-top:7px}.prototype-grid{grid-template-columns:1fr;gap:28px}.prototype-top{flex-wrap:nowrap;margin-bottom:11px}.prototype p:last-child{font-size:15px}.about-grid,.contact{grid-template-columns:1fr;gap:24px}.about{padding-block:40px}.contact{padding-block:40px}.footer{flex-wrap:wrap;gap:15px}.footer .brand{width:100%}.footer>a:last-child{margin-left:auto}.intro-text{font-size:15px}.works{padding-bottom:42px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}