/* ── Secties ─────────────────────────────────────────────────────────── */
.hp-section{padding:var(--space-7) 0;background:var(--surface)}
@media (min-width:768px){.hp-section{padding:var(--space-8) 0}}
.hp-section--subtle{background:var(--surface-subtle)}
.hp-section.hp-section--tight{padding:var(--space-6) 0}
@media (min-width:768px){.hp-section.hp-section--tight{padding:var(--space-7) 0}}
.hp-root > :is(.hp-section:not(.hp-section--subtle):not(.hp-section--navy), :has(> .hp-section:not(.hp-section--subtle):not(.hp-section--navy))) + :is(.hp-section:not(.hp-section--subtle):not(.hp-section--navy), :has(> .hp-section:not(.hp-section--subtle):not(.hp-section--navy))):is(.hp-section),
.hp-root > :is(.hp-section:not(.hp-section--subtle):not(.hp-section--navy), :has(> .hp-section:not(.hp-section--subtle):not(.hp-section--navy))) + :has(> .hp-section:not(.hp-section--subtle):not(.hp-section--navy)) > .hp-section,
.hp-root > :is(.hp-section--subtle, :has(> .hp-section--subtle)) + :is(.hp-section--subtle, :has(> .hp-section--subtle)):is(.hp-section),
.hp-root > :is(.hp-section--subtle, :has(> .hp-section--subtle)) + :has(> .hp-section--subtle) > .hp-section{padding-top:0}
.hp-section.hp-section--flush-top{padding-top:0}
.hp-section-head--wide{max-width:none}
.hp-section--navy{background:var(--surface-navy);color:var(--ink-inverse)}
.hp-root .hp-eyebrow{color:var(--terracotta-strong);display:block;margin-bottom:var(--space-3)}
.hp-section--navy .hp-eyebrow,.hp-on-navy .hp-eyebrow{color:var(--terracotta)}
.hp-section-head{max-width:46rem}
.hp-section-head__title{color:var(--ink)}
.hp-section--navy .hp-section-head__title{color:var(--ink-inverse)}
.hp-root .hp-section-head__intro{margin-top:var(--space-4);color:var(--ink-muted)}
.hp-section--navy .hp-section-head__intro{color:var(--ink-inverse-muted)}
.hp-root .hp-section-body{margin-top:var(--space-6)}

