/* polish.css — narrower reading column + smoother motion (Sep 9 2026)
 *
 * Deliberately conservative. It does NOT change layout structure, colours,
 * fonts or positioning. It only:
 *   1. stops long paragraphs running the full width of a wide screen
 *      (a 1400px line of text is genuinely hard to read; ~68 characters is
 *      the comfortable measure)
 *   2. makes scrolling and tapping feel smoother
 *   3. stops anything overflowing sideways on a phone
 *
 * Everything is scoped to plain text elements inside content sections, so
 * headers, hero blocks, grids, cards and nav are untouched.
 */

/* ---- 1. narrower, more readable text column ---- */
section p,
main p,
article p,
section li,
main li {
  max-width: 68ch;          /* no auto-margin: left-aligned text stays left */
}
/* centred blocks keep their centring */
section[style*="text-align:center"] p,
section[style*="text-align: center"] p,
.center p, .centered p, p.center {
  margin-left: auto;
  margin-right: auto;
}
/* never let the rule squeeze a paragraph that lives inside a narrow column */
aside p, .card p, .col p, td p, figcaption { max-width: none; }

/* ---- 2. smoother motion ---- */
html { scroll-behavior: smooth; }
body { -webkit-overflow-scrolling: touch; }
a, button, .btn, [role="button"] {
  transition: background-color .16s ease, color .16s ease,
              border-color .16s ease, transform .16s ease, opacity .16s ease;
}
a:active, button:active, .btn:active { transform: translateY(1px); }
* { -webkit-tap-highlight-color: rgba(201,163,93,.18); }

/* respect people who ask their device for less motion */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* ---- 3. nothing overflows sideways ---- */
img, video, iframe, table, pre { max-width: 100%; }
img, video { height: auto; }
body { overflow-x: hidden; }
p, li, h1, h2, h3, h4, blockquote { overflow-wrap: break-word; }

/* ---- 4. a little more breathing room on phones ---- */
@media (max-width: 640px) {
  section p, main p, article p { line-height: 1.72; }
  h1, h2 { line-height: 1.15; }
}
