@charset "UTF-8";
/**
 * 背景の英字（トップの各セクション）
 *
 * デジハリ STUDIO静岡（shizuoka-motion.css）の「背景の流れる英字」を移植。
 * わかったブログは白黒基調なので、オレンジを墨と白に置き換えている。
 * JS（wk-bgtext.js）が body に .wk-bgtext-on を付けたときだけ効く。
 * 外すときは wk-bgtext.css / .js の読み込みを止めるだけ。
 */

.wk-bgtext-on .wk-section { position: relative; isolation: isolate; overflow-x: clip; }
.wk-bgtext-on .wk-section > .wk-inner { position: relative; z-index: 1; }

.wk .wk-bgtext {
  position: absolute;
  left: 0;
  right: 0;
  top: clamp(12px, 3vw, 40px);
  z-index: 0;
  overflow: hidden;
  white-space: nowrap;
  line-height: 1;
  pointer-events: none;
  user-select: none;
}
.wk .wk-bgtext__track { display: inline-flex; will-change: transform; }
.wk .wk-bgtext__word {
  padding-right: 0.3em;
  color: transparent;
  font-family: var(--wk-font-en);
  font-size: clamp(80px, 14vw, 200px);
  font-weight: 700;
  letter-spacing: -0.01em;
  text-transform: uppercase;
  -webkit-text-stroke: 1.5px rgba(10, 10, 10, 0.13);
}
.wk .wk-bgtext__word:nth-child(even) { color: rgba(10, 10, 10, 0.045); -webkit-text-stroke: 0; }
.wk .wk-dark .wk-bgtext__word { -webkit-text-stroke-color: rgba(255, 255, 255, 0.16); }
.wk .wk-dark .wk-bgtext__word:nth-child(even) { color: rgba(255, 255, 255, 0.05); }

/* rise：1字ずつせり上がり、スクロールで上下にゆっくり動く */
.wk .wk-bgtext--rise { padding: 0 var(--wk-gutter); will-change: transform; }
.wk .wk-bgtext--right { text-align: right; }
.wk .wk-bgtext--rise .wk-bgtext__word { display: inline-flex; overflow: hidden; padding-right: 0; }
.wk .wk-bgtext__char { display: inline-block; translate: 0 105%; transition: translate 1.1s var(--wk-ease); }
.wk .wk-bgtext.is-in .wk-bgtext__char { translate: 0 0; }

/* vertical：縦書きで上下に流れる */
.wk .wk-bgtext--vertical { top: 0; bottom: 0; left: auto; right: clamp(0px, 2vw, 32px); }
.wk .wk-bgtext--vertical.wk-bgtext--left { left: clamp(0px, 2vw, 32px); right: auto; }
.wk .wk-bgtext--vertical .wk-bgtext__track { flex-direction: column; }
.wk .wk-bgtext--vertical .wk-bgtext__word { padding: 0 0 0.3em; font-size: clamp(60px, 9vw, 150px); writing-mode: vertical-rl; }

/* zoom：スクロールに合わせて拡大・傾き */
.wk .wk-bgtext--zoom { overflow: visible; text-align: center; }
.wk .wk-bgtext--zoom .wk-bgtext__word { display: inline-block; padding-right: 0; will-change: transform, opacity; }

@media (prefers-reduced-motion: reduce) {
  .wk .wk-bgtext__char { translate: none; transition: none; }
}