/**
 * RI&E landingspagina (template-rie-landingspagina.php)
 *
 * Alles is gescoped onder .rie zodat de Elementor-kit en de Hello-reset
 * (button/h1-h6/a-kleuren) hier niet doorheen drukken.
 * Merkkleuren en fonts = die van scaves.nl (Elementor-kit); neutrale tinten uit het ontwerp.
 */

.rie {
    /* Merk (Elementor-kit scaves.nl) */
    --rie-yellow: #FFD71D;
    --rie-yellow-hover: #EFC80F;
    --rie-yellow-link: #E8B900;
    --rie-black: #181818;
    --rie-black-2: #262626;
    --rie-black-3: #2E2E2E;

    /* Neutralen uit het ontwerp */
    --rie-sand: #F6F4EE;
    --rie-sand-light: #FBFAF6;
    --rie-cream: #FBF8EC;
    --rie-selected: #FDF6DC;
    --rie-line: #E6E2D8;
    --rie-line-light: #EFEDE6;
    --rie-line-hero: #F0EEE6;
    --rie-input: #D9D5C9;
    --rie-option: #DDD9CD;
    --rie-dot: #C9C4B6;
    --rie-text: #4A463E;
    --rie-text-2: #5A564C;
    --rie-text-3: #3A352A;
    --rie-text-4: #2C2A23;
    --rie-muted: #8A8579;
    --rie-muted-2: #A39E90;
    --rie-on-dark: #B8B4A8;
    --rie-on-dark-2: #EDEAE0;
    --rie-error: #A82B23;

    /* Fonts (scaves.nl): Teko voor koppen, Poppins voor tekst en UI */
    --rie-head: "Teko", "Barlow Semi Condensed", sans-serif;
    --rie-body: "Poppins", sans-serif;

    font-family: var(--rie-body);
    color: var(--rie-black);
    background: #fff;
    -webkit-font-smoothing: antialiased;
}

html:has(body.rie-page) {
    scroll-behavior: smooth;
}

/* Extra CSS (Customizer) zet html, body op overflow-x: hidden; dat maakt body een
   scrollcontainer en breekt de sticky ankerbalk. clip voorkomt net zo goed
   horizontaal scrollen, zonder scrollcontainer. */
html:has(body.rie-page),
body.rie-page {
    overflow-x: clip;
}

.rie *,
.rie *::before,
.rie *::after {
    box-sizing: border-box;
}

.rie ::selection {
    background: var(--rie-yellow);
    color: var(--rie-black);
}

.rie [hidden] {
    display: none !important;
}

.rie section[id] {
    scroll-margin-top: calc(var(--rie-top, 0px) + 64px);
}

.rie-page.admin-bar .rie section[id] {
    scroll-margin-top: calc(var(--rie-top, 32px) + 64px);
}

.rie .rie-wrap {
    max-width: 1200px;
    margin: 0 auto;
    padding-left: 32px;
    padding-right: 32px;
}

.rie ul,
.rie ol {
    list-style: none;
    margin: 0;
    padding: 0;
}

.rie p {
    margin: 0;
}

.rie img {
    max-width: 100%;
}

/* ---------------------------------------------------------------- Basis-elementen */

.rie .rie-diamond {
    display: inline-block;
    flex-shrink: 0;
    width: 9px;
    height: 9px;
    background: var(--rie-yellow);
    transform: rotate(45deg);
}

.rie .rie-diamond--7 { width: 7px; height: 7px; }
.rie .rie-diamond--8 { width: 8px; height: 8px; margin-top: 7px; }
.rie .rie-diamond--list { margin-top: 7px; }
.rie .rie-diamond--32 { width: 32px; height: 32px; }

.rie .rie-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 14px;
    font-family: var(--rie-body);
    font-weight: 600;
    font-size: 12px;
    line-height: 1.3;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--rie-muted);
}

.rie .rie-eyebrow--hero { margin-bottom: 22px; }
.rie .rie-eyebrow--yellow { color: var(--rie-yellow); }

.rie .rie-h2 {
    font-family: var(--rie-head);
    font-weight: 600;
    font-size: clamp(34px, 3.9vw, 48px);
    line-height: 1;
    letter-spacing: 0;
    margin: 0 0 14px;
    color: var(--rie-black);
    text-transform: none;
}

.rie .rie-h2--intro { margin-bottom: 20px; }
.rie .rie-h2--flush { margin-bottom: 0; }
.rie .rie-h2--check { font-size: clamp(35px, 4.1vw, 50px); }
.rie .rie-h2--small { font-size: clamp(30px, 3.2vw, 39px); line-height: 1.04; margin-bottom: 16px; }
.rie .rie-h2--cta { font-size: clamp(34px, 4.1vw, 52px); line-height: .98; margin-bottom: 16px; }

