
/* uit pagina-inhoud */
.brand-logo-box {background:white;border-radius:12px;padding:12px 20px;border:1px solid #f0e0ea;display:flex;align-items:center;justify-content:center;min-width:120px;}

/* uit pagina-inhoud */
.dienst-block { margin-bottom: 56px; padding-bottom: 56px; border-bottom: 1px solid var(--pink-mid); }
        .dienst-block:last-child { border-bottom: none; margin-bottom: 0; padding-bottom: 0; }
        .dienst-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: center; }
        .dienst-layout.reverse { direction: rtl; }
        .dienst-layout.reverse > * { direction: ltr; }
        .dienst-tekst h2 { font-family:'Poppins',sans-serif; font-size: 26px; font-weight: 800; color: var(--text); margin-bottom: 12px; }
        .dienst-tekst p { font-size: 15px; color: var(--text-mid); line-height: 1.75; margin-bottom: 16px; }
        .dienst-tekst ul { list-style: none; padding: 0; margin-bottom: 20px; }
        .dienst-tekst ul li { padding: 6px 0; font-size: 14px; color: var(--text-mid); display: flex; gap: 10px; }
        .dienst-tekst ul li::before { content: "✓"; color: #42AD47; font-weight: 900; }
        .carousel-wrap { position: relative; overflow: hidden; border-radius: 20px; background: var(--warm); padding: 20px; }
        .carousel-track { display: flex; transition: transform 0.4s ease; }
        .carousel-slide { min-width: 100%; display: flex; align-items: center; justify-content: center; height: 260px; }
        .carousel-slide img { max-height: 240px; max-width: 100%; object-fit: contain; }
        .carousel-btn { position: absolute; top: 50%; transform: translateY(-50%); background: white; border: 2px solid var(--pink-mid); border-radius: 50%; width: 36px; height: 36px; display: flex; align-items: center; justify-content: center; cursor: pointer; font-size: 16px; z-index: 10; box-shadow: 0 2px 8px rgba(0,0,0,0.1); }
        .carousel-btn:hover { background: var(--pink); color: white; border-color: var(--pink); }
        .carousel-prev { left: 8px; }
        .carousel-next { right: 8px; }
        .carousel-dots { display: flex; justify-content: center; gap: 6px; margin-top: 10px; }
        .carousel-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--pink-mid); cursor: pointer; transition: background 0.2s; }
        .carousel-dot.active { background: var(--pink); }
        @media (max-width: 768px) {
          .dienst-layout { grid-template-columns: 1fr; }
          .dienst-layout.reverse { direction: ltr; }
          .carousel-slide { height: 200px; }
        }
