/* ==========================================================================
   Chesterfield Wellness News
   A West County community journal. Concept: "the valley and the bluffs."
   Chesterfield lives on two elevations: the river-bottom valley (Highway 64,
   the ballfields, the retail flats behind the levee) and the bluffs above it
   (old Chesterfield on Olive Street Road, the subdivisions along Clarkson and
   Wild Horse Creek). The desk reports from both.

   Signature device: THE TERRACE. A hairline rule that steps up partway along
   its length, like the bluff line meeting the valley floor. It underlines the
   masthead, divides sections, and is the hover language on every index entry.
   The mark is a pond: two ripples and one reed, set in a round seal.

   Type:    Cormorant Garamond (display; one italic phrase per headline)
            Work Sans (reading and UI)
            Spline Sans Mono (register labels, folios, captions)
   Palette: pond-green ink on limestone canvas and warm paper, one brass
            accent reserved for the exam call-to-action and the register glyph.
   Layout:  centered newspaper masthead, sticky nav bar under it, matted
            photographs (paper mat, hairline frame), article pages with a
            sticky side rail for key takeaways.
   ========================================================================== */

:root {
  --canvas: #eef1e9;
  --canvas-2: #e6eadf;
  --paper: #fbfcf8;
  --paper-2: #f5f7f0;

  --ink: #1f2b1c;
  --ink-soft: #4e5948;
  --ink-mute: #7a8473;

  --green: #34582f;
  --green-deep: #1b2d18;
  --green-soft: #5e7d56;
  --green-wash: #e3eadc;

  --brass: #a37a27;
  --brass-deep: #7f5e1c;
  --brass-wash: #f6f0df;

  --line: #d7ddcd;
  --line-soft: #e5e9dd;
  --on-dark: #e7ecdf;
  --on-dark-mute: #a8b59f;

  --font-display: "Cormorant Garamond", "Times New Roman", Georgia, serif;
  --font-body: "Work Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "Spline Sans Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;

  --shell: 1180px;
  --read: 680px;
  --rail: 250px;
  --ease: cubic-bezier(0.3, 0.02, 0.2, 1);
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: var(--font-body);
  font-size: 17px;
  line-height: 1.64;
  color: var(--ink);
  background: var(--canvas);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

img { max-width: 100%; height: auto; display: block; }
a { color: var(--green); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--brass-deep); }
::selection { background: var(--green-wash); color: var(--ink); }
:focus-visible { outline: 2px solid var(--brass); outline-offset: 3px; }

.shell { max-width: var(--shell); margin: 0 auto; padding: 0 28px; }

h1, h2, h3, .display {
  font-family: var(--font-display);
  font-weight: 600;
  color: var(--ink);
  line-height: 1.06;
  letter-spacing: -0.012em;
  margin: 0;
}
h1 em, h2 em, h3 em, .display em {
  font-style: italic;
  font-weight: 500;
  color: var(--green-soft);
  letter-spacing: -0.005em;
}

/* ---------- Register label: mono caps with a terrace glyph ---------- */
.reg {
  font-family: var(--font-mono);
  font-size: 11.5px;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--brass-deep);
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin: 0;
}
.reg::before {
  content: "";
  width: 18px; height: 8px;
  flex: 0 0 auto;
  background: var(--brass);
  clip-path: polygon(0 100%, 45% 100%, 55% 0, 100% 0, 100% 25%, 62% 25%, 52% 100%, 0 100%);
}

/* ---------- The terrace rule (signature divider) ---------- */
.terrace {
  position: relative;
  height: 12px;
  margin: 0;
  border: 0;
}
.terrace::before, .terrace::after {
  content: "";
  position: absolute;
  height: 1px;
  background: var(--line);
}
.terrace::before { left: 0; width: 58%; bottom: 0; }
.terrace::after { left: 58%; right: 0; top: 0; }
.terrace.dark::before, .terrace.dark::after { background: rgba(255,255,255,0.16); }

/* ---------- Top strip ---------- */
.strip {
  background: var(--green-deep);
  color: var(--on-dark-mute);
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.strip .shell {
  display: flex; justify-content: space-between; gap: 16px;
  padding-top: 9px; padding-bottom: 9px;
}
.strip span b { color: var(--on-dark); font-weight: 500; }

/* ---------- Masthead ---------- */
.masthead { background: var(--paper); border-bottom: 1px solid var(--line); }
.masthead .shell {
  display: flex; flex-direction: column; align-items: center;
  padding-top: 30px; padding-bottom: 20px; text-align: center;
}
.masthead a { text-decoration: none; color: var(--ink); }
.masthead .seal { width: 56px; height: 56px; margin-bottom: 10px; }
.masthead .name {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: clamp(34px, 4.6vw, 54px);
  letter-spacing: -0.015em;
  line-height: 1;
}
.masthead .name em { font-style: italic; font-weight: 500; color: var(--green); }
.masthead .motto {
  font-family: var(--font-mono);
  font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--ink-mute); margin-top: 12px;
}
.masthead .motto b { color: var(--brass-deep); font-weight: 500; }

