/* ==========================================================================
   SERVICE PAGE components (service-hero, intro, advantage, process, faq, lakeway)
   ========================================================================== */
.echo .service-meta { display: inline-flex; align-items: center; gap: 0.75rem; padding: 0.5rem 1rem; border-radius: 100px; background: rgb(var(--t-forest-rgb) / 0.04); border: 1px solid var(--q-border); margin-bottom: 1.6rem; font-size: 0.82rem; font-weight: 500; color: var(--q-text); }
.echo .service-meta .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--q-gold); box-shadow: 0 0 0 4px rgb(var(--t-gold-rgb) / 0.2); }
.echo .hero-trust { display: flex; gap: 2.2rem; flex-wrap: wrap; padding-top: 2rem; margin-top: 2.5rem; border-top: 1px solid var(--q-border); }
.echo .trust-item { display: flex; align-items: center; gap: 0.6rem; font-size: 0.88rem; color: var(--q-muted); }
.echo .trust-item svg { color: var(--q-gold); flex-shrink: 0; }
.echo .intro { background: var(--q-cream); }
.echo .intro-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; align-items: center; }
.echo .intro-points { list-style: none; margin: 2rem 0 0; padding: 0; }
.echo .intro-points li { padding: 1rem 0; border-top: 1px solid var(--q-border); display: flex; gap: 1rem; align-items: flex-start; }
.echo .intro-points li:last-child { border-bottom: 1px solid var(--q-border); }
.echo .intro-points .num { font-family: var(--q-serif); font-style: italic; color: var(--q-gold); font-size: 1.25rem; min-width: 32px; padding-top: 2px; }
.echo .intro-points strong { display: block; color: var(--q-text); font-weight: 600; margin-bottom: 0.2rem; font-size: 0.98rem; }
.echo .intro-points span { font-size: 0.92rem; color: var(--q-muted); }

/* Founder bio — Her Why. Scoped so service-page .intro grids stay untouched.
   The previous portrait was a letterboxed webp inside a 1fr column, which
   read as a black tablet floating in leftover cream. */
