/*
 Theme Name: Astra Child
 Template: astra
 Version: 1.0.2
 Description: Child theme for Astra. Unified CSS for Shark archive/tax/single (card grid).
 Text Domain: astra-child
*/

/* ========== Common: section blocks (TOPと同じ雰囲気) ========== */
.home-section{max-width:1200px;margin:40px auto;padding:0 16px;}
.home-section__head{margin-bottom:16px;}
.home-section__title{margin:0;font-size:clamp(22px,2.4vw,28px);line-height:1.3;}
.home-section__sub{margin:6px 0 0;color:#666;}
.pagination{margin:32px 0;}

/* ========== A) 自作テンプレ（archive-shark.php / taxonomy-shark_cat.php）========== */
/* カード4列グリッド（/shark 系だけ） */
.home-cards.shark-cards{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px;
}
@media (max-width:1024px){ .home-cards.shark-cards{grid-template-columns:repeat(3,1fr);} }
@media (max-width:768px){  .home-cards.shark-cards{grid-template-columns:repeat(2,1fr);} }
@media (max-width:480px){  .home-cards.shark-cards{grid-template-columns:1fr;} }

/* アンカー型カード */
.hc-card.sh-card{
  display:block;background:#fff;border:1px solid #eee;border-radius:12px;overflow:hidden;
  box-shadow:0 1px 4px rgba(0,0,0,.04);text-decoration:none;color:inherit;
  transition:transform .12s ease, box-shadow .12s ease;
}
.hc-card.sh-card:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(0,0,0,.08);}

/* サムネは4:3でトリミングして“デカすぎ”防止 */
.hc-card.sh-card img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;display:block;}

