/* Productenpagina en detailpagina's (PC-3000). Onder body.dr-producten. */
.dr-producten #elheader{height:auto}

/* Families-navigatie */
.dr-producten .dr-prod__families{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 36px}
.dr-producten .dr-prod__families a{padding:7px 16px;border:1px solid rgba(23,40,155,.25);border-radius:999px;
  background:#fff;font-size:15px;font-weight:600;color:var(--blue,#17289B);text-decoration:none}
.dr-producten .dr-prod__families a:hover{background:var(--blue,#17289B);color:#fff}

.dr-producten .dr-prod__familie{margin:0 0 48px;scroll-margin-top:90px}
.dr-producten .dr-prod__familienaam{font-family:'Archivo','Syne',sans-serif;font-weight:700;
  font-size:clamp(22px,2.4vw,28px);letter-spacing:-.015em;word-spacing:.15em;color:var(--ink,#1A1D2E);
  margin:0 0 18px;padding-bottom:10px;border-bottom:2px solid var(--blue,#17289B);display:inline-block}

/* Kaarten */
.dr-producten .dr-prod__raster{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:20px}
.dr-producten .dr-prod__kaart{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line,rgba(23,40,155,.13));
  border-radius:14px;padding:18px 18px 16px;text-decoration:none;color:inherit;transition:border-color .15s,box-shadow .15s}
.dr-producten .dr-prod__kaart:hover{border-color:var(--blue,#17289B);box-shadow:0 6px 20px rgba(23,40,155,.08)}
.dr-producten .dr-prod__kaart:focus-visible{outline:2px solid var(--blue,#17289B);outline-offset:3px}
.dr-producten .dr-prod__beeld{display:grid;place-items:center;aspect-ratio:4/3;margin:0 0 14px;
  background:#F4F6FB;border-radius:10px;overflow:hidden}
.dr-producten .dr-prod__beeld img{max-width:90%;max-height:90%;object-fit:contain}
.dr-producten .dr-prod__variant{font-family:'Archivo',sans-serif;font-weight:700;font-size:14px;color:var(--blue,#17289B);margin:0 0 4px}
.dr-producten .dr-prod__naam{font-family:'Archivo',sans-serif;font-weight:700;font-size:17px;line-height:1.3;
  word-spacing:.1em;color:var(--ink,#1A1D2E);margin:0 0 6px}
.dr-producten .dr-prod__info{font-size:14px;line-height:1.5;color:var(--muted,#5B6078);margin:0 0 12px}
.dr-producten .dr-prod__prijs{margin-top:auto;font-size:14px;font-weight:600;color:var(--blue,#17289B)}

.dr-producten .dr-prod__slot{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:32px;align-items:center}

/* Detail */
.dr-product .dr-prod__detail{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:start}
.dr-product .dr-prod__hoofdbeeld{display:grid;place-items:center;aspect-ratio:4/3;background:#fff;
  border:1px solid var(--line,rgba(23,40,155,.13));border-radius:16px;overflow:hidden}
.dr-product .dr-prod__hoofdbeeld img{max-width:92%;max-height:92%;object-fit:contain}
.dr-product .dr-prod__duimen{display:flex;gap:10px;margin-top:12px}
.dr-product .dr-prod__duim{width:84px;aspect-ratio:4/3;display:grid;place-items:center;padding:4px;cursor:pointer;
  background:#fff;border:2px solid var(--line,rgba(23,40,155,.13));border-radius:10px}
.dr-product .dr-prod__duim img{max-width:100%;max-height:100%;object-fit:contain}
.dr-product .dr-prod__duim.is-actief,.dr-product .dr-prod__duim:hover{border-color:var(--blue,#17289B)}
.dr-product .dr-prod__titel{font-family:'Archivo','Syne',sans-serif;font-weight:800;font-size:clamp(28px,3.4vw,40px);
  letter-spacing:-.025em;word-spacing:.18em;line-height:1.1;color:var(--ink,#1A1D2E);margin:4px 0 12px}
.dr-product .dr-prod__lead{font-size:18px;line-height:1.55;color:var(--ink,#1A1D2E);margin:0 0 6px}
.dr-product .dr-prod__merk{font-size:14px;color:var(--muted,#5B6078);margin:0 0 20px}
.dr-product .dr-prod__omschrijving{font-size:16px;line-height:1.7;color:var(--ink,#1A1D2E);margin:0 0 24px}
.dr-product .dr-prod__omschrijving ul{padding-left:1.2em}

.dr-product .dr-prod__form{background:#fff;border:1px solid var(--line,rgba(23,40,155,.13));border-top:4px solid var(--blue,#17289B);
  border-radius:0 0 16px 16px;padding:24px 24px 22px;display:grid;gap:14px}
.dr-product .dr-prod__form h2{font-family:'Archivo',sans-serif;font-weight:700;font-size:20px;word-spacing:.15em;margin:0;color:var(--ink,#1A1D2E)}
.dr-product .dr-prod__form-uitleg{font-size:14px;color:var(--muted,#5B6078);margin:-6px 0 0}
.dr-product .dr-prod__rij{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.dr-product .dr-prod__form label{display:grid;gap:6px;font-family:'Archivo',sans-serif;font-weight:600;font-size:14px;color:var(--ink,#1A1D2E)}
.dr-product .dr-prod__form input,.dr-product .dr-prod__form textarea{width:100%;box-sizing:border-box;font:inherit;font-weight:400;
  font-size:16px;padding:11px 13px;border:1px solid rgba(23,40,155,.25);border-radius:10px;background:#fff;color:var(--ink,#1A1D2E)}
.dr-product .dr-prod__form textarea{resize:vertical;min-height:100px;line-height:1.5}
.dr-product .dr-prod__form input:focus,.dr-product .dr-prod__form textarea:focus{outline:none;border-color:var(--blue,#17289B);box-shadow:0 0 0 3px rgba(23,40,155,.18)}
.dr-product .dr-prod__form .dr-btn{justify-self:start;border:0;cursor:pointer}
.dr-product .dr-prod__form .dr-btn:disabled{opacity:.7;cursor:wait}
.dr-product .dr-melding{border-radius:10px;padding:12px 14px;font-size:15px}
.dr-product .dr-melding[hidden]{display:none}
.dr-product .dr-melding--ok{background:#EAF5EE;color:#1E5A33;border-left:4px solid #2E7D4F}
.dr-product .dr-melding--fout{background:#FCEDEC;color:#8C1D18;border-left:4px solid #B3261E}
.dr-product .dr-prod__terug{margin:28px 0 0}
.dr-product .dr-prod__terug a{font-weight:600;color:var(--blue,#17289B);text-decoration:none}

@media (max-width:860px){
  .dr-product .dr-prod__detail,.dr-producten .dr-prod__slot{grid-template-columns:1fr;gap:28px}
  .dr-product .dr-prod__rij{grid-template-columns:1fr}
}