/* =============================================================================
   components.css — CUSTOM COMPONENTS ONLY
   -----------------------------------------------------------------------------
   Material Web supplies the FORM CONTROLS (md-radio, md-checkbox,
   md-outlined-text-field, md-outlined-select, md-filled-button, md-switch,
   md-slider). Those are NOT styled here — they are themed by tokens.css.

   This file styles only what Material has NO equivalent for:
     layout shell · cards · eligibility rows · info banner · coverage selector ·
     member rows · info-icon tooltip · date-picker popup · funnel.

   RULE: NO raw values for brand, colour, or type. Every colour = var(--bc-*);
   every text size/weight/line-height = var(--bc-fs-*/--bc-fw-*/--bc-lh-*);
   every icon size = var(--bc-icon-*). Change them once in tokens.css.
   Depends on: tokens.css (must be linked first).
   ============================================================================= */

.pf-scope, .pf-scope *, .pf-scope *::before, .pf-scope *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
.pf-scope {
  font-family: var(--bc-font-family);
  font-weight: var(--bc-fw-regular);
  font-size: var(--bc-fs-body);
  color: var(--bc-text-primary);
  background: var(--bc-bg-page);
  line-height: var(--bc-lh-normal);
  -webkit-font-smoothing: antialiased;
  /* Sticky-footer: fill the viewport so the footer anchors to the bottom on short pages */
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

/* ===== ACCESSIBILITY (DESIGN_ACCESSIBILITY) ===== */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip-link { position: absolute; left: 8px; top: -48px; z-index: 300; background: var(--bc-bg-white); color: var(--bc-primary); padding: 10px 16px; border-radius: var(--bc-radius-sm); box-shadow: 0 2px 8px rgba(0,0,0,0.25); text-decoration: none; font-weight: var(--bc-fw-semibold); transition: top 0.15s; }
.skip-link:focus { top: 8px; }
.pf-scope a:focus-visible, .pf-scope button:focus-visible, .pf-scope [tabindex]:focus-visible, .pf-scope input:focus-visible, .pf-scope select:focus-visible { outline: 2px solid var(--bc-primary); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; scroll-behavior: auto !important; } }

/* ===== HEADER — full-bleed bar, content aligned to the 1184 container ===== */
.bc-header { background: var(--bc-bg-white); border-bottom: 1px solid var(--bc-border-light); }
.bc-header__inner { max-width: var(--content-max); margin: 0 auto; padding: 0 var(--content-padding); height: var(--header-height); display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.bc-header__logo { display: flex; align-items: center; }
.bc-header__logo img { height: 40px; width: auto; }
.bc-header__contact { display: inline-flex; align-items: center; gap: 8px; font-size: var(--bc-fs-sm); color: var(--bc-text-primary); text-decoration: none; white-space: nowrap; }
.bc-header__contact .material-icons { color: var(--bc-primary); font-size: var(--bc-icon-lg); }
.bc-header__contact-num { color: var(--bc-primary); font-weight: var(--bc-fw-semibold); }

/* ===== SUB-NAV — back link between header and the cards (sits on the page bg) ===== */
.bc-subnav { max-width: var(--content-max); width: 100%; margin: 0 auto; padding: var(--bc-space-md) var(--content-padding) 0; }
.bc-subnav__back { display: inline-flex; align-items: center; gap: 8px; background: none; border: none; cursor: pointer; padding: 0; font-family: var(--bc-font-family); font-size: var(--bc-fs-sm); font-weight: var(--bc-fw-semibold); color: var(--bc-text-primary); text-decoration: none; }
.bc-subnav__back .material-icons { font-size: var(--bc-icon-lg); }
.bc-subnav__back:hover { color: var(--bc-primary); }

/* ===== STEPPER — horizontal, minimal, INSIDE the top of the main card (PolicyBazaar) =====
   Circle on top, ONE-WORD label beneath, thin connectors between circles. Scrolls with
   the card (not fixed). One-word labels keep it minimal: Eligibility · Plan · Details · etc. */
/* 16px of space above the stepper inside the card (card padding is --card-padding) */
.bc-card__stepper { margin: calc(var(--bc-space-md) - var(--card-padding)) 0 var(--bc-space-xl); }
.bc-hstepper { display: flex; align-items: flex-start; list-style: none; width: 100%; margin: 0; padding: 0; }
/* equal-width steps so the bar fits the card and stays centred */
.bc-hstep { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; position: relative; }
/* connector runs from this circle's centre to the next circle's — at circle height, behind the dots, never under the labels */
.bc-hstep:not(:last-child)::before { content: ''; position: absolute; top: 9px; left: calc(50% + 10px); width: calc(100% - 20px); height: 2px; background: var(--bc-border-light); }
/* No numbers — just a dot: empty ring (upcoming), filled inner dot (active), solid (done) */
.bc-hstep__num { position: relative; z-index: 1; width: 20px; height: 20px; border-radius: 50%; border: 2px solid var(--bc-border-light); background: var(--bc-bg-white); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.bc-hstep__num::after { content: ''; width: 8px; height: 8px; border-radius: 50%; background: transparent; }
.bc-hstep__label { font-size: var(--bc-fs-2xs); color: var(--bc-text-muted); white-space: nowrap; }
.bc-hstep--active .bc-hstep__num { border-color: var(--bc-stepper-accent); }
.bc-hstep--active .bc-hstep__num::after { background: var(--bc-stepper-accent); }
.bc-hstep--active .bc-hstep__label { font-weight: var(--bc-fw-semibold); color: var(--bc-text-primary); }
.bc-hstep--done .bc-hstep__num { background: var(--bc-stepper-accent); border-color: var(--bc-stepper-accent); }
.bc-hstep--done .bc-hstep__num::after { width: 5px; height: 9px; border: solid var(--bc-text-white); border-width: 0 2px 2px 0; border-radius: 0; background: transparent; transform: rotate(45deg); margin-bottom: 2px; }
.bc-hstep--done .bc-hstep__label { color: var(--bc-text-primary); }
.bc-hstep--done:not(:last-child)::before { background: var(--bc-stepper-accent); }
/* Compact stepper (mobile) — hidden on desktop */
.bc-stepper-compact { display: none; align-items: center; gap: 8px; width: 100%; font-size: var(--bc-fs-sm); }
.bc-stepper-compact__count { font-weight: var(--bc-fw-semibold); color: var(--bc-primary); }
.bc-stepper-compact__name { color: var(--bc-text-primary); }

/* ===== CONTENT CONTAINER + 2-COL LAYOUT ===== */
.bc-container { max-width: var(--content-max); width: 100%; margin: 0 auto; padding: 0 var(--content-padding); flex: 1 0 auto; }
.bc-layout { display: grid; grid-template-columns: minmax(0, 1fr) var(--rightbox-width); gap: var(--layout-gutter); align-items: start; padding: var(--section-pad-y) 0; }
.bc-layout[hidden], .bc-subnav[hidden] { display: none; }   /* explicit — the display rules above override the [hidden] attribute otherwise */
.bc-main { min-width: 0; }
.step-heading { font-size: var(--bc-fs-display); font-weight: var(--bc-fw-bold); color: var(--bc-text-primary); letter-spacing: -0.5px; line-height: var(--bc-lh-tight); margin-bottom: var(--bc-space-xl); }

/* Right box — fixed, sticky below the stepper bar; present on every step */
.bc-rightbox { position: sticky; top: var(--rightbox-sticky-top); align-self: start; }
.bc-rightbox__card { background: var(--bc-bg-white); box-shadow: var(--bc-shadow-card); border-radius: var(--bc-radius-sm); padding: var(--bc-space-lg); }
.bc-rightbox__title { font-size: var(--bc-fs-body); font-weight: var(--bc-fw-bold); color: var(--bc-text-primary); }
.bc-rightbox__detail { font-size: var(--bc-fs-xs); color: var(--bc-text-light); margin-top: 4px; }
.bc-rightbox__price { font-size: var(--bc-fs-h2); font-weight: var(--bc-fw-black); color: var(--bc-text-primary); margin-top: 8px; }
.bc-rightbox__period { font-size: var(--bc-fs-xs); color: var(--bc-text-light); }

/* ===== MOBILE STICKY BOTTOM BAR — premium + CTA (hidden on desktop) ===== */
.bc-mobile-bar { display: none; }

/* ===== FOOTER — full-bleed, legal links ===== */
.bc-footer { background: var(--bc-bg-sidebar); border-top: 1px solid var(--bc-border-light); }
.bc-footer__inner { max-width: var(--content-max); margin: 0 auto; padding: 16px var(--content-padding); display: flex; gap: 16px; flex-wrap: wrap; }
.bc-footer a { font-size: var(--bc-fs-2xs); color: var(--bc-primary); text-decoration: none; }
.bc-footer a:hover { text-decoration: underline; }

/* ===== CARD (DESIGN_COMPONENT §7) ===== */
.bc-card { background: var(--bc-bg-white); border: none; box-shadow: var(--bc-shadow-card); border-radius: var(--bc-radius-sm); padding: var(--card-padding); margin-bottom: var(--bc-space-lg); }
.bc-card > *:last-child { margin-bottom: 0; }
.bc-card__title { font-size: var(--bc-fs-h2); font-weight: var(--bc-fw-semibold); color: var(--bc-text-primary); letter-spacing: -0.23px; line-height: var(--bc-lh-tight); margin-bottom: var(--bc-space-xs); }
.bc-card__subtitle { font-size: var(--bc-fs-sm); color: var(--bc-text-light); line-height: var(--bc-lh-normal); margin-bottom: var(--bc-space-lg); }
.bc-card__divider { height: 1px; background: var(--bc-border-divider); margin: var(--bc-space-md) 0 var(--bc-space-lg); }

/* ===== ELIGIBILITY QUESTION ROW (DESIGN_COMPONENT §18) ===== */
.eligibility-question { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--bc-space-lg); padding: var(--bc-space-md) 0; border-bottom: 1px solid var(--bc-border-light); }
.eligibility-question:last-child,
.eligibility-question:has(+ .bc-info-banner) { border-bottom: none; padding-bottom: 0; }
.eligibility-question__main { flex: 1; }
.eligibility-question__text { font-size: var(--bc-fs-body); color: var(--bc-text-primary); line-height: var(--bc-lh-normal); }
.eligibility-question__radios { display: flex; gap: var(--bc-space-lg); flex-shrink: 0; padding-top: 2px; }
.eligibility-question--ineligible .eligibility-question__text { color: var(--bc-text-muted); }

/* Inline error text (DESIGN_COMPONENT §2.4) — icon + text so it's never colour-only (WCAG 1.4.1) */
.bc-error-text { display: flex; align-items: center; gap: 6px; font-size: var(--bc-fs-xs); color: var(--bc-error); margin-top: 6px; }
.bc-error-text::before { content: 'error'; font-family: 'Material Icons'; font-size: var(--bc-icon-sm); line-height: 1; flex-shrink: 0; }
.bc-error-text[hidden] { display: none; }

/* ===== MATERIAL CONTROL WRAPPERS (bridge md-* into BCL layouts) ===== */
.bc-radio-opt { display: inline-flex; align-items: center; gap: 4px; cursor: pointer; font-size: var(--bc-fs-body); color: var(--bc-text-primary); }
.bc-check-row { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; }
.bc-check-row__label { font-size: var(--bc-fs-body); color: var(--bc-text-primary); line-height: var(--bc-lh-normal); }

/* ===== DATE PICKER (DESIGN_COMPONENT §2.5) — Material field + popup of Material selects =====
   Material Web ships NO date component; build markup via dateFieldHTML() in components.js. */
.bc-dp { position: relative; max-width: 360px; }
.bc-dp__field { width: 100%; cursor: pointer; }
.bc-dp__field::part(input) { cursor: pointer; }
.bc-dp__pop { position: absolute; top: calc(100% + 6px); left: 0; z-index: 60; background: var(--bc-bg-white); border: 1px solid var(--bc-border-light); border-radius: var(--bc-radius-sm); box-shadow: var(--bc-shadow-card-hover); padding: 16px; width: 320px; }
.bc-dp__pop[hidden] { display: none; }
.bc-dp__head { display: flex; gap: 8px; margin-bottom: 12px; }
.bc-dp__head md-outlined-select { flex: 1; }
.bc-dp__grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.bc-dp__dow { font-size: var(--bc-fs-2xs); font-weight: var(--bc-fw-semibold); color: var(--bc-text-muted); text-align: center; padding: 4px 0; }
.bc-dp__day { height: 34px; border: none; background: none; border-radius: var(--bc-radius-sm); cursor: pointer; font-family: var(--bc-font-family); font-size: var(--bc-fs-xs); color: var(--bc-text-primary); }
.bc-dp__day:hover { background: var(--bc-bg-sidebar); }
.bc-dp__day.is-selected { background: var(--bc-primary); color: var(--bc-text-white); }
.bc-dp__day.is-blank { visibility: hidden; cursor: default; }

/* ===== PARTNER / ADD SECTION (DESIGN_COMPONENT §8) ===== */
.bc-partner-section { border: 1px dashed var(--bc-primary); border-radius: var(--bc-radius-sm); padding: 20px 24px; display: flex; align-items: center; justify-content: space-between; cursor: pointer; transition: background 0.2s; }
.bc-partner-section:hover { background: var(--bc-bg-sidebar); }
.bc-partner-section__left { display: flex; align-items: center; gap: 12px; }
.bc-partner-icon { width: 36px; height: 36px; border-radius: 50%; background: var(--bc-bg-info); display: flex; align-items: center; justify-content: center; color: var(--bc-primary); font-size: var(--bc-icon-md); }
.bc-partner-section__title { font-size: var(--bc-fs-h3); font-weight: var(--bc-fw-medium); color: var(--bc-text-primary); }
.bc-partner-section__subtitle { font-size: var(--bc-fs-sm); color: var(--bc-text-light); margin-top: 2px; }
.bc-plus-icon { font-size: var(--bc-icon-xl); color: var(--bc-text-muted); font-weight: var(--bc-fw-light); }

/* ===== INFO BANNER (DESIGN_COMPONENT §6) ===== */
.bc-info-banner { background: var(--bc-bg-sidebar); border-radius: var(--bc-radius-sm); padding: 16px 20px; display: flex; align-items: center; gap: 12px; margin-bottom: var(--bc-space-lg); }
.bc-info-banner__icon { width: 32px; height: 32px; border-radius: 50%; background: var(--bc-primary); color: var(--bc-text-white); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.bc-info-banner__icon .material-icons { font-size: var(--bc-icon-md); }
.bc-info-banner__text { font-size: var(--bc-fs-sm); color: var(--bc-text-primary); line-height: var(--bc-lh-normal); }
.bc-info-banner--success { background: var(--success-bg); }
.bc-info-banner--success .bc-info-banner__icon { background: var(--bc-success); }
.bc-info-banner--error { background: var(--error-bg); }
.bc-info-banner--error .bc-info-banner__icon { background: var(--bc-error); }
.bc-info-banner--warning { background: var(--warning-bg); }
.bc-info-banner--warning .bc-info-banner__icon { background: var(--warning-orange); }

/* ===== SECTION HEADING (DESIGN_COMPONENT §17) ===== */
.section-heading { font-size: var(--bc-fs-h3); font-weight: var(--bc-fw-medium); color: var(--bc-text-primary); margin-bottom: var(--bc-space-md); display: flex; align-items: center; gap: var(--bc-space-sm); }

/* ===== FORM GRID ===== */
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--form-gap-col); margin-bottom: var(--form-gap-row); }
.form-row--single { grid-template-columns: 1fr; max-width: 340px; }
.member-grid { display: flex; flex-direction: column; gap: var(--bc-space-md); }

