/* === Reset / Common === */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
body {
    font-family: 'Saans', sans-serif;
    font-weight: 400; 
    background: #130804;
    color: #FFF;
}

.jp-text {
  font-family: 'Noto Sans JP', sans-serif;
}

/* Saans font family */
@font-face {
  font-family: 'Saans';
  src: url('../fonts/SaansLight.otf') format('opentype'),
       url('../fonts/SaansLight.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Saans';
  src: url('../fonts/SaansRegular.otf') format('opentype'),
       url('../fonts/SaansRegular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Saans';
  src: url('../fonts/SaansMedium.otf') format('opentype'),
       url('../fonts/SaansMedium.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Saans';
  src: url('../fonts/SaansSemiBold.otf') format('opentype'),
       url('../fonts/SaansSemiBold.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Saans';
  src: url('../fonts/SaansBold.otf') format('opentype'),
       url('../fonts/SaansBold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Saans';
  src: url('../fonts/SaansHeavy.otf') format('opentype'),
       url('../fonts/SaansHeavy.ttf') format('truetype');
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}
body.is-nav-open {
  overflow: hidden;
}
body.is-video-open {
  overflow: hidden;
}

.img-fluid { width:100%; height:auto }
.text-center { text-align:center }
.text-end { text-align:right }
.align-items-center { align-items:center }
.justify-content-center { justify-content:center }
.justify-content-end { justify-content: end }
.d-flex { display:flex }
.d-inline-block { display:inline-block }

.fs-xs { font-size: 0.625rem; /* 10px */ }
.fs-1 { font-size: 2.5rem;  /* 40px */ }
.fs-2 { font-size: 2rem;    /* 32px */ }
.fs-3 { font-size: 1.75rem; /* 28px */ }
.fs-4 { font-size: 1.5rem;  /* 24px */ }
.fs-5 { font-size: 1.25rem; /* 20px */ }
.fs-6 { font-size: 1rem;    /* 16px */ }
.fs-7 { font-size: 0.9rem;  /* 14px */ }
@media (max-width: 767px) {
    .fs-xs { font-size: 0.625rem; /* 10px */ }
    .fs-1 { font-size: 2rem;    /* 32px */ }
    .fs-2 { font-size: 1.75rem; /* 28px */ }
    .fs-3 { font-size: 1.5rem;  /* 24px */ }
    .fs-4 { font-size: 1.25rem; /* 20px */ }
    .fs-5 { font-size: 1rem;    /* 16px */ }
    .fs-6 { font-size: 0.9rem;  /* 14px */ }
    .fs-7 { font-size: 0.8rem;  /* 12px */ }
}

.mt-1 { margin-top: 1rem }
.mt-2 { margin-top: 2rem }
.mt-5 { margin-top: 5rem }
.mt-10 { margin-top: 10rem }
.mt-15{ margin-top: 15rem }
.mt-20{ margin-top: 20rem }

.mt-n5 { margin-top: -5rem }

.mb-1 { margin-bottom: 1rem }
.mb-2 { margin-bottom: 2rem }
.mb-3 { margin-bottom: 3rem }
.mb-5 { margin-bottom: 5rem }

.pt-5{ padding-top: 5rem!important }
.pt-10{ padding-top: 10rem!important }
.pt-15{ padding-top: 15rem!important }
.pb-2 { padding-bottom: 2rem!important }
.pb-10{ padding-bottom: 10rem!important }

.fw-bold { font-weight: 900 }
.fw-semibold { font-weight: 600 }
.fw-normal { font-weight: 400 }

.ls-1 { letter-spacing: .1rem; }
.ls-2 { letter-spacing: .2rem; }
.ls-n1 { letter-spacing: -.05rem; }

.lh-1  { line-height: 1 !important; }
.lh-md { line-height: 1.75 !important; }
.lh-lg { line-height: 2 !important; }

.border-top { border-top: 1px solid #0a0200 }

.mw-980 { max-width: 980px !important }

.bg-white { 
  background-color: #f3f8fb!important;
  color: #0a0200!important;
}

.bg-light {
  background-color: #f6f6ee!important;
  color: #0a0200!important;
}

.text-dark {
  color: #0a0200!important;
}

/* === Loading === */
.preloader {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #000;
  transition: opacity 0.6s ease;
}

.preloader img {
  width: 190px;
  height: auto;
}

.preloader--hidden {
  opacity: 0;
  pointer-events: none;
}

/* === Shared Container === */
.container {
  max-width: 1140px;
  margin-left: auto; margin-right:auto;
  padding: 0 1rem;
}

.container-xl {
  width: 100%;
  max-width: 1320px;
  margin-left: auto; margin-right:auto;
  padding: 0 1rem;
}

.container-fluid {
  max-width: 100%;
  margin-left: auto; margin-right:auto;
  padding: 0 1rem;
}

.visually-hidden {
  position: absolute !important;
  height: 1px; width: 1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
  white-space: nowrap;
}

/* === Grid === */
.row {
  display: flex;
  flex-wrap: wrap;
  margin: 0 -0.5rem;
}
.col-12 {
  width: 100%;
  padding: 0.5rem;
}
.col-6 {
  width: 50%;
  padding: 0.5rem;
}
.col-5 {
  width: 41.6666%;
  padding: 0.5rem;
}
.col-3 {
  width: 25%;
  padding: 0.5rem;
}
.col-4 {
  width: 25%;
  padding: 0.5rem;
}
.col-9 {
  width: 75%;
  padding: 0.5rem;
}
.col-md-3,
.col-md-4,
.col-md-5,
.col-md-6,
.col-md-8,
.col-md-9 {
  width: 100%;
  padding: 0.5rem;
}

@media (min-width: 768px) {
    .col-md-3 {
        width: 25%;
    }
    .col-md-4 {
        width: 33.33333%;
    }
    .col-md-5 {
        width: 41.66666%;
    }
     .col-md-6 {
        width: 50%;
    }
    .col-md-8 {
        width: 66.66666%;
    }
    .col-md-9{
        width: 75%;
    }
}

/* === Navigation === */
.site-header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  padding: 1rem;
  background: transparent;
  z-index: 1000;
  transition: background-color 0.3s ease, box-shadow 0.3s ease;
}
@media (max-width: 768px) {
  .site-header {
    padding-left: 0;
    padding-right: 0;
  }
}
.nav-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
}

.nav-controls {
  display: flex;
  align-items: center;
  gap: 1.5rem;
}

.header-menu,
.header-reservation {
  color: #fff;
  text-decoration: none;
  font-weight: 500;
  letter-spacing: 0.05em;
}

.logo-img {
  vertical-align: bottom;
}

@media (max-width: 768px) {
  .logo-img {
    max-height: 35px;
    width: auto;
  }
}

.header-menu:hover {
  cursor: pointer;
}

/* === Main Navigation === */
.main-nav {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  max-height: 100vh;
  height: auto;
  bottom: auto;
  overflow-y: auto;
  background: #7a0f25;
  color: #fff;
  transform: translateY(-100%);
  opacity: 0;
  pointer-events: none;
  transition: transform 0.6s cubic-bezier(0.77, 0, 0.175, 1), opacity 0.3s ease;
  z-index: 1200;
}
.main-nav__inner {
  height: auto;
  display: flex;
  gap: clamp(1.5rem, 3vw, 4rem);
  padding-top: clamp(2rem, 5vw, 5rem);
  padding-bottom: clamp(2rem, 5vw, 5rem);
  position: relative;
}
.main-nav__backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.3);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
  z-index: 1100;
}
.main-nav__column {
  flex: 1;
  min-width: 220px;
  display: flex;
  flex-direction: column;
  gap: 2rem;
}
.main-nav__column--locations {
  position: relative;
}
.main-nav__column--locations::before {
  content: "";
  position: absolute;
  left: 0;
  top: calc(-1 * clamp(2rem, 5vw, 5rem));
  bottom: calc(-1 * clamp(2rem, 5vw, 5rem));
  width: 1px;
  background: rgba(255,255,255,0.3);
}
.main-nav__column--menu {
  max-width: 320px;
}
.main-nav__column--locations {
  padding-left: clamp(1rem, 3vw, 2rem);
  margin-left: clamp(1rem, 3vw, 2rem);
}
.main-nav__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.main-nav__list a,
.main-nav__list span {
  color: #fff;
  text-decoration: none;
  font-size: clamp(0.85rem, 1vw, 0.95rem);
  letter-spacing: 0.15em;
  text-transform: uppercase;
  transition: opacity 0.3s ease;
}
.main-nav__list a:hover,
.main-nav__list a:focus-visible {
  opacity: 0.6;
}
.main-nav__social svg {
  width: 32px;
  height: 32px;
  fill: #fff;
}
.main-nav__social {
  margin-top: 2rem;
}
.main-nav__social a {
  display: inline-block;
  transition: opacity 0.3s ease;
}
.main-nav__social a:hover,
.main-nav__social a:focus-visible {
  opacity: 0.6;
}
.main-nav__heading {
  text-transform: uppercase;
  letter-spacing: 0.2em;
  font-size: 0.85rem;
  margin: 0;
}
.main-nav__heading--spacer {
  visibility: hidden;
}
.footer-highlight {
  display: inline-block;
}
.city-tabs {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  list-style: none;
  padding: 1.5rem 1rem 1rem;
  margin: 0;
}
.city-tabs__item button {
  width: 100%;
  background: transparent;
  border: none;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-size: clamp(1rem, 1.1vw, 1.2rem);
  text-align: left;
  cursor: pointer;
  padding: 0;
  opacity: 0.5;
  transition: opacity 0.3s ease;
  position: relative;
  padding-left: 20px;
}
@media (max-width: 768px) {
  .city-tabs {
    padding: 0!important;
  }
}
.city-tabs {
  padding: 1.5rem 0 1rem;
}
.city-tabs__item button span {
  display: none;
  margin-left: 0.25rem;
  font-size: 0.8rem;
  letter-spacing: 0.1em;
}
.city-tabs__item button small {
  display: block;
  margin-top: 0.25rem;
  font-size: 0.75rem;
  letter-spacing: 0.1em;
  opacity: 0.8;
}
.city-tabs__item button::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 8px;
  height: 8px;
  border-radius: 50%;
  border: 1px solid transparent;
}
.city-tabs__item.is-active button,
.city-tabs__item button:hover,
.city-tabs__item button:focus-visible {
  opacity: 1;
}
.city-tabs__item.is-active button span,
.city-tabs__item button:hover span,
.city-tabs__item button:focus-visible span {
  display: inline-block;
}
.city-tabs__item.is-active button::before {
  background: #fff;
  border-color: #fff;
}
@media (max-width: 768px) {
  .city-tabs {
    padding: 0!important;
  }
  .city-tabs__item button span {
    margin:0.5em 0 0!important;
  }
}
.restaurant-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.restaurant-list__button {
  width: 100%;
  text-align: left;
  background: transparent;
  border: none;
  color: #fff;
  font-size: clamp(1rem, 1.2vw, 1.2rem);
  letter-spacing: 0.05em;
  cursor: pointer;
  padding: 0.35rem 0;
  transition: opacity 0.3s ease;
  opacity: 0.6;
  text-decoration: none;
}
.restaurant-list__button small {
  display: block;
  font-size: 0.7rem;
  margin-top: 0.25em;
  letter-spacing: 0.1em;
  opacity: 0.8;
  font-family: 'Noto Sans JP', sans-serif;
}
.restaurant-list__name {
  display: block;
  font-weight: 400;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  font-size: clamp(0.85rem, 1vw, 0.95rem);
}
.restaurant-list__button:hover,
.restaurant-list__button:focus-visible,
.restaurant-list__button.is-active {
  opacity: 1;
}
.main-nav__column--visual figure {
  margin: 0;
  text-align: center;
}
.main-nav__column--visual img {
  width: 100%;
  height: auto;
  object-fit: cover;
  box-shadow: 0 20px 45px rgba(0, 0, 0, 0.35);
}
.main-nav__column--visual figcaption {
  margin-top: 1rem;
  font-size: 0.7rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}
/* === Hamburger Icon === */
.hamburger {
  display: block;
  width: 24px;
  height: 20px;
  cursor: pointer;
  position: relative;
  z-index: 1300;
}
.hamburger span {
  display: block;
  height: 1px;
  width: 100%;
  background: currentColor;
  margin-bottom: 6px;
  transition: 0.3s ease;
}
.hamburger span:last-child {
  margin-bottom: 0;
}

#menu-toggle:checked + .hamburger span:nth-child(1) {
  transform: rotate(45deg) translateY(10px);
}
#menu-toggle:checked + .hamburger span:nth-child(2) {
  opacity: 0;
}
#menu-toggle:checked + .hamburger span:nth-child(3) {
  transform: rotate(-45deg) translateY(-10px);
}

