@import url("https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap");
@font-face { font-family: "PP Eiko"; src: url("/fonts/pp-eiko/PPEiko-Black.woff2") format("woff2"); font-weight: 900; font-style: normal; font-display: swap; }
@font-face { font-family: "PP Eiko"; src: url("/fonts/pp-eiko/PPEiko-BlackItalic.woff2") format("woff2"); font-weight: 900; font-style: italic; font-display: swap; }
@font-face { font-family: "PP Eiko"; src: url("/fonts/pp-eiko/PPEiko-Heavy.woff2") format("woff2"); font-weight: 800; font-style: normal; font-display: swap; }
@font-face { font-family: "PP Eiko"; src: url("/fonts/pp-eiko/PPEiko-Light.woff2") format("woff2"); font-weight: 300; font-style: normal; font-display: swap; }
@font-face { font-family: "PP Eiko"; src: url("/fonts/pp-eiko/PPEiko-LightItalic.woff2") format("woff2"); font-weight: 300; font-style: italic; font-display: swap; }
@font-face { font-family: "PP Eiko"; src: url("/fonts/pp-eiko/PPEiko-Medium.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "PP Eiko"; src: url("/fonts/pp-eiko/PPEiko-MediumItalic.woff2") format("woff2"); font-weight: 500; font-style: italic; font-display: swap; }
@font-face { font-family: "PP Eiko"; src: url("/fonts/pp-eiko/PPEiko-Regular.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "PP Eiko"; src: url("/fonts/pp-eiko/PPEiko-Thin.woff2") format("woff2"); font-weight: 100; font-style: normal; font-display: swap; }
@font-face { font-family: "PP Eiko"; src: url("/fonts/pp-eiko/PPEiko-ThinItalic.woff2") format("woff2"); font-weight: 100; font-style: italic; font-display: swap; }
:root {
  --fluid-min-width: 320;
  --fluid-max-width: 1240;
  --fluid-screen: 100vw;
  --fluid-bp: calc((var(--fluid-screen) - var(--fluid-min-width) * 1px) / (var(--fluid-max-width) - var(--fluid-min-width)));
  --f-xs: calc(9.72px + 3.08 * var(--fluid-bp));
  --f-sm: calc(11.67px + 4.33 * var(--fluid-bp));
  --f-base: calc(14px + 6 * var(--fluid-bp));
  --f-lg: calc(16.8px + 8.2 * var(--fluid-bp));
  --f-xl: calc(20.16px + 11.09 * var(--fluid-bp));
  --f-2xl: calc(24.19px + 14.87 * var(--fluid-bp));
  --f-3xl: calc(29.03px + 19.8 * var(--fluid-bp));
  --f-4xl: calc(34.84px + 26.2 * var(--fluid-bp));
  --s-3xs: calc(3.5px + 1.5 * var(--fluid-bp));
  --s-2xs: calc(7px + 3 * var(--fluid-bp));
  --s-xs: calc(10.5px + 4.5 * var(--fluid-bp));
  --s-sm: calc(14px + 6 * var(--fluid-bp));
  --s-md: calc(21px + 9 * var(--fluid-bp));
  --s-lg: calc(28px + 12 * var(--fluid-bp));
  --s-xl: calc(42px + 18 * var(--fluid-bp));
  --leading: 1.4;
  --rhythm-step: calc(1rlh / 1);
  --columns: 12;
  --grid-template: [c1] minmax(0, 1fr) [c2] minmax(0, 1fr) [c3] minmax(0, 1fr) [c4] minmax(0, 1fr) [c5] minmax(0, 1fr) [c6] minmax(0, 1fr) [c7] minmax(0, 1fr) [c8] minmax(0, 1fr) [c9] minmax(0, 1fr) [c10] minmax(0, 1fr) [c11] minmax(0, 1fr) [c12] minmax(0, 1fr) [c13];
  --gap: calc(14px + 10 * var(--fluid-bp));
  --font-text: "Inter", ui-sans-serif, system-ui, sans-serif;
  --font-display: "PP Eiko", ui-serif, Georgia, serif;
  --color-paper: #fafafa;
  --color-ink: #18181b;
  --color-link: #3730a3;
  --color-link-underline: #c7d2fe;
  --color-link-hover: #818cf8;
  --color-surface: #f4f4f5;
}
@media (min-width: 1240px) {
  :root { --fluid-screen: calc(var(--fluid-max-width) * 1px); }
}
[data-el="page"] { padding-block-start: calc(1 * 1rlh); padding-block-end: calc(3 * 1rlh); }
[data-el="header-name"] { font-weight: 700; }
:is([data-el="header-name"], [data-el="header-name"] a) { color: var(--color-ink); text-decoration-line: none; }
[data-el="content"] { grid-column: c1 / c13; padding-block-start: calc(4 * 1rlh); }
[data-el="title"] { font-family: var(--font-display); font-size: var(--f-3xl); font-weight: 700; line-height: round(up, 1.05em, calc(1rlh / 1)); text-wrap: balance; grid-column: c3 / c11; padding-block-end: calc(2 * 1rlh); }
[data-el="take-text"] { text-wrap: pretty; align-self: first baseline; grid-column: c3 / c11; }
[data-el="take"] { grid-column: c2 / c11; }
:is([data-el="take"]:target, :target [data-el="take"]) { --fill-bg: var(--color-surface); --fill-radius: 6px; }
[data-el="takes"] { grid-column: c2 / c12; row-gap: calc(1 * 1rlh); }
[data-el="take-number"] { font-size: var(--f-sm); line-height: round(up, 1.4em, calc(1rlh / 1)); text-align: end; align-self: first baseline; grid-column: c2 / c3; }
:is([data-el="take-number"]:target, :target [data-el="take-number"]) { font-weight: 600; }
:is(:is([data-el="take-number"]:target, :target [data-el="take-number"]), :is([data-el="take-number"]:target, :target [data-el="take-number"]) a) { color: var(--color-ink); text-decoration-line: none; }
[data-el="header"] { font-size: var(--f-sm); line-height: round(up, 1.4em, calc(1rlh / 1)); grid-column: c3 / c11; }
[data-el="home-questions"] { grid-column: c3 / c11; row-gap: calc(2 * 1rlh); }
[data-el="home-question"] { font-family: var(--font-display); font-size: var(--f-3xl); font-weight: 500; line-height: round(up, 1.05em, calc(1rlh / 1)); text-wrap: balance; grid-column: c3 / c11; }
[data-el="header-tagline"] { font-family: var(--font-display); font-weight: 500; }
[data-el="header-title"] { grid-column: c3 / c9; }
[data-el="header-about"] { text-align: end; grid-column: c9 / c11; }
[data-el="page-text"] { text-wrap: pretty; grid-column: c3 / c11; }