.echo .intro--founder { padding-block: clamp(3.5rem, 6vw, 6.25rem); }
.echo .intro--founder .intro-grid {
  grid-template-columns: minmax(260px, 0.88fr) minmax(300px, 1.12fr);
  gap: clamp(1.75rem, 3.5vw, 3.5rem);
  align-items: start;
}
.echo .intro--founder .intro-portrait {
  margin: 0;
  border-radius: var(--q-rxl);
  overflow: hidden;
  aspect-ratio: 4 / 5;
  background: var(--q-sand);
  border: 1px solid var(--q-border);
  box-shadow: var(--q-shadow-md);
}
.echo .intro--founder .intro-portrait img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 8%;
  display: block;
  filter: saturate(0.95) contrast(1.02);
}
.echo .intro--founder .eyebrow { display: inline-block; margin-bottom: 0.85rem; }
.echo .intro--founder .intro-quote {
  font-size: clamp(1.6rem, 2.8vw, 2.6rem);
  line-height: 1.22;
  letter-spacing: -0.025em;
  text-wrap: balance;
  margin: 0 0 1.2rem;
  max-width: 18ch;
}
.echo .intro--founder .intro-copy > p { max-width: 62ch; }
.echo .intro--founder .intro-points { margin-top: 1.35rem; }
.echo .adv-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.2rem; }
.echo .adv-card { background: var(--t-white); border-radius: var(--q-rlg); padding: 2rem 1.75rem; border: 1px solid var(--q-border); transition: all 0.4s var(--q-ease); position: relative; }
.echo .adv-card:hover { transform: translateY(-2px); box-shadow: var(--q-shadow-lg); border-color: rgb(var(--t-gold-rgb) / 0.3); }
.echo .adv-card.featured { background: linear-gradient(160deg, var(--q-forest) 0%, var(--q-forest-deep) 100%); color: var(--q-cream); border: none; }
.echo .adv-card.featured h4 { color: var(--q-cream); }
.echo .adv-card.featured p { color: rgb(var(--t-cream-rgb) / 0.72); }
.echo .adv-card.featured::before { content: 'RECOMMENDED'; position: absolute; top: 1.25rem; right: 1.25rem; font-size: 0.62rem; letter-spacing: 0.15em; font-weight: 600; color: var(--q-gold); padding: 0.3rem 0.65rem; border-radius: 100px; background: rgb(var(--t-gold-rgb) / 0.15); border: 1px solid rgb(var(--t-gold-rgb) / 0.3); }
.echo .adv-icon { width: 52px; height: 52px; border-radius: 14px; background: linear-gradient(135deg, rgb(var(--t-sage-rgb) / 0.15), rgb(var(--t-gold-rgb) / 0.15)); display: flex; align-items: center; justify-content: center; color: var(--q-forest); margin-bottom: 1.4rem; }
.echo .adv-card.featured .adv-icon { background: rgb(var(--t-gold-rgb) / 0.18); color: var(--q-gold); }
.echo .adv-card h4 { margin-bottom: 0.5rem; font-size: 1.2rem; }
.echo .adv-card .tag { display: inline-block; font-size: 0.72rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--q-muted); margin-bottom: 1rem; font-weight: 500; }
.echo .adv-card.featured .tag { color: var(--q-gold-soft); }
.echo .adv-card p { font-size: 0.92rem; margin-bottom: 1.4rem; }
.echo .adv-list { list-style: none; padding: 0; margin: 0; }
.echo .adv-list li { font-size: 0.85rem; color: var(--q-muted); padding: 0.55rem 0; display: flex; align-items: center; gap: 0.6rem; border-top: 1px solid var(--q-border); }
.echo .adv-card.featured .adv-list li { color: rgb(var(--t-cream-rgb) / 0.7); border-color: rgb(var(--t-cream-rgb) / 0.08); }
.echo .adv-list .check { color: var(--q-gold); flex-shrink: 0; }
.echo .adv-list .x { color: rgb(var(--t-forest-rgb) / 0.25); flex-shrink: 0; }
.echo .process { background: var(--q-cream); }
.echo .process-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; position: relative; }
.echo .process-grid::before { content: ''; position: absolute; top: 40px; left: 12.5%; right: 12.5%; height: 1px; background: linear-gradient(90deg, transparent, var(--q-gold), var(--q-gold), transparent); opacity: 0.3; z-index: 0; }
.echo .step { position: relative; z-index: 1; background: var(--t-white); border-radius: var(--q-rlg); padding: 2rem 1.75rem; border: 1px solid var(--q-border); transition: all 0.4s ease; }
.echo .step:hover { transform: translateY(-2px); box-shadow: var(--q-shadow-lg); border-color: rgb(var(--t-gold-rgb) / 0.3); }
.echo .step-num { width: 56px; height: 56px; border-radius: 50%; background: var(--q-cream); border: 1px solid var(--q-border); display: flex; align-items: center; justify-content: center; font-family: var(--q-serif); font-style: italic; font-size: 1.5rem; color: var(--q-gold); margin-bottom: 1.4rem; transition: all 0.4s ease; }
.echo .step:hover .step-num { background: var(--q-forest); color: var(--q-gold); border-color: var(--q-forest); }
.echo .step h4 { margin-bottom: 0.7rem; font-size: 1.2rem; }
.echo .step p { font-size: 0.92rem; }
.echo .lakeway { background: var(--q-forest-deep); color: var(--q-cream); position: relative; overflow: hidden; }
.echo .lakeway::before { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse 50% 40% at 80% 30%, rgb(var(--t-gold-rgb) / 0.15), transparent 70%), radial-gradient(ellipse 40% 50% at 10% 70%, rgb(var(--t-sage-rgb) / 0.12), transparent 70%); }
.echo .lakeway-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; align-items: center; position: relative; }
.echo .lakeway-content h2 { color: var(--q-cream); margin-bottom: 1.4rem; }
.echo .lakeway-content .eyebrow { color: var(--q-gold-soft); margin-bottom: 1.1rem; display: inline-block; }
.echo .lakeway-content .em-gold { color: var(--q-gold-soft); -webkit-text-fill-color: var(--q-gold-soft); background: none; }
.echo .lakeway-content p { color: rgb(var(--t-cream-rgb) / 0.72); margin-bottom: 1.1rem; }
.echo .lakeway-areas { margin-top: 2.2rem; padding-top: 2rem; border-top: 1px solid rgb(var(--t-cream-rgb) / 0.1); display: flex; flex-wrap: wrap; gap: 0.6rem; }
.echo .area-tag { padding: 0.5rem 1rem; border-radius: 100px; background: rgb(var(--t-cream-rgb) / 0.05); border: 1px solid rgb(var(--t-cream-rgb) / 0.1); font-size: 0.82rem; color: rgb(var(--t-cream-rgb) / 0.8); transition: all 0.3s ease; }
.echo .area-tag:hover { background: rgb(var(--t-gold-rgb) / 0.15); border-color: rgb(var(--t-gold-rgb) / 0.3); color: var(--q-gold-soft); }
.echo .faq { background: var(--q-cream); }
.echo .faq-grid { display: grid; grid-template-columns: 1fr 1.4fr; gap: 4rem; align-items: flex-start; }
.echo .faq-left { position: sticky; top: 7rem; }
.echo .faq-list { display: flex; flex-direction: column; gap: 0.75rem; }
.echo .faq-item { background: var(--t-white); border: 1px solid var(--q-border); border-radius: var(--q-rmd); overflow: hidden; transition: all 0.3s ease; }
.echo .faq-item:hover { border-color: rgb(var(--t-gold-rgb) / 0.3); }
.echo .faq-item.open { border-color: rgb(var(--t-gold-rgb) / 0.4); box-shadow: var(--q-shadow-md); }
.echo .faq-q { width: 100%; padding: 1.4rem 1.6rem; display: flex; justify-content: space-between; align-items: center; text-align: left; font-size: 1rem; font-weight: 500; color: var(--q-text); cursor: pointer; background: none; border: none; font-family: inherit; }
.echo .faq-toggle { width: 28px; height: 28px; border-radius: 50%; background: var(--q-cream); display: flex; align-items: center; justify-content: center; flex-shrink: 0; margin-left: 1rem; transition: all 0.3s ease; color: var(--q-gold); font-size: 1.1rem; }
.echo .faq-item.open .faq-toggle { background: var(--q-forest); transform: rotate(45deg); }
.echo .faq-a { max-height: 0; overflow: hidden; transition: max-height 0.4s var(--q-ease); }
.echo .faq-item.open .faq-a { max-height: 1500px; } /* B12: was 400px — clipped long answers */
.echo .faq-a-inner { padding: 0 1.6rem 1.5rem; font-size: 0.95rem; line-height: 1.65; color: var(--q-muted); }

