/* =========================================================
   Growency
   Dark only. The brand is the cover's gradient: sky blue,
   royal blue, indigo, purple, fading to near-black. It runs
   through type, surfaces, details and the scene. Unbounded
   for headlines, Onest for reading, Red Hat Mono only for
   data, codes and the chapter marker.
   Radius rule: anything you can press is a pill (the nav
   too), every surface is 14px, stamps are 4px.

   Three layers of state:
   - the base rules are the whole page in reading order. That
     is what JS off and reduced motion get;
   - `.fx` (JS on, motion welcome) pins the strategy and hands
     its choreography to script.js, which writes inline
     styles and custom properties from scroll position;
   - `.gl-on` means the WebGL scene is running behind it all.
   ========================================================= */
:root{
  --bg:#06060C;
  --bg-2:#0B0B16;
  --surface:#11111F;
  --ink:#F1F2F9;
  --text-2:#B3B5C9;
  --text-3:#8587A0;
  --line:rgba(255,255,255,.09);
  --line-2:rgba(255,255,255,.17);

  /* the cover gradient, sampled left to right from growency_cover.jpeg.
     --grad is the whole thing, near-black tail included: headline type and
     wide surfaces. --grad-ui stops at purple, for details too small to carry
     the tail (dots, bars, labels). --accent is its first stop, for lines too
     thin to show a gradient at all. */
  --grad:linear-gradient(90deg,#2AA3FC 0%,#3993F8 20%,#4B6DF3 40%,#5250E8 50%,#5028BE 60%,#3A0D86 70%,#27085C 80%,#130333 90%,#0A0326 100%);
  --grad-ui:linear-gradient(90deg,#2AA3FC 0%,#4B6DF3 50%,#5A3FD8 100%);
  --grad-btn:linear-gradient(90deg,#1A7FE0 0%,#4B6DF3 50%,#5028BE 100%);
  --accent:#2AA3FC;
  --violet:#5028BE;
  --hi:#A9D6FF;

  --glass:rgba(13,13,26,.56);
  --glass-line:rgba(255,255,255,.10);
  --glass-hi:rgba(255,255,255,.08);
  --shadow:0 40px 90px -40px rgba(14,12,60,.75);

  --display:"Unbounded","Arial Black",ui-sans-serif,-apple-system,BlinkMacSystemFont,sans-serif;
  --sans:"Onest",ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  --mono:"Red Hat Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;

  --ease:cubic-bezier(.16,1,.3,1);
  --r:14px;
  --gutter:clamp(1.25rem,5vw,4rem);
  --max:1240px;
  --nav-h:60px;
  /* the right-hand edge content keeps clear of, widened where the rail
     shows: --edge-r inside the centred .wrap, --bleed-r for the wider email
     grid. The hero needs neither: the rail stays away until you leave it */
  --edge-r:var(--gutter);
  --bleed-r:var(--gutter);
  color-scheme:dark;
}

/* ---------- reset ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;min-height:100vh;
  /* without the scene (the comparison and privacy pages, or no WebGL) the
     cover's colours sit behind the page as two fixed washes */
  background:
    radial-gradient(1100px 760px at 82% -6%,rgba(80,40,190,.34),transparent 62%),
    radial-gradient(900px 680px at 6% 2%,rgba(42,163,252,.18),transparent 60%),
    radial-gradient(1000px 700px at 50% 110%,rgba(58,13,134,.22),transparent 65%),
    var(--bg);
  background-attachment:fixed;
  color:var(--ink);font:400 17px/1.6 var(--sans);
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
}
.gl-on body{background:var(--bg)}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
h1,h2,h3,p,ul,ol,dl,dd,figure,pre{margin:0}
ul,ol{padding:0;list-style:none}
::selection{background:rgba(75,109,243,.45)}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:6px}
.fx{scroll-behavior:smooth}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.sprite{position:absolute;width:0;height:0;overflow:hidden}

.skip{
  position:fixed;left:16px;top:-64px;z-index:90;
  background:var(--ink);color:var(--bg);padding:.6rem 1.1rem;border-radius:999px;font-weight:600;
  transition:top 200ms var(--ease);
}
.skip:focus{top:16px}

/* ---------- layers ---------- */
.gl{position:fixed;inset:0;width:100%;height:100%;z-index:0;display:block;pointer-events:none;opacity:0;transition:opacity 900ms var(--ease)}
.gl-on .gl{opacity:1}
main,.footer{position:relative;z-index:1}
main{overflow-x:clip}
.grain{
  position:fixed;inset:0;z-index:60;pointer-events:none;opacity:.05;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}
.gl-on .grain{display:none}  /* the scene draws its own grain */

/* ---------- type ---------- */
.h2{
  font-family:var(--display);font-weight:700;font-size:clamp(1.8rem,3.5vw,3.3rem);line-height:1.06;letter-spacing:-.035em;
  color:var(--ink);max-width:17ch;text-wrap:balance;
}
.lede{font-size:clamp(1.05rem,1.35vw,1.2rem);line-height:1.6;color:var(--text-2);max-width:52ch;margin-top:1.1rem}
.grad{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-box-decoration-break:clone;box-decoration-break:clone}
/* gradient text for small labels: fitted to the words so the whole ramp shows */
.kicker,.step__code,.row em,.book .keep,.explode__labels b,.fit--us .fit__k{
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.kicker{font:500 .72rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;background-image:var(--grad-ui);color:var(--accent);width:fit-content;margin-bottom:1.1rem}
/* a 1px gradient edge on the surfaces that sit over the scene */
.sheet,.cmp__cta,.fit--us{position:relative}
.letter::before,.desk::before,.sheet::before,.card::before,.fit--us::before,.cmp__cta::before{
  content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;pointer-events:none;
  background:linear-gradient(120deg,rgba(42,163,252,.7),rgba(82,80,232,.45) 45%,rgba(80,40,190,.25) 70%,rgba(255,255,255,.04));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;
  mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);
}
.wrap{width:100%;max-width:var(--max);margin:0 auto;padding:0 var(--gutter)}

/* ---------- buttons ---------- */
.btn{
  --mx:0px;--my:0px;
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  height:48px;padding:0 1.35rem;border-radius:999px;border:1px solid transparent;
  font:600 .95rem/1 var(--sans);letter-spacing:-.01em;white-space:nowrap;cursor:pointer;
  transform:translate3d(var(--mx),var(--my),0);
  transition:background-color 200ms var(--ease),border-color 200ms var(--ease),color 200ms var(--ease),filter 200ms var(--ease),scale 160ms var(--ease);
}
.btn:active{scale:.97}
.btn--solid{background:var(--grad-btn);color:#fff;box-shadow:0 12px 32px -14px rgba(42,163,252,.7),inset 0 1px 0 rgba(255,255,255,.22)}
.btn--solid:hover{filter:brightness(1.12) saturate(1.05)}
.btn--ghost{position:relative;border-color:var(--line-2);color:var(--ink);background:rgba(255,255,255,.03)}
.btn--ghost::before{
  content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1px;pointer-events:none;
  background:var(--grad-ui);opacity:0;transition:opacity 200ms var(--ease);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;
  mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);
}
.btn--ghost:hover{border-color:transparent}
.btn--ghost:hover::before{opacity:1}
.btn--sm{height:40px;padding:0 1.05rem;font-size:.86rem}
.btn--lg{height:58px;padding:0 1.9rem;font-size:1.02rem}

/* ---------- nav ---------- */
.nav{
  position:fixed;z-index:50;top:14px;left:50%;transform:translateX(-50%);
  width:min(calc(100% - 28px),1180px);height:var(--nav-h);
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding:0 .55rem 0 1.1rem;border-radius:999px;
  background:rgba(10,10,22,.38);border:1px solid var(--glass-line);
  box-shadow:inset 0 1px 0 var(--glass-hi);
  backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%);
  transition:opacity 900ms var(--ease),background-color 300ms var(--ease);
}
.nav.is-stuck{background:rgba(10,10,22,.62)}
.wordmark{display:inline-flex;align-items:center;gap:.6rem;font-family:var(--display);font-weight:700;font-size:1rem;letter-spacing:-.02em;color:var(--ink)}
.wordmark__mark{width:26px;height:26px;color:var(--ink)}
.wordmark--sm .wordmark__mark{width:22px;height:22px}
.nav__links{display:flex;gap:1.9rem;font-size:.9rem;color:var(--text-2)}
.nav__links a{transition:color 180ms var(--ease)}
.nav__links a:hover{color:var(--ink)}

