/* coverage-faq — section CSS, written by its BUILD-SECTION subagent (2026-09-15).
   Source: brief/coverage-faq.md + cache/coverage-faq.desktop.json (3271:526, drawn at k = 1.0424).
   Mobile (0–767) is DERIVED per BA-1 from drawn mobile analogues (cited in the slice §2/§5).
   Mobile-first: base = mobile · 768–1023 = pseudo-tablet row split (D-6) · 1024+ = the drawn desktop.
   Every rule is scoped under .coverage-faq (GLOBAL-SCOPE LOCK). Template: accordion (swap-icon, first open). */

/* ---------------------------------------------------------------------------
   SECTION TOKENS — moved out of the page's tokens.css.

   Read by THIS block and nothing else on the site, so they belong here rather
   than in a site-wide :root. In Shopify a section can be dropped onto any
   template from the theme editor, so a section that reads a token from a
   page-level scope breaks the moment it is moved; scoped to the block's own
   class, it travels with it.

   EVERY band is carried verbatim from the old tokens.css, in that file's own
   order — so the cascade is unchanged whether the page was written
   desktop-first (base + max-width overrides) or mobile-first (base +
   min-width overrides). Verified by computed-style diff at
   375/768/1024/1440/1920.
--------------------------------------------------------------------------- */

.coverage-faq {
  --font-serif:     'Roboto Serif', Georgia, 'Times New Roman', serif;
  --font-mono:      'Roboto Mono', ui-monospace, 'Courier New', monospace;
  --font-btn:       'Roboto', system-ui, 'Segoe UI', Arial, sans-serif;
  --c-eyebrow:      #b3aeae;
  --c-muted-strong: #4a5a64;
  --c-surface:      #ffffff;
  --c-border:       #d6e2e7;
  --c-divider:      #e8eff3;
  --radius-pill:    9999px;
  --text-h2:        clamp(18px, calc(22px + (var(--max-vw) - 390px) * 0.015), 43px);
  --lh-h2:          1.2;
  --ls-h2:          -0.025em;
  --text-eyebrow:   clamp(8px, calc(10px + (var(--max-vw) - 390px) * 0.015), 20px);
  --lh-eyebrow:     1.5;
  --ls-eyebrow:     0.2em;
  --text-subnote:   clamp(8px, calc(10px + (var(--max-vw) - 390px) * 0.015), 20px);
  --lh-subnote:     1.5;
  --ls-subnote:     0;
  --section-pad-y:  clamp(26px, calc(32px + (var(--max-vw) - 390px) * 0.015), 63px);
}

@media (min-width: 768px) and (max-width: 1023px) {
  .coverage-faq {
    --text-h2:       clamp(22px, calc(22px + (var(--max-vw) - 768px) * 0.025), 46.425px);
    --text-eyebrow:  clamp(10px, calc(10px + (var(--max-vw) - 768px) * 0.025), 21.493px);
    --text-subnote:  clamp(10px, calc(10px + (var(--max-vw) - 768px) * 0.025), 13.639px);
    --section-pad-y: clamp(32px, calc(32px + (var(--max-vw) - 768px) * 0.025), 75px);
  }
}

@media (min-width: 1024px) {
  .coverage-faq {
    --text-h2:       clamp(29px, calc(46.425px * (var(--max-vw) / var(--vw-base))), 55px);
    --lh-h2:         1.16;
    --ls-h2:         -0.012em;
    --text-eyebrow:  clamp(14px, calc(21.493px * (var(--max-vw) / var(--vw-base))), 25px);
    --lh-eyebrow:    normal;
    --ls-eyebrow:    0.1em;
    --text-subnote:  clamp(9px, calc(13.639px * (var(--max-vw) / var(--vw-base))), 16px);
    --lh-subnote:    normal;
    --ls-subnote:    -0.03em;
    --section-pad-y: clamp(47px, calc(75px * (var(--max-vw) / var(--vw-base))), 89px);
  }
}

