/*
Theme Name: Loja Completa Home + Produto Renner
Description: Tema com homepage de catálogo + página individual de produto estilo Renner
Version: 1.0
*/

body{margin:0;font-family:Arial,sans-serif;background:#fff;color:#111}
a{text-decoration:none;color:inherit}
.container{width:min(1200px,calc(100% - 40px));margin:auto}

header{padding:20px;border-bottom:1px solid #eee}
.logo{font-size:24px;font-weight:bold}

.hero{padding:60px 0;text-align:center;background:#f7f7f7}
.hero h1{font-size:48px;margin:0 0 10px}

.products-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:20px;
padding:50px 0;
}

.card{
border:1px solid #eee;
padding:15px;
transition:.2s;
}
.card:hover{box-shadow:0 10px 20px rgba(0,0,0,.08)}
.card-img{
height:320px;
background:linear-gradient(180deg,#ddd,#bbb);
}
.card h3{font-size:16px}
.price{font-weight:bold}

.product-layout{
display:grid;
grid-template-columns:100px 1fr 400px;
gap:30px;
padding:40px 0;
}

.thumbs div{
height:90px;
background:#ddd;
margin-bottom:12px;
}

.main-image{
height:650px;
background:linear-gradient(180deg,#eee,#ccc);
}

.buy-btn{
background:#d91d25;
color:white;
border:none;
padding:16px;
width:100%;
font-weight:bold;
cursor:pointer;
}

.sizes button{
padding:10px 14px;
margin-right:8px;
border:1px solid #ddd;
background:white;
}

@media(max-width:900px){
.products-grid{grid-template-columns:repeat(2,1fr)}
.product-layout{grid-template-columns:1fr}
}