.hero { background: linear-gradient(rgba(10,58,92,0.72), rgba(10,58,92,0.82)), url('/images/banner.webp') center/cover no-repeat; color: white; padding: 4rem 2rem 5rem; text-align: center; }
.hero h1, .hero h2, .hero p, .hero a { color: white; }
.hero h1 { font-size: 2.75rem; font-weight: 700; margin-bottom: 1.25rem; line-height: 1.2; }
.hero p { font-size: 1.2rem; opacity: 0.9; max-width: 620px; margin: 0 auto 2rem; }
.hero-sub { font-size: 1rem !important; opacity: 0.75 !important; margin-top: -0.5rem !important; }
.hero-buttons { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; }
.btn-white { background: white; color: #1E5A7D!important; padding: 0.85rem 2rem; border-radius: 0.5rem; font-weight: 600; text-decoration: none; font-size: 1rem; transition: all 0.2s; border: 2px solid white; }
.btn-white:hover { background: #f0f9ff; transform: translateY(-1px); }
.btn-ghost { border: 2px solid rgba(255,255,255,0.6); color: white; padding: 0.85rem 2rem; border-radius: 0.5rem; font-weight: 600; text-decoration: none; font-size: 1rem; transition: all 0.2s; }
.btn-ghost:hover { background: rgba(255,255,255,0.1); border-color: white; }
.content-section { background: white; border-radius: 0.5rem; padding: 1rem 2.5rem; margin: 2rem auto; max-width: 900px; box-shadow: 0 1px 3px rgba(0,0,0,0.1); }
.feature-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 1.5rem; margin: 2rem 0; }
.feature-item { background: #f8fafc; padding: 1.5rem; border-radius: 0.5rem; border: 1px solid #e2e8f0; }
.feature-item h3 { color: #1E5A7D; margin-top: 0; }
.icon { font-size: 1.75rem; margin-bottom: 0.75rem; }
.feature-card { background: #f8fafc; border-left: 4px solid #1E5A7D; padding: 1.5rem; margin: 1.5rem 0; border-radius: 0 0.5rem 0.5rem 0; }
.feature-card h3 { color: #1E5A7D; margin-top: 0; }
.feature-card.highlight { background: #fffbeb; border-left-color: #d97706; }
.feature-card.highlight h3 { color: #92400e; }
.feature-card .feature-more { display: inline-block; margin-top: 0.75rem; font-weight: 600; font-size: 0.95rem; color: #1E5A7D; text-decoration: underline; text-underline-offset: 0.15em; }
.feature-card .feature-more:hover { color: #0A3A5C; }
.feature-links { margin: 2rem 0 1rem; font-size: 0.95rem; color: #4b5563; line-height: 1.8; }
.feature-links a { color: #1E5A7D; font-weight: 600; text-decoration: underline; text-underline-offset: 0.15em; }
.feature-links a:hover { color: #0A3A5C; }
.steps { counter-reset: step; list-style: none; padding: 0; }
.steps li { counter-increment: step; display: flex; gap: 1.25rem; align-items: flex-start; margin-bottom: 1.5rem; }
.steps li::before { content: counter(step); background: #1E5A7D; color: white; font-weight: 700; font-size: 0.9rem; min-width: 2rem; height: 2rem; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin-top: 0.1rem; flex-shrink: 0; }
.cta-box { text-align: center; margin: 3rem 0 1rem; }
.home-cta-block { display: flex; align-items: center; justify-content: space-between; gap: 2rem; background: #f0f7ff; border: 1px solid #bfdbfe; border-radius: 0.75rem; padding: 2rem 2.5rem; }
.home-cta-block--alt { background: #f0fdf4; border-color: #bbf7d0; }
.home-cta-text { flex: 1; }
.home-cta-text h2 { margin: 0 0 0.5rem; font-size: 1.3rem; color: #0A3A5C; }
.home-cta-text p { margin: 0; color: #374151; font-size: 0.95rem; line-height: 1.6; }
.home-cta-btn { display: inline-block; background: #1E5A7D; color: white; text-decoration: none; padding: 0.7rem 1.4rem; border-radius: 0.5rem; font-weight: 600; font-size: 0.95rem; white-space: nowrap; transition: background 0.2s; flex-shrink: 0; }
.home-cta-btn:hover { background: #0A3A5C; color: white; }
.home-cta-block--alt .home-cta-btn { background: #166534; }
.home-cta-block--alt .home-cta-btn:hover { background: #14532d; }
@media (max-width: 640px) { .home-cta-block { flex-direction: column; align-items: flex-start; gap: 1rem; padding: 1.5rem; } }
.audience-card p { font-size: 0.9rem; color: #4b5563; margin: 0; }
.notice-bar { background: #f0f9ff; border: 1px solid #bae6fd; border-radius: 0.5rem; padding: 1rem 1.5rem; margin: 1.5rem 0; font-size: 0.9rem; color: #0c4a6e; display: flex; align-items: flex-start; gap: 0.75rem; }
.notice-bar .notice-icon { font-size: 1.1rem; flex-shrink: 0; margin-top: 0.1rem; }
.testimonial-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1.25rem; margin: 1.5rem 0; }
.testimonial-card { background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 0.5rem; padding: 1.5rem; }
.testimonial-card blockquote { margin: 0 0 1rem; font-style: italic; color: #374151; font-size: 0.95rem; line-height: 1.6; }
.testimonial-card .attribution { font-size: 0.85rem; color: #6b7280; font-weight: 500; }
.coming-soon-bar { background: #f5f3ff; border: 1px solid #ddd6fe; border-radius: 0.5rem; padding: 1rem 1.5rem; margin: 1.5rem 0; font-size: 0.9rem; color: #4c1d95; display: flex; align-items: flex-start; gap: 0.75rem; }
.coming-soon-bar .notice-icon { font-size: 1.1rem; flex-shrink: 0; margin-top: 0.1rem; }
@media (max-width: 768px) { .hero h1 { font-size: 2rem; } .content-section { padding: 1.5rem; margin: 1rem; } }