/* Estilos simples para la landing */
:root{--accent:#1e90ff;--muted:#666}
body{font-family:Segoe UI,Roboto,Arial,sans-serif;margin:0;color:#222}
.container{max-width:1000px;margin:0 auto;padding:24px}
.hero{background:linear-gradient(120deg,#f7fbff,#eef7ff);padding:48px 0;text-align:center}
.hero h1{margin:0;font-size:32px}
.hero .tag{color:var(--muted);margin:8px 0}
.cta{display:inline-block;margin-top:12px;padding:10px 18px;background:var(--accent);color:#fff;border-radius:6px;text-decoration:none}
.features{padding:24px 0}
.cards{display:flex;gap:12px}
.card{flex:1;background:#fff;border:1px solid #eee;padding:16px;border-radius:8px}
.screens{padding:24px 0}
.screenshot-row{display:flex;gap:12px}
.screenshot{flex:1;background:#f9fafb;border:1px solid #e6eef8;padding:12px;border-radius:6px}
.mock-header{font-weight:700;margin-bottom:8px}
.mock-table{width:100%;border-collapse:collapse}
.mock-table th,.mock-table td{border-bottom:1px solid #e8eef6;padding:6px;text-align:left}
.chart{display:flex;align-items:end;height:100px;gap:8px;padding:8px}
.chart .bar{width:24px;background:linear-gradient(180deg,#4facfe,#00f2fe);border-radius:4px}
.signup .form{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.signup label{display:block}
.signup input,.signup textarea{width:100%;padding:8px;border:1px solid #ddd;border-radius:4px}
.signup textarea{grid-column:1 / -1;height:80px}
.signup button{grid-column:1 / -1;padding:10px;background:var(--accent);color:white;border:none;border-radius:6px}
.faq{padding:16px 0}
.footer{background:#fafafa;padding:12px;text-align:center;color:var(--muted)}

@media(max-width:800px){
  .cards{flex-direction:column}
  .screenshot-row{flex-direction:column}
  .signup .form{grid-template-columns:1fr}
}