/* ACA design system, shared by the funnel pages and the CRM (loaded before each one's own stylesheet).
   A very light grey page with white cards in front of it, near-black type, black pill buttons, and frosted gradient
   cards: colour lives in those cards (and in charts and highlighted words), never in buttons.
   Gradients: deep mixes of colour with a light diagonal streak (an SVG of blurred shapes, stretched to the card), a
   fine film grain on top, and a light rim like frosted glass; each keeps a deep side on the left, where the white text
   sits. Seven of them: violet, ocean, rose, coral, grape, sun, lime.
   Neutral controls follow where they sit (--ctl): white on the grey page, light grey inside a white card.
   Type: Inter for words, its display cut at large sizes (optical sizing), set light: 400 for text, questions and big
   numbers, 500 for buttons, names and headings, 560 for a word in bold; tracking tightens as the size grows (-.011em
   at 16px, -.03em on headlines). Geist Mono (--mono) for numbers and data: stat tiles, amounts in tables, times,
   counters, uppercase labels, chart axes, keys. */
:root{
  --bg:#f5f5f7;          /* the page */
  --card:#ffffff;        /* in front of it: cards, tiles, sheets, bars */
  --fill:#f3f3f6;        /* inside a white card: fields, chips, small boxes */
  --fill-2:#e9e9ee;      /* hovered, pressed, tracks */
  --ctl:#ffffff; --ctl-2:#eeeef2; /* neutral controls and fields on the page; a white card sets them to --fill, --fill-2 */
  --line:#e6e6eb; --line-2:#d5d5dc;
  --ink:#0b0b0f; --ink-2:#51515a; --ink-3:#8a8a94; --on-ink:#ffffff;
  --ok:#15803d; --danger:#d92d20; --warn:#b54708;
  --r-xl:28px; --r-lg:22px; --r-md:16px; --r-sm:12px;
  --lift:0 1px 2px rgba(11,11,15,.04),0 0 0 1px rgba(11,11,15,.03);  /* a white card or tile on the grey page */
  --shadow-1:0 1px 2px rgba(11,11,15,.05),0 0 0 1px rgba(11,11,15,.03);
  --shadow-2:0 24px 60px -24px rgba(11,11,15,.26),0 2px 8px rgba(11,11,15,.04);
  /* the frosted edge of a gradient card: a hairline of light, then a soft glow inside the border */
  --rim:inset 0 0 0 1px rgba(255,255,255,.22),inset 0 1px 1px rgba(255,255,255,.38),inset 0 0 22px 2px rgba(255,255,255,.3);
  --rim-sm:inset 0 0 0 1px rgba(255,255,255,.26),inset 0 0 10px rgba(255,255,255,.3);
  --frost:rgba(255,255,255,.2); --frost-2:rgba(255,255,255,.3); /* round buttons and labels on a gradient card */
  --font:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --head:var(--font); /* titles: the same family, its display cut */
  --mono:"Geist Mono",ui-monospace,SFMono-Regular,Menlo,monospace; /* labels and data */
  --ease:cubic-bezier(.2,.8,.2,1); --spring:cubic-bezier(.16,1,.3,1);

  /* grain: a 160 px tile of grey noise laid over each gradient (background-blend-mode: overlay — its 50 % grey changes nothing,
     the lighter and darker specks show), like film */
  --grain:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n' filterUnits='userSpaceOnUse' x='0' y='0' width='160' height='160' color-interpolation-filters='sRGB'><feTurbulence type='fractalNoise' baseFrequency='1.5' numOctaves='1' seed='7' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/><feComponentTransfer><feFuncR type='linear' slope='2.6' intercept='-.8'/><feFuncG type='linear' slope='2.6' intercept='-.8'/><feFuncB type='linear' slope='2.6' intercept='-.8'/><feFuncA type='linear' slope='0' intercept='.4'/></feComponentTransfer></filter><rect width='160' height='160' filter='url(%23n)'/></svg>");
  /* each gradient: the grain, then a base colour under blurred ellipses (cx, cy, rx, ry on a 100 × 64 canvas): a deep left side
     for the text, a light diagonal streak, a mix of colour in a corner */
  --g-violet:var(--grain),url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 64' preserveAspectRatio='none'><filter id='b' filterUnits='userSpaceOnUse' x='-50' y='-50' width='200' height='164' color-interpolation-filters='sRGB'><feGaussianBlur stdDeviation='6'/></filter><rect width='100' height='64' fill='%236466d6'/><g filter='url(%23b)'><ellipse cx='0' cy='30' rx='34' ry='40' fill='%232b2c94'/><ellipse cx='30' cy='0' rx='36' ry='18' fill='%234b3fc0'/><ellipse cx='92' cy='0' rx='30' ry='18' fill='%23d59de8'/><ellipse cx='92' cy='64' rx='40' ry='22' fill='%238fcaf9'/><ellipse cx='10' cy='66' rx='26' ry='12' fill='%231e2266'/><ellipse cx='56' cy='54' rx='30' ry='5' transform='rotate(-32 56 54)' fill='%239d8ff0' fill-opacity='0.65'/><ellipse cx='68' cy='34' rx='40' ry='5' transform='rotate(-32 68 34)' fill='%23f2eeff' fill-opacity='0.9'/></g></svg>") center/100% 100% no-repeat,#6466d6;
  --g-ocean:var(--grain),url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 64' preserveAspectRatio='none'><filter id='b' filterUnits='userSpaceOnUse' x='-50' y='-50' width='200' height='164' color-interpolation-filters='sRGB'><feGaussianBlur stdDeviation='6'/></filter><rect width='100' height='64' fill='%234f74d8'/><g filter='url(%23b)'><ellipse cx='2' cy='44' rx='30' ry='34' fill='%231d3392'/><ellipse cx='34' cy='6' rx='40' ry='16' fill='%233557cf'/><ellipse cx='12' cy='4' rx='20' ry='12' fill='%232b2f8f'/><ellipse cx='94' cy='60' rx='38' ry='22' fill='%2387c3f7'/><ellipse cx='70' cy='64' rx='22' ry='10' fill='%235ab6e6' fill-opacity='0.8'/><ellipse cx='56' cy='52' rx='30' ry='5' transform='rotate(-30 56 52)' fill='%236f9ff0' fill-opacity='0.6'/><ellipse cx='70' cy='30' rx='40' ry='5' transform='rotate(-30 70 30)' fill='%23e9f5ff' fill-opacity='0.9'/></g></svg>") center/100% 100% no-repeat,#4f74d8;
  --g-rose:var(--grain),url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 64' preserveAspectRatio='none'><filter id='b' filterUnits='userSpaceOnUse' x='-50' y='-50' width='200' height='164' color-interpolation-filters='sRGB'><feGaussianBlur stdDeviation='6'/></filter><rect width='100' height='64' fill='%23ec3f91'/><g filter='url(%23b)'><ellipse cx='0' cy='40' rx='30' ry='36' fill='%239c0f5c'/><ellipse cx='60' cy='0' rx='46' ry='20' fill='%23ff2a96'/><ellipse cx='96' cy='10' rx='22' ry='16' fill='%23d61d9a'/><ellipse cx='24' cy='64' rx='40' ry='16' fill='%23f0603a'/><ellipse cx='0' cy='70' rx='14' ry='10' fill='%235d5a24' fill-opacity='0.8'/><ellipse cx='84' cy='58' rx='20' ry='10' fill='%23ffb59c' fill-opacity='0.7'/><ellipse cx='56' cy='54' rx='30' ry='5' transform='rotate(-30 56 54)' fill='%23ff7aa8' fill-opacity='0.6'/><ellipse cx='70' cy='38' rx='40' ry='5' transform='rotate(-30 70 38)' fill='%23ffd3e5' fill-opacity='0.9'/></g></svg>") center/100% 100% no-repeat,#ec3f91;
  --g-coral:var(--grain),url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 64' preserveAspectRatio='none'><filter id='b' filterUnits='userSpaceOnUse' x='-50' y='-50' width='200' height='164' color-interpolation-filters='sRGB'><feGaussianBlur stdDeviation='6'/></filter><rect width='100' height='64' fill='%23e4473c'/><g filter='url(%23b)'><ellipse cx='2' cy='56' rx='36' ry='30' fill='%238f0f0c'/><ellipse cx='30' cy='30' rx='30' ry='26' fill='%23d8261f'/><ellipse cx='40' cy='0' rx='34' ry='14' fill='%23ef5a2a'/><ellipse cx='90' cy='10' rx='26' ry='16' fill='%23f6a17f'/><ellipse cx='100' cy='0' rx='12' ry='8' fill='%23a9c4dc' fill-opacity='0.8'/><ellipse cx='86' cy='62' rx='24' ry='12' fill='%23ff8a6a' fill-opacity='0.8'/><ellipse cx='56' cy='56' rx='30' ry='5' transform='rotate(-30 56 56)' fill='%23ff6a4a' fill-opacity='0.6'/><ellipse cx='72' cy='40' rx='40' ry='5' transform='rotate(-30 72 40)' fill='%23ffe0d2' fill-opacity='0.9'/></g></svg>") center/100% 100% no-repeat,#e4473c;
  --g-grape:var(--grain),url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 64' preserveAspectRatio='none'><filter id='b' filterUnits='userSpaceOnUse' x='-50' y='-50' width='200' height='164' color-interpolation-filters='sRGB'><feGaussianBlur stdDeviation='6'/></filter><rect width='100' height='64' fill='%2355349a'/><g filter='url(%23b)'><ellipse cx='0' cy='60' rx='40' ry='26' fill='%231f0d45'/><ellipse cx='28' cy='4' rx='40' ry='20' fill='%235c2fb4'/><ellipse cx='88' cy='20' rx='26' ry='20' fill='%23b23fc4'/><ellipse cx='90' cy='54' rx='22' ry='14' fill='%23d6a6f2'/><ellipse cx='46' cy='66' rx='30' ry='10' fill='%23241a6b'/><ellipse cx='54' cy='56' rx='30' ry='5' transform='rotate(-30 54 56)' fill='%238a5ad8' fill-opacity='0.6'/><ellipse cx='68' cy='36' rx='40' ry='5' transform='rotate(-30 68 36)' fill='%23f3e3ff' fill-opacity='0.85'/></g></svg>") center/100% 100% no-repeat,#55349a;
  --g-sun:var(--grain),url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 64' preserveAspectRatio='none'><filter id='b' filterUnits='userSpaceOnUse' x='-50' y='-50' width='200' height='164' color-interpolation-filters='sRGB'><feGaussianBlur stdDeviation='6'/></filter><rect width='100' height='64' fill='%23f07a24'/><g filter='url(%23b)'><ellipse cx='0' cy='30' rx='30' ry='38' fill='%23b8380a'/><ellipse cx='10' cy='66' rx='30' ry='14' fill='%23e14a17'/><ellipse cx='40' cy='4' rx='36' ry='16' fill='%23f5841f'/><ellipse cx='74' cy='34' rx='28' ry='20' fill='%23f9b532'/><ellipse cx='96' cy='62' rx='30' ry='18' fill='%23ffe7a3'/><ellipse cx='100' cy='0' rx='12' ry='8' fill='%235e220b' fill-opacity='0.7'/><ellipse cx='54' cy='52' rx='30' ry='5' transform='rotate(-30 54 52)' fill='%23f7a03a' fill-opacity='0.6'/><ellipse cx='72' cy='26' rx='40' ry='5' transform='rotate(-30 72 26)' fill='%23fff3d6' fill-opacity='0.85'/></g></svg>") center/100% 100% no-repeat,#f07a24;
  --g-lime:var(--grain),url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 64' preserveAspectRatio='none'><filter id='b' filterUnits='userSpaceOnUse' x='-50' y='-50' width='200' height='164' color-interpolation-filters='sRGB'><feGaussianBlur stdDeviation='6'/></filter><rect width='100' height='64' fill='%233d9b52'/><g filter='url(%23b)'><ellipse cx='0' cy='50' rx='34' ry='34' fill='%230f3d1f'/><ellipse cx='30' cy='20' rx='30' ry='22' fill='%2323893f'/><ellipse cx='64' cy='6' rx='30' ry='14' fill='%23f39a4e'/><ellipse cx='96' cy='0' rx='16' ry='12' fill='%23e4572f'/><ellipse cx='70' cy='44' rx='22' ry='12' fill='%23b9cf5a'/><ellipse cx='94' cy='64' rx='30' ry='16' fill='%234fb35f'/><ellipse cx='52' cy='52' rx='30' ry='5' transform='rotate(-32 52 52)' fill='%237fc46a' fill-opacity='0.6'/><ellipse cx='66' cy='32' rx='40' ry='5' transform='rotate(-32 66 32)' fill='%23ffe6cf' fill-opacity='0.8'/></g></svg>") center/100% 100% no-repeat,#3d9b52;
  color-scheme:light;
}

