/*
 * Design Early foundation
 * Replace token values with the exact Figma variables before styling sections.
 */

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

@layer tokens {
  @font-face {
    font-family: "BBH Bartle";
    src: url("assets/fonts/BBHBartle-Regular.ttf") format("truetype");
    font-style: normal;
    font-weight: 400;
    font-display: swap;
  }

  @font-face {
    font-family: "Google Sans Flex";
    src: url("assets/fonts/GoogleSansFlex-VariableFont_GRAD,ROND,opsz,slnt,wdth,wght.ttf")
      format("truetype-variations");
    font-style: normal;
    font-weight: 1 1000;
    font-display: swap;
  }

  @font-face {
    font-family: "Bodoni Moda";
    src: url("assets/fonts/BodoniModa-Italic-VariableFont_opsz,wght.ttf")
      format("truetype-variations");
    font-style: italic;
    font-weight: 400 900;
    font-display: swap;
  }

  :root {
    /* Color */
    --color-canvas: #050505;
    --color-surface: #18181b;
    --color-text: #f4f4f5;
    --color-text-muted: #71717a;
    --color-border: #27272a;
    --color-border-strong: #71717a;
    --color-accent: #fc6e01;

    /* Type — replace with supplied webfont families and Figma values. */
    --font-sans: "Google Sans Flex", ui-sans-serif, system-ui, -apple-system,
      BlinkMacSystemFont, "Segoe UI", sans-serif;
    --font-brand: "BBH Bartle", var(--font-sans);
    --font-display: var(--font-sans);
    --font-editorial: "Bodoni Moda", Georgia, serif;
    --font-mono: "Space Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
      monospace;
    --text-sm: clamp(0.875rem, 0.84rem + 0.15vw, 0.95rem);
    --text-body: clamp(1rem, 0.95rem + 0.2vw, 1.125rem);
    --text-heading-1: clamp(2.5rem, 1.7rem + 4vw, 5.5rem);
    --line-tight: 1;
    --line-body: 1.6;

    /* Spacing */
    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 0.75rem;
    --space-4: 1rem;
    --space-6: 1.5rem;
    --space-8: 2rem;
    --space-12: 3rem;
    --space-16: 4rem;
    --space-section: clamp(4rem, 9vw, 8rem);

    /* Layout */
    --container-width: 90rem;
    --gutter: clamp(1rem, 4vw, 4rem);
    --radius-sm: 0.375rem;
    --radius-lg: 1.5rem;
    --shadow-focus: 0 0 0 0.2rem color-mix(in srgb, var(--color-accent) 30%, transparent);
  }
}

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

  html {
    scroll-behavior: smooth;
  }

  body,
  h1,
  h2,
  h3,
  p {
    margin: 0;
  }

  img,
  picture,
  video,
  svg {
    display: block;
    max-width: 100%;
  }

  button,
  input,
  textarea,
  select {
    font: inherit;
  }

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

@layer base {
  html {
    color-scheme: dark;
  }

  body {
    width: 100%;
    max-width: var(--container-width);
    min-width: 20rem;
    min-height: 100vh;
    margin-inline: auto;
    color: var(--color-text);
    background: var(--color-canvas);
    font-family: var(--font-sans);
    font-size: var(--text-body);
    line-height: var(--line-body);
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
  }

  h1,
  h2,
  h3 {
    font-family: var(--font-display);
    font-weight: 600;
    line-height: var(--line-tight);
    text-wrap: balance;
  }

  h1 {
    max-width: 12ch;
    font-size: var(--text-heading-1);
    letter-spacing: -0.04em;
  }

  a {
    color: inherit;
  }

  :focus-visible {
    border-radius: var(--radius-sm);
    outline: none;
    box-shadow: var(--shadow-focus);
  }
}

@layer layout {
  .container {
    width: min(100% - (2 * var(--gutter)), var(--container-width));
    margin-inline: auto;
  }

  .section {
    padding-block: var(--space-section);
  }

}

