/* =============================================================
   global-presence.css — 海外展開(オーストラリア/マレーシア)の表示
   - TOP: 「全国○店舗」直下の海外行 (.np-overseas-line) と
          「世界に広がるNAORU」セクション (#lp-global)
   - /shops/: 一覧下の「海外店舗」ブロック (.np-world--shops)
   店舗数・URLを変える時は index.html / shops/index.html /
   scripts/update-footer-shops.py(フッター) の3箇所を揃える。
   main.css とは分離(main.css の buster 変更は全店舗HTMLの bump が必要なため)。
============================================================= */

/* ---- TOP: 「全国○店舗展開中!」直下の海外行 ----
   国内が主役・海外は補足。海外行は国内リードより小さく薄く、数字も強調しない。 */
.lp2026-sm__shop .lp2026-section-lead [data-shop-count] {
  font-family: var(--font-en);
  font-size: 1.35em;
  font-weight: 700;
  color: var(--color-primary);
  margin: 0 0.08em;
}
.np-overseas-line {
  margin: 0.25rem 0 0;
  font-size: clamp(0.75rem, 0.72rem + 0.15vw, 0.8125rem);
  line-height: 1.7;
  color: var(--color-text-soft);
}
.np-overseas-line a {
  color: var(--color-text-sub);
  text-decoration: underline;
  text-decoration-color: var(--color-border);
  text-underline-offset: 0.2em;
}
.np-overseas-line a:hover { color: var(--color-primary); text-decoration-color: currentColor; }

/* ---- 国コードバッジ (絵文字の国旗は Windows で表示されないため文字で) ---- */
.np-cc {
  display: inline-grid;
  place-items: center;
  min-width: 2.1em;
  height: 1.5em;
  padding: 0 0.35em;
  border-radius: 4px;
  background: var(--color-text);
  color: var(--color-text-invert);
  font-family: var(--font-en);
  font-size: 0.72em;
  font-weight: 700;
  letter-spacing: 0.06em;
  line-height: 1;
}

/* ---- 世界に広がるNAORU (TOP) / 海外店舗 (/shops/) 共通 ---- */
.np-world {
  padding: clamp(3.5rem, 7vw, 6rem) 0;
  background: var(--color-bg-sub);
}
.np-world__head { text-align: center; max-width: 44rem; margin: 0 auto; }
.np-world__stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  max-width: 40rem;
  margin: clamp(1.75rem, 3vw, 2.5rem) auto 0;
  border-top: 1px solid var(--color-border);
  border-bottom: 1px solid var(--color-border);
}
.np-world__stat { padding: 1rem 0.5rem; text-align: center; }
.np-world__stat + .np-world__stat { border-left: 1px solid var(--color-border); }
.np-world__stat-num {
  display: block;
  font-family: var(--font-en);
  font-size: clamp(1.75rem, 1.3rem + 2vw, 2.75rem);
  font-weight: 700;
  line-height: 1.1;
  color: var(--color-primary);
}
.np-world__stat-num small { font-size: 0.45em; margin-left: 0.1em; color: var(--color-text); }
.np-world__stat-label { display: block; margin-top: 0.25rem; font-size: var(--text-sm); color: var(--color-text-sub); }

.np-world__cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 17rem), 1fr));
  gap: clamp(1rem, 2vw, 1.5rem);
  margin: clamp(2rem, 4vw, 3rem) auto 0;
  padding: 0;
  list-style: none;
}
.np-world--shops .np-world__cards { max-width: 48rem; }
.np-world__card {
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: clamp(1.25rem, 2.5vw, 1.75rem);
  border: 1px solid var(--color-border);
  border-radius: 16px;
  background: #fff;
  color: var(--color-text);
  text-decoration: none;
  transition: border-color .2s, box-shadow .2s, transform .2s;
}
.np-world__card:hover {
  border-color: var(--color-primary);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06);
  transform: translateY(-2px);
}
.np-world__card-top { display: flex; align-items: center; gap: 0.6rem; }
.np-world__card-en {
  font-family: var(--font-en);
  font-size: var(--text-xs);
  font-weight: 500;
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  color: var(--color-text-soft);
}
.np-world__card-name { margin: 0.75rem 0 0; font-size: var(--text-lg); font-weight: 700; line-height: 1.3; }
.np-world__card-count { margin: 0.25rem 0 0; font-size: var(--text-sm); color: var(--color-text-sub); }
.np-world__card-count strong { font-family: var(--font-en); font-size: 1.5em; color: var(--color-primary); margin-right: 0.1em; }
.np-world__card-shops {
  margin: 0.875rem 0 0;
  padding-top: 0.875rem;
  border-top: 1px dashed var(--color-border);
  font-size: var(--text-sm);
  line-height: 1.7;
  color: var(--color-text-sub);
}
.np-world__card-cta {
  margin-top: auto;
  padding-top: 1.25rem;
  font-size: var(--text-sm);
  font-weight: 700;
  color: var(--color-primary);
}

/* ---- /shops/: 右上「94院」カウンター下の海外行 (国内より一回り小さく) ---- */
.shop-page .sp-counter__overseas {
  grid-row: 3; grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.15em 0.35em;
  margin-top: 4px;
  padding-top: 12px;
  border-top: 1px solid var(--color-border);
  font-size: 15px;
  font-weight: 700;
  color: var(--color-text);
  text-decoration: none;
}
.shop-page .sp-counter__overseas b {
  font-family: var(--ff-en, var(--font-en));
  font-size: 30px;
  line-height: 1;
  color: var(--color-accent);
  margin: 0 0.05em;
}
.shop-page .sp-counter__overseas-plus { color: var(--color-accent); }
.shop-page .sp-counter__overseas-en {
  flex-basis: 100%;
  font-family: var(--ff-en, var(--font-en));
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--color-text-sub);
}
.shop-page .sp-counter__overseas:hover .sp-counter__overseas-en { color: var(--color-primary); }
@media (max-width: 900px) {
  .shop-page .sp-counter__overseas { justify-content: center; text-align: center; }
}
#sp-overseas { scroll-margin-top: 90px; }

/* ---- /shops/: 都道府県グリッド末尾の海外(オーストラリア/マレーシア) ---- */
.shop-page .sp-pref-index__grid a.sp-pref-index__overseas {
  color: var(--color-primary);
  font-weight: 700;
}
.shop-page .sp-pref-index__grid a.sp-pref-index__overseas:hover { color: #fff; }