/* ---------- the cursor ---------- */
.cursor{
  position:fixed;top:0;left:0;z-index:85;pointer-events:none;
  opacity:0;transition:opacity 260ms var(--ease);
}
.has-cursor .cursor{opacity:1}
/* at rest it is a plus; hovering opens it into a circle */
.cursor__dot{
  position:absolute;top:0;left:0;
  width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;
  background:transparent;
  display:flex;align-items:center;justify-content:center;
  transition:width 340ms var(--ease),height 340ms var(--ease),margin 340ms var(--ease),
             background-color 240ms linear,opacity 240ms linear,scale 180ms var(--ease);
}
.cursor__dot::before,.cursor__dot::after{
  content:"";position:absolute;left:50%;top:50%;background:var(--accent);
  transition:opacity 200ms linear,background-color 240ms linear;
}
.cursor__dot::before{width:15px;height:1.5px;translate:-50% -50%}
.cursor__dot::after{width:1.5px;height:15px;translate:-50% -50%}
.cursor.is-light .cursor__dot::before,.cursor.is-light .cursor__dot::after{background:#08081A}
/* a link opens a soft circle; an action worth naming fills it */
.cursor.is-warm .cursor__dot{width:32px;height:32px;margin:-16px 0 0 -16px;background:var(--grad-ui);opacity:.5}
.cursor.is-hot .cursor__dot{width:62px;height:62px;margin:-31px 0 0 -31px;background:var(--grad-ui);opacity:1}
.cursor.is-warm .cursor__dot::before,.cursor.is-warm .cursor__dot::after,
.cursor.is-hot .cursor__dot::before,.cursor.is-hot .cursor__dot::after{opacity:0}
.cursor.is-down .cursor__dot{scale:.86}
/* over the near-white buttons it flips, so it is always readable */
.cursor.is-light .cursor__dot{background:#08081A}
.cursor__label{
  font:600 .58rem/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:#08081A;
  opacity:0;white-space:nowrap;transition:opacity 160ms linear;
}
.cursor.is-hot .cursor__label{opacity:1;transition-delay:90ms}
.cursor.is-light .cursor__label{color:#F1F2F9}
@media (pointer:fine){
  .has-cursor,.has-cursor *{cursor:none !important}
}

/* ---------- chapter marker ---------- */
.hud{
  position:fixed;z-index:40;left:clamp(14px,2.2vw,28px);bottom:clamp(14px,2.2vw,26px);
  display:none;align-items:center;gap:.85rem;pointer-events:none;
  font:500 .68rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--text-3);
  opacity:0;transition:opacity 500ms var(--ease);
}
.js .hud{display:flex}
.hud.is-on{opacity:1}
.hud__t{color:var(--ink)}
.hud__bar{position:relative;width:72px;height:1px;background:var(--line-2);overflow:hidden}
.hud__bar i{position:absolute;inset:0;background:var(--grad-ui);transform-origin:0 50%;transform:scaleX(0)}

/* ---------- the section rail ---------- */
@media (min-width:1101px){
  :root{
    --edge-r:max(var(--gutter),calc(190px - max(0px,(100vw - var(--max)) / 2)));
    --bleed-r:max(var(--gutter),calc(190px - max(0px,(100vw - 1760px) / 2)));
  }
}
.rail{
  position:fixed;z-index:46;right:clamp(14px,1.6vw,26px);top:50%;translate:0 -50%;
  transition:opacity 900ms var(--ease);
}
.rail ol{display:grid;gap:.15rem}
.rail a{
  --p:0;position:relative;display:flex;align-items:center;justify-content:flex-end;gap:.7rem;
  padding:.42rem 0;font:500 .66rem/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;
  color:var(--text-3);transition:color 200ms var(--ease);
}
.rail a:hover{color:var(--text-2)}
.rail ol i{position:relative;display:block;width:14px;height:1px;background:var(--line-2);transition:width 320ms var(--ease)}
.rail ol i::after{content:"";position:absolute;inset:0;background:var(--grad-ui);transform-origin:0 50%;transform:scaleX(0)}
.rail a[aria-current]{color:var(--ink)}
.rail a[aria-current] i{width:40px}
.rail a[aria-current] i::after{transform:scaleX(var(--p))}
.rail__pill{display:none}
/* without JS on a narrow screen there is no pill to open the list, so the list waits */
@media (max-width:1100px){ html:not(.js) .rail{display:none} }

/* collapsed: a pill in the bottom right naming the section you are in, with
   how far through it you are; it opens the full list above itself */
.rail.is-compact{top:auto;bottom:max(14px,env(safe-area-inset-bottom));translate:none}
.rail.is-compact .rail__pill{
  --p:0;display:inline-flex;align-items:center;gap:.6rem;height:34px;padding:0 .8rem 0 .95rem;cursor:pointer;
  border-radius:999px;border:1px solid var(--glass-line);background:rgba(10,10,22,.72);color:var(--ink);
  box-shadow:inset 0 1px 0 var(--glass-hi),0 12px 30px -14px rgba(0,0,0,.7);
  backdrop-filter:blur(16px) saturate(140%);-webkit-backdrop-filter:blur(16px) saturate(140%);
  font:500 .64rem/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;
  transition:border-color 200ms var(--ease);
}
.rail.is-compact .rail__pill:hover,.rail.is-open .rail__pill{border-color:rgba(75,109,243,.55)}
.rail__meter{position:relative;display:block;width:26px;height:2px;border-radius:2px;background:var(--line-2);overflow:hidden}
.rail__meter b{position:absolute;inset:0;background:var(--grad-ui);transform-origin:0 50%;transform:scaleX(var(--p))}
.rail__chev{width:6px;height:6px;border-left:1.5px solid var(--text-2);border-top:1.5px solid var(--text-2);transform:translateY(2px) rotate(45deg);transition:transform 260ms var(--ease)}
.rail.is-open .rail__chev{transform:translateY(-1px) rotate(225deg)}
.rail.is-compact ol{
  position:absolute;right:0;bottom:calc(100% + 8px);min-width:13rem;padding:.55rem .95rem;
  border-radius:var(--r);border:1px solid var(--glass-line);background:rgba(10,10,22,.9);
  box-shadow:inset 0 1px 0 var(--glass-hi),var(--shadow);
  backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%);
  opacity:0;visibility:hidden;transform:translateY(6px);
  transition:opacity 200ms var(--ease),transform 260ms var(--ease),visibility 0s linear 260ms;
}
.rail.is-compact.is-open ol{opacity:1;visibility:visible;transform:none;transition:opacity 200ms var(--ease),transform 260ms var(--ease),visibility 0s}
.rail.is-compact a{padding:.6rem 0}

/* ---------- loader ---------- */
.loader{display:none}
.is-loading .loader{
  display:flex;position:fixed;inset:0;z-index:80;cursor:pointer;
  align-items:flex-end;justify-content:space-between;padding:clamp(20px,4vw,48px);
}
.loader__n{font:500 clamp(4.5rem,15vw,12rem)/.8 var(--mono);letter-spacing:-.07em;color:var(--ink);font-variant-numeric:tabular-nums;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;padding-right:.1em}
.loader__skip{font:500 .72rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--text-3)}
.is-loading .nav,.is-loading .hud,.is-loading .rail,.is-loading .hero{opacity:0}

/* =========================================================
   CH 01: the fund
   ========================================================= */
