/* ========================================================================== 
   PRIMIONICS DESIGN SYSTEM v1.0
   Compatibility-first global layer. Loaded after legacy/page CSS by shared.js.
   Architecture: tokens → base → typography → layout → components → templates
   → utilities → responsive rules.
   ========================================================================== */

/* 1. TOKENS ---------------------------------------------------------------- */
:root {
  /* Original Primionics homepage colour system. */
  --pm-brand-primary: #e5551a;
  --pm-brand-primary-hover: #c8420f;
  --pm-brand-primary-light: #f06830;
  --pm-brand-primary-lighter: #ff8a5c;
  --pm-brand-primary-soft: #fef2ec;
  --pm-brand-primary-border: rgba(229, 85, 26, .20);
  --pm-brand-primary-readable: #c8420f;
  --pm-action-primary: #c8420f;
  --pm-action-primary-hover: #0f2238;
  --pm-action-focus: rgba(229, 85, 26, .34);

  --pm-ink-950: #0f2238;
  --pm-ink-900: #1a3557;
  --pm-ink-800: #24487a;
  --pm-ink-700: #2d4762;
  --pm-ink-600: #5a7494;
  --pm-ink-500: #8baac6;
  --pm-ink-400: #c0d3e5;
  --pm-text-heading: #0f2238;
  --pm-text-primary: #2d4762;
  --pm-text-secondary: #5a7494;
  --pm-text-muted: #5a7494;
  --pm-text-subtle: #8baac6;
  --pm-text-on-dark: #e8eff8;
  --pm-text-on-dark-secondary: #95b4cf;
  --pm-text-on-dark-muted: #4c6e8c;

  --pm-surface-main: #f7f9fc;
  --pm-surface-white: #fff;
  --pm-surface-warm: #f7f9fc;
  --pm-surface-cool: #eef2f8;
  --pm-surface-dark: #0f2238;
  --pm-surface-emphasis: #1a3557;
  --pm-border-light: rgba(26, 53, 87, .10);
  --pm-border-default: rgba(26, 53, 87, .18);
  --pm-border-strong: rgba(26, 53, 87, .28);
  --pm-success: #19724b;
  --pm-warning: #b85c00;
  --pm-error: #b42318;

  /* Compatibility names used throughout established templates. */
  --color-brand-navy-900: var(--pm-ink-950);
  --color-brand-navy-800: var(--pm-ink-900);
  --color-brand-blue-700: var(--pm-brand-primary-hover);
  --color-brand-blue-600: var(--pm-brand-primary);
  --color-brand-blue-500: var(--pm-brand-primary-light);
  --color-brand-blue-100: var(--pm-brand-primary-soft);
  --color-brand-blue-050: var(--pm-surface-main);
  --color-text-primary: var(--pm-ink-950);
  --color-text-secondary: var(--pm-ink-700);
  --color-text-muted: var(--pm-ink-600);
  --color-text-inverse: #fff;
  --color-surface-white: var(--pm-surface-white);
  --color-surface-main: var(--pm-surface-main);
  --color-surface-grey: var(--pm-surface-warm);
  --color-surface-grey-light: var(--pm-surface-cool);
  --color-surface-blue: var(--pm-surface-cool);
  --color-surface-dark: var(--pm-surface-dark);
  --color-border-default: var(--pm-border-light);
  --color-border-light: var(--pm-border-light);
  --color-border-dark: var(--pm-border-default);
  --color-success: var(--pm-success);
  --color-warning: var(--pm-warning);
  --color-error: var(--pm-error);
  --color-info: var(--pm-ink-800);
  --color-accent: var(--pm-brand-primary);
  --color-navy: var(--pm-ink-950);
  --color-text: var(--pm-ink-800);
  --color-link: var(--pm-brand-primary-readable);
  --color-border: var(--pm-border-light);
  --color-border-strong: var(--pm-border-default);
  --color-surface: var(--pm-surface-white);
  --color-surface-alt: var(--pm-surface-cool);

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-18: 72px;
  --space-24: 96px;

  --font-size-xs: 12px;
  --font-size-sm: 14px;
  --font-size-base: 16px;
  --font-size-lg: 18px;
  --font-size-xl: 20px;
  --font-size-2xl: 24px;
  --font-size-3xl: 32px;
  --font-size-4xl: 40px;
  --font-size-5xl: 48px;
  --font-size-hero: clamp(40px, 5vw, 60px);

  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-pill: 999px;
  --shadow-card: none;
  --shadow-elevated: 0 6px 24px rgba(15, 34, 56, .08);
  --shadow-overlay: 0 18px 45px rgba(15, 34, 56, .14);
  --container: min(calc(100% - 48px), 1248px);
  --content-narrow: 760px;
  --content-medium: 900px;
  --header-height: 72px;
  --mobile-sticky-height: 68px;
  --z-base: 0;
  --z-header: 100;
  --z-dropdown: 200;
  --z-sticky: 300;
  --z-overlay: 400;
  --z-modal: 500;
  --z-consent: 600;
  --transition-fast: 160ms ease;

  /* Legacy aliases: one source of truth for existing templates. */
  --bg: var(--pm-surface-main);
  --paper: var(--pm-surface-cool);
  --paper2: #e4eaef;
  --white: var(--color-surface-white);
  --n0: var(--color-brand-navy-900);
  --n1: var(--color-brand-navy-800);
  --n2: #24487a;
  --n3: #2e5c9c;
  --n4: #4a7ec0;
  --n5: #7aabdc;
  --n6: #b8d4ee;
  --n7: #dde9f6;
  --o1: var(--pm-brand-primary-hover);
  --o2: var(--pm-brand-primary);
  --o3: var(--pm-brand-primary-light);
  --o4: var(--pm-brand-primary-lighter);
  --o-bg: var(--pm-brand-primary-soft);
  --o-bd: var(--pm-brand-primary-border);
  --t1: var(--color-text-primary);
  --t2: var(--color-text-secondary);
  --t3: var(--color-text-muted);
  --t4: var(--pm-text-subtle);
  --t5: var(--pm-ink-400);
  --ln: var(--color-border-default);
  --ln2: var(--color-border-dark);
  --ln3: var(--pm-border-strong);
  --rail: var(--container);
  --rn: min(calc(100% - 48px), var(--content-medium));
  --sp: var(--space-18);
  --sp2: var(--space-16);
  --rad: var(--radius-md);
  --rad2: var(--radius-sm);
  --sha: var(--shadow-elevated);
  --sha2: var(--shadow-elevated);

  /* Page-module aliases. Manufacturer identity remains inside real assets. */
  --cv-navy: var(--color-brand-navy-900);
  --cv-navy2: var(--color-brand-navy-800);
  --cv-orange: var(--pm-brand-primary);
  --cv-orange2: var(--pm-brand-primary-light);
  --cv-paper: var(--color-surface-grey);
  --cv-line: var(--color-border-default);
  --cv-text: var(--color-text-primary);
  --cv-muted: var(--color-text-secondary);
  --pm-navy: var(--color-brand-navy-900);
  --pm-blue: #24487a;
  --pm-orange: var(--pm-brand-primary);
  --pm-orange-dark: var(--pm-brand-primary-hover);
  --pm-paper: var(--color-surface-grey);
  --pm-line: var(--color-border-default);
  --pm-muted: var(--color-text-secondary);
  --pp-orange: var(--pm-brand-primary);
  --ss-orange: var(--pm-brand-primary);
  --ss-orange-soft: var(--pm-brand-primary-soft);
  --svc-orange: var(--pm-brand-primary);
  --ax-orange: var(--pm-brand-primary);
  --ax-orange-dark: var(--pm-brand-primary-hover);
  --abt-orange: var(--pm-brand-primary);
  --abt-orange-soft: var(--pm-brand-primary-soft);
  --di-orange: var(--pm-brand-primary);
  --pw-orange: var(--pm-brand-primary);
  --pw-orange-dark: var(--pm-brand-primary-hover);
  --home-orange: var(--pm-brand-primary);
  --home-orange-2: var(--pm-brand-primary-light);
  --orange: var(--pm-brand-primary);
  --orange2: var(--pm-brand-primary-light);
  --orange-soft: var(--pm-brand-primary-soft);
  --accent: var(--pm-brand-primary);
  --action-orange: var(--pm-action-primary);
  --action-orange-dark: var(--pm-action-primary-hover);
}

