/* ---------- Process Block ---------- */
.process-block { position:relative; isolation:isolate; width:100%; padding:105px 0 115px; overflow:hidden; color:#fff; background-color:var(--backgroundColorBlack); background-image:var(--process-background,none); background-position:center; background-repeat:no-repeat; background-size:cover; }
.process-block__overlay { position:absolute; z-index:0; inset:0; background:rgba(7,7,7,.68); pointer-events:none; }
.process-block__container { position:relative; z-index:2; width:calc(100% - 40px); max-width:var(--container-width); margin:0 auto; overflow:visible; }
.process-block__header { max-width:900px; margin:0 auto 42px; text-align:center; }
.process-block__eyebrow { margin:0 0 5px; color:var(--backgroundColorOrange); font-size:14px; line-height:1.4; font-weight:600; text-transform:uppercase; }
.process-block__title { max-width:900px; margin:0 auto; color:#fff; font-size:clamp(30px,2.2vw,38px); line-height:1.2; font-weight:700; letter-spacing:-.025em; text-wrap:balance; }
.process-block__title span { color:var(--backgroundColorOrange); }
.process-block__title.line_center { margin-bottom:0; padding-bottom:13px!important; }
.process-block__grid { position:relative; display:flex; align-items:stretch; gap:0; width:100%; margin:-8px 0; padding:8px 0; overflow:visible; }
.process-block__card-outer { position:relative; z-index:1; flex:1 1 0; min-width:0; margin-right:-10px; padding:1px; overflow:visible; background:var(--backgroundColorBorder); clip-path:polygon(0 0,92% 0,100% 50%,92% 100%,0 100%,8% 50%); will-change:transform; transition:background-color .3s ease,transform .3s ease,filter .3s ease; }
.process-block__card-outer:first-child { clip-path:polygon(0 0,92% 0,100% 50%,92% 100%,0 100%,0 50%); }
.process-block__card-outer:last-child { margin-right:0; }
.process-block__card-outer:hover { z-index:10; background:var(--backgroundColorOrange); filter:drop-shadow(0 12px 20px rgba(0,0,0,.28)); transform:translateY(-5px); }
.process-block__card { display:grid; grid-template-columns:54px minmax(0,1fr); gap:17px; align-items:center; width:100%; height:100%; min-width:0; padding:25px 34px; overflow:hidden; color:#fff; background:var(--backgroundColorBlack); border:0; opacity:1; clip-path:polygon(0 0,92% 0,100% 50%,92% 100%,0 100%,8% 50%); }
.process-block__card-outer:first-child .process-block__card { clip-path:polygon(0 0,92% 0,100% 50%,92% 100%,0 100%,0 50%); }
.process-block__icon { display:flex; align-items:center; justify-content:center; width:52px; height:52px; color:var(--backgroundColorOrange); border:1px solid var(--backgroundColorOrange); border-radius:50%; transition:color .3s ease,border-color .3s ease,transform .3s ease; }
.process-block__card-outer:hover .process-block__icon { transform:scale(1.05); }
.process-block__icon .kami-icon { display:block; width:28px; height:28px; color:currentColor; }
.process-block__icon .dashicons { width:28px; height:28px; color:currentColor; font-size:28px; line-height:28px; }
.process-block__card-content { min-width:0; }
.process-block__number { display:inline-flex; align-items:center; justify-content:center; min-width:28px; min-height:24px; margin:0 0 7px; padding:4px 7px; color:#fff; background:#963d00; border:1px solid #963d00; border-radius:3px; font-size:14px; line-height:1; font-weight:700; }
.process-block__card-title { margin:0 0 5px; color:#fff; font-size:17px; line-height:1.25; font-weight:600; overflow-wrap:break-word; }
.process-block__description { color:#f2f2f2; font-size:12px; line-height:1.5; }
.process-block__description p { margin:0; color:inherit; }
.process-block__description p + p { margin-top:8px; }

@media (max-width:1100px) {
.process-block { padding:100px 0 105px; }
.process-block__header { margin-bottom:38px; }
.process-block__card { padding-right:28px; padding-left:30px; }
.process-block__card-title { font-size:16px; }
}

@media (max-width:1024px) {
.process-block__grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px 0; max-width:900px; margin:0 auto; overflow:visible; }
.process-block__card-outer { width:100%; margin:0; }
.process-block__card-outer:nth-child(odd) { clip-path:polygon(0 0,92% 0,100% 50%,92% 100%,0 100%,0 50%); }
.process-block__card-outer:nth-child(odd) .process-block__card { clip-path:polygon(0 0,92% 0,100% 50%,92% 100%,0 100%,0 50%); }
.process-block__card-outer:nth-child(even) { clip-path:polygon(0 0,92% 0,100% 50%,92% 100%,0 100%,8% 50%); }
.process-block__card-outer:nth-child(even) .process-block__card { clip-path:polygon(0 0,92% 0,100% 50%,92% 100%,0 100%,8% 50%); }
.process-block__card { height:150px; padding:25px 38px; }
}

@media (max-width:767px) {
.process-block { padding:82px 0 92px; background-position:center; }
.process-block__container { width:calc(100% - 32px); }
.process-block__header { width:100%; max-width:none; margin:0 0 34px; text-align:left; }
.process-block__eyebrow { margin:0 0 6px; font-size:13px; line-height:1.4; text-align:left; }
.process-block__title { width:100%; max-width:none; margin:0; font-size:29px; line-height:1.08; letter-spacing:-.025em; text-align:left; text-wrap:balance; }
.process-block__title.line_center { width:100%; margin:0; padding-bottom:16px!important; }
.process-block__title.line_center::before { left:0; bottom:0; width:30px; height:6px; background:radial-gradient(circle,var(--backgroundColorOrange) 2px,transparent 2px) 0 0/10px 6px repeat-x; transform:none; }
.process-block__title.line_center::after { left:34px; bottom:2px; width:100px; height:2px; background:var(--backgroundColorOrange); transform:none; }
.process-block__grid { display:flex; flex-direction:column; gap:12px; width:100%; max-width:none; margin:0; overflow:visible; }
.process-block__card-outer,.process-block__card-outer:first-child,.process-block__card-outer:nth-child(odd),.process-block__card-outer:nth-child(even) { width:100%; margin:0; padding:1px; background:var(--backgroundColorBorder); clip-path:polygon(0 0,50% 5%,100% 0,100% 95%,50% 100%,0 95%)!important; }
.process-block__card-outer:hover { transform:none; }
.process-block__card-outer .process-block__card,.process-block__card-outer:first-child .process-block__card,.process-block__card-outer:nth-child(odd) .process-block__card,.process-block__card-outer:nth-child(even) .process-block__card { display:grid; grid-template-columns:58px minmax(0,1fr); gap:18px; align-items:center; width:100%; height:auto; min-height:160px; padding:30px 25px 32px; color:#fff; background:var(--backgroundColorBlack); opacity:1; clip-path:polygon(0 0,50% 5%,100% 0,100% 95%,50% 100%,0 95%)!important; }
.process-block__icon { display:flex; align-items:center; justify-content:center; width:56px; height:56px; margin:0; color:var(--backgroundColorOrange); border:1px solid var(--backgroundColorOrange); border-radius:50%; }
.process-block__icon .kami-icon { width:31px; height:31px; }
.process-block__icon .dashicons { width:31px; height:31px; font-size:31px; line-height:31px; }
.process-block__card-content { width:100%; min-width:0; }
.process-block__number { display:inline-flex; min-width:29px; min-height:25px; margin:0 7px 5px 0; padding:4px 7px; color:#fff; background:#963d00; border-color:#963d00; font-size:14px; line-height:1; vertical-align:middle; }
.process-block__card-title { display:inline; width:100%; margin:0; color:#fff; font-size:17px; line-height:1.35; font-weight:700; vertical-align:middle; }
.process-block__description { width:100%; margin-top:7px; color:#f2f2f2; font-size:13px; line-height:1.55; }
.process-block__description p { width:100%; margin:0; color:inherit; }
}

@media (max-width:420px) {
.process-block__container { width:calc(100% - 28px); }
.process-block__title { width:100%; max-width:none; font-size:28px; }
.process-block__card-outer .process-block__card,.process-block__card-outer:first-child .process-block__card,.process-block__card-outer:nth-child(odd) .process-block__card,.process-block__card-outer:nth-child(even) .process-block__card { grid-template-columns:54px minmax(0,1fr); gap:16px; min-height:158px; padding:29px 20px 31px; }
.process-block__icon { width:52px; height:52px; }
.process-block__icon .kami-icon { width:29px; height:29px; }
.process-block__icon .dashicons { width:29px; height:29px; font-size:29px; line-height:29px; }
.process-block__number { min-width:30px; min-height:26px; padding:4px 7px; font-size:15px; }
.process-block__card-title { font-size:18px; }
.process-block__description { font-size:14px; line-height:1.55; }
}

/* ---------- Strakker (27-09) ---------- */
@media (min-width:768px) {
.process-block__eyebrow { margin-bottom:8px; }
.process-block__header { margin-bottom:var(--header-gap); }
.process-block__title { font-size:var(--h2-size); line-height:1.18; }
.process-block__card { border-radius:var(--radius-card); }
}
@media (min-width:1101px) {
.process-block__card { grid-template-columns:46px minmax(0,1fr); gap:16px; align-items:start; padding:28px 40px 28px 46px; }
.process-block__icon { width:46px; height:46px; margin-top:2px; }
.process-block__number { min-height:22px; margin-bottom:8px; padding:3px 8px; border-radius:6px; font-size:12px; letter-spacing:.04em; }
.process-block__card-title { margin-bottom:6px; font-size:16px; line-height:1.3; }
.process-block__description { font-size:13.5px; line-height:1.55; color:rgba(255,255,255,.78); }
}

/* Tablet (768-1024): de vaste hoogte van 150px sneed langere stapteksten af; de kaart groeit nu mee met de tekst (QA 11-10) */
@media (min-width:768px) and (max-width:1024px) {
.process-block__card { height:100%; min-height:150px; padding-top:24px; padding-bottom:24px; }
}
