@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600;700;800&display=swap');
@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css');

.hm-priv-card {
  --rgb: 175,241,147;
  --clr: #AFF193;
  font-family: 'Montserrat', sans-serif;
  background: #18191c;
  border: 1px solid rgba(var(--rgb), 0.15);
  border-radius: 16px;
  width: 100%;
  max-width: 500px;
  margin: 20px auto;
  padding: 30px;
  box-shadow: 0 10px 30px rgba(0,0,0,.5), 0 0 20px rgba(var(--rgb), .08);
  transition: all .3s ease-in-out;
  position: relative;
  overflow: hidden;
}
.hm-priv-card:hover {
  transform: translateY(-5px);
  border-color: rgba(var(--rgb), .4);
  box-shadow: 0 15px 35px rgba(0,0,0,.6), 0 0 25px rgba(var(--rgb), .18);
}
.hm-priv-card::before {
  content: '';
  position: absolute; top: -50%; left: -50%;
  width: 200%; height: 200%;
  background: radial-gradient(circle, rgba(var(--rgb), .06) 0%, transparent 60%);
  pointer-events: none;
}
.hm-priv-header { text-align: center; margin-bottom: 25px; position: relative; }
.hm-priv-badge {
  display: inline-block;
  background: rgba(var(--rgb), .15);
  color: var(--clr);
  font-weight: 700; font-size: 11px;
  padding: 6px 14px; border-radius: 30px;
  letter-spacing: 1.5px; text-transform: uppercase;
  margin-bottom: 12px;
}
.hm-priv-title {
  color: var(--clr);
  font-size: 32px; font-weight: 800;
  margin: 0 0 8px 0;
  text-shadow: 0 0 15px rgba(var(--rgb), .3);
  letter-spacing: 1px;
}
.hm-priv-subtitle { color: #a3a3a3; font-size: 14px; margin: 0; }
.hm-priv-block { margin-bottom: 25px; position: relative; }
.hm-priv-sectitle {
  color: #fff; font-size: 16px; font-weight: 700;
  margin: 0 0 15px 0; display: flex; align-items: center; gap: 10px;
  border-bottom: 1px solid rgba(255,255,255,.07); padding-bottom: 8px;
}
.hm-priv-sectitle i { color: var(--clr); }
.hm-priv-list { list-style: none; padding: 0; margin: 0; }
.hm-priv-list li {
  background: rgba(255,255,255,.02);
  border-left: 3px solid var(--clr);
  padding: 10px 14px; margin-bottom: 8px;
  border-radius: 0 8px 8px 0;
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
  transition: all .3s ease-in-out;
}
.hm-priv-list li:hover { background: rgba(var(--rgb), .05); transform: translateX(4px); }
.hm-priv-cmd {
  font-family: monospace; font-weight: 700; font-size: 14px;
  color: var(--clr); background: rgba(var(--rgb), .1);
  padding: 2px 6px; border-radius: 4px;
}
.hm-priv-desc { color: #a3a3a3; font-size: 13px; }
.hm-priv-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 12px; }
.hm-priv-feature {
  background: rgba(255,255,255,.02);
  border: 1px solid rgba(255,255,255,.05);
  border-radius: 10px; padding: 12px;
  display: flex; flex-direction: column; align-items: center; text-align: center;
  transition: all .3s ease-in-out;
}
.hm-priv-feature:hover {
  background: rgba(var(--rgb), .03);
  border-color: rgba(var(--rgb), .2);
  transform: scale(1.03);
}
.hm-priv-feature i { color: var(--clr); font-size: 18px; margin-bottom: 8px; opacity: .8; }
.hm-priv-num { font-size: 20px; font-weight: 800; color: #fff; margin-bottom: 4px; }
.hm-priv-label { color: #a3a3a3; font-size: 12px; }
.hm-priv-note {
  margin-top: 14px; font-size: 13px; text-align: center;
  color: var(--clr); font-weight: 700;
}

/* --- цвет под каждый ранг --- */
.hm-priv-hunter  { --rgb: 175,241,147; --clr: #AFF193; }
.hm-priv-raider  { --rgb: 227,158,158; --clr: #E39E9E; }
.hm-priv-evoker  { --rgb: 246,236,130; --clr: #F6EC82; }
.hm-priv-warden  { --rgb: 74,246,246;  --clr: #4AF6F6; }
.hm-priv-phantom { --rgb: 201,193,246; --clr: #C9C1F6; }
.hm-priv-dragon  { --rgb: 246,71,71;   --clr: #F64747; }
.hm-priv-kraken  { --rgb: 39,238,162;  --clr: #27EEA2; }
.hm-priv-venom   { --rgb: 174,174,174; --clr: #AEAEAE; }