@supports not (width:max(1px,2px)){
  @media(max-width:1180px){h1{font-size:68px}}
  .site-header{padding:0 5%}
  h1{font-size:84px}
  .section{padding:120px 5%}
  .intro-grid h2,.section-heading h2,.growth-intro h2,.principle-grid h2{font-size:72px}
  .contact h2{font-size:96px}
  .contact-email{font:600 48px 'Barlow Condensed'}
  footer{padding:45px 5%}
  .position h2{font-size:80px}
  .leadership blockquote{font:500 70px/1.08 'Barlow Condensed'}
  .hero::after,
.section::after,
.cover::after,
.page::after{right:80px}
  .hero{grid-template-columns:1.1fr .9fr}
  .statements.tabbed h3{font-size:44px}
  .faq-grid h2{font-size:72px}
  .ccard a{font:600 30px/1.1 'Barlow Condensed'}
  @media(max-width:900px){.hero{grid-template-columns:1fr}}
  @media(max-width:560px){h1{font-size:40px}}
  .page-hero h1{font-size:80px}
  .acc-items{grid-template-columns:repeat(2,1fr)}
  .pf-cover h1{font-size:80px}
  .pf-toc{padding:10px 5%}
  @media(max-width:560px){.pf-cover h1{font-size:40px}}
  .pg-head h2{font-size:48px}
}
/* ---------- Browsers without CSS Grid (e.g. Chrome < 57) ---------- */
@supports not (display:grid){
  *,*::before,*::after{box-sizing:border-box}
  /* Two-part blocks */
  .hero,.intro-grid,.section-heading,.growth-intro,.principle-grid,.position-grid,.faq-grid,.pf-two,.q-wrap,.pf-vm,.vm,.pf-cover,.mission-strip,.later-capability,.phase-panel{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-start}
  .section-heading{align-items:flex-end}
  .hero>*{width:52%}.hero>.hero-art{width:42%}
  .intro-grid>*,.section-heading>*,.growth-intro>*,.principle-grid>*,.position-grid>*,.faq-grid>*,.pf-two>*,.q-wrap>*,.pf-vm>*,.vm>*{width:48%}
  .pf-cover>.pf-cover-in{width:58%}.pf-cover>.pf-facts{width:38%}
  .mission-strip>span{width:120px}.mission-strip>p{flex:1}
  .later-capability>span{width:140px}.later-capability>h3{width:260px}.later-capability>p{flex:1}
  .phase-panel>h3{width:200px}.phase-panel>p{flex:1;margin:0 30px}
  .pf-facts{display:block}.pf-facts>div{border-bottom:1px solid var(--line)}
  .statements{display:block}
  /* Equal-column rows */
  .facts,.goals,.why-grid,.partner-grid,.audience-grid,.steps,.pf-steps,.steps-ar,.framework-grid,.contact-cards,.milestones,.phase-tabs,.pf-phases,.pf-principles,.phases,.cards,.pf-groups,.pf-scope,.pf-gates,.library-grid,.context-strip,.cat-panel ul,.acc-items,.fgrid{display:flex;flex-wrap:wrap;margin-right:-12px}
  .facts>*,.goals>*,.why-grid>*,.partner-grid>*,.audience-grid>*,.steps>*,.pf-steps>*,.steps-ar>*,.framework-grid>*,.contact-cards>*,.milestones>*,.phase-tabs>*,.pf-phases>*,.pf-principles>*,.phases>*,.cards>*,.pf-groups>*,.pf-scope>*,.pf-gates>*,.library-grid>*,.context-strip>*,.cat-panel ul>*,.acc-items>*,.fgrid>*{margin:0 12px 12px 0}
  .facts>*,.goals>*,.why-grid>*,.partner-grid>*,.audience-grid.four>*,.audience-grid>*,.steps>*,.pf-steps>*,.steps-ar>*,.framework-grid>*,.contact-cards.four>*{width:calc(25% - 12px)}
  .audience-grid.five>*,.phase-tabs>*,.pf-phases>*,.pf-principles>*,.phases.five>*,.milestones>*{width:calc(20% - 12px)}
  .milestones.six>*{width:calc(16.666% - 12px)}
  .cards>*,.pf-groups>*,.pf-scope>*,.pf-gates>*,.library-grid>*,.context-strip>*,.cat-panel ul>*,.contact-cards>*{width:calc(33.333% - 12px)}
  .contact-cards.four>*{width:calc(25% - 12px)}
  .acc-items>*,.fgrid>*{width:calc(50% - 12px)}
  .fgrid>.full{width:calc(100% - 12px)}
  .facts{margin:0 auto}.facts>*{margin:0;width:25%}
  .audience-grid,.partner-grid,.framework-grid,.library-grid{background:none;border:0}
  .audience-grid>*,.partner-grid>*,.framework-grid>*,.library-grid>*{border:1px solid var(--line)}
  .audience-grid.wide,.audience-grid article.wide{width:calc(100% - 12px)}
  /* Rows built on grid tracks */
  .accordion h3 button{display:flex;align-items:center}
  .accordion h3 button>b{width:70px;flex:none}.accordion .t{flex:1}.accordion .pill{margin:0 20px}
  .pi{display:flex;justify-content:space-between}.pi-main{flex:1;padding-right:24px}.pi-side{width:280px;flex:none}
  .q-list li{display:flex;align-items:center}.q-list li .q-name{flex:1}.q-list li .q-qty{width:84px;margin:0 10px}
  .pg-head{display:flex}.pg-head>b{width:60px;flex:none}
  .principle-grid li{display:flex}.principle-grid li>b{width:45px;flex:none}
  .offer-list article{display:flex}
  .site-footer,footer{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center}
  .site-footer>*{margin:6px 12px}
  /* Centred badges that used grid centring */
  .hero-art{display:flex;align-items:center;justify-content:center}
  .core{display:flex;flex-direction:column;align-items:center;justify-content:center}
  .milestones li::before,.goals li::before,.pf-steps li::before,.steps-ar li::before{display:block;text-align:center;line-height:30px}
  .mini-steps b,.quote-pill b,.steps [role=tab] b,.q-list-box h3 span,.checks li::before{display:inline-block;text-align:center;line-height:24px}
  @media(max-width:1050px){
    .facts>*,.goals>*,.why-grid>*,.partner-grid>*,.audience-grid>*,.steps>*,.pf-steps>*,.steps-ar>*,.framework-grid>*,.contact-cards>*,.milestones>*,.milestones.six>*,.phase-tabs>*,.pf-phases>*,.pf-principles>*,.phases>*,.cards>*,.pf-groups>*,.pf-scope>*,.pf-gates>*,.library-grid>*,.audience-grid.five>*,.contact-cards.four>*{width:calc(50% - 12px)}
    .pf-cover>*,.pf-two>*,.q-wrap>*{width:100%!important}
    .facts>*{width:50%}
  }
  @media(max-width:900px){
    .hero>*,.hero>.hero-art,.intro-grid>*,.section-heading>*,.growth-intro>*,.principle-grid>*,.position-grid>*,.faq-grid>*,.pf-vm>*,.vm>*{width:100%}
    .pi{display:block}.pi-main{padding-right:0}.pi-side{width:auto;margin-top:10px}
    .cat-panel ul>*{width:calc(50% - 12px)}
  }
  @media(max-width:560px){
    .goals>*,.why-grid>*,.partner-grid>*,.audience-grid>*,.steps>*,.pf-steps>*,.steps-ar>*,.framework-grid>*,.contact-cards>*,.milestones>*,.milestones.six>*,.phase-tabs>*,.pf-phases>*,.pf-principles>*,.phases>*,.cards>*,.pf-groups>*,.pf-scope>*,.pf-gates>*,.library-grid>*,.context-strip>*,.cat-panel ul>*,.acc-items>*,.fgrid>*,.audience-grid.five>*,.contact-cards.four>*{width:calc(100% - 12px)}
    .facts>*{width:100%}
  }
}