/* ===== STEP NAVIGATION — action row at the bottom of main ===== */
.step-nav { display: flex; justify-content: flex-end; align-items: center; gap: 12px; padding-top: var(--bc-space-lg); }

/* ===== CONDITIONAL SECTIONS ===== */
.section-hidden { display: none; opacity: 0; }
.section-visible { display: block; animation: fadeSlideIn 0.3s ease; }
@keyframes fadeSlideIn { from { opacity: 0; } to { opacity: 1; } }

/* ===== MEMBER ADDED ROW (DESIGN_COMPONENT §19) ===== */
.member-added { display: flex; align-items: center; justify-content: space-between; background: var(--bc-bg-sidebar); border: 1px solid var(--bc-border-card); border-radius: var(--bc-radius-sm); padding: 16px 20px; }
.member-added__info { display: flex; align-items: center; gap: 12px; }
.member-added__icon { width: 36px; height: 36px; border-radius: 50%; background: var(--bc-bg-info); display: flex; align-items: center; justify-content: center; color: var(--bc-primary); }
.member-added__icon .material-icons { font-size: var(--bc-icon-lg); }
.member-added__name { font-size: var(--bc-fs-sm); font-weight: var(--bc-fw-semibold); color: var(--bc-text-primary); }
.member-added__detail { font-size: var(--bc-fs-xs); color: var(--bc-text-light); }
.member-added__remove { background: none; border: none; cursor: pointer; color: var(--bc-text-muted); font-size: var(--bc-fs-xs); font-weight: var(--bc-fw-semibold); text-decoration: none; }
.member-added__remove:hover { text-decoration: underline; color: var(--bc-error); }

/* ===== INFO ICON + TOOLTIP (DESIGN_COMPONENT §15) ===== */
.bc-info-icon { position: relative; width: 24px; height: 24px; flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; background: none; border: none; padding: 0; cursor: help; color: var(--bc-text-muted); }
.bc-info-icon .material-icons { font-size: var(--bc-icon-lg); }
.bc-info-icon:focus-visible { outline: 2px solid var(--bc-primary); outline-offset: 2px; border-radius: 50%; }
.bc-tooltip { position: absolute; bottom: calc(100% + 8px); left: 50%; transform: translateX(-50%); background: var(--bc-text-primary); color: var(--bc-text-white); font-size: var(--bc-fs-2xs); line-height: var(--bc-lh-normal); padding: 8px 12px; border-radius: var(--bc-radius-sm); white-space: nowrap; opacity: 0; visibility: hidden; transition: opacity 150ms; pointer-events: none; z-index: 200; }
.bc-tooltip::after { content: ''; position: absolute; top: 100%; left: 50%; transform: translateX(-50%); border: 5px solid transparent; border-top-color: var(--bc-text-primary); }
.bc-info-icon:hover .bc-tooltip, .bc-info-icon:focus .bc-tooltip { opacity: 1; visibility: visible; }
.bc-tooltip--rich { white-space: normal; width: 300px; text-align: left; }
.bc-tooltip--rich strong { display: block; margin-bottom: 6px; }
.bc-tooltip--rich .bc-tooltip__list { display: block; margin: 6px 0; }

/* ===== COVERAGE SELECTOR (DESIGN_COMPONENT §20) ===== */
.coverage-selector { display: flex; flex-direction: column; }
.coverage-option { padding: 16px 0; border-bottom: 1px solid var(--bc-border-light); }
.coverage-option:first-child { padding-top: 0; }
.coverage-option:last-child { border-bottom: none; padding-bottom: 0; }
.coverage-option__row { display: flex; align-items: center; gap: 8px; }
.coverage-option__fields { margin-top: 16px; padding-left: 34px; max-width: 360px; }
.coverage-option__fields[hidden] { display: none; }
.coverage-add { display: inline-flex; align-items: center; gap: 6px; background: none; border: none; cursor: pointer; padding: 0; color: var(--bc-primary); font-family: var(--bc-font-family); font-size: var(--bc-fs-sm); font-weight: var(--bc-fw-semibold); }
.coverage-add:hover { color: var(--pbc-blue-button-hover); }
.coverage-add .material-icons { font-size: var(--bc-icon-md); }
.dependent-item { margin-bottom: 12px; }
.dependent-row { display: flex; align-items: flex-start; gap: 12px; }
.dependent-row .bc-dp { flex: 1; min-width: 0; margin-bottom: 0; }
.dependent-row__remove { background: none; border: none; cursor: pointer; white-space: nowrap; color: var(--bc-text-muted); font-size: var(--bc-fs-xs); font-weight: var(--bc-fw-semibold); text-decoration: none; height: var(--input-height, 44px); display: inline-flex; align-items: center; }
.dependent-row__remove:hover { text-decoration: underline; color: var(--bc-error); }

/* ===== FUNNEL (Plan Finder, Stage 1) — reuses the V2 shell =====
   Progress is a continuous FILL line (not the dot stepper); the question sits
   CENTERED and full-bleed; fields + CTA capped at 400px; no right box. */

/* Progress fill line (funnel) — thin bar under the header, fills as you advance */
.bc-progress { height: var(--progress-height); background: var(--bc-border-light); }
.bc-progress__fill { height: 100%; background: var(--bc-stepper-accent); transition: width .3s ease; }

/* Single centered column — no right box. Question is full-bleed; fields ≤400px. */
.bc-funnel { position: relative; padding: var(--section-pad-y) 0; }   /* same 32px content-region padding as .bc-layout */
.bc-funnel__topbar { position: absolute; left: 0; top: var(--section-pad-y); margin: 0; }   /* back floats top-left — no full-width band */

/* Back = md-outlined-icon-button (Material, bordered circle) — themed via tokens.css */

