.resource-container{
max-width:1100px;
margin:0 auto;
padding:2rem;
}

.resource-hero{
text-align:center;
margin-bottom:3rem;
}

.resource-grid{
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    gap:2rem;
}

.resource-card{
background:#fff;
border-radius:12px;
overflow:hidden;
box-shadow:0 4px 12px rgba(0,0,0,.08);
transition: all .25s ease;
}

.resource-card:hover{
transform:translateY(-8px);
}

.resource-card img{
width:100%;
height:220px;
object-fit:cover;
}

.resource-card h2{
padding:1rem 1rem .5rem;
font-size: 1.3rem;
}

.resource-card p{
padding:0 1rem 1rem;
min-height: 60px;
}

.guide-hero{
    text-align:center;
    margin-bottom:4rem;
}

.guide-description{
    max-width:700px;
    margin:1rem auto;
    line-height:1.8;
}

.guide-actions{
    display:flex;
    justify-content:center;
    gap:1rem;
    flex-wrap:wrap;
    margin-top:2rem;
}

.guide-cover{
width:100%;
max-width:400px;
display:block;
margin:0 auto 2rem;
border-radius:12px;
}

.guide-section{
margin-top:3rem;
}

.example-box{
    background:#f8fafc;
    border-left:5px solid #2563eb;
    padding:1.5rem;
    border-radius:12px;
    font-family:monospace;
    line-height:1.8;
    margin-top:1rem;
}

.btn-primary,
.download-btn{
display:inline-block;
margin-top:1rem;
padding:.75rem 1.25rem;
border-radius:8px;
text-decoration:none;
}

@media (max-width:768px){
    .resource-grid{
        grid-template-columns:1fr;
    }
}