/* =============================================
   Ginza Jisaku - blue-grey dusk with stone and washi grain
   ============================================= */
:root {
  --latin-serif: "Cormorant Garamond", "Zen Old Mincho", serif;
  --global-mincho-font: "Zen Old Mincho", "A1明朝", "A1 Mincho", "Hiragino Mincho ProN", "Yu Mincho", "YuMincho", "Noto Serif JP", serif;

  --bg-base: #12161c;
  --ink: #e9e4d8;
  --ink-soft: rgba(233, 228, 216, 0.86);
  --muted: rgba(233, 228, 216, 0.5);
  --rule: rgba(199, 171, 109, 0.26);
  --accent: #c7ab6d;

  --gutter: 10vw;
  --header-h: 76px;

  --gold: #c4a265;
  --tex-stone: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='280' height='280'%3E%3Cfilter id='s'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='280' height='280' filter='url(%23s)' opacity='0.55'/%3E%3C/svg%3E");
  --tex-washi: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='420' height='420'%3E%3Cfilter id='w'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.03 1.1' numOctaves='2' seed='11' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='420' height='420' filter='url(%23w)' opacity='0.3'/%3E%3C/svg%3E");
  --tex-mottle: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='900' height='900'%3E%3Cfilter id='m'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.02' numOctaves='4' seed='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='900' height='900' filter='url(%23m)' opacity='0.12'/%3E%3C/svg%3E");

}

html, body, body * {
  font-family: var(--global-mincho-font) !important;
}
.font1, .font2, .font3, .font4 {
  font-family: var(--global-mincho-font) !important;
}
/* Latin labels get a real Latin serif instead of the romans inside the kana font */
.ly_link, .ly_link *,
.ly_news_ttl,
.ly_info_list dt,
.ly_sns, .ly_sns *,
.ly_cp {
  font-family: var(--latin-serif) !important;
}
/* other languages (WordPress /en/ /zh/ /ko/). Zen Old Mincho has no simplified Chinese or Hangul,
   so those pages lead with Noto Serif SC / KR (loaded only on those pages, inc/assets.php). */
html:lang(zh) {
  --global-mincho-font: "Noto Serif SC", "Zen Old Mincho", serif;
}
html:lang(ko) {
  --global-mincho-font: "Noto Serif KR", "Zen Old Mincho", serif;
}
/* Korean wraps between words, never inside one */
html:lang(ko) body {
  word-break: keep-all;
}
/* English: the vertical headings turn horizontal (Latin set sideways is hard to read and the
   longer titles ran off the screen), and the generous tracking meant for kana is pulled in.
   Chinese and Korean keep the vertical headings. */
html:lang(en) .ly_feature_body {
  display: block;
}
html:lang(en) .ly_feature_body::before {
  display: block;
  margin-bottom: 1.8vw;
}
html:lang(en) .ly_feature_body > .ly_feature_ttl {
  writing-mode: horizontal-tb;
  letter-spacing: 0.04em;
  line-height: 1.35;
}
html:lang(en) .ly_feature_body > .ly_link {
  display: inline-flex;
  margin-top: 2.6vw;
}
html:lang(en) .ly_heritage_head {
  flex-direction: column;
  gap: 2.4vw;
}
html:lang(en) .ly_heritage_ttl {
  writing-mode: horizontal-tb;
  letter-spacing: 0.06em;
}
html:lang(en) .ly_tanzaku {
  flex-direction: column;
  gap: 0.6em;
  padding-right: 0;
}
html:lang(en) .ly_tanzaku li {
  writing-mode: horizontal-tb;
  max-height: none;
  padding: 0.2em 0 0.2em 1.2em;
  border-right: 0;
  border-left: 1px solid var(--rule);
  letter-spacing: 0.03em;
}
html:lang(en) .font3 {
  letter-spacing: 0.03em !important;
}
html:lang(en) :is(.ly_h2, .ly_phead_ja, .ly_phead3_ttl, .ly_concept_ttl, .ly_case_ttl, .ly_points_ttl, .ly_hero_copy, .ly_notfound_ttl).font3 {
  letter-spacing: 0.06em !important;
}

/* Japanese copy breaks at phrase boundaries instead of mid-word (Chrome/Edge;
   others keep the default), and avoids a lone character on the last line */
.ly_feature_txt,
.ly_uses dd,
.ly_concept_txt,
.ly_info_list dd,
.ly_reserve_ja {
  word-break: auto-phrase;
  text-wrap: pretty;
}

/* Headings never break inside a word or leave one character alone on a line.
   auto-phrase breaks at phrase boundaries (Chrome/Edge); balance evens out the
   lines everywhere else. Where a heading must hold together in every browser,
   its phrases are wrapped in .u_ph, which can only move to the next line whole. */
.ly_phead_ja,
.ly_phead3_ttl,
.ly_h2,
.ly_case_ttl,
.ly_points_ttl,
.ly_concept_ttl,
.ly_notfound_ttl,
.ly_notfound_txt,
.ly_notice_ttl,
.ly_form_label,
.ly_postnav_ttl,
.ly_menu_name,
.ly_uses dt,
.ly_article h2,
.ly_article h3,
.ly_article h4,
.block_mainvisual .copy .copy-lead,
.block_mainvisual .copy .copy-sub {
  word-break: auto-phrase;
  text-wrap: balance;
}
.ly_news_txt {
  word-break: auto-phrase;
  text-wrap: pretty;
}
.u_ph {
  display: inline-block;
  /* an inline-block inherits the heading's centring indent; it must not repeat it */
  text-indent: 0;
}

html,
body {
  overflow-x: hidden;
}

body.top {
  background-color: var(--bg-base);
  background-image:
    var(--tex-stone),
    var(--tex-washi),
    var(--tex-mottle),
    linear-gradient(
      180deg,
      #12161c 0%,
      #191f29 8%,
      #0e1219 18%,
      #1b222d 28%,
      #0c1015 40%,
      #172029 52%,
      #0d1117 62%,
      #1a212b 72%,
      #0b0e13 84%,
      #151b23 92%,
      #0c1015 100%
    );
  background-size: 280px 280px, 420px 420px, 900px 900px, auto;
  background-repeat: repeat, repeat, repeat, no-repeat;
  background-blend-mode: overlay, soft-light, soft-light, normal;
  background-attachment: fixed;
  color: var(--ink);
}

/* common.css paints links #2c1b1e at (0,1,1) - :where() neutralises that
   without out-ranking the component rules further down */
:where(.ly_concept, .ly_feature, .ly_info, .ly_news_sec, .ly_reserve, .ly_footer, .ly_sec2, .ly_phead3, .ly_article, .ly_postnav, .ly_notfound, .ly_heritage) a:link,
:where(.ly_concept, .ly_feature, .ly_info, .ly_news_sec, .ly_reserve, .ly_footer, .ly_sec2, .ly_phead3, .ly_article, .ly_postnav, .ly_notfound, .ly_heritage) a:visited,
:where(.ly_concept, .ly_feature, .ly_info, .ly_news_sec, .ly_reserve, .ly_footer, .ly_sec2, .ly_phead3, .ly_article, .ly_postnav, .ly_notfound, .ly_heritage) a:active {
  color: inherit;
}

/* =============================================
   Header - no background of its own
   ============================================= */
/* a translucent bar that lets the photograph show through (as on the reference
   site), turning solid with a hairline once the page has scrolled */
.block_header {
  position: fixed !important;
  top: 0 !important;
  left: 0;
  right: 0 !important;
  height: var(--header-h);
  display: flex !important;
  align-items: center;
  background: rgba(8, 10, 14, 0.38) !important;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  box-shadow: 0 1px 0 rgba(199, 171, 109, 0);
  transition: background-color 0.6s, box-shadow 0.6s;
  z-index: 1005;
}
.block_header.is-scrolled {
  background: rgba(18, 22, 28, 0.94) !important;
  box-shadow: 0 1px 0 var(--rule);
}
.block_header .inner {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 4.6vw;
}
.block_header .header_logo {
  display: block;
  flex: none;
  width: 112px;
  line-height: 0;
}
.block_header .header_logo img {
  width: 100%;
  height: auto;
  /* the asset is white, which is already right on the ink ground */
  filter: none;
  transition: filter 0.5s;
}
.block_header ul.menu {
  align-items: center;
  font-size: 0.9vw !important;
  font-weight: 400;
  letter-spacing: 0.14em;
}
.block_header ul.menu li {
  margin: 0 0 0 2.2vw;
}
.block_header ul.menu li a {
  color: var(--ink) !important;
  transition: opacity 0.4s;
}
.block_header ul.menu li a:hover {
  opacity: 0.55;
}
.block_header ul.menu li a::after {
  background: var(--accent);
}

/* the page you are on, in the header, the drawer and the footer */
.block_header ul.menu li a[aria-current="page"] {
  color: var(--accent) !important;
}
.block_header ul.menu li a[aria-current="page"]::after {
  background: var(--accent);
  transform: scale(1, 1);
}
.block_sp_menu .main_menu li a[aria-current="page"] {
  color: var(--accent) !important;
}
.ly_fnav a[aria-current="page"] {
  color: var(--accent);
}

/* over photography the logo and menu flip to white */
.block_header.is-over-media .header_logo img {
  filter: drop-shadow(0 1px 10px rgba(0, 0, 0, 0.55));
}
.block_header.is-over-media ul.menu li a {
  color: #fff !important;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.65), 0 2px 18px rgba(0, 0, 0, 0.7);
}
.block_header.is-over-media ul.menu li a::after {
  background: #fff;
}
/* the current page keeps its gold mark even over photography, where the menu
   otherwise flips to white (same specificity, so this has to come after) */
.block_header.is-over-media ul.menu li a[aria-current="page"] {
  color: var(--accent) !important;
}
.block_header.is-over-media ul.menu li a[aria-current="page"]::after {
  background: var(--accent);
}

/* reservation: the one call to action in the header. A hairline box in gold that
   fills from the left on hover; the template's underline becomes its leading rule.
   Comes after the over-media rules so it keeps its gold over photography too. */
.block_header ul.menu li.menu_reserve {
  margin-left: 2.8vw;
}
.block_header ul.menu li.menu_reserve a {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 1em;
  padding: 0.95em 1.5em 0.95em 1.8em;
  border: 1px solid var(--accent);
  background: rgba(18, 22, 28, 0.38);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  color: var(--accent) !important;
  letter-spacing: 0.24em;
  line-height: 1;
  text-shadow: none;
  overflow: hidden;
  isolation: isolate;
  transition: color 0.45s;
}
.block_header ul.menu li.menu_reserve a::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--accent);
  transform: scaleX(0);
  transform-origin: right center;
  transition: transform 0.5s cubic-bezier(0.65, 0, 0.35, 1);
}
.block_header ul.menu li.menu_reserve a::after {
  position: static;
  flex: none;
  width: 1.6em;
  height: 1px;
  background: currentColor;
  transform: none;
  transition: width 0.45s cubic-bezier(0.65, 0, 0.35, 1);
}
.block_header ul.menu li.menu_reserve a:hover,
.block_header ul.menu li.menu_reserve a:focus-visible {
  opacity: 1;
  color: var(--bg-base) !important;
}
.block_header ul.menu li.menu_reserve a:hover::before,
.block_header ul.menu li.menu_reserve a:focus-visible::before {
  transform: scaleX(1);
  transform-origin: left center;
}
.block_header ul.menu li.menu_reserve a:hover::after,
.block_header ul.menu li.menu_reserve a:focus-visible::after {
  width: 2.4em;
  transform: none;
}
@media (prefers-reduced-motion: reduce) {
  .block_header ul.menu li.menu_reserve a,
  .block_header ul.menu li.menu_reserve a::before,
  .block_header ul.menu li.menu_reserve a::after {
    transition: none;
  }
}

@media (max-width: 1023px) {
  .block_header {
    --header-h: 64px;
    height: 64px;
  }
  .block_header .inner {
    justify-content: flex-start;
    padding: 0 24px;
  }
  .block_header .header_logo {
    width: 80px;
  }
  .block_header ul.menu {
    display: none;
  }
}

/* left rail from the template - removed */
.block_navi .util_bar {
  display: none !important;
}
@media (min-width: 1024px) {
  .block_navi a {
    display: none !important;
  }
}
/* the fixed header (z-index 1005) spans the full width on phones and would
   otherwise sit on top of the hamburger and swallow its taps */
.block_navi a {
  z-index: 1010;
}
.block_navi .wrap span,
.block_navi .wrap_close span {
  background-color: #fff !important;
}

/* SP drawer */
.block_sp_menu {
  background-color: #1b1d22 !important;
}
.block_sp_menu .menu_child {
  color: var(--ink);
}
.block_sp_menu .main_menu li a {
  color: var(--ink) !important;
}
.block_sp_menu .sub_menu li .tit {
  color: var(--accent) !important;
}
.block_sp_menu .menu_child .sub_menu li.reserve .txt {
  width: auto;
}
.block_sp_menu .menu_child .sub_menu li.reserve .txt a {
  white-space: nowrap;
}
.block_sp_menu .cp {
  color: var(--muted) !important;
}
/* the template's external-link icon asset is not in this repo */
.block_sp_menu .menu_child .sub_menu li.link .txt:after {
  display: none;
}

/* TOP Topics: hidden while there is no news in the page's language (inc/news.php) */
.ly_news_sec:has(.ly_news[data-empty]) {
  display: none;
}

/* language switcher: a quiet globe + code in the header row (PC), a plain list in the drawer (SP).
   Built on <details> so it opens without script; script.js closes it on an outside click or Esc. */
.block_header ul.menu li.menu_lang {
  position: relative;
  margin-left: 2.8vw;
}
.ly_lang summary {
  display: inline-flex;
  align-items: center;
  gap: 0.55em;
  list-style: none;
  color: var(--ink);
  letter-spacing: 0.14em;
  cursor: pointer;
  transition: opacity 0.4s;
}
.ly_lang summary::-webkit-details-marker {
  display: none;
}
.ly_lang summary::after {
  content: "";
  width: 0.42em;
  height: 0.42em;
  margin: -0.25em 0 0 0.1em;
  border: solid currentColor;
  border-width: 0 1px 1px 0;
  transform: rotate(45deg);
  transition: transform 0.3s;
}
.ly_lang[open] summary::after {
  margin-top: 0.2em;
  transform: rotate(-135deg);
}
.ly_lang summary:hover,
.ly_lang summary:focus-visible {
  outline: none;
  opacity: 0.55;
}
.ly_lang svg {
  flex: none;
  width: 1.25em;
  height: 1.25em;
}
.block_header.is-over-media .ly_lang summary {
  color: #fff;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.65), 0 2px 18px rgba(0, 0, 0, 0.7);
}
.ly_lang_list {
  position: absolute;
  top: calc(100% + 1.4em);
  right: -1.2em;
  min-width: 10em;
  padding: 0.9em 0;
  border: 1px solid var(--rule);
  background: rgba(18, 22, 28, 0.96);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}
