/* 復縁占いラボ 共通スタイル */
:root { --ease: cubic-bezier(.22,.61,.36,1); }

html { scroll-behavior: smooth; }
body {
  background:
    radial-gradient(1200px 600px at 80% -10%, #EFEAF7 0%, rgba(239,234,247,0) 55%),
    radial-gradient(900px 500px at -10% 10%, #F7E5EC 0%, rgba(247,229,236,0) 50%),
    #FBF7F4;
  color: #4A3F4E;
  -webkit-font-smoothing: antialiased;
}

/* やさしい星空の点 */
.starfield::before {
  content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .5;
  background-image:
    radial-gradient(1.5px 1.5px at 20% 30%, rgba(201,162,75,.6) 50%, transparent),
    radial-gradient(1.5px 1.5px at 70% 20%, rgba(124,107,168,.5) 50%, transparent),
    radial-gradient(1px 1px at 40% 70%, rgba(196,93,124,.5) 50%, transparent),
    radial-gradient(1.5px 1.5px at 85% 60%, rgba(201,162,75,.5) 50%, transparent),
    radial-gradient(1px 1px at 15% 80%, rgba(124,107,168,.5) 50%, transparent);
  background-repeat: no-repeat;
}

.glass {
  background: rgba(255,255,255,.72);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(185,167,214,.28);
}

.cta-grad {
  background: linear-gradient(135deg, #E8A0BF 0%, #C45D7C 55%, #7C6BA8 120%);
}
.cta-grad:hover { filter: brightness(1.04); }

.gold-line {
  background: linear-gradient(90deg, transparent, #C9A24B, transparent);
  height: 1px;
}

/* 診断 選択カード */
.opt-card { transition: transform .18s var(--ease), box-shadow .18s var(--ease), border-color .18s var(--ease); }
.opt-card:active { transform: scale(.98); }
.opt-card.selected {
  border-color: #C45D7C;
  box-shadow: 0 0 0 2px rgba(196,93,124,.25), 0 10px 30px -10px rgba(196,93,124,.4);
}

/* プログレスバー */
.progress-fill { transition: width .4s var(--ease); }

/* リッチテキスト(記事) */
.prose-jp h2 { font-family: "Noto Serif JP", serif; font-weight: 700; font-size: 1.5rem; margin: 2rem 0 .9rem; color:#7A2E40; }
.prose-jp h3 { font-weight: 700; font-size: 1.15rem; margin: 1.6rem 0 .6rem; color:#7C6BA8; }
.prose-jp p  { line-height: 2; margin: .9rem 0; }
.prose-jp ul { margin: .8rem 0 .8rem 1.1rem; list-style: disc; }
.prose-jp li { line-height: 1.9; margin:.3rem 0; }

/* スマホ下部固定CTAぶんの余白 */
body.has-sticky-cta { padding-bottom: 76px; }
@media (min-width: 768px){ body.has-sticky-cta { padding-bottom: 0; } }