.product{text-decoration:none;color:inherit;display:block}.product p{overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.product h3{overflow-wrap:anywhere}.demo-label{display:block;margin:10px 0;color:#4e6659}.service-list>a{display:flex;align-items:start;gap:22px;text-decoration:none;color:inherit;border-top:1px solid #bdc3b2;padding:25px 0}.service-list>a>div{flex:1}.service-list>a p{max-width:65ch;line-height:1.7}
/* Image-first popup: transparent shell; controls stay outside the artwork. */
.home-ad {
  width: max-content;
  max-width: calc(100vw - 36px);
  max-height: calc(100vh - 32px);
  max-height: calc(100dvh - 32px);
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #fff;
  overflow: visible;
}
.home-ad[open] { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.home-ad::backdrop { background: #102c26aa; }
.home-ad .ad-controls {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  min-height: 44px;
}
.home-ad .ad-countdown {
  display: block;
  min-width: 128px;
  margin: 0 0 2px;
  padding: 7px 14px;
  border: 0;
  border-radius: 17px;
  background: rgba(6, 14, 11, 0.88);
  color: #fff;
  font-size: 14px;
  line-height: 20px;
  text-align: center;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.home-ad .ad-close {
  display: grid;
  place-items: center;
  flex: 0 0 44px;
  width: 44px;
  height: 44px;
  min-height: 44px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgba(6, 14, 11, 0.9);
  color: #fff;
  cursor: pointer;
  touch-action: manipulation;
}
.home-ad .ad-close span { position: relative; width: 16px; height: 16px; font-size: 0; }
.home-ad .ad-close span::before,
.home-ad .ad-close span::after {
  content: '';
  position: absolute;
  top: 7px;
  left: 0;
  width: 16px;
  height: 2px;
  border-radius: 1px;
  background: currentColor;
  transform: rotate(45deg);
}
.home-ad .ad-close span::after { transform: rotate(-45deg); }
.home-ad img {
  display: block;
  width: auto;
  height: auto;
  max-width: min(560px, calc(100vw - 36px));
  max-height: calc(100vh - 84px);
  max-height: calc(100dvh - 84px);
  margin: 0 auto;
  border: 0;
  border-radius: 0;
  object-fit: contain;
}
.home-ad .ad-image-link { display: block; max-width: 100%; line-height: 0; }
.home-ad .ad-description {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
.home-ad .ad-close:focus-visible,
.home-ad .ad-image-link:focus-visible { outline: 3px solid #e0bd6d; outline-offset: 3px; }

.art:not(.is-demo)::before{display:none}.hero-bottom small{display:none}.service-list>a p{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.service-list>a:focus-visible{outline:3px solid #b99b67;outline-offset:3px}

.art.is-demo::before{content:attr(data-demo)}

.custom-accent .button{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}.custom-accent :focus-visible{outline-color:var(--accent)}

/* Desktop fallback: reuse the catalogue monitor stand without changing other cards. */
.art.desktop .device::after{width:30%;height:17%;left:35%;top:100%;border-radius:0;clip-path:polygon(40% 0,60% 0,70% 80%,100% 85%,100% 100%,0 100%,0 85%,30% 80%)}
#services[hidden]{display:none!important}
