::-webkit-scrollbar {
    width: 8px;
}
::-webkit-scrollbar-track {
    background: #f1f5f9;
}
::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
    background: #94a3b8;
}
.pattern-grid {
    background-image: radial-gradient(#e2e8f0 1.5px, transparent 1.5px);
    background-size: 24px 24px;
}

/* 固定ヘッダー分のオフセット。アンカーリンクの見出しがヘッダーの下に隠れないようにする */
html {
    scroll-padding-top: 6rem;
}

/* なめらかなスクロール（js/smooth-scroll.js の Lenis）の動作中に必要な指定。
   Lenis が動いていないとき（読み込み失敗・視差効果を減らす設定）は、どれも適用されない */
html.lenis,
html.lenis body {
    height: auto;
}
.lenis.lenis-smooth {
    scroll-behavior: auto !important; /* html の scroll-smooth と二重に動かないようにする */
}
.lenis.lenis-smooth [data-lenis-prevent] {
    overscroll-behavior: contain;
}
.lenis.lenis-stopped {
    overflow: hidden;
}
/* スクロールの途中で地図（iframe）がホイール操作を奪わないようにする。止まっているときは地図を操作できる */
.lenis.lenis-scrolling iframe {
    pointer-events: none;
}

/* 日本語の文節単位の改行（line-break.js がBudouXの適用に成功した要素にのみ付与する）。
   BudouXが挿入した文節の境界以外では改行しない。長い語が枠からはみ出しそうな場合のみ、
   例外的に任意の位置で折り返す。 */
.jp-phrase {
    word-break: keep-all;
    overflow-wrap: anywhere;
}

/* BudouXが語の途中で区切ってしまう箇所の補正用。囲んだ語の中では改行しない */
.jp-nobr {
    white-space: nowrap;
}

/* 見出しは各行の長さを均等にし、最終行に1〜2文字だけ残る状態を防ぐ */
h1, h2, h3, h4 {
    text-wrap: balance;
}

/* ヘッダー可変トランジション */
header {
    transition: height 0.3s ease, background-color 0.3s ease, box-shadow 0.3s ease;
}
header .header-inner {
    transition: height 0.3s ease;
}
header.scrolled {
    height: 4.5rem !important;
    background-color: rgba(255, 255, 255, 0.95) !important;
    box-shadow: 0 4px 20px -2px rgba(10, 29, 55, 0.08);
}
header.scrolled .header-inner {
    height: 4.5rem;
}