/* MindMorph: inner pages (2026-10-11). Loaded on every page but home, after
   style.css, whose tokens it reads (the older names, --olive, --paper,
   --cream ..., point at the same white, near-black, plum and sage palette).
   Headings and words are ink; plum marks only what can be pressed. Mobile first; the min-width blocks add the wider layouts.
   Targets are 44px at least; nothing depends on hover. */
:root{--r:var(--radius-sm);--hair:1px}
.sr-only{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.empty-note{padding:8px 0 72px}
.phead{padding-top:20px;padding-bottom:40px}
.phead h1{font-size:2.5rem;font-size:max(2.5rem,min(10vw,4.4rem));font-size:clamp(2.5rem,10vw,4.4rem);line-height:1.02;letter-spacing:-.02em;max-width:14em}
.phead .eyebrow{margin-bottom:18px}
.phead-lede{margin-top:20px;font-size:1.06rem;line-height:1.65;color:var(--ink-2);max-width:34em}
.phead-lede>*+*{margin-top:.9em}
@media (min-width:921px){
  .phead{padding-top:28px;padding-bottom:56px}
  .phead-split{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:56px;align-items:end}
  .phead-split .phead-lede{margin-top:0;padding-bottom:8px}
}
.prose{font-size:1.02rem;line-height:1.7;color:var(--ink-2);max-width:36em;overflow-wrap:break-word}
.prose>*+*{margin-top:1em}
.prose h2{font-size:1.6rem;font-size:max(1.6rem,min(5.6vw,2.2rem));font-size:clamp(1.6rem,5.6vw,2.2rem);line-height:1.15;color:var(--ink);margin-top:1.9em}
.prose h3{font-size:1.4rem;line-height:1.25;color:var(--ink);margin-top:1.7em}
.prose h4,.prose h5,.prose h6{font:600 1rem/1.4 var(--body);color:var(--ink);margin-top:2em}
.prose h2+*,.prose h3+*,.prose h4+*{margin-top:.6em}
.prose>:first-child{margin-top:0}
.prose a{color:var(--olive);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px;text-decoration-color:rgba(106,60,95,.55)}
.prose a:hover,.prose a:focus-visible{text-decoration-color:currentColor}
.prose .btn,.acc-a .btn{text-decoration:none;color:var(--btn-fg)}
.prose strong,.prose b{color:var(--ink);font-weight:600}
.prose ul,.prose ol{padding-left:1.3em}
.prose li+li{margin-top:.4em}
.prose ul{list-style:none;padding-left:1.4em}
.prose ul>li{position:relative}
.prose ul>li::before{content:"";position:absolute;left:-1.2em;top:.8em;width:.55em;height:1px;background:var(--sage-ink)}
.prose ol>li::marker{font-family:var(--display);color:var(--muted)}
.prose blockquote{margin:1.6em 0;padding:0 0 0 20px;border-left:2px solid var(--sage-ink);font:italic 400 1.3rem/1.45 var(--display);color:var(--ink)}
.prose img{border-radius:var(--radius-img);margin:1.6em 0}
.prose hr{border:0;border-top:1px solid var(--line);margin:2.4em 0}
/* a table wider than a phone scrolls inside its own box instead of running off the page
   (the page clips sideways overflow, so it would be cut, not scrollable) */
.prose table{border-collapse:collapse;width:100%;font-size:.95rem}
@media (max-width:599px){.prose table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;font-size:.875rem}.prose th,.prose td{min-width:7.5em}}
.prose th,.prose td{border-bottom:1px solid var(--line);padding:10px 8px;text-align:left;vertical-align:top}
.prose-page.has-lede>p:first-child{font:400 max(1.3rem,min(5vw,1.65rem))/1.4 var(--display);color:var(--ink);letter-spacing:-.005em}
/* ---------- a section's top: photo, then the title, the words left under it (page.php, service.php) ----------
   The top photo is the page's first meta.images photo, the column's full
   width, the one image on the page fetched first (fetchpriority=high). */
.pg-top{padding-top:16px;padding-bottom:32px}
.pg-top-photo{margin:0 0 28px;aspect-ratio:var(--photo-ratio);overflow:hidden;border-radius:var(--radius-img);background:var(--wash-deep)}
.pg-top-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 40%}
.pg-top h1{font-size:2.4rem;font-size:max(2.4rem,min(9vw,4rem));font-size:clamp(2.4rem,9vw,4rem);line-height:1.04;letter-spacing:-.02em;max-width:16em;text-wrap:balance}
.pg-top .eyebrow{margin-bottom:12px}
.pg-top .eyebrow a{color:inherit;text-decoration:none;display:inline-flex;align-items:center;min-height:44px;margin:-14px 0}
.pg-top .eyebrow a:hover{text-decoration:underline}
@media (min-width:921px){
  .pg-top{padding-top:24px;padding-bottom:48px}
  .pg-top-photo{aspect-ratio:12/5;margin-bottom:40px}
}
/* the title on the photo (Eric 2026-10-11): white, bottom left, on a dark
   gradient the caption owns, so every line of text sits on at least 60% black
   (white over a white pixel then still clears 4.5:1). The box keeps the photo's
   ratio as a minimum and grows if a long title needs more room. */