/* ---------- CONTACT page ---------- */
.echo .q-contact-grid { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 3.5rem; align-items: start; }
.echo .q-contact-card { background: rgb(var(--t-white-rgb) / 0.72); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); border: 1px solid rgb(var(--t-white-rgb) / 0.9); border-radius: 20px; padding: 2.6rem; box-shadow: var(--q-shadow-md); transition: box-shadow 0.4s var(--q-ease), transform 0.4s var(--q-ease); }
.echo .q-contact-card:hover { box-shadow: var(--q-shadow-lg); transform: translateY(-2px); }
.echo .q-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1.4rem; }
.echo .q-field { margin-bottom: 1.4rem; }
.echo .q-field label { display: block; font-size: 0.74rem; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--q-muted); margin-bottom: 0.55rem; }
.echo .q-field input, .echo .q-field select, .echo .q-field textarea { width: 100%; padding: 0.9rem 1.1rem; border: 1px solid var(--q-border); border-radius: 12px; background: var(--t-white); font-family: "Inter", sans-serif; font-size: 1rem; color: var(--q-text); transition: border-color 0.25s ease, box-shadow 0.25s ease; outline: none; }
.echo .q-field input:focus, .echo .q-field select:focus, .echo .q-field textarea:focus { border-color: var(--q-gold); outline: 2px solid var(--q-forest); outline-offset: 1px; box-shadow: 0 0 0 3px rgb(var(--t-gold-rgb) / 0.45); }
.echo .q-field textarea { resize: vertical; min-height: 130px; }
.echo .q-submit { width: 100%; background: var(--q-forest); color: var(--q-cream); padding: 1.05rem 2rem; border-radius: 50px; border: none; font-family: "Inter", sans-serif; font-size: 0.95rem; font-weight: 600; letter-spacing: 0.03em; cursor: pointer; transition: all 0.3s ease; }
.echo .q-submit:hover { background: var(--q-gold); color: var(--q-forest-deep); transform: translateY(-2px); box-shadow: 0 8px 20px rgb(var(--t-gold-rgb) / 0.3); }
.echo .q-info-block { margin-bottom: 2.4rem; }
.echo .q-info-block h3 { font-size: 1.4rem; margin-bottom: 1rem; }
.echo .q-info-item { display: flex; align-items: flex-start; gap: 1rem; margin-bottom: 1rem; padding: 1.4rem; background: var(--t-white); border: 1px solid var(--q-border); border-radius: 16px; transition: all 0.3s ease; }
.echo .q-info-item:hover { box-shadow: var(--q-shadow-md); border-color: rgb(var(--t-gold-rgb) / 0.3); }
.echo .q-info-icon { width: 46px; height: 46px; border-radius: 12px; background: linear-gradient(135deg, var(--q-gold), rgb(var(--t-gold-rgb) / 0.3)); display: flex; align-items: center; justify-content: center; flex-shrink: 0; color: var(--q-forest); }
.echo .q-info-item h4 { font-family: "Inter", sans-serif; font-size: 0.9rem; font-weight: 600; margin-bottom: 0.2rem; color: var(--q-text); }
.echo .q-info-item p, .echo .q-info-item a { font-size: 0.92rem; color: var(--q-muted); margin: 0; }
.echo .q-info-item a:hover { color: var(--q-gold); }
.echo .q-contact-hero { padding: 8rem 0 3rem; text-align: center; position: relative; overflow: hidden; }
.echo .q-contact-hero .container { position: relative; z-index: 2; max-width: 760px; }
.echo .q-contact-hero h1 { margin: 1rem 0 1.2rem; }
.echo .q-contact-hero p { font-size: 1.1rem; max-width: 600px; margin: 0 auto; }