.rie-section--dark .rie-h2 { color: #fff; }

.rie .rie-lead {
    font-size: 15px;
    line-height: 1.6;
    color: var(--rie-text);
}

.rie-section--dark .rie-lead { color: var(--rie-on-dark); }

.rie .rie-heading { margin-bottom: 44px; }
.rie .rie-heading--660 { max-width: 660px; }
.rie .rie-heading--680 { max-width: 680px; margin-bottom: 38px; }
.rie .rie-heading--640 { max-width: 640px; }
.rie .rie-heading--cards { margin-bottom: 42px; }
.rie .rie-heading--faq { margin-bottom: 40px; }

.rie .rie-richtext p {
    font-size: 15px;
    line-height: 1.65;
    color: var(--rie-text);
    margin: 0 0 16px;
}

.rie .rie-richtext--small p {
    font-size: 14.5px;
    line-height: 1.6;
    margin-bottom: 14px;
}

.rie .rie-richtext p:last-child { margin-bottom: 0; }

.rie .rie-richtext a {
    color: var(--rie-black);
    text-decoration: underline;
}

/* ---------------------------------------------------------------- Knoppen */

.rie .rie-btn,
.rie a.rie-btn,
.rie button.rie-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 16px 28px;
    border: 0;
    border-radius: 4px;
    font-family: var(--rie-body);
    font-weight: 600;
    font-size: 15px;
    line-height: 1.2;
    letter-spacing: .03em;
    text-transform: uppercase;
    text-decoration: none;
    text-align: left;
    white-space: normal;
    cursor: pointer;
    transition: background-color .16s ease, color .16s ease;
}

.rie a.rie-btn--yellow,
.rie button.rie-btn--yellow {
    background: var(--rie-yellow);
    color: var(--rie-black);
}

.rie a.rie-btn--yellow:hover,
.rie a.rie-btn--yellow:focus,
.rie button.rie-btn--yellow:hover,
.rie button.rie-btn--yellow:focus {
    background: var(--rie-yellow-hover);
    color: var(--rie-black);
}

.rie a.rie-btn--dark,
.rie button.rie-btn--dark {
    background: var(--rie-black);
    color: #fff;
}

.rie a.rie-btn--dark:hover,
.rie a.rie-btn--dark:focus,
.rie button.rie-btn--dark:hover,
.rie button.rie-btn--dark:focus {
    background: #000;
    color: #fff;
}

.rie a.rie-btn--outline {
    padding: 14px 26px;
    background: transparent;
    color: var(--rie-black);
    border: 2px solid var(--rie-black);
}

.rie a.rie-btn--outline:hover,
.rie a.rie-btn--outline:focus {
    background: var(--rie-black);
    color: #fff;
}

.rie .rie-btn--small,
.rie a.rie-btn--small {
    gap: 9px;
    padding: 14px 24px;
    font-size: 13.5px;
}

.rie a.rie-btn--medium {
    padding: 15px 26px;
    font-size: 14.5px;
}

.rie button.rie-btn--large {
    padding: 17px 32px;
    font-size: 16px;
    letter-spacing: .04em;
}

.rie .rie-textbtn,
.rie button.rie-textbtn {
    background: none;
    border: 0;
    border-radius: 0;
    padding: 0;
    cursor: pointer;
    font-family: var(--rie-body);
    font-size: 14.5px;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: 0;
    text-transform: none;
    color: var(--rie-muted);
}

.rie button.rie-textbtn:hover,
.rie button.rie-textbtn:focus {
    background: none;
    color: var(--rie-black);
}

.rie .rie-btn:focus-visible,
.rie .rie-textbtn:focus-visible,
.rie .rie-option:focus-visible,
.rie .rie-faq__toggle:focus-visible,
.rie .rie-card:focus-visible,
.rie .rie-minicard:focus-visible,
.rie .rie-anchors__link:focus-visible {
    outline: 2px solid var(--rie-black);
    outline-offset: 3px;
}

.rie-section--dark .rie-btn:focus-visible { outline-color: var(--rie-yellow); }

/* ---------------------------------------------------------------- Ankerbalk */

.rie .rie-anchors {
    position: sticky;
    top: var(--rie-top, 0px); /* bijgewerkt door rie.js bij een vaste site-header */
    z-index: 50;
    background: var(--rie-sand-light);
    border-top: 1px solid var(--rie-line-light);
    box-shadow: 0 1px 0 rgba(0, 0, 0, .07);
}

.rie-page.admin-bar .rie .rie-anchors { top: var(--rie-top, 32px); }

.rie .rie-anchors__inner {
    max-width: 1460px;
    margin: 0 auto;
    padding: 0 34px;
    display: flex;
    align-items: center;
    gap: 28px;
    flex-wrap: wrap;
}

.rie .rie-anchors__label {
    padding: 12px 0;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--rie-muted-2);
}

.rie a.rie-anchors__link {
    padding: 12px 0;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.3;
    color: var(--rie-text);
    text-decoration: none;
    white-space: nowrap;
}

