/*
Theme Name: pittosporum-manga-child
Template: swell
Version: 1.0.5
*/
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700&display=swap');

:root {
  --color_main: #9B2D6F;
  --color_accent: #C9963A;
  --color_bg: #FBF5EC;
  --color_text: #2D1A28;
}
body, .l-header, .l-footer, .l-content, .l-container {
  --color_main: #9B2D6F;
  --color_accent: #C9963A;
}

body { font-family: 'Noto Sans JP', sans-serif; background-color: #FBF5EC; }

/* ヘッダー */
.l-header { background: #9B2D6F !important; }
.l-header * { color: #fff !important; }
.c-catchphrase { background: rgba(0,0,0,0.3) !important; color: #fff !important; }

/* メインビジュアル非表示 */
.p-mainVisual { display: none !important; }

/* フッター */
.l-footer { background: #7A1F55 !important; }
.l-footer * { color: #E8C5D8 !important; }
.l-footer a:hover { color: #fff !important; }

/* CTAボタン全般 */
.wp-block-button__link,
.c-btn, a.c-btn,
.swell-block-button a,
.c-ctaBtn, a.c-ctaBtn { 
  background-color: #9B2D6F !important; 
  color: #fff !important;
  border-color: #9B2D6F !important;
}
.wp-block-button__link:hover { background-color: #7A1F55 !important; }

/* H2見出し */
.wp-block-heading, .article-body h2,
h2.wp-block-heading, h2 {
  background: #9B2D6F !important;
  color: #fff !important;
  padding: 10px 16px !important;
  border-left: 4px solid #C9963A !important;
  border-radius: 4px !important;
  -webkit-text-fill-color: #fff !important;
}
/* H3見出し */
h3 { 
  border-left: 4px solid #9B2D6F !important;
  padding-left: 12px !important;
  color: #9B2D6F !important;
}

/* wpautop が grid内に挿入する空<p>を非表示 */
div[style*="grid-template-columns"] > p {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* タップターゲット */
button, .wp-block-button__link { min-height: 44px; }
/* フォーカス */
*:focus-visible { outline: 3px solid #9B2D6F; outline-offset: 2px; }

/* モバイル */
@media (max-width: 767px) {
  h2 { font-size: 1.05rem !important; }
  h3 { font-size: 0.95rem !important; }
}

/* メインビジュアル非表示後の上部余白縮小 */
.home .l-mainContent__inner,
.home .p-pageTop { padding-top: 16px !important; }

/* モバイル: グリッドを1カラム化 */
@media (max-width: 480px) {
  div[style*="grid-template-columns"] {
    grid-template-columns: 1fr !important;
  }
}

/* トップページ: コンテンツ上部余白削減 (mainvisual非表示のため64px→16px) */
.home .l-content.l-container { padding-top: 16px !important; }

/* トップページ: SWELL inline .top #content padding-top を上書き */
.top #content { padding-top: 16px !important; }

/* ============================================================
   PR引用記事専用クラス (2026-06-12)
   Main: #9B2D6F / Accent: #C9963A / BG: #FBF5EC
   ============================================================ */
.pts-press-quote {
  border-left: 4px solid #9B2D6F;
  background: #FDF0F6;
  margin: 1.5rem 0;
  padding: 1rem 1.25rem;
  border-radius: 0 4px 4px 0;
  font-size: 0.92rem;
  color: #2D1A28;
  line-height: 1.8;
}
.pts-press-quote cite {
  display: block;
  margin-top: 0.6rem;
  font-size: 0.78rem;
  color: #7A4560;
  font-style: normal;
}
.pts-press-quote cite a { color: #7A4560; text-decoration: underline; }
.pts-related-cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 1rem;
  margin: 1.5rem 0;
}
.pts-related-card {
  display: block;
  background: #fff;
  border: 1px solid #E5D0D8;
  border-radius: 8px;
  padding: 1rem;
  text-decoration: none !important;
  box-shadow: 0 1px 3px rgba(155,45,111,.10);
  transition: box-shadow .2s, transform .2s;
}
.pts-related-card:hover { box-shadow: 0 4px 12px rgba(155,45,111,.18); transform: translateY(-2px); }
.pts-related-card__title {
  display: block;
  font-weight: 700;
  font-size: 0.92rem;
  color: #9B2D6F;
  margin-bottom: 0.3rem;
  line-height: 1.4;
}
.pts-related-card__meta {
  display: block;
  font-size: 0.78rem;
  color: #7A4560;
  margin-bottom: 0.5rem;
}
.pts-related-card__cta {
  display: block;
  background: #9B2D6F;
  color: #fff !important;
  text-align: center;
  font-weight: 700;
  font-size: 0.82rem;
  padding: 0.5em 0.8em;
  border-radius: 4px;
  text-decoration: none !important;
}
.pts-cta {
  display: inline-block;
  background: #9B2D6F;
  color: #fff !important;
  font-weight: 700;
  font-size: 1rem;
  padding: 0.85em 2em;
  border-radius: 9999px;
  text-decoration: none !important;
  box-shadow: 0 4px 14px rgba(155,45,111,.35);
  transition: transform .18s, box-shadow .18s;
  min-height: 44px;
}
.pts-cta:hover { transform: translateY(-2px); box-shadow: 0 6px 18px rgba(155,45,111,.45); }
@media (max-width: 768px) { .pts-related-cards { grid-template-columns: 1fr; } }

/* ============================================================
   v2.0 — SWELLトップページ構造修正 (2026-06-12)
   ============================================================ */

/* 1. メインビジュアル非表示 — ID/Class両方で確実に */
#main_visual,
.p-mainVisual { display: none !important; }

/* 2. トップページ: サイドバー非表示 */
.top #sidebar,
.home #sidebar { display: none !important; }

/* 3. トップページ: メインコンテンツをフル幅に拡張 */
.top .l-mainContent,
.home .l-mainContent {
  max-width: 100% !important;
  width: 100% !important;
  flex: 1 1 100% !important;
}

/* 4. トップページ: アーティクル幅制限を解除 */
.top .l-article,
.home .l-article {
  max-width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* 5. ロゴ折り返し防止 */
.l-header__logo .c-headLogo__link,
.c-headLogo.-txt .c-headLogo__link {
  white-space: nowrap;
}

/* 6. スマホ横スクロールナビ非表示 */
.l-header__spNav { display: none !important; }

/* ============================================================
   v2.1 — FVリデザイン: スライダー非表示・記事グリッド追加 (2026-06-13)
   ============================================================ */

/* フロントページのSWELLポストスライダーを非表示 */
.home #post_slider { display: none !important; }

/* 記事カードグリッドのホバー効果 */
.pts-article-card { transition: box-shadow .2s, transform .2s; }
.pts-article-card:hover { box-shadow: 0 6px 20px rgba(0,0,0,.15) !important; transform: translateY(-2px); }

/* 記事グリッド: スマホで2カラムに */
@media (max-width: 640px) {
  .pts-article-card { font-size: 0; }
  .post_content > div > a.pts-article-card { display: block; }
}

/* 記事グリッド: スマホで2カラムに (v2) */
@media (max-width: 640px) {
  .post_content [style*="repeat(3, 1fr)"] {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
