/* Dedicated phone/tablet layout, independent of the desktop canvas. */
@media (max-width: 767px) {
 .dpvc, body.dpvc-canvas #dpvc-main>.dpvc {
  width:100%; max-width:100%; margin:0;
 }
 .dpvc *, .dpvc *::before, .dpvc *::after { box-sizing:border-box; }
 .dpvc .dpvc-header, body.dpvc-canvas .dpvc-header {
  display:none!important;
 }
 .dpvc .dpvc-hero, body.dpvc-canvas .dpvc-hero {
  min-height:360px; min-height:clamp(340px,62svh,500px);
  height:auto; padding:32px 20px; align-items:flex-end;
 }
 .dpvc .dpvc-hero>div { width:100%; min-width:0; }
 .dpvc .dpvc-hero-photo { max-width:none; width:100%; height:100%; object-fit:cover; object-position:center; }
 .dpvc .dpvc-hero::after { background:linear-gradient(0deg,#10251df5,#10251d9c 60%,#10251d30); }
 .dpvc h1 { font-size:clamp(30px,8vw,40px); line-height:1.45; margin:12px 0; overflow-wrap:anywhere; }
 .dpvc h2 { font-size:clamp(26px,7vw,34px); line-height:1.5; margin:10px 0 22px; overflow-wrap:anywhere; }
 .dpvc .dpvc-projects-heading { font-size:clamp(30px,8vw,38px); line-height:1.55; margin:0 0 28px; }
 .dpvc h3 { font-size:21px; overflow-wrap:anywhere; }
 .dpvc .dpvc-hero p { font-size:16px; line-height:1.8; margin:10px 0 16px; }
 .dpvc .dpvc-button { width:100%; min-height:52px; justify-content:center; text-align:center; padding:12px 16px; font-size:16px; white-space:normal; }
 .dpvc .dpvc-section, body.dpvc-canvas .dpvc-section { padding:36px 16px; scroll-margin-top:16px; }
 .dpvc .dpvc-filters { display:flex; flex-wrap:wrap; overflow:visible; gap:8px; margin:0; padding:0 0 12px; }
 .dpvc .dpvc-filters button { min-height:48px; padding:10px 16px; font-size:15px; max-width:100%; white-space:normal; }
 .dpvc .dpvc-grid { display:grid; grid-template-columns:minmax(0,1fr); gap:20px; }
 .dpvc .dpvc-cover { width:100%; height:auto; aspect-ratio:4/3; }
 .dpvc .dpvc-cover img { height:100%; max-height:none; width:100%; object-fit:cover; }
 .dpvc .dpvc-product>img { width:100%; height:auto; aspect-ratio:4/3; object-fit:cover; }
 .dpvc .dpvc-card-body { padding:18px 16px; }
 .dpvc summary { font-size:16px; line-height:1.7; min-height:52px; padding:14px 0; }
 .dpvc .dpvc-stages { grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; }
 .dpvc .dpvc-stages button { font-size:14px; line-height:1.5; min-height:52px; padding:12px 4px; white-space:normal; overflow-wrap:anywhere; }
 .dpvc .dpvc-stage { padding:8px; }
 .dpvc .dpvc-stage img { width:100%; height:auto; object-fit:contain; }
 .dpvc .dpvc-description img { max-width:100%; height:auto; }
 .dpvc .dpvc-description table { display:block; max-width:100%; overflow:auto; }
 .dpvc .dpvc-description iframe, .dpvc .dpvc-description video { max-width:100%; }
 .dpvc .dpvc-footer { padding:24px 20px; }
}
@media (max-width:767px) and (orientation:landscape) {
 .dpvc .dpvc-hero { min-height:280px; padding-block:24px; }
}

@media (max-width:767px) {
 .dpvc .dpvc-projects { grid-template-columns:minmax(0,1fr); }
 .dpvc .dpvc-cover-open { min-height:0; }
 .dpvc .dpvc-gallery-frame { touch-action:pan-y; }
}


/* 1.6.5 — project WhatsApp-knop mag NIET de algemene 100%-breedte erven. */
@media (max-width:767px) {
 .dpvc .dpvc-project .dpvc-button {
  display:flex;
  width:fit-content;
  max-width:78%;
  min-width:0;
  min-height:46px;
  margin:18px auto 0 !important;
  padding:9px 22px;
  border-radius:999px;
  background:
   linear-gradient(118deg,transparent 0 35%,rgba(255,255,255,.13) 36%,transparent 37% 67%,rgba(255,255,255,.08) 68%,transparent 69%),
   linear-gradient(145deg,#4f5551 0%,#777b76 46%,#555a56 70%,#3f4542 100%);
  color:#fff;
  justify-content:center;
  align-items:center;
  text-align:center;
  font-size:15px;
 }
}

/* 1.6.6 — extra ademruimte tussen losse projecten op telefoon. */
@media (max-width:767px) {
 .dpvc .dpvc-projects { gap:62px; }
 .dpvc .dpvc-project { margin:0; }
}

/* 1.8.0 — klantgalerij blijft op mobiel één projectkaart per rij. */
@media (max-width:767px) {
 .dpvc .dpvc-client-gallery-section { padding-top:42px; padding-bottom:46px; }
 .dpvc .dpvc-client-gallery-grid { grid-template-columns:minmax(0,1fr); gap:30px; }
 .dpvc .dpvc-client-gallery-photos .dpvc-gallery-frame { aspect-ratio:4/3; }
}

/* 1.8.4 — fasen op mobiel direct als klikbare keuzes herkenbaar. */
@media (max-width:767px) {
 .dpvc .dpvc-project-flow-title {
  display:block;
  margin:22px 0 12px;
  padding:13px 14px;
  text-align:right;
 }
 .dpvc .dpvc-project-flow-title strong { font-size:16px; }
 .dpvc .dpvc-project-flow-title span {
  margin-top:2px;
  font-size:13px;
  white-space:normal;
 }
 .dpvc .dpvc-stages {
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:7px;
  margin-bottom:13px;
 }
 .dpvc .dpvc-stages .dpvc-stage-choice {
  min-height:72px;
  padding:9px 4px 11px;
  border-radius:12px;
 }
 .dpvc .dpvc-stage-step { width:25px; height:25px; font-size:12px; }
 .dpvc .dpvc-stage-label { font-size:14px; line-height:1.35; font-weight:800; }
}