/* =================================================================
   お知らせ（一覧・詳細）専用スタイル
================================================================= */

/* ----- ページトップ：ファーストビュー入場アニメーション ----- */
.page-hero__en{
  opacity:0;
  transform:translateY(26px);
  animation:aboutFadeUp .9s cubic-bezier(.22,1,.36,1) forwards;
  animation-delay:.1s;
}
.page-hero__jp{
  opacity:0;
  transform:translateY(20px);
  animation:aboutFadeUp .9s cubic-bezier(.22,1,.36,1) forwards;
  animation-delay:.3s;
}
.page-hero__divider{
  transform:scaleX(0);
  transform-origin:left center;
  animation:aboutLineGrow 1s cubic-bezier(.22,1,.36,1) forwards;
  animation-delay:.55s;
}
.page-hero__image{
  opacity:0;
  transform:scale(1.05);
  animation:aboutPhotoIn 1.4s cubic-bezier(.22,1,.36,1) forwards;
  animation-delay:.2s;
}
@keyframes aboutFadeUp{to{opacity:1;transform:translateY(0)}}
@keyframes aboutLineGrow{to{transform:scaleX(1)}}
@keyframes aboutPhotoIn{to{opacity:1;transform:scale(1)}}
@media(prefers-reduced-motion:reduce){
  .page-hero__en,.page-hero__jp,.page-hero__divider,.page-hero__image{animation:none !important;opacity:1 !important;transform:none !important}
}

/* ----- 詳細ページ：タイトル見出し ----- */
.news-detail-head{margin-bottom:40px}
.news-detail-meta{display:flex;align-items:center;gap:14px;margin-top:38px;margin-bottom:16px}
.news-detail-tag{
  font-size:12px;font-weight:700;letter-spacing:.06em;
  color:var(--text-mute);background:none;
  border:1px solid var(--line);
  padding:4px 12px;
}
.news-detail-date{
  font-family:"Oswald",sans-serif;letter-spacing:.06em;
  color:var(--brass);font-size:15px;font-weight:700;
}
.news-detail-title{
  font-size:30px;font-weight:900;color:var(--ink);line-height:1.5;
}
.news-detail-image{margin:32px 0 40px}
.news-detail-image img{width:100%;height:auto;display:block;border-radius:4px}
.news-detail-body{margin-bottom:48px}
@media(max-width:560px){
  .news-detail-title{font-size:22px;}
  .news-detail-image{margin:24px 0 32px}
}

.news{background:var(--white);}
.news__layout{display:grid;grid-template-columns:1fr 220px;gap:54px;align-items:start;}

/* ニュースリスト */
.news-list{border-top:1px solid var(--line);}
.news-item{
  display:flex;gap:28px;align-items:baseline;
  padding:24px 6px;border-bottom:1px solid var(--line);
  transition:background .2s;
}
.news-item:hover{background:var(--cream);}
.news-item__date{
  font-family:var(--font-en);font-size:15px;letter-spacing:.04em;
  color:var(--accent);white-space:nowrap;flex-shrink:0;
}
.news-item__cat{
  font-size:11px;font-weight:700;letter-spacing:.06em;
  color:#fff;background:var(--steel);padding:3px 10px;flex-shrink:0;
  align-self:center;
}
.news-item__title{font-size:15px;color:var(--ink);font-weight:500;transition:color .2s;}
.news-item:hover .news-item__title{color:var(--accent-d);}

/* 年別フィルター（CSSのみで動作） */
.news-filter{position:sticky;top:96px;}
.news-filter__head{
  font-family:var(--font-en);font-size:13px;letter-spacing:.14em;
  color:var(--accent);margin-bottom:16px;padding-bottom:12px;
  border-bottom:1px solid var(--line);
}
.news-filter label{
  display:block;padding:11px 14px;font-size:14px;color:var(--gray);
  cursor:pointer;border-radius:2px;transition:.2s;
}
.news-filter label:hover{background:var(--cream);color:var(--ink);}
.filter-radio{display:none;}

/* チェックされたラジオに対応するラベルを強調 */
#f-all:checked    ~ .news__layout label[for="f-all"],
#f-2026:checked   ~ .news__layout label[for="f-2026"],
#f-2025:checked   ~ .news__layout label[for="f-2025"],
#f-2024:checked   ~ .news__layout label[for="f-2024"],
#f-2023:checked   ~ .news__layout label[for="f-2023"],
#f-2022:checked   ~ .news__layout label[for="f-2022"]{
  background:var(--ink);color:#fff;font-weight:700;
}

/* 選択年だけ表示（すべて＝全件表示） */
#f-2026:checked ~ .news__layout .news-item:not(.y-2026),
#f-2025:checked ~ .news__layout .news-item:not(.y-2025),
#f-2024:checked ~ .news__layout .news-item:not(.y-2024),
#f-2023:checked ~ .news__layout .news-item:not(.y-2023),
#f-2022:checked ~ .news__layout .news-item:not(.y-2022){
  display:none;
}

@media(max-width:900px){
  .news__layout{grid-template-columns:1fr;gap:30px;}
  .news-filter{position:static;}
  .news-filter__list{display:flex;flex-wrap:wrap;gap:8px;}
  .news-filter label{border:1px solid var(--line);}
  .news-item{flex-wrap:wrap;gap:10px 16px;}
}