.block_header ul.menu .ly_lang_list li {
  margin: 0;
}
.block_header ul.menu .ly_lang_list li a {
  display: block;
  padding: 0.65em 1.6em;
  letter-spacing: 0.08em;
  white-space: nowrap;
  text-shadow: none;
  color: var(--ink-soft) !important;
}
.block_header ul.menu .ly_lang_list li a::after {
  display: none;
}
.block_header ul.menu .ly_lang_list li a[aria-current="true"] {
  color: var(--accent) !important;
}
.block_sp_menu .menu_child .sub_menu li.lang {
  align-items: baseline;
}
.block_sp_menu .menu_child .sub_menu li.lang .tit {
  flex: none;
}
/* the drawer's own rules for its rows (flex, tall padding) also reach these nested items */
.block_sp_menu .menu_child .sub_menu li.lang .ly_lang_sp li {
  display: block;
  padding: 0;
  margin: 0;
  border: 0;
  overflow: visible;
}
.block_sp_menu .menu_child .sub_menu li.lang .ly_lang_sp li::before,
.block_sp_menu .menu_child .sub_menu li.lang .ly_lang_sp li::after {
  display: none;
}
.ly_lang_sp {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8em 1.6em;
  font-size: 1.00125vw;
  letter-spacing: 0.08em;
}
.ly_lang_sp a {
  color: var(--ink);
}
.ly_lang_sp a[aria-current="true"] {
  color: var(--accent);
}
@media (max-width: 1023px) {
  .block_sp_menu .menu_child .sub_menu li.lang {
    padding-top: 6vw;
    padding-bottom: 6vw;
  }
  .ly_lang_sp {
    gap: 3vw 6vw;
    font-size: 3.7vw;
  }
}

/* =============================================
   HERO
   ============================================= */
.block_mainvisual {
  --header-h: 88px;
  /* how far below the very top the photography starts - decoupled from the
     header height so the hero's top edge can sit higher than the menu row */
  --mv-top: 52px;
  position: relative;
  height: 100vh !important;
  height: 100dvh !important;
  overflow: hidden;
  background: transparent;
}
/* photography sits below the header bar and dissolves at every edge */
.block_mainvisual figure,
.block_mainvisual figure .img_wrap {
  position: absolute;
  top: var(--mv-top);
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: calc(100% - var(--mv-top));
  margin: 0;
}
.block_mainvisual figure .img_wrap {
  --mv-fade: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0) 0%,
    rgba(0, 0, 0, 0.18) 7%,
    rgba(0, 0, 0, 0.55) 14%,
    rgba(0, 0, 0, 0.85) 20%,
    #000 27%,
    #000 85%,
    rgba(0, 0, 0, 0) 100%
  );
  -webkit-mask-image: var(--mv-fade);
  mask-image: var(--mv-fade);
}

/* two-panel composition: entrance on the left, private room on the right */
.block_mainvisual figure .img_wrap span.mv-left,
.block_mainvisual figure .img_wrap span.mv-right {
  position: absolute;
  top: 0;
  height: 100%;
  background-size: cover;
  background-repeat: no-repeat;
}
.block_mainvisual figure .img_wrap span.mv-left {
  left: 0;
  right: auto;
  width: 47%;
  background-position: 50% center;
  --mv-mask: linear-gradient(to right, #000 0%, #000 52%, rgba(0, 0, 0, 0.84) 59.6%, rgba(0, 0, 0, 0.62) 63.8%, rgba(0, 0, 0, 0.43) 68.1%, rgba(0, 0, 0, 0.27) 72.3%, rgba(0, 0, 0, 0.15) 76.6%, rgba(0, 0, 0, 0.05) 80.9%, rgba(0, 0, 0, 0) 83.9%);
  --mv-veil-x: linear-gradient(to right, rgba(17, 22, 29, 0.2) 0%, rgba(17, 22, 29, 0.38) 76.6%, rgba(17, 22, 29, 0.38) 100%);
  -webkit-mask-image: var(--mv-mask);
  mask-image: var(--mv-mask);
}
.block_mainvisual figure .img_wrap span.mv-right {
  left: auto;
  right: 0;
  width: 45%;
  background-position: center center;
  --mv-mask: linear-gradient(to left, #000 0%, #000 54%, rgba(0, 0, 0, 0.82) 62.2%, rgba(0, 0, 0, 0.6) 66.7%, rgba(0, 0, 0, 0.41) 71.1%, rgba(0, 0, 0, 0.25) 75.6%, rgba(0, 0, 0, 0.13) 80%, rgba(0, 0, 0, 0.04) 84.4%, rgba(0, 0, 0, 0) 87.6%);
  --mv-veil-x: linear-gradient(to right, rgba(17, 22, 29, 0.38) 0%, rgba(17, 22, 29, 0.38) 20%, rgba(17, 22, 29, 0.2) 100%);
  -webkit-mask-image: var(--mv-mask);
  mask-image: var(--mv-mask);
}
.block_mainvisual figure.sp_only .img_wrap span.mv-left {
  width: 100%;
  /* the staircase cut puts its subject dead centre, so on phones the photo runs
     full width instead of having its middle cleared */
  --mv-mask: none;
  --mv-veil-x: linear-gradient(to right, rgba(17, 22, 29, 0.2) 0%, rgba(17, 22, 29, 0.38) 36%, rgba(17, 22, 29, 0.38) 64%, rgba(17, 22, 29, 0.2) 100%);
}

/* dark veil + stone grain, on each photograph only (it is masked with the photo),
   so the background between them is the page background and nothing else */
.block_mainvisual figure .img_wrap span.mv-left::after,
.block_mainvisual figure .img_wrap span.mv-right::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    var(--tex-stone),
    var(--mv-veil-x),
    linear-gradient(180deg,
      rgba(9, 12, 18, 0.3) 0%,
      rgba(9, 12, 18, 0.08) 22%,
      rgba(9, 12, 18, 0.08) 64%,
      rgba(9, 12, 18, 0.44) 100%);
  background-size: 280px 280px, auto, auto;
  background-repeat: repeat, no-repeat, no-repeat;
  background-blend-mode: overlay, normal, normal;
}

.block_mainvisual .copy {
  color: #fff !important;
  z-index: 3;
  position: absolute;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  margin: 0 !important;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: max-content;
  max-width: 88vw;
  letter-spacing: normal;
  font-size: inherit;
  line-height: 1.6;
}
/* the wordmark sits above the catch copy, small and quiet */
.block_mainvisual .copy .copy-logo {
  display: block;
  width: clamp(150px, 15vw, 260px);
  height: auto;
  margin-bottom: 3vw;
  opacity: 0.92;
  filter: drop-shadow(0 2px 18px rgba(0, 0, 0, 0.7));
}
.block_mainvisual .copy .copy-lead {
  display: block;
  font-size: clamp(19px, 2.05vw, 36px);
  font-weight: 300;
  line-height: 1.68;
  letter-spacing: 0.1em;
  color: #f4f1ea;
  text-shadow: 0 2px 34px rgba(0, 0, 0, 0.85), 0 0 90px rgba(0, 0, 0, 0.6);
}
.block_mainvisual .copy .copy-lead em {
  font-style: normal;
  color: var(--gold);
}
.block_mainvisual .copy .copy-sub {
  display: block;
  margin-top: 2.6vw;
  font-size: clamp(12px, 1.12vw, 18px);
  font-weight: 300;
  line-height: 2.3;
  letter-spacing: 0.16em;
  color: rgba(243, 240, 233, 0.93);
  text-shadow: 0 2px 22px rgba(0, 0, 0, 0.8);
}
@media (max-width: 1023px) {
  .block_mainvisual {
    --header-h: 64px;
    --mv-top: 40px;
  }
  .block_mainvisual .copy .copy-logo {
    width: 40vw;
    margin-bottom: 8vw;
  }
  .block_mainvisual .copy .copy-lead {
    font-size: 4.2vw;
    letter-spacing: 0.08em;
    line-height: 1.75;
  }
  .block_mainvisual .copy .copy-sub {
    margin-top: 7vw;
    font-size: 3.3vw;
    letter-spacing: 0.12em;
    line-height: 2.2;
  }
}

/* =============================================
   Shared pieces
   ============================================= */
.ly_link {
  display: inline-block;
  position: relative;
  margin-top: 3.4vw;
  padding-bottom: 11px;
  font-size: clamp(16px, 1.3vw, 20px);
  font-style: italic;
  letter-spacing: 0.1em;
  color: var(--ink);
}
.ly_link::before,
.ly_link::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  height: 1px;
  width: 100%;
}
.ly_link::before {
  background: var(--rule);
}
.ly_link::after {
  background: var(--accent);
  transform: scaleX(0);
  transform-origin: right center;
  transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}
.ly_link:hover::after {
  transform: scaleX(1);
  transform-origin: left center;
}

/* Atmospheric band. Measured off the reference: it runs off the LEFT edge
   and stops 112px short of the right, so it is never a full-width block. */
.ly_bleed {
  width: 94.5vw;
  margin-left: -2.2vw;
  height: 30.6vw;
  overflow: hidden;
}
.ly_bleed img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(0.86);
}
/* the three plates on one table: keep all three in view at every width */
.ly_bleed--trio img {
  object-position: 50% 50%;
  filter: none;
}


/* =============================================
   "Night in Ginza" grade - applied to the interiors, not the food.
   Two layers do the work a single CSS filter cannot: a cool blue-black
   multiply for the shadows, and a warm lantern glow screened back on top.
   ============================================= */
.is-night {
  position: relative;
  isolation: isolate;
}
.is-night img {
  filter: brightness(0.73) contrast(1.145) saturate(0.6) hue-rotate(-10deg);
}
.is-night::before,
.is-night::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.is-night::before {
  z-index: 1;
  background: linear-gradient(175deg, rgba(24, 42, 78, 0.39) 0%, rgba(14, 24, 46, 0.505) 55%, rgba(8, 14, 28, 0.63) 100%);
  mix-blend-mode: multiply;
}
.is-night::after {
  z-index: 2;
  background:
    radial-gradient(58% 46% at 50% 64%, rgba(206, 156, 78, 0.25) 0%, rgba(206, 156, 78, 0) 72%),
    radial-gradient(34% 30% at 16% 24%, rgba(224, 186, 116, 0.155) 0%, rgba(224, 186, 116, 0) 70%);
  mix-blend-mode: screen;
}

/* =============================================
   Concept
   ============================================= */
.ly_concept {
  padding: 14vw 6vw 15vw;
  text-align: center;
  scroll-margin-top: var(--header-h);
}
/* wide enough for the longest hand-broken line at every size (an em cap here
   would be 440px on the template's 10px root, and the copy outgrows that) */
.ly_concept_in {
  max-width: max(440px, 60vw);
  margin: 0 auto;
}
/* a Latin eyebrow and a hairline drop lead into the heading */
.ly_concept_en {
  display: block;
  font-family: var(--latin-serif) !important;
  font-style: italic;
  font-size: clamp(14px, 1.15vw, 18px);
  letter-spacing: 0.12em;
  color: var(--accent);
}
.ly_concept_en::after {
  content: "";
  display: block;
  width: 1px;
  height: 4vw;
  margin: 1.6vw auto 2.6vw;
  background: linear-gradient(to bottom, var(--accent), rgba(199, 171, 109, 0));
}
/* set wide and large; the indent balances the trailing letter-space so it stays centred */
.ly_concept_ttl {
  font-size: clamp(24px, 2.7vw, 44px);
  font-weight: 400;
  letter-spacing: 0.36em;
  text-indent: 0.36em;
  line-height: 1.6;
  color: var(--ink);
}
.ly_concept_ttl + .ly_concept_txt {
  margin-top: 4.6vw;
}
.ly_concept_txt {
  margin-top: 3.4vw;
  font-size: clamp(14px, 1.15vw, 18px);
  line-height: 2.5;
  letter-spacing: 0.1em;
  color: var(--ink-soft);
}

/* =============================================
   Feature blocks. Also measured: the text column starts at 10.4vw and the
   photograph starts at 43.6vw and runs 1.4vw PAST the right edge - the
   opposite side to the bands above, which is what makes the page asymmetric.
   ============================================= */
.ly_feature {
  display: grid;
  grid-template-columns: 43.6vw 1fr;
  align-items: center;
  padding: 10vw 0 11vw;
  scroll-margin-top: var(--header-h);
}
.ly_feature_body {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  column-gap: 3.4vw;
  align-items: start;
  padding-left: 10.4vw;
  padding-right: 3.6vw;
  counter-increment: ly-feature;
}
/* vertical title in the first column, the copy stacks in the second */
.ly_feature_body > * {
  grid-column: 2;
}
.ly_feature_body > .ly_feature_ttl {
  grid-column: 1;
  grid-row: 1 / span 4;
  writing-mode: vertical-rl;
}
.ly_feature_body > .ly_link {
  justify-self: start;
}
/* item 4: gold is kept to hairlines, hovers and this small index */
.ly_feature_body::before {
  content: counter(ly-feature, decimal-leading-zero);
  grid-column: 2;
  font-family: var(--latin-serif) !important;
  font-style: italic;
  font-size: clamp(15px, 1.2vw, 19px);
  line-height: 1;
  letter-spacing: 0.08em;
  color: var(--accent);
}
.wrapper {
  counter-reset: ly-feature;
}
.ly_feature_media {
  width: 57.8vw;
}
.ly_feature_media img {
  display: block;
  width: 100%;
  height: 38.5vw;
  object-fit: cover;
  filter: saturate(0.88);
}
/* the lead block (Rooms) gets more air and a taller photograph */
.ly_feature--lead {
  position: relative;
  isolation: isolate;
  padding: 13vw 0 12vw;
}
/* The seigaiha falls away and a lantern glow takes over, like stepping from the
   corridor into a closed private room. Faded top and bottom so there is no seam. */
.ly_feature--lead::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(46% 42% at 26% 50%, rgba(214, 164, 86, 0.1) 0%, rgba(214, 164, 86, 0) 70%),
    linear-gradient(to bottom, rgba(12, 13, 16, 0) 0%, #0c0d10 16%, #0c0d10 84%, rgba(12, 13, 16, 0) 100%);
}
.ly_feature--lead .ly_feature_media img {
  height: 45vw;
}
.ly_feature--lead .ly_feature_ttl {
  font-size: clamp(30px, 3.1vw, 52px);
}
.ly_feature--lead .ly_feature_txt {
  font-size: clamp(14px, 1.12vw, 17px);
}

.ly_feature_ttl {
  font-size: clamp(26px, 2.5vw, 42px);
  font-weight: 400;
  letter-spacing: 0.16em;
  line-height: 1.7;
  color: var(--ink);
}
.ly_feature_txt {
  margin-top: 2.6vw;
  font-size: clamp(13px, 1.02vw, 16px);
  line-height: 2.3;
  letter-spacing: 0.07em;
  color: var(--ink-soft);
}
.ly_feature_txt + .ly_feature_txt {
  margin-top: 1.6vw;
}
/* use cases inside a feature block (business), ruled in gold like the info list */
.ly_uses {
  margin-top: 2.8vw;
  border-top: 1px solid var(--rule);
}
.ly_uses dt {
  padding-top: 1.3vw;
  font-size: clamp(14px, 1.1vw, 17px);
  letter-spacing: 0.1em;
  color: var(--ink);
}
.ly_uses dd {
  margin-top: 0.5vw;
  padding-bottom: 1.3vw;
  border-bottom: 1px solid var(--rule);
  font-size: clamp(12.5px, 0.95vw, 15px);
  line-height: 2;
  letter-spacing: 0.06em;
  color: var(--ink-soft);
}