/* ── Knoppen ─────────────────────────────────────────────────────────── */
.hp-btn{white-space:nowrap;display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);font-family:var(--font-sans);font-size:15px;line-height:22px;font-weight:600;border-radius:var(--radius-md);border:1px solid transparent;padding:0 20px;height:44px;cursor:pointer;text-decoration:none;transition:background-color .18s ease,border-color .18s ease,color .18s ease}
.hp-btn--lg{height:52px;padding:0 28px;font-size:17px;line-height:24px}
.hp-btn--sm{height:36px;padding:0 14px;font-size:13px;line-height:18px}
.hp-btn--block{width:100%}
.hp-btn--primary{background:var(--terracotta-strong);color:var(--on-terracotta)}
.hp-btn--primary:hover{background:#9e4324}
[data-theme="dark"] .hp-btn--primary:hover{background:#f1b8a1}
.hp-btn--secondary{background:transparent;color:var(--ink);border-color:var(--border-control)}
.hp-btn--secondary:hover{background:var(--surface-subtle)}
.hp-btn--quiet{background:transparent;color:var(--terracotta-strong);padding:0 4px;height:auto}
.hp-btn--quiet:hover{text-decoration:underline}
.hp-on-navy .hp-btn--secondary,.hp-section--navy .hp-btn--secondary{color:var(--ink-inverse);border-color:var(--border-inverse)}
.hp-on-navy .hp-btn--secondary:hover,.hp-section--navy .hp-btn--secondary:hover{background:rgba(255,255,255,.08)}
.hp-on-navy .hp-btn--quiet,.hp-section--navy .hp-btn--quiet{color:var(--ink-inverse)}

/* ── Badge ───────────────────────────────────────────────────────────── */
.hp-badge{white-space:nowrap;flex:none;width:max-content;display:inline-flex;align-items:center;gap:var(--space-2);font-family:var(--font-sans);font-size:13px;line-height:18px;font-weight:600;padding:4px 10px;border-radius:var(--radius-pill);border:1px solid transparent}
.hp-badge__dot{width:6px;height:6px;border-radius:var(--radius-pill);background:currentColor;flex:none}
.hp-badge--accent{background:var(--terracotta-soft);color:var(--ink)}
.hp-badge--accent .hp-badge__dot{background:var(--terracotta)}
.hp-badge--neutral{background:transparent;color:var(--ink-muted);border-color:var(--border)}
.hp-badge--navy{background:var(--surface-navy);color:var(--ink-inverse)}
.hp-badge--success{background:transparent;color:var(--success);border-color:var(--success)}
.hp-badge--glass{background:rgba(255,255,255,.10);color:var(--ink-inverse);border-color:var(--border-inverse)}

/* ── Kaart ───────────────────────────────────────────────────────────── */
.hp-card{height:100%;box-sizing:border-box;display:flex;flex-direction:column;gap:var(--space-3);background:var(--surface-raised);border:1px solid transparent;border-radius:var(--radius-lg);padding:var(--space-6) var(--space-5);box-shadow:var(--shadow-card);text-decoration:none;color:inherit;transition:box-shadow .2s ease,border-color .2s ease,transform .2s ease}
.hp-card--link:hover{box-shadow:var(--shadow-raised);transform:translateY(-2px)}
.hp-card__head{display:flex;align-items:flex-start;gap:var(--space-3)}
.hp-card__icon{width:auto;height:29px;border-radius:0;background:transparent;color:var(--terracotta);display:inline-flex;align-items:center;justify-content:flex-start;flex:none}
.hp-card__icon svg{width:26px;height:26px}
.hp-card__head .hp-card__title{flex:1;min-width:0}
.hp-card--link .hp-card__title{transition:color .15s ease}
.hp-card--link:hover .hp-card__title{color:var(--terracotta-strong)}
.hp-card__title{color:var(--ink)}
@media (min-width:768px){.hp-grid--3 .hp-card__title,.hp-grid--4 .hp-card__title,.hp-grid-eq .hp-card__title{min-height:2lh}}
.hp-card__text{color:var(--ink-muted)}
.hp-root .hp-card__link{margin-top:auto;padding-top:var(--space-2);color:var(--terracotta-strong);display:inline-flex;align-items:center;gap:var(--space-2);font-size:15px;line-height:22px;font-weight:600}
.hp-card--navy{background:rgba(255,255,255,.05);border-color:var(--border-inverse);box-shadow:none}
.hp-card--navy .hp-card__title{color:var(--ink-inverse)}
.hp-card--navy .hp-card__text{color:var(--ink-inverse-muted)}
.hp-card--navy .hp-card__link{color:var(--terracotta)}
.hp-tile{display:flex;flex-direction:row;gap:var(--space-3);align-items:center;padding:14px 18px;border-radius:var(--radius-pill);border:1px solid var(--border-control);background:var(--surface-raised);text-decoration:none;color:inherit;transition:background-color .15s ease,border-color .15s ease,color .15s ease}
.hp-tile:hover{background:var(--surface-navy);border-color:var(--surface-navy)}
.hp-tile:hover .hp-tile__title,.hp-tile:hover .hp-tile__text{color:var(--ink-inverse);text-decoration:none}
.hp-tile__icon{width:24px;height:24px;color:var(--terracotta);display:inline-flex;align-items:center;justify-content:center;flex:none}
.hp-tile__title{color:var(--ink)}
.hp-tile__text{color:var(--ink-muted)}
.hp-tile:hover .hp-tile__title{text-decoration:underline;text-decoration-color:var(--terracotta);text-underline-offset:3px}

/* ── Navigatie ───────────────────────────────────────────────────────── */
.hp-nav{background:var(--surface);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:50}
.hp-root > :has(> .hp-nav){position:sticky;top:0;z-index:50}
.hp-nav--navy{background:var(--surface-navy);border-bottom-color:var(--border-inverse)}
.hp-nav__bar{display:flex;align-items:center;justify-content:space-between;gap:var(--space-5);height:76px}
.hp-nav__links{display:none;align-items:center;gap:var(--space-1)}
@media (min-width:1080px){.hp-nav__links{display:flex}}
.hp-nav__link{white-space:nowrap;font-family:var(--font-sans);font-size:15px;line-height:22px;font-weight:600;color:var(--ink);text-decoration:none;padding:8px 12px;border-radius:var(--radius-md)}
.hp-nav__link{transition:color .15s ease}
.hp-nav__link:hover{color:var(--terracotta-strong)}
.hp-nav__link[aria-current="page"]{color:var(--terracotta-strong)}
.hp-nav--navy .hp-nav__link{color:var(--ink-inverse)}
.hp-nav--navy .hp-nav__link:hover{color:var(--terracotta)}
.hp-nav--navy .hp-nav__link[aria-current="page"]{color:var(--terracotta)}
.hp-nav__actions{display:flex;align-items:center;gap:var(--space-3)}
.hp-nav__burger{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:var(--radius-md);border:1px solid var(--border-control);background:transparent;color:var(--ink);cursor:pointer}
.hp-nav--navy .hp-nav__burger{color:var(--ink-inverse);border-color:var(--border-inverse)}
@media (min-width:1080px){.hp-nav .hp-nav__burger{display:none}}
@media (max-width:1079px){.hp-nav__actions .hp-btn{display:none}}
.hp-nav__sticky-cta{position:sticky;bottom:0;display:flex;gap:var(--space-3);padding:var(--space-3) var(--container-gutter);background:var(--surface);border-top:1px solid var(--border);box-shadow:var(--shadow-overlay)}
@media (min-width:900px){.hp-nav__sticky-cta{display:none}}
.hp-nav__panel{padding:var(--space-2) 0 var(--space-6);border-top:1px solid var(--border)}
.hp-nav__panel[hidden]{display:none}
.hp-nav--navy .hp-nav__panel{border-top-color:var(--border-inverse)}
.hp-nav__panel-links{display:grid}
.hp-nav__panel-link{display:block;padding:14px 0;font-family:var(--font-sans);font-size:17px;line-height:24px;font-weight:600;color:var(--ink);text-decoration:none;border-bottom:1px solid var(--border)}
.hp-nav--navy .hp-nav__panel-link{color:var(--ink-inverse);border-bottom-color:var(--border-inverse)}
.hp-nav__panel-link[aria-current="page"]{color:var(--terracotta-strong)}
.hp-nav--navy .hp-nav__panel-link[aria-current="page"]{color:var(--terracotta)}
.hp-root .hp-nav__panel-actions{display:grid;gap:var(--space-3);margin-top:var(--space-5)}
.hp-nav__panel-actions .hp-btn{width:100%;justify-content:center}
@media (min-width:1080px){.hp-nav__panel{display:none}}

.hp-root /* ── Kruimelpad ──────────────────────────────────────────────────────── */
.hp-crumbs{margin-bottom:var(--space-5)}
.hp-root .hp-crumbs__list{display:flex;flex-wrap:wrap;align-items:center;gap:4px 0;margin:0;padding:0;list-style:none;color:var(--ink-inverse-muted)}
.hp-crumbs__item{display:inline-flex;align-items:center;min-width:0}
.hp-root .hp-crumbs__item + .hp-crumbs__item::before{content:"/";margin:0 10px;opacity:.55}
.hp-crumbs__link{color:var(--ink-inverse);text-decoration:none}
.hp-crumbs__link:hover{text-decoration:underline;text-decoration-color:var(--terracotta);text-underline-offset:3px}
.hp-crumbs [aria-current]{color:var(--ink-inverse-muted)}
.hp-hero--light .hp-crumbs__list,.hp-hero--light .hp-crumbs [aria-current]{color:var(--ink-muted)}
.hp-hero--light .hp-crumbs__link{color:var(--ink)}
@media (max-width:767px){.hp-root .hp-crumbs{margin-bottom:var(--space-4)}}

/* ── Hero ────────────────────────────────────────────────────────────── */
.hp-hero{position:relative;overflow:hidden;background:var(--surface-navy);color:var(--ink-inverse)}
.hp-hero__media{position:absolute;inset:0}
.hp-hero__media img{width:100%;height:100%;object-fit:cover}
.hp-hero__scrim{position:absolute;inset:0;background:linear-gradient(90deg,rgba(22,38,59,.94) 0%,rgba(22,38,59,.82) 45%,rgba(22,38,59,.35) 100%)}
.hp-hero--page .hp-hero__inner{padding:var(--space-8) 0}
@media (min-width:768px){.hp-hero--page .hp-hero__inner{padding:80px 0 88px}}
.hp-hero--light{background:var(--surface);color:var(--ink);border-bottom:0}
.hp-hero.hp-hero--light .hp-hero__title{color:var(--ink)}
.hp-hero.hp-hero--light .hp-hero__intro,.hp-hero.hp-hero--light .hp-hero__meta{color:var(--ink-muted)}
.hp-hero--light .hp-hero__body{max-width:44rem}
.hp-hero__inner{position:relative;padding:var(--space-8) 0}
@media (min-width:768px){.hp-hero__inner{padding:var(--space-10) 0}}
.hp-hero__body{max-width:40rem}
.hp-root .hp-hero .hp-hero__title{color:var(--ink-inverse);margin-top:var(--space-4)}
.hp-root .hp-hero .hp-crumbs + .hp-hero__title,.hp-root .hp-hero .hp-hero__body > .hp-hero__title:first-child{margin-top:0}
.hp-root .hp-hero .hp-hero__intro{color:var(--ink-inverse-muted);margin-top:var(--space-5)}
.hp-root .hp-hero .hp-hero__actions{margin-top:var(--space-6)}
.hp-root .hp-hero .hp-hero__meta{margin-top:var(--space-6);color:var(--ink-inverse-muted)}
@media (max-width:767px){.hp-hero__scrim{background:linear-gradient(180deg,rgba(22,38,59,.9) 0%,rgba(22,38,59,.8) 100%)}}
.hp-hero--warm .hp-hero__media img{object-position:50% 60%}
.hp-hero--warm .hp-hero__scrim{background:linear-gradient(90deg,rgba(22,38,59,.72) 0%,rgba(22,38,59,.55) 45%,rgba(22,38,59,.2) 70%,rgba(22,38,59,0) 100%)}
.hp-hero--warm .hp-hero__intro{color:var(--ink-inverse)}
.hp-hero--warm .hp-hero__body{max-width:36rem}
@media (max-width:767px){.hp-hero--warm .hp-hero__scrim{background:linear-gradient(180deg,rgba(22,38,59,.7) 0%,rgba(22,38,59,.55) 100%)}}

/* ── Trustbalk ───────────────────────────────────────────────────────── */
.hp-trust{background:var(--surface-subtle);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.hp-trust__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-5);padding:var(--space-5) 0}
@media (min-width:768px){.hp-trust__grid{grid-template-columns:repeat(4,1fr)}}
.hp-trust__item{display:flex;align-items:center;gap:var(--space-3)}
.hp-trust__icon{width:40px;height:40px;border-radius:var(--radius-pill);background:var(--terracotta-soft);color:var(--terracotta);display:inline-flex;align-items:center;justify-content:center;flex:none}
.hp-trust__label{color:var(--ink)}
.hp-trust__sub{color:var(--ink-muted)}

/* ── Stappen ─────────────────────────────────────────────────────────── */
.hp-steps{display:grid;gap:var(--space-5)}
@media (min-width:768px){.hp-steps--3{grid-template-columns:repeat(3,1fr)}.hp-steps--4{grid-template-columns:repeat(4,1fr)}}
.hp-step{padding-top:var(--space-4);border-top:2px solid var(--terracotta)}
.hp-step__n{color:var(--terracotta);font-family:var(--font-display)}
.hp-root .hp-step__title{margin-top:var(--space-2);color:var(--ink)}
@media (min-width:768px){.hp-steps--3 .hp-step__title,.hp-steps--4 .hp-step__title{min-height:2lh}}
.hp-root .hp-step__text{margin-top:var(--space-2);color:var(--ink-muted)}

/* ── FAQ ─────────────────────────────────────────────────────────────── */
.hp-faq{border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--surface-raised);overflow:hidden}
.hp-faq__item+.hp-faq__item{border-top:1px solid var(--border)}
.hp-faq__q{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-4);padding:var(--space-5);cursor:pointer;color:var(--ink);list-style:none}
.hp-faq__q::-webkit-details-marker{display:none}
.hp-faq__sign{flex:none;width:24px;height:24px;color:var(--terracotta);transition:transform .2s ease}
.hp-faq__item[open] .hp-faq__sign{transform:rotate(45deg)}
.hp-faq__a{padding:0 var(--space-5) var(--space-5);color:var(--ink-muted);max-width:46rem}