#menu-toggle:checked + .hamburger + .main-nav {
  transform: translateY(0);
  opacity: 1;
  pointer-events: auto;
}
#menu-toggle:checked + .hamburger + .main-nav + .main-nav__backdrop {
  opacity: 1;
  pointer-events: auto;
}

/* === Mobile Drawer === */
#menu-toggle:checked + .hamburger span {
  background: #FFF;
}

@media (max-width: 1024px) {
  .main-nav__inner {
    overflow-y: auto;
    gap: 2rem;
  }
  .main-nav__column {
    min-width: 0;
  }
  .main-nav__column--visual {
    display: none;
  }
}
@media (max-width: 768px) {
  .main-nav__inner {
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 0;
  }
  .main-nav__column--menu,
  .main-nav__column--locations {
    flex: 1 1 50%;
    max-width: 50%;
  }

}


/* === Hero Section === */
.hero {
  position: relative;
  height: 100dvh;
  overflow: hidden;
}

.hero--tenshou .hero__inner {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5em;
  top: 0;
  transform: none;
}

.hero--tenshou .hero__logo,
.hero--tenshou .hero__slides,
.hero--tenshou .hero__cta {
  opacity: 0;
  transition: opacity 8s ease;
}

.hero--tenshou .hero__logo.is-visible,
.hero--tenshou .hero__slides.is-visible,
.hero--tenshou .hero__cta.is-visible {
  opacity: 1;
}

.hero--tenshou .hero__logo {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 80%;
  height: auto;
}

.hero--tenshou .hero__slides {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  background: #000;
  opacity: 0;
  transition: opacity 2s ease;
}

.hero--tenshou .hero__slides.is-visible {
  opacity: 1;
}

.hero--tenshou .hero__slide {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1);
  transform-origin: center;
  will-change: transform, opacity;
  opacity: 0;
  transition: opacity 8s ease;
}

.hero--tenshou .hero__slide.is-visible {
  opacity: 1;
  animation: heroSlideZoomOut 5s ease-out forwards;
}

.hero--tenshou .hero__cta {
  position: relative;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.65em 2em;
  border: 1px solid #fff;
  border-radius: 999px;
  background: transparent;
  color: #fff;
  text-decoration: none;
  letter-spacing: 0.05em;
  font-weight: 100;
  font-size: 1.5em;
  transition: background-color 0.3s ease, color 0.3s ease, opacity 0.6s ease;
}

.hero--tenshou .hero__cta:hover,
.hero--tenshou .hero__cta:focus-visible {
  background: #fff;
  color: #000;
}

.video-modal {
  position: fixed;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  background: rgba(0, 0, 0, 0.75);
  backdrop-filter: blur(2px);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
  z-index: 2000;
}

.video-modal.is-open {
  opacity: 1;
  pointer-events: auto;
}

.video-modal__backdrop {
  position: absolute;
  inset: 0;
}

.video-modal__dialog {
  position: relative;
  width: min(90vw, calc(90vh * 16 / 9));
  aspect-ratio: 16 / 9;
  max-width: 100%;
  max-height: 90vh;
  background: #000;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.6);
  border-radius: 14px;
  overflow: hidden;
  z-index: 1;
}

.video-modal__video {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.video-modal__close {
  position: absolute;
  top: 0.5rem;
  right: 0.5rem;
  width: 2.5rem;
  height: 2.5rem;
  border: 1px solid rgba(255,255,255,0.6);
  border-radius: 999px;
  background: rgba(0,0,0,0.55);
  color: #fff;
  font-size: 1.5rem;
  line-height: 1;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.video-modal__close:hover,
.video-modal__close:focus-visible {
  background: #fff;
  color: #000;
  border-color: transparent;
}

@keyframes heroSlideZoomOut {
  from { transform: scale(1.05); }
  to { transform: scale(1); }
}

@media (max-width: 768px) and (orientation: portrait) {
  .video-modal__dialog {
    aspect-ratio: 9 / 16;
  }
}

.tenshou-misc {
  position: relative;
  padding: 8rem 1rem;
  overflow: visible;
  background: #f3f8fb;
  color: #000;
}

.tenshou-intro {
  position: relative;
  padding: 8rem 1rem;
  overflow: visible;
  background: #f3f8fb;
  color: #000;
  margin-top: -4.5rem;
}

.site-header--inline {
  position: sticky;
  top: 0;
  width: 100%;
  background: #f3f8fb;
  color: #000;
  backdrop-filter: none;
  box-shadow: none;
  z-index: 1200;
  transition: background-color 0.3s ease, color 0.3s ease;
}

.site-header.is-transparent {
  background: transparent;
  color: #fff;
  mix-blend-mode: difference;
}

.site-header .logo-img {
  filter: invert(1);
  transition: filter 0.3s ease;
}

.site-header.is-transparent .logo-img {
  filter: invert(0);
}

.site-header .header-menu,
.site-header .main-nav a,
.site-header .city-tabs__item button,
.site-header .restaurant-list__button {
  color: inherit;
}

.site-header .hamburger span {
  filter: invert(1);
  transition: filter 0.3s ease;
}

.site-header.is-transparent .hamburger span {
  filter: invert(0);
}

.site-header .main-nav,
.site-header .main-nav__backdrop {
  mix-blend-mode: normal;
}

/* Blend only key header elements when transparent */
.site-header.is-transparent .logo-img,
.site-header.is-transparent .header-menu,
.site-header.is-transparent .hamburger span {
  mix-blend-mode: difference;
}

body.is-nav-open .site-header {
  mix-blend-mode: normal;
}

/* Keep hamburger pinned to the viewport when the menu is open */
body.is-nav-open .site-header .hamburger {
  position: fixed;
  top: 1.5rem;
  right: 1.5rem;
  left: auto;
  transform: none;
}

.city-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0;
}

.city-grid__item {
  width: 100%;
}

.city-grid__link {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  color: inherit;
}

.unit-page .city-grid__link {
  aspect-ratio: 850 / 1200;
}

.unit-page .city-grid__city {
  transform: translate(-50%, -50%) scale(1.04);
  transform-origin: center;
  font-size: 28px;
}

.unit-page .city-grid__city span {
  font-size: 0.6em;
}

.city-grid__image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.city-grid__link::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.5);
  transition: background 0.35s ease;
  z-index: 1;
}

