/* =============================================================
   M-RAISING トップページ リニューアル（ヴィンテージ・プレイビル）
   フェーズ1: 配色・タイポ・ジャンルバッジ(くすみ)・カード・検索
   スコープ: body.home のみ（他ページに影響させない）
   ============================================================= */

:root{
  --mr-paper:#F3E9CF;
  --mr-paper-2:#F8F1DD;
  --mr-ink:#16233B;
  --mr-ink-soft:#2A3855;
  --mr-cobalt:#2C5AA6;
  --mr-cobalt-deep:#1E3F79;
  --mr-gold:#E4B23C;
  --mr-gold-deep:#C08F27;
  --mr-line:rgba(22,35,59,.22);
  --mr-disp:"Anton","Haettenschweiler","Impact","Arial Narrow Bold",sans-serif;
  --mr-mono:"DejaVu Sans Mono","Consolas","Courier New",monospace;
}

/* ---------- ページ地色・紙の質感 ---------- */
body.home{
  background:var(--mr-paper);
  background-image:
    radial-gradient(rgba(22,35,59,.035) 1px, transparent 1px),
    radial-gradient(rgba(22,35,59,.02) 1px, transparent 1px);
  background-size:4px 4px, 7px 7px;
  background-position:0 0, 2px 3px;
  color:var(--mr-ink);
}
body.home .site-content,
body.home .content-area{background:transparent}

/* ---------- 見出し（セクションタイトル）ポスター調 ---------- */
body.home .site-content h2.wp-block-heading{
  font-weight:800;letter-spacing:.03em;color:var(--mr-ink);
  position:relative;text-align:left;
  padding-bottom:14px;margin-bottom:28px;
  border-bottom:3px solid var(--mr-ink);
}
/* テーマ既定の黄色アクセント線（中央固定）は非表示。下線で代替 */
body.home .site-content h2.wp-block-heading::before{display:none!important}
/* 英字カブリの見出しは次フェーズで data-en を付与して有効化 */

/* ---------- ジャンル（スタンプ調バッジ + くすみ） ---------- */
body.home .hp-listing-categories.hp-grid{gap:14px}

body.home .hp-listing-category--view-block{
  background:var(--mr-paper-2);
  border:2px solid var(--mr-ink);
  padding:16px 12px;
  border-radius:0;
  height:auto!important;      /* 既存の160px固定を解除しグリッドで揃える */
  overflow:visible!important;
  transition:.15s;
}
body.home .hp-listing-category--view-block:hover{
  transform:translate(-3px,-3px);
  box-shadow:6px 6px 0 var(--mr-cobalt);
}

/* バッジ円（画像の外枠を型押しのコインに） */
body.home .hp-listing-category__image{
  width:64px;height:64px;margin:0 auto 4px;
  border:2px solid var(--mr-ink);border-radius:50%;
  background:var(--mr-paper);
  display:flex;align-items:center;justify-content:center;overflow:hidden;
  box-shadow:inset 0 2px 4px rgba(22,35,59,.22), inset 0 -2px 3px rgba(255,255,255,.85);
}
body.home .hp-listing-category__image a{display:flex;align-items:center;justify-content:center;width:100%;height:100%}
/* アイコン画像＝ヴィンテージくすみ */
body.home .hp-listing-category__image img{
  width:46px;height:46px;object-fit:contain;
  image-rendering:auto!important;   /* テーマの crisp-edges を解除（縮小時のドット崩れ防止） */
  filter:saturate(.5) sepia(.22) contrast(.93) brightness(1.03) drop-shadow(0 1px 1px rgba(22,35,59,.28));
}

/* ヘッダーの件数（円の右上バッジ）は非表示にして下のバッジに寄せる */
body.home .hp-listing-category__item-count.hp-listing-category__count{display:none}

