/* =========================
DIENSTEN
========================= */

:root{

--color-primary:#6da544;
--color-primary-soft:#8bc34a;
--color-primary-dark:#243f1f;

--color-heading:#1e331e;
--color-text:#3f503a;

--bg-card:#ffffff;

--border:rgba(0,0,0,0.06);
--border-hover:rgba(109,165,68,0.35);

--shadow-soft:
0 8px 30px rgba(0,0,0,0.04),
0 2px 6px rgba(0,0,0,0.03);

--shadow-hover:
0 25px 65px rgba(0,0,0,0.10),
0 5px 15px rgba(0,0,0,0.05);

--radius:28px;

--transition:all .6s cubic-bezier(.16,1,.3,1);

}

/* =========================
INTRO
========================= */

.services-section .intro-text{

max-width:880px;
margin:0 auto 5rem;

text-align:center;

font-size:1.18rem;
line-height:1.9;

color:var(--color-text);

}

/* =========================
SERVICE CARD
========================= */

.service-block{

position:relative;

background:var(--bg-card);

border-radius:var(--radius);

padding:3rem 2.6rem;

margin-bottom:3rem;

border:1px solid var(--border);

box-shadow:var(--shadow-soft);

transition:var(--transition);

overflow:hidden;

/* scroll animation */

opacity:0;
transform:translateY(50px);

}

/* subtle glass highlight */

.service-block::before{

content:"";

position:absolute;

top:-120%;
left:-40%;

width:180%;
height:300%;

background:
linear-gradient(
120deg,
transparent 40%,
rgba(255,255,255,0.45) 50%,
transparent 60%
);

opacity:0;

transition:all 1.1s ease;

}

/* hover */

.service-block:hover{

transform:translateY(-12px);

box-shadow:var(--shadow-hover);

border-color:var(--border-hover);

}

/* moving light */

.service-block:hover::before{

opacity:1;

top:-40%;

}

/* scroll reveal */

.service-block.visible{

opacity:1;

transform:translateY(0);

transition:
opacity .9s cubic-bezier(.16,1,.3,1),
transform .9s cubic-bezier(.16,1,.3,1);

}

/* =========================
ICON
========================= */

.service-icon{

width:84px;
height:84px;

margin:0 auto 2rem;

display:flex;
align-items:center;
justify-content:center;

border-radius:50%;

background:
radial-gradient(
circle at 30% 30%,
rgba(109,165,68,0.18),
rgba(109,165,68,0.05)
);

transition:var(--transition);

}

.service-icon img{

width:42px;
height:42px;

transition:transform .6s ease;

}

/* icon hover */

.service-block:hover .service-icon{

transform:scale(1.1);

box-shadow:
0 0 0 6px rgba(109,165,68,0.05),
0 12px 25px rgba(0,0,0,0.08);

}

.service-block:hover .service-icon img{

transform:scale(1.12);

}

/* =========================
TITLES
========================= */

.service-block h3{

font-size:2rem;

font-weight:700;

text-align:center;

margin-bottom:1.2rem;

letter-spacing:-0.02em;

background:linear-gradient(
90deg,
var(--color-primary-dark),
var(--color-primary)
);

-webkit-background-clip:text;
background-clip:text;

-webkit-text-fill-color:transparent;

}

.service-block h4{

font-size:1.35rem;

font-weight:600;

color:var(--color-primary);

margin:2rem 0 1rem;

padding-left:18px;

position:relative;

}

/* accent line */

.service-block h4::before{

content:"";

position:absolute;

left:0;
top:50%;

width:12px;
height:3px;

border-radius:3px;

background:var(--color-primary);

transform:translateY(-50%);

}

/* =========================
TEXT
========================= */

.service-block p{

font-size:1.07rem;

line-height:1.9;

color:var(--color-text);

margin-bottom:1.35rem;

}

/* =========================
CLOSING BLOCK
========================= */

.closing-block{

text-align:center;

margin:5rem auto;

padding:4rem 3rem;

max-width:1000px;

background:#ffffff;

border-radius:32px;

border:2px solid var(--color-primary);

box-shadow:
0 30px 80px rgba(0,0,0,0.10);

position:relative;

overflow:hidden;

}

/* subtle glow */

.closing-block::before{

content:"";

position:absolute;

top:-50%;
left:-30%;

width:160%;
height:200%;

background:

radial-gradient(
circle,
rgba(109,165,68,0.12),
transparent 60%
);

opacity:.7;

}

/* heading */

.closing-block h3{

font-size:2.3rem;

margin-bottom:1.6rem;

color:var(--color-heading);

}

.closing-block h3::after{

content:"";

display:block;

width:110px;
height:4px;

margin:1.6rem auto 0;

border-radius:3px;

background:linear-gradient(
90deg,
var(--color-primary),
var(--color-primary-soft)
);

}

/* paragraph */

.closing-block p{

max-width:760px;

margin:0 auto 2.4rem;

font-size:1.2rem;

line-height:1.9;

color:var(--color-text);

}

/* button */

.closing-block .button.large{

padding:1.2rem 3rem;

font-size:1.15rem;

font-weight:600;

border-radius:40px;

transition:var(--transition);

box-shadow:
0 12px 30px rgba(109,165,68,0.35);

}

.closing-block .button.large:hover{

transform:translateY(-5px);

box-shadow:
0 20px 50px rgba(109,165,68,0.45);

}

/* =========================
MOBILE
========================= */

@media(max-width:768px){

.service-block{
padding:2.3rem 2rem;
}

.service-block h3{
font-size:1.8rem;
}

.closing-block{
padding:3rem 2rem;
margin:4rem 1rem;
}

}

@media(max-width:480px){

.closing-block h3{
font-size:1.9rem;
}

.closing-block p{
font-size:1.1rem;
}

}