:root { --fs-body: 16px; --lh-body: 2.25; --section-y: 5.5rem; --header-h: 4.75rem; }
  html[lang="en"] { --lh-body: 2.25; }
  html[lang="ko"] { --lh-body: 2.25; }

@media (min-width: 1024px) {
    .site-header--overlay .head-nav {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 1.4rem;
      margin-inline: auto;
      white-space: nowrap;
    }
    .site-header--overlay .head-nav .nav {
      display: flex;
      gap: 1.7rem;
      font-family: var(--font-en);
      font-size: .95rem;
      letter-spacing: .06em;
    }
    .site-header--overlay .head-nav .nav a { position: relative; padding: 2px 3px; color: #fff; }
    .site-header--overlay .head-nav .nav a::after {
      position: absolute;
      bottom: -2px;
      left: 5%;
      width: 0;
      height: 1px;
      background: #fff;
      transition: width var(--dur) var(--ease);
      content: "";
    }
    .site-header--overlay .head-nav .nav a:hover::after,
    .site-header--overlay .head-nav .nav a.is-current::after { width: 90%; }
    .site-header--overlay .head-nav .sns { display: flex; gap: .8rem; }
}

  .hero { min-height: 700px; --hero-inset: 100px; }

@media (min-width: 1024px) {
    .hero-tate {
      top: calc(var(--header-h) + 2.2rem);
      right: auto;
      left: 1.6rem;
      writing-mode: vertical-rl;
      white-space: nowrap;
      font-size: .72rem;
      letter-spacing: .24em;
      line-height: 1.6;
      text-align: left;
    }
}

  .scroll-ring { right: 2.6rem; bottom: 2.2rem; }

  .scroll-ring-circle { width: 104px; height: 104px; }

  .page-hero { min-height: 420px; }

  .section--invert { padding-block: 300px; }

  .section--invert::before,
  .section--invert::after { height: 260px; }

  .btn-pair { grid-template-columns: repeat(2, minmax(0, 19rem)); }
  .btn-pair .btn { width: 100%; }

  .band { min-height: 560px; padding-block: 6rem; }

  .band--photo-left .band-inner { display: grid; grid-template-columns: auto 1fr; gap: 3.5rem; align-items: center; }
  .band--photo-left .band-photo { margin: 0; }
  .band--photo-left .band-text,
  .band--photo-left .band-text .lead,
  .band--photo-left .band-text .mist-kanji,
  .band--photo-left .band-text .mist-kanji-en { text-align: left; }
  .band--photo-left .band-text .narrow { margin-inline: 0; }

  .split { grid-template-columns: var(--split-cols, 1fr 1fr); gap: 3.5rem; }
  .split--rev > figure { order: 2; }

  .gallery-grid { grid-template-columns: repeat(3, 1fr); gap: 4px; }

  .duo { grid-template-columns: 1fr 1fr; }

  .info-list dl { grid-template-columns: 9em 1fr; gap: 1rem; }

  .drawer-inner { display: grid; grid-template-columns: 1fr 1fr; align-items: center; }
  .drawer-menu { padding-top: 0; }
  .drawer-brand-col { display: flex; justify-content: center; }
  .drawer-brand {
    writing-mode: vertical-rl;
    text-orientation: upright;
    margin: 0;
    font-family: var(--font-jp-head);
    font-size: 1.3rem;
    letter-spacing: .26em;
    line-height: 1.7;
    color: #fff;
  }

  :root { --wrap-max: 1120px; --wrap-pad: 2rem; }

@media (min-width: 1440px) {
    :root { --wrap-max: 1240px; }
}

main p { max-width: 45em; }
main .txt-center > p,
main p.txt-center { margin-inline: auto; }

:root { --header-h: 5.25rem; --footer-brand-img-h: 88px; }

.logo-img { height: 64px; width: auto; }
.site-header .logo { min-width: 44px; align-items: center; }
.drawer-brand-img { height: 220px; width: auto; }

@media (min-width: 1024px) {
  html[lang="en"] .hero-tate,
  html[lang="ko"] .hero-tate {
    writing-mode: horizontal-tb;
    top: calc(var(--header-h) + 1rem);
    right: 1.6rem;
    left: calc(var(--hero-inset, 100px) + 1.6rem);
    white-space: normal;
    text-align: left;
  }
}

.drawer-menu { justify-content: flex-start; }
.drawer-menu > :first-child { margin-top: auto; }
.drawer-menu > :last-child  { margin-bottom: auto; }