/* Sticky biography photo needs viewport scrolling, not an overflow ancestor. */
@media (min-width: 901px) {
  html, body { overflow-x: clip; }
  #janis .about { align-items: start; }
  #janis .about .portrait {
    position: sticky;
    top: 25px;
    align-self: start;
  }
}

/* Keep the layout repair separate from the optional mobile type-size trial. */
@media (max-width: 900px) {
  #janis .about {
    grid-template-columns: minmax(0, 1fr);
    gap: 32px;
    align-items: start;
  }
  #janis .about .portrait {
    position: static;
    width: calc(100% - 10px);
    max-width: 420px;
    margin: 0 auto 10px !important;
  }
  #janis .bio-content {
    min-width: 0;
    width: 100%;
  }
}

/* Mobile trial: +1 CSS pixel per text size; desktop remains unchanged.
   Remove this media block to undo only the typography trial. */
@media (max-width: 600px) {
  body { font-size: 17px; }
  .kicker, .jt-yt-fallback { font-size: 12px; }
  .brand { font-size: 24px !important; }
  .mast small { font-size: 12px; }
  .mast a.toplink, .btn, .hero-facts, .footer,
  .about .credentials, .floating, .dev-notice,
  .jt-test .jt-eyebrow, .jt-shot-card figcaption { font-size: 13px; }
  .hero .hero-content h1 {
    font-size: calc(clamp(41px, 4.2vw, 66px) + 1px) !important;
  }
  .hero .hero-content h1 em, .hero .hero-content h1 i {
    font-size: calc(clamp(41px, 4.2vw, 66px) * 1.36 + 1px) !important;
  }
  .hero .lead { font-size: 17px !important; }
  .intro p { font-size: 19px; }
  .section h2, .middle h2, .closing h2 {
    font-size: calc(clamp(30px, 8vw, 43px) + 1px) !important;
  }
  .statement h2 {
    font-size: calc(clamp(32px, 4vw, 59px) + 1px) !important;
  }
  .statement h2 em {
    font-size: calc(clamp(32px, 4vw, 59px) * 1.45 + 1px) !important;
  }
  .middle h2 em, .closing h2 em {
    font-size: calc(clamp(30px, 8vw, 43px) * 1.45 + 1px) !important;
  }
  #dolores .pain h3, #metodo .point h3 { font-size: 18px !important; }
  #dolores .pain p, #metodo .point p { font-size: 15px !important; }
  #metodo .point .num { font-size: 12px !important; }
  .pain-end { font-size: 18px; }
  .step .step-num { font-size: 56px !important; }
  .step .tag { font-size: 11px; }
  .step h3 { font-size: 30px !important; }
  .step .promise, .step .body p { font-size: 16px; }
  .pricing .split, .faq p { font-size: 15px; }
  .what li { font-size: 15px; }
  .bio-list li { font-size: 14px; }
  #camino .center > .soft { font-size: 14px !important; }
  .pricing strong { font-size: 35px !important; }
  .pricing small { font-size: calc(16px * 5 / 6 + 1px); }
  .pricing .or { font-size: 13px; }
  .step .body .note { font-size: 16px; }
  .bio-content .bio-lead {
    font-size: calc(clamp(20px, 2.3vw, 27px) + 1px) !important;
  }
  .jt-test h2 {
    font-size: calc(clamp(35px, 10vw, 52px) + 1px);
  }
  .jt-test p { font-size: 18px; }
}