body.home .hp-listing-category__content{text-align:center;margin-top:6px;background:transparent}
body.home .hp-listing-category__name{font-weight:800;font-size:15px;line-height:1.3;margin:0}
body.home .hp-listing-category__name a{color:var(--mr-ink)}
body.home .hp-listing-category__name a:hover{color:var(--mr-cobalt)}

/* 既存JSが生成する件数バッジをヴィンテージ調に */
body.home .category-count-badge{
  display:inline-block;margin-top:8px;
  font-family:var(--mr-mono);font-weight:700;font-size:12px;letter-spacing:.06em;
  color:var(--mr-ink-soft);background:transparent;border:0;padding:0;
}
body.home .category-count-badge::before{content:"◆ ";color:var(--mr-gold)}

/* ---------- 新着リスティング カード（ポスター額装） ---------- */
body.home .hp-listings .hp-listing{
  background:var(--mr-paper-2);
  border:2px solid var(--mr-ink);
  border-radius:0;
  overflow:hidden;transition:.15s;
}
body.home .hp-listings .hp-listing:hover{
  transform:translate(-3px,-3px);
  box-shadow:6px 6px 0 var(--mr-ink);
}
body.home .hp-listing__image{border-bottom:2px solid var(--mr-ink);border-radius:0}
body.home .hp-listing__title a{color:var(--mr-ink);font-weight:800}
body.home .hp-listing__title a:hover{color:var(--mr-cobalt)}

/* ---------- 検索フォーム（チケット/クーポン調） ---------- */
body.home .hp-form--listing-search{
  background:var(--mr-paper);
  border:2px dashed var(--mr-ink);
  padding:8px;border-radius:0;
}
body.home .hp-form--listing-search .hp-field--search{
  background:transparent;border:0;font-weight:700;color:var(--mr-ink);
}
body.home .hp-form--listing-search .hp-field--search::placeholder{
  color:rgba(22,35,59,.4)!important;font-weight:400!important;
}
body.home .hp-form--listing-search .button-primary,
body.home .hp-form__button.button-primary{
  background:var(--mr-cobalt);border:2px solid var(--mr-cobalt-deep);color:var(--mr-paper);
  font-family:var(--mr-disp);text-transform:uppercase;letter-spacing:.08em;border-radius:0;
}
body.home .hp-form--listing-search .button-primary:hover{background:var(--mr-cobalt-deep)}

/* ---------- ポスター・ヒーロー（イラスト額装 + ビリング帯） ---------- */
/* カバー背景を解除して紙地に */
body.home .mr-hero.header-hero{
  background:var(--mr-paper)!important;background-image:none!important;
  min-height:0!important;padding:34px 0 22px!important;display:block!important;
}
body.home .mr-hero .header-hero__content{
  position:static!important;padding:0!important;background:transparent!important;display:block!important;
}
body.home .mr-hero.header-hero::before,
body.home .mr-hero.header-hero::after,
body.home .mr-hero .header-hero__content::before,
body.home .mr-hero .header-hero__content::after{display:none!important} /* 暗幕(35%黒スクリム)除去 */

/* ヒーロー直下の検索フォーム：重なり解除・枠幅に整列 */
body.home .page__text .hp-form--primary{
  margin-top:28px!important;margin-bottom:8px!important;
  max-width:1040px;margin-left:auto;margin-right:auto;
}

