/* Q-pages: offertepagina's per categorie (design/offerte: integration.md 4, spec.md). Breakpoints: > 1024 · 641-1024 · <= 640. */

.qo { interpolate-size: allow-keywords; letter-spacing: 0; }
.qo .qo-inner { display: flex; flex-direction: column; gap: 48px; padding-top: 20px; padding-bottom: 64px; }
.qo p:not(.qof *) { margin: 0 !important; } /* не трогать конфигуратор q-offerte: у его формы свои отступы */
.qo ul, .qo ol, .qo figure { margin: 0; padding: 0; list-style: none; }
.qo :is(h1, h2, h3):not(.qof *) { margin: 0 !important; padding: 0; letter-spacing: 0 !important; text-transform: none !important; }
.qo .q-icon { flex: none; }
.qo a:not(.q-btn):not(.qof *) { text-decoration: none !important; }
.qo [tabindex="-1"]:focus { outline: none; }

/* Typografie en kleine bouwstenen */
.qo .qo-h1 { font-family: var(--q-font-heading) !important; font-weight: 400 !important; font-size: 42px !important; line-height: 1.12 !important; color: var(--q-text-heading) !important; }
.qo .qo-h2, .qo .qo-show__h2, .qo .qo-stock__h2 { font-family: var(--q-font-heading) !important; font-weight: 400 !important; font-size: 34px !important; line-height: 1.2 !important; color: var(--q-text-heading) !important; }
.qo .qo-h2--reviews { font-size: 32px !important; }
.qo .qo-model__name, .qo .qo-step__title, .qo .qo-show__title { font-family: var(--q-font-body) !important; font-weight: 600 !important; letter-spacing: 0 !important; color: var(--q-text-heading) !important; }
.qo-sec-head { display: flex; flex-wrap: wrap; gap: 28px; align-items: flex-end; justify-content: space-between; }
.qo-sec-head__text { display: flex; flex-direction: column; gap: 8px; max-width: 60ch; }
.qo .qo-sec-lead { font-size: 15.5px; font-weight: 300; line-height: 1.7; color: var(--q-text-body); }
.qo-card-title { font-size: 16px; font-weight: 600; line-height: 1.7; color: var(--q-text-heading); }
.qo-textlink, .qo a.qo-textlink { display: inline-flex; align-items: center; gap: 6px; font-size: 15px; font-weight: 500; line-height: 1.7; color: var(--q-orange-text) !important; white-space: nowrap; transition: color var(--q-fast) var(--q-ease); }
.qo-textlink .q-icon { transition: transform var(--q-fast) var(--q-ease); }
.qo a.qo-textlink:hover { color: var(--q-orange-deep) !important; text-decoration: underline !important; text-underline-offset: 3px; }
.qo-textlink:hover .q-icon { transform: translateX(3px); }
.qo-kicker { display: inline-flex; align-items: center; gap: 8px; font-size: 12.5px; font-weight: 600; line-height: 1.7; letter-spacing: .06em; text-transform: uppercase; color: var(--q-orange-light); }
.qo-kicker--stock { color: var(--q-orange-text); }
.qo-disc { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 38px; height: 38px; border-radius: 999px; background: var(--q-sand); }
.qo .qo-img { display: block; width: 100%; border-radius: 12px; }
.qo-list { display: grid; gap: 10px; }
.qo-list li { display: grid; grid-template-columns: 16px 1fr; gap: 10px; align-items: start; margin: 0; font-size: 14px; font-weight: 300; line-height: 1.5; color: var(--q-text-body); }
.qo-list li .q-icon { margin-top: 2px; }

