/* ── Клиентский сайт AccountDiversity ── */
:root{
  --cl-bg:#0b0f15; --cl-surface:#141b24; --cl-surface2:#1b232e; --cl-line:#28323f;
  --cl-text:#e8eef5; --cl-muted:#93a1b2; --cl-accent:#4f8cff; --cl-accent2:#3b6fd4;
  --cl-ok:#34d27b; --cl-warn:#f5a623; --cl-bad:#ef5161; --cl-r:14px;
}
.cl-body{
  margin:0; min-height:100vh; display:flex; flex-direction:column;
  background:
    radial-gradient(1100px 600px at 80% -10%, rgba(79,140,255,.10), transparent 60%),
    radial-gradient(900px 500px at -10% 10%, rgba(52,210,123,.06), transparent 55%),
    var(--cl-bg);
  color:var(--cl-text);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
/* header */
.cl-header{
  position:sticky; top:0; z-index:30; display:flex; align-items:center; gap:18px;
  padding:14px 22px; background:rgba(11,15,21,.82); backdrop-filter:blur(10px);
  border-bottom:1px solid var(--cl-line);
}
.cl-logo{font-weight:800; font-size:18px; color:var(--cl-text); text-decoration:none; letter-spacing:-.02em; white-space:nowrap}
.cl-nav{display:flex; align-items:center; gap:6px; margin-left:auto; flex-wrap:wrap}
.cl-nav a{color:var(--cl-muted); text-decoration:none; padding:8px 12px; border-radius:9px; font-size:14px; font-weight:600; transition:.15s}
.cl-nav a:hover{color:var(--cl-text); background:var(--cl-surface2)}
.cl-nav a.on{color:#fff; background:var(--cl-accent2)}
.cl-nav a.cl-cta{background:var(--cl-accent); color:#fff}
.cl-nav a.cl-cta:hover{background:var(--cl-accent2)}
.cl-nav a.cl-ghost{border:1px solid var(--cl-line)}
.cl-burger{display:none; margin-left:auto; background:transparent; border:1px solid var(--cl-line); color:var(--cl-text); font-size:18px; border-radius:8px; padding:6px 10px; cursor:pointer}
/* main */
.cl-main{flex:1; width:100%; max-width:920px; margin:0 auto; padding:28px 20px 48px}
.cl-narrow{max-width:520px; margin:0 auto}
/* footer */
.cl-footer{
  display:flex; gap:18px; justify-content:center; align-items:center; flex-wrap:wrap;
  padding:20px; border-top:1px solid var(--cl-line); color:var(--cl-muted); font-size:13px;
}
.cl-footer a{color:var(--cl-muted)}
/* hero */
.cl-hero{text-align:center; padding:32px 0 10px}
.cl-hero h1{font-size:34px; line-height:1.15; margin:0 0 14px; letter-spacing:-.02em}
.cl-hero p{font-size:17px; color:var(--cl-muted); max-width:560px; margin:0 auto 24px}
.cl-hero .cl-row{display:flex; gap:12px; justify-content:center; flex-wrap:wrap}
/* buttons */
.cl-btn{display:inline-flex; align-items:center; gap:8px; padding:13px 22px; border-radius:11px;
  font-weight:700; font-size:15px; text-decoration:none; cursor:pointer; border:1px solid transparent; transition:.15s}
.cl-btn.primary{background:var(--cl-accent); color:#fff}
.cl-btn.primary:hover{background:var(--cl-accent2); transform:translateY(-1px)}
.cl-btn.ghost{background:transparent; color:var(--cl-text); border-color:var(--cl-line)}
.cl-btn.ghost:hover{background:var(--cl-surface2)}
.cl-btn.block{width:100%; justify-content:center}
.cl-btn.green{background:var(--cl-ok); color:#06281a}
.cl-btn.green:hover{filter:brightness(1.06); transform:translateY(-1px)}
/* cards grid */
.cl-cards{display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:16px; margin:26px 0}
.cl-card{background:var(--cl-surface); border:1px solid var(--cl-line); border-radius:var(--cl-r); padding:22px; text-decoration:none; color:inherit; display:block; transition:.15s}
a.cl-card:hover{border-color:var(--cl-accent); transform:translateY(-2px)}
.cl-card .ic{font-size:26px}
.cl-card h3{margin:10px 0 6px; font-size:17px}
.cl-card p{margin:0; color:var(--cl-muted); font-size:14px; line-height:1.5}
/* panel / form card */
.cl-panel{background:var(--cl-surface); border:1px solid var(--cl-line); border-radius:var(--cl-r); padding:26px}
.cl-panel h1,.cl-panel h2{margin-top:0}
.cl-title{font-size:22px; font-weight:800; text-align:center; margin-bottom:6px}
.cl-sub{color:var(--cl-muted); text-align:center; margin-bottom:20px; font-size:14px}
.cl-form{display:flex; flex-direction:column; gap:12px}
.cl-form input{background:var(--cl-surface2); border:1px solid var(--cl-line); color:var(--cl-text);
  border-radius:10px; padding:13px 14px; font-size:15px; width:100%; box-sizing:border-box}
.cl-form input:focus{outline:none; border-color:var(--cl-accent)}
.cl-link{color:var(--cl-accent); text-decoration:none}
.cl-link:hover{text-decoration:underline}
.cl-center{text-align:center}
.cl-muted{color:var(--cl-muted)}
/* alerts */
.cl-alert{border-radius:10px; padding:12px 14px; font-size:14px; margin-bottom:14px}
.cl-alert.ok{background:rgba(52,210,123,.12); border:1px solid rgba(52,210,123,.35); color:#9ff0c3}
.cl-alert.err{background:rgba(239,81,97,.12); border:1px solid rgba(239,81,97,.35); color:#ffb3bb}
.cl-alert.warn{background:rgba(245,166,35,.12); border:1px solid rgba(245,166,35,.35); color:#ffd591}
.cl-alert.info{background:rgba(79,140,255,.10); border:1px solid rgba(79,140,255,.30); color:#bcd4ff}
/* steps */
.cl-steps{counter-reset:s; display:flex; flex-direction:column; gap:14px; margin:18px 0}
.cl-step{display:flex; gap:14px; align-items:flex-start}
.cl-step .n{counter-increment:s; flex:none; width:30px; height:30px; border-radius:50%;
  background:var(--cl-accent2); color:#fff; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:14px}
.cl-step .n::before{content:counter(s)}
.cl-step .tx{padding-top:3px}
.cl-step .tx b{display:block; margin-bottom:2px}
.cl-step .tx span{color:var(--cl-muted); font-size:14px}
/* status / claim */
.cl-list{display:flex; flex-direction:column; gap:10px; margin:14px 0}
.cl-linkrow{display:flex; gap:8px; align-items:center}
.cl-linkrow a.lr{flex:1; display:block; padding:13px 15px; border-radius:10px; background:var(--cl-surface2);
  border:1px solid var(--cl-line); color:var(--cl-text); text-decoration:none; font-weight:600}
.cl-linkrow a.lr:hover{border-color:var(--cl-accent)}
.cl-copy{white-space:nowrap; cursor:pointer; border:1px solid var(--cl-line); background:var(--cl-surface2);
  color:var(--cl-text); border-radius:9px; padding:11px 12px; font-size:13px; font-weight:600}
.cl-copy:hover{border-color:var(--cl-accent)}
.cl-spin{width:34px; height:34px; border:3px solid var(--cl-line); border-top-color:var(--cl-accent);
  border-radius:50%; animation:clspin .8s linear infinite; margin:8px auto}
@keyframes clspin{to{transform:rotate(360deg)}}
.cl-field{background:var(--cl-surface2); border:1px solid var(--cl-line); border-radius:10px;
  padding:12px 14px; display:flex; justify-content:space-between; align-items:center; gap:10px; margin:8px 0}
.cl-field .lbl{color:var(--cl-muted); font-size:13px}
.cl-field .val{font-weight:700; font-family:ui-monospace,Menlo,Consolas,monospace; font-size:16px}
/* table */
.cl-table{width:100%; border-collapse:collapse; font-size:14px; margin-top:8px}
.cl-table th{text-align:left; color:var(--cl-muted); font-weight:600; font-size:12px; text-transform:uppercase;
  padding:8px 10px; border-bottom:1px solid var(--cl-line)}
.cl-table td{padding:9px 10px; border-bottom:1px solid var(--cl-line)}
.cl-pill{display:inline-block; padding:2px 9px; border-radius:99px; font-size:12px; font-weight:600}
.cl-pill.ok{background:rgba(52,210,123,.16); color:#7fe7ad}
.cl-pill.wait{background:rgba(245,166,35,.16); color:#ffce85}
.cl-pill.bad{background:rgba(239,81,97,.16); color:#ff9aa5}
.cl-pill.mut{background:rgba(147,161,178,.16); color:var(--cl-muted)}
/* faq */
.cl-faq details{background:var(--cl-surface); border:1px solid var(--cl-line); border-radius:11px; padding:4px 16px; margin:10px 0}
.cl-faq summary{cursor:pointer; font-weight:600; padding:12px 0; list-style:none}
.cl-faq summary::-webkit-details-marker{display:none}
.cl-faq summary::before{content:"＋"; color:var(--cl-accent); margin-right:10px; font-weight:700}
.cl-faq details[open] summary::before{content:"－"}
.cl-faq .ans{color:var(--cl-muted); padding:0 0 14px; font-size:14px; line-height:1.6}
.cl-tabs{display:flex; gap:8px; flex-wrap:wrap; margin-bottom:18px}
.cl-tab{padding:9px 16px; border-radius:10px; border:1px solid var(--cl-line); background:var(--cl-surface);
  color:var(--cl-muted); text-decoration:none; font-weight:600; font-size:14px}
.cl-tab.on{background:var(--cl-accent2); color:#fff; border-color:transparent}
@media (max-width:640px){
  .cl-burger{display:block}
  .cl-nav{display:none; position:absolute; top:56px; left:0; right:0; flex-direction:column; align-items:stretch;
    gap:2px; padding:10px 14px; background:var(--cl-bg); border-bottom:1px solid var(--cl-line)}
  .cl-nav.open{display:flex}
  .cl-nav a{padding:12px}
  .cl-hero h1{font-size:27px}
}
/* полоска доверия на лендинге */
.cl-trust{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;margin:8px 0 26px}
.cl-trust .ti{background:var(--cl-surface);border:1px solid var(--cl-line);border-radius:12px;padding:16px 18px;display:flex;flex-direction:column;gap:4px}
.cl-trust .ti .ic{font-size:22px}
.cl-trust .ti b{font-size:15px}
.cl-trust .ti span{color:var(--cl-muted);font-size:13px;line-height:1.5}
