/* Spc innovation Inc. — custom styles (Tailwind CDN と併用) */
html { scroll-behavior: smooth; }
body { font-feature-settings: "palt"; }

/* ヘッダー */
#site-header.is-scrolled { box-shadow: 0 4px 20px rgba(15, 23, 42, .08); }
.nav-link { position: relative; color: #0F172A; transition: color .2s; }
.nav-link:hover, .nav-link.is-active { color: #2563EB; }
.nav-link.is-active::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -8px;
  height: 2px; background: #2563EB;
}

/* JP | EN トグル */
.lang-toggle { display: inline-flex; align-items: center; gap: .5rem; padding: .35rem .75rem; border: 1px solid #CBD5E1; border-radius: 9999px; }
.lang-toggle a { color: #64748B; transition: color .2s; }
.lang-toggle a:hover { color: #2563EB; }
.lang-toggle a.is-current { color: #0F172A; }

/* ヒーロー背景（グリッド＋グロー） */
.hero-grid {
  background-image:
    radial-gradient(ellipse at 80% 0%, rgba(37, 99, 235, .35), transparent 55%),
    linear-gradient(rgba(255, 255, 255, .05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, .05) 1px, transparent 1px);
  background-size: 100% 100%, 48px 48px, 48px 48px;
}

/* 図解アニメーション */
.route-line { stroke-dasharray: 6 8; animation: route-flow 1.6s linear infinite; }
@keyframes route-flow { to { stroke-dashoffset: -28; } }
.pulse { transform-box: fill-box; transform-origin: center; animation: pulse 2.2s ease-out infinite; }
@keyframes pulse { 0% { transform: scale(.6); opacity: .6; } 100% { transform: scale(2.2); opacity: 0; } }
.type-line { transform-box: fill-box; transform-origin: left; animation: type-in 2.8s ease-in-out infinite; }
@keyframes type-in { 0% { transform: scaleX(0); } 35%, 85% { transform: scaleX(1); } 100% { transform: scaleX(1); opacity: .4; } }
[data-reveal] .grow-bar, .is-visible .grow-bar { transform-box: fill-box; transform-origin: bottom; }
.is-visible .grow-bar { animation: grow-y 1.2s cubic-bezier(.2,.8,.2,1) both; }
@keyframes grow-y { from { transform: scaleY(0); } to { transform: scaleY(1); } }
.is-visible .grow-x { transform-box: fill-box; transform-origin: left; animation: grow-x 1.2s cubic-bezier(.2,.8,.2,1) both; }
@keyframes grow-x { from { transform: scaleX(0); } to { transform: scaleX(1); } }
.float-card { animation: float 6s ease-in-out infinite; }
@keyframes float { 50% { transform: translateY(-8px); } }
@media (prefers-reduced-motion: reduce) {
  .route-line, .pulse, .type-line, .float-card, .is-visible .grow-bar, .is-visible .grow-x { animation: none !important; }
}

/* スクロール表示アニメーション */
[data-reveal] { opacity: 0; transform: translateY(24px); transition: opacity .7s ease, transform .7s ease; }
[data-reveal].is-visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  [data-reveal] { opacity: 1; transform: none; transition: none; }
  html { scroll-behavior: auto; }
}

/* フォーム */
.form-label { display: block; font-size: .875rem; font-weight: 700; color: #0F172A; margin-bottom: .5rem; }
.form-control {
  width: 100%; border: 1px solid #CBD5E1; border-radius: .375rem; padding: .8rem 1rem;
  font-size: 1rem; background: #fff; color: #0F172A; transition: border-color .2s, box-shadow .2s;
}
.form-control:focus { outline: none; border-color: #2563EB; box-shadow: 0 0 0 3px rgba(37, 99, 235, .2); }
.form-control.is-autoselected { border-color: #2563EB; background: #EFF6FF; }
.req { display: inline-block; margin-left: .5rem; padding: .05rem .45rem; font-size: .7rem; border-radius: .25rem; background: #2563EB; color: #fff; vertical-align: middle; }
.opt { display: inline-block; margin-left: .5rem; padding: .05rem .45rem; font-size: .7rem; border-radius: .25rem; background: #E2E8F0; color: #475569; vertical-align: middle; }

/* Honeypot（人間には見せない） */
.hp-field { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

/* プライバシーポリシー本文 */
.policy h2 { font-size: 1.125rem; font-weight: 700; margin-top: 2.5rem; padding-left: .75rem; border-left: 4px solid #2563EB; }
.policy p, .policy li { margin-top: .75rem; line-height: 2; color: #334155; }
.policy ol { list-style: decimal; padding-left: 1.5rem; }
.policy ul { list-style: disc; padding-left: 1.5rem; }

/* 事業内容ドロップダウン */
.nav-dd-btn { background: none; border: 0; padding: 0; font: inherit; cursor: pointer; }
.nav-dd-panel {
  display: none; position: absolute; left: 50%; top: 100%; transform: translateX(-50%);
  margin-top: 14px; width: 300px; padding: 8px; background: #fff; border: 1px solid #E2E8F0;
  border-radius: 10px; box-shadow: 0 20px 40px rgba(15, 23, 42, .12); z-index: 60;
}
.nav-dd-panel::before { content: ""; position: absolute; left: 0; right: 0; top: -16px; height: 16px; }
.nav-dd:hover .nav-dd-panel, .nav-dd:focus-within .nav-dd-panel, .nav-dd.is-open .nav-dd-panel { display: block; }
.nav-dd-item { display: block; padding: 10px 12px; border-radius: 8px; color: #0F172A; }
.nav-dd-item:hover, .nav-dd-item:focus-visible { background: #EFF6FF; outline: none; }
.nav-dd-item.is-active { background: #2563EB; color: #fff; }
.nav-dd-item.is-active span { color: #fff !important; }