/* ==========================================================================
   SERVICE PAGE additions (2026-06-16): nav-crop fix, hero photo, dark framework,
   spoke "help" cards, Lakeway light variant + pull-quote.
   ========================================================================== */

/* Nav-overlap fix for pages NOT yet ported to .echo (still using the old cover
   hero): push the centered hero content below the fixed glass nav. */
.thrive-hero .wp-block-cover__inner-container { padding-top: 4.5rem; }

/* hero photo panel (service-page hero right column) */
.echo .q-hero-photo { position: relative; border-radius: var(--q-rxl); overflow: hidden; box-shadow: var(--q-shadow-lg); aspect-ratio: 4 / 5; border: 1px solid rgb(var(--t-forest-rgb) / 0.06); }
.echo .q-hero-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.echo .q-hero-photo .q-hero-badge { left: 1.2rem; right: 1.2rem; transform: none; width: auto; max-width: none; bottom: 1.2rem; }
/* Kristine clinic shot is a tall standing frame. Do not cover-crop it —
   the 4:5 box + 20px radius was shearing her hair. Show the top-weighted
   4:5 file at its own ratio so the crown stays inside the frame. */
.echo .q-hero-visual .q-hero-photo.q-hero-photo--kristine { aspect-ratio: 2 / 3; }
.echo .q-hero-visual .q-hero-photo.q-hero-photo--kristine img { object-fit: cover; object-position: top center; }

/* framework — DARK variant (alternates with the light one) */
.echo .framework.dark { background: linear-gradient(180deg, var(--q-forest) 0%, var(--q-forest-deep) 100%); color: var(--q-cream); }
.echo .framework.dark::before { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse 50% 40% at 80% 20%, rgb(var(--t-gold-rgb) / 0.14), transparent 70%), radial-gradient(ellipse 40% 50% at 10% 80%, rgb(var(--t-sage-rgb) / 0.12), transparent 70%); }
.echo .framework.dark .container { position: relative; z-index: 1; }
.echo .framework.dark .section-head h2 { color: var(--q-cream); }
.echo .framework.dark .section-head p { color: rgb(var(--t-cream-rgb) / 0.7); }
.echo .framework.dark .em-gold { color: var(--q-gold-soft); -webkit-text-fill-color: var(--q-gold-soft); background: none; }
.echo .framework.dark .phase { background: rgb(var(--t-cream-rgb) / 0.04); border-color: rgb(var(--t-cream-rgb) / 0.08); }
.echo .framework.dark .phase:hover { background: rgb(var(--t-cream-rgb) / 0.07); box-shadow: none; }
.echo .framework.dark .phase h3 { color: var(--q-cream); }
.echo .framework.dark .phase p { color: rgb(var(--t-cream-rgb) / 0.7); }
.echo .framework.dark .phase-list li { color: rgb(var(--t-cream-rgb) / 0.7); border-color: rgb(var(--t-cream-rgb) / 0.08); }

