/* assets/css/styles.css (same visual as v1) */
:root{
  --bg1:#0f172a;--bg2:#111827;--text:#e5e7eb;--muted:#94a3b8;
  --primary:#22d3ee;--primary-2:#60a5fa;--radius:20px;
  --danger:#ef4444;--success:#10b981;--shadow:0 20px 60px rgba(0,0,0,.35);
}
*{box-sizing:border-box}html,body{height:100%}
body{margin:0;font-family:Vazirmatn,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial;
  color:var(--text);
  background: radial-gradient(1200px 800px at 80% -10%, rgba(96,165,250,.25), transparent 60%),
              radial-gradient(900px 600px at -10% 10%, rgba(34,211,238,.25), transparent 60%),
              linear-gradient(180deg, #0f172a, #111827);
  background-attachment: fixed;}
.container{width:min(1100px,92%);margin-inline:auto}
header.container{display:flex;align-items:center;justify-content:space-between;padding:24px 0}
.brand{display:flex;gap:12px;align-items:center}
.brand .logo{width:44px;height:44px;display:grid;place-items:center;border-radius:14px;
  background:linear-gradient(135deg,var(--primary),var(--primary-2));box-shadow:var(--shadow);font-size:22px}
.brand h1{margin:0;font-size:22px}.brand p{margin:2px 0 0;color:var(--muted);font-size:13px}
.cta-btn{padding:12px 18px;border-radius:999px;text-decoration:none;color:#0b1020;font-weight:700;
  background:linear-gradient(135deg,var(--primary),var(--primary-2));box-shadow:var(--shadow);
  transition:transform .15s ease,box-shadow .2s ease,opacity .2s ease}
.cta-btn:hover{transform:translateY(-1px);opacity:.95}
.grid-2{display:grid;grid-template-columns:1.2fr .8fr;gap:22px}
@media (max-width:900px){.grid-2{grid-template-columns:1fr}}
.card{background:rgba(8,12,24,.7);border:1px solid rgba(255,255,255,.06);border-radius:var(--radius);
  padding:clamp(18px,2.2vw,28px);box-shadow:var(--shadow);backdrop-filter:blur(10px)}
.hero h2{margin-top:0;font-size:clamp(22px,2.5vw,30px)}
.hero p{line-height:1.9}.bullets{list-style:none;padding:0;margin:16px 0 6px;display:grid;gap:10px}
.bullets li{color:#dbeafe;background:linear-gradient(135deg,rgba(34,211,238,.12),rgba(96,165,250,.12));
  padding:10px 14px;border-radius:12px;border:1px dashed rgba(148,163,184,.25)}
.actions{display:flex;gap:12px;margin-top:18px;flex-wrap:wrap}
.primary,.ghost{appearance:none;border:none;cursor:pointer;padding:12px 18px;border-radius:14px;font-weight:800;text-decoration:none}
.primary{background:linear-gradient(135deg,var(--primary),var(--primary-2));color:#07101e}
.ghost{background:transparent;border:1px solid rgba(255,255,255,.15);color:var(--text)}
.highlight h3{margin-top:0}.highlight ol{margin:0 0 10px 0;padding:0 18px;line-height:2}
.note{color:var(--muted)}.footer{display:flex;justify-content:space-between;gap:16px;padding:28px 0;flex-wrap:wrap}
.muted{color:var(--muted)}.small{font-size:13px}.msg-form{margin-top:10px}
.msg-form label{display:block;margin:6px 0 8px;color:#cbd5e1}
textarea{width:100%;resize:vertical;min-height:140px;padding:14px 16px;font-size:16px;line-height:1.9;color:var(--text);
  background:rgba(2,6,18,.6);border:1px solid rgba(255,255,255,.08);border-radius:16px;outline:none}
textarea:focus{border-color:rgba(34,211,238,.5);box-shadow:0 0 0 4px rgba(34,211,238,.15)}
.form-row{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:10px 0 0}
#charCount{color:var(--muted)}button.primary{min-width:160px}
.alert{border-radius:14px;padding:12px 14px;margin:14px 0;font-weight:700}
.alert.success{background:rgba(16,185,129,.12);border:1px solid rgba(16,185,129,.35);color:#bbf7d0}
.alert.danger{background:rgba(239,68,68,.12);border:1px solid rgba(239,68,68,.35);color:#fecaca}
code{background:rgba(255,255,255,.06);padding:.2em .5em;border-radius:8px;border:1px solid rgba(255,255,255,.08)}