/* 海洋背景のグラデーション */
.ocean-bg {
  background: linear-gradient(
    to bottom,
    #99CCFF 0%,
    #47A7FF 18%,
    #0053CC 38%,
    #000099 60%,
    #000066 78%,
    #7030A0 100%
  );
  position: relative;
}

/* 泡レイヤー */
.ocean-bubbles{
  position: fixed;
  inset:0;
  z-index:0;
  pointer-events:none;
}

/* 泡1個分 */
.ocean-bubble{
  position:absolute;
  bottom:-12%;
  border-radius:9999px;
  opacity: var(--op, .38);
  border: 2px solid rgba(255,255,255,.95);
  box-shadow:
    0 0 0 4px rgba(255,255,255,.16),
    0 0 18px rgba(255,255,255,.35);
  mix-blend-mode: screen;
  animation:bubbleUp var(--dur, 14s) linear infinite;
  animation-delay: var(--delay, 0s);
}

/* 上昇＋少し横揺れ */
@keyframes bubbleUp{
  0%   { transform: translateY(0) translateX(0); opacity:0; }
  12%  { opacity: var(--op, .38); }
  100% { transform: translateY(-125vh) translateX(14px); opacity:0; }
}

.center-fade{
  opacity: 0;
  transform: translateY(10px);
  transition: opacity .5s ease, transform .5s ease;
  will-change: opacity, transform;
}

.feature-row{
  display: grid;
  gap: 2.5rem;
  align-items: center;
}

.feature-media{
  display: flex;
  justify-content: center;
}

.feature-text{
  max-width: 34rem;
}

.feature-orb{
  border-radius: 50%;
  overflow: hidden;
  position: relative;
  background: radial-gradient(circle at 35% 30%,
    rgba(255,255,255,.18),
    rgba(255,255,255,.08) 45%,
    rgba(0,0,0,0) 70%);
  box-shadow:
    0 0 0 10px rgba(255,255,255,.05),
    0 0 60px rgba(0,0,0,.35);
}

.orb-sm { width: 160px; height: 160px; }
.orb-lg { width: 200px; height: 200px; }

.feature-img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(var(--zoom, 1.10));
  transform-origin: center;
  object-position: var(--pos, 50% 50%);
}

@media (min-width: 768px){
  .feature-row{
    grid-template-columns: 5fr 7fr;
  }

  .feature-media{
    justify-content: flex-start;
    padding-left: 3rem;
  }

  .feature-media.md-right{
    justify-content: flex-end;
    padding-left: 0;
    padding-right: 3rem;
  }

  .orb-sm { width: 200px; height: 200px; }
  .orb-lg { width: 260px; height: 260px; }
}

.shinkai-page > *:not(.ocean-bubbles){
  position: relative;
  z-index: 1;
}

/* タイトル文字 */
.hero-title{
  color:#ffffff;
  letter-spacing: .06em;
  text-shadow:
    2px 0 0 rgba(0, 48, 140, .95),
    -2px 0 0 rgba(0, 48, 140, .95),
    0 2px 0 rgba(0, 48, 140, .95),
    0 -2px 0 rgba(0, 48, 140, .95),
    2px 2px 0 rgba(0, 48, 140, .85),
    -2px 2px 0 rgba(0, 48, 140, .85),
    2px -2px 0 rgba(0, 48, 140, .85),
    -2px -2px 0 rgba(0, 48, 140, .85),
    0 10px 25px rgba(0,0,0,.18);
}

/* 深海ページのFAQ文字色だけ調整 */
.shinkai-page #faq-question {
  color: #ffffff;
}

.shinkai-page #faq-answer {
  color: rgba(255,255,255,0.85);
}

.shinkai-page header{
  background: rgba(255,255,255,.92) !important;
  backdrop-filter: blur(10px);
}

.shinkai-page #breadcrumb-wrap{
  padding-top: 0 !important;
}

.shinkai-page #breadcrumb{
  background: rgba(255,255,255,.70) !important;
  border-color: rgba(125, 211, 252, .35) !important;
}

.shinkai-page #contact-cta {
  display: none;
}