.hc-hero[data-astro-cid-i5z4fa3h]{padding-block:var(--size-10);background:#e6e7ea;& .breadcrumb{font-size:var(--fs-300);color:var(--clr-primary-700);align-items:center;gap:.6rem;margin-block-end:var(--size-5);display:flex;& a{color:var(--clr-secondary-900);text-decoration:none;&:hover{text-decoration:underline}}}& .hero-grid{gap:var(--size-10);grid-template-columns:1fr 44rem;align-items:center;display:grid}& .hero-left{gap:var(--size-3);flex-direction:column;display:flex}& .hero-cat{color:var(--clr-secondary-900);font-size:var(--fs-300);font-weight:var(--fw-semi-bold);letter-spacing:.06em;text-transform:uppercase;align-items:center;gap:.6rem;display:flex}& h1{color:var(--clr-primary-900);font-family:var(--ff-header);font-size:var(--fs-800);font-weight:var(--fw-bold);line-height:1.15;& em{color:var(--clr-secondary-900);font-style:italic}}& .hero-desc{color:var(--clr-primary-700);font-size:var(--fs-500);line-height:var(--lh-400);max-width:56ch}& .trust-strip{gap:var(--size-4);flex-wrap:wrap;margin-block-start:var(--size-1);display:flex;& .trust-item{align-items:center;gap:.8rem;display:flex;& .trust-icon{width:3.2rem;min-width:3.2rem;height:3.2rem;color:var(--clr-primary-900);background:#07133314;border-radius:50%;justify-content:center;align-items:center;display:flex}& .trust-label{color:var(--clr-primary-900);font-size:var(--fs-400);font-weight:var(--fw-semi-bold);line-height:1.3}& .trust-sub{color:var(--clr-primary-700);font-size:var(--fs-300);line-height:1.4}}}& .hero-right{& .hero-example-card{border-radius:var(--border-radius-card);padding:var(--size-4);gap:var(--size-2);background:#fff;flex-direction:column;display:flex;box-shadow:0 4px 24px #0713331a;& .hec-label{color:var(--clr-primary-700);font-size:var(--fs-300);font-weight:var(--fw-semi-bold);text-transform:uppercase;letter-spacing:.08em}& .hec-input-preview{font-size:var(--fs-400);color:var(--clr-primary-700);background:var(--clr-primary-100);font-style:italic;line-height:var(--lh-400);border-radius:.6rem;padding:1rem 1.2rem}& .hec-result-row{align-items:flex-start;gap:var(--size-3);padding-block:var(--size-1);display:flex}& .hec-score-ring{border:5px solid #ea4335;border-radius:50%;flex-direction:column;flex-shrink:0;justify-content:center;align-items:center;width:7.2rem;min-width:7.2rem;height:7.2rem;display:flex;&[data-level=matig]{border-color:#fbbc04}&[data-level=sterk]{border-color:#34a853}& .hec-score-num{color:var(--clr-primary-900);font-family:var(--ff-header);font-size:var(--fs-700);font-weight:var(--fw-bold);line-height:1}& .hec-score-slash{color:var(--clr-primary-700);font-size:var(--fs-300);line-height:1.4}}& .hec-feedback{& .hec-oordeel{color:var(--clr-primary-900);font-size:var(--fs-400);font-weight:var(--fw-semi-bold);line-height:var(--lh-300);margin-block-end:.6rem}& .hec-punten{flex-direction:column;gap:.4rem;margin:0;padding:0;list-style:none;display:flex;& li{color:var(--clr-primary-700);font-size:var(--fs-300);line-height:var(--lh-400);padding-inline-start:1.4rem;position:relative;&:before{content:"✗";color:#ea4335;position:absolute;left:0}}}}& .hec-arrow{color:var(--clr-secondary-900);font-size:var(--fs-300);font-weight:var(--fw-semi-bold);padding-block:var(--size-1);border-block:1px solid #0000000f;align-items:center;gap:.6rem;display:flex}& .hec-better{font-size:var(--fs-400);color:var(--clr-primary-900);font-weight:var(--fw-semi-bold);line-height:var(--lh-400);background:#34a8530f;border:1px solid #34a85333;border-radius:.6rem;padding:1rem 1.2rem}}}@media (width<=1100px){& .hero-grid{gap:var(--size-6);grid-template-columns:1fr}& h1{font-size:var(--fs-700)}& .hero-right{max-width:52rem}}@media (width<=768px){padding-block:var(--size-8);& .trust-strip{gap:var(--size-3)}}}.hc-tool[data-astro-cid-5ljyt764]{background:var(--clr-primary-100);padding-block:var(--size-10);& .tool-grid{gap:var(--size-6);grid-template-columns:1fr 1fr;align-items:start;display:grid}& .tool-form{border-radius:var(--border-radius-card);padding:var(--size-5);gap:var(--size-4);background:#fff;flex-direction:column;display:flex;& .form-title{color:var(--clr-primary-900);font-family:var(--ff-header);font-size:var(--fs-600);font-weight:var(--fw-bold);line-height:1.3}& form{gap:var(--size-3);flex-direction:column;display:flex}}& .field-group{flex-direction:column;gap:.6rem;display:flex;& label{color:var(--clr-primary-900);font-size:var(--fs-400);font-weight:var(--fw-semi-bold);line-height:1.4}& .required{color:var(--clr-secondary-900);margin-inline-start:.2rem}& input,& textarea{background:var(--clr-primary-100);border-radius:var(--border-radius-btn);width:100%;color:var(--clr-primary-900);font-family:var(--ff-base);font-size:var(--fs-400);line-height:var(--lh-400);resize:none;border:1.5px solid #0000001f;padding:1rem 1.2rem;transition:border-color .2s;&::placeholder{color:#07133359}&:focus{border-color:var(--clr-primary-900);background:#fff;outline:none}}& .field-sub{color:var(--clr-primary-700);font-size:var(--fs-300);line-height:var(--lh-400)}}& .form-error{color:#c62828;font-size:var(--fs-400);border-radius:var(--border-radius-btn);line-height:var(--lh-400);background:#ea43350f;border:1px solid #ea433533;padding:.8rem 1.2rem}& .analyze-btn{background:var(--clr-secondary-900);border-radius:var(--border-radius-btn);color:#fff;cursor:pointer;width:100%;font-family:var(--ff-base);font-size:var(--fs-500);font-weight:var(--fw-semi-bold);padding:1.4rem var(--size-4);border:none;justify-content:center;align-items:center;gap:.8rem;min-height:5.4rem;transition:background .2s,opacity .2s;display:flex;&:hover:not(:disabled){background:var(--clr-secondary-800)}&:disabled{opacity:.6;cursor:not-allowed}& .btn-spinner svg{animation:.9s linear infinite spin}}& .result-panel{border-radius:var(--border-radius-card);padding:var(--size-5);background:#fff;flex-direction:column;justify-content:center;min-height:36rem;display:flex;&[data-state=result]{justify-content:flex-start}&[data-state=sent]{justify-content:center}}& .result-state{text-align:center;align-items:center;gap:var(--size-2);flex-direction:column;display:none}& .result-panel[data-state=empty] .result-state--empty,& .result-panel[data-state=loading] .result-state--loading{display:flex}& .result-panel[data-state=result] .result-state--result{text-align:left;align-items:flex-start;display:flex}& .result-panel[data-state=sent] .result-state--sent{display:flex}& .state-icon{background:var(--clr-primary-100);color:#0713334d;width:6rem;height:6rem;border-radius:50%;justify-content:center;align-items:center;margin-block-end:var(--size-1);display:flex;&.state-icon--spin{color:var(--clr-secondary-900);& svg{animation:.9s linear infinite spin}}&.state-icon--sent{color:#1e7e34;background:#34a8531a;border:2px solid #34a8534d}}& .state-title{color:var(--clr-primary-900);font-family:var(--ff-header);font-size:var(--fs-600);font-weight:var(--fw-bold);line-height:1.3}& .state-sub{color:var(--clr-primary-700);font-size:var(--fs-400);line-height:var(--lh-400);max-width:36ch}& .loading-headline{color:var(--clr-primary-900);font-size:var(--fs-400);font-style:italic;font-weight:var(--fw-semi-bold);text-align:center;max-width:36ch;line-height:var(--lh-400)}& .result-headline{width:100%;margin-block-end:var(--size-3);& .result-headline-label{color:var(--clr-primary-700);font-size:var(--fs-300);font-weight:var(--fw-semi-bold);text-transform:uppercase;letter-spacing:.06em;margin-block-end:.4rem}& .result-headline-text{color:var(--clr-primary-900);font-size:var(--fs-500);font-style:italic;font-weight:var(--fw-semi-bold);line-height:var(--lh-300);background:var(--clr-primary-100);border-left:3px solid var(--clr-secondary-900);border-radius:0 .6rem .6rem 0;padding:1rem 1.2rem}}& .result-header{align-items:center;gap:var(--size-4);width:100%;border-bottom:1px solid #0000000f;margin-block-end:var(--size-3);padding-block-end:var(--size-3);display:flex}& .score-ring{border:6px solid #ea4335;border-radius:50%;flex-direction:column;flex-shrink:0;justify-content:center;align-items:center;width:8.8rem;min-width:8.8rem;height:8.8rem;transition:border-color .4s;display:flex;&[data-level=matig]{border-color:#fbbc04}&[data-level=sterk]{border-color:#34a853}& .score-num{color:var(--clr-primary-900);font-family:var(--ff-header);font-size:var(--fs-800);font-weight:var(--fw-bold);line-height:1}& .score-max{color:var(--clr-primary-700);font-size:var(--fs-300);line-height:1.4}}& .score-meta{flex-direction:column;gap:.4rem;display:flex;& .score-level{color:var(--clr-primary-900);font-family:var(--ff-header);font-size:var(--fs-600);font-weight:var(--fw-bold);line-height:1.3}& .score-oordeel{color:var(--clr-primary-700);font-size:var(--fs-400);line-height:var(--lh-400)}}& .result-punten{width:100%;margin-block-end:var(--size-4);& .punten-title{color:var(--clr-primary-900);font-size:var(--fs-400);font-weight:var(--fw-semi-bold);margin-block-end:var(--size-2)}& .punten-list{flex-direction:column;gap:.8rem;margin:0;padding:0;list-style:none;display:flex;& li{color:var(--clr-primary-800);font-size:var(--fs-400);line-height:var(--lh-400);padding-inline-start:var(--size-3);position:relative;&:before{content:"✗";color:#ea4335;font-weight:var(--fw-bold);position:absolute;left:0}}}}& .email-section{width:100%;& .email-divider{height:1px;background:#00000014;margin-block-end:var(--size-3)}& .email-title{color:var(--clr-primary-900);font-family:var(--ff-header);font-size:var(--fs-600);font-weight:var(--fw-bold);margin-block-end:.4rem;line-height:1.3}& .email-sub{color:var(--clr-primary-700);font-size:var(--fs-400);line-height:var(--lh-400);margin-block-end:var(--size-3)}& form{gap:var(--size-2);flex-direction:column;display:flex}& .email-fields{gap:var(--size-2);grid-template-columns:1fr 1fr;display:grid;& input{background:var(--clr-primary-100);border-radius:var(--border-radius-btn);width:100%;color:var(--clr-primary-900);font-family:var(--ff-base);font-size:var(--fs-400);border:1.5px solid #0000001f;padding:1rem 1.2rem;transition:border-color .2s;&::placeholder{color:#07133359}&:focus{border-color:var(--clr-primary-900);background:#fff;outline:none}}@media (width<=600px){grid-template-columns:1fr}}& .email-error{color:#c62828;font-size:var(--fs-400);border-radius:var(--border-radius-btn);line-height:var(--lh-400);background:#ea43350f;border:1px solid #ea433533;padding:.8rem 1.2rem}& .email-btn{background:var(--clr-primary-900);border-radius:var(--border-radius-btn);color:#fff;cursor:pointer;width:100%;font-family:var(--ff-base);font-size:var(--fs-500);font-weight:var(--fw-semi-bold);padding:1.2rem var(--size-4);border:none;justify-content:center;align-items:center;gap:.8rem;min-height:5rem;transition:background .2s,opacity .2s;display:flex;&:hover:not(:disabled){background:#050f28e6}&:disabled{opacity:.6;cursor:not-allowed}& .btn-spinner svg{animation:.9s linear infinite spin}}& .email-privacy{color:var(--clr-primary-700);font-size:var(--fs-300);line-height:var(--lh-400);text-align:center}}& .sent-cta{color:var(--clr-secondary-900);font-size:var(--fs-400);font-weight:var(--fw-semi-bold);text-underline-offset:3px;margin-block-start:var(--size-2);text-decoration:underline;transition:opacity .2s;display:inline-block;&:hover{opacity:.75}}& .sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@media (width<=1100px){& .tool-grid{grid-template-columns:1fr}}@media (width<=768px){padding-block:var(--size-8);& .tool-form,& .result-panel{padding:var(--size-3)}}}@keyframes spin{to{transform:rotate(360deg)}}