/* 2. BASE ------------------------------------------------------------------ */
html { scroll-padding-top: 96px; }
body {
  color: var(--color-text-primary);
  background: var(--color-surface-main);
  font-family: var(--f-body, Inter, Arial, sans-serif);
  font-size: var(--font-size-base);
  line-height: 1.6;
}
main, main > *, .nav-inner, .nav-panel-inner, .pm-footer-grid > *,
.dp-hero > *, .pp-hero-grid > *, .contact-layout > *, [class*="grid"] > * { min-width: 0; }
section[id], [id].dp-section, [id].pp-section, [id].ss-section { scroll-margin-top: 96px; }
img { height: auto; }
a { text-underline-offset: 3px; }
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: 3px solid var(--pm-action-focus);
  outline-offset: 3px;
}

/* 3. TYPOGRAPHY ------------------------------------------------------------ */
:where(h1, h2, h3, h4, h5, h6) {
  color: var(--color-brand-navy-900);
  font-family: var(--f-head, Inter, Arial, sans-serif);
  text-wrap: balance;
}
:where(.ph-title, .dp-h1, .dp-title, .pp-brand-name, .sv-h1, .ss-h1, .aw-hero h1) {
  font-size: clamp(40px, 4.4vw, 56px);
  line-height: 1.05;
}
:where(.pm-section-head h2, .dp-sec-title, .pp-h2, .ss-h2, .sv-h2, .aw-section__head h2,
  .solution-section h2, .resource-card h2, .contact-paths h2, .next-steps h2) {
  font-size: clamp(30px, 3.3vw, 40px);
  line-height: 1.15;
}
:where(.pm-eyebrow, .eyebrow, .lbl, .pp-eyebrow, .pp-kicker, .ss-kicker, .aw-eyebrow,
  .resource-eyebrow, .conversion-panel__eyebrow, .contact-form-section__title) {
  color: var(--color-brand-blue-600);
  font-family: var(--f-mono, monospace);
  font-size: var(--font-size-xs);
  font-weight: 700;
  letter-spacing: .12em;
  line-height: 1.25;
  text-transform: uppercase;
}
:where(.lead-text, .ph-sub, .pp-lead, .ss-lead, .sv-lead, .resource-hero p) {
  max-width: var(--content-narrow);
  color: var(--color-text-secondary);
  font-size: var(--font-size-lg);
  line-height: 1.65;
}

