/* Engage Games case-study design system: Evidence Ledger. */
html{max-width:100vw;overflow-x:hidden;scrollbar-width:none}
body[data-design-system="ledger"]{--proto-surface:#16223a;--proto-surface-2:#111d31;--proto-deep:#0b1321;--proto-copy:rgba(240,240,240,.72);--duration-quick:150ms;--duration-fast:250ms;--ease-smooth-out:cubic-bezier(.22,1,.36,1);--ledger-paper:#f5f2ec;--ledger-ink:#0d1626;--ledger-muted:#4f596c;--ledger-accent-ink:#007a68;--surface-bleed-depth:clamp(140px,14vw,200px);background:var(--ledger-ink);overflow-x:clip}
html::-webkit-scrollbar{display:none;width:0;height:0}

/* Keep first-scroll compositing stable: Ledger uses clean surface changes, not
   the legacy fixed grain, header blur or animated diagonal masks. */
body[data-design-system="ledger"]::after{display:none}
body[data-design-system="ledger"] .nav,
body[data-design-system="ledger"] .nav.scrolled{border-bottom:0;backdrop-filter:none;-webkit-backdrop-filter:none;transition:padding var(--duration-fast) var(--ease-smooth-out),background-color var(--duration-fast) var(--ease-smooth-out)}
body[data-design-system="ledger"] .diag-light,
body[data-design-system="ledger"] .diag-dark,
body[data-design-system="ledger"] .diag-dark-alt{margin-top:0;clip-path:none;transition:none}

/* The system uses spacing and surface changes instead of decorative rules. */
body[data-design-system="ledger"] .section-label::before,
body[data-design-system="ledger"] .v3-hero-eyebrow::before,
body[data-design-system="ledger"] .cs-heading::after,
body[data-design-system="ledger"] .cs-subhead::before,
body[data-design-system="ledger"] .cs-callout::before,
body[data-design-system="ledger"] .v2-statement-divider,
body[data-design-system="ledger"] .v2-quote-footer .cs-quote-divider,
body[data-design-system="ledger"] .cs-next-card::after{display:none!important}
body[data-design-system="ledger"] .section-label,
body[data-design-system="ledger"] .cs-subhead{gap:0}
body[data-design-system="ledger"] .cs-next-inner{border-top:0}

/* One restrained Engage watermark per major section. */
body[data-design-system="ledger"] .v3-hero,
body[data-design-system="ledger"] .v2-challenge,
body[data-design-system="ledger"] .v2-format,
body[data-design-system="ledger"] .v2-conversion,
body[data-design-system="ledger"] .ls4-cheltenham,
body[data-design-system="ledger"] .v2-results,
body[data-design-system="ledger"] .v2-statement,
body[data-design-system="ledger"] .v2-close,
body[data-design-system="ledger"] .cs-next,
body[data-design-system="ledger"] .footer{isolation:isolate}
body[data-design-system="ledger"] .v3-hero::before,
body[data-design-system="ledger"] .v2-conversion::before,
body[data-design-system="ledger"] .ls4-cheltenham::before,
body[data-design-system="ledger"] .cs-next::before,
body[data-design-system="ledger"] .footer::before{content:'';position:absolute;z-index:0;width:clamp(260px,38vw,620px);aspect-ratio:123/150;pointer-events:none;mask:var(--eg-mark) center/contain no-repeat;-webkit-mask:var(--eg-mark) center/contain no-repeat;background:var(--accent);opacity:.026}
body[data-design-system="ledger"] .v3-hero::before{right:-12%;bottom:-55%;width:min(760px,58vw);opacity:.035;transform:rotate(-4deg)}
body[data-design-system="ledger"] .v2-conversion::before{left:-10%;bottom:-52%;background:#0d1626;opacity:.025;transform:rotate(6deg)}
body[data-design-system="ledger"] .ls4-cheltenham{position:relative;overflow:hidden}
body[data-design-system="ledger"] .ls4-cheltenham::before{right:-8%;top:-70%;background:var(--ledger-ink);opacity:.022;transform:rotate(-5deg)}
body[data-design-system="ledger"] .cs-next::before{right:-7%;bottom:-48%;transform:rotate(5deg)}
body[data-design-system="ledger"] .footer::before{right:3%;top:-160px;width:260px;opacity:.02;transform:rotate(5deg)}
body[data-design-system="ledger"] .v2-conv-grid,
body[data-design-system="ledger"] .ls4-cheltenham-inner,
body[data-design-system="ledger"] .cs-next-inner,
body[data-design-system="ledger"] .footer>*{position:relative;z-index:1}
body[data-design-system="ledger"] .cs-quote-mark{opacity:.22}

/* Hero: full-colour product UI beside a co-branded lead result. */
body[data-design-system="ledger"] .v3-hero{min-height:86svh;padding-top:150px;background:#0d1626}
body[data-design-system="ledger"] .v3-hero-phone{right:5vw;width:min(320px,24vw,42vh);transform:translateY(-42%) rotate(1deg);z-index:3;opacity:1}
body[data-design-system="ledger"] .v3-hero-phone .device-3d img{filter:brightness(1.1) saturate(1.14) contrast(1.03) drop-shadow(0 42px 90px rgba(0,0,0,.44))}
body[data-design-system="ledger"] .v3-hero-gradient{background:linear-gradient(90deg,#0d1626 0%,#0d1626 51%,rgba(13,22,38,.7) 72%,transparent)}
body[data-design-system="ledger"] .v3-hero-inner{display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,.34fr);column-gap:80px}
body[data-design-system="ledger"] .v3-hero-eyebrow,
body[data-design-system="ledger"] .v3-hero-wordmark,
body[data-design-system="ledger"] .v3-hero-summary{grid-column:1}
body[data-design-system="ledger"] .v4-hero-stat{grid-column:1;margin-top:44px;padding:36px;background:#16223a;border-top:0;max-width:720px;clip-path:polygon(0 14px,100% 0,100% 100%,0 100%)}

/* Editorial chapter and product walkthrough. */
body[data-design-system="ledger"] .v2-challenge{padding:clamp(104px,9vw,128px) 56px;clip-path:none!important;margin-top:0!important;background:var(--ledger-paper)}
body[data-design-system="ledger"] .v2-centered{display:grid;grid-template-columns:minmax(300px,.8fr) minmax(440px,1.2fr);gap:clamp(70px,10vw,160px);max-width:1220px;text-align:left;align-items:start}
body[data-design-system="ledger"] .v2-centered .section-label{margin-bottom:24px;color:var(--ledger-accent-ink)}
body[data-design-system="ledger"] .v2-challenge .section-label,
body[data-design-system="ledger"] .v2-conversion .section-label,
body[data-design-system="ledger"] .ls4-cheltenham .cs-subhead{font-size:12px;line-height:1.2;letter-spacing:.18em;font-weight:650}
body[data-design-system="ledger"] .v2-challenge .cs-body p{max-width:62ch;font-size:clamp(19px,1.5vw,21px);line-height:1.65}
body[data-design-system="ledger"] .v2-format{margin-top:0!important;clip-path:none!important;background:#0d1626;padding-top:120px}
body[data-design-system="ledger"] .v2-format-intro{display:grid;grid-template-columns:.8fr 1.2fr;column-gap:90px;max-width:1200px}
body[data-design-system="ledger"] .v2-format-intro>div:first-child{grid-row:1/4}
body[data-design-system="ledger"] .v2-format-intro .cs-subhead{margin-top:0}
body[data-design-system="ledger"] .v2-pin-grid{grid-template-columns:minmax(260px,.62fr) minmax(0,1.38fr);max-width:1200px;gap:80px}
body[data-design-system="ledger"] .v2-pin-sticky{top:100px}
body[data-design-system="ledger"] .v2-pin-device{width:clamp(240px,22vw,310px)}
body[data-design-system="ledger"] .v2-beats{padding-left:0;padding-bottom:0;border-top:1px solid rgba(255,255,255,.12)}
body[data-design-system="ledger"] .v2-beats::before{display:none}
body[data-design-system="ledger"] .v2-beat{display:grid;grid-template-columns:56px minmax(180px,.7fr) minmax(260px,1.3fr);gap:24px;align-items:start;padding:36px 0;border-bottom:1px solid rgba(255,255,255,.12)}
body[data-design-system="ledger"] .v2-beat-dot{position:relative;left:auto;top:auto;width:28px;height:28px;display:grid;place-items:center;justify-content:center;border:1px solid transparent;border-radius:50%;background:transparent;box-shadow:0 0 0 0 rgba(0,242,193,0);color:rgba(240,240,240,.44);font-size:13px;line-height:1;transform:scale(.92);transition:color var(--duration-quick) ease-out,border-color var(--duration-fast) var(--ease-smooth-out),background-color var(--duration-fast) var(--ease-smooth-out),box-shadow var(--duration-fast) var(--ease-smooth-out),transform var(--duration-fast) var(--ease-smooth-out)}
body[data-design-system="ledger"] .v2-beat-final .v2-beat-dot{border-color:transparent;background:transparent;box-shadow:none;color:rgba(240,240,240,.44)}
body[data-design-system="ledger"] .v2-beat.is-active .v2-beat-dot,
body[data-design-system="ledger"] .v2-pin-grid:has(.v4-swap-item:nth-child(2).is-active) .v2-beat[data-beat="1"] .v2-beat-dot,
body[data-design-system="ledger"] .v2-pin-grid:has(.v4-swap-item:nth-child(3).is-active) .v2-beat[data-beat="2"] .v2-beat-dot,
body[data-design-system="ledger"] .v2-pin-grid:has(.v4-swap-item:nth-child(4).is-active) .v2-beat[data-beat="3"] .v2-beat-dot,
body[data-design-system="ledger"] .v2-pin-grid:has(.v4-swap-item:nth-child(5).is-active) .v2-beat[data-beat="4"] .v2-beat-dot{border-color:rgba(0,242,193,.55);background:rgba(0,242,193,.07);box-shadow:0 0 0 4px rgba(0,242,193,.07);color:var(--accent);transform:scale(1)}
body[data-design-system="ledger"] .v2-beat-final .v2-beat-title{color:var(--white)}
body[data-design-system="ledger"] .v2-beat-title{margin:0;font-size:26px}
body[data-design-system="ledger"] .v2-beat-body,
body[data-design-system="ledger"] .v2-beat-callout{margin:0;padding:0;font-size:17px;line-height:1.7;color:var(--proto-copy)}
body[data-design-system="ledger"] .v2-beat-callout::before{display:none}
body[data-design-system="ledger"] .v2-loop{max-width:760px;margin-left:auto}

/* High-contrast light ledger pages. */
body[data-design-system="ledger"] .v2-conversion{background:var(--ledger-paper);padding:clamp(100px,8vw,112px) 56px;color:var(--ledger-ink);border:0;box-shadow:none}
body[data-design-system="ledger"] .v2-conv-grid{grid-template-columns:1.15fr .55fr;gap:clamp(56px,8vw,96px);max-width:1180px}
body[data-design-system="ledger"] .v2-conversion .section-label{color:var(--ledger-accent-ink)}
body[data-design-system="ledger"] .v2-conv-heading{max-width:760px;color:var(--ledger-ink);font-size:clamp(34px,3.35vw,48px);line-height:1.14;letter-spacing:-.025em;margin-bottom:24px}
body[data-design-system="ledger"] .v2-conv-body{max-width:62ch;color:var(--ledger-ink);font-size:clamp(18px,1.45vw,19px);line-height:1.65}
body[data-design-system="ledger"] .ls4-cheltenham{background:var(--ledger-paper);color:var(--ledger-ink);border:0;box-shadow:none;margin-top:-1px;padding:clamp(96px,8vw,116px) 56px}
body[data-design-system="ledger"] .ls4-cheltenham-inner{display:grid;grid-template-columns:minmax(240px,.65fr) minmax(0,1.35fr);grid-template-rows:auto 1fr;column-gap:clamp(64px,9vw,130px);row-gap:20px;max-width:1180px;text-align:left;align-items:start}
body[data-design-system="ledger"] .ls4-cheltenham .cs-subhead{grid-column:1;grid-row:1;justify-content:flex-start;width:auto;margin:0;color:var(--ledger-accent-ink)}
body[data-design-system="ledger"] .ls4-cheltenham .cs-callout{grid-column:1;grid-row:2;max-width:320px;margin:0;color:var(--ledger-ink);font-size:clamp(22px,2vw,26px);font-weight:500;line-height:1.42;letter-spacing:-.02em;text-align:left}
body[data-design-system="ledger"] .ls4-cheltenham-inner>p.rv-d1{grid-column:2;grid-row:1/3;max-width:62ch;margin:0;color:var(--ledger-ink);font-size:clamp(18px,1.45vw,19px);line-height:1.65;letter-spacing:0;text-align:left}
body[data-design-system="ledger"] .v2-quote-role{color:var(--ledger-muted);font-size:14px;line-height:1.45}

/* Co-brand results mosaic. */
body[data-design-system="ledger"] .v2-results{background:#0d1626;border-top:0}
body[data-design-system="ledger"] .v2-ribbon{grid-template-rows:auto}
body[data-design-system="ledger"] .v2-ribbon-five{grid-template-columns:repeat(4,minmax(0,1fr))}
body[data-design-system="ledger"] .v2-ribbon-three{grid-template-columns:repeat(2,minmax(0,1fr))}
body[data-design-system="ledger"] .v2-ribbon-stat:first-child{grid-column:1/-1;grid-row:auto;min-height:360px;padding-top:130px}
body[data-design-system="ledger"] .v2-ribbon-stat:not(:first-child){min-height:220px}
body[data-design-system="ledger"] .v2-statement{clip-path:none!important;margin-top:0!important;text-align:left}
body[data-design-system="ledger"] .v2-statement-inner{text-align:left;max-width:1060px}
body[data-design-system="ledger"] .cs-quote-mark{text-align:left}
body[data-design-system="ledger"] .v2-quote-attr,
body[data-design-system="ledger"] .v2-quote-footer{align-items:flex-start}
body[data-design-system="ledger"] .v2-close{clip-path:none!important;margin-top:0!important}
/* Match the next section's navy, then carry the same faint glow across it. */
body[data-design-system="ledger"] .v2-close::after{
  content:'';position:absolute;z-index:0;inset:auto 0 0;
  height:var(--surface-bleed-depth);pointer-events:none;
  background:
    radial-gradient(ellipse 46% var(--surface-bleed-depth) at 18% 100%,rgba(0,242,193,.03) 0%,rgba(0,242,193,.024) 30%,rgba(0,242,193,.01) 60%,rgba(0,242,193,0) 100%),
    linear-gradient(180deg,rgba(13,22,38,0) 0%,rgba(13,22,38,.104) 20%,rgba(13,22,38,.352) 40%,rgba(13,22,38,.648) 60%,rgba(13,22,38,.896) 80%,var(--ledger-ink) 100%)
}
body[data-design-system="ledger"] .cs-next{
  position:relative;color:var(--white);overflow:hidden;
  background:
    radial-gradient(ellipse 46% var(--surface-bleed-depth) at 18% 0%,rgba(0,242,193,.03) 0%,rgba(0,242,193,.024) 30%,rgba(0,242,193,.01) 60%,rgba(0,242,193,0) 100%),
    var(--ledger-ink)
}
body[data-design-system="ledger"] .cs-next-label,
body[data-design-system="ledger"] .cs-next-operator{color:var(--steel)}
body[data-design-system="ledger"] .cs-next-arrow{color:var(--steel-light)}
body[data-design-system="ledger"] .cs-next-card{background:#16223a;border:0;color:var(--white);transform:none}
body[data-design-system="ledger"] .footer{background:#0d1626;border-top:0}

@media(hover:hover) and (pointer:fine){
  body[data-design-system="ledger"] .cs-next-card:hover{background:#1a2944;border-color:transparent;transform:none}
}

/* Keep the product UI connected to the content as desktop canvases widen. */
@media(min-width:1441px){
  body[data-design-system="ledger"] .v3-hero-phone{
    right:max(5vw,calc((100vw - 1560px)/2));
    width:min(clamp(320px,calc(7.15vw + 217px),400px),55vh)
  }
}

@media(max-width:900px){
  body[data-design-system="ledger"] .v2-centered{grid-template-columns:1fr;gap:42px}
  body[data-design-system="ledger"] .v2-pin-grid{grid-template-columns:1fr;gap:52px}
  body[data-design-system="ledger"] .v2-pin-sticky{top:auto}
  body[data-design-system="ledger"] .v4-swap{scrollbar-width:none;-ms-overflow-style:none}
  body[data-design-system="ledger"] .v2-format-intro{display:block}
  body[data-design-system="ledger"] .v2-format-intro>div:first-child{display:block}
  body[data-design-system="ledger"] .v2-beats{padding-left:0;border-top:0}
  body[data-design-system="ledger"] .v2-beat{grid-template-columns:42px 1fr;gap:16px;border-bottom:0}
  body[data-design-system="ledger"] .v2-beat-body,
  body[data-design-system="ledger"] .v2-beat-callout{grid-column:2}
  body[data-design-system="ledger"] .v2-conv-grid{grid-template-columns:1fr}
  body[data-design-system="ledger"] .ls4-cheltenham{padding:88px 32px}
  body[data-design-system="ledger"] .ls4-cheltenham-inner{display:block;max-width:656px}
  body[data-design-system="ledger"] .ls4-cheltenham .cs-subhead{margin-bottom:24px}
  body[data-design-system="ledger"] .ls4-cheltenham .cs-callout{max-width:none;margin-bottom:24px;font-size:22px}
  body[data-design-system="ledger"] .ls4-cheltenham-inner>p.rv-d1{max-width:62ch;font-size:18px;line-height:1.62}
  body[data-design-system="ledger"] .v2-ribbon-five,
  body[data-design-system="ledger"] .v2-ribbon-three{grid-template-columns:1fr 1fr}
}

@media(max-width:640px){
  body[data-design-system="ledger"] .v3-hero{min-height:auto;padding-top:118px}
  body[data-design-system="ledger"] .v3-hero::before{width:112vw;right:-38%;bottom:-18%;opacity:.055}
  body[data-design-system="ledger"] .v3-hero-phone{right:-30px;width:min(250px,58vw);opacity:.28;transform:translateY(-44%) rotate(2deg);z-index:1}
  body[data-design-system="ledger"] .v3-hero-gradient{background:linear-gradient(90deg,var(--proto-deep,#0d1626) 0%,rgba(11,19,33,.94) 52%,rgba(11,19,33,.5) 100%)}
  body[data-design-system="ledger"] .v3-hero-inner{display:block}
  body[data-design-system="ledger"] .v4-hero-stat{padding:26px 22px}
  body[data-design-system="ledger"] .v4-hero-stat .cs-metric-num[data-target$="000"]{font-size:clamp(50px,14.4vw,58px)}
  body[data-design-system="ledger"] .v4-hero-stat .cs-metric-num,
  body[data-design-system="ledger"] .v2-results .cs-metric-num[data-target$="000"]{min-width:0!important;text-align:left!important}
  body[data-design-system="ledger"] .v4-hero-stat .cs-metric-sym{font-size:clamp(28px,8vw,34px)}
  body[data-design-system="ledger"] .v2-challenge{padding-top:96px;padding-bottom:96px}
  body[data-design-system="ledger"] .v2-conversion{padding:84px 20px}
  body[data-design-system="ledger"] .v2-conv-heading{font-size:32px;line-height:1.16}
  body[data-design-system="ledger"] .v2-conv-body{font-size:18px;line-height:1.62}
  body[data-design-system="ledger"] .ls4-cheltenham{padding:76px 20px}
  body[data-design-system="ledger"] .v2-beat{grid-template-columns:34px 1fr;padding:28px 0}
  body[data-design-system="ledger"] .v2-beat-title{font-size:22px}
  body[data-design-system="ledger"] .v2-results .cs-metric-sym[data-unit="plus"],
  body[data-design-system="ledger"] .v2-results .cs-metric-sym[data-unit="multiplier"]{font-size:clamp(28px,8vw,34px)}
  body[data-design-system="ledger"] .v2-results .cs-metric-sym[data-unit="word"]{font-size:clamp(18px,5vw,22px)}
  body[data-design-system="ledger"] .v2-ribbon-five,
  body[data-design-system="ledger"] .v2-ribbon-three{display:block}
}

@media(prefers-reduced-motion:reduce){
  body[data-design-system="ledger"] .v2-beat-dot{transform:none;transition:color var(--duration-quick) ease-out,border-color var(--duration-quick) ease-out,background-color var(--duration-quick) ease-out,box-shadow var(--duration-quick) ease-out}
}