.city-grid__link:hover::before,
.city-grid__link:focus-visible::before {
  background: rgba(122, 15, 37, 0.8);
}

.city-grid__city,
.city-grid__cta {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
  color: #fff;
  text-align: center;
}

.city-grid__city {
  top: 50%;
  transform: translate(-50%, -50%);
  display: grid;
  gap: 0.55rem;
  width: min(92%, 40rem);
  font-weight: 500;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.55);
}

.city-grid__eyebrow,
.city-grid__place,
.city-grid__subplace {
  display: block;
}

.city-grid__eyebrow {
  font-size: clamp(0.95rem, 1.8vw, 1.2rem);
  letter-spacing: 0.16em;
  font-weight: 300;
  margin-bottom: 1rem;
}

.city-grid__place {
  font-size: clamp(1.45rem, 3.3vw, 2.15rem);
  line-height: 1.05;
  letter-spacing: 0.05em;
  font-weight: 300;
}

.city-grid__subplace {
  font-size: clamp(1.45rem, 3.3vw, 2.15rem);
  line-height: 1.15;
  letter-spacing: 0.08em;
  font-weight: 300;
}

.city-grid__cta {
  top: 82%;
  transform: translate(-50%, -50%);
  letter-spacing: 0.05em;
  font-size: clamp(0.9rem, 1vw, 1rem);
  text-decoration: underline;
}

.city-grid__link--coming-soon::before,
.city-grid__link--coming-soon:hover::before,
.city-grid__link--coming-soon:focus-visible::before {
  background: rgba(0, 0, 0, 0.8);
}

.city-grid__link--coming-soon .city-grid__cta {
  text-decoration: none;
}

.city-grid__link--coming-soon .city-grid__image {
  filter: saturate(0.5) blur(1px);
}

.city-grid__link.city-grid__link--coming-soon:hover::before,
.city-grid__link.city-grid__link--coming-soon:focus-visible::before {
  background: rgba(122, 15, 37, 0.8);
}

@media (max-width: 768px) {
  .city-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .unit-page .city-grid__city {
    font-size: 16px;
  }

  .city-grid__city {
    gap: 0.35rem;
    width: 94%;
  }

  .city-grid__eyebrow {
    font-size: clamp(0.8rem, 2vw, 0.95rem);
  }

  .city-grid__place {
    font-size: clamp(1.2rem, 4.4vw, 1.7rem);
  }

  .city-grid__subplace {
    font-size: clamp(1.2rem, 4.4vw, 1.7rem);
  }

  .city-grid__cta {
    top: 82%;
    font-size: 0.85rem;
  }
}

.chef-stories {
  padding: 0 0 2rem;
  background-color: #FFF;
  position: relative;
}

.chef-stories-wrap {
  background: #fff;
}

.chef-stories-swiper {
  width: 100%;
}

.chef-story {
  position: relative;
  overflow: hidden;
  border-radius: 12px;
}
.chef-story::after {
  content:'';
  position:absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.4);
  z-index: 1;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
}

.chef-story__image {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
  filter: grayscale(1);
}

.chef-story__caption {
  position: absolute;
  left: 1rem;
  bottom: 1rem;
  color: #fff;
  font-weight: 300;
  letter-spacing: 0.02em;
  text-shadow: 0 2px 6px rgba(0,0,0,0.6);
  z-index: 2;
}

.chef-stories-swiper .swiper-wrapper {
  align-items: stretch;
  transition-timing-function: ease;
}

.chef-stories-swiper .swiper-slide {
  height: auto;
}

/* Fade non-hover chef stories */
.chef-embla:hover .chef-story:not(:hover)::after {
  opacity: 1;
}

.chef-stories-nav {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  pointer-events: none;
  padding: 0 0.5rem;
}

.chef-stories-button {
  pointer-events: auto;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 1px solid transparent;
  background: rgba(51, 51, 51, 0.3);
  color: #b3b3b3;
  font-size: 0;
  display: grid;
  place-items: center;
  transition: background 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
  position: relative;
}

.chef-stories-button:hover,
.chef-stories-button:focus-visible {
  background: #333;
  border-color: #333;
  transform: scale(1.04);
}

.chef-stories-button:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 2px;
}
.chef-stories-button::before {
  content: "";
  width: 12px;
  height: 28px;
  display: block;
  background-color: currentColor;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 49.25 171.53'%3E%3Cpath fill='white' d='M20.29,164.77c-2.35,6.12-9.32,8.03-13.99,5.94s-7.73-7.94-5.58-13.59l27.18-71.44L.69,14.4C-1.46,8.76,1.66,2.9,6.3.81s11.63-.12,13.82,5.6l27.89,72.63c1.64,4.26,1.64,9.18,0,13.45l-27.74,72.29Z'/%3E%3C/svg%3E") center / contain no-repeat;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 49.25 171.53'%3E%3Cpath fill='white' d='M20.29,164.77c-2.35,6.12-9.32,8.03-13.99,5.94s-7.73-7.94-5.58-13.59l27.18-71.44L.69,14.4C-1.46,8.76,1.66,2.9,6.3.81s11.63-.12,13.82,5.6l27.89,72.63c1.64,4.26,1.64,9.18,0,13.45l-27.74,72.29Z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.chef-stories-button--prev::before {
  transform: scaleX(-1);
}

/* Embla: chef stories (centered multi-slide layout) */
.chef-embla {
  position: relative;
  --chef-embla-gap: 24px;
  --chef-embla-slides: 1.4;
}
@media (max-width: 639px) {
  .chef-embla {
    --chef-embla-gap: 14px;
  }
}
@media (min-width: 640px) {
  .chef-embla {
    --chef-embla-slides: 2.6;
  }
}
@media (min-width: 1024px) {
  .chef-embla {
    --chef-embla-slides: 3.3;
  }
}
@media (min-width: 1280px) {
  .chef-embla {
    --chef-embla-slides: 4.3;
  }
}
.chef-embla .embla__viewport {
  overflow: hidden;
  width: 100%;
}
.chef-embla .embla__container {
  display: flex;
  gap: 0;
}
.chef-embla .embla__slide {
  flex: 0 0 calc((100% - (var(--chef-embla-slides) - 1) * var(--chef-embla-gap)) / var(--chef-embla-slides));
  margin-right: var(--chef-embla-gap);
}

/* Embla: restaurant logos marquee */
.logos-embla .embla__viewport {
  overflow: hidden;
  width: 100%;
}
.logos-embla .embla__container {
  display: flex;
  gap: 0;
  align-items: center;
}
.logos-embla[data-fallback="1"] .embla__container {
  animation: logos-marquee 28s linear infinite;
}
.logos-embla[data-fallback="1"] .embla__slide {
  flex: 0 0 auto;
}
.logos-embla .embla__slide {
  flex: 0 0 auto;
  width: 100px;
  margin-right: 18px;
  transition: opacity 0.3s ease;
}
@media (min-width: 768px) {
  .logos-embla .embla__slide {
    width: 120px;
    margin-right: 18px;
  }
}
@media (min-width: 1200px) {
  .logos-embla .embla__slide {
    width: 140px;
    margin-right: 18px;
  }
}

/* Embla: menu slider */
.menu-embla {
  --menu-embla-gap: 24px;
  position: relative;
}
@media (max-width: 767px) {
  .menu-embla {
    --menu-embla-gap: 16px;
  }
}
.menu-embla .embla__viewport {
  overflow: hidden;
  width: 100%;
}
.menu-embla .embla__container {
  display: flex;
  gap: 0;
}
.menu-embla .embla__slide {
  display: block;
  flex: 0 0 auto;
  margin-right: var(--menu-embla-gap);
}

/* Embla: restaurants slider */
.restaurants-embla {
  --restaurants-embla-gap: 14px;
  position: relative;
}
.restaurants-embla .embla__viewport {
  overflow: hidden;
  width: 100%;
}
.restaurants-embla .embla__container {
  display: flex;
  gap: 0;
  align-items: stretch;
}
.restaurants-embla .embla__slide {
  display: block;
  flex: 0 0 auto;
  width: clamp(160px, 20vw, 200px);
  margin-right: var(--restaurants-embla-gap);
}

@media (min-width: 768px) {
  .restaurants-embla .embla__slide {
    width: calc((100% - (var(--restaurants-embla-gap) * 4)) / 5);
  }
}

@media (min-width: 1025px) {
  .restaurants-embla .embla__slide {
    width: calc((100% - (var(--restaurants-embla-gap) * 5)) / 6);
  }
}

@media (min-width: 1441px) {
  .restaurants-embla .embla__slide {
    width: calc((100% - (var(--restaurants-embla-gap) * 5)) / 7);
  }
}

