/* Dansk Træpleje – Cases (frontend) */
.dt-cases { --f:#1b3a28; --g:#2a5c3f; --mg:#3d7a56; --gold:#c49a38; --cream:#f7f3ec; --bd:#d8d0c4;
	font-family:'Source Sans 3', Arial, sans-serif; color:#333; }
.dt-cases * { box-sizing:border-box; }

/* Filter (vælg ydelse) */
.dt-cases-filter { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 28px; }
.dt-cf { border:1.5px solid var(--bd); background:#fff; border-radius:30px; padding:8px 18px;
	font-size:14px; font-weight:600; font-family:inherit; cursor:pointer; color:#444; transition:all .15s; }
.dt-cf:hover { border-color:var(--mg); color:var(--f); }
.dt-cf.active { background:var(--f); border-color:var(--f); color:#fff; }

/* Grid */
.dt-cases-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); gap:26px; }
.dt-case { background:#fff; border:1px solid var(--bd); border-radius:12px; overflow:hidden;
	display:flex; flex-direction:column; box-shadow:0 4px 18px rgba(27,58,40,.07); }

/* Karrusel */
.dt-case-carousel { position:relative; aspect-ratio:4/3; overflow:hidden; background:#e6ded0; }
.dt-case-track { display:flex; height:100%; transition:transform .5s ease; }
.dt-case-slide { min-width:100%; height:100%; }
.dt-case-slide img { width:100%; height:100%; object-fit:cover; display:block; }
.dt-case-nav { position:absolute; top:50%; transform:translateY(-50%); width:36px; height:36px;
	border:none; border-radius:50%; background:rgba(27,58,40,.55); color:#fff; font-size:22px; line-height:1;
	cursor:pointer; display:flex; align-items:center; justify-content:center; opacity:0; transition:opacity .2s; }
.dt-case-carousel:hover .dt-case-nav { opacity:1; }
.dt-case-nav.prev { left:10px; }
.dt-case-nav.next { right:10px; }
.dt-case-dots { position:absolute; bottom:10px; left:0; right:0; display:flex; justify-content:center; gap:6px; }
.dt-case-dot { width:8px; height:8px; border-radius:50%; border:none; background:rgba(255,255,255,.55); cursor:pointer; padding:0; }
.dt-case-dot.active { background:#fff; }

/* Tekst */
.dt-case-body { padding:20px 22px; }
.dt-case-body h3 { font-family:'Playfair Display', serif; color:var(--f); font-size:20px; margin:0 0 8px; }
.dt-case-body p { color:#666; font-size:15px; line-height:1.6; margin:0; }

@media (max-width:600px) {
	.dt-cases-grid { grid-template-columns:1fr; }
	.dt-case-nav { opacity:1; }
}