/* A photographic folio: standing type, physical details, and deliberate changes
   of scale inside the original accounts. The Okunoin setting is preserved. */
:root{--paper:#f0eee6;--text:#27332d}
.site-header{color:var(--ink);height:112px}.site-header .wordmark{font-size:42px}.header-title{letter-spacing:.19em}
.opening{background:var(--paper);color:var(--ink);min-height:820px;height:100svh;max-height:1120px;isolation:auto;overflow:hidden}
.opening:before{display:none}.opening-photo{z-index:0;top:135px;bottom:48px;left:0;right:auto;width:65%}.opening-photo img{object-position:29% center}
.opening-copy{position:absolute;top:172px;right:8%;padding:0;max-width:none;z-index:1;margin:0}.opening h1{writing-mode:vertical-rl;font-size:clamp(39px,4vw,61px);line-height:1.7;letter-spacing:.12em;text-shadow:none;font-feature-settings:'palt' 0;white-space:nowrap}.opening .eyebrow{position:absolute;top:auto;bottom:-96px;right:0;margin:0;font-size:9px;white-space:nowrap;letter-spacing:.16em}.enter-link{left:auto;right:8%;bottom:49px;gap:42px;font-size:10px}
.prologue{display:block;padding-top:64px;padding-bottom:30px}.prologue .eyebrow{max-width:none;line-height:2.4}.contents{margin-bottom:100px}

/* Listening becomes recognition, and then the quieter work of making art.
   The recognition is one sentence in its original place, never a pull quote. */
.account-first{display:block;padding:40px 0 120px}
.account-first .account-heading{display:grid;grid-template-columns:.72fr 1.4fr;gap:0 clamp(48px,6vw,110px);margin-bottom:44px}
.account-first .account-meta{grid-column:1;grid-row:1;margin:6px 0 0;align-self:start}
.account-first h2{grid-column:2;grid-row:1/3;font-size:clamp(30px,3.1vw,40px);line-height:1.8;letter-spacing:.05em}
.account-first .byline{grid-column:1;grid-row:2;align-self:end;margin:20px 0 0}
.account-first .account-prose{max-width:650px;width:64%;margin-left:auto}
.account-first .account-prose p:first-child{font-size:inherit;line-height:inherit;margin-bottom:0}
.account-first .recognition{margin-top:36px}
.realisation{display:block;font-size:clamp(20px,2vw,24px);line-height:2.05;letter-spacing:.025em;margin:24px 0 0}
.account-first .return-to-making{margin-top:64px}

/* The original forms return beside 01 and 06. Keep 03 entirely typographic. */
.circle-accent{pointer-events:none;user-select:none;margin:0}
.circle-accent img{width:100%;height:auto;mix-blend-mode:multiply}
.account-first{display:grid;grid-template-columns:28% 64%;gap:0 8%;isolation:isolate}
.account-first .account-heading{grid-column:1/-1;position:relative;z-index:1}
.account-first .account-prose{grid-column:2;grid-row:2;width:100%;position:relative;z-index:1}
.circle-accent--recognition{grid-column:1/-1;grid-row:2;align-self:center;width:72%;max-width:720px;margin:0 0 0 calc((100% - 100vw)/2);transform:translateX(-33.5083%);opacity:.86;z-index:0}

/* Title and photograph share the left edge. The introduction and the account
   of walking share the right; the photograph starts with the stones and roots. */
.account-walking{grid-template-columns:.92fr 1.15fr;gap:48px 9%;border:0;padding:40px 0 125px}
.account-walking .account-heading{grid-column:1;grid-row:1;margin:0}
.account-walking h2{font-size:31px;line-height:1.85}
.account-walking .account-prose{display:contents;font-size:18px;line-height:2.25}
.mountain-context{grid-column:2;grid-row:1;margin:0;padding-top:62px}
.walking-image{grid-column:1;grid-row:2/4;align-self:start;margin:0}
.walking-image img{height:auto}
.mountain-walk{grid-column:2;grid-row:2}
.mountain-body{grid-column:2;grid-row:3;padding-top:0;line-height:2.45}
.account-walking .account-prose p:last-child{margin-top:0}
.account-walking .account-prose p+p:last-child{margin-top:30px}
.account-walking .mountain-body p+p:last-child{margin-top:36px}

/* The voice questions the conversation and then makes something with it. */
.gathering-setting{background:#e5e6dc;padding:100px 0 130px;overflow:visible}
.gathering-voices{max-width:1320px}
.account-room{display:grid;grid-template-columns:.72fr 1.4fr;gap:clamp(48px,6vw,110px);padding:0}
.account-room .account-heading{margin:0;display:flex;flex-direction:column;align-items:center}
.account-room .account-meta{align-self:flex-start;margin:0 0 48px}
.account-room h2{writing-mode:vertical-rl;font-size:34px;line-height:1.8;letter-spacing:.09em;white-space:nowrap}
.account-room .title-phrase{display:block}
.account-room .byline{margin-top:32px;align-self:center;max-width:200px}
.account-room .account-prose{font-size:18px;line-height:2.25;padding-top:54px}
.account-room .putting-it-into-practice{margin-top:46px}


/* The accepted Okunoin photograph and dark reading field are unchanged. */
.touch-passage{margin:110px 0 0 auto;width:86%;max-width:1500px}
.touch-passage img{height:auto}
.returning-voices{padding-top:0}
.account-return{padding:85px 0 112px}
.account-return h2{font-size:30px;line-height:1.9}
.account-return .account-prose{padding-top:54px}
.account-return .back-home{margin-top:44px}
/* The returning voice is practical and continuous. The unresolved question
   comes at the end, with a pause rather than an increase in volume. */
.account-relationships{display:block;border:0;max-width:1000px;margin:0 auto;padding:0 0 120px}
.account-relationships .account-heading{max-width:640px;margin:0 0 38px auto}
.account-relationships h2{font-size:32px;line-height:1.8}
.account-relationships .account-prose{margin-left:auto}
.account-relationships .continuing-question{margin-top:48px}
.account-relationships .account-prose p:last-child{margin-top:30px}
.account-relationships .title-phrase{display:inline-block}
.account-relationships{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,640px);gap:0 clamp(32px,4vw,64px);isolation:isolate}
.account-relationships .account-heading{grid-column:2;grid-row:1;width:100%;position:relative;z-index:1}
.account-relationships .account-prose{grid-column:2;grid-row:2;position:relative;z-index:1}
/* Move the pair a further 15% of its width beyond the previous edge position. */
.circle-accent--continuing{grid-column:1/-1;grid-row:2;width:91%;max-width:850px;align-self:end;margin:0 0 -30px calc((100% - 100vw)/2);transform:translateX(-43.6%);opacity:.8;z-index:0}

/* These questions are tentative. Keep the author's line breaks, a speaking
   scale, and space between questions; do not turn them into a manifesto. */
.unfinished-setting{padding:100px 0 72px;background:linear-gradient(to bottom,#f5f2e9 calc(100% - 160px),var(--paper))}
.account-unfinished{display:block;max-width:660px;margin:0 auto;padding:0}
.account-unfinished .account-heading{margin:0 0 44px}
.account-unfinished h2{font-size:33px;line-height:1.8;letter-spacing:.055em}
.account-unfinished .title-phrase{display:inline-block}
.account-unfinished .byline{margin:22px 0 0}
.account-unfinished .account-prose{max-width:none}
.account-unfinished .account-prose .question-lines{font-size:18px;line-height:2.2;letter-spacing:.025em;margin:42px 0 48px}
.question{display:block}
.question+.question{margin-top:15px}
.question:first-child{margin-bottom:24px}
.account-unfinished .account-prose p:last-child{margin-top:38px}


.reading-compass{background:var(--paper);box-shadow:none;border:0;padding:9px 12px;font-size:9px}

/* English retains its spoken cadence and does not inherit display type on
   paragraphs simply because it fits into fewer characters. */
html[lang=en] .opening-photo{width:58%}
html[lang=en] .opening-copy{width:31%;right:6%;top:200px}
html[lang=en] .opening h1{writing-mode:horizontal-tb;white-space:normal;font:400 clamp(49px,5.8vw,86px)/1.07 var(--display);letter-spacing:-.035em}
html[lang=en] .opening .eyebrow{right:auto;left:0;bottom:-90px}
html[lang=en] .enter-link{right:6%}
html[lang=en] .account-first h2{font-size:clamp(40px,4vw,53px);line-height:1.13}
html[lang=en] .account-first .account-prose p:first-child{font-size:inherit;line-height:inherit}
html[lang=en] .realisation{font-size:21px;line-height:1.85;letter-spacing:0}
html[lang=en] .account-room h2{writing-mode:horizontal-tb;white-space:normal;font-size:clamp(36px,3.8vw,49px);line-height:1.15}
html[lang=en] .account-room .account-heading{align-items:flex-start}
html[lang=en] .account-room .byline{align-self:flex-start}
html[lang=en] .account-room .account-prose{font-size:18px;line-height:1.98}
html[lang=en] .account-walking .account-prose{font-size:18px;line-height:1.98}
html[lang=en] .mountain-body{line-height:2.1}
html[lang=en] .account-return h2{font-size:42px;line-height:1.16}
html[lang=en] .account-relationships h2{font-size:44px;line-height:1.16}
html[lang=en] .account-unfinished h2{font-size:45px;line-height:1.16}
html[lang=en] .account-unfinished .account-prose .question-lines{font-size:18px;line-height:1.95;letter-spacing:0}

@media(max-width:1100px){
 .account-first .account-heading{grid-template-columns:.7fr 1.4fr;column-gap:50px}
 .account-room{grid-template-columns:.7fr 1.4fr;column-gap:50px}
 .account-room h2{font-size:31px}
 .account-room .account-prose,.account-walking .account-prose{font-size:17px}
 .account-walking h2{font-size:29px}
 .account-return h2{font-size:29px}
}
@media(max-width:760px){
 .site-header{height:84px}.site-header .wordmark{font-size:34px}
 .opening{height:780px;min-height:0;max-height:none}
 .opening-photo{top:110px;bottom:90px;width:56%}.opening-photo img{object-position:28% center}
 .opening-copy{top:165px;right:6%;width:auto}
 .opening h1{font-size:30px;line-height:1.65;letter-spacing:.12em}
 .opening .eyebrow{font-size:8px;bottom:-100px;right:0;writing-mode:vertical-rl;letter-spacing:.18em;height:150px;transform:translateY(85px)}
 .enter-link{right:6%;bottom:38px;gap:23px;font-size:9px}
 .prologue{padding-top:40px;padding-bottom:24px}.contents{margin-bottom:45px}
 .account-first{padding:35px 0 85px}
 .account-first{display:grid;grid-template-columns:minmax(0,1fr);gap:0}
 .account-first .account-heading{grid-column:1;grid-row:1}
 .account-first .account-prose{grid-column:1;grid-row:2}
 .circle-accent--recognition{grid-column:1;grid-row:2;align-self:center;width:108%;margin:0 0 0 calc((100% - 100vw)/2);opacity:.75}
 .account-first .account-heading{display:block;margin-bottom:36px}
 .account-first .account-meta{margin:0 0 24px}
 .account-first h2{font-size:30px;line-height:1.8}
 .account-first .byline{margin-top:20px}
 .account-first .account-prose{width:100%;max-width:none}
 .account-first .realisation{font-size:20px;line-height:2.05;margin-top:22px}
 .account-first .return-to-making{margin-top:43px}
 .account-walking{display:block;padding:15px 0 84px}
 .account-walking .account-heading{margin-bottom:34px}
 .account-walking .account-prose{display:block;font-size:17px;line-height:2.17}
 .mountain-context{margin-bottom:35px;padding-top:0}
 .walking-image{width:100%;max-width:430px;margin:0 auto 36px}
 .walking-image img{height:auto}
 .account-walking h2{font-size:28px}
 .mountain-body{padding-top:35px;line-height:2.3}
 .account-walking .mountain-body p+p:last-child{margin-top:30px}
 .gathering-setting{padding:63px 0 84px}
 .gathering-voices{padding:0 var(--pad)}
 .account-room{display:block;padding:0;margin:0}
 .account-room .account-heading{display:block;margin-bottom:35px}
 .account-room .account-meta{margin-bottom:30px}
 .account-room h2{font-size:29px;line-height:1.8;margin:0 auto;width:fit-content}
 .account-room .byline{margin:28px auto 0;text-align:center;max-width:none}
 .account-room .account-prose{padding-top:0;font-size:17px;line-height:2.17}
 .account-room .putting-it-into-practice{margin-top:36px}

 .touch-passage{margin-top:65px;width:100%}
 .account-return{padding:57px 0 83px}
 .account-return .account-prose{padding-top:0}
 .account-return h2{font-size:28px;line-height:1.8}
 .account-return .back-home{margin-top:36px}
 .account-relationships{padding:0 0 88px}
 .account-relationships{display:grid;grid-template-columns:minmax(0,1fr);gap:0}
 .account-relationships .account-heading{grid-column:1;grid-row:1}
 .account-relationships .account-prose{grid-column:1;grid-row:2}
 .circle-accent--continuing{grid-column:1;grid-row:2;width:112%;margin:0 0 24px calc((100% - 100vw)/2);opacity:.7}
 .account-relationships h2{font-size:28px;line-height:1.8}
 .account-relationships .account-heading{margin:0 0 34px}
 .account-relationships .title-phrase{display:block}
 .account-relationships .continuing-question{margin-top:36px}
 .unfinished-setting{padding:64px 0 48px}
 .account-unfinished{padding:0}
 .account-unfinished .account-heading{margin-bottom:34px}
 .account-unfinished h2{font-size:29px;line-height:1.8}
 .account-unfinished .byline{margin-top:22px}
 .account-unfinished .account-prose .question-lines{font-size:17px;line-height:2.2;margin:34px 0 39px;letter-spacing:.01em}
 .question+.question{margin-top:15px}

 html[lang=en] .opening{height:745px}
 html[lang=en] .opening-photo{width:48%;bottom:85px}
 html[lang=en] .opening-copy{width:39%;right:6%;top:161px}
 html[lang=en] .opening h1{font-size:40px;line-height:1.1;letter-spacing:-.035em}
 html[lang=en] .opening .eyebrow{writing-mode:horizontal-tb;font-size:8px;height:auto;transform:none;white-space:normal;bottom:-90px;line-height:2.2;letter-spacing:.13em}
 html[lang=en] .account-first h2{font-size:40px}
 html[lang=en] .account-first .realisation{font-size:19px;line-height:1.9}
 html[lang=en] .account-room h2{font-size:39px;min-height:0;margin:0;width:auto}
 html[lang=en] .account-room .byline{text-align:left;margin-top:23px}
 html[lang=en] .account-room .account-prose,html[lang=en] .account-walking .account-prose{font-size:17px;line-height:1.95}
 html[lang=en] .account-return h2{font-size:39px}
 html[lang=en] .account-relationships h2{font-size:39px}
 html[lang=en] .account-unfinished h2{font-size:40px}
 html[lang=en] .account-unfinished .account-prose .question-lines{font-size:17px;line-height:1.95}
}
@media(max-width:370px){
 .opening h1{font-size:27px}.opening-copy{right:5%}
 .account-first h2{font-size:29px}.account-room h2{font-size:28px}
 html[lang=en] .opening h1{font-size:36px}
}
/* The page now carries one English title in both language editions. */
.opening-photo,html[lang=en] .opening-photo{width:58%}
.opening-copy,html[lang=en] .opening-copy{display:flex;flex-direction:column;gap:32px;width:31%;right:6%;top:auto;bottom:48px}
.opening h1,html[lang=en] .opening h1{writing-mode:horizontal-tb;white-space:normal;font:400 clamp(42px,5.3vw,76px)/1.08 var(--display);letter-spacing:-.015em}
.opening .eyebrow,html[lang=en] .opening .eyebrow{position:static;margin:0;line-height:1;right:auto;left:auto;bottom:auto}
.enter-link{right:6%;bottom:15px}
@media(max-width:760px){
 .opening,html[lang=en] .opening{height:745px}
 .opening-photo,html[lang=en] .opening-photo{width:48%;bottom:85px}
 .opening-copy,html[lang=en] .opening-copy{gap:24px;width:39%;right:6%;top:auto;bottom:85px}
 .opening h1,html[lang=en] .opening h1{font-size:clamp(24px,7.4vw,40px);line-height:1.12}
 .opening .eyebrow,html[lang=en] .opening .eyebrow{writing-mode:horizontal-tb;font-size:8px;height:auto;transform:none;white-space:nowrap;bottom:auto;line-height:1;letter-spacing:.09em}
 .enter-link{bottom:38px}
}
@media print{
 .opening{height:auto;min-height:0}.opening-copy{position:static}.opening h1{writing-mode:horizontal-tb}
 .opening-photo,.walking-image,.touch-passage{display:none}
 .circle-accent{display:none}
 .account-room h2{writing-mode:horizontal-tb}
 .account-first .account-prose{width:100%}
 .account-walking .account-prose{display:block}
}