/* Legacy master layers justified card text; engineering cards scan better left aligned. */
body :is([class*="card"] p, [class*="card"] li, [class*="step"] p, [class*="feat"] p,
  [class*="domain"] p, [class*="related"] p, .dp-tagline, .dp-section p, .pp-desc,
  .ss-copy, .ss-lead, .ss-note, .industry-copy p, .section-copy p) {
  text-align: left !important;
  hyphens: none !important;
  word-break: normal !important;
  overflow-wrap: break-word;
}

/* 4. LAYOUT ---------------------------------------------------------------- */
.container, .rail, .pm-shell, .dp-shell, .pp-rail, .sv-container, .aw-container,
.conversion-panel__inner, .contact-paths__inner, .contact-layout, .next-steps__inner {
  width: var(--container);
  max-width: none;
  margin-inline: auto;
}
.content-narrow { max-width: var(--content-narrow); }
.content-medium { max-width: var(--content-medium); }
.grid { display: grid; gap: var(--space-6); }
.grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
:where(.section, .sec, .pm-section, .pp-section, .ss-section, .sv-section, .aw-section,
  .solution-section, .dph-section, .resource-body, .next-steps) { padding-block: var(--space-18); }

/* 5. BUTTONS & LINKS ------------------------------------------------------- */
body :is(.btn, .pm-button, .dp-cta-primary, .dp-cta-sec, .dp-btn-primary, .dp-btn-sec,
  .pd3-btn-primary, .pd3-btn-sec, .pp-btn, .sv-btn, .tm20-enquire-btn, .contact-submit button,
  .qm-submit, .dp-submit, .pd3-submit, .consent-btn, .mobile-conversion-bar a) {
  width: auto;
  min-width: 0;
  min-height: 48px !important;
  padding: 10px 20px !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  border-radius: var(--radius-md) !important;
  font-family: var(--f-body, Inter, Arial, sans-serif) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 1.3;
  text-align: center;
  white-space: normal;
  text-decoration: none;
  transition: background-color var(--transition-fast), border-color var(--transition-fast), color var(--transition-fast);
}
body :is(.btn-primary, .btn-orange, .pm-button-primary, .pm-nav-quote, .dp-cta-primary,
  .dp-btn-primary, .pd3-btn-primary, .pp-btn-primary, .sv-btn--primary, .tm20-enquire-btn,
  .contact-submit button, .qm-submit, .dp-submit, .pd3-submit, .consent-btn.primary,
  .mobile-conversion-bar__primary) {
  border: 1px solid var(--color-brand-blue-600) !important;
  background: var(--color-brand-blue-600) !important;
  color: var(--color-text-inverse) !important;
}
body :is(.btn-primary, .btn-orange, .pm-button-primary, .pm-nav-quote, .dp-cta-primary,
  .dp-btn-primary, .pd3-btn-primary, .pp-btn-primary, .sv-btn--primary, .tm20-enquire-btn,
  .contact-submit button, .qm-submit, .dp-submit, .pd3-submit, .consent-btn.primary,
  .mobile-conversion-bar__primary):hover {
  border-color: var(--color-brand-blue-700) !important;
  background: var(--color-brand-blue-700) !important;
}
body :is(.btn-outline, .btn-outline-o, .pm-button-light, .pm-button-outline, .dp-cta-sec,
  .dp-btn-sec, .pd3-btn-sec, .pp-btn-light, .sv-btn--secondary, .consent-btn:not(.primary),
  .mobile-conversion-bar__secondary) {
  border: 1px solid var(--color-border-dark) !important;
  background: var(--color-surface-white) !important;
  color: var(--color-brand-navy-900) !important;
}
:where(.button-group, .hero-actions, .ph-actions, .pm-hero-actions, .dp-ctas, .pp-actions,
  .sv-actions, .solution-actions, .mid-conversion__actions) {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-3);
}
body :is(.pcard-explore, .tm20-card-cta, .sim-explore, .prod-card-link, .pf-link,
  .ss-card-link, .btn-explore, .aw-area-card__link, .ax-text-link, .resource-card-link) {
  color: var(--color-brand-blue-600) !important;
  font-weight: 600 !important;
}