@layer components {
  .skip-link {
    position: fixed;
    z-index: 100;
    inset: var(--space-4) auto auto var(--space-4);
    padding: var(--space-2) var(--space-4);
    translate: 0 -200%;
    border-radius: var(--radius-sm);
    color: var(--color-surface);
    background: var(--color-text);
  }

  .skip-link:focus {
    translate: 0;
  }

  .site-brand {
    flex: 0 0 auto;
    color: #f4f4f5;
    font-family: var(--font-brand);
    font-size: 1.125rem;
    font-weight: 400;
    letter-spacing: 0.03125rem;
    line-height: normal;
    text-decoration: none;
    white-space: nowrap;
  }

  .site-header {
    position: relative;
    z-index: 50;
    height: 4.75rem;
    color: #a1a1aa;
    background: #050505;
  }

  .site-header__inner {
    display: flex;
    width: 100%;
    height: 100%;
    align-items: center;
    justify-content: space-between;
    padding: 1rem clamp(1.25rem, 4.45vw, 4rem);
  }

  .primary-navigation {
    display: contents;
  }

  .primary-navigation__links {
    position: absolute;
    left: 50%;
    display: flex;
    align-items: center;
    gap: 2rem;
    translate: -50% 0;
  }

  .primary-navigation__links a,
  .primary-navigation__links span {
    color: #a1a1aa;
    font-family: var(--font-sans);
    font-size: 1rem;
    font-weight: 400;
    font-variation-settings: "GRAD" 0, "ROND" 0, "wdth" 100;
    line-height: 1.25;
    text-decoration: none;
    white-space: nowrap;
    transition: color 160ms ease;
  }

  .primary-navigation__links a:hover,
  .primary-navigation__links a:focus-visible {
    color: #f4f4f5;
  }

  .button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.5rem;
    font-size: 0.875rem;
    font-variation-settings: "GRAD" 0, "ROND" 0, "wdth" 100;
    line-height: 1.25rem;
    text-decoration: none;
    white-space: nowrap;
  }

  .button--primary {
    width: 7.4375rem;
    height: 2.75rem;
    padding-inline: 1.5rem;
    color: #050505;
    background: #f4f4f5;
    transition: background-color 160ms ease, transform 160ms ease;
  }

  .button--primary:hover {
    background: #ffffff;
    transform: translateY(-1px);
  }

  .nav-toggle {
    display: none;
    width: 2.75rem;
    height: 2.75rem;
    padding: 0.75rem;
    border: 0;
    border-radius: 0.5rem;
    color: #f4f4f5;
    background: transparent;
    cursor: pointer;
  }

  .nav-toggle span {
    display: block;
    width: 100%;
    height: 1px;
    background: currentColor;
    transition: rotate 160ms ease, translate 160ms ease;
  }

  .nav-toggle span + span {
    margin-top: 0.4375rem;
  }

  .hero {
    display: flex;
    min-height: 47.1875rem;
    align-items: center;
    justify-content: center;
    padding: 4rem;
    color: var(--color-text);
    background: var(--color-canvas);
  }

  .hero__inner {
    display: grid;
    width: 100%;
    gap: 1.5rem;
  }

  .hero-eyebrow {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 0.5rem;
    padding: 0.375rem 0.75rem;
    border: 1px solid var(--color-border-strong);
    border-radius: 99px;
  }

  .hero-eyebrow img {
    width: 0.5rem;
    height: 0.5rem;
    flex: 0 0 0.5rem;
  }

  .hero-eyebrow p {
    color: var(--color-text-muted);
    font-family: var(--font-mono);
    font-size: 0.75rem;
    font-weight: 700;
    line-height: 1.5;
    text-transform: uppercase;
    white-space: nowrap;
  }

  .hero-title {
    max-width: none;
    color: var(--color-text);
    font-family: var(--font-brand);
    font-size: clamp(3.5rem, 5.35vw, 4.8125rem);
    font-weight: 400;
    letter-spacing: normal;
    line-height: 1.05;
    text-transform: uppercase;
  }

  .hero-headline {
    max-width: 100%;
    color: var(--color-text);
    font-size: clamp(2.625rem, 3.9vw, 3.5rem);
    font-variation-settings: "GRAD" 0, "ROND" 0, "wdth" 100;
    font-weight: 700;
    line-height: 1.05;
  }

  .hero-headline em {
    color: var(--color-accent);
    font-family: var(--font-editorial);
    font-weight: 700;
  }

  .hero-copy {
    display: grid;
    gap: 0.125rem;
    color: var(--color-text-muted);
    font-size: 1.25rem;
    font-variation-settings: "GRAD" 0, "ROND" 0, "wdth" 100;
    line-height: 1.5;
  }

  .problem-section {
    position: relative;
    display: flex;
    min-height: 55.5rem;
    flex-direction: column;
    gap: 4rem;
    padding: 4rem;
    overflow: hidden;
    background: var(--color-canvas);
    isolation: isolate;
  }

  .problem-intro,
  .problem-list {
    position: relative;
    z-index: 1;
  }

  .problem-intro {
    display: grid;
    gap: 2rem;
  }

  .section-kicker {
    color: var(--color-text-muted);
    font-family: var(--font-mono);
    font-size: 0.8125rem;
    font-weight: 700;
    line-height: normal;
    text-transform: uppercase;
    white-space: nowrap;
  }

  .problem-title {
    max-width: none;
    color: var(--color-text);
    font-size: clamp(2.75rem, 3.9vw, 3.5rem);
    font-variation-settings: "GRAD" 0, "ROND" 0, "wdth" 100;
    font-weight: 700;
    line-height: 1.05;
  }

  .problem-title span {
    display: block;
  }

  .problem-title em {
    color: var(--color-accent);
    font-family: var(--font-editorial);
    font-weight: 700;
  }

  .problem-summary {
    color: var(--color-text-muted);
    font-size: 1.125rem;
    font-variation-settings: "GRAD" 0, "ROND" 0, "wdth" 100;
    line-height: 1.6;
  }

  .problem-list {
    counter-reset: problems;
  }

  .problem-row {
    display: grid;
    min-height: 5.625rem;
    grid-template-columns: 5rem 20rem minmax(0, 1fr);
    gap: 2rem;
    align-items: start;
    padding-block: 2rem;
    border-bottom: 1px solid #18181b;
    counter-increment: problems;
  }

  .problem-index {
    color: var(--color-text-muted);
    font-family: var(--font-mono);
    font-size: 0.875rem;
    letter-spacing: 0.01875rem;
    line-height: 1.25rem;
  }

  .problem-row h3 {
    color: var(--color-text);
    font-size: 1.375rem;
    font-variation-settings: "GRAD" 0, "ROND" 0, "wdth" 100;
    font-weight: 600;
    line-height: normal;
    text-wrap: pretty;
  }

  .problem-row p {
    color: var(--color-text-muted);
    font-size: 1rem;
    font-variation-settings: "GRAD" 0, "ROND" 0, "wdth" 100;
    line-height: 1.6;
  }

  .energy-burst {
    position: absolute;
    z-index: 0;
    pointer-events: none;
  }

  .energy-burst--problem {
    top: 8.75rem;
    left: 7.78%;
    width: min(54.55vw, 49.095875rem);
    aspect-ratio: 785.534 / 586;
    opacity: 0.5;
  }

  .energy-burst__orb {
    position: absolute;
    display: block;
    border-radius: 50%;
    filter: blur(clamp(7rem, 14vw, 13rem));
    transform: translateZ(0);
  }

  .energy-burst__orb--blue {
    top: 55.56%;
    left: 14.71%;
    width: 32.35%;
    aspect-ratio: 1;
    background: radial-gradient(
      circle,
      rgb(61 126 247) 0 62%,
      rgb(119 166 255 / 0%) 100%
    );
  }

  .energy-burst__orb--pink {
    top: 0;
    left: 0;
    width: 41.44%;
    aspect-ratio: 1;
    background: radial-gradient(
      circle,
      rgb(241 61 247) 0 44.5%,
      rgb(119 166 255 / 0%) 100%
    );
  }

  .energy-burst__orb--purple {
    top: 8.3%;
    left: 66.58%;
    width: 32.35%;
    aspect-ratio: 254.143 / 255.612;
    background: radial-gradient(
      circle,
      rgb(86 61 247) 0 44%,
      rgb(119 166 255 / 0%) 100%
    );
  }

  .mechanism-section {
    position: relative;
    display: flex;
    min-height: 89.4375rem;
    flex-direction: column;
    gap: 4rem;
    padding: 4rem;
    background: var(--color-canvas);
    isolation: isolate;
  }

  .mechanism-intro,
  .mechanism-cards,
  .operating-model {
    position: relative;
    z-index: 1;
  }

  .mechanism-arrow {
    position: absolute;
    z-index: 2;
    top: -4.061875rem;
    left: 50%;
    width: 4.2400375rem;
    height: 8.1795625rem;
    translate: -50% 0;
  }

  .energy-burst--mechanism {
    z-index: 0;
    top: -4.375rem;
    left: calc(50% - 12.6875rem);
    width: 31.25rem;
    aspect-ratio: 500 / 373;
    opacity: 0.5;
  }

  .mechanism-intro {
    display: grid;
    justify-items: center;
    gap: 1.5rem;
    text-align: center;
  }

  .mechanism-intro__copy {
    display: grid;
    justify-items: center;
    gap: 1rem;
  }

  .mechanism-intro h2 {
    max-width: 47.625rem;
    color: var(--color-text);
    font-size: 4rem;
    font-variation-settings: "GRAD" 0, "ROND" 0, "wdth" 100;
    font-weight: 700;
    line-height: 1.05;
  }

  .mechanism-intro h2 em {
    color: var(--color-accent);
    font-family: var(--font-editorial);
    font-weight: 700;
  }

  .mechanism-intro__copy > p {
    max-width: 56.875rem;
    color: var(--color-text-muted);
    font-size: 1.125rem;
    line-height: 1.6;
  }

  .mechanism-cards {
    display: grid;
    height: 36.0625rem;
    grid-template-columns: repeat(3, minmax(20.5625rem, 26rem));
    justify-content: center;
    gap: 2rem;
  }

  .mechanism-card {
    position: relative;
    display: flex;
    width: 100%;
    min-width: 20.5625rem;
    max-width: 26rem;
    height: 100%;
    flex-direction: column;
    justify-content: flex-end;
    gap: 0.625rem;
    padding-block: 1.5rem;
    overflow: hidden;
    border-radius: 1rem;
    background: #18181b;
  }

  .mechanism-card__visual {
    position: relative;
    min-height: 0;
    flex: 1 1 auto;
    container-type: inline-size;
  }

  .mechanism-card__copy {
    position: relative;
    z-index: 2;
    flex: 0 0 4.75rem;
    padding-inline: 1.5rem;
    color: var(--color-text);
  }

  .mechanism-card__copy h3 {
    font-size: 1.5rem;
    font-variation-settings: "GRAD" 0, "ROND" 0, "wdth" 100;
    font-weight: 700;
    line-height: 2.25rem;
  }

  .mechanism-card__copy p {
    font-size: 0.875rem;
    font-variation-settings: "GRAD" 0, "ROND" 0, "wdth" 100;
    font-weight: 700;
    line-height: 1.25rem;
  }

  .energy-burst--card {
    top: 10.16%;
    left: 0.1%;
    width: 98.28%;
    aspect-ratio: 408.853 / 305;
    opacity: 0.5;
  }

  .energy-burst--card .energy-burst__orb {
    filter: blur(clamp(4rem, 10cqw, 6.5rem));
  }

  .subscribe-preview {
    position: absolute;
    z-index: 1;
    top: 14.21%;
    left: -1.92%;
    width: 86.12%;
    height: 74.21%;
    max-width: none;
    object-fit: cover;
    box-shadow: 1rem 0.125rem 2.25rem rgb(0 0 0 / 25%);
  }

  .mechanism-tags {
    position: absolute;
    z-index: 2;
    top: 19.64%;
    right: 0;
    left: 0;
    display: flex;
    height: 60.72%;
    flex-wrap: wrap;
    align-content: flex-start;
    align-items: flex-start;
    justify-content: center;
    gap: 1rem;
  }

  .mechanism-tags span {
    display: inline-flex;
    height: 2.5625rem;
    align-items: center;
    padding-inline: 0.75rem;
    border: 1px solid #24242a;
    border-radius: 9999px;
    color: #a1a1aa;
    background: #101014;
    font-size: 0.75rem;
    font-weight: 500;
    line-height: normal;
    white-space: nowrap;
  }

  .energy-burst--request {
    top: 55.3%;
  }

  .energy-burst--receive {
    top: 31.15%;
    left: 33.65%;
  }

  .mechanism-screens {
    position: absolute;
    z-index: 1;
    top: 14.45%;
    left: -30.77%;
    width: 231.25%;
    height: 78.78%;
  }

  .mechanism-screen {
    position: absolute;
    width: 54.89%;
    height: 100%;
    overflow: hidden;
    transform-origin: center;
  }

  .mechanism-screen img {
    position: absolute;
    top: -14.78%;
    left: -23.4%;
    width: 146.84%;
    height: 138.5%;
    max-width: none;
    object-fit: cover;
  }

  .mechanism-screen--model {
    z-index: 1;
    top: -24.95%;
    left: 1.6%;
    rotate: -13.04deg;
  }

  .mechanism-screen--response {
    z-index: 2;
    top: -17.45%;
    left: 22.56%;
  }

  .mechanism-screen--response img {
    top: -13.83%;
    left: -23.09%;
    width: 145.75%;
    height: 136.27%;
  }

  .mechanism-screen--dispatch {
    z-index: 3;
    top: -5.29%;
    left: 32.14%;
    rotate: 20.83deg;
  }

  .operating-model {
    display: flex;
    flex-direction: column;
  }

  .operating-row {
    min-height: 7.25rem;
  }

  .process-section {
    display: flex;
    min-height: 45.1875rem;
    flex-direction: column;
    align-items: center;
    gap: 4rem;
    padding: 4rem;
    background: var(--color-canvas);
  }

  .process-intro {
    display: grid;
    width: 100%;
    justify-items: center;
    gap: 1.5rem;
    text-align: center;
  }

  .process-intro h2 {
    max-width: 73.182125rem;
    color: var(--color-text);
    font-size: 4rem;
    font-variation-settings: "GRAD" 0, "ROND" 0, "wdth" 100;
    font-weight: 700;
    line-height: 1.05;
  }

  .process-intro h2 em {
    color: var(--color-accent);
    font-family: var(--font-editorial);
    font-weight: 700;
  }

  .process-intro > p:last-child {
    width: 100%;
    color: var(--color-text-muted);
    font-size: 1.125rem;
    line-height: 1.6;
  }

  .process-cards {
    display: flex;
    width: 100%;
    height: auto;
    flex-wrap: wrap;
    align-content: flex-start;
    justify-content: center;
    gap: 2rem;
  }

  .process-card {
    display: flex;
    width: 14.8rem;
    min-width: 14.8rem;
    max-width: 14.8rem;
    height: 18.75rem;
    flex: 1 0 14.8rem;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.25rem;
  }

  .process-card__visual {
    position: relative;
    display: flex;
    width: 100%;
    min-height: 0;
    flex: 1 1 auto;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-radius: 1.5rem 0 1.5rem 0;
    background: #111116;
    container-type: inline-size;
  }

  .process-card__visual > img {
    position: relative;
    z-index: 1;
    width: 6.25rem;
    height: 6.25rem;
    flex: 0 0 6.25rem;
  }

  .energy-burst--process-card {
    top: 0;
    left: 0;
    width: 139.87%;
    aspect-ratio: 331.215 / 247.083;
    opacity: 0.5;
  }

  .energy-burst--process-card .energy-burst__orb {
    filter: blur(clamp(3.5rem, 25cqw, 7rem));
  }

  .process-card h3 {
    width: 100%;
    color: var(--color-text);
    font-size: 1.125rem;
    font-variation-settings: "GRAD" 0, "ROND" 0, "wdth" 100;
    font-weight: 400;
    line-height: 1.75rem;
  }

  .process-card > p {
    width: 100%;
    color: #a1a1aa;
    font-size: 0.875rem;
    font-variation-settings: "GRAD" 0, "ROND" 0, "wdth" 100;
    font-weight: 400;
    line-height: 1.25rem;
  }

  .work-section {
    position: relative;
    display: flex;
    min-height: 51.1875rem;
    flex-direction: column;
    align-items: flex-start;
    gap: 4rem;
    padding: 4rem;
    overflow: hidden;
    background: var(--color-canvas);
  }

  .work-intro {
    display: grid;
    width: 100%;
    justify-items: center;
    gap: 1.5rem;
    text-align: center;
  }

  .work-intro h2 {
    width: min(100%, 73.182125rem);
    color: var(--color-text);
    font-size: 4rem;
    font-variation-settings: "GRAD" 0, "ROND" 0, "wdth" 100;
    font-weight: 700;
    line-height: 1.05;
  }

  .work-projects {
    position: relative;
    width: 100%;
    height: 32.375rem;
    flex: 0 0 32.375rem;
  }

  .work-project {
    position: absolute;
    inset: 0 auto auto 0;
    width: 50.25rem;
    height: 32.375rem;
  }

  .work-project:nth-child(2) {
    left: 11.3047905rem;
  }

  .work-project:nth-child(3) {
    left: 22.7136307rem;
  }

  .work-project:nth-child(4) {
    left: 34.0631638rem;
  }

  .work-project__label {
    position: relative;
    z-index: 5;
    display: flex;
    margin-left: 5.375rem;
    flex-direction: column;
    align-items: flex-start;
    color: var(--color-text);
    font-variation-settings: "GRAD" 0, "ROND" 0, "wdth" 100;
  }

  .work-project:nth-child(2) .work-project__label {
    margin-left: 4.8983345rem;
  }

  .work-project:nth-child(3) .work-project__label {
    margin-left: 4.3176193rem;
  }

  .work-project:nth-child(4) .work-project__label {
    margin-left: 3.7968362rem;
  }

  .work-project__label h3 {
    font-size: 1.125rem;
    font-weight: 400;
    line-height: 1.75rem;
  }

  .work-project__label p {
    color: #a1a1aa;
    font-size: 0.875rem;
    line-height: 1.25rem;
  }

  .work-project > img {
    position: absolute;
    z-index: 1;
    top: 1.375rem;
    left: -1.1605816rem;
    width: 50.25rem;
    height: auto;
    max-width: none;
  }

  .work-project:nth-child(2) > img {
    z-index: 2;
  }

  .work-project:nth-child(3) > img {
    z-index: 3;
  }

  .work-project:nth-child(4) > img {
    z-index: 4;
  }

  .work-arrow {
    position: absolute;
    z-index: 6;
    top: 7.835875rem;
    left: 72.32%;
    width: 10.783625rem;
    height: auto;
    pointer-events: none;
  }

  .pricing-section {
    position: relative;
    display: flex;
    min-height: 82.625rem;
    flex-direction: column;
    align-items: flex-start;
    gap: 4rem;
    padding: 4rem;
    overflow: hidden;
    background: var(--color-canvas);
  }

  .pricing-intro,
  .pricing-cards,
  .pricing-benefits {
    position: relative;
    z-index: 1;
    width: 100%;
  }

  .pricing-intro {
    display: grid;
    justify-items: center;
    gap: 1.5rem;
    text-align: center;
  }

  .pricing-intro h2 {
    display: flex;
    flex-direction: column;
    color: var(--color-text);
    font-size: 4rem;
    font-variation-settings: "GRAD" 0, "ROND" 0, "wdth" 100;
    font-weight: 700;
    line-height: 1.05;
  }

  .pricing-intro h2 em {
    color: var(--color-accent);
    font-family: var(--font-editorial);
    font-weight: 700;
  }

  .energy-burst--pricing {
    top: -0.25rem;
    left: 36.18%;
    width: 40.466rem;
    aspect-ratio: 647.462 / 483;
    opacity: 0.22;
  }

  .pricing-cards {
    display: grid;
    height: 41.8125rem;
    grid-template-columns: minmax(21rem, 28.4375rem) minmax(43.5rem, 1fr);
    gap: 2rem;
  }

  .pricing-join-card,
  .pricing-plan-card {
    position: relative;
    min-width: 0;
    height: 100%;
    overflow: hidden;
    border-radius: 1rem;
  }

  .pricing-join-card {
    display: flex;
    align-items: flex-end;
    padding: 3rem;
    color: #050505;
    background: #f4f4f5;
  }

  .pricing-join-card__copy {
    position: relative;
    z-index: 2;
    display: grid;
    justify-items: start;
    gap: 0.625rem;
  }

  .pricing-start {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem;
    border-radius: 9999px;
    color: #050505;
    background: #e8e8ec;
    font-family: var(--font-mono);
    font-size: 0.75rem;
    font-weight: 700;
    line-height: normal;
    text-transform: uppercase;
  }

  .pricing-start span {
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 50%;
    background: var(--color-accent);
  }

  .pricing-join-card__copy h3 {
    font-size: 2.25rem;
    font-weight: 700;
    line-height: normal;
  }

  .pricing-brand {
    font-family: var(--font-brand);
    font-size: 1.5rem;
    line-height: normal;
    text-transform: uppercase;
  }

  .pricing-membership-card {
    position: absolute;
    z-index: 1;
    top: 1.75rem;
    left: -7.1rem;
    width: 26rem;
    height: 15.6875rem;
    overflow: hidden;
    border-radius: 1rem;
    color: var(--color-text);
    background: #18181b;
    box-shadow: 2.5rem 1.5rem 2.125rem rgb(0 0 0 / 25%);
    rotate: -12.29deg;
  }

  .energy-burst--membership-card {
    top: -0.9375rem;
    left: 0.25rem;
    width: 27.872rem;
    aspect-ratio: 445.956 / 316.807;
    opacity: 0.45;
  }

  .energy-burst--membership-card .energy-burst__orb,
  .energy-burst--pricing-plan .energy-burst__orb {
    filter: blur(clamp(5rem, 10vw, 8rem));
  }

  .pricing-membership-card__copy {
    position: absolute;
    z-index: 1;
    right: 1.5rem;
    bottom: 1.5rem;
    left: 1.5rem;
  }

  .pricing-membership-card__copy p {
    font-family: var(--font-brand);
    font-size: 1.125rem;
    line-height: normal;
    text-transform: uppercase;
  }

  .pricing-membership-card__copy span {
    display: block;
    font-family: var(--font-mono);
    font-size: 0.875rem;
    font-weight: 700;
    line-height: 1.25rem;
  }

  .pricing-plan-card {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    padding: 3rem;
    border: 1px solid #18181b;
    background: #0d0d0f;
  }

  .pricing-plan-card__header {
    position: relative;
    z-index: 1;
    display: flex;
    min-height: 2.75rem;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px dashed #71717a;
  }

  .pricing-plan-card__header h3 {
    color: var(--color-text);
    font-size: 2.25rem;
    font-weight: 700;
    line-height: 2.75rem;
    letter-spacing: -0.03125rem;
  }

  .pricing-plan-card__header p {
    flex: 0 0 auto;
    padding: 0.75rem;
    border: 1px solid #18181b;
    border-radius: 0.25rem;
    color: #a1a1aa;
    font-family: var(--font-mono);
    font-size: 0.6875rem;
    line-height: 1rem;
    letter-spacing: 0.01875rem;
    text-transform: uppercase;
  }

  .pricing-price {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    gap: 0.125rem;
    color: var(--color-text);
  }

  .pricing-price strong {
    font-size: 3rem;
    font-weight: 700;
    line-height: 3.5rem;
    letter-spacing: -0.0625rem;
  }

  .pricing-price span {
    font-family: var(--font-mono);
    font-size: 0.875rem;
    line-height: 1.25rem;
    letter-spacing: 0.01875rem;
  }

  .pricing-included {
    position: relative;
    z-index: 1;
    padding: 1.5rem 3rem 3rem;
    overflow: hidden;
    border-radius: 1rem;
    background: #18181b;
  }

  .pricing-included > p {
    display: inline-flex;
    min-width: 7.5625rem;
    align-items: center;
    justify-content: center;
    padding: 0.75rem 1.5rem;
    border: 1px solid #27272a;
    border-radius: 9999px;
    color: var(--color-text);
    background: #0d0d0f;
    font-size: 0.875rem;
    line-height: 1.25rem;
    text-transform: uppercase;
  }

  .pricing-included__lists {
    display: grid;
    grid-template-columns: repeat(2, minmax(17.25rem, 1fr));
    gap: 3rem;
    margin-top: 1rem;
    color: var(--color-text);
    font-size: 1.125rem;
    line-height: 1.75rem;
  }

  .pricing-included__lists ul {
    display: grid;
    min-width: 17.25rem;
    align-content: start;
    gap: 1rem;
    white-space: nowrap;
  }

  .pricing-included__lists li {
    position: relative;
    padding-left: 1.25rem;
  }

  .pricing-included__lists li::before {
    position: absolute;
    top: 0;
    left: 0;
    content: "•";
  }

  .pricing-plan-card__action {
    position: relative;
    z-index: 1;
    display: flex;
    margin-top: auto;
    justify-content: flex-end;
  }

  .pricing-plan-card .pricing-cta {
    width: 7.5rem;
    height: 3.25rem;
  }

  .energy-burst--pricing-plan {
    top: 60.5%;
    left: 26.5%;
    width: 40.466rem;
    aspect-ratio: 647.462 / 483;
    opacity: 0.17;
  }

  .pricing-benefits {
    display: grid;
    height: 13.875rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 2rem;
  }

  .pricing-benefits article {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 1rem;
    padding: 3rem;
    overflow: hidden;
    border: 2px dashed #27272a;
    border-radius: 1rem;
  }

  .pricing-benefits h3 {
    color: #a1a1aa;
    font-size: 1.375rem;
    font-weight: 600;
    line-height: 1.75rem;
  }

  .pricing-benefits p {
    max-width: 23rem;
    color: var(--color-text-muted);
    font-size: 0.875rem;
    line-height: 1.25rem;
  }

  .pricing-arrow {
    position: absolute;
    z-index: 2;
    top: 58.385rem;
    right: -1.75rem;
    width: 4.506625rem;
    height: auto;
    pointer-events: none;
  }

  .faq-section {
    display: flex;
    min-height: 77.125rem;
    flex-direction: column;
    align-items: center;
    gap: 3rem;
    padding: 4rem;
    background: var(--color-canvas);
  }

  .faq-intro {
    display: flex;
    width: 100%;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.75rem;
  }

  .faq-intro h2 {
    width: min(100%, 32.697125rem);
    color: var(--color-text);
    font-size: 4rem;
    font-variation-settings: "GRAD" 0, "ROND" 0, "wdth" 100;
    font-weight: 700;
    line-height: 1.05;
    letter-spacing: -0.09375rem;
  }

  .faq-intro h2 em {
    color: var(--color-accent);
    font-family: var(--font-editorial);
    font-weight: 700;
  }

  .faq-layout {
    display: grid;
    width: 100%;
    grid-template-columns: minmax(0, 1fr) 23.75rem;
    align-items: start;
    gap: 4rem;
  }

  .faq-list {
    width: 100%;
  }

  .faq-item {
    width: 100%;
    border-top: 1px solid #18181b;
  }

  .faq-item summary {
    display: flex;
    min-height: 4.25rem;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding-block: 1.375rem;
    color: var(--color-text);
    cursor: pointer;
    list-style: none;
  }

  .faq-item summary::-webkit-details-marker {
    display: none;
  }

  .faq-item summary span {
    font-size: 1.125rem;
    font-weight: 600;
    line-height: 1.25;
    text-wrap: pretty;
  }

  .faq-item summary img {
    width: 1.5rem;
    height: 1.5rem;
    flex: 0 0 1.5rem;
    filter: brightness(0) invert(1);
    transition: rotate 180ms ease;
  }

  .faq-item[open] summary img {
    rotate: 180deg;
  }

  .faq-item > p {
    max-width: 45rem;
    padding: 0 3rem 1.375rem 0;
    color: var(--color-text-muted);
    font-size: 0.9375rem;
    line-height: 1.5;
  }

  .faq-cta {
    display: flex;
    width: 100%;
    flex-direction: column;
    align-items: flex-start;
    gap: 1.25rem;
    padding: 2rem;
    overflow: hidden;
    border: 1px solid #18181b;
    border-radius: 0.75rem;
    background: #0d0d0f;
  }

  .faq-cta > div {
    display: grid;
    gap: 0.625rem;
  }

  .faq-cta h3 {
    color: var(--color-text);
    font-size: 1.75rem;
    font-weight: 600;
    line-height: 1.1;
  }

  .faq-cta p {
    color: var(--color-text-muted);
    font-size: 0.9375rem;
    line-height: 1.5;
  }

  .faq-cta .button {
    width: 100%;
  }

  .final-cta-section {
    position: relative;
    display: flex;
    min-height: 33rem;
    flex-direction: column;
    align-items: center;
    gap: 2rem;
    padding: 4rem;
    overflow: hidden;
    background: var(--color-canvas);
  }

  .final-cta-brand {
    color: var(--color-text);
    font-family: var(--font-brand);
    font-size: 1.125rem;
    line-height: normal;
    text-transform: uppercase;
  }

  .final-cta-copy {
    display: flex;
    width: 100%;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    text-align: center;
  }

  .final-cta-copy h2 {
    width: 100%;
    color: var(--color-text);
    font-size: 4rem;
    font-variation-settings: "GRAD" 0, "ROND" 0, "wdth" 100;
    font-weight: 700;
    line-height: 1.125;
    letter-spacing: -0.09375rem;
  }

  .final-cta-copy h2 em {
    color: var(--color-accent);
    font-family: var(--font-editorial);
    font-weight: 700;
    line-height: 1.05;
  }

  .final-cta-copy > p {
    width: min(100%, 40rem);
    color: var(--color-text-muted);
    font-size: 1.125rem;
    line-height: 1.75rem;
  }

  .final-cta-action {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    padding-top: 3rem;
  }

  .final-cta-button {
    width: min(100%, 31.5rem);
    height: 5.3125rem;
    padding-inline: 3.854rem;
    border-radius: 1.2845625rem;
    color: #050505;
    background: #f4f4f5;
    font-size: 2.248125rem;
    line-height: 3.2115rem;
    transition: background-color 160ms ease, transform 160ms ease;
  }

  .final-cta-button:hover {
    background: #ffffff;
    transform: translateY(-1px);
  }

  .final-cta-arrow {
    position: absolute;
    top: 27rem;
    left: calc(50% - 22.75rem);
    width: 5.4530625rem;
    height: auto;
    pointer-events: none;
  }

  .site-footer {
    display: flex;
    min-height: 11.375rem;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1.5rem;
    padding: 4rem;
    color: var(--color-text-muted);
    background: var(--color-canvas);
  }

  .site-footer__nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2rem;
    font-size: 0.875rem;
    line-height: normal;
    white-space: nowrap;
  }

  .site-footer__nav a {
    color: inherit;
    text-decoration: none;
    transition: color 160ms ease;
  }

  .site-footer__nav a:hover,
  .site-footer__nav a:focus-visible {
    color: var(--color-text);
  }

  .site-footer > p {
    font-size: 0.75rem;
    line-height: normal;
  }
}

