/* ---------- Features Dark ---------- */
.features-dark { position:relative; isolation:isolate; width:100%; padding:105px 0 115px; overflow:hidden; color:#fff; background-color:var(--backgroundColorBlack); background-image:var(--features-dark-background,none); background-position:center; background-repeat:no-repeat; background-size:cover; }
.features-dark__overlay { position:absolute; z-index:0; inset:0; background:rgba(7,7,7,.68); pointer-events:none; }
.features-dark__container { position:relative; z-index:2; width:calc(100% - 40px); max-width:var(--container-width); margin:0 auto; }
.features-dark__header { width:100%; max-width:880px; margin:0 auto 48px; text-align:center; }
.features-dark__eyebrow { margin:0 0 6px; color:var(--backgroundColorOrange); font-size:14px; line-height:1.4; font-weight:700; text-transform:uppercase; }
.features-dark__title { width:100%; max-width:880px; margin:0 auto; color:#fff; font-size:clamp(30px,2.2vw,38px); line-height:1.18; font-weight:700; letter-spacing:-.025em; text-wrap:balance; }
.features-dark__title span { color:var(--backgroundColorOrange); }
.features-dark__title.line_center { margin-bottom:0; padding-bottom:14px!important; }
.features-dark__description { width:100%; max-width:760px; margin:14px auto 0; color:rgba(255,255,255,.92); font-size:16px; line-height:1.65; }
.features-dark__description p { margin:0; }
.features-dark__description p + p { margin-top:12px; }
.features-dark__grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:28px; align-items:stretch; }
.features-dark__item { position:relative; display:flex; align-items:center; flex-direction:column; min-width:0; min-height:265px; padding:28px 24px 26px; color:#fff; background:rgba(15,15,15,.97); border:1px solid rgba(255,255,255,.08); border-radius:18px; box-shadow:0 18px 42px rgba(0,0,0,.22); text-align:center; transform:translateY(0); transition:border-color .3s ease,box-shadow .3s ease,transform .3s ease; }
.features-dark__item:hover { border-color:var(--backgroundColorOrange); box-shadow:0 24px 52px rgba(0,0,0,.32); transform:translateY(-5px); }
.features-dark__icon { display:flex; align-items:center; justify-content:center; flex:0 0 auto; width:80px; height:80px; margin:0 0 24px; color:var(--backgroundColorOrange); border:1px solid var(--backgroundColorOrange); border-radius:50%; transition:color .3s ease,background-color .3s ease,transform .3s ease; }
.features-dark__item:hover .features-dark__icon { color:#fff; background:var(--backgroundColorOrange); transform:scale(1.04); }
.features-dark__icon .kami-icon { display:block; width:43px; height:43px; color:currentColor; }
.features-dark__icon .dashicons { display:block; width:43px; height:43px; color:currentColor; font-size:43px; line-height:43px; }
.features-dark__icon svg { display:block; width:43px; height:43px; color:currentColor; fill:none; stroke:currentColor; }
.features-dark__icon-image { display:block; width:43px; height:43px; margin:0; border:0; border-radius:0; object-fit:contain; }
.features-dark__item-title { position:relative; margin:0 0 17px; padding:0 0 15px; color:#fff; font-size:17px; line-height:1.35; font-weight:700; }
.features-dark__item-title::after { position:absolute; bottom:0; left:50%; width:30px; height:2px; content:""; background:var(--backgroundColorOrange); transform:translateX(-50%); transition:width .3s ease; }
.features-dark__item:hover .features-dark__item-title::after { width:52px; }
.features-dark__item-description { width:100%; margin-top:0; color:rgba(255,255,255,.92); font-size:14px; line-height:1.55; }
.features-dark__item-description p { margin:0; }
.features-dark__item-description p + p { margin-top:10px; }

@media (max-width:1100px) {
.features-dark { padding:100px 0 105px; }
.features-dark__grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; max-width:850px; margin:0 auto; }
.features-dark__item { min-height:250px; }
}

@media (max-width:767px) {
.features-dark { padding:82px 0 92px; background-position:center; }
.features-dark::before { top:-20px; height:40px; }
.features-dark::after { bottom:-20px; height:40px; }
.features-dark__container { width:calc(100% - 40px); }
.features-dark__header { max-width:none; margin:0 0 34px; text-align:left; }
.features-dark__eyebrow { margin:0 0 6px; font-size:13px; text-align:left; }
.features-dark__title { width:100%; max-width:none; margin:0; font-size:29px; line-height:1.08; text-align:left; }
.features-dark__title.line_center { margin:0; padding-bottom:16px!important; }
.features-dark__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; }
.features-dark__title.line_center::after { left:34px; bottom:2px; width:100px; height:2px; background:var(--backgroundColorOrange); transform:none; }
.features-dark__description { max-width:none; margin:14px 0 0; font-size:15px; line-height:1.65; text-align:left; }
.features-dark__grid { grid-template-columns:1fr; gap:16px; max-width:none; }
.features-dark__item { display:grid; grid-template-columns:64px minmax(0,1fr); column-gap:18px; row-gap:7px; align-items:center; min-height:0; padding:24px 22px; text-align:left; }
.features-dark__icon { grid-column:1; grid-row:1/span 2; width:62px; height:62px; margin:0; }
.features-dark__icon .kami-icon { width:34px; height:34px; }
.features-dark__icon .dashicons { width:34px; height:34px; font-size:34px; line-height:34px; }
.features-dark__icon svg { width:34px; height:34px; }
.features-dark__icon-image { width:34px; height:34px; }
.features-dark__item-title { grid-column:2; grid-row:1; margin:0; padding:0 0 10px; font-size:17px; text-align:left; }
.features-dark__item-title::after { right:auto; left:0; transform:none; }
.features-dark__item-description { grid-column:2; grid-row:2; margin:0; font-size:14px; line-height:1.55; text-align:left; }
.features-dark__item:hover { transform:none; }
}

@media (max-width:420px) {
.features-dark__container { width:calc(100% - 32px); }
.features-dark__title { font-size:27px; }
.features-dark__item { grid-template-columns:56px minmax(0,1fr); gap:6px 15px; padding:22px 18px; }
.features-dark__icon { width:54px; height:54px; }
.features-dark__icon .kami-icon { width:30px; height:30px; }
.features-dark__icon .dashicons { width:30px; height:30px; font-size:30px; line-height:30px; }
.features-dark__icon svg { width:30px; height:30px; }
.features-dark__icon-image { width:30px; height:30px; }
.features-dark__item-title { font-size:16px; }
.features-dark__item-description { font-size:13px; }
}

/* ---------- Strakker (27-09) ---------- */
@media (min-width:768px) {
.features-dark__eyebrow { margin-bottom:8px; }
.features-dark__header { margin-bottom:var(--header-gap); }
.features-dark__title { font-size:var(--h2-size); line-height:1.18; }
.features-dark__item { border-radius:var(--radius-card); }
}

/* Icons, titles and texts line up across the cards in a row, also when one title wraps to two lines. */
@media (min-width:768px) {
.features-dark__item { display:grid; grid-row:span 3; grid-template-rows:subgrid; row-gap:0; align-items:start; justify-items:center; align-content:start; min-height:0; }
.features-dark__item-title { display:flex; align-self:stretch; align-items:flex-end; justify-content:center; width:100%; }
}