@layer reset, tokens, brand, base, layout, components, page, utilities;

@font-face {
  font-family: "Switzer";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/switzer-regular.aefa3d21af.woff2") format("woff2");
}

@font-face {
  font-family: "Switzer";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/assets/fonts/switzer-medium.2ea341e35c.woff2") format("woff2");
}

@font-face {
  font-family: "Switzer Fallback";
  font-weight: 400;
  src: local("Arial"), local("Liberation Sans"), local("Arimo");
  ascent-override: 98%;
  descent-override: 25%;
  line-gap-override: 9%;
}

@font-face {
  font-family: "Switzer Fallback";
  font-weight: 500;
  src: local("Arial"), local("Liberation Sans"), local("Arimo");
  size-adjust: 102%;
  ascent-override: 96.08%;
  descent-override: 24.51%;
  line-gap-override: 8.82%;
}

@property --fndn-header-ink {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}

@property --fndn-header-rule {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}

@property --fndn-sky-top {
  syntax: "<length>";
  inherits: true;
  initial-value: 0px;
}

@property --fndn-sky-bottom {
  syntax: "<length>";
  inherits: true;
  initial-value: 0px;
}

@layer reset {
  *,
  *::before,
  *::after {
    box-sizing: border-box;
  }

  * {
    margin: 0;
  }

  html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
  }

  ul,
  ol {
    padding: 0;
    list-style: none;
  }

  svg {
    display: block;
  }

  address {
    font-style: normal;
  }

  [hidden]:not([data-fndn-reveal]) {
    display: none !important;
  }
}

@layer tokens {
  :root {
    color-scheme: light;

    --fndn-color-page: Canvas;
    --fndn-color-on-page: CanvasText;
    --fndn-color-on-page-muted: color-mix(in srgb, CanvasText 70%, Canvas);
    --fndn-color-on-page-rgb: 0 0 0;
    --fndn-color-selection: Highlight;
    --fndn-color-on-selection: HighlightText;
    --fndn-color-accent: LinkText;
    --fndn-color-accent-rgb: 0 0 238;
    --fndn-color-line: GrayText;
    --fndn-color-line-rgb: 128 128 128;
    --fndn-color-frost: Canvas;
    --fndn-color-focus-ring: CanvasText;
    --fndn-color-focus-halo: Canvas;
    --fndn-color-text: CanvasText;
    --fndn-color-text-muted: color-mix(in srgb, CanvasText 70%, Canvas);
    --fndn-color-rule: GrayText;
    --fndn-color-guide: transparent;
    --fndn-color-mark: GrayText;
    --fndn-color-sun: transparent;

    --fndn-sky-zenith: Canvas;
    --fndn-sky-high: Canvas;
    --fndn-sky-mid: Canvas;
    --fndn-sky-horizon: Canvas;
    --fndn-sky-text: CanvasText;
    --fndn-sky-text-muted: color-mix(in srgb, CanvasText 70%, Canvas);
    --fndn-sky-text-rgb: 0 0 0;
    --fndn-glow-core-rgb: 255 255 255;
    --fndn-glow-warm-rgb: 255 255 255;
    --fndn-glow-soft-rgb: 255 255 255;
    --fndn-glow-pale-rgb: 255 255 255;
    --fndn-haze-tint-rgb: 255 255 255;
    --fndn-haze-light-rgb: 255 255 255;
    --fndn-haze-rgb: 255 255 255;
    --fndn-dawn-top: Canvas;
    --fndn-dawn-high: Canvas;
    --fndn-dawn-mid: Canvas;
    --fndn-dawn-low: Canvas;
    --fndn-dawn-warmth-rgb: 255 255 255;
    --fndn-print-text: CanvasText;
    --fndn-print-text-muted: GrayText;
    --fndn-print-rule: GrayText;
    --fndn-print-page: Canvas;

    --fndn-font-body: system-ui, sans-serif;
    --fndn-font-heading: system-ui, sans-serif;
    --fndn-weight-body: 400;
    --fndn-weight-heading: 600;
    --fndn-weight-strong: 600;
    --fndn-grain: none;
    --fndn-grain-size: auto;
    --fndn-grain-opacity: 0;
    --fndn-clouds: none;
    --fndn-clouds-opacity: 0;

    --fndn-font-cap-height: 0.68;
    --fndn-font-cap-offset: 0.315;
    --fndn-font-descent-offset: 0.365;

    --fndn-size-1: 0.25rem;
    --fndn-size-1-5: 0.375rem;
    --fndn-size-2: 0.5rem;
    --fndn-size-2-5: 0.625rem;
    --fndn-size-3: 0.75rem;
    --fndn-size-3-5: 0.875rem;
    --fndn-size-4: 1rem;
    --fndn-size-5: 1.25rem;
    --fndn-size-6: 1.5rem;
    --fndn-size-8: 2rem;
    --fndn-size-10: 2.5rem;
    --fndn-size-11: 2.75rem;
    --fndn-size-12: 3rem;
    --fndn-size-14: 3.5rem;
    --fndn-size-16: 4rem;
    --fndn-size-18: 4.5rem;
    --fndn-size-20: 5rem;
    --fndn-size-22: 5.5rem;
    --fndn-size-24: 6rem;
    --fndn-size-30: 7.5rem;
    --fndn-size-32: 8rem;
    --fndn-size-50: 12.5rem;

    --fndn-ease-emphasized: cubic-bezier(0.2, 0, 0, 1);
    --fndn-ease-enter: cubic-bezier(0.05, 0.7, 0.1, 1);
    --fndn-ease-exit: cubic-bezier(0.4, 0, 1, 1);
    --fndn-ease-entrance: cubic-bezier(0.16, 1, 0.3, 1);
    --fndn-duration-quick: 150ms;
    --fndn-duration-base: 240ms;
    --fndn-duration-slide: 480ms;
    --fndn-duration-fill: 420ms;
    --fndn-duration-fade: 280ms;
    --fndn-delay-follow: 60ms;

    --fndn-menu-in: 380ms;
    --fndn-menu-out: 280ms;
    --fndn-menu-out-delay: 80ms;
    --fndn-menu-item-in: 560ms;
    --fndn-menu-item-out: 120ms;
    --fndn-menu-item-delay: 180ms;
    --fndn-menu-item-stagger: 35ms;
    --fndn-menu-item-rise: var(--fndn-size-3);

    --fndn-entrance-glow: 3.2s;
    --fndn-entrance-glow-delay: 0s;
    --fndn-entrance-clouds: 3.6s;
    --fndn-entrance-clouds-delay: 0.4s;

    --fndn-layer-backdrop: -1;
    --fndn-layer-scene: 0;
    --fndn-layer-guides: 1;
    --fndn-layer-content: 2;
    --fndn-layer-overlay: 3;
    --fndn-layer-header: 10;
    --fndn-layer-skip: 30;

    --fndn-text-body: 0.9375rem;
    --fndn-leading-body: 1.5rem;
    --fndn-leading-prose: 1.375rem;
    --fndn-text-title: clamp(1.5rem, 1.3144rem + 0.762vw, 2rem);
    --fndn-leading-title: clamp(2rem, 1.8144rem + 0.762vw, 2.5rem);
    --fndn-tracking-title: -0.015em;
    --fndn-text-display: clamp(3rem, 2.6288rem + 1.524vw, 4rem);
    --fndn-leading-display: clamp(3.25rem, 2.9713rem + 1.143vw, 4rem);
    --fndn-tracking-display: -0.03em;
    --fndn-text-menu: var(--fndn-size-8);
    --fndn-leading-menu: var(--fndn-size-10);
    --fndn-body-cap: calc(var(--fndn-leading-body) / 2 - var(--fndn-font-cap-offset) * var(--fndn-text-body));
    --fndn-body-descent: calc(var(--fndn-leading-body) / 2 - var(--fndn-font-descent-offset) * var(--fndn-text-body));
    --fndn-title-cap: calc(var(--fndn-leading-title) / 2 - var(--fndn-font-cap-offset) * var(--fndn-text-title));
    --fndn-title-descent: calc(var(--fndn-leading-title) / 2 - var(--fndn-font-descent-offset) * var(--fndn-text-title));
    --fndn-display-cap: calc(var(--fndn-leading-display) / 2 - var(--fndn-font-cap-offset) * var(--fndn-text-display));
    --fndn-display-descent: calc(var(--fndn-leading-display) / 2 - var(--fndn-font-descent-offset) * var(--fndn-text-display));

    --fndn-safe-top: env(safe-area-inset-top, 0px);
    --fndn-safe-inline: max(env(safe-area-inset-left, 0px), env(safe-area-inset-right, 0px));
    --fndn-grid-columns: 12;
    --fndn-grid-gutter: var(--fndn-size-8);
    --fndn-grid-width: min(100rem, 76%, 100% - 2 * (var(--fndn-safe-inline) + var(--fndn-size-6)));
    --fndn-grid-margin: calc((100% - var(--fndn-grid-width)) / 2);
    --fndn-grid-column: calc((var(--fndn-grid-width) - (var(--fndn-grid-columns) - 1) * var(--fndn-grid-gutter)) / var(--fndn-grid-columns));
    --fndn-grid-step: calc(var(--fndn-grid-column) + var(--fndn-grid-gutter));
    --fndn-hang: var(--fndn-size-30);

    --fndn-viewport-height: 100svh;
    --fndn-header-height: var(--fndn-size-18);
    --fndn-target-size: var(--fndn-size-12);
    --fndn-stroke-hairline: 1px;
    --fndn-scroll-threshold: 1px;
    --fndn-focus-width: 2px;
    --fndn-focus-offset: 2px;
    --fndn-focus-halo: 4px;
    --fndn-frost-blur: 14px;
    --fndn-frost-saturate: 1.15;
    --fndn-frost-opacity: 84%;
    --fndn-mark-size: 11px;
    --fndn-ruler-offset: calc(var(--fndn-size-2) + var(--fndn-stroke-hairline));
    --fndn-measure: 30rem;
    --fndn-icon-arrow-right: url("/assets/icons/arrow-right.2f3cef6174.svg");
    --fndn-icon-arrow-up-right: url("/assets/icons/arrow-up-right.e33d568690.svg");
    --fndn-icon-arrow-left: url("/assets/icons/arrow-left.858562a4cd.svg");
    --fndn-icon-email: url("/assets/icons/email.7a5929200b.svg");
    --fndn-icon-github: url("/assets/icons/github.6d4af85f2b.svg");
    --fndn-icon-linkedin: url("/assets/icons/linkedin.2d94efa0c6.svg");
    --fndn-icon-resume: url("/assets/icons/resume.2b788ee5b4.svg");
    --fndn-target-minimum: var(--fndn-size-11);
    --fndn-icon-line: 1.5px;
    --fndn-icon-gap: 6px;
    --fndn-space-kicker: var(--fndn-size-12);
    --fndn-space-meta: var(--fndn-size-24);
    --fndn-space-section: var(--fndn-size-32);
    --fndn-space-title: var(--fndn-size-10);
    --fndn-space-row: var(--fndn-size-10);
    --fndn-space-intro: var(--fndn-size-16);
    --fndn-space-columns: var(--fndn-size-16);
    --fndn-space-page-top: max(var(--fndn-size-16), var(--fndn-viewport-height) * 0.111);
    --fndn-space-footer-top: var(--fndn-size-16);
    --fndn-space-footer: var(--fndn-size-10);
    --fndn-space-footer-bar: auto;
    --fndn-footer-min-height: 25rem;
    --fndn-headline-extra-lines: 0;

  }

  @media (width < 48rem) {
    :root {
      --fndn-text-body: 1rem;
      --fndn-leading-prose: 1.5rem;
      --fndn-grid-columns: 4;
      --fndn-grid-gutter: var(--fndn-size-6);
      --fndn-grid-width: calc(100% - 2 * max(var(--fndn-size-6), var(--fndn-safe-inline)));
      --fndn-space-kicker: var(--fndn-size-8);
      --fndn-space-section: var(--fndn-size-20);
      --fndn-space-title: var(--fndn-size-8);
      --fndn-space-row: var(--fndn-size-8);
      --fndn-space-intro: var(--fndn-size-10);
      --fndn-space-columns: var(--fndn-size-12);
      --fndn-space-page-top: calc(var(--fndn-viewport-height) * 0.111);
      --fndn-space-footer-top: var(--fndn-size-12);
      --fndn-space-footer: var(--fndn-size-8);
      --fndn-space-footer-bar: var(--fndn-size-50);
      --fndn-footer-min-height: 0;
      --fndn-headline-extra-lines: 1;
    }
  }
}

