/* Shared page opening (page-hero.css): the About page layout, used by Solutions and Industries. */

.ph { padding: clamp(64px, 7vw, 104px) 0; background: #fff; color: var(--ink); }
.ph__grid { display: grid; grid-template-columns: minmax(0, 1fr); row-gap: clamp(2.5rem, 4vw, 4rem); }
.ph__copy { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 26rem); align-items: end; column-gap: clamp(2rem, 4vw, 4rem); }
.ph__copy .eyebrow { grid-column: 1 / -1; justify-self: start; margin-bottom: 1.5rem; }
.ph__copy h1 {
  margin: 0;
  color: var(--ink);
  font-size: clamp(2.6rem, 1rem + 5.6vw, 6rem);
  line-height: .98;
  letter-spacing: -.035em;
  text-wrap: balance;
}
.ph__copy h1 em { color: var(--green-700); font-style: normal; }
.ph__title { min-width: 0; }

/* Two-line titles: each line stays on one row and the type scales to the width of its column. */
.ph--2 .ph__title { container-type: inline-size; }
.ph--2 .ph__copy h1 { font-size: min(6rem, 7.4cqi); }
.ph--2 .ph__copy h1 span { display: block; white-space: nowrap; }
:lang(ar) .ph__copy h1 { line-height: 1.25; letter-spacing: 0; }
.ph__side { padding-bottom: .6rem; }

/* Industry detail pages: two-line heading sized to its column (up to 112px); the intro and buttons stay beside it. */
.ph--2[style*="--ph-chars"] .ph__copy h1 { font-size: min(7rem, calc(100cqi / (var(--ph-chars, 24) * .54))); }
@media (max-width: 640px) {
  .ph--2[style*="--ph-chars"] .ph__copy h1 { font-size: clamp(2.2rem, 10vw, 3rem); }
  .ph--2[style*="--ph-chars"] .ph__copy h1 span { white-space: normal; }
}

.ph__gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(12px, 1.5vw, 22px); }
.ph__image { min-width: 0; margin: 0; }
.ph__media { overflow: hidden; background: var(--stone-2); }
.ph__media img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; object-position: var(--pos, 50% 50%); transition: transform .6s var(--ease); }
.ph__image:hover img { transform: scale(1.04); }
.ph__media--product { background: radial-gradient(60% 70% at 50% 55%, #fff 0%, #eef3ef 60%, var(--stone-2) 100%); }
.ph__media--product img { object-fit: contain; padding: 2% 0; mix-blend-mode: multiply; }
.ph__image figcaption { display: flex; align-items: center; gap: .65rem; min-height: 2.25rem; padding-top: .55rem; color: var(--ink-3); font-size: .875rem; line-height: 1.4; transition: color .3s var(--ease); }
.ph__image:hover figcaption { color: var(--ink); }

/* Figures strip under an industry opening */
.ph-facts { background: var(--paper); border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); }
.ph-facts__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0; padding: 0; list-style: none; }
.ph-facts__list li { display: flex; flex-direction: column; gap: .35rem; padding: clamp(22px, 2.6vw, 36px) clamp(14px, 2vw, 28px); border-inline-start: 1px solid var(--rule); }
.ph-facts__list li:first-child { padding-inline-start: 0; border-inline-start: 0; }
.ph-facts__list strong { color: var(--ink); font-family: var(--f-head); font-size: clamp(1.4rem, 2.4vw, 2.2rem); font-weight: 600; letter-spacing: -.02em; line-height: 1.05; }
.ph-facts__list span { color: var(--ink-3); font-size: .9375rem; line-height: 1.45; }

@media (max-width: 900px) {
  .ph__copy { grid-template-columns: minmax(0, 1fr); }
  .ph__side { margin-top: 2rem; padding-bottom: 0; }
  .ph__gallery { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 640px) {
  .ph { padding: 48px 0; }
  .ph__grid { row-gap: 2rem; }
  .ph-facts__list { grid-template-columns: 1fr; }
  .ph-facts__list li, .ph-facts__list li:first-child { padding: 18px 0; border-inline-start: 0; }
  .ph-facts__list li + li { border-top: 1px solid var(--rule); }
}
@media (prefers-reduced-motion: reduce) { .ph__media img { transition: none; transform: none !important; } }