/* Centered question column */
.bc-funnel-q { text-align: center; }
.bc-funnel-q__heading { font-size: var(--bc-fs-h1); font-weight: var(--bc-fw-bold); color: var(--bc-text-primary); letter-spacing: -0.3px; line-height: var(--bc-lh-tight); margin-bottom: var(--bc-space-md); }   /* heading→subtext = 16px (standard) */
.bc-funnel-q__sub { font-size: var(--bc-fs-body); color: var(--bc-text-light); margin-bottom: var(--bc-space-lg); }
.bc-funnel-q__fields { max-width: var(--funnel-field-width); margin: 0 auto; display: flex; flex-direction: column; gap: var(--bc-space-md); text-align: left; }   /* ≤400px; 16px gap between cards */
.bc-agesel { width: 100%; }   /* funnel age dropdowns fill the field width */
.bc-funnel-q__cta { max-width: var(--funnel-field-width); margin: var(--bc-space-lg) auto 0; }
.bc-funnel-q__cta md-filled-button { width: 100%; }   /* button spans the 400px field width */
.bc-funnel-q__hint { font-size: var(--bc-fs-xs); color: var(--bc-text-muted); margin-top: 10px; display: inline-flex; gap: 6px; align-items: center; }
.bc-funnel-q__hint .material-icons { font-size: var(--bc-icon-sm); }

/* Selectable "who" cards — Material checkbox inside a big tap-target row */
.bc-choice { box-sizing: border-box; display: flex; align-items: center; gap: 12px; width: 100%; min-height: 56px; text-align: left; border: 1px solid var(--bc-border-light); border-radius: var(--bc-radius-sm); padding: 8px 20px; cursor: pointer; transition: border-color .15s, background .15s; }   /* neutral grey at rest; brand-blue on hover/selected */
.bc-choice:hover { border-color: var(--bc-primary); }
/* Selected = brand outline only (no fill); the filled md-checkbox carries the rest */
.bc-choice--selected { border-color: var(--bc-primary); }
.bc-choice__label { font-size: var(--bc-fs-body); color: var(--bc-text-primary); }

/* Age stepper rows (funnel Step 2) — −/+ Material icon buttons adjust the age */
.bc-agerow { box-sizing: border-box; display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 56px; border: 1px solid var(--bc-border-card); border-radius: var(--bc-radius-sm); padding: 8px 12px 8px 20px; }
.bc-agerow__label { font-size: var(--bc-fs-body); color: var(--bc-text-primary); }
/* Segmented stepper — connected [−] value [+] strip (PolicyBazaar-style, light). Custom: Material has no stepper. */
.bc-stepper { display: inline-flex; align-items: stretch; height: 36px; border: 1px solid var(--bc-border-light); border-radius: var(--bc-radius-sm); overflow: hidden; }
.bc-stepper__btn { width: 36px; border: none; background: var(--bc-bg-white); color: var(--bc-primary); font-size: 20px; line-height: 1; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; font-family: var(--bc-font-family); }
.bc-stepper__btn:hover { background: var(--bc-bg-sidebar); }
.bc-stepper__btn:disabled { color: var(--bc-border-light); cursor: not-allowed; }
.bc-stepper__val { min-width: 40px; padding: 0 6px; display: inline-flex; align-items: center; justify-content: center; border-left: 1px solid var(--bc-border-light); border-right: 1px solid var(--bc-border-light); font-size: var(--bc-fs-body); font-weight: var(--bc-fw-semibold); color: var(--bc-text-primary); }
.bc-agerow[hidden] { display: none; }     /* flex display would otherwise override [hidden] */
.bc-stepper[hidden] { display: none; }     /* same for the inline stepper */
/* Dependent(s) row: info sits next to the label; the count stepper is INLINE at the right (revealed when checked) */
.bc-choice .bc-info-icon { margin-left: 4px; }
.bc-choice .bc-stepper { margin-left: auto; }
.bc-funnel-q__fields > .bc-error-text { margin: 0; }

/* Engaging value bubble (the right rail) — sticky, tinted, with icon + proof point.
   Currently unused (bubble removed from the funnel "for now"); kept defined. */
.bc-valuebubble { max-width: 320px; background: var(--bc-bg-sidebar); border: 1px solid var(--bc-border-card); border-radius: var(--bc-radius-md); padding: var(--bc-space-lg); position: sticky; top: var(--rightbox-sticky-top); }
.bc-valuebubble__icon { width: 44px; height: 44px; border-radius: 50%; background: var(--bc-bg-info); color: var(--bc-primary); display: flex; align-items: center; justify-content: center; margin-bottom: 12px; }
.bc-valuebubble__icon .material-icons { font-size: var(--bc-icon-xl); }
.bc-valuebubble__title { font-size: var(--bc-fs-h3); font-weight: var(--bc-fw-bold); color: var(--bc-text-primary); margin-bottom: 6px; }
.bc-valuebubble__body { font-size: var(--bc-fs-sm); color: var(--bc-text-light); line-height: var(--bc-lh-relaxed); }
.bc-valuebubble__proof { display: flex; align-items: center; gap: 8px; margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--bc-border-card); font-size: var(--bc-fs-xs); font-weight: var(--bc-fw-semibold); color: var(--bc-text-primary); }
.bc-valuebubble__proof .material-icons { font-size: var(--bc-icon-md); color: var(--bc-stepper-accent); }

/* ===== FUNNEL — multi-screen single-page flow ===== */
.pf-screen { display: none; }
.pf-screen.is-active { display: block; }

/* Unlock gate modal (PolicyBazaar-style): green trust banner · form left · value bubble right · CTA right */
md-dialog.pf-unlock { max-width: 650px; }   /* caps the inner dialog's max-inline-size; width forced to 650 via JS (sizeDialog) */
@media (max-width: 680px) { md-dialog.pf-unlock { max-width: calc(100vw - 24px); } }
.pf-unlock > [slot="headline"] { font-size: var(--bc-fs-h2); font-weight: var(--bc-fw-bold); color: var(--bc-text-primary); border-bottom: 1px solid var(--bc-border-light); padding-bottom: var(--bc-space-md); }
/* Trust line — green shield icon + text, NO green background */
.pf-unlock__trust { display: flex; align-items: center; gap: 8px; font-size: var(--bc-fs-sm); color: var(--bc-text-primary); margin-bottom: var(--bc-space-lg); }
.pf-unlock__trust .material-icons { color: var(--bc-stepper-accent); font-size: var(--bc-icon-lg); flex-shrink: 0; }
.pf-unlock__grid { display: grid; grid-template-columns: 1fr 220px; gap: var(--bc-space-lg); align-items: start; }
.pf-unlock__form { display: flex; flex-direction: column; gap: 16px; }
.pf-unlock__form md-outlined-text-field { width: 100%; }
.pf-field { display: flex; flex-direction: column; }   /* field + its error stay together; 16px gap is between fields */
/* Bubble — white with a light-grey border (no blue fill) */
.pf-unlock__bubble { background: var(--bc-bg-white); border: 1px solid var(--bc-border-light); border-radius: var(--bc-radius-md); padding: var(--bc-space-md); }
.pf-unlock__points { display: flex; flex-direction: column; gap: 10px; }
.pf-unlock__point { display: flex; gap: 8px; font-size: var(--bc-fs-sm); color: var(--bc-text-primary); }
.pf-unlock__point .material-icons { color: var(--bc-stepper-accent); font-size: var(--bc-icon-md); flex-shrink: 0; }
.pf-unlock__actions { display: flex; align-items: center; justify-content: space-between; margin-top: var(--bc-space-lg); }
.pf-microcopy { margin: 12px auto 0; font-size: var(--bc-fs-xs); color: var(--bc-text-muted); }
.pf-microcopy a { color: var(--bc-primary); }
.pf-unlock__terms { margin: 0; }   /* sits under the email field; spacing comes from the form's flex gap */

/* Quick health check — condition checklist (2-col) + sub-question */
.pf-conditions { max-width: var(--funnel-field-width); margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; text-align: left; }
.pf-conditions .bc-choice { min-height: 48px; padding: 6px 14px; }
.pf-conditions .bc-choice__label { font-size: var(--bc-fs-sm); }
.pf-subgroup { max-width: var(--funnel-field-width); margin: var(--bc-space-lg) auto 0; text-align: left; }
.pf-subgroup__q { font-size: var(--bc-fs-body); color: var(--bc-text-primary); margin-bottom: 10px; }
.pf-subgroup__radios { display: flex; gap: var(--bc-space-lg); }

/* ===== PLANS RESULTS — old tier-card design (DESIGN_COMPONENT §21) ===== */
.pf-results { padding: var(--section-pad-y) 0; }
.pf-results__heading { font-size: var(--bc-fs-display); font-weight: var(--bc-fw-bold); color: var(--bc-text-primary); letter-spacing: -0.5px; line-height: var(--bc-lh-tight); margin: 0 0 var(--bc-space-lg); }

.pf-plans { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--layout-gutter); align-items: stretch; }
.bc-plan-card { position: relative; display: flex; flex-direction: column; background: var(--bc-bg-white); box-shadow: var(--bc-shadow-card); border-radius: var(--bc-radius-md); overflow: hidden; transition: box-shadow .2s ease, transform .2s ease; }
.bc-plan-card:hover { box-shadow: var(--bc-shadow-card-hover); transform: translateY(-3px); }
.bc-plan-card__label { padding: 8px 16px; text-align: center; font-size: var(--bc-fs-2xs); font-weight: var(--bc-fw-bold); letter-spacing: .3px; color: var(--bc-text-white); }
.bc-plan-card__head { padding: 20px 24px; }
.bc-plan-card__tiername { font-size: var(--bc-fs-h2); font-weight: var(--bc-fw-bold); line-height: 1.2; margin-bottom: 2px; }
.bc-plan-card__product { font-size: var(--bc-fs-h3); font-weight: var(--bc-fw-medium); color: var(--bc-text-primary); }
.bc-plan-card__compo { font-size: var(--bc-fs-xs); color: var(--bc-text-light); margin-top: 8px; }
.bc-plan-card__body { padding: 24px; display: flex; flex-direction: column; flex: 1; }
.bc-plan-card__price { font-size: var(--bc-fs-display); font-weight: var(--bc-fw-black); color: var(--bc-text-primary); margin: 0 0 4px; line-height: 1.1; }
.bc-plan-card__price span { font-size: var(--bc-fs-sm); font-weight: var(--bc-fw-regular); color: var(--bc-text-light); }
.bc-plan-card__est { font-size: var(--bc-fs-xs); color: var(--bc-text-muted); margin-bottom: 20px; }
.bc-plan-card__feats { display: flex; flex-direction: column; gap: 12px; margin-bottom: 24px; }
.bc-plan-card__feat { display: flex; gap: 10px; font-size: var(--bc-fs-sm); color: var(--bc-text-primary); line-height: 1.4; }
.bc-plan-card__check { width: 20px; height: 20px; border-radius: 50%; background: var(--bc-stepper-accent); color: var(--bc-text-white); display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; margin-top: 1px; }
.bc-plan-card__check .material-icons { font-size: 14px; }
.bc-plan-card__foot { margin-top: auto; display: flex; flex-direction: column; gap: 16px; }
.bc-plan-card__details { font-size: var(--bc-fs-sm); font-weight: var(--bc-fw-semibold); color: var(--bc-primary); text-decoration: none; align-self: flex-start; }
.bc-plan-card__details:hover { text-decoration: underline; }
.bc-plan-card__foot md-filled-button, .bc-plan-card__foot md-outlined-button { width: 100%; }
.bc-plan-card--essential .bc-plan-card__label { background: var(--bc-primary); }
.bc-plan-card--essential .bc-plan-card__head { background: linear-gradient(135deg, var(--bc-bg-sidebar), var(--bc-bg-info)); }
.bc-plan-card--essential .bc-plan-card__tiername { color: var(--bc-primary); }
.bc-plan-card--bronze .bc-plan-card__label { background: var(--bc-tier-bronze); }
.bc-plan-card--bronze .bc-plan-card__head { background: linear-gradient(135deg, var(--bc-tier-bronze-from), var(--bc-tier-bronze-to)); }
.bc-plan-card--bronze .bc-plan-card__tiername { color: var(--bc-tier-bronze); }
.bc-plan-card--silver .bc-plan-card__label { background: var(--bc-tier-silver); }
.bc-plan-card--silver .bc-plan-card__head { background: linear-gradient(135deg, var(--bc-tier-silver-from), var(--bc-tier-silver-to)); }
.bc-plan-card--silver .bc-plan-card__tiername { color: var(--bc-tier-silver); }
.bc-plan-card--gold .bc-plan-card__label { background: var(--bc-tier-gold); }
.bc-plan-card--gold .bc-plan-card__head { background: linear-gradient(135deg, var(--bc-tier-gold-from), var(--bc-tier-gold-to)); }
.bc-plan-card--gold .bc-plan-card__tiername { color: var(--bc-tier-gold); }