/* =============================================
   Information
   ============================================= */
.ly_info {
  padding: 12vw 20vw 13vw var(--gutter);
  scroll-margin-top: var(--header-h);
}
.ly_info_head .ly_feature_txt {
  max-width: 34em;
}
/* the heading stays on one line; the width cap above now applies to the copy only */
.ly_info_ttl {
  white-space: nowrap;
}
.ly_info_list {
  display: grid;
  grid-template-columns: 8em 1fr;
  row-gap: 1.6vw;
  column-gap: 2vw;
  margin-top: 5vw;
  max-width: 46em;
}
.ly_info_list dt {
  padding-top: 0.3em;
  font-size: 13px;
  letter-spacing: 0.16em;
  color: var(--muted);
  border-top: 1px solid var(--rule);
}
.ly_info_list dd {
  font-size: clamp(13px, 1.02vw, 16px);
  line-height: 2.1;
  letter-spacing: 0.06em;
  color: var(--ink-soft);
  border-top: 1px solid var(--rule);
  padding-top: 0.4em;
}

/* =============================================
   Topics
   ============================================= */
.ly_news_sec {
  padding: 10vw var(--gutter) 11vw;
  scroll-margin-top: var(--header-h);
}
.ly_news_ttl {
  font-size: 16px;
  letter-spacing: 0.2em;
  color: var(--muted);
}
.ly_news {
  margin-top: 3vw;
  max-width: 58em;
}
.ly_news li {
  border-top: 1px solid var(--rule);
}
.ly_news li:last-child {
  border-bottom: 1px solid var(--rule);
}
.ly_news a {
  display: grid;
  grid-template-columns: 9em 1fr;
  align-items: baseline;
  column-gap: 2vw;
  padding: 1.7vw 0;
  transition: opacity 0.5s;
}
.ly_news a:hover {
  opacity: 0.6;
}
.ly_news time {
  font-size: 12px;
  letter-spacing: 0.1em;
  color: var(--muted);
}
.ly_news_txt {
  font-size: clamp(13px, 1.05vw, 17px);
  letter-spacing: 0.07em;
  color: var(--ink);
}

/* =============================================
   Reservation
   ============================================= */
.ly_reserve {
  padding: 10vw 6vw 12vw;
  text-align: center;
  border-top: 1px solid var(--rule);
  scroll-margin-top: var(--header-h);
}
.ly_reserve_ja {
  font-size: clamp(16px, 1.5vw, 24px);
  font-weight: 400;
  letter-spacing: 0.13em;
  line-height: 1.9;
  color: var(--ink);
}

/* =============================================
   Footer
   ============================================= */
.ly_footer {
  padding: 8vw 6vw 9vw;
  border-top: 1px solid var(--rule);
  text-align: center;
}
.ly_footer_logo {
  width: 96px;
  margin: 0 auto;
  line-height: 0;
}
.ly_footer_logo img {
  width: 100%;
  height: auto;
  filter: none;
}
.ly_fnav {
  margin-top: 4.5vw;
}
.ly_fnav ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1em 3em;
}
.ly_fnav a {
  font-size: clamp(13px, 1.05vw, 17px);
  letter-spacing: 0.12em;
  color: var(--ink);
  transition: opacity 0.5s;
}
.ly_fnav a:hover {
  opacity: 0.55;
}
.ly_flinks {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.8em 2.4em;
  margin-top: 3.4vw;
}
.ly_flinks a {
  font-size: 12.5px;
  letter-spacing: 0.08em;
  color: var(--ink-soft);
  border-bottom: 1px solid var(--rule);
  padding-bottom: 3px;
}
.ly_sns {
  display: flex;
  justify-content: center;
  gap: 2.2em;
  margin-top: 3.4vw;
}
.ly_sns a {
  font-size: 14px;
  letter-spacing: 0.14em;
  color: var(--ink-soft);
}
.ly_cp {
  margin-top: 4vw;
  font-size: 13px;
  letter-spacing: 0.1em;
  color: var(--muted);
}

/* =============================================
   Scroll progress rail - sits in the right-hand margin the
   asymmetric image placement leaves open
   ============================================= */
.ly_progress {
  position: fixed;
  right: 30px;
  top: 26vh;
  height: 48vh;
  width: 1px;
  background: rgba(233, 228, 216, 0.2);
  z-index: 1002;
  pointer-events: none;
}
.ly_progress_dot {
  position: absolute;
  left: 50%;
  top: 0;
  width: 5px;
  height: 5px;
  margin-left: -2.5px;
  margin-top: -2.5px;
  border-radius: 50%;
  background: var(--ink);
  transition: top 0.12s linear;
}
@media (max-width: 1023px) {
  .ly_progress {
    display: none;
  }
}

/* =============================================
   Scroll reveal. Only armed once script.js has run (html.has-reveal),
   so nothing stays hidden if JavaScript fails.
   Photographs open from the centre like a sliding screen; copy rises in.
   The clip sits on the <img>, never on the observed block: Chrome counts a
   target's own clip-path, so a block clipped to zero width never intersects.
   ============================================= */
.has-reveal .ly_bleed img,
.has-reveal .ly_feature_media img {
  clip-path: inset(0 50% 0 50%);
  transform: scale(1.08);
  transition:
    clip-path 1.8s cubic-bezier(0.65, 0, 0.35, 1),
    transform 2.6s cubic-bezier(0.16, 1, 0.3, 1);
}
/* the night-grade layers would otherwise sit over an empty frame */
.has-reveal .is-night::before,
.has-reveal .is-night::after {
  opacity: 0;
  transition: opacity 1.8s ease 0.3s;
}
.has-reveal .is-night.is-inview::before,
.has-reveal .is-night.is-inview::after {
  opacity: 1;
}
.has-reveal .ly_concept_in,
.has-reveal .ly_feature_body,
.has-reveal .ly_info,
.has-reveal .ly_news_sec,
.has-reveal .ly_reserve {
  opacity: 0;
  transform: translate3d(0, 28px, 0);
  transition: opacity 1.6s ease, transform 1.6s cubic-bezier(0.16, 1, 0.3, 1);
}
.has-reveal .is-inview {
  opacity: 1;
  transform: none;
}
.has-reveal .is-inview img {
  clip-path: inset(0 0 0 0);
  transform: scale(1);
}

/* =============================================
   Lower pages - page head, course lists, notes.
   Everything else (header, feature blocks, info list, footer, reveal)
   is shared with the top page.
   ============================================= */
.ly_phead {
  position: relative;
  height: 58vh;
  min-height: 380px;
  overflow: hidden;
  display: flex;
  align-items: flex-end;
}
.ly_phead_img {
  position: absolute;
  inset: 0;
}
.ly_phead_img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
/* the page background shows through at the very bottom, as in the hero */
.ly_phead::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(
    to bottom,
    rgba(12, 16, 22, 0.72) 0%,
    rgba(12, 16, 22, 0.3) 34%,
    rgba(12, 16, 22, 0.55) 72%,
    rgba(12, 16, 22, 0.94) 100%
  );
}
.ly_phead_body {
  position: relative;
  z-index: 2;
  padding: 0 var(--gutter) 5vw;
}
.ly_phead_en {
  display: block;
  font-family: var(--latin-serif) !important;
  font-style: italic;
  font-size: clamp(14px, 1.15vw, 18px);
  letter-spacing: 0.12em;
  color: var(--accent);
}
.ly_phead_ja {
  display: block;
  margin-top: 1.2vw;
  font-size: clamp(26px, 2.6vw, 44px);
  font-weight: 400;
  letter-spacing: 0.16em;
  line-height: 1.5;
  color: #f4f1ea;
  text-shadow: 0 2px 30px rgba(0, 0, 0, 0.6);
}

.ly_crumb {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6em;
  padding: 2.4vw var(--gutter) 0;
  font-size: 12px;
  letter-spacing: 0.08em;
  color: var(--muted);
}
.ly_crumb li + li::before {
  content: "／";
  margin-right: 0.6em;
}
.ly_crumb a {
  color: var(--ink-soft);
}

/* a plain section for sub pages: horizontal heading, then content */
.ly_sec2 {
  padding: 8vw var(--gutter) 9vw;
  scroll-margin-top: var(--header-h);
}
.ly_sec2 + .ly_sec2 {
  padding-top: 0;
}
/* a lead section that introduces a feature block below it should not add
   its own bottom padding on top of the block's */
.ly_sec2:has(+ .ly_feature) {
  padding-bottom: 1vw;
}
.ly_h2 {
  font-size: clamp(21px, 1.95vw, 32px);
  font-weight: 400;
  letter-spacing: 0.16em;
  line-height: 1.6;
  color: var(--ink);
}
.ly_h2 + .ly_lead2 {
  margin-top: 2.4vw;
}
.ly_lead2 {
  max-width: 40em;
  font-size: clamp(13px, 1.02vw, 16px);
  line-height: 2.3;
  letter-spacing: 0.07em;
  color: var(--ink-soft);
  word-break: auto-phrase;
  text-wrap: pretty;
}

/* course list: name and price on one ruled row, then what it is */
.ly_menu {
  margin-top: 4vw;
  max-width: 54em;
}
.ly_menu > li {
  padding: 2.2vw 0;
  border-top: 1px solid var(--rule);
}
.ly_menu > li:last-child {
  border-bottom: 1px solid var(--rule);
}
.ly_menu_row {
  display: flex;
  align-items: baseline;
  gap: 1.2em;
}
.ly_menu_name {
  font-size: clamp(15px, 1.3vw, 21px);
  letter-spacing: 0.1em;
  color: #f2efe8;
}
.ly_menu_dots {
  flex: 1 1 auto;
  height: 1px;
  background: var(--rule);
}
.ly_menu_price {
  flex: none;
  font-family: var(--latin-serif) !important;
  font-size: clamp(15px, 1.25vw, 20px);
  letter-spacing: 0.04em;
  color: var(--accent);
}
/* a second price for the same course (名物 水たき会席 22,000円 / 27,500円): no name, its own line and words */
.ly_menu_row--sub {
  margin-top: 1.6vw;
}
.ly_menu_desc {
  margin-top: 1.1vw;
  max-width: 44em;
  font-size: clamp(12.5px, 0.98vw, 15px);
  line-height: 2.1;
  letter-spacing: 0.06em;
  color: var(--ink-soft);
  word-break: auto-phrase;
  text-wrap: pretty;
}

.ly_note {
  margin-top: 3vw;
  max-width: 48em;
  font-size: 12px;
  line-height: 2;
  letter-spacing: 0.05em;
  color: var(--muted);
}
.ly_note li {
  padding-left: 1.1em;
  text-indent: -1.1em;
}

/* photo strip inside a sub page */
.ly_strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.4vw;
  margin-top: 4vw;
}
.ly_strip img {
  width: 100%;
  height: 22vw;
  object-fit: cover;
  filter: saturate(0.9);
}

.ly_pagenav {
  display: flex;
  flex-wrap: wrap;
  gap: 1.2em 3em;
  padding: 0 var(--gutter) 10vw;
}

@media (max-width: 1023px) {
  .ly_phead {
    height: 46vh;
    min-height: 300px;
  }
  .ly_phead_body {
    padding-bottom: 10vw;
  }
  .ly_phead_en {
    font-size: 3.4vw;
  }
  .ly_phead_ja {
    margin-top: 3vw;
    font-size: 6.4vw;
  }
  .ly_crumb {
    padding-top: 6vw;
    font-size: 3.1vw;
  }
  .ly_sec2 {
    padding: 16vw var(--gutter) 17vw;
  }
  .ly_h2 {
    font-size: 5.2vw;
  }
  .ly_h2 + .ly_lead2 {
    margin-top: 6vw;
  }
  .ly_lead2 {
    font-size: 3.5vw;
  }
  .ly_menu {
    margin-top: 10vw;
  }
  .ly_menu > li {
    padding: 6vw 0;
  }
  /* name on the left (wraps inside its own column), price kept on the first line at the right */
  .ly_menu_row {
    flex-wrap: nowrap;
    gap: 1em;
  }
  .ly_menu_name {
    flex: 0 1 auto;
    min-width: 0;
  }
  .ly_menu_price {
    flex: none;
    margin-left: auto;
    white-space: nowrap;
  }
  .ly_menu_name {
    font-size: 4.2vw;
  }
  .ly_menu_dots {
    display: none;
  }
  .ly_menu_price {
    font-size: 4vw;
  }
  .ly_menu_row--sub {
    margin-top: 5vw;
  }
  .ly_menu_desc {
    margin-top: 3.4vw;
    font-size: 3.4vw;
  }
  .ly_note {
    margin-top: 8vw;
    font-size: 3.1vw;
  }
  .ly_strip {
    grid-template-columns: minmax(0, 1fr);
    gap: 4vw;
    margin-top: 10vw;
  }
  .ly_strip img {
    height: 62vw;
  }
  .ly_pagenav {
    padding-bottom: 20vw;
  }
}

/* =============================================
   Cut notes on the top page. The bands and feature photos reuse .ly_shot but
   must fill a slot whose height is already set; the hero panes carry their own
   night grade on ::after, so they get the note without .ly_shot's scrim.
   ============================================= */
.ly_shot--fill {
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
}
/* above the .is-night grade layers, which sit at z-index 1 and 2 */
.ly_shot_note {
  z-index: 4;
}
.ly_shot_toggle {
  z-index: 5;
}
/* The hero panes are masked (they fade at their inner and lower edges), so a
   note placed inside them would fade away too. These overlays sit outside the
   masked figures, over the left and right thirds of the hero. */
.mv_cut {
  position: absolute;
  top: 0;
  height: 100%;
  width: 34vw;
  z-index: 4;
}
.mv_cut--l { left: 0; }
.mv_cut--r { right: 0; }
.mv_cut--sp { display: none; }
.mv_cut .ly_shot_note {
  inset: auto 1px 18vh 1px;
  background: rgba(10, 13, 18, 0.72);
  border-color: rgba(199, 171, 109, 0.5);
}
.mv_cut.is-open .ly_shot_note {
  /* room for the chip, which sits inside the note's lower edge */
  padding-bottom: calc(4.5vw + 12px);
}
.mv_cut .ly_shot_tag {
  bottom: calc(18vh + 1.2vw);
}
/* while open, the chip moves to the top of the pane so it cannot sit on the
   note text, whose height depends on how the copy wraps */
.mv_cut.is-open .ly_shot_tag {
  top: 14vh;
  bottom: auto;
}
/* the bands bleed off the left edge, so their notes start inside the page */
.ly_bleed .ly_shot_note {
  padding-left: calc(var(--gutter) + 2.2vw);
}
.mv_cut--r .ly_shot_note {
  align-items: flex-end;
  text-align: right;
}
.mv_cut--r .ly_shot_desc {
  text-align: right;
}
.mv_cut--r .ly_shot_tag {
  left: auto;
  right: 1.2vw;
}
@media (max-width: 1023px) {
  .mv_cut--l,
  .mv_cut--r {
    display: none;
  }
  .mv_cut--sp {
    display: block;
    width: 100%;
  }
  .mv_cut .ly_shot_note {
    /* the overlay is no longer masked, so it can sit low - below the catch copy */
    inset: auto 1px 9vh 1px;
    background: rgba(10, 13, 18, 0.88);
  }
  .mv_cut.is-open .ly_shot_note {
    padding-bottom: calc(11vw + 10px);
  }
  .mv_cut .ly_shot_tag {
    bottom: calc(9vh + 4vw);
  }
  .ly_bleed .ly_shot_note {
    padding-left: calc(var(--gutter) + 4vw);
  }
}

