/* ===========================
   Works Archive — 調整パッチ（置換OK）
   ヒーローの見切れ軽減＋グリッド中央寄せ強化
=========================== */

/* ===== ヒーロー（1枚絵） ===== */
.warchive-hero .hero-visual{
  max-width: 1200px;
  margin: 0 auto 40px;
  padding: 0 16px;
}
.hero-visual__img{
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  object-position: center 30%;
  border-radius: 18px;
  box-shadow: 0 8px 28px rgba(0,0,0,.12);
}

@media (max-width: 640px){
  .hero-visual__img{
    aspect-ratio: auto;
    height: auto;
    object-fit: cover;object-position: center 35%;
  }
}

/* ===== コンテナ共通（中央ロック） ===== */
.warchive-inner{
  max-width: 1200px;
  width: min(1100px, 100%);
  margin: 0 auto;
  padding: 0 16px 56px;
}

/* ===== グリッド（最新6件＋もっとみる） ===== */
.wcards{
  display: grid;
  /* 余りスペースを均等配分して中央に寄せる */
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: clamp(18px, 2.4vw, 28px);
  width: min(1100px, 100%);
  margin: 0 auto;
  padding: 0; 
  list-style: none;
  justify-content: center;
  justify-items: center; 
  align-items: start;
}

.wcard{
  max-width: 320px;
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 16px;
  box-shadow: 0 4px 16px rgba(0,0,0,.06);
  overflow: hidden;
  text-align: center;
  transition: transform .18s ease, box-shadow .18s ease;
}
.wcard:hover{
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0,0,0,.12);
}
.wcard img,
.wcard-ph{
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1;  object-fit: cover;
}

/* タイトル/メタ */
.wcard-ttl{
  margin: 8px;
  font-size: 1.05rem;
}
.wcard-meta{
  margin: 0 8px 12px;
  font-size: .9rem;
  color: #666;
}

.warchive-more{
  width: min(1100px, 100%);
  margin: 20px auto 0;
  text-align: center;
}
.btn-more{
  display: inline-block;
  padding: 12px 28px;
  border-radius: 999px;
  background: var(--c-deep, #823327);
  color: var(--c-pale, #eecebf);
  text-decoration: none;
  border: 0;
  cursor: pointer;
  transition: transform .15s ease, box-shadow .15s ease, opacity .15s ease;
}
.btn-more:hover{ transform: translateY(-1px); box-shadow: 0 8px 18px rgba(0,0,0,.12); }
.btn-more:disabled{ opacity: .45; cursor: not-allowed; }

/* ===== 注意書き ===== */
.notice-panel{
  background: var(--c-bg, #faf7f6);
  border-top: 1px solid rgba(0,0,0,.08);
  padding: 40px 16px 56px;
}
.notice-inner{
  max-width: 960px;
  margin: 0 auto;
  text-align: center;
}
.notice-title{ font-size: clamp(20px, 2.4vw, 28px); margin-bottom: 12px; }
.notice-body p{
  margin: 0 auto 18px;
  max-width: 640px;
  color: #444;
}
.notice-cta{
  display: inline-block;
  padding: 10px 22px;
  border-radius: 999px;
  background: var(--c-deep, #823327);
  color: var(--c-pale, #eecebf);
  text-decoration: none;
}
.notice-cta:hover{ background: #6f2a23; }

/* ===== ブレークポイント微調整 ===== */
@media (max-width: 960px){
  .wcards{ grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
}
@media (max-width: 480px){
  .wcard{ max-width: 100%; }
}
/* ====== FORCE CENTER (template-scoped) ====== */
/* テンプレート page-works-archive.php にだけ効かせる */
.page-template-page-works-archive .warchive-hero .hero-visual,
.page-template-page-works-archive .warchive-inner,
.page-template-page-works-archive .warchive-grid .wcards,
.page-template-page-works-archive .warchive-more,
.page-template-page-works-archive .notice-inner{
  max-width: 1200px !important;
  width: min(1100px, 100%) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 16px;
  padding-right: 16px;
}

/* グリッドの左寄りを完全阻止 */
.page-template-page-works-archive .warchive-grid .wcards{
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)) !important;
  gap: 24px !important;
  justify-content: center !important;   /* 余りスペースを中央配分 */
  justify-items: center !important;     /* セル内も中央 */
  align-items: start !important;
  list-style: none !important;
  padding: 0 !important;                /* UL既定の左padding潰し */
  box-sizing: border-box;
}

/* カード幅を抑えて列の計算を安定化 */
.page-template-page-works-archive .wcard{
  max-width: 320px !important;
}

/* ヒーローの箱も中央固定（他CSSのflex影響を打ち消す） */
.page-template-page-works-archive .warchive-hero,
.page-template-page-works-archive .warchive-grid,
.page-template-page-works-archive .notice-panel{
  width: 100% !important;
  display: block !important;
}

/* 念のため、左右から押す余白をゼロに */
.page-template-page-works-archive .warchive,
.page-template-page-works-archive main,
.page-template-page-works-archive .site-main{
  padding-left: 0 !important;
  padding-right: 0 !important;
}