/* bento "The Signs" — DARK section variant (the dark symptom grid) */
.echo .symptoms.dark { background: linear-gradient(180deg, var(--q-forest) 0%, var(--q-forest-deep) 100%); color: var(--q-cream); position: relative; overflow: hidden; }
.echo .symptoms.dark::before { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse 50% 40% at 85% 15%, rgb(var(--t-gold-rgb) / 0.13), transparent 70%), radial-gradient(ellipse 40% 50% at 5% 85%, rgb(var(--t-sage-rgb) / 0.12), transparent 70%); }
.echo .symptoms.dark .container { position: relative; z-index: 1; }
.echo .symptoms.dark .section-head h2 { color: var(--q-cream); }
.echo .symptoms.dark .section-head p { color: rgb(var(--t-cream-rgb) / 0.7); }
.echo .symptoms.dark .em-gold { color: var(--q-gold-soft); -webkit-text-fill-color: var(--q-gold-soft); background: none; }
.echo .symptoms.dark .bento-card { background: rgb(var(--t-cream-rgb) / 0.04); border: 1px solid rgb(var(--t-cream-rgb) / 0.08); color: var(--q-cream); }
.echo .symptoms.dark .bento-card:hover { background: rgb(var(--t-cream-rgb) / 0.07); border-color: rgb(var(--t-gold-rgb) / 0.3); }
.echo .symptoms.dark .bento-card h3 { color: var(--q-cream); }
.echo .symptoms.dark .bento-card p { color: rgb(var(--t-cream-rgb) / 0.68); }
.echo .symptoms.dark .bento-card.accent { background: linear-gradient(135deg, rgb(var(--t-gold-rgb) / 0.2), rgb(var(--t-gold-rgb) / 0.05)); border-color: rgb(var(--t-gold-rgb) / 0.25); }
.echo .symptoms.dark .icon-wrap { background: rgb(var(--t-cream-rgb) / 0.08); color: var(--q-gold); }

/* "How We Can Help" — spoke link cards */
.echo .help { background: linear-gradient(180deg, var(--q-sand) 0%, var(--q-cream) 100%); }
.echo .help-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.2rem; }
.echo .help-card { display: flex; flex-direction: column; background: var(--t-white); border: 1px solid var(--q-border); border-radius: var(--q-rlg); padding: 1.9rem; transition: all 0.4s var(--q-ease); }
.echo .help-card:hover { transform: translateY(-2px); box-shadow: var(--q-shadow-lg); border-color: rgb(var(--t-gold-rgb) / 0.3); }
.echo .help-card h4 { margin-bottom: 0.5rem; font-size: 1.2rem; }
.echo .help-card p { font-size: 0.92rem; margin-bottom: 1.2rem; flex: 1; }
.echo .help-link { font-size: 0.8rem; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--q-forest); display: inline-flex; align-items: center; gap: 0.4rem; }
.echo .help-card:hover .help-link { color: var(--q-gold); }
.echo .help-link svg { transition: transform 0.3s ease; }
.echo .help-card:hover .help-link svg { transform: translateX(3px); }

/* Lakeway — LIGHT variant + member pull-quote (used inside the dark band too) */
.echo .lakeway.light { background: var(--q-cream); color: var(--q-text); }
.echo .lakeway.light::before { display: none; }
.echo .lakeway.light .lakeway-content h2 { color: var(--q-text); }
.echo .lakeway.light .lakeway-content p { color: var(--q-muted); }
.echo .lakeway.light .lakeway-content .eyebrow { color: var(--q-gold); }
.echo .lakeway.light .lakeway-content .em-gold { color: var(--q-gold); -webkit-text-fill-color: var(--q-gold); }
.echo .lakeway.light .lakeway-areas { border-color: var(--q-border); }
.echo .lakeway.light .area-tag { background: rgb(var(--t-forest-rgb) / 0.04); border-color: var(--q-border); color: var(--q-muted); }
.echo .lakeway-quote { margin: 0; padding: 1.6rem 0 0; font-family: var(--q-serif); font-style: italic; font-size: 1.35rem; line-height: 1.4; color: var(--q-cream); }
.echo .lakeway-quote cite { display: block; margin-top: 0.9rem; font-style: normal; font-family: "Inter", sans-serif; font-size: 0.78rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--q-gold-soft); }

