/* Floating homepage cards; the projects overview keeps its own grid. */
.home-services-anchor { display: block; scroll-margin-top: 100px; }
.home-projects { background: var(--green-soft); padding: clamp(2.5rem, 5vw, 5rem) 0; }
.home-projects-inner { margin: 0 auto; max-width: 1440px; padding: 0 clamp(1rem, 6vw, 5.4rem); min-width: 0; }
.home-projects-heading { align-items: center; display: grid; grid-template-columns: 1fr auto 1fr; gap: 1rem; margin-bottom: 1rem; }
.home-projects-heading h2 { color: var(--green-deep); font-size: .78rem; font-weight: 750; grid-column: 2; letter-spacing: .12em; line-height: 1.5; margin: 0; text-align: center; text-transform: uppercase; }
.home-projects-all { align-items: center; color: var(--green-deep); display: inline-flex; font-weight: 650; gap: .75rem; grid-column: 3; justify-self: end; min-height: 44px; }
.home-projects-track { --project-gap: clamp(1.25rem, 2.5vw, 2rem); display: flex; gap: var(--project-gap); list-style: none; margin: 0 -12px; overflow-x: auto; overscroll-behavior-x: contain; padding: 16px 12px 32px; position: relative; scroll-padding-inline: 12px; scroll-snap-type: x mandatory; scrollbar-width: thin; }
.home-projects-item { flex: 0 0 84%; min-width: 0; scroll-snap-align: start; }
.home-projects-card { aspect-ratio: 4 / 5; background: var(--ink); border-radius: var(--radius); box-shadow: 0 12px 22px -10px rgba(19,34,28,.28); display: block; isolation: isolate; overflow: hidden; position: relative; transition: transform 200ms ease, box-shadow 200ms ease; }
.home-projects-card::after { background: linear-gradient(180deg, transparent 25%, rgba(6,20,13,.2) 48%, rgba(6,20,13,.9) 100%); content: ''; inset: 0; pointer-events: none; position: absolute; z-index: 1; }
.home-projects-card img { height: 100%; inset: 0; object-fit: cover; position: absolute; width: 100%; }
.home-projects-category { background: var(--forest); border-radius: 999px; color: white; font-size: .75rem; font-weight: 700; left: 1rem; padding: .48rem .68rem; position: absolute; top: 1rem; z-index: 2; }
.home-projects-card[data-category='databeheer'] .home-projects-category { background: var(--blue); }
.home-projects-content { bottom: 1.25rem; display: grid; gap: .85rem; left: 1.25rem; right: 1.25rem; position: absolute; z-index: 2; }
.home-projects-content h3 { color: white; font-size: clamp(1.3rem, 2vw, 1.9rem); font-weight: 620; letter-spacing: -.035em; line-height: 1.12; margin: 0; overflow-wrap: anywhere; }
.home-projects-location { align-items: center; background: rgba(255,255,255,.96); border-radius: 999px; color: var(--ink); display: inline-flex; font-size: .75rem; font-weight: 650; gap: .4rem; max-width: 100%; padding: .45rem .65rem; width: fit-content; }
.home-projects-location svg { flex-shrink: 0; height: 14px; width: 14px; }
.home-projects-controls { display: flex; gap: .65rem; justify-content: flex-end; margin-top: .75rem; }
.home-projects-controls[hidden] { display: none; }
.home-projects-controls button { align-items: center; background: var(--paper); border: 1px solid var(--line); border-radius: 50%; color: var(--green-deep); cursor: pointer; display: inline-flex; font: inherit; font-size: 1.4rem; height: 48px; justify-content: center; width: 48px; }
.home-projects-controls button:disabled { cursor: default; opacity: .35; }
.home-projects :focus-visible { outline: 3px solid var(--forest); outline-offset: 4px; }
@media (min-width: 600px) { .home-projects-item { flex-basis: 45%; } }
@media (max-width: 599px) {
  .home-projects-heading { grid-template-columns: 1fr; gap: .5rem; }
  .home-projects-heading h2, .home-projects-all { grid-column: 1; justify-self: center; }
}
@media (min-width: 960px) { .home-projects-item { flex-basis: calc((100% - 2 * var(--project-gap)) / 3); } }
@media (hover: hover) and (pointer: fine) { .home-projects-card:hover { box-shadow: 0 16px 26px -10px rgba(19,34,28,.32); transform: translateY(-4px); } }
@media (prefers-reduced-motion: reduce) { .home-projects-card { transition: none; } }