/* Kop */
.qo-kop { display: flex; flex-direction: column; gap: 14px; }
.qo-kop__grid { display: grid; grid-template-columns: 1fr auto; gap: 40px; align-items: center; }
.qo-kop__text { display: flex; flex-direction: column; gap: 9px; min-width: 0; }
.qo .qo-lead { max-width: 72ch; font-size: 16.5px; font-weight: 300; line-height: 1.65; color: var(--q-text-body); }
.qo .qo-lead--kort, .qo .qo-trust-m { display: none; }
.qo-trust { display: flex; flex-direction: column; gap: 8px; align-items: flex-end; white-space: nowrap; }
.qo-trust li { display: flex; gap: 8px; align-items: center; margin: 0; font-size: 13.5px; font-weight: 300; line-height: 1.7; color: var(--q-text-body); }

/* Categoriewissel */
.qo-switch { display: flex; flex-wrap: wrap; gap: 8px; border-top: 1px solid var(--q-border-warm); padding-top: 12px; }
.qo-switch__label { align-self: center; margin-right: 2px; font-size: 13.5px; font-weight: 300; line-height: 1.7; color: var(--q-text-muted-strong); }
.qo .qo-switch .qs-chip { line-height: 1.7; }
.qo .qo-switch .qs-chip__n { opacity: 1; color: var(--q-text-muted-strong); }
.qo .qo-switch a.qs-chip:focus-visible { border-color: var(--q-orange); }
.qo .qo-switch--bottom { display: none; }

/* Configurator */
.qo-group { display: flex; flex-direction: column; gap: 16px; }
.qo-tool { display: flex; flex-direction: column; gap: 14px; padding: 20px; background: var(--q-sand); border: 1px solid var(--q-sand-deep); border-radius: 20px; }
/* Geen overflow:hidden: pop-ups van de widget mogen niet afgeknipt worden. */
.qo-tool__frame { min-height: var(--qo-tool-h, 720px); background: var(--q-white); border-radius: 12px; }
.qo-qof { min-width: 0; } /* конфигуратор q-offerte: без панели и рамки, карточки опций прямо на фоне страницы */
.qo-tool__notes { display: flex; flex-wrap: wrap; gap: 8px 22px; justify-content: space-between; align-items: center; }
.qo-tool__note { display: inline-flex; gap: 9px; align-items: center; font-size: 14.5px; font-weight: 300; line-height: 1.7; color: var(--q-text-body); }
.qo-tool__time { font-size: 14px; }

/* Uitleg */
.qo-uitleg { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 20px; align-items: start; }
.qo-uitleg--hulp { grid-template-columns: minmax(0, 436fr) minmax(0, 349fr) minmax(0, 375fr); align-items: stretch; }
.qo .qo-keuzes { gap: 12px; padding: 20px 22px; }
.qo-uitleg:not(.qo-uitleg--hulp) .qo-list { grid-template-columns: 1fr 1fr; gap: 10px 22px; }
.qo .qo-uitleg__foto { height: 250px; }
.qo-hulp .qg-card__title { line-height: 1.7; }

