/*
Theme Name: Kaiji Reference Design
Description: 指定デザインを基に表示・操作性を改善。一般公開は停止、管理者のみ確認できます。
Version: 1.2.0
Author: Kaiji
Text Domain: kaiji-reference
Requires at least: 6.0
Requires PHP: 7.4
*/
/* Kaiji usability review, 2026-09-28. The photographic identity stays intact. */
:root{--kaiji-header-height:88px;--muted:#536159;--kaiji-focus:#80601f}
html,html.stay-document,html:has(body.hotels-editorial){scroll-padding-top:calc(var(--kaiji-header-height) + 20px)}
body{overflow-wrap:break-word}
.header{position:sticky;top:0;height:var(--kaiji-header-height);z-index:40;gap:36px;padding-inline:clamp(28px,4.5vw,72px);background:#fff;border-bottom:1px solid #dfe5e0}
.header .logo{width:112px;flex:0 0 112px;min-height:44px;display:flex;align-items:center}
.header .logo img{aspect-ratio:134 / 66;object-fit:contain}
.header .desktop-nav{align-items:center;gap:32px;font-size:18px;line-height:1.5}
.header .desktop-nav>a{display:flex;align-items:center;justify-content:center;min-height:48px;white-space:nowrap}
.header .nav-explore{gap:10px}
.header .nav-bird{width:40px;height:auto;aspect-ratio:88 / 87;flex:0 0 40px;object-fit:contain;transform:none;transition:none}
.header .nav-explore:hover .nav-bird,.header .nav-explore:focus-visible .nav-bird{transform:none}
.header .header-book{min-height:48px;font-size:17px;line-height:1.5;gap:20px;padding:12px 22px;white-space:nowrap;flex-shrink:0}
.header a:hover{text-decoration-thickness:1px;text-underline-offset:6px}
.header .header-book:hover{background:#203f34;text-decoration:none}
.skip{position:fixed;z-index:60;left:16px}
.stay-anchor-nav{top:var(--kaiji-header-height);z-index:20}
main[id],main [id]{scroll-margin-top:16px}
.home .home-hero{height:min(720px,calc(100svh - var(--kaiji-header-height)))}
.kaiji-footer .footer-logo{aspect-ratio:217 / 107;object-fit:contain}
.journal-doodle{height:auto;aspect-ratio:204 / 163;object-fit:contain}
.news-photo,.explore-card>a>img,.essay-cover>img{background:#f0f3ee}
.essay-cover figcaption,.essay-body figcaption,.journal-demo,.essay-aside dt,.journal-crumb,.breadcrumb,
.journal-meta,.hotels-moments figcaption span,.hotels-opening>p,.hotels-property .hotels-meta{font-size:14px;line-height:1.8}
.stay-photo-toolbar p>span{font-size:14px}
.home .stay-kind,.about-page .about-landscapes figcaption,.about-page .about-staff figcaption,
.stay-page .stay-type-badge,.stay-page .stay-reserve .stay-reserve-type{font-size:14px;line-height:1.8}
.stay-photo-stage figcaption{line-height:1.7;min-height:24px}
.journal-area select{font-size:16px;min-width:0}
.field input,.field textarea,.journal-area select{border-color:#829589}
.journal-tools button:not([aria-pressed=true]){border-color:#829589}
.explore-filters:not([open]) .journal-tools{display:none}
.journal-tools{max-height:calc(100dvh - var(--kaiji-header-height) - 100px);overflow-y:auto;overscroll-behavior:contain}
.stay-room-controls button:disabled{cursor:default}
.kaiji-footer .footer-phone .tel,.breadcrumb>a,.journal-crumb>a{display:inline-flex;align-items:center;min-height:44px}
.contact>p:last-child a{display:inline-flex;align-items:center;min-height:44px;text-decoration:underline;text-underline-offset:5px}
.kaiji-footer .footer-mail{max-width:100%;overflow-wrap:anywhere}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,summary:focus-visible,
.stay-page a:focus-visible,.stay-page button:focus-visible,.stay-page summary:focus-visible{outline:3px solid var(--kaiji-focus);outline-offset:4px}
.menu-open .stay-mobile-book{visibility:hidden;pointer-events:none}
@media(min-width:821px) and (max-width:1050px){
 .header{gap:24px;padding-inline:28px}
 .header .desktop-nav{gap:24px;font-size:17px}
 .header .header-book{padding-inline:18px;font-size:16px;gap:14px}
}
@media(max-width:820px){
 :root{--kaiji-header-height:72px}
 .header{padding-inline:20px;gap:12px}
 .header .logo{width:88px;flex-basis:88px;margin-right:auto}
 .header .desktop-nav{display:none}
 .header .header-book{display:flex;align-items:center;justify-content:center;min-height:44px;padding:10px 14px;font-family:ZenKaku,sans-serif;font-size:14px;line-height:1.5;gap:0;background:var(--green);color:#fff;border:1px solid var(--green)}
 .header .header-book>span{display:none}
 .header .menu-button{display:flex;flex-direction:column;gap:6px;justify-content:center;align-items:center;flex:0 0 44px;width:44px;min-width:44px;min-height:44px;background:#fff;border:0;padding:8px;margin-right:-8px;color:var(--green)}
 .header .menu-button span{width:24px;height:1px;background:currentColor}
 .header .menu-button[aria-expanded=true] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
 .header .menu-button[aria-expanded=true] span:nth-child(2){opacity:0}
 .header .menu-button[aria-expanded=true] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
 #mobile-menu:not([hidden]){display:flex;position:absolute;inset:100% 0 auto;max-height:calc(100dvh - var(--kaiji-header-height));overflow-y:auto;overscroll-behavior:contain;flex-direction:column;gap:0;padding:12px 20px calc(20px + env(safe-area-inset-bottom));background:#fff;border-bottom:1px solid var(--line);box-shadow:0 8px 16px #2028200c;font-family:ZenOld,serif;font-size:18px;line-height:1.6}
 #mobile-menu>a{display:flex;align-items:center;justify-content:flex-start;min-height:56px;padding:10px 4px;border-bottom:1px solid #e5eae5;gap:12px}
 #mobile-menu>a:last-child{border-bottom:0}
 #mobile-menu .nav-bird{order:1;flex:0 0 28px;width:28px;height:auto;aspect-ratio:88 / 87}
 .home .home-hero{height:min(680px,calc(100svh - var(--kaiji-header-height)));min-height:420px}
 .home .hero-content{padding-bottom:56px}
 .home .hero-playback{right:18px;bottom:12px}
 .hotels-opening h1{font-size:20px;line-height:1.6}
 .hotels-opening>p{white-space:normal}
 .explore-filters>summary{font-size:14px}
 .stay-mobile-book{padding-bottom:calc(10px + env(safe-area-inset-bottom))}
 .stay-photo-dialog{padding-top:max(18px,env(safe-area-inset-top))}
}
@media(max-width:360px){
 .header{padding-inline:16px;gap:10px}
 .header .logo{width:80px;flex-basis:80px}
 .header .header-book{padding-inline:12px}
 .kaiji-footer .footer-identity{gap:16px}
 .hotels-opening h1{font-size:18px}
 .explore-grid:not(.is-filtered) .explore-card:first-child .explore-copy{grid-template-columns:1fr;gap:4px}
 .explore-grid:not(.is-filtered) .explore-card:first-child .explore-arrow{justify-self:end}
}
@media(max-height:600px) and (max-width:820px){
 .home .home-hero{height:calc(100svh - var(--kaiji-header-height));min-height:340px}
 .home .hero-logo{width:150px;margin-bottom:14px}
 .home .hero-content{padding-bottom:40px}
 .home .hero h1{font-size:18px;line-height:1.8}
}

/* English typesetting, paired language navigation and visitor guide. */
.header{gap:24px}
.header .language-switch{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;min-width:44px;min-height:44px;padding:8px;border:1px solid #a4b1a9;color:var(--green);font-family:ZenKaku,sans-serif;font-size:14px;line-height:1;text-decoration:none}
.header .language-switch:hover{background:#f0f3ee}
html[lang=en] body{font-size:17px;line-height:1.75;word-break:normal;overflow-wrap:break-word}
html[lang=en] h1,html[lang=en] h2,html[lang=en] h3,html[lang=en] h4{letter-spacing:0;line-height:1.25;text-wrap:balance}
html[lang=en] p{letter-spacing:0}
html[lang=en] .header{gap:20px}
html[lang=en] .header .desktop-nav{font-size:17px;gap:24px}
html[lang=en] .header .header-book{font-size:16px;padding-inline:20px;gap:14px}
html[lang=en] .hero h1{font-size:clamp(30px,3.2vw,46px);line-height:1.35}
html[lang=en] .hero-content h1{max-width:620px}
html[lang=en] .story{font-size:20px;line-height:1.8}
html[lang=en] .stay-page{font-size:16px;line-height:1.8}
html[lang=en] .stay-type-badge,html[lang=en] .stay-kind{white-space:normal;text-align:left}
html[lang=en] .stay-tagline{font-size:20px;line-height:1.5}
html[lang=en] .stay-intro{gap:24px}
html[lang=en] .stay-intro h1{font-size:clamp(32px,4vw,48px)}
html[lang=en] .stay-inline-reserve .button,html[lang=en] .stay-intro-book{white-space:normal}
html[lang=en] .stay-photo-stage figcaption{font-size:15px;line-height:1.5}
html[lang=en] .stay-photo-toolbar{gap:18px;align-items:center}
html[lang=en] .stay-room .text-link{gap:12px}
html[lang=en] .about-arrival h1 span{display:inline}
html[lang=en] .about-landscapes figure{display:block}
html[lang=en] .about-landscapes figcaption{width:auto;writing-mode:horizontal-tb;padding-top:10px;line-height:1.5}
html[lang=en] .about-page .scene h2,html[lang=en] .about-page .scene-title{writing-mode:horizontal-tb}
html[lang=en] .about-page .about-staff figcaption{writing-mode:horizontal-tb}
html[lang=en] .property-caption h4{font-size:26px}
html[lang=en] .hotels-opening h1{font-size:clamp(25px,3.5vw,38px);line-height:1.35}
html[lang=en] .hotels-opening>p{font-size:16px;white-space:normal}
html[lang=en] .hotels-jump span{white-space:normal}
html[lang=en] .journal-tools button{line-height:1.4;min-height:44px}
html[lang=en] .journal-area{flex-wrap:wrap}
html[lang=en] .journal-area select{max-width:100%}
html[lang=en] .explore-copy h2,html[lang=en] .explore-copy h3{line-height:1.25}
html[lang=en] .essay-body{line-height:1.85}
html[lang=en] .essay-title{line-height:1.2}
html[lang=en] .essay-aside dd{line-height:1.5}
html[lang=en] .kaiji-footer .footer-identity{min-width:0}
html[lang=en] .kaiji-footer .footer-phone .tel{font-size:clamp(18px,2.2vw,24px);white-space:nowrap}
html[lang=en] .kaiji-footer .footer-mail{font-size:16px}
html[lang=en] .kaiji-footer h2{line-height:1.5}
.visitor-intro{display:flex;justify-content:space-between;align-items:center;gap:28px;padding:30px 0;border-bottom:1px solid var(--line)}
.visitor-intro p{margin:0;max-width:720px;line-height:1.7}
.visitor-intro .text-link{flex-shrink:0}
.visitor-eyebrow{display:block;color:var(--green);font:14px/1.5 ZenKaku,sans-serif;letter-spacing:.12em;margin-bottom:6px;text-transform:uppercase}
.visitor-note{font-size:14px;line-height:1.7;color:#536159;margin:16px 0 24px}
.visitor-note a,.english-preview-note a{color:var(--green);text-decoration:underline;text-underline-offset:3px}
.english-preview-note{font-size:14px;line-height:1.6;padding:14px 18px;border-left:3px solid #829589;background:#f3f5f1;color:#344c3d;margin:20px 0 30px}
.english-news-preview{margin-top:28px;margin-bottom:0}
.visitor-guide{width:min(1120px,calc(100% - 96px));margin:64px auto 100px}
.visitor-guide .guide-hero{display:grid;grid-template-columns:1.15fr 1fr;gap:48px;align-items:center;margin-bottom:48px}
.visitor-guide h1{font-size:clamp(38px,4.5vw,60px);margin:12px 0 24px}
.visitor-guide .guide-hero img{aspect-ratio:4/3;object-fit:cover}
.visitor-guide .guide-hero p{font-size:19px;color:#536159;line-height:1.7}
.visitor-guide .guide-nav{display:flex;flex-wrap:wrap;gap:12px 28px;padding:18px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin:0 0 64px}
.visitor-guide .guide-nav a{min-height:44px;display:inline-flex;align-items:center;text-decoration:underline;text-underline-offset:5px;color:var(--green)}
.visitor-guide section{margin:0 0 64px}
.visitor-guide h2{font-size:clamp(28px,3vw,38px);margin-bottom:24px}
.visitor-guide h3{font-size:23px;margin-bottom:14px}
.visitor-guide .guide-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.visitor-guide .guide-card{padding:26px;background:#f3f5f1;min-width:0}
.visitor-guide .guide-card .text-link{font-size:16px;gap:12px}
.visitor-guide .guide-split{display:grid;grid-template-columns:1fr 1fr;gap:40px}
.visitor-guide .guide-split p{max-width:65ch}
.visitor-guide ul,.visitor-guide ol{padding-left:24px}
.visitor-guide li{padding-left:5px;margin-bottom:12px}
.visitor-guide .route-step{font-family:ZenOld,serif;font-size:27px;color:var(--green);padding:24px 0;border-block:1px solid var(--line);margin:24px 0}
.visitor-guide .guide-link{display:inline-flex;min-height:44px;align-items:center;text-decoration:underline;text-underline-offset:4px;color:var(--green)}
.visitor-guide .guide-faq details{border-top:1px solid var(--line);padding:18px 0}
.visitor-guide .guide-faq details:last-child{border-bottom:1px solid var(--line)}
.visitor-guide .guide-faq summary{cursor:pointer;min-height:44px;font-size:19px;line-height:1.5;color:var(--green);padding-right:12px}
.visitor-guide .guide-faq details p{max-width:75ch;margin:12px 0}
.visitor-guide .booking-terms{display:grid;grid-template-columns:1fr 1fr;gap:0 24px;margin:20px 0}
.visitor-guide .booking-terms>div{padding:12px 0;border-bottom:1px solid var(--line)}
.visitor-guide .booking-terms dt{font-weight:600}
.visitor-guide .booking-terms dd{margin:4px 0 0;color:#536159}
.visitor-guide .guide-contact{padding:32px;background:#f3f5f1}
.visitor-guide .guide-contact a{overflow-wrap:anywhere}
@media(min-width:821px) and (max-width:1100px){html[lang=en] .header{gap:14px;padding-inline:24px}html[lang=en] .header .desktop-nav{gap:18px;font-size:16px}html[lang=en] .header .nav-bird{width:30px;flex-basis:30px}html[lang=en] .header .nav-explore{gap:7px}html[lang=en] .header .header-book{padding-inline:14px;gap:10px}html[lang=en] .header .logo{width:100px;flex-basis:100px}}
@media(max-width:820px){
 .header{gap:8px;padding-inline:16px}.header .logo{width:80px;flex-basis:80px}.header .language-switch{font-size:13px;padding:6px;min-width:44px}.header .header-book{padding-inline:10px}
 html[lang=en] .header{gap:8px;padding-inline:16px}html[lang=en] .header .header-book{font-size:14px;padding:10px;gap:0}
 html[lang=en] .story{font-size:18px;line-height:1.8}html[lang=en] .home .hero h1{font-size:27px;line-height:1.45}
 html[lang=en] .stay-tagline{font-size:18px}html[lang=en] .stay-intro h1{font-size:34px}
 html[lang=en] .stay-photo-dialog{padding-inline:12px}html[lang=en] .stay-photo-toolbar p{font-size:16px;line-height:1.4}html[lang=en] .stay-photo-toolbar .stay-photo-close{font-size:15px;min-width:80px}
 html[lang=en] .stay-mobile-book .button{font-size:15px;padding-inline:16px;gap:12px;white-space:normal}
 html[lang=en] .about-arrival h1{font-size:36px;line-height:1.25}html[lang=en] .about-arrival h1 span{display:inline}
 html[lang=en] .hotels-opening h1{font-size:26px}html[lang=en] .essay-head h1{font-size:36px;line-height:1.25}
 .visitor-intro{display:block;padding:24px 0}.visitor-intro p{font-size:16px}.visitor-intro .text-link{margin-top:12px}
 .visitor-guide{width:calc(100% - 40px);margin-top:36px}.visitor-guide .guide-hero{grid-template-columns:1fr;gap:24px;margin-bottom:28px}.visitor-guide h1{font-size:42px}.visitor-guide .guide-hero p{font-size:18px}.visitor-guide .guide-hero img{aspect-ratio:16/10}
 .visitor-guide .guide-nav{gap:4px 24px;margin-bottom:40px}.visitor-guide .guide-grid,.visitor-guide .guide-split{grid-template-columns:1fr;gap:20px}.visitor-guide section{margin-bottom:44px}.visitor-guide .guide-card{padding:24px}.visitor-guide .guide-contact{padding:24px}.visitor-guide .booking-terms{grid-template-columns:1fr}
}
@media(max-width:360px){.header .logo{width:72px;flex-basis:72px}.header{gap:6px}html[lang=en] .header{gap:6px}html[lang=en] .header .header-book{font-size:13px;padding-inline:9px}html[lang=en] .about-arrival h1{font-size:30px}html[lang=en] .home .hero h1{font-size:24px}html[lang=en] .essay-head h1{font-size:31px}.visitor-guide h1{font-size:36px}}