/* 6. CARD FOUNDATION ------------------------------------------------------ */
body :is(.card, .pm-application, .pm-wing, .pm-industry, .pm-architecture, .pm-resource,
  .pcard, .tm20-card, .dph-card, .prod-card, .pf-card, .sim-card, .related-card,
  .partner-card, .pp-catalog-card, .pp-product-link, .pp-app,
  .sv-card, .aw-card, .aw-area-card, .resource-card,
  .contact-side-card, .next-step, .careers-card, .service-card, .solution-card,
  .portfolio-card, .feature-card) {
  height: 100%;
  min-width: 0;
  border: 1px solid var(--color-border-default) !important;
  border-radius: var(--radius-lg) !important;
  background: var(--color-surface-white) !important;
  box-shadow: var(--shadow-card) !important;
  overflow: hidden;
  transition: border-color var(--transition-fast), box-shadow var(--transition-fast), transform var(--transition-fast) !important;
}
body :is(.card, .pm-application, .pm-wing, .pm-industry, .pm-architecture, .pm-resource,
  .pcard, .tm20-card, .dph-card, .prod-card, .pf-card, .sim-card, .related-card,
  .partner-card, .pp-catalog-card, .pp-product-link, .pp-app,
  .sv-card, .aw-card, .aw-area-card, .resource-card,
  .contact-side-card, .next-step, .careers-card, .service-card, .solution-card,
  .portfolio-card, .feature-card):hover {
  border-color: #b8d4ee !important;
  box-shadow: var(--shadow-elevated) !important;
  transform: translateY(-1px) !important;
}
:where(.pcard, .tm20-card, .dph-card, .prod-card, .pf-card, .sim-card, .partner-card,
  .pp-catalog-card, .pm-application, .pm-wing, .pm-resource) { display: flex; flex-direction: column; }
:where(.pcard-body, .tm20-card-body, .dph-card__body, .prod-card-body, .pf-body,
  .sim-body, .partner-card-body, .pp-catalog-card .pcard-body) {
  display: flex;
  flex: 1;
  flex-direction: column;
}
:where(.pcard-foot, .tm20-card-foot, .dph-card__link, .prod-card-actions, .pf-link,
  .sim-foot, .partner-card-footer, .pp-catalog-card .pcard-foot) { margin-top: auto; }
:where(.pcard-name, .tm20-card-name, .dph-card h3, .prod-card-name, .pf-card h3,
  .sim-name, .partner-card-name, .pp-catalog-card .pcard-name) {
  color: var(--color-brand-navy-900);
  font-size: var(--font-size-lg) !important;
  line-height: 1.3;
  overflow-wrap: anywhere;
}

/* 7. PRODUCT & RELATED-PRODUCT SYSTEM ------------------------------------ */
:where(.pcard-img, .tm20-card-img, .dph-card__media, .prod-card-img, .pf-img,
  .kx-product-card-img, .sim-img, .related-photo) {
  width: 100%;
  height: 220px !important;
  min-height: 220px;
  display: flex !important;
  align-items: center;
  justify-content: center;
  padding: var(--space-6) !important;
  border-bottom: 1px solid var(--color-border-light);
  background: var(--color-surface-white) !important;
  overflow: hidden;
}
:where(.pcard-img, .tm20-card-img, .dph-card__media, .prod-card-img, .pf-img,
  .kx-product-card-img, .sim-img) img {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  padding: 0 !important;
  object-fit: contain !important;
  transform: none !important;
}
.related-photo {
  background-color: var(--color-surface-white) !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: contain !important;
}
.related-photo::after { display: none; }
:where(.pcard-name, .tm20-card-name, .prod-card-name, .sim-name, .pp-catalog-card .pcard-name) {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}

