/* NS Pakketvinder 1.1.0 — homepage. Koppen volgen de homepagestijl (Fraunces, keuze Sam 07-09); keuzes als pillen, echte producten als kaartjes. */
.ns-pf { --pf-ink: #1d2733; --pf-zacht: #5b6470; --pf-lijn: #e6e8ec; --pf-accent: #c9503a; --pf-donker: #1f3550;
  max-width: 1180px; margin: 0 auto; padding: clamp(40px, 5vw, 72px) 0; display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: 18px clamp(24px, 4vw, 56px); align-items: start; }
.ns-pf-intro { grid-column: 1 / -1; max-width: 760px; }
.ns-pf-intro p { color: var(--pf-zacht); }
.ns-pf-vragen { display: grid; gap: 16px; }
.ns-pf-groep { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; }
.ns-pf-groep[hidden] { display: none; }
.ns-pf-groep > span { width: 100%; font-weight: 600; font-size: .95rem; color: var(--pf-ink); }
html body .ns-pf-groep button, html body .ns-pf-meer button { min-height: 40px; padding: 0 16px; border-radius: 999px; border: 1px solid var(--pf-lijn); background: #fff; color: var(--pf-ink); font: inherit; font-size: .9rem; font-weight: 600; text-transform: none; letter-spacing: 0; margin: 0; cursor: pointer; transition: background-color .18s ease, color .18s ease, border-color .18s ease; }
html body .ns-pf-groep button[aria-pressed="true"] { background: var(--pf-donker); border-color: var(--pf-donker); color: #fff; }
html body .ns-pf-groep button:focus-visible, html body .ns-pf-meer button:focus-visible, .ns-pf-knop:focus-visible { outline: 3px solid var(--pf-accent); outline-offset: 2px; }
.ns-pf-uit[hidden], .ns-pf-foto[hidden] { display: none; }
.ns-pf-kop { font-weight: 700; font-size: 1.2rem; color: var(--pf-ink); margin: 0 0 4px !important; }
.ns-pf-sub { font-size: .9rem; color: var(--pf-zacht); margin: 0 0 12px !important; }
.ns-pf-lijst { list-style: none; margin: 0 !important; padding: 0 !important; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.ns-pf-lijst li { margin: 0 !important; }
.ns-pf-lijst a { display: grid; gap: 6px; color: var(--pf-ink); text-decoration: none; }
.ns-pf-lijst img { width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; border-radius: 10px; background: #f3f4f6; display: block; }
.ns-pf-lijst b { font-size: .88rem; font-weight: 600; line-height: 1.3; }
.ns-pf-lijst a:hover b { text-decoration: underline; }
.ns-pf-lijst span { font-size: .8rem; color: var(--pf-zacht); }
.ns-pf-meer { margin: 12px 0 0 !important; }
.ns-pf-foto p { color: var(--pf-zacht); }
.ns-pf .ns-pf-knop { display: inline-flex; align-items: center; min-height: 46px; padding: 0 22px; border-radius: 999px; background: var(--pf-accent); color: #fff !important; font-weight: 700; text-decoration: none; }
.ns-pf-voet { grid-column: 1 / -1; font-size: .8rem; color: var(--pf-zacht); margin: 6px 0 0 !important; padding-top: 12px; border-top: 1px solid var(--pf-lijn); }
@media (max-width: 849px) {
  .ns-pf { grid-template-columns: minmax(0, 1fr); padding-left: 0; padding-right: 0; }
  .ns-pf-lijst { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (prefers-reduced-motion: reduce) {
  html body .ns-pf-groep button { transition: none; }
}
.ns-pf-groep small { width: 100%; color: var(--pf-zacht); font-size: .8rem; }
