/* Japanese Snacks Lab — 静的再建 独自スタイルのみ
   （ヘッダー/フッター/MV/カード/見出し/目次等はSWELL実CSS＋swell-dynamic.cssに委譲）
   ここに残すのは: FTC注記・アフィリエイト注記・xo_slider代替ストリップ・
   タブ/アコーディオンのJS代替表示制御・微調整のみ。 */

/* ── アフィリエイト注記（記事冒頭・意図的差異／FTC） ── */
.jsl-affi-note {
  background: #fdf6e9; border: 1px solid #f0ddb8; color: #8a6a3e;
  font-size: .8rem; padding: 8px 12px; border-radius: 6px; margin: 0 0 20px;
}
.jsl-affi-note em { font-style: normal; }

/* ── フッターのFTC開示文（意図的差異・必須） ── */
.jsl-disclosure {
  color: #999; font-size: .76rem; line-height: 1.7;
  max-width: 720px; margin: 0 auto 14px; text-align: center;
}

/* ── メインビジュアル基盤レイアウト ──
   SWELLフロントページCSSモジュール（p-mainVisual__textLayer/__slide/__slideTitle 等の
   base layout）は参照資料(reference/)に含まれておらず、loaded CSSのどれにも存在しない。
   swell-dynamic-top.css は __inner の height と filterLayer のみを持つため、
   原型（中央寄せタイトル＋自動幅の緑ピルボタン）を再現する最小限のbaseだけをここで補完する。 */
.p-mainVisual { position: relative; overflow: hidden; }
.p-mainVisual__inner { position: relative; }
.p-mainVisual__slide { position: relative; height: 100%; overflow: hidden; }
.p-mainVisual__imgLayer { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; }
.p-mainVisual__textLayer {
  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
  width: 100%; z-index: 3; padding: 0 6vw; box-sizing: border-box;
  /* z-index:3 必須 — main.css の .c-filterLayer:after（ドットテクスチャ）が z2 で全面に被さり、
     z2以下だとMVのボタンがクリック不能になる */
}
/* 保険: フィルター/テクスチャ疑似要素にクリックを奪わせない
   （slide自体を pointer-events:none にすると ::before/::after もヒット対象外になる。
     リンクを持つ textLayer 側だけ auto で復帰させる） */
.p-mainVisual__slide.c-filterLayer { pointer-events: none; }
.p-mainVisual__textLayer { pointer-events: auto; }
.p-mainVisual__slideTitle {
  font-size: clamp(1.6rem, 4vw, 3rem); font-weight: 700; line-height: 1.5; margin: 0;
}
.p-mainVisual .c-mvBtn__btn { display: inline-block; width: auto; font-size: 1rem; }

/* ── xo_slider 代替（商品画像の横スクロールストリップ） ── */
.jsl-slider {
  display: flex; gap: 10px; overflow-x: auto; padding: 6px 2px 10px;
  -webkit-overflow-scrolling: touch; scroll-snap-type: x mandatory;
}
.jsl-slide { flex: 0 0 78%; max-width: 420px; scroll-snap-align: start; }
.jsl-slide img { width: 100%; border-radius: 6px; display: block; }

/* ── サイトマップページの記事リスト ── */
.jsl-sitemap { columns: 2; }
@media (max-width: 600px) { .jsl-sitemap { columns: 1; } }

/* ── タブ/アコーディオンの表示制御（SWELL本体JSの代替） ── */
.c-tabBody__item { display: none; }
.c-tabBody__item.is-active { display: block; }
.swell-block-accordion__body { display: none; }
.swell-block-accordion__item.is-open .swell-block-accordion__body { display: block; }
.swell-block-accordion__title { cursor: pointer; width: 100%; text-align: left; }
.swell-block-accordion__icon .icon-caret-up { display: none; }
.is-open .swell-block-accordion__icon .icon-caret-up { display: inline-block; }
.is-open .swell-block-accordion__icon .icon-caret-down { display: none; }

/* ── 微調整（保険） ── */
.post_content .wp-block-table { overflow-x: auto; }
iframe { max-width: 100%; border: 0; }