/* One shared content width and fluid, safe-area-aware gutters. */
:root{--page-gutter:clamp(24px,5vw,70px);--page-inset:max(var(--page-gutter),env(safe-area-inset-left),env(safe-area-inset-right));--content-width:1140px}
.wrap,.hero .wrap,header,footer{
  width:min(var(--content-width),calc(100% - var(--page-inset) * 2));
  max-width:var(--content-width);min-width:0;margin-left:auto;margin-right:auto;
}
.hero .wrap{flex-shrink:0}
.hero h1{font-size:clamp(40px,5.9vw,69px)}
.hero h1,.hero .sub,h2,.gc-head,.email{overflow-wrap:break-word}
.hero .wrap:before{left:calc(-1 * var(--page-inset));max-width:calc(100% + var(--page-inset) * 2)}
.pcard-main>* ,.spec-card,.logo-wall>*{min-width:0}
.nav{flex-wrap:wrap;justify-content:center}
.quote{padding-left:var(--page-inset);padding-right:var(--page-inset)}
.quote blockquote{max-width:var(--content-width);margin-left:auto;margin-right:auto}
/* The moving track stays full bleed; its fixed title and counter keep the gutter. */
.tl-head{left:max(var(--page-inset),calc((100% - var(--content-width))/2));right:var(--page-inset)}
.tl-head h2{white-space:normal}
.tl-count{right:max(var(--page-inset),calc((100% - var(--content-width))/2))}
@media(max-width:539px),(prefers-reduced-motion:reduce){
  .tl-pin{width:min(var(--content-width),calc(100% - var(--page-inset) * 2));margin-left:auto;margin-right:auto}
}
@media(max-width:800px){
  header{height:auto;min-height:90px;padding:15px 0}
  .hero{height:auto;min-height:calc(100svh - 90px);padding:64px 0 90px}
  .hero .sub{max-width:100%}
  .nav{row-gap:10px}
  .logo-wall img,.logo-wall img.wide{max-width:100%}
  .email{font-size:clamp(17px,4.8vw,24px)}
  footer{gap:16px;flex-wrap:wrap}
}

.pscore-photo video{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:contain;border-radius:10px;background:#241c2b}
/* Crop the bars embedded in these source films without changing the card size. */
.pscore-photo:has(#vizio-video),.pscore-photo:has(#universal-video){overflow:hidden;border-radius:10px;isolation:isolate}
#vizio-video{transform:scale(1.07);transform-origin:center;border-radius:0}
#universal-video{transform:scale(1.36);transform-origin:center;border-radius:0}

#contact h2{color:#fff}
.contact-intro{color:#fff;font:400 16px/1.8 Arial,sans-serif;max-width:680px;margin-top:30px}
@media(max-width:800px){.contact-intro{font-size:15px}}

.contact-desktop-break{display:none}
@media(min-width:1024px){.contact-desktop-break{display:initial}}
.quote-keep-together{white-space:nowrap}
.quote blockquote{text-wrap:balance}
/* Match the leadership title to the other section headings. */
.tl-head h2{font-size:52px;line-height:1.09;letter-spacing:-.035em}
@media(max-width:800px){.tl-head h2{font-size:42px}}

#lead .tl-stop .lbl,#lead .tl-stop.is-active .lbl{color:#35213e;opacity:.9;font-size:15px;line-height:1.5;font-weight:500;text-wrap:balance}
#lead .tl-stop.is-active .lbl{opacity:1}
.milestone-keep{white-space:nowrap}
@media(min-width:540px) and (prefers-reduced-motion:no-preference){#lead .tl-stop .lbl{left:-10px;right:-10px}}

/* Consistent white descriptions across all milestones. */
#lead .tl-stop .lbl,#lead .tl-stop.is-active .lbl{color:#fff;opacity:1}

.spec-card li{text-wrap:pretty}
.specialty-keep{white-space:nowrap}

/* Balance the heavier wordmarks within the client logo grid. */
.logo-wall img:is([alt="Lenovo"],[alt="Spectrum"],[alt="IMAX"],[alt="VIZIO"]){scale:.75}
