/* Voegvast refinement. Palette and type: ../WEBSITE-BRIEF.md.
   These overrides belong to this preview, including its shared demo modules. */
html { scroll-padding-top: 104px; }
body.voegvast { --wrap: min(1180px, calc(100% - 80px)); }
.voegvast ::selection { background: var(--c-ink); color: var(--c-base); }
.voegvast :is(input, textarea) { caret-color: var(--c-ink); }
.voegvast summary:focus-visible { outline: 3px solid var(--c-accent); outline-offset: 4px; }
.voegvast :is(section, details)[id] { scroll-margin-top: 0; }
.voegvast :is(h1, h2, h3) { text-wrap: balance; }
.voegvast h1 { font-size: clamp(3rem, 4.6vw, 4.25rem); line-height: 1.06; max-width: 16ch; }
.voegvast h2 { font-size: clamp(2rem, 3.4vw, 3rem); line-height: 1.1; max-width: 20ch; }
.voegvast h3 { line-height: 1.2; }
.voegvast .btn.primary { background: var(--c-ink); border-color: var(--c-ink); color: var(--c-base); border-bottom-color: var(--c-accent); }
.voegvast .btn.primary:hover { background: var(--c-muted); }
.voegvast .btn.menu-cta { background: transparent; color: var(--c-ink); border-color: var(--c-line); }
.voegvast .btn.menu-cta:hover { background: var(--c-ink); color: var(--c-base); }
.voegvast .desktop-nav > a, .voegvast .nav-trigger { padding-inline: 10px; }
.voegvast .head-row { gap: 24px; }
.voegvast .hero { min-height: 0; padding: 56px 0 72px; }
.voegvast .hero-grid { grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); gap: 64px; }
.voegvast .hero-copy p { font-size: 1.125rem; line-height: 1.65; margin: 24px 0; }
.voegvast .hero-media { min-height: 0; height: 480px; }
.voegvast .hero-card { margin: 0; }
.voegvast .hero-card.work { width: 64%; height: 82%; }
.voegvast .hero-card.result { width: 61%; height: 77%; }
.voegvast .hero-card figcaption { padding: 10px 12px; font-size: .75rem; text-transform: none; letter-spacing: 0; }
.voegvast .hero-stamp { background: var(--c-base); color: var(--c-ink); border: 3px solid var(--c-accent); width: 104px; }
.voegvast .hero-tool-link { display: inline-block; margin-top: 16px; min-height: 44px; align-content: center; font-weight: 600; text-underline-offset: 4px; }
.voegvast .trust-line { margin-top: 16px; gap: 8px 20px; }
.voegvast .trust-line span { border-left: 0; padding-left: 0; }
.voegvast .section { padding-block: 88px; }
.voegvast .section-head { gap: 48px; margin-bottom: 40px; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); }
.voegvast .measure-rule { margin-block: 16px 24px; }
.voegvast .projects .eyebrow { color: var(--c-surface); }
.voegvast .project-stage { gap: 48px; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); }
.voegvast .project-row { grid-template-columns: 28px minmax(0, 1fr) auto; gap: 16px; padding-block: 18px; }
.voegvast .project-row b { display: block; font-size: clamp(1.125rem, 1.65vw, 1.375rem); line-height: 1.3; }
.voegvast .project-row small { display: block; margin-top: 8px; font-size: .875rem; }
.voegvast .project-row[aria-pressed=true] b, .voegvast .project-row:hover b { text-decoration-thickness: 2px; text-underline-offset: 4px; }
.voegvast .project-preview { margin: 0; top: 104px; }
.voegvast .project-preview img { aspect-ratio: 3 / 2; }
.voegvast .project-meta { flex-wrap: wrap; gap: 4px 20px; }
.voegvast .check-shell { grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: 40px; }
.voegvast .check-controls { padding: 28px; top: 104px; }
.voegvast .choice-group { margin-bottom: 24px; }
.voegvast .choice { padding-inline: 12px; }
.voegvast svg.tile-grid { position: absolute; inset: 0; display: block; width: 100%; height: 100%; background: none; transform: none; }
.voegvast .wall-label { background: var(--c-ink); color: var(--c-base); border-top: 2px solid var(--c-accent); left: 12px; bottom: 12px; }
.voegvast .spec-card { grid-template-columns: 72px minmax(0, 1fr); gap: 20px; padding: 24px; align-items: start; }
.voegvast .spec-sub-thumb { width: 72px; height: 72px; border-radius: 0; }
.voegvast .spec-card dl { grid-template-columns: max-content minmax(0, 1fr); gap: 12px 16px; }
.voegvast .spec-card dd { margin: 0; }
.voegvast .spec-route { grid-column: 1 / -1; display: flex; gap: 24px; align-items: baseline; padding-top: 16px; border-top: 1px solid var(--c-line); }
.voegvast .spec-route strong { font-size: 1.5rem; }
.voegvast .spec-route .eyebrow { flex-shrink: 0; }
.voegvast #calculator { padding-top: 56px; border-top: 1px solid var(--c-line); }
.voegvast .calc-shell { gap: 40px; }
.voegvast .calc-form, .voegvast .calc-result { padding: 28px; }
.voegvast .calc-result { top: 104px; }
.voegvast .calc-result img { width: min(200px, 70%); margin: 0 auto 20px; }
.voegvast .calc-result h3 { font-size: clamp(1.5rem, 2.4vw, 2rem); }
.voegvast .calc-numbers { margin-bottom: 16px; }
.voegvast .calc-number { padding: 14px; }
.voegvast .calc-number strong { font-size: 1.4rem; }
.voegvast .process-tool { margin: 0 0 40px; }
.voegvast .process-tool img { width: min(240px, 100%); }
.voegvast .step { padding: 24px; }
.voegvast .step span { color: var(--c-muted); font-size: 2rem; }
.voegvast .step h3 { margin-top: 24px; }
.voegvast .quote { border-top-width: 2px; align-items: center; gap: 40px; }
.voegvast .quote blockquote { font-size: clamp(1.5rem, 2.8vw, 2.5rem); line-height: 1.3; letter-spacing: -.025em; }
.voegvast .quote aside { font-size: .9375rem; }
.voegvast .ms-blog__h { font-size: clamp(1.2rem, 1.8vw, 1.5rem); line-height: 1.2; margin-bottom: 12px; }
.voegvast .ms-blog__desc { line-height: 1.6; }
.voegvast .booking-note img { width: min(240px, 100%); margin-top: 0; }
.voegvast .ms-widget { --ms-accent: var(--c-ink) !important; --ms-accent-dark: var(--c-ink) !important; --ms-on-accent: var(--c-base) !important; --ms-ink: var(--c-ink); --ms-muted: var(--c-muted); --ms-line: var(--c-line); --ms-soft: var(--c-base); }
.voegvast .ms-widget :is(.ms-calendar, .ms-service-card, .ms-stepper__item, .ms-step-next, .ms-step-back, .ms-submit, input, select, textarea) { border-radius: 0; box-shadow: none; }
.voegvast .ms-widget :is(.ms-intro, .ms-privacy, .ms-summary) { color: var(--c-muted); }
.voegvast .ms-title { font-size: clamp(1.5rem, 2.5vw, 2rem); line-height: 1.15; }
html body.voegvast .rd-knop { border-radius: 0; background: var(--c-ink); color: var(--c-base); border: 2px solid var(--c-accent); box-shadow: none; }
html body.voegvast .rd-knop:hover { box-shadow: none; }
.voegvast .ms-presence { --msp-accent: var(--c-ink) !important; --msp-accent-ink: var(--c-base) !important; --msp-accent-text: var(--c-ink) !important; --msp-ink: var(--c-ink) !important; --msp-muted: var(--c-muted) !important; --msp-paper: var(--c-base) !important; --msp-line: var(--c-line) !important; --msp-display-font: var(--display) !important; --msp-body-font: var(--body) !important; --msp-accent-font: var(--body) !important; background: var(--c-base); }
.voegvast .ms-presence__inner { width: var(--wrap); padding-block: 88px; }
.voegvast .ms-presence__title { font-size: clamp(2rem, 3.4vw, 3rem); line-height: 1.1; letter-spacing: -.035em; }
.voegvast .ms-presence :is(.ms-presence__reviews, .ms-presence__map, .ms-presence__contact, .ms-presence__social, .ms-presence__post, .ms-presence__button) { border-radius: 0; box-shadow: none; }
.voegvast .ms-presence__status::before { display: none; }
.voegvast .ms-presence__eyebrow { color: var(--c-muted); }
.voegvast .ms-presence__score { background: var(--c-surface); color: var(--c-ink); }
.voegvast .ms-presence__stars { color: var(--c-ink); }
.voegvast .msi-section { padding-block: 72px; }
.voegvast .msi-head h2 { font-family: var(--display); font-size: clamp(2rem, 3.4vw, 3rem); line-height: 1.1; letter-spacing: -.035em; }
.voegvast .msi-card figcaption span { opacity: 1; color: var(--c-muted); }
.voegvast .website-demo { width: var(--wrap); margin: 0 auto 64px; border-block: 1px solid var(--c-line); }
.voegvast .website-demo > summary { display: flex; justify-content: space-between; align-items: center; gap: 24px; padding-block: 28px; cursor: pointer; list-style: none; }
.voegvast .website-demo > summary::-webkit-details-marker { display: none; }
.voegvast .website-demo > summary strong { display: block; font-family: var(--display); font-size: clamp(1.125rem, 2vw, 1.5rem); line-height: 1.3; }
.voegvast .website-demo > summary small { display: block; margin-top: 8px; color: var(--c-muted); font-size: .9375rem; }
.voegvast .website-demo > summary svg { width: 24px; height: 24px; flex-shrink: 0; transition: transform .2s; }
.voegvast .website-demo[open] > summary svg { transform: rotate(180deg); }
.voegvast .ms-mail { --msm-accent: var(--c-ink) !important; --msm-accent-ink: var(--c-base) !important; --msm-accent-text: var(--c-ink) !important; --msm-ink: var(--c-ink) !important; --msm-muted: var(--c-muted) !important; --msm-line: var(--c-line) !important; --msm-bg: var(--c-base) !important; --msm-display-font: var(--display) !important; --msm-body-font: var(--body) !important; padding-block: 24px 40px; }
.voegvast .ms-mail__inner { width: 100%; }
.voegvast .ms-mail__title { font-size: clamp(1.5rem, 2.5vw, 2.25rem); line-height: 1.15; }
.voegvast .ms-mail :is(.ms-mail__card, .ms-mail__tab, .ms-mail__preview) { border-radius: 0; box-shadow: none; }
.voegvast .mobile-bar { display: none; }
.voegvast .footer-grid a { display: flex; align-items: center; min-height: 44px; }
@media (max-width: 1100px) {
  .voegvast .desktop-nav, .voegvast .menu-cta { display: none; }
  .voegvast .burger { display: block; }
}
@media (max-width: 980px) {
  body.voegvast { --wrap: calc(100% - 48px); }
  .voegvast .hero-grid { grid-template-columns: 1fr; gap: 24px; }
  .voegvast .hero-copy { display: contents; }
  .voegvast .hero-copy > .eyebrow, .voegvast .hero-copy > .measure-rule { display: none; }
  .voegvast .hero-copy h1 { grid-row: 1; }
  .voegvast .hero-media { grid-row: 2; height: 340px; max-width: 600px; width: 100%; }
  .voegvast .hero-copy p { grid-row: 3; margin: 0; }
  .voegvast .hero-actions { grid-row: 4; }
  .voegvast .hero-tool-link { grid-row: 5; margin: 0; }
  .voegvast .trust-line { grid-row: 6; margin: 0; }
  .voegvast .section-head, .voegvast .check-shell, .voegvast .calc-shell { grid-template-columns: 1fr; gap: 24px; }
  .voegvast .check-controls, .voegvast .calc-result { position: static; }
  .voegvast .project-stage { display: none; }
  .voegvast .project-mobile { display: grid; }
  .voegvast .spec-card { grid-template-columns: 72px minmax(0, 1fr); }
}
@media (max-width: 620px) {
  body.voegvast { --wrap: calc(100% - 40px); padding-bottom: 0; }
  .voegvast .hero { padding: 24px 0 48px; }
  .voegvast .hero-grid { gap: 20px; }
  .voegvast h1 { font-size: clamp(2rem, 9.5vw, 2.625rem); line-height: 1.08; }
  .voegvast .hero-media { height: 240px; }
  .voegvast .hero-card.work { width: 60%; height: 94%; }
  .voegvast .hero-card.result { width: 58%; height: 91%; }
  .voegvast .hero-card figcaption { padding: 8px; font-size: .6875rem; }
  .voegvast .hero-stamp { display: none; }
  .voegvast .hero-copy p { font-size: 1rem; }
  .voegvast .hero-actions { display: flex; flex-wrap: wrap; }
  .voegvast .hero-actions .btn { width: auto; padding-inline: 16px; flex: 1 1 auto; }
  .voegvast .trust-line { display: flex; font-size: .8125rem; }
  .voegvast .section { padding-block: 56px; }
  .voegvast .section-head { margin-bottom: 32px; }
  .voegvast .section-head p { font-size: 1rem; }
  .voegvast .check-controls, .voegvast .calc-form, .voegvast .calc-result { padding: 24px; }
  .voegvast .spec-card { padding: 20px; gap: 16px; }
  .voegvast .spec-card dl { grid-template-columns: 1fr; gap: 4px; }
  .voegvast .spec-card dd { margin-bottom: 12px; }
  .voegvast .spec-route { flex-wrap: wrap; gap: 8px 24px; }
  .voegvast .wall-label { max-width: calc(100% - 16px); left: 8px; bottom: 8px; font-size: .75rem; }
  .voegvast .calc-numbers { grid-template-columns: 1fr 1fr; }
  .voegvast .calc-number { padding: 12px; }
  .voegvast .calc-number strong { font-size: 1.25rem; }
  .voegvast .quote { gap: 24px; }
  .voegvast .process-tool img { width: min(220px, 84%); }
  .voegvast .ms-presence__inner { padding-block: 56px; }
  .voegvast .website-demo { margin-bottom: 40px; }
  .voegvast .mobile-bar { position: static; display: grid; width: var(--wrap); margin: 0 auto 40px; box-shadow: none; }
  .voegvast .mobile-bar a:last-child { background: var(--c-ink); border-color: var(--c-ink); color: var(--c-base); }
  .voegvast footer { padding-bottom: 64px; }
  body.voegvast > .ms-sidedock.ms-sidedock--mobile-flow { padding-bottom: 24px; }
}