html{font-optical-sizing:auto;font-kerning:normal}
b,strong{font-weight:560}

/* gradient cards: white type on a deep, grainy mix, a light rim, and a soft glow of their own colour underneath */
.g-violet{background:var(--g-violet);--glow:rgba(60,60,180,.5)} .g-ocean{background:var(--g-ocean);--glow:rgba(40,80,200,.48)}
.g-rose{background:var(--g-rose);--glow:rgba(210,30,120,.45)} .g-coral{background:var(--g-coral);--glow:rgba(200,40,30,.45)}
.g-grape{background:var(--g-grape);--glow:rgba(50,25,110,.5)} .g-sun{background:var(--g-sun);--glow:rgba(220,90,20,.45)}
.g-lime{background:var(--g-lime);--glow:rgba(25,110,55,.45)}
.g-violet,.g-ocean,.g-rose,.g-coral,.g-grape,.g-sun,.g-lime,.themed{background-blend-mode:overlay,normal} /* the grain */
.gcard{color:#fff;position:relative;isolation:isolate;overflow:hidden;box-shadow:var(--rim),0 20px 40px -28px var(--glow,rgba(11,11,15,.35))}

/* highlighted words (*stars* in a title): the theme's colours as text, in shades deep enough to read on the page */
.hl,h1 em,h2 em,h3 em{font-style:normal;--hlg:linear-gradient(100deg,#3c3db8,#7a52cf 55%,#3f7fd8)}
[data-theme]{--hlg:linear-gradient(100deg,#3c3db8,#7a52cf 55%,#3f7fd8)} /* violet, the default */
[data-theme="ocean"]{--hlg:linear-gradient(100deg,#2340b8,#3d66d6 50%,#2f8fe0)} [data-theme="rose"]{--hlg:linear-gradient(100deg,#c4127a,#ea2f86 50%,#e8582f)}
[data-theme="coral"]{--hlg:linear-gradient(100deg,#b8170f,#de2b22 50%,#ec5a35)} [data-theme="grape"]{--hlg:linear-gradient(100deg,#3a1a7a,#6a3cbf 50%,#a646c4)}
[data-theme="sun"]{--hlg:linear-gradient(100deg,#c4400c,#e86a1c 50%,#e8961a)} [data-theme="lime"]{--hlg:linear-gradient(100deg,#17703a,#2f9447 50%,#8a9a1c)}
[data-theme] .hl,[data-theme] h1 em,[data-theme] h2 em,[data-theme] h3 em{--hlg:inherit}
@supports ((-webkit-background-clip:text) or (background-clip:text)){
  .hl,h1 em,h2 em,h3 em{background:var(--hlg);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-box-decoration-break:clone;box-decoration-break:clone}
}
.gcard .hl,.gcard h1 em,.gcard h2 em,.gcard h3 em{background:none;color:inherit} /* on a gradient card they stay white */

/* the funnel's own gradient (data-theme on the page); violet without one */
.themed{background:var(--g-violet);--glow:rgba(60,60,180,.5)}
[data-theme="ocean"] .themed{background:var(--g-ocean);--glow:rgba(40,80,200,.48)} [data-theme="rose"] .themed{background:var(--g-rose);--glow:rgba(210,30,120,.45)}
[data-theme="coral"] .themed{background:var(--g-coral);--glow:rgba(200,40,30,.45)} [data-theme="grape"] .themed{background:var(--g-grape);--glow:rgba(50,25,110,.5)}
[data-theme="sun"] .themed{background:var(--g-sun);--glow:rgba(220,90,20,.45)} [data-theme="lime"] .themed{background:var(--g-lime);--glow:rgba(25,110,55,.45)}