/* =============================================
   Lower pages, second pass: asymmetric heads, staggered photo sets,
   and photo slots that carry the intended cut as text until the
   real photography is shot.
   ============================================= */

/* --- page head: photograph bleeds off the right, title overlaps it --- */
.ly_phead2 {
  position: relative;
  min-height: 72vh;
  display: flex;
  align-items: center;
  padding: var(--header-h) 0 4vw;
}
.ly_phead2_media {
  position: absolute;
  top: 0;
  right: -1vw;
  width: 62vw;
  height: 100%;
}
.ly_phead2_media .ly_shot {
  /* fill the media box: with height:100% an aspect-ratio would derive the
     width from the height and overflow the container on narrower screens */
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
}
.ly_phead2_body {
  position: relative;
  z-index: 2;
  padding-left: var(--gutter);
  max-width: 40vw;
}

/* --- photo slot: real image underneath, intended cut written on top --- */
.ly_shot {
  position: relative;
  overflow: hidden;
  margin: 0;
}
.ly_shot img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(0.88);
  transition: filter 0.6s ease;
}
.ly_shot.is-open img {
  filter: saturate(0.45) brightness(0.52) contrast(1.04);
}
.ly_shot::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.5s ease;
  background: linear-gradient(200deg, rgba(10, 13, 18, 0.7) 0%, rgba(10, 13, 18, 0.84) 100%);
}
.ly_shot.is-open::after {
  opacity: 1;
}

/* the toggle covers the photograph; its chip is the only always-visible mark */
.ly_shot_toggle {
  position: absolute;
  inset: 0;
  z-index: 3;
  display: block;
  width: 100%;
  border: 0;
  padding: 0;
  background: none;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
}
.ly_shot_tag {
  position: absolute;
  left: 1.2vw;
  bottom: 1.2vw;
  display: inline-flex;
  align-items: center;
  gap: 0.6em;
  padding: 0.5em 0.9em;
  border: 1px solid rgba(199, 171, 109, 0.5);
  background: rgba(10, 13, 18, 0.55);
  backdrop-filter: blur(3px);
  font-family: var(--latin-serif) !important;
  font-style: italic;
  font-size: clamp(11px, 0.88vw, 14px);
  letter-spacing: 0.12em;
  color: var(--accent);
  transition: background 0.4s, color 0.4s;
}
.ly_shot_tag::after {
  content: "＋";
  font-style: normal;
  font-size: 0.9em;
}
.ly_shot.is-open .ly_shot_tag::after {
  content: "×";
}
.ly_shot_toggle:hover .ly_shot_tag,
.ly_shot_toggle:focus-visible .ly_shot_tag {
  background: rgba(199, 171, 109, 0.9);
  color: #12161c;
}
.ly_shot_toggle:focus-visible {
  outline: 1px solid var(--accent);
  outline-offset: -3px;
}
.ly_shot_note {
  position: absolute;
  inset: 1px;
  z-index: 2;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.5s ease, visibility 0.5s;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 0.75em;
  padding: 1.8vw;
  border: 1px dashed rgba(199, 171, 109, 0.4);
}
.ly_shot.is-open .ly_shot_note,
.mv_cut.is-open .ly_shot_note {
  opacity: 1;
  visibility: visible;
  /* clear the chip, which stays put as the close affordance.
     Measured in vw because the chip's own size is vw-based; this element
     inherits a 10px font size from the template, so em would under-shoot. */
  padding-bottom: calc(4.5vw + 12px);
}
.ly_shot_no {
  font-family: var(--latin-serif) !important;
  font-style: italic;
  font-size: clamp(12px, 0.95vw, 15px);
  letter-spacing: 0.14em;
  color: var(--accent);
}
.ly_shot_ttl {
  font-size: clamp(14px, 1.15vw, 19px);
  letter-spacing: 0.1em;
  line-height: 1.7;
  color: #f2efe8;
}
.ly_shot_desc {
  max-width: 24em;
  font-size: clamp(12px, 0.92vw, 14.5px);
  line-height: 1.95;
  letter-spacing: 0.05em;
  color: var(--ink-soft);
  word-break: auto-phrase;
  text-wrap: pretty;
}
.ly_shot_spec {
  font-size: 11.5px;
  letter-spacing: 0.06em;
  color: var(--muted);
}
.ly_shot--45 { aspect-ratio: 4 / 5; }
.ly_shot--11 { aspect-ratio: 1 / 1; }
.ly_shot--32 { aspect-ratio: 3 / 2; }
.ly_shot--21 { aspect-ratio: 2 / 1; }

/* --- two-photo spread: a tall main cut and a small detail, offset --- */
.ly_pair {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 20vw;
  gap: 2.4vw;
  align-items: start;
}
/* a feature holding a pair is narrower, so the second cut's note stays legible */
.ly_feature_media:has(.ly_pair) {
  width: 52vw;
}
.ly_pair .ly_shot_desc {
  max-width: 15em;
}
.ly_pair > :last-child {
  margin-top: 8vw;
}

/* --- staggered set: nothing lines up, the last one bleeds off the right --- */
.ly_stagger {
  display: grid;
  grid-template-columns: 34vw 24vw 28vw;
  gap: 2.6vw;
  align-items: start;
  margin-top: 4vw;
}
.ly_stagger > :nth-child(2) {
  margin-top: 8vw;
}
.ly_stagger > :nth-child(3) {
  margin-top: 2.6vw;
}
.ly_stagger .ly_shot_desc {
  max-width: 17em;
}

/* --- band that bleeds off the LEFT, opposite side to the feature photos --- */
.ly_band2 {
  width: 88vw;
  margin: 6vw 0 0 -3vw;
}
/* this band bleeds off the left, so its note starts inside the viewport */
.ly_band2 .ly_shot_note {
  padding-left: calc(var(--gutter) + 3vw);
}
.ly_band2_cap {
  padding: 1.6vw 0 0 calc(var(--gutter) + 3vw);
  font-size: clamp(12px, 0.95vw, 15px);
  letter-spacing: 0.08em;
  color: var(--muted);
}

/* --- price list kept narrow, prices pushed out into the empty right --- */
.ly_menu--narrow {
  max-width: 38vw;
}
.ly_menu--narrow .ly_menu_price {
  margin-right: -7vw;
}

/* --- menu excerpt as a vertical tanzaku --- */
.ly_tanzaku {
  display: flex;
  flex-direction: row-reverse;
  justify-content: flex-end;
  gap: 2.2em;
  margin-top: 4vw;
  padding-right: 2vw;
}
.ly_tanzaku li {
  writing-mode: vertical-rl;
  padding: 0 0.9em;
  border-right: 1px solid var(--rule);
  font-size: clamp(13px, 1.02vw, 16px);
  letter-spacing: 0.14em;
  line-height: 2.1;
  color: var(--ink-soft);
  max-height: 26em;
}
.ly_tanzaku li:first-child {
  color: #f2efe8;
}

/* --- business: use cases, left edge steps in --- */
.ly_case {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 40vw;
  gap: 4vw;
  align-items: center;
  padding: 5vw 0;
}
.ly_case_body {
  padding-left: calc(var(--gutter) + var(--step, 0px));
}
.ly_case:nth-of-type(2) {
  --step: 6vw;
}
.ly_case:nth-of-type(3) {
  --step: 12vw;
}
.ly_case_media {
  width: 41vw;
}
.ly_case_no {
  display: block;
  font-family: var(--latin-serif) !important;
  font-style: italic;
  font-size: clamp(15px, 1.2vw, 19px);
  letter-spacing: 0.08em;
  color: var(--accent);
}
.ly_case_ttl {
  margin-top: 1.2vw;
  font-size: clamp(19px, 1.8vw, 30px);
  font-weight: 400;
  letter-spacing: 0.14em;
  line-height: 1.6;
  color: var(--ink);
}

/* --- four steps, ruled --- */
.ly_flow {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 2vw;
  margin-top: 4vw;
  max-width: 62vw;
}
.ly_flow li {
  padding-top: 1.2vw;
  border-top: 1px solid var(--rule);
}
.ly_flow .n {
  font-family: var(--latin-serif) !important;
  font-style: italic;
  font-size: 13px;
  color: var(--accent);
}
.ly_flow .t {
  display: block;
  margin-top: 0.7em;
  font-size: clamp(12.5px, 0.98vw, 15px);
  line-height: 1.9;
  letter-spacing: 0.06em;
  color: var(--ink-soft);
}

/* --- business: three reasons, ruled columns --- */
.ly_points {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 3vw;
  margin-top: 5vw;
  max-width: 76vw;
}
.ly_points li {
  padding-top: 1.6vw;
  border-top: 1px solid var(--rule);
}
.ly_points_no {
  font-family: var(--latin-serif) !important;
  font-style: italic;
  font-size: 13px;
  color: var(--accent);
}
.ly_points_ttl {
  margin-top: 0.9vw;
  font-size: clamp(17px, 1.4vw, 23px);
  font-weight: 400;
  letter-spacing: 0.14em;
  line-height: 1.6;
  color: var(--ink);
}
.ly_points_txt {
  margin-top: 1.1vw;
  font-size: clamp(12.5px, 0.98vw, 15px);
  line-height: 2.1;
  letter-spacing: 0.06em;
  color: var(--ink-soft);
  word-break: auto-phrase;
  text-wrap: pretty;
}

/* --- a timed flow: the hour, what happens, then a line --- */
.ly_flow--time .n {
  font-size: clamp(17px, 1.5vw, 24px);
  font-style: normal;
  font-variant-numeric: lining-nums;   /* 11:00 reads as 11:00, not "II:oo" */
  letter-spacing: 0.06em;
}
.ly_flow--time .t {
  word-break: auto-phrase;
  text-wrap: pretty;
}
.ly_flow--time .h {
  display: block;
  margin-top: 0.5em;
  font-size: clamp(14px, 1.1vw, 17px);
  letter-spacing: 0.12em;
  color: var(--ink);
}
.ly_flow--5 {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  max-width: 76vw;
}
.ly_flow + .ly_lead2 {
  margin-top: 4vw;
}
/* a schedule can come in two (lunch meeting / afternoon meeting then dinner): small heading over each,
   and on wide screens as many columns as there are rows */
.ly_flow_ttl {
  margin-top: 4.4vw;
  font-size: clamp(15px, 1.25vw, 20px);
  letter-spacing: 0.14em;
  color: var(--accent);
}
.ly_flow_ttl + .ly_flow {
  margin-top: 1.6vw;
}
@media (min-width: 1024px) {
  .ly_flow--time {
    grid-template-columns: none;
    grid-auto-flow: column;
    grid-auto-columns: minmax(0, 1fr);
  }
}

/* --- questions from whoever books the room --- */
.ly_faq {
  margin-top: 4vw;
  max-width: 52em;
  border-top: 1px solid var(--rule);
}
.ly_faq_item {
  padding: 1.8vw 0;
  border-bottom: 1px solid var(--rule);
}
.ly_faq dt,
.ly_faq dd {
  position: relative;
  padding-left: 2.2em;
}
.ly_faq dt::before,
.ly_faq dd::before {
  position: absolute;
  left: 0;
  top: -0.1em;
  font-family: var(--latin-serif) !important;
  font-style: italic;
  font-size: 1.2em;
}
.ly_faq dt::before {
  content: "Q";
  color: var(--accent);
}
.ly_faq dd::before {
  content: "A";
  color: var(--muted);
}
.ly_faq dt {
  font-size: clamp(14px, 1.1vw, 17px);
  line-height: 1.8;
  letter-spacing: 0.1em;
  color: var(--ink);
  word-break: auto-phrase;
  text-wrap: balance;
}
.ly_faq dd {
  margin-top: 0.8em;
  font-size: clamp(12.5px, 0.98vw, 15px);
  line-height: 2.1;
  letter-spacing: 0.06em;
  color: var(--ink-soft);
  word-break: auto-phrase;
  text-wrap: pretty;
}

/* on desktop the spec list and the FAQ run the same measure as the blocks above
   (76vw); the FAQ sets question and answer side by side so lines stay readable */
@media (min-width: 1024px) {
  .ly_info_list--wide {
    grid-template-columns: 14em 1fr;
    max-width: 76vw;
  }
  .ly_faq {
    max-width: 76vw;
  }
  .ly_faq_item {
    display: grid;
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
    column-gap: 4vw;
    align-items: start;
  }
  .ly_faq dd {
    margin-top: 0;
  }
}

/* --- 要確認: a proof mark for facts not yet confirmed with the shop,
   shown in the open like the CUT briefs; remove the span once confirmed --- */
.ly_tbc {
  display: inline-block;
  margin-left: 0.6em;
  padding: 0 0.55em;
  border: 1px dashed var(--accent);
  font-size: 10.5px;
  line-height: 1.7;
  letter-spacing: 0.1em;
  text-indent: 0;
  white-space: nowrap;
  vertical-align: 0.15em;
  color: var(--accent);
}

/* --- the counter, deliberately subordinate on the rooms page --- */
.ly_counter {
  display: grid;
  grid-template-columns: 26vw minmax(0, 1fr);
  gap: 3vw;
  align-items: center;
  padding: 2vw var(--gutter) 0 var(--gutter);
  max-width: 76vw;
}

