/* global React */
// Read-on-web version of "The Coordination Blueprint".
// Editorial layout: drop-cap intro, 8 numbered steps, each with a Yourself / Carte split.
// Copy source: uploads/Lead Magnet 3 - The Coordination Blueprint v2.md

const STEPS = [
  {
    n: "I",
    title: "Consolidate records in one place",
    why: "Every doctor your loved one sees has access to a slice of his or her medical history &mdash; the slice that institution generated. No single doctor has the whole picture. When a new specialist asks &lsquo;why are you on this medication&rsquo; and your loved one answers from memory, the answer is often incomplete. When the new specialist asks &lsquo;have you had this test done before,&rsquo; nobody has the test technique to compare against.",
    doIt: "Maintain a single shared repository, indexed and searchable, that contains: imaging reports and the original image files (request the CDs or the imaging-portal logins, not just the reports), pathology reports and the slides if available, longitudinal lab values, specialist consult notes, hospital discharge summaries, vital signs, device reports, remote monitoring, and a current medication list. Update it after every appointment.",
    carteIt: "We build a physician-reviewed health dossier for each Stewardship client and maintain it as a living document. We catch and correct errors in the underlying records &mdash; a misdated test, a duplicated medication, a wrong allergy listing &mdash; and we coordinate with the originating institutions to fix them at the source, not just in our copy.",
  },
  {
    n: "II",
    title: "Reconcile the full medication list",
    why: "Medication errors are one of the leading preventable causes of hospitalization. Polypharmacy &mdash; being on more than five medications simultaneously &mdash; doubles fall risk and significantly raises the rate of drug-drug interactions. Most patients on five or more medications are receiving prescriptions from three or more physicians who are not coordinating with each other.",
    doIt: "Build a complete current list: every prescription, every over-the-counter medication, every supplement, with the dose, the schedule, and the prescribing physician. Cross-check the pharmacy&rsquo;s records against the actual bottles. Then have one physician &mdash; ideally a primary care physician or geriatrician &mdash; formally reconcile the list and identify duplications, interactions, and prescriptions that may no longer be necessary.",
    carteIt: "Our physicians review the complete medication list on every Stewardship engagement. We check for high-risk medications, reconcile across all prescribers, and propose de-prescribing wherever the risk-benefit math has shifted. We have the conversation with each prescribing physician individually so the changes are made with their input, not around them.",
  },
  {
    n: "III",
    title: "Map the specialists and their roles",
    why: "Some conditions cross specialties. Heart failure with kidney disease and diabetes is not one specialist&rsquo;s responsibility &mdash; it is three. Without an explicit map of who is responsible for what, decisions either fall between the cracks or get made twice in conflicting directions.",
    doIt: "Build a &lsquo;team map&rsquo; listing each specialist your loved one sees, the condition(s) they are managing, the date of the last visit, the date of the next, any specific questions or decisions that are open with that specialist right now, and how well that specialist is addressing your loved one&rsquo;s needs. Update it after every appointment.",
    carteIt: "We draw the map and when necessary we redraw it. We meet and build direct lines of communication with everyone on your loved one&rsquo;s team, and make sure each specialist is the right person for the job they are assigned. We also integrate across the plans so the overall plan is informed appropriately by all parties.",
  },
  {
    n: "IV",
    title: "Schedule in the right sequence, at the right facilities",
    why: "Doing labs after a specialist visit usually wastes the visit. Doing imaging at the wrong facility usually means the imaging gets repeated. Order matters. Venue matters. Acing both takes deliberate effort.",
    doIt: "Before any specialist visit, figure out what should be done before the appointment so that the visit is productive. Schedule labs and imaging as early as possible; often they change which specialist should be seen or even if an appointment is needed at all. If multiple specialists in different institutions need to see the same imaging, make sure the imaging is done at a facility whose results both can read.",
    carteIt: "We sequence the entire schedule. We send relevant records to each specialist&rsquo;s office in advance &mdash; often answering the specialist&rsquo;s questions before the visit even starts. In some cases, the pre-visit conversation with the specialist eliminates the need for the visit altogether.",
  },
  {
    n: "V",
    title: "Track action items after every visit",
    why: "Specialists assign next steps. They do not, almost ever, also assign someone to follow through on those next steps. The follow-through is implicitly the patient&rsquo;s job &mdash; or the family member&rsquo;s. When the family member is also working a job and managing a household, the follow-through gets dropped at the rate at which busy lives drop things.",
    doIt: "Maintain a plan and calendar to accompany that plan for every diagnosis and medical issue that requires maintenance or monitoring. Revisit this after every appointment and write down: what was recommended, by whom, by when, and what specifically needs to happen for it to occur. Put each item on a calendar with a date and an owner. Don&rsquo;t trust memory.",
    carteIt: "We maintain an action list across all of your loved one&rsquo;s specialists and diagnoses, follow up directly with each office until the item is closed, and confirm completion with the patient and the family. We schedule on your loved one&rsquo;s behalf, send the records that need to be sent, and chase down the lab results that are taking too long to come back. We also check the lab results ourselves rather than relying on others to flag what needs further action.",
  },
  {
    n: "VI",
    title: "Screen beyond the standard panel",
    why: "Standard age-based screening &mdash; colonoscopy, mammogram, bone density, eye exam &mdash; catches a known set of conditions. It does not catch many of the conditions that are the actual drivers of decline in healthspan: subtle cognitive change, undiagnosed sleep apnea, early sarcopenia, vitamin and mineral deficiencies that are not on the standard panel, hearing loss, balance disorders.",
    doIt: "Ask the primary care physician explicitly: beyond the standard checklist, is there anything you would screen for in someone with this profile that we are not currently doing? If the answer is &lsquo;the checklist is the checklist,&rsquo; that is itself useful information. The checklist does not cover everything.",
    carteIt: "We tailor the screening panel to the specific risk profile of each Stewardship client &mdash; which often means adding cognitive screening, bone-density at higher cadence, comprehensive vitamin and mineral panels, sleep studies, and imaging that the standard physical does not order. We then translate the results into the small number of changes that will actually move the needle.",
  },
  {
    n: "VII",
    title: "Designate a central point of contact",
    why: "Hospitals and specialist offices want one person to talk to. When they do not have one &mdash; when calls are answered by whoever picks up, or by different family members who tell different stories &mdash; care gets delayed, miscommunicated, or duplicated. In emergencies, the absence of a central contact is dangerous.",
    doIt: "Designate one family member (or one trusted advocate) as the named point of contact for every clinical interaction. Equip that person with the records repository from Step I so they can answer questions in real time. Make sure the rest of the family is comfortable with the arrangement &mdash; divided contact is worse than imperfect contact.",
    carteIt: "We become the hub. Hospitals, specialists, pharmacies, and family members can all communicate with us, and we coordinate among them. The family member who would otherwise have been the de facto point of contact stays in charge but gets their time back. We are reachable (24/7/365 for MD Directorate clients), the records are at our fingertips, and the receiving physician gets a clean handoff.",
  },
  {
    n: "VIII",
    title: "Identify one or two keystone daily actions",
    why: "Most physicians, at the end of a long visit, give out long lists of suggestions: eat better, exercise more, take this medication, watch for these symptoms. The list is reasonable. It is also usually too long to act on. Adherence collapses when the list does not fit in real life.",
    doIt: "Identify one or two specific daily actions that would actually move the conditions your loved one is dealing with. Walk for ten minutes after each meal, for insulin resistance. Use compression stockings during the evening, for leg edema. Take the calcium supplement at the same time as the morning coffee, so you don&rsquo;t forget. Anchor each action to an existing habit so adherence is not a memory test.",
    carteIt: "We translate every set of specialist recommendations into a short, specific action list. We make the actions concrete, time-bound, and tied to existing routines. We adjust them as the situation changes. We follow up to make sure they&rsquo;re actually happening.",
  },
];