@layer brand {
  :root {
    --fndn-palette-paper: #ededea;
    --fndn-palette-daylight-rgb: 248 248 245;
    --fndn-palette-daylight: rgb(var(--fndn-palette-daylight-rgb));
    --fndn-palette-ink-rgb: 12 16 18;
    --fndn-palette-ink: rgb(var(--fndn-palette-ink-rgb));
    --fndn-palette-stone: #5d6565;
    --fndn-palette-mist: #cad4d6;
    --fndn-palette-orange-rgb: 250 95 5;
    --fndn-palette-orange: rgb(var(--fndn-palette-orange-rgb));
    --fndn-palette-night: #0a1d29;
    --fndn-palette-night-high: #163542;
    --fndn-palette-dusk: #20424e;
    --fndn-palette-horizon: #6e8586;
    --fndn-palette-dawn-high: #e0e3e1;
    --fndn-palette-dawn-mid: #e1e5df;
    --fndn-palette-dawn-low: #f0e3d2;
    --fndn-palette-line-soft-rgb: 198 202 200;
    --fndn-palette-line-soft: rgb(var(--fndn-palette-line-soft-rgb));
    --fndn-palette-print-ink: #000;
    --fndn-palette-print-muted: #333;
    --fndn-palette-print-rule: #999;
    --fndn-palette-print-paper: #fff;
    --fndn-palette-ember-rgb: 246 138 76;
    --fndn-palette-peach-rgb: 243 180 138;
    --fndn-palette-glow-rgb: 243 217 186;
    --fndn-palette-haze-rgb: 89 124 128;
    --fndn-palette-violet-rgb: 176 140 168;

    --fndn-color-page: var(--fndn-palette-paper);
    --fndn-color-on-page: var(--fndn-palette-ink);
    --fndn-color-on-page-muted: var(--fndn-palette-stone);
    --fndn-color-on-page-rgb: var(--fndn-palette-ink-rgb);
    --fndn-color-selection: var(--fndn-palette-ink);
    --fndn-color-on-selection: var(--fndn-palette-paper);
    --fndn-color-accent: var(--fndn-palette-orange);
    --fndn-color-accent-rgb: var(--fndn-palette-orange-rgb);
    --fndn-color-line: var(--fndn-palette-line-soft);
    --fndn-color-line-rgb: var(--fndn-palette-line-soft-rgb);
    --fndn-color-frost: var(--fndn-palette-paper);
    --fndn-color-focus-ring: var(--fndn-palette-daylight);
    --fndn-color-focus-halo: var(--fndn-palette-ink);

    --fndn-sky-zenith: var(--fndn-palette-night);
    --fndn-sky-high: var(--fndn-palette-night-high);
    --fndn-sky-mid: var(--fndn-palette-dusk);
    --fndn-sky-horizon: var(--fndn-palette-horizon);
    --fndn-sky-text: var(--fndn-palette-daylight);
    --fndn-sky-text-muted: var(--fndn-palette-mist);
    --fndn-sky-text-rgb: var(--fndn-palette-daylight-rgb);
    --fndn-glow-core-rgb: var(--fndn-palette-orange-rgb);
    --fndn-glow-warm-rgb: var(--fndn-palette-ember-rgb);
    --fndn-glow-soft-rgb: var(--fndn-palette-peach-rgb);
    --fndn-glow-pale-rgb: var(--fndn-palette-glow-rgb);
    --fndn-haze-tint-rgb: var(--fndn-palette-violet-rgb);
    --fndn-haze-light-rgb: var(--fndn-palette-glow-rgb);
    --fndn-haze-rgb: var(--fndn-palette-haze-rgb);
    --fndn-dawn-top: var(--fndn-palette-paper);
    --fndn-dawn-high: var(--fndn-palette-dawn-high);
    --fndn-dawn-mid: var(--fndn-palette-dawn-mid);
    --fndn-dawn-low: var(--fndn-palette-dawn-low);
    --fndn-dawn-warmth-rgb: var(--fndn-palette-orange-rgb);
    --fndn-print-text: var(--fndn-palette-print-ink);
    --fndn-print-text-muted: var(--fndn-palette-print-muted);
    --fndn-print-rule: var(--fndn-palette-print-rule);
    --fndn-print-page: var(--fndn-palette-print-paper);

    --fndn-font-body: "Switzer", "Switzer Fallback", system-ui, sans-serif;
    --fndn-font-heading: "Switzer", "Switzer Fallback", system-ui, sans-serif;
    --fndn-weight-body: 400;
    --fndn-weight-heading: 500;
    --fndn-weight-strong: 500;
    --fndn-grain: url("/assets/patterns/grain.ad208fe95b.svg");
    --fndn-grain-size: 180px;
    --fndn-grain-opacity: 0.5;
    --fndn-clouds: url("/assets/patterns/clouds.5162e1cf4e.svg");
    --fndn-clouds-opacity: 0.62;
  }

  .fndn-s-sky,
  .fndn-c-footer {
    --fndn-surface: sky;
    --fndn-color-text: var(--fndn-palette-daylight);
    --fndn-color-text-muted: var(--fndn-palette-mist);
    --fndn-color-rule: rgb(var(--fndn-palette-daylight-rgb) / 0.12);
    --fndn-color-guide: rgb(var(--fndn-palette-daylight-rgb) / 0.045);
    --fndn-color-mark: rgb(var(--fndn-palette-daylight-rgb) / 0.21);
    --fndn-color-sun: rgb(var(--fndn-palette-daylight-rgb) / 0.11);
    color: var(--fndn-color-text);
  }

  .fndn-s-paper,
  .fndn-s-dawn,
  .fndn-s-dawn .fndn-c-footer {
    --fndn-surface: paper;
    --fndn-color-text: var(--fndn-palette-ink);
    --fndn-color-text-muted: var(--fndn-palette-stone);
    --fndn-color-rule: var(--fndn-palette-line-soft);
    --fndn-color-guide: rgb(var(--fndn-palette-ink-rgb) / 0.035);
    --fndn-color-mark: rgb(var(--fndn-palette-ink-rgb) / 0.18);
    --fndn-color-sun: rgb(var(--fndn-palette-ink-rgb) / 0.065);
    color: var(--fndn-color-text);
  }

  .fndn-s-paper {
    background-color: var(--fndn-palette-paper);
  }

  @media print {
    .fndn-s-sky,
    .fndn-c-footer,
    .fndn-s-paper,
    .fndn-s-dawn,
    .fndn-s-dawn .fndn-c-footer {
      --fndn-color-text: var(--fndn-print-text);
      --fndn-color-text-muted: var(--fndn-print-text-muted);
      --fndn-color-rule: var(--fndn-print-rule);
      background: var(--fndn-print-page);
      color: var(--fndn-color-text);
    }
  }
}

