*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 24px; }
body { margin: 0; background: var(--ink); color: var(--light); font-family: var(--serif); font-size: var(--body-size); -webkit-font-smoothing: antialiased; }
body.menu-open { overflow: hidden; }
img { display: block; max-width: 100%; height: auto; }
figure, p, h1, h2, h3 { margin: 0; }
a { color: inherit; text-underline-offset: 5px; }
button { font: inherit; color: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 2px solid currentColor; outline-offset: 6px; }
main:focus { outline: none; }
.wrap { width: min(calc(100% - var(--gutter) * 2), var(--wrap)); margin-inline: auto; }
.paper { background-color: var(--paper); background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23000' opacity='.12' filter='url(%23n)' d='M0 0h180v180H0z'/%3E%3C/svg%3E"); color: var(--text); }
.prose { line-height: 1.95; letter-spacing: .06em; }
h2 { font-size: var(--heading-size); line-height: 1.5; font-weight: 600; letter-spacing: .11em; }
.brush-stroke { display: block; width: 132px; height: 9px; background: var(--accent); clip-path: polygon(0 46%,12% 28%,7% 23%,40% 10%,34% 1%,65% 12%,100% 35%,80% 44%,97% 60%,69% 63%,76% 80%,43% 77%,47% 96%,12% 94%,0 81%); transform: rotate(-3deg); }
.section-subtitle { display: block; margin-top: 7px; font-size: 15px; line-height: 1.5; letter-spacing: .12em; font-weight: 400; overflow-wrap: anywhere; }
.section-subtitle:empty { display: none; }
.site-header { position: relative; z-index: 20; height: var(--header-height); background: var(--header-ink); }
.header-inner { height: 100%; display: flex; align-items: center; justify-content: space-between; }
.brand { position: relative; align-self: flex-start; width: clamp(170px, 22vw, 260px); margin-top: 18px; z-index: 22; flex-shrink: 0; }
.brand, .footer-brand { position: relative; }
.brand img { opacity: 1; }
.footer-brand { text-decoration: none; }
.footer-brand img { display: block; width: 100%; height: auto; }
.nav-list { display: flex; gap: clamp(24px, 4vw, 64px); list-style: none; padding: 0; margin: 0; }
.nav-list a { display: flex; align-items: center; justify-content: center; min-height: 48px; min-width: 56px; text-decoration: none; letter-spacing: .16em; font-size: 17px; }
.primary-nav .nav-list a { position: relative; }
.primary-nav .nav-list a::after { content: ''; position: absolute; bottom: 0; left: -6px; right: -6px; height: 4px; background: var(--accent); clip-path: polygon(0 80%,50% 5%,100% 40%,78% 75%,30% 70%); }
.nav-list a:hover { color: #fff; }
.menu-toggle { display: none; }
.hero { position: relative; height: clamp(435px, 48vw, 660px); isolation: isolate; }
.hero__image { width: 100%; height: 100%; object-fit: cover; object-position: center 57%; position: absolute; inset: 0; z-index: -3; }
.hero__shade { position: absolute; inset: 0; background: linear-gradient(90deg,rgba(9,15,12,.72),rgba(9,15,12,.14) 72%),linear-gradient(0deg,rgba(9,15,12,.18),transparent 70%); z-index: -2; }
.hero__content { height: 100%; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; padding-top: 0; }
.hero h1 { font-weight: 600; font-size: clamp(28px,3.25vw,46px); line-height: 1.75; letter-spacing: .14em; text-shadow: 0 2px 12px #0008; }
.hero .brush-stroke { width: 166px; height: 12px; margin-top: 25px; }
.about { position: relative; padding-block: var(--section-space); }
.about::before, .about::after { content: ''; position: absolute; height: 12px; left: 0; right: 0; background: inherit; clip-path: polygon(0 47%,2% 22%,6% 46%,9% 5%,13% 35%,17% 26%,23% 59%,30% 19%,36% 48%,41% 27%,48% 49%,55% 20%,62% 54%,69% 25%,77% 51%,84% 18%,90% 55%,95% 30%,100% 52%,100% 100%,0 100%); }
.about::before { top: -11px; }
.about::after { bottom: -11px; transform: rotate(180deg); z-index: 2; }
.about__inner { display: grid; grid-template-columns: minmax(0, 1fr) 31%; gap: 48px; align-items: center; }
.about h2 { font-size: clamp(35px,4.3vw,54px); letter-spacing: .15em; margin-bottom: 14px; }
.sake-illustration { width: 100%; filter: grayscale(1) brightness(1.5) contrast(1.8); mix-blend-mode: multiply; }
.sake__inner { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 36px; align-items: stretch; }
.sake__copy { padding-block: var(--section-space); }
.sake .brush-stroke, .rock .brush-stroke, .access .brush-stroke { margin-block: 12px 22px; }
.sake__photo { margin-right: calc(-1 * var(--gutter)); overflow: hidden; }
.sake__photo img { height: 100%; width: 100%; object-fit: cover; object-position: 58% center; }
.rock { padding: 0; }
.rock__inner { display: grid; grid-template-columns: 36% minmax(0,1fr); gap: 38px; align-items: stretch; }
.rock__copy { padding-block: 36px; }
.rock__photo { position: relative; min-height: 260px; margin-left: min(calc(-1 * var(--gutter)), calc((var(--wrap) - 100vw) / 2)); overflow: hidden; }
.rock__photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 30% center; }
.rock__genres { margin-top: 18px; color: #813b32; font-size: 18px; line-height: 1.5; letter-spacing: .02em; }
.access { padding-block: 32px; }
.access__inner { display: grid; grid-template-columns: minmax(0,.85fr) minmax(0,1.5fr); gap: 48px; align-items: start; }
.access h2 { font-weight: 400; letter-spacing: .05em; }
.access .brush-stroke { margin-block: 12px 14px; width: 112px; }
.access__map { width: 100%; min-width: 0; }
.access__map iframe { display: block; width: 100%; height: clamp(280px, 26vw, 370px); border: 0; background: var(--paper); }
.access__map figcaption { margin-top: 12px; color: var(--muted); font-size: 14px; line-height: 1.8; }
.nav-list a { white-space: nowrap; }
@media (min-width: 768px) and (max-width: 1023px) { .primary-nav .nav-list { gap: 20px; } .primary-nav .nav-list a { font-size: 15px; letter-spacing: .08em; } }
.shop-details { font-size: 15px; line-height: 1.8; margin: 24px 0 0; }
.shop-details > div { display: grid; grid-template-columns: 5em minmax(0,1fr); gap: 10px; padding-block: 8px; border-top: 1px solid #ffffff30; }
.shop-details dt { color: var(--muted); }
.shop-details dd { margin: 0; overflow-wrap: anywhere; }
.shop-details .address-number { white-space: nowrap; overflow-wrap: normal; }
.shop-details a { display: inline-flex; min-height: 44px; align-items: center; }
.map-link { display: inline-flex; align-items: center; min-height: 48px; padding: 8px 0; margin-top: 18px; }
.site-footer { background: var(--footer-ink); border-top: 1px solid #ffffff26; padding: 22px 0 16px; }
.footer-inner { display: grid; grid-template-columns: 150px minmax(0,1fr) auto; grid-template-rows: auto auto; column-gap: 44px; align-items: center; }
.footer-brand { grid-row: 1/3; width: 135px; }
.footer-nav { justify-self: center; }
.social-links { display: flex; gap: 16px; }
.social-links a { width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; }
.social-links svg { width: 30px; fill: none; stroke: currentColor; stroke-width: 1.4; }
.copyright { grid-column: 2/4; text-align: center; font-size: 14px; letter-spacing: .035em; color: var(--muted); padding-top: 12px; }
.document { min-height: 65vh; padding-block: 64px; }
.document__inner { max-width: 900px; }
.document h1 { font-size: clamp(26px,4vw,42px); line-height: 1.6; margin-block: 30px; }
.document h2, .document h3 { margin-block: 32px 16px; }
.entry-content { line-height: 2; overflow-wrap: anywhere; }
.entry-content > * + * { margin-top: 1.3em; }
.entry-content img { height: auto; }
.breadcrumbs ol { display: flex; flex-wrap: wrap; gap: 14px; list-style: none; padding: 0; font-size: 14px; }
.breadcrumbs li + li::before { content: '/'; margin-right: 14px; }
.breadcrumbs a { display: inline-flex; min-height: 44px; align-items: center; }
.breadcrumbs span { display: inline-flex; min-height: 44px; align-items: center; }
.post-summary { border-bottom: 1px solid #282d2930; padding-bottom: 30px; }
.screen-reader-text, .skip-link { position: absolute; width: 1px; height: 1px; padding: 0; border: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.skip-link:focus { clip-path: none; top: 8px; left: 8px; width: auto; height: auto; padding: 16px; background: var(--paper); color: var(--text); z-index: 100; }
@media (min-width: 1361px) { .sake__photo { margin-right: min(calc((1360px - 100vw) / 2 - 100px), -100px); } }
@media (min-width: 768px) and (max-width: 1100px) {
  .sake__inner { grid-template-columns: minmax(0,1.5fr) minmax(0,1fr); gap: 24px; }
  .prose br { display: none; }
  .about__inner, .rock__inner, .access__inner { gap: 32px; }
  .footer-inner { column-gap: 24px; }
}
@media (max-width: 767px) {
  html { scroll-padding-top: 16px; }
  .site-header { height: auto; min-height: var(--header-height); }
  .header-inner { min-height: var(--header-height); flex-wrap: wrap; }
  .brand { width: 150px; margin-top: 12px; margin-bottom: -40px; }
  .hero { height: 500px; height: min(72svh, 570px); min-height: 450px; }
  .hero__image { object-position: 48% center; }
  .hero__shade { background: linear-gradient(0deg,rgba(8,14,11,.85),rgba(8,14,11,.06) 80%); }
  .hero__content { justify-content: flex-end; padding: 0 0 65px; }
  .hero h1 { font-size: clamp(24px, 6.2vw, 34px); line-height: 1.9; letter-spacing: .08em; }
  .hero .brush-stroke { margin-top: 20px; width: 140px; height: 10px; }
  .primary-nav { width: 100%; padding-top: 48px; padding-bottom: 10px; }
  .primary-nav .nav-list { justify-content: flex-end; gap: 24px; }
  html.js .menu-toggle { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; padding: 0; border: 0; background: transparent; cursor: pointer; z-index: 24; }
  .menu-toggle__lines { width: 26px; height: 16px; position: relative; }
  .menu-toggle__lines::before, .menu-toggle__lines::after { content: ''; width: 26px; height: 1px; background: currentColor; position: absolute; top: 7px; left: 0; transition: transform .24s ease; }
  .menu-toggle__lines::before { transform: translateY(-5px); }
  .menu-toggle__lines::after { transform: translateY(5px); }
  .menu-toggle[aria-expanded="true"] .menu-toggle__lines::before { transform: rotate(45deg); }
  .menu-toggle[aria-expanded="true"] .menu-toggle__lines::after { transform: rotate(-45deg); }
  html.js .primary-nav { position: absolute; top: 100%; left: 0; right: 0; width: 100%; background: var(--header-ink); padding: 46px var(--gutter) 56px; visibility: hidden; opacity: 0; transform: translateY(-8px); pointer-events: none; max-height: calc(100dvh - var(--header-height)); overflow-y: auto; transition: opacity .24s ease, transform .24s ease, visibility 0s .24s; }
  html.js .primary-nav .nav-list { flex-direction: column; gap: 20px; }
  html.js .primary-nav .nav-list a { min-height: 56px; font-size: 23px; }
  html.js .primary-nav.is-open { visibility: visible; opacity: 1; transform: translateY(0); pointer-events: auto; transition-delay: 0s; }
  .about__inner { display: block; }
  .about h2 { font-size: 34px; margin-bottom: 20px; letter-spacing: .1em; }
  .prose { line-height: 2; letter-spacing: .045em; }
  .prose br { display: none; }
  .sake-illustration { width: 142px; margin: 24px 0 -6px auto; }
  .sake__inner, .rock__inner, .access__inner { display: flex; flex-direction: column; gap: 26px; }
  .sake__copy { padding-block: 42px 0; }
  .sake__photo { margin: 0 calc(-1 * var(--gutter)); width: calc(100% + var(--gutter) * 2); }
  .sake__photo img { height: auto; aspect-ratio: 1.5; object-fit: cover; }
  .rock__inner { gap: 0; }
  .rock__copy { order: -1; }
  .rock__photo { width: calc(100% + var(--gutter) * 2); margin-inline: calc(-1 * var(--gutter)); min-height: 0; aspect-ratio: 1.5; }
  .rock__copy { padding-block: 36px 40px; }
  .rock__genres { font-size: 16px; }
  .rock__genres br { display: none; }
  .access { padding-block: 36px; }
  .access__copy, .access__map { width: 100%; }
  .access__map iframe { height: 300px; }
  .shop-details { font-size: 16px; }
  .footer-inner { display: flex; flex-direction: column; gap: 20px; }
  .footer-brand { width: 120px; }
  .footer-nav .nav-list { gap: 22px; }
  .footer-nav .nav-list a { font-size: 15px; }
  .copyright { font-size: 11px; padding-top: 0; }
  .site-footer { padding-block: 28px; }
  .document { padding-block: 32px 60px; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { animation: none !important; transition: none !important; } }

@media (min-width: 768px) and (max-width: 1023px) { .sake h2, .rock h2 { font-size: 26px; letter-spacing: .06em; } .sake__copy { padding-block: 42px; } .rock__genres { font-size: 17px; } }

body.admin-bar section[id] { scroll-margin-top: 46px; }


/* Three photographed scenes; only the photographs move. */
.hero__slides { position: absolute; inset: 0; z-index: -3; overflow: hidden; }
.hero__slide { position: absolute; inset: 0; opacity: 0; transition: opacity 1.8s ease; }
.hero__slide.is-active { opacity: 1; }
.hero__slide img { width: 100%; height: 100%; object-fit: cover; object-position: center 55%; }
.hero__slide--shelf img { object-position: center 56%; }
.hero__slide--alley img { object-position: center 54%; }
.hero__slide.is-active img, .hero__slide.is-leaving img { animation: furomuna-hero-drift 6.8s linear both; animation-play-state: paused; }
.hero.is-running .hero__slide img { animation-play-state: running; }
@keyframes furomuna-hero-drift { from { transform: scale(1); } to { transform: scale(1.08); } }
.hero__pause { position: absolute; width: 1px; height: 1px; padding: 0; border: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.hero__pause[hidden] { display: none; }
.hero__pause:focus { width: auto; height: auto; min-height: 44px; padding: 10px 18px; right: var(--gutter); bottom: 20px; clip-path: none; background: var(--ink); color: var(--light); border: 1px solid currentColor; z-index: 2; }
@media (max-width: 767px) {
  .hero__slide--shelf img { object-position: 35% center; }
  .hero__slide--sake img { object-position: 44% center; }
  .hero__slide--alley img { object-position: 51% center; }
}
@media (prefers-reduced-motion: reduce) {
  .hero__slide { transition: none; }
  .hero__slide img { animation: none !important; transform: none !important; }
}

/* Confirmed location and Instagram DM contact. */
.access__location { width: 100%; min-width: 0; }

/* One compact note for hours and booking, at every viewport width. */
.visit-info { margin-top: 22px; }
.visit-info__panel { width: fit-content; max-width: min(100%, 360px); border: 1px solid #282d2960; padding: 18px 20px; background: transparent; color: var(--text); }
.visit-info p { margin: 0; font-size: 16px; line-height: 1.8; letter-spacing: 0; }
.visit-info .visit-info__booking-title { margin-top: 8px; }
.menu-page-link { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; text-decoration: none; }
.menu-page-link { border-bottom: 1px solid var(--muted); margin-top: 20px; }

/* The shared footer uses one small Instagram contact link. */
.social-links .footer-instagram { width: auto; height: auto; min-height: 44px; gap: 10px; text-decoration: none; }
.footer-instagram span { font-size: 14px; line-height: 1.6; }
.footer-instagram svg { flex-shrink: 0; }
@media (min-width: 768px) and (max-width: 1100px) {
 .footer-inner { grid-template-columns: 150px minmax(0,1fr); row-gap: 10px; }
 .footer-inner .social-links { grid-column: 2; justify-self: center; }
 .footer-inner .copyright { grid-column: 1/-1; }
}

/* About: supplied brush lettering and paper edges, instead of a geometric zigzag. */
.about { isolation: isolate; z-index: 1; background: none; padding-block: 42px 36px; }
.about::before { inset: -48px 0 -16px; height: auto; background: #dedbcf url('../img/about-paper-texture.webp') repeat; clip-path: none; mask: url('../img/about-paper-mask.png') center / 100% 100% no-repeat, linear-gradient(to bottom, transparent 48px, #000 48px, #000 calc(100% - 32px), transparent calc(100% - 32px)) center / 100% 100% no-repeat; -webkit-mask: url('../img/about-paper-mask.png') center / 100% 100% no-repeat, linear-gradient(to bottom, transparent 48px, #000 48px, #000 calc(100% - 32px), transparent calc(100% - 32px)) center / 100% 100% no-repeat; z-index: -1; }
.about::after { display: none; }
.about h2 { display: flex; align-items: center; gap: 18px; margin-bottom: 18px; font-size: 34px; }
.about__title-prefix { font-size: clamp(23px,2.3vw,29px); letter-spacing: .14em; }
.about__wordmark { width: clamp(180px,21vw,250px); height: auto; }
.about .sake-illustration { max-width: 300px; justify-self: end; }
.about .prose { font-size: 17px; line-height: 1.85; }
@media (min-width: 600px) and (max-width: 767px) {
 .about__inner { display: grid; grid-template-columns: minmax(0,1fr) 29%; gap: 24px; }
 .about .sake-illustration { width: 100%; margin: 0; }
 .about .prose { font-size: 16px; }
}
@media (max-width: 599px) {
 .about { padding-block: 30px; }
 .about h2 { gap: 12px; margin-bottom: 18px; }
 .about__title-prefix { font-size: 22px; }
 .about__wordmark { width: 176px; }
 .about .prose { font-size: 16px; line-height: 1.9; }
 .about .sake-illustration { width: 132px; margin-top: 18px; }
}

.visit-info__text-link { text-decoration: underline; text-underline-offset: 3px; }

@media (max-width: 767px) { .about::before { mask-image: url('../img/about-paper-mask-mobile.png'), linear-gradient(to bottom, transparent 48px, #000 48px, #000 calc(100% - 32px), transparent calc(100% - 32px)); -webkit-mask-image: url('../img/about-paper-mask-mobile.png'), linear-gradient(to bottom, transparent 48px, #000 48px, #000 calc(100% - 32px), transparent calc(100% - 32px)); } }

/* Put the small opening-hours note beside the introduction. */
.about__inner { grid-template-columns: minmax(0,1fr) 360px; align-items: end; gap: clamp(32px,5vw,72px); }
.about__inner .visit-info { width: 100%; margin: 0; }
@media (max-width: 1023px) {
 .about__inner { display: grid; grid-template-columns: minmax(0,1fr); gap: 24px; }
}

/* Keep booking phrases together without forcing a line break at every width. */
.visit-info__phrase, .visit-info__text-link { display: inline-block; max-width: 100%; }
@media (max-width: 1023px) {
 .about__inner .visit-info__panel { margin-inline: auto; text-align: center; }
}

.sake__photo img.sake-fridge-photo { transform: scale(2); transform-origin: 50% 58%; object-position: 56% 46%; }

.opening-notice { position: relative; z-index: 2; background: #813c32; color: #fff9ef; padding: 9px 20px; text-align: center; }
.opening-notice p { font-size: 16px; line-height: 1.6; letter-spacing: .12em; overflow-wrap: anywhere; }
@media (max-width: 767px) { .opening-notice { padding-block: 8px; } .opening-notice p { font-size: 14px; letter-spacing: .08em; } }

.shop-details__hours-note { display: block; margin-top: 4px; font-size: .9em; }
.visit-info .visit-info__hours-note { font-size: 14px; }
/* Keep the paper edge behind the notice instead of protruding above it. */
.opening-notice + .about::before { top: -30px; }

.shop-address__postal { display: block; white-space: nowrap; }
.shop-address__part { display: inline-block; max-width: 100%; vertical-align: top; }
.shop-address__part { padding-right: .25em; }
.shop-address__part:last-child { padding-right: 0; }

.note-phrase { display: inline-block; white-space: nowrap; }
