@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/* ===== Anime From Japan – Global ===== */
:root{
  --afj-accent:#e50914; /* Netflix系レッド */
  --afj-bg:#0d0d0d;
  --afj-text:#111;
  --afj-muted:#666;
  --afj-card:#fff;
}
html { scroll-behavior:smooth; }
body { letter-spacing: .01em; }

/* Links & Buttons */
a.btn, .afj-btn {
  display:inline-block; padding:12px 28px; border-radius:30px;
  background:var(--afj-accent); color:#fff !important; text-decoration:none;
  font-weight:700; transition:transform .15s ease, opacity .15s ease;
}
a.btn:hover, .afj-btn:hover { transform:translateY(-1px); opacity:.9; }

/* Section basics */
.section { padding:60px 20px; }
.section h2 { font-size:2rem; text-align:center; margin:0 0 28px; }
.section p.lead { max-width:760px; margin:0 auto 18px; color:var(--afj-muted); }

/* ===== Hero ===== */
.hero-section{
  text-align:center; padding:90px 20px; color:#fff; 
  background:linear-gradient(180deg, rgba(13,13,13,.85), rgba(13,13,13,.85)),
             url('/wp-content/uploads/hero-anime-city.jpg') center/cover no-repeat;
}
.hero-section h1{ font-size: clamp(2.2rem, 4.5vw, 3.2rem); font-weight:800; letter-spacing:.02em; }
.hero-section p{ font-size: clamp(1rem, 2.2vw, 1.25rem); opacity:.9; margin:.6rem 0 1.4rem; }

/* ===== Card list (Cocoon entry cards) ===== */
.entry-card-wrap .entry-card {
  border-radius:14px; overflow:hidden; background:var(--afj-card);
  box-shadow:0 8px 24px rgba(0,0,0,.06);
}
.entry-card-wrap .entry-card .entry-card-content { padding:14px 16px; }
.entry-card-wrap .entry-card .cat-label { 
  background:var(--afj-accent); color:#fff; font-weight:700; 
}
.entry-card-wrap .entry-card-title { font-weight:800; line-height:1.25; }

/* ===== Studio logo grid ===== */
.studio-grid{
  display:grid; grid-template-columns:repeat(auto-fit, minmax(140px,1fr));
  gap:22px; max-width:900px; margin:0 auto;
}
.studio-grid img{ max-height:60px; width:auto; filter:grayscale(100%); opacity:.85; transition:.2s; }
.studio-grid img:hover{ filter:none; opacity:1; }

/* ===== Footer CTA ===== */
.footer-cta{ text-align:center; padding:70px 20px; background:var(--afj-bg); color:#fff; }
.footer-cta h2{ font-size:clamp(1.4rem, 3vw, 1.9rem); margin-bottom:.6rem; }
.footer-cta p{ max-width:720px; margin:0 auto 1rem; color:#d9d9d9; }

/* ===== Utilities ===== */
.afj-center{ text-align:center; }
.afj-muted{ color:var(--afj-muted); }

/* ===== Responsive tweaks ===== */
@media (max-width: 780px){
  .section{ padding:44px 18px; }
  .section h2{ font-size:1.6rem; }
}

/* ===== Optional: dark body for a cinematic vibe on listing pages ===== */
/* body.blog, body.archive { background:#0b0b0b; } 
.entry-card-wrap .entry-card { background:#121212; }
.entry-card-wrap .entry-card-title a { color:#fff; }
*/
/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}