/*
Theme Name: EYE-WATCH
Theme URI: https://eye-watch.be
Description: EYE-WATCH child theme gebaseerd op spacious
Author EYE-WATCH
Template: spacious
Version: 1.0
*/

/*
* EYE-WATCH HUISSTIJL
Basiskleuren gebaseerd op flyer
*/

@import url("../spacious/style.css");

:root {
	--ew-orange: #F9A001;
	--ew-orange-dark: #E58F00;

	--ew-black: #111111;
	--ew-text: #333333;

	--ew-cream: #FF9F2;
	--ew-cream-light: #FF4E5;

	--ew-white: #FFFFF;

	--ew-border: #F5D7B1;
}

.services {
    max-width: 1400px;
    margin: 80px auto;
    padding: 0 20px;
}

.services h2 {
    text-align: center;
    font-size: 3rem;
    margin-bottom: 60px;
}

.services-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px;
}

.service-card {
    display: flex;
    flex-direction: column;
    gap: 20px;
	background: var(--ew-white);
	padding: 20px;
	border-radius: 20px;
	box-shadow: 0 5px 15px rgba(0,0,0,.1);
	transition: 0.3s;
	
}

.service-button {
    display: block;
    text-align: center;
    padding: 15px;
    border: 2px solid var(--ew-orange);
    border-radius: 50px;
    text-decoration: none;
    font-weight: bold;
color: var(--ew-orange);
}

.service-card img {
    width: 100%;
    border-radius: 15px;
}

.service-card:hover {
    transform: translateY(-5px);
}