:root{--ink:#343b36;--paper:#faf9f5;--muted:#687168;--line:#d2d7ce;--sage:#dce4d9;--header:126px}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:var(--header)}body{margin:0;color:var(--ink);background:var(--paper);font-family:'Hiragino Kaku Gothic ProN','Yu Gothic',sans-serif;line-height:1.9;-webkit-font-smoothing:antialiased}h1,h2,h3,p{margin:0}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}button:disabled{cursor:default;opacity:.55}button,a,summary{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible{outline:3px solid #8b6140;outline-offset:5px}img,video{display:block;max-width:100%}svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linejoin:round;stroke-linecap:round}.icon-defs{position:absolute;width:0;height:0;overflow:hidden}.skip{position:fixed;top:-90px;left:20px;z-index:100;background:white;padding:15px}.skip:focus{top:10px}.brand{font:600 40px/1.2 'Hiragino Mincho ProN','Yu Mincho',serif;letter-spacing:.15em;white-space:nowrap}.brand span{display:block;font:8px/1.7 sans-serif;letter-spacing:.15em;margin-top:12px}.site-header{height:var(--header);background:var(--paper);border-bottom:1px solid var(--line);display:flex;justify-content:center;align-items:center;gap:130px;position:sticky;top:0;z-index:30;padding:20px 5%}.site-header nav{display:flex;gap:45px}.site-header nav a{display:flex;flex-direction:column;align-items:center;min-width:82px;font-size:12px;gap:6px}.site-header nav svg{width:49px;height:49px;transition:transform .25s}.site-header nav a:hover svg{transform:translateY(-4px)}.menu-toggle{display:none}.hero{position:relative;height:calc(100svh - var(--header));min-height:600px;max-height:900px;overflow:hidden;isolation:isolate;background:#5e6155}.hero-media{position:absolute;inset:-90px 0;will-change:transform;z-index:-2}.hero-media video{height:100%;width:100%;object-fit:cover}.hero-shade{position:absolute;inset:0;background:linear-gradient(#17211818,#14211729 40%,#121c18b8);z-index:-1}.hero-title{position:absolute;top:42%;left:15px;right:15px;text-align:center;color:#fff;text-shadow:0 2px 18px #17211566;will-change:transform}.hero-title>p:first-child{font-size:10px;letter-spacing:.24em}.hero-title h1{font:500 66px/1.5 'Hiragino Mincho ProN','Yu Mincho',serif;letter-spacing:.23em;padding-left:.23em;margin:10px 0 12px}.hero-copy{font-family:'Yu Mincho',serif;font-size:18px;letter-spacing:.13em}.film-stage{position:absolute;top:34px;left:40px;color:#fff;display:flex;align-items:center;gap:14px;font-size:11px;letter-spacing:.08em}.film-stage>span:first-child{font:italic 21px Georgia,serif;opacity:.9}.film-progress{width:70px;height:1px;background:#ffffff70;margin-left:7px}.film-progress i{display:block;height:1px;background:#fff;width:0}.hero-bottom{position:absolute;bottom:28px;left:40px;right:40px;display:flex;align-items:flex-end;justify-content:space-between;color:#fff;gap:20px}.hero-bottom>p{font-size:11px;line-height:1.8}.hero-bottom>p span{font-size:10px;opacity:.8}.hero-bottom button{font-size:11px;color:#fff;padding:10px 17px;border:1px solid #ffffff90;background:#26342930}.hero-bottom button span{margin-left:16px}.scroll-cue{position:absolute;left:50%;bottom:0;transform:translateX(-50%);text-align:center;font-size:9px;letter-spacing:.13em}.scroll-cue span{display:block;font-size:26px;line-height:1.4}.section-band{min-height:165px;padding:35px max(6%,calc((100vw - 1150px)/2));display:flex;align-items:center;justify-content:space-between;gap:55px;background:#e5e9e0;border-bottom:1px solid #c5d0c1;position:relative;z-index:2}.band-label>span{font:italic 29px/1.2 Georgia,serif;letter-spacing:.02em}.band-label h2{font-weight:400;font-size:12px;letter-spacing:.12em;margin-top:12px}.section-band>p{font:400 21px/1.8 'Yu Mincho',serif;letter-spacing:.07em}.intro{text-align:center;padding:49px 26px 43px}.intro p{font-size:14px;line-height:2.15}.intro a{display:inline-block;margin-top:22px;font-size:11px;border-bottom:1px solid #a6b1a1;padding-bottom:4px}.services{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}.service{min-height:650px;position:relative;overflow:hidden;isolation:isolate}.service-photo{position:absolute;inset:-120px -12px;z-index:-2;will-change:transform}.service-photo img{height:100%;width:100%;object-fit:cover}.service:nth-child(1) img{object-position:46% center}.service:nth-child(2) img{object-position:61% center}.service:nth-child(3) img{object-position:50% center}.service:after{content:'';position:absolute;inset:0;background:linear-gradient(#222c1915,#202b1e8c 45%,#17201acc);z-index:-1}.service-inner{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:space-between;gap:55px;padding:50px 26px 43px}.roundel{width:235px;height:235px;border-radius:50%;color:#44503f;background:#f2f3e9ed;display:flex;flex-direction:column;align-items:center;justify-content:center;outline:1px solid #52664833;outline-offset:-12px}.roundel>span{font-size:9px;letter-spacing:.13em}.roundel svg{width:64px;height:64px;margin:23px 0 14px;stroke-width:1.3}.roundel small{font:22px 'Yu Mincho',serif;letter-spacing:.17em}.service-copy{text-align:center;color:#fff}.service-copy:before{content:'';display:block;width:28px;height:3px;background:#fff;margin:0 auto 25px}.service-copy h2{font:400 23px/1.65 'Yu Mincho',serif;letter-spacing:.03em;margin-bottom:20px}.service-copy p{font-size:12px;line-height:2.1}.service-copy a{display:inline-block;font-size:11px;border-bottom:1px solid #c1c9b8;padding-bottom:5px;margin-top:25px}.sample-strip{background:#343d32;color:#d2d9c9;text-align:right;padding:8px 27px;font-size:10px}.works-disclaimer{display:flex;gap:35px;padding:23px 6%;font-size:11px;border-bottom:1px solid var(--line);align-items:center}.works-disclaimer strong{font-weight:500;white-space:nowrap}.works-disclaimer p{color:var(--muted)}.case{display:grid;grid-template-columns:68% 32%;min-height:640px;border-bottom:1px solid var(--line)}.case-visual{position:relative;min-height:640px;overflow:hidden;background:#eeeae0}.case-visual>img,.case-visual>video{height:100%;width:100%;object-fit:cover}.design-visual>img{filter:brightness(.91);height:640px}.sample-layout{position:absolute;left:55px;top:65px;background:#fbf9f1f0;width:290px;min-height:400px;padding:30px 29px;color:#424b3b}.sample-layout small{font-size:9px;letter-spacing:.12em}.sample-layout p{font:500 37px/1.7 'Yu Mincho',serif;margin:45px 0}.sample-layout>span{font-size:8px;letter-spacing:.15em;border-top:1px solid #a5ad9b;display:block;padding-top:18px}.media-label{position:absolute;bottom:18px;left:22px;right:20px;font-size:10px;color:#fff;text-shadow:0 1px 5px #0009;pointer-events:none}.design-visual .media-label{color:#fff}.case-copy{padding:65px 13%;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}.case-number{font-size:9px;letter-spacing:.13em;color:var(--muted)}.case-copy h3{font:500 30px/1.8 'Yu Mincho',serif;margin:23px 0}.case-copy>p{font-size:13px;line-height:2.1}.case-copy dl{margin:32px 0;font-size:11px;width:100%;border-top:1px solid var(--line);padding-top:18px}.case-copy dt{color:var(--muted);font-size:10px;margin-bottom:6px}.case-copy dd{margin:0}.text-button{background:none;border:0;border-bottom:1px solid #879580;padding:13px 0;display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:12px;width:100%;text-align:left}.text-button span{font-size:18px}.text-button:hover{color:#586d42;border-color:#586d42}.video-visual{background:#252d25;display:flex;align-items:center}.video-visual>video{height:auto;max-height:640px;object-fit:contain}.video-visual .media-label{bottom:16px}.tool-visual{display:grid;place-items:center;background:#dce2d5;padding:55px 6%}.tool-demo{width:100%;max-width:610px;background:#f9f8f3;box-shadow:0 20px 55px #35482c20;border:1px solid #b8c4ac}.tool-bar{display:flex;justify-content:space-between;gap:20px;padding:18px 24px;border-bottom:1px solid #d4dbcf;font-size:10px;letter-spacing:.08em}.tool-bar small{font-size:10px;letter-spacing:0}.crop-stage{height:320px;display:grid;place-items:center;padding:22px;background:#eeeee5}.crop-image{aspect-ratio:1 / 1;height:100%;max-width:100%;position:relative;outline:1px solid #70836a;outline-offset:5px;transition:aspect-ratio .4s}.crop-image img{width:100%;height:100%;object-fit:cover}.ratio-options{display:flex;gap:8px;padding:20px 20px 7px}.ratio-options button{flex:1;background:transparent;border:1px solid #c0cbb7;padding:9px 4px;font-size:11px}.ratio-options button[aria-pressed=true]{background:#414e3a;color:#fff;border-color:#414e3a}.tool-demo>p{font-size:10px;padding:6px 20px 16px;color:var(--muted)}.tool-visual .media-label{color:#526248;text-shadow:none;font-size:10px}.profile{max-width:1200px;margin:auto;display:grid;grid-template-columns:1fr 1.4fr;gap:105px;padding:100px 60px}.profile-label>span{font:italic 29px Georgia,serif}.profile-label h2{font:500 42px 'Yu Mincho',serif;letter-spacing:.15em;margin:28px 0}.profile-label p{font:20px/1.9 'Yu Mincho',serif}.profile-body>p{font-size:14px;line-height:2.2;margin-bottom:23px}.profile-body .text-button{max-width:340px;margin-top:28px}.contact-body{padding:60px 6% 65px;text-align:center;background:#f1f3ed}.contact-lead{font-size:17px;letter-spacing:.03em}.consult-options{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin:30px 0 21px}.consult-options button{min-width:165px;padding:14px 21px;border:1px solid #aebba5;background:transparent;font-size:13px}.consult-options button[aria-pressed=true]{background:#414e3a;color:#fff}.contact-body #consult-status{font-size:12px;color:var(--muted);min-height:24px}.primary{min-width:300px;display:inline-flex;justify-content:space-between;align-items:center;gap:60px;padding:18px 25px;background:var(--ink);border:1px solid var(--ink);color:white;font-size:13px;margin-top:26px}.contact-note{font-size:11px;color:var(--muted);line-height:1.9;margin-top:23px}footer{display:flex;justify-content:space-between;gap:35px;align-items:center;padding:45px 6%}footer .brand{font-size:28px}footer .brand span{font-size:7px}footer p{font-size:10px;color:var(--muted)}footer>a:last-child{font-size:11px}.menu-open,.dialog-open{overflow:hidden}dialog{border:0;padding:0;width:min(94vw,1060px);max-height:91svh;background:var(--paper);color:var(--ink)}dialog::backdrop{background:#17221ceb}.dialog-top{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:18px 27px;border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--paper);z-index:2}.dialog-top>span{font-size:10px;letter-spacing:.08em}.dialog-top button{background:transparent;border:1px solid var(--line);padding:8px 17px;font-size:12px}.detail-layout{display:grid;grid-template-columns:1.2fr 1fr}.detail-media{background:#e9ece2}.detail-media img{width:100%;height:100%;object-fit:cover;min-height:420px}.detail-media video{width:100%;margin:35px 0}.detail-copy{padding:42px}.detail-copy h2{font:500 26px/1.7 'Yu Mincho',serif;margin-bottom:25px}.detail-copy p{font-size:13px;line-height:2.1;margin-bottom:22px}.detail-copy ul{font-size:12px;line-height:2.1;padding-left:20px;margin-bottom:22px}.detail-copy .detail-note{font-size:11px;color:var(--muted);border-top:1px solid var(--line);padding-top:20px}.detail-copy .primary{min-width:0;width:100%;gap:20px}.consult-dialog-body{padding:45px 55px;max-width:800px;margin:auto}.eyebrow{font-size:11px;color:var(--muted)}.consult-dialog-body h2{font:500 30px/1.7 'Yu Mincho',serif;margin:12px 0 24px}.consult-dialog-body>p{font-size:14px}.consult-dialog-body ol{padding-left:23px;font-size:14px;line-height:2.3;margin:24px 0}.demo-notice{padding:23px;background:#e8ede1;margin-top:27px;font-size:13px}.demo-notice p{margin-top:10px;font-size:12px}.consult-dialog-body .text-button{margin-top:20px}.paused{scroll-behavior:auto}.paused *{transition:none!important}.reduced [data-parallax]{transform:none!important}
@media(min-width:1600px){.hero{max-height:1000px}.case-visual,.case{min-height:720px}.design-visual>img{height:720px}}
@media(max-width:1050px){.site-header{gap:70px}.site-header nav{gap:25px}.roundel{width:205px;height:205px}.service-inner{padding-left:16px;padding-right:16px}.service-copy h2{font-size:20px}.service-copy p{font-size:11px}.case{grid-template-columns:60% 40%}.case-copy{padding:50px 10%}.case-copy h3{font-size:27px}.sample-layout{left:35px;width:245px;padding:25px;min-height:360px}.sample-layout p{font-size:31px}.tool-visual{padding:55px 5%}.crop-stage{height:280px}.profile{gap:60px;padding:75px 40px}.section-band{padding-left:5%;padding-right:5%}}
@media(max-width:650px){:root{--header:76px}html{scroll-padding-top:var(--header)}.site-header{height:76px;justify-content:space-between;padding:14px 24px;gap:20px}.site-header>.brand{font-size:26px}.brand span{font-size:6px;margin-top:6px;letter-spacing:.08em}.menu-toggle{display:flex;flex-direction:column;justify-content:center;gap:5px;width:42px;height:44px;padding:0;border:0;background:none}.menu-toggle>span{width:29px;height:1px;background:var(--ink);display:block}.menu-toggle small{font-size:7px;letter-spacing:.08em;margin-top:2px}.menu-toggle[aria-expanded=true]>span:first-child{transform:translateY(3px) rotate(45deg)}.menu-toggle[aria-expanded=true]>span:nth-child(2){transform:translateY(-3px) rotate(-45deg)}.site-header nav{display:none;position:absolute;top:76px;left:0;right:0;background:var(--paper);padding:10px 24px 26px;border-bottom:1px solid #a2ad9b;max-height:calc(100svh - 76px);overflow:auto}.site-header nav.open{display:flex;flex-direction:column;gap:0}.site-header nav a{flex-direction:row;gap:20px;font-size:14px;padding:18px 5px;border-top:1px solid var(--line)}.site-header nav svg{width:31px;height:31px}.hero{height:calc(93svh - var(--header));min-height:550px;max-height:750px}.hero-media{inset:-30px 0}.hero-media video{object-position:53% center}.hero-title{top:42%;left:16px;right:16px}.hero-title h1{font-size:49px;margin:14px 0}.hero-title>p:first-child{font-size:8px;letter-spacing:.1em}.hero-copy{font-size:13px;letter-spacing:.03em}.film-stage{top:24px;left:23px;font-size:9px;gap:9px}.film-stage>span:first-child{font-size:18px}.film-progress{width:40px}.hero-bottom{left:22px;right:22px;bottom:20px;gap:13px;align-items:flex-end}.hero-bottom>p{font-size:9px;max-width:190px;line-height:1.6}.hero-bottom>p span{font-size:8px}.hero-bottom button{font-size:9px;padding:8px 10px;min-width:110px;max-width:140px;line-height:1.7}.hero-bottom button span{margin-left:7px}.scroll-cue{bottom:74px;font-size:8px}.scroll-cue span{font-size:23px}.section-band{padding:27px 24px;min-height:163px;align-items:flex-start;gap:22px}.band-label{flex:1;min-width:135px}.band-label>span{font-size:24px}.band-label h2{font-size:10px;letter-spacing:.02em;margin-top:9px}.section-band>p{font-size:14px;line-height:1.9;flex:1;letter-spacing:.02em}.intro{padding:33px 24px}.intro p{font-size:12px;line-height:2}.intro br{display:none}.intro a{font-size:10px;margin-top:18px}.services{grid-template-columns:1fr}.service{min-height:575px}.service-inner{padding:40px 26px 37px;gap:39px}.roundel{width:210px;height:210px}.roundel svg{width:59px;height:59px;margin:19px 0 12px}.roundel small{font-size:22px}.service-photo{inset:-50px 0}.service-photo img{object-position:50% center!important}.service-copy h2{font-size:24px;margin-bottom:18px}.service-copy p{font-size:12px}.service-copy a{font-size:11px;margin-top:22px}.service-copy:before{margin-bottom:22px}.sample-strip{font-size:9px;text-align:center;padding:10px 20px}.works-disclaimer{display:block;padding:22px 24px;font-size:10px}.works-disclaimer p{margin-top:8px;line-height:1.9}.case{grid-template-columns:1fr;min-height:0}.case-visual{min-height:400px;height:440px}.design-visual>img{height:100%;object-position:54% center}.sample-layout{width:185px;min-height:300px;left:25px;top:35px;padding:20px}.sample-layout p{font-size:26px;margin:36px 0}.sample-layout small{font-size:7px}.sample-layout>span{font-size:7px}.case-copy{padding:36px 27px 40px}.case-copy h3{font-size:28px;margin:18px 0}.case-copy>p{font-size:12px;line-height:2}.case-copy dl{margin:24px 0 15px}.case-number{font-size:9px}.text-button{font-size:12px}.media-label{font-size:9px;left:23px;bottom:15px;line-height:1.6}.video-visual{height:320px;min-height:320px}.video-visual>video{width:100%;height:auto}.video-visual .media-label{font-size:9px}.tool-visual{height:475px;min-height:475px;padding:33px 20px 47px}.tool-demo{width:100%;max-width:420px}.tool-bar{padding:13px 14px;gap:12px;font-size:8px}.tool-bar small{font-size:9px}.crop-stage{height:248px;padding:18px}.ratio-options{gap:6px;padding:16px 12px 6px}.ratio-options button{font-size:10px;padding:8px 1px}.tool-demo>p{font-size:9px;padding:5px 12px 12px}.tool-visual .media-label{font-size:9px;left:20px;right:20px;bottom:12px}.profile{grid-template-columns:1fr;gap:35px;padding:55px 28px}.profile-label>span{font-size:26px}.profile-label h2{font-size:36px;margin:18px 0}.profile-label p{font-size:18px}.profile-body>p{font-size:12px;line-height:2.1;margin-bottom:20px}.profile-body .text-button{margin-top:22px}.contact-body{padding:37px 24px 44px}.contact-lead{font-size:13px;line-height:1.9}.consult-options{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:25px 0 18px}.consult-options button{min-width:0;font-size:11px;padding:13px 5px}.contact-body #consult-status{font-size:11px}.primary{min-width:0;width:100%;font-size:12px;padding:16px 20px;gap:25px}.contact-note{font-size:10px}footer{padding:35px 24px;flex-wrap:wrap;gap:25px}footer p{font-size:9px;order:3;width:100%}footer>a:last-child{font-size:10px}footer .brand{font-size:26px}dialog{width:94vw;max-height:92svh}.dialog-top{padding:13px 17px;gap:10px}.dialog-top>span{font-size:8px}.dialog-top button{font-size:10px;padding:7px 11px}.detail-layout{grid-template-columns:1fr}.detail-media img{min-height:0;height:220px;object-fit:cover}.detail-media video{margin:0}.detail-copy{padding:27px}.detail-copy h2{font-size:24px;margin-bottom:20px}.detail-copy p{font-size:12px}.detail-copy ul{font-size:11px}.detail-copy .detail-note{font-size:10px}.consult-dialog-body{padding:28px 24px}.consult-dialog-body h2{font-size:25px;margin:10px 0 22px}.consult-dialog-body>p,.consult-dialog-body ol{font-size:12px}.demo-notice{padding:20px;font-size:12px}.demo-notice p{font-size:11px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}[data-parallax]{transform:none!important}}
/* Keep image dimensions independent of the intrinsic photo size. */
.crop-image{height:276px;width:auto;overflow:hidden}
.crop-image img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
@media(max-width:1050px) and (min-width:651px){.crop-image{height:236px}}
@media(max-width:650px){.crop-image{height:min(212px,calc((100vw - 88px)*.7))}}
@media(max-width:650px){.sample-layout{width:205px}.hero-bottom>p{font-size:10px}.hero-bottom>p span{font-size:9px}}
/* Crop parallax layers without creating an internally scrollable container. */
.hero,.service{overflow:clip}

/* Keep the film in place while About me and the opaque content rise over it. */
#main{position:relative;isolation:isolate}
.hero{position:sticky;top:var(--header);z-index:0}
.page-content{position:relative;z-index:1;background:var(--paper)}
.paused .hero,.reduced .hero{position:relative;top:auto}
@media(prefers-reduced-motion:reduce){.hero{position:relative;top:auto}}

/* Viewport-sized photographs, revealed through each scrolling panel. */
.service-photo{inset:0 0 auto;height:100vh}
.paused .service-photo,.reduced .service-photo{inset:0;height:100%}
@media(prefers-reduced-motion:reduce){.service-photo{inset:0;height:100%}}

.sample-open{display:inline-block;margin-top:28px;padding:0 0 8px;background:none;border:0;border-bottom:1px solid #ffffff80;color:inherit;font-size:12px}
.anchor-alias{display:block;scroll-margin-top:var(--header)}
#detail-content .case-copy h2{font:500 28px/1.7 'Yu Mincho',serif;margin:20px 0}
#detail-content .case-copy ul{font-size:12px;padding-left:20px}
#detail-content .detail-note{font-size:11px;border-top:1px solid var(--line);padding-top:18px;margin-top:20px}
#detail-content .case{grid-template-columns:55% 45%;min-height:0}
#detail-content .case-visual{min-height:420px;height:auto}
#detail-content .case-copy{padding:30px}
#detail-content .primary{min-width:0;width:100%;gap:15px}
@media(max-width:650px){.sample-open{font-size:11px;margin-top:22px}#detail-content .case{grid-template-columns:1fr}#detail-content .case-visual{height:440px}#detail-content .video-visual{height:260px;min-height:260px}#detail-content .tool-visual{height:475px}#detail-content .case-copy{padding:27px}}

.sample-page-bar{display:flex;justify-content:space-between;gap:20px;padding:28px 5%;font-size:12px}.sample-page-bar a{text-decoration:underline;text-underline-offset:5px}.sample-page #detail-content{max-width:1440px;margin:auto}.sample-page #detail-content .case-copy{padding:45px}.sample-page #detail-content .case-visual{min-height:540px}.sample-page #detail-content .video-visual{min-height:360px}.sample-page .detail-note{margin-bottom:20px}@media(max-width:650px){.sample-page-bar{font-size:10px;padding:23px}.sample-page #detail-content .case-copy{padding:27px}.sample-page #detail-content .case-visual{min-height:0}.sample-page #detail-content .tool-visual{height:475px}}

#detail-content .case-copy #sample-title{font:500 28px/1.7 "Yu Mincho",serif;margin:20px 0}

.samples-heading{padding:45px 6%;max-width:1200px;margin:auto}.samples-heading>a{font-size:12px}.samples-heading h1{font:500 36px/1.7 'Yu Mincho',serif;margin:18px 0}.samples-heading p{font-size:12px}.sample-categories{display:flex;flex-wrap:wrap;gap:12px;margin-top:25px}.sample-categories a{border:1px solid var(--line);padding:12px 20px;font-size:13px}.sample-section{scroll-margin-top:12px;border-top:1px solid var(--line)}#detail-content .case-copy h2{font:500 28px/1.7 'Yu Mincho',serif;margin:20px 0}@media(max-width:650px){.samples-heading{padding:28px 24px}.sample-categories a{font-size:11px;padding:10px 12px}.samples-heading h1{font-size:30px}}
html:has(.sample-page){scroll-behavior:auto}

/* Gallery: give the visual priority, with only concise work metadata. */
.sample-page #detail-content .case{display:flex;flex-direction:column;max-width:1200px;margin:auto}
.sample-page #detail-content .case-visual{width:100%;height:620px;min-height:0}
.sample-page #detail-content .design-visual>img{height:100%;width:100%;object-fit:cover}
.sample-page #detail-content .video-visual{height:auto;min-height:0;justify-content:center}
.sample-page #detail-content .video-visual video{width:100%;max-height:675px}
.sample-page #detail-content .tool-visual{height:570px}
.sample-page #detail-content .case-copy{padding:25px 30px 35px}
.sample-page #detail-content .case-copy h2{margin:0 0 12px;font-size:25px}
.sample-page #detail-content .case-copy p{font-size:12px;margin:5px 0}
.work-kind{color:#526248}.work-scope{color:var(--muted)}
.gallery-contact{padding:65px 6%;text-align:center;background:var(--sage)}.gallery-contact p{font-size:16px}.gallery-contact .primary{width:auto}.gallery-contact small{display:block;font-size:11px;margin-top:20px}
@media(max-width:650px){.sample-page #detail-content .case-visual{height:420px}.sample-page #detail-content .tool-visual{height:475px}.sample-page #detail-content .case-copy{padding:23px 25px 30px}.sample-page #detail-content .case-copy h2{font-size:23px}.gallery-contact{padding:40px 24px}.gallery-contact p{font-size:14px}}

.gallery-section{padding:30px 28px}.gallery-section>h2{font:500 30px 'Yu Mincho',serif;margin:0 0 25px}.work-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.work-card{padding:0;text-align:left;border:0;background:transparent}.grid-visual{height:275px;position:relative;overflow:hidden;background:#dce4d9;isolation:isolate}.grid-visual>img{width:100%;height:100%;object-fit:cover}.mock-caption{position:absolute;inset:25% 10%;display:grid;place-items:center;text-align:center;font:26px/1.5 'Yu Mincho',serif;background:#faf9f5e8;padding:20px}.editorial .mock-caption{inset:auto 0 0;text-align:left;font-size:22px;background:#faf9f5}.poster{background:#343b36}.poster>img{opacity:.35}.poster .mock-caption{color:#e8f09c;background:none;font:700 37px/1.2 sans-serif;text-align:left}.film .mock-caption{background:#20272080;color:white;border-radius:50%;inset:30%}.story>img{width:54%;margin:auto}.story{background:#bcb6a8}.story .mock-caption{background:none;color:white;font:700 26px/1.3 sans-serif}.crop .mock-caption{inset:18%;background:none;border:2px dashed white;color:white;font:18px sans-serif}.mock-social{height:100%;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:28px 12px;background:#ece8dc}.mock-social img{width:100%;height:100%;object-fit:cover}.mock-table{padding:50px 20px;color:#394b3e}.mock-table b{display:block;letter-spacing:.18em;margin-bottom:20px}.mock-table div{padding:9px;border-bottom:1px solid #8d9e8a;font-size:13px}.mock-stack{width:55%;height:100%;margin:auto;background:#faf9f5;text-align:center}.mock-stack img{height:42%;width:100%;object-fit:cover}.mock-stack span{font-size:10px}.card-title{display:block;font-size:16px;margin-top:16px}.card-title small{font-size:10px;color:var(--muted)}.card-note{display:block;font-size:10px;color:var(--muted);margin-top:5px}#work-detail{padding:28px}#work-detail h2{font:25px 'Yu Mincho',serif;margin-bottom:20px}#work-detail .grid-visual{height:480px}#work-detail>p{font-size:11px;margin-top:20px}#work-detail video{width:100%;max-height:60vh}.grid-crop{height:320px;aspect-ratio:1;max-width:100%;margin:auto;overflow:hidden}.grid-crop img{width:100%;height:100%;object-fit:cover}
@media(max-width:650px){.gallery-section{padding:28px 24px}.work-grid{grid-template-columns:1fr;gap:30px}.grid-visual{height:260px}.gallery-section>h2{font-size:26px}#work-detail{padding:22px}#work-detail .grid-visual{height:320px}.grid-crop{height:230px}#work-detail h2{font-size:21px}}

/* Each entire service panel is one native link. */
a.service{display:block;cursor:pointer;text-decoration:none}
a.service:focus-visible{outline:4px solid #e9f2b2;outline-offset:-7px}
a.service:focus-visible .roundel{box-shadow:0 0 0 4px #e9f2b2}
@media(hover:hover){a.service:hover .roundel{box-shadow:0 0 0 3px #ffffff80}a.service:hover .sample-open{border-bottom-color:#fff;background:#ffffff12}}

/* Static FV: no zoom; keep sticky hero and About overlap. */
.hero-media{inset:0;will-change:auto}
.hero-media img{width:100%;height:100%;object-fit:cover;object-position:50% 55%;transform:none;animation:none}
.hero-shade{background:linear-gradient(#17211838,#14211770 45%,#121c18a8)}
.hero-title{will-change:auto;text-shadow:0 2px 12px #0009}
@media(max-width:650px){.hero-media img{object-position:43% center}.hero-shade{background:linear-gradient(#17211840,#14211780 45%,#121c18b0)}}

/* Smooth film and restrained image-only parallax. */
.hero-media video{width:100%;height:100%;object-fit:cover;object-position:50% center}
.hero-shade{background:linear-gradient(#17211818,#14211729 40%,#121c18b8)}
.hero-bottom{justify-content:flex-end}.hero-bottom .scroll-cue{left:50%}
@media(max-width:650px){.hero-media video{object-position:53% center}}

/* User works, separate from collapsed layout samples. */
.portfolio-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:42px 30px;max-width:1200px;margin:auto}
.portfolio-thumb{height:380px;padding:20px;background:#eeeee8;overflow:hidden;display:flex;justify-content:center;gap:12px}
.portfolio-thumb img{width:100%;height:100%;object-fit:contain;min-width:0}.portfolio-thumb.paired img{width:calc(50% - 6px)}
.portfolio-detail{margin-top:26px}.portfolio-detail.paired{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.portfolio-detail figure{margin:0;min-width:0}.portfolio-detail figcaption{font-size:12px;margin-bottom:8px}
.portfolio-detail img{width:100%;height:auto}.portfolio-detail a{display:block;cursor:zoom-in}
.layout-samples{margin:50px 28px;border-top:1px solid var(--line);padding-top:24px}.layout-samples>summary{cursor:pointer;font-size:15px}.layout-samples>p{font-size:12px;margin:16px 0}
#work-detail>p{margin-bottom:16px}#work-detail{overflow-wrap:anywhere}
@media(max-width:650px){.portfolio-grid{grid-template-columns:1fr;gap:30px}.portfolio-thumb{height:290px;padding:12px;gap:8px}.portfolio-thumb.paired img{width:calc(50% - 4px)}.portfolio-detail.paired{grid-template-columns:1fr;gap:28px}.layout-samples{margin:35px 24px}.portfolio-card .card-title{font-size:16px}}

/* Compact text navigation. */
:root{--header:88px}.site-header{height:var(--header);padding:15px 7%;justify-content:space-between;gap:40px}
.site-header>.brand{font-size:36px;display:flex;align-items:center;gap:22px;letter-spacing:.08em}
.site-header>.brand span{font:8px/1.8 sans-serif;letter-spacing:.16em;max-width:130px;margin:0}
.site-header nav{gap:36px}.site-header nav a{min-width:0;min-height:44px;justify-content:center;font-size:12px;letter-spacing:.08em;border-bottom:1px solid transparent}
.site-header nav a:hover{border-bottom-color:#879580}
@media(max-width:900px){.site-header nav{gap:22px}.site-header{padding-inline:5%}}
@media(max-width:650px){:root{--header:70px}.site-header{height:70px;padding:10px 24px;gap:15px}.site-header>.brand{font-size:30px;gap:15px}.site-header>.brand span{font-size:6px;max-width:110px}.site-header nav{top:70px;max-height:calc(100svh - 70px)}.site-header nav a{justify-content:flex-start;min-height:48px;font-size:13px}}
/* About band only: warm neutral with a restrained accent. */
#about .section-band{background:#F2F0ED;color:#302E2B}
#about .band-label>span{display:inline-block;border-bottom:1px solid #875044;padding-bottom:5px}
/* Quieter circles and lighter photographs, with readable lower copy. */
.roundel{width:194px;height:194px;background:#F2F0ED;color:#302E2B;outline:1px solid #302e2b2e;outline-offset:-9px;box-shadow:none}
.roundel>span{font-size:8px;letter-spacing:.17em}.roundel svg{width:43px;height:43px;stroke-width:1.05;margin:17px 0 15px}.roundel small{font-size:21px;letter-spacing:.19em;padding-left:.19em}
.service:after{background:linear-gradient(#222c1900,#202b1e38 43%,#17201aa8)}
@media(max-width:650px){.roundel{width:180px;height:180px}.roundel svg{width:40px;height:40px;margin:15px 0 13px}.roundel small{font-size:20px}}

/* Contact: match the warm-neutral About palette. */
#contact{color:#302E2B}
#contact .section-band{background:#F2F0ED;color:#302E2B;border-color:#d5d0ca}
#contact .band-label>span{display:inline-block;border-bottom:1px solid #875044;padding-bottom:5px}
#contact .contact-body{background:#F2F0ED}
#contact .consult-options button{border-color:#bdb6ae;background:transparent;color:#302E2B}
#contact .consult-options button[aria-pressed=true]{background:#302E2B;border-color:#302E2B;color:#F2F0ED}
#contact .primary{background:#302E2B;border-color:#302E2B;color:#F2F0ED}
#contact .contact-note,#contact #consult-status{color:#625d57}
#contact button:focus-visible{outline-color:#875044}
@media(hover:hover){#contact .consult-options button:hover{border-color:#875044;background:#e8e3dd}#contact .consult-options button[aria-pressed=true]:hover{background:#443a35;color:#F2F0ED}#contact .primary:not(:disabled):hover{background:#443a35}}
/* Matching gallery contact strip. */
.gallery-contact{background:#F2F0ED;color:#302E2B}.gallery-contact .primary{background:#302E2B;border-color:#302E2B;color:#F2F0ED}
/* Fresh blue accents for About and Contact; retain white navigation and circles. */
#about .section-band,#contact .section-band,#contact .contact-body,.gallery-contact{background:#E7F3F8;color:#293E4A;border-color:#bdd3de}
#about .band-label>span,#contact .band-label>span{border-bottom-color:#6B9FB6}
#contact{color:#293E4A}
#contact .consult-options button{color:#293E4A;border-color:#91afbe;background:transparent}
#contact .consult-options button[aria-pressed=true],#contact .primary,.gallery-contact .primary{background:#293E4A;border-color:#293E4A;color:#fff}
#contact .contact-note,#contact #consult-status{color:#4d6572}
#contact button:focus-visible{outline-color:#477b93}
@media(hover:hover){#contact .consult-options button:hover{border-color:#477b93;background:#d4e8f1}#contact .consult-options button[aria-pressed=true]:hover,#contact .primary:not(:disabled):hover{background:#365767;color:#fff}}

/* Reading belongs only to the profile name. */
.profile-label h2{display:flex;align-items:baseline;flex-wrap:wrap;gap:8px}.profile-reading{font:400 15px/1.7 'Hiragino Kaku Gothic ProN','Yu Gothic',sans-serif;letter-spacing:.02em;white-space:nowrap}
@media(max-width:650px){.profile-reading{font-size:13px}.profile-label h2{gap:6px}}

/* One-character FV name; preserve natural proportions. */
.hero-title h1{font-size:72px;letter-spacing:.08em;padding-left:.08em}
@media(max-width:650px){.hero-title h1{font-size:58px}}
/* Contact hierarchy: blue heading, light body, terracotta action. */
#contact .contact-body{background:#FAFAF7}
#contact .consult-options button[aria-pressed=true]{background:#31576B;border-color:#31576B;color:#fff}
#contact .primary{background:#A4543B;border-color:#A4543B;color:#fff}
#contact .primary:disabled{background:#ddd7d0;border-color:#ccc4bb;color:#655b54;opacity:1;cursor:not-allowed}
#contact button:focus-visible{outline:3px solid #31576B;outline-offset:4px}
@media(hover:hover){#contact .consult-options button[aria-pressed=true]:hover{background:#244557;color:#fff}#contact .primary:not(:disabled):hover{background:#88422E;border-color:#88422E;color:#fff}}
/* Works page: blue section headings and quiet editorial spacing. */
.sample-page{color:#293E4A}.sample-page .samples-heading{background:#E7F3F8;padding:50px 6% 40px}.sample-page .samples-heading h1{font-size:36px;letter-spacing:.06em}.sample-page .sample-categories{gap:10px;flex-wrap:wrap}.sample-page .sample-categories a{background:#fafaf7;border-color:#b7ccd6;font-size:12px}
.sample-page #design{max-width:1280px;margin:auto;padding:55px 40px}.sample-page .portfolio-thumb{background:#f0f2f1}.sample-page .card-title{font-size:17px;color:#293E4A}.sample-page .card-note{color:#526875}
.sample-page .tools-stories{padding:0 0 50px;background:#FAFAF7}.tools-heading{background:#E7F3F8;padding:40px 6%;display:grid;grid-template-columns:1fr 1fr;gap:12px 30px;align-items:end}.tools-heading>span{grid-column:1/-1;font-size:9px;letter-spacing:.18em;color:#4d6572}.tools-heading h2{font:30px/1.5 'Yu Mincho',serif;margin:0}.tools-heading>p{font-size:14px;line-height:1.9}
.tool-stories,.tools-scope,.tools-return{max-width:1200px;margin:0 auto;padding:0 40px}.tool-story{padding:36px 0;display:grid;grid-template-columns:1fr 1.7fr;gap:40px;border-bottom:1px solid #cbd7dc}.tool-story-title>span{font:italic 18px Georgia,serif;color:#6B9FB6}.tool-story h3{font:22px/1.8 'Yu Mincho',serif;margin:12px 0}.tool-story dl{margin:0}.tool-story dl>div{display:grid;grid-template-columns:90px 1fr;gap:20px;margin-bottom:18px}.tool-story dl>div:last-child{margin:0}.tool-story dt{font-size:11px;color:#4d6572;padding-top:2px}.tool-story dd{font-size:13px;line-height:2;margin:0}.tools-scope{font-size:12px;line-height:2;padding-top:26px;color:#4d6572}.tools-return{display:flex;justify-content:space-between;gap:22px;padding-top:28px;font-size:12px}.tools-return a{border-bottom:1px solid #6B9FB6;padding-bottom:6px}
.sample-page .gallery-contact{background:#E7F3F8;padding:45px 6%}.sample-page .gallery-contact p{font-size:14px}.sample-page .gallery-contact .primary{background:#A4543B;border-color:#A4543B;color:#fff}.sample-page .gallery-contact .primary:hover{background:#88422E}
@media(max-width:650px){.sample-page .samples-heading{padding:34px 24px}.sample-page .samples-heading h1{font-size:29px}.sample-page #design{padding:36px 24px}.tools-heading{padding:30px 24px;grid-template-columns:1fr;gap:12px}.tools-heading h2{font-size:26px}.tools-heading>p{font-size:13px}.tool-stories,.tools-scope,.tools-return{padding-left:24px;padding-right:24px}.tool-story{grid-template-columns:1fr;gap:18px;padding:30px 0}.tool-story h3{font-size:21px;margin:7px 0 0}.tool-story dl>div{grid-template-columns:1fr;gap:4px;margin-bottom:18px}.tool-story dd{font-size:12px}.tools-return{flex-wrap:wrap;font-size:11px}}

/* Banner variants: preserve proportions and show only the artwork. */
.portfolio-card.banners .portfolio-thumb{height:330px;padding:42px 35px;background:#fff;display:grid;grid-template-columns:1fr 1fr;gap:25px;align-content:center;justify-items:center;align-items:center}
.portfolio-card.banners .portfolio-thumb img{width:auto;height:auto;max-width:100%;max-height:125px;object-fit:contain}
.portfolio-card.banners .portfolio-thumb img:first-child{grid-column:1/-1;width:100%;max-width:390px;max-height:none}
.banner-details{display:grid;grid-template-columns:1fr 1fr;gap:40px;padding:35px;background:#fff;align-items:center;justify-items:center}
.banner-details figure:first-child{grid-column:1/-1;width:100%;max-width:950px}.banner-details figure:not(:first-child){max-width:300px}
@media(max-width:650px){.portfolio-card.banners .portfolio-thumb{height:280px;padding:28px 22px;gap:22px}.portfolio-card.banners .portfolio-thumb img{max-height:105px}.banner-details{gap:22px;padding:20px}}

/* Shared inquiry CTA states. */
#contact .primary,.sample-page .gallery-contact .primary{background:#31576B;border-color:#31576B;color:#fff}
#contact .primary:disabled{background:#DCE7ED;border-color:#B4C8D2;color:#526976;opacity:1}
#contact .primary:focus-visible,.sample-page .gallery-contact .primary:focus-visible{outline:3px solid #31576B;outline-offset:4px}
@media(hover:hover){#contact .primary:not(:disabled):hover,.sample-page .gallery-contact .primary:hover{background:#244557;border-color:#244557;color:#fff}}
/* Works: reference-led left index, feature image, then two smaller works. */
.sample-page .works-shell{display:grid;grid-template-columns:220px minmax(0,1fr);gap:65px;max-width:1440px;margin:0 auto;padding:65px 48px 90px;align-items:start}
.sample-page .samples-heading{position:sticky;top:125px;background:none;padding:0;margin:0;width:auto;max-width:none;text-align:left}
.sample-page .samples-heading h1{font:600 64px/1.1 Georgia,serif;margin:24px 0 35px;letter-spacing:-.03em}
.works-back{font-size:11px}.sample-page .sample-categories{display:flex;flex-direction:column;align-items:flex-start;gap:21px;margin:0}
.sample-page .sample-categories a{padding:0;border:0;font:500 17px/1.6 Georgia,'Yu Mincho',serif}
.sample-page #detail-content{min-width:0}.sample-page #design{padding:0;max-width:none;margin:0}
.sample-page #design>h2,.portfolio-category{font:500 32px/1.4 Georgia,serif;margin:0 0 48px}
.sample-page .portfolio-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:65px 36px;max-width:none}
.portfolio-card.featured,.portfolio-category{grid-column:1/-1}.portfolio-category{margin:35px 0 -20px;scroll-margin-top:115px}
.portfolio-card.featured .portfolio-thumb{height:auto;aspect-ratio:1.5;padding:40px;gap:24px;background:#edf1f2}
.portfolio-card.featured .portfolio-thumb img{height:100%;object-fit:contain;max-height:100%;min-height:0}
.portfolio-card[data-work="guesthouse"] .portfolio-thumb{aspect-ratio:1.5;padding:0;display:block;background:#fff;overflow:hidden}
.portfolio-card[data-work="guesthouse"] .portfolio-thumb img{width:100%;height:100%;object-fit:cover;object-position:top}
.portfolio-info{display:grid;grid-template-columns:1fr;gap:12px;padding-top:22px;text-align:left}
.portfolio-info .card-title{padding:0;margin:0;font-size:20px;line-height:1.6}.portfolio-info .card-note{padding:0;margin:0;font-size:11px;line-height:1.8}
.portfolio-summary{font-size:12px;line-height:1.9;color:#52636b}
.featured .portfolio-info{grid-template-columns:1fr 1fr;column-gap:35px}.featured .card-title{grid-column:1/-1}.featured .portfolio-summary{grid-column:2;grid-row:2}
.sample-page .portfolio-card.banners .portfolio-thumb{height:260px;padding:32px 24px;gap:24px}.sample-page .portfolio-card.banners .portfolio-thumb img{max-height:85px}.sample-page .portfolio-card.banners .portfolio-thumb img:first-child{max-height:none}
.sample-page .layout-samples{margin:85px 0 65px}.sample-page #tools{padding:0;margin:0}.tools-static-note{font-size:12px;margin:14px 0 25px;color:#52636b}
.sample-page #tools .work-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.sample-page #tools .grid-visual{height:210px}.sample-page #tools .card-title{font-size:14px}.sample-page #tools .card-note{font-size:10px}
@media(max-width:1000px) and (min-width:651px){.sample-page .works-shell{grid-template-columns:155px minmax(0,1fr);gap:32px;padding:48px 30px}.sample-page .samples-heading h1{font-size:48px}.sample-page .sample-categories a{font-size:14px}.portfolio-card.featured .portfolio-thumb{padding:25px}.sample-page #tools .work-grid{gap:10px}}
@media(max-width:650px){.sample-page .works-shell{display:block;padding:30px 24px 55px}.sample-page .samples-heading{position:static;margin-bottom:50px}.sample-page .samples-heading h1{font-size:52px;margin:18px 0 25px}.sample-page .sample-categories{display:grid;grid-template-columns:1fr 1fr;gap:12px 18px}.sample-page .sample-categories a{font-size:14px}.sample-page #design>h2,.portfolio-category{font-size:27px;margin-bottom:28px}.sample-page .portfolio-grid{grid-template-columns:1fr;gap:42px}.portfolio-card.featured,.portfolio-category{grid-column:auto}.portfolio-card.featured .portfolio-thumb{padding:20px;gap:12px;aspect-ratio:1.2}.portfolio-card[data-work="guesthouse"] .portfolio-thumb{padding:0;aspect-ratio:1.2}.featured .portfolio-info{display:flex;flex-direction:column;gap:10px}.portfolio-info .card-title{font-size:18px}.portfolio-category{margin:20px 0 -15px}.sample-page .portfolio-card.banners .portfolio-thumb{height:270px}.sample-page #tools .work-grid{grid-template-columns:1fr;gap:28px}.sample-page #tools .grid-visual{height:260px}}
.sample-page #tools .mock-table{padding:25px 18px}.sample-page #tools .mock-table b{margin-bottom:12px}.sample-page #tools .mock-table div{padding:7px;font-size:12px}
/* Center the inquiry label and arrow as one group; keep the current colors. */
#contact .primary,.sample-page .gallery-contact .primary{justify-content:center;gap:16px;text-align:center}

#consult-next{justify-content:center;text-align:center}#consult-next .consult-button-label{display:inline-flex;align-items:center;justify-content:center;gap:12px;flex:0 0 auto}#consult-next .consult-button-label>span{margin:0}.construction-note{margin-top:20px;font-size:12px!important;color:#526976}

/* Original crop-ratio preview, fitted to the available dialog width. */
#work-detail .grid-crop{height:min(320px,calc((94vw - 96px)*.75));width:auto;max-width:100%;margin:24px auto;aspect-ratio:1 / 1}#work-detail .grid-crop img{width:100%;height:100%;object-fit:cover}#ratio-status{text-align:center;font-size:12px;margin:12px 0 20px}#work-detail .ratio-options{max-width:480px;margin:auto}

#work-detail .grid-crop{--crop-height:min(320px,calc((94vw - 96px)*.75));height:var(--crop-height);width:calc(var(--crop-height)*var(--crop-ratio,1))}

.sample-page .sample-categories a{min-width:0;white-space:normal;overflow-wrap:normal}.sample-page #tools>h2{overflow-wrap:normal}@media(max-width:650px){.sample-page #tools>h2{font-size:27px;line-height:1.4}}

.video-note{font-size:13px;line-height:1.9;margin:0 0 26px}