@charset "UTF-8";
/* =========================================================
   星空の背景（starfield.js とセット）
   data-starfield を付けた要素の背景に、瞬く星を敷き詰める
   ========================================================= */

[data-starfield] { position: relative; isolation: isolate; }
.starfield {
  position: absolute; inset: 0; z-index: -1; overflow: hidden; pointer-events: none;
}
.starfield__star {
  position: absolute; border-radius: 50%;
  background: var(--star-color, #fff);
  box-shadow: 0 0 calc(var(--star-size) * 2) var(--star-color, #fff);
  width: var(--star-size); height: var(--star-size);
  animation: starfield-twinkle var(--star-duration, 3s) ease-in-out var(--star-delay, 0s) infinite;
}
/* 明るい星：光芒（十字の光）を付ける */
.starfield__star--bright::before,
.starfield__star--bright::after {
  content: ""; position: absolute; left: 50%; top: 50%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.85), transparent);
  width: calc(var(--star-size) * 9); height: 1px; transform: translate(-50%, -50%);
}
.starfield__star--bright::after { transform: translate(-50%, -50%) rotate(90deg); }

@keyframes starfield-twinkle {
  0%, 100% { opacity: var(--star-max, 1); }
  50% { opacity: .25; }
}
/* 画面外では点滅を止めて負荷を下げる */
.starfield.is-paused .starfield__star { animation-play-state: paused; }

/* ---------- solution__body：構成図のエリア ----------
   四辺をぼかして、枠の形が見えないようにする */
.solution__body > .starfield {
  inset: -60px -80px;
  -webkit-mask-image: radial-gradient(ellipse 70% 70% at 50% 50%, #000 55%, transparent 100%);
          mask-image: radial-gradient(ellipse 70% 70% at 50% 50%, #000 55%, transparent 100%);
}
.solution__body .feature { position: relative; }

/* ---------- cv：画像背景をやめ、澄んだ夜空に ---------- */
.cv {
  background:
    radial-gradient(ellipse 60% 55% at 50% 0%, rgba(0, 159, 185, .22) 0%, rgba(0, 159, 185, 0) 70%),
    linear-gradient(180deg, #06142a 0%, #030a18 55%, #030710 100%);
}
.cv::before { content: none; }

@media (max-width: 767px) {
  .solution__body > .starfield { inset: -40px -12px; }
}

@media (prefers-reduced-motion: reduce) {
  .starfield__star { animation-duration: 6s; }
}