@media (max-width: 47.9375rem) {
  .site-header__inner {
    padding-inline: 1.25rem;
  }

  .nav-toggle {
    display: block;
  }

  .nav-toggle[aria-expanded="true"] span:first-child {
    rotate: 45deg;
    translate: 0 0.25rem;
  }

  .nav-toggle[aria-expanded="true"] span:last-child {
    rotate: -45deg;
    translate: 0 -0.25rem;
  }

  .primary-navigation {
    position: absolute;
    inset: 100% 0 auto;
    display: grid;
    gap: 1.5rem;
    padding: 1.5rem 1.25rem 2rem;
    border-top: 1px solid #27272a;
    background: #050505;
    box-shadow: 0 1.25rem 2.5rem rgb(0 0 0 / 35%);
  }

  .js .primary-navigation:not([data-open]) {
    display: none;
  }

  .primary-navigation__links {
    position: static;
    display: grid;
    gap: 0;
    translate: none;
  }

  .primary-navigation__links a,
  .primary-navigation__links span {
    padding-block: 0.75rem;
    border-bottom: 1px solid #27272a;
    color: #d4d4d8;
    font-size: 1.125rem;
  }

  .button--primary {
    width: 100%;
  }

  .hero {
    min-height: calc(100svh - 4.75rem);
    align-items: center;
    padding: 3.5rem 1.25rem;
  }

  .hero__inner {
    gap: 1.25rem;
  }

  .hero-eyebrow {
    max-width: 100%;
  }

  .hero-eyebrow p {
    font-size: clamp(0.625rem, 2.75vw, 0.75rem);
    white-space: normal;
  }

  .hero-title {
    font-size: clamp(3rem, 15vw, 4.25rem);
  }

  .hero-headline {
    font-size: clamp(2.25rem, 10.5vw, 3rem);
    text-wrap: pretty;
  }

  .hero-copy {
    gap: 0.5rem;
    font-size: 1.0625rem;
  }

  .problem-section {
    min-height: auto;
    gap: 3rem;
    padding: 5rem 1.25rem;
  }

  .problem-intro {
    gap: 1.5rem;
  }

  .section-kicker {
    font-size: 0.6875rem;
    white-space: normal;
  }

  .problem-title {
    font-size: clamp(2.375rem, 11vw, 3rem);
  }

  .problem-title span {
    display: inline;
  }

  .problem-title span:first-child::after {
    content: " ";
  }

  .problem-summary {
    font-size: 1rem;
  }

  .problem-row {
    min-height: auto;
    grid-template-columns: 2rem minmax(0, 1fr);
    gap: 0.5rem 1rem;
    padding-block: 1.5rem;
  }

  .problem-row h3 {
    font-size: 1.25rem;
  }

  .problem-row p {
    grid-column: 2;
  }

  .energy-burst--problem {
    top: 5rem;
    left: -30%;
    width: 110vw;
  }

  .energy-burst__orb {
    filter: blur(clamp(6rem, 30vw, 10rem));
  }

  .mechanism-section {
    min-height: auto;
    gap: 3.5rem;
    padding: 6rem 1.25rem 5rem;
    overflow: hidden;
  }

  .mechanism-arrow {
    top: -3rem;
    width: 3.25rem;
    height: auto;
  }

  .energy-burst--mechanism {
    top: -2rem;
    left: 50%;
    width: 100vw;
    translate: -50% 0;
  }

  .mechanism-intro {
    gap: 1.25rem;
  }

  .mechanism-intro h2 {
    font-size: clamp(2.75rem, 12vw, 3.5rem);
  }

  .mechanism-intro__copy > p {
    font-size: 1rem;
  }

  .mechanism-cards {
    height: auto;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.5rem;
  }

  .mechanism-card {
    width: 100%;
    min-width: 0;
    height: min(138.7vw, 36.0625rem);
    max-width: 26rem;
    justify-self: center;
  }

  .operating-row {
    min-height: auto;
  }

  .process-section {
    min-height: auto;
    gap: 3rem;
    padding: 5rem 1.25rem;
  }

  .process-intro h2 {
    font-size: clamp(2.75rem, 12vw, 3.5rem);
  }

  .process-intro > p:last-child {
    font-size: 1rem;
  }

  .process-cards {
    display: grid;
    height: auto;
    grid-template-columns: minmax(0, 1fr);
    gap: 2rem;
  }

  .process-card {
    width: 100%;
    min-width: 0;
    max-width: 26rem;
    height: auto;
    flex: none;
    min-height: 20rem;
    justify-self: center;
  }

  .process-card__visual {
    min-height: 13.5rem;
  }

  .work-section {
    min-height: auto;
    gap: 3rem;
    padding: 5rem 1.25rem;
  }

  .work-intro h2 {
    font-size: clamp(2.75rem, 12vw, 3.5rem);
  }

  .work-projects {
    display: grid;
    width: 100%;
    height: auto;
    flex-basis: auto;
    gap: 2.5rem;
  }

  .work-project,
  .work-project:nth-child(n) {
    position: relative;
    left: auto;
    width: 100%;
    height: auto;
  }

  .work-project:nth-child(n) .work-project__label {
    margin: 0 0 0.75rem;
  }

  .work-project > img {
    position: relative;
    top: auto;
    left: auto;
    width: 100%;
    max-width: 100%;
  }

  .work-arrow {
    display: none;
  }

  .pricing-section {
    min-height: auto;
    gap: 3rem;
    padding: 5rem 1.25rem;
  }

  .pricing-intro h2 {
    font-size: clamp(2.75rem, 12vw, 3.5rem);
  }

  .energy-burst--pricing {
    left: 50%;
    width: 44rem;
    translate: -50% 0;
  }

  .pricing-cards {
    height: auto;
    grid-template-columns: minmax(0, 1fr);
  }

  .pricing-join-card {
    min-height: 34rem;
    padding: 2rem;
  }

  .pricing-membership-card {
    top: 2rem;
    left: -5.5rem;
    width: min(22rem, 100vw);
    height: 13.25rem;
  }

  .pricing-plan-card {
    height: auto;
    padding: 1.5rem;
  }

  .pricing-plan-card__header {
    align-items: flex-start;
    flex-direction: column;
  }

  .pricing-plan-card__header h3 {
    font-size: 2rem;
    line-height: 1.15;
  }

  .pricing-price strong {
    font-size: 2.5rem;
  }

  .pricing-included {
    padding: 1.5rem;
  }

  .pricing-included__lists {
    grid-template-columns: minmax(0, 1fr);
    gap: 0.75rem;
    font-size: 1rem;
  }

  .pricing-included__lists ul {
    min-width: 0;
    gap: 0.75rem;
    white-space: normal;
  }

  .pricing-plan-card .pricing-cta {
    width: 100%;
  }

  .pricing-benefits {
    height: auto;
    grid-template-columns: minmax(0, 1fr);
  }

  .pricing-benefits article {
    min-height: 10rem;
    padding: 2rem;
  }

  .pricing-arrow {
    display: none;
  }

  .faq-section {
    min-height: auto;
    gap: 3rem;
    padding: 5rem 1.25rem;
  }

  .faq-intro h2 {
    font-size: clamp(2.75rem, 12vw, 3.5rem);
    letter-spacing: -0.04em;
  }

  .faq-layout {
    grid-template-columns: minmax(0, 1fr);
    gap: 3rem;
  }

  .faq-item summary {
    gap: 1rem;
  }

  .faq-item summary span {
    font-size: 1rem;
  }

  .faq-item > p {
    padding-right: 0;
  }

  .faq-cta {
    padding: 1.5rem;
  }

  .final-cta-section {
    min-height: auto;
    gap: 1.5rem;
    padding: 5rem 1.25rem;
  }

  .final-cta-copy h2 {
    font-size: clamp(2.75rem, 12vw, 3.5rem);
    line-height: 1.05;
    letter-spacing: -0.04em;
  }

  .final-cta-copy > p {
    font-size: 1rem;
  }

  .final-cta-action {
    padding-top: 1.5rem;
  }

  .final-cta-button {
    height: 4rem;
    padding-inline: 1.5rem;
    border-radius: 1rem;
    font-size: 1.5rem;
    line-height: 1.25;
  }

  .final-cta-arrow {
    display: none;
  }

  .site-footer {
    min-height: auto;
    padding: 3rem 1.25rem;
    text-align: center;
  }

  .site-footer__nav {
    flex-wrap: wrap;
    gap: 1rem 1.5rem;
    white-space: normal;
  }
}

