/* =========================================================================
   roadmap — استایل ویجت المنتور زبان‌نگار (هندل: zbn-el-roadmap)
   ========================================================================= */

.zrm{--bg:#0C0910;--ink:#EAF0FF;--muted:#8C99BC;--card:rgba(255,255,255,.03);position:relative;overflow:hidden;direction:rtl;font-family:Vazirmatn,IRANYekanX,system-ui,sans-serif;color:var(--ink);padding-block:80px;background:radial-gradient(760px 480px at 50% 0%,rgba(255,92,138,.15),transparent 62%),var(--bg);}
.zrm-container{max-width:1260px;margin:0 auto;padding-inline:40px;}
.zrm-head{text-align:center;}
.zrm-eyebrow{display:inline-flex;align-items:center;gap:8px;padding:7px 14px;border-radius:999px;background:rgba(255,92,138,.12);border:1px solid rgba(255,92,138,.16);color:#FFC2D2;font-size:12px;font-weight:800;}
.zrm-eyebrow .dot{width:7px;height:7px;border-radius:50%;background:#FF5C8A;box-shadow:0 0 12px #FF5C8A;}
.zrm-title{margin:16px 0 8px;font-size:34px;font-weight:900;line-height:1.6;background:linear-gradient(110deg,var(--ink) 35%,#FFC2D2);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
.zrm-lead{max-width:440px;margin:0 auto 50px;font-size:14px;line-height:2;color:var(--muted);}

.zrm-track{position:relative;list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(6,1fr);gap:14px;}
.zrm-line{position:absolute;top:44px;right:70px;left:70px;border-top:2px dashed rgba(255,150,175,.14);}
.zrm-level{display:flex;flex-direction:column;align-items:center;text-align:center;}
.zrm-badge{position:relative;z-index:2;width:88px;height:88px;border-radius:50%;border:3px solid rgba(255,255,255,.14);display:flex;flex-direction:column;align-items:center;justify-content:center;}
.zrm-badge::before{content:"";position:absolute;top:-16px;right:50%;transform:translateX(50%);width:3px;height:16px;border-radius:2px;}
.zrm-badge .code{font-size:22px;font-weight:900;line-height:1;}
.zrm-badge .brand{margin-top:3px;font-size:8px;font-weight:800;letter-spacing:1.5px;opacity:.7;}
.zrm-card{display:block;width:100%;margin-top:20px;padding:18px 14px;border-radius:18px;background:var(--card);border:1px solid rgba(255,150,175,.14);text-decoration:none;color:inherit;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;}
.zrm-card:hover{transform:translateY(-4px);}
.zrm-card h3{margin:0;font-size:15px;font-weight:900;color:var(--ink);}
.zrm-card p{margin:6px 0 0;font-size:11px;line-height:1.9;color:var(--muted);}

.zrm-level.is-a1 .zrm-badge{background:linear-gradient(145deg,#FF6B8A,#FF3B5C);box-shadow:0 0 34px rgba(255,59,92,.45),inset 0 0 20px rgba(255,255,255,.12);}
.zrm-level.is-a1 .code,.zrm-level.is-a1 .brand{color:#04121F;}.zrm-level.is-a1 .zrm-badge::before{background:rgba(255,59,92,.45);}
.zrm-level.is-a1 .zrm-card:hover{border-color:rgba(255,59,92,.2);box-shadow:0 0 30px rgba(255,59,92,.45);}
.zrm-level.is-a2 .zrm-badge{background:linear-gradient(145deg,#FF3B5C,#E11D48);box-shadow:0 0 34px rgba(225,29,72,.45),inset 0 0 20px rgba(255,255,255,.12);}
.zrm-level.is-a2 .code,.zrm-level.is-a2 .brand{color:#EAF6FF;}.zrm-level.is-a2 .zrm-badge::before{background:rgba(225,29,72,.45);}
.zrm-level.is-a2 .zrm-card:hover{border-color:rgba(225,29,72,.36);box-shadow:0 0 30px rgba(225,29,72,.45);}
.zrm-level.is-b1 .zrm-badge{background:linear-gradient(145deg,#F43F5E,#E84B6F);box-shadow:0 0 34px rgba(232,75,111,.42),inset 0 0 20px rgba(255,255,255,.12);}
.zrm-level.is-b1 .code,.zrm-level.is-b1 .brand{color:#F3EEFF;}.zrm-level.is-b1 .zrm-badge::before{background:rgba(232,75,111,.42);}
.zrm-level.is-b1 .zrm-card:hover{border-color:rgba(232,75,111,.2);box-shadow:0 0 30px rgba(232,75,111,.42);}
.zrm-level.is-b2 .zrm-badge{background:linear-gradient(145deg,#FF5C8A,#FF7DA6);box-shadow:0 0 34px rgba(255,92,138,.44),inset 0 0 20px rgba(255,255,255,.12);}
.zrm-level.is-b2 .code,.zrm-level.is-b2 .brand{color:#F6EEFF;}.zrm-level.is-b2 .zrm-badge::before{background:rgba(255,92,138,.44);}
.zrm-level.is-b2 .zrm-card:hover{border-color:rgba(255,92,138,.2);box-shadow:0 0 30px rgba(255,92,138,.44);}
.zrm-level.is-c1 .zrm-badge{background:linear-gradient(145deg,#C41848,#8F0E33);box-shadow:0 0 34px rgba(196,24,72,.42),inset 0 0 20px rgba(255,255,255,.12);}
.zrm-level.is-c1 .code,.zrm-level.is-c1 .brand{color:#F3ECFF;}.zrm-level.is-c1 .zrm-badge::before{background:rgba(196,24,72,.42);}
.zrm-level.is-c1 .zrm-card:hover{border-color:rgba(196,24,72,.2);box-shadow:0 0 30px rgba(196,24,72,.42);}
.zrm-level.is-c2 .zrm-badge{background:linear-gradient(145deg,#F5B301,#F97316);box-shadow:0 0 34px rgba(245,179,1,.90),inset 0 0 20px rgba(255,255,255,.12);}
.zrm-level.is-c2 .code,.zrm-level.is-c2 .brand{color:#1A1204;}.zrm-level.is-c2 .zrm-badge::before{background:rgba(245,179,1,.90);}
.zrm-level.is-c2 .zrm-card:hover{border-color:rgba(245,179,1,.75);box-shadow:0 0 30px rgba(245,179,1,.90);}

@media(max-width:900px){.zrm-track{grid-template-columns:repeat(3,1fr);gap:22px;}.zrm-line{display:none;}}
@media(max-width:560px){.zrm-track{grid-template-columns:1fr 1fr;}}