window.ReadOnWeb = function ReadOnWeb({ author = "Gina Siddiqui, MD" }) {
  return (
    <div style={{ background: "var(--carte-cream)", color: "var(--carte-text)", fontFamily: "var(--carte-font-body)" }}>
      <nav style={{ borderBottom: "1px solid var(--carte-rule-soft)", background: "var(--carte-cream)" }}>
        <div style={{ display: "flex", alignItems: "center", justifyContent: "space-between", padding: "14px 32px", maxWidth: 1080, margin: "0 auto" }}>
          <a href="/" style={{ fontFamily: "var(--carte-font-display)", fontWeight: 500, fontSize: 22, color: "var(--carte-text)", textDecoration: "none" }}>Carte</a>
          <div style={{ fontSize: 12, letterSpacing: "0.04em", color: "var(--carte-text-muted)" }}>
            <a href="/resources/" style={{ color: "inherit", textDecoration: "none" }}>Resources</a>
            <span style={{ margin: "0 8px", opacity: 0.5 }}>/</span>
            <span>Field Guide No. 03</span>
          </div>
          <a href="/coordination-blueprint/print/" style={{ color: "var(--carte-text)", textDecoration: "none", fontSize: 13.5, fontWeight: 500, borderBottom: "1px solid var(--carte-accent-green)", paddingBottom: 2 }}>Download PDF</a>
        </div>
      </nav>

      <header style={{ maxWidth: 880, margin: "0 auto", padding: "84px 40px 56px", borderBottom: "1px solid var(--carte-text)" }}>
        <div style={{ fontFamily: "var(--carte-font-smallcaps)", fontVariantCaps: "all-small-caps", textTransform: "uppercase", letterSpacing: "0.20em", fontSize: 13, fontWeight: 500, marginBottom: 28 }}>
          Field Guide &middot; No. 03
        </div>
        <h1 style={{ fontFamily: "var(--carte-font-display)", fontWeight: 400, fontSize: 64, lineHeight: 1.04, letterSpacing: "-0.012em", margin: "0 0 28px" }}>
          The Coordination<br/>Blueprint
        </h1>
        <p style={{ fontFamily: "var(--carte-font-display)", fontStyle: "italic", fontSize: 24, lineHeight: 1.45, margin: "0 0 44px", maxWidth: "32ch" }}>
          Eight steps families need covered when managing complex health for a loved one.
        </p>
        <div style={{ display: "flex", gap: 48, paddingTop: 22, borderTop: "1px solid var(--carte-rule)", fontSize: 12.5, letterSpacing: "0.04em", color: "var(--carte-text-muted)" }}>
          <span><span>By&nbsp;</span><span style={{ color: "var(--carte-text)", fontWeight: 500 }}>{author}</span></span>
          <span>2026.05</span>
          <span>~22 min read</span>
        </div>
      </header>

      <section style={{ maxWidth: 880, margin: "0 auto", padding: "64px 40px 24px" }}>
        <p style={{ fontFamily: "var(--carte-font-display)", fontSize: 21, lineHeight: 1.62, margin: "0 0 1.1em" }}>
          <span style={{ float: "left", fontFamily: "var(--carte-font-display)", fontSize: 92, lineHeight: 0.85, padding: "8px 14px 0 0", fontWeight: 400 }}>W</span>
          hen a loved one&rsquo;s health gets complicated, someone in the family usually becomes the de facto health manager. Not because they signed up for the role. Because no one else in the system was going to do it.
        </p>
        <p style={{ fontFamily: "var(--carte-font-display)", fontSize: 19, lineHeight: 1.65, margin: "0 0 1.1em" }}>
          This is a heavier job than most families understand at the start. It involves chasing records across institutions that don&rsquo;t share them, interpreting recommendations that contradict each other, scheduling appointments that need to happen in a specific order to be useful, and making sure that the eight people each providing one piece of your loved one&rsquo;s care aren&rsquo;t undermining what the other seven are doing.
        </p>
        <p style={{ fontFamily: "var(--carte-font-display)", fontSize: 19, lineHeight: 1.65, margin: "0 0 1.1em" }}>
          Done comprehensively, this work changes outcomes. Conversely, this work not getting done is the most common pathway to medication errors, redundant procedures, missed diagnoses, and the slow accumulation of small problems that eventually result in an avoidable hospitalization.
        </p>
        <p style={{ fontFamily: "var(--carte-font-display)", fontSize: 19, lineHeight: 1.65, margin: "0 0 1.1em" }}>
          This guide lays out eight steps that, in our experience, families miss out on. They require a great deal of time, attention, and the willingness to ask uncomfortable questions of physicians who are not used to being asked them. We make the case that it&rsquo;s not really possible for one person to do it all.
        </p>
        <p style={{ fontFamily: "var(--carte-font-display)", fontSize: 19, lineHeight: 1.65, margin: "0 0 1.1em" }}>
          For each step, we describe what the work that needs to be done looks like, and how Carte&rsquo;s team makes sure it gets done as part of our Stewardship or MD Directorate engagements.
        </p>
      </section>

      <section style={{ maxWidth: 880, margin: "0 auto", padding: "44px 40px 56px", borderTop: "1px solid var(--carte-rule)", borderBottom: "1px solid var(--carte-rule)" }}>
        <div style={{ fontFamily: "var(--carte-font-smallcaps)", fontVariantCaps: "all-small-caps", textTransform: "uppercase", letterSpacing: "0.20em", fontSize: 13, fontWeight: 500, marginBottom: 22 }}>The eight steps</div>
        <ol style={{ listStyle: "none", margin: 0, padding: 0 }}>
          {STEPS.map((c, i) => (
            <li key={c.n} style={{ display: "grid", gridTemplateColumns: "70px 1fr 80px", gap: 20, padding: "14px 0", borderTop: i === 0 ? "none" : "1px solid var(--carte-rule)", alignItems: "baseline" }}>
              <span style={{ fontFamily: "var(--carte-font-smallcaps)", fontVariantCaps: "all-small-caps", letterSpacing: "0.16em", fontSize: 13, color: "var(--carte-text-muted)" }}>{c.n}.</span>
              <a href={`#s-${c.n}`} style={{ fontFamily: "var(--carte-font-display)", fontSize: 18, lineHeight: 1.4, color: "var(--carte-text)", textDecoration: "none" }}>{c.title}</a>
              <span style={{ fontSize: 11.5, color: "var(--carte-text-muted)", letterSpacing: "0.04em", textAlign: "right" }}>p. {3 + i * 2}</span>
            </li>
          ))}
        </ol>
      </section>

      {STEPS.map((c) => (
        <article key={c.n} id={`s-${c.n}`} style={{ maxWidth: 880, margin: "0 auto", padding: "80px 40px 60px", borderBottom: "1px solid var(--carte-rule)" }}>
          <div style={{ display: "flex", alignItems: "baseline", gap: 28, marginBottom: 26 }}>
            <span style={{ fontFamily: "var(--carte-font-smallcaps)", fontVariantCaps: "all-small-caps", textTransform: "uppercase", letterSpacing: "0.18em", fontSize: 12, fontWeight: 500, color: "var(--carte-text-muted)" }}>Step</span>
            <span style={{ fontFamily: "var(--carte-font-smallcaps)", fontVariantCaps: "all-small-caps", letterSpacing: "0.16em", fontSize: 22, color: "var(--carte-text)" }}>{c.n}</span>
            <span style={{ flex: 1, height: 1, background: "var(--carte-rule)" }} />
          </div>
          <h2 style={{ fontFamily: "var(--carte-font-display)", fontWeight: 400, fontSize: 38, lineHeight: 1.18, letterSpacing: "-0.005em", margin: "0 0 32px", maxWidth: "26ch" }}>
            {c.title}
          </h2>

          <div style={{ fontFamily: "var(--carte-font-smallcaps)", fontVariantCaps: "all-small-caps", textTransform: "uppercase", letterSpacing: "0.20em", fontSize: 12, fontWeight: 600, color: "var(--carte-accent-green)", marginBottom: 12 }}>Why it matters</div>
          <p style={{ fontFamily: "var(--carte-font-display)", fontSize: 19, lineHeight: 1.65, margin: "0 0 36px" }} dangerouslySetInnerHTML={{ __html: c.why }} />

          <div style={{ display: "grid", gridTemplateColumns: "1fr 1fr", gap: 32, marginTop: 8 }}>
            <div style={{ borderTop: "2px solid var(--carte-text)", paddingTop: 18 }}>
              <div style={{ fontFamily: "var(--carte-font-smallcaps)", fontVariantCaps: "all-small-caps", textTransform: "uppercase", letterSpacing: "0.18em", fontSize: 11, fontWeight: 600, marginBottom: 14 }}>What needs to be done</div>
              <p style={{ fontFamily: "var(--carte-font-display)", fontSize: 16, lineHeight: 1.65, margin: 0 }} dangerouslySetInnerHTML={{ __html: c.doIt }} />
            </div>
            <div style={{ borderTop: "2px solid var(--carte-accent-green)", paddingTop: 18 }}>
              <div style={{ fontFamily: "var(--carte-font-smallcaps)", fontVariantCaps: "all-small-caps", textTransform: "uppercase", letterSpacing: "0.18em", fontSize: 11, fontWeight: 600, color: "var(--carte-accent-green)", marginBottom: 14 }}>How Carte handles it</div>
              <p style={{ fontFamily: "var(--carte-font-display)", fontSize: 16, lineHeight: 1.65, margin: 0 }} dangerouslySetInnerHTML={{ __html: c.carteIt }} />
            </div>
          </div>
        </article>
      ))}

      <section style={{ maxWidth: 880, margin: "0 auto", padding: "84px 40px 64px" }}>
        <div style={{ fontFamily: "var(--carte-font-smallcaps)", fontVariantCaps: "all-small-caps", textTransform: "uppercase", letterSpacing: "0.20em", fontSize: 13, fontWeight: 500, marginBottom: 26 }}>Putting it all together</div>
        <p style={{ fontFamily: "var(--carte-font-display)", fontSize: 22, lineHeight: 1.55, fontStyle: "italic", margin: "0 0 1.1em" }}>
          The work is real, and it is constant, and the gap between doing it well and doing it badly is the gap between a loved one who continues to improve and one who declines into a series of avoidable crises.
        </p>
        <p style={{ fontFamily: "var(--carte-font-display)", fontSize: 19, lineHeight: 1.65, margin: "0 0 1.1em" }}>
          The eight steps describe the work of being responsible for a loved one&rsquo;s complex health. A Sisyphean task that often goes unacknowledged today &mdash; that can become a rewarding one with the right supporting infrastructure in place.
        </p>
      </section>

      <section style={{ background: "var(--carte-navy-deep)", color: "var(--carte-cream)" }}>
        <div style={{ maxWidth: 880, margin: "0 auto", padding: "72px 40px" }}>
          <div style={{ fontFamily: "var(--carte-font-smallcaps)", fontVariantCaps: "all-small-caps", textTransform: "uppercase", letterSpacing: "0.20em", fontSize: 13, fontWeight: 500, opacity: 0.7, marginBottom: 22 }}>Working with Carte</div>
          <h3 style={{ fontFamily: "var(--carte-font-display)", fontWeight: 400, fontSize: 36, lineHeight: 1.2, letterSpacing: "-0.005em", margin: "0 0 24px", maxWidth: "26ch" }}>
            Two entry points, depending on where you are.
          </h3>
          <p style={{ fontFamily: "var(--carte-font-display)", fontSize: 18, lineHeight: 1.6, margin: "0 0 8px", opacity: 0.9 }}>
            For a specific unresolved question, the entry point is a <b style={{ fontWeight: 500 }}>Forensic Review</b> ($10,000). For ongoing engagement, it is <b style={{ fontWeight: 500 }}>Stewardship</b> ($36,000&nbsp;/&nbsp;year) or, at the higher-intensity tier, <b style={{ fontWeight: 500 }}>MD Directorate</b>.
          </p>
          <p style={{ fontFamily: "var(--carte-font-display)", fontSize: 18, lineHeight: 1.6, margin: "0 0 36px", opacity: 0.9 }}>
            Your first call with one of our physicians is where we figure out which is the right fit &mdash; and you&rsquo;ll leave it with their read on your case and at least one specific next step, whether you continue with Carte or not.
          </p>
          <a href="/inquire/" className="btn btn-primary on-navy">Tell us what&rsquo;s going on</a>
          <div style={{ marginTop: 40, paddingTop: 22, borderTop: "1px solid rgba(250,250,250,0.18)", fontSize: 12.5, letterSpacing: "0.04em", opacity: 0.7 }}>
            This content is for educational and informational purposes only. It does not constitute medical advice.
          </div>
        </div>
      </section>

      <footer style={{ borderTop: "1px solid var(--carte-rule-soft)", padding: "26px 0 30px", fontSize: 12, color: "var(--carte-text-muted)", letterSpacing: "0.02em", background: "var(--carte-cream)" }}>
        <div style={{ maxWidth: 1080, margin: "0 auto 14px", padding: "0 40px", fontFamily: "var(--carte-font-display)", fontStyle: "italic", fontSize: 12.5, lineHeight: 1.55, color: "var(--carte-text)" }}>
          <b style={{ fontStyle: "normal", fontWeight: 500, letterSpacing: "0.04em", color: "#6d4f1c", marginRight: 6, textTransform: "uppercase", fontSize: 11 }}>Not for emergencies.</b>
          If you are experiencing a medical emergency, call 911. Content on this website is educational and for informational purposes only. It does not constitute medical advice, and individual medical decisions should always be discussed with your treating physicians.
        </div>
        <div style={{ maxWidth: 1080, margin: "0 auto", padding: "14px 40px 0", borderTop: "1px solid var(--carte-rule-soft)", display: "flex", flexWrap: "wrap", gap: 16, justifyContent: "space-between", alignItems: "baseline" }}>
          <span style={{ fontFamily: "var(--carte-font-smallcaps)", fontVariantCaps: "all-small-caps", textTransform: "uppercase", letterSpacing: "0.36em", fontSize: 13, fontWeight: 500 }}>Carte Medical</span>
          <span>&copy; 2026 Carte Clinics Inc. &middot; VIRGINIA | CALIFORNIA | NATIONAL ADVISORY</span>
        </div>
      </footer>
    </div>
  );
};
