/*==================================================
CARDS.CSS
==================================================*/
.card{
background:var(--bg-card);
border:1px solid var(--border-color);
border-radius:var(--card-radius);
padding:var(--card-padding);
transition:var(--transition);
box-shadow:var(--shadow-sm);
}
.card:hover{
transform:translateY(-6px);
border-color:var(--border-gold);
background:var(--bg-card-hover);
box-shadow:var(--shadow-md);
}
.card-title{
font-size:24px;
margin-bottom:15px;
}
.card-text{
color:var(--text-light);
}
.card-icon{
width:64px;
height:64px;
display:flex;
align-items:center;
justify-content:center;
border-radius:16px;
background:rgba(212,175,55,.12);
color:var(--gold-500);
font-size:28px;
margin-bottom:20px;
}
.card-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
gap:30px;
}
.lesson-card{
display:flex;
gap:20px;
align-items:flex-start;
}
.lesson-number{
width:48px;height:48px;border-radius:50%;
background:var(--gold-500);
color:#000;font-weight:700;
display:flex;align-items:center;justify-content:center;
flex-shrink:0;
}