/* Phrase Foundry – Shared Landing Page Styles – v1.0 */

.landing-shell { max-width: 850px; margin: 0 auto; font-size: 1rem; }

.hero { text-align: center; margin: 3rem 0; }
.hero-icon { width: 70px; height: 70px; }
.hero h1 { font-size: 2.2rem; margin: 1rem 0; }
.hero .subhead { font-size: 1.1rem; color: #444; }
.btn-main {
  background: linear-gradient(135deg, #c9e4ff, #b1d2ff);
  border: none;
  border-radius: 10px;
  padding: 0.8rem 1.4rem;
  font-weight: 600;
  text-decoration: none;
  color: #000;
  transition: opacity 0.2s ease;
}
.btn-main:hover { opacity: 0.85; }

.value, .bonuses, .proof, .cta { margin: 2.5rem 0; line-height: 1.7; }
.bonuses { background: #fafafa; padding: 2rem; border-radius: 1rem; }
.bonuses ul, .value ul { padding-left: 1.2rem; }
.center { text-align: center; margin-top: 1rem; }

.demo-img { width: 100%; border-radius: 0.8rem; margin-top: 1rem; }

.cta { text-align: center; }
.cta h2 { margin-bottom: 1rem; }
.fine { color: #666; font-size: 0.9rem; }

.user-guide { margin: 1.5rem 0 2.5rem; text-align: center; }
.user-guide a {
  font-size: 0.9rem;
  display: inline-block;
  color: #000;
  text-decoration: none;
}
.user-guide a:hover { text-decoration: underline; }

@media (max-width: 600px) {
  .hero h1 { font-size: 1.7rem; }
}