/* ==========================================================================
   c-heading-h2 — Figma: Heading/H2
   PC: バー 8×36px + renewal/JP/32/Bold / SP: バー 8×30px + renewal/JP/28/Bold
   ========================================================================== */

.c-heading-h2 {
  display: flex;
  align-items: flex-start; /* 2 行以上のときバーは 1 行目に揃える（上寄せ） */
  gap: var(--space-16);
  color: var(--color-text-base);
  /* ページ内リンク（アンカー）で飛んだとき見出しがヘッダーに隠れないよう少し余白を取る */
  scroll-margin-top: var(--space-32);
}

.c-heading-h2::before {
  content: "";
  flex-shrink: 0;
  width: var(--space-8);
  height: 36px; /* Figma 固有寸法: バーの高さ */
  /* 1 行目の縦中央に置く: (行の高さ 48px - バー 36px) / 2。1 行の見出しは従来と同じ位置 */
  margin-block-start: 6px;
  background-color: var(--color-icon-brand);
}

@media (max-width: 1023px) {

  .c-heading-h2::before {
    height: 30px; /* Figma 固有寸法: SP のバーの高さ */
    margin-block-start: 6px; /* (行の高さ 42px - バー 30px) / 2 */
  }

  .c-heading-h2__text {
    font-size: 1.75rem; /* SP: renewal/JP/28/Bold（tokens.css .t-jp-28-bold） */
    line-height: calc(42 / 28);
  }
}