/* =======================
   ベース
======================= */
.season-end {
  text-align: center;
  margin: 1rem 0;
  font-size: 1rem;
  line-height: 1.6;
}

/* 強調テキスト */
.big-call {
  display: inline-block;
  font-size: 1.4rem;
  font-weight: bold;
  color: #e91e63;
  text-shadow: 1px 1px 4px rgba(0,0,0,0.3);
  animation: zoompop 1.2s ease-in-out 3;
}
@keyframes zoompop {
  0%   { transform: scale(1); }
  30%  { transform: scale(1.2); }
  50%  { transform: scale(1); }
  70%  { transform: scale(1.1); }
  100% { transform: scale(1); }
}

/* カラートークン */
:root{
  --c-ink:#123;
  --c-sub:#456;
  --c-bg:#f7f7f9;
  --c-cream:#fff7e3;
  --c-ayu:#f2d699;
  --c-accent:#1e73be;
  --radius:10px;
  --shadow:0 4px 10px rgba(0,0,0,.05);
}

/* =======================
   終了モード・ヒーロー
======================= */
.season-end-hero{
  background: linear-gradient(180deg, var(--c-cream), #ffffff);
  border:1px solid #eee;
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  min-height: 3cm;
  max-height: 3cm;
  padding: 4px 8px;
  margin: 6px 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: relative;
  overflow: hidden;
}
.season-end-hero::after{
  content:"";
  position:absolute; inset:-10% -20% auto auto;
  width:200px; height:200px; border-radius:50%;
  background: radial-gradient(closest-side, rgba(242,214,153,.25), transparent 70%);
  transform: translate(20%,-20%);
}
.hero-inner{ text-align:center; color:#243; position:relative; z-index:1; }
.hero-eyebrow{
  display:inline-block; padding:2px 6px; margin:0 0 2px;
  background:#fff; border:1px solid #ddd; border-radius:999px; font-size:.7rem;
}
.hero-title{ margin:.1em 0; font-size:0.9rem; font-weight:700; }
.hero-sub{ margin:0; color:#445; line-height:1.3; font-size:0.75rem; }
.hero-cta{
  display:inline-block; padding:4px 8px; border-radius:6px;
  background:var(--c-accent); color:#fff; text-decoration:none; font-weight:600;
  font-size:0.75rem; box-shadow:0 1px 0 rgba(0,0,0,.08); margin-top:2px;
}
.hero-cta:hover{ filter:brightness(1.05); }

/* =======================
   最新更新カード
======================= */
.latest-update{
  background:var(--c-bg); border:1px solid #eee; border-radius:var(--radius);
  box-shadow:var(--shadow); padding:12px; margin:10px 0 14px;
}
.latest-head{ display:flex; align-items:center; justify-content:space-between; gap:8px; }
.latest-head h2{ margin:0; font-size:1rem; }
.latest-more{ font-size:.8rem; color:var(--c-accent); text-decoration:none; }
.latest-more:hover{ text-decoration:underline; }

.latest-card{ margin-top:10px; }
.card-link{
  display:grid; grid-template-columns: 200px 1fr; gap:12px; align-items:center;
  text-decoration:none; color:inherit;
  transition: box-shadow .15s, transform .15s;
  border-radius: 12px;
}
.card-link:hover{
  box-shadow: 0 6px 18px rgba(0,0,0,.08);
  transform: translateY(-2px);
}
.card-link:focus-visible{
  outline: 3px solid #1e73be44; outline-offset: 3px;
}
@media (max-width:760px){
  .card-link{ grid-template-columns: 1fr; }
}
.card-media{ position:relative; aspect-ratio:16/9; overflow:hidden; border-radius:8px; background:#eee; }
.card-media img{ width:100%; height:100%; object-fit:cover; display:block; }
.card-badge{
  position:absolute; left:6px; top:6px; background:#e53935; color:#fff;
  font-weight:700; font-size:.7rem; padding:3px 6px; border-radius:999px;
}
.card-body{ padding:2px 0; display:flex; flex-direction:column; }
.card-date{ color:#5a6; font-size:.8rem; }
.card-title{ margin:.1em 0 .3em; font-size:.95rem; color:#123; }
.card-lead{ margin:0 0 6px; color:#345; font-size:.85rem; line-height:1.5; }
.card-cta{ display:inline-block; font-weight:600; color:var(--c-accent); font-size:.8rem; margin-top:8px; }

/* =======================
   振り返りショートカット
======================= */
.recap-shortcuts{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
  margin: 14px 0 18px;
}
/* 必要なら下記で小さめ画面を1列にする */
// @media (max-width:860px){ .recap-shortcuts{ grid-template-columns:1fr; } }

.recap-card{
  display:flex; gap:12px; align-items:center; text-decoration:none; color:inherit;
  background:#f7f5f2; border:1px solid #c0a47b; border-radius:12px; padding:12px;
  box-shadow:0 4px 12px rgba(0,0,0,.06); transition:.2s;
}
.recap-card:hover{ background:#ede2d4; transform: translateY(-2px); }
.recap-icon{ font-size:24px; }
.recap-text strong{ display:block; font-size:1rem; color:#5b4632; }
.recap-text span{ display:block; color:#7a6a55; font-size:.9rem; }

/* =======================
   更新履歴
======================= */
.update-history{ background:#fff; border:1px solid #eee; border-radius:var(--radius); padding:12px; }
.update-history h2{ margin:0 0 6px; font-size:1rem; }
.history-list{ margin:0; padding-left:16px; font-size:.85rem; }
.history-list li{ margin:.2em 0; }
.history-list time{ color:#678; margin-right:.3em; }

/* 固定ヘッダー対策 */
[id]{ scroll-margin-top: 120px; }

/* セクション見出し */
.section-title{
  margin:18px 0 10px; padding:8px 12px;
  background:linear-gradient(90deg,#eaf2ff,#ffffff);
  border:1px solid #d7e4ff; border-radius:8px; font-weight:700; color:#123;
}

/* ===== シンプルなスクロールヒント ===== */
.scroll-hint {
  text-align: center;
  font-size: 14px;
  color: #9aa7b7;         /* 薄めのグレーで主張しすぎない */
  margin: -6px 0 8px;
  animation: bounce 2s infinite;
}

/* 軽く上下に動くアニメーション */
@keyframes bounce {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(4px); }
}
/* =======================
   アフターシーズン便り
======================= */
.after-season{
  background:#f0f6fb; border:1px solid #8aa4c2; border-radius:14px;
  padding:24px; margin:24px 0; box-shadow:0 6px 16px rgba(0,0,0,.05);
}
.after-title{
  margin:0 0 10px; font-size:1.4rem; font-weight:700; color:#2c4a65;
}
.after-lead{
  margin:0 0 14px; color:#445; line-height:1.7; font-size:1rem;
}
.after-cta{
  display:inline-block; padding:8px 16px; border-radius:8px; background:#1e73be;
  color:#fff; font-weight:600; text-decoration:none; box-shadow:0 2px 4px rgba(0,0,0,.1);
}
.after-cta:hover{ background:#155a96; }

/* 写真左／テキスト右（PC）→ 縦並び（SP） */
.after-flex{ display:flex; gap:16px; align-items:flex-start; }
.after-photo{
  width:220px; height:auto; flex:0 0 220px;
  border-radius:6px; box-shadow:0 2px 6px rgba(0,0,0,.15); object-fit:cover;
}
@media (max-width: 768px){
  .after-flex{ flex-direction: column; }
  .after-photo{ width:100%; max-width:400px; flex:none; margin:0 auto 12px; }
}
.after-flex {
  display: flex;
  gap: 16px;
  align-items: flex-start;
}

.after-photo {
  width: 220px;   /* PCでの幅 */
  border-radius: 6px;
  box-shadow: 0 2px 6px rgba(0,0,0,.15);
  object-fit: cover;
}

/* スマホ用 */
@media (max-width: 768px) {
  .after-flex {
    display: block; /* 横並び解除 */
  }
  .after-photo {
    float: left;
    width: 40%;       /* スマホでは小型化 */
    margin: 0 12px 8px 0;
  }
}