/* ===== Front Page minimal monochrome theme ===== */
body.home {
  --fg: #333;
  --bg: #fff;
  --muted: #666;
  --line: #e6e6e6;
  --hover: #f7f7f7;

  color: var(--fg);
  background: var(--bg);
}

/* Layout */
body.home .wrap {
  max-width: 1100px;
  margin: 0 auto;
  padding: 16px;
}

body.home .section { margin-top: 2rem; }

/* Typography */
body.home h1, body.home h2, body.home h3 { color: var(--fg); line-height: 1.25; }
body.home h1 { font-size: clamp(1.6rem, 3vw, 2.2rem); margin: .25rem 0; }
body.home h2 { font-size: clamp(1.25rem, 2.2vw, 1.6rem); margin: 0 0 .5rem; }
body.home h3 { font-size: 1rem; margin: .25rem 0; }
body.home .muted { color: var(--muted); }

/* Links & buttons */
body.home a { color: var(--fg); text-decoration: none; }
body.home a:hover { text-decoration: underline; }
body.home a.button,
body.home button,
body.home .search-form button {
  appearance: none;
  border: 1px solid var(--line);
  background: var(--bg);
  color: var(--fg);
  border-radius: 8px;
  padding: .5rem .75rem;
  cursor: pointer;
  transition: background .2s, transform .05s;
}
body.home a.button:hover,
body.home button:hover,
body.home .search-form button:hover { background: var(--hover); }
body.home a.button:active,
body.home button:active,
body.home .search-form button:active { transform: translateY(1px); }
body.home a:focus-visible,
body.home button:focus-visible,
body.home input:focus-visible,
body.home select:focus-visible {
  outline: 2px solid #000; outline-offset: 2px;
}

/* Hero */
body.home .hero { display: grid; gap: 1rem; grid-template-columns: 1.2fr 1fr; align-items: start; margin-top: .5rem; }
body.home .hero .hero-card img { display: block; width: 100%; height: auto; }
body.home .search-form { display: flex; gap: .5rem; }
body.home .search-form .search-field {
  flex: 1;
  border: 1px solid var(--line);
  padding: .5rem .6rem;
  border-radius: 8px;
  background: var(--bg);
  color: var(--fg);
}
.content{ overflow:hidden; }

/* Tabs (news type) */
body.home .news-tabs { display: flex; gap: .5rem; flex-wrap: wrap; }
body.home .news-tabs .tab,
body.home .news-tabs a {
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: .35rem .75rem;
  background: var(--bg);
  font-size: .9rem;
}
body.home .news-tabs a.is-active,
body.home .news-tabs a[aria-current="page"] {
  background: #000; color: #fff; border-color: #000;
}

