/* =========================
   common.css
   モバイル版ヘッダー表示のブレ防止・統一用
   ========================= */

/* iOS Safari 文字サイズ暴走防止 */
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

/* ヘッダー共通レイアウト */
header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 18px;
  flex-wrap: wrap;
}

/* 名前まわり */
.brand,
.brand .name {
  line-height: 1.15;
  white-space: nowrap;
}

/* ナビ */
nav {
  line-height: 1.6;
}

/* ===== モバイル専用 ===== */
@media (max-width: 520px) {

  header {
    position: relative;
    padding: 10px 12px;
  }

  /* 背景を統一して“ぶれ”を視覚的にも抑える */
  header::before {
    content: "";
    position: absolute;
    inset: 0;

    background: rgba(255, 255, 255, 0.4);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);

    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 14px;

    z-index: 0;
    pointer-events: none;
  }

  header * {
    position: relative;
    z-index: 1;
  }

}