/* ---------- Browsers without aspect-ratio (Chrome < 88) ---------- */
@supports not (aspect-ratio:1/1){
  .hero>.hero-art,.hero-art{width:34vw;height:34vw;max-width:520px;max-height:520px;min-height:0;flex:none}
  .core{width:31%;height:auto;padding:0}
  .hero-art .core{width:150px;height:150px}
  .hero-art .orbit-a{left:12%;top:12%}.hero-art .orbit-b{left:24%;top:24%}.hero-art .art-note{left:20%}
  @media(max-width:900px){.hero>.hero-art,.hero-art{width:86vw;height:86vw;max-width:540px;max-height:540px}.hero-art .core{width:120px;height:120px}}
  .library-grid a{min-height:290px}
}

/* ---------- Browsers without flexbox gap (Chrome < 84); class set by an inline test ---------- */
.no-flexgap .topbar-links>*+*{margin-left:22px}
.no-flexgap nav>*+*{margin-left:22px}
.no-flexgap .brand>*+*{margin-left:12px}
.no-flexgap .actions>*+*,.no-flexgap .cta-band>*+*{margin-left:12px}
.no-flexgap .cta-band>*{margin-bottom:12px}
.no-flexgap .hero-call>*{margin-right:18px;margin-bottom:8px}
.no-flexgap .tablist>*,.no-flexgap .chips>*{margin:0 8px 8px 0}
.no-flexgap .status-banner .dot{margin-right:14px}
.no-flexgap .cat-panel li::before{margin-right:10px}
.no-flexgap .steps [role=tab] b{margin-right:12px}
.no-flexgap .ccard>*+*,.no-flexgap .partner-grid a>*+*{margin-top:8px}
.no-flexgap .factions>*{margin:0 12px 12px 0}
.no-flexgap .fcontact>*{margin:0 11px 6px}
.no-flexgap .flinks>*{margin:0 10px 8px}
.no-flexgap .crumbs li{margin-right:6px}
.no-flexgap .mini-steps li{margin:0 24px 10px 0}
.no-flexgap .mini-steps b{margin-right:10px}
.no-flexgap .pf-tools-in>*+*{margin-left:12px}
.no-flexgap .quote-pill b{margin-left:8px}
.no-flexgap .pi-side>*{margin:0 0 6px 6px}
.no-flexgap .wa-fab svg,.no-flexgap .call-fab svg{margin-right:8px}
.no-flexgap .q-bar>*+*{margin-left:18px}
.no-flexgap .pf-toc>*{margin-right:6px}
.no-flexgap .phase-tabs [role=tab]>*{margin-bottom:8px}
.no-flexgap .map-line>*{margin:0 12px}
.no-flexgap .fgrid label>input,.no-flexgap .fgrid label>select,.no-flexgap .fgrid label>textarea{margin-top:6px}
.no-flexgap .footer>*{margin-right:20px}
.no-flexgap .hero-call span{margin-right:18px}
@media(max-width:900px){.no-flexgap nav>*+*{margin-left:0}}
@media(max-width:1180px){.no-flexgap nav>*+*{margin-left:16px}}
@media(max-width:900px){.no-flexgap nav>*+*{margin-left:0}}
.no-flexgap .section-label span{margin-right:12px}.no-flexgap .pf-facts dt{display:block}
