@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&family=Noto+Sans+SC:wght@400;500;700;900&display=swap');

:root {
  --rose: #e11d48;
  --rose-light: #fb7185;
  --charcoal-950: #0c0a0b;
  --charcoal-900: #141112;
  --charcoal-800: #1c181a;
  --gradient-rose: linear-gradient(135deg, #f43f5e 0%, #e11d48 100%);
  --gradient-love: linear-gradient(135deg, #ec4899 0%, #f43f5e 100%);
}

html { scroll-behavior: smooth; }
body { font-family: 'Inter','Noto Sans SC',-apple-system,BlinkMacSystemFont,sans-serif; background: var(--charcoal-950); color: #e5e7eb; overflow-x: hidden; }
::-webkit-scrollbar { width: 7px; }
::-webkit-scrollbar-track { background: var(--charcoal-950); }
::-webkit-scrollbar-thumb { background: var(--rose); border-radius: 4px; }

.nav-link { position: relative; color: #9ca3af; font-weight: 500; font-size: .875rem; transition: color .3s; text-decoration: none; }
.nav-link:hover { color: #fff; }
.nav-link::after { content:''; position:absolute; bottom:-4px; left:50%; transform:translateX(-50%) scaleX(0); width:100%; height:2px; background:var(--gradient-rose); transition:transform .3s; border-radius:2px; }
.nav-link:hover::after { transform:translateX(-50%) scaleX(1); }
.navbar-scrolled { background: rgba(12,10,11,0.96) !important; backdrop-filter: blur(20px); box-shadow: 0 4px 30px rgba(0,0,0,0.6); }

.btn-rose { display:inline-flex; align-items:center; gap:.5rem; padding:.875rem 2rem; font-weight:600; border-radius:50px; background:var(--gradient-rose); color:#fff; transition:all .3s; text-decoration:none; }
.btn-rose:hover { transform:translateY(-2px); box-shadow:0 10px 40px rgba(225,29,72,0.4); }
.btn-outline-rose { display:inline-flex; align-items:center; gap:.5rem; padding:.875rem 2rem; font-weight:600; border-radius:50px; border:2px solid rgba(244,63,94,0.4); color:#fb7185; transition:all .3s; text-decoration:none; }
.btn-outline-rose:hover { border-color:#f43f5e; background:rgba(244,63,94,0.15); transform:translateY(-2px); }

.card-hover { transition:all .4s cubic-bezier(.25,.8,.25,1); }
.card-hover:hover { transform:translateY(-8px); box-shadow:0 20px 60px rgba(225,29,72,0.15); }
.feature-icon-rose { width:60px; height:60px; display:flex; align-items:center; justify-content:center; border-radius:16px; font-size:26px; background:var(--gradient-rose); margin:0 auto 1.5rem; transition:transform .4s, box-shadow .4s; }
.card-hover:hover .feature-icon-rose { transform:scale(1.1); box-shadow:0 10px 40px rgba(244,63,94,0.4); }

.stat-number { font-size:2.75rem; font-weight:900; background:var(--gradient-rose); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; line-height:1.2; }

.testimonial-card { background:var(--charcoal-800); border:1px solid rgba(255,255,255,0.06); border-radius:20px; padding:2rem; position:relative; transition:all .4s; }
.testimonial-card:hover { transform:translateY(-6px); box-shadow:0 20px 60px rgba(0,0,0,0.5); }
.testimonial-card::before { content:'\201C'; position:absolute; top:8px; left:18px; font-size:4.5rem; font-weight:900; line-height:1; color:var(--rose); opacity:0.1; font-family:serif; }

.faq-item { border:1px solid rgba(255,255,255,0.06); border-radius:12px; overflow:hidden; margin-bottom:12px; background:var(--charcoal-800); transition:all .3s; }
.faq-item.active { border-color:var(--rose); box-shadow:0 0 30px rgba(225,29,72,0.1); }
.faq-question { width:100%; padding:1.25rem 1.5rem; display:flex; justify-content:space-between; align-items:center; font-weight:600; font-size:1.05rem; text-align:left; cursor:pointer; background:none; border:none; color:inherit; transition:color .3s; }
.faq-question:hover { color:var(--rose-light); }
.faq-icon { font-size:1.25rem; transition:transform .4s; flex-shrink:0; margin-left:1rem; }
.faq-item.active .faq-icon { transform:rotate(180deg); color:var(--rose); }
.faq-answer { max-height:0; overflow:hidden; transition:max-height .4s, padding .4s; }
.faq-item.active .faq-answer { max-height:300px; }
.faq-answer-inner { padding:0 1.5rem 1.25rem; color:#94a3b8; line-height:1.7; }

.footer-link { color:#94a3b8; text-decoration:none; transition:color .3s; }
.footer-link:hover { color:var(--rose-light); }

.mobile-menu { position:fixed; top:0; right:-100%; width:300px; height:100vh; background:var(--charcoal-900); z-index:1000; padding:5rem 2rem 2rem; transition:right .4s cubic-bezier(.4,0,.2,1); border-left:1px solid rgba(255,255,255,0.06); }
.mobile-menu.open { right:0; }
.mobile-overlay { position:fixed; inset:0; background:rgba(0,0,0,0.6); z-index:999; opacity:0; pointer-events:none; transition:opacity .3s; }
.mobile-overlay.open { opacity:1; pointer-events:auto; }

.animate-on-scroll { opacity:0; transform:translateY(30px); transition:opacity .7s, transform .7s; }
.animate-on-scroll.visible { opacity:1; transform:translateY(0); }

@media (max-width:768px) { .stat-number { font-size:2.25rem; } }