/* SECTION WRAPPER */

.stock-cards-wrapper.cols-2 { --columns:2; }
.stock-cards-wrapper.cols-3 { --columns:3; }
.stock-cards-wrapper.cols-4 { --columns:4; }

.stock-cards-wrapper{
display:flex;
flex-wrap:wrap;
gap:20px;
--columns:4;
--gap:20px;
max-width:1280px;
margin:0 auto;
padding:0 0px;
}

/* CARD */

.stock-card{
position:relative;
background:#F7F7F7;
padding:45px 30px;
border-radius:10px;
text-align:center;
overflow:hidden;
flex: 0 0 calc(100% / var(--columns) - var(--gap));
}

/* FINANCE GRAPH BACKGROUND */

.stock-card::before{
content:"";
position:absolute;
inset:0;
background-image:url("https://risingbulls.com/wp-content/uploads/2026/03/statistical-graph-with-business-finance-concept-3d-rendering_772449-25280.avif");
background-repeat:no-repeat;
background-size:cover;
background-position:center;
opacity:0.08;
pointer-events:none;
}

/* EYEBROW CAPSULE */

.eyebrow{
display:inline-block;
background:#ffffff;
color:#FF4F18;
font-size:12px;
font-weight:600;
padding:6px 12px;
border-radius:9999px;
margin-bottom:16px;
position:relative;
z-index:2;
}

/* STOCK NAME */

.stock-title{
margin-bottom:32px;
position:relative;
z-index:2;
}

/* GAIN SECTION */

.gain-wrapper{
margin-bottom:30px;
position:relative;
z-index:2;
}

/* LARGE % NUMBER */

.gain-number{
color:#0A7A18;
line-height:1;
margin-bottom:8px;
}

/* GAIN LABEL */

.gain-label{
font-family:"Plus Jakarta Sans",sans-serif;
font-size:36px;
font-weight:800;
line-height:1.2em;
color:#0A7A18;
}

/* META TEXT */

.stock-meta{
font-family:"Plus Jakarta Sans",sans-serif;
font-size:20px;
font-weight:500;
letter-spacing:0.02em;
color:#333;
position:relative;
z-index:2;
}

.stock-meta div{
margin-top:8px;
}

.meta-label{
font-weight:700;
}

.meta-extra{
  font-weight:400;
  opacity:0.8;
  margin-left:4px;
}

.stock-meta div{
  margin-top:10px;
  line-height:1.5;
}

/* RESPONSIVE */

@media(max-width:1024px){

.stock-cards-wrapper{
    --columns:2;
  }

.stock-card{
width:calc(50% - 10px);
}

}

@media(max-width:600px){

.stock-cards-wrapper{
    --columns:1;
  }

.stock-card{
width:100%;
}

.stock-title{
font-size:36px !important;
}

.gain-label{
font-size:28px !important;
}

.meta-label{
font-size: 16px !important;
}

}



@media(max-width:600px){
  .stock-cards-wrapper{
    --columns:1;
  }
}