.rie a.rie-anchors__link:hover,
.rie a.rie-anchors__link:focus { color: #1D1D1B; }

.rie a.rie-anchors__link--accent {
    font-weight: 700;
    color: #1D1D1B;
    border-bottom: 2px solid var(--rie-yellow);
}

.rie a.rie-anchors__link--accent:hover { color: #000; }

/* ---------------------------------------------------------------- Hero */

.rie .rie-hero {
    background: #fff;
    border-bottom: 1px solid var(--rie-line-hero);
}

.rie .rie-hero__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.06fr) minmax(0, .94fr);
    gap: 60px;
    align-items: center;
    padding-top: 74px;
    padding-bottom: 80px;
}

.rie .rie-hero__grid--single { grid-template-columns: minmax(0, 1fr); }
.rie .rie-hero__grid--single .rie-hero__title { max-width: 820px; }

.rie .rie-hero__title {
    font-family: var(--rie-head);
    font-weight: 600;
    font-size: clamp(45px, 5.6vw, 68px);
    line-height: .96;
    letter-spacing: 0;
    text-transform: none;
    margin: 0 0 22px;
    color: var(--rie-black);
}

.rie .rie-hero__text {
    font-size: 16.5px;
    line-height: 1.6;
    color: var(--rie-text);
    margin: 0 0 32px;
    max-width: 530px;
}

.rie .rie-hero__buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-bottom: 36px;
}

.rie .rie-hero__features {
    display: flex;
    flex-wrap: wrap;
    gap: 18px 28px;
}

.rie .rie-hero__features li {
    display: flex;
    align-items: center;
    gap: 9px;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--rie-black);
}

.rie .rie-photo {
    position: relative;
}

.rie .rie-photo__accent {
    position: absolute;
    z-index: 0;
    width: 66%;
    height: 66%;
    right: -16px;
    bottom: -16px;
    background: var(--rie-yellow);
    border-radius: 8px;
}

.rie .rie-photo__img {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
    object-fit: cover;
    border-radius: 8px;
}

.rie .rie-photo--hero .rie-photo__img {
    height: auto;
    aspect-ratio: 1 / 1;
    max-height: 500px;
    box-shadow: 0 24px 50px -24px rgba(0, 0, 0, .32);
}

.rie .rie-photo--cert .rie-photo__accent {
    width: 60%;
    height: 60%;
    right: auto;
    bottom: auto;
    left: -16px;
    top: -16px;
}

.rie .rie-photo--cert .rie-photo__img {
    height: 440px;
}

/* ---------------------------------------------------------------- Trustbar */

.rie .rie-trust {
    background: var(--rie-black);
    color: #fff;
}

.rie .rie-trust__list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 18px 30px;
    padding-top: 22px;
    padding-bottom: 22px;
}

.rie .rie-trust__list li {
    display: flex;
    align-items: center;
    gap: 11px;
    font-size: 13.5px;
    font-weight: 500;
    color: var(--rie-on-dark-2);
}

.rie .rie-trust__list .rie-diamond--8 { margin-top: 0; }

/* ---------------------------------------------------------------- Secties */

.rie .rie-section {
    padding-top: 84px;
    padding-bottom: 88px;
    background: #fff;
}

.rie .rie-section--sand { background: var(--rie-sand); }
.rie .rie-section--dark { background: var(--rie-black); color: #fff; }

.rie .rie-intro,
.rie .rie-cert,
.rie .rie-inspecties { padding-bottom: 84px; }

.rie .rie-trainingen { padding-bottom: 90px; }

/* Wat is een RI&E */

.rie .rie-intro__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 56px;
    align-items: start;
}

.rie .rie-panel {
    background: var(--rie-sand);
    border-radius: 12px;
    padding: 34px 32px;
}

.rie .rie-panel__title {
    font-family: var(--rie-head);
    font-weight: 600;
    font-size: 23px;
    line-height: 1.1;
    letter-spacing: .02em;
    text-transform: uppercase;
    color: var(--rie-black);
    margin: 0 0 20px;
}

.rie .rie-panel__title--small {
    font-size: 19.5px;
    letter-spacing: .03em;
    margin-bottom: 18px;
}

