/* De Kleine Bruidsjurk Atelier v1.1.0: mobiele weergave en mediastabiliteit */
/* Het tekstonderstreep-effect is bedoeld voor actieve menulinks, niet voor de CTA. */
.site-head .nav .nav-cta,
.site-head .nav .nav-cta[aria-current="page"],
.site-head .nav a.nav-cta:hover,
.site-head .nav a.nav-cta:focus-visible {
 text-decoration:none!important;
 text-decoration-line:none!important;
 text-underline-offset:initial!important;
 box-shadow:none!important;
 background-image:none!important;
 line-height:1.4;
 text-align:center;
 white-space:normal!important;
 overflow-wrap:normal;
 word-break:normal;
}
.site-head .nav .nav-cta::before,
.site-head .nav .nav-cta::after {text-decoration:none!important;box-shadow:none!important;}
@media(max-width:440px){.site-head .nav .nav-cta{min-width:101px;max-width:112px!important;padding:9px 7px!important;font-size:10px!important;}}
@media(max-width:360px){.site-head .nav .nav-cta{min-width:88px;max-width:92px!important;font-size:9px!important;}}

/* Een zichtbaar echt videoframe vóór de bezoeker klikt. */
.dkb-video-frame{position:relative;display:block;width:100%;max-width:100%;background:#211d1a;isolation:isolate;overflow:hidden}
.dkb-video-frame video{display:block;width:100%!important;height:100%!important;max-width:100%;object-fit:contain;background:#211d1a}
.dkb-video-start{position:absolute;z-index:2;inset:0;display:block;width:100%;height:100%;margin:0;padding:0;appearance:none;border:0;background:#211d1a;cursor:pointer;overflow:hidden}
.dkb-video-start>img{display:block;width:100%;height:100%;object-fit:cover}
.dkb-video-play-icon{position:absolute;top:50%;left:50%;width:76px;height:76px;transform:translate(-50%,-50%);display:grid;place-items:center;border-radius:50%;background:rgba(255,252,248,.93);color:#242321;font:normal 29px/1 Arial,sans-serif;padding-left:4px;box-shadow:0 8px 30px rgba(0,0,0,.2);transition:background-color .2s,transform .2s}
.dkb-video-start:hover .dkb-video-play-icon{background:#fff;transform:translate(-50%,-50%) scale(1.07)}
.dkb-video-start:focus-visible{outline:3px solid #a48a63;outline-offset:-5px}
.atelier-video .video-box .dkb-video-frame{aspect-ratio:16/9;height:100%}
.gallery-motion .motion-stage .dkb-video-frame{width:min(100%,255px);aspect-ratio:478/850;box-shadow:14px 14px 0 #d2c6b6}
.gallery-motion .motion-stage .dkb-video-frame .motion-video{height:100%!important;width:100%!important;aspect-ratio:478/850;box-shadow:none}
@media(max-width:620px){.gallery-motion .motion-stage .dkb-video-frame{width:min(83vw,290px);box-shadow:8px 8px 0 #d2c6b6}}

/* Compacte galerij zonder lege kolomstukken; verhouding van de foto's blijft intact. */
.gallery-inner{padding-top:54px!important;padding-bottom:72px!important}
.gallery-intro{margin-bottom:22px!important}
.gallery-motion{margin:8px 0 32px!important;min-height:0!important}
.gallery-filters{margin-bottom:20px!important}
.photo-masonry{columns:3;column-gap:14px;line-height:normal}
.photo-tile{display:inline-block;box-sizing:border-box;width:100%;break-inside:avoid;page-break-inside:avoid;margin:0 0 14px!important;vertical-align:top;line-height:normal}
.photo-open{line-height:0;overflow:hidden}
.photo-open img{display:block;max-width:100%;width:100%;height:auto;object-fit:contain;aspect-ratio:auto;vertical-align:bottom}
.photo-caption{min-height:0!important;padding:10px 12px 12px!important}
@media(max-width:960px){.photo-masonry{columns:2;column-gap:12px}.photo-tile{margin-bottom:12px!important}}
@media(max-width:610px){.gallery-inner{padding-top:40px!important;padding-bottom:55px!important}.photo-masonry{columns:1;column-gap:0}.photo-tile{margin-bottom:12px!important}.gallery-motion{margin:8px 0 24px!important}}

/* Reservefoto's hebben eigen verhoudingen; toon altijd de hele foto. */
.hero-photo img[data-dkb-recovered="1"],
.hero-photo-shell img[data-dkb-recovered="1"]{aspect-ratio:auto!important;height:auto!important;max-height:none!important;object-fit:contain!important;}
.art-photo img[data-dkb-recovered="1"]{height:100%;width:100%;object-fit:contain!important;}


/* v1.2.0 - GALERIJ: echte compacte fotokolommen in plaats van CSS multi-columns.
   De combinatie columns + inline-block + break-inside:avoid met WordPress' auto/lazy
   afbeeldingsafmetingen gaf enorme witvlakken vóór/naast de foto's.
   Zonder JS: toegankelijk raster. Met JS: echte masonry-kolommen zonder loze ruimte.
   Jurken blijven volledig zichtbaar; nooit bijsnijden of kunstmatig veranderen. */
body .photo-masonry {
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  align-items:start !important;
  align-content:start !important;
  gap:14px !important;
  column-count:auto !important;
  columns:auto !important;
  column-gap:14px !important;
  column-fill:auto !important;
  min-height:0 !important;
  height:auto !important;
}
body .photo-masonry.dkb-gallery-columns {
  grid-template-columns:repeat(var(--dkb-gallery-col-count,3),minmax(0,1fr)) !important;
}
body .photo-masonry .dkb-gallery-column {
  display:flex !important;
  flex-direction:column !important;
  align-items:stretch !important;
  justify-content:flex-start !important;
  gap:14px !important;
  min-width:0 !important;
  height:auto !important;
}
body .photo-masonry .photo-tile {
  display:block !important;
  width:100% !important;
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
  margin:0 !important;
  padding:0 !important;
  break-inside:auto !important;
  page-break-inside:auto !important;
  vertical-align:top !important;
}
body .photo-masonry .photo-tile[hidden] {display:none!important}
body .photo-masonry .photo-open {
  display:block !important;
  width:100% !important;
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  line-height:0 !important;
  overflow:hidden !important;
}
body .photo-masonry .photo-open img,
body .photo-masonry .photo-open img[sizes^="auto"] {
  display:block !important;
  position:static !important;
  width:100% !important;
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
  max-width:100% !important;
  margin:0 !important;
  padding:0 !important;
  object-fit:contain !important;
  aspect-ratio:auto !important;
  content-visibility:visible !important;
  contain-intrinsic-size:none !important;
  vertical-align:top !important;
}
body .photo-masonry .photo-caption {display:block !important;min-height:0 !important;margin:0 !important;padding:11px 13px 13px !important}
@media(max-width:960px){
  body .photo-masonry{grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:12px !important}
  body .photo-masonry .dkb-gallery-column{gap:12px!important}
}
@media(max-width:610px){
  body .photo-masonry{grid-template-columns:minmax(0,1fr) !important;gap:12px !important}
  body .photo-masonry .dkb-gallery-column{gap:12px!important}
}

/* Fase B 1.3: accessible keyboard skip link and robust content wrapper. */
.dkb-main{display:block;min-width:0}
.dkb-skip-link{position:fixed;z-index:99999;top:8px;left:8px;transform:translateY(-140%);padding:13px 20px;background:#242321;color:#fff!important;font:700 14px Manrope,Arial,sans-serif;box-shadow:0 4px 12px #0003;text-decoration:none}
.dkb-skip-link:focus{transform:translateY(0);outline:3px solid #a48a63;outline-offset:2px}
