/* ============================================================
   Crypto Golf Club — English section (/en/) shared stylesheet
   ------------------------------------------------------------
   Loaded AFTER /css/blog-responsive.css so the critical mobile
   fixes (spec-table nowrap carousel, .btn-row side-by-side CTA,
   sticky header via overflow-x:clip) all still apply.

   This file only overrides typography + the language switcher.
   DO NOT put Japanese-specific rules here.
   ============================================================ */

/* ---- Typography: Latin-first stack (no Noto Sans JP) ---- */
html { font-size: 16px; -webkit-font-smoothing: antialiased; }
body.en {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI',
               Roboto, Helvetica, Arial, sans-serif;
  line-height: 1.72;
  letter-spacing: -0.003em;
}
/* English prose wraps at spaces, so allow normal breaking */
body.en p, body.en li { word-break: normal; overflow-wrap: break-word; }
body.en h1 { letter-spacing: -0.022em; }
body.en h2, body.en h3 { letter-spacing: -0.015em; }

/* ---- Language switcher (must exist on every page, both ways) ---- */
.lang-switch {
  display: inline-flex; align-items: center; gap: 5px;
  border: 1.5px solid #198754; border-radius: 999px;
  padding: 4px 11px; font-size: .74rem; font-weight: 700;
  color: #198754; background: #fff; white-space: nowrap;
  text-decoration: none; line-height: 1; flex-shrink: 0;
}
.lang-switch:hover { background: #198754; color: #fff; text-decoration: none; }
.lang-switch svg { flex-shrink: 0; }

/* ---- Region / disclosure strip ---- */
.en-disclosure {
  background: #F4F4F4; color: #888; font-size: .7rem;
  text-align: center; padding: 6px 12px; line-height: 1.5;
}

/* ---- "Written from Japan" trust badge ---- */
.jp-badge {
  display: inline-flex; align-items: center; gap: 7px;
  background: #F0F8F3; border: 1px solid #C8E6D2; border-radius: 999px;
  padding: 6px 14px; font-size: .78rem; font-weight: 700; color: #198754;
}

/* ---- Price / availability note used on JDM articles ---- */
.avail-note {
  background: #FFF9E6; border: 1px solid #FFD700; border-radius: 10px;
  padding: 12px 15px; margin: 18px 0; font-size: .85rem; color: #6b5b1e;
  line-height: 1.7;
}

/* ---- Mobile ---- */
@media (max-width: 600px) {
  .lang-switch { font-size: .7rem; padding: 4px 9px; }
}