/lijsten uit de WYSIWYG-editor — behoud alinea-ritme, geen dubbele witruimte onder de laatste alinea. */ .nb-acc__a>p,.nb-tl__desc>p,.nb-tl__intro>p,.nb-fcard__desc>p,.nb-fcard__intro>p,.nb-guide__desc>p,.nb-guide__intro>p,.nb-hero__sub>p,.nb-rev__quote>p{margin:0 0 .6em} .nb-acc__a>:last-child,.nb-tl__desc>:last-child,.nb-tl__intro>:last-child,.nb-fcard__desc>:last-child,.nb-fcard__intro>:last-child,.nb-guide__desc>:last-child,.nb-guide__intro>:last-child,.nb-hero__sub>:last-child,.nb-rev__quote>:last-child{margin-bottom:0} .nb-acc__a ul,.nb-acc__a ol,.nb-tl__desc ul,.nb-tl__desc ol,.nb-fcard__desc ul,.nb-fcard__desc ol,.nb-guide__desc ul,.nb-guide__desc ol,.nb-hero__sub ul,.nb-hero__sub ol,.nb-rev__quote ul,.nb-rev__quote ol{margin:.3em 0 .6em;padding-left:1.4em} .nb-acc{max-width:880px;border-top:1px solid var(--nb-line)} .nb-acc__item{border-bottom:1px solid var(--nb-line)} .nb-acc__q{display:flex;align-items:center;gap:20px;padding:22px 4px;cursor:pointer;list-style:none} .nb-acc__q::-webkit-details-marker{display:none} .nb-acc__q::marker{content:""} .nb-acc__qt{flex:1;font-size:clamp(16px,1.7vw,20px);font-weight:600;letter-spacing:-0.015em;color:var(--nb-text-soft);transition:color .25s} .nb-acc__item[open] .nb-acc__qt{color:var(--nb-text)} .nb-acc__plus{width:28px;height:28px;border:1px solid var(--nb-line);border-radius:50%;display:grid;place-items:center;color:var(--nb-text-soft);flex-shrink:0;transition:transform .3s,background .3s} .nb-acc__item[open] .nb-acc__plus{background:var(--nb-accent);border-color:var(--nb-accent);color:var(--nb-bg);transform:rotate(45deg)} .nb-acc__a{padding:0 48px 24px 4px;font-size:15.5px;line-height:1.74;color:var(--nb-text-soft)} @media (max-width:899px){.nb-acc__a{padding-right:8px}} .nb-answer{max-width:74ch} .nb-answer__label{display:flex;align-items:center;gap:14px;margin:0 0 18px;font-family:var(--nb-font-mono);font-size:12px;font-weight:700;letter-spacing:0.12em;text-transform:uppercase;color:var(--nb-accent)} .nb-answer__label::after{content:"";flex:1;height:1px;background:var(--nb-line)} .nb-answer__q{margin:0 0 12px;font-family:var(--nb-font-display);font-size:clamp(20px,2.4vw,28px);font-weight:700;letter-spacing:-0.02em;line-height:1.2;text-wrap:balance} .nb-answer__a{margin:0;font-size:clamp(15px,1.3vw,17px);line-height:1.68;max-width:70ch;text-wrap:pretty} .nb-answer__a>p{margin:0 0 .6em}.nb-answer__a>:last-child{margin-bottom:0}.nb-answer__a ul,.nb-answer__a ol{margin:.3em 0 .6em;padding-left:1.4em} .nb-answer__list{counter-reset:nb-answer-item;margin:24px 0 0;padding:0;list-style:none;border-top:1px solid var(--nb-line);font-size:clamp(14px,1.2vw,16px);line-height:1.55;color:var(--nb-text-soft)} .nb-answer__list li{counter-increment:nb-answer-item;display:flex;gap:18px;align-items:baseline;padding:13px 0;border-bottom:1px solid var(--nb-line)} .nb-answer__list li::before{content:counter(nb-answer-item,decimal-leading-zero);flex-shrink:0;font-family:var(--nb-font-mono);font-size:13px;font-weight:700;color:var(--nb-accent)} .nb-answer__meta{margin:16px 0 0;font-size:13px;color:var(--nb-text-soft)} .nb--article-body .nb-artbody{max-width:720px;margin:0 auto;font-size:17px;line-height:1.7;color:var(--nb-text)} .nb--article-body .nb-artbody h2{font-family:var(--nb-font-display);font-size:clamp(26px,3vw,38px);line-height:1.15;margin:64px 0 24px} .nb--article-body .nb-artbody h3{font-family:var(--nb-font-display);font-size:22px;margin:44px 0 16px} .nb--article-body .nb-artbody p{margin:0 0 22px} .nb--article-body .nb-artbody>:first-child{margin-top:0} .nb--article-body .nb-artbody ul,.nb--article-body .nb-artbody ol{padding-left:22px} .nb--article-body .nb-artbody li{margin:6px 0} .nb--article-body .nb-artbody img{max-width:100%;height:auto;border-radius:10px} .nb--article-body .nb-artbody blockquote{border-left:2px solid var(--nb-accent);margin:28px 0;padding:6px 0 6px 20px;font-style:italic} .nb--article-body .nb-artbody a{color:var(--nb-accent);text-decoration:underline;text-underline-offset:3px} [class*="nb--pe-"]{ --pe-charcoal:var(--gb-charcoal,var(--brand-bg-base,#0A0908)); --pe-black:var(--gb-black,var(--brand-bg-surface,#141210)); --pe-coal:var(--gb-coal,var(--brand-bg-elevated,#161616)); --pe-ash:var(--gb-ash,color-mix(in srgb, var(--pe-cream) 8%, transparent)); --pe-ash-2:var(--gb-ash-2,color-mix(in srgb, var(--pe-cream) 14%, transparent)); --pe-ember:var(--gb-ember,var(--gb-flame,var(--brand-accent,#F39019))); --pe-ember-hot:var(--brand-primary-hover,#FF7D33);--pe-ember-glow:rgba(var(--brand-primary-rgb, 243,144,25),0.16); --pe-cream:var(--gb-cream,var(--brand-text-primary,#EEE7DB)); --pe-bone:var(--gb-bone,color-mix(in srgb, var(--pe-cream) 78%, transparent)); --pe-fog:var(--gb-fog,color-mix(in srgb, var(--pe-cream) 50%, transparent)); --pe-faint:var(--gb-faint,color-mix(in srgb, var(--pe-cream) 28%, transparent)); --pe-font-display:var(--font-display,var(--brand-font-heading,inherit)); --pe-font-body:var(--font-body,var(--brand-font-body,inherit)); --pe-font-mono:var(--font-mono,'JetBrains Mono',ui-monospace,monospace); --pe-ease:var(--brand-easing-default,cubic-bezier(.16,1,.3,1));--pe-maxw:1320px; padding:0;border-top:0; background:var(--pe-charcoal);color:var(--pe-cream);font-family:var(--pe-font-body);font-size:15px;line-height:1.6; } [class*="nb--pe-"]>.nb-container{max-width:none;padding:0} :where([class*="nb--pe-"]) *,:where([class*="nb--pe-"]) *::before,:where([class*="nb--pe-"]) *::after{box-sizing:border-box} :where([class*="nb--pe-"]) img{display:block;max-width:100%} :where([class*="nb--pe-"]) a{color:inherit;text-decoration:none} :where([class*="nb--pe-"]) button{font:inherit;color:inherit;background:none;border:none;cursor:pointer;padding:0} :where([class*="nb--pe-"]) h2,:where([class*="nb--pe-"]) h3{margin:0;font-family:var(--pe-font-display);font-weight:700;letter-spacing:-0.025em;line-height:1} :where([class*="nb--pe-"]) ::selection{background:var(--pe-ember);color:var(--pe-charcoal)} .pe-wrap{max-width:var(--pe-maxw);margin:0 auto;padding:0 40px} .pe-eyebrow{font-family:var(--pe-font-mono);font-size:11px;letter-spacing:0.18em;text-transform:uppercase;color:var(--pe-ember);display:inline-flex;align-items:center;gap:10px} .pe-sec-head{max-width:760px;margin-bottom:64px} .pe-sec-head .pe-eyebrow{margin-bottom:22px} .pe-sec-title{font-size:clamp(36px,4.6vw,68px);font-weight:700;letter-spacing:-0.03em;line-height:0.98;white-space:pre-line} .pe-sec-title em{color:var(--pe-ember);font-style:normal} .pe-sec-lead{margin-top:22px;font-size:17px;line-height:1.65;color:var(--pe-bone);max-width:560px} .pe-sect{padding:96px 0;border-top:1px solid var(--pe-ash)} .pe-sect--alt{background:var(--pe-black)} .pe-btn{display:inline-flex;align-items:center;gap:10px;font-family:var(--pe-font-mono);font-size:11px;font-weight:600;letter-spacing:0.16em;text-transform:uppercase;padding:16px 26px;border-radius:3px;cursor:pointer;transition:all .4s var(--pe-ease);white-space:nowrap} .pe-btn--primary{background:var(--pe-ember);color:var(--pe-charcoal)} .pe-btn--primary:hover{background:var(--pe-ember-hot);box-shadow:0 0 36px var(--pe-ember-glow);transform:translateY(-1px)} .pe-btn--ghost{border:1px solid var(--pe-ash-2);color:var(--pe-cream)} .pe-btn--ghost:hover{border-color:var(--pe-ember);color:var(--pe-ember)} .pe-arr{display:inline-flex;transition:transform .4s var(--pe-ease)} .pe-btn:hover .pe-arr{transform:translateX(4px)} :where([class*="nb--pe-"]) .rv{opacity:0;transform:translateY(28px);transition:opacity var(--brand-duration-dramatic,.9s) var(--pe-ease),transform var(--brand-duration-dramatic,.9s) var(--pe-ease)} :where([class*="nb--pe-"]) .rv.in{opacity:1;transform:none} :where([class*="nb--pe-"]).no-js .rv,:where([class*="nb--pe-"]) .no-js .rv{opacity:1;transform:none} @media (prefers-reduced-motion:reduce){:where([class*="nb--pe-"]) .rv{opacity:1!important;transform:none!important;transition:none}} @media (max-width:880px){ .pe-wrap{padding:0 22px} .pe-sect{padding:64px 0} .pe-sec-head{margin-bottom:40px} .pe-sec-title{font-size:clamp(30px,8.5vw,46px)} .pe-sec-lead{font-size:15.5px;margin-top:16px} } /* Rijk-tekst (renderRichText) in pe-containers: neutraliseer UA-marges op
/lijsten en geef links een zichtbare stijl. */ .pe-sec-lead>p,.pe-leven-p>p,.pe-edcta-p>p,.pe-acc-text>p,.pe-detail-lead>p,.pe-detail-p>p{margin:0 0 .6em} .pe-sec-lead>:last-child,.pe-leven-p>:last-child,.pe-edcta-p>:last-child,.pe-acc-text>:last-child,.pe-detail-lead>:last-child,.pe-detail-p>:last-child{margin-bottom:0} .pe-sec-lead ul,.pe-sec-lead ol,.pe-leven-p ul,.pe-leven-p ol,.pe-edcta-p ul,.pe-edcta-p ol,.pe-acc-text ul,.pe-acc-text ol,.pe-detail-lead ul,.pe-detail-lead ol,.pe-detail-p ul,.pe-detail-p ol{margin:.3em 0 .6em;padding-left:1.4em} .pe-sec-lead a,.pe-leven-p a,.pe-edcta-p a,.pe-acc-text a,.pe-detail-lead a,.pe-detail-p a{color:var(--pe-ember);text-decoration:underline;text-underline-offset:2px} .nb--nm-page-hero,.nb--nm-final-cta,.nb--nm-inline-cta{ --nm-fg:var(--foreground,oklch(0.2795 0.0368 260.0310)); --nm-muted:var(--muted-foreground,oklch(0.5510 0.0234 264.3637)); --nm-border:var(--border,oklch(0.8687 0.0043 56.3660)); --nm-card:var(--card,oklch(0.9699 0.0013 106.4238)); --nm-primary:var(--primary,oklch(0.635 0.168 277)); --nm-primary-fg:var(--primary-foreground,oklch(1 0 0)); --nm-secondary:var(--secondary,oklch(0.8687 0.0043 56.3660)); --nm-secondary-fg:var(--secondary-foreground,oklch(0.4461 0.0263 256.8018)); --nm-glow:var(--glow,color-mix(in oklch,var(--nm-primary) 18%,transparent)); --nm-radius-md:var(--radius-md,0.75rem); --nm-radius-lg:var(--radius-lg,1.25rem); --nm-font-display:var(--font-display,var(--brand-font-heading,inherit)); --nm-font-mono:var(--font-mono,ui-monospace,monospace); padding:0;border-top:0;color:var(--nm-fg); } .nb--nm-page-hero>.nb-container,.nb--nm-final-cta>.nb-container,.nb--nm-inline-cta>.nb-container{max-width:none;padding:0} .nb--nm-page-hero :where(*,*::before,*::after),.nb--nm-final-cta :where(*,*::before,*::after),.nb--nm-inline-cta :where(*,*::before,*::after){box-sizing:border-box} .nb--nm-page-hero :where(a),.nb--nm-final-cta :where(a),.nb--nm-inline-cta :where(a){color:inherit;text-decoration:none} /* buttons (site.css .btn) */ .nb--nm-final-cta .btn,.nb--nm-inline-cta .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:42px;padding:0 18px;border-radius:var(--nm-radius-md);font-size:14px;font-weight:600;line-height:1;white-space:nowrap;border:0;cursor:pointer;transition:transform .15s,box-shadow .2s,background .15s,color .15s,border-color .15s} .nb--nm-final-cta .btn-lg{height:52px;padding:0 26px;font-size:15px} .nb--nm-final-cta .btn-primary,.nb--nm-inline-cta .btn-primary{background:var(--nm-primary);color:var(--nm-primary-fg)} .nb--nm-final-cta .btn-primary:hover,.nb--nm-inline-cta .btn-primary:hover{transform:translateY(-1px);box-shadow:0 8px 24px -8px var(--nm-glow)} .nb--nm-final-cta .btn-secondary{background:var(--nm-secondary);color:var(--nm-secondary-fg)} .nb--nm-final-cta .btn-secondary:hover{transform:translateY(-1px)} /* eyebrow */ .nb--nm-page-hero .eyebrow,.nb--nm-final-cta .eyebrow{display:inline-flex;align-items:center;font-family:var(--nm-font-mono);font-size:11px;font-weight:600;letter-spacing:0.1em;text-transform:uppercase;color:color-mix(in srgb,var(--nm-primary) 65%,#fff)} .nb--nm-final-cta .eyebrow--muted{color:var(--nm-muted)} /* page-hero */ .nb--nm-page-hero{position:relative;padding:clamp(88px,10vw,120px) 0 clamp(48px,7vw,88px);overflow:hidden;border-bottom:1px solid var(--nm-border)} .nb--nm-page-hero::before{content:"";position:absolute;top:-30%;left:50%;transform:translateX(-50%);width:90%;max-width:1000px;height:700px;background:radial-gradient(ellipse at center,color-mix(in oklch,var(--nm-primary) 16%,transparent) 0%,transparent 60%);pointer-events:none;z-index:0} .nb--nm-page-hero .page-hero__inner{position:relative;z-index:1;max-width:800px;margin:0 auto;padding:0 clamp(20px,4vw,32px)} .nb--nm-page-hero .page-hero__inner--center{text-align:center} .nb--nm-page-hero:has(.page-hero__inner--nodivider){border-bottom:0} .nb--nm-page-hero h1{margin:22px 0;font-family:var(--nm-font-display);font-size:clamp(40px,6.2vw,72px);font-weight:800;line-height:1.04;letter-spacing:-0.035em;color:var(--nm-fg);text-wrap:balance} .nb--nm-page-hero h1 .gt{background:linear-gradient(180deg,var(--nm-fg) 0%,color-mix(in srgb,var(--nm-fg) 55%,transparent) 70%,color-mix(in srgb,var(--nm-fg) 18%,transparent) 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-box-decoration-break:clone;box-decoration-break:clone} @media (forced-colors:active),print{.nb--nm-page-hero h1 .gt{background:none;color:inherit}} .nb--nm-page-hero .page-hero__sub{font-size:clamp(18px,1.4vw,22px);color:var(--nm-muted);max-width:56ch;line-height:1.5;text-wrap:balance} .nb--nm-page-hero .page-hero__inner--center .page-hero__sub{margin-left:auto;margin-right:auto} /* final-cta */ .nb--nm-final-cta{position:relative;padding:clamp(80px,12vw,144px) 0;background:var(--nm-card);border-top:1px solid var(--nm-border);border-bottom:1px solid var(--nm-border);overflow:hidden} .nb--nm-final-cta::before{content:"";position:absolute;inset:0;z-index:0;background:radial-gradient(ellipse at 50% 0%,color-mix(in oklch,var(--nm-primary) 18%,transparent),transparent 60%),radial-gradient(ellipse at 50% 120%,color-mix(in oklch,var(--nm-primary) 8%,transparent),transparent 70%)} .nb--nm-final-cta .final__inner{position:relative;z-index:1;text-align:center;max-width:760px;margin:0 auto;padding:0 clamp(20px,4vw,32px)} .nb--nm-final-cta h2{margin:16px 0 20px;font-family:var(--nm-font-display);font-size:clamp(40px,6vw,64px);font-weight:800;letter-spacing:-0.035em;line-height:1.05;color:var(--nm-fg)} .nb--nm-final-cta h2 em{color:var(--nm-primary);font-style:normal} .nb--nm-final-cta p,.nb--nm-final-cta .final__sub{color:var(--nm-muted);font-size:clamp(17px,1.4vw,20px);margin-bottom:32px;line-height:1.5} .nb--nm-final-cta .final__sub>p{margin:0 0 .6em} .nb--nm-final-cta .final__sub>:last-child{margin-bottom:0} .nb--nm-final-cta .final__ctas{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-bottom:20px} .nb--nm-final-cta .final__phone{font-family:var(--nm-font-mono);font-size:13px;color:var(--nm-muted);margin:0} .nb--nm-final-cta .final__phone a{color:var(--nm-fg);text-decoration:underline;text-decoration-color:color-mix(in oklch,var(--nm-primary) 60%,transparent);text-underline-offset:4px} /* inline-cta */ .nb--nm-inline-cta{padding:clamp(40px,6vw,72px) 0} .nb--nm-inline-cta .nm-inline__box{max-width:1000px;margin:0 auto;padding:clamp(24px,4vw,40px);display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;background:var(--nm-card);border:1px solid var(--nm-border);border-radius:var(--nm-radius-lg)} .nb--nm-inline-cta h2{margin:0 0 6px;line-height:1.2;font-family:var(--nm-font-display);font-size:clamp(20px,2vw,26px);font-weight:700;letter-spacing:-0.02em;color:var(--nm-fg)} .nb--nm-inline-cta p,.nb--nm-inline-cta .nm-inline__sub{margin:0;color:var(--nm-muted);font-size:15px;line-height:1.5} .nb--nm-inline-cta .nm-inline__sub>p+p{margin-top:.6em} .nm-rt>p{margin:0 0 .6em}.nm-rt>:last-child{margin-bottom:0}.nm-rt :where(ul,ol){margin:.3em 0 .6em;padding-left:1.4em}.nm-rt :where(ul){list-style:disc}.nm-rt :where(ol){list-style:decimal}.nm-rt a{text-decoration:underline;text-underline-offset:2px} /* ===== gedeelde tokens + resets + UI (alle nm-home-* blokken) ===== */ [data-nmh]{ --nmh-bg:var(--background,oklch(0.9876 0.0085 67.7269)); --nmh-fg:var(--foreground,oklch(0.2795 0.0368 260.0310)); --nmh-muted:var(--muted-foreground,oklch(0.5510 0.0234 264.3637)); --nmh-card:var(--card,oklch(0.9699 0.0013 106.4238)); --nmh-popover:var(--popover,oklch(0.9699 0.0013 106.4238)); --nmh-border:var(--border,oklch(0.8687 0.0043 56.3660)); --nmh-primary:var(--primary,oklch(0.635 0.168 277)); /* Accent-tekst op donker: de merk-primary zelf haalt als kleine tekst de AA-drempel niet (gemeten 2,2 op de donkere achtergrond, nodig is 4,5). Deze afgeleide houdt de merk-tint maar wordt licht genoeg; alleen voor TEKST, niet voor vlakken. */ --nmh-primary-text:color-mix(in srgb,var(--nmh-primary) 65%,#fff); --nmh-primary-fg:var(--primary-foreground,oklch(1 0 0)); --nmh-secondary:var(--secondary,oklch(0.8687 0.0043 56.3660)); --nmh-secondary-fg:var(--secondary-foreground,oklch(0.4461 0.0263 256.8018)); --nmh-destructive:var(--destructive,oklch(0.6368 0.2078 25.3313)); --nmh-glow:var(--glow,color-mix(in oklch,var(--nmh-primary) 18%,transparent)); --nmh-radius:var(--radius,1.25rem); --nmh-radius-sm:var(--radius-sm,0.5rem); --nmh-radius-md:var(--radius-md,0.75rem); --nmh-radius-lg:var(--radius-lg,1.25rem); --nmh-radius-xl:var(--radius-xl,1.5rem); --nmh-font-display:var(--brand-font-display,var(--font-display,var(--font-sans,inherit))); --nmh-font-mono:var(--font-mono,ui-monospace,monospace); --nmh-tracking-widest:var(--tracking-widest,0.1em); --nmh-shadow-xs:var(--shadow-xs,2px 2px 10px 4px hsl(240 4% 60% / 0.09)); --nmh-shadow-sm:var(--shadow-sm,2px 2px 10px 4px hsl(240 4% 60% / 0.18)); --nmh-shadow-md:var(--shadow-md,2px 2px 10px 4px hsl(240 4% 60% / 0.18),2px 2px 4px 3px hsl(240 4% 60% / 0.18)); --nmh-shadow-xl:var(--shadow-xl,2px 2px 10px 4px hsl(240 4% 60% / 0.18),2px 8px 10px 3px hsl(240 4% 60% / 0.18)); color:var(--nmh-fg); font-family:var(--font-sans,inherit); } [data-nmh]>.nb-container{max-width:none;padding:0} [data-nmh] :where(*,*::before,*::after){box-sizing:border-box} [data-nmh] :where(p,h1,h2,h3,ul){margin:0} [data-nmh] :where(img){display:block;max-width:100%} [data-nmh] :where(a){color:inherit;text-decoration:none} [data-nmh] svg{display:block} [data-nmh] .nmh-container{max-width:1240px;margin:0 auto;padding:0 clamp(20px,4vw,32px);position:relative;z-index:2} /* De nm-bundle halveert de mobiele zijmarge naar 10px via body.nm-root .nmh-container (0,2,1) — dat mocht, omdat het app-frame op de homepage er al 14px afsnoepte. Loopt dat frame tot de schermrand, dan blijft er 10px over en staat de tekst te dicht op de rand. Alleen op de hero-pagina terug naar de eigen clamp; (0,3,1) wint van die bundelregel, en de :has-scope laat andere pagina-s ongemoeid. Geen backticks in dit commentaar: deze CSS staat in een template literal. */ @media (max-width:640px){body:has(.nb--nm-home-hero) [data-nmh] .nmh-container{padding-left:clamp(20px,4vw,32px);padding-right:clamp(20px,4vw,32px)}} [data-nmh] h1{font-family:var(--nmh-font-display);font-size:clamp(40px,6.2vw,72px);font-weight:var(--brand-font-display-weight,800);line-height:1.04;letter-spacing:-0.035em;text-wrap:balance;color:var(--nmh-fg)} [data-nmh] h2{font-family:var(--nmh-font-display);font-size:clamp(30px,4vw,50px);font-weight:var(--brand-font-display-weight,700);line-height:1.08;letter-spacing:-0.025em;text-wrap:balance;color:var(--nmh-fg)} [data-nmh] h3{font-size:24px;font-weight:700;line-height:1.2;letter-spacing:-0.02em;color:var(--nmh-fg)} [data-nmh] .lead{font-size:clamp(17px,1.4vw,20px);color:var(--nmh-muted);line-height:1.55;max-width:60ch;text-wrap:pretty} [data-nmh] .gradient-text{background:linear-gradient(180deg,var(--nmh-fg) 0%,color-mix(in srgb,var(--nmh-fg) 55%,transparent) 70%,color-mix(in srgb,var(--nmh-fg) 18%,transparent) 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-box-decoration-break:clone;box-decoration-break:clone} @media (forced-colors:active),print{[data-nmh] .gradient-text{background:none;color:inherit}} [data-nmh] .section__head{margin-bottom:clamp(40px,6vw,72px);max-width:780px} [data-nmh] .section__head>*+*{margin-top:18px} [data-nmh] .section__head--center{margin-inline:auto;text-align:center} [data-nmh] .eyebrow{display:inline-flex;align-items:center;font-family:var(--nmh-font-mono);font-size:11px;font-weight:600;letter-spacing:var(--nmh-tracking-widest);text-transform:uppercase;color:var(--nmh-primary-text)} [data-nmh] .eyebrow--muted{color:var(--nmh-muted)} [data-nmh] .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:42px;padding:0 18px;border-radius:var(--nmh-radius-md);font-size:14px;font-weight:600;line-height:1;white-space:nowrap;cursor:pointer;border:0;font-family:inherit;transition:transform .15s ease,box-shadow .2s ease,background .15s ease,color .15s ease,border-color .15s ease} [data-nmh] .btn-lg{height:52px;padding:0 26px;font-size:15px} [data-nmh] .btn-sm{height:36px;padding:0 14px;font-size:13px} [data-nmh] .btn-primary{background:var(--nmh-primary);color:var(--nmh-primary-fg);box-shadow:var(--nmh-shadow-sm)} [data-nmh] .btn-primary:hover{transform:translateY(-1px);box-shadow:var(--nmh-shadow-md)} [data-nmh] .btn-secondary{background:var(--nmh-secondary);color:var(--nmh-secondary-fg);box-shadow:var(--nmh-shadow-xs)} [data-nmh] .btn-secondary:hover{transform:translateY(-1px)} [data-nmh] .btn-ghost{background:transparent;color:var(--nmh-muted);border:1px solid var(--nmh-border)} [data-nmh] .btn-ghost:hover{color:var(--nmh-fg);background:color-mix(in oklch,var(--nmh-fg) 6%,transparent);border-color:color-mix(in oklch,var(--nmh-fg) 16%,transparent)} /* ===== §1 nm-home-hero ===== */ .nb--nm-home-hero{position:relative;padding:clamp(88px,10vw,120px) 0 clamp(48px,7vw,88px);overflow:hidden} .nb--nm-home-hero .hero__bg{position:absolute;inset:0;pointer-events:none;z-index:0} .nb--nm-home-hero .hero__bg canvas{position:absolute;inset:0;width:100%;height:100%;opacity:.55} .nb--nm-home-hero .hero__bg::before{content:"";position:absolute;top:-20%;left:50%;transform:translateX(-50%);width:90%;max-width:1000px;height:800px;background:radial-gradient(ellipse at center,color-mix(in oklch,var(--nmh-primary) 10%,transparent) 0%,transparent 60%)} .nb--nm-home-hero .hero__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 70%,var(--nmh-bg) 100%)} .nb--nm-home-hero .hero__inner{position:relative;z-index:2;text-align:center;max-width:980px;margin:0 auto} .nb--nm-home-hero .hero__badge{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border-radius:999px;background:color-mix(in oklch,var(--nmh-primary) 12%,transparent);border:1px solid color-mix(in oklch,var(--nmh-primary) 30%,transparent);font-family:var(--nmh-font-mono);font-size:11px;font-weight:600;color:var(--nmh-primary);letter-spacing:var(--nmh-tracking-widest);text-transform:uppercase;margin-bottom:28px} .nb--nm-home-hero .hero__badge .dot{width:6px;height:6px;border-radius:999px;background:var(--nmh-primary);box-shadow:0 0 0 3px color-mix(in oklch,var(--nmh-primary) 25%,transparent);animation:nmh-hero-pulse 2.4s ease-in-out infinite} @keyframes nmh-hero-pulse{0%,100%{box-shadow:0 0 0 3px color-mix(in oklch,var(--nmh-primary) 25%,transparent)}50%{box-shadow:0 0 0 6px color-mix(in oklch,var(--nmh-primary) 10%,transparent)}} .nb--nm-home-hero .hero__inner h1{margin:0 0 24px} .nb--nm-home-hero .hero__sub{font-size:clamp(18px,1.5vw,22px);color:var(--nmh-muted);max-width:680px;margin:0 auto 40px;line-height:1.5;text-wrap:balance} .nb--nm-home-hero .hero__ctas{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-bottom:32px} .nb--nm-home-hero .hero__trust{display:flex;gap:24px;justify-content:center;flex-wrap:wrap;font-family:var(--nmh-font-mono);font-size:12px;color:var(--nmh-muted)} .nb--nm-home-hero .hero__trust b{font-weight:600;color:var(--nmh-fg)} .nb--nm-home-hero .hero__trust .sep{opacity:.5} /* Eén kant van de 768px-grens: tegenhanger van een nm-demoplayer die zichzelf onder die grens verbergt — samen dragen ze het hero-beeld op élk scherm. */ @media(min-width:768px){.nb--nm-home-hero .hero__dash--mobile{display:none}} @media(max-width:767px){.nb--nm-home-hero .hero__dash--desktop{display:none}} .nb--nm-home-hero .hero__dash{position:relative;z-index:2;margin:clamp(56px,8vw,96px) auto 0;max-width:1100px;background:var(--nmh-card);border:1px solid var(--nmh-border);border-radius:var(--nmh-radius-xl);padding:18px;box-shadow:var(--nmh-shadow-xl);overflow:hidden} .nb--nm-home-hero .dash__bar{display:flex;align-items:center;gap:12px;padding-bottom:14px;border-bottom:1px solid var(--nmh-border)} .nb--nm-home-hero .dash__dots{display:flex;gap:6px} .nb--nm-home-hero .dash__dots i{width:9px;height:9px;border-radius:50%;background:color-mix(in oklch,var(--nmh-fg) 18%,transparent);display:inline-block} .nb--nm-home-hero .dash__title{font-family:var(--nmh-font-mono);font-size:11px;color:var(--nmh-muted);letter-spacing:0.04em} .nb--nm-home-hero .dash__live{margin-left:auto;display:inline-flex;align-items:center;gap:6px;font-family:var(--nmh-font-mono);font-size:10px;color:var(--nmh-primary);padding:4px 10px;border-radius:999px;background:color-mix(in oklch,var(--nmh-primary) 12%,transparent);border:1px solid color-mix(in oklch,var(--nmh-primary) 30%,transparent);letter-spacing:var(--nmh-tracking-widest);font-weight:600} .nb--nm-home-hero .dash__live i{width:5px;height:5px;border-radius:999px;background:var(--nmh-primary);animation:nmh-hero-pulse 2.4s ease-in-out infinite} .nb--nm-home-hero .dash__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:16px 0 14px} .nb--nm-home-hero .kpi{background:color-mix(in oklch,var(--nmh-fg) 3%,transparent);border:1px solid var(--nmh-border);border-radius:var(--nmh-radius-md);padding:14px 16px;position:relative;overflow:hidden} .nb--nm-home-hero .kpi__label{font-family:var(--nmh-font-mono);font-size:10.5px;letter-spacing:var(--nmh-tracking-widest);text-transform:uppercase;color:var(--nmh-muted);font-weight:600} .nb--nm-home-hero .kpi__value{font-family:var(--nmh-font-mono);font-size:clamp(22px,2.2vw,28px);font-weight:600;letter-spacing:-0.02em;margin-top:6px;color:var(--nmh-fg);font-variant-numeric:tabular-nums} .nb--nm-home-hero .kpi__delta{font-size:11.5px;color:var(--nmh-primary-text);font-weight:600;margin-top:4px;font-family:var(--nmh-font-mono)} .nb--nm-home-hero .kpi__delta.down{color:color-mix(in oklch,var(--nmh-destructive) 80%,var(--nmh-fg) 20%)} .nb--nm-home-hero .kpi--active{border-color:color-mix(in oklch,var(--nmh-primary) 38%,transparent);background:color-mix(in oklch,var(--nmh-primary) 10%,transparent);animation:nmh-kpi-breathe 3.4s ease-in-out infinite} @keyframes nmh-kpi-breathe{0%,100%{box-shadow:0 0 0 1px color-mix(in oklch,var(--nmh-primary) 10%,transparent),0 0 18px -8px color-mix(in oklch,var(--nmh-primary) 50%,transparent)}50%{box-shadow:0 0 0 1px color-mix(in oklch,var(--nmh-primary) 20%,transparent),0 0 32px -4px color-mix(in oklch,var(--nmh-primary) 70%,transparent)}} .nb--nm-home-hero .dash__chart{background:color-mix(in oklch,var(--nmh-fg) 3%,transparent);border:1px solid var(--nmh-border);border-radius:var(--nmh-radius-md);padding:16px;position:relative} .nb--nm-home-hero .dash__chart-head{display:flex;align-items:center;gap:12px;margin-bottom:8px} .nb--nm-home-hero .dash__chart-title{font-size:13px;font-weight:600;color:var(--nmh-fg)} .nb--nm-home-hero .dash__legend{margin-left:auto;display:flex;gap:14px;font-family:var(--nmh-font-mono);font-size:10.5px;color:var(--nmh-muted)} .nb--nm-home-hero .dash__legend i{display:inline-block;width:8px;height:8px;border-radius:2px;margin-right:6px;vertical-align:middle} .nb--nm-home-hero .dash__legend i.l1{background:var(--nmh-primary)} .nb--nm-home-hero .dash__legend i.l2{background:color-mix(in oklch,var(--nmh-fg) 30%,transparent)} .nb--nm-home-hero .dash__chart svg{width:100%;height:110px;overflow:visible} .nb--nm-home-hero .dash__chart svg .line1{stroke:var(--nmh-primary);stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 8px color-mix(in oklch,var(--nmh-primary) 60%,transparent))} .nb--nm-home-hero .dash__chart svg .line2{stroke:color-mix(in oklch,var(--nmh-fg) 24%,transparent);stroke-width:1.5;fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:3 4} .nb--nm-home-hero .dash__chart svg .area1{fill:url(#nm-area-grad)} .nb--nm-home-hero .dash__chart svg .end-pulse{fill:var(--nmh-primary);animation:nmh-end-pulse 2.2s ease-in-out infinite} @keyframes nmh-end-pulse{0%,100%{r:4;opacity:1}50%{r:8;opacity:.5}} .nb--nm-home-hero .dash__sjef{position:absolute;right:18px;bottom:38px;max-width:320px;background:var(--nmh-popover);border:1px solid color-mix(in oklch,var(--nmh-primary) 30%,transparent);border-radius:var(--nmh-radius-md);padding:12px 14px;display:flex;align-items:flex-start;gap:10px;box-shadow:var(--nmh-shadow-md);font-size:12.5px} .nb--nm-home-hero .dash__sjef .av{width:28px;height:28px;border-radius:50%;flex-shrink:0;background:linear-gradient(135deg,var(--nmh-primary),color-mix(in oklch,var(--nmh-primary) 70%,black));display:flex;align-items:center;justify-content:center;font-weight:700;color:var(--nmh-primary-fg);font-size:12px} .nb--nm-home-hero .dash__sjef .msg{flex:1;min-width:0;color:var(--nmh-fg)} .nb--nm-home-hero .dash__sjef .msg b{font-weight:600} .nb--nm-home-hero .dash__sjef .msg span{display:block;color:var(--nmh-muted);margin-top:2px;font-size:12px;line-height:1.4} .nb--nm-home-hero .dash__sjef .badge{font-family:var(--nmh-font-mono);font-size:10px;font-weight:600;letter-spacing:var(--nmh-tracking-widest);color:var(--nmh-primary);padding:3px 6px;border-radius:var(--nmh-radius-sm);background:color-mix(in oklch,var(--nmh-primary) 12%,transparent)} @media(max-width:880px){.nb--nm-home-hero .hero__dash{padding:14px}.nb--nm-home-hero .dash__grid{grid-template-columns:repeat(2,1fr)}.nb--nm-home-hero .dash__sjef{position:static;max-width:none;margin-top:14px}} @media(prefers-reduced-motion:reduce){.nb--nm-home-hero .hero__badge .dot,.nb--nm-home-hero .dash__live i,.nb--nm-home-hero .kpi--active,.nb--nm-home-hero .dash__chart svg .end-pulse{animation:none}} /* ===== §2 nm-own-brands ===== */ .nb--nm-own-brands{padding:clamp(56px,8vw,96px) 0} .nb--nm-own-brands .section__head{max-width:540px;margin-bottom:clamp(36px,5vw,56px)} .nb--nm-own-brands .brands{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--nmh-border);border-radius:var(--nmh-radius-lg);background:var(--nmh-card);overflow:hidden} .nb--nm-own-brands .brand{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:44px 24px;gap:12px;min-height:168px;transition:background .2s} .nb--nm-own-brands .brand:hover{background:color-mix(in oklch,var(--nmh-fg) 4%,transparent)} .nb--nm-own-brands .brand+.brand{border-left:1px solid var(--nmh-border)} .nb--nm-own-brands .brand__mark{font-family:var(--nmh-font-display);font-weight:var(--brand-font-display-weight,800);font-size:26px;letter-spacing:-0.025em;color:var(--nmh-fg)} .nb--nm-own-brands .brand__mark .v{color:var(--nmh-primary)} /* Monochroom via filter i.p.v. mask-image: een CSS-mask op een logo van een andere origin (R2) faalt zonder CORS. */ .nb--nm-own-brands .brand__logo img{display:block;height:44px;width:auto;max-width:200px;object-fit:contain;filter:brightness(0);opacity:.88;transition:opacity .2s} .dark .nb--nm-own-brands .brand__logo img{filter:brightness(0) invert(1)} .nb--nm-own-brands .brand:hover .brand__logo img{opacity:1} .nb--nm-own-brands .brand__tag{font-family:var(--nmh-font-mono);font-size:11px;font-weight:600;color:var(--nmh-muted);letter-spacing:var(--nmh-tracking-widest);text-transform:uppercase} .nb--nm-own-brands .brands-cap{text-align:center;margin-top:36px} .nb--nm-own-brands .brands-cap h2{font-size:clamp(24px,2.8vw,34px);font-weight:700;letter-spacing:-0.02em;margin-bottom:8px} .nb--nm-own-brands .brands-cap p{color:var(--nmh-muted);max-width:56ch;margin:0 auto;font-size:15.5px} @media(max-width:720px){.nb--nm-own-brands .brands{grid-template-columns:1fr}.nb--nm-own-brands .brand+.brand{border-left:0;border-top:1px solid var(--nmh-border)}} /* ===== §2b nm-bignum (bewust donkere statband → expliciete lichte tekst) ===== */ .nb--nm-bignum{position:relative;overflow:hidden;border-top:1px solid var(--nmh-border);border-bottom:1px solid var(--nmh-border);background:oklch(0.1250 0.0020 67);padding:clamp(88px,12vw,160px) 0} .nb--nm-bignum::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(color-mix(in oklch,white 4%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in oklch,white 4%,transparent) 1px,transparent 1px);background-size:88px 88px;-webkit-mask-image:radial-gradient(ellipse at 50% 50%,black 25%,transparent 78%);mask-image:radial-gradient(ellipse at 50% 50%,black 25%,transparent 78%)} .nb--nm-bignum .bignum__row{position:relative;display:grid;grid-template-columns:1fr;justify-items:center;text-align:center} .nb--nm-bignum .bignum__row::before{content:"";position:absolute;top:-44px;left:12%;right:12%;height:1px;background:linear-gradient(90deg,transparent,color-mix(in oklch,white 28%,transparent),transparent)} .nb--nm-bignum .bn__val{font-family:var(--nmh-font-display);font-weight:var(--brand-font-display-weight,700);font-size:clamp(56px,7.5vw,112px);letter-spacing:-0.045em;line-height:1;color:oklch(0.9350 0.0060 255);font-variant-numeric:tabular-nums} .nb--nm-bignum .bn__cap{margin-top:20px;font-family:var(--nmh-font-mono);font-size:13px;color:oklch(0.6800 0.0120 261);letter-spacing:0.02em} @media(max-width:720px){.nb--nm-bignum .bignum__row::before{display:none}} /* ===== §4 nm-module-grid ===== */ .nb--nm-module-grid{padding:clamp(72px,11vw,144px) 0} .nb--nm-module-grid .modules{display:grid;grid-template-columns:repeat(3,1fr);gap:16px} .nb--nm-module-grid .mod{position:relative;background:var(--nmh-card);border:1px solid var(--nmh-border);border-radius:var(--nmh-radius-lg);padding:28px;min-height:240px;display:flex;flex-direction:column;gap:14px;transition:border-color .2s,background .2s,transform .2s,box-shadow .2s;cursor:pointer;overflow:hidden;--cat:var(--nmh-primary)} .nb--nm-module-grid .mod[data-cat="reach"]{--cat:var(--cat-reach,oklch(0.72 0.14 235))} .nb--nm-module-grid .mod[data-cat="presence"]{--cat:var(--cat-presence,oklch(0.70 0.17 300))} .nb--nm-module-grid .mod[data-cat="engage"]{--cat:var(--cat-engage,oklch(0.78 0.15 70))} .nb--nm-module-grid .mod[data-cat="verkoop"]{--cat:var(--cat-verkoop,oklch(0.78 0.17 150))} .nb--nm-module-grid .mod[data-cat="brain"]{--cat:var(--nmh-primary)} .nb--nm-module-grid .mod[data-cat="findability"]{--cat:var(--cat-findability,oklch(0.72 0.16 340))} .nb--nm-module-grid .mod:hover{border-color:color-mix(in oklch,var(--cat) 40%,var(--nmh-border));transform:translateY(-2px);box-shadow:var(--nmh-shadow-md),0 0 40px -16px color-mix(in oklch,var(--cat) 50%,transparent)} .nb--nm-module-grid .mod__icon{width:42px;height:42px;border-radius:var(--nmh-radius-md);background:color-mix(in oklch,var(--cat) 12%,transparent);border:1px solid color-mix(in oklch,var(--cat) 26%,var(--nmh-border));display:flex;align-items:center;justify-content:center;color:var(--cat);flex-shrink:0} .nb--nm-module-grid .mod__title{font-size:21px;font-weight:700;letter-spacing:-0.02em;line-height:1.2;color:var(--nmh-fg)} /* Merktegel: het logo staat op de plek van het categorie-icoon. Hoogte is de constante, breedte volgt de vorm — een vaste breedte drukt een woordmerk plat. Bij een woordmerk-logo (staat al de naam in de tekening) blijft de losse tekstkop uit de markup, alleen niet zichtbaar (--vh). Bij een kale glyph-logo (isGlyphBrandMark) blijft .mod__title gewoon zichtbaar — dan is het logo net zo klein als het categorie-icoon dat het vervangt. */ .nb--nm-module-grid .mod__logo{display:flex;align-items:center;min-height:42px} .nb--nm-module-grid .mod__logo img{height:26px;width:auto;max-width:100%;object-fit:contain;display:block} .nb--nm-module-grid .mod__title--vh{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap} .nb--nm-module-grid .mod__logo:has(+ .mod__title:not(.mod__title--vh)) img{height:42px;width:42px;object-fit:contain} .nb--nm-module-grid .mod__title em{color:var(--cat);font-style:normal} .nb--nm-module-grid .mod__desc{color:var(--nmh-muted);font-size:14.5px;line-height:1.55;flex:1} .nb--nm-module-grid .mod__arrow{display:inline-flex;align-items:center;gap:6px;font-size:13.5px;font-weight:600;color:var(--cat);margin-top:auto;opacity:0;transform:translateX(-4px);transition:opacity .2s,transform .2s} .nb--nm-module-grid .mod:hover .mod__arrow{opacity:1;transform:translateX(0)} .nb--nm-module-grid .mod--brain{background:radial-gradient(circle at top right,color-mix(in oklch,var(--nmh-primary) 14%,transparent),transparent 70%),var(--nmh-card);border-color:color-mix(in oklch,var(--nmh-primary) 30%,transparent)} .nb--nm-module-grid .mod--brain .mod__icon{background:linear-gradient(135deg,var(--nmh-primary),color-mix(in oklch,var(--nmh-primary) 60%,black));color:var(--nmh-primary-fg);border:0} .nb--nm-module-grid .mod--plus{background:color-mix(in oklch,var(--nmh-primary) 6%,var(--nmh-card));border-color:color-mix(in oklch,var(--nmh-primary) 30%,transparent);--cat:var(--nmh-primary)} .nb--nm-module-grid .mod--plus .mod__icon{background:var(--nmh-primary);color:var(--nmh-primary-fg);border:0} .nb--nm-module-grid .mod--img{padding:0;gap:0;min-height:0} .nb--nm-module-grid .mod__media{position:relative;aspect-ratio:16/10;max-width:100%;overflow:hidden;border-bottom:1px solid var(--nmh-border);background:radial-gradient(120% 90% at 20% 0%,color-mix(in oklch,var(--cat) 22%,transparent),transparent 60%),var(--nmh-card)} .nb--nm-module-grid .mod__media img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block;transition:transform .5s} .nb--nm-module-grid .mod--img:hover .mod__media img{transform:scale(1.035)} .nb--nm-module-grid .mod__ph{position:absolute;inset:0;background-image:linear-gradient(color-mix(in oklch,var(--cat) 10%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in oklch,var(--cat) 10%,transparent) 1px,transparent 1px);background-size:24px 24px} .nb--nm-module-grid .mod__body{display:flex;flex-direction:column;gap:8px;padding:18px 20px 20px;flex:1} .nb--nm-module-grid .mod__label{display:inline-flex;align-items:center;gap:8px;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--nmh-muted)} .nb--nm-module-grid .mod__label::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--cat);box-shadow:0 0 10px var(--cat)} .nb--nm-module-grid .mod--img .mod__title{font-size:19px} .nb--nm-module-grid .mod--img .mod__desc{font-size:14px} .nb--nm-module-grid .mod--img .mod__arrow{opacity:1;transform:none;padding-top:10px} .nb--nm-module-grid .mod--feature{grid-column:1/-1;flex-direction:row} .nb--nm-module-grid .mod--feature .mod__media{aspect-ratio:auto;width:58%;min-height:320px;flex:none;border-bottom:0;border-right:1px solid var(--nmh-border)} .nb--nm-module-grid .mod--feature .mod__body{padding:32px;justify-content:center} .nb--nm-module-grid .mod--feature .mod__title{font-size:28px} .nb--nm-module-grid .mod--feature .mod__desc{font-size:15px;max-width:40ch;flex:0} @media (max-width:720px){.nb--nm-module-grid .mod--feature{flex-direction:column}.nb--nm-module-grid .mod--feature .mod__media{width:100%;min-height:0;aspect-ratio:16/10;border-right:0;border-bottom:1px solid var(--nmh-border)}.nb--nm-module-grid .mod--feature .mod__body{padding:20px}.nb--nm-module-grid .mod--feature .mod__title{font-size:22px}} @media (prefers-reduced-motion:reduce){.nb--nm-module-grid .mod__media img{transition:none}} @media(max-width:980px){.nb--nm-module-grid .modules{grid-template-columns:repeat(2,1fr)}} @media(max-width:560px){.nb--nm-module-grid .modules{grid-template-columns:1fr}} /* ===== §6 nm-screenshots ===== */ .nb--nm-screenshots{padding:clamp(72px,11vw,144px) 0} .nb--nm-screenshots .nmh-shots{display:grid;grid-template-columns:repeat(2,1fr);gap:20px} .nb--nm-screenshots .nmh-shot{background:var(--nmh-card);border:1px solid var(--nmh-border);border-radius:var(--nmh-radius-lg);overflow:hidden;box-shadow:var(--nmh-shadow-xs)} .nb--nm-screenshots .nmh-shot__frame{aspect-ratio:16/10;position:relative;overflow:hidden;border-bottom:1px solid var(--nmh-border);background:var(--nmh-bg)} .nb--nm-screenshots .nmh-shot__frame img{width:100%;height:100%;object-fit:cover} .nb--nm-screenshots .nmh-shot__ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:repeating-linear-gradient(135deg,color-mix(in oklch,var(--nmh-primary) 10%,transparent) 0 2px,transparent 2px 16px),linear-gradient(135deg,color-mix(in oklch,var(--nmh-primary) 14%,transparent),color-mix(in oklch,var(--nmh-primary) 3%,transparent))} .nb--nm-screenshots .nmh-shot__ph span{font-family:var(--nmh-font-mono);font-size:11px;letter-spacing:var(--nmh-tracking-widest);text-transform:uppercase;color:color-mix(in oklch,var(--nmh-fg) 75%,transparent);padding:6px 12px;border-radius:var(--nmh-radius-sm);background:color-mix(in oklch,var(--nmh-bg) 60%,transparent);border:1px dashed color-mix(in oklch,var(--nmh-fg) 22%,transparent)} .nb--nm-screenshots .nmh-shot__body{padding:20px 22px 24px} .nb--nm-screenshots .nmh-shot__label{font-size:16px;font-weight:600;color:var(--nmh-fg);margin-bottom:6px} .nb--nm-screenshots .nmh-shot__cap{font-size:14px;line-height:1.55;color:var(--nmh-muted)} @media(max-width:720px){.nb--nm-screenshots .nmh-shots{grid-template-columns:1fr}} /* ===== §7 nm-testimonials ===== */ .nb--nm-testimonials{padding:clamp(72px,11vw,144px) 0} .nb--nm-testimonials .testis{display:grid;grid-template-columns:repeat(3,1fr);gap:16px} .nb--nm-testimonials .testi{background:var(--nmh-card);border:1px solid var(--nmh-border);border-radius:var(--nmh-radius-lg);padding:28px;display:flex;flex-direction:column;gap:24px;box-shadow:var(--nmh-shadow-xs)} .nb--nm-testimonials .testi__quote{font-size:18.5px;line-height:1.45;letter-spacing:-0.01em;color:var(--nmh-fg);font-weight:500;flex:1} .nb--nm-testimonials .testi__quote::before{content:"\201C";color:var(--nmh-primary-text);font-size:32px;line-height:0;vertical-align:-14px;margin-right:4px;font-weight:700} .nb--nm-testimonials .testi__quote em{color:var(--nmh-primary-text);font-style:normal} .nb--nm-testimonials .testi__person{display:flex;gap:12px;align-items:center} .nb--nm-testimonials .testi__av{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;color:var(--nmh-primary-fg);background:linear-gradient(135deg,var(--nmh-primary),color-mix(in oklch,var(--nmh-primary) 60%,black))} .nb--nm-testimonials .testi__av.b{background:linear-gradient(135deg,oklch(0.72 0.18 30),oklch(0.5 0.16 25))} .nb--nm-testimonials .testi__av.c{background:linear-gradient(135deg,oklch(0.72 0.12 220),oklch(0.5 0.16 240))} .nb--nm-testimonials .testi__av.d{background:linear-gradient(135deg,oklch(0.74 0.14 150),oklch(0.5 0.14 160))} .nb--nm-testimonials .testi__name{font-weight:600;font-size:14.5px;color:var(--nmh-fg)} .nb--nm-testimonials .testi__role{font-size:13px;color:var(--nmh-muted)} @media(max-width:880px){.nb--nm-testimonials .testis{grid-template-columns:1fr}} /* ===== §8 nm-plans ===== */ .nb--nm-plans{padding:clamp(72px,11vw,144px) 0} .nb--nm-plans .plans{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;align-items:stretch} .nb--nm-plans .plan{background:var(--nmh-card);border:1px solid var(--nmh-border);border-radius:var(--nmh-radius-lg);padding:32px 28px;display:flex;flex-direction:column;gap:18px;position:relative;box-shadow:var(--nmh-shadow-xs)} .nb--nm-plans .plan--pro{background:linear-gradient(180deg,color-mix(in oklch,var(--nmh-primary) 8%,var(--nmh-card)) 0%,var(--nmh-card) 60%);border-color:color-mix(in oklch,var(--nmh-primary) 36%,transparent);box-shadow:var(--nmh-shadow-xl),0 0 80px -20px var(--nmh-glow);transform:translateY(-4px)} .nb--nm-plans .plan__badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);font-family:var(--nmh-font-mono);font-size:10.5px;letter-spacing:var(--nmh-tracking-widest);background:var(--nmh-primary);color:var(--nmh-primary-fg);padding:5px 12px;border-radius:999px;font-weight:700;text-transform:uppercase;white-space:nowrap} .nb--nm-plans .plan__name{font-family:var(--nmh-font-mono);font-size:12px;letter-spacing:var(--nmh-tracking-widest);text-transform:uppercase;color:var(--nmh-muted);font-weight:600} .nb--nm-plans .plan--pro .plan__name{color:var(--nmh-primary)} .nb--nm-plans .plan__price{display:flex;align-items:baseline;gap:6px;font-family:var(--nmh-font-display);letter-spacing:-0.03em;font-weight:var(--brand-font-display-weight,800)} .nb--nm-plans .plan__price-val{font-size:52px;line-height:1;color:var(--nmh-fg)} .nb--nm-plans .plan__price-per{color:var(--nmh-muted);font-size:13.5px;font-weight:500;letter-spacing:0} .nb--nm-plans .plan__one{color:var(--nmh-muted);font-size:14.5px;line-height:1.5} .nb--nm-plans .plan__intro{margin-top:10px;padding:8px 12px;border-radius:10px;font-size:13px;line-height:1.45;color:var(--nmh-fg,inherit);background:color-mix(in srgb,var(--nmh-primary,#7c5cff) 14%,transparent)} .nb--nm-plans .plan__sep{height:1px;background:var(--nmh-border);margin:4px 0} .nb--nm-plans .plan__feats{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:12px} .nb--nm-plans .plan__feats li{display:flex;gap:12px;align-items:flex-start;font-size:14.5px;color:var(--nmh-fg)} .nb--nm-plans .plan__feats li .check{flex-shrink:0;color:var(--nmh-primary);margin-top:2px;width:16px;height:16px} .nb--nm-plans .plan .btn{margin-top:auto;width:100%;height:46px} .nb--nm-plans .plans-cta{text-align:center;margin-top:32px} .nb--nm-plans .plans-cta a{color:var(--nmh-primary-text);font-weight:600;font-size:14.5px} @media(max-width:880px){.nb--nm-plans .plans{grid-template-columns:1fr}.nb--nm-plans .plan--pro{transform:none}} /* ===== §9 nm-home-faq ===== */ .nb--nm-home-faq{padding:clamp(72px,11vw,144px) 0} .nb--nm-home-faq .faq{border-top:1px solid var(--nmh-border);max-width:920px} .nb--nm-home-faq .faq__item{border-bottom:1px solid var(--nmh-border)} .nb--nm-home-faq .faq__btn{width:100%;text-align:left;padding:24px 0;display:flex;align-items:center;gap:20px;font-size:18px;font-weight:600;color:var(--nmh-fg);letter-spacing:-0.015em;transition:color .15s;background:none;border:0;cursor:pointer;font-family:inherit} .nb--nm-home-faq .faq__btn:hover{color:var(--nmh-primary-text)} .nb--nm-home-faq .faq__num{font-family:var(--nmh-font-mono);font-size:12px;color:var(--nmh-muted);width:32px;letter-spacing:0.06em;font-weight:600} .nb--nm-home-faq .faq__q{flex:1} .nb--nm-home-faq .faq__plus{width:22px;height:22px;position:relative;flex-shrink:0} .nb--nm-home-faq .faq__plus::before,.nb--nm-home-faq .faq__plus::after{content:"";position:absolute;left:50%;top:50%;width:14px;height:1.5px;background:var(--nmh-muted);transform:translate(-50%,-50%);transition:transform .25s,background .15s} .nb--nm-home-faq .faq__plus::after{transform:translate(-50%,-50%) rotate(90deg)} .nb--nm-home-faq .faq__item.is-open .faq__plus::after{transform:translate(-50%,-50%) rotate(0)} .nb--nm-home-faq .faq__item.is-open .faq__plus::before,.nb--nm-home-faq .faq__item.is-open .faq__plus::after{background:var(--nmh-primary)} .nb--nm-home-faq .faq__item.is-open .faq__btn{color:var(--nmh-primary-text)} .nb--nm-home-faq .faq__a{max-height:0;overflow:hidden;transition:max-height .25s ease} .nb--nm-home-faq .faq__item.is-open .faq__a{max-height:340px} .nb--nm-home-faq .faq__a-inner{padding:0 52px 28px 52px;font-size:15.5px;color:var(--nmh-muted);line-height:1.65} .nb--nm-home-faq .faq__a-inner em{color:var(--nmh-primary-text);font-style:normal} @media(max-width:600px){.nb--nm-home-faq .faq__num{display:none}.nb--nm-home-faq .faq__a-inner{padding:0 0 24px 0}} .nm-rt>p{margin:0 0 .6em}.nm-rt>:last-child{margin-bottom:0}.nm-rt :where(ul,ol){margin:.3em 0 .6em;padding-left:1.4em}.nm-rt :where(ul){list-style:disc}.nm-rt :where(ol){list-style:decimal}.nm-rt a{text-decoration:underline;text-underline-offset:2px} /* ===== gedeelde tokens (alle nm-overons-blokken) ===== */ .nb--nm-facts,.nb--nm-spreadsheet,.nb--nm-story,.nb--nm-jaartabs,.nb--nm-brands-list,.nb--nm-rules,.nb--nm-team{ --nm-fg:var(--foreground,oklch(0.22 0.01 260)); --nm-muted:var(--muted-foreground,oklch(0.55 0.015 260)); --nm-card:var(--card,oklch(0.99 0.002 260)); --nm-border:var(--border,oklch(0.91 0.005 260)); --nm-primary:var(--primary,oklch(0.635 0.168 277)); --nm-primary-fg:var(--primary-foreground,oklch(0.99 0 0)); --nm-radius:var(--radius,0.75rem); --nm-radius-lg:var(--radius-lg,1rem); --nm-font-display:var(--font-display,inherit); --nm-font-mono:var(--font-mono,ui-monospace,'SFMono-Regular',monospace); --nm-tracking-widest:var(--tracking-widest,0.1em); padding:0;border-top:0;color:var(--nm-fg);font-family:var(--font-body,inherit); } .nb--nm-facts :where(*,*::before,*::after),.nb--nm-spreadsheet :where(*,*::before,*::after),.nb--nm-story :where(*,*::before,*::after),.nb--nm-jaartabs :where(*,*::before,*::after),.nb--nm-brands-list :where(*,*::before,*::after),.nb--nm-rules :where(*,*::before,*::after),.nb--nm-team :where(*,*::before,*::after){box-sizing:border-box} .nb--nm-facts :where(p,h2,h3),.nb--nm-spreadsheet :where(p,h2,h3),.nb--nm-story :where(p,h2,h3),.nb--nm-jaartabs :where(p,h2,h3),.nb--nm-brands-list :where(p,h2,h3),.nb--nm-rules :where(p,h2,h3),.nb--nm-team :where(p,h2,h3){margin:0} .nb--nm-facts :where(a),.nb--nm-spreadsheet :where(a),.nb--nm-story :where(a),.nb--nm-jaartabs :where(a),.nb--nm-brands-list :where(a),.nb--nm-rules :where(a),.nb--nm-team :where(a){color:inherit;text-decoration:none} .nb--nm-facts>.nb-container,.nb--nm-spreadsheet>.nb-container,.nb--nm-story>.nb-container,.nb--nm-jaartabs>.nb-container,.nb--nm-brands-list>.nb-container,.nb--nm-rules>.nb-container,.nb--nm-team>.nb-container{max-width:none;padding:0 clamp(20px,5vw,24px)} .nb--nm-facts .nm-inner,.nb--nm-spreadsheet .nm-inner,.nb--nm-story .nm-inner,.nb--nm-jaartabs .nm-inner,.nb--nm-brands-list .nm-inner,.nb--nm-rules .nm-inner,.nb--nm-team .nm-inner{max-width:1240px;margin:0 auto} .nb--nm-story .em,.nb--nm-spreadsheet .em,.nb--nm-rules .em{color:var(--nm-primary)} /* ===== gedeelde section-head (story) ===== */ .nb--nm-story .nm-head{text-align:center;max-width:640px;margin:0 auto clamp(28px,4vw,40px)} .nb--nm-story .nm-head .eyebrow{display:inline-block;font-family:var(--nm-font-mono);font-size:11.5px;letter-spacing:0.14em;text-transform:uppercase;color:color-mix(in srgb,var(--nm-primary) 65%,#fff);margin-bottom:14px} .nb--nm-story .nm-head h2{font-family:var(--nm-font-display);font-weight:700;font-size:clamp(28px,3.6vw,44px);letter-spacing:-0.03em;line-height:1.1;color:var(--nm-fg);text-wrap:balance} /* ===== 1. nm-facts ===== */ .nb--nm-facts{padding:0 0 clamp(8px,2vw,16px)} .nb--nm-facts .facts-line{font-family:var(--nm-font-mono);font-size:12.5px;color:var(--nm-muted);letter-spacing:0.02em;margin-top:28px;display:flex;gap:10px;flex-wrap:wrap;justify-content:center} .nb--nm-facts .facts-line b{color:var(--nm-fg);font-weight:600} .nb--nm-facts .facts-line .sep{opacity:.4} /* ===== 2. nm-spreadsheet ===== */ .nb--nm-spreadsheet{padding:clamp(56px,8vw,96px) 0} .nb--nm-spreadsheet .sheet-wrap{max-width:680px;margin:0 auto} .nb--nm-spreadsheet .sheet-intro{text-align:center;max-width:56ch;margin:0 auto 32px;color:var(--nm-muted);font-size:16px;line-height:1.6} .nb--nm-spreadsheet .sheet-intro strong{color:var(--nm-fg);font-weight:600} .nb--nm-spreadsheet .sheet{background:var(--nm-card);border:1px solid var(--nm-border);border-radius:var(--nm-radius-lg);overflow:hidden;font-variant-numeric:tabular-nums} .nb--nm-spreadsheet .sheet__bar{display:flex;align-items:center;gap:10px;padding:12px 18px;border-bottom:1px solid var(--nm-border)} .nb--nm-spreadsheet .sheet__bar .dots{display:flex;gap:6px} .nb--nm-spreadsheet .sheet__bar .dots i{width:10px;height:10px;border-radius:50%;background:color-mix(in oklch, var(--nm-fg) 12%, transparent)} .nb--nm-spreadsheet .sheet__bar .name{font-family:var(--nm-font-mono);font-size:12px;color:var(--nm-muted)} .nb--nm-spreadsheet .sheet__row{display:grid;grid-template-columns:1fr auto;gap:16px;padding:11px 20px;border-bottom:1px solid color-mix(in oklch, var(--nm-border) 60%, transparent);font-size:14px;transition:opacity .45s,text-decoration-color .45s;position:relative} .nb--nm-spreadsheet .sheet__row .tool{color:var(--nm-fg);font-weight:500} .nb--nm-spreadsheet .sheet__row .why{color:var(--nm-muted);font-size:12.5px;margin-left:10px} .nb--nm-spreadsheet .sheet__row .price{font-family:var(--nm-font-mono);font-size:13px;color:var(--nm-muted)} .nb--nm-spreadsheet .sheet.is-after .sheet__row--old{opacity:.32} .nb--nm-spreadsheet .sheet.is-after .sheet__row--old .tool,.nb--nm-spreadsheet .sheet.is-after .sheet__row--old .price{text-decoration:line-through;text-decoration-color:color-mix(in oklch, var(--nm-primary) 70%, transparent)} .nb--nm-spreadsheet .sheet__row--new{display:none;background:color-mix(in oklch, var(--nm-primary) 7%, transparent)} .nb--nm-spreadsheet .sheet__row--new .tool{color:var(--nm-primary);font-weight:700} .nb--nm-spreadsheet .sheet__row--new .price{color:var(--nm-fg);font-weight:600} .nb--nm-spreadsheet .sheet.is-after .sheet__row--new{display:grid} .nb--nm-spreadsheet .sheet__total{display:grid;grid-template-columns:1fr auto;gap:16px;padding:16px 20px;background:color-mix(in oklch, var(--nm-fg) 3%, transparent)} .nb--nm-spreadsheet .sheet__total .lbl{font-family:var(--nm-font-mono);font-size:11px;letter-spacing:var(--nm-tracking-widest);text-transform:uppercase;color:var(--nm-muted);font-weight:600;align-self:center} .nb--nm-spreadsheet .sheet__total .sum{font-family:var(--nm-font-mono);font-size:22px;font-weight:700;color:var(--nm-fg)} .nb--nm-spreadsheet .sheet__total .sum small{font-size:12px;color:var(--nm-muted);font-weight:400;margin-left:4px} .nb--nm-spreadsheet .sheet-toggle{display:flex;justify-content:center;gap:0;margin:24px 0 0} .nb--nm-spreadsheet .sheet-toggle button{padding:10px 22px;font-family:var(--nm-font-mono);font-size:12.5px;font-weight:600;color:var(--nm-muted);border:1px solid var(--nm-border);background:none;cursor:pointer;transition:all .15s} .nb--nm-spreadsheet .sheet-toggle button:first-child{border-radius:999px 0 0 999px} .nb--nm-spreadsheet .sheet-toggle button:last-child{border-radius:0 999px 999px 0;border-left:0} .nb--nm-spreadsheet .sheet-toggle button.is-active{color:var(--nm-primary-fg);background:var(--nm-primary);border-color:var(--nm-primary)} .nb--nm-spreadsheet .sheet-note{text-align:center;font-size:13px;color:var(--nm-muted);margin-top:14px} /* ===== 3. nm-story ===== */ .nb--nm-story{padding:clamp(48px,7vw,80px) 0} .nb--nm-story .story{max-width:65ch;margin:0 auto;font-size:clamp(17px,1.4vw,19px);line-height:1.7;color:var(--nm-fg)} .nb--nm-story .story p{margin:0 0 22px} .nb--nm-story .story .quote{font-family:var(--nm-font-display);font-size:clamp(24px,2.6vw,32px);font-weight:700;letter-spacing:-0.02em;line-height:1.25;margin:36px 0;text-wrap:balance;text-align:center} .nb--nm-story .story strong{color:var(--nm-fg);font-weight:700} .nb--nm-story .nm-inner--left .nm-head{text-align:left;max-width:65ch;font-size:clamp(17px,1.4vw,19px)} .nb--nm-story .nm-inner--left .story .quote{text-align:left} .nb--nm-story .story a{color:var(--brand-accent,var(--primary,currentColor));font-weight:600;text-decoration:underline;text-decoration-color:color-mix(in oklch,var(--brand-accent,var(--primary,currentColor)) 50%,transparent);text-underline-offset:3px;text-decoration-thickness:1px} .nb--nm-story .story a:hover{text-decoration-thickness:2px} /* ===== 4. nm-jaartabs ===== */ .nb--nm-jaartabs{padding:clamp(48px,7vw,80px) 0} .nb--nm-jaartabs .years{max-width:680px;margin:0 auto} .nb--nm-jaartabs .years__tabs{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;margin-bottom:28px} .nb--nm-jaartabs .years__tabs button{padding:9px 18px;border-radius:999px;font-family:var(--nm-font-mono);font-size:13px;font-weight:600;color:var(--nm-muted);border:1px solid var(--nm-border);background:none;cursor:pointer;transition:all .15s} .nb--nm-jaartabs .years__tabs button:hover{color:var(--nm-fg)} .nb--nm-jaartabs .years__tabs button.is-active{color:var(--nm-primary-fg);background:var(--nm-primary);border-color:var(--nm-primary)} .nb--nm-jaartabs .years__panel{background:var(--nm-card);border:1px solid var(--nm-border);border-radius:var(--nm-radius-lg);padding:32px;min-height:150px} .nb--nm-jaartabs .years__panel[hidden]{display:none} .nb--nm-jaartabs .years__panel h3{font-size:20px;font-weight:700;letter-spacing:-0.015em;margin:0 0 10px} .nb--nm-jaartabs .years__panel p,.nb--nm-jaartabs .years__panel .years__body{color:var(--nm-muted);font-size:15.5px;line-height:1.65;margin:0} .nb--nm-jaartabs .years__panel .years__body>p:not(:last-child){margin-bottom:.6em} .nb--nm-jaartabs .years__panel .yr{font-family:var(--nm-font-mono);font-size:12px;color:var(--nm-primary);font-weight:600;letter-spacing:0.04em;display:block;margin-bottom:10px} .nb--nm-jaartabs .years__nav{display:flex;justify-content:space-between;margin-top:16px} .nb--nm-jaartabs .years__nav button{font-family:var(--nm-font-mono);font-size:12.5px;font-weight:600;color:var(--nm-muted);background:none;border:none;cursor:pointer;padding:6px 0;transition:color .15s} .nb--nm-jaartabs .years__nav button:hover:not([disabled]){color:var(--nm-primary)} .nb--nm-jaartabs .years__nav button[disabled]{opacity:.3;cursor:default} /* ===== 5. nm-brands-list ===== */ .nb--nm-brands-list{padding:clamp(48px,7vw,80px) 0} .nb--nm-brands-list .brands-list{max-width:820px;margin:0 auto;border-top:1px solid var(--nm-border)} .nb--nm-brands-list .brand-row{display:grid;grid-template-columns:200px 1fr auto;gap:24px;align-items:center;padding:26px 4px;border-bottom:1px solid var(--nm-border);transition:background .15s} .nb--nm-brands-list .brand-row:hover{background:color-mix(in oklch, var(--nm-fg) 2.5%, transparent)} .nb--nm-brands-list .brand-row__mark{font-family:var(--nm-font-display);font-weight:800;font-size:24px;letter-spacing:-0.025em;color:var(--nm-fg)} .nb--nm-brands-list .brand-row__mark .v{color:var(--nm-primary)} .nb--nm-brands-list .brand-row__since{font-family:var(--nm-font-mono);font-size:11px;color:var(--nm-muted);letter-spacing:0.04em;margin-top:2px} .nb--nm-brands-list .brand-row__desc{color:var(--nm-muted);font-size:14.5px;line-height:1.55;max-width:52ch} .nb--nm-brands-list .brand-row__stat{text-align:right} .nb--nm-brands-list .brand-row__stat .v{font-family:var(--nm-font-mono);font-size:16px;font-weight:600;color:var(--nm-fg)} .nb--nm-brands-list .brand-row__stat .l{font-family:var(--nm-font-mono);font-size:10.5px;color:var(--nm-muted);letter-spacing:0.06em;text-transform:uppercase;margin-top:2px} @media (max-width:760px){.nb--nm-brands-list .brand-row{grid-template-columns:1fr;gap:10px}.nb--nm-brands-list .brand-row__stat{text-align:left}} /* ===== 6. nm-rules ===== */ .nb--nm-rules{padding:clamp(48px,7vw,80px) 0} .nb--nm-rules .rules{max-width:680px;margin:0 auto;border-top:1px solid var(--nm-border)} .nb--nm-rules .rule-item{border-bottom:1px solid var(--nm-border)} .nb--nm-rules .rule-item__head{display:flex;align-items:baseline;gap:18px;width:100%;padding:20px 4px;cursor:pointer;background:none;border:none;text-align:left;font:inherit;color:inherit;transition:color .15s} .nb--nm-rules .rule-item__head .n{font-family:var(--nm-font-mono);font-size:12px;color:var(--nm-muted);width:20px;flex-shrink:0} .nb--nm-rules .rule-item__head .t{font-size:clamp(17px,1.6vw,20px);font-weight:700;letter-spacing:-0.015em;flex:1} .nb--nm-rules .rule-item__head .chev{color:var(--nm-muted);transition:transform .25s;flex-shrink:0;align-self:center} .nb--nm-rules .rule-item.is-open .rule-item__head .chev{transform:rotate(45deg)} .nb--nm-rules .rule-item.is-open .rule-item__head .n{color:var(--nm-primary)} .nb--nm-rules .rule-item__head:hover .t{color:var(--nm-primary)} .nb--nm-rules .rule-item .body{padding:0 4px 22px 42px;color:var(--nm-muted);font-size:15px;line-height:1.65;max-width:60ch} .nb--nm-rules .rule-item .body[hidden]{display:none} /* ===== 7. nm-team ===== */ .nb--nm-team{padding:clamp(48px,7vw,80px) 0} .nb--nm-team .roster{max-width:680px;margin:0 auto;border-top:1px solid var(--nm-border)} .nb--nm-team .roster-item{border-bottom:1px solid var(--nm-border);padding:16px 4px} .nb--nm-team .roster-item__row{display:grid;grid-template-columns:1fr auto auto;gap:18px;align-items:baseline} .nb--nm-team .roster-item .name{font-size:16px;font-weight:600;letter-spacing:-0.01em} .nb--nm-team .roster-item .role{font-family:var(--nm-font-mono);font-size:12px;color:var(--nm-muted);letter-spacing:0.02em} .nb--nm-team .roster-item .city{font-family:var(--nm-font-mono);font-size:12px;color:var(--nm-muted);opacity:.7;width:86px;text-align:right} .nb--nm-team .roster-item .bio{padding:8px 0 2px;color:var(--nm-muted);font-size:14px;line-height:1.6;max-width:56ch} @media (max-width:560px){.nb--nm-team .roster-item .city{display:none}} .nb--nm-team .hiring{max-width:680px;margin:64px auto 0;padding:28px 0 0;border-top:1px solid var(--nm-border);display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap} .nb--nm-team .hiring__head{font-size:18px;font-weight:700;letter-spacing:-0.015em;margin-bottom:4px} .nb--nm-team .hiring__sub{color:var(--nm-muted);font-size:14px;line-height:1.55;max-width:44ch} .nb--nm-team .hiring .btn{display:inline-flex;align-items:center;gap:8px;padding:11px 20px;border-radius:var(--nm-radius);border:1px solid var(--nm-border);font-size:14px;font-weight:600;color:var(--nm-fg);white-space:nowrap;transition:border-color .15s,color .15s} .nb--nm-team .hiring .btn:hover{border-color:var(--nm-primary);color:var(--nm-primary)} .nm-rt>p{margin:0 0 .6em}.nm-rt>:last-child{margin-bottom:0}.nm-rt :where(ul,ol){margin:.3em 0 .6em;padding-left:1.4em}.nm-rt :where(ul){list-style:disc}.nm-rt :where(ol){list-style:decimal}.nm-rt a{text-decoration:underline;text-underline-offset:2px}