/* Additional scenes follow the same paper, ink, and offset photography. */
.stay-menu, .room-collection { position: relative; z-index: 4; }
.stay-menu { display: flex; justify-content: center; flex-wrap: wrap; gap: 8px 36px; padding: 55px var(--gutter) 0; }
.stay-menu a { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; font-size: 14px; letter-spacing: .12em; border-bottom: 1px solid var(--line-dark); }
.room-collection { padding-top: clamp(70px, 9vw, 135px); }
.collection-heading { display: flex; justify-content: space-between; align-items: end; gap: 32px; margin: 0 var(--gutter) 35px; }
.collection-heading h3 { font-size: clamp(23px, 2.4vw, 34px); font-weight: 500; letter-spacing: .06em; line-height: 1.6; text-wrap: balance; }
.collection-heading p { font-size: 14px; line-height: 1.9; margin-top: 14px; max-width: 38em; }
.rail-controls { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }
.rail-controls button { display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid var(--line-dark); background: transparent; color: var(--sumi); font-size: 20px; cursor: pointer; }
.rail-controls button:disabled { color: #77746b; cursor: default; border-color: #aaa69b; }
.rail-controls span { font-family: var(--font-en); font-size: 15px; letter-spacing: .1em; min-width: 62px; text-align: center; }
.photo-rail { display: flex; gap: clamp(24px, 4vw, 65px); overflow-x: auto; scroll-snap-type: x proximity; scroll-padding-inline: var(--gutter); padding: 0 var(--gutter) 25px; scrollbar-width: thin; scrollbar-color: #8b877c transparent; overscroll-behavior-x: contain; }
.photo-rail figure { flex: 0 0 min(45vw, 650px); scroll-snap-align: start; }
.photo-rail img { width: 100%; aspect-ratio: 4 / 3; object-position: center; }
.photo-rail figure:nth-child(even) { padding-top: 55px; }
.photo-rail figcaption { font-size: 16px; letter-spacing: .04em; margin-top: 18px; line-height: 1.6; }
.photo-rail figcaption span { display: block; font-size: 12px; color: var(--sumi-soft); margin-top: 6px; letter-spacing: .09em; }
.yu__pics { min-width: 0; }
.bath-collection { margin: 32px 0 0 8%; }
.bath-details { display: flex; align-items: flex-start; gap: 24px; overflow-x: auto; padding-bottom: 18px; scroll-snap-type: x proximity; scrollbar-width: thin; scrollbar-color: #8b877c transparent; overscroll-behavior-x: contain; }
.bath-details figure { flex: 0 0 calc((100% - 24px) / 2); min-width: 0; scroll-snap-align: start; }
.bath-details figure:nth-child(even) { margin-top: 45px; }
.bath-details img { width: 100%; aspect-ratio: 4 / 3; }
.bath-details .bath-details__portrait { flex-basis: min(34%, 280px); }
.bath-details .bath-details__portrait img { aspect-ratio: 2 / 3; }
.bath-details figcaption { font-size: 13px; letter-spacing: .08em; margin-top: 12px; }
.bath-collection .rail-controls { justify-content: flex-end; margin: 18px var(--gutter) 0 0; }
.dining-collection { grid-column: 6 / -1; grid-row: 2; min-width: 0; margin: -6rem calc(var(--gutter) * -1) 0 0; position: relative; z-index: 2; }
.dining-details { display: flex; align-items: flex-start; gap: calc((100vw - var(--gutter) * 2) / 18); overflow-x: auto; padding-bottom: 18px; scroll-snap-type: x proximity; scrollbar-width: thin; scrollbar-color: #8b877c transparent; overscroll-behavior-x: contain; }
.dining-details figure { flex: 0 0 calc((100vw - var(--gutter) * 2) / 3); min-width: 0; scroll-snap-align: start; }
.dining-details figure:nth-child(even) { flex-basis: calc((100vw - var(--gutter) * 2) / 3 + var(--gutter)); margin-top: 12rem; }
.dining-details img { width: 100%; aspect-ratio: 4 / 3; }
.dining-details figcaption { font-size: 13px; letter-spacing: .08em; margin-top: 12px; }
.dining-collection .rail-controls { justify-content: flex-end; margin: 18px var(--gutter) 0 0; }
.house-scenes { padding-top: clamp(120px, 16vw, 230px); }
.house-heading { margin: 0 var(--gutter) 75px; display: flex; justify-content: space-between; align-items: end; gap: 45px; }
.house-heading > p { font-size: 15px; line-height: 2.1; max-width: 31em; }
.house-scene { display: grid; grid-template-columns: repeat(18, minmax(0, 1fr)); column-gap: 1.2vw; margin: 0 var(--gutter); align-items: start; }
.house-scene + .house-scene, .roof-scene + .house-scene { margin-top: clamp(100px, 13vw, 185px); }
.house-scene__main { grid-column: 1 / 11; margin-left: calc(var(--gutter) * -1); }
.house-scene__main img { width: 100%; aspect-ratio: 4 / 3; }
.house-scene__text { grid-column: 13 / 19; align-self: center; padding-block: 20px; }
.house-scene__index { font-family: var(--font-en); font-size: 13px; letter-spacing: .18em; color: var(--sumi-soft); margin-bottom: 25px; }
.house-scene__text h3 { font-size: clamp(26px, 3vw, 43px); font-weight: 500; line-height: 1.8; letter-spacing: .09em; text-wrap: balance; }
.house-scene__text > p:not(.house-scene__index) { font-size: 15px; line-height: 2.1; margin-top: 24px; }
.house-scene__detail { grid-column: 9 / 13; grid-row: 2; margin-top: -45px; position: relative; }
.house-scene__detail img { width: 100%; aspect-ratio: 4 / 5; }
.house-scene__detail--portrait img { aspect-ratio: 2 / 3; }
.house-scene__detail img[src*="/87ad369b36d809bf5801e9ef-"] { aspect-ratio: 2 / 3; }
.house-scene__detail img[src*="/c6d27d9152748d1da1f99d31-"] { object-position: 58% 62%; }
.house-scene--reverse .house-scene__main { grid-column: 9 / 19; grid-row: 1; margin: 0 calc(var(--gutter) * -1) 0 0; }
.house-scene--reverse .house-scene__text { grid-column: 1 / 7; grid-row: 1; }
.house-scene--reverse .house-scene__detail { grid-column: 6 / 10; }
.house-scene__extra { grid-column: 14 / 19; grid-row: 2; margin: 40px calc(var(--gutter) * -1) 0 0; }
.house-scene__extra img { width: 100%; aspect-ratio: 4 / 3; }
.house-scene__pair { grid-column: 7 / 19; grid-row: 2; display: grid; grid-template-columns: repeat(20, minmax(0, 1fr)); align-items: start; margin: -45px calc(var(--gutter) * -1) 0 0; isolation: isolate; }
.house-scene__pair .house-scene__detail { grid-column: 11 / 21; grid-row: 1; margin: 0; z-index: 2; }
.house-scene__pair .house-scene__extra { grid-column: 1 / 14; grid-row: 1; margin: 65% 0 0; position: relative; z-index: 1; }
.house-detail-caption { display: block; margin-top: 12px; font-size: 12px; line-height: 1.8; letter-spacing: .04em; color: var(--sumi-soft); }
.house-note { margin: 45px var(--gutter) 0; font-size: 13px; line-height: 1.9; color: var(--sumi-soft); text-align: right; }
.hospitality-strip { margin-top: clamp(100px, 13vw, 185px); }
.hospitality-strip .photo-rail figure { flex-basis: min(31vw, 445px); }
.hospitality-strip .photo-rail img { aspect-ratio: 4 / 3; }
.hospitality-strip .photo-rail .photo-rail__portrait { flex-basis: min(24vw, 310px); }
.hospitality-strip .photo-rail .photo-rail__portrait img { aspect-ratio: 2 / 3; }
.roof-scene { padding-top: clamp(130px, 18vw, 250px); }
.roof-heading { margin: 0 15vw 60px; display: flex; justify-content: space-between; align-items: center; gap: 40px; }
.roof-heading h2 { font-size: clamp(30px, 3.6vw, 50px); font-weight: 500; letter-spacing: .12em; line-height: 1.7; }
.roof-heading p { font-size: 14px; line-height: 2; max-width: 25em; }
.roof-main { position: relative; margin-right: 12vw; }
.roof-main img { width: 100%; aspect-ratio: 16 / 9; object-position: 50% 60%; }
.roof-main figcaption { position: absolute; right: 30px; bottom: 26px; padding: 9px 16px; color: #fff; background: rgba(25, 27, 20, .78); font-size: 13px; letter-spacing: .1em; }
.roof-details { display: grid; grid-template-columns: 1.1fr 1fr; gap: 7vw; align-items: start; width: 64%; margin: 50px 6vw 0 auto; }
.roof-details figure:last-child { margin-top: 85px; }
.roof-details img { width: 100%; aspect-ratio: 4 / 5; }
.roof-details img[src*="/d0c143cdaea829c739301c88-"] { object-position: 42% 65%; }
.roof-details figcaption { font-size: 14px; line-height: 1.8; margin-top: 15px; }
html[lang="en"] .stay-menu a { font-family: var(--font-en); font-size: 17px; letter-spacing: .025em; }
html[lang="en"] .house-scene__text h3, html[lang="en"] .roof-heading h2 { letter-spacing: .01em; line-height: 1.35; }
html[lang="en"] .collection-heading p, html[lang="en"] .house-heading > p, html[lang="en"] .house-scene__text > p:not(.house-scene__index), html[lang="en"] .roof-heading p { font-size: 19px; line-height: 1.65; }
html[lang="en"] .house-note, html[lang="en"] .house-detail-caption { font-size: 15px; }
html:not(.js) .rail-controls { display: none; }
@media (max-width: 819px) {
  .stay-menu { gap: 6px 22px; padding-top: 30px; }
  .collection-heading { display: block; margin-bottom: 24px; }
  .collection-heading p { font-size: 14px; }
  .rail-controls { justify-content: flex-end; margin-top: 22px; }
  .photo-rail { gap: 24px; }
  .photo-rail figure { flex-basis: 82vw; }
  .photo-rail figure:nth-child(even) { padding-top: 35px; }
  .photo-rail figcaption { font-size: 15px; }
  .bath-collection { margin-top: 25px; }
  .bath-details { gap: 16px; }
  .bath-details figure { flex-basis: 72%; }
  .bath-details figure:nth-child(even) { margin-top: 30px; }
  .bath-details .bath-details__portrait { flex-basis: 62%; }
  .dining-collection { margin-top: 0; }
  .dining-details { gap: 20px; }
  .dining-details figure, .dining-details figure:nth-child(even) { flex-basis: 76%; }
  .dining-details figure:nth-child(even) { margin-top: 2.4rem; }
  .house-heading { display: block; margin-bottom: 40px; }
  .house-heading > p { margin-top: 27px; }
  .house-scene, .house-scene--reverse { display: flex; flex-direction: column; }
  .house-scene__main { width: calc(100% + var(--gutter)); }
  .house-scene--reverse .house-scene__main { margin: 0 calc(var(--gutter) * -1) 0 0; align-self: flex-end; }
  .house-scene__text { align-self: stretch; padding: 32px 0 0; }
  .house-scene__index { margin-bottom: 16px; }
  .house-scene__text h3 { font-size: 29px; }
  .house-scene__text > p:not(.house-scene__index) { margin-top: 19px; }
  .house-scene__detail { width: 44%; margin: 32px 0 0 auto; }
  .house-scene--reverse .house-scene__detail { margin: 32px auto 0 0; }
  .house-scene__extra { width: 72%; margin: 30px 0 0; }
  .house-scene__pair { width: calc(100% + var(--gutter) * 2); margin: 32px calc(var(--gutter) * -1) 0; }
  .house-scene__pair .house-scene__detail, .house-scene__pair .house-scene__extra { width: auto; }
  .house-note { text-align: left; }
  .hospitality-strip .photo-rail figure { flex-basis: 64vw; }
  .hospitality-strip .photo-rail .photo-rail__portrait { flex-basis: 44vw; }
  .roof-heading { display: block; margin: 0 var(--gutter) 35px; }
  .roof-heading h2 { font-size: 33px; }
  .roof-heading p { margin-top: 24px; }
  .roof-main { margin-right: 6vw; }
  .roof-main img { aspect-ratio: 4 / 5; }
  .roof-main figcaption { right: 14px; bottom: 16px; font-size: 12px; }
  .roof-details { width: 100%; margin: 32px 0 0; grid-template-columns: repeat(20, minmax(0, 1fr)); gap: 0; }
  .roof-details figure:first-child { grid-column: 1 / 14; grid-row: 1; }
  .roof-details figure:last-child { grid-column: 8 / 21; grid-row: 2; }
  .roof-details figure:last-child { margin-top: 45px; }
  .roof-details figcaption { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) { .photo-rail { scroll-behavior: auto; } }
