/* jdtheme26 - CONTACT PAGE /contact-us/ (2026-09-29)
   Replaces the demo page "Contact us". Content = one Raw HTML element <div class="jd-contact-page"> written by the wiki script
   build/scripts/header-and-colors/contact-page-v1.php. Four cards (default card surface .jd-card) + one line to the FAQ.
   Details are the footer's and the store page's: LINE, phone, e-mail, store address and hours. */
.jd-contact-page {
  --jd-contact-ink: var(--jd-ink-900, #3b2a1f);
  --jd-contact-text: var(--jd-ink-700, #5c4a3c);
  box-sizing: border-box;
  max-width: 1080px;
  margin: 0 auto;
  padding: clamp(28px, 5vw, 60px) 16px clamp(48px, 7vw, 90px);
  color: var(--jd-contact-text);
}
body .jd-contact-page .jd-contact-page__lead {
  max-width: 640px;
  margin: 0 auto clamp(28px, 4vw, 44px);
  text-align: center;
}
.jd-contact-page__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(14px, 2.2vw, 24px);
  margin: 0;
  padding: 0;
  list-style: none;
}
body .jd-contact-page .jd-contact-page__item {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  gap: 4px 18px;
  align-content: start;
  margin: 0;
  padding: clamp(20px, 2.6vw, 30px);
}
.jd-contact-page__icon {
  grid-row: 1 / span 3;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background-color: #fdf3d6;
  color: var(--jd-contact-ink);
}
.jd-contact-page__item:nth-child(2) .jd-contact-page__icon { background-color: #fde3e4; }
.jd-contact-page__item:nth-child(3) .jd-contact-page__icon { background-color: #e0f3e0; }
.jd-contact-page__item:nth-child(4) .jd-contact-page__icon { background-color: #e3f1f4; }
.jd-contact-page__icon svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
body .jd-contact-page h2.jd-contact-page__name {
  margin: 0;
  color: var(--jd-contact-ink);
  font-family: var(--jd-font-body);
  font-size: 17px;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: .08em;
}
body .jd-contact-page .jd-contact-page__text { margin: 0; }
body .jd-contact-page .jd-contact-page__main {
  margin: 6px 0 0;
  color: var(--jd-contact-ink);
  font-size: 16px;
  font-weight: 600;
  letter-spacing: .04em;
  overflow-wrap: anywhere;
}
.jd-contact-page .jd-contact-page__main a { color: inherit; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 5px; }
.jd-contact-page .jd-contact-page__main a:is(:hover, :focus-visible) { opacity: .65; }
body .jd-contact-page .jd-contact-page__act { margin: 14px 0 0; }
body .jd-contact-page .jd-contact-page__more {
  margin: clamp(28px, 4vw, 44px) 0 0;
  text-align: center;
}
.jd-contact-page .jd-contact-page__more a { color: var(--jd-contact-ink); font-weight: 600; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 5px; }
.jd-contact-page .jd-nowrap { white-space: nowrap; }

@media (max-width: 767px) {
  .jd-contact-page__grid { grid-template-columns: minmax(0, 1fr); }
  body .jd-contact-page .jd-contact-page__item { grid-template-columns: 44px minmax(0, 1fr); gap: 4px 14px; }
  .jd-contact-page__icon { width: 44px; height: 44px; }
  .jd-contact-page__icon svg { width: 21px; height: 21px; }
}