/* =============================================================
   ナビゲーションUI変更 追加カスタムCSS — ROSUDO_MAINTE-132
   ① PC : グローバルナビ常時表示（ホームのヘッダー隠し挙動を解除）
   ② KV : 丸ロゴ(.p-homeKv__logo)を非表示（ヘッダー常時表示で重複するため）
   ③ SP : ヘッダーは横版ロゴ中央・ハンバーガー廃止
   ④ SP : 下部固定ボトムナビ（.l-bottomNav）
   ※ SCSS ソースはリポジトリ外のため、style.css のビルド上書きを避けて別ファイルで追加。
     将来 src/scss 側へ取り込んでよい。
   ============================================================= */

/* ── ① ホームでもヘッダー（グロナビ）を常時表示 ──────────────
   既存: .p-home .l-header{top:-56px/-96px} でスクロールまで隠れる挙動を解除 */
.p-home .l-header {
  top: 0;
}

/* ── ⑥ トップページ：ヘッダー背景を透明化し MV にロゴを乗せる（SP限定）──
   SP(≤1279px) のみ、ホームのヘッダー背景・下線を透過にして、中央ロゴが MV に
   直接乗るデザインにする。SP はヘッダーが absolute（⑤）で MV と一緒に流れ、
   グロナビ（.l-navigation）は非表示のためロゴのみが MV に乗る。
   PC(≥1280px) は従来どおり cream 背景のヘッダーを常時表示（グロナビの視認性維持）。 */
@media screen and (max-width: 1279px) {
  .p-home .l-header {
    background-color: transparent;
    border-bottom: none;
    box-shadow: none;
  }
}

/* ── ② KV 丸ロゴを削除（②）
   h1 要素は SEO 維持のため視覚的にのみ隠す（display:none にしない） ── */
.p-homeKv__logo {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  border: 0 !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  overflow: hidden !important;
  white-space: nowrap !important;
}

/* ── ③ SP ヘッダー：横版ロゴ中央 + ハンバーガー廃止 ────────── */
@media screen and (max-width: 1279px) {
  /* ⑤ SP はヘッダー追従なし（スクロールで一緒に流れる）。
     既存 .l-header{position:fixed} を SP のみ absolute 化して固定解除。
     見た目はページ先頭時と同一（cream 背景で KV 上部に重なる）で、
     スクロールすると通常フローと一緒に上へ流れる。PC(≥1280)は fixed のまま＝常時表示。 */
  .l-header {
    position: absolute;
    top: 0;
    left: 0;
    /* ⑦ 高さも成り行きに。既存 height:56px 固定だと拡大ロゴ(45px)＋
       .l-header__container(成り行き71px) がヘッダー帯からはみ出て、
       非ホームの cream 帯・下線がロゴに食い込んで見えていた不具合を解消。 */
    height: auto;
  }

  /* ⑦ ヘッダーを成り行き高さにしたぶん、非ホームのコンテンツ上部オフセットも
     ヘッダー高さ(=ロゴ55px＋上下padding13px=81px)へ合わせる。
     ホームは .p-home .l-main{padding-top:0} が優先され MV フルブリードのまま。 */
  .l-main {
    padding-top: 81px;
  }

  /* ハンバーガー廃止（main.js が #js-hamburger を参照するため DOM は残し CSS で非表示） */
  .l-header__hamburger {
    display: none !important;
  }

  /* SP ドロワー(.l-navigation)はトリガー無しで開かないが、念のため非表示に固定 */
  .l-header__inner {
    display: none !important;
  }

  /* ロゴを中央配置（既存は position:absolute; z-index:-1 で KV 裏に隠れていた） */
  .l-header__container {
    display: flex;
    align-items: center;
    justify-content: center;
    height: auto; /* 既存 height:100%(=56px固定) を解除し、中身（ロゴ+padding）成り行きに */
  }
  .l-header__logo {
    position: static;
    z-index: auto;
    width: auto;
    height: 55px; /* SPロゴ拡大: 30px→45px(1.5倍)→さらに+10px */
    margin: 0;
  }
  .l-header__logo img {
    width: auto;
    height: 100%;
  }
  /* ホームではヘッダーのロゴを白抜きにしていた指定があっても、常時表示のため通常表示に */
  .p-home .l-header__hamburgerLine {
    background-color: #231815;
  }
}

/* ── ④ SP ボトムナビ ─────────────────────────────────────── */
.l-bottomNav {
  position: fixed;
  left: 0;
  bottom: 0;
  z-index: 9998;
  width: 100%;
  background: #fff9f1;
  border-top: 1px solid #f4e1b3;
  padding-bottom: env(safe-area-inset-bottom); /* iOS ホームバー対応 */
}

.l-bottomNav__list {
  display: flex;
}

.l-bottomNav__item {
  flex: 1 1 0;
  min-width: 0;
}

.l-bottomNav__link {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 11px 2px 9px; /* 従来 8px/7px から縦を+5px（ボトムナビを少し高く） */
  color: #603813;
  text-decoration: none;
}

.l-bottomNav__link:active {
  opacity: 0.6;
}

.l-bottomNav__icon {
  width: 24px;
  height: 24px;
  object-fit: contain;
  display: block;
}

.l-bottomNav__label {
  font-size: 10px;
  line-height: 1;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: #603813;
  white-space: nowrap;
}

/* PC（≥1280px）ではボトムナビ非表示（トップのグロナビが常時表示のため） */
@media screen and (min-width: 1280px) {
  .l-bottomNav {
    display: none;
  }
}

/* ボトムナビ分の下部余白（フッター等がバーに隠れないように） */
@media screen and (max-width: 1279px) {
  .l-footer {
    padding-bottom: 69px; /* ボトムナビ +5px 化に合わせクリアランス追従 */
  }
}