@font-face{font-family:'DLWS Newsreader';src:url('./fonts/newsreader-latin-400-normal.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'DLWS Newsreader';src:url('./fonts/newsreader-latin-400-italic.woff2') format('woff2');font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:'DLWS Manrope';src:url('./fonts/manrope-latin-400-normal.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'DLWS Manrope';src:url('./fonts/manrope-latin-500-normal.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'DLWS Mono';src:url('./fonts/ibm-plex-mono-latin-500-normal.woff2') format('woff2');font-weight:500;font-display:swap}

/* Colours, glow and motion are the page's own tokens (ElitePass1 tokens.css). */
#dl-why-stack{
  --ws-ink:#0A2540;--ws-slate:#47616F;--ws-teal:#007E9E;--ws-lit:#0096B6;
  --ws-hair:rgba(10,37,64,.16);
  --ws-line-a:#22C9E0;--ws-line-b:#6FE7DC;--ws-glow:rgba(34,201,224,.6);
  --ws-rest:.72;--ws-recede:.5;
  --ws-heading:clamp(32px,3.4vw,44px);--ws-size:clamp(38px,5.3vw,76px);--ws-size-mobile:clamp(31px,8.6vw,40px);
  --ws-lead:clamp(19px,1.6vw,22px);--ws-body:17px;--ws-body-mobile:15px;--ws-close:19px;
  --ws-space:clamp(88px,9vw,136px);--ws-space-mobile:72px;
  --ws-run:linear-gradient(100deg,#0092B2 0%,#009DBC 50%,#00A1BE 100%);
  --ws-lit-filter:drop-shadow(0 0 5px rgba(34,201,224,.62)) drop-shadow(0 0 18px rgba(34,201,224,.42));
  --ws-ease:cubic-bezier(.22,.61,.36,1);--ws-ease-out:cubic-bezier(.16,.84,.44,1);--ws-dur:480ms;
  --ws-serif:'DLWS Newsreader',Georgia,serif;--ws-sans:'DLWS Manrope',system-ui,-apple-system,sans-serif;--ws-mono:'DLWS Mono',ui-monospace,monospace;
  position:relative;isolation:isolate;display:block;width:100%;max-width:none;margin:0;border:0;
  padding:var(--ws-space,120px) 0;background:transparent!important;color:var(--ws-ink);
  font:400 var(--ws-body,17px)/1.7 var(--ws-sans);text-align:left;overflow:hidden;overflow:clip;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
#dl-why-stack,#dl-why-stack *,#dl-why-stack *::before,#dl-why-stack *::after{box-sizing:border-box}
/* Page-builder isolation: inherited paragraph, heading, button and link rules stop here. */
#dl-why-stack :is(p,h2,h3,div,span,em,i,a){margin:0!important;border:0!important;background:none;box-shadow:none;max-width:none;text-transform:none;text-indent:0;float:none}
#dl-why-stack :is(p,h2,h3){padding:0!important}
#dl-why-stack :is(h2,h3){font-family:var(--ws-serif)!important;font-weight:400!important;text-transform:none!important}
#dl-why-stack button.ws-trigger{appearance:none;-webkit-appearance:none;display:block;width:100%;height:auto;min-height:0;min-width:0;margin:0!important;padding:.2em 0 .12em!important;border:0!important;border-radius:0!important;background:none!important;box-shadow:none!important;text-align:left;text-transform:none!important;text-shadow:none;letter-spacing:inherit!important;font:inherit!important;line-height:inherit!important;color:inherit!important;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}

#dl-why-stack .ws-shell{position:relative;z-index:1;width:100%;max-width:1280px;margin-inline:auto!important;padding-inline:clamp(20px,4vw,56px)}

/* ---- header ---- */
#dl-why-stack .ws-header{margin-bottom:clamp(36px,4.6vw,64px)!important}
#dl-why-stack .ws-eyebrow{font:500 12px/1.2 var(--ws-mono);letter-spacing:.18em;text-transform:uppercase;color:var(--ws-teal);margin-bottom:20px!important}
#dl-why-stack h2{font-size:var(--ws-heading,44px);line-height:1.12;letter-spacing:-.018em;color:var(--ws-ink);max-width:22em;text-wrap:balance}
#dl-why-stack h2 em{display:block;font-style:italic}
#dl-why-stack :is(h2 em,.ws-close em,.ws-stat-num){background:var(--ws-run);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;filter:var(--ws-lit-filter)}

/* ---- the stack ----
   Each closed title is taller than its row, so the line under it cuts off the
   bottom of the letters. Opening a row lets its title rise to full height. */
#dl-why-stack .ws-stack{position:relative}
#dl-why-stack .ws-row{position:relative}
#dl-why-stack .ws-row[data-open='true']{z-index:1}
#dl-why-stack .ws-title{--ws-clip:.27em;font-size:var(--ws-size,72px);line-height:1;letter-spacing:-.03em;color:var(--ws-ink);text-wrap:balance;margin-bottom:calc(-1 * var(--ws-clip))!important;clip-path:inset(-90px -90px var(--ws-clip) -90px);transition:margin-bottom var(--ws-dur) var(--ws-ease),clip-path var(--ws-dur) var(--ws-ease)}
#dl-why-stack .ws-row[data-open='true'] .ws-title,#dl-why-stack .ws-title:has(.ws-trigger:focus-visible){margin-bottom:0!important;clip-path:inset(-90px -90px -90px -90px)}
#dl-why-stack .ws-title:has(.ws-trigger:focus-visible){margin-bottom:calc(-1 * var(--ws-clip))!important}
#dl-why-stack .ws-row[data-open='true'] .ws-title:has(.ws-trigger:focus-visible){margin-bottom:0!important}
#dl-why-stack .ws-text{display:block;opacity:var(--ws-rest);transition:opacity .45s var(--ws-ease),transform .55s var(--ws-ease-out)}
#dl-why-stack[data-any] .ws-row .ws-text{opacity:var(--ws-recede)}
#dl-why-stack .ws-row[data-open='true'] .ws-text{opacity:1}
#dl-why-stack .ws-text em{font-style:italic;white-space:nowrap;padding-right:.05em;color:var(--ws-teal);text-shadow:0 0 0 rgba(34,201,224,0);transition:color .5s var(--ws-ease),text-shadow .7s var(--ws-ease)}
#dl-why-stack .ws-row[data-open='true'] .ws-text em{color:var(--ws-lit);text-shadow:0 0 6px rgba(34,201,224,.55),0 0 22px rgba(34,201,224,.42)}
#dl-why-stack :is(button.ws-trigger):focus-visible{outline:4px solid rgba(34,201,224,.55)!important;outline-offset:3px;border-radius:12px!important}
@media(hover:hover){
  #dl-why-stack .ws-row:not([data-open='true']) .ws-trigger:hover .ws-text{opacity:.96;transform:translateY(-.05em)}
  #dl-why-stack .ws-row:not([data-open='true']):hover + .ws-rule::before{opacity:.5}
}

/* ---- the lines: the only place the energy shows ---- */
#dl-why-stack .ws-rule{position:relative;display:block;height:1px;background:var(--ws-hair)}
#dl-why-stack .ws-rule::before{content:'';position:absolute;left:0;right:0;top:-1px;height:3px;border-radius:3px;background:linear-gradient(90deg,transparent,var(--ws-line-a) 9%,var(--ws-line-b) 50%,var(--ws-line-a) 91%,transparent);filter:drop-shadow(0 0 6px var(--ws-glow));opacity:0;transition:opacity .6s var(--ws-ease)}
#dl-why-stack .ws-rule.is-lit::before{opacity:1}
#dl-why-stack .ws-rule::after{content:'';position:absolute;left:0;top:-3px;width:16%;height:7px;background:radial-gradient(closest-side,rgba(255,255,255,.95),rgba(111,231,220,.55) 45%,rgba(111,231,220,0));opacity:0;transform:translateX(-110%);pointer-events:none}
#dl-why-stack .ws-rule.is-lit::after{animation:ws-run 1.15s var(--ws-ease-out) .05s both}
@keyframes ws-run{0%{opacity:0;transform:translateX(-110%)}15%{opacity:1}85%{opacity:1}100%{opacity:0;transform:translateX(640%)}}

/* ---- the open row ---- */
#dl-why-stack .ws-panel{display:grid;grid-template-rows:0fr;visibility:hidden;transition:grid-template-rows var(--ws-dur) var(--ws-ease),visibility 0s linear var(--ws-dur)}
#dl-why-stack .ws-row[data-open='true'] .ws-panel{grid-template-rows:1fr;visibility:visible;transition-delay:0s,0s}
#dl-why-stack .ws-panel-in{min-height:0;overflow:hidden;padding-inline:28px;margin-inline:-28px!important}
#dl-why-stack .ws-body{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,1fr);column-gap:clamp(32px,6vw,96px);align-items:start;padding:clamp(8px,1vw,14px) 0 clamp(36px,4.2vw,56px);opacity:0;transform:translateY(10px);transition:opacity .4s var(--ws-ease-out),transform .5s var(--ws-ease-out)}
#dl-why-stack .ws-row[data-open='true'] .ws-body{opacity:1;transform:none;transition-delay:.14s}
#dl-why-stack .ws-lead{font:400 var(--ws-lead,22px)/1.48 var(--ws-sans);color:var(--ws-ink);max-width:26em;text-wrap:pretty}
#dl-why-stack .ws-more{margin-top:16px!important;font-size:var(--ws-body,17px);line-height:1.72;color:var(--ws-slate);max-width:32em;text-wrap:pretty}
#dl-why-stack .ws-stat{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;column-gap:clamp(16px,1.8vw,26px);max-width:31em}
#dl-why-stack .ws-stat-num{display:block;font:italic 400 clamp(64px,6.4vw,96px)/.92 var(--ws-serif);letter-spacing:-.045em;padding-right:.06em}
#dl-why-stack .ws-stat-text{display:block;font-size:15px;line-height:1.6;color:var(--ws-slate)}
#dl-why-stack .ws-stat-text a{display:block;width:fit-content;margin-top:9px!important;font:500 11px/1.4 var(--ws-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ws-teal)!important;text-decoration:none;border-bottom:1px solid rgba(0,126,158,.35)!important;padding-bottom:2px;transition:border-color 200ms}
#dl-why-stack .ws-stat-text a:hover{border-bottom-color:var(--ws-teal)!important}
#dl-why-stack .ws-more + p.ws-steps{display:flex;flex-wrap:wrap;align-items:center;row-gap:6px;max-width:none;margin-top:26px!important;font:500 11px/1.4 var(--ws-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ws-teal)}
#dl-why-stack .ws-steps span+span::before{content:'';display:inline-block;width:16px;height:1px;margin:0 10px;vertical-align:middle;background:currentColor;opacity:.45}
#dl-why-stack :is(a):focus-visible{outline:4px solid rgba(34,201,224,.55)!important;outline-offset:3px;border-radius:6px!important}

/* ---- close ---- */
#dl-why-stack .ws-close{margin-top:clamp(40px,5vw,72px)!important;max-width:38em;font:400 var(--ws-close,19px)/1.65 var(--ws-sans);color:var(--ws-slate);text-wrap:pretty}
#dl-why-stack .ws-close em{font-family:var(--ws-serif);font-style:italic;font-size:1.2em;padding-right:.05em}

@media(max-width:1000px){
  #dl-why-stack .ws-body{display:block}
  #dl-why-stack .ws-stat{margin-top:28px!important}
}

/* ---- phone: same stack, headlines only until tapped ---- */
@media(max-width:759px){
  #dl-why-stack{padding:var(--ws-space-mobile,72px) 0}
  #dl-why-stack .ws-shell{padding-inline:20px}
  #dl-why-stack .ws-header{margin-bottom:30px!important}
  #dl-why-stack .ws-eyebrow{font-size:11px;margin-bottom:16px!important}
  #dl-why-stack h2{font-size:clamp(28px,7.6vw,34px);line-height:1.14}
  #dl-why-stack h2 em{margin-top:6px!important}
  #dl-why-stack .ws-title{font-size:var(--ws-size-mobile,38px);line-height:1.02;letter-spacing:-.028em;--ws-clip:.28em}
  #dl-why-stack button.ws-trigger{padding:.2em 0 .12em!important}
  #dl-why-stack .ws-panel-in{padding-inline:20px;margin-inline:-20px!important}
  #dl-why-stack .ws-body{display:block;padding:8px 0 30px}
  #dl-why-stack .ws-lead{font-size:var(--ws-body-mobile,15px);line-height:1.6;max-width:34em}
  #dl-why-stack .ws-more{margin-top:12px!important;font-size:var(--ws-body-mobile,15px);line-height:1.7}
  #dl-why-stack .ws-stat{grid-template-columns:auto minmax(0,1fr);column-gap:16px;margin-top:24px!important}
  #dl-why-stack .ws-stat-num{font-size:64px}
  #dl-why-stack .ws-stat-text{font-size:13.5px}
  #dl-why-stack .ws-more + p.ws-steps{margin-top:20px!important;font-size:10px}
  #dl-why-stack .ws-steps span+span::before{width:10px;margin:0 7px}
  #dl-why-stack .ws-close{margin-top:36px!important;font-size:var(--ws-body-mobile,15px)}
}

/* Optional: add class="ws-caps" to the section tag for all-caps titles, cut into the letters like the original reference. */
#dl-why-stack.ws-caps .ws-title{font-size:var(--ws-size-caps,clamp(26px,3.5vw,48px));letter-spacing:.005em;--ws-clip:.52em}
#dl-why-stack.ws-caps .ws-text,#dl-why-stack.ws-caps .ws-text em{text-transform:uppercase!important}
@media(max-width:759px){#dl-why-stack.ws-caps .ws-title{font-size:var(--ws-size-caps-mobile,clamp(24px,6.6vw,32px));--ws-clip:.52em}}

@media(prefers-reduced-motion:reduce){
  html:not(.dl-motion) #dl-why-stack *,html:not(.dl-motion) #dl-why-stack *::before,html:not(.dl-motion) #dl-why-stack *::after{transition-duration:0s!important;transition-delay:0s!important;animation:none!important}
}