/* CG152 · cultureai.com's newer patterns (phone-b285.css, phone-b286.css), adapted to the Group's own system.
   1. The phone header: the logo, one quiet action and the menu, on a solid bar across the top.
   2. One phone type scale and section rhythm.
   3. Solid surfaces instead of outline boxes; on phones, stacks of cards become one divided list.
   4. The receipts read in rows on phones: number, then what it means.
   5. The Ask button stays away over the hero (fab-cg152.js), at every width.
   6. The footer's link columns start on the same line. */

/* ---------- 5 · the Ask button ---------- */
.px-askfab{transition:transform .25s cubic-bezier(.2,.7,.2,1),box-shadow .25s,bottom .25s,opacity .25s,visibility 0s linear 0s}
.px-askfab.is-hero{opacity:0;visibility:hidden;pointer-events:none;transform:translateY(12px);transition:transform .25s,opacity .2s,visibility 0s linear .2s}
@media (max-width:900px){
  .px-askfab.is-cta{opacity:0;visibility:hidden;pointer-events:none;transform:translateY(12px);transition:transform .25s,opacity .2s,visibility 0s linear .2s}
}
@media (max-width:640px){
  .px-askfab:not(.fab-ready){opacity:0!important;visibility:hidden!important;pointer-events:none!important;transition:none!important}
}
@media (prefers-reduced-motion:reduce){.px-askfab,.px-askfab.is-hero,.px-askfab.is-cta{transition:none!important;transform:none!important}}

/* ---------- 3 · solid surfaces (every width) ---------- */
.tg-acard{border:0!important;background:#f1f3f7}
.tg-acard.us{background:#eef3ff}
.tg-calc-out{border:0!important}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .tg-acard{background:var(--px-paper2)}
  :root:not([data-theme="light"]) .tg-acard.us{background:#141c2e}
}

/* ---------- 6 · the footer columns ---------- */
.px-foot.tg-foot .px-links{align-content:start}

@media (max-width:640px){

  /* ---------- 1 · the header: logo, one quiet action, menu ---------- */
  body.tg-sky-home .px-head,body.tg-home.tg-sky-home .px-head,body.tg-pg .px-head{top:0!important;left:0!important;right:0;transform:none!important;width:100%!important;
    border:0!important;border-radius:0!important;box-shadow:0 1px 0 #0a16331a!important}
  body.tg-sky-home .px-head .px-in,body.tg-pg .px-head .px-in{padding:8px 6px 8px 20px!important;min-height:60px;gap:4px}
  .px-head .px-brand img{height:24px!important;width:auto}
  .px-head .px-acts{gap:0}
  body .px-head .px-acts>.px-cta,body.tg-home .px-head .px-acts>.px-cta,body.tg-home.tg-sky-home .px-head .px-acts>.px-cta{display:inline-flex!important;align-items:center;height:44px;padding:0 12px!important;border:0!important;background:none!important;box-shadow:none!important;
    color:var(--px-ink)!important;font:500 15px/1 var(--px-sans)!important;transform:none!important}
  .px-head .px-acts>.px-cta span{display:none}
  body .px-head .px-menu summary{border:0!important;background:none!important;box-shadow:none!important}
  body.tg-home .px-head .px-menu summary span,body.tg-sky-home .px-head .px-menu summary span{background:var(--px-ink)}

  /* the heroes start under the bar, not under the old floating pill */
  body.tg-pg .tg-pghero{padding-top:108px!important}

  /* ---------- 2 · type scale and rhythm ---------- */
  #h-top{font-size:46px!important;line-height:1!important;letter-spacing:-.03em!important}
  body.tg-pg .tg-pghero h1{font-size:40px!important;line-height:1.04!important;letter-spacing:-.028em!important}
  main .px-sec h2,main .px-sechead h2,.tg-whead h2,.tg-frail h2,.tg-close h2,.tg-essay h2{font-size:30px!important;line-height:1.08!important;letter-spacing:-.025em!important}
  main .px-sec{padding-top:60px!important;padding-bottom:60px!important}
  main .px-sub,.tg-close-sub{font-size:16px!important;line-height:1.6!important}
  .tg-num{margin-bottom:18px!important}

  /* ---------- 3 · stacks of cards become one divided list ---------- */
  .tg-tiles{gap:0!important;border-top:1px solid var(--px-line);margin-top:28px!important}
  .tg-tile{background:none!important;border:0!important;border-bottom:1px solid var(--px-line)!important;border-radius:0!important;box-shadow:none!important;padding:20px 0!important;transform:none!important}
  .tg-tile h3{font-size:18px!important}

  /* ---------- 4 · the receipts: one row each ---------- */
  .tg-proof .tg-glass{display:block!important;background:none!important;border:0!important;border-radius:0!important;box-shadow:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;
    border-top:1px solid #ffffff38!important}
  .tg-proof .tg-glass>div{display:grid!important;grid-template-columns:132px minmax(0,1fr);align-items:center;gap:16px;padding:18px 0!important;text-align:left!important;
    border:0!important;border-bottom:1px solid #ffffff38!important;background:none!important}
  .tg-proof .tg-glass dt,.tg-proof .tg-glass>.lead dt{font-size:36px!important;line-height:1!important}
  .tg-proof .tg-glass dd{margin:0!important;font-size:15px!important;line-height:1.4!important;opacity:.92}
}
