“`html

body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
}
.hero {
background: url(‘hero-image.jpg’) center/cover no-repeat;
padding: 100px 0;
text-align: center;
color: #fff;
}
.hero h1 {
font-size: 3em;
margin-bottom: 0.5em;
}
.hero p {
font-size: 1.5em;
margin-bottom: 1em;
}
.hero button {
background-color: #000;
color: #fff;
padding: 0.75em 1.5em;
border: none;
cursor: pointer;
font-size: 1.2em;
}
.features, .benefits, .products, .trust, .cta {
padding: 50px 15%;
}
.features h2, .benefits h2, .products h2, .trust h2, .cta h2 {
font-size: 2em;
margin-bottom: 1em;
}
.features div, .benefits div {
display: flex;
justify-content: space-around;
margin-bottom: 2em;
}
.features div div, .benefits div div {
flex: 1;
text-align: center;
padding: 1em;
}
.features div div p, .benefits div div p {
margin-top: 0.5em;
}
.trust ul {
list-style-type: none;
padding: 0;
}
.trust ul li {
margin-bottom: 1em;
font-size: 1.2em;
}
.cta {
text-align: center;
}
.cta button {
background-color: #000;
color: #fff;
padding: 1em 2em;
font-size: 1.5em;
border: none;
cursor: pointer;
}
@media(max-width: 768px) {
.hero h1 { font-size: 2.5em; }
.hero p { font-size: 1.2em; }
.features div, .benefits div {
flex-direction: column;
}
}

“`