.pg-hero{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-width:0;aspect-ratio:var(--photo-ratio);margin:0 0 28px;border-radius:var(--radius-img);overflow:hidden;background:var(--wash-deep)}
.pg-hero .pg-top-photo{position:absolute;inset:0;margin:0;aspect-ratio:auto;border-radius:0}
.pg-hero-cap{position:relative;z-index:1;padding:72px 24px 24px;color:#fff;background:linear-gradient(to top,rgba(0,0,0,.76) 0,rgba(0,0,0,.72) calc(100% - 72px),rgba(0,0,0,0) 100%)}
.pg-hero-cap h1{color:#fff;font-size:2rem;font-size:max(2rem,min(8vw,4rem));font-size:clamp(2rem,8vw,4rem);overflow-wrap:break-word}
.pg-hero-cap .eyebrow,.pg-hero-cap .eyebrow a{color:#fff}
.pg-hero-cap .fdr-pageask{color:#fff;border-color:rgba(255,255,255,.7);background:rgba(0,0,0,.25)}
.pg-hero-cap .fdr-pageask:hover{border-color:#fff;background:rgba(0,0,0,.45)}
.pg-hero-cap :focus-visible{outline-color:#fff}
.phead-after-hero{padding-top:0}
@media (min-width:768px){.pg-hero-cap{padding:96px 48px 40px;background:linear-gradient(to top,rgba(0,0,0,.76) 0,rgba(0,0,0,.72) calc(100% - 96px),rgba(0,0,0,0) 100%)}}
@media (min-width:921px){.pg-hero{aspect-ratio:12/5;margin-bottom:40px}.pg-hero-cap{padding:112px 64px 52px;background:linear-gradient(to top,rgba(0,0,0,.76) 0,rgba(0,0,0,.72) calc(100% - 112px),rgba(0,0,0,0) 100%)}}
/* parallax: a slow drift of the photo only, from 768px, never under reduced
   motion (site.js adds .has-par and moves it with a transform) */
@media (min-width:768px) and (prefers-reduced-motion:no-preference){.has-par .pg-hero .pg-top-photo img{height:calc(100% + 48px);margin-top:-48px;will-change:transform}}

/* ---------- the words and the sidebar (_sidebar.php) ----------
   Mobile first: the sidebar follows the words, so it never covers them (the
   header's Book pill stays on screen). From 921px it sits beside them and
   stays in view under the sticky header while the words scroll; one taller
   than the window scrolls until its foot shows, then holds (site.js sets
   --side-top). The words fill the main column: the column, not a narrow
   measure, keeps the line readable (Eric 2026-10-11, "allow text to span
   width of container"). */
.pg-grid{padding-bottom:72px}
.pg-grid.svc-intro{padding-bottom:48px}
.pg-top.pg-top-only{padding-bottom:0}
.pg-aside{margin-top:48px}
.side-panel{display:grid;gap:16px;align-content:start}
.pg-main .prose{max-width:none}
.side-facts+.side-facts{margin-top:0}
.side-where dd a{color:var(--accent)}
.side-more .side-h{padding:0 var(--card-pad);margin-bottom:4px}
.side-links a{padding:10px 0}
@media (max-width:920px){.side-faq,.side-video{display:none}} /* on a phone the panel video is too much (Eric 10-16) */
/* phones, service and inner pages (.book-first, Eric 2026-10-16): the book card
   comes up under the title, folded after Call; "See details" opens the facts,
   address and hours. The rest of the sidebar still follows the words. Folding
   needs the script (html.js), so without it the whole card shows. */
.side-fold,.side-fold-slot{display:none}
@media (max-width:920px){
  .book-first.has-aside{display:flex;flex-direction:column}
  .book-first.has-aside .pg-aside{display:contents}
  .book-first.has-aside .side-book{order:-1;margin-bottom:32px}
  .book-first.has-aside .pg-main{margin-bottom:32px}
  .book-first.has-aside .pg-aside>:not(.side-book){margin-top:16px}
  .js .book-first .side-book:not(.is-open) .side-rest{display:none}
  .js .book-first .side-fold{display:flex;align-items:center;gap:8px;min-height:44px;margin:8px auto -8px;padding:0 12px;background:none;border:0;
    font:500 var(--fs-small)/1.2 var(--sans);color:var(--accent);cursor:pointer}
  .js .book-first .side-fold-slot{display:flex;justify-content:center}
  .side-fold svg{transition:transform .2s ease}
  .side-book.is-open .side-fold svg{transform:rotate(180deg)}
  .side-fold:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:var(--radius-pill)}
}
@media (prefers-reduced-motion:reduce){.side-fold svg{transition:none}}
@media (min-width:921px){
  .pg-grid{padding-bottom:104px}
  .pg-grid.has-aside{display:grid;grid-template-columns:minmax(0,1fr) 18rem;gap:40px;align-items:start}
  .pg-grid.has-aside .pg-aside{margin-top:0;position:-webkit-sticky;position:sticky;top:var(--side-top,calc(var(--head) + var(--bar) + 24px))}
}
@media (min-width:1024px){.pg-grid.has-aside{grid-template-columns:minmax(0,1fr) 20rem;gap:56px}}
.cv-facts{margin:20px 0 0;display:grid}
.cv-facts>div{display:grid;gap:2px;padding:12px 0;border-top:1px solid var(--line)}
.cv-facts dt{font:italic 400 .95rem/1.3 var(--display);color:var(--muted)}
.cv-facts dd{margin:0;font-size:.95rem;line-height:1.55}
.cv-facts a{display:inline-flex;align-items:center;min-height:44px;margin:-8px 0;color:var(--plum)}
.cv-facts-lg dd{font-size:1rem}
/* the gallery, its viewer and the video cards live in components.css */
.pg-faq,.post-faq{margin-top:64px}
.pg-faq h2,.post-faq h2,.svc-faq h2{font-size:1.7rem;font-size:max(1.7rem,min(5.6vw,2.3rem));font-size:clamp(1.7rem,5.6vw,2.3rem);margin-bottom:20px}
.acc{border-top:var(--hair,1px) solid var(--line)}
.acc-item{border-bottom:var(--hair,1px) solid var(--line)}
.acc-h{margin:0;font:inherit}
.acc-btn{display:flex;align-items:center;justify-content:space-between;gap:24px;width:100%;min-height:64px;padding:20px 0;margin:0;border:0;background:none;color:var(--ink);text-align:left;cursor:pointer;font:400 1.15rem/1.35 var(--display);-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.acc-ic{position:relative;flex:none;width:14px;height:14px;margin-right:6px}
.acc-ic::before,.acc-ic::after{content:"";position:absolute;left:0;top:50%;width:14px;height:1.5px;margin-top:-.75px;background:var(--plum);transition:transform .18s ease}
.acc-ic::after{transform:rotate(90deg)}
.acc-btn[aria-expanded="true"] .acc-ic::after{transform:rotate(0)}
.acc-a{padding:0 0 24px;max-width:65ch;color:var(--ink-2);font-size:.98rem;line-height:1.65}
.acc-a a{color:var(--olive);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px;text-decoration-color:rgba(106,60,95,.55)}
.acc-a a:hover,.acc-a a:focus-visible{text-decoration-color:currentColor}
@media (min-width:921px){.acc-btn{font-size:1.25rem;min-height:68px}}
@media (prefers-reduced-motion:reduce){.acc-ic::before,.acc-ic::after{transition:none}}
.chip{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border:1px solid var(--line-strong);border-radius:999px;background:transparent;color:var(--ink);font:500 .92rem/1 var(--body);white-space:nowrap;text-decoration:none;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;transition:background-color .2s,border-color .2s,color .2s}
.chip:hover{border-color:var(--plum);color:var(--plum)}
.chip[aria-pressed="true"],.chip[aria-current]{background:var(--olive);border-color:var(--olive);color:var(--cream)}
.cats ul,.faq-jump ul,.filter-chips{display:flex;gap:8px;list-style:none;margin:0;padding:0 var(--pad);margin:0 calc(var(--pad) * -1);overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
.cats ul::-webkit-scrollbar,.faq-jump ul::-webkit-scrollbar,.filter-chips::-webkit-scrollbar{display:none}
.cats li,.faq-jump li{flex:none}
@media (min-width:921px){.cats ul,.faq-jump ul,.filter-chips{flex-wrap:wrap;overflow:visible;margin:0;padding:0}}
.svc-body{max-width:68ch}
.svc-body h2{margin-top:2.1em}
.svc-body h3{margin-top:1.8em}
.svc-body h2+*,.svc-body h3+*{margin-top:.55em}
.svc-body>ul,.svc-body>ol{padding-left:1.5em}
.svc-body li+li{margin-top:.55em}
.svc-body ul>li::before{left:-1.05em;top:.66em;width:.36em;height:.36em;border-radius:50%;background:var(--sage-ink)}
.svc-body li>ul,.svc-body li>ol{margin-top:.45em}
.svc-body li>ul>li::before{background:transparent;box-shadow:inset 0 0 0 1px var(--sage-ink)}
.svc-body a{color:var(--plum);text-decoration:underline;text-decoration-color:rgba(106,60,95,.45);text-decoration-thickness:1px;text-underline-offset:.22em;border-radius:2px;transition:text-decoration-color .2s,color .2s}
.svc-body a:hover{text-decoration-color:currentColor;text-decoration-thickness:2px}
.svc-body a:focus-visible{outline:2px solid var(--olive);outline-offset:2px;text-decoration-color:currentColor}
@media (min-width:720px){
  .svc-body>ul:has(>li:nth-child(8)):not(:has(a,strong,b,p,ul,ol)){-webkit-columns:2;columns:2;-webkit-column-gap:2.5em;column-gap:2.5em}
  .svc-body>ul:has(>li:nth-child(8)):not(:has(a,strong,b,p,ul,ol))>li{margin:0 0 .55em;-webkit-column-break-inside:avoid;break-inside:avoid}
}
@media (prefers-reduced-motion:reduce){.svc-body a{transition:none}}
.side-card{border:1px solid var(--card-line);border-radius:var(--card-radius);padding:var(--card-pad);background:var(--card-bg)}
.side-h{font:600 var(--fs-small)/1.3 var(--body);color:var(--ink);margin-bottom:12px}
.price-list{margin:0}
.price-list>div{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:10px 0;border-top:var(--hair,1px) solid var(--line)}
.price-list dt{font-size:.95rem}
.price-list dd{margin:0;font:500 1.3rem/1.2 var(--display);white-space:nowrap}
.side-title{margin:0 0 8px;font:500 1.35rem/1.25 var(--serif);color:var(--ink);text-wrap:balance}
.side-text{margin:0 0 16px;font-size:.95rem;line-height:1.55;color:var(--ink-2)}
.side-actions{display:grid;gap:10px}
@media (max-width:599px){.side-actions{gap:16px}}   /* stacked buttons a clear thumb apart */
.side-actions>.slot{display:grid}
.side-book .btn{width:100%}
.side-facts{margin:18px 0 0}
.side-facts>div{display:grid;gap:2px;padding:10px 0;border-top:1px solid var(--rule)}
.side-facts dt{font:600 var(--fs-label)/1.3 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--quiet)}
.side-facts dd{margin:0;font-size:.95rem;line-height:1.5;color:var(--ink)}
.side-links{list-style:none;margin:0;padding:0 var(--card-pad)}
.side-links a{display:flex;align-items:center;min-height:44px;border-bottom:1px solid var(--rule-soft);font:500 .95rem/1.3 var(--sans);color:var(--accent);text-decoration:none}
.side-links a:hover{text-decoration:underline;text-underline-offset:.2em}
.side-links a::after{content:"\2192";margin-left:auto;padding-left:12px}
.vgrid.side-video{grid-template-columns:minmax(0,1fr)}
.side-video .vcard-title{font-size:1.05rem}
.side-video .vcard-sum{display:none}
.svc-faq{margin-top:56px}
.svc-faq .svc-faq-head h2{margin-bottom:10px}
.svc-faq-more{margin:0 0 24px;max-width:24em;font-size:.95rem;line-height:1.55;color:var(--muted)}
.svc-faq-more a{color:var(--olive);white-space:nowrap;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.2em}
.more-svc{margin-top:64px;padding-top:28px;padding-bottom:72px;background:linear-gradient(var(--line),var(--line)) var(--pad) 0/calc(100% - 2 * var(--pad)) 1px no-repeat}
.more-svc-h{font:600 var(--fs-small)/1.3 var(--body);color:var(--ink);margin-bottom:16px}
.more-svc ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.more-svc a{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border:1px solid var(--line-strong);border-radius:999px;text-decoration:none;color:var(--ink);font:500 .95rem/1 var(--body)}
.more-svc a:hover{border-color:var(--plum);color:var(--plum)}
@media (min-width:921px){.svc-faq{margin-top:72px}.more-svc{margin-top:88px;padding-bottom:104px}
  .svc-faq{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:56px;align-items:start}
  .svc-faq-head{position:-webkit-sticky;position:sticky;top:calc(var(--head) + var(--bar) + 24px)}
  .svc-faq-more{margin-bottom:0}}
.blog-wrap{padding-bottom:72px}
.cats{margin-bottom:36px}
@media (min-width:921px){
  .blog-wrap{padding-bottom:104px}
}
.catlist{list-style:none;margin:0;padding:0;border-top:var(--hair,1px) solid var(--line-strong);max-width:44rem}
.catlist a{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:60px;border-bottom:var(--hair,1px) solid var(--line);text-decoration:none;font:500 1.25rem/1.3 var(--display);color:var(--ink)}
.catlist a:hover span:first-child{text-decoration:underline;text-underline-offset:.2em}
.catlist-n{font:400 .9rem/1 var(--body);color:var(--muted)}
.post-head{padding-top:20px;padding-bottom:32px}
.post-head .eyebrow a{text-decoration:none;display:inline-flex;align-items:center;min-height:44px;margin:-14px 0}
.post-head .eyebrow a:hover{text-decoration:underline}
.post-head h1{font-size:2.2rem;font-size:max(2.2rem,min(8.2vw,3.9rem));font-size:clamp(2.2rem,8.2vw,3.9rem);line-height:1.05;letter-spacing:-.02em;max-width:18em}
.post-meta{display:flex;flex-wrap:wrap;align-items:center;gap:4px 14px;margin-top:20px;color:var(--muted);font-size:.94rem}
.post-by::before{content:"";display:inline-block;vertical-align:middle;width:4px;height:4px;margin:-2px 14px 0 0;border-radius:50%;background:var(--sage-ink)}
.post-hero img{width:100%;aspect-ratio:16/9;object-fit:cover; /* a post's top photo is a wide 16:9 band, never the taller --photo-ratio (Eric, 2026-10-11) */border-radius:var(--radius-img);background:var(--wash-deep)}
.post-body{padding-top:40px;padding-bottom:72px}
.prose-post{font-size:1.06rem;line-height:1.75}
.post-tags{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:48px;padding-top:24px;border-top:1px solid var(--line)}
.post-tags-l{font:600 var(--fs-small)/1 var(--body);color:var(--quiet);margin-right:6px}
@media (min-width:921px){
  .post-head{padding-top:28px;padding-bottom:44px}
  .post-body{padding-top:56px;padding-bottom:104px}
  .prose-post{font-size:1.1rem}
}
.faq-wrap{padding-bottom:72px}
.faq-jump{margin-bottom:12px}
.faq-group{padding-top:36px;scroll-margin-top:calc(var(--head) + var(--bar) + 12px)}
.faq-group-h{font-size:1.8rem;font-size:max(1.8rem,min(6.4vw,2.5rem));font-size:clamp(1.8rem,6.4vw,2.5rem);margin-bottom:12px}
.faq-more{margin-top:48px;color:var(--ink-2)}
.faq-more a{color:var(--olive)}
@media (min-width:921px){.faq-wrap{padding-bottom:104px}.faq-group{padding-top:56px}}
.contact-grid{display:grid;gap:40px;padding-bottom:80px}
.form-card{background:var(--card-bg);border:1px solid var(--card-line);border-radius:var(--card-radius);padding:24px 20px 28px}
.form-card-h{font-size:1.7rem;margin-bottom:6px}
.form{display:grid;gap:0}
.field{display:grid;gap:6px;margin-top:18px}
.field label{font-weight:600;font-size:.95rem}
.field input,.field textarea{font:400 16px/1.4 var(--body);padding:12px 14px;border:1px solid var(--line-strong);border-radius:var(--r);background:var(--white);width:100%;min-height:48px;color:var(--ink)}
.field textarea{min-height:160px;resize:vertical}
.field input:focus,.field textarea:focus{outline:2px solid var(--plum);outline-offset:0;border-color:var(--plum);background:#fff}
.hint{margin:0;font-size:.88rem;line-height:1.5;color:var(--muted);max-width:36em}
.opt{font-weight:400;color:var(--muted)}
.form .btn{margin-top:24px;justify-self:start}
.contact-side{display:grid;gap:24px;align-content:start}
.contact-book{justify-self:start}
.notice{margin:0;border-left:3px solid var(--sage-ink);background:#fff;padding:14px 18px;max-width:36em;border-radius:0 var(--r) var(--r) 0;font-size:.95rem;line-height:1.55;color:var(--ink-2)}
.notice strong{color:var(--ink)}
.flash{margin:12px 0 0;padding:12px 16px;border-radius:var(--r)}
.flash.err{background:#f6e3dc;color:#7a2a17}
@media (min-width:921px){
  .contact-grid{grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:56px;align-items:start;padding-bottom:104px}
  .form-card{padding:40px 44px 44px}
  .contact-side{position:-webkit-sticky;position:sticky;top:calc(var(--head) + var(--bar) + 24px)}
}
.lost{padding-top:32px;padding-bottom:88px}
.lost h1{font-size:2.4rem;font-size:max(2.4rem,min(9.5vw,4.2rem));font-size:clamp(2.4rem,9.5vw,4.2rem);line-height:1.04;letter-spacing:-.02em}
.lost-text{margin-top:20px;font-size:1.08rem;color:var(--ink-2);max-width:32em}
.lost-links{list-style:none;margin:32px 0 0;padding:0;border-top:var(--hair,1px) solid var(--line)}
.lost-links a{display:flex;align-items:center;justify-content:space-between;min-height:56px;border-bottom:var(--hair,1px) solid var(--line);text-decoration:none;font:500 1.2rem/1.3 var(--display);color:var(--ink)}
.lost-links a::after{content:"";flex:none;width:8px;height:8px;margin-right:4px;border-top:1.5px solid currentColor;border-right:1.5px solid currentColor;transform:rotate(45deg)}
.lost-links a:hover{text-decoration:underline;text-underline-offset:.2em}
.lost .notice{margin-top:28px}
@media (min-width:921px){.lost{padding-top:64px;padding-bottom:128px}}
.acc-item{scroll-margin-top:calc(var(--head) + var(--bar) + 12px)}
.acc-btn{-webkit-user-select:none;user-select:none}
/* a photo inside the words keeps its own shape (a crop could cut what the
   writer chose it for); its caption reads like the gallery's */
.prose figure{margin:1.8em 0}
.prose figure img{margin:0;display:block;width:100%;max-height:min(78vh,640px);object-fit:cover;border-radius:var(--radius-img);background:var(--wash-deep)}
.prose figcaption{margin-top:8px;font-size:.8125rem;line-height:1.45;color:var(--quiet);max-width:34em}
.prose .fig-in{margin:1.8em 0}
.prose .fig-in img{margin:0;display:block}
@media (min-width:700px){
  .prose .fig-side{float:right;width:40%;margin:.35em 0 1.2em 1.6em}
  .prose .fig-side~h2,.prose .fig-side~h3{clear:both}
}
.prose .gcards-wrap{margin:2em 0 2.4em}
.prose .gcards{list-style:none;margin:0;padding:0;display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(15rem,1fr))}
.prose .gcards>li{margin:0}
.prose .gcards>li::before{content:none}
.gcard{display:flex;flex-direction:column;background:var(--card-bg);border:1px solid var(--card-line);border-radius:var(--card-radius);overflow:hidden}
.gcard-photo{aspect-ratio:var(--thumb-ratio);background:var(--wash-deep)}
.gcard-photo img{width:100%;height:100%;object-fit:cover;margin:0!important;border-radius:0!important}
.gcard-body{display:flex;flex-direction:column;flex:1 1 auto;padding:18px 20px 16px}
.gcard-ic{color:var(--sage-ink);margin-bottom:10px}
.prose .gcard-h{margin:0;font:500 1.25rem/1.25 var(--display);color:var(--ink)}
.prose .gcard-t{margin:.45em 0 0;font-size:.95rem;line-height:1.55}
.prose .gcard-go{display:inline-flex;align-items:center;gap:6px;min-height:44px;margin-top:auto;padding-top:6px;font-weight:600;font-size:.95rem;color:var(--plum)}

/* ---------- insurance plans per state (_insurance.php) ---------- */
.pg-ins{margin:48px 0 0;padding:28px 24px;border-radius:var(--card-radius);background:var(--card-bg);border:1px solid var(--card-line)}
.pg-ins h2{margin:0 0 18px;font:500 1.5rem/1.2 var(--serif);color:var(--ink)}
.ins-state h3{margin:0 0 10px;font:600 var(--fs-small)/1.2 var(--sans);color:var(--ink)}
.ins-list{list-style:none;margin:0;padding:0}
.ins-list li{position:relative;padding:7px 0 7px 18px;border-top:1px solid var(--rule-soft);line-height:1.4}
.ins-list li:first-child{border-top:0}
.ins-list li::before{content:"";position:absolute;left:0;top:.95em;width:6px;height:6px;border-radius:50%;background:var(--sage-ink)}
.ins-grid.is-multi{display:grid;gap:28px}
@media (min-width:700px){.pg-ins{padding:36px 40px}.ins-grid.is-multi{grid-template-columns:repeat(2,minmax(0,1fr));gap:40px}}

/* ---------- buttons inside written words keep their own colours ---------- */
.prose a.btn,.acc-a a.btn{text-decoration:none}
.prose a.btn-plum,.acc-a a.btn-plum{color:var(--white)}
.prose a.btn-line,.acc-a a.btn-line{color:var(--plum)}
.prose a.btn-line:hover,.acc-a a.btn-line:hover{color:var(--white)}
.flash.ok{background:var(--white);border:1px solid var(--sage-ink);color:var(--ink)}

/* ---------- the practitioner card beside the about page ---------- */
.card-person{display:grid;gap:10px;padding:var(--card-pad);border-radius:var(--card-radius);background:var(--card-bg);border:1px solid var(--card-line)}
.card-person .person-photo{aspect-ratio:4/5;overflow:hidden;border-radius:var(--radius-img);background:var(--wash-deep);margin:0 0 6px}
.card-person .person-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 25%}
.person-name{margin:0;font:500 1.4rem/1.2 var(--serif);color:var(--ink)}
.person-cred{margin:0;color:var(--quiet);font-weight:500}
.person-book{margin:8px 0 0}
.person-book .btn{width:100%}
/* the practitioner page on a phone (page.php .pg-person): her square photo beside
   her name and letters, her opening lines under them, all above the book card;
   the card beside the words, and the first paragraph it repeats, step aside */
.pg-person{display:none}
@media (max-width:599px){
  .pg-person{display:block;order:-2;margin:0 0 24px}
  .pg-person-row{display:grid;grid-template-columns:112px minmax(0,1fr);gap:16px;align-items:center}
  .pg-person-photo{margin:0;aspect-ratio:1;overflow:hidden;border-radius:var(--radius-img);background:var(--wash-deep)}
  .pg-person-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 25%}
  .pg-person-name{margin:0;font:500 1.35rem/1.2 var(--serif);color:var(--ink);text-wrap:balance}
  .pg-person-cred{margin:6px 0 0;color:var(--quiet);font-weight:500;font-size:.95rem}
  .pg-person-intro{margin:18px 0 0;font-size:1.02rem;line-height:1.7;color:var(--ink-2)}
  .has-person .card-person{display:none}
  .has-person.has-intro .prose-page>p:first-child{display:none}
  .has-person.has-intro .prose-page>p:first-child+*{margin-top:0}
}

/* ---------- keep reading (_related.php) ---------- */
.pg-rel{margin-top:56px;padding-top:28px;border-top:1px solid var(--rule)}
.pg-rel h2{margin:0 0 12px;font:600 var(--fs-small)/1.3 var(--sans);color:var(--ink)}
.rel-list{list-style:none;margin:0;padding:0;max-width:40rem}
.rel-list a{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;min-height:56px;padding:16px 0;border-bottom:1px solid var(--rule-soft);text-decoration:none;font:500 1.12rem/1.35 var(--serif);color:var(--ink)}
.rel-list a:hover{color:var(--plum)}
.rel-list a:hover span{text-decoration:underline;text-underline-offset:.2em}
/* the arrow sits on the first line of a label that wraps, not in the middle of two lines; the 16px padding keeps a one-line row centred in its 56px */
.rel-nw{white-space:nowrap}
.rel-arrow{flex:none;color:var(--plum);margin-top:calc((1.35em - 16px) / 2)}
.svc .pg-rel,.wrap>.pg-rel{margin-bottom:24px}

/* ---------- videos: library, cards, a page's own, the watch page ---------- */
.vlib{padding-bottom:72px}
/* /videos in groups, one per page (videos.php): a sideways row each on a phone, the grid from 600px */
.vgroup+.vgroup{margin-top:40px}
.vgroup-h{margin:0 0 16px;font-size:1.45rem}
.vgroup-h a{color:inherit;text-decoration:underline;text-decoration-color:var(--rule);text-underline-offset:.2em;text-decoration-thickness:1px}
.vgroup-h a:hover,.vgroup-h a:focus-visible{text-decoration-color:var(--plum)}
@media (min-width:600px){
  .vgroup+.vgroup{margin-top:56px}
  .vlib .vgrid.vscroll{display:grid;overflow:visible;scroll-snap-type:none;padding-bottom:0;cursor:auto}
  .vlib .vscroll>li{max-width:none}
}
/* the video cards themselves: components.css */
.pg-videos{margin-top:56px}
.pg-videos h2{margin-bottom:20px}
/* the watch page (Eric 2026-10-11): the container's full width, left aligned.
   A wide player runs across the top, the words and the sidebar in two columns
   under it. A tall one (.is-tall, video.php) sits left from 921px, as wide as
   the window lets its height fit under the header (--vr = width / height),
   sticky, the title level with its top; the words and the sidebar follow
   right beside it, the sidebar's cards side by side. A phone: player, then
   the title close under it. */
.vwatch{padding-top:20px}
.vwatch .pg-grid{padding-bottom:56px}
.vplayer{border-radius:var(--radius-img);overflow:hidden;background:var(--night)}
.vplayer video,.vplayer iframe{display:block;width:100%;height:auto;border:0}
.vhead{margin-top:16px}
.vhead h1{font-size:2rem;font-size:clamp(2rem,6.4vw,3rem);line-height:1.08;letter-spacing:-.015em}
.vmeta{display:flex;flex-wrap:wrap;gap:4px 16px;margin-top:14px;color:var(--quiet);font-size:.94rem}
.vwatch .prose{margin-top:32px}
.vtranscript{margin-top:36px;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.vtranscript summary{display:flex;align-items:center;min-height:56px;cursor:pointer;font:500 1.1rem/1.3 var(--serif);color:var(--ink)}
.vtranscript .prose{padding-bottom:24px}
.vmore{padding-top:40px;padding-bottom:72px;border-top:1px solid var(--rule)}
@media (min-width:921px){.vwatch{padding-top:32px}.vwatch .pg-grid{padding-bottom:80px}.vhead{margin-top:28px}.vlib,.vmore{padding-bottom:104px}
  .vwatch.is-tall{--vtw:min(24rem,calc((100vh - var(--head) - var(--bar) - 48px) * var(--vr,.5625)));display:grid;grid-template-columns:var(--vtw) minmax(0,1fr);gap:40px;align-items:start}
  .vwatch.is-tall .vplayer{position:-webkit-sticky;position:sticky;top:calc(var(--head) + var(--bar) + 24px)}
  .vwatch.is-tall .vhead{margin-top:0}
  .vwatch.is-tall .pg-grid.has-aside{display:block}
  .vwatch.is-tall .pg-grid.has-aside .pg-aside{position:static;margin-top:48px;grid-template-columns:repeat(auto-fill,minmax(min(100%,16rem),1fr))}}

/* ---------- a page's sign-up form (_register.php) ---------- */
.reg-card{margin-top:48px;padding:24px 20px 28px;border-radius:var(--card-radius);background:var(--card-bg);border:1px solid var(--card-line);scroll-margin-top:calc(var(--head) + var(--bar) + 16px)}
.reg-card h2{margin:0 0 4px;font:500 1.7rem/1.2 var(--serif);color:var(--ink)}
.reg-card .field input{background:var(--white)}
.field-row{display:grid;gap:0 16px}
@media (min-width:600px){.field-row{grid-template-columns:repeat(2,minmax(0,1fr))}}
.consents{margin:22px 0 0;padding:0;border:0;display:grid;gap:4px}
.check{display:flex;align-items:flex-start;gap:12px;min-height:44px;padding:6px 0;font-weight:400!important;line-height:1.45;cursor:pointer}
/* square checkboxes (Eric 2026-10-11): a real checkbox, drawn square, plum with a white tick */
.check input,.field input[type=checkbox],.form input[type=checkbox]{-webkit-appearance:none;appearance:none;flex:none;display:inline-grid;place-content:center;width:22px!important;height:22px;min-height:0!important;margin:1px 0 0;padding:0!important;border:2px solid var(--plum);border-radius:3px;background:var(--white);color:var(--white);cursor:pointer}
.check input::before,.field input[type=checkbox]::before,.form input[type=checkbox]::before{content:"";width:11px;height:6px;margin-top:-3px;border:solid currentColor;border-width:0 0 2.5px 2.5px;transform:rotate(-45deg) scale(0);transition:transform .12s ease-out}
.check input:checked,.field input[type=checkbox]:checked,.form input[type=checkbox]:checked{background:var(--plum);border-color:var(--plum)}
.check input:checked::before,.field input[type=checkbox]:checked::before,.form input[type=checkbox]:checked::before{transform:rotate(-45deg) scale(1)}
.check input:focus-visible,.form input[type=checkbox]:focus-visible{outline:2px solid var(--plum);outline-offset:3px;border-radius:3px}
.check input:user-invalid,.form input[type=checkbox]:user-invalid{border-color:#b3261e}
@media (prefers-reduced-motion:reduce){.check input::before,.form input[type=checkbox]::before{transition:none}}
@media (min-width:921px){.reg-card{padding:36px 40px 40px}}

/* ---------- a post's related posts, a tag's count, an office page ---------- */
.related{padding:56px 0 64px;border-top:var(--hair) solid var(--line)}
.related .peers-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:24px}
.related .peers-head h2{font-size:1.6rem}
.phead-count{margin-top:10px;color:var(--muted)}
.loc-photo img{width:100%;height:auto;aspect-ratio:var(--photo-ratio);object-fit:cover;border-radius:var(--radius-img);background:var(--wash-deep)}
@media (min-width:921px){.related{padding:80px 0 96px}}

/* side panel (Eric 2026-10-11): every pill and button in it is solid plum with white text, outline ones included */
.side-panel .btn,.side-panel .btn-line,.side-panel .btn-plum{background:var(--plum);border-color:var(--plum);color:var(--white)}
.side-panel .btn:hover,.side-panel .btn-line:hover,.side-panel .btn-plum:hover{background:var(--plum-deep);border-color:var(--plum-deep);color:var(--white)}

/* ---------- contact (Eric 2026-10-11): title on the photo, a short intro, the
   form early (first on a phone, beside the facts from 921px), the rest after ---------- */
.contact-intro{padding-bottom:28px}
.contact-intro>.prose{max-width:40em;font-size:1.06rem;line-height:1.65;color:var(--ink-2)}
.contact-grid{padding-bottom:56px}
.form-card-sub{margin:0;color:var(--muted);font-size:.95rem}
.contact-side-h{font-size:1.4rem;margin:0}
.contact-side .cv-facts{margin-top:0}
.form .cf-turnstile{margin-top:20px;min-height:65px}
.form .btn{min-height:48px;padding-left:28px;padding-right:28px}
@media (max-width:599px){.form .btn,.contact-book{justify-self:stretch;width:100%}}
/* a field the person has touched and left wrong says so (red edge + a line), never before */
.field input:user-invalid,.field textarea:user-invalid{border-color:#b3261e;box-shadow:inset 0 0 0 1px #b3261e}
.field:has(:user-invalid)::after{content:"Please fill this in correctly.";font-size:.86rem;color:#9b1c14}
.field:has(input[type=email]:user-invalid)::after{content:"Please check the email address."}
.flash{font-size:.95rem;line-height:1.5}
.flash.err{border:1px solid #e3b4a6}
.contact-more{padding-bottom:80px}
.contact-more>.prose{max-width:40em;border-top:1px solid var(--line);padding-top:48px}
@media (min-width:921px){.contact-intro{padding-bottom:40px}.contact-grid{padding-bottom:72px}.contact-more{padding-bottom:104px}.contact-more>.prose{padding-top:64px}}
.pg-hero-cap h1{line-height:1.04;text-wrap:balance;max-width:none}
@media (min-width:921px){.pg-hero-cap h1{max-width:72%}}
.pg-hero-cap .eyebrow,.pg-hero-cap .eyebrow a{color:var(--lime)}