@media (min-width: 48rem) and (max-width: 64rem) {
  .hero {
    min-height: 42rem;
    padding: 4rem 2.5rem;
  }

  .hero-headline {
    max-width: 18ch;
  }

  .problem-section {
    padding-inline: 2.5rem;
  }

  .problem-row {
    grid-template-columns: 4rem minmax(13rem, 17rem) minmax(0, 1fr);
    gap: 1.5rem;
  }

  .mechanism-section {
    min-height: auto;
    padding-inline: 2.5rem;
    overflow: hidden;
  }

  .mechanism-intro h2 {
    font-size: 3.5rem;
  }

  .mechanism-cards {
    height: auto;
    grid-template-columns: minmax(0, 1fr);
  }

  .mechanism-card {
    width: min(100%, 26rem);
    min-width: 20.5625rem;
    max-width: 26rem;
    height: 36.0625rem;
    justify-self: center;
  }

  .process-section {
    min-height: auto;
    padding-inline: 2.5rem;
  }

  .process-intro h2 {
    font-size: 3.5rem;
  }

  .process-cards {
    display: grid;
    height: auto;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .process-card {
    width: 100%;
    min-width: 0;
    max-width: none;
    height: auto;
    flex: none;
    min-height: 20rem;
  }

  .process-card__visual {
    min-height: 13.5rem;
  }

  .work-section {
    min-height: auto;
    gap: 3.5rem;
    padding: 5rem 2.5rem;
  }

  .work-intro h2 {
    font-size: 3.5rem;
  }

  .work-projects {
    display: grid;
    width: 100%;
    height: auto;
    flex-basis: auto;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 3rem 2rem;
  }

  .work-project,
  .work-project:nth-child(n) {
    position: relative;
    left: auto;
    width: 100%;
    height: auto;
  }

  .work-project:nth-child(n) .work-project__label {
    margin: 0 0 0.75rem;
  }

  .work-project > img {
    position: relative;
    top: auto;
    left: auto;
    width: 100%;
    max-width: 100%;
  }

  .work-arrow {
    display: none;
  }

  .pricing-section {
    min-height: auto;
    gap: 3.5rem;
    padding: 5rem 2.5rem;
  }

  .pricing-intro h2 {
    font-size: 3.5rem;
  }

  .pricing-cards {
    height: auto;
    grid-template-columns: minmax(0, 1fr);
  }

  .pricing-join-card {
    min-height: 36rem;
  }

  .pricing-plan-card {
    height: auto;
  }

  .pricing-included__lists {
    grid-template-columns: minmax(17.25rem, 1fr);
  }

  .pricing-benefits {
    height: auto;
  }

  .pricing-benefits article {
    min-height: 10rem;
    padding: 2rem;
  }

  .pricing-arrow {
    display: none;
  }

  .faq-section {
    min-height: auto;
    padding: 5rem 2.5rem;
  }

  .faq-intro h2 {
    font-size: 3.5rem;
  }

  .faq-layout {
    grid-template-columns: minmax(0, 1fr);
    gap: 3rem;
  }

  .faq-cta {
    max-width: 32rem;
  }

  .final-cta-section {
    min-height: auto;
    padding: 5rem 2.5rem;
  }

  .final-cta-copy h2 {
    font-size: 3.5rem;
    line-height: 1.05;
  }

  .final-cta-arrow {
    display: none;
  }
}

@media (min-width: 64.0625rem) and (max-width: 74.5rem) {
  .mechanism-section {
    min-height: auto;
  }

  .mechanism-cards {
    height: auto;
    grid-template-columns: repeat(2, minmax(20.5625rem, 26rem));
  }

  .mechanism-card {
    height: 36.0625rem;
  }

  .pricing-section {
    min-height: auto;
  }

  .pricing-cards {
    height: auto;
    grid-template-columns: minmax(0, 1fr);
  }

  .pricing-join-card {
    min-height: 36rem;
  }

  .pricing-plan-card {
    height: auto;
  }
}

@layer utilities {
  .visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}