/* トップページ専用デザイン */
:root {
  --home-charcoal: #191b1c;
  --home-charcoal-soft: #242729;
  --home-paper: #f0e9df;
  --home-paper-soft: #e4dbcf;
  /* サイト共通の金色アクセントに統一する */
  --home-copper: var(--accent);
  --home-copper-light: var(--accent);
  --home-copper-dark: var(--accent);
  --home-ink: #202122;
}

.home-page {
  --serif: "Shippori Mincho", "Yu Mincho", "Hiragino Mincho ProN", serif;
  --sans: "Shippori Mincho", "Yu Mincho", "Hiragino Mincho ProN", serif;
}

body.home-page {
  overflow-x: clip;
  background: var(--home-charcoal);
  font-family: "Shippori Mincho", "Yu Mincho", "Hiragino Mincho ProN", serif;
}

.home-page h1,
.home-page h2,
.home-page h3 {
  text-wrap: balance;
}

.home-page .hero h1 {
  word-break: keep-all;
  text-wrap: wrap;
}

.home-page .visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
}

.home-page .site-header {
  border-color: rgba(223, 167, 127, .2);
  background: rgba(20, 22, 23, .78);
}

.home-page .site-header.is-scrolled {
  background: rgba(20, 22, 23, .96);
}

.home-page .site-header.menu-active {
  background: var(--home-charcoal);
}

.home-page .menu-button {
  border-color: rgba(223, 167, 127, .5);
  background: rgba(11, 12, 13, .5);
}

.home-page .global-nav {
  background: var(--home-charcoal);
}

.home-page .section-label,
.home-page .home-gallery-kicker {
  color: var(--home-copper-dark);
}

.home-page .flow-step {
  color: var(--home-copper-light);
  font-variant-numeric: tabular-nums;
}

.home-page .button,
.home-page .detail-link,
.home-page .text-link {
  min-height: 48px;
}

.home-page .home-payment-methods {
  margin-top: 24px;
  padding-top: 22px;
  border-top: 1px solid rgba(223, 167, 127, .32);
}

.home-page .home-payment-methods h3 {
  margin: 0 0 14px;
  color: #f7f1ea;
  font-family: "Shippori Mincho", "Yu Mincho", "Hiragino Mincho ProN", serif;
  font-size: .92rem;
  font-weight: 700;
  letter-spacing: .04em;
}

.home-page .home-payment-methods ul {
  display: grid;
  margin: 0;
  padding: 0;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  list-style: none;
}

.home-page .home-payment-methods li {
  display: flex;
  min-width: 0;
  min-height: 58px;
  padding: 9px 10px;
  align-items: center;
  gap: 9px;
  border: 1px solid rgba(255, 255, 255, .13);
  border-radius: 6px;
  color: #f7f1ea;
  background: rgba(255, 255, 255, .055);
  font-size: .72rem;
  font-weight: 600;
  line-height: 1.45;
}

.home-page .home-payment-methods svg {
  width: 23px;
  height: 23px;
  flex: 0 0 23px;
  fill: none;
  stroke: var(--home-copper-light);
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.65;
}

/* Dark Hospitality */
.home-page .hero {
  color: #f7f1ea;
  background: var(--home-charcoal);
}

.home-page .hero-shade {
  background: linear-gradient(180deg, rgba(16, 18, 19, .08), rgba(16, 18, 19, .2));
}

.home-page .hero-content {
  background: var(--home-charcoal);
}

.home-page .eyebrow,
.home-page .hero-hours .late-hours {
  color: var(--home-copper-light);
}

.home-page .hero h1,
.home-page .home-about h2,
.home-page .home-price-section h2,
.home-page .home-guide h2,
.home-page .home-access-section h2,
.home-page .reservation-section h2 {
  font-family: "Shippori Mincho", "Yu Mincho", "Hiragino Mincho ProN", serif;
  font-weight: 600;
  letter-spacing: -.025em;
}

.home-page h2 {
  margin-bottom: clamp(22px, 3vw, 30px);
  font-size: clamp(1.8rem, 3.4vw, 2.65rem);
}

.home-page .hero-points li {
  border-color: rgba(223, 167, 127, .45);
  background: rgba(20, 22, 23, .58);
}

.home-page .hero-info {
  border-color: rgba(223, 167, 127, .24);
  background: #111314;
}

.home-page .home-about {
  color: #f3ede6;
  background: var(--home-charcoal-soft);
}

.home-page .home-about .lead-copy,
.home-page .home-about h2,
.home-page .home-gallery-header h3 {
  color: #f7f1ea;
}

.home-page .home-about-copy > p:not(.lead-copy),
.home-page .home-gallery-hint {
  color: #c9bdb3;
}

.home-page .comfort-list li {
  border-color: rgba(223, 167, 127, .22);
  color: #d8ccc2;
  background: rgba(255, 255, 255, .04);
}

.home-page .home-about-copy .comfort-list {
  margin-top: 0;
}

.home-page .home-gallery-card {
  border: 1px solid rgba(223, 167, 127, .18);
  border-radius: 8px;
}

.home-page .home-price-section {
  background: #121415;
}

.home-page .home-price-section .section-label,
.home-page .home-price-section .detail-link,
.home-page .home-price-card dd {
  color: var(--home-copper-light);
}

.home-page .home-price-card {
  border-color: rgba(223, 167, 127, .26);
  border-radius: 8px;
  background: rgba(255, 255, 255, .035);
}