/* Shared nav for embla sliders on makidori */
.embla-nav {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  pointer-events: none;
  padding: 0 0.5rem;
}
.embla-button {
  pointer-events: auto;
  width: 40px;
  height: 95px;
  border-radius: 10px;
  border: 1px solid transparent;
  background: rgba(51, 51, 51, 0.4); /* 30% of dark gray */
  color: #b3b3b3; /* arrow color stays constant */
  display: grid;
  place-items: center;
  font-size: 0; /* hide text arrow, use pseudo */
  transition: background 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
  position: relative;
}
.menu-embla .embla-button {
  margin-top: -1rem;
}
.embla-button:hover,
.embla-button:focus-visible {
  background: #333;
  border-color: #333;
  transform: scale(1.04);
}
.embla-button:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 2px;
}
.embla-button::before {
  content: "";
  width: 14px;
  height: 45px;
  display: block;
  position: absolute;
  background-color: currentColor;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 49.25 171.53'%3E%3Cpath fill='white' d='M20.29,164.77c-2.35,6.12-9.32,8.03-13.99,5.94s-7.73-7.94-5.58-13.59l27.18-71.44L.69,14.4C-1.46,8.76,1.66,2.9,6.3.81s11.63-.12,13.82,5.6l27.89,72.63c1.64,4.26,1.64,9.18,0,13.45l-27.74,72.29Z'/%3E%3C/svg%3E") center / contain no-repeat;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 49.25 171.53'%3E%3Cpath fill='white' d='M20.29,164.77c-2.35,6.12-9.32,8.03-13.99,5.94s-7.73-7.94-5.58-13.59l27.18-71.44L.69,14.4C-1.46,8.76,1.66,2.9,6.3.81s11.63-.12,13.82,5.6l27.89,72.63c1.64,4.26,1.64,9.18,0,13.45l-27.74,72.29Z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.embla-button--prev::before {
  transform: scaleX(-1);
}

.line-story {
  background: #f4eee7;
  color: #1a1a1a;
  padding: 6rem 1rem;
}

.line-story__inner {
  position: relative;
  max-width: 980px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 3.5rem;
  padding: 10rem 2rem;
}

.line-story__line {
  position: absolute;
  inset: 0;
  width: 1px;
  left: 50%;
  transform: translateX(-50%);
  pointer-events: none;
}

.line-story__line::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.16);
  transform-origin: top;
  transform: scaleY(var(--line-progress, 0));
  transition: transform 0.25s ease-out;
}

.line-story__step {
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  text-align: center;
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.5s ease, transform 0.5s ease;
}

.line-story__step.is-text {
  background-color: #f4eee7;
  padding: 4em 0;
}

.line-story__step.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.line-story__title {
  margin-bottom: 1em;
  line-height: 1.7;
  font-size: clamp(1.2rem, 2.4vw, 1.2rem);
  font-weight: 500;
}

.line-story__copy {
  margin: 0;
  line-height: 1.7;
  font-size: clamp(1rem, 2.2vw, 1.15rem);
  max-width: 840px;
}

.line-story__media-row {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  justify-items: center;
  gap: 2rem;
  align-items: center;
}

.line-story__media {
  margin: 0;
  background: #fff;
  overflow: hidden;
}

.line-story__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.line-story__media--lg {
  width: min(100%, 420px);
}

.line-story__media--sm {
  width: min(100%, 420px);
}

.line-story__media--left,
.line-story__media--right {
  justify-self: center;
}

@media (max-width: 900px) {
  .line-story {
    padding: 5rem 1rem;
  }
  .line-story__line {
    display: none;
  }
  .line-story__inner {
    padding: 0 1rem;
    gap: 3rem;
  }
  .line-story__media-row {
    gap: 1.5rem;
  }
}

@media (max-width: 768px) {
  .line-story__inner {
    gap: 2.5rem;
  }
  .line-story__media-row {
    grid-template-columns: 1fr;
    align-items: center;
  }
  .line-story__media--left,
  .line-story__media--right {
    justify-self: center;
  }
.line-story__media--lg,
.line-story__media--sm {
  width: min(100%, 420px);
}
}

.chosen-diagonal {
  position: relative;
  background: #000;
  color: #fff;
  min-height: calc(100vh * 4);
}

.chosen-diagonal__viewport {
  position: sticky;
  top: 0;
  height: 100vh;
  overflow: hidden;
}

.chosen-diagonal__slides {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.chosen-diagonal__slide {
  position: absolute;
  inset: 0;
  margin: 0;
  opacity: 0;
  transition: opacity 0.4s ease;
}

.chosen-diagonal__bg {
  position: absolute;
  inset: 0;
  display: block;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  clip-path: polygon(
    0 0,
    calc(var(--reveal, 0) * 100% + 20%) 0,
    calc(var(--reveal, 0) * 100%) 100%,
    0 100%
  );
  width: 120%;
  margin-left: -20%;
}

.chosen-diagonal__slide:nth-of-type(3) .chosen-diagonal__bg,
.chosen-diagonal__slide:nth-of-type(4) .chosen-diagonal__bg {
  background-position: top!important;
}

.chosen-diagonal__slide.is-active {
  opacity: 1;
}

.chosen-diagonal__overlay {
  position: relative;
  z-index: 2;
  height: 100%;
  display: grid;
  place-items: center;
  text-align: center;
  padding: 3rem 1.5rem;
  background: linear-gradient(135deg, rgba(0,0,0,0.55) 30%, rgba(0,0,0,0.45) 70%);
}

.chosen-diagonal__content {
  max-width: 900px;
  margin: 0 auto;
  display: grid;
  gap: 1.5rem;
}

.chosen-diagonal__title {
  margin: 0;
  font-size: clamp(1.8rem, 3vw, 2.4rem);
  font-weight: 500;
}

.chosen-diagonal__copy {
  margin: 0;
  line-height: 1.8;
  font-size: clamp(1.05rem, 2vw, 1.2rem);
}

.chosen-diagonal__logo img {
  width: 60vw;
  max-width: 300px;
  height: auto;
  filter: drop-shadow(0 8px 16px rgba(0,0,0,0.35));
}

.chosen-diagonal__dots {
  display: inline-flex;
  gap: 1.25rem;
  align-items: center;
  justify-content: center;
}

.chosen-diagonal__dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.45);
  border: none;
  padding: 0;
  cursor: pointer;
  transition: transform 0.2s ease, background-color 0.2s ease;
}

.chosen-diagonal__dot.is-active {
  background: #fff;
  transform: scale(1.5);
}

.chosen-diagonal__dot:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 2px;
}

@media (max-width: 768px) {
  .chosen-diagonal {
    min-height: calc(100vh * 4);
  }
  .chosen-diagonal__bg {
    clip-path: polygon(
      0 0,
      calc(var(--reveal, 0) * 100% + 40%) 0,
      calc(var(--reveal, 0) * 100%) 100%,
      0 100%
    );
    width: 140%;
    margin-left: -40%;
  }
  .chosen-diagonal__overlay {
    padding: 2.5rem 1.25rem;
  }
  .chosen-diagonal__copy {
    font-size: 1rem;
  }
}

.tokyo {
  position: relative;
  color: #fff;
  background: #000;
  min-height: 100vh;
  overflow: hidden;
}

.tokyo__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}

.tokyo__inner {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  text-align: center;
  max-width: 100%;
  margin: 0 auto;
  padding: 5rem 1.5rem;
  min-height: 100vh;
}

.tokyo__content {
  display: grid;
  gap: 1.5rem;
  width: 100%;
}

.tokyo__title {
  font-size: clamp(1.4rem, 4vw, 2rem);
  line-height: 1.3;
  margin: 0;
  font-weight: 400;
  letter-spacing: 0.04em;
}

.tokyo__cta {
  margin: 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #fff;
  background: transparent;
  text-decoration: none;
  transition: background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease;
  position: relative;
  font-size: 1.2em;
  letter-spacing: 0.04em;
}

.tokyo__cta::before {
  content: "";
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  display: inline-block;
  position: relative;
  background: center/80% no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 120'%3E%3Cpath fill='%23fff' d='M40 28l56 32-56 32z'/%3E%3C/svg%3E");
}

.tokyo__cta:hover::before,
.tokyo__cta:focus-visible::before {
  background: #fff center/80% no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 120'%3E%3Cpath fill='%23000' d='M40 28l56 32-56 32z'/%3E%3C/svg%3E");
  border-color: #000;
}
.tokyo__cta:hover,
.tokyo__cta:focus-visible {
  color: #FFF;
}

@media (max-width: 768px) {
  .tokyo__inner {
    padding: 4rem 1.5rem;
  }
  .tokyo__title {
    font-size: clamp(1.8rem, 6vw, 2.3rem);
  }
  .tokyo__cta {
    font-size: 1.1em;
  }
}
.legends-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 0;
  background: #f4eee7;
}

.legends-grid__item {
  position: relative;
  overflow: hidden;
  aspect-ratio: 667 / 1000;
}

.legends-grid__image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.legends-grid__overlay {
  position: absolute;
  inset: 0;
  background: rgba(122, 15, 37, 0);
  transition: background 0.35s ease;
  z-index: 1;
}

.legends-grid__name,
.legends-grid__logo,
.legends-grid__genre {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
  color: #fff;
  text-align: center;
  opacity: 0;
  transition: opacity 0.25s ease;
}

.legends-grid__name {
  top: 15%;
  transform: translateX(-50%);
  letter-spacing: 0.06em;
  font-weight: 100;
  font-size: clamp(1.2rem, 4vw, 1.4rem);
}

.legends-grid__logo {
  top: 50%;
  transform: translate(-50%, -50%);
  display: block;
  width: 30%;
}

.legends-grid__logo img {
  width: 100%;
  height: auto;
  display: block;
}

.legends-grid__genre {
  top: 75%;
  transform: translateX(-50%);
  letter-spacing: 0.06em;
  font-weight: 100;
  font-size: clamp(1rem, 3vw, 1.2rem);
}

.legends-grid__item:hover .legends-grid__overlay,
.legends-grid__item:focus-within .legends-grid__overlay {
  background: rgba(122, 15, 37, 0.8);
}

