/* DAOL IS: six editable HTML scenario panels / bright 3D image replacement.
   Images are decorative. All written content remains editable in index.html / en/index.html.
   Loaded AFTER css/site.css to override the old dark radar icons. */
:root { --daol-visual-accent:#13aeb2; }
.applications .case-panel {
    background:#fff;
    border:1px solid #e3edf0;
    border-radius:16px;
    box-shadow:0 16px 42px rgba(30,82,103,.10);
    overflow:hidden;
}
.applications .case-panel .case-visual {
    background-color:#eaf6fd !important;
    background-repeat:no-repeat !important;
    background-size:cover !important;
    background-position:center center !important;
    isolation:isolate;
    min-height:395px;
}
/* Do not stack the previous dark radar overlay on top of our new photo. */
.applications .case-visual::before,
.applications .case-visual::after,
.applications .case-visual > * { display:none !important; }
.applications .case-panel[data-panel="home"] .case-visual { background-image:url('/assets/daol-case-home.webp') !important; }
.applications .case-panel[data-panel="building"] .case-visual { background-image:url('/assets/daol-case-building.webp') !important; }
.applications .case-panel[data-panel="apartment"] .case-visual { background-image:url('/assets/daol-case-apartment.webp') !important; }
.applications .case-panel[data-panel="village"] .case-visual { background-image:url('/assets/daol-case-village.webp') !important; }
.applications .case-panel[data-panel="industrial"] .case-visual { background-image:url('/assets/daol-case-industrial.webp') !important; }
.applications .case-panel[data-panel="public"] .case-visual { background-image:url('/assets/daol-case-public.webp') !important; }
.applications .case-panel .case-details { background:#fff; }
.applications .case-tab.is-active { color:#087e90; }
@media (max-width:767px) {
  .applications .case-panel .case-visual { min-height:260px !important; }
  .applications .case-panel .case-details { padding:30px 24px !important; }
}
@media (prefers-reduced-motion: reduce) {
  .applications .case-panel, .applications .case-panel * { transition:none !important; animation:none !important; }
}

/* Bright region safety banner and four matching community safety cards.
   All text is provided by the existing HTML; background pictures have NO text. */
.safety-network .reach-banner {
  display:grid !important;
  grid-template-columns:54% 46% !important;
  min-height:388px !important;
  background:linear-gradient(135deg,#fff 0%,#f0fafc 88%) !important;
  border:1px solid #d6e9ee !important;
  border-radius:18px;
  box-shadow:0 22px 58px rgba(21,74,95,.12) !important;
  overflow:hidden;
}
.safety-network .reach-banner::after{display:none !important;}
.safety-network .reach-banner-copy {
  grid-column:1;
  padding:46px 30px 43px 54px !important;
  min-width:0;
  min-height:388px;
  position:relative;
  z-index:1;
}
.safety-network .reach-overline {color:#0b8999 !important;}
.safety-network .network-live-dot {box-shadow:none !important;}
.safety-network .reach-banner h3{color:#133758 !important;}
.safety-network .reach-banner h3 span{color:#058f99 !important;}
.safety-network .reach-banner-copy>p{color:#466779 !important;}
.safety-network .reach-pills span {
  color:#1a6473 !important;
  background:#fff !important;
  border:1px solid #c9e1ea !important;
  box-shadow:0 3px 10px rgba(3,74,97,.05);
}
.safety-network .reach-rings {
  grid-column:2;
  display:block !important;
  min-height:388px !important;
  background:#d5f3f7 url('/assets/daol-community-hero.webp') no-repeat center center / cover !important;
  position:relative;
  isolation:isolate;
}
/* Original network annotations are hidden only in the artwork pane. */
.safety-network .reach-rings > * {display:none !important;}
.safety-network .reach-card {
  min-height:306px !important;
  border:1px solid #d9eaf0 !important;
  box-shadow:0 12px 28px rgba(19,74,96,.09);
  border-radius:14px;
  background-color:#fff !important;
  background-image:linear-gradient(180deg,#fff 0%,#fff 32%,rgba(255,255,255,.96) 52%,rgba(255,255,255,.05) 86%),var(--daol-card-art) !important;
  background-position:center,center bottom !important;
  background-size:cover,cover !important;
  background-repeat:no-repeat !important;
}
.safety-network .reach-card:nth-child(1){--daol-card-art:url('/assets/daol-reach-village.webp');}
.safety-network .reach-card:nth-child(2){--daol-card-art:url('/assets/daol-reach-industrial.webp');}
.safety-network .reach-card:nth-child(3){--daol-card-art:url('/assets/daol-reach-apartment.webp');}
.safety-network .reach-card:nth-child(4){--daol-card-art:url('/assets/daol-reach-building.webp');}
.safety-network .reach-card:hover{border-color:#81c6cf !important;transform:translateY(-3px);}
.safety-network .reach-card-top{color:#088b99 !important;}
.safety-network .reach-card-top svg{stroke:#088b99 !important;}
.safety-network .reach-card h3{color:#143757 !important;margin:19px 0 8px;}
.safety-network .reach-card p{color:#405e6f !important;}
.safety-network .reach-card-tag {
  margin-top:auto;
  color:#047c83 !important;
  padding-top:12px;
  text-shadow:0 1px 0 #fff;
}
@media(max-width:900px) {
 .safety-network .reach-banner {grid-template-columns:50% 50% !important;}
 .safety-network .reach-banner-copy{padding:32px 22px 30px 30px !important;}
 .safety-network .reach-card{min-height:285px !important;}
}
@media(max-width:720px) {
 .safety-network .reach-banner {display:flex !important; flex-direction:column !important;}
 .safety-network .reach-banner-copy {min-height:0; padding:28px 24px 28px !important;}
 .safety-network .reach-rings {min-height:235px !important; width:100%; background-position:center !important;}
 .safety-network .reach-card {min-height:280px !important;}
}