@font-face{font-family:'Noto Sans JP';src:url('assets/NotoSansJP-variable.ttf') format('truetype');font-weight:100 900;font-style:normal;font-display:swap}
:root{--sans:'Noto Sans JP',sans-serif;--body-sans:'Noto Sans JP',sans-serif}
body,input,button,select,h1,h2,h3,.eyebrow,.price{font-family:'Noto Sans JP',sans-serif}
.hero-photo>img{object-position:50% 53%}
#concept .concept-photo>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%}
#experience .moment-photo img[src*="reception"]{object-position:48% 50%}

.generic-preview-notice{margin:24px 0 8px;font-size:12px;color:#666}
.generic-submit{background:#111;color:#fff;border-color:#111;cursor:pointer}
.moment.why-line .moment-photo{background:#f4f4f2}
@media(max-width:620px){.hero-photo>img{object-position:56% 50%}}

/* Notification artwork uses the salon source coordinate system (1024px square crop).
   Booking source: 512x184, x=451, y=114, right inset=61.
   Follow-up source: 512x243, x=963,y=279 on the x=512..1536 crop. */
#concept .concept-photo>.notice-art,#experience .moment.reverse .moment-photo>.notice-art{
 position:absolute;inset:auto;width:50%;max-width:none;height:auto;object-fit:contain;transform:none;left:auto;right:5.95703125%;
}
#concept .concept-photo>.booking-notice{top:11.1328125%;aspect-ratio:512/184}
#experience .moment.reverse .moment-photo>.followup-notice{top:27.24609375%;aspect-ratio:512/243}

.notice-art text{font-family:"Noto Sans JP",sans-serif;letter-spacing:0}

/* v4: move only the booking notice, keeping the salon-derived artwork scale. */
#concept .concept-photo>.booking-notice{left:5.95703125%;right:auto;top:auto;bottom:64px}
/* The headline is above the photograph; restore natural photo color.
   Only the bottom caption overlaps, so retain its readability with a local shadow. */
.hero-photo::before{display:none;background:none}
.hero-photo figcaption{color:#fff;text-shadow:0 1px 8px rgba(0,0,0,.75)}

/* Preserve desktop markup and fit only the approved phone heading lines. */
.hero-phone-break{display:none}
@media(max-width:620px){
 .hero h1{font-size:min(50px,calc((100vw - 40px)/8))!important;white-space:nowrap}
 #concept .concept-label h2{white-space:nowrap}
 #concept .booking-action{display:inline!important}
}