/* Black Friday Campaign case study – story sections (extends rabbit-launch.css rl-* base) */
.bf-story .rl-list .rl-kicker,.bf-kicker{display:block;font:600 12px/16px 'Manrope',sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#2A1FD6}
.bf-story h3{margin:0}
/* 01 month track */
.bf-track{list-style:none;margin:0;padding:0;display:flex;gap:8px}
.bf-track li{flex:var(--w) 1 0;min-width:0;display:flex;flex-direction:column;gap:10px}
.bf-track__bar{display:block;height:14px;border-radius:7px;background:var(--c);margin-bottom:6px}
html.site-typography body .bf-track h3{font-size:17px!important;line-height:1.3!important;color:#17345C}
html.site-typography body .bf-track p{margin:0;font-size:14px!important;line-height:1.5!important;color:#4D5B70}
html.site-typography body .bf-note{margin:28px 0 0;font-size:13px!important;color:#56657A}
/* 02 system */
.bf-stays{display:grid;grid-template-columns:220px repeat(4,1fr);gap:24px;padding:28px 32px;border-radius:16px;background:#F3F6FA;margin-bottom:56px}
.bf-stays strong{display:block;margin-top:6px;font:700 18px/1.3 'Manrope',sans-serif;color:#17345C}
html.site-typography body .bf-stays h3{font-size:16px!important;line-height:1.35!important;color:#17345C;margin-bottom:6px}
html.site-typography body .bf-stays p{margin:0;font-size:14px!important;line-height:1.5!important;color:#4D5B70}
.bf-phases{display:grid;grid-template-columns:repeat(5,1fr);gap:24px}
.bf-phases figure{display:flex;flex-direction:column;gap:16px;margin:0;min-width:0}
.bf-phases__img{aspect-ratio:1206/1471;display:flex;align-items:flex-start}
.bf-phases__img .rl-card{width:100%}
.bf-phases__img img{height:auto}
.bf-phases figcaption{display:flex;flex-direction:column;gap:8px}
html.site-typography body .bf-phases h3{font-size:20px!important;line-height:1.25!important;color:#17345C}
html.site-typography body .bf-phases .rl-desc{font-size:14px!important;line-height:1.55!important}
/* 03 rollout */
.bf-rollout{display:flex;flex-direction:column;gap:clamp(64px,8vw,112px)}
.bf-build{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,3.5vw,48px)}
.bf-build figure,.bf-main,.bf-final figure{margin:0}
.bf-build figure{display:flex;flex-direction:column;gap:20px}
.bf-build .rl-card,.bf-main .rl-card,.bf-final .rl-card{aspect-ratio:auto}
.bf-build .rl-card img,.bf-main .rl-card img,.bf-final .rl-card img{height:auto}
.bf-build figcaption{display:flex;flex-direction:column;gap:4px}
html.site-typography body .bf-build h3{font-size:17px!important;line-height:1.3!important;color:#17345C}
.bf-main{display:flex;flex-direction:column;gap:32px}
.bf-main figcaption,.bf-final__text{display:grid;grid-template-columns:380px 1fr;gap:48px;align-items:start}
.bf-final{display:grid;grid-template-columns:minmax(0,600px) 1fr;gap:64px;align-items:center}
.bf-final__text{display:flex;flex-direction:column;gap:8px}
html.site-typography body .bf-main h3,html.site-typography body .bf-final h3{font-size:26px!important;line-height:1.2!important;letter-spacing:-.015em!important;color:#17345C;margin-top:8px}
.bf-final__text .rl-desc{margin-top:4px}
/* 04 one page */
.bf-story .bf-stage{margin:0 0 96px;display:flex;flex-direction:column;gap:14px}
.bf-stage__inner{border-radius:16px;background:#F3F6FA;padding:clamp(28px,5vw,72px);overflow:hidden}
.bf-stage__inner img{display:block;width:100%;height:auto}
.bf-subhead{display:flex;flex-direction:column;gap:12px;margin-bottom:48px;max-width:760px}
html.site-typography body .bf-subhead h3{font-size:32px!important;line-height:1.15!important;letter-spacing:-.02em!important;color:#17345C}
html.site-typography body .bf-subhead p{margin:0;font-size:16px!important;line-height:1.6!important;color:#4D5B70}
.bf-story .rl-flow{grid-template-columns:1fr 560px}
.bf-story .rl-list li:first-child{border-top:0;padding-top:0}
.bf-story .rl-list li:last-child{border-bottom:0}
.bf-preview{display:flex;flex-direction:column;align-items:center;gap:20px}
.bf-preview__frame{position:relative;width:100%;border-radius:12px;overflow:hidden;border:1px solid #E3E8EF;box-shadow:var(--site-shadow-lg,0 8px 26px rgba(23,52,92,.075))}
.bf-preview__frame img{display:block;width:100%;height:auto}
.bf-marker{position:absolute;width:30px;height:30px;border-radius:50%;background:#17345C;border:2px solid #fff;box-shadow:0 2px 6px rgba(0,0,0,.25);color:#fff;font:700 12px/26px 'Manrope',sans-serif;text-align:center;box-sizing:border-box}
.bf-btn{display:inline-flex;align-items:center;gap:10px;padding:14px 26px;border-radius:999px;background:#17345C;border:0;color:#fff;font:600 15px/1 'Manrope',sans-serif;cursor:pointer}
.bf-btn:hover{background:#0F2442}
.bf-btn:focus-visible{outline:3px solid #2A1FD6;outline-offset:3px}
/* responsive */
@media (max-width:1199px){
  .bf-track{display:grid;grid-template-columns:repeat(3,1fr);gap:32px 16px}
  .bf-stays{grid-template-columns:repeat(2,1fr)}
  .bf-stays>div:first-child{grid-column:1/-1}
  .bf-phases{grid-template-columns:repeat(3,1fr);row-gap:40px}
  .bf-story .rl-flow{grid-template-columns:1fr}
  .bf-preview{max-width:560px;width:100%;margin:0 auto}
  .bf-main figcaption{grid-template-columns:1fr;gap:12px}
}
@media (max-width:767px){
  .bf-track{display:flex;flex-direction:column;gap:20px}
  .bf-track li{flex:none;display:grid;grid-template-columns:44px 1fr;column-gap:12px;row-gap:2px}
  .bf-track__bar{grid-row:1/4;width:8px;height:auto;margin:0;border-radius:4px;justify-self:center}
  .bf-stays{grid-template-columns:1fr;padding:24px}
  .bf-phases{grid-template-columns:repeat(2,1fr);gap:32px 16px}
  .bf-phases__img{aspect-ratio:auto}
  .bf-build{grid-template-columns:1fr;gap:40px}
  .bf-final{grid-template-columns:1fr;gap:20px}
  .bf-story .bf-stage{margin-bottom:64px}
  html.site-typography body .bf-subhead h3{font-size:26px!important}
  .bf-marker{width:24px;height:24px;font-size:10px;line-height:20px}
}
/* 03: Black Friday + Cyber Monday side by side, same frame size */
.bf-peak{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,3.5vw,48px)}
.bf-peak figure{margin:0;display:flex;flex-direction:column;gap:20px}
.bf-peak .rl-card{aspect-ratio:2400/1150}
.bf-peak .rl-card img{width:100%;height:100%;object-fit:cover;object-position:center}
.bf-peak figcaption{display:flex;flex-direction:column;gap:8px}
html.site-typography body .bf-peak h3{font-size:24px!important;line-height:1.2!important;letter-spacing:-.015em!important;color:#17345C}
@media (max-width:767px){.bf-peak{grid-template-columns:1fr;gap:40px}}
/* final polish: no single-word last lines */
.bf-kicker,.bf-story .rl-cap{text-wrap:balance}
.case-study-more p{text-wrap:balance}
