.grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(320px,1fr));
  gap:var(--gap);
}

.grid-2{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:var(--gap);
}

.card{
  background:var(--panel);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:20px;
  box-shadow:var(--shadow);
  transition:var(--transition);
  position:relative;
  overflow:hidden;
}

.card::before{
  content:'';
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:3px;
  background:linear-gradient(90deg, var(--accent), var(--accent-hover));
  opacity:0;
  transition:var(--transition);
}

.card:hover{
  border-color:var(--border-light);
  box-shadow:var(--shadow-lg);
  transform:translateY(-2px);
}

.card:hover::before{
  opacity:1;
}

.card h3{
  margin:0 0 12px;
  font-size:18px;
  font-weight:600;
  color:var(--text);
}

.list .item{
  background:var(--panel);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:16px;
  margin:12px 0;
  transition:var(--transition);
}

.list .item:hover{
  border-color:var(--border-light);
  background:var(--panel2);
  box-shadow:var(--shadow-sm);
  transform:translateX(4px);
}

/* Stock Statistics */
.stock-stats{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  gap:16px;
  margin-bottom:24px;
}

.stock-stats .stat-item{
  background:linear-gradient(135deg, var(--panel2), var(--panel));
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:20px;
  text-align:center;
  transition:var(--transition);
  position:relative;
  overflow:hidden;
}

.stock-stats .stat-item::before{
  content:'';
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:3px;
  background:linear-gradient(90deg, var(--accent), var(--ok));
  opacity:0;
  transition:var(--transition);
}

.stock-stats .stat-item:hover{
  transform:translateY(-2px);
  box-shadow:var(--shadow);
  border-color:var(--border-light);
}

.stock-stats .stat-item:hover::before{
  opacity:1;
}

.stock-stats .stat-value{
  font-size:24px;
  font-weight:700;
  background:linear-gradient(135deg, var(--accent), var(--ok));
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
  margin-bottom:8px;
}

.stock-stats .stat-label{
  font-size:13px;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:0.5px;
  font-weight:500;
}
