/* R7.7.0 — WorkDeck Architecture; styles scoped to its product page. */
body[data-product="workdeck"] .workdeck-architecture-section > .container {
  width:min(1280px,calc(100% - 40px));max-width:1280px;margin-inline:auto;
}
body[data-product="workdeck"] .workdeck-architecture-section .arch-container-work {
  width:100%;margin:0 auto!important;padding:0!important;
  border:0!important;background:transparent!important;box-shadow:none!important;
  border-radius:0!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
  overflow:visible!important;
}
body[data-product="workdeck"] .workdeck-architecture-section .arch-container-work::before {display:none!important;content:none!important;}
body[data-product="workdeck"] .workdeck-architecture-section .section-title {max-width:1060px;margin-inline:auto;}
body[data-product="workdeck"] .workdeck-architecture-section .detail-copy {max-width:940px;margin-inline:auto;text-align:center;color:#c6d8e2;line-height:1.75;}
body[data-product="workdeck"] .workdeck-architecture-media {
  display:block!important;width:100%!important;margin:32px auto 0!important;padding:0!important;
  background:transparent!important;border:0!important;box-shadow:none!important;overflow:visible!important;
}
body[data-product="workdeck"] button.workdeck-architecture-image {
  display:block!important;position:relative;box-sizing:border-box;width:100%!important;max-width:none!important;
  margin:0!important;padding:0!important;background:transparent!important;border:0!important;
  box-shadow:none!important;border-radius:0!important;appearance:none;-webkit-appearance:none;
  color:inherit;font:inherit;cursor:zoom-in;overflow:hidden!important;text-align:inherit;
}
body[data-product="workdeck"] .workdeck-architecture-image img {
  display:block!important;width:100%!important;max-width:100%!important;max-height:none!important;
  height:auto!important;margin:0!important;padding:0!important;border:0!important;object-fit:contain!important;
  border-radius:0!important;background:transparent!important;box-shadow:none!important;
}
body[data-product="workdeck"] .workdeck-architecture-image:focus-visible {outline:3px solid #6cdec9;outline-offset:4px;}
body[data-product="workdeck"] .workdeck-zoom-hint {
  position:absolute;right:14px;bottom:14px;z-index:1;padding:8px 12px;border-radius:9px;
  color:#e8fffb;background:rgba(5,30,42,.92);border:1px solid rgba(124,223,211,.55);
  font-size:.76rem;font-weight:650;line-height:1.3;pointer-events:none;
}
.workdeck-image-popup {position:fixed;inset:0;z-index:26000;display:none;align-items:center;justify-content:center;padding:clamp(12px,3vw,30px);background:rgba(2,10,21,.94);backdrop-filter:blur(7px);}
.workdeck-image-popup.is-open {display:flex;}
.workdeck-image-popup__panel {position:relative;display:flex;align-items:center;justify-content:center;width:min(96vw,1680px);max-height:94dvh;}
.workdeck-image-popup__image {display:block;max-width:100%;max-height:90dvh;width:auto;height:auto;object-fit:contain;border-radius:8px;box-shadow:0 18px 56px rgba(0,0,0,.4);}
.workdeck-image-popup__close {position:absolute;top:-14px;right:-6px;z-index:1;width:44px;height:44px;display:grid;place-items:center;padding:0;border:1px solid rgba(160,244,218,.55);border-radius:10px;background:#102e38;color:white;font:32px/1 Arial,sans-serif;cursor:pointer;}
.workdeck-image-popup__close:focus-visible {outline:3px solid #6cdec9;outline-offset:3px;}
body.workdeck-image-popup-open {overflow:hidden;}
@media(max-width:850px){body[data-product="workdeck"] .workdeck-architecture-section > .container {width:calc(100% - 28px);}}
@media(max-width:640px){.workdeck-image-popup__panel{width:100%;}.workdeck-image-popup__image{max-height:84dvh;}.workdeck-image-popup__close{top:-38px;right:0;}}

/* R7.7.2 — responsive image correction; WorkDeck section only.
   The architecture image has a transparent matte so the page's blue/teal
   background shows through instead of an embedded black rectangle. */
body[data-product="workdeck"] .workdeck-architecture-media {
  width:100%!important;max-width:1060px!important;
  margin:24px auto 0!important;overflow:visible!important;
  background:transparent!important;
}
body[data-product="workdeck"] button.workdeck-architecture-image {
  width:100%!important;max-width:100%!important;
  margin-inline:auto!important;overflow:visible!important;
  background:transparent!important;
}
body[data-product="workdeck"] .workdeck-architecture-image img {
  display:block!important;width:100%!important;height:auto!important;
  max-height:none!important;max-width:100%!important;
  object-fit:contain!important;object-position:center!important;
  background:transparent!important;border-radius:0!important;
}
body[data-product="workdeck"] .workdeck-architecture-image .workdeck-zoom-hint {
  right:12px;bottom:12px;
}
@media (min-width:1000px) {
  body[data-product="workdeck"] .workdeck-architecture-media {max-width:960px!important;}
}
@media (max-width:640px) {
  body[data-product="workdeck"] .workdeck-architecture-section>.container {
    width:calc(100% - 24px)!important;
  }
  body[data-product="workdeck"] .workdeck-architecture-media {margin-top:18px!important;}
  body[data-product="workdeck"] .workdeck-architecture-image .workdeck-zoom-hint {
    right:8px;bottom:8px;font-size:.68rem;
  }
}

/* R7.7.3 — approved light-gradient topology, complete image without clipping. */
body[data-product="workdeck"] .workdeck-architecture-section .workdeck-architecture-media {
  max-width:1200px!important;width:100%!important;overflow:visible!important;
  margin:24px auto 0!important;background:transparent!important;
}
body[data-product="workdeck"] .workdeck-architecture-section button.workdeck-architecture-image {
  width:100%!important;max-width:100%!important;overflow:visible!important;
  background:transparent!important;
}
body[data-product="workdeck"] .workdeck-architecture-section .workdeck-architecture-image img {
  display:block!important;width:100%!important;height:auto!important;
  max-width:100%!important;max-height:none!important;object-fit:contain!important;
  background:transparent!important;border-radius:12px!important;
}
@media (max-width:640px) {
  body[data-product="workdeck"] .workdeck-architecture-section .workdeck-architecture-media {
    width:100%!important;max-width:100%!important;
  }
}