/* About + Careers: the home stylesheet (home.css) does the header, CTA and footer; this is just the short page above them */
.pg{max-width:1100px;margin:0 auto;padding:196px 32px 128px}
.pg-eye{font-family:var(--f-display);font-size:18px;line-height:1;letter-spacing:-0.54px;color:var(--stone-3)}
.pg-h1{margin-top:22px;font-family:var(--f-display);font-size:clamp(46px,6vw,80px);line-height:.9;letter-spacing:-0.03em;color:var(--ink-2)}
.pg-lede{margin-top:30px;max-width:520px;font-size:19px;line-height:1.4;letter-spacing:-0.38px;color:var(--stone)}
.pg-row{display:grid;grid-template-columns:5fr 7fr;gap:48px;margin-top:112px;padding-top:26px;border-top:1px solid rgba(27,27,31,.1)}
.pg-row h2{font-family:var(--f-display);font-size:30px;line-height:1;letter-spacing:-0.6px;color:var(--ink-2)}
.pg-copy p{font-size:17px;line-height:1.45;letter-spacing:-0.3px;color:var(--stone)}
.pg-copy p+p{margin-top:16px}
.team{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.team img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 28%;border-radius:var(--r);background:#EFE8D8}
.team h3{margin-top:16px;font-family:var(--f-display);font-size:22px;line-height:1.1;letter-spacing:-0.44px;color:var(--ink-2)}
.team p{margin-top:4px;font-size:15px;color:var(--stone-3)}
.roles{list-style:none;margin:-14px 0 0;padding:0}
.roles a{display:grid;grid-template-columns:1fr auto 14px;align-items:center;gap:20px;padding:20px 0;border-bottom:1px solid rgba(27,27,31,.1);transition:padding .45s var(--ease)}
.roles a:hover{padding-left:6px}
.roles b{font-weight:400;font-family:var(--f-display);font-size:22px;letter-spacing:-0.44px;color:var(--ink-2)}
.roles span{font-size:15px;color:var(--stone-3)}
.roles i{width:8px;height:8px;border-top:1.5px solid currentColor;border-right:1.5px solid currentColor;transform:rotate(45deg);opacity:.4}
.pg-note{margin-top:24px}
.ph{background:#FFF1A8;color:#5c4a00;border-radius:4px;padding:0 4px;font-size:.85em}
.end{margin-top:0}
@media (max-width:820px){
  .pg{padding:128px 20px 72px}
  .pg-eye{font-size:15px}
  .pg-h1{font-size:44px;margin-top:16px}
  .pg-lede{font-size:17px;margin-top:22px}
  .pg-row{grid-template-columns:1fr;gap:18px;margin-top:64px;padding-top:20px}
  .pg-row h2{font-size:26px}
  .team{gap:10px}
  .team h3{font-size:16px;margin-top:10px}
  .team p{font-size:13px}
  .roles b{font-size:19px}
  .roles a{grid-template-columns:1fr 14px;gap:4px 12px;padding:16px 0}
  .roles span{grid-row:2;font-size:13px}
  .roles i{grid-row:1/3;grid-column:2}
}
.pre .pg{visibility:hidden}   /* until the intro has set its start states (no flash of the finished page) */
/* pre-scroll header: the home page's, inverted for the white page */
.pg-hdr{position:absolute;left:0;right:0;top:26px;z-index:6}
.pg-in .logo,.pg-in .nav a,.pg-in .nav a:hover{color:var(--ink)}
.pg-in .logo small{color:#9C998D}
@media (max-width:820px){
  .pg-hdr{top:0}
  .pg-in{display:flex;justify-content:space-between;align-items:flex-start;height:auto;margin:0;padding:20px 22px 0 26px;border-radius:0;background:transparent;border-color:transparent;transform:none;opacity:1;filter:none;pointer-events:auto;transition:none}
  .pg-in .logo{margin-top:6px}
  .pg-in .logo b{font-size:26px}
  .pg-in .pill-btn{display:none}
}