/* ============================================================
   ChronuStellar — 共通スタイル（サブページ用）
   トップ(index.html)と同じトーン・同じヘッダーを全ページで使う
   ============================================================ */
*{ margin:0; padding:0; box-sizing:border-box; }
:root{
  --ink:#1b1e26; --ink-soft:#4a4f5c; --muted:#8a8f9c;
  --base:#f6f4ef; --base2:#efece5; --night:#0d1226; --night-ink:#eef0fa;
  --line:rgba(27,30,38,.12);
  --serif:"Hiragino Mincho ProN","Yu Mincho","YuMincho",serif;
  --sans:"Helvetica Neue",Helvetica,Arial,"Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;
}
html{ scroll-behavior:smooth; }
body{ background:var(--base); color:var(--ink); font-family:var(--sans); line-height:1.85; -webkit-font-smoothing:antialiased; overflow-x:hidden; }
img{ display:block; max-width:100%; }
a{ color:inherit; }
.wrap{ max-width:1080px; margin:0 auto; padding:0 6vw; }
.kicker{ font-size:10px; letter-spacing:.42em; color:var(--muted); text-transform:uppercase; }
.sec-title{ font-family:var(--serif); font-weight:500; font-size:clamp(26px,4.2vw,44px); letter-spacing:.1em; margin-top:2px; line-height:1.3; }

/* フィルムグレイン（トップと統一） */
.grain{ position:fixed; inset:-50%; width:200%; height:200%; z-index:90; pointer-events:none; opacity:.05;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grain 1.2s steps(4) infinite; }
@keyframes grain{ 0%{transform:translate(0,0)} 25%{transform:translate(-2%,1%)} 50%{transform:translate(1%,-1%)} 75%{transform:translate(-1%,2%)} 100%{transform:translate(0,0)} }

/* ===== ヘッダー（トップと完全に同じ） ===== */
header.top{ position:fixed; top:0; left:0; width:100%; z-index:100; padding:14px 5vw; display:flex; justify-content:space-between; align-items:center; background:rgba(246,244,239,.92); backdrop-filter:blur(10px); border-bottom:1px solid var(--line); color:var(--ink); }
header.top .logo{ font-family:var(--serif); letter-spacing:.16em; font-size:18px; line-height:1.2; text-align:center; }
header.top .logo a{ color:inherit; text-decoration:none; }
header.top .logo small{ display:block; font-family:var(--sans); font-size:8px; letter-spacing:.42em; color:var(--muted); margin-top:2px; }
header.top nav{ display:flex; gap:30px; font-size:11.5px; letter-spacing:.22em; }
header.top nav a{ color:var(--ink); text-decoration:none; opacity:.65; transition:opacity .2s; }
header.top nav a:hover{ opacity:1; }
header.top nav a.active{ opacity:1; border-bottom:1px solid var(--ink); padding-bottom:3px; }
@media(max-width:760px){ header.top nav{ gap:14px; font-size:10px; } header.top nav a.hide-sp{ display:none; } }

/* ===== ページヘッダー（各ページ上部の見出し帯） ===== */
.phero{ padding:24vh 6vw 12vh; text-align:center; }
.phero .kicker{ display:block; margin-bottom:14px; }
.phero h1{ font-family:var(--serif); font-weight:500; font-size:clamp(30px,6vw,58px); letter-spacing:.12em; }
.phero .lead{ margin-top:3vh; color:var(--ink-soft); font-size:14px; letter-spacing:.06em; max-width:640px; margin-left:auto; margin-right:auto; }

