/* 泉へのバナー（lib/shiken/izumi-links.ts の izumiBannerHtml）と、一覧の行の泉ボタン（.izp）。
   記事の無料体験バナー（free-try-banner.css）と同じ形: 左に絵（泉のロゴ＋波）、右に濃い地の説明とボタン。
   新デザインのページ（/shiken/）と移植ページ（/local/ のカード）の両方に出るので、移植ページの本文 CSS
   （a・img・span の汎用ルール）に負けないよう、要素はすべて .izbn 配下のクラスで指定する。 */
.izbn {
  --izbn-ink: #053b2b;
  --izbn-accent: #3fd4a2;
  display: grid;
  grid-template-columns: 1fr;
  max-width: 1040px;
  margin: 0 auto;
  overflow: hidden;
  border-radius: 16px;
  background: var(--izbn-ink);
  color: #fff;
  text-decoration: none;
  box-shadow: 0 10px 28px -14px rgba(5, 59, 43, 0.6);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.izbn--spi {
  --izbn-ink: #3d1430;
  --izbn-accent: #ffb3d4;
  box-shadow: 0 10px 28px -14px rgba(61, 20, 48, 0.6);
}
.izbn--suuteki {
  --izbn-ink: #0a2e3d;
  --izbn-accent: #7fd8f0;
  box-shadow: 0 10px 28px -14px rgba(10, 46, 61, 0.6);
}
.izbn--kyouyou {
  --izbn-ink: #1f1a52;
  --izbn-accent: #c2bbff;
  box-shadow: 0 10px 28px -14px rgba(31, 26, 82, 0.6);
}
.izbn:hover {
  transform: translateY(-2px);
  box-shadow: 0 16px 32px -14px rgba(0, 0, 0, 0.45);
}
/* 絵: 波（Vanta の canvas が後から敷かれる）の上にロゴ */
.izbn .izbn-vis {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 150px;
  margin: 0;
  overflow: hidden;
}
.izbn .izbn-vis > canvas {
  z-index: 0 !important;
}
.izbn .izbn-logo {
  position: relative;
  z-index: 1;
  display: block;
  width: 78%;
  max-width: 420px;
  height: auto;
  margin: 0;
  border-radius: 0;
  filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.18));
}
.izbn .izbn-body {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 8px;
  padding: 14px 18px 16px;
}
.izbn .izbn-kicker {
  display: block;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.5;
  color: var(--izbn-accent);
}
.izbn .izbn-title {
  display: block;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.35;
  color: #fff;
}
.izbn .izbn-list {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.izbn .izbn-item {
  position: relative;
  display: block;
  padding-left: 22px;
  font-size: 14px;
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.92);
}
.izbn .izbn-item::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 0;
  font-weight: 700;
  color: var(--izbn-accent);
}
.izbn .izbn-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  margin-top: 4px;
  border-radius: 9999px;
  background: #ff6b5b;
  font-size: 16px;
  font-weight: 700;
  color: #fff;
  transition: background 0.15s ease;
}
.izbn:hover .izbn-btn {
  background: #f04e3e;
}
@media (min-width: 768px) {
  .izbn {
    grid-template-columns: 55% 45%;
    align-items: stretch;
  }
  .izbn .izbn-vis {
    min-height: 220px;
  }
  .izbn .izbn-body {
    padding: 18px 24px;
  }
  .izbn .izbn-title {
    font-size: 21px;
  }
  .izbn .izbn-item {
    font-size: 15px;
  }
}

/* 小さい版（行を開いた詳細の中）: 波は CSS の絵（WebGL なし）、箇条なし。横並びは PC だけ */
.izbn.izbn--mini {
  border-radius: 12px;
  box-shadow: none;
}
.izbn--mini .izbn-vis {
  min-height: 84px;
  background-image:
    radial-gradient(120% 60% at 20% 110%, rgba(255, 255, 255, 0.28), transparent 60%),
    radial-gradient(90% 50% at 80% -10%, rgba(0, 0, 0, 0.22), transparent 60%),
    repeating-radial-gradient(160% 70% at 50% 140%, rgba(255, 255, 255, 0.1) 0 6px, transparent 6px 18px);
}
.izbn--mini .izbn-logo {
  width: 70%;
  max-width: 260px;
}
.izbn--mini .izbn-body {
  gap: 6px;
  padding: 10px 14px 12px;
}
.izbn--mini .izbn-title {
  font-size: 16px;
}
.izbn--mini .izbn-btn {
  min-height: 42px;
  margin-top: 2px;
  font-size: 15px;
}
@media (min-width: 768px) {
  .izbn.izbn--mini {
    grid-template-columns: 40% 60%;
  }
  .izbn--mini .izbn-vis {
    min-height: 120px;
  }
  .izbn--mini .izbn-body {
    padding: 12px 18px;
  }
}

/* 一覧の行の泉ボタン（バッジの隣）。泉の色の塗りで、文字の並びの中でも目に入るように */
.izp {
  display: inline-flex;
  align-items: center;
  gap: 0.25em;
  border-radius: 9999px;
  padding: 0.125rem 0.75rem;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.6;
  white-space: nowrap;
  color: #fff;
  text-decoration: none;
  background: #058760;
  box-shadow: 0 2px 6px -2px rgba(5, 135, 96, 0.6);
  transition: background 0.15s ease, transform 0.15s ease;
}
.izp:hover {
  background: #046b4c;
  transform: translateY(-1px);
}
.izp--spi {
  background: #c43d7f;
  box-shadow: 0 2px 6px -2px rgba(196, 61, 127, 0.6);
}
.izp--spi:hover {
  background: #a42f68;
}

/* 自治体ページのカードの直後に置く泉のバナーの置き場所（lib/shiken/org-card.ts）。下の本文の枠とくっつかないように。
   カードの入れ物（WordPress の vk_outer_container・is-layout-flow）が子の上下の余白を 0 にするので、ここだけ !important で上書きする */
[data-legacy-content] .skc-izb {
  margin-top: 20px !important;
  margin-bottom: 36px !important;
}
