/* NECESSO 2026-10-16 — No crop/zoom for Product cards and Solutions scenes.
   Load after all other stylesheets. All photographs display at their real aspect ratio. */

/* Product: keep the accepted wide card and accordions, but make the 16:9 photo
   an aspect-ratio-preserving visual instead of stretching it through a tall column. */
.product-page .product-detail .workflow-list>.feature-group {
  overflow:hidden;
}
.product-page .product-detail .feature-group-heading {
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  justify-content:flex-start!important;
  align-self:start!important;
  padding:0!important;
  height:auto!important;
  min-height:0!important;
  overflow:visible!important;
  background:#f8f5ed;
}
.product-page .product-detail .feature-group-heading::after {
  display:none!important;
  content:none!important;
}
.product-page .product-detail .product-feature-image {
  position:relative!important;
  inset:auto!important;
  display:block!important;
  order:0;
  flex:none;
  width:100%!important;
  max-width:none!important;
  height:auto!important;
  aspect-ratio:16 / 9!important;
  margin:0!important;
  overflow:hidden!important;
  border-radius:0!important;
  background:#e8e3d9;
  z-index:auto!important;
}
.product-page .product-detail .product-feature-image img {
  display:block!important;
  position:static!important;
  inset:auto!important;
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  object-fit:contain!important;
  object-position:center!important;
  transform:none!important;
  scale:1!important;
  animation:none!important;
  transition:none!important;
  filter:none!important;
}
.product-page .product-detail .feature-group-heading>h3 {
  order:1;
  position:relative!important;
  z-index:auto!important;
  align-self:stretch;
  width:calc(100% - 32px)!important;
  max-width:none!important;
  margin:16px!important;
  padding:14px 17px!important;
  background:#fbf9f4!important;
  border:1px solid #e4e1d9!important;
  border-radius:13px!important;
  box-shadow:none!important;
  color:#17241b!important;
  font-size:clamp(23px,2.15vw,33px)!important;
  line-height:1.18!important;
  white-space:normal!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
  hyphens:none!important;
  transform:none!important;
}

/* Solutions: use an actual img with contain, never a cover-sized CSS background.
   This makes the whole source frame visible on any viewport, even for portrait cards. */
