/* for-ecommerce: layout and the store-shelf illustration only. Type, colour, buttons and cards come from landing-system.css. */
.bespoke-for-ecommerce ol,.bespoke-for-ecommerce ul{margin:0;padding:0;list-style:none}

/* links styled as buttons keep the system colours */
.bespoke-for-ecommerce a.ls-btn,.bespoke-for-ecommerce a.ls-btn:hover{color:#fff}
.bespoke-for-ecommerce a.ls-btn--blue,.bespoke-for-ecommerce a.ls-btn--blue:hover,.bespoke-for-ecommerce a.ls-btn--ghost,.bespoke-for-ecommerce a.ls-btn--ghost:hover{color:var(--ls-ink)}

/* the build wraps every table in .table-wrap; let .ls-table-wrap do the framing */
.bespoke-for-ecommerce .ls-table-wrap .table-wrap{margin:0;border:0;border-radius:0;background:none;overflow:visible}

/* hero */
.bespoke-for-ecommerce .ec-hero{padding-top:48px}
.bespoke-for-ecommerce .ec-readtag{margin-top:22px;max-width:560px}

/* illustration: flat, 2px ink outlines, pastel fills */
.bespoke-for-ecommerce .ec-illo{margin:0}
.bespoke-for-ecommerce .ec-illo svg{max-width:500px;margin:0 auto}
.bespoke-for-ecommerce .ec-illo figcaption{text-align:center;margin-top:12px}
.bespoke-for-ecommerce .ec-ink *{stroke:var(--ls-ink);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;fill:none;vector-effect:non-scaling-stroke}
.bespoke-for-ecommerce .ec-ink .f-paper{fill:var(--ls-paper)}
.bespoke-for-ecommerce .ec-ink .f-blue{fill:var(--ls-blue)}
.bespoke-for-ecommerce .ec-ink .f-blue-tint{fill:var(--ls-blue-tint)}
.bespoke-for-ecommerce .ec-ink .f-peach{fill:var(--ls-peach)}
.bespoke-for-ecommerce .ec-ink .f-peach-tint{fill:var(--ls-peach-tint)}
.bespoke-for-ecommerce .ec-ink .f-lavender{fill:var(--ls-lavender)}
.bespoke-for-ecommerce .ec-ink .f-mint{fill:var(--ls-mint)}
.bespoke-for-ecommerce .ec-ink .f-yellow{fill:var(--ls-yellow)}
.bespoke-for-ecommerce .ec-svgtext text{fill:var(--ls-ink);font-family:var(--ls-font)}
.bespoke-for-ecommerce .ec-svgtext .t-sign{font-size:24px;font-weight:800;letter-spacing:-.01em}
.bespoke-for-ecommerce .ec-svgtext .t-shop{font-size:17px;font-weight:700}
.bespoke-for-ecommerce .ec-svgtext .t-price{font-size:30px;font-weight:800;letter-spacing:-.02em}
.bespoke-for-ecommerce .ec-svgtext .t-sold{font-size:18px;font-weight:600}

/* stop map */
.bespoke-for-ecommerce .ec-map a{display:flex;flex-direction:column;gap:6px;height:100%;text-decoration:none;color:var(--ls-ink);padding:22px;transition:transform .18s ease}
.bespoke-for-ecommerce .ec-map a:hover{transform:translateY(-2px)}
.bespoke-for-ecommerce .ec-map b{font-size:18px;line-height:1.3}
.bespoke-for-ecommerce .ec-map-n{width:34px;height:34px;border-radius:50%;border:2px solid var(--ls-ink);background:var(--ls-paper);display:grid;place-items:center;font-weight:800;font-size:15px;margin-bottom:6px}

/* section intros */
.bespoke-for-ecommerce .ls-measure > .ls-tag{margin-bottom:16px}
.bespoke-for-ecommerce .ec-after{margin-top:32px}

/* charts: shared */
.bespoke-for-ecommerce .ec-chart{margin:36px 0 0}
.bespoke-for-ecommerce .ec-chart h3{margin-bottom:22px}
.bespoke-for-ecommerce .ec-chart .ls-source{margin:22px 0 0}

/* chart 1: columns standing on a shelf line */
.bespoke-for-ecommerce .ec-cols{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:14px;align-items:start}
.bespoke-for-ecommerce .ec-cols li{min-width:0}
.bespoke-for-ecommerce .ec-col{height:270px;display:flex;flex-direction:column;justify-content:flex-end;border-bottom:2px solid var(--ls-ink)}
.bespoke-for-ecommerce .ec-col-n{font-size:13px;font-weight:700;color:var(--ls-ink);text-align:center;margin-bottom:6px;font-variant-numeric:tabular-nums}
.bespoke-for-ecommerce .ec-col-b{display:block;height:max(3px,calc(var(--v) * 230px));background:var(--ls-blue-deep);border-radius:8px 8px 0 0}
.bespoke-for-ecommerce .ec-cols li.is-top .ec-col-b{background:var(--ls-peach-deep)}
.bespoke-for-ecommerce .ec-col-l{display:block;font-size:13px;line-height:1.35;color:var(--ls-muted);margin-top:10px}
.bespoke-for-ecommerce .ec-col-l b{display:block;color:var(--ls-ink);font-weight:700;overflow-wrap:anywhere}
.bespoke-for-ecommerce .ec-stats{margin-top:32px}

/* horizontal bars: search demand and creators */
.bespoke-for-ecommerce .ec-legend{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;font-size:13px;color:var(--ls-muted);margin:-8px 0 18px}
.bespoke-for-ecommerce .ec-key{display:inline-block;width:14px;height:14px;border-radius:4px;background:var(--ls-blue-deep);margin-right:-8px}
.bespoke-for-ecommerce .ec-key--gap{background:var(--ls-peach-deep)}
.bespoke-for-ecommerce .ec-hbars{display:grid;gap:12px}
.bespoke-for-ecommerce .ec-hbars li{display:grid;grid-template-columns:minmax(0,15em) minmax(0,1fr) 5.5em 6.5em;gap:14px;align-items:center}
.bespoke-for-ecommerce .ec-hbars--creators li{grid-template-columns:minmax(0,13em) minmax(0,1fr) 4em}
.bespoke-for-ecommerce .ec-hb-l{font-size:15px;line-height:1.3;color:var(--ls-ink)}
.bespoke-for-ecommerce .ec-hb-l i{display:block;font-style:normal;font-size:13px;color:var(--ls-muted)}
.bespoke-for-ecommerce .ec-hb{height:22px;background:linear-gradient(90deg,var(--ls-line) 1px,transparent 1px) 0 0/25% 100%;border-left:2px solid var(--ls-ink)}
.bespoke-for-ecommerce .ec-hb span{display:block;height:100%;width:calc(var(--v) * 100%);background:var(--ls-blue-deep);border-radius:0 6px 6px 0}
.bespoke-for-ecommerce .ec-hbars li.is-gap .ec-hb span{background:var(--ls-peach-deep)}
.bespoke-for-ecommerce .ec-hb-n{font-weight:700;font-size:15px;text-align:right;font-variant-numeric:tabular-nums;color:var(--ls-ink)}
.bespoke-for-ecommerce .ec-hb-v{font-size:13px;color:var(--ls-muted);white-space:nowrap}
.bespoke-for-ecommerce .ec-hbars li.is-gap .ec-hb-v{color:var(--ls-peach-deep);font-weight:700}
.bespoke-for-ecommerce .ec-pair{margin-top:32px}

/* creators */
.bespoke-for-ecommerce .ec-staff{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:28px;align-items:start;margin-top:36px}
.bespoke-for-ecommerce .ec-staff .ec-chart{margin:0}
.bespoke-for-ecommerce .ec-staff-stats{gap:16px}
.bespoke-for-ecommerce .ec-staff-stats .ls-card{padding:20px}
.bespoke-for-ecommerce .ec-staff-stats .ls-tag{align-self:flex-start}
.bespoke-for-ecommerce .ec-staff-stats b{font-size:clamp(26px,2.4vw,34px)}

/* reviews and comments */
.bespoke-for-ecommerce .ec-receipts{margin-top:36px}
.bespoke-for-ecommerce .ec-receipts h3{margin-bottom:4px}
.bespoke-for-ecommerce .ec-list{display:grid;gap:12px;margin-top:14px;font-size:16px;line-height:1.5}
.bespoke-for-ecommerce .ec-list li{padding-top:12px;border-top:1px solid var(--ls-line)}
.bespoke-for-ecommerce .ec-list--n li{display:grid;grid-template-columns:2.6em minmax(0,1fr);align-items:baseline}
.bespoke-for-ecommerce .ec-list em{color:var(--ls-muted)}
.bespoke-for-ecommerce .ec-list--n b{font-size:20px;font-weight:800;color:var(--ls-ink)}
.bespoke-for-ecommerce .ec-stars{color:var(--ls-peach-deep);letter-spacing:.06em;margin-right:6px}
.bespoke-for-ecommerce .ec-stars s{text-decoration:none;color:var(--ls-line)}
.bespoke-for-ecommerce .ec-todo{margin-top:24px;background:var(--ls-paper)}
.bespoke-for-ecommerce .ec-todo .ls-steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 32px}

