/* Deliberate changes on top of styles.css and care.css, which stay byte-identical to the approved design. */

/* Section leads run the full width of their section instead of the design's 750px, so a lead that fits on one line
   stays on one line rather than wrapping with room to spare. */
.section-title p { max-width: none; }

/* Japanese text breaks between any two characters, so a block can end on a lone 「す。」. pretty moves one more
   character down and leaves the other lines full width; balance would shorten every line of the block. */
main :is(p, li, dd, dt, td, th, summary, small, figcaption, h1, h2, h3) { text-wrap: pretty; }

/* In the two-column layout a regenerative medicine card takes its row's height, but the design's link only covers its own
   content: beside a card with a two-line name, the hover colour and the click area stop short of the card's bottom edge.
   The 680px layout has one card per row, and the design's display: block there must stay. */
@media (min-width: 681px) {
  .regenerative-menu li { display: flex; }
  .regenerative-detail-link { flex: 1; }
}

/* The care menu's 美容注射 card leads to its own page; the other cards open details. The design sets its arrow in 18px
   type, which the label's line-height of 1.9 turns into a footer row 11px taller than a ▶ summary: beside another card
   it ended lower, its label sitting below the neighbour's. Below 681px the other cards' footers also start 3px closer. */
.care-menu-more > span { line-height: 1; }

@media (max-width: 680px) {
  .care-menu-more { margin-top: 18px; }
}

/* On the done step the design gets the space above 受付後の流れ from its 「確認用」 note, which the production copy drops. */
.success h3 { margin-top: 24px; }

/* Logged-in users get the admin bar fixed at the top of the window, over the sticky header and anchor targets. */
.admin-bar .site-header { top: 32px; }
html:has(body.admin-bar) { scroll-padding-top: 167px; }

@media screen and (max-width: 782px) {
  .admin-bar .site-header { top: 46px; }
  html:has(body.admin-bar) { scroll-padding-top: 181px; }
}

/* Below 601px WordPress stops fixing the admin bar; it scrolls away with the page. */
@media screen and (max-width: 600px) {
  .admin-bar .site-header { top: 0; }
  html:has(body.admin-bar) { scroll-padding-top: 135px; }
}