/* membership — "What's Included" dual checklist */
.echo .includes { background: var(--q-cream); }
.echo .includes-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; }
.echo .include-col { background: var(--t-white); border: 1px solid var(--q-border); border-radius: var(--q-rlg); padding: 2.4rem; box-shadow: var(--q-shadow-md); }
.echo .include-col h3 { margin-bottom: 1.4rem; }
.echo .check-list { list-style: none; margin: 0; padding: 0; }
.echo .check-list li { display: flex; gap: 0.8rem; align-items: flex-start; padding: 0.8rem 0; border-top: 1px solid var(--q-border); font-size: 0.95rem; color: var(--q-muted); }
.echo .check-list li:first-child { border-top: none; }
.echo .check-list svg { color: var(--q-gold); flex-shrink: 0; margin-top: 3px; }
.echo .member-badge { display: inline-block; margin-top: 1.6rem; padding: 0.5rem 1.1rem; border-radius: 100px; background: rgb(var(--t-gold-rgb) / 0.12); border: 1px solid rgb(var(--t-gold-rgb) / 0.3); font-size: 0.78rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--q-forest); font-weight: 600; }

/* long-form ARTICLE prose — 900px column, inside the 1320px container */
.echo .article { background: var(--q-cream); }
.echo .article.dark { background: linear-gradient(180deg, var(--q-forest) 0%, var(--q-forest-deep) 100%); color: var(--q-cream); position: relative; overflow: hidden; }
.echo .article.dark::before { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse 50% 40% at 85% 15%, rgb(var(--t-gold-rgb) / 0.12), transparent 70%), radial-gradient(ellipse 40% 50% at 5% 85%, rgb(var(--t-sage-rgb) / 0.1), transparent 70%); }
.echo .article .container { position: relative; z-index: 1; }
.echo .prose { max-width: 900px; margin: 0 auto; }
.echo .prose > .eyebrow { display: inline-block; margin-bottom: 1rem; }
.echo .prose h2 { font-size: clamp(1.9rem, 3.5vw, 2.75rem); margin: 0 0 1.1rem; }
.echo .prose h3 { font-size: clamp(1.3rem, 2vw, 1.6rem); margin: 2rem 0 0.8rem; }
.echo .prose p { font-size: 1.125rem; line-height: 1.7; margin: 0 0 1.2rem; }
.echo .prose ul, .echo .prose ol { margin: 0 0 1.4rem; padding-left: 1.3rem; }
.echo .prose li { font-size: 1.04rem; line-height: 1.65; color: var(--q-muted); margin: 0.4rem 0; }
.echo .prose a { color: var(--q-forest); border-bottom: 1px solid rgb(var(--t-gold-rgb) / 0.5); transition: color .2s ease, border-color .2s ease; }
.echo .prose a:hover { color: var(--q-gold); border-color: var(--q-gold); }
.echo .prose blockquote { margin: 1.8rem 0; padding: 1.2rem 1.6rem; border-left: 3px solid var(--q-gold); background: rgb(var(--t-gold-rgb) / 0.07); border-radius: 0 12px 12px 0; font-style: italic; color: var(--q-text); }
.echo .prose .callout { margin: 1.8rem 0; padding: 1.3rem 1.5rem; border: 1px solid var(--q-border); border-radius: 14px; background: var(--t-white); font-size: 0.96rem; }
.echo .prose .callout strong { color: var(--q-forest); }
.echo .article.dark .prose h2, .echo .article.dark .prose h3 { color: var(--q-cream); }
.echo .article.dark .prose p { color: rgb(var(--t-cream-rgb) / 0.78); }
.echo .article.dark .prose li { color: rgb(var(--t-cream-rgb) / 0.72); }
.echo .article.dark .prose .em-gold, .echo .article.dark .em-gold { color: var(--q-gold-soft); -webkit-text-fill-color: var(--q-gold-soft); background: none; }
.echo .article.dark .prose a { color: var(--q-gold-soft); border-color: rgb(var(--t-gold-soft-rgb) / 0.5); }
.echo .article.dark .prose blockquote { background: rgb(var(--t-cream-rgb) / 0.05); color: var(--q-cream); }
.echo .article.dark .prose .callout { background: rgb(var(--t-cream-rgb) / 0.04); border-color: rgb(var(--t-cream-rgb) / 0.12); color: rgb(var(--t-cream-rgb) / 0.8); }
.echo .article.dark .prose .callout strong { color: var(--q-gold-soft); } /* dark-on-dark fix: readable gold lead-in on dark callouts */

