:root{
    --primary:#6c63ff;
    --secondary:#f4f1ff;
    --dark:#111;
    --light:#fff;
}

.planetarte-home{
    display:grid;
    grid-template-columns:2fr 1fr;
    gap:20px;
    margin:30px auto;
}

.planetarte-hero{
    background:#ecebff;
    border-radius:20px;
    min-height:380px;
    padding:40px;
}

.planetarte-side{
    display:grid;
    gap:20px;
}

.planetarte-card{
    background:#f8f8f8;
    border-radius:20px;
    padding:20px;
}

.planetarte-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
    gap:25px;
    margin-top:40px;
}

.planetarte-product{
    background:#fff;
    border-radius:20px;
    overflow:hidden;
    box-shadow:0 4px 15px rgba(0,0,0,.08);
    transition:.3s;
}

.planetarte-product:hover{
    transform:translateY(-5px);
}

.planetarte-product img{
    width:100%;
    height:250px;
    object-fit:cover;
}

.planetarte-info{
    padding:20px;
}

.planetarte-btn{
    display:inline-block;
    padding:12px 20px;
    border-radius:12px;
    background:var(--primary);
    color:#fff;
    text-decoration:none;
}

#planetarte-modal{
    position:fixed;
    inset:0;
    background:rgba(0,0,0,.7);
    z-index:99999;
    display:none;
    align-items:center;
    justify-content:center;
}

.planetarte-modal-box{
    background:#fff;
    width:90%;
    max-width:1100px;
    border-radius:25px;
    padding:30px;
}

.planetarte-modal-content{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:40px;
}

@media(max-width:768px){
    .planetarte-home,
    .planetarte-modal-content{
        grid-template-columns:1fr;
    }
}