/* ── Case ────────────────────────────────────────────────────────────── */
.hp-case{display:grid;gap:var(--space-6);border:0;border-radius:var(--radius-xl);background:var(--surface-raised);padding:var(--space-6);box-shadow:var(--shadow-card)}
@media (min-width:768px){.hp-case{grid-template-columns:1.5fr 1fr;gap:var(--space-7);padding:var(--space-7)}}
.hp-root .hp-case__quote{color:var(--ink);margin:0}
.hp-root .hp-case__source{margin-top:var(--space-4);color:var(--ink-muted)}
.hp-case__figures{display:grid;gap:var(--space-4);align-content:start;border-top:1px solid var(--border);padding-top:var(--space-5)}
@media (min-width:768px){.hp-case__figures{border-top:0;border-left:1px solid var(--border);padding:0 0 0 var(--space-6)}}
.hp-root .hp-case__figures dd,.hp-root .hp-case__figures dt{margin:0}
.hp-root .hp-case__figures dt{margin-top:2px}
.hp-case__value{color:var(--terracotta-strong);font-family:var(--font-display)}
.hp-case__label{color:var(--ink-muted)}

/* ── CTA-blok ────────────────────────────────────────────────────────── */
.hp-cta{background:var(--surface-navy);color:var(--ink-inverse);border-radius:var(--radius-xl);padding:var(--space-7) var(--space-5);text-align:left}
@media (min-width:768px){.hp-cta{padding:var(--space-8)}}
.hp-cta--full{border-radius:0}
.hp-cta__title{color:var(--ink-inverse);max-width:48rem}
.hp-root .hp-cta__text{margin-top:var(--space-4);color:var(--ink-inverse-muted);max-width:48rem}
.hp-root .hp-cta__actions{margin-top:var(--space-6)}

