/* B271 · the phone pass from the Oct 19 design review: the press logos read, the hero wash stays behind the words instead
   of cutting through them, the Ask button waits until the reader is past the hero, meta rows wrap cleanly, and Monica's
   pages carry her violet. */

/* press logos: two even rows, each logo tall enough to read */
@media (max-width:640px){
  .sx-logos .sx-in{display:flex!important;flex-wrap:wrap;justify-content:center;align-items:center;gap:20px 28px;overflow:visible;-webkit-mask-image:none;mask-image:none}
  .sx-logos img{height:26px!important;width:auto;max-width:150px;object-fit:contain}
  .px-press{gap:10px 26px}
  .px-press img{height:26px;width:auto}
}

/* the hero wash on the Lab, Scrubs and note pages: on phones a soft corner light that fades out above the text,
   never a hard diagonal through a paragraph; on laptops the diagonal ends above the Ask box */
@media (max-width:640px){
  .px-ihero::before,.px-lhero::before,.px-ahero::before{clip-path:none;max-height:none;height:100%;
    background:radial-gradient(130% 70% at 100% 0%,#9cb8ff 0%,#dfe8ff 42%,rgba(242,246,255,0) 78%);
    -webkit-mask-image:linear-gradient(180deg,#000 0,#000 45%,transparent 85%);mask-image:linear-gradient(180deg,#000 0,#000 45%,transparent 85%)}
}
@media (min-width:641px){
  .px-ihero::before{max-height:620px}
}

/* the Ask button on phones: out of the way over the hero (the script adds is-hero) and kept off the last lines */
@media (max-width:900px){
  .px-askfab.is-hero{opacity:0;pointer-events:none;transform:translateY(12px)}
  .px-askfab{min-height:46px;padding:0 16px 0 14px;font-size:14px}
  body{padding-bottom:72px}
}

/* note meta rows on phones: no separator dot left hanging at the start of a wrapped line */
@media (max-width:640px){
  .px-nmeta{gap:2px 14px}
  .px-nmeta>*+:before{content:none}
  .px-nmeta>*{white-space:nowrap}
}

/* From Scrubs to Strategy carries Monica's violet: the hero wash, the play buttons, the author card's top rule */
.px-ihero.scr::before,.px-scr .px-ahero::before,.px-scr .px-lhero::before{background:linear-gradient(100deg,#f6f3ff 0%,#ebe3fe 38%,#b9a0f6 68%,#6d28d9 100%)}
@media (max-width:640px){
  .px-ihero.scr::before,.px-scr .px-ahero::before,.px-scr .px-lhero::before{background:radial-gradient(130% 70% at 100% 0%,#c4adf8 0%,#efe8fe 42%,rgba(246,243,255,0) 78%)}
}
main:has(.px-ihero.scr) .px-play i,.px-scr .px-play i,.px-scr .px-lis-pp{background:#6d28d9}

/* the author block: a straight rule over it, not a rounded corner arc */
.px-author .px-agrid{border-radius:0}
