@charset "UTF-8";
/* The name and camera portrait share one composition; the complete frame stays visible. */
.about{display:block;padding-top:32px;padding-bottom:80px}
.about-topline{display:flex;justify-content:space-between;align-items:center;gap:20px;border-top:1px solid var(--line);padding-top:16px;margin-bottom:36px}
.about-topline>span{font:11px/1.5 var(--mono);color:var(--muted)}
.about-composition{display:grid;grid-template-columns:minmax(0,.78fr) minmax(0,1.6fr);gap:4vw;align-items:center}
.about-title-block{padding-bottom:40px;min-width:0}
.about .about-title-block h1{font:clamp(80px,10.7vw,160px)/.86 var(--serif);letter-spacing:-.045em;margin:0}
.about-title-block h1>span,.about-title-block h1>em{display:block}
.about-title-block h1>em{margin-top:9px}
.about-greeting{font:italic clamp(23px,2.1vw,32px)/1.2 var(--serif);color:var(--muted);margin-top:30px}
.about-portrait{min-width:0;margin:0}
.about-portrait img{width:100%;height:auto;max-width:none;object-fit:contain}
.about-portrait figcaption{font:11px/1.5 var(--mono);margin-top:8px;align-items:center;gap:12px}
.about-portrait figcaption>a{display:inline-flex;align-items:center;gap:10px;min-height:44px;text-align:right}
.about-portrait figcaption>a:hover{color:var(--accent)}
.about-story{display:grid;grid-template-columns:minmax(0,.78fr) minmax(0,1.6fr);gap:4vw;margin:54px 0 60px}
.about-statement{font:clamp(26px,2.8vw,42px)/1.12 var(--serif);letter-spacing:-.4px}
.about-statement em{color:var(--muted)}
.about-body{max-width:490px}
.about-body>.intro{font-size:23px;line-height:1.4;letter-spacing:-.35px;margin-bottom:20px;max-width:460px}
.about-body>p:not(.intro){font-size:15px;line-height:1.75;color:var(--muted);margin-bottom:20px}
.about-body .text-link{display:inline-flex;gap:24px;align-items:center;min-height:44px;padding:0;font-size:13px}
.about-practice{display:grid;grid-template-columns:1fr 1fr;gap:4vw;border-top:1px solid var(--line);padding:26px 0 40px}
.about-practice>div{min-width:0}
.about-practice h2{font:clamp(27px,3vw,42px)/1.12 var(--serif);letter-spacing:-.3px;margin:22px 0 12px}
.about-practice p{max-width:350px;font-size:14px;line-height:1.7;color:var(--muted)}
.about-contact{display:grid;grid-template-columns:minmax(0,.78fr) minmax(0,1.6fr);gap:4vw;border-top:1px solid var(--line);padding-top:34px;align-items:center}
.about-contact h2{font:clamp(46px,5.6vw,80px)/.95 var(--serif);letter-spacing:-1px}
.about-contact h2 em{color:var(--muted)}
.about-contact>div{max-width:490px}
.about-contact p{font-size:15px;line-height:1.7;color:var(--muted);max-width:390px;margin-bottom:24px}
.about-book-link{display:flex;justify-content:space-between;align-items:center;gap:20px;border-bottom:1px solid var(--ink);padding:12px 0;min-height:52px;font-size:15px}
.about-book-link>span{font-size:23px;transition:transform .2s}
.about-book-link:hover{color:var(--accent);border-color:var(--accent)}
.about-book-link:hover>span{transform:translate(3px,-3px)}
@media(min-width:1600px){.about-composition,.about-story,.about-contact{gap:64px}}
@media(min-width:601px) and (max-width:900px){
 .about{padding-top:28px;padding-bottom:65px}
 .about-composition{grid-template-columns:minmax(0,.8fr) minmax(0,1.25fr);gap:24px}
 .about .about-title-block h1{font-size:clamp(74px,10.7vw,96px)}
 .about-title-block{padding-bottom:45px}.about-greeting{font-size:23px;margin-top:24px}
 .about-portrait figcaption{align-items:start;flex-direction:column;gap:0;font-size:11px}
 .about-portrait figcaption>a{min-height:36px;text-align:left}
 .about-story,.about-contact{grid-template-columns:minmax(0,.8fr) minmax(0,1.25fr);gap:24px}
 .about-story{margin:36px 0 45px}.about-body>.intro{font-size:21px}
 .about-statement{font-size:29px}.about-practice h2{font-size:30px}
}
@media(max-width:600px){
 .about{display:block;padding:20px 20px 48px}
 .about-topline{margin-bottom:24px;padding-top:14px;gap:8px}
 .about-topline>span{display:none}
 .about-composition{display:flex;flex-direction:column;gap:20px;align-items:stretch}
 .about-title-block{padding:0;display:flex;align-items:end;justify-content:space-between;gap:12px}
 .about .about-title-block h1{font-size:clamp(64px,18vw,108px);line-height:.9;letter-spacing:-.045em}
 .about-title-block h1>span,.about-title-block h1>em{display:inline}
 .about-title-block h1>span{font-size:.66em;letter-spacing:-.04em;margin-right:.16em}
 .about-title-block h1>em{margin:0}
 .about-greeting{display:none}
 .about-portrait figcaption{font-size:11px;display:block;margin-top:12px}
 .about-portrait figcaption>a{display:flex;justify-content:space-between;text-align:left;min-height:44px;margin-top:2px;border-bottom:1px solid var(--line)}
 .about-story{grid-template-columns:minmax(0,1fr);gap:24px;margin:30px 0 34px}
 .about-statement{font-size:34px;line-height:1.08;letter-spacing:-.5px}
 .about-body>.intro{font-size:20px;margin-bottom:16px;max-width:340px}
 .about-body>p:not(.intro){font-size:15px;line-height:1.7;margin-bottom:14px}
 .about-practice{grid-template-columns:minmax(0,1fr);gap:26px;padding:24px 0 30px}
 .about-practice h2{font-size:31px;margin:14px 0 10px}
 .about-practice>div+div{border-top:1px solid var(--line);padding-top:24px}
 .about-contact{grid-template-columns:minmax(0,1fr);gap:25px;padding-top:28px}
 .about-contact h2{font-size:58px}.about-contact p{font-size:15px;margin-bottom:16px}
 .about-book-link{font-size:14px}
}