/* Japanese reading defaults. Fonts are served locally; no Google Fonts request. */
:root {
  --sans: "Tsuki Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "Yu Gothic", sans-serif;
  /* Existing display components inherit the same clear Japanese typeface. */
  --serif: var(--sans);
}
body {
  font-weight: 400;
  letter-spacing: .025em;
  line-height: 1.95;
  line-break: strict;
  overflow-wrap: anywhere;
  word-break: normal;
}
button, input, select, textarea { font-family: var(--sans); }
h1, h2, h3 { text-wrap: balance; font-weight: 600; letter-spacing: .035em; line-height: 1.65; }
.brand, .footer-brand { font-weight: 600; letter-spacing: .09em; }
.hero h1 { font-weight: 600; letter-spacing: .06em; line-height: 1.45; }
.hero-message { font-weight: 400; letter-spacing: .04em; line-height: 1.9; }
.hero-summary { font-size: 16px; line-height: 2; color: #d3d9e3; }
.lead { font-weight: 400; letter-spacing: .025em; line-height: 2; }
#main-nav { font-size: 14px; letter-spacing: .025em; }
.button { font-weight: 600; letter-spacing: .025em; }
.article-card p, .product-card p, .action-pair p,
.guide p:not(.eyebrow):not(.meta) { font-size: 15px; line-height: 1.95; }
.journal-article section p { font-size: 17px; line-height: 2; }
.journal-article h2, .prose h2 { letter-spacing: .025em; }
.zodiac-name, .card-jp { letter-spacing: .025em; }
.meta { color: #636e7f; }
.hero-credit span, .tarot-room .meta { color: #b8c3d3; }
.tarot-caution { font-size: 14px; }
@media (max-width: 1000px) and (min-width: 701px) {
  #main-nav { font-size: 13px; gap: 17px; }
}
@media (max-width: 700px) {
  #main-nav { font-size: 16px; }
  .hero-message { font-size: 18px; }
  .hero-summary { font-size: 16px; line-height: 2; }
  .article-card p, .product-card p,
  .guide p:not(.eyebrow):not(.meta) { font-size: 15px; }
  .journal-article section p { font-size: 16px; }
  .tarot-room .lead, .tarot-caution { font-size: 14px; }
  .site-footer nav { font-size: 13px; letter-spacing: .015em; }
}
@media (max-width: 365px) {
  .hero-message { font-size: 17px; }
}