/* Build your own + header member summary */
.pf-buildown { text-align: center; margin-top: var(--bc-space-xl); }
.pf-buildown a { display: inline-flex; align-items: center; gap: 6px; font-size: var(--bc-fs-body); font-weight: var(--bc-fw-semibold); color: var(--bc-primary); text-decoration: none; }
.pf-buildown a:hover { text-decoration: underline; }
.pf-buildown .material-icons { font-size: var(--bc-icon-md); }
.pf-headsum { font-size: var(--bc-fs-sm); font-weight: var(--bc-fw-semibold); color: var(--bc-text-primary); }
.pf-headsum[hidden] { display: none; }

/* ===== COMPARATOR — verbatim IP Web data, sticky tier header, 8px rounded card ===== */
.pf-compare { margin-top: var(--bc-space-2xl); }
.pf-compare__heading { font-size: var(--bc-fs-h2); font-weight: var(--bc-fw-bold); color: var(--bc-text-primary); margin: 0 0 var(--bc-space-lg); }
.pf-compare__scroll { } /* desktop: no scroll container, so the header pins to the VIEWPORT (overflow-x added only on mobile) */
/* separate borders (not collapse) so border-radius rounds the card and sticky stays viewport-relative */
.bc-compare { width: 100%; min-width: 640px; border-collapse: separate; border-spacing: 0; background: var(--bc-bg-white); border-radius: var(--bc-radius-md); box-shadow: var(--bc-shadow-card); }
.bc-compare th, .bc-compare td { text-align: left; vertical-align: top; }
/* sticky tier header (tier name + price + CTA) */
.bc-compare thead th { position: sticky; top: 0; z-index: 2; background: var(--bc-bg-white); padding: 20px; border-bottom: 1px solid var(--bc-border-divider); }
.bc-compare thead .bc-compare__corner { border-top-left-radius: var(--bc-radius-md); }
.bc-compare thead th:last-child { border-top-right-radius: var(--bc-radius-md); }
.bc-compare__corner { width: 22%; font-size: var(--bc-fs-sm); font-weight: var(--bc-fw-semibold); color: var(--bc-text-muted); vertical-align: bottom; }
.bc-compare__tier { width: 26%; }
.bc-compare__tiername { font-size: var(--bc-fs-h3); font-weight: var(--bc-fw-bold); line-height: 1.2; }
.bc-compare__price { font-size: var(--bc-fs-h3); font-weight: var(--bc-fw-black); color: var(--bc-text-primary); margin: 4px 0 12px; }
.bc-compare__price span { font-size: var(--bc-fs-xs); font-weight: var(--bc-fw-regular); color: var(--bc-text-light); }
.bc-compare__tier md-filled-button, .bc-compare__tier md-outlined-button { width: 100%; }
.bc-compare__tier--essential .bc-compare__tiername { color: var(--bc-tier-essential); }
.bc-compare__tier--bronze .bc-compare__tiername { color: var(--bc-tier-bronze); }
.bc-compare__tier--silver .bc-compare__tiername { color: var(--bc-tier-silver); }
.bc-compare__tier--gold .bc-compare__tiername { color: var(--bc-tier-gold); }
/* body rows */
.bc-compare tbody th, .bc-compare tbody td { padding: 14px 20px; border-top: 1px solid var(--bc-border-light); font-size: var(--bc-fs-sm); line-height: 1.45; }
.bc-compare tbody th { font-weight: var(--bc-fw-regular); color: var(--bc-text-primary); }
.bc-compare tbody td { color: var(--bc-text-secondary); }
/* section subheader rows (Health, Prescription Drugs, …) */
.bc-compare__group td { background: var(--bc-bg-gray); font-weight: var(--bc-fw-bold); color: var(--bc-text-primary); padding: 12px 20px; }
/* check / cross cells */
.bc-compare__chk .material-icons { font-size: var(--bc-icon-lg); }
.bc-compare__chk:not(.bc-compare__chk--no) .material-icons { color: var(--bc-stepper-accent); }
.bc-compare__chk--no .material-icons { color: var(--bc-text-hint); }
.bc-compare__muted { color: var(--bc-text-muted); font-weight: var(--bc-fw-regular); }
/* highlight the popular column — header + every data cell (class-based so it works at any column
   position, e.g. GA's Silver is the 4th column because of Essential) */
.bc-compare thead .bc-compare__pop,
.bc-compare tbody tr:not(.bc-compare__group) .bc-compare__pop { background: var(--bc-bg-popular); }
/* rounded bottom corners on the last data row */
.bc-compare tbody tr:last-child th { border-bottom-left-radius: var(--bc-radius-md); }
.bc-compare tbody tr:last-child td:last-child { border-bottom-right-radius: var(--bc-radius-md); }
.bc-compare__note { margin-top: var(--bc-space-md); font-size: var(--bc-fs-xs); color: var(--bc-text-muted); line-height: 1.6; }

/* ===== BREADCRUMB (internal pages) ===== */
.bc-subnav { padding: var(--bc-space-md) 0 0; }
.bc-subnav + .bc-layout { padding-top: var(--bc-space-md); }  /* 16px between back-nav and first card */
.bc-breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; list-style: none; margin: 0; padding: 0; font-size: var(--bc-fs-sm); }
.bc-breadcrumb li { display: flex; align-items: center; gap: 6px; }
.bc-breadcrumb li:not(:last-child)::after { content: 'chevron_right'; font-family: 'Material Icons'; font-size: var(--bc-icon-sm); color: var(--bc-text-hint); }
.bc-breadcrumb a { color: var(--bc-primary); text-decoration: none; }
.bc-breadcrumb a:hover { text-decoration: underline; }
.bc-breadcrumb [aria-current="page"] { color: var(--bc-text-muted); }

/* ===== BACK LINK (PolicyBazaar-style "← Go back to quotes") ===== */
.bc-backlink { display: inline-flex; align-items: center; gap: 8px; font-size: var(--bc-fs-body); font-weight: var(--bc-fw-semibold); color: var(--bc-text-primary); text-decoration: none; }
.bc-backlink .material-icons { font-size: var(--bc-icon-lg); }
.bc-backlink:hover { color: var(--bc-primary); }

/* ===== PLAN DETAIL (Level 2) — identity card + benefit cards ===== */
/* top identity card — plan name, tier badge, composition */
/* white card with a tier-gradient stroke (gradient border via padding-box/border-box) */
.bc-plan-identity { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; border: 2px solid transparent; border-radius: var(--bc-radius-md); box-shadow: var(--bc-shadow-card); padding: var(--bc-space-xl); margin-bottom: var(--bc-space-md); background: var(--bc-bg-white); }
.bc-plan-identity__info { min-width: 0; }
.bc-plan-identity__name { font-size: var(--bc-fs-display); font-weight: var(--bc-fw-bold); line-height: var(--bc-lh-tight); color: var(--bc-text-primary); margin: 0; }
.bc-plan-identity__compo { font-size: var(--bc-fs-sm); color: var(--bc-text-secondary); margin-top: 8px; }
.bc-plan-identity__badge { flex-shrink: 0; align-self: flex-start; font-size: var(--bc-fs-2xs); font-weight: var(--bc-fw-bold); letter-spacing: .3px; color: var(--bc-text-white); background: var(--bc-text-muted); padding: 5px 12px; border-radius: var(--bc-radius-sm); white-space: nowrap; }
/* Each identity card carries a soft tier wash (fading to white) + tier-gradient border + tier-coloured name */
.bc-plan-identity--bronze { background: linear-gradient(120deg, color-mix(in srgb, var(--bc-tier-bronze-from) 45%, var(--bc-bg-white)), var(--bc-bg-white) 55%) padding-box, linear-gradient(135deg, var(--bc-tier-bronze), var(--bc-tier-bronze-to)) border-box; }
.bc-plan-identity--bronze .bc-plan-identity__name { color: var(--bc-tier-bronze); }
.bc-plan-identity--bronze .bc-plan-identity__badge { background: var(--bc-tier-bronze); }
.bc-plan-identity--silver { background: linear-gradient(120deg, color-mix(in srgb, var(--bc-tier-silver-from) 45%, var(--bc-bg-white)), var(--bc-bg-white) 55%) padding-box, linear-gradient(135deg, var(--bc-tier-silver), var(--bc-tier-silver-to)) border-box; }
.bc-plan-identity--silver .bc-plan-identity__name { color: var(--bc-tier-silver); }
.bc-plan-identity--silver .bc-plan-identity__badge { background: var(--bc-tier-silver); }
.bc-plan-identity--gold { background: linear-gradient(120deg, color-mix(in srgb, var(--bc-tier-gold-from) 45%, var(--bc-bg-white)), var(--bc-bg-white) 55%) padding-box, linear-gradient(135deg, var(--bc-tier-gold), var(--bc-tier-gold-to)) border-box; }
.bc-plan-identity--gold .bc-plan-identity__name { color: var(--bc-tier-gold); }
.bc-plan-identity--gold .bc-plan-identity__badge { background: var(--bc-tier-gold); }

