/* Site upgrade 2026-09-22 · homepage additions. Loaded last on the homepage.
   1. Phone reading bar: both actions fit (the chapter dashes pushed "Book a review" off-screen at 360–430px).
   2. Hero: one quiet line that routes non-referral visitors to their row.
   3. "Which row is yours?": the six booth rows, each with its page and published price.
   4. Footer contact line. */

/* ---- 1. reading bar on phones */
@media (max-width: 600px) {
  .reading-bar .chapter-links { display: none; }
  .reading-bar { justify-content: space-between; padding: 0 16px; }
  .reading-bar .skip-demo { margin-left: 0; margin-right: 0; }
  .reading-bar .skip-story { font-size: 13px; }
}

/* ---- 2. hero routing line */
.first .also-for { margin: 10px 0 0; font: 400 13px/1.6 var(--sans); color: var(--muted, #526370); max-width: 470px; }
.first .also-for a { color: var(--navy, #0f2538); border-bottom: 1px solid #0f253855; padding-bottom: 1px; white-space: nowrap; }
.first .also-for a:hover { border-bottom-color: currentColor; }
@media (max-width: 767px) and (max-height: 740px) { .first .also-for { font-size: 12px; margin-top: 8px; } }

/* ---- 3. which row is yours */
.row-doors { position: relative; z-index: 6; background: var(--paper, #f7f3ec); color: var(--navy, #0f2538); border-top: 1px solid #0f25381a; padding: 96px 5.4vw 104px; scroll-margin-top: 84px; }
.row-doors-inner { max-width: 1180px; margin: 0 auto; }
.row-doors .eyebrow { font: 500 14px/1.5 var(--sans); color: var(--leaf, #3d6b53); margin: 0 0 18px; }
.row-doors h2 { font: 300 clamp(44px, 4.6vw, 74px)/1.02 var(--serif); letter-spacing: -.03em; margin: 0 0 18px; }
.row-doors h2 em { font-weight: 400; color: var(--leaf, #3d6b53); }
.row-doors-lede { font: 400 16px/1.75 var(--sans); max-width: 520px; margin: 0 0 48px; opacity: .87; }
.row-doors-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid #0f253826; }
.row-doors-list li { border-bottom: 1px solid #0f253826; border-right: 1px solid #0f253826; }
.row-doors-list li:nth-child(3n) { border-right: 0; }
.row-door { position: relative; display: flex; flex-direction: column; gap: 8px; height: 100%; padding: 28px 44px 30px 28px; color: inherit; text-decoration: none; transition: background .2s; }
.row-door:hover { background: #0f253806; }
.row-door:focus-visible { outline: 2px solid var(--gold, #b8893a); outline-offset: -4px; }
.row-door-n { font: 400 11px/1 var(--mono); letter-spacing: .12em; color: var(--muted, #526370); }
.row-door-role { font: 400 30px/1.1 var(--serif); letter-spacing: -.01em; margin-top: 6px; }
.row-door-who { font: 400 13px/1.55 var(--sans); color: var(--muted, #526370); }
.row-door-what { font: 400 15px/1.6 var(--sans); margin-top: 6px; flex: 1; }
.row-door-price { font: 500 13px/1.5 var(--sans); color: var(--leaf, #3d6b53); margin-top: 10px; }
.row-door-go { position: absolute; right: 26px; top: 28px; font: 400 18px/1 var(--sans); color: var(--leaf, #3d6b53); transition: transform .2s; }
.row-door:hover .row-door-go { transform: translateX(4px); }
.row-doors-note { font: 400 13px/1.6 var(--sans); color: var(--muted, #526370); margin: 26px 0 0; }
.row-doors-note a { color: var(--navy, #0f2538); border-bottom: 1px solid #0f253855; }
@media (max-width: 1023px) {
  .row-doors-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .row-doors-list li:nth-child(3n) { border-right: 1px solid #0f253826; }
  .row-doors-list li:nth-child(2n) { border-right: 0; }
}
@media (max-width: 640px) {
  .row-doors { padding: 64px 20px 72px; }
  .row-doors-lede { margin-bottom: 32px; font-size: 15px; }
  .row-doors-list { grid-template-columns: 1fr; }
  .row-doors-list li, .row-doors-list li:nth-child(3n) { border-right: 0; }
  .row-door { padding: 22px 40px 24px 0; }
  .row-door-go { right: 4px; top: 22px; }
  .row-door-role { font-size: 27px; }
}
@media (prefers-reduced-motion: reduce) { .row-door, .row-door-go { transition: none; } }

/* ---- 4. footer contact line */
.site-footer .footer-contact { font: 400 13px/1.7 var(--sans); color: var(--muted, #526370); margin: 14px 0 0; }
.site-footer .footer-contact a { color: var(--navy, #0f2538); }
.site-footer .footer-bottom nav a { color: var(--muted, #526370); }