/* Monitoring detail hero · clean editorial split layout. */
body.page-bg-other-products.monitoring-clean-hero .detail-hero {
 position:relative;
 overflow:hidden;
 background:
  radial-gradient(circle at 88% 18%,rgba(179,199,208,.3),transparent 28%),
  radial-gradient(circle at 12% 86%,rgba(222,194,157,.2),transparent 30%),
  linear-gradient(118deg,#f8f3ec 0%,#f3eee7 54%,#e9eff1 100%)!important;
}
body.page-bg-other-products.monitoring-clean-hero .detail-hero::after {
 content:"";
 position:absolute;
 width:420px;
 height:420px;
 right:-160px;
 top:-180px;
 border:1px solid rgba(72,86,101,.1);
 border-radius:50%;
 box-shadow:0 0 0 62px rgba(255,255,255,.08),0 0 0 124px rgba(255,255,255,.05);
 pointer-events:none;
}
body.page-bg-other-products.monitoring-clean-hero .detail-hero-grid {
 position:relative;
 z-index:1;
 grid-template-columns:minmax(340px,.78fr) minmax(520px,1.14fr);
 gap:clamp(52px,6vw,96px);
 align-items:center;
}
body.page-bg-other-products.monitoring-clean-hero .detail-copy {
 order:1;
 width:100%;
 max-width:540px;
 padding:30px 0;
}
body.page-bg-other-products.monitoring-clean-hero .detail-media {
 order:2;
 width:100%;
 max-width:650px;
 justify-self:end;
 padding:20px;
 border:1px solid rgba(255,255,255,.82);
 border-radius:30px;
 background:rgba(255,255,255,.6);
 box-shadow:inset 0 1px 0 rgba(255,255,255,.92),0 30px 80px rgba(45,55,66,.14);
 -webkit-backdrop-filter:blur(20px) saturate(1.06);
 backdrop-filter:blur(20px) saturate(1.06);
}
body.page-bg-other-products.monitoring-clean-hero .detail-copy h1 {
 max-width:520px;
 margin-block:18px 20px;
 font-size:clamp(44px,4vw,64px);
 line-height:1.03;
 letter-spacing:-.05em;
 overflow-wrap:anywhere;
}
body.page-bg-other-products.monitoring-clean-hero .detail-copy>p:not(.content-kicker) {
 max-width:500px;
 color:#68727c;
 font-size:16px;
 line-height:1.7;
}
body.page-bg-other-products.monitoring-clean-hero .detail-gallery-stage {
 aspect-ratio:16/9;
 overflow:hidden;
 border-radius:20px;
 background:#fff;
}
body.page-bg-other-products.monitoring-clean-hero .detail-gallery-stage img {
 width:100%;
 height:100%;
 object-fit:contain;
}
body.page-bg-other-products.monitoring-clean-hero .detail-gallery-thumbs { margin-top:14px; }
@media (max-width:1100px) {
 body.page-bg-other-products.monitoring-clean-hero .detail-hero-grid {
  grid-template-columns:minmax(300px,.8fr) minmax(430px,1.05fr);
  gap:34px;
 }
 body.page-bg-other-products.monitoring-clean-hero .detail-media { padding:16px; border-radius:24px; }
 body.page-bg-other-products.monitoring-clean-hero .detail-copy h1 { font-size:clamp(40px,5vw,54px); }
}
@media (max-width:800px) {
 body.page-bg-other-products.monitoring-clean-hero .detail-hero-grid {
  grid-template-columns:1fr;
  gap:24px;
 }
 body.page-bg-other-products.monitoring-clean-hero .detail-copy {
  order:1;
  max-width:none;
  padding:10px 4px 0;
 }
 body.page-bg-other-products.monitoring-clean-hero .detail-media {
  order:2;
  max-width:none;
  padding:12px;
  border-radius:20px;
 }
 body.page-bg-other-products.monitoring-clean-hero .detail-copy h1 {
  max-width:none;
  margin-block:12px 15px;
  font-size:clamp(36px,10vw,48px);
 }
 body.page-bg-other-products.monitoring-clean-hero .detail-copy>p:not(.content-kicker) { max-width:none; font-size:15px; }
 body.page-bg-other-products.monitoring-clean-hero .detail-hero::after { width:250px; height:250px; right:-130px; top:-90px; }
}