/* ---------- Nav bar (sticky) ---------- */
.navbar {
  position: sticky; top: 0; z-index: 40;
  background: rgba(251, 252, 248, 0.92);
  backdrop-filter: blur(8px) saturate(1.2);
  -webkit-backdrop-filter: blur(8px) saturate(1.2);
  border-bottom: 1px solid var(--line);
  border-top: 3px solid var(--green-deep);
}
.navbar .shell {
  display: flex; align-items: center; justify-content: center; gap: 6px 30px;
  flex-wrap: wrap; padding-top: 11px; padding-bottom: 11px;
}
.navbar a {
  position: relative;
  font-size: 14px; font-weight: 500; letter-spacing: 0.01em;
  color: var(--ink-soft); text-decoration: none; padding: 4px 0;
}
.navbar a::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px;
  background: var(--brass);
  transform: scaleX(0); transform-origin: left;
  transition: transform 0.25s var(--ease);
}
.navbar a:hover { color: var(--green-deep); }
.navbar a:hover::after, .navbar a[aria-current="page"]::after { transform: scaleX(1); }
.navbar a[aria-current="page"] { color: var(--green-deep); }
.navbar .call {
  color: var(--brass-deep); font-family: var(--font-mono); font-size: 12.5px; letter-spacing: 0.05em;
}

/* ---------- Buttons ---------- */
.btn {
  display: inline-flex; align-items: center; gap: 10px;
  background: var(--brass); color: #fff;
  font-family: var(--font-body); font-weight: 600; font-size: 15px;
  padding: 14px 24px; border-radius: 2px; text-decoration: none;
  box-shadow: 0 1px 0 rgba(0,0,0,0.06), 0 10px 24px -14px rgba(127, 94, 28, 0.7);
  transition: background 0.2s var(--ease), transform 0.2s var(--ease);
}
.btn:hover { background: var(--brass-deep); color: #fff; transform: translateY(-1px); }
.btn .arw { font-family: var(--font-display); font-size: 20px; line-height: 1; }
.btn.ghost {
  background: transparent; color: var(--green-deep);
  border: 1px solid var(--green-soft); box-shadow: none;
}
.btn.ghost:hover { background: var(--green-wash); color: var(--green-deep); }

/* ---------- Home hero ---------- */
.hero { background: var(--canvas); }
.hero .shell {
  display: grid; grid-template-columns: 1fr 1.02fr; gap: 48px; align-items: center;
  padding-top: 56px; padding-bottom: 60px;
}
.hero-copy .reg { margin-bottom: 22px; }
.hero-copy h1 { font-size: clamp(40px, 4.6vw, 60px); margin-bottom: 22px; text-wrap: balance; }
.hero-copy .lede { font-size: 18.5px; line-height: 1.6; color: var(--ink-soft); margin: 0 0 28px; max-width: 52ch; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.hero-meta {
  margin-top: 26px;
  font-family: var(--font-mono); font-size: 11.5px; letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--ink-mute);
}

/* ---------- Matted figure (signature photo treatment) ---------- */
.fig { margin: 0; }
.fig .mat {
  background: var(--paper); padding: 10px;
  border: 1px solid var(--line);
  box-shadow: 0 1px 2px rgba(31,43,28,0.04), 0 24px 44px -32px rgba(31,43,28,0.45);
}
.fig img { width: 100%; height: auto; }
.fig figcaption {
  margin-top: 12px;
  font-family: var(--font-display); font-style: italic; font-size: 17px; line-height: 1.4;
  color: var(--ink-soft);
}
.fig figcaption .credit {
  display: block; margin-top: 5px;
  font-family: var(--font-mono); font-style: normal; font-size: 10.5px;
  letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-mute);
}