.top{position:relative}
.hero{
  position:relative;z-index:2;min-height:100vh;min-height:100svh;
  display:grid;grid-template-rows:1fr auto;gap:clamp(1rem,3vh,2rem);
  /* the bottom band keeps the headline row clear of the chapter marker and the cue */
  padding:calc(var(--nav-h) + 30px) var(--gutter) clamp(64px,9vh,88px);
  transition:opacity 1s var(--ease) .15s;
}
.word{
  align-self:center;justify-self:center;text-align:center;margin:0;
  font-family:var(--display);font-weight:800;line-height:.84;letter-spacing:-.04em;white-space:nowrap;
  /* GROW over ENCY, centred. script.js fits it to the space above the
     headline row; this is the estimate it starts from, and all you get
     without JS */
  font-size:min(calc((100vw - 2 * var(--gutter)) / 4.05),calc((100svh - var(--nav-h) - 19rem) / 1.68));
  background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;
  user-select:none;
}
.word span:nth-child(4)::after{content:"\A";white-space:pre}
.word__bl{display:inline-block;width:0;height:0;vertical-align:baseline}
/* the scene draws the wordmark as dots once script.js has sampled it */
.fx.dots-on .word{visibility:hidden}
.hero__txt{display:flex;justify-content:space-between;align-items:flex-end;gap:1.5rem 3rem}
.hero__lead{max-width:44rem}
.hero__side{max-width:34rem}
.badge{display:inline-flex;align-items:center;gap:.6rem;margin-bottom:1.1rem;padding:.45rem .7rem;border:1px solid var(--line-2);border-radius:4px;background:var(--glass);font:500 .7rem/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ink)}
.badge i{width:4px;height:4px;border-radius:50%;background:var(--grad-ui)}
.hero__h{font-family:var(--display);font-weight:700;font-size:clamp(1.9rem,3.5vw,3.3rem);line-height:1.04;letter-spacing:-.035em;max-width:15ch}
.hero__sub{font-size:clamp(1.25rem,1.75vw,1.65rem);line-height:1.4;color:var(--text-2);max-width:26ch}
.hero__cta{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.4rem}
.stamp{
  position:absolute;left:50%;top:38%;z-index:3;pointer-events:none;
  display:flex;flex-direction:column;align-items:center;gap:.16em;
  padding:.42em .7em .38em;border-radius:.1em;
  font-family:var(--mono);font-size:clamp(15px,2.8vw,40px);text-transform:uppercase;
  /* a solid dark stamp sitting on top of the dots: a near-black plate, a heavy
     gradient rim and an inner keyline, bright gradient type */
  background:linear-gradient(160deg,#0E0B2A 0%,#07061A 60%,#040312 100%) padding-box,var(--grad-ui) border-box;
  border:.12em solid transparent;
  box-shadow:inset 0 0 0 .05em rgba(169,214,255,.28),0 .3em .9em -.1em rgba(4,3,18,.85),0 0 1.4em -.2em rgba(42,163,252,.45);
  transform:translate(-50%,-50%) rotate(-12deg);
  filter:url(#ink);
}
.stamp b,.stamp span{background:linear-gradient(90deg,#7CC6FF 0%,#8FA6FF 50%,#B79CFF 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.stamp b{font-weight:700;font-size:1em;line-height:1;letter-spacing:-.03em}
.stamp span{font-size:.3em;line-height:1;letter-spacing:.3em;margin-right:-.3em}

.cue{
  position:absolute;left:50%;bottom:14px;z-index:2;translate:-50% 0;
  display:flex;flex-direction:column;align-items:center;gap:.5rem;pointer-events:none;
  font:500 .66rem/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--text-3);
}
.cue i{display:block;width:1px;height:26px;background:linear-gradient(#2AA3FC,#5028BE 60%,transparent)}
.fx .cue i{animation:cue 2.6s var(--ease) infinite}
@keyframes cue{0%{transform:translateY(-8px);opacity:0}35%{opacity:1}100%{transform:translateY(10px);opacity:0}}

/* =========================================================
   CH 02: the emails, all five at once
   ========================================================= */
.mail{position:relative;padding:clamp(90px,14vh,160px) 0 clamp(70px,11vh,130px)}
.mail__wrap{width:100%;max-width:1760px;margin:0 auto;padding:0 var(--bleed-r) 0 var(--gutter)}
.mail__head{max-width:46rem}
.mail__grid{display:flex;flex-wrap:wrap;justify-content:center;gap:1rem;margin-top:clamp(2.2rem,5vh,3.4rem)}
.mail__grid > .letter{flex:0 0 100%}
@media (min-width:640px){ .mail__grid > .letter{flex-basis:calc((100% - 1rem) / 2)} }
@media (min-width:1000px){ .mail__grid > .letter{flex-basis:calc((100% - 2rem) / 3)} }
@media (min-width:1500px){ .mail__grid > .letter{flex-basis:calc((100% - 4rem) / 5)} }

.letter{
  display:flex;flex-direction:column;
  position:relative;overflow:hidden;border-radius:var(--r);
  background:var(--glass);border:1px solid var(--glass-line);
  box-shadow:inset 0 1px 0 var(--glass-hi),var(--shadow);
  backdrop-filter:blur(22px) saturate(150%);-webkit-backdrop-filter:blur(22px) saturate(150%);
  padding:1.35rem 1.4rem 1rem;font-size:.95rem;line-height:1.6;
}
.letter__head{
  display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:.35rem .8rem;
  font-size:.84rem;color:var(--text-3);padding-bottom:.85rem;margin-bottom:1rem;border-bottom:1px solid var(--line);
  overflow-wrap:anywhere;
}
.letter__k{color:var(--text-2);font-weight:600;margin-right:.5rem}
.letter__sig{
  font:500 .62rem/1.4 var(--mono);letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;
  background:var(--grad-ui);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.letter__subj{font-family:var(--display);font-weight:600;font-size:1.02rem;line-height:1.3;color:var(--ink);margin-bottom:1rem;letter-spacing:-.02em;text-wrap:balance}
.letter__body{display:flex;flex-direction:column;gap:.7rem;margin-bottom:1.1rem}
.ln{color:var(--ink)}
.letter__body .ln:first-child,.letter__body .ln:last-child{color:var(--text-2)}
/* the rewrite: script.js splits each line into the generic version and the
   specific one, stacked in one cell */
.fx .ln{display:grid}
.ln .gen,.ln .spec{grid-area:1 / 1}
.ln .gen{color:var(--text-3);transition:opacity 320ms var(--ease)}
.ln .spec{opacity:0;transform:translateY(5px);transition:opacity 420ms var(--ease) 80ms,transform 520ms var(--ease) 80ms}
.ln .gen__t{
  background:linear-gradient(var(--text-3),var(--text-3)) no-repeat 0 60% / 0% 1.5px;
  transition:background-size 420ms var(--ease);
}
.ln.is-cut .gen__t{background-size:100% 1.5px}
.ln.is-cut .gen{opacity:.6}
.ln.is-new .gen{opacity:0}
.ln.is-new .spec{opacity:1;transform:none}
.ln.is-typing .gen__t::after{
  content:"";display:inline-block;width:2px;height:1.05em;
  background:linear-gradient(#2AA3FC,#5028BE);vertical-align:-.18em;margin-left:2px;
  animation:caret 1s steps(1,end) infinite;
}
@keyframes caret{0%,50%{opacity:1}51%,100%{opacity:0}}
.letter__foot{display:flex;justify-content:flex-end;gap:.5rem;margin-top:auto;padding-top:.85rem;border-top:1px solid var(--line);min-height:1px}
.letter__copy,.letter__replay{
  font:600 .84rem var(--sans);color:var(--ink);background:transparent;cursor:pointer;
  border:1px solid var(--line-2);border-radius:999px;padding:.45rem 1rem;
  transition:border-color 180ms var(--ease),color 180ms var(--ease),scale 160ms var(--ease);
}
.letter__replay{color:var(--text-2);border-color:var(--line)}
.letter__copy:hover,.letter__copy.is-done,.letter__replay:hover{border-color:var(--accent);color:var(--accent)}
.letter__copy:active,.letter__replay:active{scale:.97}

/* sections that simply scroll */
.block{position:relative;padding:clamp(96px,16vh,180px) 0}
@media (min-width:1101px){ main .wrap{padding-right:var(--edge-r)} }

/* =========================================================
   The one pinned act (CH 03)
   ========================================================= */
.act{position:relative}
.act__stage{position:relative;padding:clamp(96px,16vh,180px) 0}
.fx .act{height:var(--len,300vh)}
.fx .act__stage{
  position:sticky;top:0;height:100vh;height:100lvh;overflow:hidden;
  padding:calc(var(--nav-h) + 14px) 0 0;display:flex;align-items:center;
}

/* ---------- CH 03: the strategy ---------- */
.strat{--len:210vh}
.strat__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(2rem,5vw,5rem);align-items:center}
.redact{display:flex;flex-wrap:wrap;gap:.5rem 1.4rem;margin-top:1.6rem}
.rd{--b:0;--s:1;position:relative;font-weight:600;font-size:clamp(1.05rem,1.6vw,1.3rem);letter-spacing:-.02em;color:var(--text-2)}
.rd__w{
  background:linear-gradient(var(--text-3),var(--text-3)) no-repeat 0 58% / calc(var(--s) * 100%) 1.5px;
}
.rd__bar{
  position:absolute;inset:.08em -.18em;background:var(--ink);border-radius:2px;
  transform-origin:100% 50%;transform:scaleX(var(--b));
}
.fx .rd{--b:1;--s:0}
.fill{font-weight:500;font-size:clamp(1.25rem,2vw,1.7rem);line-height:1.38;letter-spacing:-.02em;color:var(--ink);max-width:31ch;margin-top:2.4rem}
.fill .part{transition:color 300ms var(--ease)}
.fill .part.is-now{color:var(--hi)}
.fx .fill .w{opacity:var(--o,.16)}

.explode{position:relative;width:100%;max-width:640px;justify-self:center}
.explode__stack{position:relative;width:62%;aspect-ratio:1;margin:0}
.explode__fallback{width:100%;height:100%;color:var(--accent)}
.plate{position:absolute;inset:0}
.plate svg{width:100%;height:100%;overflow:visible}
.plate__disc{fill:rgba(75,109,243,.06);stroke:rgba(42,163,252,.22);stroke-width:1;vector-effect:non-scaling-stroke}
.plate__lines{fill:none;stroke:rgba(110,160,255,.55);stroke-width:1.3;stroke-linecap:round;vector-effect:non-scaling-stroke;transition:stroke 300ms var(--ease)}
.plate__ring{fill:none;stroke:url(#gradUi);stroke-width:2;vector-effect:non-scaling-stroke}
.plate__node{fill:url(#gradUi);transition:fill 300ms var(--ease)}
.plate.is-on .plate__lines{stroke:#8FC8FF}
.plate.is-on .plate__node{fill:#E6EAFF}
.plate__anchor{position:absolute;width:1px;height:1px}
.explode__leads{display:none}
.explode__labels{margin-top:1.5rem;display:grid;gap:.5rem;font-size:.95rem;color:var(--text-2)}
.explode__labels b{font:500 .72rem var(--mono);letter-spacing:.1em;background-image:var(--grad-ui);color:var(--accent);margin-right:.7rem}
.explode__now{display:none}

.fx .explode{aspect-ratio:1.12;perspective:1500px}
.fx .explode__stack{position:absolute;left:0;top:50%;translate:0 -50%;transform-style:preserve-3d;transform:rotateX(56deg) rotateZ(-34deg)}
.fx .plate{transform-style:preserve-3d;transform:translateZ(var(--z,0px));will-change:transform}
.fx .explode__leads{display:block;position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.explode__leads path{fill:none;stroke:var(--line-2);stroke-width:1}
.explode__leads circle{fill:url(#gradUi)}
.fx .explode__labels{position:absolute;inset:0;margin:0;display:block;pointer-events:none}
.fx .explode__labels li{
  position:absolute;left:0;top:0;white-space:nowrap;font-size:.86rem;color:var(--text-2);
  opacity:0;will-change:transform,opacity;
}
.fx .explode__labels li.is-on{color:var(--ink)}

/* ---------- CH 04: the portfolio ---------- */
.port__grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(2rem,5vw,5rem);align-items:center}
.port__art{position:relative;width:100%;max-width:560px}
.port__svg{width:100%;aspect-ratio:1;height:auto;overflow:visible;color:var(--accent)}
.port__lines{fill:none;stroke:rgba(110,160,255,.22);stroke-width:1;vector-effect:non-scaling-stroke}
.port__ring{fill:none;stroke:url(#gradUi);stroke-opacity:.6;stroke-width:1.5;vector-effect:non-scaling-stroke}
.pn__dot{fill:url(#gradUi)}
.pn__x{stroke:var(--text-2);stroke-width:1.2;stroke-linecap:round;vector-effect:non-scaling-stroke}
.port__flows circle{fill:var(--hi)}
.port__angles{margin-top:1.4rem;display:grid;gap:.4rem;font:500 .8rem/1.4 var(--mono);color:var(--text-2)}
.port__angles b{font-weight:500;color:var(--ink);margin-left:.4rem}
.port__angles .is-cut span{text-decoration:line-through;color:var(--text-3)}
.port__angles .is-cut b{color:var(--text-3)}
.port__week{margin-top:.6rem;font:500 .72rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--text-3)}
.port__lead{font-weight:600;font-size:clamp(1.4rem,2.4vw,2.1rem);line-height:1.2;letter-spacing:-.03em}
.port__beat{margin-top:1rem;font-weight:500;font-size:clamp(1.1rem,1.6vw,1.35rem);line-height:1.35;letter-spacing:-.02em;color:var(--ink)}
.port__note{margin-top:1.8rem;font:500 .7rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--text-3)}
.proof{text-align:center;padding-top:clamp(4rem,10vh,7rem)}
.figure{
  font-family:var(--display);font-weight:800;font-size:clamp(4rem,14vw,13.5rem);line-height:.9;letter-spacing:-.05em;font-variant-numeric:tabular-nums;
  width:fit-content;margin:0 auto;padding-right:.06em;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.proof__cap{margin-top:1.1rem;font-size:clamp(1.05rem,1.5vw,1.3rem);color:var(--text-2)}

/* script.js hangs each label beside its dot */
.port__angles.is-placed{position:absolute;inset:0;margin:0;display:block;pointer-events:none}
.port__angles.is-placed li{position:absolute;white-space:nowrap;transform:translate(14px,-50%)}
.port__angles.is-placed li.is-left{transform:translate(calc(-100% - 14px),-50%)}
.port__angles.is-placed + .port__week{position:absolute;left:0;bottom:-2.4rem;margin:0}

/* ---------- CH 05: the trade ---------- */
.trade{position:relative}
.trade__grid{position:relative;display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(2rem,4vw,4rem);align-items:center}
.trade__h{font-size:clamp(1.4rem,2.2vw,2rem);max-width:16ch}
/* the globe sits behind the glass desk, so it glows through without
   crossing the step list */
.trade__orb{position:absolute;right:12%;top:50%;translate:0 -50%;width:min(30vw,400px);aspect-ratio:1;pointer-events:none}
.trade__hint{margin-top:1rem;font:500 .7rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--text-3)}
.trade__hint--tap{display:none}
@media (hover:none){ .trade__hint--hover{display:none} .trade__hint--tap{display:inline} }
.steps{position:relative;margin-top:1.4rem;border-top:1px solid var(--line)}
.step{position:relative;border-bottom:1px solid var(--line)}
.step__btn{
  display:grid;grid-template-columns:6.4rem minmax(0,1fr) auto;align-items:center;gap:1rem;
  width:100%;padding:1.05rem .2rem;background:none;border:0;text-align:left;cursor:pointer;color:var(--ink);
}
.step__code{display:block;width:fit-content;font:500 .72rem/1 var(--mono);letter-spacing:.14em;background-image:var(--grad-ui);color:var(--accent)}
.step__t{font-family:var(--display);font-weight:700;font-size:clamp(1rem,1.45vw,1.22rem);letter-spacing:-.025em;line-height:1.22;transition:color 200ms var(--ease)}
.step__plus{position:relative;width:12px;height:12px}
.step__plus::before,.step__plus::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:1.5px;translate:-50% -50%;background:var(--grad-ui);transition:rotate 320ms var(--ease)}
.step__plus::after{rotate:90deg}
.step.is-open .step__t{color:var(--hi)}
.step.is-open .step__plus::after{rotate:0deg}
.step__more{
  position:absolute;z-index:6;left:calc(100% + 1.2rem);top:50%;width:min(25rem,44vw);
  padding:1.15rem 1.25rem 1.2rem;border-radius:var(--r);
  background:rgba(13,13,28,.9);border:1px solid rgba(75,109,243,.4);box-shadow:inset 0 1px 0 var(--glass-hi),var(--shadow);
  backdrop-filter:blur(22px) saturate(150%);-webkit-backdrop-filter:blur(22px) saturate(150%);
  opacity:0;visibility:hidden;pointer-events:none;
  transform:translate(-10px,-50%);
  transition:opacity 240ms var(--ease),transform 320ms var(--ease),visibility 0s linear 320ms;
}
/* bridges the gap, so moving from the step onto its card keeps it open */
.step__more::before{content:"";position:absolute;right:100%;top:0;bottom:0;width:1.3rem}
.step.is-open .step__more,html:not(.js) .step:hover .step__more{
  opacity:1;visibility:visible;pointer-events:auto;transform:translate(0,-50%);
  transition:opacity 240ms var(--ease),transform 320ms var(--ease),visibility 0s;
}
.step__p{color:var(--text-2);font-size:.93rem;line-height:1.55}
.step__dl{display:grid;gap:.75rem;margin-top:1rem;padding-top:.9rem;border-top:1px solid var(--line)}
.step__dl dt{font:500 .62rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--text-3);margin-bottom:.35rem}
.step__dl dd{margin:0;color:var(--ink);font-size:.9rem;line-height:1.45}

.desk{
  position:relative;border-radius:var(--r);overflow:hidden;font-size:.82rem;
  background:var(--glass);border:1px solid var(--glass-line);box-shadow:inset 0 1px 0 var(--glass-hi),var(--shadow);
  backdrop-filter:blur(22px) saturate(150%);-webkit-backdrop-filter:blur(22px) saturate(150%);
}
.desk__head{
  display:flex;justify-content:space-between;align-items:center;padding:.85rem 1.05rem;border-bottom:1px solid var(--line);
  font:500 .68rem/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--text-3);
}
.desk__name{display:inline-flex;align-items:center;gap:.55rem;color:var(--text-2)}
.desk__name svg{width:16px;height:16px;color:var(--accent)}  /* a stroked symbol: too fine for a gradient */
.desk__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.panel{
  min-height:188px;padding:1rem 1.05rem 1.1rem;border-right:1px solid var(--line);border-bottom:1px solid var(--line);
  transition:opacity 420ms var(--ease),background-color 420ms var(--ease);
}
.panel:nth-child(3n){border-right:0}
.panel:nth-child(n+4){border-bottom:0}
.panel__t{font:500 .66rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--text-3);margin-bottom:.85rem}
.panel__meta{margin-top:.8rem;font:400 .7rem/1.4 var(--mono);color:var(--text-3)}
.rows{display:grid;gap:.55rem}
.row{display:grid;grid-template-columns:1fr auto;column-gap:.5rem;line-height:1.35}
.row b{font-weight:600;color:var(--ink)}
.row span{grid-column:1 / -1;color:var(--text-2)}
.row em{grid-row:1;grid-column:2;font:500 .64rem/1.6 var(--mono);font-style:normal;letter-spacing:.08em;text-transform:uppercase;background-image:var(--grad-ui);color:var(--accent)}
.thesis{display:grid;gap:.6rem}
.thesis dt{font:500 .64rem/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--text-3);margin-bottom:.25rem}
.thesis dd{color:var(--ink);line-height:1.35}
.bars{display:grid;gap:.7rem}
.bars li{display:grid;grid-template-columns:5.6rem 1fr 2.4rem;align-items:center;gap:.5rem;color:var(--text-2)}
.bars i{display:block;height:6px;border-radius:3px;background:var(--grad-ui);width:calc(var(--v) * var(--t,1) * 100%)}
.bars b{font:500 .74rem var(--mono);color:var(--ink);text-align:right}
.stats{display:grid;gap:.7rem}
.stats p{display:flex;align-items:baseline;gap:.6rem}
.stats b{font:500 1.35rem/1 var(--mono);letter-spacing:-.03em;color:var(--ink);min-width:4.4ch}
.stats span{color:var(--text-2)}
.spark{width:100%;height:auto;overflow:visible}
.spark path{fill:none;stroke:url(#gradUi);stroke-width:2;stroke-linecap:round;vector-effect:non-scaling-stroke}
.book{display:grid;gap:.35rem;margin-top:.7rem}
.book li{display:flex;justify-content:space-between;gap:.5rem;color:var(--text-2)}
.book em{font:500 .64rem/1.7 var(--mono);font-style:normal;letter-spacing:.08em;text-transform:uppercase}
.book .keep{background-image:var(--grad-ui);color:var(--accent)}
.book .cut{color:var(--text-3);text-decoration:line-through}

/* =========================================================
   CH 06: the operators
   ========================================================= */
.ops{position:relative;padding:clamp(110px,18vh,200px) 0 clamp(60px,10vh,120px)}
.ops__grid{display:grid;grid-template-columns:2fr 1fr;gap:1rem;margin-top:clamp(2.5rem,6vh,4rem)}
.slot{
  position:relative;overflow:hidden;border-radius:var(--r);aspect-ratio:1200 / 1400;
  background:radial-gradient(90% 70% at 20% 0%,rgba(42,163,252,.1),transparent 60%),rgba(8,8,18,.72);border:1px solid rgba(75,109,243,.25);
}
.slot--wide{aspect-ratio:2400 / 1400}
.ascii{
  position:absolute;inset:0;padding:.9rem;overflow:hidden;white-space:pre;
  font:500 11px/12px var(--mono);letter-spacing:0;
  background:linear-gradient(125deg,#2AA3FC 0%,#4B6DF3 35%,#5250E8 55%,#5028BE 80%,#3A0D86 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
html:not(.js) .slot::after{
  content:"";position:absolute;inset:18%;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 120'><circle cx='60' cy='60' r='53' fill='none' stroke='%234B6DF3' stroke-width='3'/></svg>") center / contain no-repeat;
  opacity:.5;
}

/* ---------- the refusals ---------- */
.wont{position:relative}
.fan{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-top:2.4rem}
.card{
  position:relative;display:flex;flex-direction:column;justify-content:space-between;gap:1.6rem;
  min-height:170px;padding:1.35rem 1.35rem 1.15rem;border-radius:var(--r);
  background:linear-gradient(160deg,#10193A 0%,#130E34 55%,#0B0820 100%);border:1px solid rgba(75,109,243,.3);
  box-shadow:inset 0 1px 0 var(--glass-hi),0 30px 60px -30px rgba(0,0,0,.75);
}
.card__p{font-weight:600;font-size:clamp(1.1rem,1.6vw,1.35rem);line-height:1.28;letter-spacing:-.022em}
.card__t{
  background:linear-gradient(var(--ink),var(--ink)) no-repeat 0 56% / 100% 2px;
  -webkit-box-decoration-break:clone;box-decoration-break:clone;
  transition:background-size 520ms var(--ease);
}
.card__stamp{
  align-self:flex-start;font:500 .7rem/1 var(--mono);letter-spacing:.18em;text-transform:uppercase;
  color:var(--accent);border:1.5px solid;border-image:var(--grad-ui) 1;padding:.45rem .6rem;
  background:var(--grad-ui);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  transform:rotate(-6deg);transform-origin:30% 50%;
}
/* with a mouse they wait to be struck: the pen runs through, then the stamp lands */
.can-strike .card{transition:border-color 300ms var(--ease)}
.wont__hint{display:none;margin-top:1rem;font:500 .7rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--text-3)}
.can-strike .wont__hint{display:block}
.can-strike .card:not(.is-struck) .card__t{background-size:0% 2px}
.can-strike .card__stamp{transition:opacity 180ms linear 380ms,transform 420ms cubic-bezier(.2,1.6,.4,1) 380ms}
.can-strike .card:not(.is-struck) .card__stamp{opacity:0;transform:rotate(-6deg) scale(1.9);transition:none}
.can-strike .card.is-struck{border-color:rgba(42,163,252,.45)}
.card__more{margin-top:-.4rem;font:400 .98rem/1.45 "Archivo Narrow",var(--sans);color:var(--text-2);max-width:34ch}
.card__more b{display:block;margin-bottom:.3rem;font:400 .7rem/1 "Black Ops One",var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--accent)}
/* with a mouse it waits under the statement and rises in while you hover */
.can-strike .card__more{opacity:0;transform:translateY(8px);transition:opacity 260ms var(--ease),transform 380ms var(--ease)}
.can-strike .card:hover .card__more{opacity:1;transform:none;transition-delay:120ms}

/* =========================================================
   CH 07: the terms
   ========================================================= */
.pilot{position:relative;padding:clamp(110px,18vh,200px) 0 clamp(70px,12vh,140px)}
.pilot__grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:clamp(2rem,5vw,5rem);margin-top:clamp(2.5rem,6vh,4rem);align-items:start}
.sheet{
  border-radius:var(--r);padding:1.6rem 1.7rem 1.8rem;
  background:var(--glass);border:1px solid var(--glass-line);box-shadow:inset 0 1px 0 var(--glass-hi),var(--shadow);
  backdrop-filter:blur(22px) saturate(150%);-webkit-backdrop-filter:blur(22px) saturate(150%);
}
.sheet__head{
  display:flex;justify-content:space-between;padding-bottom:1rem;border-bottom:1px solid var(--line);
  font:500 .68rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--text-3);
}
.sheet__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.4rem 2rem;margin:1.5rem 0 2.2rem}
.sheet__wide{grid-column:1 / -1}
.sheet__grid dt{font:500 .66rem/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--text-3);margin-bottom:.5rem}
.sheet__grid dd{font-weight:600;font-size:1.08rem;letter-spacing:-.015em;color:var(--ink)}
.sheet__sign{position:relative}
.sig{width:min(100%,400px);height:auto;overflow:visible}
.sig path{
  --sd:1;fill:none;stroke:var(--ink);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;
  stroke-dasharray:var(--len,2000);stroke-dashoffset:calc(var(--len,2000) * (1 - var(--sd)));
}
.sheet__line{display:block;height:1px;background:var(--line-2);margin:.1rem 0 .6rem}
.sheet__by{font:500 .66rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--text-3)}
.sheet__cta{margin-top:1.5rem;opacity:var(--co,1);translate:0 calc((1 - var(--co,1)) * 12px)}
.fx .sig path{--sd:0}
.fx .sheet__cta{--co:0}

.suit__h{font-family:var(--display);font-weight:700;font-size:clamp(1.2rem,1.7vw,1.5rem);letter-spacing:-.025em;margin-bottom:1.3rem}
.ticks{display:grid;gap:1rem}
.ticks li{--t:1;position:relative;padding-left:1.9rem;color:var(--text-2);line-height:1.5;opacity:calc(.35 + var(--t) * .65)}
.ticks li::before{
  content:"";position:absolute;left:.1rem;top:.42em;width:.85rem;height:.42rem;
  border-left:2px solid #2AA3FC;border-bottom:2px solid #5250E8;
  transform:rotate(-45deg) scale(var(--t));transform-origin:30% 70%;
}
.fx .ticks li{--t:0}

/* ---------- final ---------- */
.final{
  position:relative;padding:clamp(120px,20vh,220px) 0 clamp(90px,14vh,160px);
  background:radial-gradient(55% 70% at 76% 50%,rgba(80,40,190,.32),transparent 70%),radial-gradient(45% 60% at 20% 60%,rgba(42,163,252,.14),transparent 70%);
}
.gl-on .final{background:none}
.final__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:2rem;align-items:center}
.final__h{font-family:var(--display);font-weight:700;font-size:clamp(2.2rem,4.8vw,4.4rem);line-height:1.04;letter-spacing:-.04em;max-width:12ch;margin-bottom:2.2rem}
.final__slot{position:relative;width:min(100%,520px);aspect-ratio:1;justify-self:center;display:grid;place-items:center}
.final__mark{width:74%;height:74%;color:var(--accent);opacity:.85}
.gl-on .final__mark{visibility:hidden}

/* ---------- the privacy policy ---------- */
.legal{position:relative;z-index:1;padding:calc(var(--nav-h) + 96px) 0 clamp(80px,12vh,140px)}
.legal__wrap{display:grid;grid-template-columns:minmax(0,15rem) minmax(0,44rem);gap:clamp(2rem,6vw,6rem);align-items:start}
.legal__head{grid-column:1 / -1;max-width:46rem;margin-bottom:clamp(.5rem,2vh,1.5rem)}
.legal__h{font-family:var(--display);font-weight:700;font-size:clamp(2rem,4.2vw,3.5rem);line-height:1.06;letter-spacing:-.035em}
.legal__meta{margin-top:1.1rem;font:500 .72rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--text-3)}
.legal__toc{position:sticky;top:calc(var(--nav-h) + 44px)}
.legal__toc ol{display:grid;gap:.6rem;font-size:.9rem;color:var(--text-3)}
.legal__toc a{transition:color 180ms var(--ease)}
.legal__toc a:hover{color:var(--ink)}
.legal__body section{scroll-margin-top:calc(var(--nav-h) + 44px)}
.legal__body section + section{margin-top:3rem;padding-top:3rem;border-top:1px solid var(--line)}
.legal__body h2{font-family:var(--display);font-weight:700;font-size:clamp(1.2rem,1.7vw,1.45rem);line-height:1.25;letter-spacing:-.025em;margin-bottom:1rem}
.legal__body h3{font-weight:600;font-size:1.05rem;letter-spacing:-.015em;color:var(--ink);margin:1.7rem 0 .5rem}
.legal__body p,.legal__body li{color:var(--text-2);line-height:1.7}
.legal__body p + p,.legal__body ul + p{margin-top:.9rem}
.legal__body ul{display:grid;gap:.5rem;margin-top:.7rem}
.legal__body ul li{position:relative;padding-left:1.2rem}
.legal__body ul li::before{content:"";position:absolute;left:0;top:.8em;width:7px;height:1.5px;background:var(--grad-ui)}
.legal__body a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--line-2);text-underline-offset:3px;transition:text-decoration-color 180ms var(--ease)}
.legal__body a:hover{text-decoration-color:var(--accent)}
.legal__body strong{color:var(--ink);font-weight:600}
/* a detail only Growency can supply, left visible until it is filled */
.blank{color:var(--accent);background:linear-gradient(90deg,rgba(42,163,252,.14),rgba(80,40,190,.14));border-radius:4px;padding:0 .3em;font-weight:500}

/* ---------- the FAQ ---------- */
.faq{position:relative;padding:clamp(80px,14vh,160px) 0 clamp(40px,8vh,90px)}
.faq__grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(2rem,5vw,5rem);align-items:start}
.faq__intro{position:sticky;top:calc(var(--nav-h) + 44px)}
.faq__list{border-top:1px solid var(--line)}
.qa{border-bottom:1px solid var(--line)}
.qa__q{
  position:relative;display:block;list-style:none;cursor:pointer;
  padding:1.35rem 2.6rem 1.35rem 0;
  font-weight:600;font-size:clamp(1.05rem,1.4vw,1.2rem);line-height:1.35;letter-spacing:-.02em;color:var(--ink);
  transition:color 180ms var(--ease);
}
.qa__q::-webkit-details-marker{display:none}
.qa__q::after{
  content:"";position:absolute;right:.4rem;top:50%;width:.55rem;height:.55rem;
  border-right:1.5px solid #5250E8;border-bottom:1.5px solid #2AA3FC;
  transform:translateY(-70%) rotate(45deg);transition:transform 260ms var(--ease);
}
.qa[open] .qa__q::after{transform:translateY(-25%) rotate(-135deg)}
.qa__q:hover{color:var(--hi)}
.qa__a{padding:0 2.6rem 1.5rem 0;color:var(--text-2);line-height:1.65;max-width:62ch}
.qa__a p+p{margin-top:.8rem}
.qa__a a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--line-2);text-underline-offset:3px}

/* ---------- the comparison pages ---------- */
.cmp{position:relative;z-index:1;padding:calc(var(--nav-h) + 96px) 0 clamp(60px,10vh,120px)}
.cmp__head{max-width:52rem}
.cmp__h{font-family:var(--display);font-weight:700;font-size:clamp(2.1rem,4.6vw,4rem);line-height:1.04;letter-spacing:-.035em}
.cmp__h span{color:var(--text-3)}
.cmp__fit{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin-top:clamp(2.5rem,6vh,4rem)}
.fit{border-radius:var(--r);padding:1.5rem 1.6rem 1.6rem;background:var(--surface);border:1px solid var(--line)}
.fit--us{background:linear-gradient(160deg,rgba(42,163,252,.14),rgba(80,40,190,.1) 55%,rgba(10,3,38,.2)),var(--surface);border-color:rgba(75,109,243,.45)}
.fit__k{font:500 .68rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--text-3);margin-bottom:1.1rem}
.fit--us .fit__k{width:fit-content;background-image:var(--grad-ui);color:var(--accent)}
.fit ul{display:grid;gap:.7rem}
.fit li{position:relative;padding-left:1.2rem;color:var(--text-2);line-height:1.5}
.fit li::before{content:"";position:absolute;left:0;top:.72em;width:7px;height:1.5px;background:var(--text-3)}
.fit--us li::before{background:var(--grad-ui)}
.cmp__sec{margin-top:clamp(3.5rem,9vh,6rem)}
.cmp__sec h2{font-family:var(--display);font-weight:700;font-size:clamp(1.35rem,2vw,1.8rem);line-height:1.15;letter-spacing:-.03em;margin-bottom:1.2rem}
.cmp__table{overflow-x:auto;border-radius:var(--r);border:1px solid var(--line);background:rgba(11,11,22,.6)}
.cmp__table table{width:100%;min-width:640px;border-collapse:collapse;font-size:.92rem}
.cmp__table th,.cmp__table td{padding:1rem 1.2rem;text-align:left;vertical-align:top;border-bottom:1px solid var(--line)}
.cmp__table tbody tr:last-child th,.cmp__table tbody tr:last-child td{border-bottom:0}
.cmp__table thead th{font:500 .68rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--text-3)}
.cmp__table thead th.is-us{color:var(--accent)}
.cmp__table tbody th{width:20%;font-weight:600;color:var(--ink)}
.cmp__table td{width:40%;color:var(--text-2);line-height:1.5}
.cmp__table td.is-us{color:var(--ink);background:linear-gradient(90deg,rgba(42,163,252,.08),rgba(80,40,190,.06))}
.cmp__cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(2rem,5vw,4rem)}
.cmp__cols h3{font-weight:600;font-size:1.1rem;letter-spacing:-.02em;margin-bottom:.6rem}
.cmp__cols p,.cmp__prose p{color:var(--text-2);line-height:1.7;max-width:62ch}
.cmp__cols p + p,.cmp__prose p + p{margin-top:.9rem}
.cmp__note{margin-top:1rem;font-size:.8rem;line-height:1.6;color:var(--text-3);max-width:80ch}
.cmp__note a{text-decoration:underline;text-decoration-color:var(--line-2);text-underline-offset:3px}
.cmp__cta{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1.5rem;
  padding:clamp(1.8rem,4vw,2.6rem);border-radius:var(--r);border:1px solid var(--glass-line);
  background:radial-gradient(80% 140% at 100% 0%,rgba(80,40,190,.38),transparent 60%),radial-gradient(60% 120% at 0% 100%,rgba(42,163,252,.18),transparent 60%),var(--surface);
}
.cmp__cta h2{margin-bottom:.4rem}
.cmp__cta p{color:var(--text-2)}
.cmp__more ul{display:flex;flex-wrap:wrap;gap:.6rem}
.cmp__more a{
  display:inline-flex;align-items:center;height:40px;padding:0 1rem;border-radius:999px;border:1px solid var(--line-2);
  font-size:.88rem;color:var(--text-2);transition:border-color 180ms var(--ease),color 180ms var(--ease);
}
.cmp__more a:hover{border-color:var(--accent);color:var(--ink)}