@media (max-width: 1023px) {
  .ly_phead2 {
    min-height: 0;
    display: block;
    padding: calc(var(--header-h) + 8vw) 0 0;
  }
  .ly_phead2_media {
    position: relative;
    right: auto;
    width: 94vw;
    height: auto;
    margin: 8vw 0 0 6vw;
  }
  .ly_phead2_body {
    max-width: none;
    margin-top: 7vw;   /* photo above, then breathing room before the small Latin label */
    padding-right: var(--gutter);
  }
  .ly_shot_note {
    padding: 5vw;
    gap: 0.6em;
  }
  .ly_shot_tag {
    left: 4vw;
    bottom: 4vw;
    font-size: 3vw;
  }
  .ly_shot.is-open .ly_shot_note {
    padding-bottom: calc(11vw + 10px);
  }
  .ly_shot_desc {
    font-size: 3.2vw;
  }
  .ly_shot_spec {
    font-size: 2.9vw;
  }
  .ly_pair,
  .ly_stagger,
  .ly_case,
  .ly_counter,
  .ly_flow,
  .ly_points {
    grid-template-columns: minmax(0, 1fr);
    gap: 6vw;
    padding-left: 0;
    max-width: none;
  }
  .ly_flow_ttl {
    margin-top: 10vw;
    font-size: 4.2vw;
  }
  .ly_flow_ttl + .ly_flow {
    margin-top: 4vw;
  }
  .ly_pair > :last-child,
  .ly_stagger > :nth-child(2),
  .ly_stagger > :nth-child(3) {
    margin-top: 0;
  }
  .ly_stagger {
    margin-top: 10vw;
  }
  .ly_case_body {
    padding: 0 var(--gutter);
  }
  .ly_case_media,
  .ly_pair,
  .ly_counter {
    width: 94vw;
    margin-left: 6vw;
  }
  .ly_case_ttl {
    margin-top: 4vw;
    font-size: 5.6vw;
  }
  .ly_band2 {
    width: 96vw;
    margin: 12vw 0 0 -4vw;
  }
  .ly_band2_cap {
    padding: 4vw var(--gutter) 0;
    font-size: 3.1vw;
  }
  .ly_menu--narrow {
    max-width: none;
  }
  .ly_menu--narrow .ly_menu_price {
    margin-right: 0;
  }
  /* no double offsets: the parent already bleeds or pads */
  .ly_feature_media .ly_pair {
    width: 100%;
    margin-left: 0;
  }
  .ly_sec2 .ly_counter,
  .ly_sec2 .ly_stagger {
    width: auto;
    margin-left: 0;
  }
  .ly_tanzaku {
    gap: 1.2em;
    padding-right: 0;
    margin-top: 10vw;
  }
  .ly_tanzaku li {
    font-size: 3.4vw;
    max-height: 22em;
  }
  .ly_flow {
    margin-top: 10vw;
  }
  .ly_flow li {
    padding-top: 4vw;
  }
  .ly_flow .t {
    font-size: 3.4vw;
  }
  .ly_flow--time .n {
    font-size: 4.6vw;
  }
  .ly_flow--time .h {
    font-size: 3.9vw;
  }
  .ly_flow + .ly_lead2 {
    margin-top: 10vw;
  }
  .ly_points {
    margin-top: 10vw;
  }
  .ly_points li {
    padding-top: 4vw;
  }
  .ly_points_ttl {
    margin-top: 2vw;
    font-size: 4.8vw;
  }
  .ly_points_txt {
    margin-top: 2.4vw;
    font-size: 3.5vw;
  }
  .ly_faq {
    margin-top: 10vw;
  }
  .ly_faq_item {
    padding: 5vw 0;
  }
  .ly_faq dt {
    font-size: 3.9vw;
  }
  .ly_faq dd {
    font-size: 3.5vw;
  }
}

/* =============================================
   Responsive
   ============================================= */
@media (max-width: 1023px) {
  :root {
    --gutter: 7vw;
  }
  body.top {
    background-attachment: scroll;
  }

  .ly_bleed {
    width: 96vw;
    margin-left: -4vw;
    height: 62vw;
  }
  .ly_bleed--trio {
    height: 32vw;
  }

  .ly_concept {
    padding: 24vw 7vw 25vw;
  }
  .ly_concept_en {
    font-size: 3.4vw;
  }
  .ly_concept_en::after {
    height: 12vw;
    margin: 4vw auto 7vw;
  }
  .ly_concept_ttl {
    /* capped so the line still fits on tablets */
    font-size: min(6.4vw, 34px);
    letter-spacing: 0.3em;
    text-indent: 0.3em;
  }
  .ly_concept_ttl + .ly_concept_txt {
    margin-top: 11vw;
  }
  .ly_concept_txt {
    margin-top: 9vw;
    font-size: 3.6vw;
    line-height: 2.5;
  }

  .ly_feature,
  .ly_feature--lead {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 11vw;
    padding: 22vw 0 23vw;
  }
  .ly_feature_body {
    display: block;
    padding: 0 var(--gutter);
  }
  .ly_feature_body::before {
    display: block;
    margin-bottom: 5vw;
  }
  .ly_feature_body > .ly_feature_ttl {
    writing-mode: horizontal-tb;
  }
  .ly_feature_media {
    width: 94vw;
    margin-left: 10vw;
  }
  .ly_feature_media img,
  .ly_feature--lead .ly_feature_media img {
    height: 68vw;
  }
  .ly_feature_ttl,
  .ly_feature--lead .ly_feature_ttl {
    font-size: 6vw;
  }
  .ly_feature_txt,
  .ly_feature--lead .ly_feature_txt {
    margin-top: 7vw;
    font-size: 3.5vw;
  }
  .ly_feature_txt + .ly_feature_txt {
    margin-top: 5vw;
  }
  .ly_uses {
    margin-top: 8vw;
  }
  .ly_uses dt {
    padding-top: 4.5vw;
    font-size: 3.9vw;
  }
  .ly_uses dd {
    margin-top: 1.5vw;
    padding-bottom: 4.5vw;
    font-size: 3.4vw;
  }
  .ly_link {
    margin-top: 10vw;
  }

  .ly_info {
    padding: 22vw var(--gutter) 23vw;
  }
  .ly_info_list {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 0;
    margin-top: 12vw;
  }
  .ly_info_list dt {
    margin-top: 7vw;
    padding-top: 3vw;
  }
  .ly_info_list dd {
    border-top: 0;
    padding-top: 1.5vw;
    font-size: 3.5vw;
  }

  .ly_news_sec {
    padding: 20vw var(--gutter) 21vw;
  }
  .ly_news {
    margin-top: 8vw;
  }
  .ly_news a {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 2vw;
    padding: 5.5vw 0;
  }
  .ly_news_txt {
    font-size: 3.9vw;
  }

  .ly_reserve {
    padding: 20vw 7vw 22vw;
  }
  .ly_reserve_ja {
    font-size: 4.4vw;
  }

  .ly_footer {
    padding: 18vw 7vw 20vw;
  }
  .ly_fnav {
    margin-top: 11vw;
  }
  .ly_fnav ul {
    gap: 1.2em 2em;
  }
  .ly_fnav a {
    font-size: 3.7vw;
  }
  .ly_flinks {
    margin-top: 9vw;
  }
  .ly_sns {
    margin-top: 9vw;
  }
  .ly_cp {
    margin-top: 11vw;
  }
}

@media (max-width: 767px) {
  .block_mainvisual {
    min-height: 100vh;
    min-height: 100dvh;
  }
}

/* =============================================
   News list, article, form, 404.
   Built from the same vocabulary as the other lower pages: hairline rules in
   gold, Latin eyebrows in italic, wide-set Mincho headings.
   The article and form rules also target the class names WordPress and
   Contact Form 7 print (wp-block-*, wpcf7-*), so the static pages and the
   theme share one stylesheet.
   ============================================= */

/* --- a page head without a photograph: article, 404 --- */
.ly_phead3 {
  padding: calc(var(--header-h) + 9vw) var(--gutter) 0;
}
.ly_phead3_meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.8em 1.4em;
  margin-top: 2.4vw;
  font-size: 12px;
  letter-spacing: 0.1em;
  color: var(--muted);
}
.ly_phead3_ttl {
  margin-top: 1.4vw;
  max-width: 66vw;
  font-size: clamp(22px, 2.2vw, 36px);
  font-weight: 400;
  letter-spacing: 0.12em;
  line-height: 1.75;
  color: var(--ink);
  word-break: auto-phrase;
  text-wrap: balance;
}

/* --- news list: category filter, rows with a category mark, pager --- */
.ly_cats {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8em 2.6em;
  font-size: clamp(12.5px, 0.95vw, 15px);
  letter-spacing: 0.14em;
}
.ly_cats a {
  position: relative;
  display: block;
  padding-bottom: 0.6em;
  color: var(--muted) !important;
  transition: color 0.4s;
}
.ly_cats a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1px;
  background: var(--accent);
  transform: scaleX(0);
  transform-origin: right center;
  transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}
.ly_cats a:hover,
.ly_cats a[aria-current] {
  color: var(--ink) !important;
}
.ly_cats a:hover::after,
.ly_cats a[aria-current]::after {
  transform: scaleX(1);
  transform-origin: left center;
}
.ly_news--cat {
  margin-top: 4vw;
  max-width: 76vw;
}
.ly_news--cat a {
  grid-template-columns: 7.5em 8.5em 1fr;
}
.ly_news_cat {
  justify-self: start;
  padding: 0.1em 0.9em;
  border: 1px solid var(--rule);
  font-size: 11px;
  line-height: 1.8;
  letter-spacing: 0.12em;
  white-space: nowrap;
  color: var(--accent);
}
.ly_pager {
  display: flex;
  align-items: baseline;
  gap: 1.8em;
  margin-top: 5vw;
  font-size: 16px;
  letter-spacing: 0.1em;
}
.ly_pager,
.ly_pager * {
  font-family: var(--latin-serif) !important;
}
.ly_pager a,
.ly_pager span {
  position: relative;
  padding-bottom: 0.5em;
  color: var(--muted) !important;
  transition: color 0.4s;
}
.ly_pager a:hover {
  color: var(--ink) !important;
}
.ly_pager [aria-current] {
  color: var(--accent) !important;
}
.ly_pager [aria-current]::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1px;
  background: var(--accent);
}
.ly_pager_next,
.ly_pager_prev {
  font-style: italic;
}
.ly_pager_next {
  margin-left: 1em;
}

/* --- article body: what the block editor prints for a post --- */
.ly_article {
  padding: 6vw var(--gutter) 8vw;
}
/* measures are in vw, not em: the template sets a 10px root, so an em cap
   would differ from one element to the next */
.ly_article > * {
  max-width: 50vw;
}
.ly_article > :first-child {
  margin-top: 0;
}
.ly_article > .wp-block-media-text,
.ly_article > .wp-block-gallery,
.ly_article > .wp-block-table,
.ly_article > .alignwide {
  max-width: 66vw;
}
.ly_article p,
.ly_article li {
  font-size: clamp(14px, 1.08vw, 17px);
  line-height: 2.3;
  letter-spacing: 0.07em;
  color: var(--ink-soft);
  word-break: auto-phrase;
  text-wrap: pretty;
}
.ly_article p {
  margin-top: 1.8em;
}
.ly_article h2 {
  margin-top: 3.6em;
  padding-top: 1.5em;
  border-top: 1px solid var(--rule);
  font-size: clamp(18px, 1.6vw, 26px);
  font-weight: 400;
  letter-spacing: 0.14em;
  line-height: 1.75;
  color: var(--ink);
}
.ly_article h3 {
  margin-top: 3em;
  padding-left: 1.1em;
  border-left: 1px solid var(--accent);
  font-size: clamp(16px, 1.3vw, 21px);
  font-weight: 400;
  letter-spacing: 0.14em;
  line-height: 1.75;
  color: var(--ink);
}
.ly_article h4,
.ly_article h5,
.ly_article h6 {
  margin-top: 2.8em;
  font-size: clamp(13px, 1vw, 15px);
  font-weight: 400;
  letter-spacing: 0.24em;
  color: var(--accent);
}
.ly_article h2 strong,
.ly_article h3 strong {
  font-weight: 400;
}
.ly_article strong {
  font-weight: 500;
  color: var(--ink);
}
/* the editor's highlight becomes a gold underlay instead of a bright marker */
.ly_article mark {
  padding: 0;
  background: linear-gradient(transparent 68%, rgba(199, 171, 109, 0.3) 0) !important;
  color: inherit !important;
}
.ly_article a:not(.wp-block-button__link) {
  color: var(--ink) !important;
  text-decoration: underline;
  text-decoration-color: var(--accent);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.35em;
  transition: opacity 0.4s;
}
.ly_article a:not(.wp-block-button__link):hover {
  opacity: 0.6;
}
.ly_article ul,
.ly_article ol {
  margin-top: 1.8em;
}
.ly_article ul > li {
  position: relative;
  padding-left: 1.6em;
}
.ly_article ul > li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 1.15em;
  width: 0.8em;
  height: 1px;
  background: var(--accent);
}
.ly_article ol {
  counter-reset: ly-ol;
}
.ly_article ol > li {
  position: relative;
  padding-left: 2.2em;
  counter-increment: ly-ol;
}
.ly_article ol > li::before {
  content: counter(ly-ol, decimal-leading-zero);
  position: absolute;
  left: 0;
  font-family: var(--latin-serif) !important;
  font-style: italic;
  color: var(--accent);
}
.ly_article figure {
  margin: 2.8em 0 0;
}
.ly_article img {
  display: block;
  width: 100%;
  height: auto;
  filter: saturate(0.9);
}
.ly_article figcaption {
  margin-top: 0.9em;
  font-size: 12px;
  line-height: 1.8;
  letter-spacing: 0.08em;
  text-align: left;
  color: var(--muted);
}
.ly_article hr {
  width: 100%;
  height: 1px;
  margin: 3.6em 0 0;
  border: 0;
  background: var(--rule);
}
.ly_article blockquote {
  margin: 2.8em 0 0;
  padding-left: 1.8em;
  border-left: 1px solid var(--accent);
}
.ly_article blockquote p:first-child {
  margin-top: 0;
}
.ly_article blockquote cite {
  display: block;
  margin-top: 1em;
  font-size: 12px;
  font-style: normal;
  letter-spacing: 0.1em;
  color: var(--muted);
}
.ly_article table {
  width: 100%;
  border-collapse: collapse;
  border-top: 1px solid var(--rule);
}
.ly_article th,
.ly_article td {
  padding: 1em 1.2em 1em 0;
  border: 0;
  border-bottom: 1px solid var(--rule);
  font-size: clamp(13px, 1.02vw, 16px);
  line-height: 1.9;
  letter-spacing: 0.07em;
  text-align: left;
  vertical-align: top;
  color: var(--ink-soft);
}
.ly_article th,
.ly_article td:first-child {
  width: 9em;
  font-weight: 400;
  letter-spacing: 0.2em;
  white-space: nowrap;
  color: var(--ink);
}
/* photo beside text, and a row of photos */
.ly_article .wp-block-media-text {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
  gap: 3.4vw;
  align-items: center;
  margin-top: 3.4em;
}
.ly_article .wp-block-media-text > figure,
.ly_article .wp-block-media-text__media {
  margin: 0;
}
.ly_article .wp-block-media-text__content {
  padding: 0;
}
.ly_article .wp-block-media-text__content > :first-child {
  margin-top: 0;
}
.ly_article .wp-block-gallery {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.2vw;
}
.ly_article .wp-block-gallery figure {
  margin: 0;
}
.ly_article .wp-block-gallery img {
  aspect-ratio: 4 / 3;
  object-fit: cover;
}
/* WordPress sizes the photos of a gallery with its own flex rules, written with
   an #id in the selector so they are hard to override; these match that weight
   and hand the layout back to the grid above */
.ly_article .wp-block-gallery.has-nested-images figure.wp-block-image:not(#individual-image) {
  display: block;
  width: 100%;
  margin: 0;
}
.ly_article .wp-block-gallery.has-nested-images figure.wp-block-image:not(#individual-image) img {
  flex: none;
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}
.ly_article .wp-block-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 1em 1.6em;
  margin-top: 3em;
}
.ly_article .wp-block-button__link,
.ly_btn {
  display: inline-block;
  min-width: 15em;
  padding: 1.2em 2.6em;
  border: 1px solid var(--accent);
  border-radius: 0;
  background: transparent;
  font-size: clamp(13px, 1vw, 15px);
  line-height: 1.6;
  letter-spacing: 0.3em;
  text-align: center;
  text-decoration: none;
  color: var(--accent) !important;
  cursor: pointer;
  transition: background-color 0.45s, color 0.45s;
}
.ly_article .wp-block-button__link:hover,
.ly_btn:hover {
  background: var(--accent);
  color: var(--bg-base) !important;
}

