:root{
  --snow:#f7f6f3; --paper:#fff; --ink:#26282b; --mute:#6b6e72; --line:#dcdad4;
  --bengara:#a8412a; --bengara-d:#8a3320; --pine:#3d4a44;
  --serif:"Noto Serif JP","Noto Serif CJK JP","Yu Mincho","Hiragino Mincho ProN",serif;
  --sans:"Zen Kaku Gothic New","Hiragino Sans","Noto Sans JP",sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--snow);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.9;-webkit-text-size-adjust:100%}
body.en{line-height:1.7}
a{color:inherit}
:focus-visible{outline:3px solid var(--bengara);outline-offset:3px}
h1,h2,h3{font-family:var(--serif);font-weight:700;line-height:1.4;margin:0}
h2{font-size:1.5rem;margin-bottom:1.2rem;letter-spacing:.06em}
p{margin:0 0 1em}
section{padding:3.5rem 20px;max-width:760px;margin:0 auto}
.lead{color:var(--mute)}

.top{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:16px;padding:10px 20px;background:rgba(247,246,243,.94);backdrop-filter:blur(6px);border-bottom:1px solid var(--line)}
.brand{font-family:var(--serif);font-weight:700;text-decoration:none;white-space:nowrap}
.top nav{display:none;gap:18px;margin-left:auto;font-size:.9rem}
.top nav a{text-decoration:none;color:var(--mute)}
.top nav a:hover{color:var(--ink)}
.lang{margin-left:auto;display:flex;font-size:.85rem;border:1px solid var(--ink);border-radius:2px;overflow:hidden}.lang a,.lang span{padding:2px 12px;text-decoration:none;color:inherit}.lang span{background:var(--ink);color:var(--paper);font-weight:700}
@media(min-width:760px){.top nav{display:flex}.lang{margin-left:0}}

/* hero: 縦書きの一行を、この頁でただ一つの朱色にする */
.hero{max-width:none;padding:0;position:relative;min-height:88svh;display:grid;grid-template-columns:1fr;align-content:end;gap:1rem;
  background:linear-gradient(180deg,#e9e6df 0%,#d9d5cc 100%);overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 46px,rgba(38,40,43,.035) 46px 47px)}
.hero>*{position:relative}
.hero>.hero-v{position:absolute;height:max-content;right:max(24px,calc(50% - 360px));top:48px;writing-mode:vertical-rl;font-family:var(--serif);font-weight:700;color:var(--bengara);font-size:clamp(2rem,9vw,3.4rem);line-height:1.6;letter-spacing:.1em;white-space:nowrap}
.hero-v p{margin:0 0 0 .5em}
body.en .hero>.hero-v{writing-mode:horizontal-tb;text-orientation:mixed;display:flex;right:auto;left:20px;top:44px;flex-direction:column;font-size:clamp(1.9rem,8vw,3rem);letter-spacing:0;line-height:1.2}
body.en .hero-v p{margin:0}
.hero h1{padding:0 20px;max-width:760px;width:100%;margin:0 auto;font-size:1.1rem;font-weight:500;display:flex;flex-direction:column;gap:2px}
.hero h1 span{font-size:1.9rem;font-weight:700;letter-spacing:.08em}
.hero h1 small{font-size:.85rem;color:var(--mute);font-family:var(--sans);letter-spacing:.14em}
.hero-sub,.badges,.hero .btn{margin-left:auto;margin-right:auto;width:calc(100% - 40px);max-width:720px}
.hero-sub{margin-bottom:0}
.badges{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:8px;margin-top:0;margin-bottom:0}
.badges li{border:1px solid var(--pine);color:var(--pine);padding:2px 12px;font-size:.88rem;border-radius:2px;background:rgba(255,255,255,.5)}
.btn{display:inline-block;background:var(--ink);color:#fff;text-decoration:none;text-align:center;padding:14px 28px;font-weight:700;letter-spacing:.06em;border-radius:2px;margin-bottom:2.5rem;margin-top:.5rem}
.hero .btn{width:auto;max-width:none;align-self:start;justify-self:start;margin-left:max(20px,calc(50% - 360px))}
.btn:hover{background:var(--bengara-d)}

.story p{max-width:36em}
body.en .story p{max-width:38em}

.charms{max-width:900px}
.charms article{display:grid;gap:1rem;margin-bottom:2.5rem}
.charms h3{font-size:1.15rem;margin-bottom:.4rem}
.ph{aspect-ratio:3/2;background:repeating-linear-gradient(135deg,#e8e5de 0 14px,#dfdcd4 14px 28px);display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--mute);border:1px dashed #b9b6ad;text-align:center}
.ph span{font-size:.9rem}.ph small{font-size:.8rem;opacity:.8}
@media(min-width:760px){.charms article{grid-template-columns:1.2fr 1fr;align-items:center;gap:2rem}.charms article:nth-of-type(even) .ph{order:2}}

.notes{background:var(--paper);max-width:none}
.notes>*{max-width:720px;margin-left:auto;margin-right:auto}
.notes ul{padding-left:1.2em}
.notes li{margin-bottom:.6em}
.notes li::marker{color:var(--bengara)}

dl{margin:0}
dl>div{display:grid;gap:2px;padding:12px 0;border-bottom:1px solid var(--line)}
dt{font-weight:700;font-size:.92rem;color:var(--pine)}
dd{margin:0}
@media(min-width:620px){dl>div{grid-template-columns:9em 1fr;gap:16px}}

table{width:100%;border-collapse:collapse;margin-bottom:1rem}
th,td{text-align:left;padding:14px 8px;border-bottom:1px solid var(--line);vertical-align:top}
th{font-weight:500;white-space:nowrap}
.amt{font-family:var(--serif);font-weight:700;font-size:1.2rem;white-space:nowrap}
.note{color:var(--mute);font-size:.9rem}
@media(max-width:619px){tr{display:grid;grid-template-columns:1fr auto;border-bottom:1px solid var(--line);padding:10px 0}th,td{border:0;padding:2px 4px}.note{grid-column:1/-1}}
.small{font-size:.9rem;color:var(--mute);padding-left:1.2em}

iframe{width:100%;height:300px;border:0;margin-top:1.2rem;background:#e8e5de}
.reviews ul{padding-left:1.2em}
details{border-bottom:1px solid var(--line);padding:12px 0}
summary{cursor:pointer;font-weight:700}
details p{margin:.6em 0 0}

.reserve{text-align:left;padding-bottom:6rem}
.reserve ol{padding-left:1.4em}
.reserve .btn{margin-bottom:0}
footer{padding:2rem 20px 5rem;text-align:center;color:var(--mute);font-size:.88rem;border-top:1px solid var(--line)}

.sticky{position:fixed;left:12px;right:12px;bottom:12px;z-index:20;background:var(--bengara);color:#fff;text-align:center;padding:12px;font-weight:700;text-decoration:none;border-radius:2px;box-shadow:0 2px 10px rgba(0,0,0,.2)}
@media(min-width:760px){.sticky{left:auto;right:24px;width:auto;padding:12px 24px}}

.tcy{text-combine-upright:all;letter-spacing:0}

.charms img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;display:block;background:#e8e5de}
.gallery{max-width:900px;display:grid;grid-template-columns:1fr 1fr;gap:10px;padding-top:0}
.gallery img{width:100%;height:170px;object-fit:cover;display:block}
@media(min-width:760px){.gallery{grid-template-columns:repeat(3,1fr);gap:12px}.gallery img{height:240px}}

.story .exterior{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;display:block;margin-bottom:1.8rem}