/* ポスター枠（.container を額装カードに） */
body.home .mr-hero .container{
  max-width:1040px;margin:0 auto;padding:0!important;
  background:var(--mr-paper-2);
  border:3px solid var(--mr-ink);
  box-shadow:10px 10px 0 var(--mr-ink);
  overflow:hidden;
}
/* ビリング帯 */
body.home .mr-billing{
  background:var(--mr-ink);color:var(--mr-paper);
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:11px 22px;
  font-family:var(--mr-mono);font-size:12px;letter-spacing:.26em;text-transform:uppercase;line-height:1.2;
}
body.home .mr-billing__mid{color:var(--mr-gold);font-weight:700;letter-spacing:.2em;text-align:center}
body.home .mr-star{color:var(--mr-gold)}
/* イラスト */
body.home .mr-hero-illus{border-bottom:3px solid var(--mr-ink);background:#fff;line-height:0}
body.home .mr-hero-illus img{width:100%;height:auto;display:block}

/* サブビリング（SPORTS • MUSIC • ART • STUDY） */
body.home .mr-subbilling{
  display:flex;align-items:center;flex-wrap:wrap;gap:12px;
  font-family:var(--mr-disp);text-transform:uppercase;color:var(--mr-cobalt);
  font-size:clamp(20px,3vw,34px);letter-spacing:.05em;line-height:1;
  margin-top:22px;
}
body.home .mr-subbilling .mr-dot{color:var(--mr-gold)}

/* 額装内の見出し・サブ・検索にパディング（ビリング/イラスト以外の直下要素） */
body.home .mr-hero .container > *:not(.mr-billing):not(.mr-hero-illus){
  padding-left:30px;padding-right:30px;
}
body.home .mr-hero h1.wp-block-heading{
  color:var(--mr-ink)!important;text-align:left!important;
  font-weight:800;font-size:clamp(26px,4vw,44px);line-height:1.2;
  margin:24px 0 0;letter-spacing:.02em;
}
body.home .mr-hero .header-hero__content p{
  color:var(--mr-ink-soft)!important;text-align:left!important;font-size:16px;margin:8px 0 0;
}
body.home .mr-hero .hp-form--listing-search{margin:18px 0 28px}

/* レスポンシブ：ビリングをコンパクトに */
@media(max-width:640px){
  body.home .mr-billing{font-size:10px;letter-spacing:.12em;padding:9px 14px}
  body.home .mr-billing__mid{display:none}
  body.home .mr-hero .container > *:not(.mr-billing):not(.mr-hero-illus){padding-left:18px;padding-right:18px}
}

/* ---------- ボタン全般（角ゼロ＋押し影） ---------- */
body.home a.hp-button,
body.home button.button-primary,
body.home .hp-menu .button{
  border-radius:0;
}

/* ---------- レスポンシブ ---------- */
@media(max-width:960px){
  body.home .hp-listing-categories.hp-grid{grid-template-columns:repeat(3,1fr)!important}
}
@media(max-width:560px){
  body.home .hp-listing-categories.hp-grid{grid-template-columns:repeat(2,1fr)!important}
}

/* =============================================================
   フェーズ3: ヘッダー & 新着カードのジャンルタグ
   ============================================================= */

/* ---------- ヘッダー ---------- */
body.home .site-header{
  border-bottom:2px solid var(--mr-ink);
  background:var(--mr-paper);
}
/* ナビのテキストリンク（ボタン以外） */
body.home .header-navbar__menu a:not(.button){
  font-weight:700;color:var(--mr-ink);
  border-bottom:2px solid transparent;padding-bottom:2px;
}
body.home .header-navbar__menu a:not(.button):hover{
  border-color:var(--mr-gold);color:var(--mr-ink);
}
/* 「スクール情報を掲載」ボタン（緑 → コバルト角ゼロ＋押し影） */
body.home a.hp-menu__item--listing-submit,
body.home .hp-menu__item--listing-submit.button{
  background:var(--mr-cobalt)!important;color:var(--mr-paper)!important;
  border:2px solid var(--mr-cobalt-deep)!important;border-radius:0!important;
  font-weight:700;transition:.15s;
}
body.home a.hp-menu__item--listing-submit:hover,
body.home .hp-menu__item--listing-submit.button:hover{
  background:var(--mr-cobalt-deep)!important;
  transform:translate(-2px,-2px);box-shadow:4px 4px 0 var(--mr-ink)!important;
}
/* ロゴ */
body.home .header-logo .site-title,
body.home .header-logo a{letter-spacing:.02em}

/* ---------- 新着カードのジャンルタグ（グレー丸 → 刷り物調の角タグ） ---------- */
/* 囲み(.hp-listing__categories / .hp-listing__category)は枠なしに戻す */
body.home .hp-listing__categories,
body.home .hp-listing__category{
  background:transparent!important;border:0!important;padding:0!important;
}
/* カテゴリーラベル＝枠なしのテキストのみ（等幅の小ラベル） */
body.home .hp-listing__category a{
  display:inline-block;
  background:transparent!important;color:var(--mr-cobalt)!important;
  border:0!important;border-radius:0!important;padding:0!important;
  font-family:var(--mr-mono);font-weight:700;font-size:11px;letter-spacing:.06em;line-height:1.2;
}
body.home .hp-listing__category a:hover{color:var(--mr-cobalt-deep)!important;text-decoration:underline}

/* =============================================================
   フェーズ4: ティッカー / 体験3ステップ / 掲載CTA
   ============================================================= */

/* 全幅セクションでも横スクロールを出さない */
body.home{overflow-x:clip}

/* ---------- 最上部ティッカー（マーキー） ---------- */
body.home .mr-ticker{
  flex:0 0 auto;width:100%;              /* body が flex のため潰れ防止 */
  background:var(--mr-ink);color:var(--mr-paper);
  border-bottom:2px solid var(--mr-gold);
  overflow:hidden;white-space:nowrap;
}
body.home .mr-ticker__track{display:flex;width:max-content;will-change:transform;animation:mr-slide 34s linear infinite}
body.home .mr-ticker__track > span{        /* 直下のメッセージspanのみ（入れ子の★は除外） */
  flex:none;display:block;padding:9px 0;white-space:nowrap;
  font-family:var(--mr-mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;
}
body.home .mr-ticker .mr-star{color:var(--mr-gold)}
@keyframes mr-slide{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){body.home .mr-ticker__track{animation:none}}

/* ---------- 共通: セクション見出し / キッカー ---------- */
body.home .mr-kicker{
  display:block;font-family:var(--mr-mono);font-size:12px;letter-spacing:.28em;
  text-transform:uppercase;font-weight:700;margin-bottom:6px;
}
body.home .mr-h2{font-weight:800;font-size:clamp(24px,3vw,32px);letter-spacing:.03em;margin:0}

/* ---------- 体験3ステップ（濃紺・全幅） ---------- */
body.home .mr-steps{
  width:100vw;margin-left:calc(50% - 50vw);
  background:var(--mr-ink);color:var(--mr-paper);
  padding:58px 0;margin-top:56px;
  border-top:3px solid var(--mr-ink);
}
body.home .mr-steps__inner{max-width:1160px;margin:0 auto;padding:0 24px}
body.home .mr-steps .mr-sec-head{border-bottom:3px solid var(--mr-gold);padding-bottom:14px;margin-bottom:30px}
body.home .mr-steps .mr-kicker{color:var(--mr-gold)}
body.home .mr-steps .mr-h2{color:var(--mr-paper)}
body.home .mr-steps__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
body.home .mr-step{border:1px solid rgba(243,233,207,.28);padding:26px 24px}
body.home .mr-step__no{font-family:var(--mr-disp);font-size:56px;line-height:.85;color:var(--mr-gold);margin-bottom:12px}
body.home .mr-step__title{font-size:20px;font-weight:800;margin:0 0 8px;color:var(--mr-paper)}
body.home .mr-step__text{font-size:14px;color:rgba(243,233,207,.78);margin:0;line-height:1.7}

/* ---------- 掲載CTA（コバルト・全幅） ---------- */
body.home .mr-cta{
  position:relative;overflow:hidden;
  width:100vw;margin-left:calc(50% - 50vw);
  background:var(--mr-cobalt);color:var(--mr-paper);
  border-top:3px solid var(--mr-ink);border-bottom:3px solid var(--mr-ink);
}
body.home .mr-cta__stripe{
  position:absolute;inset:0;pointer-events:none;opacity:.12;
  background:repeating-linear-gradient(45deg,var(--mr-paper) 0 14px,transparent 14px 34px);
}
body.home .mr-cta__inner{
  position:relative;max-width:1160px;margin:0 auto;padding:48px 24px;
  display:flex;align-items:center;justify-content:space-between;gap:26px;flex-wrap:wrap;
}
body.home .mr-cta .mr-kicker{color:var(--mr-gold)}
body.home .mr-cta .mr-h2{color:var(--mr-paper);margin:6px 0 4px}
body.home .mr-cta__text p{margin:0;color:rgba(243,233,207,.85);font-size:15px}
body.home .mr-cta__btn{
  display:inline-flex;align-items:center;gap:8px;
  background:var(--mr-gold);color:var(--mr-ink);
  border:2px solid var(--mr-gold-deep);border-radius:0;
  font-weight:800;font-size:16px;padding:14px 26px;transition:.15s;white-space:nowrap;
}
body.home .mr-cta__btn:hover{transform:translate(-2px,-2px);box-shadow:4px 4px 0 var(--mr-ink);color:var(--mr-ink)}

@media(max-width:760px){
  body.home .mr-steps__grid{grid-template-columns:1fr}
  body.home .mr-cta__inner{flex-direction:column;align-items:flex-start}
}

/* 縮小表示される画像の crisp-edges を解除（高品質スケーリング） */
body.home .mr-hero-illus img{image-rendering:auto!important}

/* =============================================================
   フェーズ5(仕上げ): フッター / 検索クーポン / ピン色 / Anton
   ============================================================= */

/* ---------- フッター ---------- */
body.home .site-footer{
  border-top:3px solid var(--mr-ink);
  background:var(--mr-paper);
  margin-top:56px;
}
body.home .site-footer .widget__title{
  font-family:var(--mr-mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--mr-cobalt);font-weight:700;
}
body.home .site-footer a{color:var(--mr-ink)}
body.home .site-footer a:hover{color:var(--mr-cobalt)}
body.home .footer-navbar{border-top:2px solid var(--mr-line);margin-top:24px;padding-top:16px}
body.home .footer-navbar__menu a{font-family:var(--mr-mono);font-size:12px;letter-spacing:.06em}
body.home .footer-navbar__copyright{font-family:var(--mr-mono);font-size:12px;color:var(--mr-ink-soft)}

/* ---------- 検索クーポン：左右のミシン目切り込み ---------- */
body.home .page__text .hp-form--listing-search{position:relative;overflow:visible}
body.home .page__text .hp-form--listing-search::before,
body.home .page__text .hp-form--listing-search::after{
  content:"";position:absolute;top:50%;transform:translateY(-50%);
  width:20px;height:20px;border-radius:50%;
  background:var(--mr-paper);border:2px solid var(--mr-ink);
  z-index:2;
}
body.home .page__text .hp-form--listing-search::before{left:-11px}
body.home .page__text .hp-form--listing-search::after{right:-11px}
/* 「KEYWORD」ラベルを左上に小さく */
body.home .page__text .hp-form--listing-search .hp-field--search{padding-top:6px}

/* ---------- 新着カード：ロケーションピンの色（緑→コバルト） ---------- */
body.home .hp-listing .hp-icon.fa-map-marker-alt{color:var(--mr-cobalt)!important}
body.home .hp-listing .hp-icon.fa-comment{color:rgba(22,35,59,.3)!important}

/* ---------- Anton をラテン表示に適用 ---------- */
/* ビリングのラテン両サイド */
body.home .mr-billing__side{font-family:var(--mr-disp);letter-spacing:.1em;font-size:14px;font-weight:400}
/* セクションのキッカー（3 STEPS / FOR SCHOOLS） */
body.home .mr-kicker{font-family:var(--mr-disp);letter-spacing:.14em;font-size:15px;font-weight:400}