/* ---------- footer ---------- */
.footer{border-top:1px solid var(--line);padding:2.8rem 0 5rem}
.footer__inner{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:2rem clamp(2rem,5vw,4.5rem);align-items:start}
.footer__k{font:500 .66rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--text-3);margin-bottom:.9rem}
.footer__compare ul{display:grid;grid-template-columns:repeat(2,auto);gap:.6rem 2rem;font-size:.85rem;color:var(--text-2)}
.footer__side{display:grid;justify-items:start;gap:.9rem}
.footer__side .footer__k{margin:0}
.footer__links{display:flex;gap:1.4rem;font-size:.85rem;color:var(--text-2)}
.footer__compare a,.footer__links a{transition:color 180ms var(--ease)}
.footer__compare a:hover,.footer__compare a[aria-current="page"],
.footer__links a:hover,.footer__links a[aria-current="page"]{color:var(--ink)}
/* greyed out, and it stays quiet on hover */
.footer__in{display:inline-flex;color:var(--text-3);opacity:.7;transition:opacity 180ms var(--ease)}
.footer__in svg{width:18px;height:18px;fill:currentColor}
.footer__in:hover{opacity:1}
.footer__fine{grid-column:1 / -1;padding-top:1.6rem;border-top:1px solid var(--line);font-size:.8rem;color:var(--text-3);max-width:none}