/* ===== BUNDLE SELECTOR ("Select a bundle that fits your needs") ===== */
.bc-bundle { background: var(--bc-bg-white); border-radius: var(--bc-radius-md); box-shadow: var(--bc-shadow-card); padding: var(--bc-space-lg) var(--bc-space-xl); margin-bottom: var(--bc-space-md); }
/* heading matches the section (accordion) headers: 18px / semibold */
.bc-bundle__heading { font-size: var(--bc-fs-h3); font-weight: var(--bc-fw-semibold); color: var(--bc-text-primary); margin: 0 0 var(--bc-space-md); }
/* horizontal row of simple radio chips — same box + Material radio as the funnel's .bc-choice */
.bc-bundle__options { display: flex; gap: 12px; }
.bc-bundle-opt { box-sizing: border-box; flex: 1; display: flex; align-items: center; gap: 12px; min-height: 56px; border: 1px solid var(--bc-border-light); border-radius: var(--bc-radius-sm); padding: 8px 16px; cursor: pointer; transition: border-color .15s ease; }
.bc-bundle-opt:hover { border-color: var(--bc-primary); }
.bc-bundle-opt--selected { border-color: var(--bc-primary); }
.bc-bundle-opt md-radio { flex-shrink: 0; }
.bc-bundle-opt__name { font-size: var(--bc-fs-body); font-weight: var(--bc-fw-semibold); color: var(--bc-text-primary); }
.bc-bundle-opt__badge { margin-left: auto; font-size: var(--bc-fs-2xs); font-weight: var(--bc-fw-bold); color: var(--bc-text-white); background: var(--bc-primary); padding: 3px 8px; border-radius: var(--bc-radius-sm); white-space: nowrap; }
/* pill quick-nav — sticky, scrolls to the stacked benefit sections (active = green) */
.bc-pills { display: flex; gap: 8px; overflow-x: auto; position: sticky; top: 0; z-index: 5; background: var(--bc-bg-page); padding: 10px 0; margin-bottom: var(--bc-space-md); }
.bc-pill { flex-shrink: 0; border: 1px solid var(--bc-border-light); border-radius: 999px; padding: 8px 18px; background: var(--bc-bg-white); font-size: var(--bc-fs-sm); font-weight: var(--bc-fw-semibold); color: var(--bc-text-secondary); text-decoration: none; white-space: nowrap; cursor: pointer; transition: border-color .15s ease, color .15s ease; }
.bc-pill:hover { border-color: var(--bc-stepper-accent); }
.bc-pill.is-active { border-color: var(--bc-stepper-accent); color: var(--bc-stepper-accent); }
/* benefit section cards */
.bc-bsection { background: var(--bc-bg-white); border-radius: var(--bc-radius-md); box-shadow: var(--bc-shadow-card); padding: var(--bc-space-lg) var(--bc-space-xl); margin-bottom: var(--bc-space-md); scroll-margin-top: 72px; }
.bc-bsection__heading { display: flex; align-items: center; gap: 10px; font-size: var(--bc-fs-h3); font-weight: var(--bc-fw-semibold); color: var(--bc-text-primary); margin: 0 0 var(--bc-space-sm); }
.bc-bsection__icon { color: var(--bc-stepper-accent); font-size: var(--bc-icon-xl); flex-shrink: 0; }
.bc-bsection__sub { font-size: var(--bc-fs-sm); font-weight: var(--bc-fw-bold); color: var(--bc-text-primary); margin: 16px 0 0; }
.bc-bsection__foot { margin-top: var(--bc-space-md); font-size: var(--bc-fs-xs); color: var(--bc-text-muted); line-height: 1.6; }
/* benefit row — [tick] heading, value below; nothing on the right */
.bc-benefit { display: flex; align-items: flex-start; gap: 12px; padding: 12px 0; border-top: 1px solid var(--bc-border-light); }
.bc-benefit:first-child, .bc-bsection__sub + .bc-benefit { border-top: 0; }
.bc-benefit__tick { flex-shrink: 0; width: 24px; height: 24px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; margin-top: 1px; }
.bc-benefit__tick .material-icons { font-size: var(--bc-icon-sm); }
.bc-benefit__tick--yes { color: var(--bc-stepper-accent); background: color-mix(in srgb, var(--bc-stepper-accent) 14%, var(--bc-bg-white)); }
.bc-benefit__tick--no { color: var(--bc-error); background: color-mix(in srgb, var(--bc-error) 12%, var(--bc-bg-white)); }
.bc-benefit__text { min-width: 0; flex: 1; }
.bc-benefit__name { font-size: var(--bc-fs-body); font-weight: var(--bc-fw-semibold); color: var(--bc-text-primary); line-height: var(--bc-lh-snug); }
.bc-benefit__val { font-size: var(--bc-fs-sm); color: var(--bc-text-primary); margin-top: 2px; line-height: var(--bc-lh-snug); }
.bc-benefit__desc { font-size: var(--bc-fs-xs); color: var(--bc-text-muted); margin-top: 4px; line-height: var(--bc-lh-normal); }
.bc-benefit__desc[hidden] { display: none; }
/* expandable row (long descriptions, e.g. family planning) */
.bc-benefit__exptoggle { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; background: none; border: 0; padding: 0; cursor: pointer; font-family: var(--bc-font-family); text-align: left; }
.bc-benefit__chevron { color: var(--bc-text-muted); transition: transform .2s ease; flex-shrink: 0; }
.bc-benefit--exp.is-open .bc-benefit__chevron { transform: rotate(180deg); }
.bc-bsection__subdesc { font-size: var(--bc-fs-xs); color: var(--bc-text-muted); margin: 2px 0 4px; line-height: var(--bc-lh-normal); }

