.phpp-product .phpp-overview {
  background:#111;
  padding:72px 24px;
  border-bottom:1px solid #ffffff12
}

.phpp-product .phpp-reading {
  max-width:848px;
  margin:auto
}

.phpp-product .phpp-section-heading {
  font:var(--ph-type-section-title);
  text-transform:uppercase;
  border-left:4px solid #d90404;
  padding-left:16px;
  margin:0 0 32px
}

.phpp-product .entry-content h3 {
  font:var(--ph-type-card-title);
  color:#f5f5f5;
  margin:34px 0 18px;
  text-transform:uppercase
}

.phpp-product .entry-content p {
  color:#a6a6ad;
  margin:0 0 24px
}

.phpp-product .entry-content a {
  color:#fff;
  border-bottom:1px solid #d90404;
  text-decoration:none
}

.phpp-product .entry-content h4 {
  color:#fff
}

.phpp-product .entry-content p:last-child {
  margin-bottom:0
}

.phpp-product .ph-applications-section {
  padding:80px 24px;
  background:#080808;
  border-bottom:1px solid #ffffff12;
  scroll-margin-top:136px
}

.phpp-product .app-container {
  max-width:1232px;
  margin:auto
}

.phpp-product .app-title {
  margin-bottom:36px;
  border-bottom:1px solid #ffffff1f;
  padding-bottom:28px
}

.phpp-product .app-eyebrow {
  display:block;
  font:600 11px/1.5 var(--ph-font-body);
  color:#c8c8c8;
  letter-spacing:.18em;
  margin-bottom:10px
}

.phpp-product .app-title h2 {
  font:var(--ph-type-section-title);
  text-transform:uppercase;
  border-left:4px solid #d90404;
  padding-left:16px;
  margin:0
}

.phpp-product .application-scenes {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:22px;
  margin-bottom:48px
}

.phpp-product .app-figure {
  margin:0;
  min-width:0
}

.phpp-product .app-zoom {
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
  width:100%;
  background:#fff;
  padding:24px;
  border:1px solid #ffffff26;
  cursor:zoom-in;
  overflow:hidden
}

.phpp-product .app-zoom img {
  display:block;
  width:100%;
  height:auto;
  max-height:410px;
  object-fit:contain
}

.phpp-product .zoom-tag {
  position:absolute;
  bottom:10px;
  right:10px;
  background:#151515ed;
  color:#fff;
  padding:4px 8px;
  font:500 10px/1.5 var(--ph-font-body);
  letter-spacing:.03em;
  opacity:0;
  transition:opacity .15s
}

.phpp-product .app-zoom:hover .zoom-tag,.phpp-product .app-zoom:focus-visible .zoom-tag {
  opacity:1
}

.phpp-product .app-figure figcaption {
  padding:12px 0 0;
  font:400 12px/1.6 var(--ph-font-body);
  color:#a5a5ac;
  display:flex;
  flex-direction:column;
  gap:5px
}

.phpp-product .scene .app-zoom {
  padding:0;
  border:1px solid #ffffff1a
}

.phpp-product .scene img {
  aspect-ratio:508/277;
  object-fit:contain
}

.phpp-product .scene figcaption>span {
  color:#ededed;
  font-weight:600;
  font-size:13px
}

.phpp-product .application-row {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:64px;
  align-items:center;
  padding:38px 0;
  border-top:1px solid #ffffff1f
}

.phpp-product .application-row:first-child {
  padding-top:0;
  border:0
}

.phpp-product .application-row:last-child {
  padding-bottom:0
}

.phpp-product .app-number {
  display:block;
  color:#d90404;
  font:500 22px/1.2 var(--ph-font-display);
  margin-bottom:14px
}

.phpp-product .app-copy h3 {
  font:var(--ph-type-card-title);
  color:#f2f2f2;
  margin:0 0 16px;
  text-transform:uppercase;
  max-width:500px
}

.phpp-product .app-copy p {
  font:var(--ph-type-reading);
  color:#a6a6ad;
  margin:0;
  max-width:590px
}

.phpp-product .application-row .app-zoom {
  min-height:220px
}

.phpp-product .application-row .diagram img {
  max-height:330px
}

.phpp-product .application-feature {
  max-width:890px;
  margin:0 auto 48px
}

.phpp-product .application-feature .app-zoom {
  padding:0;
  background:transparent;
  border:0
}

.phpp-product .application-feature img {
  width:100%;
  height:auto;
  max-width:100%;
  max-height:none;
  object-fit:contain
}

.phpp-product .application-cards {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:36px;
  border-top:1px solid #ffffff20;
  padding-top:36px
}

.phpp-product .application-cards .app-copy h3 {
  font-size:23px;
  min-height:60px
}

.phpp-product .application-cards .app-copy p {
  font-size:16px
}

.phpp-product .application-package {
  display:grid;
  grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);
  gap:64px;
  align-items:start
}

