/* ============================================
   AQ Partners - Effects Stylesheet
   ============================================ */

/* ============================================
   1. カーソル — 完全リセット（cursor:none を一切使わない）
   ============================================ */
.cursor, .cursor-follower { display: none !important; }

/* デフォルトカーソルを全要素に明示的に戻す */
* { cursor: auto; }
a, button, [role="button"], label,
input[type="submit"], input[type="button"],
input[type="checkbox"], input[type="radio"],
select, .btn, .hamburger, .nav-link,
.service-card, .client-card, .page-top {
  cursor: pointer;
}
input[type="text"], input[type="email"],
input[type="tel"], textarea, select {
  cursor: text;
}


/* ============================================
   2. TEXT SPLIT — section-title
   ============================================ */
.char-split {
  display: inline-block;
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.5s cubic-bezier(0.4, 0, 0.2, 1),
              transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}
.char-visible {
  opacity: 1;
  transform: translateY(0);
}
.section-title { overflow: visible !important; }


/* ============================================
   2b. hero-title フェードイン（JSで制御）
   ============================================ */
/* hero-title と hero-row のレイアウトは style.css で管理 */


/* ============================================
   3. STATS SECTION
   ============================================ */
.stats {
  padding: 80px 0;
  background: var(--dark-bg, #0b2540);
  border-top: 1px solid rgba(255,255,255,0.06);
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.stats-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
}
.stat-item {
  text-align: center;
  padding: 40px 20px;
  border-right: 1px solid rgba(255,255,255,0.08);
  position: relative;
}
.stat-item:last-child { border-right: none; }
.stat-item::after {
  content: '';
  position: absolute;
  bottom: 0; left: 50%;
  width: 0; height: 2px;
  background: linear-gradient(90deg, var(--primary-light, #1557b0), var(--accent, #4aa3e8));
  transform: translateX(-50%);
  transition: width 0.7s cubic-bezier(0.4, 0, 0.2, 1);
}
.stat-item.visible::after { width: 56px; }
.stat-num {
  font-family: 'Inter', sans-serif;
  font-size: clamp(2.6rem, 4.5vw, 4rem);
  font-weight: 700;
  color: #fff;
  line-height: 1;
  letter-spacing: -0.02em;
}
.stat-unit {
  font-family: 'Inter', sans-serif;
  font-size: clamp(1.3rem, 2vw, 1.8rem);
  font-weight: 600;
  color: var(--accent, #4aa3e8);
  vertical-align: super;
  margin-left: 2px;
}
.stat-label {
  font-size: 0.75rem;
  color: rgba(255,255,255,0.5);
  margin-top: 14px;
  letter-spacing: 0.04em;
  line-height: 1.5;
}
@media (max-width: 640px) {
  .stats-grid { grid-template-columns: repeat(2, 1fr); }
  .stat-item {
    padding: 32px 12px;
    border-bottom: 1px solid rgba(255,255,255,0.08);
  }
  .stat-item:nth-child(2n) { border-right: none; }
  .stat-item:nth-child(3),
  .stat-item:nth-child(4) { border-bottom: none; }
}


/* ============================================
   4. HEADER THEME SWITCH
   ============================================ */
.header {
  transition: background 0.4s ease, box-shadow 0.4s ease !important;
}
.header[data-theme="light"] .logo-en {
  color: var(--text-dark, #0d1b2e) !important;
}
.header[data-theme="light"] .nav-link:not(.nav-cta) {
  color: var(--text-dark, #0d1b2e) !important;
}
.header[data-theme="light"] .hamburger span {
  background: var(--text-dark, #0d1b2e) !important;
}
.header[data-theme="light"].scrolled {
  background: rgba(255,255,255,0.96) !important;
  box-shadow: 0 2px 20px rgba(0,0,0,0.08) !important;
}
.header[data-theme="light"] .nav-link:not(.nav-cta):hover {
  background: rgba(0,0,0,0.05) !important;
  color: var(--primary, #0a3d7c) !important;
}
.header[data-theme="dark"] .logo-en { color: #fff !important; }
.header[data-theme="dark"] .nav-link:not(.nav-cta) {
  color: rgba(255,255,255,0.85) !important;
}
.header[data-theme="dark"] .hamburger span { background: #fff !important; }

/* ナビパネルが開いているときはテーマに関わらずリンク色を白で保護 */
.nav.open .nav-link:not(.nav-cta) {
  color: rgba(255, 255, 255, 0.9) !important;
}
.nav.open .nav-link:not(.nav-cta):hover {
  background: rgba(255, 255, 255, 0.08) !important;
  color: #fff !important;
}
/* SP版ナビ開時：下線アニメーション・ホバーエフェクトを最低限に抑制 */
@media (max-width: 768px) {
  .nav.open .nav-link:not(.nav-cta)::after {
    display: none !important;
  }
  .nav.open .nav-link:not(.nav-cta):hover::after,
  .nav.open .nav-link:not(.nav-cta).active-nav::after {
    display: none !important;
  }
}


/* ============================================
   5. SERVICE CARD REVEAL
   ============================================ */
.service-card {
  overflow: hidden;
  position: relative;
}
.service-reveal {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  opacity: 0;
  transform: scale(1.06);
  transition: opacity 0.5s cubic-bezier(0.4, 0, 0.2, 1),
              transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  pointer-events: none;
  z-index: 0;
}
.service-reveal::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(6,18,36,0.75);
}
.service-reveal.reveal-in {
  opacity: 1;
  transform: scale(1);
}
.service-card > *:not(.service-reveal) {
  position: relative;
  z-index: 1;
}


/* ============================================
   6. NAV LINK underline
   ============================================ */
.nav-link:not(.nav-cta) { position: relative; }
.nav-link:not(.nav-cta)::after {
  content: '';
  position: absolute;
  bottom: 2px; left: 14px; right: 14px;
  height: 1px;
  background: var(--accent, #4aa3e8);
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.nav-link:not(.nav-cta):hover::after,
.nav-link:not(.nav-cta).active-nav::after {
  transform: scaleX(1);
  transform-origin: left;
}


/* ============================================
   7. FEATURE ITEM hover glow
   ============================================ */
.feature-item {
  position: relative;
  overflow: hidden;
}
.feature-item::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg,
    rgba(21,87,176,0.06), rgba(74,163,232,0.06));
  opacity: 0;
  border-radius: inherit;
  transition: opacity 0.4s ease;
  pointer-events: none;
}
.feature-item:hover::before { opacity: 1; }