.legends-grid__item:hover .legends-grid__name,
.legends-grid__item:focus-within .legends-grid__name,
.legends-grid__item:hover .legends-grid__logo,
.legends-grid__item:focus-within .legends-grid__logo,
.legends-grid__item:hover .legends-grid__genre,
.legends-grid__item:focus-within .legends-grid__genre {
  opacity: 1;
}

@media (max-width: 1024px) {
  .legends-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 768px) {
  .legends-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .legends-grid__item {
    aspect-ratio: 667 / 1000;
  }
  .legends-grid__logo {
    width: 32%;
  }
}

.legends {
  background: #f4eee7;
  color: #000;
  padding: 15rem 0;
}

.legends__title {
  font-weight: 300;
}

.legends__copy {
  line-height: 1.7;
  font-size: clamp(1rem, 2.2vw, 1.15rem);
}

@media (max-width: 768px) {
  .legends {
    padding: 4rem 0;
  }
}

.tenshou-intro__text {
  margin: 6rem auto;
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
}

.tenshou-intro__line {
  font-size: clamp(1rem, 3.5vw, 1.8rem);
  line-height: 1.6;
  letter-spacing: 0.02em;
  opacity: 1;
  font-weight: 100;
  text-align: center;
}

.tenshou-intro__video {
  margin: 4rem auto;
  position: relative;
  width: min(760px, 100%);
  overflow: hidden;
  border-radius: 28px;
}

.tenshou-intro__category {
  margin: 4rem auto;
  width: min(1280px, 100%);
}

.tenshou-intro__category-hex {
  margin: 0 auto;
  width: 50%;
}

.tenshou-intro__category-video {
  display: block;
  width: 100%;
  height: auto;
}

.tenshou-intro__category-grid {
  margin-top: 3.5rem;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.476923fr);
  gap: 1.75rem;
  align-items: stretch;
  width: 100%;
}

.tenshou-intro__category-card {
  margin: 0;
  overflow: hidden;
  border-radius: 28px;
  height: 100%;
}

.tenshou-intro__category-card img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.tenshou-intro__category-card:first-child {
  aspect-ratio: 1 / 1;
}

.tenshou-intro__category-card:last-child {
  aspect-ratio: 1920 / 1300;
}

.tenshou-intro__video video {
  display: block;
  width: 100%;
  aspect-ratio: 1920 / 1300;
  object-fit: cover;
}

@media (max-width: 768px) {
  .hero--tenshou {
    width: 100%;
    height: auto;
    aspect-ratio: 960 / 720;
    min-height: 0;
  }

  .hero--tenshou .hero__inner {
    gap: 1em;
  }

  .hero--tenshou .hero__cta {
    font-size: 1rem;
  }

  .tenshou-misc {
    padding: 4rem 1rem;
  }

  .tenshou-intro {
    padding: 3rem 1rem 0.5rem;
  }

  .tenshou-intro__text {
    margin-top: 6rem;
  }

  .tenshou-intro__category {
    margin-top: 3rem;
    margin-bottom: 3rem;
  }

  .tenshou-intro__category-hex {
    width: min(420px, 82vw);
  }

  .tenshou-intro__category-grid {
    margin-top: 2rem;
    grid-template-columns: 1fr;
    gap: 1rem;
  }

  .tenshou-intro__category-card {
    border-radius: 22px;
  }

  .tenshou-intro__video {
    border-radius: 22px;
  }
}

.hero__media {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}

.hero__inner {
  position: relative;
  z-index: 1;
  text-align: center;
  color: white;
  top: 50%;
  transform: translateY(-50%);
}

.hero--stacked .hero__inner {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  top: 0;
  transform: none;
}

.hero__stack {
  width: min(100%, 52rem);
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1.5rem;
}

.hero__stack-copy {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
}

.hero__heading {
  margin: 0;
  line-height: 1;
}

.hero__title {
  width: 100%;
  display: block;
  font-size: clamp(0.75rem, calc((100vw - 4rem) / 18), 4rem);
  line-height: 1;
  font-weight: 599;
  margin-bottom: 1rem;
  text-align: center;
  white-space: nowrap;
}
.hero__title.hero__title--makidori {
    font-size: clamp(0.75rem, calc((100vw - 4rem) / 18), 4.5rem);
}

.hero__lede {
  margin: 0;
  color: #fff;
  text-wrap: balance;
}

.hero__lede--about {
  font-size: clamp(1rem, 1.6vw + 0.8rem, 2rem);
  line-height: 1.55;
  letter-spacing: 0.03em;
  text-align: right;
  margin-left: auto;
  margin-right: 0;
}

.hero--about::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.06) 0%, rgba(0, 0, 0, 0.42) 100%);
  z-index: 0;
  pointer-events: none;
}

.hero--about .hero__inner {
  padding-inline: 1.5rem;
  align-items: flex-start;
  padding-top: 20vh;
}

.hero--about .container-xl {
  width: 100%;
}

.tenshou-misc--about {
  padding-top: 5rem;
}

.about-gallery {
  padding: 10rem 0 0;
}

.about-gallery__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.5rem;
  max-width: 860px;
  margin: 0 auto;
}

.about-gallery__item {
  margin: 0;
  overflow: hidden;
  background: #d9d4ca;
}

.about-gallery__item--wide {
  grid-column: 1 / -1;
  aspect-ratio: 16 / 9;
}

.about-gallery__item--tall {
  aspect-ratio: 3 / 4;
}

.about-gallery__item picture,
.about-gallery__item img {
  display: block;
  width: 100%;
  height: 100%;
}

.about-gallery__item img {
  object-fit: cover;
}

.hero-button {
    font-weight: 500;
    padding: 0.25em 2.5em;
    text-decoration: none;
    color: #FFF;
    border: 1px solid #FFF;
    display: inline-block;
    transition: background-color 0.5s ease;
    position: relative;
}
.hero-button::after {
  content: "";
  display: inline-block;
  width: 1em;
  height: 1em;
  margin-left: 0.25em;
  background-color: currentColor;
  mask: center / contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 630 400'%3E%3Cpath d='M628.08 208.28l-40.28-40.28L419.8 0h0l-33.9 33.9h0l127 127H0v48'/%3E%3C/svg%3E");
  -webkit-mask: center / contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 630 400'%3E%3Cpath d='M628.08 208.28l-40.28-40.28L419.8 0h0l-33.9 33.9h0l127 127H0v48'/%3E%3C/svg%3E");
  vertical-align: middle;
}

.hero-button.go-down::after {
  mask: center / contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 19.5L3.5 11l2.1-2.1 4.9 4.9V3h3v10.8l4.9-4.9 2.1 2.1z'/%3E%3C/svg%3E");
  -webkit-mask: center / contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 19.5L3.5 11l2.1-2.1 4.9 4.9V3h3v10.8l4.9-4.9 2.1 2.1z'/%3E%3C/svg%3E");
}

.hero-button--plain::after {
  display: none;
}
.hero-button:hover {
    background: rgba(0,0,0,0.5);
}

.hero-button.bg-black:hover {
    background: rgba(255,255,255,1);
    color: #000;
}

.hero-button.border-black {
    color: #0a0200;
    border: 1px solid rgba(0,0,0,0.5);
}

.hero-button.border-black:hover {
    color: #FFF;
    background-color: #0a0200;
}

.hero-button.coming-soon::after {
  display: none;
}

.hero-button.coming-soon:hover {
  cursor: default;
}

/* === Trailer Section === */
.trailer {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border-radius: 25px;
}

.trailer-video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.trailer-overlay {
  position: absolute;
  inset: auto 0 0 0;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 2rem;
  padding: 2.5rem 3rem;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.75) 100%);
  color: #fff;
  transition: opacity 0.3s ease;
}

.trailer-text span {
  display: block;
  margin-bottom: 0.5rem;
}

.trailer-text {
  text-align: left;
}

.trailer-text h4 {
  margin: 0;
  line-height: 1.2;
}

.trailer-play {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 3rem;
  height: 3rem;
  border: 0;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.3);
  color: inherit;
  cursor: pointer;
  transition: transform 0.25s ease, border-color 0.25s ease, background 0.25s ease;
}

.trailer-play svg {
  width: 100%;
  height: 100%;
  fill: currentColor;
}

.trailer-play:hover,
.trailer-play:focus-visible {
  background: rgba(255, 255, 255, 0.2);
  border-color: #fff;
  transform: scale(1.05);
}

.trailer.is-playing .trailer-overlay {
  opacity: 0;
  pointer-events: none;
}

.hero__logo {
  display: block;
  margin-left: auto;
  margin-right: auto;
  max-width: 90%;
}

.hero__logo--w80 {
  max-width: 80%;
}

.hero__logo--w70 {
  max-width: 70%;
}

.hero__logo--w90 {
  max-width: 90%;
}

.hero__logo--stacked {
  width: min(100%, 26rem);
  max-width: 78vw;
}

.hero--stacked .hero__title {
  margin-bottom: 0;
}

.hero--stacked .hero-button {
  min-width: 16rem;
  padding-top: 0.75em;
  padding-bottom: 0.75em;
  background: rgba(0, 0, 0, 0.18);
  backdrop-filter: blur(2px);
}

@media (max-width: 767px) {
  .trailer-overlay {
    gap: 1.5rem;
    padding: 1.5rem;
  }

  .trailer-play {
    width: 3.75rem;
    height: 3.75rem;
  }
}

