@charset "UTF-8";
/* 事務長AI ── 動き（CEO 2026-09-05）
   style.css とは別にして、デザインの作り直しとぶつからないようにしている。 */

/* ---------- 1. スクロールの進み具合を上に細く出す ---------- */
.ja-progress{
  position:fixed; top:0; left:0; height:3px; width:0;
  background:linear-gradient(90deg,#22d3ee,#3b82f6 55%,#7c6cf3);
  z-index:9999; pointer-events:none;
  transition:width .08s linear;
}

/* ---------- 2. ヒーローに漂う粒 ---------- */
.ja-hero .ja-orbs{ position:absolute; inset:0; overflow:hidden; z-index:-1; pointer-events:none; }
.ja-hero .ja-orbs i{
  position:absolute; display:block; border-radius:50%;
  background:radial-gradient(circle at 30% 30%, rgba(255,255,255,.9), rgba(34,211,238,.25) 45%, transparent 70%);
  opacity:.34; animation:ja-float linear infinite;
}
@keyframes ja-float{
  0%   { transform:translate3d(0,14vh,0) scale(.7); opacity:0; }
  12%  { opacity:.42; }
  88%  { opacity:.34; }
  100% { transform:translate3d(0,-22vh,0) scale(1.15); opacity:0; }
}

/* ---------- 3. ボタンに光が流れる ---------- */
.ja-btn .wp-block-button__link{ position:relative; overflow:hidden; }
.ja-btn .wp-block-button__link::after{
  content:""; position:absolute; top:0; left:-60%; width:45%; height:100%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.5),transparent);
  transform:skewX(-18deg);
  animation:ja-sheen 3.6s ease-in-out infinite;
}
@keyframes ja-sheen{
  0%,58% { left:-60%; }
  84%,100%{ left:130%; }
}

/* ---------- 4. カードにマウスの光が付いてくる ---------- */
.ja-cards .wp-block-column{ position:relative; overflow:hidden; }
.ja-cards .wp-block-column::before{
  content:""; position:absolute; inset:0; pointer-events:none; opacity:0;
  background:radial-gradient(220px circle at var(--mx,50%) var(--my,50%), rgba(34,211,238,.16), transparent 62%);
  transition:opacity .3s ease;
}
.ja-cards .wp-block-column:hover::before{ opacity:1; }

/* ---------- 5. 「自動」側の項目が順に点く ---------- */
.ja-flow__after li{ position:relative; opacity:.5; transition:opacity .45s ease; }
.ja-flow.is-in .ja-flow__after li{ opacity:1; }
.ja-flow.is-in .ja-flow__after li:nth-child(1){ transition-delay:.10s; }
.ja-flow.is-in .ja-flow__after li:nth-child(2){ transition-delay:.25s; }
.ja-flow.is-in .ja-flow__after li:nth-child(3){ transition-delay:.40s; }
.ja-flow.is-in .ja-flow__after li:nth-child(4){ transition-delay:.55s; }
.ja-flow.is-in .ja-flow__after li:nth-child(5){ transition-delay:.70s; }
.ja-flow.is-in .ja-flow__after li:nth-child(6){ transition-delay:.85s; }
.ja-flow__after li::marker{ color:#22d3ee; }

/* ---------- 6. 3つの事実が、順に浮かぶ ---------- */
.ja-facts .ja-fact{ transition:transform .3s ease, border-color .3s ease, background .3s ease; }
.ja-facts .ja-fact:hover{
  transform:translateY(-4px);
  border-color:rgba(34,211,238,.5);
  background:rgba(255,255,255,.11);
}

/* ---------- 7. 動きを減らす設定の人には出さない ---------- */
@media (prefers-reduced-motion:reduce){
  .ja-hero .ja-orbs{ display:none; }
  .ja-btn .wp-block-button__link::after{ animation:none; display:none; }
  .ja-progress{ display:none; }
  .ja-flow__after li{ opacity:1; }
}