@layer base {
  :root {
    scroll-padding-top: calc(var(--fndn-header-height) + var(--fndn-size-4));
    timeline-scope: --fndn-sky-leading, --fndn-sky-trailing;

    @media (prefers-reduced-motion: no-preference) {
      scroll-behavior: smooth;
    }
  }

  @media (prefers-reduced-motion: no-preference) {
    @view-transition {
      navigation: auto;
    }

    ::view-transition-old(root),
    ::view-transition-new(root) {
      animation-duration: var(--fndn-duration-base);
    }
  }

  body {
    min-height: var(--fndn-viewport-height);
    background-color: var(--fndn-color-page);
    color: var(--fndn-color-on-page);
    font-family: var(--fndn-font-body);
    font-size: var(--fndn-text-body);
    font-weight: var(--fndn-weight-body);
    line-height: var(--fndn-leading-body);
    font-synthesis: none;
    font-variant-numeric: tabular-nums;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
  }

  h1,
  h2,
  h3 {
    font-family: var(--fndn-font-heading);
    font-weight: var(--fndn-weight-heading);
    text-wrap: balance;
  }

  h1 {
    font-size: var(--fndn-text-display);
    line-height: var(--fndn-leading-display);
    letter-spacing: var(--fndn-tracking-display);
  }

  h2 {
    font-size: var(--fndn-text-title);
    line-height: var(--fndn-leading-title);
    letter-spacing: var(--fndn-tracking-title);
  }

  h3 {
    font-size: inherit;
    line-height: inherit;
  }

  p {
    text-wrap: pretty;
  }

  a {
    color: inherit;
    text-decoration-line: none;
    text-decoration-thickness: var(--fndn-stroke-hairline);
    text-underline-offset: 0.25em;
    -webkit-tap-highlight-color: transparent;
  }

  a > span {
    text-decoration-thickness: inherit;
  }

  ::selection {
    background-color: var(--fndn-color-selection);
    color: var(--fndn-color-on-selection);
  }

  :focus-visible {
    outline: var(--fndn-focus-width) solid currentColor;
    outline-offset: var(--fndn-focus-offset);
  }

  @media (hover: hover) and (pointer: fine) {
    a:not(:has(> span)):hover,
    a:hover > span {
      text-decoration-line: underline;
    }
  }

  @media (hover: none), (pointer: coarse) {
    a:active {
      opacity: 0.6;
    }
  }

  @media print {
    body {
      background: var(--fndn-print-page);
      color: var(--fndn-print-text);
    }

    a[href^="http"]::after,
    a[href^="mailto:"]::after {
      content: " (" attr(href) ")";
    }
  }
}

@layer layout {
  .fndn-l-container {
    width: var(--fndn-grid-width);
    margin-inline: auto;
  }

  .fndn-l-grid {
    display: grid;
    grid-template-columns: repeat(var(--fndn-grid-columns), minmax(0, 1fr));
    column-gap: var(--fndn-grid-gutter);
  }

  .fndn-l-pairs {
    display: grid;
    grid-template-columns: var(--fndn-hang) minmax(0, 1fr);
  }

  .fndn-l-stack {
    display: flex;
    flex-direction: column;
    gap: var(--fndn-stack-gap, var(--fndn-size-3));
  }

}

