/* B426 · layout fixes from the Nov 3 audit (P1), one file on every page. */

/* Phone header: the logo stays. The page title no longer folds in over it on scroll (it was truncated, and mid-scroll
   the two overlapped). */
html.sh-on.a-titled .a-ttl{opacity:0!important;visibility:hidden!important}
html.sh-on.a-titled .px-head .px-brand{opacity:1!important;transform:none!important;pointer-events:auto!important}

/* Home, The newest note: the Read link's icon and word sit apart, like Listen beside it. */
.hw-acts .hb-read,html.sh-on .hw-acts .hb-read{display:inline-flex!important;align-items:center;justify-content:center;gap:10px}

/* Every note, phone grid: the play button sits under the card's words, off the cover's own title. */
@media (max-width:600px){
  .fn-grid[data-view=grid] .fn-card:not(.fn-feat):not(.fn-nocov){grid-template-areas:"cover" "body" "play";grid-template-rows:auto auto auto}
  .fn .fn-grid[data-view=grid] .fn-card:not(.fn-feat):not(.fn-nocov) .fn-play{grid-area:play;align-self:start;justify-self:start;margin:12px 0 0;box-shadow:0 0 0 1px var(--fn-line,rgba(10,22,51,.12))}
}

/* Ask the notes (Lab, Scrubs), phone: the badge, the Navigator pill and the chapter label each get their own room. */
@media (max-width:760px){
  .hx-asktop{flex-wrap:wrap;row-gap:12px;column-gap:10px;margin-bottom:28px!important}
  .hx-asktop .cai-pill{align-self:flex-start}
}

/* /founders/, phone: the newest-episode card sits under the photo, not over its caption. */
@media (max-width:600px){
  .f3-pw .f3-air,#monica .f3-pw .f3-air{position:relative!important;left:auto!important;right:auto!important;bottom:auto!important;width:auto!important;margin:12px 0 0!important;transform:none!important}
}

/* Home, desktop: The platform tile carries a product screen (sample team), as the hvhh.ai tile beside it carries its demo. */
#products .sx-t-okr{display:flex!important;flex-direction:column}
#products .sx-t-okr .sx-pshot{margin:28px 0 24px;border-radius:14px;overflow:hidden;box-shadow:0 30px 70px -30px rgba(0,0,0,.7),0 0 0 1px rgba(255,255,255,.12)}
#products .sx-t-okr .sx-pshot img{display:block;width:100%;height:auto}
#products .sx-t-okr .sx-more{margin-top:auto}

/* Home, desktop: Writing and Founders share the same white, so the space between them is one section gap, not two. */
@media (min-width:1101px){html.px-page body main #writing+#founders{padding-top:48px!important}}