/* ---------------------------------------------------------------- section-local tokens — mobile (base) */
.coverage-faq {
  --cf-chevron: #b34700;                       /* section-local colour (brief-page §4.3) */
  --cf-rule: #d3ebf1;                          /* section-local colour (brief-page §4.3) */

  /* type roles: clamp(M-min, calc(M-base + (max-vw - 390px) * 0.015), M-max) */
  --cf-q: clamp(11px, calc(13px + (var(--max-vw) - 390px) * 0.015), 26px);        /* question, Inter 700 */
  --cf-lh-q: 1.55;
  --cf-a: clamp(11px, calc(13px + (var(--max-vw) - 390px) * 0.015), 26px);        /* answer, Inter 400 (BA-CF-1) */
  --cf-lh-a: 1.55;
  --cf-pill: clamp(8px, calc(10px + (var(--max-vw) - 390px) * 0.015), 20px);      /* pill label, Inter 500 */
  --cf-lh-pill: 1.5;
  --cf-note: clamp(8px, calc(10px + (var(--max-vw) - 390px) * 0.015), 20px);      /* coverage note, Roboto 400 */
  --cf-lh-note: 1.5;

  /* spacing */
  --cf-eyebrow-gap: clamp(7px, calc(8px + (var(--max-vw) - 390px) * 0.015), 16px);        /* 3271:728 */
  --cf-cov-title-gap: clamp(16px, calc(20px + (var(--max-vw) - 390px) * 0.015), 39px);    /* 3271:850 */
  --cf-pill-cgap: clamp(7px, calc(8px + (var(--max-vw) - 390px) * 0.015), 16px);          /* 3271:687 */
  --cf-pill-rgap: clamp(7px, calc(8px + (var(--max-vw) - 390px) * 0.015), 16px);
  --cf-pill-py: clamp(5px, calc(6px + (var(--max-vw) - 390px) * 0.015), 12px);            /* 3271:688 */
  --cf-pill-px: clamp(10px, calc(12px + (var(--max-vw) - 390px) * 0.015), 24px);
  --cf-pills-note: clamp(10px, calc(12px + (var(--max-vw) - 390px) * 0.015), 24px);       /* 3271:730 */
  --cf-note-cta: clamp(16px, calc(20px + (var(--max-vw) - 390px) * 0.015), 39px);         /* 3271:902 pt */
  --cf-cta-gap: clamp(10px, calc(12px + (var(--max-vw) - 390px) * 0.015), 24px);          /* 3271:902 pb */
  --cf-faq-title-gap: clamp(20px, calc(24px + (var(--max-vw) - 390px) * 0.015), 47px);    /* 3271:732 */
  --cf-q-py: clamp(10px, calc(12px + (var(--max-vw) - 390px) * 0.015), 24px);             /* 3271:1122 */
  --cf-icon: clamp(13px, calc(16px + (var(--max-vw) - 390px) * 0.015), 31px);             /* 3271:1126 */
  --cf-icon-gap: clamp(8px, calc(10px + (var(--max-vw) - 390px) * 0.015), 20px);          /* 3271:869 */
  --cf-lane: calc(var(--cf-icon) + var(--cf-icon-gap));
  --cf-icon-top: clamp(2px, calc(2px + (var(--max-vw) - 390px) * 0.015), 4px);            /* 3271:870 */
  --cf-icon-right: 0px;
  --cf-a-pb: clamp(10px, calc(12px + (var(--max-vw) - 390px) * 0.015), 24px);             /* 3271:1122 */
}

/* ---------------------------------------------------------------- section box (Pattern A) */
.coverage-faq {
  padding-top: var(--section-pad-y);
  padding-bottom: var(--section-pad-y);
}

.coverage-faq__inner {
  display: flex;
  flex-direction: column;
  align-items: stretch;
}

.coverage-faq__coverage,
.coverage-faq__faq {
  min-width: 0;
}

/* D-CF-7: on mobile the FAQ block opens after the page's own section seam (pad + 1px divider + pad) */
.coverage-faq__faq {
  margin-top: var(--section-pad-y);
  padding-top: var(--section-pad-y);
  border-top: 1px solid var(--c-divider);
}

/* ---------------------------------------------------------------- eyebrow + title (both columns) */
.coverage-faq__eyebrow {
  font-family: var(--font-mono);
  font-weight: 700;
  font-size: var(--text-eyebrow);
  line-height: var(--lh-eyebrow);
  letter-spacing: var(--ls-eyebrow);
  text-transform: uppercase;
  color: var(--c-eyebrow);
}

