/* Spiegel: beeld en tekst van kant wisselen op desktop (gebruiker 2026-10-30: "make sure that the sections next to each other
   dont have images and text on the same sides ... swap sides for section if you have to for this"; website-kit RULES 4.27).
   build.py zet class "db-spiegel" op de wortel van een sectie als zij dezelfde beeldzijde zou hebben als haar buur
   (config.BEELDZIJDE, BEELDZIJDE_PAGINA). Alleen kolomvolgorde en de zijde van pop-outs en platen wisselen; de beeldpixels
   zelf worden niet gespiegeld (geen scaleX). Mobiel blijft gestapeld: elke regel staat in de min-width van de eigen
   tweekolomsweergave. Dit bestand laadt na de sectie-CSS (hogere specificiteit door .db-spiegel op de wortel). */

/* uitleg-tekst-foto: kaart steekt nu links voorbij de foto */
@media (min-width:981px){
  .db-u7.db-spiegel .db-u7__inner{direction:rtl}
  .db-u7.db-spiegel .db-u7__inner>*{direction:ltr}
  .db-u7.db-spiegel .db-u7__kaart{margin:-5.5rem 2.5rem 0 calc(var(--u7-uit) * -1)}
}

/* voordelen: kop, knoppen en Google-kaart schuiven naar kolom 2-3, de figuur naar kolom 1 */
@media (min-width:1001px){
  .db-vd13.db-spiegel .db-vd13__kop{grid-area:1 / 2 / 2 / 4}
  .db-vd13.db-spiegel .db-vd13__acties{grid-area:2 / 2 / 3 / 4}
  .db-vd13.db-spiegel .db-vd13__figuur{grid-area:1 / 1 / 4 / 2}
  .db-vd13.db-spiegel .db-vd13__google{grid-area:3 / 2 / 4 / 4}
}

/* partners: foto en roze plaat rechts van de tekst worden links */
@media (min-width:901px){
  .db-pa8.db-spiegel .db-pa8__kop{direction:rtl}
  .db-pa8.db-spiegel .db-pa8__kop>*{direction:ltr}
  .db-pa8.db-spiegel .db-pa8__foto::before{right:auto;left:2em;transform:translate(-.6em,-.6em)}
  .db-pa8.db-spiegel .db-pa8__blok{right:auto;left:2em}
  .db-pa8.db-spiegel .db-pa8__cutout{right:auto;left:3em}
}

/* werkwijze-stappen: de foto (met pop-out) komt links, de stappen rechts */
@media (min-width:901px){
  .db-ws6.db-spiegel .db-ws6__body{direction:rtl}
  .db-ws6.db-spiegel .db-ws6__body>*{direction:ltr}
  .db-ws6.db-spiegel .db-ws6__foto{left:1.5rem;right:-2rem}
}

/* uitleg-opties */
@media (min-width:901px){
  .db-uo6.db-spiegel .db-uo6__inner{direction:rtl}
  .db-uo6.db-spiegel .db-uo6__inner>*{direction:ltr}
  .db-uo6.db-spiegel .db-uo6__blok{right:auto;left:-1.25rem;transform:rotate(calc(var(--db-helling) * -1))}
  .db-uo6.db-spiegel .db-uo6__cutout{right:auto;left:4%}
}

/* uitleg-band-donker */
@media (min-width:901px){
  .db-ubd5.db-spiegel .db-ubd5__wrap{direction:rtl}
  .db-ubd5.db-spiegel .db-ubd5__wrap>*{direction:ltr}
  .db-ubd5.db-spiegel .db-ubd5__vorm--ring{right:auto;left:-4rem}
  .db-ubd5.db-spiegel .db-ubd5__vorm--blok{left:auto;right:-3rem;transform:rotate(calc(var(--db-helling) * -1))}
  .db-ubd5.db-spiegel .db-ubd5__figuur{right:auto;left:calc(100% / 9 - 4.25rem)}
  .db-ubd5.db-spiegel .db-ubd5__kaart{padding:clamp(2rem,4vw,3.25rem) clamp(1.75rem,4vw,3.25rem) clamp(2rem,4vw,3.25rem) calc(clamp(7rem,10vw,9rem) + 6rem)}
}

/* cta-strip: kaart rechts, werker links */
@media (min-width:901px){
  .db-cta7.db-spiegel .db-cta7__binnen{direction:rtl}
  .db-cta7.db-spiegel .db-cta7__binnen>*{direction:ltr}
  .db-cta7.db-spiegel .db-cta7__stempel{right:auto;left:0;transform:rotate(8deg)}
}

