/* Minified by hand-rolled script; the commented source lives in git
   history (last full version: commit 187767b). */
.article-page{padding-block:var(--space-9)}
.article-page__title{font-family:var(--font-display);font-size:var(--fs-xl);font-weight:var(--fw-regular);letter-spacing:0.01em;text-transform:uppercase;color:var(--color-navy);margin-bottom:var(--space-6)}
.article-content p,.article-content li{color:var(--color-navy-soft);line-height:1.65}
.article-content p{margin-bottom:var(--space-4)}
.article-content .article-lead{font-size:var(--fs-md);color:var(--color-navy);margin-bottom:var(--space-6)}
.article-content h2{font-size:var(--fs-lg);font-weight:var(--fw-bold);color:var(--color-navy);margin:var(--space-7) 0 var(--space-4)}
.article-content h3{font-size:var(--fs-md);font-weight:var(--fw-bold);color:var(--color-navy);margin:var(--space-5) 0 var(--space-2)}
.article-content ul,.article-content ol{margin:0 0 var(--space-4);padding-left:1.4em}
.article-content ul{list-style:disc}
.article-content ol{list-style:decimal}
.article-content li{margin-bottom:var(--space-2)}
.article-content a{color:var(--color-cyan);text-decoration:underline;text-underline-offset:2px}
.article-content a.btn{text-decoration:none}
.article-content a.btn--primary{color:var(--color-white)}
.article-content .article-note{font-size:var(--fs-sm)}
.article-content .article-cta{margin:var(--space-6) 0 var(--space-7)}
.project-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0 var(--space-5);row-gap:var(--space-5);margin-block:var(--space-6)}
@media (max-width:767px){.project-grid{grid-template-columns:1fr}
}
.project-card{border:1px solid var(--color-border);border-radius:var(--radius-sm);overflow:hidden;display:grid;grid-template-rows:subgrid;grid-row:span 3;align-content:start}
.project-card__thumb{aspect-ratio:4 / 3;background:#eef1f3}
.project-card__thumb picture,.project-card__thumb .project-card__img{display:block;width:100%;max-width:none;height:100%;object-fit:cover}
.project-card__thumb--placeholder{display:flex;align-items:center;justify-content:center;background:repeating-linear-gradient( 45deg,#eef1f3,#eef1f3 12px,#e6ebee 12px,#e6ebee 24px )}
.project-card__title.project-card__title{font-size:var(--fs-md);font-weight:var(--fw-bold);color:var(--color-navy);margin:var(--space-4) var(--space-4) var(--space-1)}
.project-card__body.project-card__body{font-size:var(--fs-sm);color:var(--color-navy-soft);margin:var(--space-2) var(--space-4) var(--space-4)}
.home-section-title{font-family:var(--font-display);font-size:var(--fs-xl);font-weight:var(--fw-regular);letter-spacing:0.01em;text-transform:uppercase;color:var(--color-navy);margin-bottom:var(--space-5)}
.home-hero__actions{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--space-3);margin-top:var(--space-6)}
.home-pos,.home-vak,.home-werk,.home-auto,.home-services{padding-block:var(--space-8)}
.home-pos p,.home-vak p,.home-auto p{color:var(--color-navy-soft);line-height:1.65;margin-bottom:var(--space-4)}
.home-pos__punch{color:var(--color-navy) !important}
.home-pos .btn{margin-top:var(--space-2)}
.home-vak a:not(.btn),.home-auto a:not(.btn),.home-services__all a{color:var(--color-cyan);text-decoration:underline;text-underline-offset:2px;font-weight:var(--fw-medium)}
.home-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-5)}
@media (max-width:767px){.home-cards{grid-template-columns:1fr}
}
.home-card{display:flex;flex-direction:column;border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:var(--space-5);transition:border-color var(--duration-fast) var(--ease-standard)}
.home-card:hover{border-color:var(--color-cyan)}
.home-card__title{font-size:var(--fs-md);font-weight:var(--fw-bold);color:var(--color-navy);margin-bottom:var(--space-2)}
.home-card__body{margin-top:auto;font-size:var(--fs-sm);color:var(--color-navy-soft);line-height:1.6}
.home-services__all{margin-top:var(--space-5)}
.home-trust{background:var(--color-navy);padding-block:var(--space-5)}
.home-trust__list{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:var(--space-2) var(--space-6);justify-content:center}
.home-trust__list li{color:var(--color-white);font-size:var(--fs-sm);font-weight:var(--fw-medium)}
@media (max-width:767px){.home-trust__list{flex-direction:column;align-items:center;text-align:center}
}
picture:has(.photo){display:block;border-radius:var(--radius-md);overflow:hidden}
.project-card__thumb picture:has(.photo){border-radius:0}
.photo{display:block;width:100%;height:auto}
.figure{margin:var(--space-7) 0}
.figure__caption{margin-top:var(--space-3);font-size:var(--fs-sm);line-height:1.5;color:var(--color-navy-soft)}
.figure:has(.photo--lead){margin-top:var(--space-2)}
.photo--portrait{max-width:none;margin-inline:0}
.photo--lead{aspect-ratio:3 / 2;object-fit:cover}
@media (max-width:599px){.photo--lead{aspect-ratio:4 / 3}
}
@media (min-width:768px){.article-content .project-grid{grid-template-columns:repeat(2,1fr)}
}
/* Recognition mark (inc/helpers.php vw_badge), floated beside the section
   whose claim it backs up. shape-outside makes the text follow the circle
   instead of an invisible square, which is the whole reason a round mark
   can sit this close to the copy without looking dropped on.
   The mark is never restyled: no filter, no border, no recolouring. It is
   evidence, and evidence that has been made to match the page stops
   reading as evidence. */
.badge{float:right;width:130px;margin:0 0 var(--space-4) var(--space-5);shape-outside:circle();-webkit-shape-outside:circle()}
.badge__img{display:block;width:100%;height:auto}
/* A float only clears if something clears it: when the paragraph beside
   the badge is shorter than the badge, the NEXT heading would otherwise
   wrap around it. Badges are the only floats in an article body. */
.article-content h2{clear:both}
/* Below 600px a 130px float leaves about 215px of text, which reads as a
   column of two-word lines. It stacks instead. Same breakpoint as
   .photo--lead above, so the page has one story about small screens. */
@media (max-width:599px){.badge{float:none;width:112px;margin:var(--space-4) 0 var(--space-3)}
}

/* Mid-page repeat CTAs: hidden on phones, where the sticky button
   (.vw-sticky-cta, footer.css) is already on screen by the time the
   visitor reaches them, and the same offer twice within a thumb's reach
   reads as nagging.
   767px rather than the pill's own 1024px on purpose: hiding copy is the
   riskier direction, so it stops at phones. From 768 to 1023 the pill and
   the mid-page CTA both show, exactly as they did before; above 1024 the
   pill is gone and the CTA is the only one.
   Two blocks carry this today: the first CTA in page.krassen.body and the
   home-pos button on the homepage. The closing CTA (.vw-cta-close) is
   never hidden, on any viewport. */
@media (max-width:767px){.vw-cta-mid{display:none}
}