/* a phone number never breaks across lines */
.ly_lead2 a {
  text-decoration: underline;
  text-decoration-color: var(--accent);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.35em;
}
.ly_lead2 a[href^="tel:"],
.ly_article a[href^="tel:"] {
  white-space: nowrap;
}

/* previous / list / next under an article */
.ly_postnav {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  gap: 3vw;
  align-items: start;
  margin: 0 var(--gutter);
  padding: 3vw 0 9vw;
  border-top: 1px solid var(--rule);
}
.ly_postnav_item {
  display: block;
  transition: opacity 0.5s;
}
.ly_postnav_item:hover {
  opacity: 0.6;
}
.ly_postnav_item--next {
  text-align: right;
}
.ly_postnav_en {
  display: block;
  font-family: var(--latin-serif) !important;
  font-style: italic;
  font-size: 14px;
  letter-spacing: 0.1em;
  color: var(--accent);
}
.ly_postnav_ttl {
  display: -webkit-box;
  margin-top: 0.6em;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  font-size: clamp(12.5px, 0.98vw, 15px);
  line-height: 1.9;
  letter-spacing: 0.07em;
  color: var(--ink-soft);
}
.ly_postnav .ly_link {
  margin-top: 0;
}

/* --- access: the map beside the address and the nearest stations --- */
.ly_access_grid {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  gap: 4vw;
  align-items: start;
  margin-top: 4vw;
}
.ly_access_map {
  position: relative;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  border: 1px solid var(--rule);
  background: #1b1f26;
}
/* the map is turned to the night palette of the page: inverted, then the hues
   rotated back, so the pin stays red and the place card stays readable */
.ly_access_map iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  filter: invert(0.9) hue-rotate(180deg) saturate(0.55) brightness(0.95);
}
.ly_access_addr {
  font-size: clamp(14px, 1.15vw, 18px);
  line-height: 2;
  letter-spacing: 0.08em;
  color: var(--ink);
}
.ly_access_zip {
  display: block;
  font-size: 12px;
  letter-spacing: 0.1em;
  color: var(--muted);
}
.ly_access_body .ly_link {
  margin-top: 1.6vw;
}
.ly_access_st {
  margin-top: 3vw;
  border-top: 1px solid var(--rule);
}
.ly_access_st li {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  column-gap: 1.5em;
  row-gap: 0.2em;
  align-items: baseline;
  padding: 1.2vw 0;
  border-bottom: 1px solid var(--rule);
}
.ly_access_name {
  font-size: clamp(15px, 1.25vw, 19px);
  letter-spacing: 0.12em;
  color: var(--ink);
}
.ly_access_line {
  grid-column: 1;
  font-size: 12px;
  letter-spacing: 0.08em;
  color: var(--muted);
}
.ly_access_min {
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: center;
  font-size: clamp(12px, 0.95vw, 14px);
  letter-spacing: 0.08em;
  color: var(--ink-soft);
}
.ly_access_min b {
  margin: 0 0.15em;
  font-family: var(--latin-serif) !important;
  font-size: 2em;
  font-weight: 400;
  font-variant-numeric: lining-nums;
  line-height: 1;
  color: var(--accent);
}
.ly_info_list dd a {
  color: var(--ink) !important;
  text-decoration: underline;
  text-decoration-color: var(--accent);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.35em;
}

/* --- enquiry form --- */
.ly_notice {
  max-width: 76vw;
  margin-top: 4vw;
  padding: 2.4vw 3vw 2.6vw;
  border: 1px solid var(--rule);
}
.ly_notice_ttl {
  font-size: clamp(13px, 1.02vw, 16px);
  letter-spacing: 0.2em;
  color: var(--accent);
}
.ly_notice ul {
  margin-top: 1.2vw;
}
.ly_notice li {
  position: relative;
  padding-left: 1.6em;
  font-size: clamp(12.5px, 0.98vw, 15px);
  line-height: 2.2;
  letter-spacing: 0.06em;
  color: var(--ink-soft);
  word-break: auto-phrase;
}
.ly_notice li::before {
  content: "";
  position: absolute;
  left: 0.2em;
  top: 0.95em;
  width: 5px;
  height: 5px;
  border: 1px solid var(--accent);
  transform: rotate(45deg);
}
.ly_form {
  max-width: 76vw;
  margin-top: 5vw;
  border-top: 1px solid var(--rule);
}
.ly_form_row {
  display: grid;
  grid-template-columns: 20vw minmax(0, 1fr);
  column-gap: 3vw;
  align-items: start;
  padding: 2vw 0;
  border-bottom: 1px solid var(--rule);
}
.ly_form_label {
  padding-top: 0.75em;
  font-size: clamp(13px, 1.02vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.1em;
  color: var(--ink);
}
.ly_form_req {
  display: inline-block;
  margin-left: 0.9em;
  padding: 0 0.55em;
  border: 1px solid var(--accent);
  font-size: 10.5px;
  line-height: 1.7;
  letter-spacing: 0.1em;
  vertical-align: 0.1em;
  color: var(--accent);
}
.ly_form_sub {
  display: block;
  margin-bottom: 1em;
  font-size: 12.5px;
  letter-spacing: 0.14em;
  color: var(--muted);
}
/* a second group in the same row (dinner choices, then Saturday lunch): room above its little heading */
.ly_form_field .wpcf7-form-control-wrap + .ly_form_sub {
  margin-top: 1.8em;
}
/* dinner choices grouped by kind (月替わり / 水たき / しゃぶしゃぶ / 御祝会席・その他), each listed from the dearest */
.ly_form_group {
  display: block;
  margin-bottom: 0.4em;
  font-size: 13px;
  letter-spacing: 0.12em;
  color: var(--accent);
}
.ly_form_field .wpcf7-form-control-wrap + .ly_form_group {
  margin-top: 1.1em;
}
.ly_form_hint {
  margin-top: 0.9em;
  font-size: 12px;
  line-height: 2;
  letter-spacing: 0.05em;
  color: var(--muted);
}
.ly_form_field > .ly_form_hint:first-child {
  margin: 0 0 0.9em;
}
.ly_form .wpcf7-form-control-wrap {
  display: block;
}
.ly_form input[type="text"],
.ly_form input[type="tel"],
.ly_form input[type="email"],
.ly_form input[type="number"],
.ly_form input[type="date"],
.ly_form select,
.ly_form textarea {
  display: block;
  width: 100%;
  max-width: 34em;
  margin: 0;
  padding: 0.85em 1.1em;
  border: 1px solid var(--rule);
  border-radius: 0;
  background: rgba(233, 228, 216, 0.04);
  -webkit-appearance: none;
  appearance: none;
  color-scheme: dark;
  /* 16px keeps iOS from zooming the page when a field takes focus */
  font-size: 16px;
  line-height: 1.7;
  letter-spacing: 0.06em;
  color: var(--ink);
  transition: border-color 0.4s, background-color 0.4s;
}
.ly_form input[type="number"] {
  max-width: 8em;
}
.ly_form input[type="date"] {
  max-width: 15em;
}
.ly_form textarea {
  max-width: none;
  min-height: 12em;
  resize: vertical;
}
.ly_form input:focus,
.ly_form select:focus,
.ly_form textarea:focus {
  outline: none;
  border-color: var(--accent);
  background: rgba(233, 228, 216, 0.08);
}
.ly_form ::placeholder {
  color: rgba(233, 228, 216, 0.3);
}
/* checkboxes: a hairline square that takes a gold tick */
.ly_form .wpcf7-checkbox,
.ly_form .wpcf7-radio {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 3vw;
  max-width: 46vw;
  padding-top: 0.3em;
}
.ly_form .wpcf7-list-item {
  margin: 0;
}
.ly_form .wpcf7-list-item label {
  position: relative;
  display: block;
  padding-left: 2em;
  font-size: clamp(13px, 1.02vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.06em;
  color: var(--ink-soft);
  cursor: pointer;
}
.ly_form .wpcf7-list-item input {
  position: absolute;
  left: 0;
  top: 0;
  width: 1.8em;
  height: 1.8em;
  margin: 0;
  opacity: 0;
  cursor: pointer;
}
.ly_form .wpcf7-list-item-label::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.35em;
  width: 1.05em;
  height: 1.05em;
  border: 1px solid var(--rule);
  background: rgba(233, 228, 216, 0.04);
  transition: border-color 0.3s;
}
.ly_form .wpcf7-list-item-label::after {
  content: "";
  position: absolute;
  left: 0.36em;
  top: 0.48em;
  width: 0.34em;
  height: 0.62em;
  border: solid var(--accent);
  border-width: 0 1.5px 1.5px 0;
  opacity: 0;
  transform: rotate(45deg) scale(0.6);
  transition: opacity 0.25s, transform 0.25s;
}
.ly_form .wpcf7-list-item input:checked + .wpcf7-list-item-label {
  color: var(--ink);
}
.ly_form .wpcf7-list-item input:checked + .wpcf7-list-item-label::before,
.ly_form .wpcf7-list-item input:focus-visible + .wpcf7-list-item-label::before {
  border-color: var(--accent);
}
.ly_form .wpcf7-list-item input:checked + .wpcf7-list-item-label::after {
  opacity: 1;
  transform: rotate(45deg) scale(1);
}
.ly_form_submit {
  max-width: 76vw;
  margin-top: 4vw;
  text-align: center;
}
.ly_form_submit .ly_note {
  max-width: none;
  margin: 0 0 2.6vw;
  font-size: 13px;
  text-align: center;
  color: var(--ink-soft);
}
/* Cloudflare Turnstile（ロボットよけ。WordPress のみ）。送信ボタンの上に中央寄せ。ふだんは自動で通り、怪しいときだけチェック欄が出る */
.ly_form_captcha {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 0 0 2.6vw;
}
.ly_form_captcha .cf-turnstile:empty {
  display: none;
}
.ly_form_captcha_msg {
  margin-top: 0.8em;
  font-size: 13px;
  color: #e08a7a;
}
.ly_form_submit input[type="submit"],
.ly_form_submit button {
  min-width: 17em;
  padding: 1.3em 3em;
  border: 1px solid var(--accent);
  border-radius: 0;
  background: transparent;
  -webkit-appearance: none;
  appearance: none;
  font-size: 15px;
  letter-spacing: 0.5em;
  text-indent: 0.5em;
  color: var(--accent);
  cursor: pointer;
  transition: background-color 0.45s, color 0.45s;
}
.ly_form_submit input[type="submit"]:hover,
.ly_form_submit input[type="submit"]:focus-visible,
.ly_form_submit button:hover {
  outline: none;
  background: var(--accent);
  color: var(--bg-base);
}
/* Contact Form 7: validation and result messages */
.ly_form .wpcf7-not-valid {
  border-color: #c98a6b !important;
}
.wpcf7 .wpcf7-not-valid-tip {
  display: block;
  margin-top: 0.7em;
  font-size: 12px;
  letter-spacing: 0.06em;
  color: #d9a084;
}
.wpcf7 form .wpcf7-response-output {
  max-width: 76vw;
  margin: 3vw 0 0;
  padding: 1.2em 1.6em;
  border: 1px solid var(--rule);
  font-size: 13px;
  line-height: 2;
  letter-spacing: 0.06em;
  color: var(--ink-soft);
}
.wpcf7 form.sent .wpcf7-response-output {
  border-color: var(--accent);
  color: var(--ink);
}
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.failed .wpcf7-response-output {
  border-color: #c98a6b;
}
.wpcf7-spinner {
  display: none;
}
/* Contact Form 7: confirmation and thank-you screens (built by script.js) */
.wpcf7 form.is-confirming .ly_form,
.wpcf7 form.is-confirming .ly_form_submit,
.wpcf7 form.is-confirming .wpcf7-response-output,
.wpcf7 form.is-done .ly_form,
.wpcf7 form.is-done .ly_form_submit,
.wpcf7 form.is-done .wpcf7-response-output {
  display: none;
}
.ly_confirm,
.ly_formdone {
  max-width: 76vw;
  margin-top: 5vw;
}
.ly_confirm_ttl,
.ly_formdone_ttl {
  font-size: clamp(18px, 1.6vw, 24px);
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: 0.2em;
  text-align: center;
  color: var(--ink);
}
.ly_confirm_ttl:focus,
.ly_formdone_ttl:focus {
  outline: none;
}
.ly_confirm_lead {
  margin: 1.4vw 0 3.4vw;
  font-size: 13px;
  line-height: 2;
  letter-spacing: 0.06em;
  text-align: center;
  color: var(--ink-soft);
}
.ly_confirm_list {
  display: grid;
  grid-template-columns: 20vw minmax(0, 1fr);
  column-gap: 3vw;
  margin: 0;
  border-top: 1px solid var(--rule);
}
.ly_confirm_list dt,
.ly_confirm_list dd {
  margin: 0;
  padding: 1.6vw 0;
  border-bottom: 1px solid var(--rule);
  font-size: clamp(13px, 1.02vw, 16px);
  line-height: 1.8;
  letter-spacing: 0.1em;
}
.ly_confirm_list dt {
  color: var(--ink-soft);
}
.ly_confirm_list dd {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  color: var(--ink);
}
/* PC: back on the left, send on the right */
.ly_confirm_actions {
  display: flex;
  justify-content: center;
  gap: 2vw;
  margin-top: 4vw;
}
.ly_confirm_actions button {
  min-width: 17em;
  padding: 1.3em 3em;
  border: 1px solid var(--rule);
  border-radius: 0;
  background: transparent;
  -webkit-appearance: none;
  appearance: none;
  font-size: 15px;
  letter-spacing: 0.3em;
  text-indent: 0.3em;
  color: var(--ink-soft);
  cursor: pointer;
  transition: background-color 0.45s, border-color 0.45s, color 0.45s, opacity 0.3s;
}
.ly_confirm_actions .ly_confirm_send {
  border-color: var(--accent);
  background: var(--accent);
  color: var(--bg-base);
}
.ly_confirm_back:hover,
.ly_confirm_back:focus-visible {
  outline: none;
  border-color: var(--accent);
  color: var(--accent);
}
.ly_confirm_send:hover,
.ly_confirm_send:focus-visible {
  outline: none;
  opacity: 0.85;
}
.ly_confirm_actions button:disabled {
  opacity: 0.5;
  cursor: default;
}
.ly_formdone {
  padding: 5vw 4vw;
  border: 1px solid var(--rule);
  background: rgba(233, 228, 216, 0.03);
  text-align: center;
}
.ly_formdone_ttl::after {
  content: "";
  display: block;
  width: 40px;
  height: 1px;
  margin: 1.6vw auto 0;
  background: var(--accent);
}
.ly_formdone_msg {
  margin: 2.4vw 0 1.2vw;
  font-size: clamp(14px, 1.1vw, 17px);
  line-height: 2;
  letter-spacing: 0.08em;
  color: var(--ink);
}
.ly_formdone_note {
  max-width: 38em;
  margin: 0 auto 3vw;
  font-size: 13px;
  line-height: 2;
  letter-spacing: 0.05em;
  white-space: pre-line;
  text-align: left;
  color: var(--ink-soft);
}
.ly_formdone a.ly_formdone_home {
  display: inline-block;
  min-width: 17em;
  padding: 1.2em 3em;
  border: 1px solid var(--accent);
  font-size: 14px;
  letter-spacing: 0.3em;
  text-indent: 0.3em;
  color: var(--accent);
  transition: background-color 0.45s, color 0.45s;
}
.ly_formdone a.ly_formdone_home:hover,
.ly_formdone a.ly_formdone_home:focus-visible {
  outline: none;
  background: var(--accent);
  color: var(--bg-base);
}

/* --- 404 --- */
.ly_notfound {
  padding: calc(var(--header-h) + 11vw) 6vw 14vw;
  text-align: center;
}
.ly_notfound_no {
  display: block;
  font-family: var(--latin-serif) !important;
  font-style: italic;
  font-size: clamp(64px, 9vw, 140px);
  /* the face defaults to old-style figures, which set the zero as a small "o" */
  font-variant-numeric: lining-nums;
  line-height: 1;
  letter-spacing: 0.06em;
  color: var(--accent);
}
.ly_notfound_no::after {
  content: "";
  display: block;
  width: 1px;
  height: 4vw;
  margin: 2.4vw auto 2.8vw;
  background: linear-gradient(to bottom, var(--accent), rgba(199, 171, 109, 0));
}
.ly_notfound_ttl {
  font-size: clamp(19px, 1.9vw, 30px);
  font-weight: 400;
  letter-spacing: 0.22em;
  text-indent: 0.22em;
  line-height: 1.8;
  color: var(--ink);
}
.ly_notfound_txt {
  margin-top: 2.6vw;
  font-size: clamp(13px, 1.05vw, 17px);
  line-height: 2.4;
  letter-spacing: 0.1em;
  color: var(--ink-soft);
}
.ly_notfound_links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1.6vw 4vw;
  margin-top: 2vw;
}