@media (max-width:900px){
  .faq__grid,.cmp__fit,.cmp__cols{grid-template-columns:minmax(0,1fr)}
  .faq__intro{position:static}
  .footer__inner{grid-template-columns:minmax(0,1fr)}
  .cmp__cta .btn{flex:1 1 auto}
}

/* =========================================================
   Section voices. Every section speaks in its own type, so
   each one feels like a different document from the same
   firm. The brand stays constant around them: the nav,
   buttons, kickers, the rail and the GROWENCY wordmark keep
   Unbounded, Onest and Red Hat Mono.
   ========================================================= */

/* The fund: a private bank's prospectus. Quiet money. */
.hero__h{font-family:"Instrument Serif",Georgia,serif;font-weight:400;font-size:clamp(2.5rem,4.9vw,4.7rem);line-height:.96;letter-spacing:-.02em;max-width:14ch}
.hero__h .grad{font-style:italic;padding-right:.08em}
.hero__sub{font-family:"Instrument Sans",var(--sans);letter-spacing:-.005em}
/* the promise itself, in the brand's wide display face and the gradient */
.hero__booked{
  display:inline-block;font-family:var(--display);font-weight:800;font-size:1.32em;line-height:1;
  letter-spacing:-.02em;text-transform:uppercase;white-space:nowrap;vertical-align:-.06em;
  background:var(--grad-ui);-webkit-background-clip:text;background-clip:text;color:transparent;
  padding-right:.04em;
}

