/* ==========================
   RB Work (Case Studies) v2.1.0 — own file: rb-work.css
   Every value below is a fallback; the widget's Style tab overrides it.
========================== */
.rbwk{
  --rbwk-dur:500ms;
  --rbwk-left:52%;
  --rbwk-gap:40px;
  --rbwk-btn:52px;
  --rbwk-icon:12px;
  --rbwk-divider:rgba(255,255,255,.12);
  --rbwk-divider-w:1px;
  --rbwk-stroke:#FFFFFF;
  --rbwk-stroke-w:2px;
  --rbwk-bar-h:32px;
  --rbwk-bar-min:92px;
  --rbwk-bar-label:76px;
  position:relative;
  width:100%;
  background-color:#040917;
  color:#FFFFFF;
}
.rbwk *{box-sizing:border-box}
.rbwk__inner{max-width:1280px;margin:0 auto;padding:96px 24px}

/* Header */
.rbwk__header{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:48px;padding:0 0 56px}
.rbwk__heading{margin:0;font-size:clamp(48px,7.5vw,112px);font-weight:800;line-height:.95;letter-spacing:-.05em}
.rbwk__line1,.rbwk__line2{display:block}
.rbwk__line1{color:#FFFFFF}
.rbwk__line2{color:#F59A00}
.rbwk .rbwk__line2--outline{color:transparent!important;-webkit-text-stroke:var(--rbwk-stroke-w) var(--rbwk-stroke);paint-order:stroke fill}
.rbwk__intro{margin:0 0 8px;max-width:380px;color:#A7B3C6;font-size:17px;line-height:1.6}

/* Rows */
.rbwk__list{border-bottom:var(--rbwk-divider-w) solid var(--rbwk-divider)}
.rbwk__item{padding:40px 0;border-top:var(--rbwk-divider-w) solid var(--rbwk-divider);transition:background-color .3s ease}
.rbwk__head{display:grid;grid-template-columns:var(--rbwk-left) minmax(0,1fr);column-gap:var(--rbwk-gap);align-items:start}
.rbwk[data-row="1"] .rbwk__item:not(.is-locked) .rbwk__head{cursor:pointer}
.rbwk__meta{margin-bottom:14px;color:#8E9CB0;font-size:11px;font-weight:700;line-height:1.3;letter-spacing:.12em;text-transform:uppercase}
.rbwk__metric{margin:0;color:#F08A00;font-size:clamp(56px,7vw,104px);font-weight:800;line-height:.95;letter-spacing:-.045em}
.rbwk__right-head{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;padding-top:34px;min-width:0}
.rbwk__summary{margin:0;max-width:480px;color:#FFFFFF;font-size:26px;font-weight:800;line-height:1.25;letter-spacing:-.02em}

/* Toggle button: + turns into x when open */
.rbwk .rbwk__toggle{
  -webkit-appearance:none;appearance:none;
  position:relative;flex:none;display:grid;place-items:center;
  width:var(--rbwk-btn);height:var(--rbwk-btn);margin:0;padding:0;
  border:1px solid rgba(255,255,255,.18);border-radius:999px;
  background-color:rgba(255,255,255,0);color:#FFFFFF;
  box-shadow:none;cursor:pointer;line-height:1;
  transition:background-color .25s ease,border-color .25s ease,color .25s ease,transform .25s ease;
}
.rbwk .rbwk__toggle:hover{background-color:rgba(255,255,255,.06);border-color:rgba(255,255,255,.4)}
.rbwk .rbwk__toggle:focus{outline:none}
.rbwk .rbwk__toggle:focus-visible{outline:2px solid #F59A00;outline-offset:3px}
.rbwk__icon{position:relative;display:block;width:var(--rbwk-icon);height:var(--rbwk-icon);transition:transform var(--rbwk-dur) cubic-bezier(.2,.8,.2,1)}
.rbwk__icon::before,.rbwk__icon::after{content:"";position:absolute;left:0;top:50%;width:100%;height:1.5px;margin-top:-.75px;border-radius:2px;background:currentColor}
.rbwk__icon::after{transform:rotate(90deg)}
.rbwk__item.is-open .rbwk__icon{transform:rotate(135deg)}
.rbwk__sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Details: smooth height animation with grid rows 0fr -> 1fr */
.rbwk__body{display:grid;grid-template-rows:0fr;transition:grid-template-rows var(--rbwk-dur) cubic-bezier(.2,.8,.2,1)}
.rbwk__item.is-open .rbwk__body{grid-template-rows:1fr}
.rbwk__body-clip{min-height:0;overflow:hidden}
.rbwk__body-inner{
  display:grid;grid-template-columns:var(--rbwk-left) minmax(0,1fr);column-gap:var(--rbwk-gap);row-gap:32px;
  padding-top:36px;
  opacity:0;transform:translateY(-6px);
  transition:opacity var(--rbwk-dur) ease,transform var(--rbwk-dur) cubic-bezier(.2,.8,.2,1);
}
.rbwk__item.is-open .rbwk__body-inner{opacity:1;transform:none}
.rbwk__detail,.rbwk__visual{min-width:0}
.rbwk__label{margin-bottom:14px;color:#F08A00;font-size:11px;font-weight:700;line-height:1.3;letter-spacing:.12em;text-transform:uppercase}
.rbwk__challenge{margin:0;max-width:560px;color:#C3CCDA;font-size:17px;line-height:1.55}
.rbwk__tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.rbwk__tag{display:inline-flex;align-items:center;padding:8px 14px;border:1px solid rgba(255,255,255,.2);border-radius:999px;background-color:rgba(255,255,255,0);color:#FFFFFF;font-size:12px;font-weight:600;line-height:1.2}
.rbwk .rbwk__cta{display:inline-flex;align-items:center;gap:8px;margin-top:24px;padding:12px 20px;border-radius:999px;background-color:#F59A00;color:#040917;font-size:14px;font-weight:700;line-height:1.2;text-decoration:none;transition:transform .25s ease,filter .25s ease}
.rbwk .rbwk__cta:hover{transform:translateY(-2px);filter:brightness(1.05);color:#040917}

/* Before / After bars */
.rbwk__chart-title{margin-bottom:18px;color:#8E9CB0;font-size:11px;font-weight:700;line-height:1.3;letter-spacing:.12em;text-transform:uppercase}
.rbwk__bars{display:grid;gap:12px}
.rbwk__bar{display:grid;grid-template-columns:var(--rbwk-bar-label) minmax(0,1fr);align-items:center;gap:12px}
.rbwk__bar-label{color:#8E9CB0;font-size:13px;line-height:1.2}
.rbwk__bar-track{position:relative;display:block;height:var(--rbwk-bar-h);border-radius:999px;background-color:rgba(255,255,255,0)}
.rbwk__bar-fill{
  display:flex;align-items:center;height:100%;padding:0 14px;
  width:max(var(--rbwk-bar-min),var(--w));max-width:100%;
  border-radius:999px;background-color:#1E2433;color:#FFFFFF;
  font-size:13px;font-weight:800;line-height:1;white-space:nowrap;overflow:hidden;
}
.rbwk__bar.is-hi .rbwk__bar-fill{background-color:#F08A00;color:#040917}
.rbwk[data-bars="1"] .rbwk__bar-fill{width:var(--rbwk-bar-min);transition:width 1s cubic-bezier(.2,.8,.2,1) calc(var(--d,0ms) + 120ms)}
.rbwk[data-bars="1"] .rbwk__item.is-open .rbwk__bar-fill{width:max(var(--rbwk-bar-min),var(--w))}
.rbwk__image{display:block;width:100%;height:260px;object-fit:cover;border-radius:20px}

@media(max-width:1024px){
  .rbwk__header{grid-template-columns:minmax(0,1fr);gap:20px}
  .rbwk__summary{font-size:22px}
}
@media(max-width:767px){
  .rbwk__inner{padding:64px 16px}
  .rbwk__header{padding-bottom:40px}
  .rbwk__heading{font-size:clamp(42px,13vw,64px)}
  .rbwk__item{padding:28px 0}
  /* Phone: top line + button on one row, big result below, summary under it */
  .rbwk__head{grid-template-columns:minmax(0,1fr) auto;column-gap:16px}
  .rbwk__right-head{display:contents}
  .rbwk__left-head{grid-column:1;grid-row:1 / span 2}
  .rbwk__toggle{grid-column:2;grid-row:1;align-self:start}
  .rbwk__summary{grid-column:1 / -1;grid-row:3;margin-top:16px;font-size:19px}
  .rbwk__metric{font-size:clamp(44px,13vw,64px)}
  .rbwk__body-inner{grid-template-columns:minmax(0,1fr);padding-top:26px}
  .rbwk__challenge{font-size:15px}
}
@media(prefers-reduced-motion:reduce){
  .rbwk__body,.rbwk__body-inner,.rbwk__icon,.rbwk__bar-fill{transition:none!important}
}