@layer components {
  .fndn-c-skip-link {
    position: fixed;
    inset: var(--fndn-size-3) auto auto max(var(--fndn-size-6), env(safe-area-inset-left, 0px));
    z-index: var(--fndn-layer-skip);
    padding: var(--fndn-size-2-5) var(--fndn-size-4);
    background-color: var(--fndn-color-page);
    color: var(--fndn-color-on-page);
    border: var(--fndn-stroke-hairline) solid var(--fndn-color-on-page);
    transform: translateY(calc(-100% - var(--fndn-size-6)));

    &:focus-visible {
      transform: none;
    }
  }

  .fndn-c-header {
    --fndn-header-ink: var(--fndn-color-on-page);
    --fndn-header-split: linear-gradient(to bottom, var(--fndn-sky-text) 0 var(--fndn-sky-top), var(--fndn-header-ink) var(--fndn-sky-top) calc(var(--fndn-header-height) - var(--fndn-sky-bottom)), var(--fndn-sky-text) calc(var(--fndn-header-height) - var(--fndn-sky-bottom)));
    --fndn-header-split-muted: linear-gradient(to bottom, var(--fndn-sky-text-muted) 0 var(--fndn-sky-top), var(--fndn-color-on-page-muted) var(--fndn-sky-top) calc(var(--fndn-header-height) - var(--fndn-sky-bottom)), var(--fndn-sky-text-muted) calc(var(--fndn-header-height) - var(--fndn-sky-bottom)));
    --fndn-text-y: calc((var(--fndn-header-height) - var(--fndn-leading-body)) / 2);
    position: absolute;
    inset: 0 0 auto;
    z-index: var(--fndn-layer-header);
    height: var(--fndn-header-height);
    padding-block-start: var(--fndn-safe-top);
    box-sizing: content-box;
    transition: --fndn-header-ink var(--fndn-menu-out) var(--fndn-ease-exit) var(--fndn-menu-out-delay);

    :root[data-fndn-header-mode="observed"] & {
      position: fixed;
    }

    :root[data-fndn-scrolled] & {
      --fndn-header-rule: 1;
    }

    :root:has(.fndn-c-nav:target) & {
      --fndn-header-ink: var(--fndn-sky-text);
      transition: --fndn-header-ink var(--fndn-menu-in) var(--fndn-ease-emphasized);
    }

    :root:has(main > .fndn-s-sky:first-child) & {
      --fndn-sky-top: var(--fndn-header-height);
    }

    @supports (animation-timeline: view()) {
      position: fixed;
      animation: fndn-sky-leading linear both, fndn-sky-trailing linear both, fndn-header-rule linear both;
      animation-timeline: --fndn-sky-leading, --fndn-sky-trailing, scroll(root block);
      animation-range: cover calc(100% - var(--fndn-safe-top) - var(--fndn-header-height)) cover calc(100% - var(--fndn-safe-top)), exit-crossing calc(0% - var(--fndn-safe-top) - var(--fndn-header-height)) exit-crossing calc(0% - var(--fndn-safe-top)), 0px var(--fndn-scroll-threshold);
    }

    &::before {
      content: "";
      position: absolute;
      inset: var(--fndn-safe-top) 0 calc(-1 * var(--fndn-stroke-hairline));
      background-image: linear-gradient(to top, rgb(var(--fndn-color-line-rgb) / var(--fndn-header-rule)) 0 var(--fndn-stroke-hairline), color-mix(in srgb, var(--fndn-color-frost) var(--fndn-frost-opacity), transparent) var(--fndn-stroke-hairline));
      -webkit-backdrop-filter: blur(var(--fndn-frost-blur)) saturate(var(--fndn-frost-saturate));
      backdrop-filter: blur(var(--fndn-frost-blur)) saturate(var(--fndn-frost-saturate));
      clip-path: inset(max(var(--fndn-sky-top), min(var(--fndn-header-height) + var(--fndn-stroke-hairline), var(--fndn-sky-top) + (var(--fndn-sky-top) - var(--fndn-header-height) + var(--fndn-stroke-hairline)) * 1000)) 0 calc(var(--fndn-sky-bottom) + clamp(0px, var(--fndn-sky-bottom) * 1000, var(--fndn-stroke-hairline))) 0);
      transition: opacity var(--fndn-menu-out) var(--fndn-ease-exit) var(--fndn-menu-out-delay);
    }

    :root:has(.fndn-c-nav:target) &::before {
      opacity: 0;
      transition: opacity var(--fndn-menu-in) var(--fndn-ease-emphasized);
    }

    & :focus-visible {
      outline: var(--fndn-focus-width) solid var(--fndn-color-focus-ring);
      outline-offset: var(--fndn-focus-offset);
      box-shadow: 0 0 0 var(--fndn-focus-halo) var(--fndn-color-focus-halo);
    }

    @media (forced-colors: active) {
      &::before {
        background: Canvas;
        clip-path: none;
      }
    }

    @media print {
      display: none;
    }
  }

  .fndn-c-header__bar {
    position: relative;
    z-index: var(--fndn-layer-guides);
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: var(--fndn-header-height);
  }

  .fndn-c-header__brand {
    --fndn-brand-line: linear-gradient(90deg, transparent 0%, rgb(var(--fndn-color-accent-rgb) / 0.35) 30%, var(--fndn-color-accent) 50%, rgb(var(--fndn-color-accent-rgb) / 0.35) 70%, transparent 100%);
    position: relative;
    z-index: var(--fndn-layer-overlay);
    display: inline-flex;
    align-items: center;
    min-height: var(--fndn-target-minimum);
    font-weight: var(--fndn-weight-strong);
    white-space: nowrap;

    &::after {
      content: "";
      position: absolute;
      inset-inline: 0;
      top: calc(50% + var(--fndn-leading-body) / 2);
      height: var(--fndn-stroke-hairline);
      background: var(--fndn-brand-line);
      transform: scaleX(0);
      transform-origin: left;
      transition: transform var(--fndn-duration-slide) var(--fndn-ease-entrance);
      pointer-events: none;
    }

    & > span {
      text-decoration-line: none;
    }

    &:focus-visible::after {
      transform: scaleX(1);
    }

    @media (hover: hover) and (pointer: fine) {
      &:hover::after {
        transform: scaleX(1);
      }

      &:active::after {
        transform: scaleX(0);
        transform-origin: right;
        transition: transform var(--fndn-duration-fade) var(--fndn-ease-exit);
      }

      &:hover > span {
        text-decoration-line: none;
      }
    }

    @media (hover: none), (pointer: coarse) {
      &:active::after {
        transform: scaleX(1);
        transition-duration: var(--fndn-duration-fade);
      }
    }

    @media (prefers-reduced-motion: reduce) {
      &::after,
      &:active::after {
        transition: none;
      }
    }

    @media (forced-colors: active) {
      &::after {
        background: CanvasText;
      }
    }
  }

  .fndn-c-header__brand > span,
  .fndn-c-nav :where(li > a) > span {
    color: transparent;
    background: var(--fndn-header-split) 0 calc(-1 * var(--fndn-text-y)) / 100% var(--fndn-header-height) no-repeat;
    -webkit-background-clip: text;
    background-clip: text;

    @media (forced-colors: active) {
      color: CanvasText;
      background: none;
    }
  }

  .fndn-c-header__toggle > span {
    background: var(--fndn-header-split) 0 calc(-1 * var(--fndn-line-y)) / 100% var(--fndn-header-height) no-repeat;

    @media (forced-colors: active) {
      background: CanvasText;
    }
  }

  .fndn-c-nav__close > span {
    background-color: currentColor;
    transition: transform var(--fndn-menu-out) var(--fndn-ease-exit);

    .fndn-c-nav:target & {
      transition: transform var(--fndn-menu-in) var(--fndn-ease-emphasized);
    }

    @media (prefers-reduced-motion: reduce) {
      &,
      .fndn-c-nav:target & {
        transition: none;
      }
    }
  }

  .fndn-c-header__toggle,
  .fndn-c-nav__close {
    display: none;
    position: relative;
    width: var(--fndn-target-minimum);
    height: var(--fndn-target-minimum);
    margin-inline-end: calc(-1 * var(--fndn-size-3));

    & > span {
      position: absolute;
      inset-inline-start: var(--fndn-size-3);
      width: var(--fndn-size-5);
      height: var(--fndn-icon-line);
    }

    & > span:nth-child(1) {
      --fndn-line-y: calc(var(--fndn-header-height) / 2 - (var(--fndn-icon-gap) + var(--fndn-icon-line)) / 2);
      inset-block-start: calc(50% - (var(--fndn-icon-gap) + var(--fndn-icon-line)) / 2);
    }

    & > span:nth-child(2) {
      --fndn-line-y: calc(var(--fndn-header-height) / 2 + (var(--fndn-icon-gap) - var(--fndn-icon-line)) / 2);
      inset-block-start: calc(50% + (var(--fndn-icon-gap) - var(--fndn-icon-line)) / 2);
    }
  }

  .fndn-c-nav {
    --fndn-nav-divider: rgb(var(--fndn-sky-text-rgb) / 0.12);

    & ul {
      display: flex;
      gap: var(--fndn-size-8);
    }

    & li > a {
      position: relative;
      display: inline-flex;
      align-items: center;
      min-height: var(--fndn-target-minimum);

      &::before {
        content: "";
        position: absolute;
        inset: 0 auto 0 50%;
        width: max(100%, var(--fndn-target-minimum));
        transform: translateX(-50%);
      }

      &[aria-current="page"] > span {
        text-decoration-line: underline;
      }
    }

    @media (width >= 48rem) {
      --fndn-nav-arrow-size: var(--fndn-size-3-5);
      --fndn-nav-arrow-gap: var(--fndn-size-1-5);
      --fndn-nav-arrow-shift: calc(var(--fndn-nav-arrow-size) + var(--fndn-nav-arrow-gap));
      --fndn-nav-arrow-y: calc((var(--fndn-header-height) - var(--fndn-nav-arrow-size)) / 2);

      & .fndn-c-nav__item--home,
      & .fndn-c-nav__sky {
        display: none;
      }

      & li > a {
        gap: var(--fndn-nav-arrow-gap);
        margin-inline-end: calc(-1 * var(--fndn-nav-arrow-shift));
        overflow: clip;

        &::after {
          content: "";
          order: -1;
          flex: none;
          width: var(--fndn-nav-arrow-size);
          height: var(--fndn-nav-arrow-size);
          background: var(--fndn-header-split) 0 calc(-1 * var(--fndn-nav-arrow-y)) / 100% var(--fndn-header-height) no-repeat;
          -webkit-mask: var(--fndn-icon-arrow-right) center / contain no-repeat;
          mask: var(--fndn-icon-arrow-right) center / contain no-repeat;
          opacity: 0;
          transform: translateX(-150%);
          transition: transform var(--fndn-duration-slide) var(--fndn-ease-entrance), opacity var(--fndn-duration-fade) var(--fndn-ease-entrance);
        }

        & > span {
          transform: translateX(calc(-1 * var(--fndn-nav-arrow-shift)));
          transition: transform var(--fndn-duration-slide) var(--fndn-ease-entrance);
        }

        &[aria-current="page"] > span {
          background-image: var(--fndn-header-split-muted);
        }

        &:focus-visible::after {
          opacity: 1;
          transform: none;
        }

        &:focus-visible > span {
          transform: none;
        }

        @media (hover: hover) and (pointer: fine) {
          &:hover::after {
            opacity: 1;
            transform: none;
          }

          &:hover > span {
            transform: none;
          }

          &:not([aria-current="page"]):hover > span {
            text-decoration-line: none;
          }
        }

        @media (prefers-reduced-motion: reduce) {
          &::after,
          & > span {
            transition: none;
          }
        }

        @media (forced-colors: active) {
          &::after {
            background: CanvasText;
          }
        }
      }
    }

    @media (width < 48rem) {
      --fndn-sun-x: 73%;
      --fndn-afterglow-size: 170% 26%;
      position: fixed;
      inset: 0;
      z-index: var(--fndn-layer-guides);
      overflow: hidden;
      color: var(--fndn-sky-text);
      visibility: hidden;
      opacity: 0;
      will-change: opacity;
      transition: opacity var(--fndn-menu-out) var(--fndn-ease-exit) var(--fndn-menu-out-delay), visibility 0s linear calc(var(--fndn-menu-out-delay) + var(--fndn-menu-out));

      &:target {
        visibility: visible;
        opacity: 1;
        transition: opacity var(--fndn-menu-in) var(--fndn-ease-emphasized), visibility 0s;
      }

      & ul {
        position: relative;
        z-index: var(--fndn-layer-content);
        flex-direction: column;
        gap: 0;
        width: var(--fndn-grid-width);
        margin-inline: auto;
        padding-block-start: calc(var(--fndn-safe-top) + var(--fndn-header-height) + var(--fndn-viewport-height) * 0.111 - var(--fndn-size-3));
      }

      & li {
        border-block-end: var(--fndn-stroke-hairline) solid var(--fndn-nav-divider);
        opacity: 0;
        transform: translateY(var(--fndn-menu-item-rise));
        transition: opacity var(--fndn-menu-item-out) var(--fndn-ease-exit), transform var(--fndn-menu-item-out) var(--fndn-ease-exit);

        &:nth-child(2) {
          --fndn-index: 1;
        }

        &:nth-child(3) {
          --fndn-index: 2;
        }

        &:nth-child(4) {
          --fndn-index: 3;
        }
      }

      &:target li {
        --fndn-menu-item-wait: calc(var(--fndn-menu-item-delay) + var(--fndn-index, 0) * var(--fndn-menu-item-stagger));
        opacity: 1;
        transform: none;
        transition: opacity var(--fndn-menu-item-in) var(--fndn-ease-emphasized) var(--fndn-menu-item-wait), transform var(--fndn-menu-item-in) var(--fndn-ease-enter) var(--fndn-menu-item-wait);
      }

      & li > a {
        display: flex;
        min-height: var(--fndn-size-16);
        font-size: var(--fndn-text-menu);
        font-weight: var(--fndn-weight-strong);
        line-height: var(--fndn-leading-menu);
        letter-spacing: var(--fndn-tracking-title);

        --fndn-menu-arrow-size: var(--fndn-size-5);
        --fndn-menu-arrow-shift: calc(var(--fndn-menu-arrow-size) + var(--fndn-size-3));

        & > span {
          color: inherit;
          background-image: none;
          text-decoration-line: none;
          transition: transform var(--fndn-duration-slide) var(--fndn-ease-entrance);
        }

        &::before,
        &::after {
          content: "";
          position: absolute;
          inset: calc(50% - var(--fndn-menu-arrow-size) / 2) auto auto 0;
          width: var(--fndn-menu-arrow-size);
          height: var(--fndn-menu-arrow-size);
          -webkit-mask: var(--fndn-icon-arrow-right) center / contain no-repeat;
          mask: var(--fndn-icon-arrow-right) center / contain no-repeat;
          transition: transform var(--fndn-duration-slide) var(--fndn-ease-entrance), opacity var(--fndn-duration-fade) var(--fndn-ease-entrance);
        }

        &::before {
          background-color: var(--fndn-color-accent);
          opacity: 0;
          transform: translateX(calc(-1 * var(--fndn-menu-arrow-shift)));
        }

        &::after {
          inset-inline: auto 0;
          background-color: var(--fndn-sky-text-muted);
          opacity: 0.75;
        }

        &:is([aria-current="page"], :active, :focus-visible) > span {
          text-decoration-line: none;
          transform: translateX(var(--fndn-menu-arrow-shift));
        }

        &:is([aria-current="page"], :active, :focus-visible)::before {
          opacity: 1;
          transform: none;
        }

        &:is([aria-current="page"], :active, :focus-visible)::after {
          opacity: 0;
          transform: translateX(var(--fndn-menu-arrow-shift));
        }

        @media (hover: hover) and (pointer: fine) {
          &:hover > span {
            transform: translateX(var(--fndn-menu-arrow-shift));
          }

          &:hover::before {
            opacity: 1;
            transform: none;
          }

          &:hover::after {
            opacity: 0;
            transform: translateX(var(--fndn-menu-arrow-shift));
          }
        }

        @media (prefers-reduced-motion: reduce) {
          &::before,
          &::after,
          & > span {
            transition: none;
          }
        }

        @media (forced-colors: active) {
          &::before,
          &::after {
            background-color: CanvasText;
          }
        }
      }

      & .fndn-c-nav__close {
        display: block;
        position: absolute;
        inset-block-start: calc(var(--fndn-safe-top) + (var(--fndn-header-height) - var(--fndn-target-minimum)) / 2);
        inset-inline-end: calc(var(--fndn-grid-margin) - var(--fndn-size-3));
        z-index: var(--fndn-layer-content);
        margin: 0;
      }

      & .fndn-c-nav__sky {
        background-image: linear-gradient(to bottom, var(--fndn-sky-zenith), var(--fndn-sky-mid) 62%, var(--fndn-sky-horizon));

        & .fndn-c-sky__afterglow {
          background-image: radial-gradient(ellipse var(--fndn-afterglow-size) at var(--fndn-sun-x) 100%, rgb(var(--fndn-glow-core-rgb) / 0.5) 0%, rgb(var(--fndn-glow-warm-rgb) / 0.4) 18%, rgb(var(--fndn-glow-soft-rgb) / 0.24) 42%, rgb(var(--fndn-glow-pale-rgb) / 0.1) 62%, rgb(var(--fndn-glow-pale-rgb) / 0) 82%);
        }
      }

      @media (prefers-reduced-motion: reduce) {
        &,
        &:target,
        & li,
        &:target li {
          transform: none;
          transition-duration: var(--fndn-duration-quick);
          transition-delay: 0s;
        }
      }
    }
  }

  .fndn-c-nav:target .fndn-c-nav__close > span:nth-child(1) {
    transform: translateY(calc(var(--fndn-icon-gap) / 2)) rotate(45deg);
  }

  .fndn-c-nav:target .fndn-c-nav__close > span:nth-child(2) {
    transform: translateY(calc(var(--fndn-icon-gap) / -2)) rotate(-45deg);
  }

  @media (width < 48rem) {
    .fndn-c-header__toggle {
      display: block;
    }

    :root:has(.fndn-c-nav:target) {
      overflow: hidden;

      & :is(.fndn-c-header__toggle, main, .fndn-c-footer) {
        visibility: hidden;
        transition: visibility 0s linear var(--fndn-menu-in);
      }
    }
  }

  .fndn-c-header__anchor {
    position: fixed;
    inset: 0 auto auto 0;
    width: 0;
    height: 0;
  }

  .fndn-c-sky {
    position: absolute;
    inset: 0;
    z-index: var(--fndn-layer-scene);
    overflow: hidden;
    overflow-anchor: none;
    pointer-events: none;
    contain: strict;

    &::after {
      content: "";
      position: absolute;
      inset: 0;
      z-index: var(--fndn-layer-content);
      background-image: var(--fndn-grain);
      background-size: var(--fndn-grain-size);
      mix-blend-mode: soft-light;
      opacity: var(--fndn-grain-opacity);
    }

    @media print {
      display: none;
    }
  }

  .fndn-c-sky__afterglow,
  .fndn-c-sky__clouds {
    position: absolute;
    inset-inline: 0;
  }

  .fndn-c-sky__afterglow {
    inset-block: 0;
    transform-origin: var(--fndn-sun-x) 100%;
    background-image: radial-gradient(ellipse var(--fndn-afterglow-size) at var(--fndn-sun-x) 100%, rgb(var(--fndn-glow-core-rgb) / 0.56) 0%, rgb(var(--fndn-glow-warm-rgb) / 0.46) 18%, rgb(var(--fndn-glow-soft-rgb) / 0.28) 42%, rgb(var(--fndn-glow-pale-rgb) / 0.12) 62%, rgb(var(--fndn-glow-pale-rgb) / 0) 82%);

    @media (prefers-reduced-motion: no-preference) {
      [data-fndn-animate] & {
        animation: fndn-rise var(--fndn-entrance-glow) var(--fndn-ease-entrance) var(--fndn-entrance-glow-delay) both;
      }
    }
  }

  .fndn-c-sky__clouds {
    inset-block-end: 7%;
    height: 22%;
    opacity: var(--fndn-clouds-opacity);
    background: var(--fndn-clouds) 0 0 / 100% 100% no-repeat;
    -webkit-mask-image: linear-gradient(to top, transparent, #000 25%, #000 60%, transparent), radial-gradient(ellipse 62% 140% at var(--fndn-sun-x) 100%, #000 25%, transparent 72%);
    -webkit-mask-composite: source-in;
    mask-image: linear-gradient(to top, transparent, #000 25%, #000 60%, transparent), radial-gradient(ellipse 62% 140% at var(--fndn-sun-x) 100%, #000 25%, transparent 72%);
    mask-composite: intersect;

    @media (prefers-reduced-motion: no-preference) {
      [data-fndn-animate] & {
        animation: fndn-drift var(--fndn-entrance-clouds) var(--fndn-ease-entrance) var(--fndn-entrance-clouds-delay) both;
      }
    }
  }

  .fndn-c-guides {
    --fndn-x-start: var(--fndn-grid-margin);
    --fndn-x-mid: calc(var(--fndn-grid-margin) + 6 * var(--fndn-grid-step));
    --fndn-x-sun: var(--fndn-sun-x, calc(var(--fndn-grid-margin) + 9 * var(--fndn-grid-step)));
    --fndn-x-end: calc(var(--fndn-grid-margin) + var(--fndn-grid-width));
    --fndn-sun-radius: 0px;
    --fndn-sun-limit: min(36rem, 55vw);
    position: absolute;
    inset: 0;
    z-index: var(--fndn-layer-guides);
    overflow-anchor: none;
    pointer-events: none;

    & > [data-fndn-guide] {
      position: absolute;
      display: block;
    }

    & [data-fndn-at="start"] {
      left: var(--fndn-x-start);
    }

    & [data-fndn-at="mid"] {
      left: var(--fndn-x-mid);
    }

    & [data-fndn-at="sun"] {
      left: var(--fndn-x-sun);
    }

    & [data-fndn-at="end"] {
      left: calc(var(--fndn-x-end) - var(--fndn-stroke-hairline));
    }

    & [data-fndn-guide="vertical"] {
      inset-block: 0;
      width: var(--fndn-stroke-hairline);
      background-color: var(--fndn-color-guide);
      transform-origin: 50% 0;
    }

    & [data-fndn-guide="rule"] {
      inset-inline: 0;
      height: var(--fndn-stroke-hairline);
      background-color: var(--fndn-color-guide);
      transform-origin: 0 50%;
    }

    & [data-fndn-at="baseline"] {
      top: var(--fndn-y-baseline);
    }

    & [data-fndn-at="edge"] {
      top: 0;
    }

    & [data-fndn-guide="sun"] {
      left: calc(var(--fndn-x-sun) - var(--fndn-sun-radius));
      top: calc(100% - var(--fndn-sun-radius));
      width: calc(2 * var(--fndn-sun-radius));
      height: calc(2 * var(--fndn-sun-radius));
      border: var(--fndn-stroke-hairline) solid var(--fndn-color-sun);
      border-radius: 50%;
      clip-path: inset(0 0 50% 0);
    }

    & [data-fndn-guide="ruler"] {
      left: calc(var(--fndn-x-start) - var(--fndn-ruler-offset));
      top: var(--fndn-y-ruler);
      width: var(--fndn-size-2);
      height: calc(var(--fndn-y-baseline) - var(--fndn-y-ruler));
      background-image: repeating-linear-gradient(to bottom, var(--fndn-color-guide) 0 var(--fndn-stroke-hairline), transparent var(--fndn-stroke-hairline) var(--fndn-size-2)), repeating-linear-gradient(to bottom, var(--fndn-color-mark) 0 var(--fndn-stroke-hairline), transparent var(--fndn-stroke-hairline) var(--fndn-leading-body));
      background-position: var(--fndn-size-1) 0, 0 0;
      background-size: var(--fndn-size-1) 100%, var(--fndn-size-2) 100%;
      background-repeat: no-repeat;
    }

    & [data-fndn-guide="mark"] {
      top: calc(var(--fndn-y-baseline) - (var(--fndn-mark-size) - var(--fndn-stroke-hairline)) / 2);
      width: var(--fndn-mark-size);
      height: var(--fndn-mark-size);
      margin-inline-start: calc((var(--fndn-mark-size) - var(--fndn-stroke-hairline)) / -2);
      background-image: linear-gradient(var(--fndn-color-mark), var(--fndn-color-mark)), linear-gradient(var(--fndn-color-mark), var(--fndn-color-mark));
      background-position: 50% 50%;
      background-size: var(--fndn-stroke-hairline) 100%, 100% var(--fndn-stroke-hairline);
      background-repeat: no-repeat;
    }

    @media (width < 48rem) {
      --fndn-x-mid: calc(var(--fndn-grid-margin) + 2 * var(--fndn-grid-step));

      .fndn-s-dawn & {
        --fndn-x-sun: calc(var(--fndn-grid-margin) + 2 * var(--fndn-grid-step) - var(--fndn-grid-gutter) / 2);
      }
    }

    @media print {
      display: none;
    }
  }

  .fndn-c-section-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--fndn-size-6);
    padding-block-end: calc(var(--fndn-space-title) - var(--fndn-title-descent));
    border-block-end: var(--fndn-stroke-hairline) solid var(--fndn-color-rule);

    & p {
      white-space: nowrap;
    }
  }

  .fndn-c-arrow-link {
    --fndn-arrow-link-size: var(--fndn-size-14);
    --fndn-arrow-link-stroke: currentColor;
    --fndn-arrow-link-fill: var(--fndn-color-text);
    --fndn-arrow-link-on-fill: var(--fndn-color-page);
    --fndn-arrow-link-icon: var(--fndn-icon-arrow-up-right);
    --fndn-arrow-link-icon-size: var(--fndn-size-5);
    --fndn-arrow-link-travel: calc(var(--fndn-arrow-link-size) * 0.75);
    --fndn-arrow-link-exit: translate(var(--fndn-arrow-link-travel), calc(-1 * var(--fndn-arrow-link-travel)));
    --fndn-arrow-link-enter: translate(calc(-1 * var(--fndn-arrow-link-travel)), var(--fndn-arrow-link-travel));
    position: relative;
    display: grid;
    place-items: center;
    width: var(--fndn-arrow-link-size);
    aspect-ratio: 1;
    overflow: clip;
    isolation: isolate;
    border: var(--fndn-stroke-hairline) solid var(--fndn-arrow-link-stroke);
    border-radius: 50%;

    &::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: var(--fndn-layer-backdrop);
      border-radius: 50%;
      background-color: var(--fndn-arrow-link-fill);
      transform: scale(0);
      transition: transform var(--fndn-duration-fill) var(--fndn-ease-entrance);
    }

    & > svg {
      transition: transform var(--fndn-duration-slide) var(--fndn-ease-entrance);
    }

    &::after {
      content: "";
      position: absolute;
      width: var(--fndn-arrow-link-icon-size);
      height: var(--fndn-arrow-link-icon-size);
      background-color: var(--fndn-arrow-link-on-fill);
      -webkit-mask: var(--fndn-arrow-link-icon) center / contain no-repeat;
      mask: var(--fndn-arrow-link-icon) center / contain no-repeat;
      transform: var(--fndn-arrow-link-enter);
      transition: transform var(--fndn-duration-slide) var(--fndn-ease-entrance) var(--fndn-delay-follow);
    }

    &:focus-visible::before,
    a:focus-visible > &::before {
      transform: scale(1);
    }

    &:focus-visible > svg,
    a:focus-visible > & > svg {
      transform: var(--fndn-arrow-link-exit);
    }

    &:focus-visible::after,
    a:focus-visible > &::after {
      transform: none;
    }

    @media (hover: hover) and (pointer: fine) {
      &:hover::before,
      a:hover > &::before {
        transform: scale(1);
      }

      &:hover > svg,
      a:hover > & > svg {
        transform: var(--fndn-arrow-link-exit);
      }

      &:hover::after,
      a:hover > &::after {
        transform: none;
      }
    }

    @media (prefers-reduced-motion: reduce) {
      &::before,
      &::after,
      & > svg {
        transition: none;
      }
    }

    @media (forced-colors: active) {
      &::before,
      &::after {
        display: none;
      }

      & > svg {
        transform: none;
      }
    }

    @media print {
      display: none;
    }
  }

  .fndn-c-arrow-link--back {
    --fndn-arrow-link-icon: var(--fndn-icon-arrow-left);
    --fndn-arrow-link-exit: translateX(calc(-1 * var(--fndn-arrow-link-travel)));
    --fndn-arrow-link-enter: translateX(var(--fndn-arrow-link-travel));
  }


  .fndn-c-dawn {
    &::before,
    &::after {
      content: "";
      position: fixed;
      inset: 0;
      z-index: var(--fndn-layer-backdrop);
    }

    &::before {
      background-image: radial-gradient(ellipse 34% 26% at 100% 100%, rgb(var(--fndn-dawn-warmth-rgb) / 0.1), rgb(var(--fndn-dawn-warmth-rgb) / 0) 72%), linear-gradient(to bottom, var(--fndn-dawn-top), var(--fndn-dawn-high) 38%, var(--fndn-dawn-mid) 62%, var(--fndn-dawn-low));
    }

    &::after {
      background-image: var(--fndn-grain);
      background-size: var(--fndn-grain-size);
      mix-blend-mode: soft-light;
      opacity: var(--fndn-grain-opacity);
    }

    @media print {
      &::before,
      &::after {
        content: none;
      }
    }
  }

  .fndn-c-footer {
    --fndn-sun-x: calc(var(--fndn-grid-margin) + 9 * var(--fndn-grid-step));
    --fndn-afterglow-size: 85% 22%;
    --fndn-footer-baseline: calc(var(--fndn-space-footer-top) + var(--fndn-font-cap-height) * var(--fndn-text-title) + var(--fndn-space-footer));
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: var(--fndn-footer-min-height);
    overflow: clip;
    view-timeline: --fndn-sky-trailing block;
    view-timeline-inset: 0px;

    & > .fndn-c-sky {
      background-image: radial-gradient(ellipse 34% 40% at var(--fndn-sun-x) 0, rgb(var(--fndn-haze-tint-rgb) / 0.13), rgb(var(--fndn-haze-tint-rgb) / 0) 72%), radial-gradient(ellipse 52% 90% at var(--fndn-sun-x) 0, rgb(var(--fndn-haze-light-rgb) / 0.12), rgb(var(--fndn-haze-rgb) / 0.24) 38%, rgb(var(--fndn-haze-rgb) / 0) 72%), linear-gradient(to bottom, var(--fndn-sky-horizon), var(--fndn-sky-mid) 18%, var(--fndn-sky-mid) 50%, var(--fndn-sky-high) 78%, var(--fndn-sky-zenith));
    }

    & .fndn-c-sky__afterglow {
      transform-origin: var(--fndn-sun-x) 0;
      background-image: radial-gradient(ellipse var(--fndn-afterglow-size) at var(--fndn-sun-x) 0, rgb(var(--fndn-glow-core-rgb) / 0.52) 0%, rgb(var(--fndn-glow-warm-rgb) / 0.42) 18%, rgb(var(--fndn-glow-soft-rgb) / 0.24) 42%, rgb(var(--fndn-glow-pale-rgb) / 0.1) 62%, rgb(var(--fndn-glow-pale-rgb) / 0) 82%);
    }

    & .fndn-c-sky__clouds {
      --fndn-drift-from: -12%;
      inset-block: 6% auto;
      height: 20%;
      transform: scaleY(-1);
    }

    & .fndn-c-guides {
      --fndn-y-baseline: var(--fndn-footer-baseline);
      --fndn-sun-radius: min(var(--fndn-footer-baseline), var(--fndn-sun-limit));

      & [data-fndn-guide="sun"] {
        top: calc(-1 * var(--fndn-sun-radius));
        clip-path: inset(50% 0 0 0);
      }

      & [data-fndn-at="edge"] {
        display: none;
      }
    }

    @media (prefers-reduced-motion: no-preference) {
      &[data-fndn-animate] .fndn-c-sky__afterglow {
        --fndn-rise-from: -6%;
      }
    }

    .fndn-s-dawn & {
      overflow: visible;
      view-timeline: none;

      & > .fndn-c-sky {
        background-image: none;

        &::after {
          content: none;
        }
      }

      & :is(.fndn-c-sky__afterglow, .fndn-c-sky__clouds) {
        display: none;
      }

      & .fndn-c-guides [data-fndn-at="edge"] {
        display: block;
      }
    }

    @media (width < 48rem) {
      --fndn-sun-x: calc(var(--fndn-grid-margin) + var(--fndn-grid-width));
      --fndn-afterglow-size: 110% 18%;

      & > .fndn-c-sky {
        background-image: linear-gradient(to bottom, var(--fndn-sky-horizon), var(--fndn-sky-mid) 18%, var(--fndn-sky-mid) 46%, var(--fndn-sky-zenith));
      }

      & .fndn-c-sky__clouds {
        display: none;
      }

      &:not(.fndn-s-dawn *) .fndn-c-guides :is([data-fndn-guide="vertical"][data-fndn-at="mid"], [data-fndn-guide="vertical"][data-fndn-at="sun"]) {
        display: none;
      }
    }

    @media print {
      & > .fndn-c-sky {
        display: none;
      }
    }
  }

  .fndn-c-footer__inner {
    position: relative;
    z-index: var(--fndn-layer-content);
    display: flex;
    flex: 1;
    flex-direction: column;
    container: fndn-c-footer / inline-size;

    & h2 {
      padding-block-start: calc(var(--fndn-space-footer-top) - var(--fndn-title-cap));
    }

    & ul {
      margin-block-start: calc(2 * var(--fndn-space-footer) - var(--fndn-title-descent) - (var(--fndn-target-size) - var(--fndn-leading-body)) / 2 - var(--fndn-body-cap));
    }

    & li {
      display: flex;
      align-items: center;
      grid-column: span 2;
      min-height: var(--fndn-target-size);
      min-width: 0;
    }

    & li > :is(a, span) {
      --fndn-footer-icon: var(--fndn-icon-email);
      --fndn-footer-icon-size: var(--fndn-size-4);
      --fndn-footer-icon-gap: var(--fndn-size-2);
      --fndn-footer-icon-shift: calc(var(--fndn-footer-icon-size) + var(--fndn-footer-icon-gap));
      display: inline-flex;
      align-items: center;
      gap: var(--fndn-footer-icon-gap);
      min-height: var(--fndn-target-size);
      white-space: nowrap;

      &::before {
        content: "";
        flex: none;
        width: var(--fndn-footer-icon-size);
        height: var(--fndn-footer-icon-size);
        background-color: var(--fndn-color-text-muted);
        -webkit-mask: var(--fndn-footer-icon) center / contain no-repeat;
        mask: var(--fndn-footer-icon) center / contain no-repeat;
      }

      &.fndn-c-footer__link--linkedin {
        --fndn-footer-icon: var(--fndn-icon-linkedin);
      }

      &.fndn-c-footer__link--github {
        --fndn-footer-icon: var(--fndn-icon-github);
      }

      &.fndn-c-footer__link--resume {
        --fndn-footer-icon: var(--fndn-icon-resume);
      }

      &:is(span) {
        color: var(--fndn-color-text-muted);
      }

      &:is(a) {
        @media (hover: hover) and (pointer: fine) {
          margin-inline-end: calc(-1 * var(--fndn-footer-icon-shift));
          overflow: clip;

          &::before {
            background-color: currentColor;
            opacity: 0;
            transform: translateX(-150%);
            transition: transform var(--fndn-duration-slide) var(--fndn-ease-entrance), opacity var(--fndn-duration-fade) var(--fndn-ease-entrance);
          }

          & > span {
            transform: translateX(calc(-1 * var(--fndn-footer-icon-shift)));
            transition: transform var(--fndn-duration-slide) var(--fndn-ease-entrance);
          }

          &:is(:hover, :focus-visible)::before {
            opacity: 1;
            transform: none;
          }

          &:is(:hover, :focus-visible) > span {
            transform: none;
            text-decoration-line: none;
          }
        }
      }

      @media (prefers-reduced-motion: reduce) {
        &::before,
        & > span {
          transition: none;
        }
      }

      @media (forced-colors: active) {
        &::before {
          background-color: CanvasText;
        }
      }
    }

    @container fndn-c-footer (width < 40rem) {
      & ul {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }

      & li {
        grid-column: auto;
      }
    }

    @media print {
      & ul {
        display: block;
      }

      & li > a {
        display: inline;
        white-space: normal;

        &::before {
          content: none;
        }
      }
    }
  }

  .fndn-c-footer__bar {
    color: var(--fndn-color-text-muted);
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: var(--fndn-size-2) var(--fndn-size-6);
    margin-block-start: var(--fndn-space-footer-bar);
    padding-block: var(--fndn-size-6) max(var(--fndn-size-6), env(safe-area-inset-bottom, 0px));
  }

  @keyframes fndn-sky-leading {
    from {
      --fndn-sky-top: var(--fndn-header-height);
    }

    to {
      --fndn-sky-top: 0px;
    }
  }

  @keyframes fndn-header-rule {
    from {
      --fndn-header-rule: 0;
    }

    to {
      --fndn-header-rule: 1;
    }
  }

  @keyframes fndn-sky-trailing {
    from {
      --fndn-sky-bottom: 0px;
    }

    to {
      --fndn-sky-bottom: var(--fndn-header-height);
    }
  }

  @keyframes fndn-rise {
    from {
      opacity: 0;
      transform: translateY(var(--fndn-rise-from, 8%));
    }
  }

  @keyframes fndn-drift {
    from {
      opacity: 0;
      translate: 0 var(--fndn-drift-from, 12%);
    }
  }
}

@layer utilities {
  .fndn-u-muted {
    color: var(--fndn-color-text-muted);
  }

  .fndn-u-visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
  }
}