/* 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: a regular left-to-right grid with aligned rows. */
@media (min-width:769px) {
  body:not(.mobile) .imagelayout .image-wrapper {
    display:grid!important;
    grid-template-columns:repeat(8,minmax(0,1fr));
    grid-auto-flow:row!important;
    gap:12px!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    align-items:stretch!important;
  }
  body:not(.mobile) .imagelayout .image-wrapper > .image-item {
    position:relative!important;
    inset:auto!important;
    left:auto!important;
    top:auto!important;
    transform:none!important;
    width:auto!important;
    height:auto!important;
    min-width:0!important;
    margin:0!important;
    grid-column:auto!important;
    grid-row:auto!important;
  }
  body:not(.mobile) .imagelayout .image-wrapper > .image-item .image-single {
    width:100%!important;
    height:auto!important;
    aspect-ratio:4/5;
  }
  body:not(.mobile) .imagelayout .image-wrapper > .image-item .image,
  body:not(.mobile) .imagelayout .image-wrapper > .image-item .el-image__inner {
    width:100%!important;
    height:100%!important;
    object-fit:cover!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;
  }
}