.coverage-faq__title {
  margin-top: var(--cf-eyebrow-gap);
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: var(--text-h2);
  line-height: var(--lh-h2);
  letter-spacing: var(--ls-h2);
  color: var(--c-ink);
}

/* ---------------------------------------------------------------- insurance pills (static list, D-CF-9) */
.coverage-faq__plans {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  column-gap: var(--cf-pill-cgap);
  row-gap: var(--cf-pill-rgap);
  margin-top: var(--cf-cov-title-gap);
}

.coverage-faq__plan {
  display: block;
  padding: var(--cf-pill-py) var(--cf-pill-px);
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: var(--radius-pill);
  white-space: nowrap;
  font-family: var(--font-sans);
  font-weight: 500;
  font-size: var(--cf-pill);
  line-height: var(--cf-lh-pill);
  letter-spacing: 0;
  color: var(--c-text);
}

/* ---------------------------------------------------------------- note + CTA group */
.coverage-faq__note {
  margin-top: var(--cf-pills-note);
  font-family: var(--font-btn);
  font-weight: 400;
  font-size: var(--cf-note);
  line-height: var(--cf-lh-note);
  letter-spacing: 0;
  color: var(--c-muted-strong);
}

.coverage-faq__cta {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--cf-cta-gap);
  margin-top: var(--cf-note-cta);
}

.coverage-faq__btn { flex: none; }

/* D-CF-6: every drawn mobile CTA puts the sub-note ABOVE the button */
.coverage-faq__subnote {
  order: -1;
  width: 100%;
  font-family: var(--font-sans);
  font-weight: 400;
  font-size: var(--text-subnote);
  line-height: var(--lh-subnote);
  letter-spacing: var(--ls-subnote);
  text-align: center;
  color: var(--c-text);
}

/* ---------------------------------------------------------------- FAQ accordion (template: accordion, D-CF-1) */
.coverage-faq__list {
  margin-top: var(--cf-faq-title-gap);
}

/* D-CF-2: 1px rule under EVERY item; items abut (no gap — ADAPT §3a) */
.coverage-faq__item {
  border-bottom: 1px solid var(--cf-rule);
}

.coverage-faq__question {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  padding-top: var(--cf-q-py);
  padding-bottom: var(--cf-q-py);
  padding-left: 0;
  padding-right: var(--cf-lane);             /* the icon lane (Summary padding-right) */
  /* Figma's Details stroke is INSIDE its 74.53 box and overlaps the 74.42 Summary by ~1px:
     without this the 1px rule adds 0.9px per item (5.3px over the list). Boxes stay as drawn. */
  margin-bottom: -1px;
  text-align: left;
  background: transparent;
  border: 0;
  cursor: pointer;
  font-family: var(--font-sans);
  font-weight: 700;
  font-size: var(--cf-q);
  line-height: var(--cf-lh-q);
  letter-spacing: 0;
  color: var(--c-text);
}

.coverage-faq__q {
  display: block;
  white-space: normal;
}

/* the JS-inserted span.accordion-icon — sits inside the lane, top-aligned with line 1 */
.coverage-faq__question .accordion-icon {
  position: absolute;
  top: calc(var(--cf-q-py) + var(--cf-icon-top));
  right: var(--cf-icon-right);
  display: block;
  width: var(--cf-icon);
  height: var(--cf-icon);
  flex-shrink: 0;
  pointer-events: none;
  color: var(--cf-chevron);
}

.coverage-faq__question .accordion-icon svg {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
}

/* FD-99: the template ships the collapse mechanics under its demo class (.faq-answer) —
   re-homed here verbatim. JS owns the height; never display:none. */
.coverage-faq__answer {
  height: 0;
  overflow: hidden;
  transition: height .3s ease;
}

.coverage-faq__a {
  padding-bottom: var(--cf-a-pb);
  font-family: var(--font-sans);
  font-weight: 400;
  font-size: var(--cf-a);
  line-height: var(--cf-lh-a);
  letter-spacing: 0;
  color: var(--c-text);
}

