/* Joybreak landing page, Direction A "Poster Night".
   Wide screens: sizes are in comp units (--u is 1/850 of the page frame), so the page matches the approved comp
   (Marketing/Website/comps/direction-A-poster-night.png) at any width. Phones: a stacked version sized with --m.
   Colors mirror tokens/colors.json. Display type is Archivo (variable, narrowed), body type is Roboto Condensed. */

@font-face { font-family: "Archivo Display"; src: url("/assets/fonts/archivo-wdth.woff2") format("woff2"); font-weight: 800 900; font-stretch: 62% 80%; font-display: swap; }
@font-face { font-family: "Roboto Condensed"; src: url("/assets/fonts/roboto-condensed-500.woff2") format("woff2"); font-weight: 500; font-display: swap; }
@font-face { font-family: "Roboto Condensed"; src: url("/assets/fonts/roboto-condensed-700.woff2") format("woff2"); font-weight: 700; font-display: swap; }
@font-face { font-family: "Roboto Condensed"; src: url("/assets/fonts/roboto-condensed-800.woff2") format("woff2"); font-weight: 800; font-display: swap; }

:root {
  --yellow: #F3F565;
  --ink: #000000;
  --paper: #FFFFFF;
  --paper-grey: #ECECEA;
  --tangerine: #FF823D;
  --pink: #E847BD;
  --blue: #3666DA;
  --mint: #84EEAE;
  --display: "Archivo Display", "Anton", Impact, "Arial Narrow Bold", sans-serif;
  --body: "Roboto Condensed", "Arial Narrow", system-ui, sans-serif;
  --vw: 100vw;
  --m: clamp(0.8px, calc(var(--vw) / 390), 1.5px);
  --u: calc(min(var(--vw), 1120px) / 850);
}
@supports (width: 1cqi) {
  body { container-type: inline-size; }
  :root { --vw: 100cqi; }
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--yellow); color: var(--ink); font-family: var(--body); font-size: 18px; line-height: 1.4; overflow-x: hidden; }
main, .site-header { overflow-x: clip; }
img, svg { display: block; max-width: 100%; }
img { height: auto; }
a { color: inherit; }
h1, h2, p, ul, ol, figure { margin: 0; }
ul, ol { padding: 0; list-style: none; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.skip-link { position: absolute; left: 1rem; top: -4rem; z-index: 50; background: var(--ink); color: var(--paper); padding: .75rem 1rem; font-weight: 700; }
.skip-link:focus { top: 1rem; }
:focus-visible { outline: 4px solid var(--blue); outline-offset: 3px; }
.wrap { position: relative; width: min(100% - 32px, 560px); margin-inline: auto; }
.deco { position: absolute; max-width: none; pointer-events: none; user-select: none; }

/* Torn paper strips that carry the display type */
.strip { display: block; width: fit-content; background: var(--paper); font-family: var(--display); font-weight: 900; font-stretch: 62%; line-height: .88; letter-spacing: -.03em; padding: .13em .14em .1em; clip-path: polygon(0.00% 4.55%, 1.54% 4.48%, 3.09% 9.85%, 4.62% 8.08%, 6.16% 7.19%, 7.70% 6.32%, 9.24% 6.61%, 10.77% 6.12%, 12.31% 6.64%, 13.85% 5.53%, 15.39% 6.09%, 16.93% 6.03%, 18.46% 5.38%, 20.01% 7.71%, 21.55% 6.87%, 23.08% 5.34%, 24.62% 6.07%, 26.16% 4.99%, 27.70% 5.95%, 29.24% 8.37%, 30.78% 7.47%, 32.31% 5.98%, 33.85% 6.08%, 35.39% 5.97%, 36.93% 6.01%, 38.47% 5.00%, 40.00% 3.98%, 41.54% 4.88%, 43.09% 7.63%, 44.62% 7.04%, 46.16% 6.19%, 47.70% 6.00%, 49.24% 6.01%, 50.77% 5.06%, 52.31% 4.65%, 53.86% 7.47%, 55.39% 5.18%, 56.93% 4.71%, 58.47% 6.34%, 60.01% 4.59%, 61.54% 4.29%, 63.08% 3.26%, 64.62% 4.31%, 66.16% 4.06%, 67.70% 4.44%, 69.24% 3.96%, 70.77% 3.72%, 72.31% 4.34%, 73.85% 4.56%, 75.39% 3.27%, 76.93% 3.50%, 78.47% 3.85%, 80.01% 4.11%, 81.54% 3.53%, 83.08% 2.44%, 84.62% 3.22%, 86.16% 3.41%, 87.70% 3.68%, 89.24% 4.24%, 90.78% 3.51%, 92.31% 3.54%, 93.85% 3.21%, 95.39% 2.73%, 96.93% 1.84%, 98.47% 1.92%, 100.00% 0.00%, 99.84% 7.13%, 99.59% 14.23%, 99.55% 21.38%, 98.73% 28.39%, 98.83% 35.56%, 98.96% 42.74%, 98.92% 49.88%, 99.14% 57.07%, 99.12% 64.22%, 99.04% 71.36%, 99.02% 78.51%, 98.81% 85.62%, 98.71% 92.76%, 99.23% 100.00%, 97.69% 99.41%, 96.14% 99.00%, 94.60% 98.04%, 93.06% 97.98%, 91.51% 97.87%, 89.97% 98.57%, 88.43% 94.22%, 86.88% 95.63%, 85.33% 97.25%, 83.79% 96.34%, 82.25% 97.14%, 80.70% 97.33%, 79.16% 96.24%, 77.61% 96.58%, 76.07% 96.56%, 74.53% 95.73%, 72.98% 96.91%, 71.44% 95.92%, 69.89% 96.98%, 68.35% 96.33%, 66.80% 96.35%, 65.26% 96.92%, 63.71% 96.32%, 62.17% 96.15%, 60.62% 95.86%, 59.08% 96.80%, 57.53% 95.73%, 55.99% 95.30%, 54.44% 96.06%, 52.91% 92.72%, 51.36% 93.41%, 49.81% 94.68%, 48.27% 92.90%, 46.73% 93.52%, 45.18% 94.30%, 43.64% 94.05%, 42.09% 93.84%, 40.55% 94.14%, 39.00% 93.95%, 37.46% 92.81%, 35.92% 92.87%, 34.37% 92.98%, 32.83% 92.23%, 31.28% 94.28%, 29.73% 94.28%, 28.19% 94.45%, 26.64% 95.04%, 25.11% 91.07%, 23.56% 92.74%, 22.01% 93.72%, 20.47% 93.24%, 18.92% 93.71%, 17.38% 94.27%, 15.83% 93.96%, 14.29% 93.87%, 12.75% 92.07%, 11.21% 90.60%, 9.66% 91.17%, 8.11% 92.52%, 6.57% 90.55%, 5.03% 91.22%, 3.48% 91.07%, 1.94% 91.23%, 0.38% 95.45%, 0.64% 88.43%, 0.59% 81.44%, 0.82% 74.43%, 0.78% 67.43%, 0.72% 60.44%, 0.58% 53.46%, 1.16% 46.41%, 0.93% 39.44%, 0.77% 32.46%, 0.58% 25.48%, 0.70% 18.47%, 0.43% 11.50%); }
.strip-take, .strip-today, .strip-close-b { clip-path: polygon(0.67% 0.00%, 2.95% 4.83%, 5.27% 3.88%, 7.57% 5.56%, 9.88% 4.53%, 12.19% 4.40%, 14.51% 3.00%, 16.83% 2.51%, 19.14% 2.70%, 21.44% 3.59%, 23.75% 3.71%, 26.06% 3.72%, 28.36% 5.48%, 30.68% 3.81%, 33.00% 3.11%, 35.29% 5.77%, 37.60% 5.85%, 39.92% 5.21%, 42.23% 5.38%, 44.54% 5.30%, 46.85% 5.19%, 49.16% 5.89%, 51.47% 5.44%, 53.77% 7.83%, 56.08% 7.50%, 58.40% 6.07%, 60.71% 6.32%, 63.02% 6.16%, 65.33% 5.62%, 67.64% 5.79%, 69.96% 5.41%, 72.27% 5.30%, 74.58% 4.76%, 76.89% 5.69%, 79.19% 6.53%, 81.51% 5.45%, 83.82% 6.20%, 86.13% 5.63%, 88.42% 10.05%, 90.74% 8.26%, 93.05% 8.51%, 95.36% 8.62%, 97.67% 8.84%, 100.00% 4.81%, 98.52% 11.48%, 98.54% 18.29%, 98.75% 25.12%, 98.91% 31.93%, 98.83% 38.73%, 98.61% 45.52%, 98.90% 52.35%, 99.00% 59.17%, 98.61% 65.94%, 98.56% 72.74%, 98.67% 79.55%, 98.52% 86.35%, 98.48% 93.15%, 99.00% 100.00%, 96.65% 98.17%, 94.31% 95.24%, 91.94% 97.07%, 89.58% 96.97%, 87.23% 96.97%, 84.87% 97.72%, 82.51% 97.63%, 80.15% 97.42%, 77.80% 96.46%, 75.44% 96.63%, 73.08% 96.66%, 70.73% 96.50%, 68.37% 95.95%, 66.01% 95.95%, 63.65% 96.59%, 61.30% 95.86%, 58.96% 92.61%, 56.59% 93.98%, 54.23% 94.94%, 51.87% 94.43%, 49.51% 95.11%, 47.16% 94.49%, 44.80% 94.66%, 42.44% 94.58%, 40.08% 95.42%, 37.74% 92.92%, 35.37% 94.71%, 33.01% 94.65%, 30.66% 93.42%, 28.31% 92.49%, 25.95% 93.36%, 23.59% 93.06%, 21.23% 93.54%, 18.87% 93.53%, 16.52% 93.32%, 14.16% 93.21%, 11.80% 93.94%, 9.44% 93.34%, 7.08% 94.47%, 4.73% 93.61%, 2.37% 93.38%, 0.00% 96.15%, 0.44% 89.31%, 0.55% 82.44%, 0.65% 75.58%, 0.65% 68.71%, 0.57% 61.83%, 1.14% 54.99%, 1.08% 48.12%, 0.83% 41.23%, 2.27% 34.45%, 1.83% 27.55%, 1.43% 20.66%, 1.53% 13.79%, 1.20% 6.90%); }
.strip-mark { clip-path: polygon(0.00% 2.00%, 1.49% 1.97%, 2.99% 3.38%, 4.48% 6.14%, 5.97% 4.39%, 7.47% 4.10%, 8.96% 3.39%, 10.45% 3.07%, 11.94% 3.36%, 13.43% 3.04%, 14.93% 3.13%, 16.42% 3.07%, 17.91% 3.05%, 19.41% 3.13%, 20.90% 2.71%, 22.39% 3.59%, 23.88% 2.94%, 25.38% 3.41%, 26.87% 2.73%, 28.36% 3.61%, 29.85% 3.38%, 31.35% 2.99%, 32.84% 5.49%, 34.33% 4.15%, 35.82% 2.98%, 37.32% 2.73%, 38.81% 3.23%, 40.30% 2.74%, 41.79% 2.01%, 43.29% 2.56%, 44.78% 2.60%, 46.27% 2.05%, 47.76% 2.34%, 49.26% 3.00%, 50.75% 2.18%, 52.24% 2.40%, 53.73% 2.10%, 55.23% 2.44%, 56.72% 2.94%, 58.21% 2.24%, 59.70% 2.52%, 61.20% 2.60%, 62.69% 1.94%, 64.18% 1.73%, 65.67% 2.72%, 67.17% 2.71%, 68.66% 3.24%, 70.15% 3.34%, 71.64% 2.45%, 73.14% 3.02%, 74.63% 3.19%, 76.12% 2.89%, 77.62% 2.81%, 79.11% 2.75%, 80.60% 2.83%, 82.09% 2.23%, 83.58% 2.13%, 85.08% 1.47%, 86.57% 2.28%, 88.06% 2.01%, 89.55% 1.73%, 91.05% 1.18%, 92.54% 2.19%, 94.03% 2.30%, 95.53% 2.33%, 97.02% 2.52%, 98.51% 2.23%, 100.00% 0.00%, 99.86% 5.25%, 99.67% 10.51%, 99.46% 15.76%, 99.28% 21.01%, 99.28% 26.27%, 99.35% 31.55%, 99.43% 36.82%, 98.85% 42.04%, 98.99% 47.32%, 99.13% 52.59%, 99.24% 57.86%, 98.47% 63.07%, 98.90% 68.37%, 99.02% 73.64%, 99.23% 78.92%, 99.02% 84.17%, 99.20% 89.45%, 98.94% 94.70%, 99.44% 100.00%, 97.95% 95.91%, 96.45% 96.92%, 94.95% 96.73%, 93.45% 96.84%, 91.96% 97.04%, 90.46% 95.15%, 88.96% 96.97%, 87.46% 97.78%, 85.96% 97.94%, 84.46% 98.34%, 82.97% 96.22%, 81.47% 97.06%, 79.97% 97.36%, 78.47% 96.80%, 76.97% 97.47%, 75.47% 97.24%, 73.97% 98.10%, 72.48% 98.13%, 70.98% 97.95%, 69.48% 98.49%, 67.98% 98.05%, 66.48% 98.29%, 64.99% 97.56%, 63.49% 97.56%, 61.99% 97.56%, 60.49% 98.03%, 58.99% 98.05%, 57.50% 94.32%, 56.00% 96.14%, 54.50% 96.31%, 53.00% 95.92%, 51.51% 94.68%, 50.01% 96.05%, 48.51% 95.92%, 47.01% 95.86%, 45.51% 96.02%, 44.01% 95.45%, 42.51% 95.86%, 41.02% 95.78%, 39.52% 96.55%, 38.02% 96.44%, 36.52% 96.91%, 35.03% 94.82%, 33.52% 95.89%, 32.03% 95.54%, 30.53% 96.11%, 29.03% 96.90%, 27.53% 95.96%, 26.03% 96.10%, 24.53% 96.92%, 23.04% 96.70%, 21.54% 94.27%, 20.04% 95.82%, 18.54% 96.62%, 17.04% 96.76%, 15.54% 96.21%, 14.05% 96.02%, 12.55% 95.77%, 11.05% 96.40%, 9.55% 95.78%, 8.06% 95.41%, 6.56% 95.17%, 5.06% 96.04%, 3.56% 96.04%, 2.06% 95.28%, 0.56% 97.33%, 0.62% 92.03%, 0.75% 86.72%, 1.44% 81.37%, 1.38% 76.08%, 1.52% 70.77%, 1.13% 65.50%, 0.76% 60.23%, 0.75% 54.93%, 0.59% 49.64%, 0.66% 44.34%, 0.67% 39.04%, 0.69% 33.74%, 0.57% 28.45%, 0.64% 23.15%, 0.94% 17.83%, 0.93% 12.53%, 1.24% 7.21%); }
.strip-close-a { clip-path: polygon(0.00% 0.00%, 1.59% 0.10%, 3.17% 2.17%, 4.76% 3.08%, 6.34% 3.80%, 7.93% 4.08%, 9.52% 4.02%, 11.11% 2.70%, 12.69% 2.27%, 14.28% 2.73%, 15.87% 3.44%, 17.46% 2.65%, 19.04% 2.33%, 20.63% 3.29%, 22.22% 4.02%, 23.81% 3.02%, 25.39% 3.05%, 26.98% 4.00%, 28.57% 3.39%, 30.15% 7.28%, 31.73% 6.90%, 33.33% 5.32%, 34.91% 5.72%, 36.50% 6.17%, 38.09% 5.03%, 39.67% 5.70%, 41.26% 5.49%, 42.85% 4.78%, 44.44% 5.55%, 46.02% 5.98%, 47.61% 8.45%, 49.19% 8.02%, 50.79% 6.35%, 52.37% 6.42%, 53.96% 5.09%, 55.55% 5.87%, 57.14% 5.77%, 58.73% 4.90%, 60.32% 4.48%, 61.90% 5.36%, 63.49% 5.00%, 65.08% 5.02%, 66.66% 6.25%, 68.25% 6.84%, 69.84% 6.57%, 71.42% 6.73%, 73.01% 5.81%, 74.60% 6.65%, 76.18% 8.69%, 77.77% 6.99%, 79.36% 7.61%, 80.95% 7.04%, 82.53% 7.97%, 84.12% 8.56%, 85.71% 7.42%, 87.30% 7.98%, 88.88% 8.10%, 90.47% 8.06%, 92.06% 7.59%, 93.64% 8.23%, 95.23% 7.40%, 96.81% 10.88%, 98.40% 10.39%, 100.00% 6.00%, 99.94% 13.83%, 99.60% 21.62%, 99.31% 29.41%, 99.15% 37.23%, 98.65% 44.99%, 99.02% 52.89%, 98.71% 60.68%, 98.78% 68.53%, 99.04% 76.42%, 98.52% 84.18%, 98.85% 92.07%, 99.41% 100.00%, 97.81% 99.77%, 96.22% 99.41%, 94.63% 98.60%, 93.03% 98.79%, 91.44% 97.25%, 89.85% 98.00%, 88.25% 97.74%, 86.66% 96.84%, 85.07% 97.27%, 83.47% 96.68%, 81.88% 96.06%, 80.28% 96.78%, 78.69% 97.70%, 77.10% 97.73%, 75.50% 98.06%, 73.91% 97.11%, 72.32% 96.26%, 70.72% 97.01%, 69.13% 97.26%, 67.53% 96.79%, 65.94% 95.74%, 64.35% 97.14%, 62.75% 97.87%, 61.16% 97.78%, 59.56% 97.25%, 57.97% 96.07%, 56.38% 94.10%, 54.79% 94.15%, 53.19% 92.48%, 51.60% 93.89%, 50.01% 94.26%, 48.41% 95.29%, 46.82% 96.00%, 45.22% 95.02%, 43.63% 93.41%, 42.04% 93.61%, 40.44% 94.48%, 38.85% 95.11%, 37.25% 95.01%, 35.66% 95.21%, 34.07% 95.87%, 32.47% 96.58%, 30.88% 97.10%, 29.28% 97.27%, 27.69% 96.13%, 26.10% 96.24%, 24.51% 93.59%, 22.91% 93.97%, 21.32% 95.42%, 19.72% 94.37%, 18.13% 94.93%, 16.53% 95.92%, 14.94% 94.80%, 13.35% 95.28%, 11.75% 94.63%, 10.16% 95.14%, 8.56% 95.98%, 6.97% 92.29%, 5.38% 93.14%, 3.78% 94.61%, 2.19% 94.53%, 0.59% 97.00%, 0.73% 88.89%, 1.57% 80.67%, 1.27% 72.62%, 1.11% 64.56%, 1.12% 56.46%, 0.93% 48.40%, 0.83% 40.33%, 1.24% 32.17%, 0.96% 24.12%, 0.89% 16.04%, 0.87% 7.95%); }

/* Buttons */
.btn { display: flex; align-items: center; justify-content: center; font-family: var(--body); font-weight: 700; line-height: 1.1; text-align: center; text-decoration: none; border: 2px solid var(--ink); transition: transform .15s ease, box-shadow .15s ease; }
.btn-dark { background: var(--ink); color: var(--paper); }
.btn-light { background: var(--paper); color: var(--ink); }
.btn:hover { transform: translate(-3px, -3px) rotate(-1deg); box-shadow: 4px 4px 0 var(--ink); }
.btn-dark:hover { box-shadow: 4px 4px 0 var(--tangerine); }

/* Header */
.header-inner { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 0 10px; border-bottom: 2px solid var(--ink); }
.brand { display: inline-flex; color: var(--ink); text-decoration: none; }
.brand .wordmark { height: 26px; width: auto; }
.header-cta { display: flex; align-items: center; gap: 8px; }
.burst-header { position: static; width: 22px; }
.btn-header { min-height: 38px; padding: 0 20px; font-size: 17px; font-weight: 700; }

/* Hero (phones) */
.hero { padding-top: 30px; }
.hero-copy { position: relative; z-index: 3; }
.hero-title { display: flex; flex-direction: column; align-items: flex-start; font-size: calc(96 * var(--m)); }
.strip-take { position: relative; z-index: 2; margin-left: 6px; transform: rotate(-6deg); }
.strip-mark { position: relative; z-index: 3; margin-top: -5px; padding: calc(12 * var(--m)) calc(12 * var(--m)) calc(13 * var(--m)) calc(14 * var(--m)); transform: rotate(-5deg); }
.wordmark-hero { width: min(calc(320 * var(--m)), calc(var(--vw) - 64px)); height: auto; aspect-ratio: 486 / 108; color: var(--ink); }
.strip-today { position: relative; z-index: 4; margin: -5px 0 0 calc(54 * var(--m)); transform: rotate(-3.5deg); }
.burst-h1 { left: -20px; top: -26px; width: 56px; transform: rotate(60deg); }
.burst-h2 { transform: rotate(120deg); }
.burst-h3 { transform: rotate(-10deg); }
.burst-cta-r, .burst-expect { transform: rotate(180deg); }
.burst-close { transform: rotate(160deg); }
.burst-martini { transform: rotate(90deg); }
.burst-h2 { left: calc(228 * var(--m)); top: calc(50 * var(--m)); width: 26px; }
.burst-h3 { left: 0; top: calc(226 * var(--m)); width: calc(50 * var(--m)); }
.lede { margin-top: 24px; font-weight: 700; font-size: calc(19 * var(--m)); line-height: 1.22; max-width: 21em; }
.cta-stack { position: relative; display: grid; gap: 12px; margin-top: 22px; }
.btn-block { min-height: 54px; padding: 8px 16px; font-size: calc(19 * var(--m)); }
.burst-cta-l { left: -14px; top: -14px; width: 24px; }
.burst-cta-r { right: -14px; top: 46px; width: 24px; }
.proof { margin-top: 18px; font-weight: 500; font-size: calc(16 * var(--m)); }
.squiggle-hero { position: static; width: 170px; margin-top: 4px; }
.hero-media { position: relative; margin-top: 34px; padding-bottom: calc(64 * var(--m)); }
.photo { position: relative; background: var(--paper); }
.photo picture { display: block; width: 100%; height: 100%; }
.photo img { width: 100%; height: 100%; object-fit: cover; }
.photo-main { width: calc(100% + 16px); aspect-ratio: 452 / 417; padding: 8px; clip-path: polygon(0.00% 0.00%, 1.54% 0.16%, 3.04% 0.72%, 4.56% 1.13%, 6.09% 1.41%, 7.61% 1.70%, 9.17% 1.70%, 10.71% 1.82%, 12.25% 1.92%, 13.81% 1.87%, 15.34% 2.08%, 16.90% 2.04%, 18.42% 2.41%, 19.97% 2.44%, 21.50% 2.68%, 23.02% 3.07%, 24.55% 3.32%, 26.12% 3.17%, 27.64% 3.54%, 29.19% 3.50%, 30.75% 3.51%, 32.28% 3.77%, 33.81% 3.98%, 35.36% 4.01%, 36.91% 4.08%, 38.45% 4.20%, 39.95% 4.76%, 41.49% 4.92%, 43.05% 4.84%, 44.60% 4.92%, 46.12% 5.30%, 47.66% 5.36%, 49.21% 5.46%, 50.73% 5.80%, 52.27% 5.96%, 53.80% 6.23%, 55.33% 6.42%, 56.87% 6.58%, 58.41% 6.76%, 59.93% 7.10%, 61.48% 7.13%, 63.03% 7.13%, 64.56% 7.39%, 66.11% 7.50%, 67.63% 7.83%, 69.16% 8.14%, 70.73% 7.94%, 72.28% 7.96%, 73.79% 8.40%, 75.34% 8.50%, 76.86% 8.78%, 78.41% 8.81%, 79.95% 9.01%, 81.47% 9.32%, 83.01% 9.47%, 84.58% 9.34%, 86.06% 10.12%, 87.61% 10.18%, 89.15% 10.28%, 90.69% 10.49%, 92.24% 10.45%, 93.80% 10.43%, 95.33% 10.68%, 96.89% 10.62%, 98.41% 10.95%, 100.00% 10.55%, 99.68% 12.24%, 99.75% 13.93%, 99.78% 15.61%, 99.46% 17.30%, 99.62% 18.99%, 99.75% 20.68%, 99.68% 22.37%, 99.71% 24.05%, 99.79% 25.74%, 99.80% 27.43%, 99.75% 29.12%, 99.42% 30.80%, 99.42% 32.49%, 99.06% 34.18%, 99.47% 35.87%, 99.05% 37.55%, 99.06% 39.24%, 99.09% 40.93%, 99.22% 42.62%, 99.45% 44.31%, 99.60% 45.99%, 99.46% 47.68%, 98.65% 49.37%, 98.96% 51.06%, 99.43% 52.74%, 99.54% 54.43%, 99.69% 56.12%, 99.38% 57.81%, 99.32% 59.50%, 98.69% 61.18%, 99.18% 62.87%, 99.28% 64.56%, 99.53% 66.25%, 99.32% 67.93%, 99.48% 69.62%, 99.58% 71.31%, 99.41% 73.00%, 99.23% 74.68%, 99.29% 76.37%, 99.48% 78.06%, 99.64% 79.75%, 99.48% 81.44%, 99.37% 83.12%, 99.22% 84.81%, 99.54% 86.50%, 99.43% 88.19%, 99.52% 89.87%, 99.62% 91.56%, 99.61% 93.25%, 98.94% 94.94%, 99.24% 96.62%, 99.49% 98.31%, 100.00% 100.00%, 98.46% 98.60%, 96.92% 99.09%, 95.38% 99.46%, 93.85% 99.32%, 92.31% 99.23%, 90.77% 98.98%, 89.23% 99.12%, 87.69% 98.87%, 86.15% 99.33%, 84.62% 98.84%, 83.08% 99.00%, 81.54% 99.11%, 80.00% 99.50%, 78.46% 98.99%, 76.92% 99.15%, 75.38% 99.18%, 73.85% 98.63%, 72.31% 98.50%, 70.77% 99.09%, 69.23% 99.37%, 67.69% 99.02%, 66.15% 99.02%, 64.62% 99.31%, 63.08% 99.25%, 61.54% 99.56%, 60.00% 99.47%, 58.46% 99.37%, 56.92% 99.31%, 55.38% 99.15%, 53.85% 99.14%, 52.31% 99.34%, 50.77% 98.73%, 49.23% 98.73%, 47.69% 98.83%, 46.15% 99.00%, 44.62% 98.97%, 43.08% 99.06%, 41.54% 99.43%, 40.00% 99.23%, 38.46% 99.57%, 36.92% 99.59%, 35.38% 99.45%, 33.85% 99.02%, 32.31% 99.00%, 30.77% 98.95%, 29.23% 99.33%, 27.69% 98.90%, 26.15% 99.24%, 24.62% 99.18%, 23.08% 99.34%, 21.54% 99.58%, 20.00% 99.58%, 18.46% 98.81%, 16.92% 98.96%, 15.38% 99.23%, 13.85% 99.46%, 12.31% 99.58%, 10.77% 99.54%, 9.23% 99.55%, 7.69% 99.52%, 6.15% 99.66%, 4.62% 99.54%, 3.08% 99.31%, 1.54% 99.14%, 0.00% 100.00%, 0.06% 98.33%, 0.39% 96.67%, 0.49% 95.00%, 0.30% 93.33%, 1.22% 91.67%, 1.08% 90.00%, 0.89% 88.33%, 0.67% 86.67%, 0.38% 85.00%, 0.31% 83.33%, 0.43% 81.67%, 0.26% 80.00%, 1.05% 78.33%, 0.88% 76.67%, 0.91% 75.00%, 0.80% 73.33%, 0.77% 71.67%, 0.54% 70.00%, 0.54% 68.33%, 0.39% 66.67%, 0.26% 65.00%, 0.58% 63.33%, 0.52% 61.67%, 0.58% 60.00%, 1.35% 58.33%, 1.04% 56.67%, 0.65% 55.00%, 0.37% 53.33%, 0.40% 51.67%, 0.27% 50.00%, 0.25% 48.33%, 0.42% 46.67%, 0.40% 45.00%, 0.34% 43.33%, 0.62% 41.67%, 0.46% 40.00%, 0.40% 38.33%, 0.52% 36.67%, 0.60% 35.00%, 0.55% 33.33%, 0.46% 31.67%, 0.49% 30.00%, 1.19% 28.33%, 0.97% 26.67%, 0.81% 25.00%, 0.78% 23.33%, 0.65% 21.67%, 0.65% 20.00%, 0.69% 18.33%, 0.40% 16.67%, 0.63% 15.00%, 0.44% 13.33%, 0.26% 11.67%, 0.37% 10.00%, 0.29% 8.33%, 0.59% 6.67%, 0.66% 5.00%, 0.79% 3.33%, 0.66% 1.67%); }
.photo-main img { object-position: 25% 50%; clip-path: polygon(0.00% 0.00%, 3.23% 0.34%, 6.45% 0.74%, 9.67% 1.06%, 12.90% 1.40%, 16.13% 1.73%, 19.34% 2.18%, 22.57% 2.55%, 25.79% 2.94%, 29.02% 3.20%, 32.24% 3.60%, 35.47% 3.93%, 38.70% 4.21%, 41.93% 4.53%, 45.16% 4.82%, 48.38% 5.18%, 51.58% 5.85%, 54.82% 6.03%, 58.04% 6.38%, 61.25% 6.91%, 64.48% 7.24%, 67.70% 7.61%, 70.93% 7.87%, 74.16% 8.14%, 77.38% 8.62%, 80.61% 8.90%, 83.83% 9.29%, 87.07% 9.44%, 90.30% 9.75%, 93.53% 10.02%, 96.76% 10.37%, 100.00% 10.53%, 100.00% 13.97%, 99.62% 17.41%, 99.66% 20.85%, 99.73% 24.29%, 99.76% 27.73%, 99.56% 31.17%, 99.72% 34.62%, 99.61% 38.06%, 99.69% 41.50%, 99.82% 44.94%, 99.78% 48.38%, 99.82% 51.82%, 99.76% 55.26%, 99.84% 58.70%, 99.81% 62.15%, 99.85% 65.59%, 99.92% 69.03%, 99.89% 72.47%, 99.90% 75.91%, 99.85% 79.35%, 99.87% 82.79%, 99.85% 86.23%, 99.58% 89.68%, 99.71% 93.12%, 99.71% 96.56%, 100.00% 100.00%, 96.77% 99.86%, 93.55% 99.87%, 90.32% 99.78%, 87.10% 99.84%, 83.87% 99.80%, 80.65% 99.62%, 77.42% 99.64%, 74.19% 99.68%, 70.97% 99.80%, 67.74% 99.87%, 64.52% 99.90%, 61.29% 99.86%, 58.06% 99.83%, 54.84% 99.87%, 51.61% 99.81%, 48.39% 99.77%, 45.16% 99.78%, 41.94% 99.72%, 38.71% 99.52%, 35.48% 99.67%, 32.26% 99.80%, 29.03% 99.81%, 25.81% 99.85%, 22.58% 99.87%, 19.35% 99.92%, 16.13% 99.84%, 12.90% 99.82%, 9.68% 99.84%, 6.45% 99.90%, 3.23% 99.92%, 0.00% 100.00%, 0.00% 96.55%, 0.33% 93.10%, 0.30% 89.66%, 0.19% 86.21%, 0.12% 82.76%, 0.12% 79.31%, 0.21% 75.86%, 0.38% 72.41%, 0.42% 68.97%, 0.31% 65.52%, 0.18% 62.07%, 0.12% 58.62%, 0.14% 55.17%, 0.16% 51.72%, 0.09% 48.28%, 0.05% 44.83%, 0.04% 41.38%, 0.05% 37.93%, 0.05% 34.48%, 0.07% 31.03%, 0.09% 27.59%, 0.18% 24.14%, 0.10% 20.69%, 0.43% 17.24%, 0.31% 13.79%, 0.30% 10.34%, 0.30% 6.90%, 0.30% 3.45%); }
.photo-second { z-index: 2; width: 92%; aspect-ratio: 409 / 300; margin: -26px 0 0 3%; padding: 8px; clip-path: polygon(0.00% 10.67%, 1.69% 10.49%, 3.40% 10.56%, 5.10% 10.40%, 6.80% 10.31%, 8.52% 10.48%, 10.20% 10.20%, 11.92% 10.35%, 13.59% 9.77%, 15.30% 9.91%, 16.99% 9.55%, 18.67% 9.18%, 20.38% 9.15%, 22.08% 9.09%, 23.77% 8.82%, 25.45% 8.34%, 27.16% 8.57%, 28.86% 8.47%, 30.61% 9.12%, 32.28% 8.49%, 33.95% 7.93%, 35.62% 7.38%, 37.31% 7.05%, 39.00% 6.85%, 40.73% 7.17%, 42.41% 6.82%, 44.13% 7.00%, 45.80% 6.40%, 47.51% 6.49%, 49.20% 6.20%, 50.90% 6.24%, 52.57% 5.62%, 54.26% 5.22%, 56.02% 6.24%, 57.68% 5.43%, 59.37% 5.23%, 61.06% 4.86%, 62.77% 4.94%, 64.45% 4.55%, 66.20% 5.37%, 67.86% 4.51%, 69.57% 4.70%, 71.24% 4.00%, 72.95% 4.03%, 74.63% 3.58%, 76.32% 3.45%, 78.03% 3.39%, 79.76% 3.84%, 81.44% 3.54%, 83.13% 3.25%, 84.80% 2.52%, 86.49% 2.34%, 88.19% 2.25%, 89.87% 1.85%, 91.57% 1.70%, 93.27% 1.60%, 94.99% 1.92%, 96.68% 1.63%, 98.40% 1.78%, 100.00% 0.00%, 98.89% 2.35%, 98.77% 4.70%, 98.89% 7.05%, 99.05% 9.40%, 98.99% 11.75%, 99.04% 14.10%, 99.14% 16.44%, 99.25% 18.79%, 99.11% 21.14%, 98.90% 23.49%, 99.39% 25.84%, 99.42% 28.19%, 99.46% 30.54%, 99.59% 32.89%, 98.83% 35.24%, 99.07% 37.59%, 98.55% 39.94%, 98.71% 42.29%, 99.19% 44.63%, 98.97% 46.98%, 99.25% 49.33%, 99.55% 51.68%, 98.85% 54.03%, 99.07% 56.38%, 99.25% 58.73%, 98.78% 61.08%, 99.19% 63.43%, 99.40% 65.78%, 99.32% 68.13%, 99.49% 70.48%, 99.63% 72.83%, 99.61% 75.17%, 99.67% 77.52%, 99.57% 79.87%, 99.67% 82.22%, 99.65% 84.57%, 99.38% 86.92%, 99.32% 89.27%, 99.56% 91.62%, 99.37% 93.97%, 99.63% 96.32%, 100.00% 98.67%, 98.28% 98.38%, 96.55% 97.96%, 94.83% 97.75%, 93.11% 98.11%, 91.40% 98.21%, 89.68% 98.24%, 87.96% 98.35%, 86.24% 98.54%, 84.52% 98.31%, 82.79% 98.20%, 81.07% 98.05%, 79.35% 97.93%, 77.63% 98.14%, 75.91% 98.43%, 74.19% 98.24%, 72.48% 98.51%, 70.75% 98.17%, 69.03% 98.35%, 67.31% 97.69%, 65.59% 98.09%, 63.87% 98.54%, 62.16% 98.76%, 60.44% 98.84%, 58.72% 98.95%, 56.99% 98.64%, 55.27% 98.71%, 53.56% 98.88%, 51.84% 98.98%, 50.11% 97.96%, 48.39% 98.32%, 46.67% 98.75%, 44.95% 98.67%, 43.23% 98.43%, 41.51% 98.72%, 39.79% 99.01%, 38.07% 98.82%, 36.35% 98.49%, 34.63% 98.31%, 32.91% 98.34%, 31.19% 98.88%, 29.47% 98.90%, 27.75% 98.76%, 26.03% 98.64%, 24.31% 99.07%, 22.59% 98.99%, 20.87% 98.94%, 19.15% 98.21%, 17.43% 98.82%, 15.71% 98.88%, 13.99% 99.15%, 12.27% 99.37%, 10.55% 99.05%, 8.83% 98.84%, 7.11% 99.00%, 5.39% 99.25%, 3.67% 99.51%, 1.96% 100.00%, 2.17% 97.64%, 2.12% 95.29%, 2.15% 92.93%, 2.33% 90.57%, 2.29% 88.22%, 2.36% 85.87%, 2.44% 83.51%, 2.05% 81.17%, 1.99% 78.82%, 1.74% 76.48%, 2.62% 74.09%, 2.38% 71.75%, 2.07% 69.41%, 2.16% 67.05%, 2.11% 64.70%, 1.68% 62.36%, 1.72% 60.01%, 1.71% 57.66%, 1.71% 55.30%, 1.63% 52.95%, 1.45% 50.61%, 1.39% 48.26%, 1.33% 45.91%, 1.46% 43.55%, 1.25% 41.20%, 1.94% 38.82%, 1.59% 36.48%, 1.24% 34.15%, 1.69% 31.77%, 1.12% 29.44%, 0.94% 27.10%, 1.62% 24.72%, 1.25% 22.38%, 0.77% 20.05%, 0.76% 17.69%, 0.67% 15.35%, 0.79% 12.99%); }
.photo-second img { object-position: 50% 40%; clip-path: polygon(0.00% 10.99%, 3.57% 10.60%, 7.16% 10.42%, 10.73% 10.08%, 14.31% 9.79%, 17.87% 9.29%, 21.45% 8.94%, 25.02% 8.53%, 28.59% 8.18%, 32.16% 7.69%, 35.73% 7.35%, 39.29% 6.83%, 42.87% 6.55%, 46.44% 6.14%, 50.04% 6.15%, 53.59% 5.47%, 57.16% 5.09%, 60.73% 4.53%, 64.30% 4.20%, 67.87% 3.70%, 71.44% 3.32%, 75.02% 3.02%, 78.59% 2.66%, 82.16% 2.18%, 85.73% 1.77%, 89.30% 1.38%, 92.87% 1.05%, 96.45% 0.74%, 100.00% 0.00%, 99.98% 4.93%, 99.99% 9.86%, 99.88% 14.79%, 99.92% 19.72%, 99.87% 24.65%, 99.81% 29.57%, 99.81% 34.50%, 99.84% 39.43%, 99.78% 44.36%, 99.87% 49.29%, 99.77% 54.22%, 99.82% 59.15%, 99.77% 64.08%, 99.60% 69.01%, 99.74% 73.94%, 99.77% 78.87%, 99.73% 83.79%, 99.75% 88.72%, 99.77% 93.65%, 100.00% 98.58%, 96.36% 98.62%, 92.72% 98.60%, 89.09% 98.65%, 85.45% 98.69%, 81.81% 98.68%, 78.17% 98.69%, 74.54% 98.63%, 70.90% 98.63%, 67.26% 98.50%, 63.62% 98.77%, 59.99% 98.77%, 56.35% 98.99%, 52.71% 99.02%, 49.07% 98.99%, 45.44% 99.05%, 41.80% 98.86%, 38.16% 98.95%, 34.52% 99.09%, 30.89% 99.32%, 27.25% 99.27%, 23.61% 99.38%, 19.98% 99.44%, 16.34% 99.42%, 12.70% 99.50%, 9.06% 99.51%, 5.43% 99.73%, 1.79% 100.00%, 2.18% 95.04%, 1.98% 90.10%, 1.79% 85.15%, 1.57% 80.21%, 1.54% 75.27%, 1.41% 70.32%, 1.28% 65.38%, 1.20% 60.43%, 1.28% 55.48%, 1.02% 50.54%, 0.90% 45.60%, 0.99% 40.65%, 0.74% 35.71%, 0.60% 30.76%, 0.47% 25.82%, 0.41% 20.87%, 0.34% 15.93%); }
.crown-hero { z-index: 3; right: 18%; top: -28px; width: 52px; }
.cheers-art { position: absolute; z-index: 3; right: -20px; bottom: 0; width: 66%; aspect-ratio: 265 / 165; }
.starburst { right: 0; top: 0; width: 64%; }
.cheers-hands { left: 0; top: 4%; width: 100%; }

/* What to expect */
.expect { padding-top: 46px; }
.section-title { font-size: calc(64 * var(--m)); }
.strip-section { transform: rotate(-2deg); }
.burst-expect { right: 0; top: 36px; width: 40px; }
.expect-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px 10px; margin-top: 24px; }
.expect-grid li { display: flex; flex-direction: column; align-items: center; text-align: center; }
.splat-wrap { position: relative; width: calc(150 * var(--m)); aspect-ratio: 300 / 270; }
.splat { inset: 0; width: 100%; }
.icon { left: 50%; top: 50%; width: 56%; transform: translate(-50%, -50%); }
.burst-icon { width: 22%; }
.burst-icon-l { left: -16%; top: 26%; }
.burst-icon-tr { right: -14%; top: -10%; transform: rotate(130deg); }
.burst-icon-r { right: -16%; top: 26%; transform: scaleX(-1); }
.tag { display: flex; align-items: center; justify-content: center; width: min(100%, calc(150 * var(--m))); min-height: calc(58 * var(--m)); margin-top: -4px; padding: 8px 12px; background: var(--paper); font-weight: 700; font-size: calc(19 * var(--m)); line-height: 1.12; }
.tag-1 { clip-path: polygon(0.00% 3.03%, 3.70% 2.92%, 7.41% 2.92%, 11.11% 3.32%, 14.82% 4.10%, 18.52% 3.31%, 22.23% 3.60%, 25.93% 3.03%, 29.66% 8.42%, 33.36% 6.45%, 37.06% 5.64%, 40.76% 4.80%, 44.46% 4.08%, 48.17% 5.10%, 51.88% 6.66%, 55.57% 4.80%, 59.28% 5.30%, 62.97% 3.39%, 66.70% 7.17%, 70.40% 5.87%, 74.09% 4.24%, 77.79% 3.84%, 81.50% 3.44%, 85.20% 3.11%, 88.90% 3.29%, 92.61% 3.29%, 96.31% 1.89%, 100.00% 0.00%, 99.11% 9.03%, 99.16% 18.14%, 98.39% 27.18%, 98.49% 36.29%, 98.56% 45.39%, 98.74% 54.50%, 98.66% 63.60%, 98.26% 72.67%, 97.85% 81.74%, 98.17% 90.86%, 98.75% 100.00%, 95.01% 97.80%, 91.26% 97.76%, 87.52% 96.46%, 83.77% 95.77%, 80.01% 97.31%, 76.26% 98.09%, 72.53% 93.46%, 68.77% 95.36%, 65.01% 96.43%, 61.27% 95.45%, 57.52% 95.42%, 53.76% 96.75%, 50.02% 95.56%, 46.26% 95.68%, 42.51% 96.06%, 38.77% 95.14%, 35.01% 95.37%, 31.27% 94.87%, 27.53% 91.35%, 23.77% 93.01%, 20.02% 92.89%, 16.27% 92.91%, 12.52% 94.45%, 8.76% 94.61%, 5.02% 93.97%, 1.25% 96.97%, 1.70% 87.53%, 1.33% 78.16%, 3.33% 68.60%, 2.64% 59.25%, 2.47% 49.86%, 2.32% 40.46%, 2.00% 31.08%, 2.94% 21.61%, 2.11% 12.27%); transform: rotate(-1.5deg); }
.tag-2 { clip-path: polygon(1.25% 0.00%, 5.05% 0.18%, 8.83% 1.84%, 12.62% 3.00%, 16.43% 2.43%, 20.22% 3.05%, 24.02% 3.90%, 27.81% 4.40%, 31.61% 4.54%, 35.40% 5.61%, 39.20% 5.61%, 42.98% 7.92%, 46.79% 6.20%, 50.60% 5.26%, 54.40% 6.03%, 58.19% 6.93%, 62.00% 5.33%, 65.80% 4.79%, 69.59% 6.51%, 73.39% 6.80%, 77.19% 6.55%, 80.98% 7.33%, 84.78% 6.99%, 88.58% 7.83%, 92.38% 6.95%, 96.19% 6.45%, 100.00% 4.55%, 99.99% 13.22%, 97.86% 21.90%, 98.24% 30.58%, 97.36% 39.26%, 97.76% 47.93%, 97.93% 56.61%, 97.48% 65.29%, 97.69% 73.97%, 98.00% 82.64%, 98.68% 91.32%, 100.00% 100.00%, 96.34% 94.12%, 92.62% 96.47%, 88.91% 96.63%, 85.20% 97.60%, 81.49% 97.80%, 77.79% 97.46%, 74.10% 95.68%, 70.40% 95.44%, 66.69% 95.48%, 62.99% 95.22%, 59.28% 94.99%, 55.57% 96.14%, 51.88% 94.41%, 48.17% 95.19%, 44.46% 95.41%, 40.76% 94.36%, 37.06% 93.59%, 33.35% 95.00%, 29.64% 95.34%, 25.95% 93.77%, 22.25% 93.21%, 18.55% 92.39%, 14.83% 93.75%, 11.12% 94.17%, 7.43% 92.90%, 3.74% 90.53%, 0.00% 95.45%, 0.38% 86.80%, 2.91% 78.31%, 2.65% 69.60%, 2.20% 60.88%, 1.86% 52.17%, 2.94% 43.56%, 2.95% 34.88%, 2.47% 26.15%, 2.72% 17.49%, 3.53% 8.86%); transform: rotate(1deg); }
.tag-3 { clip-path: polygon(0.00% 0.00%, 3.80% 0.12%, 7.59% 1.78%, 11.38% 3.17%, 15.18% 2.83%, 18.98% 2.43%, 22.78% 2.26%, 26.57% 4.06%, 30.37% 4.61%, 34.16% 4.63%, 37.97% 3.67%, 41.76% 4.19%, 45.55% 6.38%, 49.36% 5.24%, 53.16% 4.70%, 56.95% 5.31%, 60.76% 4.10%, 64.56% 4.09%, 68.36% 3.99%, 72.15% 4.94%, 75.94% 6.07%, 79.74% 6.32%, 83.54% 5.86%, 87.34% 4.88%, 91.14% 5.95%, 94.93% 7.00%, 98.75% 3.03%, 97.97% 12.49%, 97.99% 21.90%, 97.76% 31.32%, 97.78% 40.72%, 98.27% 50.09%, 98.08% 59.50%, 97.58% 68.95%, 97.74% 78.34%, 98.48% 87.68%, 100.00% 96.97%, 96.31% 95.77%, 92.63% 94.87%, 88.94% 94.57%, 85.26% 93.98%, 81.59% 95.48%, 77.90% 94.66%, 74.23% 95.82%, 70.54% 95.26%, 66.86% 95.90%, 63.16% 91.84%, 59.49% 92.98%, 55.81% 94.39%, 52.14% 96.11%, 48.46% 95.48%, 44.78% 95.80%, 41.10% 96.66%, 37.42% 96.14%, 33.73% 96.08%, 30.06% 96.68%, 26.38% 96.94%, 22.70% 97.77%, 19.02% 98.00%, 15.33% 96.89%, 11.66% 97.95%, 7.98% 98.21%, 4.29% 97.84%, 0.63% 100.00%, 0.98% 90.89%, 1.13% 81.80%, 0.83% 72.71%, 1.14% 63.61%, 1.04% 54.52%, 1.04% 45.43%, 1.16% 36.33%, 1.15% 27.24%, 0.69% 18.16%, 1.19% 9.05%); transform: rotate(-.5deg); }
.expect-grid li:nth-child(4) .tag { transform: rotate(1.5deg); }