/* The emails: correspondence. The canned template types in a flat mono, the
   rewrite lands in a warm humanist sans, the subjects read like a newspaper. */
#emails .h2{font-family:"Newsreader",Georgia,serif;font-weight:500;font-size:clamp(2.2rem,4.4vw,4rem);line-height:1;letter-spacing:-.025em;max-width:18ch}
#emails .lede{font-family:"Newsreader",Georgia,serif;font-style:italic;font-size:clamp(1.15rem,1.5vw,1.35rem)}
.letter{font-family:"IBM Plex Sans",var(--sans);font-size:.94rem}
.letter__subj{font-family:"Newsreader",Georgia,serif;font-weight:600;font-size:1.22rem;line-height:1.2;letter-spacing:-.012em}
.ln .gen{font-family:"IBM Plex Mono",var(--mono);font-size:.86em;letter-spacing:-.01em}
.letter__subj .gen{font-size:.8em}
/* the greeting and sign-off never change, so they stay in the letter's own voice */
.ln[data-hold] .gen{font-family:inherit;font-size:inherit;color:var(--text-2)}

/* The strategy: a declassified memo, redactions and all. */
#alpha .h2{font-family:"Special Elite","Courier New",monospace;font-weight:400;font-size:clamp(1.9rem,3.6vw,3.2rem);line-height:1.08;letter-spacing:-.01em;max-width:16ch}
.rd{font-family:"Special Elite","Courier New",monospace;font-weight:400;letter-spacing:0}
.fill{font-family:"Courier Prime","Courier New",monospace;font-weight:400;font-size:clamp(1.05rem,1.55vw,1.42rem);letter-spacing:-.02em;line-height:1.42;max-width:36ch}
.explode__labels,.explode__now{font-family:"Courier Prime","Courier New",monospace}
.fx .explode__labels li{font-size:.92rem}