@media (max-width: 767px) {
  .hero__logo {
    max-width: 60%;
    margin-bottom: 1em;
  }

  .hero__stack {
    width: min(100%, 30rem);
    gap: 1rem;
    padding-inline: 1rem;
  }

  .hero__logo--stacked {
    width: min(100%, 16rem);
    max-width: 70vw;
    margin-bottom: 0;
  }

  .hero--stacked .hero-button {
    min-width: 13rem;
  }

  .hero__lede--about {
    font-size: clamp(0.95rem, 2.8vw + 0.45rem, 1.2rem);
    line-height: 1.5;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    max-width: 18rem;
  }

  .about-gallery {
    padding-top: 3rem;
  }

  .about-gallery__grid {
    grid-template-columns: 1fr;
    gap: 1rem;
  }

  .about-gallery__item--wide,
  .about-gallery__item--tall {
    grid-column: auto;
    aspect-ratio: 4 / 3;
  }

}

@media (max-width: 767px) {
    .hero__title,
    .hero__title.hero__title--makidori {
        font-size: clamp(0.75rem, calc((100vw - 4rem) / 12), 2rem);
    }
}

/* ===== Layout tokens ===== */
.mosaic{
    --gap: calc(50 / 1920 * 100%);    /* uniform spacing for rows and columns */
  --left-w: calc(950 / 1920 * 100%);  /* left column width */
  --right-w: calc(900 / 1920 * 100%); /* right column width */

  display: grid;
  grid-template-columns: var(--left-w) var(--right-w);
  gap: var(--gap);
  align-items: stretch;
}

/* Left column stacks two rows with the same gap */
.mosaic-left{
  display: grid;
  gap: var(--gap);
  align-content: space-between;
}

/* Shared tile base */
.tile{
  position: relative;
  display: block;
  overflow: hidden;
  border-radius: 12px;
  text-decoration: none;
  color: inherit;
}

.tile::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.15);
}

/* Left tiles favor a wider aspect ratio */
.tile-190x127{ aspect-ratio: 190 / 127; }

/* Right tile stretches to match the row height */
.tile-right{
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Inner frame keeps a 15:22 ratio */
.ratio-box{
  position: relative;
  width: 100%;
  aspect-ratio: 15 / 22;
  height: 100%; /* stay within the row height */
}

/* Images are constrained to the ratio box */
.tile-190x127 > img,
.ratio-box > img{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover; /* cover crops slightly; contain would leave space */
}

/* Caption overlay */
.tile-caption{
    position: absolute;
    left: 2rem;
    bottom: 2rem;
    color: #fff;
    z-index: 1;
}

/* ===== Stack tiles below 768px ===== */
@media (max-width:768px){
  .mosaic{
    grid-template-columns: 1fr;
    row-gap:30px;
  }
  .mosaic-left{
    row-gap:30px;
  }
}


/* === Portrait Section === */
.portrait {
  position: relative;
  height: 100dvh;
  overflow: hidden;
}

.portrait::after {
  content: "";
  position:absolute; inset:0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.1);
}

.portrait-bg {
 position:absolute; inset:0;
  width: 100%;
  height: 120%;   /* slightly oversized to hide edge drift */
  object-fit: cover;
  transform: translateY(0);
  will-change: transform;
}

.portrait-content {
  position: relative;
  z-index: 1;
  text-align: center;
  color: white;
  top: 80%;
  transform: translateY(-80%);
}

.interior {
  position: relative;
  clip-path: inset(0);
  height: 80dvh;
  overflow: hidden;
}

.interior-bg {
  position: fixed;
  top: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
}

.jp-slogan-parts {
  width: 120px;
}

@media (max-width: 767px) {
  .jp-slogan-parts {
    width: 60px;
  }
}

/* === Menu Slider === */
[data-auto-slider] {
  position: relative;
  overflow: hidden;
  padding: 0 2rem;
}

[data-auto-slider] [data-slider-track] {
  display: flex;
  align-items: stretch;
  width: max-content;
  gap: 1.5rem;
  will-change: transform;
}

@media (max-width: 767px) {
  [data-auto-slider] {
    padding: 0 1rem;
  }

  [data-auto-slider] [data-slider-track] {
    gap: 1rem;
  }
}

.menu-slider-item {
  display: flex;
  flex-direction: column;
  width: clamp(220px, 24vw, 380px);
  overflow: hidden;
  opacity: 1;
  transition: opacity 0.3s ease;
}

.menu-slider-item img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
  border-radius: 1em;
}

.menu-slider-item-name {
  display: block;
  margin-top: 1em;
  padding: 0 1em;
  color: #fff;
}

@media (max-width: 767px) {
  .menu-slider-item {
    width: min(70vw, 320px);
  }
}

.menu-embla:hover .menu-slider-item:not(:hover) {
  opacity: 0.5;
}

/* === Restaurants Slider Cards === */

.restaurant-card {
  position: relative;
  width: 100%;
  aspect-ratio: 460 / 950;
  overflow: hidden;
  border-radius: 25px;
  color: #fff;
  text-decoration: none;
}

.restaurant-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: relative;
}

/* restaurant-card hover overlay with fade */
.restaurant-card::after {
  content:'';
  position:absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.4);
  z-index: 1;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
}

.restaurants-embla:hover .restaurant-card:not(:hover)::after {
  opacity: 1;
}

.restaurant-card__overlay {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 0.75rem;
  padding: 1.5rem 1.25rem;
  z-index: 2;
}

@media (max-width: 1024px) {
  .restaurant-card__overlay {
    padding: 1.25rem 1rem;
  }
}

@media (max-width: 767px) {
  .restaurant-card__overlay {
    padding: 1rem;
  }
}

.restaurant-card__title {
  margin: 0;
  font-size: clamp(1rem, 1vw, 1.2rem);
  font-weight: 600;
  letter-spacing: 0.08em;
}

.restaurant-card__copy {
  margin: 0;
  font-size: clamp(0.8rem, 0.92vw, 1rem);
  line-height: 1.45;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 3;
  min-height: calc(1em * 1.45 * 3);
}

@media (max-width: 767px) {
  .restaurants-slider {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
  }

  .restaurant-card {
    width: min(72vw, 320px);
  }
}

@media (min-width: 768px) {
  .restaurant-card__copy {
    -webkit-line-clamp: 3;
    min-height: calc(1em * 1.45 * 3);
  }
}

@media (min-width: 1025px) {
  .restaurant-card__copy {
    -webkit-line-clamp: 2;
    min-height: calc(1em * 1.45 * 2);
  }
}

.business-hour-table { margin: 0 auto }
.business-hour-table th { font-weight:normal; text-align:left }
.business-hour-table th, .business-hour-table td { padding: .25em }

.restaurant-locations__description {
  text-align: center;
}

.restaurant-locations__layout {
  display: grid;
  gap: 2.5rem;
  align-items: center;
}

.restaurant-locations__brand {
  text-align: center;
}

.restaurant-locations__body {
  min-width: 0;
}

.restaurant-locations__grid {
  display: grid;
  gap: 4rem;
  justify-content: center;
}

.restaurant-location {
  display: block;
}

.restaurant-location__content {
  display: grid;
  gap: 1.25rem;
  max-width: 100%;
  margin: 0 auto;
}

.restaurant-location__meta {
  min-width: 0;
}

.restaurant-location__hours {
  min-width: 0;
}

.restaurant-location__address {
  margin-bottom: 0;
}

.restaurant-location .business-hour-table {
  margin: 0;
}

.restaurant-location__cta {
  text-align: left;
}

.restaurant-locations__cta {
  text-align: center;
}

@media (min-width: 768px) {
  .restaurant-locations__layout {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    column-gap: 3rem;
  }

  .restaurant-locations__brand {
    text-align: center;
  }

  .restaurant-locations__grid {
    grid-template-columns: 1fr;
    row-gap: 5rem;
    align-items: start;
  }

  .restaurant-location__content {
    margin: 0;
    grid-template-columns: minmax(0, 1fr) minmax(220px, 0.9fr);
    column-gap: 2.5rem;
    align-items: start;
  }
}

.signup-form{ margin-top:1.5em; display:flex; justify-content:center; }
.signup-form__input {width:100%; max-width:450px; border:#b2b1af 1px solid; color:#FFF; background-color:transparent; padding:0.5rem 0.75rem;margin:0 auto;display:block; font-size:1.2rem}
.signup-form__submit {
  padding: 0 1.25em;
  border-radius: 0;
  max-height: 40px;
  border: 1px solid #FFF;
  background: #CCC;
  color: #130804;
  font-weight: 600;
  letter-spacing: 0.04em;
  cursor: pointer;
  transition: background 0.18s ease;
}
.signup-form__submit:hover,
.signup-form__submit:focus-visible {
  background: #FFF;
}
.signup-form__submit:active {
  background: #000;
  color:#FFF;
}
.signup-form__submit:disabled {
  cursor: not-allowed;
  opacity: 0.7;
  background: #aaa;
  color: #130804;
}
.contact-form-section {
  margin-top: 2.5rem;
}

.contact-form-section .wpcf7 {
  max-width: 100%;
}

.contact-form {
  --contact-border: #8f908b;
  --contact-text: #111;
  --contact-button: #130804;
}

.contact-form__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.75rem 1rem;
}

.contact-form__field,
.contact-form__field--full {
  min-width: 0;
}

.contact-form__field--full {
  grid-column: 1 / -1;
}

.contact-form__message-guide {
  color: #2c2c2c;
  font-size: 0.95rem;
  line-height: 1.7;
}

.contact-form__message-guide[hidden] {
  display: none;
}