/* From past Joybreaks */
.gallery { padding-top: 56px; }
.zigzag-gallery { right: -6px; top: 30px; width: 84px; }
.gallery-intro { margin-top: 18px; font-weight: 700; font-size: calc(18 * var(--m)); line-height: 1.25; max-width: 30em; }
.gallery-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px 14px; margin-top: 22px; }
.snap figure { display: flex; flex-direction: column; height: 100%; padding: 7px 7px 0; background: var(--paper); transition: transform .2s ease; }
.snap picture { display: block; }
.snap img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.snap-3 img { object-position: 50% 35%; }
.snap figcaption { padding: 9px 3px 11px; font-weight: 700; font-size: calc(15 * var(--m)); line-height: 1.15; }
.snap-1 figure { transform: rotate(-2deg); }
.snap-2 figure { transform: rotate(1.5deg); }
.snap-3 figure { transform: rotate(-1deg); }
.snap-4 figure { transform: rotate(2deg); }
.snap-5 figure { transform: rotate(1.5deg); }
.snap-6 figure { transform: rotate(-2deg); }
.snap-7 figure { transform: rotate(1deg); }
.snap-8 figure { transform: rotate(-1.5deg); }
.snap figure:hover { transform: rotate(0deg) scale(1.04); }

/* How it works */
.how { margin-top: 64px; }
.how .deco { z-index: 2; }
.paper { position: relative; z-index: 1; padding: 34px 20px 38px; background: var(--paper); clip-path: polygon(0.00% 3.93%, 1.12% 3.89%, 2.25% 4.15%, 3.38% 4.67%, 4.50% 4.82%, 5.63% 5.22%, 6.75% 4.70%, 7.87% 4.82%, 8.99% 4.43%, 10.12% 4.11%, 11.24% 4.00%, 12.36% 4.24%, 13.49% 3.98%, 14.62% 6.48%, 15.74% 5.48%, 16.86% 4.48%, 17.99% 4.85%, 19.11% 4.70%, 20.23% 4.84%, 21.36% 4.41%, 22.48% 4.23%, 23.61% 5.16%, 24.73% 5.34%, 25.85% 5.07%, 26.98% 4.40%, 28.11% 5.66%, 29.23% 5.22%, 30.35% 5.03%, 31.47% 4.86%, 32.60% 5.80%, 33.72% 5.07%, 34.84% 4.76%, 35.97% 4.69%, 37.09% 4.26%, 38.21% 4.32%, 39.34% 4.77%, 40.46% 4.54%, 41.58% 4.24%, 42.70% 3.49%, 43.83% 3.69%, 44.95% 3.05%, 46.07% 2.99%, 47.19% 2.75%, 48.33% 5.00%, 49.46% 5.17%, 50.58% 4.34%, 51.70% 4.41%, 52.82% 4.13%, 53.95% 4.00%, 55.07% 3.83%, 56.19% 3.73%, 57.31% 3.47%, 58.44% 3.44%, 59.56% 3.22%, 60.68% 2.95%, 61.80% 2.61%, 62.93% 2.92%, 64.05% 2.52%, 65.18% 2.61%, 66.30% 3.01%, 67.42% 2.77%, 68.54% 2.10%, 69.68% 3.75%, 70.80% 3.18%, 71.92% 2.54%, 73.04% 1.87%, 74.16% 2.16%, 75.29% 1.98%, 76.41% 2.16%, 77.54% 2.38%, 78.66% 3.16%, 79.78% 2.31%, 80.91% 3.15%, 82.03% 2.20%, 83.16% 2.97%, 84.28% 2.68%, 85.40% 2.48%, 86.53% 1.96%, 87.65% 2.21%, 88.77% 2.14%, 89.90% 2.30%, 91.02% 2.32%, 92.15% 3.48%, 93.27% 2.18%, 94.39% 2.18%, 95.51% 1.64%, 96.64% 1.84%, 97.76% 1.20%, 98.88% 1.18%, 100.00% 0.00%, 99.95% 2.94%, 99.83% 5.88%, 99.55% 8.81%, 99.57% 11.75%, 99.33% 14.69%, 99.54% 17.63%, 99.46% 20.57%, 99.62% 23.52%, 99.01% 26.44%, 98.77% 29.37%, 98.93% 32.32%, 99.16% 35.27%, 99.23% 38.22%, 99.14% 41.15%, 99.06% 44.09%, 99.24% 47.04%, 99.29% 49.98%, 99.42% 52.93%, 99.19% 55.86%, 99.28% 58.81%, 99.26% 61.75%, 99.06% 64.68%, 99.22% 67.63%, 99.04% 70.57%, 99.04% 73.51%, 99.20% 76.46%, 99.17% 79.40%, 98.99% 82.33%, 98.75% 85.27%, 99.10% 88.22%, 98.91% 91.15%, 98.34% 94.08%, 98.81% 97.03%, 99.50% 100.00%, 98.38% 99.57%, 97.26% 97.79%, 96.13% 97.95%, 95.00% 97.90%, 93.87% 98.38%, 92.75% 97.57%, 91.62% 97.97%, 90.49% 98.71%, 89.37% 98.75%, 88.24% 99.04%, 87.11% 98.90%, 85.99% 98.67%, 84.86% 98.41%, 83.73% 98.73%, 82.61% 98.75%, 81.48% 98.08%, 80.36% 97.78%, 79.23% 97.90%, 78.10% 98.45%, 76.97% 98.79%, 75.85% 98.54%, 74.73% 96.14%, 73.60% 96.60%, 72.48% 96.29%, 71.35% 97.53%, 70.22% 98.03%, 69.10% 96.52%, 67.97% 96.21%, 66.84% 96.79%, 65.71% 97.48%, 64.58% 98.08%, 63.47% 95.82%, 62.34% 97.06%, 61.21% 97.68%, 60.08% 98.08%, 58.95% 97.49%, 57.83% 97.88%, 56.70% 97.36%, 55.58% 97.00%, 54.45% 97.02%, 53.32% 97.52%, 52.19% 97.82%, 51.07% 97.12%, 49.94% 97.02%, 48.82% 96.63%, 47.69% 96.87%, 46.56% 97.10%, 45.44% 97.05%, 44.32% 95.30%, 43.19% 96.54%, 42.06% 96.42%, 40.93% 97.01%, 39.80% 97.39%, 38.68% 97.14%, 37.55% 97.21%, 36.43% 96.66%, 35.30% 95.88%, 34.18% 96.22%, 33.05% 96.93%, 31.92% 96.54%, 30.80% 96.18%, 29.67% 96.60%, 28.54% 96.41%, 27.41% 96.54%, 26.29% 96.27%, 25.16% 96.50%, 24.04% 96.09%, 22.91% 96.55%, 21.79% 94.99%, 20.66% 96.08%, 19.53% 96.68%, 18.40% 96.80%, 17.27% 96.75%, 16.15% 96.51%, 15.02% 96.09%, 13.90% 96.33%, 12.77% 96.35%, 11.64% 96.20%, 10.52% 95.80%, 9.40% 95.11%, 8.27% 95.48%, 7.14% 95.62%, 6.01% 96.27%, 4.89% 96.02%, 3.76% 95.59%, 2.64% 94.53%, 1.51% 94.75%, 0.38% 97.05%, 1.40% 94.11%, 1.29% 91.20%, 1.10% 88.30%, 0.99% 85.39%, 0.88% 82.48%, 0.77% 79.58%, 1.40% 76.65%, 1.20% 73.75%, 1.10% 70.84%, 0.93% 67.93%, 1.06% 65.02%, 1.08% 62.11%, 1.31% 59.19%, 1.43% 56.28%, 1.03% 53.38%, 0.96% 50.47%, 0.85% 47.56%, 0.64% 44.66%, 0.65% 41.75%, 0.68% 38.84%, 0.47% 35.93%, 0.52% 33.02%, 0.52% 30.11%, 0.44% 27.20%, 0.29% 24.30%, 0.45% 21.38%, 0.30% 18.48%, 0.38% 15.56%, 0.85% 12.64%, 0.85% 9.73%, 0.73% 6.82%); }
.how-title { display: flex; align-items: center; gap: 10px; font-family: var(--display); font-weight: 900; font-stretch: 62%; font-size: calc(66 * var(--m)); line-height: .88; letter-spacing: -.03em; transform: rotate(-1.5deg); }
.burst-how { position: static; width: 30px; transform: scaleX(-1); }
.steps { display: grid; justify-items: center; gap: 66px; margin-top: 28px; }
.steps li { position: relative; display: flex; flex-direction: column; align-items: center; width: min(100%, 240px); }
.step-top { display: flex; align-items: center; gap: 14px; }
.num { display: grid; place-items: center; width: calc(70 * var(--m)); aspect-ratio: 1; border-radius: 50%; font-family: var(--display); font-weight: 900; font-stretch: 62%; font-size: calc(46 * var(--m)); line-height: 1; }
.num-pink { background: var(--pink); }
.num-mint { background: var(--mint); }
.num-blue { background: var(--blue); }
.step-icon { position: static; width: calc(62 * var(--m)); }
.step-tag { display: flex; align-items: center; justify-content: center; width: 100%; min-height: 54px; margin-top: 10px; padding: 8px 16px; background: var(--paper-grey); clip-path: polygon(0.00% 4.84%, 3.85% 4.65%, 7.72% 8.54%, 11.55% 6.83%, 15.40% 6.13%, 19.24% 6.08%, 23.08% 5.12%, 26.94% 5.88%, 30.79% 6.39%, 34.63% 6.00%, 38.48% 5.53%, 42.32% 4.20%, 46.16% 3.79%, 50.01% 4.40%, 53.86% 3.82%, 57.70% 3.28%, 61.55% 3.02%, 65.41% 5.79%, 69.25% 4.68%, 73.09% 3.52%, 76.94% 3.25%, 80.79% 3.88%, 84.64% 5.23%, 88.48% 3.81%, 92.32% 2.56%, 96.17% 2.57%, 100.00% 0.00%, 99.37% 11.06%, 98.96% 22.15%, 98.88% 33.26%, 97.65% 44.27%, 97.83% 55.41%, 97.95% 66.54%, 98.08% 77.68%, 98.36% 88.83%, 98.89% 100.00%, 94.98% 98.27%, 91.08% 97.32%, 87.17% 95.67%, 83.25% 96.94%, 79.34% 96.67%, 75.43% 97.17%, 71.52% 97.85%, 67.60% 98.09%, 63.70% 96.62%, 59.79% 96.85%, 55.87% 97.31%, 51.96% 97.64%, 48.05% 97.51%, 44.14% 97.10%, 40.23% 96.38%, 36.32% 95.49%, 32.41% 95.08%, 28.50% 95.09%, 24.59% 95.47%, 20.68% 93.73%, 16.77% 93.57%, 12.86% 93.50%, 8.95% 93.83%, 5.03% 93.64%, 1.11% 96.77%, 1.47% 85.23%, 1.35% 73.74%, 1.55% 62.21%, 2.05% 50.65%, 1.63% 39.19%, 1.24% 27.72%, 0.68% 16.28%); font-weight: 700; font-size: calc(18 * var(--m)); line-height: 1.15; text-align: center; }
.steps li:not(:last-child)::after { content: ""; position: absolute; left: 50%; bottom: -45px; width: 50px; height: 22px; background: url("/assets/svg/deco/arrow-ink.svg") center / contain no-repeat; transform: translateX(-50%) rotate(90deg); }
.swash-pink { left: -26px; top: 120px; width: 60px; }
.zigzag-how-tr { right: -8px; top: -20px; width: 92px; }
.zigzag-how-bl { left: -10px; bottom: -24px; width: 84px; }
.swash-blue-how { right: -36px; bottom: -34px; width: 90px; }

