.nhdc{--ink:#66524f;--muted:#88716d;--line:#d7cec5;--cream:#f8f5ef;--olive:#999b75;--taupe:#d2c9c1;--mauve:#8b625e;--gold:#b69a5c;--lavender:#8981a8;max-width:1100px;margin:2rem auto;padding:clamp(20px,4vw,44px);background:var(--cream);border:1px solid var(--line);border-radius:4px;color:var(--ink);font-family:inherit;box-shadow:0 10px 34px rgba(70,55,48,.07)}
.nhdc *{box-sizing:border-box}.nhdc__intro,.nhdc__result-head{text-align:center;max-width:660px;margin:0 auto 28px}.nhdc__eyebrow{font-size:11px;letter-spacing:.19em;color:var(--olive);font-weight:700;margin:0 0 10px}.nhdc h2,.nhdc h3,.nhdc h4{font-family:Georgia,serif;font-weight:400;letter-spacing:-.02em;margin:0 0 12px;color:var(--mauve)}.nhdc h2{font-size:clamp(30px,5vw,43px)}.nhdc h3{font-size:32px}.nhdc p{line-height:1.65}.nhdc__intro>p:last-child{color:var(--muted);margin:0}
.nhdc__form{max-width:590px;margin:auto}.nhdc__field{margin:0 0 18px}.nhdc__field label{display:block;font-size:14px;font-weight:650;margin-bottom:7px}.nhdc__field label span{font-weight:400;color:var(--muted)}.nhdc input:not([type=checkbox]),.nhdc select{width:100%;min-height:48px;padding:11px 13px;border:1px solid #cfc5bc;border-radius:3px;background:#fff;color:var(--ink);font:inherit}.nhdc input:focus,.nhdc select:focus{outline:2px solid var(--olive);outline-offset:2px}
.nhdc small{display:block;color:var(--muted);font-size:12px;line-height:1.5;margin-top:6px}.nhdc__consent{display:flex;align-items:flex-start;gap:10px;margin:22px 0;color:var(--muted);font-size:12px;line-height:1.5}.nhdc__consent input{margin-top:3px;flex:0 0 auto}.nhdc__submit,.nhdc__again{border:0;border-radius:4px;background:var(--mauve);color:#fff;padding:15px 23px;font:inherit;font-size:14px;font-weight:650;cursor:pointer}.nhdc__submit{width:100%;display:flex;justify-content:center;gap:12px}.nhdc__submit:hover,.nhdc__again:hover{background:#74514d}.nhdc__privacy,.nhdc__disclaimer{font-size:11px;color:var(--muted);text-align:center;margin:13px auto 0;max-width:560px}.nhdc__status{min-height:24px;text-align:center;color:var(--mauve);font-size:13px}
.nhdc__result{margin-top:38px;padding-top:30px;border-top:1px solid var(--line)}.nhdc__summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:24px 0}.nhdc__summary article{background:#eee9e4;border:1px solid #ded4cc;border-radius:4px;padding:16px 12px;text-align:center;min-width:0}.nhdc__summary span{display:block;color:var(--muted);font-size:12px;margin-bottom:7px}.nhdc__summary strong{display:block;font-family:Georgia,serif;font-size:18px;font-weight:400;overflow-wrap:anywhere;color:var(--mauve)}
.nhdc__graph-wrap{margin:28px auto;text-align:center;padding:24px 12px;background:#fff;border:1px solid var(--line)}.nhdc h4{font-size:23px}.nhdc__graph-note{font-size:12px;color:var(--muted);margin:0 0 12px}.nhdc__graph{width:100%;overflow-x:auto}.nhdc__graph svg{width:100%;min-width:560px;height:auto;display:block;margin:auto}.nhdc__graph-wrap{padding:18px 8px}.nhdc__graph-note{max-width:760px;margin:0 auto 12px}.nhdc__gates{border-top:1px solid var(--line);padding-top:20px}.nhdc__gates p{font-size:14px;color:var(--muted);letter-spacing:.04em;overflow-wrap:anywhere}.nhdc__again{display:block;margin:24px auto 0;background:var(--olive)}.nhdc [hidden]{display:none!important}
@media(max-width:600px){.nhdc{padding:22px 16px;border-radius:3px}.nhdc__summary{grid-template-columns:repeat(2,minmax(0,1fr))}.nhdc__summary strong{font-size:17px}.nhdc__graph-wrap{padding:14px 4px}}

/* v1.5.3: gebruik de aangeleverde SVG-BodyGraph op de beschikbare breedte. */
.nhdc__graph svg{width:100%;min-width:0;height:auto;display:block;margin:auto}

}

.nhdc__birth-details{margin:24px 0;padding:20px;background:#f7f4f0;border:1px solid #e5ddd6;border-radius:8px}
.nhdc__birth-details h4{margin:0 0 16px}
.nhdc__birth-details dl{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:0}
.nhdc__birth-details dl div{background:#eee9e4;border:1px solid #ded4cc;border-radius:4px;padding:14px 12px;text-align:center;min-width:0}
.nhdc__birth-details dt{display:block;color:var(--muted);font-size:12px;margin:0 0 7px}
.nhdc__birth-details dd{display:block;font-family:Georgia,serif;font-size:17px;font-weight:400;overflow-wrap:anywhere;color:var(--mauve);margin:0}
@media(max-width:600px){.nhdc__birth-details dl{grid-template-columns:repeat(2,minmax(0,1fr))}}

.nhdc__birth-details{margin-bottom:42px}
.nhdc__channels{margin-top:42px}


/* v1.5.30: pluginbrede typografie. Poortnummers behouden hun oorspronkelijke Calibri-opmaak. */
@import url('https://fonts.googleapis.com/css2?family=Abel&family=The+Girl+Next+Door&display=swap');
.nhdc{font-family:'Abel',sans-serif}
.nhdc,.nhdc *{font-family:'Abel',sans-serif}
.nhdc h2,.nhdc h3,.nhdc h4{font-family:'The Girl Next Door',cursive;font-weight:700;letter-spacing:0}
.nhdc__graph svg text.st4{font-family:Calibri,sans-serif!important;font-weight:400}
.nhdc__graph svg #nhdc-center-labels text{font-family:'Abel',sans-serif!important;font-weight:400}

/* v1.5.32: Design- en Personality-activaties rond de BodyGraph. */
.nhdc__bodygraph-layout{display:grid;grid-template-columns:minmax(138px,.82fr) minmax(0,2.7fr) minmax(138px,.82fr);align-items:center;gap:8px;margin:18px auto 28px;width:100%;max-width:1120px}
.nhdc__graph-wrap{min-width:0;width:100%;margin:0 auto;padding:6px 2px 10px}
.nhdc__graph-wrap h4{margin:0 0 4px}
.nhdc__activation-panel{min-width:0;text-align:center;align-self:center}
.nhdc__activation-panel h4{font-size:21px;margin:0 0 12px}
.nhdc__activation-list{list-style:none;padding:0;margin:0;display:grid;gap:5px}
.nhdc__activation-list li{display:flex;align-items:center;justify-content:center;gap:10px;min-height:27px;font-size:16px;line-height:1.2;font-variant-numeric:tabular-nums}
.nhdc__activation-list--design{color:#B97875}
.nhdc__activation-list--personality{color:#75645b}
.nhdc__planet-symbol{font-family:'Noto Sans Symbols 2','Segoe UI Symbol','DejaVu Sans',sans-serif!important;font-size:20px;line-height:1;min-width:24px;text-align:center}
.nhdc__activation-value{font-family:'Abel',sans-serif!important;min-width:34px;text-align:left}
.nhdc__graph svg{margin:0 auto}
@media(min-width:701px) and (max-width:900px){
 .nhdc__bodygraph-layout{grid-template-columns:minmax(125px,.78fr) minmax(0,2.35fr) minmax(125px,.78fr);gap:6px}
 .nhdc__activation-panel h4{font-size:19px}
 .nhdc__activation-list li{gap:6px;font-size:15px}
 .nhdc__planet-symbol{font-size:18px;min-width:21px}
}
@media(max-width:700px){
 .nhdc__bodygraph-layout{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 10px;margin:10px auto 26px;width:100%}
 .nhdc__graph-wrap{grid-column:1/-1;grid-row:1;width:100%;padding:4px 4px 8px}
 .nhdc__graph-wrap h4{margin-bottom:2px}
 .nhdc__activation-panel{width:100%;grid-row:2}
 .nhdc__activation-panel--design{grid-column:1}
 .nhdc__activation-panel--personality{grid-column:2}
 .nhdc__activation-panel h4{font-size:20px;margin:0 0 8px}
 .nhdc__activation-panel>div{width:100%}
 .nhdc__activation-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 12px;max-width:430px;margin:0 auto}
 .nhdc__activation-list li{justify-content:center;min-height:28px;font-size:15px}
}

/* v1.5.33: PDF- en e-mailacties */
.nhdc__mail-details{max-width:590px;margin:28px auto 18px;padding:20px;background:#f7f4f0;border:1px solid var(--line);border-radius:4px}
.nhdc__mail-details .nhdc__field{margin-bottom:14px}.nhdc__mail-details .nhdc__consent{margin:12px 0 0}
.nhdc__actions{display:flex;justify-content:center;flex-wrap:wrap;gap:12px;margin:22px auto}
.nhdc__action{border:0;border-radius:4px;padding:14px 20px;background:var(--mauve);color:#fff;font:inherit;font-size:14px;font-weight:650;cursor:pointer}
.nhdc__action:disabled{opacity:.6;cursor:wait}
.nhdc__email-status{min-height:22px;text-align:center;color:var(--mauve);font-size:13px}
@media(max-width:600px){.nhdc__actions{flex-direction:column}.nhdc__action{width:100%}}


/* v1.5.39: mobiele kenmerken en geboortegegevens als rustige verticale tekstlijst, zonder kaarten. */
@media(max-width:600px){
 .nhdc__summary{grid-template-columns:minmax(0,1fr);gap:0;margin:18px 0}
 .nhdc__summary article{display:flex;align-items:baseline;gap:8px;text-align:left;padding:9px 2px;background:transparent;border:0;border-bottom:1px solid var(--line);border-radius:0}
 .nhdc__summary article span{display:inline;margin:0;flex:0 0 42%;font-size:13px}
 .nhdc__summary article strong{display:inline;font-size:16px;text-align:left}
 .nhdc__birth-details{padding:14px 2px;background:transparent;border:0;border-top:1px solid var(--line);border-radius:0}
 .nhdc__birth-details dl{display:block}
 .nhdc__birth-details dl div{display:flex;align-items:baseline;gap:8px;padding:9px 2px;background:transparent;border:0;border-bottom:1px solid var(--line);border-radius:0;text-align:left}
 .nhdc__birth-details dt{flex:0 0 42%;margin:0;font-size:13px}
 .nhdc__birth-details dd{font-size:16px;text-align:left}
}


/* v1.5.42-test: rustige tekstweergave voor kenmerken en geboortegegevens op alle schermformaten. */
.nhdc__summary{
 display:block;
 margin:24px 0 30px;
}
.nhdc__summary article{
 display:flex;
 align-items:baseline;
 gap:10px;
 text-align:left;
 padding:10px 4px;
 background:transparent;
 border:0;
 border-bottom:1px solid var(--line);
 border-radius:0;
 min-width:0;
}
.nhdc__summary article span{
 display:inline;
 flex:0 0 30%;
 margin:0;
 font-size:14px;
}
.nhdc__summary article strong{
 display:inline;
 flex:1 1 auto;
 text-align:left;
 font-size:17px;
}
.nhdc__birth-details{
 margin:28px 0 38px;
 padding:18px 4px 8px;
 background:transparent;
 border:0;
 border-top:1px solid var(--line);
 border-radius:0;
}
.nhdc__birth-details h4{margin:0 0 12px}
.nhdc__birth-details dl{
 display:block;
 margin:0;
}
.nhdc__birth-details dl div{
 display:flex;
 align-items:baseline;
 gap:10px;
 padding:10px 4px;
 background:transparent;
 border:0;
 border-bottom:1px solid var(--line);
 border-radius:0;
 text-align:left;
 min-width:0;
}
.nhdc__birth-details dt{
 flex:0 0 30%;
 margin:0;
 font-size:14px;
}
.nhdc__birth-details dd{
 flex:1 1 auto;
 margin:0;
 font-family:'Abel',sans-serif;
 font-size:17px;
 text-align:left;
}
.nhdc__graph-wrap{
 padding:22px 8px 12px;
}
.nhdc__graph-wrap h4{
 margin:0 0 14px;
}
@media(max-width:600px){
 .nhdc__summary{margin:18px 0 24px}
 .nhdc__summary article{gap:8px;padding:9px 2px}
 .nhdc__summary article span,
 .nhdc__birth-details dt{flex-basis:42%;font-size:13px}
 .nhdc__summary article strong,
 .nhdc__birth-details dd{font-size:16px}
 .nhdc__birth-details{padding:14px 2px 6px}
 .nhdc__birth-details dl div{gap:8px;padding:9px 2px}
 .nhdc__graph-wrap{padding:18px 4px 10px}
 .nhdc__graph-wrap h4{margin-bottom:10px}
}


/* v1.5.44-test: kenmerken en geboortegegevens naast elkaar op desktop. */
@media(min-width:701px){
 .nhdc__result{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  column-gap:clamp(24px,4vw,48px);
  align-items:start;
 }
 .nhdc__result-head{grid-column:1/-1;width:100%}
 .nhdc__summary{grid-column:1;grid-row:2;align-self:start;margin:18px 0 28px}
 .nhdc__birth-details{grid-column:2;grid-row:2;align-self:start;margin:18px 0 28px}
 .nhdc__bodygraph-layout{grid-column:1/-1;grid-row:3}
 .nhdc__channels,
 .nhdc__mail-details,
 .nhdc__actions,
 .nhdc__email-status,
 .nhdc__again,
 .nhdc__disclaimer{grid-column:1/-1}
}
@media(max-width:700px){
 .nhdc__result{display:block}
}


/* v1.5.47-test: geboortegegevens uitlijnen met kenmerken; bovenste lijn verwijderd. */
@media(min-width:701px){
 .nhdc__birth-details{
  margin-top:18px;
  padding:0 4px 8px;
  border-top:0;
 }
}


/* v1.5.48-test: typografie en regelopmaak geboortegegevens gelijk aan kenmerken. */
.nhdc__summary article span,
.nhdc__birth-details dt{
  font-family:'Abel',sans-serif;
  font-size:14px;
  font-weight:400;
  line-height:1.5;
}
.nhdc__summary article strong,
.nhdc__birth-details dd{
  font-family:'The Girl Next Door',cursive;
  font-size:17px;
  font-weight:400;
  line-height:1.5;
}
.nhdc__summary article,
.nhdc__birth-details dl div{
  align-items:baseline;
  gap:10px;
  padding-top:10px;
  padding-bottom:10px;
}
@media(max-width:600px){
  .nhdc__summary article span,
  .nhdc__birth-details dt{font-size:13px;line-height:1.5}
  .nhdc__summary article strong,
  .nhdc__birth-details dd{font-size:16px;line-height:1.5}
  .nhdc__summary article,
  .nhdc__birth-details dl div{gap:8px;padding-top:9px;padding-bottom:9px}
}


/* v1.5.49-test: minder ruimte tussen kop 'Jouw BodyGraph' en de BodyGraph. */
.nhdc__graph-wrap h4{
  margin-bottom:6px !important;
  padding-bottom:0 !important;
}
.nhdc__graph-wrap .nhdc__bodygraph,
.nhdc__graph-wrap .nhdc__graph,
.nhdc__graph-wrap svg{
  margin-top:0 !important;
}


/* v1.5.51-test: ingevulde waarden in Abel; lettergrootte ongewijzigd. */
.nhdc__summary article strong,
.nhdc__birth-details dd{
  font-family:'Abel',sans-serif !important;
}


/* v1.5.52-test: kenmerken iets groter, met behoud van lettertype Abel. */
.nhdc__summary article span{font-size:14px !important;}
.nhdc__summary article strong{font-size:18px !important;}
@media(max-width:600px){
 .nhdc__summary article span{font-size:14px !important;}
 .nhdc__summary article strong{font-size:17px !important;}
}


/* v1.5.56-test: geactiveerde kanalen direct onder de geboortegegevens. */
.nhdc__birth-channels{
  margin:10px 0 0;
  padding:0 4px;
  border:0;
  background:transparent;
  color:inherit;
}
.nhdc__birth-channels p{
  margin:0;
  font-family:'Abel',sans-serif;
  font-size:14px;
  line-height:1.5;
}
.nhdc__birth-channels strong,
.nhdc__birth-channels span{
  font-family:'Abel',sans-serif;
  font-size:inherit;
  font-weight:400;
}


/* v1.5.57-test: geboortegegevens en kanalen vóór de BodyGraph in de DOM-volgorde. */
.nhdc__birth-channels{
  margin:8px 0 18px;
}
@media(min-width:701px){
  .nhdc__birth-channels{
    grid-column:2;
    grid-row:2;
    align-self:start;
  }
}


/* v1.5.58-test: kanalen direct onder Tijdzone, in dezelfde typografie als geboortegegevens. */
.nhdc__birth-details .nhdc__birth-channels{
  display:block;
  grid-column:auto;
  grid-row:auto;
  align-self:auto;
  margin:0;
  padding:10px 4px 0;
  border:0;
  background:transparent;
}
.nhdc__birth-details .nhdc__birth-channels p,
.nhdc__birth-details .nhdc__birth-channels strong,
.nhdc__birth-details .nhdc__birth-channels span{
  margin:0;
  padding:0;
  color:var(--mauve);
  font-family:'Abel',sans-serif !important;
  font-size:17px;
  font-weight:400;
  line-height:1.5;
}
@media(max-width:600px){
 .nhdc__birth-details .nhdc__birth-channels p,
 .nhdc__birth-details .nhdc__birth-channels strong,
 .nhdc__birth-details .nhdc__birth-channels span{font-size:16px}
}


/* v1.5.60-test: kanaallabel en doorlopende tekst uitlijnen met de geboortegegevens. */
.nhdc__birth-details .nhdc__birth-channels p{
  display:flex;
  align-items:baseline;
  gap:10px;
  margin:0;
  padding:10px 4px;
  font-family:'Abel',sans-serif;
  line-height:1.5;
}
.nhdc__birth-details .nhdc__birth-channels strong{
  flex:0 0 30%;
  font-family:'Abel',sans-serif !important;
  font-size:14px;
  font-weight:400;
  color:var(--muted);
}
.nhdc__birth-details .nhdc__birth-channels span{
  flex:1 1 auto;
  min-width:0;
  font-family:'Abel',sans-serif !important;
  font-size:17px;
  font-weight:400;
  color:var(--mauve);
  overflow-wrap:anywhere;
}
@media(max-width:600px){
  .nhdc__birth-details .nhdc__birth-channels p{gap:8px;padding:9px 2px}
  .nhdc__birth-details .nhdc__birth-channels strong{flex-basis:42%;font-size:13px}
  .nhdc__birth-details .nhdc__birth-channels span{font-size:16px}
}


/* v1.1.4-test: instelbare vormgeving voor de websitecalculator (niet voor de e-mail-PNG). */
.nhdc{
  background:var(--nhdc-bg,#f8f5ef)!important;
  color:var(--nhdc-text,#66524f)!important;
  border-color:var(--nhdc-border,#d7cec5)!important;
  font-family:var(--nhdc-body-font,'Abel',sans-serif)!important;
  font-size:var(--nhdc-body-size,16px)!important;
}
.nhdc h2,.nhdc h3,.nhdc h4,.nhdc__summary article strong,.nhdc__birth-details dd{
  color:var(--nhdc-heading,#8b625e)!important;
  font-family:var(--nhdc-heading-font,'The Girl Next Door',cursive)!important;
}
.nhdc h2{font-size:var(--nhdc-heading-size,34px)!important}
.nhdc__field label,.nhdc__summary article span,.nhdc__birth-details dt{
  font-size:var(--nhdc-label-size,14px)!important;
}
.nhdc__field label,.nhdc p,.nhdc small,.nhdc input,.nhdc select,.nhdc textarea,
.nhdc__summary article,.nhdc__birth-details dl div,.nhdc__birth-channels,
.nhdc__activation-panel,.nhdc__channels{
  color:var(--nhdc-text,#66524f);
  font-family:var(--nhdc-body-font,'Abel',sans-serif)!important;
}
.nhdc input:not([type=checkbox]),.nhdc select{
  border-color:var(--nhdc-border,#d7cec5)!important;
}
.nhdc input:focus,.nhdc select:focus{outline-color:var(--nhdc-accent,#8b625e)!important}
.nhdc__submit,.nhdc__again,.nhdc__action{
  background:var(--nhdc-button-bg,#8b625e)!important;
  color:var(--nhdc-button-text,#fff)!important;
  font-family:var(--nhdc-body-font,'Abel',sans-serif)!important;
  font-size:var(--nhdc-button-size,14px)!important;
}
.nhdc__submit:hover,.nhdc__again:hover,.nhdc__action:hover{
  filter:brightness(.92);
}
.nhdc__result,.nhdc__gates,.nhdc__birth-details,.nhdc__summary article,
.nhdc__birth-details dl div,.nhdc__graph-wrap,.nhdc__mail-details{
  border-color:var(--nhdc-border,#d7cec5)!important;
}
.nhdc__eyebrow,.nhdc__status,.nhdc__email-status{
  color:var(--nhdc-accent,#8b625e)!important;
}
.nhdc__graph-wrap{background:color-mix(in srgb,var(--nhdc-bg,#f8f5ef) 45%,white)!important}
.nhdc__summary article,.nhdc__birth-details dl div{
  background:color-mix(in srgb,var(--nhdc-bg,#f8f5ef) 70%,white)!important;
}


/* v1.1.6-test: kenmerken en geboortegegevens volgen het ingestelde gewone lettertype. */
.nhdc .nhdc__summary article strong,
.nhdc .nhdc__birth-details dd,
.nhdc .nhdc__summary article span,
.nhdc .nhdc__birth-details dt,
.nhdc .nhdc__birth-details dl div{
  font-family:var(--nhdc-body-font,'Abel',sans-serif)!important;
}


/* v1.1.3-test: geselecteerd logo onder de BodyGraph op de website. */
.nhdc__website-logo{
  display:block;
  width:auto;
  max-width:min(210px,75%);
  max-height:110px;
  height:auto;
  object-fit:contain;
  margin:18px auto 4px;
}


/* v1.1.4-test: kleine cursieve copyrightregel onder het logo op de website. */
.nhdc__website-copyright{
  margin:5px auto 2px;
  text-align:center;
  font-size:11px;
  line-height:1.35;
  font-style:italic;
  color:var(--nhdc-text,#66524f);
  opacity:.78;
}


/* v1.1.5-test: forceer zichtbaarheid van copyright direct onder het website-logo. */
.nhdc .nhdc__graph-wrap [data-website-copyright],
.nhdc .nhdc__graph-wrap .nhdc__website-copyright{
  display:block!important;
  position:relative!important;
  visibility:visible!important;
  opacity:1!important;
  width:100%!important;
  max-width:100%!important;
  height:auto!important;
  min-height:16px!important;
  overflow:visible!important;
  clear:both!important;
  margin:8px auto 12px!important;
  padding:0!important;
  text-align:center!important;
  font-family:var(--nhdc-body-font,'Abel',sans-serif)!important;
  font-size:11px!important;
  font-style:italic!important;
  font-weight:400!important;
  line-height:1.5!important;
  color:var(--nhdc-text,#66524f)!important;
  white-space:normal!important;
}


/* v1.1.6-test: herstel expliciete zichtbaarheid van het logo boven de copyrightregel. */
.nhdc .nhdc__graph-wrap img[data-website-logo]{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  width:auto!important;
  max-width:210px!important;
  max-height:110px!important;
  min-width:40px!important;
  height:auto!important;
  object-fit:contain!important;
  margin:18px auto 4px!important;
  position:relative!important;
  z-index:1!important;
}
.nhdc .nhdc__graph-wrap [data-website-copyright]{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  position:relative!important;
  z-index:1!important;
  clear:both!important;
}