/* Product catalogue additions; retain the public site's original visual system. */

/* Seven floating names in the existing homepage scene. */
.enterprise-stage.has-portfolio-live .portfolio-status:nth-child(1) {
  left: 10%; right: auto; top: 14%;
}
.enterprise-stage.has-portfolio-live .portfolio-status:nth-child(2) {
  left: auto; right: 10%; top: 14%;
}
.enterprise-stage.has-portfolio-live .portfolio-status:nth-child(3) {
  left: 8%; right: auto; top: 38%;
}
.enterprise-stage.has-portfolio-live .portfolio-status:nth-child(4) {
  left: auto; right: 8%; top: 38%;
}
.enterprise-stage.has-portfolio-live .portfolio-status:nth-child(5) {
  left: 10%; right: auto; top: 62%;
}
.enterprise-stage.has-portfolio-live .portfolio-status:nth-child(6) {
  left: auto; right: 8%; top: 62%;
}
.enterprise-stage.has-portfolio-live .portfolio-status:nth-child(7) {
  left: 50%; right: auto; top: 84%;
  translate: -50% 0;
  --air-x1: 10px; --air-y1: -9px;
  --air-x2: -8px; --air-y2: 8px;
  --air-r1: -2deg; --air-r2: 2deg;
  --air-duration: 16s; --air-delay: -4s;
}
.stage-orbit-label.label-g { left: 8%; top: 40%; }
.stage-orbit-label.label-h { right: 8%; top: 62%; }

#enquiry { scroll-margin-top: 110px; }
.text-link { display: inline-flex; margin-top: 18px; font-weight: 800; }

/* Fit the two new product illustrations to smaller screens. */
@media (max-width: 720px) {
  :is(.product-pentrust, .product-secowl) .lifecycle-step {
    grid-template-columns: 42px minmax(0, 1fr);
  }
  :is(.product-pentrust, .product-secowl) .lifecycle-step:not(.active) {
    transform: translateY(16px);
  }
  .enterprise-stage.has-portfolio-live .portfolio-status {
    --air-x1: 8px; --air-x2: -6px;
    --air-y1: -8px; --air-y2: 7px;
  }
  .suite-panel[data-suite-panel="pentrust"] h3,
  .suite-panel[data-suite-panel="secowl"] h3 {
    font-size: clamp(34px, 9.5vw, 48px);
    line-height: 1.03;
  }
  .product-pentrust .cinematic-visual.has-product-ui,
  .product-secowl .cinematic-visual.has-product-ui {
    min-height: 0;
    padding: 66px 14px 14px;
  }
  .capability-visual:has(canvas[data-scene="pentrust"]),
  .capability-visual:has(canvas[data-scene="secowl"]) {
    min-height: 0;
    height: auto;
    padding: 64px 16px 16px;
  }
  .capability-visual:has(canvas[data-scene="pentrust"]) .visual-caption,
  .capability-visual:has(canvas[data-scene="secowl"]) .visual-caption {
    top: 20px;
    bottom: auto;
    left: 16px;
    right: 16px;
  }
  :is(.product-pentrust, .product-secowl) .product-motion-ui,
  .home-outcomes .capability-visual:has(canvas[data-scene="pentrust"]) .product-motion-ui,
  .home-outcomes .capability-visual:has(canvas[data-scene="secowl"]) .product-motion-ui {
    position: relative;
    inset: auto !important;
    height: auto;
    min-height: 0;
  }
  :is(.product-pentrust, .product-secowl) .demo-shell,
  .home-outcomes .capability-visual:has(canvas[data-scene="pentrust"]) .demo-shell,
  .home-outcomes .capability-visual:has(canvas[data-scene="secowl"]) .demo-shell {
    height: auto;
    min-height: 0;
    gap: 14px !important;
  }
  :is(.product-pentrust, .product-secowl) .demo-head {
    flex-direction: column;
    gap: 8px !important;
  }
  :is(.product-pentrust, .product-secowl) .demo-panel {
    flex: 0 1 auto;
    min-height: auto;
  }
  :is(.product-pentrust, .product-secowl) .flow-board {
    grid-template-columns: 1fr !important;
    flex: 0 1 auto;
  }
  :is(.product-pentrust, .product-secowl) .flow-lane { display: none; }
  :is(.product-pentrust, .product-secowl) .demo-row {
    grid-template-columns: 30px minmax(0, 1fr) !important;
  }
  :is(.product-pentrust, .product-secowl) .demo-row .demo-state {
    grid-column: 2;
    justify-self: start;
  }
  :is(.product-pentrust, .product-secowl) .demo-row strong,
  :is(.product-pentrust, .product-secowl) .flow-node b { font-size: 12px !important; }
  :is(.product-pentrust, .product-secowl) .demo-row small,
  :is(.product-pentrust, .product-secowl) .flow-node small,
  :is(.product-pentrust, .product-secowl) .flow-output p { font-size: 10px !important; }
  :is(.product-pentrust, .product-secowl) .demo-note {
    display: block;
    line-height: 1.4 !important;
  }
}