/* =========================================================
   NS Mega Menu – CORE (structure only)
   レイアウト / 挙動 / フル幅 / グリッド / 等高 だけを担当
   色・余白・影・フォントサイズ等の"見た目"は一切ここに書かない
   ========================================================= */

/* ベース構造 */
.nsmm { position: relative; width: 100%; }
.nsmm ul { margin: 0; padding: 0; list-style: none; }
.nsmm li { position: relative; }

/* トップレベルの並びとクリック対象 */
.nsmm .nsmm-root > .nsmm-top { display: inline-block; position: static; }
.nsmm .nsmm-top > .nsmm-link { display: inline-flex; align-items: center; gap: .5rem; }

/* 開閉（hover / focus）: 表示のON/OFFはCOREで担保 */
.nsmm .nsmm-top:hover > .nsmm-mega,
.nsmm .nsmm-top:focus-within > .nsmm-mega,
.nsmm .nsmm-top:hover > .nsmm-sub,
.nsmm .nsmm-top:focus-within > .nsmm-sub {
  display: block; opacity: 1; pointer-events: auto;
}

/* 小さなドロップダウン（通常サブメニュー）— 位置と非表示だけCORE */
.nsmm .nsmm-sub {
  position: absolute; top: 100%; left: 0;
  min-width: 220px;
  display: none; opacity: 0; pointer-events: none;
  z-index: 50;
}
.nsmm .nsmm-sub > li > .nsmm-link { display: block; }

/* メガ（背景はフル幅）— 位置とはみ出し制御はCORE */
.nsmm .nsmm-mega {
  position: absolute; top: 100%;
  left: calc(-1 * ((100vw - 100%) / 2));
  right: auto; width: 100vw;
  display: none; opacity: 0; pointer-events: none;
  z-index: 1000;
}

/* メガ内側の最大幅 — .nsmm-mega-inner はPHPで出力済み */
.nsmm { --nsmm-inner: 1280px; }  /* navに nsmm-inner-1200/1440 で切替可能 */
.nsmm.nsmm-inner-1200 { --nsmm-inner: 1200px; }
.nsmm.nsmm-inner-1280 { --nsmm-inner: 1280px; }
.nsmm.nsmm-inner-1440 { --nsmm-inner: 1440px; }

.nsmm .nsmm-mega .nsmm-mega-inner {
  max-width: var(--nsmm-inner);
  margin: 0 auto;
}

/* メガ内のグリッド（行ごとの等高） */
.nsmm .nsmm-mega .nsmm-mega-list {
  display: grid;
  gap: 0;                /* 余白はTHEME側で与える */
  align-items: stretch;  /* 行内で等高 */
}

/* 列数（等幅デフォルト） */
.nsmm .nsmm-mega-grid[data-cols="2"] .nsmm-mega-list { grid-template-columns: repeat(2, minmax(0,1fr)); }
.nsmm .nsmm-mega-grid[data-cols="3"] .nsmm-mega-list { grid-template-columns: repeat(3, minmax(0,1fr)); }
.nsmm .nsmm-mega-grid[data-cols="4"] .nsmm-mega-list { grid-template-columns: repeat(4, minmax(0,1fr)); }
.nsmm .nsmm-mega-grid[data-cols="5"] .nsmm-mega-list { grid-template-columns: repeat(5, minmax(0,1fr)); }
.nsmm .nsmm-mega-grid[data-cols="6"] .nsmm-mega-list { grid-template-columns: repeat(6, minmax(0,1fr)); }

/* “cat” レイアウト（列配分だけ定義。装飾はTHEMEへ） */
.nsmm.nsmm-cat .nsmm-mega-grid[data-cols="4"] .nsmm-mega-list { grid-template-columns: 2fr 1fr 1fr 1fr; }
.nsmm.nsmm-cat .nsmm-mega-grid[data-cols="5"] .nsmm-mega-list { grid-template-columns: 2fr 1fr 1fr 1fr 1fr; }
.nsmm.nsmm-cat .nsmm-mega-grid[data-cols="6"] .nsmm-mega-list { grid-template-columns: 3fr 1fr 1fr 1fr 1fr 1fr; }

/* カードの箱の等高用（中身はTHEME） */
.nsmm .nsmm-grid-item > .nsmm-link { display: flex; flex-direction: column; height: 100%; }

/* ヒーロー：左上1マス（装飾はTHEMEへ） */
.nsmm .nsmm-grid-item.nsmm-hero { grid-column: span 1; grid-row: span 1; }
.nsmm.nsmm-cat .nsmm-grid-item.nsmm-hero { order: -1; }

/* ヒーロー画像のON/OFF（DOM制御のみ） */
.nsmm .nsmm-grid-item.nsmm-hero .nsmm-thumbwrap { display: none; }
.nsmm .nsmm-grid-item.nsmm-hero.nsmm-hero-img .nsmm-thumbwrap { display: block; }

/* ワイド型（テキストリスト）の構造のみ */
.nsmm .nsmm-mega-wide .nsmm-mega-list { column-gap: 0; } /* gapはTHEMEへ */
.nsmm .nsmm-wide-item { break-inside: avoid; }
.nsmm .nsmm-wide-item > .nsmm-link { display: block; }

/* スマホ（構造のみ） */
@media (max-width: 980px){
  .nsmm .nsmm-top { display: block; }
  .nsmm .nsmm-top > .nsmm-link { width: 100%; }

  .nsmm .nsmm-mega, .nsmm .nsmm-sub {
    position: static; width: auto; left: auto; right: auto;
    display: none; opacity: 1; pointer-events: auto;
  }
  .nsmm .nsmm-top.nsmm-open > .nsmm-mega,
  .nsmm .nsmm-top.nsmm-open > .nsmm-sub { display: block; }

  .nsmm .nsmm-mega .nsmm-mega-inner { width: 100%; }
  .nsmm .nsmm-mega .nsmm-mega-list { grid-template-columns: 1fr 1fr !important; }
  .nsmm .nsmm-grid-item.nsmm-hero { grid-column: 1 / -1; grid-row: auto; }
}

/* はみ出し対策（構造扱い） */
.site-header .wp-block-group, header .wp-block-group { overflow: visible; }
