/* Landing page styles and animations */
body { font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial; }
.hero-section { background: linear-gradient(180deg, #fff7ed 0%, #ffffff 100%); }
.hero-section h2 { animation: fadeInUp .8s ease both; color: #d9480f; }
.hero-section .lead { animation: fadeInUp 1s ease both; animation-delay: .1s; font-size: 1.05rem; }
.hero-section .btn { transition: transform .2s ease, box-shadow .2s ease; }
.hero-section .btn-primary { background: linear-gradient(135deg, #fb7013, #f97316); border: none; }
.hero-section .btn-primary:hover { transform: translateY(-2px); box-shadow: 0 16px 36px rgba(251, 112, 19, 0.28); }
.hero-section .btn-outline-secondary { border-color: #f97316; color: #f97316; }
.hero-section .btn-outline-secondary:hover { background: rgba(249, 115, 22, 0.08); transform: translateY(-1px); }
.carousel-card, .feature-card, .benefit-card, .figure-card { animation: fadeInUp .8s ease both; }
.feature-card:hover, .benefit-card:hover { transform: translateY(-6px); transition: transform .3s ease; }
.figure-img { background: #ffffff; border: 1px solid #e9ecef; padding: 8px; transition: transform .3s ease, box-shadow .3s ease; }
.figure-img:hover { transform: translateY(-6px); box-shadow: 0 24px 48px rgba(15, 23, 42, 0.12); }
.cta-banner { background: linear-gradient(135deg, #f97316 0%, #fb923c 100%); color: #fff; }
.cta-banner h4, .cta-banner p, .cta-banner li { animation: fadeInUp .8s ease both; }
.hero-card { position: relative; overflow: hidden; }
.hero-card::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at top right, rgba(255,255,255,.18), transparent 42%); pointer-events: none; }
.hero-card .feature-card, .hero-card .benefit-card { background: rgba(255,255,255,0.9); }
.feature-card, .benefit-card { transition: transform .3s ease, box-shadow .3s ease; }
.feature-card:hover, .benefit-card:hover { transform: translateY(-8px); box-shadow: 0 24px 40px rgba(15, 23, 42, 0.1); }
.small, .figure-caption, .text-muted { font-size: .95rem !important; }
.section-text, .card-text, .list-unstyled li { font-size: .98rem; }
@keyframes fadeInUp { 0% { opacity: 0; transform: translateY(20px); } 100% { opacity: 1; transform: translateY(0); } }
@media (max-width: 767px) {
  .hero-section { padding-top: 2rem; padding-bottom: 2rem; }
  .hero-section h2 { font-size: 2rem; }
}
