/* Foundation — shared tokens and base elements */
:root{--color-bg:#F5F1E8;--color-surface:#FFFFFF;--color-wood:#D5B994;--color-primary:#53614B;--color-primary-hover:#414D3A;--color-text:#373B36;--color-muted:#75786F;--font-heading:"Noto Serif JP",serif;--font-body:"Noto Sans JP",sans-serif;--font-en:"Cormorant Garamond",serif;--container-width:1200px;--gutter:40px;--section-space:112px;--header-height:80px;--radius-sm:4px;--radius-md:8px}
*,*::before,*::after{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--color-bg);color:var(--color-text);font-family:var(--font-body);font-size:16px;line-height:1.9;-webkit-font-smoothing:antialiased}h1,h2,h3,p{margin:0}h1,h2,h3{font-family:var(--font-heading);font-weight:500;line-height:1.5}a{color:inherit;text-decoration:none}button{font:inherit}img{display:block;width:100%;object-fit:cover}a,button,summary{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:3px solid #b58b4a;outline-offset:5px}::selection{background:var(--color-wood);color:var(--color-text)}.container{width:min(var(--container-width),calc(100% - var(--gutter)*2));margin-inline:auto}.section{padding-block:var(--section-space)}.eyebrow{font-family:var(--font-en);font-size:18px;font-weight:500;letter-spacing:.17em;color:var(--color-primary);margin-bottom:20px}.eyebrow::before{content:"";display:inline-block;width:30px;height:1px;background:currentColor;vertical-align:middle;margin-right:14px}.section-heading h2{font-size:40px;letter-spacing:.08em}.photo{aspect-ratio:3/2}.section-intro{margin-top:24px}.button{display:inline-flex;min-height:58px;padding:15px 25px;align-items:center;justify-content:space-between;gap:30px;background:var(--color-primary);color:white;font-size:14px;letter-spacing:.05em;border:1px solid transparent;transition:background-color .2s,color .2s,border-color .2s}.button span{font-size:21px;line-height:1}.button:hover,.nav-contact:hover{background:var(--color-primary-hover)}.button-outline{background:transparent;border-color:#8b9383;color:var(--color-text)}.button-outline:hover{background:var(--color-primary);color:white}.center-action{text-align:center;margin-top:48px}.sample-note,.image-caption,.work-note,.destination-note{font-size:13px;color:#64685e}.sample-note{margin-top:24px}.image-caption{margin-top:16px;letter-spacing:.08em}.destination-note{margin:20px auto 0;max-width:650px;text-align:center}.skip-link{position:fixed;top:-100px;left:15px;padding:10px 20px;background:white;z-index:100}.skip-link:focus{top:10px}
/* Header and responsive navigation */
.site-header{height:var(--header-height);position:fixed;inset:0 0 auto;z-index:50;background:#f5f1e8fa;display:flex;align-items:center;justify-content:space-between;padding-inline:40px;transition:height .2s,box-shadow .2s}.site-header.is-scrolled{height:72px;box-shadow:0 2px 15px #373b3610}.logo{display:inline-flex;gap:12px;align-items:center;white-space:nowrap;font:600 24px/1.4 var(--font-heading);letter-spacing:.08em}.logo small{display:block;font:500 10px/1.6 var(--font-body);letter-spacing:.23em}.logo-mark{font:48px/1 var(--font-heading);color:var(--color-primary);transform:translateY(-3px)}.main-nav{display:flex;align-items:center;gap:25px;font-size:12px}.main-nav>a:not(.nav-contact):hover{color:var(--color-primary);text-decoration:underline;text-underline-offset:7px}.nav-contact{background:var(--color-primary);color:white;padding:14px 23px;transition:background-color .2s}.nav-contact span{margin-left:18px}.menu-toggle{display:none}
/* First view */
.hero{height:92svh;min-height:710px;max-height:1100px;position:relative;margin-top:80px;color:white;isolation:isolate}.hero-photo,.hero-shade{position:absolute;inset:0;height:100%;z-index:-2}.hero-photo{object-position:center 55%}.hero-shade{z-index:-1;background:linear-gradient(90deg,rgba(16,26,18,.67),rgba(16,26,18,.23) 70%),linear-gradient(0deg,rgba(16,26,18,.4),transparent 45%)}.hero-content{height:100%;display:flex;align-items:flex-start;justify-content:center;flex-direction:column;padding-bottom:45px}.hero-kicker{letter-spacing:.22em;font-size:14px;margin-bottom:22px}.hero h1{font-size:60px;line-height:1.5;letter-spacing:.14em;text-shadow:0 2px 20px #0003}.hero-description{margin-top:27px;font-size:15px;line-height:2.2;letter-spacing:.1em}.hero-actions{display:flex;gap:14px;margin-top:36px}.button-ghost{background:#17241b24;border-color:#ffffffa6}.button-ghost:hover{background:#ffffff24}.hero-side{position:absolute;right:26px;top:40%;writing-mode:vertical-rl;font:12px var(--font-en);letter-spacing:.22em}.hero-foot{position:absolute;bottom:25px;left:40px;right:40px;display:flex;justify-content:space-between;font-size:11px;letter-spacing:.15em}.scroll-cue{position:absolute;bottom:0;left:50%;display:flex;align-items:center;flex-direction:column;gap:12px;font:11px var(--font-en);letter-spacing:.16em}.scroll-cue span{height:45px;width:1px;background:#ffffffa3}.demo-banner{padding:13px 20px;text-align:center;background:#ebe6da;font-size:12px;letter-spacing:.05em}
/* Philosophy and company */
.split{display:grid;grid-template-columns:1.08fr 1fr;gap:100px;align-items:center}.image-composition{position:relative;padding-right:20px}.image-composition .photo{aspect-ratio:4/5}.image-composition::before{content:"";position:absolute;z-index:-1;left:-25px;top:35px;width:85%;height:88%;background:#e5dece}.vertical-note{position:absolute;right:-12px;top:30px;writing-mode:vertical-rl;font-family:var(--font-heading);font-size:14px;letter-spacing:.3em}.body-copy{margin-top:32px}.body-copy p+p{margin-top:22px}.split-copy .button,.about-copy .button{margin-top:34px}.about .split{grid-template-columns:1fr 1.15fr}.about .photo{aspect-ratio:6/5}.about .inline-details{margin-top:45px}
/* Commitment */
.commitment{background:#eeeadf}.commitment .section-heading,.commitment>.container>.section-intro{text-align:center}.commitment-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:34px;margin-top:58px}.commitment-image{position:relative}.commitment-image .photo{aspect-ratio:4/5}.number{position:absolute;left:16px;bottom:-26px;font:64px/1 var(--font-en);color:var(--color-primary);background:var(--color-bg);padding:0 10px}.card-label{font-size:13px;color:var(--color-primary);margin-top:41px;letter-spacing:.13em}.commitment-card h3{font-size:24px;letter-spacing:.05em;margin-top:13px}.commitment-card>p:last-child{font-size:14px;margin-top:20px;line-height:2}.inline-details{max-width:800px;margin:25px auto 0;font-size:14px;border-block:1px solid #cfcfc2;padding:16px 4px}.inline-details summary{cursor:pointer;padding:5px}.inline-details p{padding:15px 5px}.company-data{display:grid;grid-template-columns:130px 1fr;gap:14px}.company-data dd{margin:0}.company-data dt{color:var(--color-primary)}
/* Works */
.section-top{display:flex;align-items:flex-end;justify-content:space-between;gap:30px}.section-top>p{font-size:14px;line-height:2.1;padding-bottom:8px}.works-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-top:48px}.work-photo{position:relative;overflow:hidden}.work-photo .photo{aspect-ratio:4/3;transition:transform .4s}.work-card:hover .photo{transform:scale(1.03)}.work-index{position:absolute;left:0;bottom:0;background:var(--color-bg);padding:5px 15px;font:24px var(--font-en)}.work-meta{display:flex;gap:12px;align-items:center;margin-top:23px;color:var(--color-primary);font-size:12px}.work-meta span+span{padding-left:12px;border-left:1px solid #c6c7bc}.work-card h3{font-size:20px;margin-top:10px;line-height:1.6}.work-note{font-size:11px;margin-top:9px}
/* Flow */
.flow{background:#e9eadd}.flow .section-heading{text-align:center}.flow-list{display:grid;grid-template-columns:repeat(5,1fr);padding:0;list-style:none;gap:30px;margin:60px 0 0}.flow-list li{position:relative}.flow-list li:not(:last-child)::after{content:"";position:absolute;top:28px;left:65px;width:calc(100% - 35px);height:1px;background:#b7bca9}.step-number{display:flex;width:56px;height:56px;align-items:center;justify-content:center;border:1px solid #99a18c;border-radius:50%;font:28px var(--font-en);color:var(--color-primary)}.flow-list h3{font-size:17px;margin-top:25px}.flow-list p{font-size:13px;margin-top:14px;line-height:1.9}
/* News */
.news{border-top:1px solid #dcd9cd}.news-layout{display:grid;grid-template-columns:1fr 1.8fr;gap:80px}.news .button{margin-top:32px}.news-list{border-top:1px solid #cdcfc3}.news-item{border-bottom:1px solid #cdcfc3}.news-item summary{list-style:none;cursor:pointer;padding:28px 0;display:grid;grid-template-columns:90px 65px 1fr 22px;align-items:center;gap:15px}.news-item summary::-webkit-details-marker{display:none}.news-item time{font-size:12px;color:#64685e}.news-tag{font-size:10px;background:#e6e7dc;padding:2px 8px;text-align:center}.news-item h3{font:400 14px/1.8 var(--font-body)}.news-plus{font-size:20px;color:var(--color-primary)}.news-item[open] .news-plus{transform:rotate(45deg)}.news-item>p{padding:0 0 25px;font-size:13px}
/* Reusable contact CTA and footer */
.contact{background:var(--color-primary);color:white;text-align:center;position:relative;overflow:hidden}.contact::before,.contact::after{content:"";position:absolute;border:1px solid #ffffff12;width:480px;height:480px;transform:rotate(45deg);pointer-events:none}.contact::before{left:-370px;top:40px}.contact::after{right:-330px;bottom:-100px}.contact .eyebrow{color:#e0d3b9}.contact>.container>p{margin-top:25px;line-height:2}.contact .button{margin-top:34px;min-width:330px}.button-light{background:var(--color-bg);color:var(--color-primary)}.button-light:hover{background:#ded4bf;color:#303c2b}.contact .contact-small{font-size:12px;margin-top:14px}.contact-status{max-width:590px;margin:32px auto 0;border-top:1px solid #ffffff40;padding-top:22px;font-size:13px}.contact-status p{font-size:12px;margin-top:6px}.contact-status:target{background:#ffffff10;outline:1px solid #ffffff80;padding:22px}.site-footer{background:#30352f;color:#efeee6;padding:65px 0 22px}.footer-top{display:flex;justify-content:space-between;gap:50px}.footer-logo{font-size:25px;margin-bottom:24px}.footer-logo .logo-mark{color:#d5b994}.footer-top p{font-size:12px;line-height:2}.service-area{margin-top:18px;color:#d3d6ca}.footer-top nav{display:grid;grid-template-columns:repeat(2,1fr);column-gap:50px;align-content:start;row-gap:14px;font-size:12px}.footer-top nav a:hover{text-decoration:underline;text-underline-offset:5px}.privacy{font-size:12px;margin-top:30px;max-width:760px}.privacy summary{cursor:pointer;min-height:35px}.privacy p{padding-top:12px;color:#d3d6ca}.footer-bottom{margin-top:35px;padding-top:22px;border-top:1px solid #ffffff25;display:flex;justify-content:space-between;gap:20px;font-size:11px}.footer-bottom small{font-size:10px;letter-spacing:.04em}
/* Motion: visible by default, enhanced only after JS observer is ready */
.motion-ready .reveal,.motion-ready .reveal-photo{opacity:0;transition:opacity .7s,transform .7s}.motion-ready .reveal{transform:translateY(20px)}.motion-ready .reveal-photo{transition-duration:.8s}.motion-ready .is-visible{opacity:1;transform:none}
@media(min-width:1440px){.site-header{padding-inline:60px}.main-nav{gap:30px;font-size:13px}}
@media(max-width:1199px){:root{--gutter:32px;--section-space:88px}.site-header{padding-inline:24px}.logo{font-size:20px}.main-nav{gap:15px;font-size:10px}.nav-contact{padding:12px 16px}.split{gap:55px}.section-heading h2{font-size:34px}.commitment-grid{gap:24px}.flow-list{gap:20px}.news-layout{gap:40px}.news-item summary{grid-template-columns:80px 1fr 20px}.news-tag{display:none}.hero-content{padding-left:20px}.footer-top nav{column-gap:25px}}
@media(max-width:950px){.main-nav{gap:10px;font-size:9px}.logo{font-size:18px;gap:6px}.logo-mark{font-size:38px}.nav-contact{padding:12px}.commitment-card h3{font-size:21px}.flow-list h3{font-size:15px}.flow-list{gap:15px}.hero-actions{flex-wrap:wrap}.hero h1{font-size:54px}}
@media(max-width:767px){:root{--gutter:20px;--section-space:72px;--header-height:64px}html{scroll-padding-top:80px}body{font-size:15px}.site-header,.site-header.is-scrolled{height:64px;padding-inline:20px}.logo{font-size:20px;gap:9px}.logo small{font-size:8px}.logo-mark{font-size:40px}.menu-toggle{display:flex;width:48px;height:48px;border:0;background:transparent;flex-direction:column;align-items:center;justify-content:center;gap:6px;color:var(--color-text);z-index:52;cursor:pointer}.menu-toggle>span:not(.menu-label){display:block;width:24px;height:1px;background:currentColor;transition:transform .25s}.menu-label{font-size:8px;line-height:1}.menu-toggle[aria-expanded=true]>span:first-child{transform:translateY(3.5px) rotate(45deg)}.menu-toggle[aria-expanded=true]>span:nth-child(2){transform:translateY(-3.5px) rotate(-45deg)}.main-nav{position:fixed;top:64px;bottom:0;left:0;right:0;background:var(--color-bg);padding:35px 28px;display:flex;flex-direction:column;gap:0;align-items:stretch;overflow-y:auto;font-size:15px;visibility:hidden;opacity:0;transform:translateY(-12px);transition:opacity .25s,transform .25s,visibility .25s}.main-nav.is-open{visibility:visible;opacity:1;transform:none}.main-nav a{padding:18px 8px;border-bottom:1px solid #dcdccd}.main-nav .nav-contact{padding:18px 20px;margin-top:22px;border:0}.menu-open{overflow:hidden}.hero{margin-top:64px;height:calc(100svh - 64px);min-height:650px;max-height:900px}.hero-photo{object-position:57% center}.hero-shade{background:linear-gradient(0deg,rgba(16,26,18,.78),rgba(16,26,18,.12)),linear-gradient(90deg,#14221838,transparent)}.hero-content{justify-content:flex-end;padding:0 0 105px}.hero-kicker{font-size:11px;letter-spacing:.12em;margin-bottom:19px}.hero h1{font-size:34px;letter-spacing:.14em;line-height:1.6}.hero-description{font-size:12px;letter-spacing:.02em;line-height:2;margin-top:20px}.hero-actions{flex-direction:column;gap:10px;margin-top:25px;width:100%;max-width:340px}.button{min-height:54px;font-size:12px;padding:14px 20px;gap:20px}.hero-side{display:none}.hero-foot{left:20px;right:20px;bottom:19px;font-size:8px;letter-spacing:.06em}.hero-foot span:last-child{max-width:140px;text-align:right}.scroll-cue{left:auto;right:22px;bottom:60px;font-size:9px}.scroll-cue span{height:25px}.demo-banner{font-size:10px;padding:12px 16px}.split,.about .split{grid-template-columns:1fr;gap:38px}.philosophy .split-copy{padding:0 4px}.image-composition{margin-right:16px;padding-right:0}.image-composition .photo{aspect-ratio:5/4}.image-composition::before{left:-20px;top:20px}.vertical-note{right:-23px;font-size:11px}.image-caption{font-size:11px;margin-top:11px}.eyebrow{font-size:15px;margin-bottom:17px}.eyebrow::before{width:22px;margin-right:10px}.section-heading h2{font-size:28px;letter-spacing:.05em}.body-copy{margin-top:25px}.body-copy p+p{margin-top:19px}.body-copy p{font-size:14px}.section-intro{font-size:13px;margin-top:20px}.commitment .section-heading,.commitment>.container>.section-intro{text-align:left}.commitment-grid{grid-template-columns:1fr;gap:45px;margin-top:36px}.commitment-image .photo{aspect-ratio:5/4}.number{font-size:56px;bottom:-24px}.card-label{margin-top:35px;font-size:12px}.commitment-card h3{font-size:23px;margin-top:11px}.commitment-card h3 br{display:none}.commitment-card>p:last-child{font-size:14px;margin-top:14px}.center-action{margin-top:34px}.inline-details{font-size:12px}.section-top{display:block}.section-top>p{margin-top:22px;font-size:13px}.works-grid{grid-template-columns:1fr;gap:35px;margin-top:30px}.work-meta{margin-top:17px}.work-card h3{font-size:20px}.sample-note,.destination-note{font-size:12px}.flow .section-heading{text-align:left}.flow-list{display:block;margin-top:35px}.flow-list li{padding:0 0 30px 77px;min-height:105px}.step-number{position:absolute;left:0;top:0;width:48px;height:48px;font-size:25px}.flow-list li:not(:last-child)::after{top:48px;left:24px;width:1px;height:calc(100% - 48px)}.flow-list h3{padding-top:4px;margin-top:0;font-size:20px}.flow-list p{margin-top:10px;font-size:13px}.flow-list li:last-child{padding-bottom:0}.about-copy{order:1}.about .split>div:last-child{order:0}.about .photo{aspect-ratio:5/4}.company-data{grid-template-columns:85px 1fr;gap:13px}.news-layout{grid-template-columns:1fr;gap:30px}.news h2 br{display:none}.news .button{margin-top:22px}.news-item summary{padding:23px 0;grid-template-columns:1fr 24px;gap:8px}.news-item time{grid-column:1;font-size:11px}.news-item h3{grid-column:1;font-size:14px}.news-plus{grid-column:2;grid-row:1/3}.contact .section-heading h2{font-size:28px}.contact>.container>p{font-size:13px}.contact .button{min-width:0;width:100%;max-width:350px}.contact-status{font-size:12px}.contact-status p{font-size:11px}.footer-top{display:block}.footer-top nav{margin-top:35px;gap:14px;font-size:11px}.footer-logo{font-size:23px}.site-footer{padding-top:48px}.footer-bottom{display:block;font-size:10px}.footer-bottom small{display:block;margin-top:13px}.privacy{font-size:11px}.desktop-break{display:none}}
/* No-JS navigation remains usable */
@media(max-width:767px){html:not(.js) .main-nav{position:static;visibility:visible;opacity:1;transform:none;padding:15px 20px;display:flex;flex-direction:row;flex-wrap:wrap;gap:8px;font-size:11px}html:not(.js) .site-header{height:auto;position:relative;display:block;padding:15px 0 0}html:not(.js) .site-header>.logo{margin-left:20px}html:not(.js) .main-nav a{padding:8px}html:not(.js) .main-nav .nav-contact{margin:0}html:not(.js) .menu-toggle{display:none}html:not(.js) .hero{margin-top:0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.motion-ready .reveal,.motion-ready .reveal-photo{opacity:1;transform:none}.work-card:hover .photo{transform:none}}
/* Keep text links comfortable for touch and keyboard use. */
.main-nav>a{min-height:44px;display:inline-flex;align-items:center}
.footer-top nav a{min-height:44px;display:flex;align-items:center}
@media(min-width:768px) and (max-width:1100px){
 .js .menu-toggle{display:flex;width:48px;height:48px;border:0;background:transparent;flex-direction:column;align-items:center;justify-content:center;gap:6px;color:var(--color-text);cursor:pointer}
 .js .menu-toggle>span:not(.menu-label){display:block;width:24px;height:1px;background:currentColor;transition:transform .25s}
 .js .menu-label{font-size:9px;line-height:1}
 .js .menu-toggle[aria-expanded=true]>span:first-child{transform:translateY(3.5px) rotate(45deg)}
 .js .menu-toggle[aria-expanded=true]>span:nth-child(2){transform:translateY(-3.5px) rotate(-45deg)}
 .js .main-nav{position:fixed;inset:80px 0 0;background:var(--color-bg);padding:40px max(32px,calc((100vw - 650px)/2));display:flex;flex-direction:column;gap:0;align-items:stretch;overflow-y:auto;font-size:16px;visibility:hidden;opacity:0;transform:translateY(-12px);transition:opacity .25s,transform .25s,visibility .25s}
 .js .is-scrolled .main-nav{top:72px}
 .js .main-nav.is-open{visibility:visible;opacity:1;transform:none}
 .js .main-nav a{padding:18px 8px;border-bottom:1px solid #dcdccd}
 .js .main-nav .nav-contact{padding:18px 20px;margin-top:22px;border:0}
 .menu-open{overflow:hidden}
}
/* Let CSS aspect ratios control responsive image boxes, not HTML height hints. */
img{height:auto}
.hero-photo{height:100%}