.rie .rie-panel__list {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.rie .rie-panel__list li {
    display: flex;
    gap: 13px;
}

.rie .rie-panel__item-title {
    font-weight: 700;
    font-size: 14px;
    line-height: 1.4;
    color: var(--rie-black);
    margin-bottom: 2px;
}

.rie .rie-panel__item-text {
    font-size: 13px;
    line-height: 1.55;
    color: var(--rie-text-2);
}

.rie .rie-panel__button { margin-top: 26px; }

.rie .rie-panel--small {
    border-radius: 10px;
    padding: 30px 28px;
}

/* Werkwijze */

.rie .rie-steps {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 20px;
}

.rie .rie-step {
    background: #fff;
    border: 1px solid var(--rie-line);
    border-radius: 10px;
    padding: 26px 24px;
}

.rie .rie-step__nr {
    font-family: var(--rie-head);
    font-weight: 600;
    font-size: 39px;
    line-height: .9;
    color: var(--rie-yellow);
    margin-bottom: 14px;
}

.rie .rie-step__title {
    font-family: var(--rie-head);
    font-weight: 600;
    font-size: 21.5px;
    line-height: 1.05;
    letter-spacing: 0;
    text-transform: none;
    margin: 0 0 8px;
    color: var(--rie-black);
}

.rie .rie-step__text p {
    font-size: 12.6px;
    line-height: 1.55;
    color: var(--rie-text-2);
    margin: 0 0 12px;
}

.rie .rie-step__text p:last-child { margin-bottom: 0; }

.rie .rie-step--dark {
    background: var(--rie-black);
    border-color: var(--rie-black);
}

.rie .rie-step--dark .rie-step__title { color: #fff; }
.rie .rie-step--dark .rie-step__text p { color: var(--rie-on-dark); }

.rie .rie-step--dark .rie-step__text p:last-child { margin-bottom: 12px; }

.rie .rie-step__text a {
    color: var(--rie-yellow);
    text-decoration: none;
    border-bottom: 1px solid rgba(255, 215, 29, .45);
}

.rie .rie-step__text a:hover { color: var(--rie-yellow); border-bottom-color: var(--rie-yellow); }

/* ---------------------------------------------------------------- RI&E-check */

.rie .rie-check__card {
    background: #fff;
    border-radius: 14px;
    overflow: hidden;
    max-width: 900px;
    color: var(--rie-black);
}

.rie .rie-check__pad {
    padding: clamp(28px, 4vw, 44px);
}

.rie .rie-check__pad--vraag {
    padding: clamp(26px, 3vw, 38px) clamp(24px, 4vw, 44px) clamp(30px, 4vw, 42px);
}

.rie .rie-check__pad--done {
    padding: clamp(36px, 4.4vw, 52px) clamp(24px, 4vw, 44px);
}

.rie .rie-check__h3 {
    font-family: var(--rie-head);
    font-weight: 600;
    font-size: 31px;
    line-height: 1.05;
    letter-spacing: 0;
    text-transform: none;
    margin: 0 0 16px;
    color: var(--rie-black);
}

.rie .rie-check__promises {
    display: flex;
    flex-direction: column;
    gap: 13px;
    margin-bottom: 32px;
    max-width: 640px;
}

.rie .rie-check__promises li {
    display: flex;
    gap: 13px;
    align-items: flex-start;
    font-size: 14.5px;
    line-height: 1.55;
    color: var(--rie-text-4);
}

.rie .rie-check__promises .rie-diamond { margin-top: 8px; }

.rie .rie-check__note {
    font-size: 12.6px;
    color: var(--rie-muted);
    margin-top: 16px;
}

.rie .rie-check__progress {
    height: 5px;
    background: var(--rie-line-light);
}

.rie .rie-check__progress span {
    display: block;
    height: 5px;
    width: 0;
    background: var(--rie-yellow);
    transition: width .2s ease;
}

.rie .rie-check__meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 18px;
}

.rie .rie-check__step {
    font-family: var(--rie-body);
    font-weight: 600;
    font-size: 12.2px;
    letter-spacing: .11em;
    text-transform: uppercase;
    color: var(--rie-muted);
}

.rie .rie-check__question {
    font-family: var(--rie-head);
    font-weight: 600;
    font-size: clamp(26px, 3.1vw, 35px);
    line-height: 1.08;
    letter-spacing: 0;
    text-transform: none;
    margin: 0 0 8px;
    max-width: 640px;
    color: var(--rie-black);
    outline: none;
}

.rie .rie-check__hint {
    font-size: 13.5px;
    line-height: 1.5;
    color: var(--rie-muted);
    margin: 0 0 24px;
    max-width: 600px;
}

.rie .rie-options {
    display: flex;
    flex-direction: column;
    gap: 10px;
    max-width: 660px;
}

.rie button.rie-option {
    display: flex;
    align-items: center;
    gap: 14px;
    width: 100%;
    text-align: left;
    background: #fff;
    border: 1.5px solid var(--rie-option);
    border-radius: 8px;
    padding: 15px 18px;
    cursor: pointer;
    font-family: var(--rie-body);
    font-size: 14.5px;
    font-weight: 500;
    line-height: 1.4;
    letter-spacing: 0;
    text-transform: none;
    white-space: normal;
    color: var(--rie-black);
    transition: border-color .12s ease, background-color .12s ease;
}

.rie button.rie-option:hover,
.rie button.rie-option:focus {
    background: #fff;
    color: var(--rie-black);
    border-color: var(--rie-black);
}

.rie button.rie-option[aria-pressed="true"],
.rie button.rie-option[aria-checked="true"] {
    background: var(--rie-selected);
    border-color: var(--rie-black);
}

.rie .rie-option__dot {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    border: 1.5px solid var(--rie-dot);
    background: #fff;
    color: var(--rie-black);
}

.rie .rie-option--multi .rie-option__dot { border-radius: 4px; }

.rie .rie-option__dot svg { display: none; }

.rie [aria-pressed="true"] .rie-option__dot,
.rie [aria-checked="true"] .rie-option__dot {
    background: var(--rie-yellow);
    border-color: var(--rie-black);
}

.rie [aria-pressed="true"] .rie-option__dot svg,
.rie [aria-checked="true"] .rie-option__dot svg { display: block; }

.rie button.rie-btn--next {
    margin-top: 24px;
    padding: 15px 30px;
    font-size: 15px;
    letter-spacing: .04em;
}

/* Resultaat */

.rie .rie-result__head {
    background: var(--rie-black);
    padding: clamp(28px, 3.4vw, 38px) clamp(24px, 4vw, 44px);
}

.rie .rie-result__label {
    font-family: var(--rie-body);
    font-weight: 600;
    font-size: 12.2px;
    letter-spacing: .11em;
    text-transform: uppercase;
    color: var(--rie-yellow);
    margin-bottom: 12px;
}

.rie .rie-result__title {
    font-family: var(--rie-head);
    font-weight: 600;
    font-size: clamp(28.5px, 3.4vw, 41px);
    line-height: 1.02;
    letter-spacing: 0;
    text-transform: none;
    margin: 0 0 12px;
    color: #fff;
    max-width: 640px;
    outline: none;
}

.rie .rie-result__text {
    font-size: 14.5px;
    line-height: 1.55;
    color: var(--rie-on-dark);
    margin: 0 0 24px;
    max-width: 620px;
}

.rie .rie-meter { max-width: 420px; }

.rie .rie-meter__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 8px;
}