/* ── Formulier ───────────────────────────────────────────────────────── */
.hp-field{display:flex;flex-direction:column;gap:var(--space-2)}
.hp-field__label{color:var(--ink)}
.hp-field__optional{color:var(--ink-muted);font-weight:400}
.hp-input,.hp-textarea,.hp-select{width:100%;font-family:var(--font-sans);font-size:16px;line-height:24px;color:var(--ink);background:var(--surface);border:1px solid var(--border-control);border-radius:var(--radius-md);padding:11px 14px;transition:border-color .15s ease}
.hp-textarea{min-height:120px;resize:vertical}
.hp-input::placeholder,.hp-textarea::placeholder{color:var(--ink-muted)}
.hp-input:hover,.hp-textarea:hover,.hp-select:hover{border-color:var(--ink-muted)}
.hp-field__hint{color:var(--ink-muted)}
.hp-field__error{color:var(--danger);display:flex;align-items:center;gap:var(--space-2)}
.hp-field--invalid .hp-input,.hp-field--invalid .hp-textarea,.hp-field--invalid .hp-select{border-color:var(--danger);border-width:2px;padding:10px 13px}
.hp-form{background:var(--surface-raised);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-card);padding:var(--space-5)}
@media (min-width:768px){.hp-form{padding:var(--space-6)}}
.hp-form__head{display:flex;gap:var(--space-4);align-items:flex-start}
.hp-form__icon{width:44px;height:44px;border-radius:var(--radius-sm);background:color-mix(in oklab,var(--success) 12%,transparent);color:var(--success);display:inline-flex;align-items:center;justify-content:center;flex:none}
.hp-form__title{color:var(--ink)}
.hp-root .hp-form__sub{margin-top:var(--space-1);color:var(--ink-muted)}
.hp-root .hp-form__fields{display:grid;gap:var(--space-4);margin-top:var(--space-5)}
.hp-root .hp-form__foot{display:flex;flex-wrap:wrap;gap:var(--space-4);margin-top:var(--space-5);padding-top:var(--space-4);border-top:1px solid var(--border);color:var(--ink-muted)}
.hp-form__assurance{display:inline-flex;align-items:center;gap:var(--space-2);white-space:nowrap}