/* The portfolio: the trading floor, a ticker board and tight condensed type. */
.port__lead{font-family:"Archivo Narrow",var(--sans);font-weight:700;font-size:clamp(1.5rem,2.5vw,2.3rem);line-height:1.05;letter-spacing:-.01em;text-transform:uppercase}
.port__beat{font-family:"Archivo Narrow",var(--sans);font-weight:500;font-size:clamp(1.2rem,1.8vw,1.55rem);letter-spacing:0}
.port__angles{font-family:"Archivo Narrow",var(--sans);font-weight:600;font-size:.95rem;letter-spacing:.01em}
.port__week,.port__note{font-family:"Archivo Narrow",var(--sans);font-weight:600;font-size:.82rem}
.figure{font-family:"Big Shoulders Display",var(--display);font-weight:800;font-size:clamp(5.5rem,17vw,15rem);line-height:.84;letter-spacing:-.01em}
.proof__cap{font-family:"Archivo Narrow",var(--sans);font-weight:600;text-transform:uppercase;letter-spacing:.06em}

/* The trade: a quant desk. Engineered grotesque, a proper terminal mono. */
.trade__h{font-family:"Space Grotesk",var(--sans);font-weight:700;font-size:clamp(1.9rem,3.2vw,2.9rem);line-height:1.02;letter-spacing:-.04em}
.step__t{font-family:"Space Grotesk",var(--sans);font-weight:500;font-size:clamp(1.1rem,1.6vw,1.38rem);letter-spacing:-.03em}
.step__code,.step__dl dt{font-family:"Space Mono",var(--mono);font-weight:400}
.step__p,.step__dl dd{font-family:"Space Grotesk",var(--sans)}
.desk{font-family:"Space Grotesk",var(--sans)}
.desk__head,.panel__t,.panel__meta,.thesis dt,.bars b,.stats b,.row em,.book em{font-family:"Space Mono",var(--mono)}

/* The operators: people and craft. A soft, slightly wonky serif. */
#operators .h2{font-family:"Fraunces",Georgia,serif;font-weight:600;font-variation-settings:"SOFT" 100,"WONK" 1;font-size:clamp(2.1rem,4.2vw,3.8rem);line-height:1.02;letter-spacing:-.03em}
#operators .lede{font-family:"Fraunces",Georgia,serif;font-style:italic;font-weight:400;font-size:clamp(1.15rem,1.5vw,1.35rem)}

/* Won't take: a protest poster, with a stencilled stamp. */
#wont .h2{font-family:"Anton",Impact,sans-serif;font-weight:400;font-size:clamp(2.8rem,6.6vw,6rem);line-height:.92;letter-spacing:.005em;text-transform:uppercase;max-width:none}
.card__p{font-family:"Anton",Impact,sans-serif;font-weight:400;font-size:clamp(1.3rem,2vw,1.75rem);line-height:1.08;letter-spacing:.01em;text-transform:uppercase}
.card__t{background-position:0 54%;background-size:100% 3px}
.can-strike .card:not(.is-struck) .card__t{background-size:0% 3px}
.card__stamp{font-family:"Black Ops One",var(--mono);font-weight:400;font-size:.92rem;letter-spacing:.12em}

