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

/* NAVBAR */
nav {
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:5px 20px;
    background:white;
    box-shadow:0 2px 5px rgba(0,0,0,0.1);
    position:sticky;
    top:0;
    width:100%;
    z-index:1000;
}

.logo {
    font-weight:bold;
    font-size:20px;
    color:#0a74da;
}

.menu a {
    margin:0 15px;
    text-decoration:none;
    color:#333;
}

.phone {
    background:#0a74da;
    color:white;
    padding:10px 15px;
    border-radius:5px;
}

/* HERO */
.hero {
    height:80vh;
    background:url(Foto/e84586dc-7a63-4e68-9973-04978bd5161a.png) center / cover;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    color:black;
}

.hero-content {
    padding:30px;
}

.hero h1 {
    font-size:40px;
    margin-bottom:15px;
}

.btn {
    background:#0a74da;
    padding:12px 20px;
    color:white;
    text-decoration:none;
    display:inline-block;
    margin-top:15px;
}

/* ICONS */
.icons {
    display:flex;
    justify-content:space-around;
    padding:40px;
    text-align:center;
}

.icon-box {
    width:20%;
}

/* MERKEN SLIDER */
.slider {
    overflow:hidden;
    max-width:1000px;
    margin:40px auto;
    text-align:center;
}

.slider-track {
    display:flex;
    transition:0.5s;
}

.brand {
    min-width:33%;
    font-weight:bold;
    font-size:20px;
}

.slider-buttons {
    margin-top:10px;
}

button {
    padding:8px 15px;
    margin:5px;
}

.products {
    padding:40px 20px;
    text-align:center;
    background: white;
    color: black;
}
.products h2 {
    font-size:28px;
    margin-bottom:20px;
}
.product-grid {
    display:flex;
    justify-content:space-between;
    gap:20px;
    flex-wrap:wrap;
    max-width:1000px;
    margin:0 auto;
}
.product-card {
    color: black;
    padding: 20px;
    border-radius: 5px;
    box-shadow: 0 2px 6px rgba(0,0,0,0.08);
    flex: 1 1 calc(25% - 20px);
    max-width: calc(25% - 5px);
    box-sizing: border-box;
    text-align: left;
}

.site-footer{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:10px 20px;
    width:100%;
    box-sizing:border-box;
    background:#03498a;
    color:white;
}

/* CTA */
.cta {
    background:#0a74da;
    color:white;
    padding:30px;
    text-align:center;
}

footer{
    background:#03498a;
    color:white;
    padding:10px;
    text-align:left;
}