/* ================================================================ 768–1023: pseudo-tablet row split (D-6) */
@media (min-width: 768px) and (max-width: 1023px) {
  .coverage-faq {
    --cf-q: clamp(13px, calc(13px + (var(--max-vw) - 768px) * 0.025), 22.404px);
    --cf-a: clamp(13px, calc(13px + (var(--max-vw) - 768px) * 0.025), 22.404px);
    --cf-pill: clamp(10px, calc(10px + (var(--max-vw) - 768px) * 0.025), 13.282px);
    --cf-note: clamp(10px, calc(10px + (var(--max-vw) - 768px) * 0.025), 13.191px);

    --cf-col-gap: clamp(20px, calc(20px + (var(--max-vw) - 768px) * 0.025), 78.04px);
    --cf-eyebrow-gap: clamp(8px, calc(8px + (var(--max-vw) - 768px) * 0.025), 15.088px);
    --cf-cov-title-gap: clamp(20px, calc(20px + (var(--max-vw) - 768px) * 0.025), 26.99px);
    --cf-pill-cgap: clamp(8px, calc(8px + (var(--max-vw) - 768px) * 0.025), 8.8px);
    --cf-pill-rgap: clamp(8px, calc(8px + (var(--max-vw) - 768px) * 0.025), 9.5px);
    --cf-pill-py: clamp(6px, calc(6px + (var(--max-vw) - 768px) * 0.025), 8.289px);
    --cf-pill-px: clamp(12px, calc(12px + (var(--max-vw) - 768px) * 0.025), 15.657px);
    --cf-pills-note: clamp(12px, calc(12px + (var(--max-vw) - 768px) * 0.025), 20.99px);
    --cf-note-cta: clamp(20px, calc(20px + (var(--max-vw) - 768px) * 0.025), 34.83px);
    --cf-cta-gap: 12px;                        /* M-base 12 > D-base 9.04 → clamp resolves to M-base */
    --cf-faq-title-gap: clamp(24px, calc(24px + (var(--max-vw) - 768px) * 0.025), 48.61px);
    --cf-q-py: clamp(12px, calc(12px + (var(--max-vw) - 768px) * 0.025), 23.71px);
    --cf-icon: clamp(16px, calc(16px + (var(--max-vw) - 768px) * 0.025), 22.862px);
    --cf-icon-gap: clamp(10px, calc(10px + (var(--max-vw) - 768px) * 0.025), 24.558px);   /* RESPONSIVE: M 10 < D 24.558 (lane 47.42 − icon 22.862) → interpolate (brief §2 “EVERY value”); was flat 10px */
    --cf-icon-top: 2px;                        /* M-base 2 > D-base −1.497 → M-base */
    --cf-a-pb: clamp(12px, calc(12px + (var(--max-vw) - 768px) * 0.025), 25.865px);   /* RESPONSIVE: M 12 < D 25.865 → interpolate (brief §2 “EVERY value”); was flat 12px */
  }

  .coverage-faq__inner {
    flex-direction: row;
    align-items: flex-start;
    gap: var(--cf-col-gap);
  }

  .coverage-faq__coverage,
  .coverage-faq__faq {
    flex: 1 1 0;
  }

  /* the in-section seam exists only in the stacked layout */
  .coverage-faq__faq {
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
  }

  .coverage-faq__cta { align-items: stretch; }
}