.rie .rie-meter__label {
    font-size: 12.6px;
    font-weight: 600;
    color: var(--rie-on-dark);
}

.rie .rie-meter__count {
    font-family: var(--rie-head);
    font-weight: 600;
    font-size: 25px;
    line-height: 1;
    color: var(--rie-yellow);
}

.rie .rie-meter__bar {
    height: 6px;
    background: var(--rie-black-3);
    border-radius: 3px;
    overflow: hidden;
}

.rie .rie-meter__bar span {
    display: block;
    height: 6px;
    width: 0;
    background: var(--rie-yellow);
    transition: width .4s ease;
}

.rie .rie-result__body {
    padding: clamp(28px, 3.4vw, 38px) clamp(24px, 4vw, 44px) clamp(32px, 4vw, 44px);
}

.rie .rie-h4 {
    font-family: var(--rie-head);
    font-weight: 600;
    font-size: 23px;
    line-height: 1.1;
    letter-spacing: .03em;
    text-transform: uppercase;
    color: var(--rie-black);
    margin: 0 0 18px;
}

.rie .rie-h4--intro { margin-bottom: 8px; }

.rie .rie-result__intro {
    font-size: 13.5px;
    line-height: 1.55;
    color: var(--rie-text-2);
    margin: 0 0 18px;
    max-width: 620px;
}

.rie .rie-points {
    display: flex;
    flex-direction: column;
    gap: 13px;
    margin-bottom: 34px;
}

.rie .rie-point {
    background: var(--rie-cream);
    border-left: 3px solid var(--rie-yellow);
    border-radius: 0 8px 8px 0;
    padding: 16px 20px;
}

.rie .rie-point__t {
    font-weight: 700;
    font-size: 14.5px;
    line-height: 1.4;
    color: var(--rie-black);
    margin-bottom: 4px;
}

.rie .rie-point__d {
    font-size: 13px;
    line-height: 1.55;
    color: var(--rie-text-2);
}

.rie .rie-minicards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr));
    gap: 12px;
    margin-bottom: 36px;
}

.rie a.rie-minicard {
    display: block;
    background: var(--rie-sand);
    border: 1px solid var(--rie-line);
    border-radius: 8px;
    padding: 18px;
    text-decoration: none;
    color: var(--rie-black);
    transition: background-color .12s ease;
}

.rie a.rie-minicard:hover,
.rie a.rie-minicard:focus {
    background: var(--rie-cream);
    color: var(--rie-black);
}

.rie .rie-minicard__naam {
    font-family: var(--rie-head);
    font-weight: 600;
    font-size: 20.5px;
    line-height: 1.05;
    color: var(--rie-black);
    margin-bottom: 5px;
}

.rie .rie-minicard__reden {
    font-size: 12.6px;
    line-height: 1.45;
    color: var(--rie-text-2);
    margin-bottom: 12px;
}

.rie .rie-minicard__more {
    font-weight: 600;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: var(--rie-black);
}

.rie .rie-measures {
    display: flex;
    flex-direction: column;
    gap: 11px;
    margin-bottom: 36px;
    max-width: 640px;
}

.rie .rie-measures li {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    font-size: 13.5px;
    line-height: 1.55;
    color: var(--rie-text-3);
}

/* Leadformulier (WPForms) */