/* ---------- Near-room band ---------- */
.nearband { background: var(--green-deep); color: var(--on-dark); }
.nearband .shell {
  display: grid; grid-template-columns: 1.3fr 1fr 1fr auto; gap: 32px; align-items: center;
  padding-top: 26px; padding-bottom: 26px;
}
.nearband .reg { color: var(--brass); }
.nearband .reg::before { background: var(--brass); }
.nearband h2 { color: #fff; font-size: 28px; margin-top: 8px; }
.nearband h2 em { color: var(--on-dark-mute); }
.nearband .cell {
  font-family: var(--font-mono); font-size: 12.5px; line-height: 1.7; color: var(--on-dark-mute);
  border-left: 1px solid rgba(255,255,255,0.14); padding-left: 22px;
}
.nearband .cell b { color: #fff; font-weight: 500; display: block; }
.nearband .cell a { color: #fff; }
.nearband .btn { white-space: nowrap; }

/* ---------- Sections ---------- */
section { padding: 74px 0; }
.section-head { max-width: 720px; margin-bottom: 40px; }
.section-head .reg { margin-bottom: 16px; }
.section-head h2 { font-size: clamp(30px, 3.6vw, 44px); }
.section-head p { color: var(--ink-soft); font-size: 17.5px; margin: 14px 0 0; }

.feature { background: var(--paper); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.feature .shell { display: grid; grid-template-columns: 1fr 1.05fr; gap: 56px; align-items: center; }
.feature-copy .reg { margin-bottom: 18px; }
.feature-copy h2 { font-size: clamp(30px, 3.4vw, 42px); margin-bottom: 18px; }
.feature-copy p { color: var(--ink-soft); margin: 0 0 14px; }
.feature-copy p:last-child { margin-bottom: 0; }
.feature.flip .feature-copy { order: 2; }

/* ---------- Edition index ---------- */
.edition { display: grid; grid-template-columns: 1fr 1fr; gap: 0 48px; }
.entry {
  display: grid; grid-template-columns: 52px 1fr; gap: 18px;
  padding: 24px 0 26px; text-decoration: none; color: var(--ink);
  border-top: 1px solid var(--line);
  position: relative;
}
.entry::after {
  content: ""; position: absolute; left: 0; top: -1px; height: 1px; width: 0;
  background: var(--brass); transition: width 0.35s var(--ease);
}
.entry:hover::after { width: 100%; }
.entry .num {
  font-family: var(--font-display); font-style: italic; font-weight: 500;
  font-size: 30px; line-height: 1; color: var(--green-soft); padding-top: 4px;
}
.entry .tag {
  font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--brass-deep); display: block; margin-bottom: 8px;
}
.entry h3 { font-size: 25px; line-height: 1.12; margin-bottom: 8px; transition: color 0.2s var(--ease); }
.entry:hover h3 { color: var(--green); }
.entry p { margin: 0; color: var(--ink-soft); font-size: 15.5px; line-height: 1.55; }
.entry.lead {
  grid-column: 1 / -1; grid-template-columns: 52px 1fr;
  background: var(--paper); border: 1px solid var(--line); border-top: 3px solid var(--green-deep);
  padding: 30px 32px 32px; margin-bottom: 8px;
}
.entry.lead h3 { font-size: 32px; }
.entry.lead p { font-size: 17px; }
.entry.lead::after { display: none; }

/* ---------- Lanes ---------- */
.lanes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px; }
.lane { border-top: 2px solid var(--green-deep); padding-top: 22px; }
.lane .tag { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--brass-deep); }
.lane h3 { font-size: 27px; margin: 10px 0 12px; }
.lane p { margin: 0; color: var(--ink-soft); font-size: 16px; }

/* ---------- Featured clinic ---------- */
.clinic {
  background: var(--paper); border: 1px solid var(--line); border-left: 5px solid var(--brass);
  padding: 44px 48px;
  display: grid; grid-template-columns: 1.1fr 1fr; gap: 48px;
}
.clinic .reg { margin-bottom: 16px; }
.clinic h2, .clinic h3.title { font-size: clamp(30px, 3.2vw, 40px); margin-bottom: 10px; }
.clinic .motto { font-family: var(--font-display); font-style: italic; font-size: 20px; color: var(--green-soft); margin: 0 0 18px; }
.clinic p { color: var(--ink-soft); margin: 0 0 14px; }
.clinic .btn { margin-top: 8px; }
.rooms-list { list-style: none; margin: 0; padding: 0; }
.rooms-list li { border-top: 1px solid var(--line-soft); padding: 16px 0; }
.rooms-list li:first-child { border-top: 0; padding-top: 0; }
.rooms-list li.near { background: var(--brass-wash); margin: 0 -14px; padding: 16px 14px; border: 1px solid #eadfbf; }
.rooms-list .rname { font-family: var(--font-display); font-weight: 600; font-size: 21px; display: block; }
.rooms-list .rname a { color: var(--ink); text-decoration: none; }
.rooms-list .rname a:hover { color: var(--brass-deep); }
.rooms-list .rmeta { font-family: var(--font-mono); font-size: 12px; line-height: 1.7; color: var(--ink-soft); display: block; }
.rooms-list .rmeta a { color: var(--green); text-decoration: none; }
.rooms-list .rmeta a:hover { text-decoration: underline; }

/* ---------- Reviews ---------- */
.reviews { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
.reviews blockquote {
  margin: 0; padding: 26px 26px 22px; background: var(--paper); border: 1px solid var(--line);
  font-family: var(--font-display); font-size: 23px; line-height: 1.3; color: var(--ink);
}
.reviews blockquote p { margin: 0 0 14px; }
.reviews cite {
  font-family: var(--font-mono); font-style: normal; font-size: 10.5px; letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--ink-mute);
}

/* ---------- Notes (emergency + disclosure) ---------- */
.notes { background: var(--paper-2); border-top: 1px solid var(--line); }
.notes .shell { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; padding-top: 44px; padding-bottom: 44px; }
.note .reg { margin-bottom: 12px; }
.note p { margin: 0; font-size: 14.5px; line-height: 1.65; color: var(--ink-soft); }
.note.er p { color: var(--ink); }

/* ---------- Article pages ---------- */
.article-head { background: var(--canvas); }
.article-head .shell { padding-top: 60px; padding-bottom: 44px; max-width: 880px; }
.article-head .reg { margin-bottom: 18px; }
.article-head h1 { font-size: clamp(38px, 4.6vw, 60px); margin-bottom: 20px; text-wrap: balance; }
.article-head .lede { font-size: 19px; line-height: 1.55; color: var(--ink-soft); margin: 0 0 24px; max-width: 60ch; }
.article-head .byline {
  font-family: var(--font-mono); font-size: 11.5px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-mute);
  border-top: 1px solid var(--line); padding-top: 16px;
  display: flex; flex-wrap: wrap; gap: 6px 22px;
}

.article { background: var(--paper); border-top: 1px solid var(--line); }
.article .shell {
  display: grid; grid-template-columns: var(--rail) var(--read); gap: 64px; justify-content: center;
  padding-top: 56px; padding-bottom: 72px;
}
.rail { position: sticky; top: 76px; align-self: start; }
.takeaways {
  background: var(--canvas); border: 1px solid var(--line); border-top: 3px solid var(--green-deep);
  padding: 22px 22px 18px;
}
.takeaways .reg { margin-bottom: 12px; }
.takeaways ul { margin: 0; padding: 0; list-style: none; }
.takeaways li {
  font-size: 14.5px; line-height: 1.5; color: var(--ink); padding: 9px 0 9px 20px; position: relative;
  border-top: 1px solid var(--line-soft);
}
.takeaways li:first-child { border-top: 0; }
.takeaways li::before {
  content: ""; position: absolute; left: 0; top: 17px; width: 10px; height: 5px; background: var(--brass);
  clip-path: polygon(0 100%, 45% 100%, 55% 0, 100% 0, 100% 30%, 62% 30%, 52% 100%, 0 100%);
}
.rail-cta { margin-top: 22px; padding: 20px 22px; background: var(--green-deep); color: var(--on-dark); }
.rail-cta .reg { color: var(--brass); margin-bottom: 10px; }
.rail-cta p { margin: 0 0 14px; font-size: 14px; line-height: 1.55; color: var(--on-dark-mute); }
.rail-cta p b { color: #fff; font-weight: 500; font-family: var(--font-display); font-size: 19px; }
.rail-cta .btn { font-size: 14px; padding: 12px 18px; }
.rail-cta a.tel { color: #fff; font-family: var(--font-mono); font-size: 13px; display: inline-block; margin-top: 12px; }

.prose { font-size: 17.5px; line-height: 1.72; color: var(--ink); min-width: 0; }
.prose > p:first-of-type::first-letter {
  font-family: var(--font-display); font-weight: 600; font-size: 4.2em; line-height: 0.8;
  float: left; margin: 8px 10px 0 0; color: var(--brass-deep);
}
.prose p { margin: 0 0 22px; }
.prose h2 { font-size: clamp(28px, 3vw, 36px); margin: 46px 0 16px; }
.prose h3 { font-size: 24px; margin: 32px 0 10px; }
.prose ul, .prose ol { padding-left: 22px; margin: 0 0 22px; }
.prose li { margin-bottom: 8px; }
.prose .fig { margin: 36px 0; }
.prose a { color: var(--green); }
.prose cite { font-style: normal; }
.aside {
  margin: 30px 0; padding: 22px 26px; background: var(--canvas); border-left: 3px solid var(--brass);
  font-size: 16.5px; color: var(--ink);
}
.aside strong { display: block; font-family: var(--font-display); font-size: 22px; font-weight: 600; margin-bottom: 6px; }
.aside p { margin: 0; }
.aside.er { border-left-color: var(--green-deep); }
.ledger { width: 100%; border-collapse: collapse; margin: 10px 0 28px; font-size: 15.5px; }
.ledger th, .ledger td { text-align: left; vertical-align: top; padding: 12px 14px 12px 0; border-top: 1px solid var(--line); }
.ledger th { font-family: var(--font-mono); font-weight: 500; font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--brass-deep); border-top: 0; padding-top: 0; }
.ledger td b { font-family: var(--font-display); font-size: 19px; font-weight: 600; }

.qa { border-top: 1px solid var(--line); padding: 22px 0 10px; }
.qa h3 { font-size: 25px; margin: 0 0 10px; }
.qa p { margin: 0 0 14px; }

.clinic.inline { grid-template-columns: 1fr; gap: 0; padding: 34px 34px; margin: 46px 0 0; }
.clinic.inline h3.title { font-size: 30px; }

.related { margin-top: 48px; border-top: 3px solid var(--green-deep); padding-top: 22px; }
.related .reg { margin-bottom: 6px; }
.related a {
  display: block; font-family: var(--font-display); font-weight: 600; font-size: 21px; line-height: 1.2;
  color: var(--ink); text-decoration: none; padding: 13px 0; border-bottom: 1px solid var(--line-soft);
  transition: padding-left 0.2s var(--ease), color 0.2s var(--ease);
}
.related a:last-child { border-bottom: 0; }
.related a:hover { color: var(--brass-deep); padding-left: 8px; }
.related a span { color: var(--green-soft); font-style: italic; font-weight: 500; }

.editor-notes { margin-top: 40px; border-top: 1px solid var(--line); padding-top: 22px; font-size: 14px; line-height: 1.65; color: var(--ink-soft); }
.editor-notes p { margin: 0 0 12px; }
.editor-notes .reg { margin-bottom: 10px; }

/* ---------- Rooms page ---------- */
.roomgrid { display: grid; grid-template-columns: 1fr; gap: 18px; margin: 28px 0 14px; }
.room {
  background: var(--canvas); border: 1px solid var(--line); padding: 26px 28px 24px;
  display: grid; grid-template-columns: 1.15fr 1fr; gap: 28px; align-items: start;
}
.room.near { border-left: 5px solid var(--brass); background: var(--brass-wash); }
.room .tag { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--brass-deep); }
.room h3 { font-size: 30px; margin: 8px 0 8px; }
.room address { font-style: normal; font-size: 16px; line-height: 1.5; color: var(--ink); margin-bottom: 8px; }
.room .rnote { font-family: var(--font-display); font-style: italic; font-size: 17px; color: var(--ink-soft); margin: 0; line-height: 1.4; }
.room .r-do { border-left: 1px solid var(--line); padding-left: 24px; }
.room .hours { font-family: var(--font-mono); font-size: 12px; line-height: 1.7; color: var(--ink-soft); margin: 0 0 12px; }
.room .hours b { color: var(--brass-deep); font-weight: 500; letter-spacing: 0.12em; text-transform: uppercase; font-size: 10.5px; }
.room .tel { font-family: var(--font-mono); font-size: 16px; color: var(--green-deep); text-decoration: none; margin-bottom: 14px; display: inline-block; }
.room .tel:hover { color: var(--brass-deep); }
.room .btn { font-size: 14px; padding: 12px 18px; }

/* ---------- Footer ---------- */
.site-foot { background: var(--green-deep); color: var(--on-dark-mute); font-size: 14px; border-top: 4px solid var(--brass); }
.site-foot .shell { padding-top: 56px; padding-bottom: 40px; }
.foot-grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr; gap: 48px; }
.site-foot a { color: var(--on-dark); text-decoration: none; }
.site-foot a:hover { color: #fff; text-decoration: underline; }
.foot-brand { display: flex; align-items: center; gap: 14px; margin-bottom: 16px; }
.foot-brand .seal { width: 44px; height: 44px; }
.foot-brand .name { font-family: var(--font-display); font-weight: 600; font-size: 24px; color: #fff; line-height: 1; }
.foot-brand .name span { display: block; font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--on-dark-mute); margin-top: 6px; }
.foot-lead { max-width: 40ch; line-height: 1.62; margin: 0; }
.foot-col h4 { font-family: var(--font-mono); font-weight: 500; font-size: 10.5px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--brass); margin: 0 0 16px; }
.foot-col a { display: block; margin-bottom: 10px; }
.foot-col .hrs { font-family: var(--font-mono); font-size: 12px; line-height: 1.7; }
.foot-col .hrs b { color: #fff; font-weight: 500; display: block; }
.foot-col .hrs p { margin: 0 0 12px; }
.foot-legal { margin-top: 40px; padding-top: 22px; font-size: 12.5px; line-height: 1.65; max-width: 980px; }
.foot-legal p { margin: 0 0 10px; }
.foot-legal .yr { font-family: var(--font-mono); letter-spacing: 0.08em; text-transform: uppercase; font-size: 11px; }

/* ---------- Responsive ---------- */
@media (max-width: 1080px) {
  .article .shell { grid-template-columns: 220px minmax(0, 1fr); gap: 40px; }
  .nearband .shell { grid-template-columns: 1fr 1fr; }
  .nearband .btn { grid-column: 1 / -1; justify-self: start; }
}
@media (max-width: 900px) {
  .hero .shell { grid-template-columns: 1fr; gap: 34px; padding-top: 44px; padding-bottom: 52px; }
  .hero-copy .lede { max-width: 100%; }
  .feature .shell, .feature.flip .shell { grid-template-columns: 1fr; gap: 30px; }
  .feature.flip .feature-copy { order: 0; }
  .edition { grid-template-columns: 1fr; }
  .lanes { grid-template-columns: 1fr; gap: 26px; }
  .clinic { grid-template-columns: 1fr; gap: 30px; padding: 32px 28px; }
  .reviews { grid-template-columns: 1fr; }
  .notes .shell { grid-template-columns: 1fr; gap: 28px; }
  .article .shell { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .rail { position: static; }
  .rail-cta { display: none; }
  .room { grid-template-columns: 1fr; gap: 16px; }
  .room .r-do { border-left: 0; padding-left: 0; border-top: 1px solid var(--line); padding-top: 16px; }
  .foot-grid { grid-template-columns: 1fr 1fr; }
  .foot-about { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
  body { font-size: 16.5px; }
  .shell { padding: 0 20px; }
  section { padding: 52px 0; }
  .strip .shell { flex-direction: column; gap: 4px; }
  .strip span:last-child { display: none; }
  .masthead .shell { padding-top: 24px; padding-bottom: 18px; }
  .masthead .seal { width: 44px; height: 44px; }
  .navbar .shell { gap: 4px 18px; padding-top: 9px; padding-bottom: 9px; }
  .navbar a { font-size: 13.5px; }
  .navbar .call { display: none; }
  .hero-copy h1 { font-size: clamp(36px, 10vw, 46px); }
  .hero-copy .lede { font-size: 17px; }
  .hero-actions .btn { width: 100%; justify-content: center; }
  .nearband .shell { grid-template-columns: 1fr; gap: 18px; }
  .nearband .cell { border-left: 0; padding-left: 0; border-top: 1px solid rgba(255,255,255,0.14); padding-top: 14px; }
  .entry { grid-template-columns: 40px 1fr; gap: 12px; padding: 20px 0 22px; }
  .entry .num { font-size: 24px; }
  .entry h3 { font-size: 22px; }
  .entry.lead { padding: 24px 20px 26px; }
  .entry.lead h3 { font-size: 26px; }
  .clinic { padding: 26px 20px; }
  .rooms-list li.near { margin: 0; }
  .reviews blockquote { font-size: 20px; padding: 20px; }
  .article-head .shell { padding-top: 40px; padding-bottom: 32px; }
  .article-head h1 { font-size: clamp(32px, 9vw, 42px); }
  .article-head .lede { font-size: 17.5px; }
  .prose { font-size: 17px; }
  .prose h2 { font-size: 27px; margin-top: 36px; }
  .aside { padding: 18px 18px; }
  .clinic.inline { padding: 24px 20px; }
  .foot-grid { grid-template-columns: 1fr; gap: 28px; }
  .ledger { font-size: 14.5px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}