/* ================================================================ 1024+: the drawn desktop (3271:526) */
@media (min-width: 1024px) {
  .coverage-faq {
    /* D-CF-3 / page D-1: this group is drawn at k 1.0424 — re-declare the shared roles in section scope */
    --text-h2: clamp(31px, calc(48.393px * (var(--max-vw) / var(--vw-base))), 57px);
    --text-eyebrow: clamp(14px, calc(22.404px * (var(--max-vw) / var(--vw-base))), 27px);
    --text-btn: clamp(12px, calc(19.24px * (var(--max-vw) / var(--vw-base))), 23px);

    --cf-q: clamp(14px, calc(22.404px * (var(--max-vw) / var(--vw-base))), 27px);
    --cf-lh-q: normal;
    --cf-a: clamp(14px, calc(22.404px * (var(--max-vw) / var(--vw-base))), 27px);
    --cf-lh-a: normal;
    --cf-pill: clamp(8px, calc(13.282px * (var(--max-vw) / var(--vw-base))), 16px);
    --cf-lh-pill: 1.318;                       /* 17.506px */
    --cf-note: clamp(8px, calc(13.191px * (var(--max-vw) / var(--vw-base))), 16px);
    --cf-lh-note: 1.65;                        /* 21.766px */

    --cf-col-cov: clamp(296px, calc(468.37px * (var(--max-vw) / var(--vw-base))), 555px);
    --cf-col-gap: clamp(49px, calc(78.04px * (var(--max-vw) / var(--vw-base))), 93px);
    --cf-eyebrow-gap: clamp(10px, calc(15.088px * (var(--max-vw) / var(--vw-base))), 18px);
    --cf-cov-title-gap: clamp(17px, calc(26.99px * (var(--max-vw) / var(--vw-base))), 32px);
    --cf-pill-cgap: clamp(6px, calc(8.8px * (var(--max-vw) / var(--vw-base))), 10px);
    --cf-pill-rgap: clamp(6px, calc(9.5px * (var(--max-vw) / var(--vw-base))), 11px);
    --cf-pill-py: clamp(5px, calc(8.289px * (var(--max-vw) / var(--vw-base))), 10px);
    --cf-pill-px: clamp(10px, calc(15.657px * (var(--max-vw) / var(--vw-base))), 19px);
    --cf-pills-note: clamp(13px, calc(20.99px * (var(--max-vw) / var(--vw-base))), 25px);
    --cf-note-cta: clamp(22px, calc(34.83px * (var(--max-vw) / var(--vw-base))), 41px);
    --cf-cta-gap: clamp(6px, calc(9.04px * (var(--max-vw) / var(--vw-base))), 11px);
    --cf-subnote-w: clamp(215px, calc(340px * (var(--max-vw) / var(--vw-base))), 403px);
    --cf-subnote-ml: clamp(4px, calc(5.72px * (var(--max-vw) / var(--vw-base))), 7px);
    --cf-faq-title-gap: clamp(31px, calc(48.61px * (var(--max-vw) / var(--vw-base))), 58px);
    --cf-faq-title-max: clamp(371px, calc(585.82px * (var(--max-vw) / var(--vw-base))), 695px);
    --cf-q-py: clamp(15px, calc(23.71px * (var(--max-vw) / var(--vw-base))), 28px);
    --cf-lane: clamp(30px, calc(47.42px * (var(--max-vw) / var(--vw-base))), 56px);
    --cf-icon: clamp(14px, calc(22.862px * (var(--max-vw) / var(--vw-base))), 27px);
    --cf-icon-top: clamp(-2px, calc(-1.497px * (var(--max-vw) / var(--vw-base))), -1px);
    --cf-icon-right: clamp(2px, calc(2.93px * (var(--max-vw) / var(--vw-base))), 3px);
    --cf-a-pb: clamp(16px, calc(25.865px * (var(--max-vw) / var(--vw-base))), 31px);
  }

  .coverage-faq__inner {
    flex-direction: row;
    align-items: flex-start;
    gap: var(--cf-col-gap);
  }

  .coverage-faq__coverage {
    flex: 0 0 var(--cf-col-cov);
  }

  .coverage-faq__faq {
    flex: 1 1 0;
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
  }

  /* D-CF-4: MUST-APPLY — keeps the drawn break "…before / you take the next step" */
  .coverage-faq__faq .coverage-faq__title {
    max-width: var(--cf-faq-title-max);
  }

  /* CTA box drawn at its own k (brief-page §4.0) — re-declared through the .btn custom properties */
  .coverage-faq__btn {
    --btn-w: clamp(263px, calc(415.21px * (var(--max-vw) / var(--vw-base))), 492px);
    --btn-h: clamp(39px, calc(62.118px * (var(--max-vw) / var(--vw-base))), 74px);
    --btn-r: 8.718px;
  }

  .coverage-faq__cta { align-items: flex-start; }

  /* D-CF-5: desktop sub-note BELOW the button, 340 box offset 5.72 right, centred text */
  .coverage-faq__subnote {
    order: 0;
    width: var(--cf-subnote-w);
    margin-left: var(--cf-subnote-ml);
  }
}