*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:Arial,sans-serif;
}

body{
background:#f9f5ed;
color:#333;
}

header{
display:flex;
justify-content:space-between;
align-items:center;
padding:15px 5%;

}

.logo img{
width:150px;
}

.logo h2{
font-size:18px;
color:#b8860b;
}

nav a{
text-decoration:none;
margin-left:20px;
color:#b8860b;

}

.hero{
display:flex;
justify-content:space-between;
align-items:center;
padding:50px 8%;
flex-wrap:wrap;
background-color: #eee6d2;
}

.hero-text{
max-width:450px;
}

.hero-text h1{
font-size:48px;
margin-bottom:20px;
}

.hero-text p{
font-size:15px;
line-height:1.7;
}

.hero-image img{
width:500px;
max-width:100%;
border-radius:10px;
}

.story{
display:flex;
align-items:center;
gap:40px;
padding:60px 8%;
background:white;
flex-wrap:wrap;
}

.story img{
width:450px;
max-width:100%;
border-radius:10px;
}

.story h2{
font-size:40px;
color:#b8860b;
margin-bottom:15px;
}
.hero-text .story-text p{
    color: antiquewhite;
}

.scheme{
padding:70px 8%;
text-align:center;
text-decoration: none;
}

.scheme h2{
font-size:42px;
color:#b8860b;
margin-bottom:40px;
}

.cards{
display:flex;
justify-content:center;
gap:130px;
flex-wrap:wrap;
}

.card{
background:white;
padding:2px;
border-radius:10px;
width:250px;
}

.card img{
width:100%;
}

.card p{
margin-top:10px;
color:#b8860b;
}
.card p a{
text-decoration: none;
color:#b8860b;
font-size: 30;
font-weight: bold;

}


button{
margin-top:35px;
padding:12px 30px;
background:#d39b42;
color:white;
border:none;
border-radius:5px;
cursor:pointer;
}

button a{
text-decoration: none;
color: white;
font-weight: bold;
}

.testimonial{
padding:70px 8%;
background:white;
text-align:center;
background-color: #eee6d2;
}

.testimonial h2{
font-size:42px;
color:#b8860b;
margin-bottom:40px;
}

.reviews{
display:flex;
justify-content:center;
gap:30px;
flex-wrap:wrap;

}

.review{
width:280px;
}

.review img{
width:80px;
height:80px;
border-radius:50%;
}

.review h4{
margin:15px 0;
}

.qrcode{
text-align: center;
background-color: #eee6d2;
}
.qrcode h4{
color: #b8860b;
}


footer{
display:flex;
justify-content:space-around;
padding:20px;

flex-wrap:wrap;
}

footer h4{
margin-bottom:15px;
margin-top: 10px;
color:#b8860b;
}
footer p{
margin-bottom:5px;

}

@media(max-width:768px){

header,
.hero,
.story,
footer{
flex-direction:column;
text-align:center;
}

nav{
margin-top:20px;
}

.hero-text h1{
font-size:34px;
}

}






  /* FOOTER STYLES START HERE */
        
        
        .footer-local__map iframe {
            width: 100%;
            height: 100%;
            min-height: 250px;
            border: 0;
            border-radius: 8px;
        }

        .footer-local__bottom {
            padding-top: 1.5rem;
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 1.5rem;
            text-align: center;
            font-size: 0.875rem;
        }
        
    

        .footer-local__social ul {
            margin: 0;
            padding: 0;
            list-style: none;
            display: flex;
            gap: 0.7 rem;
            justify-content: center;
        }
        .footer-local__social a { color: var(--footer-text); transition: color 0.2s; }
        .footer-local__social a:hover { color: var(--footer-link-hover); }
        .footer-local__social svg { width: 22px; height: 22px; fill: currentColor; }
        
        /* Media query for larger screens */
        @media (min-width: 992px) {
            .footer-local__main {
                grid-template-columns: 1fr 1.2fr; /* Give slightly more space to map */
                gap: 4rem;
            }
            .footer-local__bottom {
                flex-direction: row;
                justify-content: space-between;
            }
        }