/*
 * HJ Master Entry title art R1
 * Exact installed-system visuals for 114 Service tasks, 27 engineering
 * capabilities and eight Project delivery stages. Loaded only by those 149
 * pages; Product details retain their own R7 art direction.
 */

body[data-hj-title-art-version="r1"] .me-title-concept-diagram {
  --pv-line: var(--me-r3-accent);
  --pv-secondary: var(--me-r3-secondary);
  gap: 12px;
}

@media (min-width: 1080px) {
  body[data-hj-title-art-version="r1"] .me-hero-grid {
    grid-template-columns: minmax(0, .98fr) minmax(520px, .9fr);
    gap: clamp(42px, 5vw, 72px);
  }

  body[data-hj-title-art-version="r1"] .me-signal {
    padding: 28px;
  }
}

body[data-hj-title-art-version="r1"] .me-title-concept-diagram .me-concept-diagram-plot {
  background:
    linear-gradient(rgba(var(--me-r3-accent-rgb), .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(var(--me-r3-accent-rgb), .035) 1px, transparent 1px),
    radial-gradient(circle at 38% 43%, rgba(var(--me-r3-secondary-rgb), .14), transparent 40%),
    linear-gradient(160deg, rgba(var(--me-r3-accent-rgb), .075), transparent 58%);
  background-size: 26px 26px, 26px 26px, auto, auto;
  border: 1px solid rgba(var(--me-r3-accent-rgb), .16);
  border-radius: 18px;
  box-shadow: inset 0 1px rgba(255, 255, 255, .025), 0 22px 44px rgba(0, 0, 0, .26);
}

body[data-hj-title-art-version="r1"] .me-concept-diagram-head {
  grid-template-columns: minmax(112px, .62fr) minmax(0, 1.38fr);
  align-items: center;
}

body[data-hj-title-art-version="r1"] .me-concept-diagram-head strong {
  font-size: clamp(.88rem, 1.06vw, 1.02rem);
  line-height: 1.28;
}

body[data-hj-title-art-version="r1"] .me-title-artwork {
  color: var(--pv-line);
  filter: url(#pv-device-shadow);
}

body[data-hj-title-art-version="r1"] .me-title-artwork :is(
  .pv-shell, .pv-screen, .pv-line, .pv-line--heavy, .pv-wave,
  .pv-accent-line, .pv-soft, .pv-solid, .pv-panel, .pv-target,
  .pv-detection, .pv-parking-bay, .pv-fountain-basin, .pv-water-fill,
  .pv-safety-fill, .pv-safety-panel, .pv-fill-secondary, .pv-label-line
) {
  vector-effect: non-scaling-stroke;
  stroke-linecap: round;
  stroke-linejoin: round;
}

body[data-hj-title-art-version="r1"] .me-title-artwork :is(.pv-shell, .pv-solid) {
  fill: url(#pv-shell-gradient);
  stroke: rgba(var(--me-r3-accent-rgb), .92);
  stroke-width: 2.5;
}

body[data-hj-title-art-version="r1"] .me-title-artwork .pv-screen {
  fill: url(#pv-screen-gradient);
  stroke: rgba(var(--me-r3-accent-rgb), .76);
  stroke-width: 1.8;
}

body[data-hj-title-art-version="r1"] .me-title-artwork .pv-panel {
  fill: rgba(6, 25, 39, .92);
  stroke: rgba(var(--me-r3-accent-rgb), .62);
  stroke-width: 1.5;
}

body[data-hj-title-art-version="r1"] .me-title-artwork :is(.pv-line, .pv-label-line) {
  fill: none;
  stroke: rgba(var(--me-r3-accent-rgb), .88);
  stroke-width: 2;
}

body[data-hj-title-art-version="r1"] .me-title-artwork .pv-line--heavy {
  stroke-width: 3.6;
}

body[data-hj-title-art-version="r1"] .me-title-artwork .pv-line--dash {
  stroke-dasharray: 6 6;
}

body[data-hj-title-art-version="r1"] .me-title-artwork .pv-accent-line {
  fill: none;
  stroke: var(--pv-secondary);
  stroke-width: 2.8;
}

body[data-hj-title-art-version="r1"] .me-title-artwork .pv-wave {
  fill: none;
  stroke: var(--pv-secondary);
  stroke-width: 2.2;
  stroke-dasharray: 5 5;
}

body[data-hj-title-art-version="r1"] .me-title-artwork .pv-soft {
  fill: rgba(var(--me-r3-secondary-rgb), .12);
  stroke: rgba(var(--me-r3-secondary-rgb), .62);
  stroke-width: 1.7;
}

body[data-hj-title-art-version="r1"] .me-title-artwork :is(.pv-target, .pv-parking-bay, .pv-fountain-basin) {
  fill: rgba(var(--me-r3-accent-rgb), .08);
  stroke: rgba(var(--me-r3-accent-rgb), .64);
  stroke-width: 1.8;
}

body[data-hj-title-art-version="r1"] .me-title-artwork .pv-detection {
  fill: rgba(var(--me-r3-accent-rgb), .13);
  stroke: rgba(var(--me-r3-accent-rgb), .5);
  stroke-width: 1.5;
}

body[data-hj-title-art-version="r1"] .me-title-artwork :is(.pv-accent, .pv-dot, .pv-fill-secondary) {
  fill: var(--pv-secondary);
  stroke: rgba(255, 255, 255, .55);
  stroke-width: 1.2;
  vector-effect: non-scaling-stroke;
}

body[data-hj-title-art-version="r1"] .me-title-artwork :is(.pv-water-fill, .pv-fence-wire) {
  fill: none;
  stroke: var(--pv-secondary);
  stroke-width: 2.4;
}

body[data-hj-title-art-version="r1"] .me-title-artwork :is(.pv-safety-fill, .pv-safety-panel) {
  fill: rgba(31, 213, 132, .16);
  stroke: #52e699;
  stroke-width: 2;
}

body[data-hj-title-art-version="r1"] .me-title-artwork .pv-label {
  fill: #d8f7ff;
  font: 800 18px/1.1 Inter, ui-sans-serif, system-ui, sans-serif;
  letter-spacing: .055em;
}

body[data-hj-title-art-version="r1"] .me-title-artwork .pv-label--plate {
  font-size: 10px;
}

body[data-hj-title-art-version="r1"] .me-title-artwork :is(.pv-exit-person, .pv-exit-arrow) {
  fill: #bfffe0;
}

body[data-hj-title-art-version="r1"] .me-title-mode-badge rect {
  fill: rgba(4, 18, 29, .94);
  stroke: rgba(var(--me-r3-secondary-rgb), .8);
  stroke-width: 1.4;
}

body[data-hj-title-art-version="r1"] .me-title-mode-badge text {
  fill: #eefaff;
  font: 780 10px/1 Inter, ui-sans-serif, system-ui, sans-serif;
  letter-spacing: .075em;
}

body[data-hj-title-art-version="r1"] .me-title-mode-badge--capability rect {
  fill: rgba(var(--me-r3-secondary-rgb), .09);
  stroke: rgba(var(--me-r3-secondary-rgb), .86);
}

body[data-hj-title-art-version="r1"] .me-title-concept-diagram .me-visual-route {
  opacity: .55;
}

body[data-hj-title-art-version="r1"] .me-title-concept-diagram .me-visual-node {
  opacity: .76;
}

body[data-hj-title-art-version="r1"] .me-title-concept-diagram figcaption {
  color: rgba(220, 237, 247, .72);
  font-size: .75rem;
  line-height: 1.5;
}

@media (max-width: 900px) {
  body[data-hj-title-art-version="r1"] .me-title-concept-diagram .me-concept-diagram-plot {
    width: 100%;
    height: auto;
  }
}

@media (max-width: 640px) {
  body[data-hj-title-art-version="r1"] .me-concept-diagram-head {
    grid-template-columns: 1fr;
    gap: 5px;
  }

  body[data-hj-title-art-version="r1"] .me-title-mode-badge text {
    font-size: 9px;
    letter-spacing: .055em;
  }
}

@media (prefers-reduced-motion: reduce) {
  body[data-hj-title-art-version="r1"] .me-title-artwork,
  body[data-hj-title-art-version="r1"] .me-title-mode-badge {
    animation: none !important;
    transition: none !important;
  }
}

@media (forced-colors: active) {
  body[data-hj-title-art-version="r1"] .me-title-artwork *,
  body[data-hj-title-art-version="r1"] .me-title-mode-badge * {
    fill: Canvas !important;
    stroke: CanvasText !important;
  }

  body[data-hj-title-art-version="r1"] .me-title-mode-badge text {
    fill: CanvasText !important;
    stroke: none !important;
  }
}

@media print {
  body[data-hj-title-art-version="r1"] .me-title-artwork,
  body[data-hj-title-art-version="r1"] .me-title-mode-badge {
    filter: none !important;
  }

  body[data-hj-title-art-version="r1"] .me-title-concept-diagram .me-concept-diagram-plot {
    background: #fff !important;
    box-shadow: none !important;
  }
}