.contact-form__input,
.contact-form__select,
.contact-form__textarea {
  width: 100%;
  border: 1px solid var(--contact-border);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: var(--contact-text);
  font-size: 1rem;
  line-height: 1.4;
  font-family: 'Noto Sans JP', sans-serif;
}

.contact-form__input,
.contact-form__select {
  padding: 1rem 1.875rem;
}

.contact-form__textarea {
  min-height: 24rem;
  padding: 1.25rem 1.875rem;
  resize: vertical;
}

.contact-form__input::placeholder,
.contact-form__textarea::placeholder {
  color: #2c2c2c;
  opacity: 1;
}

.contact-form__select {
  -webkit-appearance: none;
  appearance: none;
  background-image:
    linear-gradient(45deg, transparent 50%, var(--contact-text) 50%),
    linear-gradient(135deg, var(--contact-text) 50%, transparent 50%);
  background-position:
    calc(100% - 2rem) 50%,
    calc(100% - 1.55rem) 50%;
  background-size: 0.46rem 0.6rem, 0.46rem 0.6rem;
  background-repeat: no-repeat;
  padding-right: 4rem;
}

.contact-form__submit-wrap {
  margin-top: 1.5rem;
  position: relative;
}

.contact-form__submit {
  width: 100%;
  min-height: 4.25rem;
  border: 0;
  border-radius: 0;
  background: var(--contact-button);
  color: #fff;
  font-size: 1rem;
  font-weight: 400;
  letter-spacing: 0.02em;
  transition: opacity 0.18s ease;
}

.contact-form__submit:hover,
.contact-form__submit:focus-visible {
  opacity: 0.88;
}

.contact-form__submit:disabled {
  opacity: 0.7;
}

.contact-form .wpcf7-spinner {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  margin: 0;
}

.contact-form .wpcf7-form-control-wrap {
  display: block;
}

.contact-form .wpcf7-not-valid-tip {
  font-size: 0.875rem;
}

.contact-form-section .wpcf7 form .wpcf7-response-output {
  margin: 1rem 0 0;
}

@media only screen and (max-width: 767px) {
  .contact-form__grid {
    grid-template-columns: 1fr;
  }

  .contact-form__input,
  .contact-form__select {
    height: 4.25rem;
    padding: 0 1.25rem;
  }

  .contact-form__textarea {
    min-height: 18rem;
    padding: 1rem 1.25rem;
  }
}

.wpcf7-not-valid-tip{margin-top:0.5em}
.wpcf7 form .wpcf7-response-output {
    padding: 0.5em 1em!important;
    text-align: center;
}

footer { background-color: #130804; color: #FFF; }

.footer-links a {color:#FFF; text-decoration: none;}
.footer-links a:after{content:'|';margin:0 1rem}
.footer-links a:last-child:after{display: none;}
.footer-links a:hover,
.footer-links a:focus-visible {
  text-decoration: underline;
  text-underline-offset: 2px;
}

.social-icon-link {
  display: inline-block;
}

.social-icons { height: 3em; color: #FFF; fill: #FFF; transition: opacity 0.2s ease;}
.social-icon-link:hover .social-icons,
.social-icon-link:focus-visible .social-icons {
  opacity: 0.75;
}

.restaurant-logos{padding-bottom:2rem}
.restaurant-logos__image {width:100%; height: auto;}
.logos-embla {
  position: relative;
}
.logos-embla .embla__container {
  transition: opacity 0.3s ease;
}
.logos-embla:hover .embla__slide:not(:hover) {
  opacity: 0.5;
}
@keyframes logos-marquee {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}
/* === Swiper hover effects === */
@media only screen and (min-width: 1025px) {
  .swiper:hover .swiper-slide {
    opacity: 0.4;
    transition: opacity 0.5s ease;
  }

  .swiper:hover .swiper-slide:hover {
    opacity: 1;
  }
}
.site-header.site-header--inline {
  position: sticky;
}

/* === Unit page === */
body.unit-page {
  background: #f4eee7;
  color: #1a1a1a;
}


.site-header--unit .hamburger span {
  background: #000;
}

.unit-hero {
  position: relative;
  width: 100vw;
  /*height: min(100vh, calc(100vw * 9 / 16));
  max-height: 100vh;*/
  aspect-ratio: 16 / 9;
  display: flex;
  align-items: flex-end;
  margin: 0 auto;
  padding: 0;
  overflow: hidden;
}

.unit-hero__video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  z-index: 0;
}

.unit-hero__embed {
  position: absolute;
  inset: 0;
  z-index: 0;
  aspect-ratio: 16 / 9;
}

.unit-hero__iframe {
  width: 100%;
  height: 100%;
  border: 0;
}

.unit-hero__unmute {
  position: absolute;
  right: 2em;
  top: 5em;
  padding: 1rem;
  border: 0;
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.68);
  color: #fff;
  font-size: 0.875rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  cursor: pointer;
  transition: opacity 0.25s ease, transform 0.25s ease, background 0.25s ease;
}

.unit-hero__unmute svg {
  width: 1.2em;
  height: 1.2em;
  fill: #FFF;
  display: block;
}

.unit-hero__unmute:hover,
.unit-hero__unmute:focus-visible {
  background: rgba(0, 0, 0, 0.82);
}

.unit-hero__unmute.is-hidden {
  opacity: 0;
  pointer-events: none;
}

@media (max-width: 768px) {
  .unit-hero__unmute {
    right: 1rem;
    padding: 0.8rem;
    font-size: 0.75rem;
  }
}

.unit-hero__content {
  position: relative;
  z-index: 2;
  display: grid;
  gap: 1rem;
  max-width: 640px;
}

.unit-hero__kicker {
  font-size: 1rem;
  letter-spacing: 0.08em;
  color: #fff;
}

.unit-hero__button {
  width: fit-content;
  padding: 0.65em 2.2em;
  background: #fff;
  color: #000;
  border: 0;
  border-radius: 999px;
  letter-spacing: 0.06em;
  font-weight: 600;
  cursor: pointer;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.unit-hero__button:hover,
.unit-hero__button:focus-visible {
  transform: translateY(-1px);
  box-shadow: 0 14px 30px rgba(0,0,0,0.25);
}

.unit-intro {
  text-align: center;
  padding: clamp(3rem, 8vw, 10rem) 1rem;
}

.unit-intro__eyebrow {
  letter-spacing: 0.3em;
  font-size: 0.95rem;
  margin-bottom: 0rem;
}

.unit-intro__title {
  margin: 0;
}

.unit-intro__title-image {
  display: block;
  width: 100%;
  max-width: 600px;
  height: auto;
  margin: 0 auto;
}

.unit-intro__lead {
  margin: 4rem 0 1.5rem;
  font-size: clamp(1.3rem, 3vw, 1.7rem);
  font-weight: 500;
}

.unit-intro__copy {
  max-width: 780px;
  margin: 0 auto;
  line-height: 1.5;
  font-size: clamp(0.7rem, 0.9vw, 0.8rem);
}

.unit-dishes {
  padding: 1rem 0 clamp(3rem, 6vw, 5rem);
}

.unit-dishes__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.75rem;
}

.unit-card {
  background: transparent;
  color: #1a1a1a;
  border-radius: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: none;
  transition: none;
}

.unit-card__image {
  width: 100%;
  height: auto;
  display: block;
}

.unit-card__media {
  position: relative;
  overflow: hidden;
}

.unit-card__overlay {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  background: rgba(122, 15, 37, 0.8);
  opacity: 0;
  transition: opacity 0.3s ease;
  pointer-events: none;
}

.unit-card__badge {
  width: 100%;
  height: auto;
  max-width: 260px;
}

.unit-card__media:hover .unit-card__overlay,
.unit-card__media:focus-within .unit-card__overlay {
  opacity: 1;
  cursor: pointer;
}

.unit-card__body {
  padding: 1.4rem 0 1.6rem;
  display: grid;
  gap: 1rem;
  flex: 1;
}

.unit-card__title {
  margin: 0;
  font-size: clamp(1.2rem, 2.5vw, 1.6rem);
  font-weight: 100;
  letter-spacing: -0.5px;
}

.unit-card__text {
  margin: 0;
  color: #333;
  line-height: 1.5;
  font-size: clamp(0.7rem, 0.9vw, 0.8rem);
}

.unit-card__button {
  margin-top: auto;
  width: fit-content;
  padding: 0.45em 1.6em;
  border-radius: 0;
  text-decoration: none;
  background: #000;
  color: #fff;
  border: 1px solid #000;
  letter-spacing: 0.04em;
  font-weight: 400;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.unit-card__button.coming-soon {
  background: #666;
  color: #FFF;
}

.unit-card__button:hover,
.unit-card__button:focus-visible {
  background: #fff;
  color: #000;
  border-color: #000;
}

.unit-card__button.coming-soon:hover {
  background: #666;
  color: #FFF;
  cursor: default;
}

.unit-banner {
  position: relative;
  margin: clamp(3rem, 6vw, 5rem) auto;
  width: 100%;
  min-height: clamp(55vh, 77vh, 88vh);
  border-radius: 0;
  overflow: hidden;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

.unit-banner--las-vegas {
  background-image: url("../images/unit/las-vegas_hero.webp");
}

.unit-banner--west-hollywood {
  background-image: url("../images/unit/west-hollywood_hero.webp");
}

.unit-banner--new-york-broadway {
  background-image: url("../images/unit/new-york-broadway_hero.webp");
}

.unit-banner--new-york-1gcp {
  background-image: url("../images/unit/new-york-1gcp_hero.webp");
}

@media (max-width: 1024px) {
  .unit-banner {
    background-attachment: scroll;
  }
}

.unit-feature {
  padding: clamp(3.3rem, 6.6vw, 5.5rem) 1rem;
}

.unit-feature__grid {
  display: grid;
  grid-template-columns: 2fr 3fr;
  gap: clamp(2rem, 4vw, 3.5rem);
  align-items: center;
}

.unit-feature__copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: clamp(3rem, 5vw, 4.5rem);
  min-height: 100%;
}

.unit-feature__intro {
  margin-bottom: 0;
}

.unit-feature__info {
  display: grid;
  gap: 1.2rem;
  max-width: 32rem;
}

.unit-feature__eyebrow {
  margin: 0;
  font-size: clamp(2.4rem, 4.6vw, 3rem);
  line-height: 1.05;
  letter-spacing: -0.03em;
  font-weight: 300;
}

.unit-feature__title {
  margin: 0;
  font-size: clamp(1.2rem, 2.5vw, 1.6rem);
  line-height: 1.1;
  font-weight: 500;
}

.unit-feature__text {
  line-height: 1.45;
  font-size: clamp(0.7rem, 0.9vw, 0.8rem);
  margin: 0;
  color: #222;
  max-width: 30rem;
}

.unit-feature__link {
  position: relative;
  width: fit-content;
  color: #000;
  text-decoration: none;
  font-size: clamp(1rem, 1.05vw, 1.2rem);
  font-weight: 700;
  text-decoration: underline;
}

.unit-feature__link:hover,
.unit-feature__link:focus-visible {
  opacity: 0.7;
}

.unit-feature__media {
  border-radius: 0;
  overflow: hidden;
  box-shadow: none;
}

.unit-feature__image {
  width: 100%;
  height: auto;
  display: block;
}

.unit-map {
  padding: clamp(2.5rem, 5vw, 4rem) 0 0;
}

.unit-map__frame {
  position: relative;
  width: 100%;
  height: clamp(55vh, 77vh, 88vh);
  border-radius: 0;
  overflow: hidden;
  box-shadow: none;
}

.unit-map__frame iframe {
  width: 100%;
  height: 100%;
  display: block;
  filter: grayscale(0.5) sepia(0.1) saturate(0.9) brightness(0.9) contrast(1.05) hue-rotate(-10deg);
}

.unit-partners {
  background: #7a0f25;
  color: #fff;
  padding: clamp(3.3rem, 6.6vw, 4.95rem) 1rem clamp(4.95rem, 9.9vw, 7.425rem);
}

.unit-partners__grid {
  display: grid;
  grid-template-columns: 1fr 3fr;
  gap: clamp(3.5rem, 5vw, 5rem);
  align-items: center;
}

.unit-partners__hours {
  display: grid;
  gap: 0.75rem;
  max-width: 200px;
  margin: 0 auto;
}

.unit-partners__title {
  margin: 0;
  font-weight: normal;
}

.unit-partners__note {
  margin: 0;
  line-height: 1.5;
}

.unit-partners__list {
  margin: 2rem 0 0;
  padding: 0;
  display: grid;
  gap: 0.5rem;
  max-width: 200px;
}

.unit-partners__list dt {
  font-weight: 400;
  letter-spacing: 0.04em;
}

.unit-partners__list dd {
  margin: 0.1rem 0 0;
  line-height: 1.4;
  opacity: 0.85;
}

.unit-partners__row {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
}

.unit-partners__logos {
  column-count: 3;
  column-gap: 0;
  max-width: 720px;
  margin: 0 auto;
  gap: 1em;
}

.unit-partners__logos img {
  width: 100%;
  height: auto;
  max-width: 200px;
  display: block;
  break-inside: avoid;
  object-fit: contain;
}

.unit-page--west-hollywood .unit-partners__logos,
.unit-partners__logos--west-hollywood {
  column-count: 4;
  max-width: 920px;
}

.unit-partners__logos--1gcp {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 0.95fr) minmax(0, 0.9fr) minmax(0, 1.05fr);
  grid-template-rows: auto auto;
  max-width: 980px;
  margin: 0 auto;
  align-items: start;
}

.unit-partners__logos--1gcp .unit-partners__logo {
  display: flex;
  align-items: center;
  justify-content: center;
}

.unit-partners__logos--1gcp .unit-partners__logo img {
  max-width: 100%;
}

.unit-partners__logo--kikuzushi {
  grid-column: 1;
  grid-row: 1;
}

.unit-partners__logo--naruse {
  grid-column: 2;
  grid-row: 1;
}

.unit-partners__logo--shinohara {
  grid-column: 3;
  grid-row: 1;
}

.unit-partners__logo--makitori {
  grid-column: 4;
  grid-row: 1;
}

.unit-partners__logo--chiune {
  grid-column: 1 / span 2;
  grid-row: 2;
  align-self: start;
  margin-top: -5em;
}

.unit-partners__logos--1gcp .unit-partners__logo--kikuzushi img {
  max-width: 140px;
}

.unit-partners__logos--1gcp .unit-partners__logo--naruse img {
  max-width: 140px;
}

.unit-partners__logos--1gcp .unit-partners__logo--makitori img {
  max-width: 170px;
}

.unit-partners__logos--1gcp .unit-partners__logo--chiune img {
  max-width: 400px;
}

.unit-cities {
  padding: 0;
}

.unit-cities__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 1.5rem;
}