@media (max-width: 1023px) {
  .ly_phead3 {
    padding-top: calc(var(--header-h) + 16vw);
  }
  .ly_phead3_meta {
    margin-top: 6vw;
    font-size: 3vw;
  }
  .ly_phead3_ttl {
    margin-top: 4vw;
    font-size: 5.6vw;
  }
  .ly_cats {
    gap: 3vw 6vw;
    font-size: 3.4vw;
  }
  .ly_news--cat {
    margin-top: 9vw;
    max-width: none;
  }
  /* date and category on one line, the title beneath */
  .ly_news--cat a {
    grid-template-columns: auto 1fr;
    column-gap: 4vw;
    row-gap: 2vw;
    padding: 5vw 0;
  }
  .ly_news--cat .ly_news_txt {
    grid-column: 1 / -1;
    font-size: 3.6vw;
    line-height: 1.9;
  }
  .ly_news_cat {
    font-size: 2.7vw;
  }
  .ly_pager {
    margin-top: 11vw;
  }
  .ly_article {
    padding: 12vw var(--gutter) 16vw;
  }
  .ly_article > *,
  .ly_article > .wp-block-media-text,
  .ly_article > .wp-block-gallery,
  .ly_article > .wp-block-table,
  .ly_article > .alignwide {
    max-width: none;
  }
  .ly_article p,
  .ly_article li {
    font-size: 3.7vw;
  }
  .ly_article h2 {
    font-size: 4.8vw;
  }
  .ly_article h3 {
    font-size: 4.3vw;
  }
  .ly_article h4,
  .ly_article h5,
  .ly_article h6 {
    font-size: 3.5vw;
  }
  .ly_article th,
  .ly_article td {
    font-size: 3.5vw;
  }
  .ly_article th,
  .ly_article td:first-child {
    width: 6.5em;
  }
  .ly_article .wp-block-media-text {
    grid-template-columns: minmax(0, 1fr);
    gap: 6vw;
  }
  .ly_article .wp-block-gallery {
    gap: 2vw;
  }
  .ly_article .wp-block-button__link,
  .ly_btn {
    width: 100%;
    font-size: 3.5vw;
  }
  .ly_article .wp-block-buttons {
    display: block;
  }
  .ly_postnav {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 8vw 6vw;
    padding: 9vw 0 18vw;
  }
  .ly_postnav > .ly_link {
    grid-column: 1 / -1;
    grid-row: 2;
    justify-self: center;
  }
  .ly_postnav_ttl {
    font-size: 3.3vw;
  }
  .ly_access_grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 8vw;
    margin-top: 9vw;
  }
  .ly_access_addr {
    font-size: 4vw;
  }
  .ly_access_zip {
    font-size: 3vw;
  }
  .ly_access_body .ly_link {
    margin-top: 5vw;
  }
  .ly_access_st {
    margin-top: 8vw;
  }
  .ly_access_st li {
    padding: 4vw 0;
  }
  .ly_access_name {
    font-size: 4.2vw;
  }
  .ly_access_line {
    font-size: 3vw;
  }
  .ly_access_min {
    font-size: 3.3vw;
  }
  .ly_notice {
    max-width: none;
    margin-top: 9vw;
    padding: 6vw 6vw 7vw;
  }
  .ly_notice_ttl {
    font-size: 3.7vw;
  }
  .ly_notice ul {
    margin-top: 3vw;
  }
  .ly_notice li {
    font-size: 3.4vw;
  }
  .ly_form,
  .ly_form_submit,
  .wpcf7 form .wpcf7-response-output {
    max-width: none;
  }
  .ly_form {
    margin-top: 11vw;
  }
  .ly_form_row {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 3vw;
    padding: 6vw 0;
  }
  .ly_form_label {
    padding-top: 0;
    font-size: 3.7vw;
  }
  .ly_form input[type="text"],
  .ly_form input[type="tel"],
  .ly_form input[type="email"],
  .ly_form select {
    max-width: none;
  }
  .ly_form .wpcf7-checkbox,
  .ly_form .wpcf7-radio {
    grid-template-columns: minmax(0, 1fr);
    gap: 3.4vw;
    max-width: none;
  }
  .ly_phead3_ttl {
    max-width: none;
  }
  .ly_form .wpcf7-list-item label {
    font-size: 3.7vw;
  }
  .ly_form_hint {
    font-size: 3.1vw;
  }
  .ly_form_submit {
    margin-top: 11vw;
  }
  .ly_form_submit .ly_note {
    margin-bottom: 8vw;
    font-size: 3.3vw;
    text-align: left;
  }
  .ly_form_submit input[type="submit"],
  .ly_form_submit button {
    width: 100%;
    min-width: 0;
  }
  .ly_confirm,
  .ly_formdone {
    max-width: none;
    margin-top: 11vw;
  }
  .ly_confirm_ttl,
  .ly_formdone_ttl {
    font-size: 4.6vw;
  }
  .ly_confirm_lead {
    margin: 4vw 0 8vw;
    font-size: 3.3vw;
    text-align: left;
  }
  .ly_confirm_list {
    grid-template-columns: minmax(0, 1fr);
  }
  .ly_confirm_list dt {
    padding: 5vw 0 1vw;
    border-bottom: 0;
    font-size: 3.3vw;
    color: var(--muted);
  }
  .ly_confirm_list dd {
    padding: 0 0 5vw;
    font-size: 3.9vw;
  }
  /* SP: send on top */
  .ly_confirm_actions {
    flex-direction: column-reverse;
    gap: 4vw;
    margin-top: 10vw;
  }
  .ly_confirm_actions button,
  .ly_formdone a.ly_formdone_home {
    width: 100%;
    min-width: 0;
  }
  .ly_formdone {
    padding: 11vw 6vw;
  }
  .ly_formdone_ttl::after {
    margin-top: 5vw;
  }
  .ly_formdone_msg {
    margin: 7vw 0 4vw;
    font-size: 3.9vw;
    text-align: left;
  }
  .ly_formdone_note {
    margin-bottom: 9vw;
    font-size: 3.3vw;
  }
  .ly_notfound {
    padding: calc(var(--header-h) + 22vw) 7vw 26vw;
  }
  .ly_notfound_no::after {
    height: 12vw;
    margin: 6vw auto 8vw;
  }
  .ly_notfound_ttl {
    font-size: 4.8vw;
    letter-spacing: 0.14em;
    text-indent: 0.14em;
  }
  .ly_notfound_txt {
    margin-top: 7vw;
    font-size: 3.6vw;
  }
  .ly_notfound_links {
    gap: 2vw 8vw;
    margin-top: 6vw;
  }
}

/* =============================================
   TOP hero: full-screen photographs crossfading with a slow push-in
   (opacity over ~2.5s, scale over 9s, as on the reference site), the
   wordmark and the catch copy centred on top
   ============================================= */
.ly_hero {
  position: relative;
  height: 100vh;
  height: 100svh;
  min-height: 560px;
  overflow: hidden;
  background: #0b0e13;
}
.ly_hero_slides {
  position: absolute;
  inset: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}
.ly_hero_slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 2.6s ease;
}
.ly_hero_slide.is-prev {
  opacity: 1;
  z-index: 1;
}
.ly_hero_slide.is-active {
  opacity: 1;
  z-index: 2;
}
.ly_hero_slide img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1.02);
  transition: transform 9s linear;
}
.ly_hero_slide.is-active img,
.ly_hero_slide.is-prev img {
  transform: scale(1.1);
}
/* a veil for the type, heavier at the top (under the bar) and the foot */
.ly_hero::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  background:
    radial-gradient(ellipse 58% 46% at 50% 52%, rgba(8, 10, 14, 0.55), rgba(8, 10, 14, 0) 72%),
    linear-gradient(180deg, rgba(8, 10, 14, 0.45) 0%, rgba(8, 10, 14, 0.08) 26%, rgba(8, 10, 14, 0.12) 62%, rgba(18, 22, 28, 0.9) 100%);
}
.ly_hero_body {
  position: absolute;
  inset: 0;
  z-index: 4;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: var(--header-h) 6vw 0;
  text-align: center;
}
.ly_hero_ttl {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 0;
  font-weight: 300;
}
.ly_hero_logo {
  display: block;
  width: clamp(220px, 24vw, 400px);
  height: auto;
  filter: drop-shadow(0 2px 22px rgba(0, 0, 0, 0.6));
}
.ly_hero_copy {
  display: block;
  margin-top: 3.2vw;
  font-size: clamp(18px, 1.9vw, 32px);
  font-weight: 300;
  line-height: 1.85;
  letter-spacing: 0.2em;
  text-indent: 0.2em;
  color: #f4f1ea;
  text-shadow: 0 2px 30px rgba(0, 0, 0, 0.8);
}
.ly_hero_copy em {
  font-style: normal;
  color: var(--gold);
}
.ly_hero_sub {
  margin-top: 1.8vw;
  font-size: clamp(12px, 1.05vw, 16px);
  line-height: 2.3;
  letter-spacing: 0.16em;
  color: rgba(243, 240, 233, 0.9);
  text-shadow: 0 2px 22px rgba(0, 0, 0, 0.8);
}
/* slide counter, bottom right */
.ly_hero_count {
  position: absolute;
  right: 4.6vw;
  bottom: 4vw;
  z-index: 4;
  display: flex;
  align-items: center;
  gap: 0.9em;
  font-size: 13px;
  letter-spacing: 0.12em;
  color: rgba(243, 240, 233, 0.7);
}
.ly_hero_count,
.ly_hero_count * {
  font-family: var(--latin-serif) !important;
  font-variant-numeric: lining-nums;
}
.ly_hero_count_cur {
  color: #f4f1ea;
}
.ly_hero_count_sep {
  display: block;
  width: 3em;
  height: 1px;
  background: rgba(243, 240, 233, 0.45);
}
/* scroll cue: a hairline that keeps running down */
.ly_hero_scroll {
  position: absolute;
  left: 50%;
  bottom: 0;
  z-index: 4;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  transform: translateX(-50%);
  font-family: var(--latin-serif) !important;
  font-style: italic;
  font-size: 13px;
  letter-spacing: 0.14em;
  color: rgba(243, 240, 233, 0.8) !important;
}
.ly_hero_scroll::after {
  content: "";
  display: block;
  width: 1px;
  height: 64px;
  background: linear-gradient(to bottom, rgba(243, 240, 233, 0.75) 50%, rgba(243, 240, 233, 0.12) 50%);
  background-size: 1px 200%;
  animation: ly-scroll-line 2.4s cubic-bezier(0.65, 0, 0.35, 1) infinite;
}
@keyframes ly-scroll-line {
  from { background-position: 0 100%; }
  to { background-position: 0 -100%; }
}
@media (prefers-reduced-motion: reduce) {
  .ly_hero_slide img,
  .ly_hero_slide.is-active img,
  .ly_hero_slide.is-prev img {
    transform: none;
    transition: none;
  }
  .ly_hero_scroll::after {
    animation: none;
  }
}

/* =============================================
   TOP: heritage. A black stage: Tsukiji's signature mizutaki, shot on black,
   rises out of the dark on the right; the heading stands in vertical type on
   the left, and the line from 1931 to today runs across the foot in gold.
   The band fades into the page at its top and bottom edges.
   ============================================= */
.ly_heritage {
  position: relative;
  min-height: max(640px, 54vw);
  overflow: hidden;
  background: linear-gradient(180deg, rgba(5, 6, 8, 0) 0%, #050608 9%, #050608 91%, rgba(5, 6, 8, 0) 100%);
}
/* the photograph (and its veil) dissolve into the stage on the left and at the
   top and bottom, so no edge of the picture shows */
.ly_heritage_bg {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 66vw;
  margin: 0;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 34%), linear-gradient(180deg, transparent 0%, #000 12%, #000 86%, transparent 100%);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(90deg, transparent 0%, #000 34%), linear-gradient(180deg, transparent 0%, #000 12%, #000 86%, transparent 100%);
  mask-composite: intersect;
}
.ly_heritage_bg img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 45%;
}
/* dark at the foot so the timeline reads over the pot */
.ly_heritage_bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(5, 6, 8, 0.95) 0%, rgba(5, 6, 8, 0.4) 26%, rgba(5, 6, 8, 0) 42%);
}
.ly_heritage_cap {
  position: absolute;
  top: 3vw;
  right: 4.6vw;
  z-index: 1;
  display: flex;
  align-items: baseline;
  gap: 0.9em;
  font-size: 12px;
  letter-spacing: 0.1em;
  color: rgba(243, 240, 233, 0.75);
  text-shadow: 0 1px 10px rgba(0, 0, 0, 0.6);
}
.ly_heritage_cap_en {
  font-family: var(--latin-serif) !important;
  font-style: italic;
  font-size: 14px;
  color: var(--accent);
}
.ly_heritage_in {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 6vw;
  min-height: inherit;
  padding: 8vw var(--gutter) 5.4vw;
}
/* the vertical heading with the copy beside it */
.ly_heritage_head {
  display: flex;
  align-items: flex-start;
  gap: 3.6vw;
}
.ly_heritage_ttl {
  writing-mode: vertical-rl;
  font-size: clamp(26px, 2.6vw, 44px);
  font-weight: 400;
  letter-spacing: 0.32em;
  line-height: 1.4;
  color: #f4f1ea;
  text-shadow: 0 2px 24px rgba(0, 0, 0, 0.6);
}
.ly_heritage_body {
  max-width: 30vw;
  padding-top: 0.4vw;
}
.ly_heritage_en {
  display: block;
  font-family: var(--latin-serif) !important;
  font-style: italic;
  font-size: clamp(14px, 1.15vw, 18px);
  letter-spacing: 0.12em;
  color: var(--accent);
}
.ly_heritage_lead {
  margin-top: 1.6vw;
  font-size: clamp(13px, 1.05vw, 17px);
  line-height: 2.3;
  letter-spacing: 0.07em;
  color: var(--ink-soft);
  word-break: auto-phrase;
  text-wrap: pretty;
}
.ly_heritage_body .ly_link {
  margin-top: 2.4vw;
}
/* the timeline: a gold hairline across, a mark at each year */
.ly_heritage_line {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 3vw;
  padding-top: 2.2vw;
}
.ly_heritage_line::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 1px;
  background: linear-gradient(90deg, var(--accent), rgba(199, 171, 109, 0.3) 70%, rgba(199, 171, 109, 0));
}
.ly_heritage_line li {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  column-gap: 1.1em;
  align-items: baseline;
}
.ly_heritage_line li::before {
  content: "";
  position: absolute;
  left: 0;
  top: calc(-2.2vw - 4px);
  width: 7px;
  height: 7px;
  border: 1px solid var(--accent);
  background: #0e1218;
  transform: rotate(45deg);
}
.ly_heritage_year {
  grid-row: span 2;
  font-family: var(--latin-serif) !important;
  font-variant-numeric: lining-nums;
  font-size: clamp(30px, 2.8vw, 46px);
  line-height: 1;
  letter-spacing: 0.04em;
  color: var(--accent);
}
.ly_heritage_era {
  font-size: 12px;
  letter-spacing: 0.14em;
  color: rgba(243, 240, 233, 0.6);
}
.ly_heritage_txt {
  margin-top: 0.3em;
  font-size: clamp(13px, 1.05vw, 16px);
  letter-spacing: 0.1em;
  color: #f4f1ea;
  word-break: auto-phrase;
  text-wrap: balance;
}

