/* One display-heading scale for all public-facing page templates.
   Typography is intentionally authoritative here: earlier page styles use
   several ID-specific overrides. These rules only target tagged English titles,
   never Japanese copy, statistics, navigation, or article text. */
:root {
  --en-heading-size: 56px;
  --en-heading-compact-size: 40px;
  --en-heading-weight: 300;
  --en-heading-leading: 1.15;
  --en-heading-tracking: -.02em;
}
body main [data-en-heading] {
  font-family: var(--font-en), sans-serif !important;
  font-size: var(--en-heading-size) !important;
  font-weight: var(--en-heading-weight) !important;
  font-style: normal !important;
  line-height: var(--en-heading-leading) !important;
  letter-spacing: var(--en-heading-tracking) !important;
  white-space: normal !important;
  word-break: normal;
  overflow-wrap: normal;
  text-wrap: balance;
}
body main [data-en-heading="compact"] {
  font-size: var(--en-heading-compact-size) !important;
}
/* A dot belongs to the title; flex layouts previously separated it from NEWS. */
body main [data-en-heading] { display: block !important; }
body main [data-en-heading] > .section-dot { display: inline; }

/* Match the published journal grid's 1024:688 image frame and contain fit.
   The image fills that frame at every viewport; override the old 240px minimum
   so square source images cannot enlarge or be clipped by the mobile frame. */
body.journal-index-page .j-article-grid .journal-card__visual {
  position: relative;
  width: 100%;
  height: auto;
  min-height: 0;
  aspect-ratio: 1024 / 688;
  overflow: hidden;
  background: #f6f1e8;
}
body.journal-index-page .j-article-grid .journal-card__visual > img.journal-real-cover {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
  max-height: none;
  aspect-ratio: 1024 / 688;
  object-fit: contain;
  object-position: center;
}
@media (max-width: 1100px) {
  :root { --en-heading-size: 48px; --en-heading-compact-size: 36px; }
}
@media (max-width: 800px) {
  :root { --en-heading-size: 32px; --en-heading-compact-size: 28px; }
}
@media (max-width: 360px) {
  :root { --en-heading-size: 28px; --en-heading-compact-size: 26px; }
}