/* symptom checklist — interactive grouped checkboxes */
.echo .sc { background: var(--q-cream); }
.echo .sc-card { max-width: 860px; margin: 0 auto; background: rgb(var(--t-white-rgb) / 0.72); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); border: 1px solid rgb(var(--t-white-rgb) / 0.9); border-radius: 20px; padding: 2.6rem; box-shadow: var(--q-shadow-md); }
.echo .sc-group { margin-bottom: 1.8rem; }
.echo .sc-group > h4 { font-family: "Inter", sans-serif; font-size: 0.76rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--q-gold); margin-bottom: 0.9rem; font-weight: 600; }
.echo .sc-options { display: grid; grid-template-columns: 1fr 1fr; gap: 0.6rem; }
.echo .sc-option { display: flex; align-items: center; gap: 0.65rem; padding: 0.8rem 1rem; border: 1px solid var(--q-border); border-radius: 12px; background: var(--t-white); cursor: pointer; font-size: 0.92rem; color: var(--q-text); transition: border-color 0.2s ease, background 0.2s ease; }
.echo .sc-option:hover { border-color: rgb(var(--t-gold-rgb) / 0.45); }
.echo .sc-option input { accent-color: var(--q-forest); width: 18px; height: 18px; flex-shrink: 0; margin: 0; }
.echo .sc-option:has(input:checked) { border-color: var(--q-gold); background: rgb(var(--t-gold-rgb) / 0.08); }
.echo .sc-divider { height: 1px; background: var(--q-border); margin: 2rem 0; }
.echo .sc-result { display: none; margin-top: 1.4rem; padding: 1.2rem 1.4rem; border-radius: 12px; background: rgb(var(--t-gold-rgb) / 0.1); border: 1px solid rgb(var(--t-gold-rgb) / 0.3); font-size: 0.95rem; color: var(--q-text); }
.echo .sc-result.show { display: block; }

/* faq-left rail (headline + Ask a Physician CTA) */
.echo .faq-left h2 { margin-bottom: 1.1rem; }
.echo .faq-left p { margin-bottom: 1.8rem; }

/* ---------- MEMBERSHIPS PAGE — centered packages (hero unchanged) ---------- */
.echo.memberships-layout .strip-inner,
.echo .memberships-layout .strip-inner { justify-content: center; gap: clamp(2rem, 5vw, 4rem); }
.echo.memberships-layout .strip-item,
.echo .memberships-layout .strip-item { flex-direction: column; align-items: center; text-align: center; gap: 0.35rem; }
.echo.memberships-layout .strip-label,
.echo .memberships-layout .strip-label { max-width: 140px; }
.echo.memberships-layout .adv-grid,
.echo .memberships-layout .adv-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 1080px; margin-left: auto; margin-right: auto; }
.echo.memberships-layout .adv-card,
.echo .memberships-layout .adv-card { text-align: center; display: flex; flex-direction: column; align-items: center; }
.echo.memberships-layout .adv-card .tag,
.echo .memberships-layout .adv-card .tag { text-align: center; }
.echo.memberships-layout .adv-card p,
.echo .memberships-layout .adv-card p { text-align: center; }
.echo.memberships-layout .adv-list,
.echo .memberships-layout .adv-list { width: 100%; }
.echo.memberships-layout .adv-list li,
.echo .memberships-layout .adv-list li { justify-content: center; text-align: center; }
.echo.memberships-layout .bento,
.echo .memberships-layout .bento { max-width: 1140px; margin-left: auto; margin-right: auto; }
.echo.memberships-layout .bento-card,
.echo .memberships-layout .bento-card { text-align: center; align-items: center; }
.echo.memberships-layout .bento-card .btn-gold,
.echo.memberships-layout .bento-card .btn-primary,
.echo .memberships-layout .bento-card .btn-gold,
.echo .memberships-layout .bento-card .btn-primary { margin-left: auto; margin-right: auto; }
.echo.memberships-layout .membership-grid,
.echo .memberships-layout .membership-grid { max-width: 1080px; margin-left: auto; margin-right: auto; }
.echo.memberships-layout .perk,
.echo .memberships-layout .perk { text-align: center; display: flex; flex-direction: column; align-items: center; }
.echo.memberships-layout .perk-icon,
.echo .memberships-layout .perk-icon { margin-left: auto; margin-right: auto; }
.echo.memberships-layout .framework-grid,
.echo .memberships-layout .framework-grid { max-width: 1080px; margin-left: auto; margin-right: auto; }
.echo.memberships-layout .phase,
.echo .memberships-layout .phase { text-align: center; }
.echo.memberships-layout .phase-list li,
.echo .memberships-layout .phase-list li { justify-content: center; }