/* costs */
.bespoke-for-ecommerce .ec-plans{margin:28px 0 16px;gap:14px}
.bespoke-for-ecommerce .ec-plans .ls-card{padding:20px;display:flex;flex-direction:column;gap:8px}
.bespoke-for-ecommerce .ec-plans .ls-tag{align-self:flex-start}
.bespoke-for-ecommerce .ec-plans b{font-size:22px;font-weight:800;color:var(--ls-ink);letter-spacing:-.01em}
.bespoke-for-ecommerce .ec-plans p{margin:0}

/* what's on the shelf */
.bespoke-for-ecommerce .ec-shelfmap{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:48px;align-items:start}

/* FAQ */
.bespoke-for-ecommerce .ec-faq{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:48px;align-items:start}

/* method */
.bespoke-for-ecommerce .ec-method-h{font-size:clamp(20px,1.8vw,24px);letter-spacing:-.01em}

@media (max-width:960px){
  .bespoke-for-ecommerce .ec-staff,.bespoke-for-ecommerce .ec-shelfmap,.bespoke-for-ecommerce .ec-faq{grid-template-columns:1fr;gap:28px}
}
@media (max-width:640px){
  .bespoke-for-ecommerce .ec-hero{padding-top:28px}
  .bespoke-for-ecommerce .ec-illo{padding:8px;border-radius:24px}
  .bespoke-for-ecommerce .ec-chart{padding:20px 16px}
  /* columns turn into rows on phones */
  .bespoke-for-ecommerce .ec-cols{grid-template-columns:1fr;gap:12px}
  .bespoke-for-ecommerce .ec-cols li{display:grid;grid-template-columns:minmax(0,7.5em) minmax(0,1fr);gap:10px;align-items:center}
  .bespoke-for-ecommerce .ec-col{order:2;height:auto;flex-direction:row;align-items:center;justify-content:flex-start;gap:8px;border-bottom:0;border-left:2px solid var(--ls-ink);min-height:22px}
  .bespoke-for-ecommerce .ec-col-b{order:1;height:16px;width:max(3px,calc(var(--v) * (100% - 70px)));border-radius:0 6px 6px 0}
  .bespoke-for-ecommerce .ec-col-n{order:2;margin:0}
  .bespoke-for-ecommerce .ec-col-l{order:1;margin:0}
  .bespoke-for-ecommerce .ec-stats{grid-template-columns:1fr 1fr;gap:20px}
  .bespoke-for-ecommerce .ec-stats b{font-size:30px}
  .bespoke-for-ecommerce .ec-hbars{gap:16px}
  .bespoke-for-ecommerce .ec-hbars li,.bespoke-for-ecommerce .ec-hbars--creators li{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"l l" "b n" "v v";gap:4px 10px}
  .bespoke-for-ecommerce .ec-hb-l{grid-area:l}
  .bespoke-for-ecommerce .ec-hb{grid-area:b;height:16px}
  .bespoke-for-ecommerce .ec-hb-n{grid-area:n;font-size:14px}
  .bespoke-for-ecommerce .ec-hb-v{grid-area:v}
  .bespoke-for-ecommerce .ec-staff-stats{grid-template-columns:1fr 1fr}
  .bespoke-for-ecommerce .ec-staff-stats .ls-card{padding:16px}
  .bespoke-for-ecommerce .ec-staff-stats b{font-size:24px}
  .bespoke-for-ecommerce .ec-todo .ls-steps{grid-template-columns:1fr}
  .bespoke-for-ecommerce .ec-plans{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){.bespoke-for-ecommerce .ec-map a{transition:none}}