/* ===== セクション・共通パーツ ===== */
.section{ padding:8vh 0; }
.section.alt{ background:var(--base2); }
.btn{ display:inline-block; padding:16px 48px; border-radius:999px; border:1px solid var(--ink); color:var(--ink); text-decoration:none; font-size:12px; letter-spacing:.3em; transition:.3s; background:transparent; cursor:pointer; font-family:var(--sans); }
.btn:hover{ background:var(--ink); color:#fff; }
.golink{ display:inline-block; text-decoration:none; font-size:12px; letter-spacing:.28em; padding:14px 36px; border:1px solid currentColor; border-radius:999px; transition:.3s; color:inherit; }
.golink:hover{ background:var(--ink); color:#fff; }

/* 入場リビール（トップと同じ立体感・控えめ版） */
.rv{ opacity:0; transform:perspective(900px) translateY(40px) rotateX(12deg); transform-origin:50% 100%; transition:opacity 1s ease, transform 1.1s cubic-bezier(.22,.8,.2,1); }
.rv.in{ opacity:1; transform:none; }

/* ===== 共通フッター（夜・ダーク） ===== */
footer.site{ position:relative; background:var(--night); color:var(--night-ink); padding:14vh 6vw 5vh; text-align:center; overflow:hidden; }
footer.site::before{ content:""; position:absolute; inset:0; background:radial-gradient(50vmax 30vmax at 50% 0%, rgba(132,148,186,.12), transparent 60%); }
footer.site .inner{ position:relative; z-index:2; }
footer.site .flogo{ font-family:var(--serif); font-size:24px; letter-spacing:.18em; }
footer.site .flogo small{ display:block; font-family:var(--sans); font-size:8px; letter-spacing:.42em; color:#7b83a8; margin-top:6px; }
footer.site .fnav{ display:flex; flex-wrap:wrap; gap:22px; justify-content:center; margin-top:5vh; font-size:11px; letter-spacing:.24em; }
footer.site .fnav a{ color:#cdd2e2; text-decoration:none; opacity:.8; transition:opacity .2s; }
footer.site .fnav a:hover{ opacity:1; }
footer.site .fmeta{ margin-top:4vh; font-size:12px; letter-spacing:.1em; color:#9aa3c8; }
footer.site .fmeta a{ color:#cdd2e2; }
footer.site .ig{ display:inline-block; margin-top:2.4vh; color:#9aa3c8; text-decoration:none; font-size:12px; letter-spacing:.14em; }
footer.site .ig:hover{ color:#fff; }
footer.site .copyright{ margin-top:7vh; font-size:10px; letter-spacing:.22em; color:#6e7488; }
.icn{ width:15px; height:15px; vertical-align:-2.5px; margin-right:8px; }

/* ===== ニュース一覧 ===== */
.news-list{ max-width:780px; margin:0 auto; display:flex; flex-direction:column; gap:30px; }
.news-card{ display:grid; grid-template-columns:210px 1fr; gap:28px; text-decoration:none; color:inherit; border-bottom:1px solid var(--line); padding-bottom:30px; align-items:start; transition:transform .3s ease; }
.news-card:hover{ transform:translateX(4px); }
@media(max-width:600px){ .news-card{ grid-template-columns:1fr; gap:14px; } }
.news-card__img{ aspect-ratio:3/2; border-radius:8px; overflow:hidden; background:#e7e3d8; }
.news-card__img img{ width:100%; height:100%; object-fit:cover; transition:transform .6s ease; }
.news-card:hover .news-card__img img{ transform:scale(1.05); }
.news-card__date{ font-size:11px; letter-spacing:.18em; color:var(--muted); font-variant-numeric:tabular-nums; }
.news-card__title{ font-family:var(--serif); font-weight:500; font-size:20px; letter-spacing:.06em; margin:8px 0; line-height:1.5; }
.news-card__ex{ font-size:13.5px; color:var(--ink-soft); line-height:1.85; }
.news-card__more{ display:inline-block; margin-top:12px; font-size:11px; letter-spacing:.2em; color:var(--ink); }
/* ===== 記事ページ ===== */
.post{ max-width:720px; margin:0 auto; }
.post-date{ font-size:11px; letter-spacing:.2em; color:var(--muted); text-align:center; font-variant-numeric:tabular-nums; }
.post-title{ font-family:var(--serif); font-weight:500; font-size:clamp(24px,4vw,36px); letter-spacing:.08em; text-align:center; margin:10px 0 5vh; line-height:1.55; }
.post-img{ border-radius:10px; overflow:hidden; margin:0 0 5vh; box-shadow:0 20px 50px rgba(27,30,38,.14); }
.post-img img{ width:100%; display:block; }
.post-body p{ font-size:15px; line-height:2.15; margin:0 0 1.6em; color:#2b3038; }
.post-back{ text-align:center; margin-top:9vh; }

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  .grain{ animation:none; }
  .rv{ opacity:1; transform:none; transition:none; }
}