/* Foodnu — opmaak voor de blokken op de landingspagina's.
 *
 * Die pagina's gebruikten .sec-head, .lp-punten, .lp-waarde en .lp-bron in de
 * markup, maar de bijbehorende regels stonden er niet in: de markup was
 * overgenomen van de branchepagina's, de opmaak niet. Zonder .lp-punten b
 * {display:block} plakt het vetgedrukte kopje aan de zin erachter — vandaar
 * "Je eigen domeinop jouw naam".
 *
 * Eén bestand in plaats van zes kopieën. De waarden komen letterlijk van
 * voor-pizzeria.html, zodat de pagina's er hetzelfde uitzien.
 */

/* Kop boven een sectie: gecentreerd, met het opschrift erboven. */
.sec-head { max-width: 680px; margin: 0 auto var(--s8); text-align: center; }
.sec-head .eyebrow { display: inline-block; margin-bottom: var(--s4); }
.sec-head p { margin-top: var(--s4); }

/* Opsomming in kolommen, met een oranje stip en een vet kopje per punt. */
.lp-punten { list-style: none; margin: var(--s5) 0 0; padding: 0;
  display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--s4) var(--s5); }
.lp-punten li { font-size: 16px; color: var(--ink-soft); line-height: 1.6;
  padding-left: 18px; position: relative; }
.lp-punten li::before { content: ""; position: absolute; left: 0; top: 7px;
  width: 7px; height: 7px; border-radius: 50%; background: var(--tangerine); }
.lp-punten b { display: block; color: var(--ink); font-size: 17px; font-weight: 700; margin-bottom: 2px; }

/* Twee kaarten naast elkaar. */
.lp-waarde { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--s5); }
.lp-waarde .w { background: var(--white); border: 1px solid var(--hair);
  border-radius: var(--r-m); padding: var(--s6); }
.lp-waarde h3 { font-size: 21px; letter-spacing: -.015em; margin: 0 0 10px; }
.lp-waarde p { font-size: 16.5px; color: var(--ink-soft); line-height: 1.62; margin: 0; }

/* Regeltje onder een citaat. */
.lp-bron { margin: var(--s5) 0 0; font-size: 14px; color: var(--muted); text-align: center; }

@media (max-width: 1100px) { .lp-punten { grid-template-columns: 1fr 1fr; } }
@media (max-width: 860px) {
  .lp-waarde { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .lp-punten { grid-template-columns: 1fr; }
}

/* Jubileumactie in de hero — zelfde plek en vorm als op de branchepagina's. */
.lp-actie { display: inline-flex; align-items: center; gap: 11px; margin-top: var(--s5);
  padding: 8px 14px 8px 8px; border-radius: 12px; background: var(--white);
  border: 1px solid var(--hair); box-shadow: 0 1px 2px rgba(20,8,24,.05);
  text-decoration: none; transition: border-color .18s ease, transform .18s ease; }
.lp-actie:hover { border-color: var(--accent); transform: translateY(-1px); }
.lp-actie .tag { font-family: var(--mono); font-size: 10.5px; font-weight: 700;
  letter-spacing: .09em; text-transform: uppercase; color: var(--aubergine);
  background: var(--tangerine); border-radius: 7px; padding: 5px 8px; white-space: nowrap; }
.lp-actie .tx { font-size: 14px; line-height: 1.35; color: var(--ink-soft); }
.lp-actie .tx b { color: var(--aubergine); font-weight: 700; }
.lp-actie .ar { width: 14px; height: 14px; flex: none; color: var(--muted);
  transition: color .18s ease, transform .18s ease; }
.lp-actie:hover .ar { color: var(--accent); transform: translateX(2px); }
@media (max-width: 560px) {
  .lp-actie { gap: 9px; padding: 7px 11px 7px 7px; }
  .lp-actie .tx { font-size: 12.5px; }
  .lp-actie .ar { display: none; }
}