body{
margin:0;
padding:0;
background:#000;
color:#f5e6c8;
font-family:Georgia,serif;
}

.hero{
padding:60px 20px;
text-align:center;
background:linear-gradient(to bottom,#000,#111);
}

.brand-header h1{
color:#d4b06a;
font-size:70px;
letter-spacing:8px;
margin-bottom:15px;
}

.divider{
display:flex;
justify-content:center;
align-items:center;
gap:15px;
}

.line{
width:120px;
height:1px;
background:#d4b06a;
}

.star{
color:#d4b06a;
font-size:20px;
}

.tagline{
font-size:26px;
font-style:italic;
color:#d4b06a;
margin-top:20px;
}

.offer-box{
margin:50px auto;
border:1px solid #d4b06a;
padding:25px;
max-width:500px;
border-radius:12px;
}

.offer-box h2{
color:#d4b06a;
margin-bottom:25px;
}

.offer-box p{
font-size:24px;
margin:14px 0;
}

.strike{
text-decoration:line-through;
opacity:0.7;
}

.button-wrap{
margin-top:40px;
}

.btn{
display:inline-block;
margin:10px;
padding:16px 35px;
border-radius:10px;
text-decoration:none;
font-weight:bold;
font-size:20px;
}

.order{
background:#d4b06a;
color:#000;
}

.shop{
border:1px solid #d4b06a;
color:#d4b06a;
}

.story{
padding:70px 20px;
text-align:center;
max-width:900px;
margin:auto;
}

.story h2{
font-size:42px;
color:#d4b06a;
}

.story p{
font-size:22px;
line-height:1.8;
}

.products{
padding:50px 20px;
text-align:center;
}

.products h2{
font-size:42px;
color:#d4b06a;
}

.card{
border:1px solid #d4b06a;
margin:25px auto;
padding:30px;
max-width:320px;
border-radius:12px;
}

.card h3{
font-size:34px;
margin-bottom:10px;
color:#d4b06a;
}

.card p{
font-size:20px;
}

footer{
padding:30px;
text-align:center;
background:#111;
}

@media(max-width:768px){
.brand-header h1{
font-size:42px;
}
.tagline{
font-size:20px;
}
.offer-box p{
font-size:18px;
}
.line{
width:60px;
}
}