/* Full-width desktop surfaces; individual forms, previews and dialogs retain their sizing. */
@media (min-width: 769px) {
  body:not(.mobile) #dzzoffice,
  body:not(.mobile) .page-main {
    width: 100%; max-width: none; min-width: 0;
    height: 100vh; height: 100dvh;
  }
  body:not(.mobile) .container,
  body:not(.mobile) .page-container,
  body:not(.mobile) .manage-content,
  body:not(.mobile) .desktop-main {
    width: 100% !important; max-width: none !important; min-width: 0;
    margin-left: 0; margin-right: 0; box-sizing: border-box;
  }
  body:not(.mobile) .el-container,
  body:not(.mobile) .el-main,
  body:not(.mobile) .manage-workspace {
    min-width: 0; min-height: 0;
  }
  body:not(.mobile) .manage-content,
  body:not(.mobile) .desktop-main { padding-left: clamp(16px, 2vw, 40px); padding-right: clamp(16px, 2vw, 40px); }
  body:not(.mobile) .page-header { max-width: none; }
  body:not(.mobile) .page-header > .container { width: 100% !important; }
}


/* Homepage uses the component's calculated card widths, then fills each row. */
body:not(.mobile) #dzzoffice[data-photo-home] .imagelayout .image-wrapper {
  display:flex!important;
  flex-wrap:wrap!important;
  gap:8px!important;
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  align-items:flex-start!important;
}
body:not(.mobile) #dzzoffice[data-photo-home] .imagelayout .image-wrapper > .image-item {
  position:relative!important;
  inset:auto!important;
  transform:none!important;
  flex:1 1 auto;
  height:auto!important;
  min-width:0!important;
  max-width:100%;
  margin:0!important;
}
body:not(.mobile) #dzzoffice[data-photo-home] .imagelayout .image-wrapper > .image-item .image-single {
  width:100%!important;
  height:auto!important;
  aspect-ratio:3/4;
  overflow:hidden;
}
body:not(.mobile) #dzzoffice[data-photo-home] .imagelayout .image-wrapper > .image-item .image,
body:not(.mobile) #dzzoffice[data-photo-home] .imagelayout .image-wrapper > .image-item .el-image__inner {
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
}

/* Desktop homepage brand title: keep the site name visible at full-screen widths. */
@media (min-width:769px) {
  body:not(.mobile) #top_header .header-content .h-left .text,
  body:not(.mobile) .page-header .h-left .sitename {
    display:block!important;
    font-size:22px!important;
    line-height:1.2!important;
    font-weight:700!important;
    letter-spacing:.02em;
    white-space:nowrap;
  }
  body:not(.mobile) #top_header .header-content .h-left .el-image,
  body:not(.mobile) .page-header .h-left .logo {
    width:42px!important;
    height:42px!important;
  }
}


#dzzoffice[data-photo-home] .image-item-imageList .image-single>div{padding-bottom:133.333333%!important;}#dzzoffice[data-photo-home] .image-item-imageList .image-single img{object-fit:cover!important;object-position:center!important;}

#dzzoffice[data-photo-home] .image-item-imageList .image-single .image{width:100%!important;height:100%!important;}#dzzoffice[data-photo-home] .image-item-imageList .image-single{overflow:hidden;}