/* ===== SUMMARY CARD (right rail) ===== */
.bc-summary { background: var(--bc-bg-white); border-radius: var(--bc-radius-md); box-shadow: var(--bc-shadow-card); padding: var(--bc-space-lg); overflow: hidden; }
.bc-summary__title { font-size: var(--bc-fs-h3); font-weight: var(--bc-fw-bold); color: var(--bc-text-primary); margin: 0 0 var(--bc-space-md); }
/* plan box (light tint, tier shield) */
.bc-summary__plan { display: flex; align-items: center; gap: 14px; background: var(--bc-bg-sidebar); border-radius: var(--bc-radius-md); padding: 14px 16px; margin-bottom: var(--bc-space-md); }
/* shield = a gradient medallion (depth & presence), not a flat glyph */
.bc-summary__plan-icon { flex-shrink: 0; width: 50px; height: 50px; border-radius: 14px; display: inline-flex; align-items: center; justify-content: center; font-size: 28px; color: var(--bc-text-white); background: linear-gradient(145deg, var(--bc-text-light), var(--bc-text-muted)); }
/* per-tier: banner tint + shield gradient (no shadow) */
.bc-summary__plan--bronze { background: color-mix(in srgb, var(--bc-tier-bronze) 8%, var(--bc-bg-white)); }
.bc-summary__plan--bronze .bc-summary__plan-icon { background: linear-gradient(145deg, var(--bc-tier-bronze-to), var(--bc-tier-bronze)); }
.bc-summary__plan--silver { background: color-mix(in srgb, var(--bc-tier-silver) 8%, var(--bc-bg-white)); }
.bc-summary__plan--silver .bc-summary__plan-icon { background: linear-gradient(145deg, var(--bc-tier-silver-to), var(--bc-tier-silver)); }
.bc-summary__plan--gold { background: color-mix(in srgb, var(--bc-tier-gold) 10%, var(--bc-bg-white)); }
.bc-summary__plan--gold .bc-summary__plan-icon { background: linear-gradient(145deg, var(--bc-tier-gold-to), var(--bc-tier-gold)); }
.bc-summary__plan-name { font-size: var(--bc-fs-body); font-weight: var(--bc-fw-bold); color: var(--bc-text-primary); line-height: var(--bc-lh-snug); }
.bc-summary__plan-compo { font-size: var(--bc-fs-xs); color: var(--bc-text-light); margin-top: 2px; }
/* rows */
.bc-summary__row { display: flex; justify-content: space-between; align-items: center; gap: 12px; font-size: var(--bc-fs-sm); padding: 6px 0; }
.bc-summary__row .k { color: var(--bc-text-light); display: inline-flex; align-items: center; gap: 6px; }
.bc-summary__row .val { color: var(--bc-text-primary); font-weight: var(--bc-fw-semibold); display: inline-flex; align-items: center; gap: 6px; }
.bc-summary__edit { background: none; border: 0; padding: 0; cursor: pointer; display: inline-flex; color: var(--bc-primary); }
.bc-summary__edit .material-icons { font-size: var(--bc-icon-md); }
.bc-summary__div { border: 0; border-top: 1px solid var(--bc-border-light); margin: var(--bc-space-sm) 0; }
/* discount row + promo remove */
.bc-summary__discount .val { color: var(--bc-success); }
.bc-summary__promo-code { font-weight: var(--bc-fw-bold); color: var(--bc-success); }
.bc-summary__promo-remove { background: none; border: 0; padding: 0; cursor: pointer; display: inline-flex; color: var(--bc-text-muted); }
.bc-summary__promo-remove:hover { color: var(--bc-error); }
.bc-summary__promo-remove .material-icons { font-size: var(--bc-icon-sm); }
/* total */
.bc-summary__total { display: flex; justify-content: space-between; align-items: baseline; }
.bc-summary__total .k { font-size: var(--bc-fs-body); font-weight: var(--bc-fw-semibold); color: var(--bc-text-primary); }
.bc-summary__total .amt { font-size: var(--bc-fs-h2); font-weight: var(--bc-fw-black); color: var(--bc-text-primary); }
.bc-summary__total .amt span { font-size: var(--bc-fs-sm); font-weight: var(--bc-fw-regular); color: var(--bc-text-light); }
/* promo (collapsible) */
.bc-summary__promo-toggle { display: block; width: 100%; text-align: left; background: none; border: 1px dashed var(--bc-border-input); border-radius: var(--bc-radius-sm); padding: 12px 14px; margin: var(--bc-space-sm) 0; cursor: pointer; font-family: var(--bc-font-family); font-size: var(--bc-fs-sm); font-weight: var(--bc-fw-semibold); color: var(--bc-primary); }
.bc-summary__promo-toggle:hover { border-color: var(--bc-primary); background: var(--bc-bg-sidebar); }
.bc-summary__promo-body { padding: 6px 0; }
.bc-summary__promo-row { display: flex; gap: 8px; align-items: center; }
.bc-summary__promo-row md-outlined-text-field { flex: 1; }
/* Promo input — no label, ~45px tall, Apply inside the field (trailing slot). Custom to this field only. */
.bc-summary__promo-input { width: 100%; --md-outlined-field-top-space: 11px; --md-outlined-field-bottom-space: 11px; }
.bc-summary__promo-apply { background: none; border: 0; cursor: pointer; font-family: var(--bc-font-family); font-size: var(--bc-fs-sm); font-weight: var(--bc-fw-semibold); color: var(--bc-primary); padding: 0 4px; margin-right: 10px; white-space: nowrap; }
/* Billing frequency options (Monthly / Annual) — reuse the .bc-choice box */
.bc-billing-opts { display: flex; flex-direction: column; gap: 12px; }
.bc-billing-opt { align-items: center; }
.bc-billing-opt__main { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
.bc-billing-opt__title { font-size: var(--bc-fs-body); font-weight: var(--bc-fw-semibold); color: var(--bc-text-primary); }
.bc-billing-opt__sub { font-size: var(--bc-fs-xs); color: var(--bc-text-muted); }
.bc-billing-opt__amt { font-size: var(--bc-fs-h3); font-weight: var(--bc-fw-bold); color: var(--bc-text-primary); white-space: nowrap; }
.bc-billing-opt__amt span { font-size: var(--bc-fs-xs); font-weight: var(--bc-fw-regular); color: var(--bc-text-muted); }
/* note + cta */
.bc-summary__note { display: flex; align-items: flex-start; gap: 6px; font-size: var(--bc-fs-xs); color: var(--bc-text-muted); margin: var(--bc-space-md) 0; line-height: var(--bc-lh-normal); }
.bc-summary__note[hidden] { display: none; }
/* Filled block grouping Total premium + CTA + disclaimer (light muted, distinct from the white card) */
.bc-summary__paybox { background: var(--bc-bg-sidebar); padding: var(--bc-space-lg); margin: var(--bc-space-md) calc(-1 * var(--bc-space-lg)) calc(-1 * var(--bc-space-lg)); }
.bc-summary__paybox .bc-summary__note { margin: var(--bc-space-sm) 0 0; }
.bc-summary__note .material-icons { font-size: var(--bc-icon-md); flex-shrink: 0; }
.bc-summary__cta { width: 100%; }
.bc-summary__row[hidden], .bc-summary__promo-toggle[hidden], .bc-summary__promo-body[hidden] { display: none; }

/* ===== JOURNEY (Stage 2) — stepper bar, steps, forms ===== */
.bc-jstep-bar { background: var(--bc-bg-white); border-bottom: 1px solid var(--bc-border-light); }
.bc-jstep-bar__inner { max-width: var(--content-max); width: 100%; margin: 0 auto; padding: 18px var(--content-padding); }
.bc-step { display: none; }
.bc-step.is-active { display: block; }
.bc-step__title { font-size: var(--bc-fs-display); font-weight: var(--bc-fw-bold); color: var(--bc-text-primary); line-height: var(--bc-lh-tight); margin: 0 0 var(--bc-space-sm); }
.bc-step__sub { font-size: var(--bc-fs-body); color: var(--bc-text-light); margin: 0 0 var(--bc-space-lg); }
/* form sections (within one card, separated by .bc-card__divider) */
.bc-fsec { margin-bottom: var(--bc-space-lg); }   /* spacing between adjacent sections (no divider) */
.bc-fsec:last-of-type { margin-bottom: 0; }
.bc-fsec + .bc-card__divider, .bc-card__divider + .bc-fsec { margin-top: 0; }   /* a divider supplies the gap; don't double it with the section margin */
.bc-fsec__title { font-size: var(--bc-fs-h3); font-weight: var(--bc-fw-semibold); color: var(--bc-text-primary); margin: 0 0 var(--form-gap-row); }
.bc-form__grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--form-gap-row) var(--form-gap-col); }
.bc-field { display: flex; flex-direction: column; min-width: 0; }
.bc-field md-outlined-text-field, .bc-field md-outlined-select, .bc-field .bc-dp { width: 100%; }
.bc-field--full { grid-column: 1 / -1; }
.bc-field__help { font-size: var(--bc-fs-xs); color: var(--bc-text-muted); margin: 4px 0 0; }
/* eligibility gate */
.bc-elig__q { margin-bottom: var(--bc-space-lg); }
.bc-elig__q:last-of-type { margin-bottom: 0; }
.bc-elig__label { font-size: var(--bc-fs-body); font-weight: var(--bc-fw-semibold); color: var(--bc-text-primary); margin-bottom: 8px; }
.bc-elig__opts { display: flex; gap: 10px; }
.bc-elig__opts .bc-choice { flex: 1; min-height: 48px; }
.bc-elig__banner { display: none; align-items: flex-start; gap: 10px; background: var(--error-bg); border-radius: var(--bc-radius-sm); padding: 12px 14px; margin-top: var(--bc-space-md); font-size: var(--bc-fs-sm); color: var(--bc-text-primary); line-height: var(--bc-lh-normal); }
.bc-elig__banner.is-shown { display: flex; }
.bc-elig__banner .material-icons { color: var(--bc-error); font-size: var(--bc-icon-lg); flex-shrink: 0; }
/* step nav + placeholder */
.bc-step__nav { display: flex; justify-content: space-between; gap: 12px; margin-top: var(--bc-space-lg); }
.bc-step__placeholder { background: var(--bc-bg-white); border: 1px dashed var(--bc-border-divider); border-radius: var(--bc-radius-md); padding: var(--bc-space-2xl) var(--bc-space-xl); text-align: center; }
.bc-step__placeholder .material-icons { font-size: 40px; color: var(--bc-border-divider); }
.bc-step__placeholder p { color: var(--bc-text-muted); font-size: var(--bc-fs-sm); margin: var(--bc-space-sm) 0 0; }
@media (max-width: 767px) { .bc-form__grid { grid-template-columns: 1fr; } }
/* eligibility gate dialog + ineligible screen */
/* Direct child only — a descendant selector here also hit the [slot="headline"] inside every
   md-select-option, blowing option text up to H2/bold and overflowing the menu. */
.pf-elig > [slot="headline"] { font-size: var(--bc-fs-h2); font-weight: var(--bc-fw-bold); border-bottom: 1px solid var(--bc-border-light); padding-bottom: var(--bc-space-md); }
/* Even 24px padding on the dialog body (Material defaults the slotted content to 8px 24px) */
.pf-elig > [slot="content"] { padding: var(--bc-space-lg); }
.pf-elig__intro { font-size: var(--bc-fs-sm); color: var(--bc-text-secondary); margin: 0 0 var(--bc-space-md); }
.bc-ineligible { display: flex; justify-content: center; padding: var(--bc-space-2xl) 0; }
.bc-ineligible[hidden] { display: none; }

/* ===== UNDERWRITING — status gate interstitial (§5) ===== */
.bc-uw { display: flex; flex-direction: column; align-items: center; padding: var(--bc-space-2xl) var(--content-padding); }
.bc-uw[hidden] { display: none; }
.bc-uw__card { max-width: 560px; width: 100%; text-align: center; background: var(--bc-bg-white); border: 1px solid var(--bc-border-light); border-radius: var(--bc-radius-md); padding: var(--bc-space-2xl); }
.bc-uw__state[hidden] { display: none; }
.bc-uw__spinner { width: 56px; height: 56px; margin: 0 auto var(--bc-space-lg); border: 5px solid var(--bc-border-card); border-top-color: var(--bc-primary); border-radius: 50%; animation: bc-uw-spin 0.9s linear infinite; }
@keyframes bc-uw-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .bc-uw__spinner { animation-duration: 2.4s; } }
.bc-uw__icon { width: 72px; height: 72px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; margin-bottom: var(--bc-space-lg); }
.bc-uw__icon .material-icons { font-size: 40px; }
.bc-uw__icon--ok { background: var(--success-bg); color: var(--bc-success); }
.bc-uw__icon--bad { background: var(--error-bg); color: var(--bc-error); }
.bc-uw__title { font-size: var(--bc-fs-h1); font-weight: var(--bc-fw-bold); color: var(--bc-text-primary); line-height: var(--bc-lh-tight); margin: 0 0 var(--bc-space-sm); }
.bc-uw__msg { font-size: var(--bc-fs-body); color: var(--bc-text-secondary); line-height: var(--bc-lh-relaxed); margin: 0 0 var(--bc-space-md); }
.bc-uw__note { display: inline-flex; align-items: center; gap: 8px; font-size: var(--bc-fs-sm); color: var(--bc-text-primary); background: var(--bc-bg-sidebar); border-radius: var(--bc-radius-sm); padding: 10px 16px; margin: var(--bc-space-sm) 0 0; }
.bc-uw__note[hidden] { display: none; }
.bc-uw__note .material-icons { font-size: var(--bc-icon-md); color: var(--bc-primary); }
.bc-uw__actions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; margin-top: var(--bc-space-xl); }
.bc-uw__live { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
/* preview-only demo controls */
.bc-uw__demo { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; justify-content: center; margin-top: var(--bc-space-xl); padding: 10px 16px; border: 1px dashed var(--bc-border-card); border-radius: var(--bc-radius-sm); background: var(--bc-bg-page); }
.bc-uw__demo-label { font-size: var(--bc-fs-xs); color: var(--bc-text-muted); margin-right: 4px; }

/* ===== POLICY ISSUED — final confirmation + celebration ===== */
.bc-confetti { position: fixed; inset: 0; pointer-events: none; z-index: 9999; }
.bc-issued { display: flex; justify-content: center; padding: var(--bc-space-2xl) var(--content-padding); }
.bc-issued[hidden] { display: none; }
.bc-issued__card { max-width: 560px; width: 100%; text-align: center; background: var(--bc-bg-white); border: 1px solid var(--bc-border-light); border-radius: var(--bc-radius-md); box-shadow: var(--bc-shadow-card); padding: var(--bc-space-2xl); animation: bc-issued-in 0.45s ease both; }
@keyframes bc-issued-in { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .bc-issued__card { animation: none; } }
.bc-issued__icon { width: 80px; height: 80px; border-radius: 50%; background: var(--success-bg); color: var(--bc-success); display: inline-flex; align-items: center; justify-content: center; margin-bottom: var(--bc-space-lg); }
.bc-issued__icon .material-icons { font-size: 44px; }
.bc-issued__title { font-size: var(--bc-fs-display); font-weight: var(--bc-fw-bold); color: var(--bc-text-primary); line-height: var(--bc-lh-tight); margin: 0 0 var(--bc-space-sm); }
.bc-issued__sub { font-size: var(--bc-fs-body); color: var(--bc-text-secondary); margin: 0 0 var(--bc-space-xl); }
.bc-issued__policy { text-align: left; border: 1px solid var(--bc-border-light); border-radius: var(--bc-radius-sm); padding: var(--bc-space-xs) var(--bc-space-lg); margin-bottom: var(--bc-space-lg); }
.bc-issued__row { display: flex; justify-content: space-between; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--bc-border-light); font-size: var(--bc-fs-sm); }
.bc-issued__row:last-child { border-bottom: 0; }
.bc-issued__k { color: var(--bc-text-muted); }
.bc-issued__v { color: var(--bc-text-primary); font-weight: var(--bc-fw-semibold); text-align: right; }
.bc-issued__note { display: flex; align-items: flex-start; gap: 8px; text-align: left; font-size: var(--bc-fs-sm); color: var(--bc-text-secondary); background: var(--bc-bg-sidebar); border-radius: var(--bc-radius-sm); padding: 12px 16px; line-height: var(--bc-lh-normal); margin: 0; }
.bc-issued__note .material-icons { font-size: var(--bc-icon-md); color: var(--bc-primary); flex-shrink: 0; }
.bc-ineligible__card { max-width: 560px; text-align: center; background: var(--bc-bg-white); border: 1px solid var(--bc-border-light); border-radius: var(--bc-radius-md); padding: var(--bc-space-2xl); }
.bc-ineligible__icon { width: 72px; height: 72px; border-radius: 50%; background: var(--bc-bg-sidebar); color: var(--bc-primary); display: inline-flex; align-items: center; justify-content: center; margin-bottom: var(--bc-space-lg); }
.bc-ineligible__icon .material-icons { font-size: 36px; }
.bc-ineligible__title { font-size: var(--bc-fs-h1); font-weight: var(--bc-fw-bold); color: var(--bc-text-primary); line-height: var(--bc-lh-tight); margin: 0 0 var(--bc-space-sm); }
.bc-ineligible__msg { font-size: var(--bc-fs-body); color: var(--bc-text-secondary); line-height: var(--bc-lh-relaxed); margin: 0 0 var(--bc-space-xl); }
.bc-ineligible__actions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }

