@font-face{font-family:'Instrument Serif';src:url('assets/fonts/InstrumentSerif-Regular.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:SUIT;src:url('assets/fonts/SUIT-Variable.woff2') format('woff2');font-style:normal;font-weight:100 900;font-display:swap}
body.axis{--serif:'Instrument Serif',Georgia,serif;--sans:SUIT,'Apple SD Gothic Neo',sans-serif;font-family:var(--sans);font-weight:400}
.axis .name{top:37.5%}
.axis .name h1{font-family:var(--serif);font-size:clamp(80px,8.2vw,118px);font-weight:400;letter-spacing:-.016em;line-height:.98;font-kerning:normal}
.axis .name h1 span+span{margin-left:.13em}
.axis .name-note{font-size:9px;font-weight:500;letter-spacing:.25em;margin-bottom:27px}
.axis .name p{font-size:13px;font-weight:350;letter-spacing:.26em;margin-top:23px}
.axis .section-head h2{font-family:var(--serif);font-weight:400;font-size:47px;line-height:1.08;letter-spacing:-.01em}
.axis .intro-title h2{font-family:var(--sans);font-size:32px;font-weight:320;letter-spacing:-.045em;line-height:1.65}
.axis .credentials dt{font-size:11px;font-weight:400}.axis .credentials dd{font-size:14px;letter-spacing:-.025em;font-weight:430}
.axis .row h3{font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:-.025em}.axis .row p{font-size:12px;font-weight:400;letter-spacing:-.012em}.axis .date{font-size:11px;font-weight:450;letter-spacing:.025em}
.axis .research .row h3{font-size:14px;font-weight:420;line-height:1.85}
.axis .footer-name{font-family:var(--serif);font-size:37px;letter-spacing:-.015em}
.axis .name *{animation:none!important;filter:none!important;transform:none!important}
.axis .film{opacity:1!important;filter:none!important;clip-path:none!important}
.axis .contact{margin:15px var(--gutter) 0;padding:50px 0 75px;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr;gap:10vw;position:relative}
.axis .contact:before{content:'';position:absolute;left:50%;top:0;bottom:0;width:1px;background:var(--line)}
.axis .contact .section-head{text-align:right}
.axis .contact .salon{padding-bottom:27px}.axis .salon h3{font-size:17px;line-height:1.7;letter-spacing:-.035em;font-weight:430}.axis .salon p{font-size:12px;line-height:1.9;color:var(--muted);margin-top:12px}
.axis .reservation-links{border-top:1px solid var(--line)}.axis .reservation-links>a{display:grid;grid-template-columns:1fr 22px;gap:15px;align-items:center;border-bottom:1px solid var(--line);padding:20px 0;transition:padding .25s,background .25s}.axis .reservation-links>a:hover{padding-left:10px;background:#ffffff6b}.axis .reservation-links strong{font-size:16px;font-weight:430;letter-spacing:-.025em}.axis .reservation-links small{display:block;font-size:10px;letter-spacing:.035em;color:var(--muted);margin-top:5px}.axis .reservation-links .arrow{font-size:19px;font-weight:250}.axis .contact-note{font-size:11px;line-height:1.8;color:var(--muted);margin-top:22px;word-break:keep-all}
@media(max-width:800px){.axis .name{top:38%}.axis .name h1{font-size:clamp(60px,16.4vw,78px);letter-spacing:-.02em}.axis .name h1 span+span{margin-left:.13em}.axis .name-note{font-size:8px;margin-bottom:24px;letter-spacing:.24em}.axis .name p{font-size:12px;margin-top:24px}.axis .section-head h2{font-size:38px}.axis .intro-title h2{font-size:30px}.axis .credentials dd{font-size:12px}.axis .credentials dt{font-size:10px}.axis .row h3{font-size:14px}.axis .row p{font-size:11px}.axis .date{font-size:10px}.axis .research .row h3{font-size:13px}.axis .contact{margin-top:5px;padding:30px 0 50px 21px;grid-template-columns:1fr;gap:30px}.axis .contact:before{left:0;bottom:25px}.axis .contact .section-head{text-align:left}.axis .salon h3{font-size:16px}.axis .reservation-links strong{font-size:15px}.axis .reservation-links>a{padding:18px 0}.axis .footer-name{font-size:34px}}

/* Axis refinement: white ground, a lifted film plane, one continuous rule. */
body.axis{--paper:#fff;--ink:#292a2b;--muted:#707577;--line:rgba(45,53,57,.17);background:#fff;isolation:isolate}
.axis main{position:relative;display:flow-root}
.axis .ambient,.axis .atmosphere{display:none}
.axis .hero{margin:24px 24px 0;height:calc(100svh - 48px);min-height:700px;outline:1px solid rgba(35,45,50,.13);outline-offset:0;box-shadow:0 2px 5px rgba(22,32,40,.035),0 18px 48px -18px rgba(22,32,40,.15)}
.axis .film-edge{border-color:rgba(255,255,255,.2)}
.axis .hero:after,.axis .intro:before,.axis .dossier:before,.axis .contact:before{display:none}
.axis main:after{content:'';position:absolute;z-index:7;pointer-events:none;left:50%;top:var(--axis-start,500px);bottom:0;width:1px;background:linear-gradient(to bottom,rgba(255,255,255,.44) 0,rgba(255,255,255,.44) var(--axis-light,225px),rgba(45,53,57,.17) var(--axis-light,225px),rgba(45,53,57,.17) 100%)}
.axis main,.axis>footer{position:relative;z-index:1}
.axis .axis-wash,.axis .axis-wash-fallback{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
.axis .axis-wash-fallback{opacity:var(--wash-presence,0);background:radial-gradient(ellipse 58% 65% at var(--wash-left,-8%) var(--wash-left-y,45%),rgba(77,150,217,.17),rgba(77,150,217,.08) 36%,rgba(77,150,217,0) 76%),radial-gradient(ellipse 52% 61% at var(--wash-right,108%) var(--wash-right-y,70%),rgba(77,150,217,.13),rgba(77,150,217,.055) 40%,rgba(77,150,217,0) 78%)}
@media(max-width:800px){.axis .hero{margin:12px 12px 0;height:88svh;min-height:660px;box-shadow:0 2px 4px rgba(22,32,40,.04),0 14px 32px -16px rgba(22,32,40,.15)}.axis main:after{left:var(--gutter)}.axis .section-tag{padding-left:21px}}
@media print{.axis-wash,.axis-wash-fallback{display:none}.axis .hero{box-shadow:none}}
/* Keep the scroll fade when a reservation row also has a hover transition. */
.axis .contact{grid-template-columns:minmax(0,1fr) minmax(0,1fr);scroll-margin-top:28px}
.axis .contact-content,.axis .reservation-links,.axis .reservation-links>a>span{min-width:0}
.axis .reservation-links>a{grid-template-columns:minmax(0,1fr) 22px;min-height:78px;transition:opacity .9s ease,transform 1.1s cubic-bezier(.2,.65,.2,1),padding .25s ease,background .25s ease}
.axis .reservation-links small{line-height:1.7;overflow-wrap:anywhere}
@media(max-width:800px){.axis .contact{grid-template-columns:minmax(0,1fr);gap:28px;padding-right:0}.axis .contact .section-head{min-width:0}.axis #contact-title{font-size:clamp(32px,9.5vw,38px)}.axis .reservation-links>a{width:100%;min-height:76px;padding:18px 0;gap:10px}.axis .reservation-links strong{font-size:15px}.axis .reservation-links small{font-size:11px;letter-spacing:0}.axis .contact-note{font-size:11px;line-height:1.9}.axis .contact .salon{padding-bottom:24px}}
@media(prefers-reduced-motion:reduce){.axis .reservation-links>a{transition:none}}

.axis .language-switch{display:flex;gap:16px;align-items:center}
.axis .language-switch a{padding:0 0 3px;background:none;border:0;border-bottom:1px solid transparent;color:inherit;font:10px var(--sans);opacity:.65}
.axis .language-switch a[aria-current=page]{border-bottom-color:currentColor;opacity:1}
.axis .credentials dd,.axis .row h3,.axis .row p{overflow-wrap:anywhere}
/* Position-based type fade: clear at the centre, translucent only near the edges. */
.axis .reveal{opacity:1;transform:none;transition:none}
.axis.scroll-fade .reveal{-webkit-mask-image:var(--pigment-mask);mask-image:var(--pigment-mask);mask-repeat:no-repeat;mask-size:var(--pigment-size);mask-position:var(--pigment-position)}
.axis.scroll-fade .reveal:focus-within{-webkit-mask-image:none;mask-image:none}
.axis .reservation-links>a{transition:padding .25s ease,background .25s ease}
@media(prefers-reduced-motion:reduce){.axis.scroll-fade .reveal{-webkit-mask-image:none;mask-image:none}}
@media print{.axis.scroll-fade .reveal{-webkit-mask-image:none;mask-image:none}}
html[lang=en] .axis .credentials>div{grid-template-columns:115px minmax(0,1fr)}
html[lang=zh-Hans] .axis .section-head h2{font-family:var(--sans);font-size:32px;font-weight:350;letter-spacing:.04em}
@media(max-width:800px){.axis .topline{gap:14px}.axis .topline>span{font-size:7px;letter-spacing:.015em}.axis .language-switch{gap:12px}.axis .language-switch a{font-size:9px}html[lang=en] .axis .credentials>div{grid-template-columns:86px minmax(0,1fr)}html[lang=en] .axis .intro-title h2{font-size:27px}html[lang=zh-Hans] .axis .section-head h2{font-size:28px}}

/* Bibliographic links retain the existing editorial hierarchy. */
.axis .research-source{color:inherit;text-decoration:underline;text-decoration-color:rgba(40,40,40,.3);text-underline-offset:3px;overflow-wrap:anywhere}
.axis .research-source:hover{text-decoration-color:currentColor}
.axis .research-source:focus-visible{outline:1px solid currentColor;outline-offset:4px}

.axis .salon-area{max-width:460px;margin-top:20px;font-size:12px;line-height:1.9;word-break:keep-all;color:var(--muted)}

/* Practical answers use the existing editorial rules, with native accessible disclosure. */
.axis .visit-guide{margin-top:35px;border-top:1px solid var(--line)}
.axis .visit-guide h3{font-size:13px;font-weight:500;letter-spacing:.015em;padding:22px 0 12px}
.axis .visit-guide details{border-bottom:1px solid var(--line);font-size:12px;line-height:1.85}
.axis .visit-guide summary{display:flex;justify-content:space-between;gap:18px;list-style:none;cursor:pointer;padding:15px 0;min-height:48px}
.axis .visit-guide summary::-webkit-details-marker{display:none}
.axis .visit-guide summary::after{content:'+';flex:0 0 14px;text-align:center}
.axis .visit-guide details[open] summary::after{content:'−'}
.axis .visit-guide details p{padding:0 22px 18px 0;color:var(--muted);line-height:1.95;word-break:keep-all;overflow-wrap:anywhere}
.axis .visit-guide summary:focus-visible{outline:1px solid currentColor;outline-offset:4px}
@media(max-width:800px){.axis .visit-guide summary{font-size:12px}.axis .visit-guide details p{font-size:12px}}
