/* Design B: premium product story (job 78). */
.hp-b{background:#fbf8f3}
.b-hero{position:relative;min-height:min(78vh,720px);display:flex;align-items:flex-end;color:#fff;overflow:hidden;padding:0!important}
.b-hero__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 40%}
.b-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,6,6,.05) 30%,rgba(20,6,6,.72) 100%)}
.b-hero__in{position:relative;z-index:1;padding-top:120px;padding-bottom:64px;width:100%}
.b-hero__title{font:800 clamp(40px,7vw,86px)/1.02 var(--f-head);margin:0 0 .25em;letter-spacing:-.025em;color:#fff;max-width:900px;text-shadow:0 2px 24px rgba(0,0,0,.25)}
.b-hero__sub{font:500 clamp(20px,2.6vw,30px)/1.3 var(--f-head);margin:0 0 1.2em;color:#fff;max-width:720px}
.b-hero__cta{margin:0}.b-hero__cta .hp-buy{max-width:340px}
.b-risks{position:relative;z-index:2;padding:0 0 56px!important}
.b-risks .hp-risks{background:#fff;border-radius:20px;box-shadow:var(--shadow-lg);padding:30px 26px;margin-top:-34px}
.b-risks .hp-risks__lead{text-align:center}
.b-risks .hp-risks__list li{border:0;background:var(--grey);border-radius:999px;box-shadow:none}

/* portrait wall */
.b-wall{background:#1d0d0e;color:#fff}
.b-wall .hp-h2{color:#fff}
/* 12 Nov (Edsun): the expert cards use Design A's style (white card, round photo, name and role under it) on B's dark wall */
.b-wall .hp-experts__grid{gap:18px}
.b-wall .hp-expert{background:#fff;color:#1f1f1f;box-shadow:0 10px 28px rgba(0,0,0,.35)}
.b-wall .hp-expert__name{color:#1f1f1f}
.b-wall .hp-expert__role{color:var(--muted)}
.b-wall .hp-more__btn{background:transparent;border-color:var(--gold);color:var(--gold)}

/* editorial news card */
.b-news{background:#fbf8f3}
.b-news__card{max-width:980px;margin:0 auto;background:#fff;border-radius:18px;box-shadow:var(--shadow-lg);padding:clamp(24px,5vw,56px);border-top:6px solid var(--red)}
.b-news__tag{font:700 15px/1 var(--f-head)!important;letter-spacing:.2em;text-transform:uppercase;color:var(--red);margin:0 0 1.2em;font-size:16px!important}
.b-news__cols{font-family:var(--f-quote);font-size:18px;line-height:1.75}
@media(min-width:900px){.b-news__cols{columns:2;column-gap:44px}.b-news__cols p{break-inside:avoid}}
.b-news__cols>p:first-child::first-letter{float:left;font:700 64px/0.9 var(--f-quote);color:var(--red);padding:6px 10px 0 0}
.b-news .hp-stat{box-shadow:none;background:var(--grey)}

/* alternating benefit layers */
.b-layers{background:#fff}
.b-layer{display:grid;gap:24px;align-items:center;margin:0 auto 46px;max-width:1080px}
@media(min-width:860px){.b-layer{grid-template-columns:1.1fr 1fr;gap:56px}.b-layer--flip .b-layer__pic{order:2}}
.b-layer__pic img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:20px!important;box-shadow:var(--shadow-lg)}
.b-layer__title{font:800 clamp(24px,3vw,34px)/1.2 var(--f-head);margin:0 0 .5em;color:var(--band1)}
.b-layer:last-child{margin-bottom:0}

.hp-b .hp-rachel{background:var(--cream)}
.b-quote{position:relative;overflow:hidden;color:#fff;padding:110px 0!important}
.b-quote__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.b-quote::before{content:"";position:absolute;inset:0;background:rgba(60,8,10,.72);z-index:1}
.b-quote .hp-wrap{position:relative;z-index:2}
.b-quote blockquote{max-width:900px;margin:0 auto;text-align:center}
.b-quote .hp-quote__q{color:#fff;font-size:clamp(30px,4.4vw,52px)}
.b-quote .hp-quote__cite{color:#f1d9a0}
.hp-b .hp-judd{background:#fff}
.hp-b .hp-who{background:var(--grey)}
.hp-b .hp-reversed{background:#fff}
.b-photo{background:#fff;padding:0 20px 40px}
.b-photo img{display:block;width:100%;max-width:1180px;margin:0 auto;max-height:520px;object-fit:cover;object-position:50% 6%;border-radius:22px!important}
.hp-b .hp-band{padding:90px 0!important}
.hp-b .hp-product{background:#fff}
.hp-b .hp-package{background:#fbf8f3}
.hp-b .hp-pack{border-radius:18px}
.hp-b .hp-features{background:#fff}
.hp-b .hp-offer-sec{background:linear-gradient(180deg,#fbf8f3,#f1ebe1)}
.hp-b .hp-how{background:#fff}
.hp-b .hp-guarantee{background:var(--cream)}
.hp-b .hp-letter{background:#fff}
.hp-b .hp-yes{background:#fbf8f3}
@media(max-width:520px){.b-risks .hp-risks{padding:24px 14px}.b-risks .hp-risks__list{gap:8px}.b-risks .hp-risks__list li{padding:10px 10px;gap:8px}}

/* ---- Round 2 ---- */
/* dark left-side gradient so the white headline reads over the bright lake and sky */
.b-hero::after{background:linear-gradient(90deg,rgba(22,6,7,.82) 0%,rgba(22,6,7,.62) 34%,rgba(22,6,7,.18) 62%,rgba(22,6,7,0) 80%),linear-gradient(180deg,rgba(20,6,6,0) 45%,rgba(20,6,6,.55) 100%)}
.b-hero__title{text-shadow:0 2px 18px rgba(0,0,0,.35)}
.b-hero__sub{text-shadow:0 1px 10px rgba(0,0,0,.4)}
/* expert faces + guarantee strip sits right under the hero, so the risk panel no longer overlaps the photo */
.hp-b .hp-trust{background:#fff}
.b-risks{padding:44px 0 56px!important;background:#fbf8f3}
.b-risks .hp-risks{margin-top:0}
@media(max-width:700px){
  .b-hero{min-height:0}
  .b-hero__bg{object-position:73% 30%}
  .b-hero__in{padding-top:330px;padding-bottom:40px}
  .b-hero::after{background:linear-gradient(180deg,rgba(20,6,6,0) 30%,rgba(20,6,6,.55) 52%,rgba(20,6,6,.86) 100%)}
}

/* ---- Round 3 ---- */
/* hero: about 560px, so the trust strip shows on 768-900px tall laptops; new photographic picture */
@media(min-width:701px){
  .b-hero{min-height:min(62vh,560px)}
  .b-hero__in{padding-top:88px;padding-bottom:48px}
  .b-hero__title{font-size:clamp(38px,5.4vw,72px)}
  .b-hero__sub{font-size:clamp(19px,2.2vw,26px);margin-bottom:1em}
  .b-hero__bg{object-position:center 45%}
}
/* breaking news drop cap: snug against the rest of the word */
.b-news__cols>p:first-child::first-letter{float:left;font:700 3.6em/.78 var(--f-quote);padding:.08em .04em 0 0;margin:0}
/* letter: pull quotes centred between gold rules (same look as C), band photo with a soft edge */
.hp-b .hp-pull--in{background:none;border:0;border-top:2px solid var(--gold);border-bottom:2px solid var(--gold);border-radius:0;padding:24px 0;text-align:center;margin:2.2em 0}
@media(min-width:1100px){.hp-b .hp-pull--in{margin-left:-80px;margin-right:-80px}}
.hp-b .hp-letter{background:#fff}
/* phone hero: frame both walkers (new photo has the couple right of centre) */
@media(max-width:700px){.b-hero__bg{object-position:84% 30%}}

/* r6: keep heads in frame on the feature cards (the gym card cut her head off on phones) */
.hp-card__img[src*="feat-"]{object-position:50% 15%}
.hp-card__img[src*="feat-walk"]{object-position:50% 0}