:root {
  --color-text: #25221f;
  --color-subtle: #6f685f;
  --color-gold: #c8af4e;
  --color-gold-dark: #9e7e22;
  --color-gold-light: #eadf9a;
  --color-ivory: #fbf8ef;
  --color-border: #d8d0bd;
  --font-ja: "Noto Serif JP", "Yu Mincho", "Hiragino Mincho ProN", serif;
  --font-en: "Cormorant Garamond", Georgia, serif;
  --container: 1080px;
  --header-height: 72px;
}

*, *::before, *::after { box-sizing: border-box; }

html {
  scroll-behavior: smooth;
  scroll-padding-top: var(--header-height);
}

body {
  margin: 0;
  color: var(--color-text);
  background: #fff;
  font-family: var(--font-ja);
  font-size: 16px;
  line-height: 1.8;
  -webkit-font-smoothing: antialiased;
}

img { display: block; max-width: 100%; }
button, a { font: inherit; }
button { color: inherit; }
a { color: inherit; text-decoration: none; }

.container {
  width: min(calc(100% - 48px), var(--container));
  margin-inline: auto;
}

.full-bleed { width: 100%; }

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.site-header {
  position: sticky;
  z-index: 100;
  top: 0;
  height: var(--header-height);
  background: rgba(255, 255, 255, .96);
  border-bottom: 1px solid rgba(200, 175, 78, .18);
  backdrop-filter: blur(12px);
}

.site-header__inner {
  width: min(calc(100% - 36px), 1440px);
  height: 100%;
  margin-inline: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
}

.site-header__logo {
  border: 0;
  padding: 0;
  background: transparent;
  cursor: pointer;
}

.site-header__logo img { width: 118px; height: auto; }

.global-menu {
  display: flex;
  align-items: center;
  gap: 28px;
}

.global-menu button,
.global-menu a { cursor: pointer; }

.global-menu__text {
  position: relative;
  border: 0;
  padding: 8px 0;
  background: transparent;
  font-size: .875rem;
  letter-spacing: .06em;
}

.global-menu__text::after {
  position: absolute;
  right: 0;
  bottom: 2px;
  left: 0;
  height: 1px;
  content: "";
  background: var(--color-gold);
  transform: scaleX(0);
  transition: transform .25s ease;
}

.global-menu__text:hover::after,
.global-menu__text:focus-visible::after { transform: scaleX(1); }

.header-action {
  width: 184px;
  min-height: 44px;
  border: 1px solid var(--color-border);
  padding: 7px 14px;
  display: grid;
  grid-template-columns: 30px 1fr 30px;
  align-items: center;
  gap: 5px;
  background: #fff;
  color: #7d6723;
  font-size: .78rem;
  letter-spacing: .03em;
  box-shadow: 0 3px 12px rgba(68, 52, 11, .06);
  transition: transform .2s ease, box-shadow .2s ease, filter .2s ease;
}