/* Closing */
.closing { padding: 60px 0 20px; }
.closing-copy { position: relative; z-index: 2; }
.closing-title { display: flex; flex-direction: column; align-items: flex-start; font-size: calc(60 * var(--m)); }
.strip-close-a { position: relative; z-index: 2; transform: rotate(-2.5deg); }
.strip-close-b { margin: -4px 0 0 calc(18 * var(--m)); transform: rotate(-2deg); }
.burst-close { left: calc(236 * var(--m)); top: calc(70 * var(--m)); width: 34px; }
.heart { left: calc(272 * var(--m)); top: calc(78 * var(--m)); width: 26px; }
.closing-cta { position: relative; margin-top: 26px; }
.btn-wide { min-height: 56px; padding: 8px 16px; font-size: calc(19 * var(--m)); }
.burst-close-cta { left: -14px; top: -16px; width: 24px; }
.closing-art { position: relative; height: calc(230 * var(--m)); margin-top: 16px; }
.martini { right: 6%; top: calc(20 * var(--m)); width: calc(200 * var(--m)); }
.zigzag-orange { left: 0; bottom: calc(20 * var(--m)); width: 72%; }
.burst-martini { right: 30%; top: -6px; width: calc(70 * var(--m)); }

/* Footer */
.site-footer { padding: 18px 0 34px; border-top: 2px solid var(--ink); font-weight: 500; font-size: 15px; }
.site-footer a { font-weight: 700; }