/* ── Logo ────────────────────────────────────────────────────────────── */
.hp-logo{display:inline-flex;align-items:center;gap:10px;text-decoration:none}

/* ── Footer ──────────────────────────────────────────────────────────── */
.hp-footer{background:var(--surface-navy);color:var(--ink-inverse)}
.hp-footer__grid{display:grid;gap:var(--space-7);padding:var(--space-8) 0 var(--space-7)}
@media (min-width:768px){.hp-footer__grid{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--space-6)}.hp-footer__grid > :first-child{grid-column:1 / -1}}
@media (min-width:1080px){.hp-footer__grid{grid-template-columns:minmax(0,1.5fr) repeat(4,minmax(0,1fr));column-gap:var(--space-6)}.hp-footer__grid > :first-child{grid-column:auto}}
@media (min-width:768px) and (max-width:1079px){.hp-footer__grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
.hp-root .hp-footer__about{color:var(--ink-inverse-muted);margin-top:var(--space-4);max-width:24rem}
.hp-root .hp-footer__head{color:var(--terracotta);margin:0 0 var(--space-4);display:flex;align-items:center;height:34px}
.hp-root .hp-footer__grid .hp-logo{height:34px}
.hp-footer__list{display:grid;gap:var(--space-3)}
.hp-footer__link{color:var(--ink-inverse-muted);text-decoration:none}
.hp-footer__link:hover{color:var(--ink-inverse);text-decoration:underline}
.hp-footer__bar{border-top:1px solid var(--border-inverse);padding:var(--space-5) 0;display:flex;flex-wrap:wrap;gap:var(--space-3);justify-content:space-between;color:var(--ink-inverse-muted)}

/* ── Vinkjes: groen = inbegrepen of klopt ─────────────────────────────── */
.hp-check{color:var(--success);flex:none;display:inline-flex;margin-top:2px}
.hp-on-navy .hp-check,.hp-cta .hp-check{color:var(--success-inverse)}
.hp-checklist{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.hp-checklist__item{display:flex;gap:10px;align-items:flex-start}
.hp-checklist__text{color:var(--ink)}
.hp-on-navy .hp-checklist__text{color:var(--ink-inverse)}

/* ── Ingangskaart ─────────────────────────────────────────────────────── */
.hp-intent{display:flex;flex-direction:column;gap:4px;min-width:0;height:100%;box-sizing:border-box;padding:var(--space-5);border-radius:var(--radius-xl);background:var(--surface-raised);box-shadow:var(--shadow-lifted);text-decoration:none;color:var(--ink);transition:transform .2s ease,box-shadow .2s ease}
.hp-intent:hover{transform:translateY(-4px);box-shadow:var(--shadow-lifted-hover)}
.hp-intent:focus-visible{outline:2px solid var(--focus-ring);outline-offset:3px}
.hp-intent__title{color:var(--ink);text-wrap:balance}
.hp-intent__foot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto;padding-top:16px}
.hp-intent__cta{color:var(--terracotta-strong)}
.hp-intent__arrow{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;border:1px solid var(--border);color:var(--terracotta-strong);flex:none;transition:background-color .2s ease,border-color .2s ease}
.hp-intent:hover .hp-intent__arrow{border-color:var(--terracotta-strong)}

/* ── Kostenkaart ──────────────────────────────────────────────────────── */
.hp-cost-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
@media (max-width:1023px){.hp-cost-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:767px){.hp-cost-grid{grid-template-columns:minmax(0,1fr)}}
.hp-cost{display:flex;flex-direction:column;min-width:0;height:100%;box-sizing:border-box;padding:28px;border-radius:var(--radius-xl);background:var(--surface-raised);box-shadow:var(--shadow-lifted)}
.hp-cost__audience{color:var(--terracotta-strong)}
.hp-cost__title{margin-top:10px;color:var(--ink)}
.hp-cost__amount{margin-top:24px;font-family:var(--font-display);font-weight:700;font-size:30px;line-height:1.1;letter-spacing:-.02em;color:var(--ink)}
.hp-cost__amount--free{color:var(--success)}
.hp-cost__text{margin-top:12px;color:var(--ink-muted)}

/* ── Twee panelen naast elkaar (invoer + resultaat) ───────────────────── */
.hp-panels{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:var(--space-5);align-items:stretch}