/* ===================== هاب صرافی‌های ارز دیجیتال — استایل فرانت‌اند ===================== */
.cer-wrap, .cer-widget {
  --bg:#05060F; --surface:rgba(255,255,255,.045); --surface-2:rgba(255,255,255,.07);
  --line:rgba(255,255,255,.1); --gold:#F2C230; --violet:#9B6BFF; --blue:#4FA8FF;
  --teal:#22D9A8; --coral:#FF6B7A; --text:#F5F6FC; --muted:#8C93BE;
  font-family:'Vazirmatn',Tahoma,sans-serif; color:var(--text); direction:rtl; box-sizing:border-box;
}
.cer-wrap *, .cer-widget * { box-sizing:border-box; }

/* ---------- صفحه کامل ---------- */
.cer-wrap{
  max-width:1180px;margin:0 auto;padding:20px 16px 60px;background:
    radial-gradient(ellipse 900px 500px at 10% -10%, rgba(155,107,255,.14), transparent 60%),
    radial-gradient(ellipse 900px 500px at 100% 10%, rgba(79,168,255,.1), transparent 55%),
    var(--bg);border-radius:20px;
}
.cer-hero{padding:20px 4px 22px}
.cer-eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:12px;color:var(--gold);background:rgba(242,194,48,.1);border:1px solid rgba(242,194,48,.35);padding:5px 12px;border-radius:20px;margin-bottom:16px}
.cer-h1{font-size:clamp(22px,4vw,32px);font-weight:800;margin:0 0 12px;line-height:1.6;background:linear-gradient(90deg,#fff,#c9c2ff 60%,#F2C230);-webkit-background-clip:text;background-clip:text;color:transparent}
.cer-p{font-size:14.5px;line-height:2;color:var(--muted);max-width:700px;margin:0 0 14px}
.cer-disclosure{font-size:12px;color:#D8C98A;background:rgba(242,194,48,.06);border:1px dashed rgba(242,194,48,.35);border-radius:10px;padding:10px 14px;display:inline-block}

.cer-section-head{display:flex;align-items:center;gap:12px;margin:38px 0 18px}
.cer-ico{width:38px;height:38px;border-radius:11px;display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0}
.cer-section-head.ir .cer-ico{background:rgba(34,217,168,.12);border:1px solid rgba(34,217,168,.4)}
.cer-section-head.intl .cer-ico{background:rgba(79,168,255,.12);border:1px solid rgba(79,168,255,.4)}
.cer-section-head h2{font-size:18px;font-weight:800;margin:0}
.cer-sub{font-size:12px;color:var(--muted);display:block;margin-top:2px;font-weight:400}

.cer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:16px;margin-bottom:10px}
.cer-card{position:relative;background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.02));border:1px solid var(--line);border-radius:18px;padding:20px;display:flex;flex-direction:column;transition:transform .25s,box-shadow .25s,border-color .25s}
.cer-card:hover{transform:translateY(-5px);border-color:rgba(155,107,255,.5);box-shadow:0 20px 40px rgba(80,40,180,.18)}
.cer-card.featured{border-color:var(--gold);box-shadow:0 0 0 1px rgba(242,194,48,.6) inset,0 18px 44px rgba(242,194,48,.14)}
.cer-fav-badge{position:absolute;top:-11px;right:18px;background:linear-gradient(90deg,var(--gold),#ffdf7a);color:#1a1400;font-size:10.5px;font-weight:800;padding:4px 11px;border-radius:20px}
.cer-card-head{display:flex;align-items:center;gap:10px;margin:4px 0 4px}
.cer-logo-wrap{width:42px;height:42px;border-radius:11px;background:#fff;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden}
.cer-logo-wrap img{width:100%;height:100%;object-fit:contain;padding:6px}
.cer-fallback{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:15px;color:#fff;background:linear-gradient(135deg,var(--violet),var(--blue))}
.cer-name{font-size:16.5px;font-weight:800;margin:0}
.cer-live{font-size:9.5px;color:var(--teal);display:flex;align-items:center;gap:4px;margin-top:3px}
.cer-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--teal);box-shadow:0 0 6px var(--teal);animation:cerPulse 1.6s infinite}
@keyframes cerPulse{0%,100%{opacity:1}50%{opacity:.3}}
.cer-stars{font-size:11.5px;color:var(--gold);margin-top:2px}
.cer-ir-flag{position:relative;display:flex;align-items:center;gap:4px;font-size:10px;font-weight:700;background:rgba(34,217,168,.14);color:var(--teal);border:1px solid rgba(34,217,168,.45);padding:5px 12px;border-radius:20px;margin:8px 0 12px;width:fit-content;flex-shrink:0;cursor:pointer;transition:transform .2s,box-shadow .2s;box-shadow:0 0 0 0 rgba(34,217,168,.5);animation:cerFlagPulse 2.4s infinite}
.cer-ir-flag:hover{transform:translateY(-2px);background:rgba(34,217,168,.22)}
@keyframes cerFlagPulse{0%{box-shadow:0 0 0 0 rgba(34,217,168,.45)}70%{box-shadow:0 0 0 7px rgba(34,217,168,0)}100%{box-shadow:0 0 0 0 rgba(34,217,168,0)}}
@media (prefers-reduced-motion:reduce){.cer-ir-flag{animation:none}}
.cer-desc{font-size:12.5px;line-height:1.9;color:var(--muted);margin:9px 0 12px}
.cer-stats{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-bottom:12px}
.cer-stat{background:var(--surface-2);border:1px solid var(--line);border-radius:10px;padding:8px 9px}
.cer-stat .k{font-size:9.5px;color:var(--muted);margin-bottom:3px}
.cer-stat .v{font-size:12px;font-weight:800;color:var(--text)}
.cer-bonus{background:rgba(34,217,168,.09);border:1px solid rgba(34,217,168,.35);color:var(--teal);font-size:11.5px;font-weight:700;padding:7px 11px;border-radius:10px;margin-bottom:11px;text-align:center}
.cer-more summary{cursor:pointer;font-size:11.5px;color:var(--muted);font-weight:700;list-style:none;margin-bottom:11px}
.cer-more summary::-webkit-details-marker{display:none}
.cer-more summary:before{content:"جزئیات بیشتر ⌄"}
.cer-more[open] summary:before{content:"بستن جزئیات ⌃"}
.cer-pc{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:11px}
.cer-pc h4{font-size:10.5px;margin:0 0 5px}
.cer-pc ul{margin:0;padding-inline-start:15px;font-size:11.5px;line-height:1.85;color:#B9BEDC}
.cer-pc .pros h4{color:var(--teal)}
.cer-pc .cons h4{color:var(--coral)}
.cer-actions{margin-top:auto;display:flex;gap:8px}
.cer-btn{flex:1;text-align:center;padding:10px 8px;border-radius:10px;font-size:12.5px;font-weight:800;text-decoration:none}
.cer-btn.primary{background:linear-gradient(90deg,var(--gold),#ffdf7a);color:#1a1400}
.cer-btn.secondary{background:transparent;color:var(--text);border:1px solid var(--line)}

/* ---------- بنر پشتیبانی ویژه ---------- */
.cer-support-banner{position:relative;overflow:hidden;background:linear-gradient(140deg,rgba(155,107,255,.28),rgba(79,168,255,.16) 60%,rgba(242,194,48,.08));border:1.5px solid rgba(155,107,255,.6);border-radius:22px;padding:28px 24px;margin:30px 0 36px}
.cer-support-glow{position:absolute;inset:0;background:radial-gradient(circle at 88% -10%, rgba(155,107,255,.35), transparent 55%),radial-gradient(circle at 0% 110%, rgba(79,168,255,.25), transparent 50%);pointer-events:none}
.cer-support-top{display:flex;gap:16px;align-items:flex-start;flex-wrap:wrap;position:relative}
.cer-ic{font-size:28px;background:linear-gradient(135deg,var(--violet),var(--blue));width:54px;height:54px;border-radius:16px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.cer-support-banner h3{margin:0 0 8px;font-size:18px;font-weight:800;display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.cer-tag{font-size:10.5px;background:linear-gradient(90deg,var(--gold),#ffdf7a);color:#1a1400;padding:4px 10px;border-radius:20px;font-weight:800}
.cer-support-headline{font-size:13.5px !important;color:var(--text) !important;font-weight:700;margin-bottom:8px !important}
.cer-support-banner > .cer-support-top p{margin:0;font-size:12.5px;color:#D9D5F5;line-height:1.95;max-width:680px}
.cer-support-form{display:flex;gap:9px;flex-wrap:wrap;margin-top:16px;position:relative}
.cer-support-form select, .cer-support-form input{flex:1;min-width:140px;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.2);border-radius:11px;padding:11px 13px;color:var(--text);font-family:inherit;font-size:12.5px}
.cer-support-form select{-webkit-appearance:none;appearance:none;color-scheme:dark;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6'><path d='M0 0l5 6 5-6z' fill='%238C93BE'/></svg>");background-repeat:no-repeat;background-position:left 14px center;padding-left:30px}
.cer-support-form select option{color:#111;background:#fff}
.cer-support-form button{background:linear-gradient(90deg,var(--violet),var(--blue));color:#fff;border:none;padding:12px 20px;border-radius:11px;font-weight:800;font-size:13px;cursor:pointer;white-space:nowrap}
.cer-otp-box{display:flex;gap:8px;width:100%}
.cer-form-msg{width:100%;font-size:12px;margin-top:6px}
.cer-support-note{font-size:10.5px;color:var(--muted);margin-top:10px;position:relative}

/* ---------- جدول مقایسه ---------- */
.cer-compare-title{font-size:17px;font-weight:800;margin:30px 0 12px}
.cer-table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:14px;margin-bottom:20px;background:rgba(255,255,255,.02)}
.cer-table-wrap table{width:100%;border-collapse:collapse;font-size:12.5px;min-width:600px}
.cer-table-wrap th, .cer-table-wrap td{padding:11px 13px;text-align:center;white-space:nowrap;color:var(--text)}
.cer-table-wrap th{background:var(--surface-2);color:var(--muted);font-size:11px;font-weight:700}
.cer-table-wrap td:first-child, .cer-table-wrap th:first-child{text-align:right}
.cer-table-wrap tr:not(:last-child) td{border-bottom:1px solid var(--line)}

/* ===================== ویجت صفحه اصلی ===================== */
.cer-widget{max-width:640px;margin:0 auto;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:16px;padding:14px;
  background-image:radial-gradient(ellipse 500px 300px at 10% -10%, rgba(155,107,255,.12), transparent 60%),radial-gradient(ellipse 500px 300px at 100% 20%, rgba(79,168,255,.08), transparent 55%),linear-gradient(var(--bg),var(--bg));}
.cer-widget-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;flex-wrap:wrap;gap:6px}
.cer-widget-head h3{font-size:13.5px;margin:0;font-weight:800}
.cer-widget-live{font-size:9px;color:var(--teal);display:flex;align-items:center;gap:4px}
.cer-group-label{font-size:10px;color:var(--muted);font-weight:700;margin:10px 0 6px}
.cer-group-label:first-of-type{margin-top:0}

.cer-top3{display:flex;flex-wrap:wrap;gap:8px}
.cer-big-card{position:relative;flex:1 1 0;min-width:130px;background:linear-gradient(160deg,rgba(255,255,255,.07),rgba(255,255,255,.02));border:1px solid var(--line);border-radius:13px;padding:11px 8px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px}
.cer-big-card.rank1{border-color:var(--gold);box-shadow:0 10px 24px rgba(242,194,48,.16)}
.cer-medal{position:absolute;top:-9px;background:linear-gradient(90deg,var(--gold),#ffdf7a);color:#1a1400;font-size:9px;font-weight:800;padding:3px 9px;border-radius:20px}
.cer-medal-alt{background:var(--surface-2);color:var(--muted);border:1px solid var(--line)}
.cer-big-logo-wrap{width:34px;height:34px;border-radius:9px;background:#fff;display:flex;align-items:center;justify-content:center;overflow:hidden}
.cer-big-logo-wrap img{width:100%;height:100%;object-fit:contain;padding:5px}
.cer-big-card .cer-name{font-size:12px}
.cer-tagline{font-size:9px;color:var(--muted);line-height:1.4}
.cer-big-stats{display:flex;gap:4px;margin:2px 0 0;flex-wrap:wrap;justify-content:center}
.cer-mini-stat{font-size:8.5px;background:var(--surface-2);border:1px solid var(--line);border-radius:20px;padding:3px 6px;color:var(--text)}
.cer-mini-stat.g{color:var(--teal)}
.cer-big-btn{margin-top:4px;width:100%;background:linear-gradient(90deg,var(--gold),#ffdf7a);color:#1a1400;border:none;padding:7px 4px;border-radius:8px;font-size:10px;font-weight:800;text-decoration:none;display:block}

.cer-mid-row{display:flex;flex-wrap:wrap;gap:6px}
.cer-mid-card{flex:1 1 0;min-width:78px;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:7px 5px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:3px}
.cer-mid-logo-wrap{width:22px;height:22px;border-radius:6px;background:#fff;display:flex;align-items:center;justify-content:center;overflow:hidden}
.cer-mid-logo-wrap img{width:100%;height:100%;object-fit:contain;padding:3px}
.cer-mid-card .cer-name{font-size:9.5px;font-weight:700;margin:0}
.cer-mid-stat{font-size:8px;color:var(--teal)}
.cer-mid-btn{margin-top:2px;width:100%;background:var(--surface-2);border:1px solid var(--line);color:var(--text);padding:4px 3px;border-radius:6px;font-size:9px;font-weight:700;text-decoration:none;display:block}

.cer-ir-row{display:flex;gap:6px;flex-wrap:wrap}
.cer-ir-chip{flex:1 1 0;min-width:110px;justify-content:center;display:flex;align-items:center;gap:6px;background:rgba(34,217,168,.07);border:1px solid rgba(34,217,168,.25);border-radius:30px;padding:6px 10px;text-decoration:none;color:var(--text)}
.cer-ir-logo-wrap{width:18px;height:18px;border-radius:5px;background:#fff;display:flex;align-items:center;justify-content:center;overflow:hidden;flex-shrink:0}
.cer-ir-logo-wrap img{width:100%;height:100%;object-fit:contain;padding:2px}
.cer-ir-chip .cer-name{font-size:10px;font-weight:700}

.cer-guide-cta{margin-top:12px;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;background:linear-gradient(135deg,rgba(155,107,255,.16),rgba(79,168,255,.1));border:1px solid rgba(155,107,255,.35);border-radius:11px;padding:10px 12px}
.cer-txt{font-size:10.5px;color:#D9D5F5}
.cer-txt b{display:block;font-size:11.5px;color:var(--text)}
.cer-guide-cta a{background:linear-gradient(90deg,var(--violet),var(--blue));color:#fff;padding:8px 16px;border-radius:9px;font-size:10.5px;font-weight:800;text-decoration:none;white-space:nowrap}

@media (prefers-reduced-motion:reduce){ .cer-dot{animation:none} }

/* ---- دکمه راهنمای متنی/ویدیویی ---- */
.cer-guide-btn{position:relative;overflow:hidden;margin-top:14px;display:inline-flex;align-items:center;gap:8px;background:linear-gradient(100deg,var(--violet),var(--blue),var(--violet));background-size:200% auto;color:#fff;border:none;padding:13px 24px;border-radius:14px;font-family:inherit;font-size:13.5px;font-weight:800;cursor:pointer;box-shadow:0 10px 26px rgba(79,168,255,.32);transition:transform .2s,box-shadow .2s;animation:cerGuideGlow 2.4s infinite,cerGuideShift 5s linear infinite}
.cer-guide-btn:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 16px 38px rgba(155,107,255,.5)}
.cer-guide-btn:before{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.35),transparent);transform:skewX(-20deg);animation:cerGuideSheen 3.2s ease-in-out infinite}
@keyframes cerGuideSheen{0%{left:-60%}50%,100%{left:130%}}
@keyframes cerGuideShift{to{background-position:200% center}}
@keyframes cerGuideGlow{0%,100%{box-shadow:0 10px 26px rgba(79,168,255,.32)}50%{box-shadow:0 10px 34px rgba(155,107,255,.55)}}
@media (prefers-reduced-motion:reduce){.cer-guide-btn{animation:none}.cer-guide-btn:before{display:none}}

/* ---- مودال راهنما ---- */
.cer-modal-overlay{display:none;position:fixed;inset:0;background:rgba(3,4,10,.8);backdrop-filter:blur(6px);z-index:9999;align-items:center;justify-content:center;padding:20px}
.cer-modal-overlay.open{display:flex;animation:cerFadeIn .2s ease}
@keyframes cerFadeIn{from{opacity:0}to{opacity:1}}
.cer-modal-box{position:relative;background:linear-gradient(180deg,#161A38,#0A0C1C);border:1px solid rgba(155,107,255,.35);border-radius:20px;padding:26px;max-width:640px;width:100%;max-height:88vh;overflow-y:auto;box-shadow:0 0 0 1px rgba(155,107,255,.12),0 30px 80px rgba(0,0,0,.55);animation:cerModalPop .25s cubic-bezier(.2,.9,.3,1.2)}
@keyframes cerModalPop{from{transform:scale(.92) translateY(10px);opacity:0}to{transform:scale(1) translateY(0);opacity:1}}
.cer-modal-box:before{content:"";position:absolute;top:0;right:0;left:0;height:3px;border-radius:20px 20px 0 0;background:linear-gradient(90deg,var(--violet),var(--blue),var(--gold))}
.cer-modal-box h3{margin:6px 0 16px;font-size:17.5px;font-weight:800;padding-inline-end:30px;background:linear-gradient(90deg,#fff,#c9c2ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.cer-modal-close{position:absolute;top:16px;left:16px;background:var(--surface-2);border:1px solid var(--line);color:var(--text);width:32px;height:32px;border-radius:10px;cursor:pointer;font-size:14px;transition:background .2s,transform .2s}
.cer-modal-close:hover{background:rgba(255,107,122,.25);transform:rotate(90deg)}
.cer-modal-video{position:relative;width:100%;padding-top:56.25%;border-radius:14px;overflow:hidden;margin-bottom:16px;background:#000;box-shadow:0 10px 30px rgba(0,0,0,.4)}
.cer-modal-video iframe,.cer-modal-video video{position:absolute;inset:0;width:100%;height:100%;border:0;object-fit:contain}
.cer-modal-text{font-size:13px;line-height:2.1;color:var(--muted);margin:0;white-space:pre-line}