.header-action::after { width: 30px; content: ""; }
.header-action img { width: 23px; height: 23px; margin-inline: auto; object-fit: contain; }
.header-action span { text-align: center; white-space: nowrap; }
.header-action:hover,
.header-action:focus-visible { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(68, 52, 11, .13); }
.header-action--line img { width: 28px; height: 28px; }
.header-action--line {
  grid-template-columns: 1fr;
  border-color: #a88931;
  background: linear-gradient(110deg, #aa8528 0%, #b99a40 52%, #ac882b 100%);
  color: #fff;
  font-weight: 500;
  text-shadow: 0 1px 2px rgba(55, 39, 5, .3);
}
.header-action--line::after { display: none; }

.menu-button { display: none; }

.site-footer {
  position: relative;
  padding: 0;
  overflow: hidden;
  background:
    radial-gradient(circle at 15% 15%, rgba(255, 255, 255, .8) 0, rgba(255, 255, 255, 0) 34%),
    linear-gradient(120deg, #e4d9af 0%, #f7f3e4 46%, #ddd09e 100%);
  border-top: 1px solid rgba(158, 126, 34, .28);
}

.site-footer::before {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: 4px;
  content: "";
  background: linear-gradient(90deg, #866319 0%, #e7d77d 28%, #a47b1e 57%, #eadf9c 78%, #98711b 100%);
}

.site-footer__inner {
  padding-block: 58px 50px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: center;
  gap: 0;
}

.site-footer__brand {
  padding-right: clamp(36px, 5vw, 72px);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.site-footer__logo {
  border: 0;
  padding: 0;
  background: transparent;
  cursor: pointer;
}

.site-footer__logo img { width: 136px; margin-inline: auto; }
.site-footer__company { margin: 21px 0 0; color: #64572f; line-height: 1.5; }
.site-footer__company span { display: block; font-size: .78rem; letter-spacing: .08em; }
.site-footer__company strong { display: block; margin-top: 6px; color: var(--color-text); font-size: .92rem; font-weight: 500; letter-spacing: .08em; }
.site-footer__message { margin: 18px 0 0; color: #8b762c; font-size: .78rem; line-height: 1.6; letter-spacing: .12em; }

.site-footer__contact {
  padding-left: clamp(36px, 5vw, 72px);
  border-left: 1px solid rgba(126, 98, 27, .24);
}

.site-footer__contact-heading { margin-bottom: 20px; }
.site-footer__contact-heading span {
  display: block;
  color: #9b7c25;
  font-family: var(--font-en);
  font-size: .76rem;
  letter-spacing: .2em;
}
.site-footer__contact-heading p { margin: 2px 0 0; font-size: 1.14rem; letter-spacing: .05em; }

.site-footer__buttons {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.footer-contact-button {
  min-height: 72px;
  border: 1px solid rgba(150, 121, 39, .38);
  padding: 10px 18px;
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr) 20px;
  align-items: center;
  gap: 10px;
  background: rgba(255, 255, 255, .9);
  box-shadow: 0 6px 20px rgba(72, 54, 10, .08);
  color: #574719;
  cursor: pointer;
  transition: transform .2s ease, box-shadow .2s ease, filter .2s ease;
}

.footer-contact-button::after { width: 20px; content: ""; }
.footer-contact-button img { width: 36px; height: 36px; margin-inline: auto; object-fit: contain; }
.footer-contact-button span { display: block; text-align: center; font-size: .98rem; line-height: 1.35; white-space: nowrap; }
.footer-contact-button small { display: block; font-size: .66rem; font-weight: 400; letter-spacing: .08em; }
.footer-contact-button:hover,
.footer-contact-button:focus-visible { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(72, 54, 10, .15); }
.footer-contact-button--line {
  border-color: #a88931;
  background: linear-gradient(110deg, #aa8528 0%, #b99a40 52%, #ac882b 100%);
  color: #fff;
  font-weight: 500;
  text-shadow: 0 1px 2px rgba(55, 39, 5, .3);
}
.footer-contact-button--line img { width: 42px; height: 42px; }

.site-footer__links {
  margin-top: 18px;
  display: flex;
  justify-content: flex-end;
  gap: 18px;
  font-size: .72rem;
  letter-spacing: .04em;
}

.site-footer__links a + a::before { margin-right: 18px; content: "｜"; color: #a59c82; }
.site-footer__links a:hover { text-decoration: underline; }
.site-footer__bottom { border-top: 1px solid rgba(126, 98, 27, .16); background: rgba(124, 98, 28, .06); }
.copyright { margin: 0; padding: 15px 20px; text-align: center; font-family: var(--font-en); font-size: .7rem; letter-spacing: .08em; }

@media (max-width: 900px) {
  :root { --header-height: 64px; }
  .container { width: min(calc(100% - 32px), var(--container)); }
  .site-header__inner { width: calc(100% - 28px); }
  .site-header__logo img { width: 100px; }

  .menu-button {
    width: 44px;
    height: 44px;
    border: 1px solid rgba(158, 126, 34, .38);
    padding: 11px 10px;
    display: grid;
    align-content: center;
    gap: 5px;
    background: #fff;
    cursor: pointer;
  }

  .menu-button > span:not(.visually-hidden) {
    width: 100%;
    height: 1px;
    background: var(--color-gold-dark);
    transition: transform .25s ease, opacity .25s ease;
  }

  .menu-button[aria-expanded="true"] > span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
  .menu-button[aria-expanded="true"] > span:nth-child(2) { opacity: 0; }
  .menu-button[aria-expanded="true"] > span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

  .global-menu {
    position: absolute;
    top: 100%;
    right: 0;
    left: 0;
    padding: 22px 20px 28px;
    display: grid;
    gap: 10px;
    background: rgba(255,255,255,.98);
    border-bottom: 1px solid var(--color-border);
    box-shadow: 0 12px 30px rgba(45, 36, 16, .08);
    opacity: 0;
    pointer-events: none;
    transform: translateY(-8px);
    transition: opacity .2s ease, transform .2s ease;
  }

  .global-menu.is-open { opacity: 1; pointer-events: auto; transform: translateY(0); }
  .global-menu__text { width: 100%; text-align: center; }
  .header-action { width: 100%; min-height: 50px; }

  .site-footer__inner {
    padding-block: 48px 42px;
    grid-template-columns: 1fr;
    gap: 36px;
  }
  .site-footer__brand { padding-right: 0; }
  .site-footer__contact { padding: 34px 0 0; border-top: 1px solid rgba(126, 98, 27, .24); border-left: 0; }
}

@media (max-width: 560px) {
  body { font-size: 15px; }
  .site-footer__inner { padding-block: 42px 34px; }
  .site-footer__logo img { width: 124px; }
  .site-footer__company { margin-top: 18px; }
  .site-footer__company strong { margin-top: 5px; }
  .site-footer__message { margin-top: 16px; }
  .site-footer__contact-heading { text-align: center; }
  .site-footer__buttons { grid-template-columns: 1fr; }
  .footer-contact-button { min-height: 64px; }
  .site-footer__links { justify-content: center; gap: 12px; }
  .site-footer__links a + a::before { margin-right: 12px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}