.rie .rie-lead-form {
    border-top: 1px solid var(--rie-line-light);
    padding-top: 32px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    column-gap: 18px;
}

.rie .rie-lead-form > * { flex: 0 0 100%; }

.rie .rie-lead-form__title {
    font-family: var(--rie-head);
    font-weight: 600;
    font-size: 28.5px;
    line-height: 1.05;
    letter-spacing: 0;
    text-transform: none;
    margin: 0 0 10px;
    color: var(--rie-black);
    max-width: 560px;
}

.rie .rie-lead-form__text {
    font-size: 14px;
    line-height: 1.6;
    color: var(--rie-text);
    margin: 0 0 26px;
    max-width: 580px;
}

.rie .rie-lead-form__error {
    font-size: 13px;
    font-weight: 600;
    color: var(--rie-error);
    margin: 16px 0 0;
}

/* Zolang JS de knop "opnieuw" niet naast de verzendknop heeft gezet */
.rie .rie-lead-form > .rie-textbtn--restart { flex: 0 0 auto; margin-top: 18px; }

.rie .rie-form .wpforms-container,
.rie .rie-form .wpforms-container-full {
    margin: 0 !important;
    max-width: 660px;
}

.rie .rie-form .wpforms-form .wpforms-field-container {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr));
    gap: 14px;
    margin-bottom: 20px;
}

.rie .rie-form .wpforms-form .wpforms-field {
    padding: 0 !important;
    margin: 0 !important;
    max-width: none !important;
}

.rie .rie-form .wpforms-form .wpforms-field.rie-verborgen,
.rie .rie-form .wpforms-form .wpforms-field-textarea.rie-resultaat {
    display: none !important;
}

.rie .rie-form .wpforms-form .wpforms-field-label {
    display: block;
    font-family: var(--rie-body);
    font-size: 12.5px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: var(--rie-text-2) !important;
    margin: 0 0 7px !important;
    padding: 0 !important;
}

.rie .rie-form .wpforms-form .wpforms-required-label { display: none; }

.rie .rie-form .wpforms-form input[type="text"],
.rie .rie-form .wpforms-form input[type="email"],
.rie .rie-form .wpforms-form input[type="tel"] {
    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    font-family: var(--rie-body) !important;
    font-size: 15.5px !important;
    line-height: 1.3 !important;
    color: var(--rie-black) !important;
    padding: 14px 15px !important;
    border: 1.5px solid var(--rie-input) !important;
    border-radius: 7px !important;
    background: #fff !important;
    box-shadow: none !important;
    outline: none;
}

.rie .rie-form .wpforms-form input:focus {
    border-color: var(--rie-black) !important;
}

.rie .rie-form .wpforms-form input.wpforms-error {
    border-color: var(--rie-error) !important;
}

.rie .rie-form .wpforms-form label.wpforms-error,
.rie .rie-form .wpforms-form em.wpforms-error {
    font-size: 13px !important;
    color: var(--rie-error) !important;
    margin-top: 6px !important;
}

.rie .rie-form .wpforms-form .wpforms-submit-container {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 18px;
    padding: 0 !important;
    margin: 0 !important;
}

.rie .rie-form .wpforms-form button.wpforms-submit,
.rie .rie-form .wpforms-form button[type="submit"] {
    display: inline-flex;
    align-items: center;
    height: auto !important;
    background: var(--rie-yellow) !important;
    color: var(--rie-black) !important;
    font-family: var(--rie-body) !important;
    font-weight: 600 !important;
    font-size: 16px !important;
    line-height: 1.2 !important;
    letter-spacing: .04em;
    text-transform: uppercase;
    padding: 17px 32px !important;
    border: 0 !important;
    border-radius: 4px !important;
    box-shadow: none !important;
    cursor: pointer;
}

.rie .rie-form .wpforms-form button.wpforms-submit:hover,
.rie .rie-form .wpforms-form button.wpforms-submit:focus {
    background: var(--rie-yellow-hover) !important;
    color: var(--rie-black) !important;
}

.rie .rie-form .wpforms-form button.wpforms-submit:focus-visible {
    outline: 2px solid var(--rie-black);
    outline-offset: 3px;
}

.rie .rie-form .wpforms-form .rie-textbtn { font-size: 14.5px; }

.rie .rie-form .wpforms-submit-spinner { margin: 0 !important; }

.rie .rie-form .wpforms-error-container,
.rie .rie-form .wpforms-error-noscript {
    color: var(--rie-error);
    font-size: 14.5px;
    margin-bottom: 16px;
}

/* Bedankt */

.rie .rie-done__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background: var(--rie-yellow);
    color: var(--rie-black);
    margin-bottom: 22px;
}

.rie .rie-done__title {
    font-family: var(--rie-head);
    font-weight: 600;
    font-size: 34px;
    line-height: 1.05;
    letter-spacing: 0;
    text-transform: none;
    margin: 0 0 12px;
    color: var(--rie-black);
    outline: none;
}