.phpp-product .application-package .app-zoom {
  padding:28px
}

.phpp-product .application-package .app-zoom img {
  max-height:none
}

.phpp-product .application-media {
  display:grid;
  gap:32px
}

.phpp-product .application-references {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:36px;
  margin-bottom:40px
}

.phpp-product .application-references .app-zoom {
  height:560px
}

.phpp-product .application-references .app-zoom img {
  width:100%;
  height:100%;
  max-height:none;
  object-fit:contain
}

@media(max-width:800px){
  .phpp-product .application-package,
  .phpp-product .application-references {
    grid-template-columns:1fr;
    gap:32px
  }
  .phpp-product .application-references .app-zoom {
    height:auto
  }
  .phpp-product .application-references .app-zoom img {
    height:auto
  }
  .phpp-product .application-package .app-zoom {
    padding:16px
  }
}

.phpp-product .application-package .app-copy {
  border-bottom:1px solid #ffffff1a;
  margin-bottom:28px;
  padding-bottom:28px
}

.phpp-product .application-package .app-copy:last-child {
  border-bottom:0;
  margin:0;
  padding:0
}

.phpp-product .phpp-configuration {
  padding-top:50px;
  padding-bottom:58px
}

.phpp-product .phpp-configuration h3:first-child {
  margin-top:0
}

.phpp-product .project-enquiry-guide {
  font:400 14px/1.8 var(--ph-font-body);
  color:#a6a6ad;
  margin-top:24px
}

.phpp-product .project-retrofit-note {
  border-top:1px solid #ffffff26;
  padding-top:20px;
  margin-top:20px
}

.phpp-product .project-retrofit-note strong {
  color:#eee;
  font-weight:600
}

.phpp-product .project-retrofit-note p {
  margin-top:8px
}

.phpp-product .project-drawings-help {
  font:400 12px/1.7 var(--ph-font-body);
  color:#aaa;
  margin:8px 0 18px
}

.phpp-product #applications,.phpp-product #project-faq,.phpp-product #product-inquiry {
  scroll-margin-top:112px
}

.phpp-lightbox {
  background:#101010;
  color:#eee;
  border:1px solid #444;
  padding:48px 24px 22px;
  max-width:min(1200px,94vw);
  max-height:94vh;
  margin:auto
}

.phpp-lightbox::backdrop {
  background:#000d
}

.phpp-lightbox>img {
  max-height:75vh;
  max-width:100%;
  object-fit:contain;
  display:block;
  background:white;
  margin:auto
}

.phpp-lightbox>p {
  font:var(--ph-type-caption);
  margin:16px 0 0;
  color:#bbb
}

.phpp-lightbox-close {
  position:absolute;
  right:12px;
  top:6px;
  width:36px;
  height:36px;
  color:white;
  font-size:30px;
  background:none;
  border:0;
  cursor:pointer
}

.phpp-product .app-zoom:focus-visible,.phpp-lightbox-close:focus-visible {
  outline:2px solid #d90404;
  outline-offset:4px
}

@media(max-width:900px){

.phpp-product .application-row {
  gap:30px
}

.phpp-product .application-cards {
  gap:22px
}
}

@media(max-width:650px){

.phpp-product .phpp-overview {
  padding:44px 20px
}

.phpp-product .ph-applications-section {
  padding:48px 20px
}

.phpp-product .application-scenes {
  grid-template-columns:1fr;
  gap:24px;
  max-width:508px;
  margin-bottom:34px
}

.phpp-product .application-row,.phpp-product .application-cards {
  grid-template-columns:1fr;
  gap:24px
}

.phpp-product .application-row {
  padding:30px 0
}

.phpp-product .application-cards {
  padding-top:30px
}

.phpp-product .application-cards .app-copy {
  padding-bottom:26px;
  border-bottom:1px solid #ffffff1c
}

.phpp-product .application-cards .app-copy:last-child {
  border:0;
  padding:0
}

.phpp-product .application-cards .app-copy h3 {
  min-height:0
}

.phpp-product .app-zoom {
  padding:18px
}

.phpp-product .application-row .app-zoom {
  min-height:160px
}

.phpp-product .app-copy p {
  font-size:16px
}

.phpp-product .app-copy h3 {
  font-size:24px
}

.phpp-product .app-title {
  margin-bottom:28px;
  padding-bottom:24px
}

.phpp-product .application-feature {
  margin-bottom:30px
}

.phpp-product .ph-product-title h1 {
  overflow-wrap:break-word
}

.phpp-lightbox {
  padding:44px 12px 16px
}
}

.phpp-product .entry-content ul {
  list-style:disc;
  margin:0 0 24px 24px;
  color:#a6a6ad
}

.phpp-product .entry-content li {
  margin-bottom:8px
}

.phpp-product .entry-content strong {
  color:#fff
}/* Shared project-product FAQ. Content and paragraph breaks remain CMS-managed. */

