/**
 * Simplified global navigation drawer.
 *
 * Loaded after page.css. The `.site-drawer--simple` scope makes this module
 * authoritative without changing legacy navigation on cached markup.
 */

.site-drawer--simple {
  --drawer-simple-line: rgba(16, 17, 19, 0.14);
  --drawer-simple-muted: rgba(16, 17, 19, 0.52);
  --drawer-simple-paper: #f6f4f1;
}

.site-drawer--simple .site-drawer__backdrop {
  background:
    linear-gradient(180deg, rgba(246, 244, 241, 0.97), rgba(246, 244, 241, 0.99)),
    var(--paper-texture-image);
  background-position: center;
  background-size: cover, 960px auto;
}

.site-drawer--simple .site-drawer__backdrop::before {
  right: -0.03em;
  bottom: -0.16em;
  color: rgba(16, 17, 19, 0.018);
}

.site-drawer--simple .site-drawer__body {
  display: grid;
  grid-template-columns: minmax(220px, 300px) minmax(0, 1fr);
  grid-template-rows: auto auto minmax(0, 1fr);
  grid-template-areas:
    "intro nav"
    "contact nav"
    "utility nav";
  column-gap: clamp(44px, 7vw, 108px);
  row-gap: 24px;
  min-height: 0;
  margin-top: clamp(26px, 4vh, 48px);
  padding: 0 6px 18px 0;
  overflow-y: auto;
  scrollbar-gutter: stable;
}

.site-drawer--simple .site-drawer__intro {
  grid-area: intro;
  max-width: none;
}

.site-drawer--simple .site-drawer__eyebrow {
  margin: 0 0 12px;
  color: var(--drawer-simple-muted);
  font-size: 12px;
  letter-spacing: 0.14em;
}

.site-drawer--simple .site-drawer__title {
  margin: 0;
  font-family: var(--sans);
  font-size: clamp(28px, 3vw, 42px);
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -0.03em;
}

.site-drawer--simple .site-drawer__lead {
  max-width: 24em;
  margin: 14px 0 0;
  color: var(--drawer-simple-muted);
  font-size: 12px;
  line-height: 1.75;
}

.site-drawer--simple .site-drawer__nav--simple {
  grid-area: nav;
  align-self: stretch;
  min-width: 0;
  border-top: 1px solid var(--drawer-simple-line);
}

.site-drawer--simple .site-drawer__link-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 clamp(28px, 4.4vw, 68px);
  padding: 0;
}

.site-drawer--simple .site-drawer__link {
  display: grid;
  grid-template-columns: minmax(92px, 0.5fr) minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  min-height: clamp(66px, 9vh, 82px);
  padding: 0;
  border-bottom: 1px solid var(--drawer-simple-line);
  color: var(--text);
  background: transparent;
  box-shadow: none;
  transition: color 180ms ease, padding 240ms cubic-bezier(.2, .8, .2, 1);
}