/* Replace duplicated per-page related sliders with one responsive grid. */
.sim-outer { width: var(--container); max-width: none; margin-inline: auto; }
.sim-slider { padding: 0 !important; overflow: visible !important; }
.sim-track, .sim-track.has-nav {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--space-6) !important;
  transform: none !important;
  transition: none !important;
}
.sim-card { width: auto !important; max-width: none; flex: none !important; }
.sim-body { padding: var(--space-5); gap: var(--space-2); }
.sim-img { height: 220px !important; min-height: 220px; }
.sim-foot { padding: var(--space-4) var(--space-5); border-top: 1px solid var(--color-border-light); background: var(--color-surface-grey-light); }
.sim-btn, .sim-prev, .sim-next { display: none !important; }
.sim-products-section { padding-block: var(--space-18); border-top: 1px solid var(--color-border-default); background: var(--color-surface-grey); }
.sim-products-section .dp-sec-title, .sim-header { width: var(--container); max-width: none; margin-inline: auto; padding: 0 0 var(--space-6); }

/* Category grids use the same 4 → 3 → 2 → 1 progression. */
:where(.tm20-grid, .cat-products, .pf-grid.compact, .pp-catalog-grid) {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: var(--space-6) !important;
}

/* Standard product hero: information 58%, visual 42%. */
.dp-shell { background: var(--color-surface-white); }
.dp-breadcrumb, .dp-bc {
  width: var(--container);
  margin-inline: auto;
  padding: var(--space-4) 0;
  border: 0;
  background: var(--color-surface-white);
  color: var(--color-text-muted);
  font-size: var(--font-size-sm);
}
.dp-breadcrumb a, .dp-bc a { color: var(--color-brand-blue-600); }
.dp-snav a.active,
.dp-snav a[aria-current="true"] { color: var(--color-brand-blue-600) !important; }
.dp-snav a::after,
.dp-snav a.active::after { background: var(--color-brand-blue-600) !important; }
html body .dp-hero {
  width: var(--container);
  margin-inline: auto;
  display: grid;
  grid-template-columns: minmax(0, 1.38fr) minmax(340px, 1fr) !important;
  gap: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 1px solid var(--color-border-default);
  border-radius: var(--radius-xl);
  overflow: hidden;
  background: var(--color-surface-white) !important;
  color: var(--color-text-primary) !important;
}
html body .dp-hero::before,
html body .dp-hero::after { display: none !important; }
html body .dp-info-col {
  grid-column: 1;
  grid-row: 1;
  padding: var(--space-10);
  background: var(--color-surface-white) !important;
  color: var(--color-text-primary) !important;
}
.dp-img-col {
  grid-column: 2;
  grid-row: 1;
  min-height: 500px;
  border: 0;
  border-left: 1px solid var(--color-border-default);
  background: var(--color-surface-grey-light);
}
.dp-carousel { min-height: 420px; padding: var(--space-8); }
.dp-carousel-slide img, .dp-img-main img { width: 100%; height: 100%; max-height: 360px; object-fit: contain; }
.dp-h1, .dp-title { color: var(--color-brand-navy-900) !important; font-size: clamp(36px, 4vw, 52px); line-height: 1.06; overflow-wrap: anywhere; }
.dp-tagline, .dp-subtitle { color: var(--color-text-secondary) !important; font-size: var(--font-size-base); line-height: 1.65; }
.dp-series-label { color: var(--color-brand-blue-600) !important; }
.dp-new-badge { background: var(--color-brand-blue-600) !important; color: var(--color-surface-white) !important; }
.dp-dot { background: rgb(11 92 173 / 20%) !important; }
.dp-dot.active { background: var(--color-brand-blue-600) !important; }
.dp-arr:hover { border-color: var(--color-brand-blue-600) !important; background: var(--color-brand-blue-600) !important; }
.dp-thumb.active { border-color: var(--color-brand-blue-600) !important; }
html body .dp-hero .dp-ks { border-color: var(--color-border-default) !important; }
html body .dp-hero .dp-ks-item {
  border-color: var(--color-border-default) !important;
  background: var(--color-surface-grey-light) !important;
  color: var(--color-text-primary) !important;
}
html body .dp-hero .dp-ks-lbl { color: var(--color-text-muted) !important; }
html body .dp-hero .dp-ks-val { color: var(--color-brand-navy-900) !important; }
html body .dp-hero .dp-chip,
html body .dp-std-chip {
  border-color: #dde9f6 !important;
  background: var(--color-brand-blue-100) !important;
  color: var(--color-brand-blue-700) !important;
}
html body .dp-sec-title { color: var(--color-brand-navy-900) !important; }
html body .dp-feat,
html body .dp-app { border-color: var(--color-border-default) !important; }
html body .dp-feat { border-left-color: var(--color-brand-blue-600) !important; }
.dp-ctas { margin-top: auto; }

