/* Concept G v2 · page-level rules only. Each section's own styles live in parts/*.css. Classes added here are prefixed pg-. */
:root{--pg-gap:clamp(96px,11vw,168px)}
/* one section rhythm: every section after the hero opens with the same gap and closes flush */
.state{position:relative;z-index:2;padding-block:clamp(80px,10vw,150px) 0}
.vs-sec{padding-block:clamp(64px,8vw,112px) 0}
.demo{padding-block:var(--pg-gap) 0}
.tech-sec,.tech-sec + .tech-sec{padding-block:var(--pg-gap) 0}
.hero .lede,.close .lede,.pg-head .lede{text-wrap:balance}
.state h2{font-size:clamp(40px,6.8vw,104px)}
.words span{display:inline-block;opacity:.18;transition:opacity .4s}
.words span.on{opacity:1}
.state .lede{margin-top:28px}

/* section head used by the demos and the products */
.pg-head{text-align:center;display:flex;flex-direction:column;align-items:center;margin-bottom:clamp(40px,5vw,64px)}
.pg-head .lede{margin:22px auto 0;text-align:center;text-wrap:pretty}

/* products: G's cards, real <img> photos */
.pg-products{position:relative;z-index:2;padding-block:var(--pg-gap) 0}
.pg-products .prod{margin-top:0}
.pc .pg-ph{position:absolute;inset:0;z-index:-2;width:100%;height:100%;max-width:none;object-fit:cover;object-position:50% 40%;transform:scale(1.03);transition:transform 1.2s var(--ease)}
.pc:hover .pg-ph{transform:scale(1)}
.pc .pg-ph-tms{object-position:38% 55%}
.pc::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,rgba(11,43,102,.28),rgba(11,43,102,0) 40%);mix-blend-mode:multiply}
.pc::before{background:linear-gradient(0deg,rgba(2,5,15,.97) 0%,rgba(2,5,15,.82) 30%,rgba(2,5,15,.25) 62%,rgba(2,5,15,.05) 100%)}
/* the card label reads as a line of display type, not tiny caps */
.pg-tag{position:absolute;left:40px;top:32px;right:40px;font-family:var(--display);font-weight:300;font-size:clamp(22px,2.2vw,32px);line-height:1.15;letter-spacing:-.01em;color:#fff;text-shadow:0 2px 18px rgba(2,5,15,.55)}
.pg-sub{margin:20px 0 0;font-family:var(--display);font-weight:300;font-size:clamp(22px,2.2vw,32px);line-height:1.2;letter-spacing:-.01em;color:var(--blue);text-align:center;text-wrap:balance}
@media (max-width:900px){
  .pg-tag{left:28px;top:24px;right:28px}
  .pc .pg-ph{object-position:50% 30%}
  .pc .pg-ph-tms{object-position:30% 55%}
}
/* phones: the photo becomes a band at the top of the card and the copy sits below it on black */
@media (max-width:600px){
  .pc{min-height:0;padding-top:224px;background:var(--black)}
  .pc .pg-ph{height:260px;bottom:auto}
  .pc .pg-ph{object-position:50% 30%}
  .pc .pg-ph-tms{object-position:34% 60%}
  .pc::before{background:linear-gradient(180deg,rgba(2,5,15,.05) 0,rgba(2,5,15,.1) 120px,rgba(2,5,15,.92) 236px,var(--black) 262px)}
  .pg-tag{top:20px;left:24px;right:24px}
}
/* phone swipe row of industry cards: cards past the edge are revealed with the row, not one by one */
@media (max-width:640px){ .tech-cards .tech-card.reveal{opacity:1;transform:none} }
@media (prefers-reduced-motion:reduce){ .pc .pg-ph{transform:none} }