/* ===== BENEFICIARIES — one group per insured member, each totals 100% ===== */
.bc-bene-group { border: 1px solid var(--bc-border-light); border-radius: var(--bc-radius-md); margin-bottom: var(--bc-space-md); overflow: hidden; }
.bc-bene-group__head { background: var(--bc-bg-sidebar); padding: 12px 20px; }
.bc-bene-group__title { font-size: var(--bc-fs-body); font-weight: var(--bc-fw-bold); color: var(--bc-text-primary); }
.bc-bene-table { width: 100%; border-collapse: collapse; }
.bc-bene-table th { text-align: left; font-size: var(--bc-fs-xs); font-weight: var(--bc-fw-semibold); color: var(--bc-text-muted); padding: 10px 20px; border-top: 1px solid var(--bc-border-light); }
.bc-bene-table td { font-size: var(--bc-fs-sm); color: var(--bc-text-primary); padding: 12px 20px; border-top: 1px solid var(--bc-border-light); vertical-align: top; }
.bc-bene-table .bc-bene__num, .bc-bene-table th.bc-bene__num { text-align: right; }
.bc-bene__actions { white-space: nowrap; }
.bc-bene__actions button { background: none; border: 0; cursor: pointer; font-family: var(--bc-font-family); font-size: var(--bc-fs-sm); font-weight: var(--bc-fw-semibold); color: var(--bc-primary); padding: 0 0 0 14px; }
.bc-bene__empty { padding: 14px 20px; font-size: var(--bc-fs-sm); color: var(--bc-text-muted); border-top: 1px solid var(--bc-border-light); }
.bc-bene-group__foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 20px; border-top: 1px solid var(--bc-border-light); }
.bc-bene__add { display: inline-flex; align-items: center; gap: 6px; background: none; border: 0; cursor: pointer; font-family: var(--bc-font-family); font-size: var(--bc-fs-sm); font-weight: var(--bc-fw-semibold); color: var(--bc-primary); padding: 0; }
.bc-bene__add .material-icons { font-size: var(--bc-icon-md); }
.bc-bene__total { font-size: var(--bc-fs-sm); font-weight: var(--bc-fw-semibold); color: var(--bc-text-muted); }
.bc-bene__total.is-ok { color: var(--bc-success); }
.bc-bene__total.is-bad { color: var(--bc-error); }
.bc-bene__check { display: flex; align-items: center; gap: 8px; font-size: var(--bc-fs-sm); color: var(--bc-text-primary); }

