/**
 * 下層ページ（achievement / service / company / contact / privacy）｜トップに合わせた最小の演出（2026-10-19）
 * - 読み込み：金の線（トップと同じ）。仮ロゴ「P」の読み込み画面は使わない
 * - 見出しの下に金（パーシスト）と青（お客様）の2本線＝トップの「寄り添う2本の光」のモチーフ
 * - 停止・reduced-motion・JS無効・依存欠落時は静的表示（本文を必ず見せる）
 * 下層は「読む」ページなので、大きな演出は入れない
 */

/* ===== 静的表示（html に pm-motion が無い時）：既存 style.css の opacity:0 を解除 ===== */
html:not(.pm-motion) .reveal-element,
html:not(.pm-motion) .reveal-split > *,
html:not(.pm-motion) .reveal-split-words .word {
  opacity: 1 !important;
  transform: none !important;
}
html:not(.pm-motion) *,
html:not(.pm-motion) *::before,
html:not(.pm-motion) *::after {
  animation: none !important;
  transition: none !important;
}
/* 停止時はホバーの移動・拡大も止める（Codex検査 10-19 の指摘：写真が1秒かけて拡大していた） */
html:not(.pm-motion) .nav-contact:hover,
html:not(.pm-motion) .nav-contact:hover svg,
html:not(.pm-motion) .btn:hover .btn-icon,
html:not(.pm-motion) .btn-white:hover,
html:not(.pm-motion) .btn-arrow:hover .btn-arrow-icon svg,
html:not(.pm-motion) .about-image:hover img,
html:not(.pm-motion) .services-showcase-grid .service-card:hover,
html:not(.pm-motion) .service-link:hover svg,
html:not(.pm-motion) .team-card:hover .team-card-image img,
html:not(.pm-motion) .footer-back-top:hover svg,
html:not(.pm-motion) .result-card:hover,
html:not(.pm-motion) .case-study-image:hover img,
html:not(.pm-motion) .message-image-main:hover img,
html:not(.pm-motion) .service-detail-image:hover img,
html:not(.pm-motion) .pricing-card:hover {
  transform: none !important;
}
/* 停止時は装飾カーソルを出さない（既存CSSのままだと左上に残る） */
html:not(.pm-motion) .cursor { display: none !important; }
html:not(.pm-motion) { scroll-behavior: auto; }
/* Lenis 稼働中はブラウザのなめらかスクロールを切る（競合でホイールの反応が遅れるため） */
html.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-stopped { overflow: hidden; }

/* ===== 停止ボタン ===== */
.pm-toggle {
  position: fixed;
  left: 16px;
  bottom: 16px;
  z-index: 1001;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 0 16px;
  border: 1px solid rgba(201, 169, 98, 0.5);
  border-radius: 9999px;
  background: rgba(10, 22, 40, 0.72);
  color: #e5d4a1;
  font-family: var(--font-accent);
  font-size: 11px;
  letter-spacing: 0.12em;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.pm-toggle-dot { width: 6px; height: 6px; border-radius: 50%; background: currentColor; opacity: 0.4; }
html.pm-motion .pm-toggle-dot { opacity: 1; }
.pm-toggle:focus-visible { outline: 2px solid #c9a962; outline-offset: 3px; }
.pm-toggle[aria-disabled="true"] { opacity: 0.6; cursor: default; }

/* ===== 読み込み：金の線（演出ON時のみ） ===== */
.pm-loader { display: none; }
html.pm-motion .pm-loader {
  display: block;
  position: fixed;
  inset: 0;
  z-index: 10000;
  background: #0a1628;
}
html.pm-motion .pm-loader-line {
  position: absolute;
  left: 8%;
  width: 84%;
  top: 50%;
  height: 1px;
  background: linear-gradient(90deg, rgba(201,169,98,0) 0%, #c9a962 18%, #e5d4a1 82%, rgba(229,212,161,0) 100%);
  transform: scaleX(0);
  transform-origin: left center;
  box-shadow: 0 0 12px rgba(201, 169, 98, 0.6);
}
html.pm-motion.pm-loaded .pm-loader { pointer-events: none; }

/* ===== 見出しの下の2本線（金＝パーシスト・青＝お客様） ===== */
.achievement-hero-title::after,
.service-hero-title::after,
.company-hero-title::after,
.contact-hero-title::after,
.privacy-hero-title::after {
  content: "";
  display: block;
  width: clamp(120px, 18vw, 220px);
  height: 8px;
  margin-top: 24px;
  background:
    linear-gradient(90deg, #c9a962, #e5d4a1) 0 0 / 100% 2px no-repeat,
    linear-gradient(90deg, #4a7dd4, #8fb0ea) 0 6px / 82% 2px no-repeat;
  filter: drop-shadow(0 0 6px rgba(201, 169, 98, 0.35));
  transform-origin: left center;
}
/* 中央寄せの見出しでは線も中央に */
[class$="-hero-title"][style*="center"]::after { margin-left: auto; margin-right: auto; }
html.pm-motion.pm-loaded .achievement-hero-title::after,
html.pm-motion.pm-loaded .service-hero-title::after,
html.pm-motion.pm-loaded .company-hero-title::after,
html.pm-motion.pm-loaded .contact-hero-title::after,
html.pm-motion.pm-loaded .privacy-hero-title::after {
  animation: pm-dl-grow 1.4s cubic-bezier(0.16, 1, 0.3, 1) 0.2s both;
}
@keyframes pm-dl-grow {
  from { transform: scaleX(0); opacity: 0; }
  to { transform: scaleX(1); opacity: 1; }
}

@media (max-width: 768px) {
  .pm-toggle { left: 12px; bottom: 12px; width: 44px; padding: 0; justify-content: center; }
  .pm-toggle-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .pm-toggle-dot { width: 8px; height: 8px; }
}

@media (prefers-reduced-motion: reduce) {
  .pm-loader { display: none !important; }
}