/* Shared identity remains navy/blue even where legacy page bundles set orange. */
html body .pm-nav .nav-logo-name,
html body .pm-header .nav-logo-name { color: var(--color-brand-navy-900) !important; }

/* 8. PARTNER & LOGO SYSTEM ------------------------------------------------ */
.partner-card-logo, .pm-trust-logos > *, .partner-logo-stage {
  height: 72px;
  min-height: 72px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-3) var(--space-5);
  border-bottom: 1px solid var(--color-border-light);
  background: var(--color-surface-white);
}
.pm-trust-logos { min-width: 0; grid-template-columns: repeat(8, minmax(0, 1fr)); }
.partner-card-logo img, .pm-trust-logos img, .partner-logo-stage img {
  width: auto;
  height: auto;
  max-width: 150px;
  max-height: 44px;
  object-fit: contain;
}
.pm-trust-logos img { width: 100%; max-width: 100%; padding-inline: var(--space-2); }
.partner-card-logo-text { color: var(--color-brand-navy-900) !important; font-size: var(--font-size-xl); text-align: center; }
.partner-card-body { padding: var(--space-5); gap: var(--space-2); }
.partner-card-footer { padding: var(--space-4) var(--space-5); border-top: 1px solid var(--color-border-light); }
.pp-logo-panel {
  min-height: 240px;
  padding: var(--space-10);
  border: 1px solid var(--color-border-default);
  border-radius: var(--radius-xl);
  background: var(--color-surface-white);
  box-shadow: none;
}
.pp-logo-panel::before { display: none; }
.pp-logo-panel img { width: auto; height: auto; max-width: 240px; max-height: 80px; object-fit: contain; }
html body .dp-pill[class], body .pp-product-tag, body .badge, body .chip {
  min-height: 28px;
  padding: 5px 10px;
  display: inline-flex;
  align-items: center;
  border: 1px solid #dde9f6 !important;
  border-radius: var(--radius-pill) !important;
  background: var(--color-brand-blue-100) !important;
  color: var(--color-brand-blue-700) !important;
  font-family: var(--f-body, Inter, sans-serif) !important;
  font-size: var(--font-size-xs) !important;
  font-weight: 600 !important;
  letter-spacing: 0;
  text-transform: none;
}

/* 9. FORMS, TABLES, MODALS ------------------------------------------------ */
body :where(input:not([type="checkbox"]):not([type="radio"]), select, textarea, .form-control) {
  width: 100%;
  min-height: 48px;
  padding: 10px 14px;
  border: 1px solid var(--color-border-default);
  border-radius: var(--radius-md);
  background: var(--color-surface-white);
  color: var(--color-text-primary);
  font: inherit;
}
body :where(input:not([type="checkbox"]):not([type="radio"]), select, textarea, .form-control):focus {
  outline: 3px solid rgba(11, 92, 173, .18);
  outline-offset: 0;
  border-color: var(--color-brand-blue-600);
  box-shadow: none;
}
textarea { min-height: 120px; resize: vertical; }
:where(.contact-field, .qm-field, .dp-fg, .pd3-fg) { gap: var(--space-2); }
:where(.contact-fields, .qm-row) { gap: var(--space-5); }
.contact-form-card, .contact-side-card { border-radius: var(--radius-lg); box-shadow: none; }
.contact-form-section { padding: var(--space-6); }

:where(.table-scroll, .dp-spec-wrap, .dp-models, .dp-models-wrap, .dp-acc-wrap,
  .pd3-model-table-wrap, .pd3-acc-wrap, .topas-spec-wrap) {
  max-width: 100%;
  overflow-x: auto;
  border: 1px solid var(--color-border-default);
  border-radius: var(--radius-md);
  background: var(--color-surface-white);
  -webkit-overflow-scrolling: touch;
}
:where(.spec-table, .dp-spec-table, .dp-models-table, .pd3-model-table, .topas-spec-table) {
  width: 100%;
  border-collapse: collapse;
  line-height: 1.45;
}
:where(.spec-table, .dp-spec-table, .dp-models-table, .pd3-model-table, .topas-spec-table) th,
:where(.spec-table, .dp-spec-table, .dp-models-table, .pd3-model-table, .topas-spec-table) td {
  padding: 13px 16px;
  border-bottom: 1px solid var(--color-border-light);
  text-align: left;
  vertical-align: top;
}
:where(.spec-table, .dp-spec-table, .dp-models-table, .pd3-model-table, .topas-spec-table) th {
  background: var(--color-surface-grey);
  color: var(--color-brand-navy-900);
  font-weight: 600;
}

