/* Shared presentation layer for the Pilz, Softing, ifm and NOVUS portfolios. */
html:has(body:is(.pz-page,.sft-page,.ifp-page,.nv-product,.nv-library,.automation-page)) {
  max-width: 100%;
  overflow-x: clip;
}

:where(.pz-page,.sft-page,.ifp-page,.nv-product,.nv-library,.automation-page) {
  --ap-ink: var(--t1, #0f2238);
  --ap-copy: var(--t2, #2d4762);
  --ap-muted: var(--t3, #5a7494);
  --ap-line: var(--ln2, rgba(26, 53, 87, .18));
  --ap-soft: var(--bg, #f7f9fc);
  --ap-orange: var(--o2, #e5551a);
  color: var(--ap-ink);
  font-family: var(--f-body, Inter, "Segoe UI", Arial, sans-serif);
  max-width: 100%;
  overflow-x: clip;
}

:where(.pz-local,.sft-local,.ifp-local,.nv-local,.pz-breadcrumb,.sft-breadcrumb,.ifp-breadcrumb,.nv-breadcrumb) {
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
}

:where(.pz-spec-wrap,.sft-table-wrap,.ifp-spec-wrap,.ifp-table-wrap,.nv-table-wrap) {
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

:where(.pz-page,.sft-page,.ifp-page,.nv-product,.nv-library,.automation-page) :is(h1,h2,h3,.pz-button,.sft-button,.ifp-button,.nv-btn) {
  font-family: var(--f-head, "Plus Jakarta Sans", sans-serif);
}

:where(.pz-section,.sft-section,.ifp-section,.nv-section) { padding-block: 64px; }
:where(.pz-head,.sft-head,.ifp-head) { margin-bottom: 28px; }
:where(.pz-head,.sft-head,.ifp-head) > p { max-width: 780px; }

:where(.pz-route,.sft-route,.ifp-route,.pz-product,.sft-product,.ifp-product,.nv-card) {
  border-color: var(--ap-line) !important;
  border-radius: 16px !important;
  background: var(--white, #fff) !important;
  box-shadow: 0 10px 28px rgba(15, 34, 56, .055) !important;
  overflow: hidden;
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease !important;
}

:where(.pz-route,.sft-route,.ifp-route,.pz-product,.sft-product,.ifp-product,.nv-card):hover,
:where(.pz-route,.sft-route,.ifp-route,.pz-product,.sft-product,.ifp-product,.nv-card):focus-visible {
  border-color: rgba(229, 85, 26, .62) !important;
  box-shadow: 0 20px 46px rgba(15, 34, 56, .12) !important;
  transform: translateY(-4px) !important;
}

:where(.pz-route,.sft-route,.ifp-route,.pz-product,.sft-product,.ifp-product,.nv-card):focus-visible {
  outline: 3px solid rgba(229, 85, 26, .28);
  outline-offset: 4px;
}

:where(.pz-product__media,.sft-product__media,.ifp-product__media,.nv-card__media) {
  box-sizing: border-box;
  display: grid;
  height: 190px !important;
  min-height: 190px !important;
  place-items: center;
  padding: 16px !important;
  border-bottom: 1px solid var(--ap-line);
  background:
    radial-gradient(circle at 78% 18%, rgba(149, 180, 207, .22), transparent 34%),
    linear-gradient(145deg, #f8fafc, #edf3f8) !important;
  overflow: hidden;
}

:where(.pz-product__media,.sft-product__media,.ifp-product__media,.nv-card__media) img {
  display: block;
  width: 100% !important;
  height: 158px !important;
  max-width: 100% !important;
  max-height: 158px !important;
  object-fit: contain !important;
  mix-blend-mode: multiply;
}

:where(.pz-product__body,.sft-product__body,.ifp-product__body,.nv-card__body) {
  padding: 22px !important;
}

:where(.pz-product,.sft-product,.ifp-product,.nv-card) :is(b,.nv-card__body>span) {
  align-self: flex-end;
  margin-top: auto;
  padding-top: 20px;
  color: var(--ap-orange) !important;
  font-size: 13px;
  font-weight: 800;
  text-align: right;
}

:where(.pz-family-visual,.sft-family-visual,.ifp-family-visual,.nv-hero__media) {
  min-width: 0;
  overflow: hidden;
  border-color: var(--ap-line) !important;
  border-radius: 18px !important;
  background: linear-gradient(145deg, #f8fafc, #edf3f8) !important;
  box-shadow: 0 18px 50px rgba(15, 34, 56, .08);
}

:where(.pz-family-visual,.sft-family-visual,.ifp-family-visual,.nv-hero__media) img {
  display: block;
  width: 100% !important;
  height: min(340px, 34vw) !important;
  min-height: 230px;
  max-width: 100% !important;
  object-fit: contain !important;
  mix-blend-mode: multiply;
}

:where(.pz-option,.pz-fact,.sft-application,.sft-support,.sft-fact,.ifp-application,.ifp-fact,.nv-panel,.nv-cap-grid>article) {
  border: 1px solid var(--ap-line) !important;
  border-radius: 14px !important;
  background: var(--white, #fff) !important;
  box-shadow: 0 8px 24px rgba(15, 34, 56, .045);
}

/* High-contrast process arrows. They remain visible without sitting on card text. */
:where(.pz-chain article,.sft-node,.ifp-node,.nv-node) { overflow: visible; }
:where(.pz-chain article,.sft-node,.ifp-node,.nv-node):not(:last-child)::after {
  position: absolute !important;
  z-index: 4 !important;
  top: 34px !important;
  right: -24px !important;
  display: grid !important;
  width: 32px !important;
  height: 32px !important;
  place-items: center !important;
  border: 3px solid var(--ap-soft) !important;
  border-radius: 50% !important;
  background: var(--ap-orange) !important;
  box-shadow: 0 6px 16px rgba(229, 85, 26, .24) !important;
  color: #fff !important;
  content: "→" !important;
  font: 800 16px/1 var(--f-head, sans-serif) !important;
}

.pz-feature__diagram i {
  display: grid;
  width: 28px;
  height: 28px !important;
  margin-inline: auto;
  place-items: center;
  border-radius: 50%;
  background: var(--ap-orange);
  color: #fff !important;
}
.pz-feature__diagram i::after { content: "↓" !important; font-weight: 900; }

:where(.pz-rows,.sft-rows,.ifp-rows,.nv-table-wrap,.pz-spec-wrap,.sft-table-wrap,.ifp-table-wrap) {
  border-color: var(--ap-line) !important;
  border-radius: 15px !important;
  box-shadow: 0 10px 28px rgba(15, 34, 56, .045);
}

:where(.pz-page,.sft-page,.ifp-page,.nv-product,.nv-library) :is(.pz-section--navy,.pz-cta,.sft-cta,.ifp-cta,.nv-cta) :is(h2,h3,p,.pz-eyebrow,.sft-eyebrow,.ifp-eyebrow,.nv-eyebrow) {
  color: #edf4fa !important;
}

@media (max-width: 1050px) {
  :where(.pz-chain article,.sft-node,.ifp-node,.nv-node)::after { display: none !important; }
}

@media (max-width: 780px) {
  :where(.pz-section,.sft-section,.ifp-section,.nv-section) { padding-block: 48px; }
  :where(.pz-product__media,.sft-product__media,.ifp-product__media,.nv-card__media) { height: 176px !important; min-height: 176px !important; }
  :where(.pz-product__media,.sft-product__media,.ifp-product__media,.nv-card__media) img { height: 144px !important; max-height: 144px !important; }
  :where(.pz-family-visual,.sft-family-visual,.ifp-family-visual,.nv-hero__media) img { height: 260px !important; min-height: 210px; }
}