/* The terms: a signed contract. Old book faces. */
#pilot .h2{font-family:"Cormorant Garamond",Georgia,serif;font-weight:600;font-size:clamp(2.4rem,4.8vw,4.3rem);line-height:.98;letter-spacing:-.015em}
#pilot .lede{font-family:"EB Garamond",Georgia,serif;font-size:clamp(1.15rem,1.5vw,1.35rem)}
.sheet__head{font-family:"EB Garamond",Georgia,serif;font-size:.92rem;letter-spacing:.2em}
.sheet__grid dt{font-family:"EB Garamond",Georgia,serif;font-weight:500;font-size:.8rem;letter-spacing:.18em}
.sheet__grid dd{font-family:"Cormorant Garamond",Georgia,serif;font-weight:600;font-size:1.45rem;letter-spacing:0;line-height:1.15}
.sheet__by{font-family:"EB Garamond",Georgia,serif;font-style:italic;text-transform:none;letter-spacing:0;font-size:1rem}
.suit__h{font-family:"Cormorant Garamond",Georgia,serif;font-style:italic;font-weight:600;font-size:clamp(1.6rem,2.2vw,2rem);letter-spacing:-.01em}
.ticks li{font-family:"EB Garamond",Georgia,serif;font-size:1.14rem;line-height:1.45}

/* Questions: a first call. Friendly, a little quirky, easy to read. */
#faq .h2,.qa__q{font-family:"Bricolage Grotesque",var(--sans);font-weight:700;letter-spacing:-.035em}
#faq .h2{font-size:clamp(2.1rem,4vw,3.6rem);line-height:1}
.qa__q{font-size:clamp(1.12rem,1.5vw,1.32rem)}
#faq .lede,.qa__a{font-family:"Bricolage Grotesque",var(--sans);font-weight:500;font-variation-settings:"opsz" 14}

/* Start: the closing bell. Loud and wide. */
.final__h{font-family:"Syne",var(--display);font-weight:800;font-size:clamp(2.3rem,4.4vw,4.3rem);line-height:.98;letter-spacing:-.045em;max-width:14ch}

/* ---------- scrubbed reveals and letter shift ---------- */
.fx .rv{opacity:var(--r,0);transform:translate3d(0,calc((1 - var(--r,0)) * 28px),0)}
.fx .rv--blur{filter:blur(calc((1 - var(--r,0)) * 9px))}
.sh{position:relative}
.sh-w{display:inline-block;white-space:nowrap}
.sh-l{
  display:inline-block;transform:translate3d(var(--lx,0px),var(--ly,0px),0);
  color:color-mix(in oklab,currentColor,var(--hi) calc(var(--lg,0) * 100%));
  transition:transform 280ms var(--ease),color 280ms var(--ease);
}

/* =========================================================
   Smaller screens
   ========================================================= */
@media (max-width:900px){
  .nav__links{display:none}
  .strat__grid,.port__grid,.trade__grid,.pilot__grid,.final__grid{grid-template-columns:minmax(0,1fr)}
  .ops__grid{grid-template-columns:1fr}
  .footer__inner{flex-direction:column;align-items:flex-start}
  .footer__fine{text-align:left}
  .legal__wrap{grid-template-columns:minmax(0,1fr)}
  .legal__toc{position:static}
  .hud__bar{width:44px}
  .hero__txt{flex-direction:column;align-items:flex-start}
  .word{font-size:min(calc((100vw - 2 * var(--gutter)) / 4.05),calc((100svh - var(--nav-h) - 25rem) / 1.68))}
  .fan{grid-template-columns:repeat(2,minmax(0,1fr))}
  .step__more{position:static;width:auto;max-height:0;overflow:hidden;padding:0 .2rem;margin:0;border:0;background:none;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;transform:none;transition:max-height 380ms var(--ease),opacity 240ms var(--ease),padding 380ms var(--ease)}
  .step.is-open .step__more{max-height:24rem;padding:0 .2rem 1.1rem;transform:none}
  .step__more::before{display:none}

  /* the pinned layout, stacked to fit one screen */
  .fx .strat__grid{gap:1.2rem}
  .fx .strat__copy{display:grid}
  .fx .strat__a,.fx .fill{grid-area:1 / 1}
  .fx .strat__a{opacity:var(--xa,1)}
  .fx .fill{margin:0;opacity:var(--xb,1);font-size:1.25rem}
  .fx .explode{aspect-ratio:1.5;max-width:none;perspective:1100px}
  .fx .explode__stack{left:50%;width:auto;height:92%;translate:-50% -50%}
  .fx .explode__labels,.fx .explode__leads{display:none}
  .fx .explode__now{display:block;position:absolute;left:0;right:0;bottom:-.4rem;text-align:center;font:500 .72rem/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--accent)}

  .port__art{width:min(100%,46vh);justify-self:center}
  .port__lead{font-size:1.2rem}
  .port__beat{font-size:1rem;margin-top:.6rem}
  .port__angles.is-placed li{font-size:.66rem}
}
@media (max-width:560px){
  .hero__cta .btn{height:46px}
  .desk__grid{grid-template-columns:1fr}
  .panel{border-right:0}
  .sheet__grid{grid-template-columns:1fr}
}

/* =========================================================
   Touch screens: no glass blur over the scene. The canvas
   repaints every frame, so the blur behind it would be
   recomputed every frame too; a denser fill reads the same.
   ========================================================= */
@media (hover:none) and (pointer:coarse){
  .nav,.letter,.desk,.sheet{backdrop-filter:none;-webkit-backdrop-filter:none}
  .nav{background:rgba(10,10,22,.8)}
  .nav.is-stuck{background:rgba(10,10,22,.9)}
  .letter,.desk,.sheet{background:rgba(13,13,26,.9)}
}

/* =========================================================
   Phones. The same page for a skim: shorter pins, labels
   that stay on screen, and every pinned layout fitted to
   the small viewport so nothing sits under the toolbars.
   ========================================================= */
@media (max-width:600px){
  .hero__cta .btn{flex:1 1 auto}
  /* the rail's pill names the section here, so the chapter marker steps aside */
  .js .hud{display:none}
  .fan{grid-template-columns:1fr}

  /* the wordmark stacks two letters to a row, as big as the height left over
     after the headline, sub-line and buttons allows (script.js fits it) */
  .hero{padding-top:calc(var(--nav-h) + 24px);padding-bottom:56px;gap:.8rem}
  /* the badge gives its line to the wordmark */
  .badge{display:none}
  .word{font-size:min(calc((100vw - 2 * var(--gutter)) / 2.3),calc((100svh - 25rem) / 3.36));line-height:.84}
  .word span:nth-child(2n):not(:nth-last-child(2))::after{content:"\A";white-space:pre}
  .hero__cta{flex-wrap:nowrap;gap:.6rem}
  .hero__cta .btn{flex:1 1 0;min-width:0;padding:0 .8rem}

  .strat{--len:180vh}
  .cue{display:none}

  /* the stage is the large viewport; the content is kept to the small one */
  .fx .act__stage{padding-bottom:calc(100lvh - 100svh)}

  .fx .strat__grid{gap:2.6rem}
  .fx .fill{font-size:1.15rem}
  .fx .explode{aspect-ratio:1.7}

  .port__art{width:min(56vw,38svh)}
  .port__angles.is-placed li{white-space:normal;width:max-content;max-width:6.6rem;font-size:.62rem;line-height:1.25}
  .port__angles.is-placed li.is-left{text-align:right}
  /* the right-hand dots crowd each other, so one label hangs below its dot
     and the bottom dot's label moves to the empty side */
  .port__angles.is-placed li[data-node="3"]{transform:translate(-25%,8px);text-align:center}
  .port__angles.is-placed li[data-node="2"]{transform:translate(calc(-100% - 14px),-50%);text-align:right}
  .port__angles.is-placed li[data-node="1"]{transform:translate(-50%,calc(-100% - 8px));text-align:center}
  .port__angles.is-placed b{display:block;margin:0}

  .step__btn{grid-template-columns:5.6rem minmax(0,1fr) auto;gap:.7rem}
}

/* Portrait screens that are not phones (tablets held upright) have height to
   spare, so the wordmark stacks two letters to a row there too */
@media (min-width:601px) and (max-aspect-ratio:4/5){
  .word{line-height:.84;font-size:min(calc((100vw - 2 * var(--gutter)) / 2.3),calc((100svh - 30rem) / 3.36))}
  .word span:nth-child(2n):not(:nth-last-child(2))::after{content:"\A";white-space:pre}
}

@media (prefers-reduced-transparency:reduce){
  .nav,.letter,.desk,.sheet{background:var(--surface);backdrop-filter:none;-webkit-backdrop-filter:none}
}