.qm-overlay { z-index: var(--z-modal); padding: var(--space-4); }
.qm-dialog { width: min(640px, calc(100vw - 32px)); max-height: calc(100vh - 32px); border-radius: var(--radius-xl); box-shadow: var(--shadow-overlay); }
.qm-head { border-radius: var(--radius-xl) var(--radius-xl) 0 0; background: var(--color-brand-navy-900); }
.qm-head-close { width: 44px; height: 44px; top: 12px; right: 12px; }
.pm-search-overlay { z-index: var(--z-overlay); }
.pm-search-dialog { width: min(820px, calc(100vw - 32px)); border-radius: var(--radius-xl); box-shadow: var(--shadow-overlay); }

/* 10. SHARED CHROME, CONSENT & LAYERS ------------------------------------ */
.pm-nav { min-height: var(--header-height); z-index: var(--z-header); background: var(--color-surface-white); }
.pm-nav .nav-inner { min-height: var(--header-height); }
.pm-nav-quote { min-height: 48px; padding: 10px 20px; border-radius: var(--radius-md); }
.pm-nav .nav-panel { z-index: var(--z-dropdown); border-color: var(--color-border-default); border-top-color: var(--color-brand-blue-600); box-shadow: var(--shadow-elevated); }
.pm-nav .nav-link:hover, .pm-nav .nav-link.active { color: var(--color-brand-blue-700); }
.pm-nav .nav-link::after { background: var(--color-brand-blue-600); }
.pm-footer { border-top: 3px solid var(--color-brand-blue-600); background: var(--color-brand-navy-900); }
.pm-footer a:hover, .pm-footer button:hover { color: #e8eff8; }
.float-bar { z-index: var(--z-sticky); }
.mobile-conversion-bar { z-index: var(--z-sticky); border-color: var(--color-border-default); box-shadow: var(--shadow-elevated); }
.consent-banner {
  z-index: var(--z-consent);
  max-width: 760px;
  padding: var(--space-5);
  border: 1px solid var(--color-border-default);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-overlay);
  background: var(--color-surface-white);
}
.consent-banner a { color: var(--color-brand-blue-600); }
.consent-actions { gap: var(--space-2); }
body:has(.consent-banner.open) .mobile-conversion-bar,
body:has(.consent-banner.open) .float-bar { display: none !important; }