.site-drawer--simple .site-drawer__link-en {
  color: var(--drawer-simple-muted);
  font-family: var(--serif);
  font-size: 11px;
  font-style: italic;
  line-height: 1.3;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.site-drawer--simple .site-drawer__link-jp {
  color: inherit;
  font-size: clamp(15px, 1.35vw, 19px);
  font-weight: 700;
  line-height: 1.4;
}

.site-drawer--simple .site-drawer__link-arrow {
  color: rgba(16, 17, 19, 0.38);
  font-family: var(--serif);
  font-size: 16px;
  transition: color 180ms ease, transform 220ms cubic-bezier(.2, .8, .2, 1);
}

.site-drawer--simple .site-drawer__link.is-current {
  color: var(--accent);
  background: transparent;
  box-shadow: none;
}

.site-drawer--simple .site-drawer__link.is-current .site-drawer__link-en,
.site-drawer--simple .site-drawer__link.is-current .site-drawer__link-arrow {
  color: var(--accent);
}

.site-drawer--simple .site-drawer__contact {
  grid-area: contact;
  position: relative;
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-areas:
    "overline action"
    "title action"
    "copy action";
  align-items: center;
  gap: 6px 18px;
  min-height: 0;
  padding: 20px 22px;
  overflow: hidden;
  color: #f7f4ef;
  background: #171715;
  isolation: isolate;
}

.site-drawer--simple .site-drawer__contact::before {
  background: radial-gradient(circle at 100% 0%, rgba(233, 46, 60, 0.18), transparent 48%);
}

.site-drawer--simple .site-drawer__contact-overline {
  grid-area: overline;
  color: rgba(247, 244, 239, 0.55);
  font-size: 10px;
}

.site-drawer--simple .site-drawer__contact-title {
  grid-area: title;
  margin: 0;
  font-size: 19px;
  line-height: 1.4;
}

.site-drawer--simple .site-drawer__contact-copy {
  grid-area: copy;
  margin: 0;
  color: rgba(247, 244, 239, 0.68);
  font-size: 11px;
  line-height: 1.7;
}

.site-drawer--simple .site-drawer__contact-action {
  grid-area: action;
  display: block;
  margin: 0;
  padding: 0;
  border: 0;
  font-family: var(--serif);
  font-size: 20px;
  line-height: 1;
}

.site-drawer--simple .site-drawer__utility {
  grid-area: utility;
  align-self: end;
  display: flex;
  gap: 12px 20px;
  margin: 0;
  padding-top: 16px;
  border-top: 1px solid var(--drawer-simple-line);
}

.site-drawer--simple .site-drawer__utility-link {
  gap: 2px;
  min-height: 44px;
  color: var(--drawer-simple-muted);
}

@media (hover: hover) and (pointer: fine) {
  .site-drawer--simple .site-drawer__link:hover {
    padding-left: 8px;
    color: var(--accent);
    background: transparent;
  }

  .site-drawer--simple .site-drawer__link:hover .site-drawer__link-arrow {
    color: var(--accent);
    transform: translate3d(3px, -3px, 0);
  }
}

@media (max-width: 960px) {
  .site-drawer--simple .site-drawer__body {
    grid-template-columns: 1fr;
    grid-template-rows: repeat(4, max-content);
    grid-template-areas:
      "intro"
      "contact"
      "nav"
      "utility";
    gap: 22px;
    margin-top: 20px;
    padding-bottom: 14px;
  }

  .site-drawer--simple .site-drawer__title {
    font-size: clamp(25px, 7vw, 30px);
  }

  .site-drawer--simple .site-drawer__lead {
    margin-top: 8px;
    font-size: 11px;
  }

  .site-drawer--simple .site-drawer__link-list {
    grid-template-columns: 1fr;
    gap: 0;
  }

  .site-drawer--simple .site-drawer__link {
    grid-template-columns: 86px minmax(0, 1fr) auto;
    min-height: 58px;
    padding: 0 2px;
    border-right: 0;
    border-left: 0;
    background: transparent;
  }

  .site-drawer--simple .site-drawer__link-en {
    font-size: 9px;
  }

  .site-drawer--simple .site-drawer__link-jp {
    font-size: 15px;
  }

  .site-drawer--simple .site-drawer__contact {
    padding: 18px 20px;
  }

  .site-drawer--simple .site-drawer__contact-title {
    font-size: 18px;
  }

  .site-drawer--simple .site-drawer__contact-copy {
    max-width: 24em;
  }

  .site-drawer--simple .site-drawer__utility {
    padding-top: 10px;
  }
}

@media (max-width: 390px) {
  .site-drawer--simple .site-drawer__body {
    gap: 18px;
  }

  .site-drawer--simple .site-drawer__link {
    grid-template-columns: 74px minmax(0, 1fr) auto;
    min-height: 54px;
  }

  .site-drawer--simple .site-drawer__contact-copy {
    max-width: 18em;
  }
}

@media (prefers-reduced-motion: reduce) {
  .site-drawer--simple .site-drawer__link,
  .site-drawer--simple .site-drawer__link-arrow {
    transition-duration: 1ms !important;
  }
}