@media (max-width: 1023px) {
  .ly_heritage {
    min-height: 0;
  }
  /* on phones the photograph sits on top and the words follow below it */
  .ly_heritage_bg {
    position: relative;
    inset: auto;
    width: 100%;
    -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 12%);
    mask-image: linear-gradient(180deg, transparent 0%, #000 12%);
  }
  .ly_heritage_bg img {
    height: auto;
    aspect-ratio: 4 / 3;
  }
  .ly_heritage_bg::after {
    background: linear-gradient(0deg, rgba(5, 6, 8, 1) 0%, rgba(5, 6, 8, 0) 34%),
      linear-gradient(180deg, rgba(5, 6, 8, 0.8) 0%, rgba(5, 6, 8, 0) 18%);
  }
  .ly_heritage_cap {
    top: auto;
    bottom: 4vw;
    right: var(--gutter);
    font-size: 3vw;
  }
  .ly_heritage_in {
    gap: 12vw;
    padding: 4vw var(--gutter) 18vw;
  }
  .ly_heritage_head {
    gap: 6vw;
  }
  .ly_heritage_ttl {
    font-size: 7vw;
  }
  .ly_heritage_body {
    max-width: none;
    padding-top: 1vw;
  }
  .ly_heritage_en {
    font-size: 3.4vw;
  }
  .ly_heritage_lead {
    margin-top: 4vw;
    font-size: 3.6vw;
  }
  .ly_heritage_body .ly_link {
    margin-top: 7vw;
  }
  /* the timeline turns vertical */
  .ly_heritage_line {
    grid-template-columns: minmax(0, 1fr);
    gap: 7vw;
    padding: 0 0 0 7vw;
  }
  .ly_heritage_line::before {
    left: 3px;
    right: auto;
    top: 2vw;
    bottom: 2vw;
    width: 1px;
    height: auto;
    background: linear-gradient(180deg, var(--accent), rgba(199, 171, 109, 0.3));
  }
  .ly_heritage_line li::before {
    left: calc(-7vw);
    top: 2.2vw;
  }
  .ly_heritage_year {
    font-size: 8vw;
  }
  .ly_heritage_era {
    font-size: 3vw;
  }
  .ly_heritage_txt {
    font-size: 3.7vw;
  }
}

/* =============================================
   Cuisine: the month's kaiseki. A centred heading, a carousel of the
   month's dishes (an editor's Gallery block, turned into a slider by
   site.js), the course card and list, and the month's menu as a PDF.
   ============================================= */
.ly_course_head {
  padding-bottom: 3.4vw;
}
.ly_course_en {
  display: block;
  margin-bottom: 1.2vw;
  font-family: var(--latin-serif) !important;
  font-style: italic;
  font-size: clamp(14px, 1.15vw, 18px);
  letter-spacing: 0.12em;
  color: var(--accent);
}
/* the carousel: a film strip that starts at the page margin and runs off the
   right edge, each dish captioned beneath with its number. WordPress sizes
   gallery photos with an #id in the selector (plus a column class);
   :not(#x):not(#y) outweighs that so the strip sizes them itself */
/* the strip starts at the page margin; slides that have passed slip out to
   the left edge, upcoming ones run off the right */
.ly_course_slider.wp-block-gallery {
  display: block !important;
  margin: 0;
  padding: 0 0 0 var(--gutter);
  overflow: hidden;
}
.ly_course_slider .swiper-wrapper {
  align-items: flex-start;
}
.ly_course_slider.wp-block-gallery figure.wp-block-image:not(#x):not(#y) {
  display: block;
  flex: none;
  width: 40vw;
  margin: 0;
}
.ly_course_slider.wp-block-gallery figure.wp-block-image:not(#x):not(#y) img {
  display: block;
  flex: none;
  width: 100%;
  height: auto;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  filter: saturate(0.9);
}
/* number and name under each photograph; the current one is drawn in gold */
.ly_course_cap {
  display: flex;
  align-items: baseline;
  gap: 1.1em;
  margin-top: 1.1vw;
  padding-top: 1vw;
  border-top: 1px solid var(--rule);
  font-size: clamp(12.5px, 0.98vw, 15px);
  letter-spacing: 0.12em;
  color: var(--ink-soft);
  transition: border-color 0.6s;
}
/* WordPress also lays out a div inside a gallery photo (as a column, without
   margins); this keeps the caption a single row below the photograph */
.ly_course_slider figure.wp-block-image:not(#x):not(#y) > .ly_course_cap {
  flex-direction: row;
  flex-grow: 0;
  margin: 1.1vw 0 0;
}
.ly_course_cap_no {
  font-family: var(--latin-serif) !important;
  font-style: italic;
  font-variant-numeric: lining-nums;
  font-size: 1.05em;
  color: var(--muted);
  transition: color 0.6s;
}
.swiper-slide-active .ly_course_cap {
  border-color: var(--accent);
}
.swiper-slide-active .ly_course_cap_no {
  color: var(--accent);
}
/* WordPress's own caption, if the editor typed one, is restyled to match */
.ly_course_slider figure.wp-block-image > .wp-element-caption:not(.ly_course_cap) {
  display: none;
}
/* before the script runs (or without it), the photos simply sit in a row */
.ly_course_slider.wp-block-gallery:not(.swiper) {
  display: flex !important;
  gap: 2vw;
  padding-left: var(--gutter);
  overflow-x: auto;
}
.ly_course_slider.wp-block-gallery:not(.swiper) figure.wp-block-image:not(#x):not(#y) {
  width: 30vw;
}
/* below the strip: counter, a gold progress hairline, and Prev / Next */
.ly_course_nav {
  display: flex;
  align-items: center;
  gap: 2.4vw;
  margin-top: 2.6vw;
  padding: 0 var(--gutter);
}
.ly_course_count {
  display: flex;
  align-items: center;
  gap: 0.9em;
  font-family: var(--latin-serif) !important;
  font-variant-numeric: lining-nums;
  font-size: 14px;
  letter-spacing: 0.12em;
  color: var(--muted);
}
.ly_course_count b {
  font-weight: 400;
  color: var(--ink);
}
.ly_course_bar {
  position: relative;
  flex: 1;
  height: 1px;
  background: var(--rule);
}
.ly_course_bar span {
  position: absolute;
  left: 0;
  top: 0;
  height: 1px;
  width: 0;
  background: var(--accent);
  transition: width 0.9s cubic-bezier(0.65, 0, 0.35, 1);
}
.ly_course_nav button {
  padding: 0.4em 0;
  border: 0;
  background: transparent;
  font-family: var(--latin-serif) !important;
  font-style: italic;
  font-size: 15px;
  letter-spacing: 0.1em;
  color: var(--ink-soft);
  cursor: pointer;
  transition: color 0.4s;
}
.ly_course_nav button:hover,
.ly_course_nav button:focus-visible {
  outline: none;
  color: var(--accent);
}
.ly_course {
  padding-top: 7vw !important;
  padding-bottom: 4vw;
}
.ly_course_caution {
  margin-bottom: 5vw;
  font-size: 12px;
  letter-spacing: 0.06em;
  color: var(--muted);
}
/* the featured course, set on a pale panel like the reference's card */
.ly_course_card {
  display: grid;
  grid-template-columns: minmax(0, 6fr) minmax(0, 5fr);
  gap: 3.6vw;
  align-items: center;
  max-width: 76vw;
  margin-top: 4vw;
  padding: 2.6vw;
  border: 1px solid var(--rule);
  background: rgba(233, 228, 216, 0.05);
}
.ly_course_card_media {
  margin: 0;
  aspect-ratio: 3 / 2;
  overflow: hidden;
}
.ly_course_card_media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.ly_course_card_catch {
  font-size: 12.5px;
  letter-spacing: 0.16em;
  color: var(--accent);
}
.ly_course_card_ttl {
  margin-top: 0.9vw;
  font-size: clamp(20px, 1.8vw, 30px);
  font-weight: 400;
  letter-spacing: 0.14em;
  line-height: 1.6;
  color: var(--ink);
}
.ly_course_card_price {
  margin-top: 1vw;
  font-family: var(--latin-serif) !important;
  font-variant-numeric: lining-nums;
  font-size: clamp(24px, 2.2vw, 36px);
  letter-spacing: 0.06em;
  color: var(--ink);
}
.ly_course_card_price span {
  margin-left: 0.2em;
  font-size: 0.45em;
  letter-spacing: 0.1em;
}
.ly_course_card_txt {
  margin-top: 1.4vw;
  font-size: clamp(13px, 1.02vw, 16px);
  line-height: 2.1;
  letter-spacing: 0.06em;
  color: var(--ink-soft);
  word-break: auto-phrase;
  text-wrap: pretty;
}
.ly_course_card_sub {
  margin-top: 1.2vw;
  padding-top: 1.2vw;
  border-top: 1px solid var(--rule);
  font-size: 12.5px;
  line-height: 2;
  letter-spacing: 0.06em;
  color: var(--muted);
}
.ly_course_list {
  max-width: 76vw;
  margin-top: 3vw;
}
/* every amount uses the same figures as the course card price: Cormorant Garamond, lining numerals.
   Prices written inside a sentence are wrapped in .u_price by script.js (料金表・本文・フォームの選択肢). */
.ly_menu_price,
.u_price {
  font-variant-numeric: lining-nums;
}
.u_price {
  font-family: var(--latin-serif) !important;
  font-size: 1.08em;
  letter-spacing: 0.04em;
}
/* the narrow list lets its prices hang into the margin; this one is full width */
.ly_course_list .ly_menu_price {
  margin-right: 0;
}
/* the month's menu as a PDF: a core Buttons block, so it is swapped in the editor */
.ly_course_pdf {
  display: flex;
  justify-content: center;
  margin: 1vw var(--gutter) 0;
}
.ly_course_pdf .wp-block-button__link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 1.2em;
  min-width: 22em;
  padding: 1.3em 2.6em;
  border: 1px solid var(--accent);
  border-radius: 0;
  background: transparent;
  font-size: clamp(13px, 1vw, 15px);
  letter-spacing: 0.24em;
  text-decoration: none;
  color: var(--accent) !important;
  transition: background-color 0.45s, color 0.45s;
}
.ly_course_pdf .wp-block-button__link::after {
  content: "PDF";
  padding: 0.1em 0.5em;
  border: 1px solid currentColor;
  font-family: var(--latin-serif) !important;
  font-size: 0.8em;
  letter-spacing: 0.1em;
}
.ly_course_pdf .wp-block-button__link:hover,
.ly_course_pdf .wp-block-button__link:focus-visible {
  outline: none;
  background: var(--accent);
  color: var(--bg-base) !important;
}
.ly_course_notes {
  padding-top: 3vw !important;
}

@media (max-width: 1023px) {
  .ly_hero {
    min-height: 0;
  }
  .ly_hero_logo {
    width: 52vw;
  }
  .ly_hero_copy {
    margin-top: 8vw;
    font-size: 4.6vw;
    letter-spacing: 0.14em;
    text-indent: 0.14em;
  }
  .ly_hero_sub {
    margin-top: 5vw;
    font-size: 3.2vw;
    letter-spacing: 0.1em;
  }
  .ly_hero_count {
    right: 6vw;
    bottom: 7vw;
    font-size: 11px;
  }
  .ly_hero_scroll::after {
    height: 44px;
  }
  .ly_course_head {
    padding-bottom: 9vw;
  }
  .ly_course_en {
    margin-bottom: 3vw;
    font-size: 3.4vw;
  }
  .ly_course_slider.wp-block-gallery figure.wp-block-image:not(#x):not(#y) {
    width: 78vw;
  }
  .ly_course_slider.wp-block-gallery:not(.swiper) figure.wp-block-image:not(#x):not(#y) {
    width: 70vw;
  }
  .ly_course_cap {
    margin-top: 3vw;
    padding-top: 2.6vw;
    font-size: 3.4vw;
  }
  .ly_course_slider figure.wp-block-image:not(#x):not(#y) > .ly_course_cap {
    margin-top: 3vw;
  }
  .ly_course_nav {
    gap: 5vw;
    margin-top: 7vw;
  }
  .ly_course {
    padding-top: 14vw !important;
    padding-bottom: 8vw;
  }
  .ly_course_caution {
    margin-bottom: 10vw;
  }
  .ly_course_card {
    grid-template-columns: minmax(0, 1fr);
    gap: 6vw;
    max-width: none;
    margin-top: 8vw;
    padding: 5vw;
  }
  .ly_course_card_ttl {
    margin-top: 2vw;
    font-size: 5.4vw;
  }
  .ly_course_card_price {
    margin-top: 2vw;
    font-size: 7vw;
  }
  .ly_course_card_txt {
    margin-top: 4vw;
    font-size: 3.6vw;
  }
  .ly_course_card_sub {
    margin-top: 4vw;
    padding-top: 4vw;
    font-size: 3.2vw;
  }
  .ly_course_list {
    max-width: none;
    margin-top: 8vw;
  }
  .ly_course_pdf {
    margin-top: 4vw;
  }
  .ly_course_pdf .wp-block-button,
  .ly_course_pdf .wp-block-button__link {
    width: 100%;
    min-width: 0;
  }
  /* one line on a phone in every language ("This month's menu (PDF)" wrapped at 0.24em) */
  .ly_course_pdf .wp-block-button__link {
    gap: 0.9em;
    padding: 1.3em 1em;
    letter-spacing: 0.12em;
    white-space: nowrap;
  }
  .ly_course_notes {
    padding-top: 8vw !important;
  }
}

/* =============================================
   Misc
   ============================================= */
::selection {
  background: var(--accent);
  color: #15171b;
}
.lang .wovn-languages {
  display: none;
}