.solutions-page .chapter.section-wrap {
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  background-color:#f6f2eb!important;
  background-image:none!important;
  background-size:auto!important;
  background-position:center!important;
  background-repeat:no-repeat!important;
}
.solutions-page .chapter.section-wrap.chapter-left,
.solutions-page .chapter.section-wrap.chapter-right,
.solutions-page .chapter.section-wrap[data-nc-scene-number] {
  background-image:none!important;
  background-size:auto!important;
}
.solutions-page .chapter.section-wrap::before {
  display:none!important;
  content:none!important;
}
.solutions-page .chapter.section-wrap::after,
.solutions-page .chapter.section-wrap.chapter-right::after {
  display:block!important;
  content:''!important;
  position:absolute!important;
  inset:0!important;
  z-index:1!important;
  pointer-events:none!important;
  opacity:1!important;
  background:linear-gradient(90deg,rgba(246,242,235,.95) 0%,rgba(246,242,235,.88) 33%,rgba(246,242,235,.52) 52%,rgba(246,242,235,.02) 83%)!important;
}
.solutions-page .chapter.section-wrap.chapter-right::after,
.solutions-page .chapter.section-wrap[data-nc-scene-number="03"]::after,
.solutions-page .chapter.section-wrap[data-nc-scene-number="05"]::after,
.solutions-page .chapter.section-wrap[data-nc-scene-number="06"]::after,
.solutions-page .chapter.section-wrap[data-nc-scene-number="08"]::after {
  background:linear-gradient(270deg,rgba(246,242,235,.95) 0%,rgba(246,242,235,.88) 33%,rgba(246,242,235,.52) 52%,rgba(246,242,235,.02) 83%)!important;
}
.solutions-page .chapter.section-wrap>.nc-scene-photo {
  position:absolute!important;
  inset:0!important;
  display:block!important;
  width:100%!important;
  height:100%!important;
  margin:0!important;
  overflow:hidden!important;
  border:0!important;
  border-radius:inherit;
  background:#efeae1;
  z-index:0!important;
  pointer-events:none!important;
}
.solutions-page .chapter.section-wrap>.nc-scene-photo>img {
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  object-fit:contain!important;
  object-position:right center!important;
  transform:none!important;
  scale:1!important;
  animation:none!important;
  transition:none!important;
}
.solutions-page .chapter.section-wrap.chapter-right>.nc-scene-photo>img,
.solutions-page .chapter.section-wrap[data-nc-scene-number="03"]>.nc-scene-photo>img,
.solutions-page .chapter.section-wrap[data-nc-scene-number="05"]>.nc-scene-photo>img,
.solutions-page .chapter.section-wrap[data-nc-scene-number="06"]>.nc-scene-photo>img,
.solutions-page .chapter.section-wrap[data-nc-scene-number="08"]>.nc-scene-photo>img {
  object-position:left center!important;
}
.solutions-page .chapter.section-wrap>:not(.nc-scene-photo) {
  position:relative;
  z-index:2;
}
/* The optional inset videos and disclosure illustrations also preserve their natural crop. */
.solutions-page .chapter .inline-film video,
.solutions-page .work-scene.side-story .inline-film video {
  object-fit:contain!important;
  object-position:center!important;
  transform:none!important;
  scale:1!important;
}
.solutions-page .case-list details.case-card .case-card-media,
.solutions-page .case-list details.case-card .case-photo-frame {
  height:auto!important;
  max-height:none!important;
  aspect-ratio:auto!important;
  overflow:visible!important;
}
.solutions-page .case-list details.case-card .case-card-media img,
.solutions-page .case-list details.case-card .case-photo-frame img {
  display:block!important;
  width:100%!important;
  height:auto!important;
  max-height:none!important;
  aspect-ratio:auto!important;
  object-fit:contain!important;
  object-position:center!important;
  transform:none!important;
}
.solutions-page .work-scene.side-story {
  background-size:100% 100%,contain!important;
  background-repeat:no-repeat!important;
  background-position:center,center right!important;
}

@media(max-width:880px) {
 .product-page .product-detail .feature-group-heading {
   height:auto!important;
   min-height:0!important;
 }
 .product-page .product-detail .feature-group-heading>h3 {
   font-size:clamp(22px,5.3vw,30px)!important;
   width:calc(100% - 24px)!important;
   margin:12px!important;
   padding:12px 14px!important;
 }
 .solutions-page .chapter.section-wrap,
 .solutions-page .chapter.section-wrap.chapter-left,
 .solutions-page .chapter.section-wrap.chapter-right,
 .solutions-page .chapter.section-wrap[data-nc-scene-number] {
   display:flex!important;
   flex-direction:column!important;
   justify-content:flex-start!important;
   align-items:stretch!important;
   min-height:0!important;
   gap:12px;
   padding:14px!important;
   background-image:none!important;
 }
 .solutions-page .chapter.section-wrap::after {
   display:none!important;
   content:none!important;
 }
 .solutions-page .chapter.section-wrap>.nc-scene-photo {
   position:relative!important;
   inset:auto!important;
   flex:none!important;
   order:-1;
   width:100%!important;
   height:auto!important;
   aspect-ratio:auto!important;
   overflow:visible!important;
   border-radius:14px!important;
   background:transparent!important;
 }
 .solutions-page .chapter.section-wrap>.nc-scene-photo>img {
   width:100%!important;
   height:auto!important;
   aspect-ratio:auto!important;
   object-fit:contain!important;
   object-position:center!important;
   border-radius:14px!important;
 }
 .solutions-page .chapter.section-wrap>:not(.nc-scene-photo) {
   width:100%!important;
   max-width:none!important;
 }
}
@media(prefers-reduced-motion:reduce) {
 .solutions-page .chapter.section-wrap>.nc-scene-photo img,
 .product-page .product-detail .product-feature-image img {animation:none!important;transition:none!important;transform:none!important}
}