/* werkgebied: kaart en gegevens rechts, kaart-met-werker links */
@media (min-width:901px){
  .db-wg6.db-spiegel .db-wg6__inner{direction:rtl}
  .db-wg6.db-spiegel .db-wg6__inner>*{direction:ltr}
  .db-wg6.db-spiegel .db-wg6__foto{right:auto;left:-1.1rem;box-shadow:-.55rem .55rem 0 var(--db-roze)}
  /* de werker blijft rechts van de kaart: de kaartlabels (Kantoor, Loods, Noordzee) staan links in de SVG en zouden anders afgedekt worden */
  .db-wg6.db-spiegel .db-wg6__loc--loods{padding-right:1.1rem;padding-left:calc(40% + 1.4rem)}
}

/* kosten-blok: tekst rechts, foto met Dani links; paneel en roze plaat spiegelen mee */
@media (min-width:901px){
  .db-kb7.db-spiegel .db-kb7__inner{direction:rtl}
  .db-kb7.db-spiegel .db-kb7__inner>*{direction:ltr}
  .db-kb7.db-spiegel::before{right:auto;left:0;clip-path:polygon(0 0,calc(100% - 3.9rem) 0,100% 100%,0 100%)}
  .db-kb7.db-spiegel .db-kb7__slab{left:-1.2rem;right:2.2rem}
  .db-kb7.db-spiegel .db-kb7__naam{left:auto;right:-1.2rem}
  .db-kb7.db-spiegel .db-kb7__kaart{margin:calc(var(--kb-over) * -1) -1.4rem 0 3.2rem}
}

/* prijsopbouw */
@media (min-width:901px){
  .db-po2.db-spiegel .db-po2__inner{direction:rtl}
  .db-po2.db-spiegel .db-po2__inner>*{direction:ltr}
}

/* vergunning-blok: de figuurkolom komt links */
@media (min-width:901px){
  .db-vgb9.db-spiegel .db-vgb9__wrap{grid-template-columns:var(--v9-fig) repeat(3,minmax(0,1fr))}
  .db-vgb9.db-spiegel .db-vgb9__kop{grid-column:2 / 5}
  .db-vgb9.db-spiegel .db-vgb9__kaart{grid-column:1}
  .db-vgb9.db-spiegel .db-vgb9__s1{grid-column:2}
  .db-vgb9.db-spiegel .db-vgb9__s2{grid-column:3}
  .db-vgb9.db-spiegel .db-vgb9__s3{grid-column:4}
  .db-vgb9.db-spiegel .db-vgb9__stempel{left:auto;right:-1rem}
  .db-vgb9.db-spiegel .db-vgb9__werker{right:auto;left:0}
}

/* faq: tekst links, werker met contactplaat rechts */
@media (min-width:901px){
  .db-faq9.db-spiegel .db-faq9__inner{direction:rtl}
  .db-faq9.db-spiegel .db-faq9__inner>*{direction:ltr}
}

/* reviews: foto rechts van de kop; de eerste kaart blijft onder de foto */
@media (min-width:1000px){
  .db-rev-team.db-spiegel .db-rev-team__in{grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1.75fr)}
  .db-rev-team.db-spiegel .db-rev-team__kop{grid-column:1 / 3}
  .db-rev-team.db-spiegel .db-rev-team__foto{grid-column:3}
  .db-rev-team.db-spiegel .db-rev-team__kaart:nth-child(1){grid-column:3}
  .db-rev-team.db-spiegel .db-rev-team__kaart:nth-child(2){grid-column:1}
  .db-rev-team.db-spiegel .db-rev-team__kaart:nth-child(3){grid-column:2}
}

/* checklist-risicos */
@media (min-width:901px){
  .db-cr7.db-spiegel .db-cr7__twee{direction:rtl}
  .db-cr7.db-spiegel .db-cr7__twee>*{direction:ltr}
  .db-cr7.db-spiegel .db-cr7__foto{margin:0 -.75rem calc(var(--cr-over) * -1) 1.5rem}
}

/* missie-kernwaarden */
@media (min-width:761px){
  .db-mk11.db-spiegel .db-mk11__missie{direction:rtl}
  .db-mk11.db-spiegel .db-mk11__missie>*{direction:ltr}
}

/* contact-gegevens */
@media (min-width:901px){
  .db-cg5.db-spiegel .db-cg5__raster{direction:rtl}
  .db-cg5.db-spiegel .db-cg5__raster>*{direction:ltr}
}
