body { background: radial-gradient(1200px 500px at 50% -160px, rgba(88,101,242,0.14), transparent 70%), var(--bg); }
.site-nav { display: flex; align-items: center; gap: 24px; padding: 18px 32px; max-width: 1100px; margin: 0 auto; }
.site-nav .brand { display: flex; align-items: center; gap: 10px; font-weight: 700; color: var(--text-strong); font-size: 16px; }
.brand-logo { width: 36px; height: 36px; border-radius: 50%; filter: drop-shadow(0 0 10px var(--neon-glow)); }
.site-nav nav { display: flex; gap: 18px; margin-left: 24px; flex: 1; flex-wrap: wrap; }
.site-nav nav a { color: var(--muted); font-size: 14px; font-weight: 500; }
.site-nav nav a:hover { color: var(--text-strong); text-decoration: none; }
.site-nav .actions { display: flex; gap: 10px; }
@media (max-width: 700px) { .site-nav { flex-wrap: wrap; padding: 16px; } .site-nav nav { order: 3; width: 100%; margin: 8px 0 0; } }

.hero { max-width: 780px; margin: 60px auto 40px; text-align: center; padding: 0 20px; }
.hero h1 { font-size: 40px; line-height: 1.15; color: var(--text-strong); margin: 0 0 16px; letter-spacing: -0.02em; }
.hero p { color: var(--muted); font-size: 17px; line-height: 1.55; margin: 0 0 28px; }
.hero .actions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
.hero .btn { padding: 12px 22px; font-size: 15px; }
.hero-visual { display: block; width: 100%; max-width: 980px; margin: 40px auto 0; border-radius: 18px; box-shadow: 0 20px 60px -20px rgba(0,0,0,.6), 0 0 60px -20px var(--neon-glow); border: 1px solid rgba(185,139,255,.2); }

.feature-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 18px; max-width: 1100px; margin: 40px auto; padding: 0 20px; }
.feature-card { padding: 22px; }
.feature-card .f-icon { width: 40px; height: 40px; border-radius: 10px; background: var(--accent-soft); color: #9ba6ff; display: grid; place-items: center; margin-bottom: 14px; }
.feature-card h3 { font-size: 15.5px; color: var(--text-strong); margin: 0 0 6px; }
.feature-card p { color: var(--muted); font-size: 13.5px; margin: 0; line-height: 1.5; }

.testimonial-card { display: flex; flex-direction: column; justify-content: space-between; }
.testimonial-content { color: var(--text); font-size: 14px; line-height: 1.55; margin: 0 0 16px; font-style: italic; }
.testimonial-author { display: flex; align-items: center; gap: 10px; }
.testimonial-author img { width: 36px; height: 36px; border-radius: 50%; object-fit: cover; flex-shrink: 0; }
.testimonial-author div { display: flex; flex-direction: column; line-height: 1.3; }
.testimonial-author strong { color: var(--text-strong); font-size: 13.5px; }
.testimonial-author span { color: var(--muted); font-size: 12px; }

.cta-band { text-align: center; padding: 60px 20px; max-width: 640px; margin: 0 auto; }
.cta-band h2 { font-size: 26px; color: var(--text-strong); margin: 0 0 12px; }
.cta-band p { color: var(--muted); margin: 0 0 24px; }
.cta-mascot { width: 120px; margin: 0 auto 16px; display: block; filter: drop-shadow(0 0 24px var(--neon-glow)); }

.site-footer { text-align: center; padding: 30px 20px 60px; color: var(--muted); font-size: 12.5px; }
.site-footer a { color: var(--muted); margin: 0 8px; }
.site-footer > div { margin-bottom: 6px; }

.hero-badge { display: inline-flex; align-items: center; gap: 6px; padding: 6px 14px; border-radius: 999px; background: var(--accent-soft); border: 1px solid rgba(185,139,255,.3); color: var(--neon); font-size: 12.5px; font-weight: 600; margin-bottom: 18px; }

.section-title { text-align: center; font-size: 26px; color: var(--text-strong); margin: 0 0 6px; }
.section-sub { text-align: center; color: var(--muted); margin: 0 0 30px; }
.how-section { max-width: 1100px; margin: 70px auto; padding: 0 20px; }
.how-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 18px; }
.how-step { text-align: center; padding: 10px; }
.how-num { width: 36px; height: 36px; margin: 0 auto 12px; border-radius: 50%; background: var(--accent-soft); color: var(--neon); display: grid; place-items: center; font-weight: 700; border: 1px solid rgba(185,139,255,.3); box-shadow: 0 0 16px -4px var(--neon-glow); }
.how-step h3 { font-size: 14.5px; color: var(--text-strong); margin: 0 0 6px; }
.how-step p { color: var(--muted); font-size: 13px; margin: 0; line-height: 1.5; }

.assistant-card { border-color: rgba(185,139,255,.18); text-align: center; }
.assistant-avatar { width: 84px; height: 84px; border-radius: 50%; margin: 0 auto 14px; display: block; filter: drop-shadow(0 0 16px var(--neon-glow)); }

.pricing-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 20px; max-width: 800px; margin: 40px auto; padding: 0 20px; }
.pricing-card { padding: 30px 26px; text-align: left; }
.pricing-card h3 { font-size: 18px; color: var(--text-strong); margin: 0 0 4px; }
.pricing-card .price { font-size: 32px; font-weight: 700; color: var(--text-strong); margin: 6px 0 18px; }
.pricing-card ul { list-style: none; padding: 0; margin: 0 0 22px; display: flex; flex-direction: column; gap: 10px; }
.pricing-card li { color: var(--text); font-size: 13.5px; padding-left: 22px; position: relative; }
.pricing-card li::before { content: '✓'; position: absolute; left: 0; color: var(--neon); font-weight: 700; }
.pricing-card--premium { border-color: rgba(185,139,255,.35); box-shadow: 0 0 40px -12px var(--neon-glow); }

.legal-content { max-width: 720px; margin: 50px auto; padding: 0 24px 60px; }
.legal-content h1 { font-size: 26px; color: var(--text-strong); }
.legal-content h2 { font-size: 16.5px; color: var(--text-strong); margin-top: 32px; }
.legal-content p, .legal-content li { color: var(--text); line-height: 1.7; font-size: 14px; }
.legal-content a { color: var(--neon); }