.unit-city-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  margin: 0;
}

.unit-city-card {
  position: relative;
  display: block;
  color: #fff;
  text-decoration: none;
  overflow: hidden;
  border-radius: 16px;
}

.unit-city-card__image {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.unit-city-card__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,0.05) 0%, rgba(0,0,0,0.55) 100%);
  transition: background 0.25s ease;
}

.unit-city-card__label {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  text-align: center;
  letter-spacing: 0.08em;
  font-weight: 700;
}

.unit-city-card__cta {
  position: absolute;
  left: 50%;
  bottom: 14%;
  transform: translateX(-50%);
  padding: 0.4em 1.2em;
  border: 1px solid #fff;
  border-radius: 999px;
  letter-spacing: 0.08em;
  font-size: 0.9rem;
}

.unit-city-card:hover .unit-city-card__overlay,
.unit-city-card:focus-visible .unit-city-card__overlay {
  background: rgba(0,0,0,0.45);
}

.unit-footer {
  background: #100807;
  color: #fff;
  text-align: center;
  padding: clamp(3rem, 6vw, 4.5rem) 1rem;
}

.unit-footer__top {
  display: grid;
  gap: 0.5rem;
}

.unit-footer__link {
  color: inherit;
  text-decoration: none;
  letter-spacing: 0.06em;
  font-weight: 600;
}

.unit-footer__logos {
  margin: 2rem auto 1.5rem;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
  gap: 1rem;
  align-items: center;
  justify-items: center;
}

.unit-footer__logos img {
  width: 100%;
  max-width: 140px;
  height: auto;
  filter: invert(1);
}

.unit-footer__copy {
  font-size: 0.9rem;
  opacity: 0.8;
}

@media (max-width: 900px) {
  .unit-feature__grid {
    grid-template-columns: 1fr;
  }

  .unit-feature__copy {
    justify-content: flex-start;
    gap: 2rem;
  }

  .unit-dishes__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 2rem 0.5rem;
  }

  .unit-partners__grid {
    grid-template-columns: 1fr;
  }

  .unit-partners__logos--1gcp {
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 0.95fr) minmax(0, 0.9fr) minmax(0, 1.05fr);
    column-gap: 0.25rem;
    row-gap: 0;
  }

  .unit-partners__logos--1gcp .unit-partners__logo--kikuzushi img {
    max-width: 110px;
  }

  .unit-partners__logos--1gcp .unit-partners__logo--naruse img {
    max-width: 88px;
  }

  .unit-partners__logos--1gcp .unit-partners__logo--shinohara img {
    max-width: 96px;
  }

  .unit-partners__logos--1gcp .unit-partners__logo--makitori img {
    max-width: 128px;
  }

  .unit-partners__logos--1gcp .unit-partners__logo--chiune {
    margin-top: -1em;
  }

  .unit-partners__logos--1gcp .unit-partners__logo--chiune img {
    max-width: 280px;
  }
}

@media (max-width: 768px) {
  .unit-card__body {
    padding: 1.2rem 0 1.35rem;
  }

  .unit-city-card__label {
    font-size: 0.95rem;
    padding: 0 1rem;
  }
}

.tenshou-misc {
  line-height: 1.5em;
}
.tenshou-misc h1,
.tenshou-misc h2,
.tenshou-misc h3,
.tenshou-misc h4 {
  font-weight: 500;
  margin-top: 2em;
  margin-bottom: 1em;
}
.tenshou-misc p,
.tenshou-misc ul,
.tenshou-misc table {
  margin-bottom: 1em;
}
.tenshou-misc ul {
  margin-left: 1.5em;
}
.tenshou-misc ul li {
  margin-bottom: 0.25em
}
.tenshou-misc .table {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.tenshou-misc table {
  width: 100%;
  border-collapse: collapse;
  border:1px solid #CCC;
  line-height: 1.2em;
}
.tenshou-misc table td {
  border:1px solid #CCC;
  padding: 0.5em;
  font-size: 0.75em;
}
.tenshou-misc a {
  color: rgba(122, 15, 37, 1);
  text-underline-offset: 3px;
}
.tenshou-misc a:hover {
  color: #000;
  text-decoration: none;
}