/* nl-peptides.nl · atlas */
@font-face{font-family:np-kop;src:url(np-kop.woff2) format("woff2");font-weight:200 800;font-stretch:75% 100%;font-display:swap}
@font-face{font-family:np-tekst;src:url(np-tekst.woff2) format("woff2");font-weight:400 700;font-stretch:75% 100%;font-display:swap}
:root{--np-inkt:#101820;--np-zacht:#4a5866;--np-papier:#f6f3ee;--np-kaart:#fffdf9;--np-rand:#e2dcd2;--np-koraal:#ec5b3a;--np-koraal-d:#c43f20;
--g-incretine:#2f5fd0;--g-weefsel:#178a62;--g-gh:#c27a0e;--g-mito:#7a4ad8;--g-neuro:#d23d79;--np-max:80rem;--np-r:14px;--np-schaduw:0 1px 2px rgba(16,24,32,.06),0 12px 32px -18px rgba(16,24,32,.28)}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:5.5rem}
body{margin:0;background:var(--np-papier);color:var(--np-inkt);font:400 1.0625rem/1.7 np-tekst,"Helvetica Neue",Arial,sans-serif;-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:np-kop,np-tekst,sans-serif;line-height:1.08;letter-spacing:-.025em;font-weight:700;text-wrap:balance}
h1{font-size:clamp(2.2rem,5.2vw,4rem);margin:.15em 0 .35em;font-weight:800}
h2{font-size:clamp(1.35rem,2.4vw,1.75rem);margin:2.4rem 0 .7rem}
h3{font-size:1.15rem}
a{color:var(--np-koraal-d);text-decoration-thickness:1.5px;text-underline-offset:.2em}
a:hover{color:var(--np-inkt)}
:focus-visible{outline:3px solid var(--np-koraal);outline-offset:3px;border-radius:4px}
[data-g=incretine]{--g:var(--g-incretine)}[data-g=weefsel]{--g:var(--g-weefsel)}[data-g=gh]{--g:var(--g-gh)}[data-g=mito]{--g:var(--g-mito)}[data-g=neuro]{--g:var(--g-neuro)}
.np-spring{position:absolute;left:.5rem;top:-4rem;background:#fff;color:var(--np-inkt);padding:.6rem 1rem;border-radius:8px;z-index:20;font-weight:700}.np-spring:focus{top:.5rem}
.np-strook{margin:0;background:var(--np-inkt);color:#f3c9bd;text-align:center;font-size:.78rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;padding:.45rem 1rem}
/* header */
.np-kop{position:sticky;top:0;z-index:10;background:rgba(246,243,238,.86);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid var(--np-rand)}
.np-kop-in{max-width:var(--np-max);margin:0 auto;padding:.8rem 1.5rem;display:flex;gap:1rem 2rem;align-items:center;justify-content:space-between}
.np-woordmerk{display:inline-flex;align-items:center;gap:.7rem;color:var(--np-inkt);text-decoration:none;font:800 1.4rem np-kop,sans-serif;letter-spacing:-.035em}
.np-woordmerk i,.np-voet-merk i{color:var(--np-koraal);font-style:normal}
.np-woordmerk-tegel{position:relative;display:grid;place-items:end start;width:2.6rem;height:2.6rem;padding:.25rem .35rem;border-radius:9px;background:var(--np-koraal);color:#fff;font-size:1.05rem;line-height:1;box-shadow:inset 0 -3px 0 rgba(0,0,0,.15)}
.np-woordmerk-tegel small{position:absolute;top:.25rem;left:.35rem;font:600 .5rem np-tekst,sans-serif;opacity:.85}
.np-menu{display:flex;gap:.2rem;background:var(--np-kaart);border:1px solid var(--np-rand);border-radius:999px;padding:.25rem}
.np-menu a{color:var(--np-inkt);text-decoration:none;font-weight:600;font-size:.92rem;padding:.42rem .9rem;border-radius:999px;white-space:nowrap;transition:background .2s,color .2s}
.np-menu a:hover{background:var(--np-papier)}
.np-menu a[aria-current]{background:var(--np-inkt);color:#fff}
.np-menu a[href="/peptides-kopen/"]:not([aria-current]){color:var(--np-koraal-d)}
/* frame */
.np-raam{max-width:var(--np-max);margin:0 auto;padding:1.5rem 1.5rem 4rem;display:grid;grid-template-columns:16rem minmax(0,1fr);gap:3rem;align-items:start}
.np-raam--vol{grid-template-columns:minmax(0,1fr)}
.np-hoofd{min-width:0}
.np-register{position:sticky;top:6rem;font-size:.9rem;max-height:calc(100vh - 7rem);overflow:auto;scrollbar-width:thin;padding-right:.4rem}
.np-register summary{font:700 .78rem np-tekst,sans-serif;text-transform:uppercase;letter-spacing:.12em;color:var(--np-zacht);cursor:pointer;list-style:none;padding:.3rem 0}
.np-register summary::-webkit-details-marker{display:none}
.np-reg-kop{margin:1.1rem 0 .3rem;font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;color:var(--np-zacht);font-weight:700;border-top:1px solid var(--np-rand);padding-top:.7rem}
.np-register ul{list-style:none;margin:0;padding:0}
.np-register li a{display:flex;align-items:center;gap:.6rem;padding:.25rem .4rem;border-radius:8px;color:var(--np-inkt);text-decoration:none;transition:background .15s}
.np-register li a:hover{background:var(--np-kaart)}
.np-register li a[aria-current]{background:var(--np-kaart);box-shadow:var(--np-schaduw);font-weight:700}
.np-register b{display:inline-grid;place-items:center;width:1.9rem;height:1.6rem;border-radius:6px;background:var(--g);color:#fff;font:700 .72rem np-kop,sans-serif}
.np-kruimel ol{list-style:none;display:flex;flex-wrap:wrap;gap:.35rem;margin:0;padding:0;font-size:.84rem;color:var(--np-zacht)}
.np-kruimel li+li::before{content:"→";margin-right:.35rem;color:#b5ab9c}
.np-kruimel a{color:var(--np-zacht);text-decoration:none}.np-kruimel a:hover{color:var(--np-koraal-d)}
.np-lead{font-size:clamp(1.12rem,1.6vw,1.3rem);line-height:1.6;color:#33404d;max-width:42rem}
/* home */
.np-intro{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);grid-template-areas:"b k" "h k" "l k" "c k";column-gap:3rem;align-items:center;padding:2.5rem 0 1.5rem}
.np-intro>*{grid-column:1}.np-boventitel{grid-area:b}.np-intro h1{grid-area:h}.np-intro .np-lead{grid-area:l}.np-intro-cijfers{grid-area:c}
.np-boventitel{margin:0;display:inline-flex;align-items:center;gap:.6rem;font-size:.8rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--np-koraal-d)}
.np-boventitel::before{content:"";width:2rem;height:2px;background:currentColor}
.np-intro h1{font-size:clamp(2.5rem,5.6vw,4.6rem);line-height:.98}
.np-intro-cijfers{display:flex;gap:2.5rem;margin-top:1rem}
.np-intro-cijfers p{margin:0;font-size:.85rem;color:var(--np-zacht);line-height:1.3}
.np-intro-cijfers b{display:block;font:800 2rem np-kop,sans-serif;color:var(--np-inkt);letter-spacing:-.03em}
.np-keten{grid-area:k;grid-column:2;width:100%;height:auto;color:#cfc6b8;overflow:visible}
.np-keten-lijn{stroke-dasharray:900;stroke-dashoffset:900;animation:np-teken 2.4s .2s ease-out forwards}
.np-kralen circle{fill:var(--k);stroke:var(--np-papier);stroke-width:5;transform-box:fill-box;transform-origin:center;animation:np-pop .6s cubic-bezier(.3,1.6,.5,1) both}
.np-kralen circle:nth-child(2){animation-delay:.35s}.np-kralen circle:nth-child(3){animation-delay:.7s}.np-kralen circle:nth-child(4){animation-delay:1.05s}.np-kralen circle:nth-child(5){animation-delay:1.4s}
.np-kraal-tekst text{font:700 13px np-kop,sans-serif;fill:#fff}
.np-binding text{font:600 11px ui-monospace,Menlo,monospace;fill:var(--np-zacht)}
@keyframes np-teken{to{stroke-dashoffset:0}}@keyframes np-pop{from{transform:scale(0)}}
.np-tabelblok{position:relative;background:var(--np-inkt);color:#fff;border-radius:28px;padding:clamp(1.2rem,3vw,2.4rem);margin:1.5rem 0 3.5rem;box-shadow:0 40px 80px -40px rgba(16,24,32,.6);overflow:hidden}
.np-tabelblok::before{content:"";position:absolute;inset:0;background:radial-gradient(40rem 20rem at 100% 0,rgba(236,91,58,.22),transparent 60%),radial-gradient(30rem 20rem at 0 100%,rgba(47,95,208,.25),transparent 60%);pointer-events:none}
.np-tabelblok>*{position:relative}
.np-tabelbalk{display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;align-items:end}
.np-tabelbalk h2{margin:0;color:#fff;font-size:clamp(1.6rem,3vw,2.3rem)}
.np-zoek{display:grid;gap:.35rem;font-size:.78rem;color:#a9b4bf;letter-spacing:.04em}
.np-zoek input{font:inherit;font-size:1rem;padding:.7rem 1rem .7rem 2.4rem;border-radius:999px;border:1px solid #33414e;background:#1a2530 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%23a9b4bf' stroke-width='2'%3E%3Ccircle cx='7' cy='7' r='5'/%3E%3Cpath d='m11 11 4 4'/%3E%3C/svg%3E") no-repeat .9rem center;color:#fff;min-width:18rem}
.np-zoek input:focus{border-color:var(--np-koraal);outline:none;box-shadow:0 0 0 3px rgba(236,91,58,.35)}
.np-tabel{list-style:none;margin:1.6rem 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(8.2rem,1fr));gap:.7rem}
.np-tegel a{position:relative;display:flex;flex-direction:column;justify-content:flex-end;aspect-ratio:1/1;padding:.75rem;border-radius:14px;background:linear-gradient(160deg,color-mix(in srgb,var(--g) 80%,#fff),var(--g) 55%,color-mix(in srgb,var(--g) 75%,#000));color:#fff;text-decoration:none;box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 10px 24px -14px #000;transition:transform .2s cubic-bezier(.3,1.4,.5,1),box-shadow .2s}
.np-tegel a:hover,.np-tegel a:focus-visible{transform:translateY(-4px) rotate(-1deg);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 18px 34px -14px #000;color:#fff}
.np-tegel-nr{position:absolute;top:.6rem;left:.75rem;font:600 .72rem ui-monospace,Menlo,monospace;opacity:.75}
.np-tegel-sym{font:800 2.5rem/1 np-kop,sans-serif;letter-spacing:-.04em;margin-bottom:auto;margin-top:1.1rem}
.np-tegel-naam{font-size:.8rem;font-weight:600;line-height:1.2}
.np-geen{color:#d8e1e7}.np-geen a{color:#fff}
.np-legenda{list-style:none;display:flex;flex-wrap:wrap;gap:.5rem 1.4rem;margin:1.5rem 0 0;padding:1.2rem 0 0;border-top:1px solid #2a3642;font-size:.82rem;color:#bcc6cf}
.np-legenda span{display:inline-block;width:.75rem;height:.75rem;border-radius:50%;background:var(--g);margin-right:.45rem;vertical-align:-.05rem}
.np-kolommen{display:grid;grid-template-columns:repeat(auto-fit,minmax(20rem,1fr));gap:1.5rem}
.np-kolommen>section{background:var(--np-kaart);border:1px solid var(--np-rand);border-radius:22px;padding:clamp(1.3rem,3vw,2.2rem);box-shadow:var(--np-schaduw)}
.np-kolommen h2{margin-top:0}
.np-pijl{display:inline-flex;gap:.5rem;align-items:center;font-weight:700;text-decoration:none;color:var(--np-inkt);border-bottom:2px solid var(--np-koraal);padding-bottom:.1rem}
.np-pijl::after{content:"→";transition:transform .2s}.np-pijl:hover::after{transform:translateX(4px)}
.np-vink{padding:0;list-style:none}
.np-vink li{position:relative;padding-left:2rem;margin:.6rem 0}
.np-vink li::before{content:"";position:absolute;left:0;top:.35rem;width:1.15rem;height:1.15rem;border-radius:50%;background:var(--np-koraal) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='%23fff' stroke-width='2'%3E%3Cpath d='m3 6 2 2 4-4'/%3E%3C/svg%3E") center/70% no-repeat}
/* article */
.np-artikel-kop{display:grid;grid-template-columns:auto 1fr;gap:2rem;align-items:center;margin:1.4rem 0 2rem}
.np-symbool{width:8.5rem;aspect-ratio:1/1;border-radius:22px;background:linear-gradient(160deg,color-mix(in srgb,var(--g) 78%,#fff),var(--g) 55%,color-mix(in srgb,var(--g) 72%,#000));color:#fff;display:flex;flex-direction:column;justify-content:space-between;padding:.9rem;box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 24px 40px -20px var(--g);transform:rotate(-3deg)}
.np-symbool span{font:800 3.6rem/1 np-kop,sans-serif;letter-spacing:-.04em}
.np-symbool small{font-size:.66rem;line-height:1.25;font-weight:600;opacity:.92}
.np-artikel-kop h1{margin-top:0}.np-artikel-kop .np-lead{margin-bottom:0}
.np-artikel-lijf,.np-artikel--tekst{background:var(--np-kaart);border:1px solid var(--np-rand);border-radius:24px;padding:.6rem clamp(1.2rem,4vw,3rem) 2.2rem;box-shadow:var(--np-schaduw)}
.np-artikel--tekst{margin-top:1.2rem}
.np-artikel--tekst>h1{margin-top:1.4rem}
.np-artikel-lijf p,.np-artikel--tekst p,.np-artikel-lijf ul,.np-artikel--tekst ul{max-width:42rem}
.np-artikel-lijf section>h2::before,.np-artikel--tekst>h2::before{content:"";display:block;width:2.2rem;height:4px;border-radius:2px;background:var(--g,var(--np-koraal));margin-bottom:.8rem}
.np-artikel-lijf{--g:inherit}
.np-stofkaart{margin:1.8rem 0 .5rem;display:grid;grid-template-columns:repeat(auto-fit,minmax(11rem,1fr));gap:1px;background:var(--np-rand);border:1px solid var(--np-rand);border-radius:16px;overflow:hidden}
.np-stofkaart div{padding:.8rem 1rem;background:var(--np-papier)}
.np-stofkaart div:first-child{background:var(--g);color:#fff}.np-stofkaart div:first-child dt{color:rgba(255,255,255,.8)}
.np-stofkaart dt{font-size:.7rem;text-transform:uppercase;letter-spacing:.1em;color:var(--np-zacht);font-weight:700}
.np-stofkaart dd{margin:.15rem 0 0;font-weight:600;overflow-wrap:anywhere}
table{border-collapse:collapse;width:100%;font-size:.95rem;margin:1.5rem 0}th,td{text-align:left;padding:.6rem .8rem;border-bottom:1px solid var(--np-rand)}th{font-weight:700}
.np-let-op{margin:2rem 0 0;border:1px solid #f1c3b5;background:#fdf0eb;padding:1rem 1.2rem;border-radius:14px;font-size:.95rem}
.np-let-op p{margin:0}.np-let-op strong{color:var(--np-koraal-d)}
.np-bronblok{font-size:.9rem;color:#3c4854}
.np-bronnen{padding-left:1.4rem}.np-bronnen li{margin:.45rem 0;padding-left:.3rem}.np-bronnen li::marker{color:var(--np-koraal-d);font-weight:700}
.np-mini-rij{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:.6rem}
.np-mini{display:flex;align-items:center;gap:.6rem;padding:.35rem 1rem .35rem .35rem;background:var(--np-papier);border:1px solid var(--np-rand);border-radius:999px;text-decoration:none;color:var(--np-inkt);font-weight:600;transition:border-color .2s,transform .2s}
.np-mini b{display:grid;place-items:center;width:2.1rem;height:2.1rem;border-radius:50%;background:var(--g);color:#fff;font:700 .8rem np-kop,sans-serif}
.np-mini:hover{border-color:var(--g);color:var(--np-inkt);transform:translateY(-2px)}
/* lists, faq, kopen */
.np-groep{margin-top:2.5rem}.np-groep>p{color:var(--np-zacht);margin-top:0;max-width:42rem}
.np-lijst{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(17rem,1fr));gap:.7rem}
.np-lijst a{display:grid;grid-template-columns:auto 1fr;gap:1rem;align-items:center;height:100%;background:var(--np-kaart);border:1px solid var(--np-rand);border-radius:16px;padding:.8rem 1rem;color:var(--np-inkt);text-decoration:none;transition:box-shadow .2s,transform .2s}
.np-lijst a:hover{box-shadow:var(--np-schaduw);transform:translateY(-2px);color:var(--np-inkt)}
.np-lijst b{display:grid;place-items:center;width:3rem;height:3rem;border-radius:12px;background:var(--g);color:#fff;font:800 1.15rem np-kop,sans-serif}
.np-lijst span{font-size:.92rem;color:#3c4854;line-height:1.45}.np-lijst strong{color:var(--np-inkt);display:block;font-size:1rem}
.np-vragen{display:grid;gap:.7rem;margin-top:1.6rem}
.np-vraag{background:var(--np-kaart);border:1px solid var(--np-rand);border-radius:16px;padding:0 1.3rem;transition:box-shadow .2s}
.np-vraag[open]{box-shadow:var(--np-schaduw)}
.np-vraag summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:1rem;align-items:center;padding:1rem 0}
.np-vraag summary::-webkit-details-marker{display:none}
.np-vraag summary::after{content:"+";flex:none;display:grid;place-items:center;width:2rem;height:2rem;border-radius:50%;background:var(--np-papier);font-size:1.3rem;color:var(--np-koraal-d);transition:transform .25s}
.np-vraag[open] summary::after{transform:rotate(45deg);background:var(--np-koraal);color:#fff}
.np-vraag h2{font-size:1.1rem;margin:0}
.np-vraag p{margin:0 0 1.2rem;max-width:44rem}
.np-koopknop{display:inline-flex;align-items:center;gap:.7rem;background:var(--np-koraal);color:#fff;text-decoration:none;font-weight:700;padding:.95rem 1.6rem;border-radius:999px;box-shadow:0 14px 30px -12px rgba(236,91,58,.7);transition:transform .2s,background .2s}
.np-koopknop::after{content:"→"}.np-koopknop:hover{background:var(--np-inkt);color:#fff;transform:translateY(-2px)}
.np-kooplijst{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(16rem,1fr));gap:.8rem}
.np-kooplijst li{background:var(--np-papier);border:1px solid var(--np-rand);border-radius:14px;padding:1rem 1.1rem}
.np-kooplijst h3{margin:0 0 .3rem;font-size:1.05rem}.np-kooplijst p{margin:0;font-size:.95rem}
/* footer */
.np-voet{background:var(--np-inkt);color:#aab5bf;font-size:.9rem;padding:3rem 1.5rem 2.5rem}
.np-voet-rij,.np-voet-klein,.np-voet-merk{max-width:var(--np-max);margin:0 auto}
.np-voet-rij{display:grid;grid-template-columns:repeat(auto-fit,minmax(18rem,1fr));gap:1rem 3rem}.np-voet-rij p{margin:0}
.np-voet-merk{font:800 clamp(3rem,10vw,7.5rem)/1 np-kop,sans-serif;letter-spacing:-.05em;color:#fff;margin-top:2.5rem}
.np-voet a{color:#fff}
.np-voet-klein{margin-top:1.5rem;padding-top:1.2rem;border-top:1px solid #26323d;font-size:.84rem}
@media (max-width:980px){
.np-raam{grid-template-columns:minmax(0,1fr);gap:1.5rem}
.np-register{position:static;max-height:none;order:2;background:var(--np-kaart);border:1px solid var(--np-rand);border-radius:16px;padding:.6rem 1rem}
.np-register ul{display:grid;grid-template-columns:repeat(auto-fill,minmax(12rem,1fr))}
.np-intro{grid-template-columns:1fr;grid-template-areas:"b" "h" "l" "c" "k"}
.np-keten{grid-column:1;max-width:26rem;margin-top:1.5rem}
}
@media (max-width:760px){
.np-kop-in{flex-direction:column;align-items:stretch;padding:.6rem 1rem .7rem;gap:.6rem}
.np-menu{overflow-x:auto;scrollbar-width:none;border-radius:14px}.np-menu::-webkit-scrollbar{display:none}
.np-raam{padding:1rem 1rem 3rem}
.np-artikel-kop{grid-template-columns:1fr;gap:1.2rem}
.np-symbool{width:5.5rem;border-radius:16px;padding:.6rem}.np-symbool span{font-size:2.3rem}.np-symbool small{display:none}
.np-zoek,.np-zoek input{min-width:0;width:100%}
.np-tabel{grid-template-columns:repeat(3,1fr);gap:.45rem}
.np-tegel a{padding:.5rem;border-radius:11px}.np-tegel-nr{top:.4rem;left:.5rem;font-size:.6rem}
.np-tegel-sym{font-size:1.7rem;margin-top:.8rem}.np-tegel-naam{font-size:.68rem}
.np-intro-cijfers{gap:1.5rem}.np-intro-cijfers b{font-size:1.6rem}
.np-tabelblok{border-radius:20px;margin-inline:-.25rem}
}
@media (prefers-color-scheme:dark){
:root{--np-inkt:#eef1f4;--np-zacht:#9eabb8;--np-papier:#0f151b;--np-kaart:#161e26;--np-rand:#26313c;--np-koraal-d:#ff8a6b}
body{color:var(--np-inkt)}.np-lead{color:#c3ccd5}.np-lijst span,.np-bronblok{color:#b4bfca}
.np-kop{background:rgba(15,21,27,.85)}
.np-menu a[aria-current]{background:#eef1f4;color:#0f151b}
.np-tabelblok,.np-voet,.np-strook{background:#070b0f}
.np-let-op{background:#2a1913;border-color:#5a2d20}
.np-keten{color:#3b4855}.np-kralen circle{stroke:var(--np-papier)}
.np-voet-merk{color:#eef1f4}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.np-keten-lijn{stroke-dashoffset:0}}
@media print{.np-strook,.np-menu,.np-register,.np-zoek,.np-keten{display:none}body{background:#fff}.np-kop{position:static}}