.hc-card .hc-body{padding:12px;}
.hc-card .hc-title{margin:0 0 6px;font-size:clamp(14px,1.7vw,16px);line-height:1.4;}
.hc-card .hc-text{margin:0;font-size:13px;color:#666;}

/* ========== B) 親Astraの標準ループで出ている場合の保険 ========== */
/* /shark（CPTアーカイブ） と /shark/<term>（taxonomy）にだけ4列グリッドを強制 */
body.post-type-archive-shark .ast-row,
body.tax-shark_cat .ast-row{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px;
}
@media (max-width:1024px){
  body.post-type-archive-shark .ast-row,
  body.tax-shark_cat .ast-row{grid-template-columns:repeat(3,1fr);}
}
@media (max-width:768px){
  body.post-type-archive-shark .ast-row,
  body.tax-shark_cat .ast-row{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:480px){
  body.post-type-archive-shark .ast-row,
  body.tax-shark_cat .ast-row{grid-template-columns:1fr;}
}

/* Astraの記事カードを“小型カード”っぽく */
body.post-type-archive-shark .ast-row>article,
body.tax-shark_cat .ast-row>article{
  background:#fff;border:1px solid #eee;border-radius:12px;overflow:hidden;
  box-shadow:0 1px 4px rgba(0,0,0,.04);
  margin:0!important;height:100%;display:flex;flex-direction:column;
  transition:transform .12s ease, box-shadow .12s ease;
}
body.post-type-archive-shark .ast-row>article:hover,
body.tax-shark_cat .ast-row>article:hover{
  transform:translateY(-2px);box-shadow:0 6px 16px rgba(0,0,0,.08);
}

/* サムネ4:3 */
body.post-type-archive-shark .post-thumb img,
body.tax-shark_cat .post-thumb img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;display:block;}

/* テキスト余白＆サイズをコンパクトに */
body.post-type-archive-shark .entry-header,
body.tax-shark_cat .entry-header{padding:12px 12px 0;}
body.post-type-archive-shark .entry-title,
body.tax-shark_cat .entry-title{font-size:clamp(14px,1.7vw,16px);line-height:1.4;margin:0 0 6px;}
body.post-type-archive-shark .entry-meta,
body.tax-shark_cat .entry-meta{padding:0 12px 8px;font-size:12px;color:#777;}
body.post-type-archive-shark .entry-content,
body.tax-shark_cat .entry-content{padding:0 12px 12px;font-size:13px;color:#666;margin:0;}
body.post-type-archive-shark .entry-footer,
body.tax-shark_cat .entry-footer{margin-top:auto;padding:0 12px 12px;}

/* 余計な内側余白/罫線を掃除（テーマ設定差の保険） */
body.post-type-archive-shark .ast-separate-container .ast-article-post,
body.tax-shark_cat .ast-separate-container .ast-article-post{
  padding:0!important;border:none!important;
}

/* ========== Single（個別） ========== */
.sh-single{max-width:1000px;margin:0 auto;padding:24px 16px;}
.sh-single__head{text-align:center;margin-bottom:24px;}
.sh-single__title{font-size:clamp(28px,3.5vw,40px);margin:0 0 8px;line-height:1.3;}
.sh-single__meta{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;color:#555;font-size:14px;}
.sh-single__sci em{font-style:italic;}
.sh-single__thumb img{width:100%;height:auto;border-radius:12px;display:block;margin:16px auto;}
.sh-single__body{line-height:1.9;font-size:16px;}
.sh-single__body h2{font-size:22px;margin-top:2em;}
.sh-single__nav .nav-links{display:flex;justify-content:space-between;margin-top:32px;}

/* 念のため single に強制適用（他CSSの干渉が強い環境向け） */
.single-shark .sh-single{max-width:1000px!important;margin:0 auto!important;padding:24px 16px!important;}
.single-shark h1.sh-single__title{font-size:clamp(28px,3.5vw,40px)!important;margin:0 0 8px!important;line-height:1.3!important;}
.single-shark .sh-single__meta{display:flex!important;gap:10px!important;justify-content:center!important;flex-wrap:wrap!important;color:#555!important;font-size:14px!important;}
.single-shark .sh-single__body{line-height:1.9!important;font-size:16px!important;}
.single-shark .sh-single__body h2{font-size:22px!important;margin-top:2em!important;}
.single-shark .sh-single__nav .nav-links{display:flex!important;justify-content:space-between!important;margin-top:32px!important;}

/* ===== NUCLEAR OVERRIDE: /shark と /shark_cat を TOP風カードで強制整列 ===== */

/* 1) グリッド化：Astra系のどのラッパでも掴む */
body.post-type-archive-shark .site-main .ast-row,
body.post-type-archive-shark .site-main .ast-posts-wrapper,
body.post-type-archive-shark .site-main .ast-archive-posts,
body.tax-shark_cat .site-main .ast-row,
body.tax-shark_cat .site-main .ast-posts-wrapper,
body.tax-shark_cat .site-main .ast-archive-posts{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:16px !important;
  align-items:stretch !important;
}

/* 2) レスポンシブ */
@media (max-width:1024px){
  body.post-type-archive-shark .site-main .ast-row,
  body.post-type-archive-shark .site-main .ast-posts-wrapper,
  body.post-type-archive-shark .site-main .ast-archive-posts,
  body.tax-shark_cat .site-main .ast-row,
  body.tax-shark_cat .site-main .ast-posts-wrapper,
  body.tax-shark_cat .site-main .ast-archive-posts{
    grid-template-columns:repeat(3,1fr) !important;
  }
}
@media (max-width:768px){
  body.post-type-archive-shark .site-main .ast-row,
  body.post-type-archive-shark .site-main .ast-posts-wrapper,
  body.post-type-archive-shark .site-main .ast-archive-posts,
  body.tax-shark_cat .site-main .ast-row,
  body.tax-shark_cat .site-main .ast-posts-wrapper,
  body.tax-shark_cat .site-main .ast-archive-posts{
    grid-template-columns:repeat(2,1fr) !important;
  }
}
@media (max-width:480px){
  body.post-type-archive-shark .site-main .ast-row,
  body.post-type-archive-shark .site-main .ast-posts-wrapper,
  body.post-type-archive-shark .site-main .ast-archive-posts,
  body.tax-shark_cat .site-main .ast-row,
  body.tax-shark_cat .site-main .ast-posts-wrapper,
  body.tax-shark_cat .site-main .ast-archive-posts{
    grid-template-columns:1fr !important;
  }
}

/* 3) 記事カード化（Astra標準 article をシンプルなカードに寄せる） */
body.post-type-archive-shark .site-main article,
body.tax-shark_cat .site-main article{
  background:#fff;
  border:1px solid #eee;
  border-radius:12px;
  overflow:hidden;
  box-shadow:0 1px 4px rgba(0,0,0,.04);
  margin:0 !important;
  height:100%;
  display:flex;
  flex-direction:column;
  transition:transform .12s ease, box-shadow .12s ease;
}
body.post-type-archive-shark .site-main article:hover,
body.tax-shark_cat .site-main article:hover{
  transform:translateY(-2px);
  box-shadow:0 6px 16px rgba(0,0,0,.08);
}

/* 4) サムネを4:3でトリミング */
body.post-type-archive-shark .site-main .post-thumb img,
body.tax-shark_cat .site-main .post-thumb img{
  width:100%;
  height:auto;
  aspect-ratio:4/3;
  object-fit:cover;
  display:block;
}

/* 5) タイトル等の余白・サイズ調整（TOPカード寄せ） */
body.post-type-archive-shark .site-main .entry-header,
body.tax-shark_cat .site-main .entry-header{ padding:12px 12px 0; }
body.post-type-archive-shark .site-main .entry-title,
body.tax-shark_cat .site-main .entry-title{
  font-size:clamp(14px,1.7vw,16px);
  line-height:1.4;
  margin:0 0 6px;
}
body.post-type-archive-shark .site-main .entry-meta,
body.tax-shark_cat .site-main .entry-meta{
  padding:0 12px 8px;
  font-size:12px;
  color:#777;
}
body.post-type-archive-shark .site-main .entry-content,
body.tax-shark_cat .site-main .entry-content{
  padding:0 12px 12px;
  font-size:13px;
  color:#666;
  margin:0;
}
body.post-type-archive-shark .site-main .entry-footer,
body.tax-shark_cat .site-main .entry-footer{
  margin-top:auto;
  padding:0 12px 12px;
}

/* 6) 余計な内側余白/罫線の掃除（テーマ設定差の保険） */
body.post-type-archive-shark .ast-separate-container .ast-article-post,
body.tax-shark_cat .ast-separate-container .ast-article-post{
  padding:0 !important;
  border:none !important;
}