.phpp-product .project-faq {
  padding:72px 24px 80px;
  background:#080808;
  scroll-margin-top:112px
}

.phpp-product .project-faq-layout {
  display:block;
  max-width:1120px
}

.phpp-product .project-faq-heading {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:32px;
  align-items:center;
  padding:0 0 32px;
  margin-bottom:32px
}

.phpp-product .project-faq-heading h2 {
  font:var(--ph-type-section-title);
  text-transform:uppercase;
  margin:0;
  color:#f2f2f2
}

.phpp-product .project-faq-heading>p {
  justify-self:end;
  max-width:400px;
  font:var(--ph-type-body);
  color:#aaaab2;
  margin:0
}

.phpp-product .project-faq-group+.project-faq-group {
  margin-top:36px
}

.phpp-product .project-faq-group-title {
  margin:0 0 16px;
  padding:0;
  font:600 18px/1.5 var(--ph-font-body);
  color:#bdbdc6;
  text-transform:none;
  letter-spacing:0
}

.phpp-product .project-faq-grid {
  display:grid;
  grid-template-columns:1fr;
  gap:8px
}

.phpp-product .project-faq-item {
  padding:0;
  background:#111;
  border:1px solid transparent;
  border-radius:6px;
  transition:background .15s,border-color .15s
}

.phpp-product .project-faq-item:hover {
  background:#171717;
  border-color:#ffffff14
}

.phpp-product .project-faq-item[open] {
  background:#161616;
  border-color:#ffffff20
}

.phpp-product .project-faq-item summary {
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:66px;
  padding:17px 24px;
  gap:24px;
  list-style:none;
  cursor:pointer;
  border-radius:6px
}

.phpp-product .project-faq-item summary::-webkit-details-marker {
  display:none
}

.phpp-product .project-faq-question {
  font:var(--ph-type-body);
  font-weight:600;
  color:#eeeef0;
  transition:color .15s
}

.phpp-product .project-faq-item summary:hover .project-faq-question {
  color:#fff
}

.phpp-product .project-faq-item summary:focus-visible {
  outline:2px solid #bdbdc6;
  outline-offset:3px
}

.phpp-product .project-faq-toggle {
  width:28px;
  height:28px;
  position:relative;
  flex:0 0 28px;
  color:#bcbcc3
}

.phpp-product .project-faq-toggle::before,.phpp-product .project-faq-toggle::after {
  content:"";
  position:absolute;
  background:currentColor;
  inset:12px 7px auto;
  height:1px
}

.phpp-product .project-faq-toggle::after {
  transform:rotate(90deg);
  transition:transform .15s
}

.phpp-product .project-faq-item[open] .project-faq-toggle {
  color:#f0f0f2
}

.phpp-product .project-faq-item[open] .project-faq-toggle::after {
  transform:rotate(0)
}

.phpp-product .project-faq-answer {
  max-width:850px;
  padding:0 0 0 20px;
  margin:0 76px 24px 24px;
  font:var(--ph-type-reading);
  color:#b5b5be
}

.phpp-product .project-faq-answer p {
  margin:0
}

.phpp-product .project-faq-answer p+p {
  margin-top:14px
}

@media(max-width:650px){

.phpp-product .project-faq {
  padding:48px 20px
}

.phpp-product .project-faq-heading {
  grid-template-columns:1fr;
  gap:16px;
  padding-bottom:24px;
  margin-bottom:28px
}

.phpp-product .project-faq-heading>p {
  justify-self:start
}

.phpp-product .project-faq-group+.project-faq-group {
  margin-top:30px
}

.phpp-product .project-faq-group-title {
  margin-bottom:14px
}

.phpp-product .project-faq-item summary {
  padding:16px;
  gap:16px;
  align-items:flex-start
}

.phpp-product .project-faq-toggle {
  margin-top:1px
}

.phpp-product .project-faq-answer {
  margin:0 20px 22px 16px;
  padding-left:14px
}
}

@media(prefers-reduced-motion:reduce){

.phpp-product .project-faq-item,.phpp-product .project-faq-toggle::after {
  transition:none
}
}

.phpp-product .ph-quote-form {
  align-self: center;
  width: 100%;
  padding: 40px;
}

.phpp-product .ph-inquiry-copy {
  padding: 36px;
}

.phpp-product .ph-inquiry-heading h2 {
  margin-top: 0;
}

.phpp-product .project-enquiry-guide > p {
  margin: 0;
}

.phpp-product .project-retrofit-note p:last-child {
  color: #92929c;
  font: var(--ph-type-caption);
  margin-top: 12px;
}

@media (min-width: 768px) and (max-width: 1023px) {

.phpp-product .ph-inquiry-copy,
  .phpp-product .ph-quote-form {
  padding: 28px;
}
}

@media (max-width: 767px) {

.phpp-product .ph-inquiry-copy,
  .phpp-product .ph-quote-form {
  padding: 24px;
}

.phpp-product .ph-quote-form {
  align-self: stretch;
}
}