.home-page .home-guide {
  color: var(--home-ink);
  background: var(--home-paper);
}

.home-page .home-guide .section-label,
.home-page .home-guide .detail-link,
.home-page .home-guide .steps > li > span {
  color: var(--home-copper-dark);
}

.home-page .home-guide-photo,
.home-page .home-access-card,
.home-page .google-map-embed {
  border-radius: 8px;
}

.home-page .home-guide-photo img {
  object-position: center 48%;
}

.home-page .home-access-section {
  color: #f3ede6;
  background: var(--home-charcoal-soft);
}

.home-page .home-access-section h2,
.home-page .home-access-section .home-section-intro {
  color: #f3ede6;
}

.home-page .home-access-card {
  border-color: rgba(223, 167, 127, .22);
  background: #f2ebe2;
  color: var(--home-ink);
}

.home-page .home-access-card dt,
.home-page .home-access-card .detail-link {
  color: var(--home-copper-dark);
}

.home-page .map-button {
  color: #171819;
  background: var(--home-copper-light);
}

.home-page .reservation-section::before {
  background: linear-gradient(135deg, rgba(17, 19, 20, .98), rgba(47, 35, 29, .95));
}

@media (max-width: 699px) {
  body.home-page {
    font-size: 16px;
  }

  .home-page .section {
    padding-block: 72px;
  }

  .home-page h2 {
    font-size: clamp(1.65rem, 7.2vw, 2rem);
    line-height: 1.4;
  }

  .home-page .section-label,
  .home-page .home-gallery-kicker,
  .home-page .home-gallery-hint,
  .home-page .home-price-note,
  .home-page .home-price-case {
    font-size: .78rem;
  }

  .home-page .hero {
    display: grid;
    min-height: 0;
    padding-top: var(--header-height);
    align-items: stretch;
    grid-template-rows: minmax(250px, 40svh) auto auto;
  }

  .home-page .hero-visual {
    position: relative;
    inset: auto;
    height: auto;
    min-height: 0;
    grid-row: 1;
  }

  .home-page .hero-visual::before {
    display: none;
  }

  .home-page .hero-visual picture {
    position: absolute;
    inset: 0;
  }

  .home-page .hero-image {
    object-fit: cover;
    object-position: center 42%;
    filter: brightness(.92) contrast(1.05) saturate(.92);
  }

  .home-page .hero-content {
    width: 100%;
    padding: 26px 18px 30px;
    grid-row: 2;
  }

  .home-page .hero-content .eyebrow,
  .home-page .hero-content h1 {
    display: block;
  }

  .home-page .eyebrow {
    margin-bottom: 10px;
    font-size: .72rem;
  }

  .home-page .hero h1 {
    max-width: 12em;
    margin-bottom: 12px;
    font-size: clamp(2rem, 9.4vw, 2.65rem);
    line-height: 1.28;
  }

  .home-page .hero-lead {
    max-width: 31em;
    margin-bottom: 16px;
    font-size: .88rem;
    line-height: 1.7;
    text-wrap: balance;
  }

  .home-page .hero-points {
    margin-bottom: 18px;
  }

  .home-page .hero-points li {
    padding: 5px 10px;
    font-size: .72rem;
  }

  .home-page .hero-actions {
    display: grid;
    width: 100%;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 14px;
  }

  .home-page .hero-actions .button {
    width: 100%;
  }

  .home-page .hero-info {
    position: static;
    min-height: 76px;
    padding: 14px 18px;
    grid-row: 3;
  }

  .home-page .hero-location,
  .home-page .hero-hours,
  .home-page .hero-hours b {
    font-size: .75rem;
  }

  .home-page .home-guide-photo {
    aspect-ratio: 4 / 3;
  }

  .home-page .mobile-reserve-home.is-hidden {
    visibility: hidden;
  }

}

@media (min-width: 700px) {

  .home-page .hero {
    display: grid;
    min-height: 100svh;
    padding-top: var(--header-height);
    grid-template-columns: minmax(340px, 42%) minmax(0, 58%);
    align-items: stretch;
  }

  .home-page .hero-visual {
    position: relative;
    inset: auto;
    grid-column: 2;
    grid-row: 1;
  }

  .home-page .hero-content {
    display: flex;
    width: auto;
    padding: clamp(60px, 8vw, 112px) clamp(40px, 6vw, 96px);
    align-self: stretch;
    justify-content: center;
    flex-direction: column;
    grid-column: 1;
    grid-row: 1;
  }

  .home-page .hero h1 {
    font-size: clamp(3.1rem, 4vw, 3.6rem);
  }

  .home-page .hero-info {
    right: 24px;
    bottom: 20px;
  }

}

@media (min-width: 1040px) {
  .home-page .global-nav {
    background: transparent;
  }

}

.home-page .home-guide-grid {
  grid-template-columns: minmax(0, 1fr);
}

.home-page .home-guide-content {
  width: min(100%, 780px);
  margin-inline: auto;
}

/* 最初の画面で予約先とDMに送る内容を伝える */
.home-page .hero-reservation-note {
  margin: 0 0 16px;
  color: #fff8f4;
  font-size: .8rem;
  line-height: 1.8;
  text-shadow: 0 1px 8px rgba(0,0,0,.6);
}
@media (max-width: 640px) {
  .home-page .hero-actions {
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
  }
  .home-page .hero-actions .text-link { justify-self: start; }
}
