/* Faithful static export fixes: no Studio runtime. Preserve all original appearance/layout CSS. */
html {scroll-behavior:smooth}
body {margin:0}
/* Studio's appearance-on-scroll behaviors are JS-driven: render all contents by default. */
.appear, .appear * {opacity:1!important;visibility:visible!important}
.migration-contact-note {font-size:12px;line-height:1.8;color:#8b532b;background:#fff8ee;padding:12px 15px;border:1px solid #f3e2c7;margin:8px 0 22px;width:100%;box-sizing:border-box}
.migration-upload-note {display:block;font-size:11px;color:#786f67;line-height:1.5;margin-top:8px}
#migration-contact-action {cursor:pointer}
/* Native mobile nav outside Studio's detached dynamic popup. */
.migration-mobile-menu {position:fixed;inset:0;z-index:9999;background:rgba(0,0,0,.6);display:none;justify-content:flex-end}
.migration-mobile-menu.open {display:flex}
.migration-mobile-drawer {background:#e8e8e8;width:min(85vw,360px);padding:80px 32px 32px;display:flex;flex-direction:column;gap:24px;box-shadow:-10px 0 30px #0003}
.migration-mobile-drawer a {font-size:17px;color:#222;text-decoration:none;letter-spacing:.04em}
.migration-mobile-drawer button {position:absolute;top:20px;right:25px;background:transparent;border:0;font-size:32px;cursor:pointer}

/* Contact form: usable independent of STUDIO, sent by Netlify Forms. */
.bot-trap{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.migration-form-security-note{font-size:12px;line-height:1.7;color:#635e59;margin:12px 0 20px}
.migration-contact-fallback{text-align:center;font-size:13px;color:#555;margin-top:28px}
.migration-contact-fallback a{color:#334b59;text-decoration:underline}

/* Inline FAQ: no iframe blank spot; same content/accordion as the original embed. */
#faq{display:block;max-width:960px;margin:0 auto;padding:72px 24px 88px;background:white}
#faq details{display:block}
#faq summary{display:list-item}
@media(max-width:600px){#faq{padding:55px 22px 70px}#faq .mr-faq-title{font-size:28px}}
/* Restore the formerly STUDIO-only moving photo strip immediately above Access. */
.mr-slide-gallery{width:100%;height:clamp(210px,24vw,390px);overflow:hidden;background:#e9eaea;position:relative}
.mr-slide-track{display:flex;align-items:stretch;width:max-content;height:100%;animation:mr-marquee-move 32s linear infinite;will-change:transform}
/* Keep moving even while pointer hovers above the photo track. */
.mr-slide-gallery:hover .mr-slide-track{animation-play-state:running}
.mr-slide-item{width:clamp(255px,30vw,430px);height:100%;flex:none;overflow:hidden}
.mr-slide-item img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.mr-slide-brand{background:#06788a;color:white;display:flex;flex-direction:column;justify-content:center;gap:22px;padding:38px;box-sizing:border-box}
.mr-slide-brand span{font:600 clamp(22px,2.5vw,38px)/1.24 Arial,sans-serif;letter-spacing:-.025em}
.mr-slide-brand small{font-size:12px;letter-spacing:.16em}
@keyframes mr-marquee-move{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.mr-slide-track{animation:none}}
/* Read privacy without leaving contact page; keyboard scrollable. */
.mr-privacy-details{width:100%;box-sizing:border-box;margin:10px 0 30px;color:#273232;font-family:inherit}
.mr-privacy-details>summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:12px;align-items:center;padding:16px 20px;border:1px solid #bfc8c8;font-size:14px;background:#f7f8f8;color:#173c3c}
.mr-privacy-details>summary::-webkit-details-marker{display:none}
.mr-privacy-details>summary::after{content:'＋';font-size:22px;line-height:1}
.mr-privacy-details[open]>summary::after{content:'−'}
.mr-privacy-scroll{max-height:340px;overflow:auto;overscroll-behavior:contain;border:1px solid #bfc8c8;border-top:0;background:white;padding:22px 24px;font-size:13px;line-height:1.9;text-align:left;white-space:normal}
.mr-privacy-scroll p{margin:0 0 9px!important;font-size:13px!important;line-height:1.9!important}
.mr-privacy-scroll h3{font-weight:600;font-size:17px;margin:0 0 18px}
.mr-privacy-scroll h4{font-weight:600;font-size:14px;margin:20px 0 10px}
.mr-privacy-scroll:focus-visible,.mr-privacy-details>summary:focus-visible{outline:2px solid #178a8c;outline-offset:2px}
@media(max-width:600px){.mr-privacy-scroll{padding:16px;max-height:290px}}

/* v4: user-provided, complete banner artwork, no text overlay or cropping. */
.mr-slide-brand{padding:0;background:#00899a;gap:0}
.mr-slide-brand img{display:block;width:100%;height:100%;object-fit:contain;object-position:center;background:#00899a}

/* v5 seam fix: overlapping tile edges prevent intermittent 1px hairlines during
   fractional GPU transforms; duplicated halves remain perfectly symmetric. */
.mr-slide-track{
  gap:0!important;
  column-gap:0!important;
  font-size:0;
  transform:translate3d(0,0,0);
  backface-visibility:hidden;
}
.mr-slide-item{
  position:relative;
  box-sizing:border-box;
  margin-left:-2px;
  padding:0;
  border:0;
  outline:0;
  box-shadow:none;
}
.mr-slide-item img{
  border:0;
  vertical-align:top;
  max-width:none;
}
@keyframes mr-marquee-move{
  from{transform:translate3d(0,0,0)}
  to{transform:translate3d(-50%,0,0)}
}

/* v6: Room links should land at the start of the long section, not its sticky header. */
#rooms{scroll-margin-top:88px}
.mr-slide-gallery .mr-slide-track,
.mr-slide-gallery:hover .mr-slide-track{animation-play-state:running!important}

/* v7: make the hero/night3 image area more substantial, closer to the previous LP. */
.sd[data-s-a74b637c-b611-4130-94cf-684ac96ca1e1]{height:112vh;min-height:820px}
@media screen and (max-width:840px){.sd[data-s-a74b637c-b611-4130-94cf-684ac96ca1e1]{height:102vh;min-height:720px}}
@media screen and (max-width:540px){.sd[data-s-a74b637c-b611-4130-94cf-684ac96ca1e1]{height:100svh;min-height:700px}}

/* v7: in-page promotional movie. The local 720p file is for the current Netlify package;
   it can later be replaced with a YouTube embed without changing this section's layout. */
.mr-movie-section{width:100%;box-sizing:border-box;background:#e9eaea;padding:110px 24px 96px}
.mr-movie-inner{width:min(1160px,100%);margin:0 auto}
.mr-movie-heading{text-align:center;margin:0 auto 38px;color:#1e1e1e}
.mr-movie-kicker{font-family:var(--s-font-5689f745),sans-serif;font-size:11px;letter-spacing:.22em;margin:0 0 12px;color:#777}
.mr-movie-heading h2{font-family:var(--s-font-8095d04c),serif;font-size:clamp(28px,3vw,42px);font-weight:400;letter-spacing:.04em;line-height:1.4;margin:0 0 14px}
.mr-movie-heading>p:last-child{font-family:var(--s-font-7cac6676),sans-serif;font-size:14px;line-height:2;letter-spacing:.04em;margin:0;color:#555}
.mr-movie-frame{width:100%;aspect-ratio:16/9;background:#111;overflow:hidden}
.mr-movie-frame video{display:block;width:100%;height:100%;object-fit:cover;background:#111}
@media(max-width:600px){.mr-movie-section{padding:72px 16px 64px}.mr-movie-heading{margin-bottom:24px}.mr-movie-heading>p:last-child{font-size:13px;line-height:1.8}}

/* v7: privacy policy must never hide or clip the submit button. */
form[name="mr-contact"]{height:auto!important;max-height:none!important;overflow:visible!important;align-content:flex-start!important}
form[name="mr-contact"] .mr-privacy-details{flex:0 0 100%;height:auto!important;max-height:none!important;overflow:visible!important;margin-bottom:16px}
form[name="mr-contact"] .mr-privacy-scroll{max-height:360px;overflow-y:auto!important;overflow-x:hidden!important}
form[name="mr-contact"] button[type="submit"]{position:relative!important;z-index:2;display:flex!important;visibility:visible!important;opacity:1!important;flex:0 0 auto;margin-top:8px}
@media(max-width:600px){form[name="mr-contact"] .mr-privacy-scroll{max-height:320px}}

/* v7: Booking.com reservation option beneath/alongside Airbnb. */
.mr-booking-reserve{display:flex;flex:1;align-items:flex-start;justify-content:center;max-width:100%}
.mr-booking-link{display:flex;align-items:center;justify-content:center;gap:16px;border:1px solid var(--s-color-549116a7);color:var(--s-color-549116a7)!important;text-decoration:none;padding:24px 20px;width:80%;box-sizing:border-box;font-family:var(--s-font-7cac6676),sans-serif}
.mr-booking-link p{margin:0;font-size:16px;letter-spacing:.05em;line-height:1;color:var(--s-color-549116a7)!important}
.mr-booking-link i{font-size:20px;color:var(--s-color-549116a7)!important}
.mr-booking-link:hover{background:var(--s-color-4fb46f3d)}
@media(max-width:840px){.mr-booking-reserve{flex:none;width:100%}.mr-booking-link{width:80%}}
@media(max-width:540px){.mr-booking-link{width:100%}}

/* Amenities photo grid - v7 */
.mr-amenities-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;width:min(100%,760px);margin:0 auto;align-self:center}
.mr-amenities-card{margin:0;aspect-ratio:1/1;background:#f4f3f0;overflow:hidden;display:flex;align-items:center;justify-content:center}
.mr-amenities-card img{display:block;width:100%;height:100%;object-fit:contain}
@media(max-width:840px){.mr-amenities-gallery{width:100%;gap:12px}}
@media(max-width:540px){.mr-amenities-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.mr-amenities-card{aspect-ratio:1/1}}


/* v7: premium Imabari towel feature, placed after Amenities. */
.mr-towel-section{width:100%;box-sizing:border-box;background:#f6f6f6;padding:96px 24px 104px}
.mr-towel-inner{width:min(1100px,100%);margin:0 auto}
.mr-towel-heading{text-align:center;max-width:720px;margin:0 auto 42px;color:#1e1e1e}
.mr-towel-kicker{font-family:var(--s-font-5689f745),sans-serif;font-size:10px;letter-spacing:.24em;color:#888;margin:0 0 12px}
.mr-towel-heading h2{font-family:var(--s-font-8095d04c),serif;font-size:clamp(28px,3vw,40px);font-weight:400;letter-spacing:.04em;line-height:1.35;margin:0 0 10px}
.mr-towel-ja{font-family:var(--s-font-7cac6676),sans-serif;font-size:16px;letter-spacing:.08em;margin:0 0 20px}
.mr-towel-copy{font-family:var(--s-font-7cac6676),sans-serif;font-size:14px;line-height:2;letter-spacing:.035em;color:#555;margin:0}
.mr-towel-gallery{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:stretch}
.mr-towel-gallery figure{margin:0;background:#ecebea;overflow:hidden;aspect-ratio:4/3}
.mr-towel-gallery img{display:block;width:100%;height:100%;object-fit:cover}
.mr-towel-gallery figure:first-child img{object-position:center 48%}
.mr-towel-gallery figure:last-child img{object-position:center 50%}
@media(max-width:700px){.mr-towel-section{padding:72px 16px 76px}.mr-towel-heading{margin-bottom:28px}.mr-towel-copy{font-size:13px;line-height:1.85}.mr-towel-gallery{grid-template-columns:1fr;gap:12px}.mr-towel-gallery figure{aspect-ratio:4/3}}

/* v7 refinement: tighten Rooms -> Movie spacing and enlarge hero while preserving more of night3. */
#rooms{margin-bottom:36px!important}
.mr-movie-section{padding-top:52px!important}
.sd[data-s-a74b637c-b611-4130-94cf-684ac96ca1e1]{height:126vh!important;min-height:900px!important}
.sd[data-s-4fcf5711-c3ab-473f-86ca-9b80aac3cad3]:before{background-position:center center!important;background-size:cover!important}
@media screen and (max-width:840px){
  #rooms{margin-bottom:28px!important}
  .mr-movie-section{padding-top:44px!important}
  .sd[data-s-a74b637c-b611-4130-94cf-684ac96ca1e1]{height:112vh!important;min-height:780px!important}
}
@media screen and (max-width:540px){
  #rooms{margin-bottom:20px!important}
  .mr-movie-section{padding-top:38px!important}
  .sd[data-s-a74b637c-b611-4130-94cf-684ac96ca1e1]{height:106svh!important;min-height:720px!important}
}

/* v8 hotfix: Booking.com reservation button readability on dark background. */
.mr-booking-link { color: #f7f7f7 !important; border-color: rgba(247,247,247,.56) !important; }
.mr-booking-link p, .mr-booking-link i { color: #f7f7f7 !important; }
.mr-booking-link:hover { background: rgba(255,255,255,.12) !important; }

/* Booking.com button final override - identical legibility to other reservation buttons. */
#reserve .mr-booking-reserve .mr-booking-link,
#reserve .mr-booking-reserve .mr-booking-link:link,
#reserve .mr-booking-reserve .mr-booking-link:visited { color: #f7f7f7 !important; border-color: rgba(247,247,247,.56) !important; opacity:1 !important; }
#reserve .mr-booking-reserve .mr-booking-link p,
#reserve .mr-booking-reserve .mr-booking-link i { color:#f7f7f7 !important; -webkit-text-fill-color:#f7f7f7 !important; opacity:1 !important; }
#reserve .mr-booking-reserve .mr-booking-link:hover { background:rgba(255,255,255,.12) !important; }