/* Wide screens: the comp, in comp units */
@media (min-width: 760px) {
  .wrap { width: calc(850 * var(--u)); }
  .header-inner { width: calc(774 * var(--u)); padding: calc(19 * var(--u)) 0 calc(12 * var(--u)); border-bottom-width: max(2px, calc(2 * var(--u))); }
  .brand .wordmark { height: calc(37 * var(--u)); }
  .header-cta { gap: calc(13 * var(--u)); }
  .burst-header { width: calc(36 * var(--u)); }
  .btn-header { min-height: 0; width: calc(105 * var(--u)); height: calc(38 * var(--u)); padding: 0; font-size: calc(21 * var(--u)); }

  .hero { min-height: calc(772 * var(--u)); padding-top: 0; }
  .hero-copy { width: calc(560 * var(--u)); padding-top: calc(38 * var(--u)); }
  .hero-title { margin-left: calc(21 * var(--u)); font-size: calc(131 * var(--u)); }
  .strip-take { margin-left: 0; }
  .strip-mark { margin: calc(-12 * var(--u)) 0 0 calc(-2 * var(--u)); padding: calc(12 * var(--u)) calc(12 * var(--u)) calc(14 * var(--u)) calc(18 * var(--u)); }
  .wordmark-hero { width: calc(486 * var(--u)); }
  .strip-today { margin: calc(-14 * var(--u)) 0 0 calc(92 * var(--u)); }
  .strip-take, .strip-today { padding: .07em .13em .03em; }
  .burst-h1 { left: 0; top: calc(22 * var(--u)); width: calc(85 * var(--u)); }
  .burst-h2 { left: calc(322 * var(--u)); top: calc(84 * var(--u)); width: calc(44 * var(--u)); }
  .burst-h3 { left: calc(40 * var(--u)); top: calc(305 * var(--u)); width: calc(74 * var(--u)); }
  .lede { margin: calc(16 * var(--u)) 0 0 calc(37 * var(--u)); max-width: calc(372 * var(--u)); font-size: calc(24.3 * var(--u)); line-height: 1.17; }
  .cta-stack { width: calc(324 * var(--u)); gap: calc(16 * var(--u)); margin: calc(29 * var(--u)) 0 0 calc(40 * var(--u)); }
  .btn-block { min-height: 0; height: calc(57 * var(--u)); padding: 0; font-size: calc(23 * var(--u)); border-width: max(2px, calc(2.5 * var(--u))); }
  .burst-cta-l { left: calc(-34 * var(--u)); top: 0; width: calc(38 * var(--u)); }
  .burst-cta-r { left: calc(332 * var(--u)); right: auto; top: calc(38 * var(--u)); width: calc(40 * var(--u)); }
  .proof { margin: calc(26 * var(--u)) 0 0 calc(40 * var(--u)); font-size: calc(19 * var(--u)); }
  .squiggle-hero { width: calc(210 * var(--u)); margin: calc(6 * var(--u)) 0 0 calc(35 * var(--u)); }
  .hero-media { position: absolute; inset: 0; z-index: 1; margin: 0; padding: 0; }
  .photo-main { position: absolute; left: calc(390 * var(--u)); top: calc(22 * var(--u)); width: calc(452 * var(--u)); height: calc(405 * var(--u)); aspect-ratio: auto; padding: calc(9 * var(--u)); }
  .photo-second { position: absolute; left: calc(422 * var(--u)); top: calc(425 * var(--u)); width: calc(409 * var(--u)); height: calc(300 * var(--u)); aspect-ratio: auto; margin: 0; padding: calc(9 * var(--u)); }
  .crown-hero { left: calc(722 * var(--u)); right: auto; top: calc(4 * var(--u)); width: calc(56 * var(--u)); }
  .cheers-art { left: calc(572 * var(--u)); right: auto; top: calc(640 * var(--u)); bottom: auto; width: calc(285 * var(--u)); height: calc(220 * var(--u)); aspect-ratio: auto; }
  .starburst { left: calc(92 * var(--u)); right: auto; top: 0; width: calc(200 * var(--u)); }
  .cheers-hands { left: 0; top: calc(48 * var(--u)); width: calc(285 * var(--u)); }

  .expect { padding: calc(10 * var(--u)) 0 0 calc(22 * var(--u)); }
  .section-title { margin-left: calc(12 * var(--u)); font-size: calc(108 * var(--u)); }
  .burst-expect { left: calc(608 * var(--u)); right: auto; top: calc(36 * var(--u)); width: calc(70 * var(--u)); }
  .expect-grid { grid-template-columns: repeat(4, calc(207 * var(--u))); gap: 0; margin: calc(-14 * var(--u)) 0 0 calc(-6 * var(--u)); }
  .splat-wrap { width: calc(205 * var(--u)); }
  .icon { width: 47%; }
  .tag { width: calc(162 * var(--u)); min-height: calc(62 * var(--u)); margin-top: calc(-34 * var(--u)); padding: calc(8 * var(--u)) calc(12 * var(--u)); font-size: calc(25.5 * var(--u)); }

  .gallery { padding: calc(64 * var(--u)) calc(30 * var(--u)) 0; --gw: min(calc(var(--vw) - 48px), 1320px); }
  .zigzag-gallery { left: calc(660 * var(--u)); right: auto; top: calc(86 * var(--u)); width: calc(120 * var(--u)); }
  .gallery-intro { margin: calc(18 * var(--u)) 0 0 calc(8 * var(--u)); max-width: calc(640 * var(--u)); font-size: calc(23 * var(--u)); }
  .gallery .section-title { margin-left: calc(4 * var(--u)); }
  .gallery-grid { grid-template-columns: repeat(4, 1fr); gap: calc(28 * var(--u)) calc(24 * var(--u)); width: var(--gw); margin: calc(32 * var(--u)) 0 0 calc((100% - var(--gw)) / 2); }
  .snap figure { padding: calc(7 * var(--u)) calc(7 * var(--u)) 0; }
  .snap figure { padding: max(7px, calc(8 * var(--u))) max(7px, calc(8 * var(--u))) 0; }
  .snap figcaption { padding: calc(11 * var(--u)) calc(4 * var(--u)) calc(13 * var(--u)); font-size: max(15px, calc(17 * var(--u))); }

  .how { margin-top: 0; padding-top: calc(40 * var(--u)); }
  .paper { width: calc(800 * var(--u)); min-height: calc(305 * var(--u)); margin-left: calc(25 * var(--u)); padding: calc(26 * var(--u)) calc(33 * var(--u)) calc(20 * var(--u)) calc(47 * var(--u)); }
  .how-title { gap: calc(16 * var(--u)); margin-left: calc(16 * var(--u)); font-size: calc(113 * var(--u)); }
  .burst-how { width: calc(38 * var(--u)); }
  .steps { grid-template-columns: repeat(3, calc(180 * var(--u))); justify-items: stretch; column-gap: calc(90 * var(--u)); margin-top: calc(24 * var(--u)); }
  .steps li { width: auto; }
  .step-top { gap: calc(14 * var(--u)); }
  .num { width: calc(78 * var(--u)); font-size: calc(52 * var(--u)); }
  .step-icon { width: calc(76 * var(--u)); }
  .step-tag { min-height: calc(60 * var(--u)); margin-top: calc(10 * var(--u)); padding: calc(8 * var(--u)) calc(18 * var(--u)); font-size: calc(22 * var(--u)); }
  .steps li:not(:last-child)::after { left: calc(100% + calc(12 * var(--u))); top: calc(28 * var(--u)); bottom: auto; width: calc(65 * var(--u)); height: calc(24 * var(--u)); transform: none; }
  .swash-pink { left: calc(10 * var(--u)); top: calc(180 * var(--u)); width: calc(62 * var(--u)); }
  .zigzag-how-tr { left: calc(705 * var(--u)); right: auto; top: calc(52 * var(--u)); width: calc(125 * var(--u)); }
  .zigzag-how-bl { left: calc(12 * var(--u)); bottom: auto; top: calc(318 * var(--u)); width: calc(150 * var(--u)); }
  .swash-blue-how { left: calc(788 * var(--u)); right: auto; bottom: auto; top: calc(330 * var(--u)); width: calc(95 * var(--u)); }

  .closing { min-height: calc(330 * var(--u)); padding: calc(12 * var(--u)) 0 calc(50 * var(--u)) calc(27 * var(--u)); }
  .closing-title { font-size: calc(100 * var(--u)); }
  .strip-close-b { margin: calc(-14 * var(--u)) 0 0 calc(25 * var(--u)); }
  .closing-title .strip { padding-top: .08em; padding-bottom: .1em; }
  .burst-close { left: calc(352 * var(--u)); top: calc(128 * var(--u)); width: calc(56 * var(--u)); }
  .heart { left: calc(405 * var(--u)); top: calc(118 * var(--u)); width: calc(34 * var(--u)); }
  .closing-cta { width: calc(296 * var(--u)); margin: calc(18 * var(--u)) 0 0 calc(48 * var(--u)); }
  .btn-wide { min-height: 0; height: calc(58 * var(--u)); padding: 0; font-size: calc(22 * var(--u)); border-width: max(2px, calc(2.5 * var(--u))); }
  .burst-close-cta { left: calc(-48 * var(--u)); top: calc(-18 * var(--u)); width: calc(35 * var(--u)); }
  .closing-art { position: absolute; left: calc(440 * var(--u)); top: 0; width: calc(410 * var(--u)); height: calc(310 * var(--u)); margin: 0; }
  .martini { left: calc(140 * var(--u)); right: auto; top: calc(40 * var(--u)); width: calc(240 * var(--u)); }
  .zigzag-orange { left: calc(12 * var(--u)); bottom: auto; top: calc(155 * var(--u)); width: calc(363 * var(--u)); }
  .burst-martini { left: calc(165 * var(--u)); right: auto; top: 0; width: calc(100 * var(--u)); }

  .site-footer { width: calc(774 * var(--u)); padding: calc(16 * var(--u)) 0 calc(30 * var(--u)); font-size: max(14px, calc(16 * var(--u))); }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; }
  .btn:hover, .snap figure:hover { transform: none; }
}