.hwb-hw{text-size-adjust:100%;-webkit-text-size-adjust:100%;--orange:var(--orange-primary);--ink:var(--fg);--muted:var(--body);--bg:var(--bg-cream);font-family:var(--f-body);color:var(--fg)}
.hwb-hw{position:relative;height:100svh;min-height:620px;background:linear-gradient(180deg,var(--bg),#FFF1E5 60%,var(--bg));overflow:hidden}
.hwb-wrap{height:100%;width:min(1240px,100%);margin-inline:auto;padding:clamp(60px,9svh,100px) clamp(16px,4vw,40px) clamp(18px,3svh,34px);display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(24px,4vw,64px);align-items:center}
.hwb-eyebrow{margin:0 0 12px;font-family:var(--f-mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--orange-deep)}
.hwb-h{margin:0;font-family:var(--f-display);font-weight:800;text-transform:uppercase;font-size:clamp(34px,3.7vw,54px);line-height:.98}
.hwb-h .hwb-line{display:block;overflow:hidden;padding-block:.04em}.hwb-h .hwb-line>span{display:block}.hwb-h .hwb-l2{color:var(--orange)}

.hwb-num{position:relative;height:clamp(84px,11vw,150px);overflow:hidden;margin-top:clamp(14px,2.4svh,28px)}
.hwb-num span{position:absolute;left:0;top:0;font-family:var(--f-display);font-weight:800;font-size:clamp(84px,11vw,150px);line-height:1;color:var(--ink)}
.hwb-txts{position:relative;min-height:clamp(190px,26svh,230px)}
.hwb-tx{position:absolute;left:0;right:0;top:0}
.hwb-tx .hwb-tag{display:inline-block;font-family:var(--f-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;border:1px solid var(--ink);border-radius:999px;padding:5px 12px}
.hwb-tx h3{margin:12px 0 0;font-family:var(--f-display);font-weight:800;text-transform:uppercase;font-size:clamp(24px,2.6vw,38px);line-height:1.02}
.hwb-tx p{margin:10px 0 0;max-width:27em;color:var(--muted);font-size:clamp(14px,1.15vw,17px);line-height:1.55}
.hwb-dots{display:flex;align-items:center;gap:10px;margin-top:clamp(14px,2.4svh,26px);font-family:var(--f-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.hwb-dots .hwb-trk{position:relative;width:140px;height:3px;border-radius:2px;background:var(--line);overflow:hidden}
.hwb-dots .hwb-trk i{position:absolute;inset:0;background:var(--orange);transform-origin:left;transform:scaleX(0)}
.hwb-cta{display:inline-flex;align-items:center;gap:10px;margin-top:clamp(14px,2.4svh,24px);color:var(--ink);text-decoration:none;font-weight:600;font-size:15px;border-bottom:1.5px solid var(--ink);padding-bottom:3px}
.hwb-cta svg{width:18px;height:18px;transition:transform .4s cubic-bezier(.2,.8,.2,1)}.hwb-cta:hover svg{transform:translateX(5px)}
.hwb-cta:focus-visible{outline:2px solid var(--ink);outline-offset:4px}

/* the board */
.hwb-board{position:relative;aspect-ratio:1.08;max-height:min(70svh,640px);width:100%;justify-self:end;border-radius:26px;background:var(--ink);color:#FFF8F0;padding:clamp(18px,2.4vw,32px);overflow:hidden;box-shadow:0 40px 70px -40px rgba(120,45,10,.7)}
.hwb-btop{display:flex;align-items:center;justify-content:flex-start;gap:12px;font-family:var(--f-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,248,240,.6)}
.hwb-btop b{font-weight:500;color:#FFF8F0}
.hwb-btop .hwb-dot{display:inline-flex;flex:none;gap:6px}.hwb-btop .hwb-dot i{width:10px;height:10px;border-radius:50%}
.hwb-btop .hwb-dot i:nth-child(1){background:#ff5f57}.hwb-btop .hwb-dot i:nth-child(2){background:#febc2e}.hwb-btop .hwb-dot i:nth-child(3){background:#28c840}
.hwb-layer{position:absolute;left:clamp(18px,2.4vw,32px);right:clamp(18px,2.4vw,32px);top:clamp(58px,6vw,74px);bottom:clamp(20px,2.4vw,32px)}

/* layer 1: funnel */
.hwb-fn{display:flex;flex-direction:column;justify-content:space-between;height:100%}
.hwb-fr{position:relative;display:grid;grid-template-columns:clamp(86px,10vw,118px) 1fr;align-items:center;gap:12px;font-size:clamp(12px,1.1vw,14px)}
.hwb-fr .hwb-bar{position:relative;height:clamp(22px,3.4vw,36px);border-radius:8px;background:rgba(255,248,240,.08)}
.hwb-fr .hwb-bar i{position:absolute;left:0;top:0;bottom:0;width:var(--w);border-radius:8px;background:linear-gradient(90deg,#FFF8F0,#F6D3BC);transform-origin:left}
.hwb-fr .hwb-lk{position:absolute;right:0;top:50%;transform:translateY(-50%);font-family:var(--f-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;background:var(--orange);color:var(--ink);padding:4px 9px;border-radius:999px;opacity:1}
.hwb-fr.hwb-leak .hwb-bar i{background:linear-gradient(90deg,#FFF8F0,var(--orange))}
.hwb-cap{margin-top:8px;font-family:var(--f-mono);font-size:10px;letter-spacing:.08em;color:rgba(255,248,240,.5)}

/* layer 2: ranked list */
.hwb-rk{display:flex;flex-direction:column;gap:clamp(10px,1.6vw,18px);height:100%;justify-content:center}
.hwb-rw{display:grid;grid-template-columns:44px 1fr;gap:14px;align-items:center;padding:clamp(12px,1.6vw,18px);border-radius:16px;background:rgba(255,248,240,.07);border:1px solid rgba(255,248,240,.12)}
.hwb-rw .hwb-no{font-family:var(--f-display);font-weight:800;font-size:clamp(28px,3vw,40px);color:var(--orange);line-height:1}
.hwb-rw b{display:block;font-weight:600;font-size:clamp(14px,1.3vw,17px)}
.hwb-rw span{display:block;margin-top:2px;font-size:clamp(12px,1vw,13.5px);color:rgba(255,248,240,.62)}
.hwb-rw .hwb-imp{grid-column:1/-1;height:6px;border-radius:3px;background:rgba(255,248,240,.1);overflow:hidden}
.hwb-rw .hwb-imp i{display:block;height:100%;width:var(--w);background:var(--orange);border-radius:3px;transform-origin:left}

/* layer 3: loop */
.hwb-lp{display:grid;place-items:center;height:100%;align-content:center;gap:clamp(12px,2vw,22px)}
.hwb-lp svg{width:min(62%,300px);height:auto;overflow:visible}
.hwb-ring{fill:none;stroke:rgba(255,248,240,.2);stroke-width:2;stroke-dasharray:3 7}
.hwb-arcp{fill:none;stroke:var(--orange);stroke-width:3;stroke-linecap:round}
.hwb-nd{fill:var(--ink);stroke:#FFF8F0;stroke-width:2}
.hwb-lp text{font-family:var(--f-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;fill:#FFF8F0;text-anchor:middle}
.hwb-pt{fill:var(--orange)}
.hwb-tg{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.hwb-tg span{font-size:clamp(12px,1vw,13.5px);padding:6px 12px;border-radius:999px;background:rgba(255,248,240,.1);border:1px solid rgba(255,248,240,.18)}



/* Integrated layout: every screen keeps all three scroll stages available. */
.hwb-hw{height:auto;min-height:0;overflow:clip;background:linear-gradient(180deg,var(--bg-cream),var(--bg-warm) 60%,var(--bg-cream))}
.hwb-frame{min-height:660px;padding:96px 0 40px}
.hwb-wrap{height:auto;padding:0 clamp(16px,4vw,40px);gap:clamp(24px,4vw,64px)}
.hwb-h{font-size:clamp(34px,3.7vw,50px)}
.hwb-num{height:clamp(80px,9vw,120px);margin-top:16px}.hwb-num span{font-size:clamp(80px,9vw,120px)}
.hwb-txts{min-height:180px}.hwb-tx h3{font-size:clamp(24px,2.5vw,34px)}.hwb-tx p{font-size:clamp(14px,1.15vw,17px)}
.hwb-controls{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.hwb-controls button{display:flex;align-items:center;justify-content:center;gap:6px;white-space:nowrap;line-height:1.2;min-width:0;min-height:44px;padding:8px 13px;background:transparent;border:1px solid var(--line);border-radius:999px;font:500 12px var(--f-mono);color:var(--body);cursor:pointer}
.hwb-controls button[aria-pressed="true"]{background:var(--fg);border-color:var(--fg);color:var(--bg-cream)}
.hwb-controls button:hover{border-color:var(--fg)}
.hwb-cta{min-height:36px;margin-top:14px}
.hwb-board{aspect-ratio:1.08;max-height:600px;min-height:340px;background:var(--fg)}
.hwb-btop{color:#c6beb7}.hwb-rw span{color:#c6beb7}.hwb-fr .hwb-lk{color:#fff}
.hwb-nojs .hwb-tx{position:relative;margin-bottom:20px}.hwb-nojs .hwb-txts{min-height:0}.hwb-nojs .hwb-controls{display:none}
.hwb-scroll .hwb-frame{height:100svh;min-height:0;padding:94px 0 30px;display:grid;align-items:center}
.hwb-scroll .hwb-wrap{height:100%}.hwb-scroll .hwb-board{max-height:calc(100svh - 145px)}
@media (max-width:860px){
 .hwb-frame{min-height:0;padding:50px 0 42px}
 .hwb-wrap{display:grid;grid-template-columns:1fr;gap:14px;width:min(620px,100%)}
 .hwb-left{display:contents}.hwb-eyebrow{display:none}
 .hwb-h{grid-row:1;font-size:clamp(28px,7.5vw,40px)}.hwb-h .hwb-line{display:inline}.hwb-h .hwb-l2{display:block}
 .hwb-num{display:none}.hwb-controls{grid-row:2;margin:0;flex-wrap:nowrap}.hwb-controls button{flex:1 1 0;padding:8px 4px;font-size:clamp(10px,2.8vw,12px);gap:5px}
 .hwb-txts{grid-row:3;min-height:132px}.hwb-tx h3{font-size:23px;margin-top:8px}.hwb-tx p{font-size:14px;line-height:1.45;margin-top:8px;max-width:36em}.hwb-tx .hwb-tag{display:none}
 .hwb-board{grid-row:4;aspect-ratio:auto;height:350px;min-height:0;max-height:none;border-radius:20px;padding:16px}
 .hwb-cta{grid-row:5;justify-self:start;margin:0;min-height:36px;font-size:15px}
 .hwb-layer{top:52px;bottom:18px;left:16px;right:16px}
 .hwb-fr{grid-template-columns:86px 1fr;font-size:12px}.hwb-fr .hwb-bar{height:26px}
 .hwb-rk{gap:8px}.hwb-rw{padding:8px 10px;gap:5px 8px;grid-template-columns:30px 1fr}.hwb-rw .hwb-no{font-size:28px}.hwb-rw b{font-size:14px;line-height:1.25}.hwb-rw div span{font-size:12px;line-height:1.3}.hwb-rw .hwb-imp{height:5px}
 .hwb-lp svg{width:180px;max-width:62%}.hwb-tg{gap:6px}.hwb-tg span{font-size:11px;padding:5px 8px}
 .hwb-scroll{--hwb-frame-space:226px}
 .hwb-scroll .hwb-frame{position:sticky;top:80px;height:auto;padding:18px 0;display:block}
 .hwb-mobile-intro{width:min(620px,100%);margin-inline:auto;padding:42px clamp(16px,4vw,40px) 14px}
 .hwb-scroll .hwb-wrap{height:auto;grid-template-rows:44px var(--hwb-copy-height,96px) auto 36px;gap:10px;align-items:stretch}
 .hwb-scroll .hwb-controls{grid-row:1}.hwb-scroll .hwb-txts{grid-row:2}.hwb-scroll .hwb-board{grid-row:3}.hwb-scroll .hwb-cta{grid-row:4}
 .hwb-scroll .hwb-board{height:clamp(244px,calc(100svh - var(--hwb-copy-height,96px) - var(--hwb-frame-space)),320px);max-height:none}.hwb-scroll .hwb-txts{min-height:0}.hwb-scroll .hwb-tx h3{font-size:21px}.hwb-scroll .hwb-tx p{font-size:13px}
 .hwb-short{--hwb-frame-space:200px}
 .hwb-short .hwb-frame{padding:8px 0}
 .hwb-short .hwb-wrap{grid-template-rows:44px var(--hwb-copy-height,96px) auto 36px;gap:8px}
 .hwb-short .hwb-board{padding:14px}
 .hwb-short .hwb-layer{top:42px;bottom:12px;left:14px;right:14px}
 .hwb-short .hwb-fr .hwb-bar{height:22px}.hwb-short .hwb-lp{gap:10px}.hwb-short .hwb-lp svg{width:130px}
 .hwb-short .hwb-rw{padding:6px 8px;gap:3px 8px}.hwb-short .hwb-rk{gap:6px}
 .hwb-short .hwb-rw b{font-size:13px}.hwb-short .hwb-rw div span{font-size:11px}
 .hwb-short .hwb-tx h3{font-size:20px;margin-top:4px}.hwb-short .hwb-tx p{font-size:12px;line-height:1.4;margin-top:6px}
 .hwb-landscape .hwb-mobile-intro{width:min(1240px,100%)}
 .hwb-landscape .hwb-frame{height:calc(100svh - 80px)}
 .hwb-landscape .hwb-wrap{height:100%;width:min(1240px,100%);grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);grid-template-rows:1fr;gap:20px}
 .hwb-landscape .hwb-left{display:grid;grid-column:1;grid-row:1;grid-template-rows:44px minmax(114px,1fr) 36px;gap:8px}
 .hwb-landscape .hwb-controls{grid-row:1}.hwb-landscape .hwb-txts{grid-row:2}.hwb-landscape .hwb-cta{grid-row:3;font-size:13px}
 .hwb-landscape .hwb-board{height:100%;grid-column:2;grid-row:1}.hwb-landscape .hwb-tx h3{font-size:19px}
}
.hwb-compact-desktop .hwb-frame{position:sticky;top:80px;height:calc(100svh - 80px);padding:16px 0;display:block}
.hwb-compact-desktop .hwb-num,.hwb-compact-desktop .hwb-eyebrow{display:none}
.hwb-compact-desktop .hwb-h{font-size:32px}.hwb-compact-desktop .hwb-txts{min-height:140px}
.hwb-compact-desktop .hwb-tx h3{font-size:24px}.hwb-compact-desktop .hwb-tx p{font-size:13px}
.hwb-compact-desktop .hwb-board{height:100%;max-height:none;min-height:244px;aspect-ratio:auto}
.hwb-compact-desktop .hwb-layer{top:60px;bottom:16px}.hwb-compact-desktop .hwb-rw{padding:8px 10px;gap:5px 10px}
.hwb-compact-desktop .hwb-rk{gap:8px}.hwb-compact-desktop .hwb-lp svg{width:150px}
@media (max-height:440px){
 .hwb-compact-desktop .hwb-wrap{grid-template-rows:minmax(0,1fr)}
 .hwb-compact-desktop .hwb-h{font-size:26px}.hwb-compact-desktop .hwb-tx .hwb-tag{display:none}
 .hwb-compact-desktop .hwb-txts{min-height:112px}.hwb-compact-desktop .hwb-tx h3{font-size:20px;margin-top:8px}
 .hwb-compact-desktop .hwb-tx p{font-size:12px;line-height:1.4;margin-top:6px}
 .hwb-compact-desktop .hwb-controls,.hwb-compact-desktop .hwb-cta{margin-top:8px}
 .hwb-compact-desktop .hwb-rk{gap:6px}.hwb-compact-desktop .hwb-rw{padding:6px 10px;gap:4px 10px}
 .hwb-compact-desktop .hwb-rw .hwb-no{font-size:28px}.hwb-compact-desktop .hwb-rw b{font-size:14px;line-height:1.25}
 .hwb-compact-desktop .hwb-rw div span{font-size:12px;line-height:1.3}
 .hwb-compact-desktop .hwb-lp{gap:10px}.hwb-compact-desktop .hwb-lp svg{width:130px}
 .hwb-compact-desktop .hwb-tg span{font-size:11px;padding:5px 8px}
}
@media (prefers-reduced-motion:reduce){.hwb-hw *{scroll-behavior:auto}.hwb-cta svg{transition:none}}
.hwb-nojs .hwb-tx[hidden]{display:block!important}

.hwb-nojs .hwb-num{display:none}