/* Live catalog (practice portal deploys) — matches tier/special adv-cards */
.echo .mm-live-grid,
.echo .adv-grid.mm-live-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1.25rem;
  max-width: 1140px;
  margin: 0 auto;
  grid-template-columns: unset;
}
.echo .memberships-layout .mm-live-grid .adv-card,
.echo .memberships-layout .mm-live-grid .mm-live-card,
.echo #live-specials .mm-live-grid .adv-card,
.echo #live-packages .mm-live-grid .adv-card,
.echo #live-shop .mm-live-grid .adv-card {
  flex: 0 1 320px;
  max-width: 380px;
  width: 100%;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.echo .mm-live-card .tag { text-align: center; }
.echo .mm-live-card h4 { font-size: 1.2rem; margin-bottom: 0.35rem; }
.echo .mm-live-card .mm-live-price {
  font-family: var(--q-serif);
  font-size: 2.6rem;
  font-style: italic;
  font-weight: 400;
  line-height: 1;
  color: var(--q-gold-ink);
  margin: 0.3rem 0 0.25rem;
}
.echo .mm-live-card.featured .mm-live-price,
.echo .adv-card.featured.mm-live-card .mm-live-price {
  color: var(--q-gold-soft);
}
.echo .mm-live-card .mm-live-period,
.echo .mm-live-card .mm-live-dates {
  font-size: 0.82rem;
  color: var(--q-muted);
  margin-bottom: 1rem;
}
.echo .adv-card.featured.mm-live-card .mm-live-period,
.echo .adv-card.featured.mm-live-card .mm-live-dates {
  color: rgb(var(--t-cream-rgb) / 0.6);
}
.echo .mm-live-card .mm-live-services {
  font-size: 0.88rem;
  margin-bottom: 0.75rem;
  color: var(--q-muted);
}
.echo .adv-card.featured.mm-live-card .mm-live-services {
  color: rgb(var(--t-cream-rgb) / 0.72);
}
.echo .mm-live-card .adv-list {
  width: 100%;
  text-align: left;
  margin: 0.5rem 0 0;
}
.echo .memberships-layout .mm-live-card .adv-list li,
.echo #live-specials .mm-live-card .adv-list li,
.echo #live-packages .mm-live-card .adv-list li,
.echo #live-shop .mm-live-card .adv-list li {
  justify-content: flex-start;
  text-align: left;
}
.echo .mm-live-card .mm-live-notes {
  font-size: 0.82rem;
  margin-top: 0.75rem;
  color: var(--q-muted);
  text-align: center;
}
.echo .adv-card.featured.mm-live-card .mm-live-notes {
  color: rgb(var(--t-cream-rgb) / 0.65);
}
.echo .mm-live-card .btn-gold,
.echo .mm-live-card .btn-secondary {
  margin-top: auto;
  padding-top: 1.25rem;
}
.echo .mm-live-empty {
  text-align: center;
  max-width: 520px;
  margin: 0 auto;
}