/* Modellen */
.qo-modellen { display: flex; flex-direction: column; gap: 18px; }
.qo-models { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.qo .qo-model .qo-model__img { width: 100%; height: 220px; border-radius: 0; }
.qo-model__body { display: flex; flex-direction: column; gap: 9px; flex-grow: 1; padding: 16px 18px 18px; }
.qo .qo-model__name { font-size: 18px !important; line-height: 1.7 !important; }
.qo .qo-model__link { color: inherit !important; }
.qo-model__link::after { content: ""; position: absolute; inset: 0; border-radius: 12px; }
.qo .qo-model__link:focus-visible { outline: none; box-shadow: none; }
.qo-model__link:focus-visible::after { box-shadow: inset 0 0 0 2px var(--q-orange-text); }
.qo .qo-model__text { font-size: 14px; font-weight: 300; line-height: 1.55; color: var(--q-text-body); }
.qo .qo-chips { display: flex; flex-wrap: wrap; gap: 6px; padding-top: 2px; }
.qo-chips li { margin: 0; padding: 4px 10px; border-radius: 999px; background: var(--q-sand-light); border: 1px solid var(--q-border-warm); font-size: 12px; font-weight: 300; line-height: 1.7; color: var(--q-text-body); }
.qo .qo-model__kort { display: none; }
.qo-model__foot { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; margin-top: auto; padding-top: 11px; }
.qo-price { font-size: 16px; font-weight: 700; line-height: 1.7; color: var(--q-text-price); }
.qo a.qo-model__tool { position: relative; z-index: 1; font-size: 13px; font-weight: 600; line-height: 1.7; color: var(--q-orange-text) !important; white-space: nowrap; }
.qo a.qo-model__tool:hover { color: var(--q-orange-deep) !important; }
.qo-rows { display: flex; flex-direction: column; gap: 20px; }
.qo .qo-row { display: grid; grid-template-columns: 320px 1fr auto; align-items: center; }
.qo .qo-row .qo-model__img { width: 320px; height: 220px; }
.qo-row .qo-model__body { padding: 22px 28px; }
.qo .qo-row .qo-model__name { font-size: 21px !important; }
.qo .qo-row .qo-model__text { max-width: 62ch; font-size: 15px; line-height: 1.65; }
.qo-row .qo-chips li { padding: 5px 11px; font-size: 12.5px; }
/* border-box: 230 px inhoud + 2 x 28 padding = 286 (board 1d). */
.qo-row__side { display: flex; flex-direction: column; gap: 9px; align-items: stretch; min-width: 286px; padding: 22px 28px; }
.qo-row .qo-price { font-size: 19px; }
.qo-row__btn { position: relative; z-index: 1; }

/* Na je aanvraag */
.qo-steps { display: flex; flex-direction: column; gap: 18px; }
.qo-steps__list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.qo-step { display: flex; flex-direction: column; gap: 10px; margin: 0; padding-top: 15px; border-top: 2px solid var(--q-sand-deep); }
.qo-step__text { display: flex; flex-direction: column; gap: 10px; }
.qo .qo-step__title { font-size: 16px !important; line-height: 1.7 !important; }
.qo .qo-step__p { font-size: 14px; font-weight: 300; line-height: 1.6; color: var(--q-text-body); }

/* SEO + FAQ */
.qo-seo { display: grid; grid-template-columns: minmax(0, 512fr) minmax(0, 644fr); gap: 44px; align-items: start; }
.qo-seo__text { display: flex; flex-direction: column; gap: 14px; }
.qo .qo-seo__p { font-size: 16px; font-weight: 300; line-height: 1.75; color: var(--q-text-body); }
.qo-faqs { display: flex; flex-direction: column; gap: 10px; padding-top: 6px; }
.qo-faq { background: var(--q-white); border: 1px solid var(--q-border); border-radius: 12px; overflow: hidden; }
.qo .qo-faq__q { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 18px; list-style: none; cursor: pointer; font-size: 15px; font-weight: 600; line-height: normal; color: var(--q-text-heading); transition: background var(--q-fast) var(--q-ease), color var(--q-fast) var(--q-ease); }
.qo-faq__q::-webkit-details-marker { display: none; }
.qo-faq__q .q-icon { transition: transform var(--q-med) var(--q-ease); }
.qo-faq:not([open]) .qo-faq__q:hover { background: var(--q-sand-light); }
.qo .qo-faq[open] .qo-faq__q { color: var(--q-orange-text); }
.qo-faq[open] .qo-faq__q .q-icon { transform: rotate(180deg); }
.qo .qo-faq__q:focus-visible { outline: none; box-shadow: inset 0 0 0 3px var(--q-focus-ring); }
.qo-faq__a { padding: 0 18px 18px; }
.qo .qo-faq__a p { font-size: 15px; font-weight: 300; line-height: 1.7; color: var(--q-text-body); }
.qo-faq::details-content { block-size: 0; overflow: hidden; transition: block-size var(--q-med) var(--q-ease), content-visibility var(--q-med) allow-discrete; }
.qo-faq[open]::details-content { block-size: auto; }
.qo-seo__fotos { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.qo .qo-seo__foto { height: 210px; border-radius: 14px; }
.qo-seo__foto--3 { grid-column: span 2; }
.qo .qo-seo__foto--3 { height: auto; aspect-ratio: 16 / 9; } /* широкое фото 16:9, а не полоса 644×210 */
.qo .qo-seo__fotos--single .qo-seo__foto { grid-column: 1 / -1; height: auto; aspect-ratio: 4 / 3; }

/* Reviews */
.qo-reviews { display: flex; flex-direction: column; gap: 18px; }
.qo-sec-head--reviews { gap: 24px; align-items: baseline; }

/* Showroom + formulier 974 */
.qo-show { display: grid; grid-template-columns: 1fr 1fr; border-radius: 20px; overflow: hidden; background: linear-gradient(135deg, var(--q-bark) 0%, var(--q-bark-deep) 100%); }
.qo-show__text { display: flex; flex-direction: column; gap: 15px; padding: 40px 44px; }
.qo .qo-show__h2 { font-size: 33px !important; color: #fff !important; }
.qo .qo-show__p { max-width: 46ch; font-size: 15.5px; font-weight: 300; line-height: 1.7; color: rgba(255, 255, 255, .86); }
.qo .qo-show__lines { display: grid; gap: 10px; padding-top: 2px; }
.qo-show__lines li { display: flex; gap: 11px; align-items: center; margin: 0; font-size: 14.5px; font-weight: 300; line-height: 1.5; color: #fff; }
.qo .qo-show__lines a { color: inherit !important; }
.qo .qo-show__lines a:hover { text-decoration: underline !important; }
.qo .qo-disc--show { width: 28px; height: 28px; background: rgba(242, 176, 76, .16); }
.qo-show__form { display: flex; flex-direction: column; gap: 13px; padding: 26px 28px; background: var(--q-white); }
.qo .qo-show__title { font-size: 17px !important; line-height: 1.7 !important; }
.qo-form .fusion-form { margin: 0; }
.qo-form .fusion-fullwidth, .qo-form .fusion-builder-row, .qo-form .fusion-layout-column, .qo-form .fusion-column-wrapper { padding: 0 !important; margin: 0 !important; width: 100% !important; max-width: 100% !important; min-height: 0 !important; background: none !important; }
.qo-form .fusion-builder-row { display: grid !important; grid-template-columns: 1fr 1fr; gap: 13px; }
.qo-form .fusion-builder-row::before, .qo-form .fusion-builder-row::after { content: none !important; }
.qo-form .fusion-layout-column:has(.fusion-form-textarea-field) { grid-column: 1 / -1; }
.qo-form .fusion-column-wrapper { display: flex !important; flex-direction: column; gap: 13px; }
.qo-form .fusion-form-field { margin: 0 !important; }
.qo-form .fusion-form-label-wrapper { margin: 0 !important; }
.qo .qo-form .fusion-form-field label { display: block; margin: 0 0 6px !important; padding: 0; font-family: var(--q-font-body) !important; font-size: 15px !important; font-weight: 500 !important; line-height: 1.7 !important; letter-spacing: 0 !important; color: var(--q-text-heading) !important; }
/* Lege meldingenblok (0 px) zou een extra gap van 13 px geven; geen display:contents, Avada meet de offset ervan om naar de melding te scrollen. */
.qo .qo-form .form-submission-notices { margin-top: -13px !important; }
.qo .qo-form .form-submission-notices .fusion-form-response { margin-top: 13px !important; }
.qo-form abbr.fusion-form-element-required { color: var(--q-error); text-decoration: none; border: 0; }
.qo-form input.fusion-form-input, .qo-form textarea.fusion-form-input { height: 45px; padding: 12px 16px !important; background: var(--q-white) !important; border: 1px solid var(--q-border) !important; border-radius: 12px !important; box-shadow: none; font-family: var(--q-font-body) !important; font-size: 15px !important; font-weight: 400; line-height: 1.3; color: var(--q-text-heading) !important; transition: border-color var(--q-fast) var(--q-ease), box-shadow var(--q-fast) var(--q-ease); }
.qo .qo-form .fusion-form-field textarea.fusion-form-input { height: 93.5px; min-height: 93.5px; resize: vertical; line-height: 1.5; }
.qo-form .fusion-form-input::placeholder { color: var(--q-text-muted); opacity: 1; }
/* Avada-iconen (icon-set 'coaching') laden niet: eigen kalender links (datum) en chevron rechts (tijdstip), zoals het ontwerp. */
.qo-form .fusion-form-input-with-icon { position: relative; }
.qo .qo-form .fusion-form-input-with-icon > i { display: none !important; }
.qo-form .fusion-form-input-with-icon::after { content: ""; position: absolute; top: 50%; width: 18px; height: 18px; margin-top: -9px; pointer-events: none; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 2v4M16 2v4'/%3E%3Crect width='18' height='18' x='3' y='4' rx='2'/%3E%3Cpath d='M3 10h18'/%3E%3C/svg%3E") center / 18px no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 2v4M16 2v4'/%3E%3Crect width='18' height='18' x='3' y='4' rx='2'/%3E%3Cpath d='M3 10h18'/%3E%3C/svg%3E") center / 18px no-repeat; background: var(--q-text-muted); }
.qo-form .fusion-form-date-field .fusion-form-input-with-icon::after { left: 14px; }
.qo-form .fusion-form-time-field .fusion-form-input-with-icon::after { right: 14px; -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background: var(--q-orange-deep); }
.qo .qo-form .fusion-form-date-field input.fusion-form-input { padding-left: 44px !important; }
.qo .qo-form .fusion-form-time-field input.fusion-form-input { padding: 12px 40px 12px 16px !important; cursor: pointer; }
.qo-form .fusion-form-input:focus { border-color: var(--q-orange) !important; box-shadow: 0 0 0 3px var(--q-focus-ring) !important; outline: none; }
.qo-form .fusion-form-input:user-invalid { border-color: var(--q-error) !important; box-shadow: 0 0 0 3px rgba(192, 57, 43, .18) !important; }
.qo-form button.form-form-submit { width: 100% !important; min-height: 73.6px; padding: 25px 35px !important; border: 1px solid var(--q-orange-light) !important; border-radius: 12px !important; background: var(--q-cta-gradient) !important; box-shadow: var(--q-shadow-button) !important; color: #fff !important; font-family: var(--q-font-body) !important; font-size: 18px !important; font-weight: 600 !important; line-height: 1.2 !important; letter-spacing: 0 !important; text-transform: none !important; }
.qo-form button.form-form-submit:hover { background: var(--q-orange-deep) !important; border-color: var(--q-orange-deep) !important; box-shadow: none !important; }
.qo .qo-form button.form-form-submit:focus-visible { outline: none; border-color: var(--q-orange) !important; box-shadow: 0 0 0 3px var(--q-focus-ring) !important; }
.qo .qo-form button.form-form-submit:active { background: var(--q-orange-text) !important; }
.qo-form .fusion-form-notice, .qo-form .fusion-alert { margin: 0 !important; }

/* Direct leverbaar */
.qo-stock { display: grid; grid-template-columns: 280px 1fr auto; align-items: center; background: var(--q-white); border: 1px solid var(--q-orange-light); border-radius: 20px; overflow: hidden; }
.qo .qo-stock__img { width: 280px; height: 180px; border-radius: 0; }
.qo-stock__text { display: flex; flex-direction: column; gap: 8px; padding: 24px 30px; }
.qo .qo-stock__h2 { font-size: 28px !important; }
.qo .qo-stock__p { max-width: 56ch; font-size: 15px; font-weight: 300; line-height: 1.7; color: var(--q-text-body); }
.qo-stock__cta { min-width: 240px; padding: 24px 30px; }

/* Mobiele balk (in <body>, buiten .qo) */
.qo-sticky .qb-sticky__note { color: var(--q-text-muted-strong); line-height: 1.7; text-align: center; }
.qo-sticky .qo-sticky__row { grid-template-columns: 1fr 1fr; gap: 9px; }
.qo-sticky .q-btn { height: 48px; padding: 0 12px !important; font-size: 16px; }

@media (hover: none) {
	.qo .q-card--hover:hover { transform: none; box-shadow: var(--q-shadow-card); }
}

/* ---------------------------------------------------------------- tablet */
@media (max-width: 1024px) {
	.qo .qo-inner { gap: 36px; padding-top: 18px; padding-bottom: 48px; }
	.qo-kop { gap: 12px; }
	.qo-kop__grid { display: flex; flex-direction: column; align-items: stretch; gap: 12px; }
	.qo .qo-h1 { font-size: 34px !important; line-height: 1.15 !important; }
	.qo .qo-lead { max-width: none; font-size: 15.5px; }
	.qo-trust { align-items: flex-start; }
	.qo .qo-trust__item--kwaliteit { display: none; }
	.qo-trust li { gap: 7px; font-size: 13px; }
	.qo-trust .q-icon { width: 14px; height: 14px; }
	.qo .qo-switch--top { display: none; }
	.qo .qo-switch--bottom { display: flex; padding-top: 16px; }
	.qo-switch--bottom .qo-switch__label { font-size: 13px; }
	.qo .qo-switch--bottom .qs-chip { min-height: 40px; padding: 8px 14px; font-size: 13.5px; }
	.qo .qo-h2, .qo .qo-h2--reviews, .qo .qo-show__h2 { font-size: 28px !important; }

	.qo-tool { gap: 13px; padding: 16px; }
	.qo-tool__frame { min-height: min(var(--qo-tool-h, 720px), 560px); }
	.qo .qo-tool__time { display: none; }
	.qo-tool__note { font-size: 14px; }
	.qo-tool__note .q-icon { width: 16px; height: 16px; }
	.qo-uitleg { grid-template-columns: 1fr; gap: 16px; }
	.qo-uitleg--hulp { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
	.qo .qo-uitleg__foto { display: none; }
	.qo .qo-keuzes { gap: 10px; padding: 16px 18px; box-shadow: none; }
	.qo-card-title, .qo-hulp .qg-card__title { font-size: 14.5px; }
	.qo-list li { grid-template-columns: 15px 1fr; gap: 9px; font-size: 13.5px; }
	.qo-list li .q-icon { width: 14px; height: 14px; }
	.qo-uitleg--hulp .qo-list { grid-template-columns: 1fr; }
	.qo .qo-hulp { gap: 10px; padding: 16px 18px; }
	.qo-hulp .qg-card__text { font-size: 13.5px; line-height: 1.6; }

	.qo-modellen { gap: 14px; }
	.qo .qo-modellen .qo-sec-lead, .qo .qo-modellen .qo-textlink { display: none; }
	.qo-models { grid-template-columns: 1fr 1fr; gap: 16px; }
	.qo .qo-model .qo-model__img { height: 180px; }
	.qo-model__body { gap: 7px; padding: 14px 16px 16px; }
	.qo .qo-model__name { font-size: 16.5px !important; }
	.qo .qo-model__text { font-size: 13.5px; }
	.qo .qo-chips { display: none; }
	.qo-model__foot { gap: 8px; padding-top: 9px; }
	.qo-price { font-size: 15px; }
	.qo a.qo-model__tool { font-size: 12.5px; }
	.qo .qo-row { grid-template-columns: 200px 1fr auto; align-items: stretch; }
	.qo .qo-row .qo-model__img { width: 200px; height: 100%; min-height: 160px; }
	.qo-row .qo-model__body, .qo-row__side { padding: 16px 20px; }
	.qo-row .qo-model__body, .qo-row__side { justify-content: center; }
	.qo .qo-row .qo-model__name { font-size: 16.5px !important; }
	.qo .qo-row .qo-model__text { font-size: 13.5px; }
	.qo-row .qo-price { font-size: 15px; }
	.qo-row__side { min-width: 0; }

	.qo-steps { gap: 14px; }
	.qo-steps__list { grid-template-columns: 1fr 1fr; gap: 16px; }
	.qo-step { gap: 8px; padding-top: 13px; }
	.qo-step__text { gap: 8px; }
	.qo .qo-step .qo-disc { width: 34px; height: 34px; }
	.qo-step .qo-disc .q-icon { width: 17px; height: 17px; }
	.qo .qo-step__title { font-size: 15px !important; }
	.qo .qo-step__p { font-size: 13.5px; line-height: 1.55; }

	.qo-seo { grid-template-columns: 1fr; gap: 16px; }
	.qo .qo-seo__p { font-size: 15.5px; line-height: 1.7; }
	.qo .qo-seo__fotos { display: none; }

	.qo-show { grid-template-columns: 1fr; }
	.qo-show__text { padding: 28px; }
	.qo .qo-show__p { max-width: none; font-size: 15px; }
	.qo-show__form { padding: 24px 28px; }

	.qo-stock { grid-template-columns: 1fr; }
	.qo .qo-stock__img { display: none; }
	.qo-stock__text { padding: 24px 28px 0; }
	.qo-stock__cta { min-width: 0; padding: 16px 28px 24px; }
	.qo-stock__cta .q-btn { width: 100%; }
	.qo .qo-stock__h2 { font-size: 25px !important; }
}

/* Smalle tablet (<= 720): de middenkolom zou onder 220 px zakken; prijs + knop onder de tekst. */
@media (min-width: 641px) and (max-width: 720px) {
	.qo .qo-row { grid-template-columns: 200px minmax(0, 1fr); }
	.qo .qo-row .qo-model__img { grid-row: 1 / span 2; }
	.qo-row .qo-model__body { padding-bottom: 0; }
	.qo .qo-row__side { flex-direction: row; align-items: center; justify-content: space-between; flex-wrap: wrap; }
	.qo .qo-row__btn { width: auto; }
}

/* ---------------------------------------------------------------- mobiel */
@media (max-width: 640px) {
	/* Balk staat vast onderaan: de footer moet bereikbaar blijven. */
	body.q-pages--offerte:has(.qo-sticky) { padding-bottom: calc(102px + env(safe-area-inset-bottom, 0px)); }
	.qo .qo-inner { gap: 28px; padding-top: 14px; padding-bottom: 26px; }
	.qo-kop, .qo-kop__grid { gap: 10px; }
	/* 27 px (board), maar schaalt mee met de contentbreedte zodat "Buitensauna offerte aanvragen" (349 px bij 27 px) op 375 en 360 op een regel blijft. */
	.qo .qo-h1 { font-size: clamp(22px, calc(7.64vw - 2.44px), 27px) !important; line-height: 1.2 !important; }
	.qo .qo-lead { font-size: 14.5px; line-height: 1.6; }
	.qo .qo-lead--lang, .qo .qo-trust { display: none; }
	.qo .qo-lead--kort, .qo .qo-trust-m { display: block; }
	.qo .qo-trust-m { font-size: 12.5px; font-weight: 300; line-height: 1.7; color: var(--q-text-body); }
	.qo .qo-switch--bottom { gap: 7px; padding-top: 14px; }
	.qo-switch--bottom .qo-switch__label { font-size: 12.5px; }
	.qo .qo-switch--bottom .qs-chip { min-height: 38px; padding: 8px 13px; font-size: 12.5px; }
	.qo .qo-h2, .qo .qo-h2--reviews, .qo .qo-show__h2 { font-size: 23px !important; line-height: 1.25 !important; }

	.qo-group { gap: 28px; }
	.qo-tool { gap: 28px; padding: 0; background: none; border: 0; border-radius: 0; }
	.qo-tool__frame { min-height: min(var(--qo-tool-h, 720px), 420px); }
	.qo-tool__notes { gap: 8px; align-items: flex-start; }
	.qo-tool__note { align-items: flex-start; gap: 8px; font-size: 13px; line-height: 1.55; }
	.qo-tool__note .q-icon { width: 15px; height: 15px; margin-top: 1px; }
	.qo-uitleg, .qo-uitleg--hulp { grid-template-columns: 1fr; }
	.qo .qo-hulp { display: none; }
	.qo .qo-keuzes { gap: 9px; padding: 15px 16px; }
	.qo .qo-uitleg .qo-list { grid-template-columns: 1fr; gap: 9px; }
	.qo-list li { font-size: 13px; }

	.qo-modellen { gap: 12px; }
	.qo .qo-models, .qo .qo-rows { display: flex; flex-direction: column; gap: 12px; }
	.qo .qo-model, .qo .qo-row { display: grid; grid-template-columns: 88px 1fr; gap: 12px; align-items: center; min-height: 44px; padding: 12px; box-shadow: none; }
	.qo .qo-model .qo-model__img, .qo .qo-row .qo-model__img { width: 88px; height: 88px; min-height: 0; border-radius: 9px; }
	.qo .qo-model__body { gap: 3px; padding: 0; }
	.qo .qo-model__name, .qo .qo-row .qo-model__name { font-size: 15px !important; line-height: 1.7 !important; }
	.qo .qo-model__text, .qo .qo-chips, .qo a.qo-model__tool, .qo .qo-row__btn { display: none; }
	.qo .qo-model__kort { display: block; font-size: 12.5px; font-weight: 300; line-height: 1.5; color: var(--q-text-body); }
	.qo-model__foot { padding-top: 0; }
	.qo-price, .qo-row .qo-price { font-size: 13.5px; }
	/* Brede rij als mobiele rij: foto over twee rijen, naam + korte regel boven, prijs eronder. */
	.qo .qo-row { row-gap: 3px; }
	.qo .qo-row .qo-model__img { grid-row: 1 / span 2; }
	.qo .qo-row .qo-model__body { align-self: end; }
	.qo .qo-row__side { grid-column: 2; align-self: start; min-width: 0; padding: 0; }

	.qo-steps { gap: 12px; }
	.qo-steps__list { grid-template-columns: 1fr; gap: 12px; }
	.qo .qo-step { display: grid; grid-template-columns: 32px 1fr; gap: 12px; padding-top: 12px; border-top: 1px solid var(--q-border-warm); }
	.qo-step__text { gap: 2px; }
	.qo .qo-step .qo-disc { width: 32px; height: 32px; }
	.qo-step .qo-disc .q-icon { width: 16px; height: 16px; }
	.qo .qo-step__title { font-size: 14px !important; }
	.qo .qo-step__p { font-size: 12.5px; }

	.qo .qo-seo__p { font-size: 14px; }
	.qo .qo-faq__q { min-height: 44px; }
	.qo .qo-faq__a p { font-size: 13.5px; }
	.qo-sec-head--reviews { row-gap: 6px; }

	.qo-show__text { gap: 12px; padding: 20px; }
	.qo .qo-show__p { font-size: 13.5px; }
	.qo-show__form { padding: 20px; }
	/* Groter tikvlak zonder andere layout: de hele regel (38 px) en de Google-link (44 px). */
	.qo .qo-show__lines li, .qo a.qo-textlink { position: relative; }
	.qo .qo-show__lines a::after, .qo a.qo-textlink::after { content: ""; position: absolute; inset: -5px 0; }
	.qo a.qo-textlink::after { inset: -9px 0; }
	.qo-form .fusion-layout-column { grid-column: 1 / -1; }
	.qo-form button.form-form-submit { min-height: 56px; padding: 16px !important; font-size: 16px !important; }

	.qo-stock__text { padding: 20px 20px 0; }
	.qo-stock__cta { padding: 14px 20px 20px; }
	.qo .qo-stock__h2 { font-size: 21px !important; }
	.qo .qo-stock__p { font-size: 14px; }
	.qo-stock__cta .q-btn { padding: 16px !important; }
}

@media (prefers-reduced-motion: reduce) {
	.qo-faq::details-content { transition: none; }
	.qo .q-card--hover:hover, .qo .qo-textlink:hover .q-icon { transform: none; }
}
