
/* Minimal responsive styles inspired by provided design */
:root{--accent:#20d0d0;--dark:#0b2340;--card:#0f2a55;--muted:#6b7a90}
*{box-sizing:border-box;font-family:Inter, system-ui, Arial, sans-serif}
body{margin:0;color:#06203a;background:linear-gradient(180deg,#e6fbfb 0%, #06203a 70%)}
.container{max-width:1100px;margin:0 auto;padding:24px}
.site-header{background:transparent;padding:18px 0}
.brand{display:flex;align-items:center;gap:12px}
.logo{width:56px;height:56px;border-radius:8px;background:linear-gradient(135deg,var(--accent),#6a9cff);display:flex;align-items:center;justify-content:center;color:white;font-weight:700}
.top-nav{margin-left:auto;display:flex;align-items:center;gap:12px}
.top-nav a{color:#03314a;text-decoration:none;padding:8px 10px;border-radius:6px}
.top-nav .btn{background:#06203a;color:white;padding:8px 12px}
.hero{padding:48px 0}
.hero-inner{display:flex;gap:24px;align-items:center}
.hero-left{flex:1}
.hero-left h2{font-size:2rem;margin:0 0 10px}
.cta-row{margin:16px 0;display:flex;gap:12px}
.primary{background:#06203a;color:white;padding:10px 16px;border-radius:8px;text-decoration:none}
.secondary{background:transparent;border:2px solid rgba(0,0,0,0.08);padding:8px 14px;border-radius:8px;text-decoration:none}
.hero-right{width:420px}
.mockup{background:#0b2b4a;border-radius:12px;padding:20px;box-shadow:0 8px 24px rgba(6,32,58,0.5)}
.screen{height:220px;background:linear-gradient(90deg,#fff,#f2f9ff);border-radius:8px;display:flex;align-items:center;justify-content:center;color:#06203a;font-weight:600}
.features{padding:40px 24px}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-top:16px}
.card{background:#fff;border-radius:10px;padding:18px;box-shadow:0 8px 18px rgba(4,18,34,0.12)}
.plans{padding:40px 24px}
.plan-grid{display:flex;gap:16px;flex-wrap:wrap}
.plan{background:rgba(255,255,255,0.95);padding:18px;border-radius:12px;flex:1;min-width:220px;box-shadow:0 8px 20px rgba(4,18,34,0.08)}
.plan.featured{border:3px solid var(--accent);transform:translateY(-6px)}
.testimonials{padding:40px 24px}
.test-grid{display:flex;gap:12px;flex-wrap:wrap}
.test-grid blockquote{background:#fff;padding:16px;border-radius:10px;flex:1;min-width:220px}
.contact{padding:40px 24px}
.contact-wrap{display:flex;gap:20px;flex-wrap:wrap}
.contact-form{flex:1;min-width:260px;display:flex;flex-direction:column;gap:10px}
.contact-form label{display:flex;flex-direction:column;font-size:14px;color:var(--muted)}
.contact-form input,.contact-form textarea{padding:10px;border-radius:8px;border:1px solid #d6e3ea}
.contact-info{width:320px;min-width:220px;background:rgba(255,255,255,0.95);padding:16px;border-radius:8px}
.site-footer{padding:24px 0;background:rgba(4,18,34,0.9);color:white;margin-top:30px}
@media(max-width:900px){
  .hero-inner{flex-direction:column}
  .top-nav{display:none}
  .hero-right{width:100%}
}
