.service-row { grid-template-columns: 42px 124px .72fr 1fr auto; padding-block: 22px; }

.service-visual {
  width: 108px;
  height: 108px;
  overflow: hidden;
  position: relative;
  background: #102018;
}

.service-visual::after {
  content: "";
  position: absolute;
  inset: 0;
  border: 1px solid rgba(214, 168, 76, .2);
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .14);
  pointer-events: none;
}

.service-visual img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
  filter: saturate(.96) contrast(1.03);
  transition: transform .45s ease, filter .45s ease;
}

.service-row:hover .service-visual img {
  transform: scale(1.045);
  filter: saturate(1) contrast(1.03);
}

.intel-card {
  position: relative;
  min-width: 0;
  color: #fff;
  background: #0d1511;
  border: 1px solid rgba(255, 255, 255, .1);
  box-shadow: 0 30px 80px rgba(18, 28, 21, .28);
  overflow: hidden;
}

.intel-head, .intel-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.intel-head { padding: 24px 26px 20px; }
.intel-head > div { display: flex; flex-direction: column; gap: 9px; }
.intel-head strong { font: 600 16px Manrope; letter-spacing: -.01em; }
.intel-status, .model-tag, .intel-foot { font: 600 8px Manrope; letter-spacing: .14em; text-transform: uppercase; }
.intel-status { color: #8f9d93; }
.intel-status i, .intel-foot i { display: inline-block; width: 5px; height: 5px; margin-right: 7px; border-radius: 50%; background: #78c995; box-shadow: 0 0 0 4px rgba(120,201,149,.1); }
.model-tag { color: #d6a84c; padding: 8px 10px; border: 1px solid rgba(214,168,76,.3); }

.intel-map { height: 245px; position: relative; overflow: hidden; background: #111c16; border-block: 1px solid rgba(255,255,255,.08); }
.intel-map svg { width: 100%; height: 100%; display: block; }
.intel-map .grid { fill: none; stroke: rgba(255,255,255,.045); stroke-width: 1; }
.intel-map .contour { fill: none; stroke: rgba(214,168,76,.38); stroke-width: 1.1; }
.intel-map .contour.faint { stroke: rgba(214,168,76,.16); }
.intel-map .signal { fill: url(#heat); }
.intel-map .trend { fill: none; stroke: rgba(238,242,238,.5); stroke-width: 1.25; stroke-dasharray: 3 4; }
.target-rings { fill: none; stroke: #d6a84c; stroke-width: 1; }
.target-rings circle:nth-child(1) { opacity: .2; }
.target-rings circle:nth-child(2) { opacity: .55; }
.target-rings circle:nth-child(3) { fill: #d6a84c; stroke: none; }
.map-label { position: absolute; color: #738078; font: 600 7px Manrope; letter-spacing: .16em; }
.label-a { left: 14px; top: 14px; }
.label-b { left: 14px; top: 29px; }
.target-label { position: absolute; left: 63%; top: 31%; padding: 7px 9px; background: rgba(9,15,11,.82); color: #fff; font: 600 8px Manrope; letter-spacing: .08em; }
.target-label b { display: block; color: #d6a84c; margin-top: 4px; font-size: 6px; letter-spacing: .13em; }

.intel-result { display: grid; grid-template-columns: .72fr 1.4fr; min-height: 138px; }
.score { padding: 24px 25px; border-right: 1px solid rgba(255,255,255,.08); display: flex; flex-direction: column; justify-content: space-between; }
.score span, .evidence > span { color: #7f8c83; font: 600 8px Manrope; letter-spacing: .13em; text-transform: uppercase; }
.score strong { color: #d6a84c; font: 500 42px Manrope; letter-spacing: -.06em; line-height: 1; }
.score small { font-size: 15px; margin-left: 2px; }
.evidence { padding: 22px 24px; display: grid; gap: 11px; }
.evidence div { display: grid; grid-template-columns: 1fr auto; position: relative; padding-bottom: 5px; }
.evidence div::after, .evidence div i { content: ""; position: absolute; height: 2px; bottom: 0; left: 0; }
.evidence div::after { width: 100%; background: rgba(255,255,255,.08); }
.evidence div i { width: var(--score); background: #d6a84c; z-index: 1; }
.evidence b, .evidence em { font: 500 8px Manrope; font-style: normal; }
.evidence b { color: #d4d9d5; }
.evidence em { color: #829087; }
.intel-foot { padding: 14px 25px; color: #78857c; border-top: 1px solid rgba(255,255,255,.08); }

@media (max-width: 800px) {
  .service-row { grid-template-columns: 28px 72px 1fr; gap: 14px; }
  .service-visual { width: 64px; height: 64px; }
  .service-row p, .service-row b { grid-column: 3; }
  .intel-result { grid-template-columns: .65fr 1.35fr; }
  .target-label { left: 57%; }
}

@media (prefers-reduced-motion: reduce) {
  .service-visual img { transition: none; }
}