/* 11. HOMEPAGE RHYTHM ----------------------------------------------------- */
body[data-page-type="home"] .pm-home-hero {
  background: var(--color-brand-blue-050);
  color: var(--color-text-primary);
}
body[data-page-type="home"] .pm-home-hero::before { opacity: .25; }
body[data-page-type="home"] .pm-home-hero h1 { color: var(--color-brand-navy-900); font-size: var(--font-size-hero); }
body[data-page-type="home"] .pm-home-hero h1 span { color: var(--color-brand-blue-600); }
body[data-page-type="home"] .pm-home-hero-copy > p { color: var(--color-text-secondary); }
body[data-page-type="home"] .pm-hero-proof-item { border-color: #dde9f6; background: rgba(255, 255, 255, .72); }
body[data-page-type="home"] .pm-hero-proof-item strong { color: var(--color-brand-navy-900); }
body[data-page-type="home"] .pm-hero-proof-item span { color: var(--color-text-secondary); }
body[data-page-type="home"] .pm-hero-proof-item b { color: var(--color-brand-blue-600); }
body[data-page-type="home"] .pm-trust { background: var(--color-surface-white); }
body[data-page-type="home"] section:has(#application-title) { background: var(--color-surface-grey); }
body[data-page-type="home"] section:has(#technologies-title) { background: var(--color-surface-white); color: var(--color-text-primary); }
body[data-page-type="home"] section:has(#technologies-title) :is(h2, h3) { color: var(--color-brand-navy-900); }
body[data-page-type="home"] section:has(#technologies-title) .pm-section-head p { color: var(--color-text-secondary); }
body[data-page-type="home"] section:has(#industries-title) { background: var(--color-surface-grey); }
body[data-page-type="home"] section:has(#architecture-title) { background: var(--color-surface-white); }
body[data-page-type="home"] section:has(#process-title) { background: var(--color-surface-blue); color: var(--color-text-primary); }
body[data-page-type="home"] section:has(#process-title) :is(h2, strong) { color: var(--color-brand-navy-900); }
body[data-page-type="home"] section:has(#process-title) p { color: var(--color-text-secondary); }
body[data-page-type="home"] section:has(#resources-title) { background: var(--color-surface-white); }
body[data-page-type="home"] section:has(#academix-title) { background: var(--color-surface-grey); }
.pm-wing { min-height: 390px; padding: var(--space-8); color: var(--color-text-primary); }
.pm-wing h3 { color: var(--color-brand-navy-900); }
.pm-wing p, .pm-wing li { color: var(--color-text-secondary); }
.pm-wing a { position: static !important; margin-top: auto; color: var(--color-brand-blue-600); }
.pm-application { min-height: 188px; }
.pm-application::after { background: var(--color-brand-blue-600); }
.pm-industry { min-height: 190px; padding: var(--space-6); }
.pm-industry b, .pm-eyebrow { color: var(--color-brand-blue-600); }
.pm-resource:first-child { color: var(--color-text-primary); background: var(--color-surface-white) !important; }
.pm-resource:first-child strong { color: var(--color-brand-navy-900); }
.pm-process { border-color: #dde9f6; }
.pm-process-step { border-color: #dde9f6; }

/* 12. MOTION & UTILITIES -------------------------------------------------- */
.badge { border-radius: var(--radius-pill); }
.icon-box { width: 44px; height: 44px; display: grid; place-items: center; color: var(--color-brand-blue-600); }
.surface-white { background: var(--color-surface-white); }
.surface-grey { background: var(--color-surface-grey); }
.surface-blue { background: var(--color-surface-blue); }
.surface-dark { background: var(--color-surface-dark); color: var(--color-text-inverse); }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

/* 13. RESPONSIVE ---------------------------------------------------------- */
@media (max-width: 1279px) {
  :where(.grid-4, .tm20-grid, .cat-products, .pf-grid.compact, .pp-catalog-grid),
  .sim-track, .sim-track.has-nav { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}
@media (max-width: 1100px) {
  .grid-4 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .float-bar { display: none !important; }
}
@media (max-width: 1023px) {
  :where(.grid-4, .grid-3, .tm20-grid, .cat-products, .pf-grid.compact, .pp-catalog-grid),
  .sim-track, .sim-track.has-nav { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  html body .dp-hero { grid-template-columns: 1fr !important; gap: 0 !important; padding: 0 !important; }
  .dp-info-col { grid-column: 1; grid-row: 1; padding: var(--space-8); }
  .dp-img-col { grid-column: 1; grid-row: 2; min-height: 380px; border-left: 0; border-top: 1px solid var(--color-border-default); }
  .pp-logo-panel { min-height: 180px; }
}
@media (max-width: 850px) {
  .grid-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  :root { --container: calc(100% - 32px); --rn: calc(100% - 32px); }
  body.has-mobile-conversion { padding-bottom: calc(var(--mobile-sticky-height) + env(safe-area-inset-bottom)); }
  .consent-banner { left: 12px; right: 12px; bottom: 12px; padding: var(--space-4); }
  .consent-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .pm-footer-grid { grid-template-columns: 1fr 1fr; gap: var(--space-8); }
  .dp-info-col { padding: var(--space-6); }
  .dp-img-col { min-height: 320px; }
  .dp-carousel { min-height: 300px; padding: var(--space-5); }
  .dp-ctas, .pp-actions, .sv-actions, .solution-actions { display: grid; grid-template-columns: 1fr; }
  .dp-ctas > *, .pp-actions > *, .sv-actions > *, .solution-actions > * { width: 100% !important; }
  :where(.section, .sec, .pm-section, .pp-section, .ss-section, .sv-section, .aw-section,
    .solution-section, .dph-section, .resource-body, .next-steps, .sim-products-section) { padding-block: var(--space-12); }
}
@media (max-width: 699px) {
  :where(.grid-4, .grid-3, .grid-2, .tm20-grid, .cat-products, .pf-grid.compact, .pp-catalog-grid),
  .sim-track, .sim-track.has-nav { grid-template-columns: 1fr !important; }
  .sim-img { height: 220px !important; }
}
@media (max-width: 520px) {
  .pm-footer-grid { grid-template-columns: 1fr; }
  .consent-actions { grid-template-columns: 1fr; }
  .qm-body, .qm-head { padding-left: var(--space-5); padding-right: var(--space-5); }
}