/*
 * Marketplace Plan Finder — tool styles, scoped to .pf so nothing leaks into the
 * Thrive page or GHL. Uses Thrive tokens from the page (:root in index.html /
 * the GHL-direct block), with fallbacks so the tool still renders on its own.
 */
.pf {
  --pf-forest: var(--forest, #1F5C42);
  --pf-forest-d: var(--forest-d, #163f2e);
  --pf-forest-lt: var(--forest-lt, #e8f4ef);
  --pf-teal: var(--teal, #2DB89E);
  --pf-navy: var(--navy, #162B3B);
  --pf-ink: var(--black, #0F1B14);
  --pf-body: var(--body-gray, #4B5563);
  --pf-line: var(--lt-border, #E5E9E7);
  --pf-cloud: var(--cloud, #F5F6F8);
  --pf-warn: #8a5a00;
  --pf-warn-lt: #fdf3dc;
  --pf-error: #b3261e;
  --pf-head: var(--font-head, 'Plus Jakarta Sans', sans-serif);
  --pf-text: var(--font-body, 'Inter', sans-serif);

  max-width: 720px;
  margin: 0 auto;
  background: #fff;
  border: 1px solid var(--pf-line);
  border-radius: var(--radius-lg, 20px);
  box-shadow: var(--shadow-sm, 0 2px 12px rgba(0,0,0,.06));
  overflow: hidden;
  font-family: var(--pf-text);
  font-size: 16px;
  line-height: 1.55;
  color: var(--pf-body);
  text-align: left;
}
.pf *, .pf *::before, .pf *::after { box-sizing: border-box; }
.pf h2, .pf h3 { font-family: var(--pf-head); color: var(--pf-ink); line-height: 1.2; margin: 0 0 .5rem; letter-spacing: -.015em; }
.pf h2 { font-size: clamp(22px, 2.4vw, 28px); font-weight: 800; }
.pf h3 { font-size: 18px; font-weight: 700; }
.pf p { margin: 0 0 1rem; }
.pf a { color: var(--pf-forest); font-weight: 600; }
.pf :focus-visible { outline: 3px solid var(--pf-teal); outline-offset: 2px; }
.pf h2:focus { outline: none; }

.pf-banner { padding: .55rem 20px; font-size: 13px; font-weight: 700; text-align: center; }
.pf-banner--draft { background: var(--pf-warn-lt); color: var(--pf-warn); }
.pf-banner--preview { background: #fde8e7; color: var(--pf-error); }
.pf-progress { height: 4px; background: var(--pf-line); }
.pf-progress__bar { height: 100%; width: 0; background: var(--pf-teal); transition: width .25s ease; }

.pf-main { padding: 28px 28px 32px; min-height: 360px; }
.pf-loading { color: var(--pf-body); }
.pf-eyebrow { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: var(--pf-teal); margin-bottom: 8px; }
.pf-lead { font-size: 17px; }
.pf-note { font-size: 15px; color: var(--pf-body); }
.pf-step { font-size: 13px; color: var(--pf-body); margin-bottom: 6px; }

/* Buttons match .hiw-btn */
.pf-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 48px; padding: 14px 28px; border-radius: 8px; border: 1.5px solid transparent;
  font-family: var(--pf-head); font-size: 16px; font-weight: 700; cursor: pointer; text-decoration: none;
}
.pf-btn--primary { background: var(--pf-forest); color: #fff; }
.pf-btn--primary:hover { background: var(--pf-forest-d); }
.pf-btn--cta { background: var(--pf-forest); color: #fff; }
.pf-btn--cta:hover { background: var(--pf-forest-d); }
.pf-btn--ghost { background: transparent; color: var(--pf-forest); padding: 0 12px; }
.pf-btn--block { width: 100%; }
.pf-btn[disabled] { opacity: .6; cursor: default; }
.pf-nav { display: flex; gap: 12px; align-items: center; margin-top: 24px; }
.pf-nav .pf-btn--primary { flex: 1; }

/* Questions */
.pf fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.pf legend { padding: 0; margin-bottom: 12px; }
.pf legend h2 { margin: 0; }
.pf-hint { font-size: 15px; color: var(--pf-body); margin: -4px 0 16px; }
.pf-options { display: grid; gap: 10px; }
.pf-option { position: relative; display: block; }
.pf-option input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.pf-option span {
  display: block; padding: 14px 16px; background: #fff; border: 1.5px solid var(--pf-line);
  border-radius: var(--radius-sm, 10px); color: var(--pf-ink); font-weight: 500;
}
.pf-option input:checked + span { border-color: var(--pf-forest); background: var(--pf-forest-lt); }
.pf-option input:focus-visible + span { outline: 3px solid var(--pf-teal); outline-offset: 2px; }
.pf-option:hover span { border-color: var(--pf-forest); }

.pf-field { margin-bottom: 16px; }
.pf-field label { display: block; font-weight: 600; color: var(--pf-ink); margin-bottom: 6px; font-size: 15px; }
.pf-field input, .pf-field select {
  width: 100%; min-height: 48px; padding: 10px 14px; font: 16px var(--pf-text); color: var(--pf-ink);
  background: #fff; border: 1.5px solid var(--pf-line); border-radius: var(--radius-sm, 10px);
}
.pf-field input:focus, .pf-field select:focus { border-color: var(--pf-forest); outline: none; box-shadow: 0 0 0 3px var(--pf-forest-lt); }
.pf-field--short input { max-width: 10rem; }
.pf-error { color: var(--pf-error); font-weight: 600; font-size: 15px; margin: 8px 0 0; }
.pf-row2 { display: grid; gap: 0 16px; grid-template-columns: 1fr 1fr; }

.pf-callout { padding: 14px 16px; border-radius: var(--radius-sm, 10px); background: var(--pf-forest-lt); color: var(--pf-ink); margin: 16px 0; font-size: 15px; }
.pf-callout--warn { background: var(--pf-warn-lt); color: #5c3c00; }

/* Result cards */
.pf-card { background: #fff; border: 1px solid var(--pf-line); border-radius: var(--radius-md, 14px); padding: 20px; margin-bottom: 16px; }
.pf-card--rec { border: 2px solid var(--pf-forest); }
.pf-tag { display: inline-block; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; padding: 3px 10px; border-radius: 999px; margin: 0 6px 8px 0; }
.pf-tag--rec { background: var(--pf-forest); color: #fff; }
.pf-tag--csr { background: #e6f7f4; color: #11715f; }
.pf-tag--opt { background: var(--pf-warn-lt); color: var(--pf-warn); }
.pf-meta { color: var(--pf-body); font-size: 15px; margin-bottom: 12px; }
.pf-trade { color: var(--pf-ink); }
.pf-price { font-family: var(--pf-head); font-size: 28px; font-weight: 800; color: var(--pf-ink); line-height: 1.1; }
.pf-price small { font-size: 15px; font-weight: 500; color: var(--pf-body); }
.pf-price-label { font-size: 14px; color: var(--pf-body); margin-bottom: 4px; }
.pf-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 16px; margin: 16px 0 0; }
.pf-stats div { min-width: 0; }
.pf-stats dt { font-size: 13px; color: var(--pf-body); }
.pf-stats dd { margin: 0; font-weight: 700; color: var(--pf-ink); }
.pf-stats .pf-hint-sm { display: block; font-weight: 400; font-size: 12px; color: var(--pf-body); }
.pf details { margin-top: 16px; border-top: 1px solid var(--pf-line); padding-top: 12px; }
.pf summary { cursor: pointer; color: var(--pf-forest); font-weight: 600; min-height: 32px; }
.pf-small { font-size: 13px; color: var(--pf-body); }

.pf-cta { background: var(--pf-navy); color: rgba(255,255,255,.82); border-radius: var(--radius-md, 14px); padding: 24px 20px; margin: 24px 0; }
.pf-cta h2 { color: #fff; }

.pf-admin { font-family: ui-monospace, Menlo, monospace; font-size: 12px; background: var(--pf-cloud); border: 1px dashed var(--pf-line); padding: 12px; max-height: 240px; overflow: auto; }

.pf-check { display: flex; gap: 12px; align-items: flex-start; margin: 16px 0; }
.pf-check input { width: 22px; height: 22px; margin-top: 2px; flex: none; accent-color: var(--pf-forest); }
.pf-check label { font-size: 14px; }
.pf-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.pf-foot { border-top: 1px solid var(--pf-line); background: var(--pf-cloud); padding: 20px 28px 24px; font-size: 13px; color: var(--pf-body); }
.pf-foot p { margin-bottom: 8px; }

@media (max-width: 600px) {
  .pf { border-radius: var(--radius-md, 14px); }
  .pf-main { padding: 22px 18px 26px; }
  .pf-foot { padding: 18px; }
  .pf-row2 { grid-template-columns: 1fr; }
}

/* FAQ questions on the Thrive page (outside the tool card) */


/* Prescription results on plan cards */
.pf-rx-list { list-style: none; padding: 0; margin: 4px 0 8px; }
.pf-rx-list li { margin: 4px 0; }
.pf-rx-yes span { color: #1d6b3a; font-weight: 800; }
.pf-rx-no span { color: #b3261e; font-weight: 800; }
.pf-rx-chosen .pf-btn--ghost { min-height: 28px; padding: 0 6px; font-size: 13px; }
.pf-rx-suggest .pf-btn--ghost { justify-content: flex-start; min-height: 40px; text-align: left; }

/* Income tips: short checklist under the hint */
.pf-tips { list-style: none; margin: -4px 0 16px; padding: 12px 14px; background: var(--pf-forest-lt); border-radius: 10px; font-size: 14px; }
.pf-tips li { position: relative; padding-left: 18px; margin: 4px 0; color: var(--pf-ink); }
.pf-tips li::before { content: ''; position: absolute; left: 2px; top: .6em; width: 6px; height: 6px; border-radius: 50%; background: var(--pf-teal); }

/* ---------- Page: hero (intro | tool) and FAQ ---------- */
.pf-hero {
  position: relative;
  background: radial-gradient(120% 90% at 100% 0%, #2a7356 0%, var(--forest, #1F5C42) 45%, var(--forest-d, #163f2e) 100%);
  color: #fff;
  padding: 64px 6% 72px;
  overflow: hidden;
  scroll-margin-top: 80px;
}
.pf-hero::after {           /* soft teal glow behind the tool card */
  content: ''; position: absolute; right: -10%; bottom: -30%; width: 60%; height: 80%;
  background: radial-gradient(closest-side, rgba(45,184,158,.28), transparent);
  pointer-events: none;
}
.pf-hero__inner {
  position: relative; z-index: 1;
  max-width: 1200px; margin: 0 auto;
  display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 56px; align-items: start;
}
.pf-hero__intro { padding-top: 12px; }
.pf-hero__h1 {
  margin: 0 0 18px; color: #fff;
  font: 800 clamp(30px, 3.4vw, 48px)/1.1 var(--font-head, 'Plus Jakarta Sans', sans-serif); letter-spacing: -.025em;
}
.pf-hero__lead { margin: 0 0 24px; color: rgba(255,255,255,.84); font-size: 18px; line-height: 1.6; }
.pf-hero__points { list-style: none; margin: 0; padding: 0; }
.pf-hero__points li {
  position: relative; padding: 0 0 0 32px; margin: 0 0 12px;
  color: #fff; font-weight: 600; font-size: 16px;
}
.pf-hero__points li::before {
  content: '✓'; position: absolute; left: 0; top: 0;
  width: 22px; height: 22px; border-radius: 50%;
  background: var(--teal, #2DB89E); color: var(--forest-d, #163f2e);
  font-size: 13px; font-weight: 800; line-height: 22px; text-align: center;
}
.pf-hero .pf { max-width: none; box-shadow: 0 24px 60px rgba(8,30,20,.35); border: 0; }
/* Results: tool takes the full width, intro sits above it */
.pf-hero--wide .pf-hero__inner { grid-template-columns: minmax(0, 1fr); gap: 28px; max-width: 820px; }
.pf-hero--wide .pf-hero__lead, .pf-hero--wide .pf-hero__points { display: none; }
.pf-hero--wide .pf-hero__h1 { font-size: clamp(24px, 2.6vw, 32px); margin: 0; }
.pf-hero--wide .pf-hero__intro { padding-top: 0; }

@media (max-width: 900px) {
  .pf-hero { padding: 32px 16px 40px; }
  .pf-hero__inner { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .pf-hero__intro { padding-top: 0; }
  .pf-hero__lead { font-size: 16px; margin-bottom: 16px; }
  .pf-hero__lead-more { display: none; }   /* phones: short lead, then the three points */
  .pf-hero__points li { margin-bottom: 10px; font-size: 15px; }
}

.pf-faq { background: var(--sage-lt, #EEF4F1); padding: 88px 6%; }
.pf-faq__inner { max-width: 820px; margin: 0 auto; }
.pf-faq__h2 {
  text-align: center; margin: 0 0 40px; color: var(--black, #0F1B14);
  font: 800 clamp(26px, 3.2vw, 40px)/1.15 var(--font-head, 'Plus Jakarta Sans', sans-serif); letter-spacing: -.02em;
}
.pf-faq-item {
  background: #fff; border: 1px solid var(--lt-border, #E5E9E7); border-radius: 12px;
  margin: 0 0 12px; overflow: hidden; transition: border-color .2s ease, box-shadow .2s ease;
}
.pf-faq-item[open] { border-color: var(--teal, #2DB89E); box-shadow: 0 6px 20px rgba(31,92,66,.08); }
.pf-faq-item summary {
  list-style: none; cursor: pointer;
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 20px 24px; min-height: 44px;
}
.pf-faq-item summary::-webkit-details-marker { display: none; }
.pf-faq-item summary:focus-visible { outline: 2px solid var(--teal, #2DB89E); outline-offset: -2px; }
.pf-faq-item summary h3 {
  margin: 0; color: var(--black, #0F1B14);
  font: 700 17px/1.35 var(--font-head, 'Plus Jakarta Sans', sans-serif);
}
.pf-faq-icon { flex: 0 0 auto; width: 20px; height: 20px; position: relative; }
.pf-faq-icon::before, .pf-faq-icon::after {
  content: ''; position: absolute; background: var(--forest, #1F5C42); border-radius: 2px;
  transition: transform .22s ease, opacity .22s ease;
}
.pf-faq-icon::before { left: 0; top: 9px; width: 20px; height: 2px; }
.pf-faq-icon::after { left: 9px; top: 0; width: 2px; height: 20px; }
.pf-faq-item[open] .pf-faq-icon::after { transform: scaleY(0); opacity: 0; }
.pf-faq-a { padding: 0 24px 22px; color: var(--body-gray, #4B5563); font-size: 15px; line-height: 1.75; }
.pf-faq-a p { margin: 0; }
.pf-faq__sources { margin: 28px 0 0; font-size: 13px; color: var(--body-gray, #4B5563); text-align: center; line-height: 1.7; }
.pf-faq__sources a { color: var(--forest, #1F5C42); }
@media (max-width: 700px) {
  .pf-faq { padding: 56px 16px; }
  .pf-faq-item summary { padding: 18px 20px; }
  .pf-faq-item summary h3 { font-size: 15.5px; }
  .pf-faq-a { padding: 0 20px 20px; font-size: 14.5px; }
}