/* Boost Center-landingspagina: afsluitende kaart "Nog geen Boost Center?" en de voettekst. Waarden 1-op-1 uit het prototype; drempel 960px = "s.w < 960". */
.lp-cta { background: #f3f2f2; padding: clamp(56px, 7vw, 96px) clamp(20px, 4vw, 48px); }
.lp-cta__card { position: relative; overflow: hidden; max-width: 1240px; margin: 0 auto; background: #fff6f4; border: 1px solid #fbe1db; border-radius: 24px; padding: clamp(28px, 4vw, 52px); display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 28px clamp(32px, 5vw, 72px); align-items: center; animation: lbRise .8s cubic-bezier(.2, .7, .3, 1) both; animation-timeline: view(); animation-range: entry 0% cover 30%; }
@media (max-width: 959.98px) { .lp-cta__card { grid-template-columns: 1fr; } }
.lp-cta__copy { min-width: 0; }
.lp-cta__glow { position: absolute; top: -160px; right: -120px; width: 420px; height: 420px; background: radial-gradient(circle, rgba(236,48,19,.12), rgba(236,48,19,0) 68%); pointer-events: none; }
.lp-cta__eyebrow { position: relative; display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: #ae1800; }
.lp-cta__eyebrow-dot { width: 7px; height: 7px; background: #ec3013; border-radius: 999px; }
.lp-cta__h2 { font-size: clamp(28px, 3.2vw, 42px); font-weight: 800; letter-spacing: -.04em; line-height: 1.05; margin: 14px 0 0; text-wrap: balance; }
.lp-cta__accent { color: #ec3013; }
.lp-cta__lede { font-size: 16px; line-height: 1.6; color: #605d5d; margin: 14px 0 0; max-width: 46ch; text-wrap: pretty; }
.lp-cta__actions { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.lp-cta__action, .lp-cta__action:hover { position: relative; display: flex; align-items: center; gap: 16px; padding: 18px 20px; background: #ffffff; border-radius: 16px; box-shadow: 0 1px 2px rgba(32,30,29,.05); text-decoration: none; color: #201e1d; transition: background .2s ease, transform .2s ease, box-shadow .2s ease; }
.lp-cta__action:hover, .lp-cta__action:focus-visible { transform: translateY(-2px); box-shadow: 0 10px 28px rgba(236,48,19,.14); }
.lp-cta__action:focus-visible { outline: 2px solid #ec3013; outline-offset: 3px; }
.lp-cta__ic { width: 44px; height: 44px; flex: none; display: inline-flex; align-items: center; justify-content: center; border-radius: 12px; }
.lp-cta__ic--create { background: #ffe6e0; color: #ec3013; }
.lp-cta__ic--grey { background: #f3f2f2; color: #201e1d; }
.lp-cta__txt { flex: 1; min-width: 0; }
.lp-cta__t { display: block; font-size: 16px; font-weight: 800; }
.lp-cta__s { display: block; font-size: 13.5px; color: #605d5d; margin-top: 2px; }
.lp-cta__pill { flex: none; display: inline-flex; align-items: center; height: 38px; padding: 0 16px; font-size: 13px; font-weight: 800; border-radius: 999px; white-space: nowrap; }
.lp-cta__pill--red { background: #ec3013; color: #fff; }
.lp-cta__pill--line { background: #fff; color: #201e1d; border: 1.5px solid #e2dfdf; }
/* Smal (onder 460px): in het prototype is de tekstkolom daar zo smal dat woorden uit hun vak lopen; de pil zakt onder de tekst. Vanaf 460px is alles 1-op-1 het prototype. */
@media (max-width: 459.98px) {
  .lp-cta__action { flex-wrap: wrap; }
  .lp-cta__txt { flex-basis: calc(100% - 60px); }
  .lp-cta__pill { margin-left: 60px; }
}

/* Voettekst */
.lp-footer { background: #201e1d; color: rgba(255,255,255,.62); }
.lp-footer__in { max-width: 1240px; margin: 0 auto; padding: 32px clamp(20px, 4vw, 48px) 84px; display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; font-size: 13px; }
.lp-footer__brand { display: flex; align-items: center; gap: 16px; }
.lp-footer__logo-img { display: block; height: 36px; width: auto; flex: none; }
.lp-footer__links { display: flex; gap: 20px; }
.lp-footer__link, .lp-footer__link:hover { color: rgba(255,255,255,.72); font-weight: 600; text-decoration: none; }
.lp-footer__link:hover, .lp-footer__link:focus-visible { color: #ffffff; }
.lp-footer__link:focus-visible { outline: 2px solid #ffffff; outline-offset: 3px; border-radius: 4px; }

/* ---------------------------------------------------------------- responsief */
/* Tikdoelen >= 44 px bij een grove aanwijzer: de voetlinks krijgen een onzichtbare uitbreiding zonder dat de voet hoger wordt. */
@media (pointer: coarse) {
  .lp-footer__link { position: relative; }
  .lp-footer__link::after { content: ""; position: absolute; inset: -12px -6px; }
}
