* {margin:0; padding:0; box-sizing:border-box; font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;}
body {background:#f4f7fa; color:#333;}
header {display:flex; justify-content:space-between; align-items:center; padding:1rem 3rem; background:#264653; color:white; flex-wrap:wrap;}
header .logo {font-size:1.5rem; font-weight:bold;}
header nav a {color:white; margin:0 0.5rem; text-decoration:none;}
header nav .btn {margin-left:1rem; padding:0.5rem 1rem; border-radius:8px; background:#2a9d8f; color:white; transition:0.3s;}
header nav .btn:hover {background:#1e6560;}

/* Hero Section */
.hero {display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; padding:3rem;}
.hero-content {flex:1; min-width:300px;}
.hero-content h1 {font-size:2.5rem; margin-bottom:1rem;}
.hero-content p {font-size:1.2rem; margin-bottom:1.5rem;}
.hero-buttons .btn {margin-right:1rem; padding:0.75rem 1.5rem; border-radius:8px; text-decoration:none;}
.hero-image {flex:1; min-width:300px;}
.chart-placeholder {background:#e9c46a; height:300px; display:flex; align-items:center; justify-content:center; font-weight:bold; border-radius:12px; color:#264653;}

/* Features */
.features {padding:3rem;}
.features h2 {text-align:center; margin-bottom:2rem;}
.feature-cards {display:flex; flex-wrap:wrap; gap:2rem; justify-content:center;}
.feature-card {flex:1 1 250px; background:#fff; padding:1.5rem; border-radius:12px; text-align:center; box-shadow:0 5px 15px rgba(0,0,0,0.05);}
.feature-card h4 {margin-bottom:0.5rem; color:#2a9d8f;}

/* Pricing */
.pricing {padding:3rem; background:#f0f4f8;}
.pricing h2 {text-align:center; margin-bottom:2rem;}
.pricing-cards {display:flex; flex-wrap:wrap; gap:2rem; justify-content:center;}
.pricing-card {flex:1 1 250px; background:white; padding:2rem; border-radius:12px; text-align:center; box-shadow:0 5px 15px rgba(0,0,0,0.05);}
.pricing-card h3 {margin-bottom:0.5rem;}
.pricing-card .price {font-size:2rem; color:#2a9d8f; margin-bottom:1rem;}
.pricing-card ul {list-style:none; padding-left:0; margin-bottom:1rem;}
.pricing-card ul li {padding:0.5rem 0; border-bottom:1px solid #eee;}
.pricing-card ul li:last-child {border-bottom:none;}

/* Demo */
.demo {padding:3rem;}
.demo h2 {text-align:center; margin-bottom:2rem;}
.demo-charts {display:flex; flex-wrap:wrap; gap:1rem; justify-content:center;}
.demo-charts .chart-placeholder {flex:1 1 300px; height:250px; background:#264653; color:white; border-radius:12px; display:flex; align-items:center; justify-content:center; font-weight:bold;}

/* Testimonials */
.testimonials {padding:3rem; background:#f0f4f8;}
.testimonials h2 {text-align:center; margin-bottom:2rem;}
.testimonial-cards {display:flex; flex-wrap:wrap; gap:1rem; justify-content:center;}
.testimonial-card {flex:1 1 250px; background:white; padding:1.5rem; border-radius:12px; box-shadow:0 5px 15px rgba(0,0,0,0.05); text-align:center;}
.testimonial-card p {margin-bottom:0.5rem; font-style:italic;}
.testimonial-card span {font-weight:bold; color:#2a9d8f;}

/* Footer */
footer {background:#264653; color:white; padding:2rem; text-align:center;}
footer .social-icons a {margin:0 0.5rem; color:white; text-decoration:none; font-size:1.2rem;}

/* Buttons */
.btn.primary {background:#2a9d8f; color:white; padding:0.75rem 1.5rem; border-radius:8px; text-decoration:none; display:inline-block; transition:0.3s;}
.btn.primary:hover {background:#1e6560;}
.btn.secondary {background:#e9c46a; color:#264653; padding:0.75rem 1.5rem; border-radius:8px; text-decoration:none; display:inline-block; transition:0.3s;}
.btn.secondary:hover {background:#d4a017;}

/* Responsive */
@media(max-width:1000px){
    .hero {flex-direction:column; text-align:center;}
    .feature-cards, .pricing-cards, .demo-charts, .testimonial-cards {flex-direction:column; align-items:center;}
}