/* Grids */
body.home .grid,
body.home .post-grid {
  display: grid;
  gap: 1rem;
}
body.home .grid { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
body.home .post-grid { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }

/* Cards */
body.home .card {
  border: 1px solid var(--line);
  border-radius: 10px;
  overflow: hidden;
  background: var(--bg);
  transition: transform .08s ease, box-shadow .2s ease, border-color .2s ease;
}
body.home .card:hover {
  transform: translateY(-2px);
  border-color: #d8d8d8;
  box-shadow: 0 6px 14px rgba(0,0,0,.06);
}
body.home .card img { display: block; width: 100%; height: auto; }
body.home .card > a { display: block; color: inherit; text-decoration: none; }
body.home .card .meta { color: var(--muted); font-size: .9rem; }

/* Badges */
body.home .badge {
  display: inline-block;
  font-size: .8rem;
  line-height: 1;
  padding: .18rem .5rem;
  border-radius: 6px;
  background: #eee;
  color: #111;
  border: 1px solid #ddd;
}
body.home .badges { display: flex; gap: .25rem; align-items: center; }

/* Horizontal scroll shelves */
body.home .h-scroll {
  display: flex; gap: 1rem; overflow-x: auto; padding-bottom: .25rem;
  -webkit-overflow-scrolling: touch; scroll-snap-type: x proximity;
}
body.home .h-scroll .card { min-width: 260px; scroll-snap-align: start; }

/* Chips (series) */
body.home .chips { display: flex; gap: .5rem; flex-wrap: wrap; }
body.home .chip {
  border: 1px solid var(--line);
  border-radius: 9999px;
  padding: .35rem .75rem;
  background: var(--bg);
}
body.home .chip:hover { background: var(--hover); }

/* Platforms grid */
body.home .plat-grid {
  display: grid; gap: 1rem;
  grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
  align-items: center;
}
body.home .plat {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: .5rem .75rem;
  display: flex; align-items: center; gap: .5rem;
  background: var(--bg);
}
body.home .plat:hover { background: var(--hover); }
body.home .plat img { width: 24px; height: 24px; object-fit: contain; }

/* Utilities */
body.home .more { text-align: right; }
body.home time { color: var(--muted); }

/* Responsive */
@media (max-width: 900px) {
  body.home .hero { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  body.home .card, body.home a.button, body.home button { transition: none; }
}

/* --- tiny polish --- */
body.home .news-tabs .tab,
body.home .news-tabs a {
  transition: background .15s, color .15s, border-color .15s;
}
body.home .news-tabs a:hover { background: #f0f0f0; }

body.home .hero .search-form .search-field { max-width: 620px; }
@media (max-width: 900px) {
  body.home .hero .search-form .search-field { max-width: none; }
}

body.home .card .muted { color: #666; }
body.home .card div { /* 画像下のテキストブロック */
  /* カード内の読みやすさをほんの少し上げる */
  line-height: 1.6;
}

/* hero-slider */
.hero-slider { margin: .5rem 0 1rem; }
.hero-slider .slide { position: relative; overflow: hidden; border-radius: 12px; }
.hero-slider .slide__img,
.hero-slider .slide__placeholder { width:100%; height:auto; display:block; aspect-ratio:16/9; object-fit:cover; }
.hero-slider .slide__overlay{
  position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,.15) 0%, rgba(0,0,0,.55) 70%);
  color:#fff; display:flex; flex-direction:column; justify-content:flex-end;
  padding: 1rem 1.25rem;
}
.hero-slider .slide__badges{ display:flex; gap:.5rem; align-items:center; margin-bottom:.25rem; }
.hero-slider .badge{ background:#fff; color:#333; border-radius:9999px; padding:.15rem .5rem; font-size:.85rem; }
.hero-slider .slide__title{ font-size:clamp(1.1rem,2.5vw,1.6rem); line-height:1.25; margin:0 .2rem .25rem 0; }
.hero-slider .slide__excerpt{ font-size:.95rem; opacity:.95; margin:0 0 .2rem; }
.hero-slider .slick-dots li button:before{ color:#fff; opacity:.6; }
.hero-slider .slick-dots li.slick-active button:before{ opacity:1; }
.review-search{ margin: .6rem 0 1.5rem; }
.review-search__form{ display:flex; gap:.5rem; flex-wrap:wrap; }
.review-search__form input[type="search"]{
  flex:1 1 340px; border:1px solid #e6e6e6; border-radius:8px; padding:.55rem .7rem;
}
.review-search__form button{
  border:1px solid #e6e6e6; border-radius:8px; padding:.55rem .9rem; background:#fff; cursor:pointer;
}
.review-search__form button:hover{ background:#f7f7f7; }
.review-search__form .review-search__more{ align-self:center; color:#333; text-decoration:none; }
.review-search__form .review-search__more:hover{ text-decoration:underline; }

/* スライダー上で grab カーソルを表示 */
.hero-slider .slider { cursor: grab; }
.hero-slider .slider:active { cursor: grabbing; }

/* スライド内のリンクはブロック化されているので、余白も掴みやすい */
.hero-slider .slide__link { display:block; }

/* ドットと矢印の視認性を少しUP（お好みで） */
.hero-slider .slick-dots li button:before { color:#fff; opacity:.7; }
.hero-slider .slick-dots li.slick-active button:before { opacity:1; }
.hero-slider .slick-prev:before, .hero-slider .slick-next:before { color:#fff; opacity:.85; }

/* リスト外にもスライドが少しはみ出せるように */
.hero-slider .slick-list { overflow: visible; }

/* スライド間の隙間（centerPadding と合わせて微調整） */
.hero-slider .slick-slide { padding: 0 8px; }

/* 非センターのスライドを少しだけ縮小＆薄く（視線誘導用） */
.hero-slider .slick-slide { transform: scale(.96); opacity: .85; transition: transform .25s ease, opacity .25s ease; }
.hero-slider .slick-center { transform: scale(1);  opacity: 1;  z-index: 2; }

/* 矢印とドット（任意で視認性UP） */
.hero-slider .slick-dots li button:before { color:#fff; opacity:.7; }
.hero-slider .slick-dots li.slick-active button:before { opacity:1; }
.hero-slider .slick-prev:before, .hero-slider .slick-next:before { color:#fff; opacity:.9; }