/* ===== MEDICAL — 6-category declaration; per-person details on "Yes" ===== */
.med-cat { border: 1px solid var(--bc-border-light); border-radius: var(--bc-radius-md); margin-bottom: var(--bc-space-md); overflow: hidden; }
.med-cat:last-child { margin-bottom: 0; }
.med-cat.is-error { border-color: var(--bc-error); }
.med-cat__header { width: 100%; display: flex; align-items: center; gap: 14px; padding: 14px 20px; background: var(--bc-bg-white); border: 0; cursor: pointer; font-family: var(--bc-font-family); text-align: left; }
.med-cat__header:hover { background: var(--bc-bg-page); }
.med-cat__t { flex: 1; font-size: var(--bc-fs-body); font-weight: var(--bc-fw-semibold); color: var(--bc-text-primary); }
.med-cat__status { font-size: var(--bc-fs-sm); white-space: nowrap; }
.med-cat__status--none { color: var(--bc-text-muted); }
.med-cat__status--done { color: var(--bc-text-secondary); font-weight: var(--bc-fw-semibold); }
.med-cat__chev { color: var(--bc-text-muted); transition: transform .2s; flex-shrink: 0; }
.med-cat.is-open .med-cat__chev { transform: rotate(180deg); }
.med-cat__body { padding: 4px 20px 20px; }
.med-cat:not(.is-open) .med-cat__body { display: none; }
.med-cat__ask { font-size: var(--bc-fs-sm); color: var(--bc-text-secondary); margin: 0 0 12px; line-height: var(--bc-lh-relaxed); }
.med-cat__list { margin: 0 0 16px; padding-left: 20px; color: var(--bc-text-light); font-size: var(--bc-fs-xs); line-height: var(--bc-lh-relaxed); columns: 2; column-gap: 40px; }
.med-cat__list li { break-inside: avoid; margin-bottom: 3px; }
.med-gate { display: flex; gap: 10px; max-width: 260px; }
.med-gate .bc-choice { flex: 1; min-height: 48px; justify-content: center; }
.med-cat__err { display: none; font-size: var(--bc-fs-xs); color: var(--bc-error); font-weight: var(--bc-fw-semibold); margin-top: 10px; }
.med-cat.is-error .med-cat__err { display: block; }
.med-detail { margin-top: var(--bc-space-md); padding: var(--bc-space-md) var(--bc-space-lg); background: var(--bc-bg-page); border: 1px solid var(--bc-border-light); border-radius: var(--bc-radius-sm); }
.med-detail[hidden] { display: none; }
.med-detail__intro { font-size: var(--bc-fs-sm); color: var(--bc-text-secondary); margin: 0 0 var(--bc-space-md); }
.med-person { padding-top: var(--bc-space-md); margin-top: var(--bc-space-md); border-top: 1px solid var(--bc-border-light); }
.med-person:first-of-type { padding-top: 0; margin-top: 0; border-top: none; }
.med-person__head { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.med-person__name { font-size: var(--bc-fs-sm); font-weight: var(--bc-fw-semibold); color: var(--bc-primary); }
.med-table { width: 100%; border-collapse: collapse; background: var(--bc-bg-white); border: 1px solid var(--bc-border-light); border-radius: var(--bc-radius-sm); }
.med-table th { text-align: left; font-size: var(--bc-fs-xs); font-weight: var(--bc-fw-semibold); color: var(--bc-text-muted); padding: 9px 12px; border-bottom: 1px solid var(--bc-border-light); white-space: nowrap; }
.med-table td { font-size: var(--bc-fs-sm); color: var(--bc-text-primary); padding: 9px 12px; border-bottom: 1px solid var(--bc-border-light); vertical-align: top; }
.med-table tr:last-child td { border-bottom: 0; }
.med-table__actions { white-space: nowrap; text-align: right; width: 1%; }
.med-table__actions button { background: none; border: 0; cursor: pointer; color: var(--bc-text-muted); padding: 0 0 0 8px; }
.med-table__actions button:hover { color: var(--bc-primary); }
.med-discount { display: flex; gap: 12px; align-items: flex-start; margin-top: var(--bc-space-lg); padding: 16px 20px; border-radius: var(--bc-radius-sm); background: var(--success-bg); }
.med-discount[hidden] { display: none; }
.med-discount__icon { flex-shrink: 0; width: 32px; height: 32px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: var(--bc-success); color: var(--bc-text-white); }
.med-discount__icon .material-icons { font-size: var(--bc-icon-md); }
.med-discount__text { font-size: var(--bc-fs-sm); line-height: var(--bc-lh-normal); color: var(--bc-text-secondary); }
.med-discount__text strong { color: var(--bc-text-primary); }
/* Summary discount NOTE (the all-"No" callout — a green box). Scoped with :not(.bc-summary__row)
   so the applied-promo discount ROW stays a plain row aligned to Subtotal (just green value text). */
.bc-summary__discount:not(.bc-summary__row) { display: flex; align-items: flex-start; gap: 6px; margin: var(--bc-space-md) 0 0; padding: 10px 12px; border-radius: var(--bc-radius-sm); background: var(--success-bg); font-size: var(--bc-fs-xs); color: var(--bc-text-secondary); line-height: var(--bc-lh-normal); }
.bc-summary__discount:not(.bc-summary__row)[hidden] { display: none; }
.bc-summary__discount:not(.bc-summary__row) .material-icons { color: var(--bc-success); font-size: var(--bc-icon-md); flex-shrink: 0; }

/* ===== REVIEW — PolicyBazaar concept: a stack of standalone cards ===== */
/* On Review the step card flattens; the inline stepper then becomes its own standalone card. */
.bc-card--flat { background: none; box-shadow: none; padding: 0; margin-bottom: 0; border-radius: 0; }
.bc-card--flat .bc-card__stepper { background: var(--bc-bg-white); box-shadow: var(--bc-shadow-card); border-radius: var(--bc-radius-sm); padding: var(--bc-space-lg) var(--card-padding); margin: 0 0 var(--bc-space-lg); }
.bc-rev { background: var(--bc-bg-white); border-radius: var(--bc-radius-md); box-shadow: var(--bc-shadow-card); padding: var(--bc-space-lg) var(--card-padding); margin-bottom: var(--bc-space-lg); }
#reviewBody .bc-rev:last-child { margin-bottom: 0; }
.bc-rev__head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: var(--bc-space-md); }
.bc-rev__title { font-size: var(--bc-fs-h3); font-weight: var(--bc-fw-bold); color: var(--bc-text-primary); margin: 0; }
.bc-rev__edit { display: inline-flex; align-items: center; gap: 4px; background: none; border: 0; cursor: pointer; font-family: var(--bc-font-family); font-size: var(--bc-fs-sm); font-weight: var(--bc-fw-semibold); color: var(--bc-primary); text-decoration: none; padding: 0; white-space: nowrap; }
.bc-rev__edit:hover { text-decoration: underline; }
.bc-rev__edit .material-icons { font-size: var(--bc-icon-md); }
/* lead card — big heading + "Plan for …" + plan tile */
.bc-rev__heading { font-size: var(--bc-fs-display); font-weight: var(--bc-fw-bold); color: var(--bc-primary-dark); line-height: var(--bc-lh-tight); margin: 0 0 var(--bc-space-md); }
.bc-rev__planfor { font-size: var(--bc-fs-h3); font-weight: var(--bc-fw-semibold); color: var(--bc-text-primary); margin: 0 0 var(--bc-space-md); }
.bc-rev__plantile { display: flex; align-items: center; gap: 16px; }
.bc-rev__plantile-ic { flex-shrink: 0; width: 56px; height: 56px; border-radius: var(--bc-radius-sm); display: flex; align-items: center; justify-content: center; background: var(--bc-bg-sidebar); color: var(--bc-primary); }
.bc-rev__plantile-ic .material-icons { font-size: 28px; }
.bc-rev__plantile-main { flex: 1; min-width: 0; }
.bc-rev__plantile-name { font-size: var(--bc-fs-h3); font-weight: var(--bc-fw-bold); color: var(--bc-text-primary); }
.bc-rev__plantile-cover { font-size: var(--bc-fs-sm); color: var(--bc-text-secondary); margin-top: 2px; }
.bc-rev__plantile-prem { text-align: right; flex-shrink: 0; }
.bc-rev__plantile-prem-lbl { font-size: var(--bc-fs-xs); color: var(--bc-text-muted); }
.bc-rev__plantile-prem-amt { font-size: var(--bc-fs-h2); font-weight: var(--bc-fw-black); color: var(--bc-text-primary); }
.bc-rev__plantile-prem-amt span { font-size: var(--bc-fs-sm); font-weight: var(--bc-fw-regular); color: var(--bc-text-muted); }
/* person / member heading (name in brand colour + relation) */
.bc-rev__member { margin-bottom: var(--bc-space-sm); }
.bc-rev__member-name { font-size: var(--bc-fs-h3); font-weight: var(--bc-fw-bold); color: var(--bc-primary); }
.bc-rev__member-rel { font-size: var(--bc-fs-sm); color: var(--bc-text-muted); }
.bc-rev__muted { font-size: var(--bc-fs-sm); color: var(--bc-text-muted); margin: 0; }
/* label-above-value grid (two-up, like PolicyBazaar) */
.bc-rev__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--bc-space-md) var(--bc-space-lg); }
.bc-rev__cell { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.bc-rev__cell--full, .bc-rev__cell--2 { grid-column: 1 / -1; }
.bc-rev__lbl { font-size: var(--bc-fs-sm); color: var(--bc-text-muted); }
.bc-rev__cval { font-size: var(--bc-fs-body); color: var(--bc-text-primary); word-break: break-word; }
/* member / beneficiary blocks within one card */
.bc-rev__block + .bc-rev__block { margin-top: var(--bc-space-lg); padding-top: var(--bc-space-lg); border-top: 1px solid var(--bc-border-light); }
.bc-rev__med { font-size: var(--bc-fs-sm); color: var(--bc-text-secondary); padding: 6px 0 0 2px; }
.bc-rev__med strong { color: var(--bc-text-primary); font-weight: var(--bc-fw-semibold); }
/* Summary CTA (Review) — explicit [hidden] (md-filled-button's host display overrides the bare attribute) */
.bc-summary__cta { width: 100%; margin-top: var(--bc-space-md); }
.bc-summary__cta[hidden] { display: none; }
.bc-terms { margin-top: var(--bc-space-lg); padding-top: var(--bc-space-lg); border-top: 1px solid var(--bc-border-divider); }
.bc-terms__row { display: flex; align-items: flex-start; gap: 10px; cursor: pointer; }
.bc-terms__label { font-size: var(--bc-fs-sm); color: var(--bc-text-primary); line-height: var(--bc-lh-normal); }
.bc-terms__label a { color: var(--bc-primary); }
.bc-terms #termsErr { margin-top: 8px; }

/* ===== PAYMENT — method list (left) + selected form (right) ===== */
.bc-pay { display: flex; background: var(--bc-bg-white); border-radius: var(--bc-radius-md); box-shadow: var(--bc-shadow-card); overflow: hidden; }
.bc-pay__methods { width: 230px; flex-shrink: 0; background: var(--bc-bg-page); border-right: 1px solid var(--bc-border-light); }
.bc-pay__method { width: 100%; display: flex; align-items: center; gap: 12px; padding: 16px 20px; background: none; border: 0; border-bottom: 1px solid var(--bc-border-light); border-left: 3px solid transparent; cursor: pointer; font-family: var(--bc-font-family); font-size: var(--bc-fs-body); color: var(--bc-text-secondary); text-align: left; }
.bc-pay__method:hover { background: var(--bc-bg-white); }
.bc-pay__method.is-active { background: var(--bc-bg-white); color: var(--bc-primary); font-weight: var(--bc-fw-semibold); border-left-color: var(--bc-primary); }
.bc-pay__method .material-icons { font-size: var(--bc-icon-xl); color: inherit; }
.bc-pay__panel { flex: 1; min-width: 0; padding: var(--card-padding); }
.bc-pay__title { font-size: var(--bc-fs-h3); font-weight: var(--bc-fw-semibold); color: var(--bc-text-primary); margin: 0 0 var(--bc-space-md); }
.bc-pay__hint { font-size: var(--bc-fs-sm); color: var(--bc-text-secondary); margin: 0 0 var(--bc-space-lg); }
.bc-pay__secure { display: flex; align-items: center; gap: 8px; font-size: var(--bc-fs-xs); color: var(--bc-text-muted); margin: var(--bc-space-md) 0 0; line-height: var(--bc-lh-normal); }
.bc-pay__secure .material-icons { font-size: var(--bc-icon-md); color: var(--bc-success); flex-shrink: 0; }
.bc-pay__paynow { width: 100%; margin-top: var(--bc-space-lg); }
.bc-pay__done { text-align: center; padding: var(--bc-space-lg) 0; }

/* ===== RESPONSIVE (PolicyBazaar pattern) ===== */
/* ≤1024px — single column; right box drops below main (no longer sticky) */
@media (max-width: 1024px) {
  .bc-layout { grid-template-columns: 1fr; }
  .bc-rightbox { position: static; }
}
/* ≤767px — horizontal stepper collapses to a compact line, sticky bottom bar, tighter cards */
@media (max-width: 767px) {
  :root { --content-padding: 16px; }   /* tighter side gap on mobile (was 40) */
  .pf-scope { min-height: 0; padding-bottom: 76px; }  /* flow naturally + reserve room so the fixed CTA bar never covers the footer */
  .bc-header__inner { height: var(--mobile-header-height); }
  .bc-header__logo img { height: 32px; }
  /* The contact link is a plain "Contact Us" (no icon) — keep it visible on mobile. */
  .bc-funnel__topbar { position: static; margin-bottom: var(--bc-space-sm); }   /* back back in flow on mobile (no overlap with centered heading) */
  .bc-hstepper { display: none; }
  .bc-stepper-compact { display: flex; }
  .bc-layout { padding: var(--bc-space-lg) 0; }
  .bc-card { padding: 20px; }
  .eligibility-question { flex-direction: column; gap: 12px; }
  .form-row { grid-template-columns: 1fr; }
  .form-row--single { max-width: 100%; }
  .pf-conditions { grid-template-columns: 1fr; }
  .pf-plans { grid-template-columns: 1fr; }
  .pf-unlock__grid { grid-template-columns: 1fr; }
  /* table is too wide for a phone → let it scroll horizontally (sticky header pins within the scroller here) */
  .pf-compare__scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .bc-bundle__options { flex-direction: column; }   /* bundle chips stack on mobile */
  .bc-plan-identity { flex-direction: column; }      /* badge drops below title on mobile */
  .bc-plan-identity__badge { align-self: flex-start; }
  .med-cat__list { columns: 1; }
  .bc-rev__grid { grid-template-columns: 1fr; }
  .bc-rev__plantile { flex-wrap: wrap; }
  .bc-pay { flex-direction: column; }
  .bc-pay__methods { width: 100%; display: flex; overflow-x: auto; border-right: 0; border-bottom: 1px solid var(--bc-border-light); }
  .bc-pay__method { border-bottom: 0; border-left: 0; border-bottom: 3px solid transparent; white-space: nowrap; }
  .bc-pay__method.is-active { border-left-color: transparent; border-bottom-color: var(--bc-primary); }
  /* Premium + CTA pinned to the bottom; full summary still flows below main. */
  .bc-mobile-bar { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 60; background: var(--bc-bg-white); border-top: 1px solid var(--bc-border-light); padding: 12px 16px; align-items: center; justify-content: space-between; gap: 12px; }
  .bc-mobile-bar__price { font-size: var(--bc-fs-h3); font-weight: var(--bc-fw-black); color: var(--bc-text-primary); }
  .bc-mobile-bar__period { font-size: var(--bc-fs-2xs); color: var(--bc-text-light); }
}

/* ===== RESULTS HELP LINE — "Not sure which plan…" · "See all of our plan options." ===== */
.pf-results__help { margin-top: var(--bc-space-2xl); text-align: center; font-size: var(--bc-fs-body); color: var(--bc-text-secondary); }
.pf-results__help a { color: var(--bc-primary); font-weight: var(--bc-fw-semibold); text-decoration: none; }
.pf-results__help a:hover { text-decoration: underline; }
.pf-results__help-sep { margin: 0 var(--bc-space-sm); color: var(--bc-text-light); font-weight: var(--bc-fw-regular); }

/* ===== FOOTER (shared page chrome — verbatim PBC legal footer) ===== */
.bc-footer { background: var(--bc-bg-sidebar); border-top: 1px solid var(--bc-border-light); flex-shrink: 0; }
.bc-footer__inner { max-width: var(--content-max); margin: 0 auto; padding: var(--bc-space-lg) var(--content-padding) var(--bc-space-xl); }
.bc-footer__links { display: flex; flex-wrap: wrap; align-items: center; row-gap: var(--bc-space-xs); margin-bottom: var(--bc-space-md); }
.bc-footer__links a { font-size: var(--bc-fs-2xs); color: var(--bc-primary); text-decoration: none; }
.bc-footer__links a:hover { text-decoration: underline; }
.bc-footer__links a:not(:last-child)::after { content: "·"; margin: 0 var(--bc-space-md); color: var(--bc-text-light); }
.bc-footer__cupe { font-size: var(--bc-fs-2xs); color: var(--bc-text-light); }
.bc-footer__legal { margin: 0 0 var(--bc-space-sm); font-size: var(--bc-fs-2xs); line-height: 1.65; color: var(--bc-text-muted); }
.bc-footer__legal:last-child { margin-bottom: 0; }
.bc-footer__legal a { color: var(--bc-primary); text-decoration: none; }
.bc-footer__legal a:hover { text-decoration: underline; }
.bc-footer__legal--fine { color: var(--bc-text-light); }
@media (max-width: 700px) {
  .bc-footer__inner { padding: var(--bc-space-lg) 16px calc(var(--bc-space-2xl) + env(safe-area-inset-bottom, 0px)); }
}
