/* ==========================================================================
   /feel-your-best/  -  loaded ONLY by that page, after site.css and lp.css.

   Every selector is fyb- prefixed (the footer reuses lp.css's own lp-footer
   rules, untouched), so nothing here can reach another page and nothing on
   another page can reach this one. Colours are Vivo's own tokens from
   site.css (gold, tangerine, ember) on the deep brown of the approved
   hero mockup.
   ========================================================================== */
:root{
  --fyb-bg:#140C06; --fyb-bg-2:#1C120A; --fyb-card:rgba(255,255,255,.045);
  --fyb-line:rgba(255,255,255,.16); --fyb-gold-line:rgba(255,194,77,.42);
  --fyb-text:#FFF6EC; --fyb-dim:#D9C4AE; --fyb-faint:#B39E88;
  --fyb-hot:linear-gradient(100deg,#FFC24D 0%,#FF8A2B 55%,#F47920 100%);
  --fyb-bar:84px;
}
.fyb body{background:var(--fyb-bg);color:var(--fyb-text)}
.fyb a{color:var(--gold)}
.fyb [hidden]{display:none!important}

/* ---------------- top bar: logo left, one button right, no links ---------------- */
.fyb-top{position:sticky;top:0;z-index:50;background:rgba(36,25,15,.88);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(255,194,77,.22)}
.fyb-top-in{max-width:1680px;margin:0 auto;height:var(--fyb-bar);padding:0 clamp(16px,4.6vw,84px);
  display:flex;align-items:center;justify-content:space-between;gap:16px}
.fyb-brand{display:flex;align-items:center;gap:13px;min-width:0}
.fyb-brand img{width:46px;height:46px;flex:none}
.fyb-brand > span{display:flex;flex-direction:column;line-height:1.1;min-width:0}
.fyb-name{font-family:Cinzel,Georgia,serif;font-weight:600;font-size:1.7rem;letter-spacing:.16em;color:#F0D9B4}
.fyb-sub{font-family:Cinzel,Georgia,serif;font-weight:600;font-size:.6rem;letter-spacing:.3em;
  text-transform:uppercase;color:var(--gold);margin-top:3px;white-space:nowrap}
.fyb-getstarted{flex:none;display:inline-flex;align-items:center;gap:9px;min-height:48px;padding:0 26px;
  border-radius:99px;background:var(--fyb-hot);color:#2A1607!important;text-decoration:none;
  font:700 1rem/1 "Bricolage Grotesque","Helvetica Neue",Arial,sans-serif;letter-spacing:-.01em;
  box-shadow:0 8px 24px -10px rgba(244,121,32,.8);transition:transform .16s,filter .16s}
.fyb-getstarted svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.fyb-getstarted:hover{transform:translateY(-1px);filter:saturate(1.1)}
.fyb-getstarted:focus-visible,.fyb-cta:focus-visible,.fyb-btn:focus-visible{outline:3px solid #fff;outline-offset:3px}

/* ---------------- hero ---------------- */
.fyb-hero{position:relative;overflow:hidden;background:var(--fyb-bg);isolation:isolate;
  min-height:clamp(620px,calc(100vh - var(--fyb-bar)),860px);display:flex;align-items:center}
.fyb-hero-pic{position:absolute;top:0;bottom:0;right:0;left:22%;z-index:-2;display:block}
.fyb-hero-pic img{width:100%;height:100%;object-fit:cover;object-position:62% 36%}
/* The warm gradient: dense on the left where the words are, gone by the time it
   reaches the couple. A second, lower one settles the bottom edge. */
.fyb-hero-scrim{position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:
    linear-gradient(90deg,rgba(20,12,6,1) 0%,rgba(20,12,6,.98) 24%,rgba(26,15,7,.8) 36%,rgba(34,20,9,.42) 48%,rgba(34,20,9,.1) 60%,rgba(34,20,9,0) 70%),
    linear-gradient(0deg,rgba(20,12,6,.7) 0%,rgba(20,12,6,0) 30%)}
.fyb-hero-in{width:100%;max-width:1680px;margin:0 auto;padding:56px clamp(20px,5.2vw,92px) 44px}
.fyb-hero-in > *{max-width:min(790px,100%)}
.fyb-hero-in > .fyb-h1{max-width:min(900px,100%)}
.fyb-hero-in > .fyb-chips,.fyb-hero-in > .fyb-trust{max-width:min(900px,100%)}
.fyb-kicker{display:flex;align-items:center;gap:12px;margin:0 0 24px;font-size:1rem;letter-spacing:.02em;color:#EADBC8}
.fyb-dot{width:15px;height:15px;border-radius:50%;background:radial-gradient(circle at 40% 35%,#FFD27A,#FF8A2B);
  box-shadow:0 0 0 5px rgba(255,138,43,.22),0 0 18px rgba(255,170,60,.7)}
.fyb-h1{margin:0 0 26px;font-size:clamp(2.35rem,4.3vw,3.9rem);line-height:1.04;font-weight:800;letter-spacing:-.03em;
  color:#fff;text-shadow:0 2px 24px rgba(0,0,0,.35)}
.fyb-gold{display:block;background:linear-gradient(95deg,#FFD27A 0%,#F5B04A 45%,#E6902F 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:#F5B04A;text-shadow:none}
.fyb-hero-p{margin:0 0 34px;max-width:29em;text-wrap:pretty;font-size:clamp(1.05rem,1.45vw,1.32rem);line-height:1.62;color:#EEDFCB}

.fyb-cta{display:inline-flex;align-items:center;justify-content:center;gap:14px;min-height:62px;padding:0 40px;
  border:0;border-radius:99px;background:var(--fyb-hot);color:#2A1607!important;text-decoration:none;cursor:pointer;
  font:700 clamp(1.05rem,1.4vw,1.28rem)/1 "Bricolage Grotesque","Helvetica Neue",Arial,sans-serif;letter-spacing:-.01em;
  box-shadow:0 14px 34px -12px rgba(244,121,32,.85),inset 0 1px 0 rgba(255,255,255,.35);
  transition:transform .18s,filter .18s,box-shadow .18s}
.fyb-cta svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;transition:transform .18s}
.fyb-cta:hover{transform:translateY(-2px);filter:saturate(1.1);box-shadow:0 18px 40px -12px rgba(244,121,32,.95),inset 0 1px 0 rgba(255,255,255,.35)}
.fyb-cta:hover svg{transform:translateX(4px)}
.fyb-micro{margin:16px 0 0;font-size:.98rem;color:#D3BFA8;letter-spacing:.01em}

.fyb-chips{display:flex;flex-wrap:wrap;gap:12px;list-style:none;margin:34px 0 0;padding:0}
.fyb-chips li{padding:8px 18px;border-radius:99px;font-weight:600;font-size:.92rem;color:#F6E8D6;
  background:rgba(38,56,30,.62);border:1px solid rgba(139,182,104,.5)}
.fyb-trust{display:grid;grid-template-columns:repeat(4,auto);justify-content:start;gap:0;list-style:none;
  margin:30px 0 0;padding:26px 0 0;border-top:1px solid rgba(255,255,255,.16);max-width:min(800px,100%)}
.fyb-trust li{display:flex;align-items:flex-start;gap:12px;padding:0 24px;font-size:.93rem;line-height:1.4;color:#EADBC8}
.fyb-trust li:first-child{padding-left:0}
.fyb-trust li + li{border-left:1px solid rgba(255,255,255,.16)}
.fyb-ti svg{width:30px;height:30px;fill:none;stroke:var(--gold);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:none}
.fyb-noscript{margin:0;padding:18px 24px;background:#2A1A0E;color:var(--fyb-text);text-align:center}

/* Tablet: the same hero, a little less of the picture behind the words. */
@media (max-width:1200px){
  .fyb-hero-pic{left:12%}
  .fyb-hero-pic img{object-position:70% 30%}
  .fyb-hero-scrim{background:
    linear-gradient(90deg,rgba(20,12,6,1) 0%,rgba(20,12,6,.96) 30%,rgba(26,15,7,.72) 46%,rgba(34,20,9,.3) 62%,rgba(34,20,9,0) 80%),
    linear-gradient(0deg,rgba(20,12,6,.7) 0%,rgba(20,12,6,0) 30%)}
  .fyb-trust{grid-template-columns:repeat(2,auto);row-gap:20px}
  .fyb-trust li:nth-child(3){padding-left:0;border-left:0}
}

/* Stacked: recomposed, not shrunk. Used on phones and on any narrow or portrait
   screen. The couple sits in a banner of her own at the top, the gradient fades
   her into the page, and every word is on solid dark ground below, so no text
   ever crosses a face. */
@media (max-width:900px),(max-aspect-ratio:1/1){
  .fyb-hero{display:block;min-height:0}
  .fyb-hero-pic{position:relative;inset:auto;left:auto;z-index:0;width:100%;height:min(78.25vw,62vh)}
  .fyb-hero-pic img{object-position:60% 30%}
  .fyb-hero-scrim{inset:0 0 auto 0;z-index:0;height:min(78.25vw,62vh);
    background:linear-gradient(0deg,var(--fyb-bg) 0%,rgba(20,12,6,.72) 16%,rgba(20,12,6,0) 46%),
               linear-gradient(180deg,rgba(20,12,6,.4) 0%,rgba(20,12,6,0) 26%)}
  .fyb-hero-in{position:relative;z-index:1;margin-top:-22px;padding:0 clamp(20px,6vw,56px) 40px}
  .fyb-hero-in > *{max-width:min(720px,100%)}
  .fyb-hero-in > .fyb-h1,.fyb-hero-in > .fyb-chips,.fyb-hero-in > .fyb-trust{max-width:min(760px,100%)}
}
@media (max-width:720px){
  :root{--fyb-bar:68px}
  .fyb-brand img{width:38px;height:38px}
  .fyb-name{font-size:1.38rem}
  .fyb-sub{font-size:.5rem;letter-spacing:.22em}
  .fyb-getstarted{min-height:44px;padding:0 18px;font-size:.95rem}
  .fyb-hero-in{padding:0 20px 36px}
  .fyb-kicker{font-size:.9rem;margin-bottom:16px}
  .fyb-h1{font-size:clamp(2.1rem,9.4vw,2.7rem);margin-bottom:18px}
  .fyb-hero-p{font-size:1.04rem;margin-bottom:26px}
  .fyb-cta{width:100%;min-height:60px;padding:0 24px}
  .fyb-micro{text-align:center;font-size:.9rem}
  .fyb-chips{margin-top:26px;gap:9px}
  .fyb-chips li{font-size:.88rem;padding:8px 15px}
  .fyb-trust{grid-template-columns:1fr 1fr;row-gap:18px;margin-top:26px;padding-top:22px}
  .fyb-trust li{padding:0 10px 0 0;border:0!important;font-size:.88rem}
}
@media (max-width:360px){ .fyb-sub{display:none} }


/* ============================ choose your path ============================= */
.fyb-playing .fyb-hero,.fyb-playing .fyb-choose,.fyb-playing .fyb-gallery,.fyb-playing .fyb-more{display:none}
.fyb-choose{background:linear-gradient(180deg,#140C06 0%,#1F130A 60%,#2A1A0E 100%);padding:clamp(40px,7vw,84px) 0 clamp(48px,7vw,92px)}
.fyb-choose-in{max-width:1040px;margin:0 auto;padding:0 clamp(16px,4vw,28px);text-align:center}
.fyb-choose-h{margin:0 0 12px;font-size:clamp(1.8rem,4.4vw,3rem);line-height:1.08;color:#fff;outline:none}
.fyb-choose-p{margin:0 auto 30px;max-width:36em;font-size:clamp(1.02rem,1.5vw,1.2rem);color:#E6D5BF}
.fyb-picks{display:grid;grid-template-columns:1fr 1fr;gap:clamp(14px,3vw,30px);list-style:none;margin:0;padding:0}
.fyb-pick{appearance:none;display:block;width:100%;padding:0;border:0;cursor:pointer;text-align:left;border-radius:30px;overflow:hidden;
  background:var(--cream);box-shadow:0 26px 60px -26px rgba(0,0,0,.8),0 0 0 1px rgba(255,194,77,.25);
  transition:transform .2s,box-shadow .2s;font:inherit;color:var(--ink)}
.fyb-pick:hover{transform:translateY(-4px);box-shadow:0 34px 70px -26px rgba(0,0,0,.85),0 0 0 2px var(--gold)}
.fyb-pick:focus-visible{outline:4px solid #fff;outline-offset:3px}
.fyb-pick-img{display:block;aspect-ratio:4/3;background:var(--peach)}
.fyb-pick-img img{width:100%;height:100%;object-fit:cover;display:block}
.fyb-pick-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 24px 20px;background:var(--cream)}
.fyb-pick-t{font:800 clamp(1.3rem,2.6vw,1.9rem)/1 "Bricolage Grotesque",Arial,sans-serif;letter-spacing:.01em;color:var(--ink)}
.fyb-pick-go{display:inline-flex;align-items:center;gap:8px;font-weight:700;color:var(--ember-text);font-size:.98rem;white-space:nowrap}
.fyb-pick-go svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;transition:transform .18s}
.fyb-pick:hover .fyb-pick-go svg{transform:translateX(4px)}
.fyb-choose-note{margin:26px auto 0;max-width:34em;font-size:.95rem;color:#CDB9A2}
@media (max-width:640px){
  .fyb-picks{grid-template-columns:1fr}
  .fyb-pick-row{padding:16px 20px 18px}
}

/* ============================== the quiz stage ============================== */
.fyb-stage{position:relative;min-height:calc(100vh - var(--fyb-bar));padding:clamp(18px,4vw,44px) 0 clamp(48px,7vw,84px);
  background:radial-gradient(900px 480px at 85% -6%,rgba(255,194,77,.28),rgba(255,194,77,0) 62%),linear-gradient(180deg,#FFF6EC 0%,#FFEFDD 100%);color:var(--ink)}
.fyb-stage-in{max-width:1000px;margin:0 auto;padding:0 clamp(14px,3vw,24px)}
.fyb-panel{animation-duration:.4s;animation-fill-mode:both;animation-timing-function:cubic-bezier(.2,.75,.2,1)}
.fyb-enter-fwd{animation-name:fybR}.fyb-enter-back{animation-name:fybL}
@keyframes fybR{from{opacity:0;transform:translateX(26px)}to{opacity:1;transform:none}}
@keyframes fybL{from{opacity:0;transform:translateX(-26px)}to{opacity:1;transform:none}}
@keyframes fybUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes fybSpin{to{transform:rotate(360deg)}}
@keyframes fybPulse{0%,100%{opacity:1}50%{opacity:.45}}

.fyb-qhead{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 10px}
.fyb-back{appearance:none;background:none;border:0;display:inline-flex;align-items:center;gap:6px;min-height:48px;padding:0 12px 0 2px;cursor:pointer;
  font:700 1rem/1 Karla,Arial,sans-serif;color:var(--ink-dim);border-radius:10px}
.fyb-back .fyb-i{width:20px;height:20px}
.fyb-back:hover{color:var(--ink)}
.fyb-back:focus-visible,.fyb-next:focus-visible,.fyb-link-btn:focus-visible{outline:3px solid var(--tangerine);outline-offset:3px}
.fyb-tag{padding:6px 14px;border-radius:99px;background:var(--sage-2);color:var(--leaf-text);font-weight:700;font-size:.86rem;letter-spacing:.02em}
.fyb-i{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}

.fyb-pwrap{margin:0 0 20px}
.fyb-pbar{display:grid;grid-template-columns:repeat(8,1fr);gap:6px;list-style:none;margin:0 0 8px;padding:0}
.fyb-pbar li{height:8px;border-radius:99px;background:rgba(116,96,77,.18);overflow:hidden;position:relative}
.fyb-pbar li::after{content:"";position:absolute;inset:0;border-radius:99px;background:linear-gradient(100deg,#FFC24D,#FF8A2B 60%,#F47920);
  transform:scaleX(0);transform-origin:left;transition:transform .45s cubic-bezier(.3,.8,.2,1)}
.fyb-pbar li.on::after{transform:scaleX(1)}
.fyb-pbar li.now::after{transform:scaleX(.5);animation:fybPulse 1.6s ease-in-out infinite}
.fyb-pcount{margin:0;font:700 .84rem/1 Karla,Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--ember-text)}

.fyb-q{margin:0 0 8px;font-size:clamp(1.55rem,3.4vw,2.4rem);line-height:1.14;color:var(--ink);outline:none;letter-spacing:-.02em}
.fyb-help{margin:0 0 18px;color:var(--ink-dim);font-size:1.02rem}
.fyb-qfoot{display:flex;justify-content:flex-end;margin-top:18px}
.fyb-next{appearance:none;display:inline-flex;align-items:center;gap:10px;min-height:52px;padding:0 28px;border:0;border-radius:99px;cursor:pointer;
  background:var(--ink);color:#fff;font:700 1rem/1 "Bricolage Grotesque",Arial,sans-serif;transition:opacity .15s,transform .15s}
.fyb-next .fyb-i{width:18px;height:18px}
.fyb-next:disabled{opacity:.3;cursor:not-allowed}
.fyb-next:not(:disabled):hover{transform:translateY(-1px)}

/* options: native radios sit invisibly over each card, so a tap, a click, the arrow keys and a screen reader all just work */
.fyb-opts{display:grid;gap:12px;margin-top:14px}
.fyb-opts input[type=radio],.fyb-opts input[type=checkbox]{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer;z-index:2}
.fyb-tick{position:absolute;right:14px;top:14px;width:28px;height:28px;border-radius:50%;background:var(--fyb-hot);color:#2A1607;display:grid;place-items:center;
  box-shadow:0 4px 10px -3px rgba(244,121,32,.7);transform:scale(.4);opacity:0;transition:transform .2s,opacity .15s;z-index:1}
.fyb-tick .fyb-i{width:16px;height:16px;stroke-width:3.2}
input:checked ~ .fyb-tick{transform:scale(1);opacity:1}

.fyb-opts-age{grid-template-columns:repeat(3,1fr)}
.fyb-pill{position:relative;display:grid;place-items:center;min-height:64px;border-radius:20px;background:#fff;border:2px solid #EBD7BF;font:700 1.25rem/1 "Bricolage Grotesque",Arial,sans-serif;
  color:var(--ink);cursor:pointer;transition:border-color .15s,transform .15s,background .15s,box-shadow .15s;animation:fybUp .4s both;animation-delay:calc(var(--i,0) * 40ms)}
.fyb-pill:hover{border-color:var(--tangerine);transform:translateY(-2px)}
.fyb-pill:has(input:checked){border-color:var(--ember);background:#FFF1DB;box-shadow:0 10px 24px -14px rgba(244,121,32,.9)}
.fyb-pill:has(input:focus-visible),.fyb-ill:has(input:focus-visible),.fyb-opt:has(input:focus-visible){outline:4px solid var(--tangerine);outline-offset:3px}

.fyb-opts-ill{grid-template-columns:repeat(3,1fr);gap:16px}
.fyb-ill{position:relative;display:block;border-radius:24px;overflow:hidden;background:#fff;border:3px solid transparent;cursor:pointer;
  box-shadow:0 12px 30px -16px rgba(90,50,10,.4),0 0 0 1px #EBD7BF;transition:transform .18s,box-shadow .18s,border-color .18s;animation:fybUp .45s both;animation-delay:calc(var(--i,0) * 55ms)}
.fyb-ill:hover{transform:translateY(-3px);box-shadow:0 18px 36px -16px rgba(90,50,10,.5),0 0 0 1px var(--tangerine)}
.fyb-ill:has(input:checked){border-color:var(--ember);box-shadow:0 18px 38px -14px rgba(244,121,32,.7)}
.fyb-ill-img{display:block;aspect-ratio:4/3;background:var(--peach)}
.fyb-ill-img img{display:block;width:100%;height:100%;object-fit:cover}
.fyb-ill-label{text-wrap:balance;display:block;padding:14px 16px 16px;font:700 1.06rem/1.25 "Bricolage Grotesque",Arial,sans-serif;color:var(--ink);min-height:3.4em}
.fyb-ill.big .fyb-ill-label{font-size:1.14rem}
.fyb-opts-text{grid-template-columns:1fr}
.fyb-opt{position:relative;display:flex;align-items:center;gap:16px;min-height:72px;padding:14px 56px 14px 16px;border-radius:22px;background:#fff;border:2px solid #EBD7BF;cursor:pointer;
  transition:border-color .15s,transform .15s,background .15s,box-shadow .15s;animation:fybUp .4s both;animation-delay:calc(var(--i,0) * 45ms)}
.fyb-opt:hover{border-color:var(--tangerine);transform:translateY(-2px)}
.fyb-opt:has(input:checked){border-color:var(--ember);background:#FFF1DB;box-shadow:0 12px 26px -16px rgba(244,121,32,.9)}
.fyb-opt .fyb-tick{top:50%;margin-top:-14px}
.fyb-opt-ico{flex:none;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:var(--sage-2);color:var(--leaf-text)}
.fyb-opt-ico .fyb-i{width:26px;height:26px}
.fyb-opt:has(input:checked) .fyb-opt-ico{background:var(--fyb-hot);color:#2A1607}
.fyb-opt-t{font:700 1.08rem/1.3 "Bricolage Grotesque",Arial,sans-serif;color:var(--ink);text-wrap:balance}
@media (min-width:821px){ .fyb-opts-text{grid-template-columns:1fr 1fr} }
@media (max-width:900px){ .fyb-opts-ill{grid-template-columns:1fr 1fr;gap:12px} .fyb-opts-ill.big{grid-template-columns:1fr 1fr} }
@media (max-width:560px){
  .fyb-opts-age{grid-template-columns:1fr 1fr}
  .fyb-opts-ill.big{grid-template-columns:1fr}
  .fyb-opts-ill{gap:12px}
  .fyb-ill-label{padding:12px 12px 14px;font-size:1rem}
  .fyb-ill.big .fyb-ill-label{font-size:1.12rem;padding:14px 16px 16px}
}

/* ============================ working + preview ============================= */
.fyb-work{display:grid;place-items:center;text-align:center;min-height:52vh;gap:6px}
.fyb-work-h{margin:14px 0 0;font-size:clamp(1.5rem,3.4vw,2.2rem);outline:none}
.fyb-work-p{margin:0;color:var(--ink-dim)}
.fyb-spin{width:56px;height:56px;border-radius:50%;border:5px solid rgba(244,121,32,.2);border-top-color:var(--ember);animation:fybSpin .9s linear infinite}
.fyb-spin.sm{display:inline-block;width:18px;height:18px;border-width:3px;vertical-align:-3px;margin-right:6px}

.fyb-prev{display:block;max-width:760px;margin:6px auto 0}
.fyb-eyebrow{margin:0 0 10px;font:600 .78rem/1.3 Cinzel,Georgia,serif;letter-spacing:.2em;text-transform:uppercase;color:var(--ember-text)}
.fyb-eyebrow-c{text-align:center}
.fyb-prev-ill{margin:0 0 20px;border-radius:26px;overflow:hidden;box-shadow:0 22px 48px -24px rgba(90,50,10,.6);background:var(--peach)}
.fyb-prev-ill img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}
.fyb-prev-goal{margin:0 0 14px;font-size:clamp(1.7rem,4vw,2.6rem);line-height:1.1;letter-spacing:-.02em;color:var(--ink);outline:none}
.fyb-prev-intro{margin:0 0 20px;font-size:1.1rem;line-height:1.7;color:#4D3A29}
.fyb-h3{margin:26px 0 12px;font-size:1.2rem;color:var(--ink)}
.fyb-h4{margin:18px 0 6px;font-size:1.02rem;color:var(--ink)}
.fyb-prios{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.fyb-prios li{display:flex;gap:14px;align-items:flex-start;padding:16px 18px;border-radius:20px;background:#fff;box-shadow:0 0 0 1px #EBD7BF;animation:fybUp .5s both}
.fyb-prios li:nth-child(2){animation-delay:.12s}.fyb-prios li:nth-child(3){animation-delay:.24s}
.fyb-prios li > div{display:flex;flex-direction:column;gap:3px}
.fyb-prios b{font:700 1.08rem/1.25 "Bricolage Grotesque",Arial,sans-serif;color:var(--ink)}
.fyb-prios span:not(.fyb-prio-n){color:var(--ink-dim);line-height:1.5}
.fyb-prio-n{flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--fyb-hot);color:#2A1607;font:800 1rem "Bricolage Grotesque",Arial,sans-serif}
.fyb-start{padding:18px 20px;border-radius:20px;background:var(--sage-2);border:1px solid var(--sage)}
.fyb-start .fyb-h3{margin-top:0}
.fyb-start p{margin:0;line-height:1.65;color:#2F4A22}
.fyb-six{margin:20px 0 0;padding:18px 20px;border-left:5px solid var(--gold);border-radius:6px 18px 18px 6px;background:#FFF1DB;font:600 1.12rem/1.5 "Bricolage Grotesque",Arial,sans-serif;color:var(--ink)}
.fyb-fineprint{margin:18px 0 0;font-size:.88rem;line-height:1.55;color:var(--ink-dim)}

/* ================================ contact step ================================ */
/* the contact card: bright ivory, charcoal text, sage-green accents. The visitor is unlocking a report, not enrolling in anything. */
.fyb-lead{max-width:760px;margin:38px auto 0;padding:clamp(22px,4vw,38px);border-radius:28px;background:#FFFEFA;color:#2B2B28;
  border:1px solid #DCD3C2;box-shadow:0 1px 0 #fff inset,0 28px 56px -30px rgba(70,52,28,.38),0 6px 16px -8px rgba(70,52,28,.14);animation:fybUp .5s both}
.fyb-lead .fyb-eyebrow{color:#3D7527}
.fyb-lead-h{margin:0 0 10px;font-size:clamp(1.55rem,3.4vw,2.2rem);line-height:1.12;color:#2B2B28;text-transform:uppercase;letter-spacing:.01em;outline:none}
.fyb-lead-h::after{content:"";display:block;width:56px;height:4px;border-radius:4px;background:#6DB84A;margin-top:12px}
.fyb-lead-p{margin:0 0 18px;color:#44443F;font-size:1.06rem;line-height:1.65}
.fyb-inside{list-style:none;margin:0 0 22px;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.fyb-inside li{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:14px;border:1px solid #CFE3BF;border-left:4px solid #6DB84A;background:#fff;font-weight:600;font-size:.95rem;line-height:1.3;color:#2B2B28}
.fyb-lk svg{width:17px;height:17px;fill:none;stroke:var(--gold);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;display:block}
@media (max-width:600px){.fyb-inside{grid-template-columns:1fr}}
.fyb-form{display:grid;gap:14px}
.fyb-row2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:600px){.fyb-row2{grid-template-columns:1fr}}
.fyb-f{margin:0;display:flex;flex-direction:column;gap:6px}
.fyb-lab{font-weight:700;font-size:.92rem;color:#2B2B28}
.fyb-f input{width:100%;height:56px;padding:0 16px;border-radius:14px;background:#fff;border:1.5px solid #6F766B;color:#2B2B28;font:400 1rem Karla,Arial,sans-serif}
.fyb-f input:focus{outline:3px solid #3D7527;outline-offset:1px;border-color:#3D7527}
.fyb-f input.bad{border-color:#B3261E;border-width:2px}
.fyb-err{color:#B3261E;font-size:.9rem;font-weight:600}
.fyb-consent{margin:0}
.fyb-consent label{display:flex;gap:12px;align-items:flex-start;cursor:pointer;font-size:.86rem;line-height:1.55;color:#3A3A35}
.fyb-consent input{flex:none;width:24px;height:24px;margin:1px 0 0;accent-color:#3D7527}
.fyb-consent-note,.fyb-privacy,.fyb-after{margin:0;font-size:.86rem;line-height:1.55;color:#4A4A44}
.fyb-consent-note a,.fyb-privacy a{color:#2F6B1F;text-decoration:underline;text-underline-offset:2px}
.fyb-consent-note a{margin-left:8px}
.fyb-lead-go{width:100%;margin-top:4px}
.fyb-lead-go.busy,.fyb-lead-go:disabled{opacity:.6;cursor:progress;transform:none}
.fyb-status{padding:14px 16px;border-radius:14px;font-size:.96rem;line-height:1.55;background:#F4F1EA;border:1px solid #D8D1C2;color:#2B2B28}
.fyb-status.is-ok{background:#EAF4E2;border:1px solid #7DB35E}
.fyb-status.is-bad{background:#FDECE8;border:1px solid #D9806E}
.fyb-status.is-warn{background:#FFF4D9;border:1px solid #E0B558}
.fyb-status-btns{display:flex;gap:18px;flex-wrap:wrap;margin-top:8px}
.fyb-link-btn{appearance:none;background:none;border:0;padding:6px 0;min-height:44px;cursor:pointer;font:700 1rem Karla,Arial,sans-serif;color:#2F6B1F;text-decoration:underline;text-underline-offset:3px}
.fyb-mock{margin:6px 0 0;padding:14px 16px;border-radius:14px;border:1px dashed #8FA982;background:#F6F8F2;color:#3A3A35;font-size:.9rem}
.fyb-mock legend{padding:0 8px;font-weight:700}
.fyb-mock label{display:inline-flex;align-items:center;gap:8px;margin:4px 16px 4px 0;min-height:36px;cursor:pointer}
.fyb-mock input{accent-color:#3D7527;width:18px;height:18px}
.fyb-mock-p{margin:0 0 6px}
.fyb-mock-count{margin:8px 0 0;font-size:.84rem;color:#4A4A44}
.fyb-review{margin:0 0 16px;padding:12px 16px;border-radius:14px;border:1px dashed #B87914;background:#FFF1CC;color:#6B4710;font-size:.92rem;line-height:1.5}

/* ================================ the page below ================================ */
.fyb-sec{padding:clamp(48px,7vw,84px) 0}
.fyb-wrap{max-width:1040px;margin:0 auto;padding:0 24px}
.fyb-narrow{max-width:780px}
.fyb-sec-h{margin:0 0 22px;font-size:clamp(1.7rem,3.6vw,2.6rem);line-height:1.12}
.fyb-sec-how{background:var(--cream-2);color:var(--ink);text-align:center}
.fyb-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;list-style:none;margin:28px 0 0;padding:0;text-align:left}
.fyb-steps li{display:flex;flex-direction:column;gap:12px;padding:22px;border-radius:22px;background:var(--paper);border:1px solid var(--hairline)}
.fyb-sn{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:var(--fyb-hot);color:#2A1607;font:800 1.05rem "Bricolage Grotesque",Arial,sans-serif}
.fyb-steps li > span:last-child{display:flex;flex-direction:column;gap:6px;color:var(--ink-dim);line-height:1.5}
.fyb-steps b{color:var(--ink);font:700 1.1rem/1.25 "Bricolage Grotesque",Arial,sans-serif}
@media (max-width:900px){.fyb-steps{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.fyb-steps{grid-template-columns:1fr}}
.fyb-sec-faq{background:var(--cream);color:var(--ink)}
.fyb-qa{margin:0 0 12px;border-radius:18px;background:var(--paper);border:1px solid var(--hairline)}
.fyb-qa summary{cursor:pointer;list-style:none;padding:20px 24px;font:700 1.08rem/1.35 "Bricolage Grotesque",Arial,sans-serif;display:flex;justify-content:space-between;gap:16px;min-height:56px}
.fyb-qa summary::-webkit-details-marker{display:none}
.fyb-qa summary::after{content:"+";flex:none;font-size:1.4rem;line-height:1;color:var(--ember-text)}
.fyb-qa[open] summary::after{content:"\2212"}
.fyb-qa > div{padding:0 24px 22px;color:var(--ink-dim);line-height:1.65}
.fyb-qa summary:focus-visible{outline:3px solid var(--tangerine);outline-offset:2px;border-radius:18px}

/* ================================ welcome page ================================ */
.fyb-w{background:linear-gradient(180deg,#FFF6EC 0%,#FFEFDD 100%);color:var(--ink)}
.fyb-w-hero{padding:clamp(34px,6vw,70px) 0 clamp(26px,4vw,48px);background:radial-gradient(900px 420px at 50% -10%,rgba(255,194,77,.34),rgba(255,194,77,0) 66%)}
.fyb-w-in{max-width:980px;margin:0 auto;padding:0 clamp(16px,4vw,28px)}
.fyb-w-h1{margin:0 0 8px;text-align:center;font-size:clamp(2.2rem,6.4vw,4.4rem);line-height:1.02;letter-spacing:-.025em;color:var(--ink);outline:none}
.fyb-w-sub{margin:0 0 12px;text-align:center;font:700 clamp(1.15rem,2.4vw,1.6rem)/1.3 "Bricolage Grotesque",Arial,sans-serif;color:var(--ember-text)}
.fyb-w-copy{margin:0 auto 26px;max-width:36em;text-align:center;font-size:1.12rem;line-height:1.7;color:#4D3A29}
.fyb-video{margin:0 0 18px}
.fyb-video video{display:block;width:100%;aspect-ratio:16/9;border-radius:26px;background:#000;box-shadow:0 30px 60px -30px rgba(0,0,0,.7)}
.fyb-video figcaption{margin-top:10px;text-align:center;font-weight:700;color:var(--ink-dim)}
.fyb-video-frame{position:relative;aspect-ratio:16/9;border-radius:26px;overflow:hidden;display:grid;place-content:center;justify-items:center;gap:6px;text-align:center;padding:20px;
  background:radial-gradient(70% 90% at 50% 0%,rgba(255,194,77,.4),rgba(255,194,77,0) 70%),linear-gradient(160deg,#3B2412,#140C06);color:#fff;
  box-shadow:0 30px 60px -30px rgba(0,0,0,.7),inset 0 0 0 1px rgba(255,194,77,.3)}
.fyb-video-emblem{width:72px;height:72px}
.fyb-video-who{margin:0;font:700 clamp(1.1rem,2.6vw,1.7rem)/1.2 "Bricolage Grotesque",Arial,sans-serif;color:#F0D9B4}
.fyb-video-soon{margin:0;color:#EADBC8}
.fyb-video-play{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;background:var(--fyb-hot);color:#2A1607;opacity:.55;margin-top:6px}
.fyb-video-play svg{width:28px;height:28px;fill:currentColor;margin-left:4px}
.fyb-video-flag{position:absolute;left:12px;right:12px;bottom:10px;margin:0;font-size:.82rem;color:#FFE2A8}
.fyb-video-plan{margin:12px auto 0;max-width:640px;border-radius:16px;background:#fff;border:1px solid #EBD7BF}
.fyb-video-plan summary{cursor:pointer;padding:14px 18px;font-weight:700;min-height:48px}
.fyb-video-plan ul{margin:0;padding:0 22px 16px 38px;color:var(--ink-dim);line-height:1.6}
.fyb-w-jump{margin:0;text-align:center}
.fyb-w .fyb-link-btn,.fyb-stage .fyb-link-btn{color:var(--ember-text)}
.fyb-w-next,.fyb-w-guide{padding:clamp(30px,5vw,60px) 0}
.fyb-w-np{margin:-8px 0 24px;color:var(--ink-dim);font-size:1.08rem;text-align:center}
.fyb-w-next .fyb-sec-h{text-align:center}
.fyb-cards{display:grid;grid-template-columns:1fr 1fr;gap:20px;list-style:none;margin:0;padding:0}
.fyb-card{display:flex;flex-direction:column;gap:12px;padding:clamp(24px,4vw,36px);border-radius:28px;background:#fff;box-shadow:0 22px 50px -28px rgba(90,50,10,.55),0 0 0 1px #EBD7BF}
.fyb-card h3{margin:0;font-size:clamp(1.35rem,2.6vw,1.8rem);line-height:1.15}
.fyb-card p{margin:0;color:var(--ink-dim);line-height:1.65;flex:1}
.fyb-card-go{width:100%;margin-top:6px}
.fyb-ph-note{margin:6px 0 0;padding:12px 14px;border-radius:12px;border:1px dashed #B87914;background:#FFF1CC;color:#6B4710;font-size:.9rem;line-height:1.5}
@media (max-width:720px){.fyb-cards{grid-template-columns:1fr}}
.fyb-guide-status{margin:-8px 0 22px;padding:12px 16px;border-radius:14px;background:#fff;box-shadow:0 0 0 1px #EBD7BF;color:var(--ink-dim);font-size:.98rem;line-height:1.55}
.fyb-empty{padding:16px 18px;border-radius:14px;background:#fff;box-shadow:0 0 0 1px #EBD7BF}
.fyb-w-actions{display:flex;gap:22px;flex-wrap:wrap;margin:22px 0 0}
.fyb-guide{padding:clamp(20px,4vw,38px);border-radius:28px;background:#fff;box-shadow:0 22px 50px -28px rgba(90,50,10,.55),0 0 0 1px #EBD7BF}
.fyb-guide-head{display:grid;grid-template-columns:minmax(0,260px) 1fr;gap:22px;align-items:center;margin-bottom:6px}
.fyb-guide-ill{margin:0;border-radius:22px;overflow:hidden;background:var(--peach)}
.fyb-guide-ill img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}
.fyb-guide-goal{margin:0 0 8px;font-size:clamp(1.4rem,3vw,2rem);line-height:1.12}
@media (max-width:640px){.fyb-guide-head{grid-template-columns:1fr}}
.fyb-gsec{margin-top:8px}
.fyb-gsec p{margin:0 0 10px;line-height:1.7;color:#4D3A29}
.fyb-gsub{color:var(--ink-dim)!important;font-size:.96rem}
.fyb-habits,.fyb-qlist{margin:0;padding:0;list-style:none;display:grid;gap:10px}
.fyb-habits li{display:flex;flex-direction:column;gap:3px;padding:14px 16px;border-radius:16px;background:var(--cream);border:1px solid var(--hairline)}
.fyb-habits b{font:700 1.04rem/1.3 "Bricolage Grotesque",Arial,sans-serif}
.fyb-habits span{color:var(--ink-dim);line-height:1.6}
.fyb-qlist li{padding:12px 16px 12px 44px;border-radius:14px;background:var(--sage-2);position:relative;line-height:1.55;color:#2F4A22}
.fyb-qlist li::before{content:"?";position:absolute;left:14px;top:11px;width:22px;height:22px;border-radius:50%;background:var(--leaf);color:#fff;font:800 .85rem/22px "Bricolage Grotesque",Arial,sans-serif;text-align:center}
.fyb-check{margin:0;padding:0;list-style:none;display:grid;gap:8px}
.fyb-check label{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border-radius:14px;background:var(--cream);border:1px solid var(--hairline);cursor:pointer;line-height:1.55}
.fyb-check input{flex:none;width:24px;height:24px;margin:1px 0 0;accent-color:#F47920}
.fyb-sample{margin:0 0 14px;border-radius:20px;background:#fff;box-shadow:0 0 0 1px #EBD7BF}
.fyb-sample summary{cursor:pointer;padding:18px 22px;font-size:1.05rem;min-height:56px}
.fyb-sample summary span{color:var(--ink-dim);margin-left:8px}
.fyb-sample-body{display:grid;grid-template-columns:1fr 1fr;gap:26px;padding:6px 22px 24px}
@media (max-width:900px){.fyb-sample-body{grid-template-columns:1fr}}

@media (prefers-reduced-motion: reduce){
  .fyb *,.fyb *::before,.fyb *::after{animation:none!important;transition:none!important}
  .fyb-pbar li.now::after{transform:scaleX(.5)}
}
@media print{
  .fyb-top,.lp-footer,.fyb-video,.fyb-w-hero,.fyb-w-next,.fyb-w-actions,.fyb-guide-status,.skip{display:none!important}
  .fyb-w,.fyb-w-guide{background:#fff!important;padding:0!important}
  .fyb-guide{box-shadow:none!important;border:0!important}
}

/* arrow / chevron icons inside text buttons */
.fyb-link-btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;vertical-align:-3px;margin-left:6px}
/* the welcome video placeholder: content flows, nothing overlaps, and it is tall enough to hold it on a phone */
.fyb-video-frame{aspect-ratio:auto;min-height:clamp(250px,42vw,420px);align-content:center;gap:8px}
.fyb-video-flag{position:static;margin:8px 0 0;max-width:30em}
.fyb-video-play{margin-top:4px}

/* ============================ wellness stories (illustrative) ============================ */
.fyb-gallery{scroll-margin-top:var(--fyb-bar);background:linear-gradient(180deg,#2A1A0E 0%,#1B110A 100%);color:var(--fyb-text);padding:clamp(44px,7vw,92px) 0;border-top:1px solid var(--fyb-gold-line)}
.fyb-gal-in{max-width:1180px;margin:0 auto;padding:0 clamp(16px,4vw,28px);text-align:center}
.fyb-gal-eye{color:#FFC24D}
.fyb-gal-h{margin:0 0 12px;font-size:clamp(1.8rem,4.6vw,3rem);line-height:1.08;color:#fff;letter-spacing:.01em}
.fyb-gal-sub{margin:0 auto clamp(26px,4vw,44px);max-width:34em;font-size:clamp(1.02rem,1.5vw,1.2rem);color:#E6D5BF}
.fyb-stories{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr;gap:clamp(22px,3vw,32px);justify-items:center}
.fyb-story{width:100%;max-width:440px;display:flex;flex-direction:column;text-align:left;background:var(--fyb-card);border:1px solid var(--fyb-line);border-radius:20px;overflow:hidden;
  box-shadow:0 24px 54px -28px rgba(0,0,0,.85)}
.fyb-story-fig{margin:0;background:#0F0905;aspect-ratio:941/1672}
.fyb-story-fig picture,.fyb-story-fig img{display:block;width:100%;height:auto;aspect-ratio:941/1672}
.fyb-story-body{padding:18px clamp(16px,3vw,22px) 22px;display:flex;flex-direction:column;gap:10px;flex:1}
.fyb-story-tag{margin:0;display:flex;flex-wrap:wrap;gap:4px 10px;align-items:center;font:700 .76rem/1.3 Karla,Arial,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#FFC24D}
.fyb-story-tag-2{color:#D9C4AE;font-weight:600}
.fyb-story-h{margin:0;font-size:clamp(1.3rem,2.4vw,1.5rem);line-height:1.2;color:#fff}
.fyb-story-p{margin:0;font-size:1.02rem;line-height:1.55;color:#EADBC8}
.fyb-story-rest{margin-top:8px}
.fyb-story-more summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;min-height:44px;padding:0 2px;font:700 .98rem/1 Karla,Arial,sans-serif;color:#FFC24D;text-decoration:underline;text-underline-offset:4px}
.fyb-story-more summary::-webkit-details-marker{display:none}
.fyb-story-more summary:focus-visible{outline:3px solid #FFC24D;outline-offset:3px;border-radius:6px}
.fyb-more-close{display:none}
.fyb-story-more[open] .fyb-more-open{display:none}
.fyb-story-more[open] .fyb-more-close{display:inline}
.fyb-gal-disc{margin:clamp(22px,3.4vw,32px) auto 0;max-width:40em;font-size:.98rem;line-height:1.5;color:#D9C4AE;text-align:center}
.fyb-gal-cta{margin:clamp(34px,5vw,56px) auto 0;max-width:36em}
.fyb-gal-cta-h{margin:0 0 10px;font-size:clamp(1.35rem,3vw,1.9rem);line-height:1.18;color:#fff}
.fyb-gal-cta p{margin:0 0 22px;font-size:1.06rem;color:#E6D5BF}
@media (min-width:900px){
  .fyb-stories{grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch}
  .fyb-story{max-width:none}
}
@media (max-width:520px){ .fyb-gal-cta .fyb-cta{width:100%;padding:0 20px} }
@media (prefers-reduced-motion:reduce){ .fyb-story-more summary{transition:none} }

/* the two illustrated path cards in the hero: they start the quiz directly */
.fyb-hero-go{margin:0 0 6px;max-width:520px}
.fyb-go-q{margin:0 0 10px;font:700 .86rem/1.2 Karla,Arial,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#FFC24D;outline:none}
.fyb-hero-go .fyb-picks{gap:14px}
.fyb-pick-sm{border-radius:20px}
.fyb-pick-sm .fyb-pick-row{padding:12px 16px 14px;gap:8px}
.fyb-pick-sm .fyb-pick-t{font-size:clamp(1.05rem,2vw,1.3rem)}
.fyb-pick-sm .fyb-pick-go svg{width:18px;height:18px}
@media (max-width:640px){
  .fyb-hero-go{max-width:none}
  .fyb-hero-go .fyb-picks{grid-template-columns:1fr 1fr;gap:10px}
  .fyb-pick-sm{border-radius:16px}
  .fyb-pick-sm .fyb-pick-row{padding:10px 12px 12px}
}

/* pick several: a counter, numbered choices, and the rest dim once three are chosen */
.fyb-count{margin:-4px 0 14px;font:700 .95rem/1.3 Karla,Arial,sans-serif;color:var(--ember-text)}
.fyb-ord{position:absolute;top:10px;left:10px;z-index:2;display:none;align-items:center;justify-content:center;min-width:30px;height:30px;padding:0 8px;
  border-radius:99px;background:var(--fyb-hot);color:#2A1607;font:800 .95rem/1 Karla,Arial,sans-serif;box-shadow:0 4px 12px rgba(0,0,0,.3)}
.fyb-opts label:has(input:checked) .fyb-ord{display:inline-flex}
.fyb-opts label.is-locked{opacity:.5}
.fyb-opts label.is-locked,.fyb-opts label.is-locked input{cursor:not-allowed}
.fyb-opt .fyb-ord{top:50%;margin-top:-15px;left:auto;right:52px}
.fyb-also{margin:0 0 10px;font:700 1rem/1.4 Karla,Arial,sans-serif;color:var(--ember-text)}

/* form step: a quoted six-month line, a quiet line before the button, privacy after it, and what happens next */
.fyb-lead-quote{margin:0 0 14px;padding-left:14px;border-left:3px solid var(--gold);font:600 italic 1.12rem/1.5 "Bricolage Grotesque",Georgia,serif;color:#FFE2B0}
.fyb-pre{margin:0;text-align:center;font:700 .95rem/1.3 Karla,Arial,sans-serif;color:#3D7527}
.fyb-privacy{margin-top:2px;font-size:.8rem;color:#4A4A44}
.fyb-next3{margin-top:14px;padding-top:14px;border-top:1px solid rgba(255,255,255,.14)}
.fyb-next3-h{margin:0 0 8px;font:700 .8rem/1.2 Karla,Arial,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#FFC24D}
.fyb-next3 ol{margin:0;padding:0;list-style:none;counter-reset:n3;display:grid;gap:6px}
.fyb-next3 li{counter-increment:n3;display:flex;gap:10px;align-items:baseline;font-size:.94rem;line-height:1.45;color:#EADBC8}
.fyb-next3 li::before{content:counter(n3);flex:none;width:22px;height:22px;border-radius:50%;background:rgba(255,194,77,.16);color:#FFC24D;font:800 .8rem/22px Karla,Arial,sans-serif;text-align:center}


/* ================================ Quiz 2.0 ================================ */
/* the quiz warms up as it goes: subdued and reflective at first, brighter and more hopeful by the end */
.fyb-stage[data-arc="early"]{background:radial-gradient(900px 480px at 85% -6%,rgba(120,140,170,.16),rgba(120,140,170,0) 62%),linear-gradient(180deg,#F2EEE8 0%,#E9E3DA 100%)}
.fyb-stage[data-arc="middle"]{background:radial-gradient(900px 480px at 85% -6%,rgba(255,194,77,.2),rgba(255,194,77,0) 62%),linear-gradient(180deg,#FBF3E8 0%,#F7EAD9 100%)}
.fyb-stage[data-arc="late"]{background:radial-gradient(1000px 560px at 85% -8%,rgba(255,194,77,.5),rgba(255,194,77,0) 64%),linear-gradient(180deg,#FFF4DF 0%,#FFE7C0 100%)}
.fyb-qeyebrow{margin:0 0 6px;font:700 .8rem/1.2 Karla,Arial,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--ember-text)}

/* a picture that has not been made yet, or failed to load: always labelled, never blank */
.fyb-pending{display:grid;place-items:center;width:100%;aspect-ratio:4/3;background:repeating-linear-gradient(135deg,#F1E6D6 0 14px,#EADCC8 14px 28px);color:#6B5640;text-align:center}
.fyb-pending span{padding:6px 12px;border-radius:99px;background:rgba(255,255,255,.85);font:700 .86rem/1.2 Karla,Arial,sans-serif;letter-spacing:.04em}

/* seven or eight cards: four to a row on a wide screen, two on a phone */
@media (min-width:901px){ .fyb-opts-ill.fyb-n7,.fyb-opts-ill.fyb-n8{grid-template-columns:repeat(4,1fr);gap:14px} }
.fyb-opts-ill.fyb-n7 .fyb-ill-label,.fyb-opts-ill.fyb-n8 .fyb-ill-label{font-size:1rem}
.fyb-ill-img{position:relative}

/* the preview: a few lines that sound like the visitor, one button */
.fyb-reflect{list-style:none;margin:0 0 16px;padding:0;display:grid;gap:10px}
.fyb-reflect li{padding:14px 18px;border-radius:18px;background:#fff;box-shadow:0 0 0 1px #EBD7BF;line-height:1.55;color:#3E2E20;font-size:1.06rem;animation:fybUp .5s both}
.fyb-reflect li:nth-child(2){animation-delay:.1s}.fyb-reflect li:nth-child(3){animation-delay:.2s}.fyb-reflect li:nth-child(4){animation-delay:.3s;border-left:5px solid var(--gold);background:#FFF1DB;font-weight:600}
.fyb-prev-close{margin:0 0 18px;font:600 1.1rem/1.5 "Bricolage Grotesque",Arial,sans-serif;color:var(--ink)}
.fyb-unlock{margin:0 0 4px;text-align:center}
.fyb-unlock-go{width:100%;max-width:520px;justify-content:center}

/* the guide: a visual roadmap */
.fyb-ghero{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:24px;align-items:center;margin-bottom:10px}
.fyb-ghero .fyb-guide-ill{margin:0}
.fyb-gsupp{list-style:none;margin:0 0 12px;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.fyb-gsupp li{padding:6px 14px;border-radius:99px;background:var(--sage-2);color:var(--leaf-text);font-weight:700;font-size:.92rem}
.fyb-gcards,.fyb-gints{list-style:none;margin:0;padding:0;display:grid;gap:12px;grid-template-columns:repeat(3,1fr)}
.fyb-gcards-4{grid-template-columns:repeat(2,1fr)}
.fyb-gcard{display:flex;flex-direction:column;gap:6px;padding:16px 18px;border-radius:18px;background:var(--cream);border:1px solid var(--hairline)}
.fyb-gcard b{font:700 1.04rem/1.25 "Bricolage Grotesque",Arial,sans-serif;color:var(--ink)}
.fyb-gcard span:not(.fyb-gico){color:var(--ink-dim);line-height:1.5;font-size:.98rem}
.fyb-gico{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:var(--fyb-hot);color:#2A1607}
.fyb-gico .fyb-i{width:22px;height:22px}
.fyb-gint{display:flex;flex-direction:column;gap:8px;padding:12px;border-radius:18px;background:#fff;box-shadow:0 0 0 1px #EBD7BF}
.fyb-gint-img{display:block;border-radius:12px;overflow:hidden;background:var(--peach)}
.fyb-gint-img img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}
.fyb-gint-t{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.fyb-gint-t b{font:700 1.02rem/1.25 "Bricolage Grotesque",Arial,sans-serif}
.fyb-gint > span:last-child{color:var(--ink-dim);line-height:1.5;font-size:.96rem}
.fyb-planned{font:700 .76rem/1 Karla,Arial,sans-serif;font-style:normal;padding:4px 9px;border-radius:99px;background:#EFE6D8;color:#5C4A36;letter-spacing:.02em}
.fyb-gimag-ill{margin:0 0 12px;border-radius:22px;overflow:hidden;background:var(--peach)}
.fyb-gimag-ill img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}
.fyb-gnext{padding:18px 20px;border-radius:20px;background:#FFF1DB;border:1px solid var(--gold-line,#E8C98A)}
.fyb-gnext-go{display:inline-flex}
@media (max-width:760px){
  .fyb-ghero{grid-template-columns:1fr}
  .fyb-gcards,.fyb-gints,.fyb-gcards-4{grid-template-columns:1fr}
  .fyb-gint{flex-direction:row;align-items:center}
  .fyb-gint-img{flex:none;width:36%}
  .fyb-gint-t,.fyb-gint > span:last-child{flex:1}
  .fyb-gint{flex-wrap:wrap}
  .fyb-gint .fyb-gint-t{flex:1 1 56%}
  .fyb-gint > span:last-child{flex:1 1 100%}
}
@media print{
  .fyb-gnext{display:none!important}
  .fyb-gint,.fyb-gcard,.fyb-reflect li{break-inside:avoid}
}

/* review-only artwork page */
.fyb-art-grid{list-style:none;margin:0 0 28px;padding:0;display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.fyb-art-card{padding:10px;border-radius:16px;background:#fff;box-shadow:0 0 0 1px #EBD7BF}
.fyb-art-card.is-flag{box-shadow:0 0 0 3px #F47920}
.fyb-art-card img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:10px;margin-bottom:8px}
.fyb-art-card p{margin:0 0 4px;font-size:.84rem;line-height:1.4;color:var(--ink-dim);overflow-wrap:anywhere}
.fyb-art-id{color:var(--ink)!important}
.fyb-art-flag{padding:6px 8px;border-radius:8px;background:#FFF1DB;color:#5A3A12!important}

/* ===================== results: the way in comes first ===================== */
.fyb-prev-ready{margin:0 0 14px;font:600 1.1rem/1.5 "Bricolage Grotesque",Arial,sans-serif;color:var(--ink)}
.fyb-prev-next .fyb-lead{margin:0 0 22px;max-width:none}
.fyb-prev-rest{margin-top:6px}
@media (min-width:1020px){
  .fyb-prev.fyb-prev-next{max-width:1060px;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);column-gap:36px;align-items:start}
  .fyb-prev-next > .fyb-eyebrow{grid-column:1 / -1}
  .fyb-prev-next > .fyb-prev-left{grid-column:1;position:sticky;top:calc(var(--fyb-bar) + 16px)}
  .fyb-prev-left .fyb-prev-ill{margin:0 0 16px}
  .fyb-prev-next > .fyb-prev-main{grid-column:2}
  .fyb-prev-next > .fyb-prev-rest{grid-column:2}
}

/* ============================== exit-intent offer ============================== */
body.fyb-exit-open{overflow:hidden}
.fyb-exit{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:16px}
.fyb-exit[hidden]{display:none}
.fyb-exit-back{position:absolute;inset:0;background:rgba(20,12,6,.72);animation:fybFade .25s both}
.fyb-exit-box{position:relative;width:100%;max-width:640px;max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);overflow:auto;overscroll-behavior:contain;border-radius:26px;background:#FFF6EC;color:var(--ink);padding:clamp(20px,4vw,34px);
  box-shadow:0 30px 80px -20px rgba(0,0,0,.6);animation:fybPop .3s cubic-bezier(.2,.8,.2,1) both;outline:none}
.fyb-exit-h{margin:0 0 8px;font-size:clamp(1.5rem,4vw,2.1rem);line-height:1.12;letter-spacing:-.02em;color:var(--ink)}
.fyb-exit-p{margin:0 0 16px;font-size:1.04rem;line-height:1.55;color:#4D3A29}
.fyb-exit-x{position:absolute;top:8px;right:8px;width:48px;height:48px;border:0;border-radius:50%;background:transparent;color:var(--ink);cursor:pointer;display:grid;place-items:center}
.fyb-exit-x:hover{background:rgba(0,0,0,.06)}
.fyb-exit-x:focus-visible,.fyb-exit-box .fyb-link-btn:focus-visible{outline:3px solid var(--tangerine);outline-offset:2px}
.fyb-exit-x .fyb-i{width:24px;height:24px}
.fyb-exit-go{margin:0 0 8px}
.fyb-exit-no{margin:10px 0 0;text-align:center}
.fyb-exit-grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:24px;align-items:center}
.fyb-exit-pic{border-radius:20px;overflow:hidden;background:var(--peach);aspect-ratio:4/5;box-shadow:0 18px 40px -22px rgba(90,50,10,.7)}
.fyb-exit-pic[hidden]{display:none}
.fyb-exit-pic img{display:block;width:100%;height:100%;object-fit:cover}
.fyb-exit-grid:has(.fyb-exit-pic[hidden]){grid-template-columns:1fr}
/* the light form, on the cream dialog */
.fyb-exit-box .fyb-form{gap:12px}
.fyb-exit-box .fyb-lab{color:var(--ink)}
.fyb-exit-box .fyb-f input{background:#fff;border:2px solid #E4D2BA;color:var(--ink)}
.fyb-exit-box .fyb-f input:focus{outline:3px solid rgba(244,121,32,.45);border-color:var(--ember)}
.fyb-exit-box .fyb-f input.bad{border-color:#C2412D}
.fyb-exit-box .fyb-err{color:#B3261E}
.fyb-exit-box .fyb-pre{color:#8A4B00}
.fyb-exit-box .fyb-consent-note{color:var(--ink-dim);font-size:.82rem}
.fyb-exit-box .fyb-consent-note a{color:#8A4B00}
.fyb-exit-box .fyb-status{background:#fff;color:var(--ink);border:1px solid #EBD7BF}
.fyb-exit-box .fyb-status.is-bad{background:#FFEDE8;border-color:#E9A596}
.fyb-exit-box .fyb-status.is-warn{background:#FFF4D9;border-color:#E8C98A}
.fyb-exit-box .fyb-status.is-ok{background:#E9F5DE;border-color:#A6D181}
.fyb-exit-box .fyb-mock{padding:10px 12px;border:1px dashed #C9AE8B;border-radius:12px;font-size:.84rem;color:var(--ink-dim)}
.fyb-exit-box .fyb-mock label{display:inline-flex;gap:6px;margin:2px 10px 2px 0}
@media (max-width:640px){
  .fyb-exit-grid{grid-template-columns:1fr;gap:14px}
  .fyb-exit-pic{aspect-ratio:16/7}
  .fyb-exit-pic img{object-position:50% 25%}
}
@keyframes fybFade{from{opacity:0}to{opacity:1}}
@keyframes fybPop{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){ .fyb-exit-back,.fyb-exit-box{animation:none} }

/* on a phone or tablet the results lead with the fields: the long intro and the list of what is inside wait until after the button */
@media (max-width:1019px){
  .fyb-prev-next .fyb-lead .fyb-lead-quote{display:none}
  .fyb-prev-next .fyb-lead{padding:20px 18px 22px}
  .fyb-prev-next .fyb-lead .fyb-lead-h{font-size:1.3rem}
}
.fyb-exit-box .fyb-lead .fyb-lead-p,.fyb-exit-box .fyb-lead .fyb-inside,.fyb-exit-box .fyb-lead .fyb-lead-quote,.fyb-exit-box .fyb-lead .fyb-eyebrow{display:none}

/* ===================== the report: Your Health. Your Possibilities. ===================== */
.fyb-rhead{margin-bottom:18px;padding-bottom:16px;border-bottom:2px solid var(--fyb-gold-line,#E8C98F)}
.fyb-rtitle{font-size:clamp(1.7rem,4vw,2.5rem)}
.fyb-rsec{margin-top:26px}
/* the site-wide rule section{padding:74px 0} also reached the report's sections and stacked on their margin: ~170px between
   sections. Report sections carry no padding of their own (the next-step box keeps its own). */
.fyb-report .fyb-rsec:not(.fyb-gnext){padding:0}
.fyb-report .fyb-rsec{margin-top:34px}
@media (max-width:640px){ .fyb-report .fyb-rsec{margin-top:28px} }
.fyb-rwelcome{font-size:clamp(1.3rem,2.6vw,1.7rem)}
.fyb-report .fyb-gcards{margin:14px 0}
@media print{
  .fyb-rsec{break-inside:avoid}
  .fyb-rhead{break-after:avoid}
  .fyb-report .fyb-gimag-ill img{max-height:260px;object-fit:cover}
}
.fyb-rhero{margin:16px 0 8px}
.fyb-rhero-line{margin:0;font:700 1.15rem/1.35 "Bricolage Grotesque",Arial,sans-serif;color:var(--ink)}

/* the list of what is inside, under the picture on the left (light, to sit on the cream page) */

/* ============ results: the reward block under the photo, and the light card ============ */
.fyb-aside{margin:0}
.fyb-aside-h{margin:0 0 6px;font:800 clamp(1.15rem,2.2vw,1.45rem)/1.2 "Bricolage Grotesque",Arial,sans-serif;color:#2B2B28;letter-spacing:-.01em}
.fyb-aside-p{margin:0 0 12px;font-size:1rem;line-height:1.55;color:#44443F}
.fyb-aside-inc{margin:0 0 8px;font:800 .8rem/1.2 Karla,Arial,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#3D7527}
.fyb-lead .fyb-cta:focus-visible,.fyb-lead .fyb-link-btn:focus-visible{outline:3px solid #2B2B28;outline-offset:3px}
.fyb-lead .fyb-lead-go{min-height:64px}
@media (max-width:1019px){
  .fyb-aside .fyb-inside,.fyb-aside .fyb-aside-inc{display:none}
  .fyb-aside{margin:0 0 10px}
  .fyb-aside-h{margin:0;font-size:1.05rem}
  .fyb-aside-p{display:none}      /* the card's own heading and line say the same thing; the fields come first on a phone */
  .fyb-prev-next .fyb-lead .fyb-eyebrow{display:none}
  .fyb-prev-next .fyb-prev-goal{margin-bottom:10px}
  .fyb-prev-next .fyb-lead-h::after{margin-top:8px}
  .fyb-prev-next .fyb-lead-p{margin-bottom:14px;font-size:1rem;line-height:1.5}
}

/* the report's second next step: same size as the first, outlined so the first stays the primary choice */
.fyb-gnext-btns{display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.fyb-cta.fyb-cta-alt{background:#fff;border:2px solid #F47920;box-shadow:none}
.fyb-cta.fyb-cta-alt:hover{background:#FFF1DB;box-shadow:none;filter:none}
@media (max-width:520px){ .fyb-gnext-btns{flex-direction:column;align-items:stretch} .fyb-gnext-btns .fyb-cta{width:100%} }

/* the two next steps at the top of the welcome page, under the welcome message and above "View my report" */
.fyb-w-steps{display:flex;flex-wrap:wrap;justify-content:center;gap:14px;margin:0 auto 18px;max-width:900px}
.fyb-w-steps .fyb-w-step{flex:1 1 300px;max-width:440px;height:auto;min-height:64px;padding:14px 26px;text-align:center;line-height:1.25;gap:12px;font-size:clamp(1rem,1.3vw,1.15rem)}
.fyb-w-steps .fyb-w-step b{display:block;font-weight:800}
.fyb-w-steps .fyb-w-step span{text-wrap:balance}
.fyb-w-steps .fyb-w-step svg{flex:none}
@media (max-width:640px){ .fyb-w-steps{margin-bottom:12px} .fyb-w-steps .fyb-w-step{flex-basis:100%;max-width:none} }