.rie .rie-done__text {
    font-size: 15px;
    line-height: 1.6;
    color: var(--rie-text);
    margin: 0 0 26px;
    max-width: 560px;
}

/* ---------------------------------------------------------------- Wat volgt er uit uw RI&E */

.rie .rie-cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 22px;
}

.rie a.rie-card,
.rie div.rie-card {
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid var(--rie-line);
    border-radius: 10px;
    overflow: hidden;
    text-decoration: none;
    color: var(--rie-black);
    transition: transform .16s ease, box-shadow .16s ease;
}

.rie a.rie-card:hover,
.rie a.rie-card:focus {
    transform: translateY(-5px);
    box-shadow: 0 22px 40px -22px rgba(0, 0, 0, .35);
    color: var(--rie-black);
}

.rie .rie-card__media {
    position: relative;
    height: 180px;
}

.rie .rie-card__media--plain {
    background: var(--rie-sand);
    display: flex;
    align-items: center;
    justify-content: center;
}

.rie .rie-card__img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.rie .rie-card__img--top { object-position: center 30%; }

.rie .rie-card__badge {
    position: absolute;
    left: 12px;
    top: 12px;
    background: var(--rie-yellow);
    color: var(--rie-black);
    font-weight: 600;
    font-size: 10.5px;
    line-height: 1.3;
    letter-spacing: .06em;
    text-transform: uppercase;
    padding: 5px 10px;
    border-radius: 3px;
}

.rie .rie-card__badge--dark {
    background: var(--rie-black);
    color: #fff;
}

.rie .rie-card__body {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding: 20px 22px 22px;
}

.rie .rie-card__title {
    font-family: var(--rie-head);
    font-weight: 600;
    font-size: 25px;
    line-height: 1;
    letter-spacing: 0;
    text-transform: none;
    margin: 0 0 8px;
    color: var(--rie-black);
}

.rie .rie-card__text {
    flex: 1;
    font-size: 12.6px;
    line-height: 1.55;
    color: var(--rie-text-2);
    margin: 0 0 18px;
}

.rie .rie-card__more {
    font-weight: 600;
    font-size: 12.2px;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--rie-black);
}

.rie .rie-bar {
    margin-top: 28px;
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    background: var(--rie-sand);
    border-radius: 10px;
    padding: 22px 26px;
}

.rie .rie-bar__text {
    flex: 1;
    min-width: 240px;
    font-size: 14.5px;
    font-weight: 600;
    line-height: 1.5;
    color: var(--rie-black);
}

.rie a.rie-bar__button { white-space: nowrap; }

/* ---------------------------------------------------------------- Waarom SCAVES */

.rie .rie-usps__grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 2px;
    background: var(--rie-black-2);
    border-radius: 10px;
    overflow: hidden;
}

.rie .rie-usp {
    background: var(--rie-black);
    padding: 30px 28px;
}

.rie .rie-usp__nr {
    font-family: var(--rie-head);
    font-weight: 600;
    font-size: 16px;
    line-height: 1;
    letter-spacing: .1em;
    color: var(--rie-yellow);
    margin-bottom: 12px;
}

.rie .rie-usp__title {
    font-family: var(--rie-head);
    font-weight: 600;
    font-size: 23px;
    line-height: 1.05;
    letter-spacing: 0;
    text-transform: none;
    margin: 0 0 8px;
    color: #fff;
}

.rie .rie-usp__text {
    font-size: 13px;
    line-height: 1.55;
    color: var(--rie-on-dark);
}

/* ---------------------------------------------------------------- Certificering */

.rie .rie-cert__grid {
    display: grid;
    grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
    gap: 56px;
    align-items: center;
}

.rie .rie-cert__grid--single { grid-template-columns: minmax(0, 1fr); }

.rie .rie-cert__text {
    font-size: 15px;
    line-height: 1.65;
    color: var(--rie-text);
    margin: 0 0 24px;
}

.rie .rie-bullets {
    display: flex;
    flex-direction: column;
}

.rie .rie-bullets li {
    display: flex;
    align-items: flex-start;
}

.rie .rie-bullets--cert {
    gap: 14px;
    margin-bottom: 30px;
}

.rie .rie-bullets--cert li {
    gap: 13px;
    font-size: 14px;
    line-height: 1.55;
    color: var(--rie-text-4);
}

.rie .rie-bullets--cert strong { font-weight: 700; }

.rie .rie-bullets--small {
    gap: 13px;
    margin-bottom: 26px;
}

.rie .rie-bullets--small li {
    gap: 12px;
    font-size: 13.5px;
    line-height: 1.5;
    color: var(--rie-text-3);
}

/* ---------------------------------------------------------------- Werkplekinspecties */

.rie .rie-inspecties__box {
    border: 1px solid var(--rie-line);
    border-radius: 12px;
    padding: 44px 42px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 48px;
    align-items: center;
}

/* ---------------------------------------------------------------- FAQ */

