/* Bloodwork rebuild. Only --apex-* tokens plus the band colours, which come
   from the portal's own range bar so the page and the product agree. */

.bwl-hero, .bwl-sec { --band-bad: #d9342b; --band-ok: #e8a33d; --band-best: #2a9d5c; }

/* ---------- hero ----------
   Full-bleed photograph, copy over a scrim on the left. The supplied image is
   a bright beach sunrise and already carries the score and biomarker cards, so
   (a) the page draws no chips of its own and (b) the scrim has to be heavy
   enough for white type over a 215/255 sky, while thinning out fast so the
   sunrise and the cards stay intact. */
.bwl-hero { position: relative; isolation: isolate; overflow: hidden;
            background: var(--apex-ink); color: #fff;
            aspect-ratio: 1671 / 941; display: flex; align-items: center; }
.bwl-hero-bg { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%;
               object-fit: cover; object-position: 72% 50%; }
.bwl-hero::after { content: ""; position: absolute; inset: 0; z-index: -1;
                   background: linear-gradient(96deg, rgba(12,10,9,.94) 0%,
                               rgba(12,10,9,.88) 22%, rgba(12,10,9,.62) 38%,
                               rgba(12,10,9,.16) 52%, rgba(12,10,9,0) 64%); }
.bwl-hero-in { position: relative; width: 100%; max-width: var(--apex-max);
               margin: 0 auto; padding: clamp(32px, 4vw, 80px) var(--apex-gutter); }
.bwl-hero-copy { max-width: 36ch; }
.bwl-kicker { font: 800 12px/1 var(--apex-font-mono); letter-spacing: .16em;
              text-transform: uppercase; color: var(--apex-red-bright); }
.bwl-kicker-red { color: var(--apex-red); }
.bwl-hero h1 { margin: clamp(14px, 1.6vw, 20px) 0 clamp(14px, 1.6vw, 20px);
               font-size: clamp(30px, 3.4vw, 46px);
               font-weight: 900; line-height: 1.03; letter-spacing: -.032em;
               text-shadow: 0 2px 26px rgba(0,0,0,.45); }
.bwl-hero h1 em { font-style: normal; color: var(--apex-red-bright); }
.bwl-strike { position: relative; white-space: nowrap; color: #9e958b; }
.bwl-strike::after { content: ""; position: absolute; left: -2%; right: -2%; top: 54%;
                     height: 5px; border-radius: 3px; background: var(--apex-red-bright);
                     transform: scaleX(0); transform-origin: left;
                     animation: bwl-strike .55s .45s cubic-bezier(.2,.8,.3,1) forwards; }
@keyframes bwl-strike { to { transform: scaleX(1); } }
.bwl-lead { margin: 0; font-size: clamp(15px, 1vw, 16.5px); line-height: 1.6;
            color: #e4ded7; max-width: 40ch; text-shadow: 0 1px 16px rgba(0,0,0,.5); }
.bwl-hero-cta { display: flex; flex-wrap: wrap; gap: 12px; margin: clamp(20px, 2.6vw, 32px) 0 0; }
.bwl-hero .btn-ghost { color: #fff; box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.5);
                       background: rgba(0,0,0,.22); }
.bwl-hero .btn-ghost:hover { background: rgba(255,255,255,.14); box-shadow: inset 0 0 0 1.5px #fff; }
.bwl-stats { display: flex; flex-wrap: wrap; gap: clamp(18px, 2.4vw, 44px);
             margin: clamp(22px, 3vw, 40px) 0 0; padding-top: clamp(16px, 2vw, 26px);
             border-top: 1px solid rgba(255,255,255,.26); }
.bwl-stats dt { font-size: clamp(22px, 2.2vw, 30px); font-weight: 900; letter-spacing: -.025em; }
.bwl-stats dd { margin: 5px 0 0; font-size: 12.5px; line-height: 1.45; color: #c3bab0; max-width: 15ch; }

/* the band is at its shortest just above the stacking breakpoint */
@media (min-width: 1201px) and (max-width: 1599px) {
  .bwl-hero-in { padding-top: 22px; padding-bottom: 22px; }
  .bwl-hero h1 { font-size: clamp(28px, 2.9vw, 38px); margin: 12px 0 12px; }
  .bwl-lead { font-size: 15px; line-height: 1.55; max-width: 38ch; }
  .bwl-hero-cta { margin-top: 18px; }
  .bwl-stats { margin-top: 20px; padding-top: 14px; }
  .bwl-stats dt { font-size: 24px; }
  .bwl-stats dd { font-size: 11.5px; }
}

@media (max-width: 1200px) {
  /* stacked: the photograph becomes its own band so the baked-in cards stay
     legible, and the copy sits on solid ink underneath */
  .bwl-hero { display: block; aspect-ratio: auto; }
  .bwl-hero-bg { position: relative; inset: auto; z-index: 0; height: auto;
                 aspect-ratio: 16 / 10; object-position: 70% 50%; }
  .bwl-hero::after { display: none; }
  .bwl-hero-in { padding: 36px var(--apex-gutter) 56px; }
  .bwl-hero-copy { max-width: none; }
  .bwl-hero h1, .bwl-lead { text-shadow: none; }
}
@media (max-width: 620px) {
  .bwl-stats { gap: 18px; }
  .bwl-hero-bg { aspect-ratio: 4 / 3; object-position: 76% 50%; }
}
@media (prefers-reduced-motion: reduce) {
  .bwl-strike::after { animation: none; transform: scaleX(1); }
}

/* ---------- the score card ----------
   Rebuilt 2026-09-28. Blake: "Center this and make it look cleaner... I'd like
   a dynamic nature to this graphic." Previously the dial and the subsystem
   list sat side by side and the "/100" hung off the ring's edge rather than
   belonging to the number. Now it is one centred column: dial, verdict, then
   the systems — and the fills cascade rather than all arriving at once. */
.bwl-score { background: #1f1d1b; border: 1px solid rgba(255,255,255,.12);
             border-radius: 20px; padding: 26px clamp(22px, 2.4vw, 34px) 22px;
             text-align: center; }
.bwl-score-head { display: flex; align-items: baseline; justify-content: space-between;
                  gap: 16px; margin-bottom: 26px; text-align: left; }
.bwl-score-kicker { font-size: 15.5px; font-weight: 800; color: var(--apex-red-bright); }
.bwl-score-meta { font: 700 10px/1 var(--apex-font-mono); letter-spacing: .14em;
                  text-transform: uppercase; color: #7f766d; }

.bwl-dial { position: relative; width: 168px; height: 168px; margin: 0 auto; }
.bwl-dial svg { width: 100%; height: 100%; transform: rotate(-90deg); overflow: visible; }
.bwl-dial circle { fill: none; stroke-width: 10; }
.bwl-dial-bg { stroke: rgba(255,255,255,.10); }
.bwl-dial-fg { stroke: var(--band-best); stroke-linecap: round;
               stroke-dasharray: 358; stroke-dashoffset: 358;
               filter: drop-shadow(0 0 8px rgba(42,157,92,.55));
               transition: stroke-dashoffset 1.6s cubic-bezier(.22,.9,.28,1); }
.bwl-dial-num { position: absolute; inset: 0; display: flex; flex-direction: column;
                align-items: center; justify-content: center; gap: 2px; }
.bwl-dial-num b { font-size: 52px; font-weight: 900; letter-spacing: -.045em;
                  line-height: 1; color: #fff; font-variant-numeric: tabular-nums; }
.bwl-dial-num i { font-style: normal; font: 700 9.5px/1 var(--apex-font-mono);
                  letter-spacing: .14em; text-transform: uppercase; color: #8a8178; }
/* the verdict, the way the portal states it */
.bwl-dial-tag { display: inline-flex; align-items: center; gap: 7px; margin: 16px auto 26px;
                padding: 6px 13px; border-radius: 999px;
                background: rgba(42,157,92,.14);
                font: 800 10.5px/1 var(--apex-font-mono); letter-spacing: .14em;
                text-transform: uppercase; color: var(--band-best); }
.bwl-dial-tag span { width: 7px; height: 7px; border-radius: 50%; background: var(--band-best); }

.bwl-subs { display: grid; gap: 11px; text-align: left;
            padding-top: 22px; border-top: 1px solid rgba(255,255,255,.10); }
.bwl-subs li { display: grid; grid-template-columns: 96px minmax(0, 1fr) 34px;
               align-items: center; gap: 12px; font-size: 12.5px; color: #cfc6bc; }
.bwl-subs i { display: block; height: 6px; border-radius: 3px;
              background: rgba(255,255,255,.12); position: relative; overflow: hidden; }
.bwl-subs i::after { content: ""; position: absolute; inset: 0 auto 0 0;
                     width: var(--bar, 0); border-radius: 3px; background: var(--band-best);
                     /* each row starts a beat after the one above it */
                     transition: width .9s cubic-bezier(.22,.9,.28,1);
                     transition-delay: calc(var(--i, 0) * 90ms + 250ms); }
/* not every system is equal — amber where there is room to improve */
.bwl-subs i.is-mid::after { background: var(--band-ok); }
.bwl-subs b { text-align: right; font-size: 12.5px; font-weight: 800; color: #fff;
              font-variant-numeric: tabular-nums; }
.bwl-score-foot { margin: 22px 0 0; font-size: 11.5px; line-height: 1.5; color: #7f766d;
                  text-align: left; }

@media (prefers-reduced-motion: reduce) {
  .bwl-dial-fg, .bwl-subs i::after { transition: none; }
}

/* ---------- sections ---------- */
.bwl-sec { max-width: var(--apex-max); margin: 0 auto; padding: clamp(64px, 7vw, 104px) var(--apex-gutter); }
.bwl-alt { max-width: none; background: var(--apex-bg-alt); }
.bwl-alt > * { max-width: var(--apex-max); margin-left: auto; margin-right: auto; }
.bwl-head { margin-bottom: 44px; }
.bwl-head h2 { margin: 16px 0 18px; font-size: clamp(28px, 3.3vw, 44px); font-weight: 900;
               line-height: 1.07; letter-spacing: -.022em; max-width: 20ch; }
.bwl-sec .bwl-lead { color: var(--apex-body); }

/* ---------- the range bar: the argument ---------- */
.bwl-range-pills { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 22px; }
.bwl-range-pills button { padding: 9px 16px; border-radius: 999px; cursor: pointer;
                          font: 700 13px/1 var(--apex-font-ui); color: var(--apex-ink);
                          background: transparent; border: 1px solid var(--apex-rule); }
.bwl-range-pills button:hover { border-color: var(--apex-ink); }
.bwl-range-pills button.is-on { background: var(--apex-ink); color: #fff; border-color: var(--apex-ink); }

.bwl-range { border: 1px solid var(--apex-rule); border-radius: var(--apex-radius, 14px);
             padding: clamp(20px, 2.4vw, 32px); background: #fff; }
.bwl-range-top { display: flex; flex-wrap: wrap; align-items: flex-end;
                 justify-content: space-between; gap: 16px; margin-bottom: 26px; }
.bwl-range-cat { font: 700 10.5px/1 var(--apex-font-mono); letter-spacing: .14em;
                 text-transform: uppercase; color: var(--apex-muted); }
.bwl-range-top h3 { margin: 8px 0 0; font-size: clamp(22px, 2.4vw, 30px); font-weight: 900;
                    letter-spacing: -.02em; }
.bwl-range-read { display: flex; align-items: baseline; gap: 8px; }
.bwl-range-read b { font-size: clamp(30px, 3.4vw, 42px); font-weight: 900; letter-spacing: -.03em; }
.bwl-range-read span { font-size: 14px; color: var(--apex-muted); }
.bwl-flag { font: 700 10.5px/1 var(--apex-font-mono); letter-spacing: .1em;
            text-transform: uppercase; padding: 5px 9px; border-radius: 999px;
            background: rgba(217,52,43,.12); color: var(--band-bad); font-style: normal; }
.bwl-flag.is-ok { background: rgba(42,157,92,.14); color: var(--band-best); }

.bwl-bands { position: relative; display: grid; gap: 3px; margin-top: 8px;
             grid-template-columns: 1fr 1.1fr 1.4fr 1.1fr 1fr; }
.bwl-band i { display: block; height: 10px; border-radius: 3px; }
.bwl-band span { display: block; margin-top: 8px; font: 700 10px/1.3 var(--apex-font-mono);
                 letter-spacing: .08em; text-transform: uppercase; color: var(--apex-muted);
                 text-align: center; }
.bwl-band--bad i { background: var(--band-bad); }
.bwl-band--ok i { background: var(--band-ok); }
.bwl-band--best i { background: var(--band-best); }
.bwl-band--best span { color: var(--band-best); }
/* the pointer is the whole point — it lands inside "normal", beside "optimal" */
.bwl-you { position: absolute; top: -34px; left: 0; transform: translateX(-50%);
           transition: left .5s cubic-bezier(.2,.8,.3,1); white-space: nowrap; }
.bwl-you span { display: block; font: 800 10.5px/1 var(--apex-font-mono);
                letter-spacing: .1em; text-transform: uppercase; color: var(--apex-ink);
                background: #fff; padding-bottom: 6px; }
.bwl-you::after { content: ""; display: block; width: 2px; height: 26px; margin: 0 auto;
                  background: var(--apex-ink); }
.bwl-scale { display: flex; justify-content: space-between; margin-top: 6px;
             font: 600 11px/1 var(--apex-font-mono); color: var(--apex-muted); }
.bwl-range-note { margin: 24px 0 0; font-size: 15px; line-height: 1.65;
                  color: var(--apex-body); max-width: 68ch; }

.bwl-normal-pts { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
                  gap: clamp(20px, 2.6vw, 40px); margin-top: 52px; padding-top: 44px;
                  border-top: 1px solid var(--apex-rule); }
.bwl-normal-pts h4 { margin: 0 0 10px; font-size: 18px; font-weight: 800; letter-spacing: -.01em; }
.bwl-normal-pts p { margin: 0; font-size: 15px; line-height: 1.65; color: var(--apex-body); }

/* ---------- panel library ---------- */
.bwl-filters { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 26px; }
.bwl-filters button { padding: 9px 18px; border-radius: 999px; cursor: pointer;
                      font: 700 13px/1 var(--apex-font-ui); color: var(--apex-ink);
                      background: #fff; border: 1px solid var(--apex-rule); }
.bwl-filters button.is-on { background: var(--apex-red); color: #fff; border-color: var(--apex-red); }
.bwl-panels { display: grid; grid-template-columns: repeat(auto-fit, minmax(290px, 1fr)); gap: 18px; }
.bwl-panel { background: #fff; border: 1px solid var(--apex-rule);
             border-radius: var(--apex-radius, 14px); padding: 24px; }
.bwl-panel[hidden] { display: none; }
.bwl-panel-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.bwl-tag { font: 800 10px/1 var(--apex-font-mono); letter-spacing: .14em; text-transform: uppercase;
           color: var(--apex-red); }
.bwl-sex { font: 700 10px/1 var(--apex-font-mono); letter-spacing: .12em; text-transform: uppercase;
           color: var(--apex-muted); }
.bwl-panel h3 { margin: 14px 0 12px; font-size: 21px; font-weight: 900; letter-spacing: -.018em; }
.bwl-count { display: flex; align-items: baseline; gap: 8px; margin-bottom: 12px; }
.bwl-count b { font-size: 38px; font-weight: 900; letter-spacing: -.035em; line-height: 1;
               color: var(--apex-red); }
.bwl-count span { font-size: 12.5px; color: var(--apex-muted); }
.bwl-blurb { margin: 0 0 16px; font-size: 14.5px; line-height: 1.6; color: var(--apex-body); }
.bwl-what summary { cursor: pointer; font-size: 13.5px; font-weight: 800; color: var(--apex-ink);
                    padding: 10px 0; border-top: 1px solid var(--apex-rule);
                    display: flex; justify-content: space-between; gap: 10px; }
.bwl-what summary span { font-weight: 600; color: var(--apex-muted); }
.bwl-what ul { margin: 4px 0 0; padding: 0 0 0 18px; }
.bwl-what li { font-size: 13.5px; line-height: 1.55; color: var(--apex-body); margin-bottom: 5px; }
.bwl-opt { margin: 10px 0 0; font-size: 12.5px; color: var(--apex-muted); }
.bwl-panels-foot { margin: 26px 0 0; font-size: 12.5px; line-height: 1.6; color: var(--apex-muted);
                   max-width: 76ch; }

/* ---------- marker detail ---------- */
.bwl-detail { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
              gap: clamp(20px, 2.6vw, 40px); align-items: start; }
.bwl-detail-card, .bwl-factors { border: 1px solid var(--apex-rule);
              border-radius: var(--apex-radius, 14px); padding: clamp(20px, 2.4vw, 30px);
              background: #fff; }
.bwl-detail-tag { font: 700 10.5px/1 var(--apex-font-mono); letter-spacing: .14em;
                  text-transform: uppercase; color: var(--apex-muted); }
.bwl-detail-card h3 { margin: 10px 0 12px; font-size: 26px; font-weight: 900; letter-spacing: -.02em; }
.bwl-detail-val { display: flex; align-items: baseline; gap: 7px; }
.bwl-detail-val b { font-size: 40px; font-weight: 900; letter-spacing: -.03em; }
.bwl-detail-val span { font-size: 14px; color: var(--apex-muted); }
.bwl-detail-delta { margin: 6px 0 22px !important; font: 700 13px/1 var(--apex-font-mono);
                    color: var(--band-best); }
.bwl-detail-card h4, .bwl-factors h4 { margin: 0 0 12px; font-size: 15px; font-weight: 800; }
.bwl-detail-card p { margin: 0; font-size: 15px; line-height: 1.65; color: var(--apex-body); }
.bwl-factors ul { margin: 0; padding: 0; list-style: none; }
.bwl-factors li { display: flex; align-items: center; gap: 12px; padding: 11px 0;
                  border-top: 1px solid var(--apex-rule); font-size: 14.5px; color: var(--apex-body); }
.bwl-factors li:first-of-type { border-top: 0; }
.bwl-factors li::before { flex: none; width: 22px; height: 22px; border-radius: 50%;
                          display: grid; place-items: center; font-size: 12px; font-weight: 900; }
.bwl-factors li.is-up::before { content: "\2191"; background: rgba(42,157,92,.14); color: var(--band-best); }
.bwl-factors li.is-down::before { content: "\2193"; background: rgba(217,52,43,.10); color: var(--band-bad); }
.bwl-factors-note { margin: 16px 0 0; font-size: 12.5px; line-height: 1.55; color: var(--apex-muted); }

@media (max-width: 1000px) {
  .bwl-hero { grid-template-columns: 1fr; row-gap: 44px;
              padding-top: clamp(80px, 12vw, 110px); }
  .bwl-hero h1 { max-width: none; }
  .bwl-detail { grid-template-columns: 1fr; }
}
@media (max-width: 620px) {
  .bwl-score-main { grid-template-columns: 1fr; justify-items: center; }
  .bwl-subs { width: 100%; }
  .bwl-bands { grid-template-columns: 1fr 1fr 1.3fr 1fr 1fr; }
  .bwl-band span { font-size: 8.5px; letter-spacing: .04em; }
  .bwl-stats { gap: 20px; }
}
@media (prefers-reduced-motion: reduce) {
  .bwl-strike::after { animation: none; transform: scaleX(1); }
  .bwl-dial-fg, .bwl-subs i::after, .bwl-you { transition: none; }
}


/* ================= THREE OPTIONS ================= */
.bwl-tiers { display: grid; grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
             gap: 20px; align-items: start; }
.bwl-tier { position: relative; background: #fff; border: 1px solid var(--apex-rule);
            border-radius: 18px; padding: clamp(24px, 2.4vw, 34px);
            display: flex; flex-direction: column; height: 100%; }
.bwl-tier.is-pop { border: 2px solid var(--apex-red);
                   box-shadow: 0 18px 44px rgba(211,7,4,.10); }
.bwl-tier.is-dark { background: var(--apex-ink); color: #fff; border-color: var(--apex-ink); }
.bwl-tier.is-dark .bwl-tier-sub, .bwl-tier.is-dark .bwl-tier-list li { color: #cfc6bc; }
.bwl-tier.is-dark .bwl-tier-list li::before { background: rgba(255,255,255,.22); }
.bwl-tier.is-dark .bwl-tag { color: var(--apex-red-bright); }
.bwl-tier.is-dark h3 { color: #fff; }
.bwl-tier-head { min-height: 62px; }
.bwl-tag { display: inline-block; font: 800 10.5px/1 var(--apex-font-mono);
           letter-spacing: .15em; text-transform: uppercase; color: var(--apex-red); }
.bwl-tag-on { background: var(--apex-red); color: #fff !important; padding: 5px 10px;
              border-radius: 999px; }
.bwl-tier h3 { margin: 12px 0 0; font-size: 21px; font-weight: 900; letter-spacing: -.018em;
               line-height: 1.2; }
.bwl-tier-price { margin: 18px 0 14px; display: flex; align-items: baseline;
                  flex-wrap: wrap; gap: 8px; }
.bwl-tier-price b { font-size: clamp(38px, 3.6vw, 46px); font-weight: 900; letter-spacing: -.04em;
                    line-height: 1; }
.bwl-tier-price i { font-style: normal; font-size: 11.5px; color: var(--apex-muted); }
.bwl-tier.is-dark .bwl-tier-price i { color: #9d948a; }
.bwl-tier-sub { margin: 0 0 20px; font-size: 14.5px; line-height: 1.6; color: var(--apex-body); }
.bwl-tier-list { margin: 0 0 24px; padding: 0; list-style: none; flex: 1; }
.bwl-tier-list li { position: relative; padding: 0 0 10px 22px; font-size: 14.5px;
                    line-height: 1.55; color: var(--apex-body); }
.bwl-tier-list li::before { content: ""; position: absolute; left: 0; top: 8px;
                            width: 8px; height: 8px; border-radius: 50%;
                            background: var(--apex-red); }
.bwl-tier .btn { width: 100%; justify-content: center; }

/* ================= HEALTH SCORE + DR BOWEN ================= */
.bwl-score-wrap { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
                  gap: clamp(28px, 3.4vw, 64px); align-items: start; }
.bwl-score-copy h2 { margin: 16px 0 18px; font-size: clamp(27px, 3.1vw, 40px); font-weight: 900;
                     line-height: 1.08; letter-spacing: -.022em; }
.bwl-ticks { margin: 26px 0 0; padding: 0; list-style: none; }
.bwl-ticks li { position: relative; padding: 0 0 16px 30px; font-size: 15.5px;
                line-height: 1.62; color: var(--apex-body); }
.bwl-ticks li::before { content: ""; position: absolute; left: 0; top: 4px; width: 18px;
                        height: 18px; border-radius: 50%; background: rgba(211,7,4,.10); }
.bwl-ticks li::after { content: ""; position: absolute; left: 6px; top: 9px; width: 4px;
                       height: 8px; border: solid var(--apex-red); border-width: 0 2px 2px 0;
                       transform: rotate(42deg); }
.bwl-ticks b { color: var(--apex-ink); font-weight: 800; }
/* Dr Bowen sits inside the claim he built, not in a separate bio strip */
.bwl-bowen-card { display: grid; grid-template-columns: 118px minmax(0, 1fr); gap: 20px;
                  align-items: center; margin: 30px 0 0; padding: 20px;
                  background: #fff; border: 1px solid var(--apex-rule); border-radius: 16px; }
.bwl-bowen-card img { width: 118px; height: 118px; border-radius: 14px; object-fit: cover;
                      object-position: 50% 12%; display: block; }
.bwl-bowen-card b { display: block; font-size: 17px; font-weight: 900; letter-spacing: -.01em; }
.bwl-bowen-card figcaption > span { display: block; margin: 3px 0 9px;
                     font: 700 10.5px/1 var(--apex-font-mono); letter-spacing: .12em;
                     text-transform: uppercase; color: var(--apex-red); }
.bwl-bowen-card p { margin: 0; font-size: 13.5px; line-height: 1.6; color: var(--apex-body); }

/* ================= TRACK YOUR HEALTH JOURNEY ================= */
.bwl-track { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
             gap: 18px; margin-bottom: 44px; }
.bwl-track figure { margin: 0; border-radius: 16px; overflow: hidden;
                    background: var(--apex-ink); }
.bwl-track img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bwl-track-hero { min-height: 340px; }
.bwl-track-side { display: grid; grid-template-rows: 1fr 1fr; gap: 18px; }
.bwl-track-pts { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
                 gap: clamp(20px, 2.4vw, 36px); padding-top: 40px;
                 border-top: 1px solid var(--apex-rule); }
.bwl-pt-n { display: block; margin-bottom: 12px; font: 900 13px/1 var(--apex-font-mono);
            letter-spacing: .1em; color: var(--apex-red); }
.bwl-track-pts h4 { margin: 0 0 9px; font-size: 17.5px; font-weight: 800; letter-spacing: -.012em; }
.bwl-track-pts p { margin: 0; font-size: 14.5px; line-height: 1.62; color: var(--apex-body); }

/* ================= BIOMARKER GRAPHS ================= */
.bwl-graphs { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 20px; }
.bwl-graph { margin: 0; padding: 22px; background: #fff; border: 1px solid var(--apex-rule);
             border-radius: 16px; }
.bwl-graph figcaption { display: flex; align-items: baseline; flex-wrap: wrap; gap: 10px;
                        margin-bottom: 16px; }
.bwl-graph-k { flex: 1 0 100%; font: 700 10.5px/1 var(--apex-font-mono); letter-spacing: .13em;
               text-transform: uppercase; color: var(--apex-muted); }
.bwl-graph figcaption b { font-size: 30px; font-weight: 900; letter-spacing: -.035em; }
.bwl-graph figcaption b i { font-style: normal; font-size: 12px; font-weight: 600;
                            color: var(--apex-muted); margin-left: 4px; letter-spacing: 0; }
.bwl-graph svg { display: block; width: 100%; height: 110px; overflow: visible; }
.bwl-g-band { fill: rgba(42,157,92,.13); }
.bwl-g-line { fill: none; stroke: var(--apex-ink); stroke-width: 2.5;
              stroke-linecap: round; stroke-linejoin: round;
              vector-effect: non-scaling-stroke;
              stroke-dasharray: 600; stroke-dashoffset: 600; }
.bwl-graphs.is-in .bwl-g-line { stroke-dashoffset: 0; transition: stroke-dashoffset 1.4s cubic-bezier(.3,.8,.35,1); }
.bwl-graph:nth-child(2) .bwl-g-line { transition-delay: .12s; }
.bwl-graph:nth-child(3) .bwl-g-line { transition-delay: .24s; }
.bwl-graph:nth-child(4) .bwl-g-line { transition-delay: .36s; }
.bwl-graph-x { display: flex; justify-content: space-between; margin-top: 8px;
               font: 600 10.5px/1 var(--apex-font-mono); color: var(--apex-muted); }
.bwl-graph > p { margin: 14px 0 0 !important; font-size: 13.5px !important; line-height: 1.55 !important;
                 color: var(--apex-body) !important; }

@media (max-width: 900px) {
  .bwl-score-wrap, .bwl-track { grid-template-columns: 1fr; }
  .bwl-track-side { grid-template-rows: auto; grid-template-columns: 1fr 1fr; }
  .bwl-track-hero { min-height: 240px; }
}
@media (max-width: 560px) {
  .bwl-track-side { grid-template-columns: 1fr; }
  .bwl-bowen-card { grid-template-columns: 1fr; }
  .bwl-bowen-card img { width: 100%; height: 200px; }
}
@media (prefers-reduced-motion: reduce) {
  .bwl-graphs.is-in .bwl-g-line { transition: none; }
  .bwl-g-line { stroke-dashoffset: 0; }
}

/* tier cards open on an image, not a bullet list */
.bwl-tier-fig { margin: -8px -8px 18px; border-radius: 12px; overflow: hidden;
                background: var(--apex-bg-alt); }
.bwl-tier.is-dark .bwl-tier-fig { background: #241f1c; }
.bwl-tier-fig img { width: 100%; height: 132px; object-fit: cover; display: block; }
.bwl-tier .btn { display: flex; width: 100%; justify-content: center; align-items: center; }

/* biological age — the portal's other headline number */
.bwl-bioage { margin-top: 18px; background: #fff; border: 1px solid var(--apex-rule);
              border-radius: 18px; padding: 22px clamp(18px, 2vw, 26px) 20px; }
.bwl-bioage-head { display: flex; align-items: center; justify-content: space-between;
                   gap: 12px; margin-bottom: 14px; }
.bwl-bioage .bwl-score-kicker { color: var(--apex-red); }
.bwl-bioage-delta { font: 700 10.5px/1 var(--apex-font-mono); letter-spacing: .1em;
                    text-transform: uppercase; color: #2a9d5c;
                    background: rgba(42,157,92,.12); padding: 5px 9px; border-radius: 999px; }
.bwl-bioage-main { display: flex; align-items: baseline; gap: 16px; flex-wrap: wrap; }
.bwl-bioage-num b { font-size: 44px; font-weight: 900; letter-spacing: -.04em; line-height: 1; }
.bwl-bioage-num i { font-style: normal; font-size: 14px; color: var(--apex-muted); margin-left: 2px; }
.bwl-bioage-main p { margin: 0; flex: 1 1 200px; font-size: 13.5px; line-height: 1.55;
                     color: var(--apex-body); }
.bwl-bioage-scale { position: relative; margin: 26px 0 0; height: 6px; }
.bwl-bio-bar { display: block; height: 6px; border-radius: 3px;
               background: linear-gradient(90deg, #2a9d5c 0%, #e8a33d 55%, #d9342b 100%); }
.bwl-bio-pin { position: absolute; top: -4px; left: var(--at); transform: translateX(-50%);
               width: 14px; height: 14px; border-radius: 50%; background: #fff; }
.bwl-bio-pin--bio { box-shadow: 0 0 0 3px #2a9d5c; }
.bwl-bio-pin--chr { box-shadow: 0 0 0 3px var(--apex-ink); }
.bwl-bio-pin em { position: absolute; top: 18px; left: 50%; transform: translateX(-50%);
                  font: 800 10.5px/1 var(--apex-font-mono); font-style: normal;
                  color: var(--apex-ink); }
.bwl-bioage-x { display: flex; justify-content: space-between; margin-top: 26px;
                font: 600 10.5px/1 var(--apex-font-mono); color: var(--apex-muted); }

/* the Foundational CTA read as plain text without a visible edge */
.bwl-tier .btn-ghost { box-shadow: inset 0 0 0 1.5px var(--apex-rule); color: var(--apex-ink); }
.bwl-tier .btn-ghost:hover { box-shadow: inset 0 0 0 1.5px var(--apex-red); color: var(--apex-red); }
/* this image leads with a biomarker range bar — crop to it, not to the
   fitness tiles underneath */
.bwl-tier-fig img.is-top { object-position: 50% 0%; }

/* ================= COMPARISON TABLE ================= */
.bwl-tablewrap { overflow-x: auto; -webkit-overflow-scrolling: touch;
                 border: 1px solid var(--apex-rule); border-radius: 16px; background: #fff; }
.bwl-table { width: 100%; border-collapse: collapse; min-width: 760px; }
.bwl-table th, .bwl-table td { padding: 16px 18px; text-align: left; font-size: 14px;
                               line-height: 1.5; vertical-align: top;
                               border-bottom: 1px solid var(--apex-rule); }
.bwl-table thead th { font: 800 11px/1.35 var(--apex-font-mono); letter-spacing: .1em;
                      text-transform: uppercase; color: var(--apex-muted);
                      background: var(--apex-bg-alt); vertical-align: bottom; }
.bwl-table tbody th { font-weight: 800; color: var(--apex-ink); width: 200px; }
.bwl-table td { color: var(--apex-body); }
/* our column is the one the eye should land on */
.bwl-table .is-us { background: rgba(211,7,4,.045); color: var(--apex-ink); font-weight: 600; }
.bwl-table thead .is-us { background: var(--apex-red); color: #fff; }
.bwl-table tr:last-child th, .bwl-table tr:last-child td { border-bottom: 0; }

/* ================= FAQ ================= */
.bwl-faq { max-width: 860px; }
.bwl-faq details { border-bottom: 1px solid var(--apex-rule); }
.bwl-faq summary { cursor: pointer; list-style: none; padding: 20px 40px 20px 0;
                   position: relative; font-size: 17px; font-weight: 800;
                   letter-spacing: -.012em; color: var(--apex-ink); }
.bwl-faq summary::-webkit-details-marker { display: none; }
.bwl-faq summary::after { content: ""; position: absolute; right: 8px; top: 27px;
                          width: 10px; height: 10px; border: solid var(--apex-red);
                          border-width: 0 2px 2px 0; transform: rotate(45deg);
                          transition: transform .2s; }
.bwl-faq details[open] summary::after { transform: rotate(-135deg); top: 31px; }
.bwl-faq summary:hover { color: var(--apex-red); }
.bwl-faq p { margin: 0 0 22px; padding-right: 40px; font-size: 15.5px; line-height: 1.68;
             color: var(--apex-body); max-width: 74ch; }
@media (prefers-reduced-motion: reduce) { .bwl-faq summary::after { transition: none; } }

/* ==========================================================================
   Sections whose rules were lost when the hero block was rewritten — the
   rewrite truncated the file and took everything below it. Restored here and
   given the photography they should have had. Classes covered: bwl-normal,
   bwl-range-wrap, bwl-review*, bwl-bowen, bwl-draw*, bwl-adv*, bwl-concierge.
   ========================================================================== */

/* the score dial sits on near-black; its number was inheriting dark ink */
.bwl-score .bwl-dial-num b { color: #fff; }
.bwl-score .bwl-dial-num i { color: #9d948a; }

/* ---------- normal is not optimal ---------- */
.bwl-normal .bwl-head { margin-bottom: 36px; }
.bwl-range-wrap { margin-bottom: 8px; }

/* ---------- physician review ---------- */
.bwl-review-fig { margin: 0 0 44px; border-radius: 18px; overflow: hidden;
                  background: var(--apex-ink); aspect-ratio: 21 / 7; }
.bwl-review-fig img { width: 100%; height: 100%; object-fit: cover;
                      object-position: 50% 42%; display: block; }
.bwl-review-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
                   gap: clamp(22px, 2.8vw, 44px); }
.bwl-review-pt { padding-top: 22px; border-top: 3px solid var(--apex-red); }
.bwl-review-pt > b { display: block; margin-bottom: 12px; font: 900 13px/1 var(--apex-font-mono);
                     letter-spacing: .12em; color: var(--apex-red); }
.bwl-review-pt h4 { margin: 0 0 10px; font-size: 18px; font-weight: 800; letter-spacing: -.014em; }
.bwl-review-pt p { margin: 0; font-size: 14.5px; line-height: 1.64; color: var(--apex-body); }
/* Bowen's credentials read as a signature line, not another paragraph */
.bwl-bowen { display: grid; grid-template-columns: 86px minmax(0, 1fr); gap: 20px;
             align-items: center; margin-top: 48px; padding: 22px 26px;
             background: var(--apex-ink); border-radius: 18px; }
.bwl-bowen img { width: 86px; height: 86px; border-radius: 50%; object-fit: cover;
                 object-position: 50% 12%; display: block; }
.bwl-bowen p { margin: 0; font-size: 14.5px; line-height: 1.65; color: #cfc6bc; }
.bwl-bowen b { color: #fff; font-weight: 800; }

/* ---------- getting drawn ---------- */
.bwl-draw { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 20px; }
.bwl-draw article { display: flex; flex-direction: column; background: #fff;
                    border: 1px solid var(--apex-rule); border-radius: 18px;
                    padding: 0 0 24px; overflow: hidden; }
.bwl-draw-fig { margin: 0 0 20px; }
.bwl-draw-fig img { width: 100%; height: 168px; object-fit: cover; display: block; }
.bwl-draw article > * { padding-left: clamp(20px, 2vw, 26px); padding-right: clamp(20px, 2vw, 26px); }
.bwl-draw-fig { padding: 0 !important; }
.bwl-draw article h3 { margin: 12px 0 12px; font-size: 20px; font-weight: 900; letter-spacing: -.018em; }
.bwl-draw article p { margin: 0 0 12px; font-size: 14.5px; line-height: 1.62; color: var(--apex-body); }
.bwl-draw-note { margin: auto 0 0 !important; padding-top: 12px;
                 font: 700 12px/1.5 var(--apex-font-mono) !important;
                 letter-spacing: .04em; color: var(--apex-muted) !important; }

/* ---------- advanced diagnostics ---------- */
.bwl-adv { display: grid; grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); gap: 20px; }
.bwl-adv-card { display: flex; flex-direction: column; background: #fff;
                border: 1px solid var(--apex-rule); border-radius: 18px;
                padding: 0 0 26px; overflow: hidden; }
.bwl-adv-fig { margin: 0 0 18px; background: var(--apex-bg-alt); }
.bwl-adv-fig img { width: 100%; height: 190px; object-fit: contain; display: block;
                   padding: 14px 10px 0; }
.bwl-adv-card > *:not(.bwl-adv-fig) { padding-left: clamp(20px, 2vw, 26px);
                                      padding-right: clamp(20px, 2vw, 26px); }
.bwl-adv-top { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.bwl-adv-top b { font-size: 20px; font-weight: 900; letter-spacing: -.025em; color: var(--apex-ink); }
.bwl-adv-card h3 { margin: 12px 0 10px; font-size: 20px; font-weight: 900; letter-spacing: -.018em; }
.bwl-adv-lead { margin: 0 0 18px !important; font-size: 14.5px !important;
                line-height: 1.6 !important; color: var(--apex-body) !important; }
.bwl-adv-card h4 { margin: 0 0 6px; font: 800 10.5px/1 var(--apex-font-mono);
                   letter-spacing: .13em; text-transform: uppercase; color: var(--apex-red); }
.bwl-adv-card h4 + p { margin: 0 0 16px; font-size: 14px; line-height: 1.6; color: var(--apex-body); }
.bwl-adv-card > p:last-child { margin-bottom: 0; }

/* the tier image that is a product render, not a photograph, must not be cropped */
.bwl-tier-fig img.is-contain { object-fit: contain; background: #fff; padding: 6px 0; }

/* ---------- concierge closer ---------- */
.bwl-concierge { background: var(--apex-ink); color: #fff; }
.bwl-conc-in { max-width: var(--apex-max); margin: 0 auto;
               padding: clamp(64px, 6.5vw, 96px) var(--apex-gutter); text-align: center; }
.bwl-concierge h2 { margin: 18px auto 18px; max-width: 22ch; font-weight: 900;
                    font-size: clamp(27px, 3.2vw, 42px); line-height: 1.08; letter-spacing: -.024em; }
.bwl-concierge p { margin: 0 auto 30px; max-width: 62ch; font-size: 16.5px;
                   line-height: 1.68; color: #ddd5cc; }

@media (max-width: 620px) {
  .bwl-review-fig { aspect-ratio: 16 / 10; }
  .bwl-bowen { grid-template-columns: 1fr; text-align: center; justify-items: center; }
}
