/* Shared layout rules for every product summary page. */
.ps-page { overflow: clip; }
html, body { max-width: 100%; overflow-x: hidden; }
.header .navbar { min-width: 0; }
.header .navbar-brand { min-width: 0; }
.header .navbar-brand img { max-width: 100%; height: auto; }
.header .navbar-collapse { min-width: 0; }
.ps-page *, .ps-page *::before, .ps-page *::after { box-sizing: border-box; }
.ps-wrap { width: min(1160px, calc(100% - 32px)); }
.ps-hero-grid { grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); gap: clamp(28px, 4vw, 55px); }
.ps-split { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(28px, 4vw, 65px); }
.ps-feature-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ps-benefits { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ps-hero-grid > *, .ps-split > *, .ps-feature-grid > *, .ps-benefits > * { min-width: 0; }
.ps-page :is(h1, h2, h3, p, span, a, b) { overflow-wrap: anywhere; }
.ps-kicker { max-width: 100%; white-space: normal; }
.ps-panel { width: 100%; min-width: 0; }
.ps-panel-item { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; }
.ps-panel-head > i, .ps-benefit > i, .ps-kicker > i { flex-shrink: 0; }
.ps-panel-head > span, .ps-benefit > span { min-width: 0; }
.ps-industries > span { max-width: 100%; }
.ps-actions a { max-width: 100%; white-space: normal; text-align: center; gap: 8px; }
.ps-actions a:focus-visible { outline: 3px solid #6ee8f1; outline-offset: 4px; }

.ps-page img {
  max-width: 100%;
  height: auto;
  display: block
}

.ps-page iframe,
.ps-page video,
.ps-page table,
.ps-page pre { max-width: 100%; }
.ps-page table { display: block; overflow-x: auto; }
.ps-page input,
.ps-page select,
.ps-page textarea,
.ps-page button { max-width: 100%; }

.ps-page h1,
.ps-page h2,
.ps-page h3,
.ps-page p,
.ps-page span {
  overflow-wrap: break-word
}

@media(max-width:1199px) {
  .ps-wrap {
    width: min(1040px, calc(100% - 40px))
  }

  .ps-hero-grid {
    grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr);
    gap: 38px
  }

  .ps-hero h1 {
    font-size: clamp(28px, 3vw, 40px)
  }
}

@media(max-width:991px) {
  .ps-hero {
    padding: 54px 0
  }

  .ps-hero-grid,
  .ps-split {
    grid-template-columns: 1fr
  }

  .ps-panel {
    width: 100%;
    max-width: 100%
  }

  .ps-feature-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr))
  }

  .ps-split {
    gap: 36px
  }

  .ps-split .ps-title,
  .ps-split .ps-copy {
    max-width: 100%
  }
}

@media(max-width:767px) {
  .header .navbar { padding: 10px 15px; }
  .header .navbar-brand { max-width: calc(100% - 58px); }
  .header .navbar-brand img { max-height: 44px; width: auto; }
  .header .navbar-collapse { padding-top: 10px; }
  .header .navbar-nav .nav-link { padding: 9px 0; }

  .ps-wrap {
    width: calc(100% - 30px)
  }

  .ps-hero {
    padding: 44px 0
  }

  .ps-hero h1 {
    font-size: clamp(29px, 8vw, 36px);
    line-height: 1.14
  }

  .ps-hero p {
    font-size: 16px;
    line-height: 1.65
  }

  .ps-kicker {
    max-width: 100%;
    font-size: 10px;
    line-height: 1.4;
    white-space: normal
  }

  .ps-section {
    padding: 50px 0
  }

  .ps-title {
    font-size: 28px
  }

  .ps-copy {
    font-size: 15.5px
  }

  .ps-feature-grid {
    grid-template-columns: 1fr;
    margin-top: 28px
  }

  .ps-benefits {
    grid-template-columns: 1fr
  }

  .ps-card {
    padding: 21px
  }

  .ps-industries {
    gap: 8px
  }

  .ps-industries span {
    padding: 9px 13px;
    font-size: 13px
  }

  .ps-cta {
    padding-bottom: 28px
  }

  .ps-cta-box {
    padding: 30px 20px
  }

  .ps-cta-box h2 {
    font-size: 26px;
    line-height: 1.25;
    white-space: normal
  }
}

@media(max-width:479px) {
  .ps-wrap {
    width: calc(100% - 22px)
  }

  .ps-hero {
    padding: 36px 0
  }

  .ps-hero-grid {
    gap: 25px
  }

  .ps-hero h1 {
    font-size: 28px
  }

  .ps-panel {
    padding: 16px;
    border-radius: 18px
  }

  .ps-panel-head {
    font-size: 14px
  }

  .ps-panel-item {
    gap: 8px;
    font-size: 12px
  }

  .ps-panel-item b {
    font-size: 9px
  }

  .ps-card {
    grid-template-columns: 42px minmax(0, 1fr);
    column-gap: 12px;
    padding: 18px
  }

  .ps-icon {
    width: 42px;
    height: 42px;
    font-size: 17px
  }

  .ps-card h3 {
    font-size: 16px
  }

  .ps-card p {
    font-size: 15px;
    line-height: 1.65
  }

  .ps-actions {
    flex-direction: column;
    align-items: stretch
  }

  .ps-actions a {
    width: 100%
  }
}

@media (max-width: 575px) {
  .header .container-fluid { padding-left: 0; padding-right: 0; }
  .ps-panel-item { grid-template-columns: auto minmax(0, 1fr); }
  .ps-panel-item b { grid-column: 2; margin-left: 0; }
}
    
@media (max-width: 991px) {
  .ps-hero-grid { gap: 30px; }
}
@media (max-width: 767px) {
  .ps-benefit { padding: 16px; }
  .ps-section { padding: 40px 0; }
  .ps-title { font-size: clamp(24px, 5vw, 28px); }
}
@media (max-width: 479px) {
  .ps-wrap { width: calc(100% - 28px); }
  .ps-hero h1 { font-size: clamp(26px, 7.5vw, 32px); }
  .ps-cta-box { padding: 28px 16px; }
  .ps-cta-box h2 { font-size: 24px; }
  .ps-actions a { min-height: 48px; }
}
@media (prefers-reduced-motion: reduce) {
  .ps-page * { animation: none !important; transition: none !important; }
  .ps-page .ps-reveal { opacity: 1; transform: none; }
}