.rie .rie-faq__list {
    display: flex;
    flex-direction: column;
    gap: 10px;
    max-width: 900px;
}

.rie .rie-faq__item {
    background: #fff;
    border: 1px solid var(--rie-line);
    border-radius: 8px;
    overflow: hidden;
}

.rie .rie-faq__q {
    margin: 0;
    font: inherit;
}

.rie button.rie-faq__toggle {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    text-align: left;
    background: none;
    border: 0;
    border-radius: 0;
    padding: 20px 24px;
    cursor: pointer;
    font-family: var(--rie-body);
    font-size: 15px;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: 0;
    text-transform: none;
    white-space: normal;
    color: var(--rie-black);
}

.rie button.rie-faq__toggle:hover,
.rie button.rie-faq__toggle:focus {
    background: var(--rie-cream);
    color: var(--rie-black);
}

.rie .rie-faq__sign {
    flex-shrink: 0;
    font-family: var(--rie-head);
    font-weight: 600;
    font-size: 25px;
    line-height: 1;
    color: var(--rie-yellow);
}

.rie .rie-faq__a {
    padding: 0 24px 22px;
    font-size: 14px;
    line-height: 1.65;
    color: var(--rie-text);
    max-width: 760px;
}

/* ---------------------------------------------------------------- CTA */

.rie .rie-cta { background: var(--rie-yellow); }

.rie .rie-cta__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
    align-items: stretch;
}

.rie .rie-cta__grid--single { grid-template-columns: minmax(0, 1fr); }

.rie .rie-cta__content {
    padding: 74px 48px 74px 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.rie .rie-cta__text {
    font-size: 16px;
    line-height: 1.6;
    color: var(--rie-text-3);
    margin: 0 0 30px;
    max-width: 520px;
}

.rie .rie-cta__buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
}

.rie .rie-cta__media {
    position: relative;
    min-height: 340px;
    margin: 36px 0;
}

.rie .rie-cta__img {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 8px;
    box-shadow: 0 20px 44px -22px rgba(0, 0, 0, .4);
}

/* ---------------------------------------------------------------- Responsive */

@media (max-width: 960px) {
    .rie .rie-hero__grid,
    .rie .rie-intro__grid,
    .rie .rie-cert__grid,
    .rie .rie-inspecties__box,
    .rie .rie-cta__grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .rie .rie-hero__grid { gap: 48px; padding-top: 56px; padding-bottom: 64px; }
    .rie .rie-intro__grid { gap: 40px; }
    .rie .rie-cert__grid { gap: 48px; }
    .rie .rie-inspecties__box { gap: 32px; }

    .rie .rie-photo--hero,
    .rie .rie-photo--cert { margin-right: 16px; }
    .rie .rie-photo--cert { margin-left: 16px; margin-right: 0; }
    .rie .rie-photo--cert .rie-photo__img { height: 360px; }

    .rie .rie-cta__content { padding: 64px 0 0; }
    .rie .rie-cta__media { min-height: 300px; margin: 36px 0 56px; }
}

@media (max-width: 1100px) {
    /* Ankerbalk: één regel die horizontaal scrolt, i.p.v. meerdere regels sticky */
    .rie .rie-anchors__inner {
        flex-wrap: nowrap;
        overflow-x: auto;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }
    .rie .rie-anchors__inner::-webkit-scrollbar { display: none; }
    .rie .rie-anchors__label { white-space: nowrap; }
}

@media (max-width: 767px) {
    .rie .rie-wrap { padding-left: 20px; padding-right: 20px; }

    .rie .rie-section { padding-top: 64px; padding-bottom: 68px; }
    .rie .rie-intro,
    .rie .rie-cert,
    .rie .rie-inspecties { padding-bottom: 64px; }
    .rie .rie-trainingen { padding-bottom: 68px; }

    .rie .rie-heading { margin-bottom: 32px; }

    .rie .rie-anchors__inner { padding: 0 20px; gap: 22px; }

    .rie .rie-hero__text { font-size: 15px; }

    .rie .rie-trust__list { flex-direction: column; align-items: flex-start; gap: 12px; }

    .rie .rie-panel { padding: 28px 24px; }
    .rie .rie-inspecties__box { padding: 28px 22px; }

    .rie .rie-photo--cert .rie-photo__img { height: 280px; }

    .rie .rie-usp { padding: 26px 24px; }
}

@media (max-width: 782px) {
    .rie-page.admin-bar .rie .rie-anchors { top: var(--rie-top, 46px); }
}

@media (max-width: 600px) {
    .rie-page.admin-bar .rie .rie-anchors { top: var(--rie-top, 0px); }
}

@media (prefers-reduced-motion: reduce) {
    html:has(body.rie-page) { scroll-behavior: auto; }
    .rie a.rie-card,
    .rie .rie-check__progress span,
    .rie .rie-meter__bar span { transition: none; }
    .rie a.rie-card:hover { transform: none; }
}
