@layer tokens, base, atoms, layout, sections, scenes;

@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 400 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/geist/v5/gyByhwUxId8gMEwRGFWfOw.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 400 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/geist/v5/gyByhwUxId8gMEwYGFWfOw.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 400 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/geist/v5/gyByhwUxId8gMEwTGFWfOw.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 400 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/geist/v5/gyByhwUxId8gMEwSGFWfOw.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 400 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/geist/v5/gyByhwUxId8gMEwcGFU.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'TikTok Sans';
  font-style: normal;
  font-weight: 500 600;
  font-stretch: 75% 150%;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/tiktoksans/v8/70l9u7g-Lm8OXGnh_Ow1sUfFMmlnhbRF425wxXH-UGeud7XItbaHtxhgqsvDddtC.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
  font-family: 'TikTok Sans';
  font-style: normal;
  font-weight: 500 600;
  font-stretch: 75% 150%;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/tiktoksans/v8/70l9u7g-Lm8OXGnh_Ow1sUfFMmlnhbRF425wxXH-UGeud7XItbaHtxhgqsLDddtC.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'TikTok Sans';
  font-style: normal;
  font-weight: 500 600;
  font-stretch: 75% 150%;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/tiktoksans/v8/70l9u7g-Lm8OXGnh_Ow1sUfFMmlnhbRF425wxXH-UGeud7XItbaHtxhgqsXDddtC.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
@font-face {
  font-family: 'TikTok Sans';
  font-style: normal;
  font-weight: 500 600;
  font-stretch: 75% 150%;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/tiktoksans/v8/70l9u7g-Lm8OXGnh_Ow1sUfFMmlnhbRF425wxXH-UGeud7XItbaHtxhgqsnDddtC.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
@font-face {
  font-family: 'TikTok Sans';
  font-style: normal;
  font-weight: 500 600;
  font-stretch: 75% 150%;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/tiktoksans/v8/70l9u7g-Lm8OXGnh_Ow1sUfFMmlnhbRF425wxXH-UGeud7XItbaHtxhgqsjDddtC.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'TikTok Sans';
  font-style: normal;
  font-weight: 500 600;
  font-stretch: 75% 150%;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/tiktoksans/v8/70l9u7g-Lm8OXGnh_Ow1sUfFMmlnhbRF425wxXH-UGeud7XItbaHtxhgqsbDdQ.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@layer tokens {
  :root {
    --color-1: #1A1B1E;
    --color-2: #E5E0D8;
    --color-3: #F1F3F5;
    --color-4: #E07A5F;
    --color-5: #F2CC8F;
    --color-6: #25262B;
    --color-7: #81B29A;
    --color-8: #C1C2C5;
    --color-9: #4A4D55;
    --font-1: "TikTok Sans", "TikTok Sans Fallback", "Arial", sans-serif;
    --font-2: "Geist", "Geist Fallback", "Arial", sans-serif;
    --radius-1: 24px;
    --radius-2: 999px;
    --radius-3: 16px;
    --container-max: 1920px;
    --page-gutter: clamp(14px, 2vw, 28px);
    --space-1: clamp(16px, 1.6vw, 22px);
    --space-2: clamp(28px, 3.8vw, 56px);
  }
}

@layer base {
  @font-face { font-family: "TikTok Sans Fallback"; src: local("Arial Bold"), local("Arial-BoldMT"), local("Helvetica Bold"); font-weight: 550 799; size-adjust: 108%; ascent-override: 77.5%; descent-override: 23.3%; line-gap-override: 0%; }
  @font-face { font-family: "TikTok Sans Fallback"; src: local("Arial"), local("ArialMT"), local("Helvetica"); font-weight: 100 549; size-adjust: 104%; ascent-override: 82.3%; descent-override: 24.7%; line-gap-override: 0%; }
  @font-face { font-family: "Geist Fallback"; src: local("Arial"), local("ArialMT"), local("Helvetica"); font-weight: 100 549; size-adjust: 98.9%; ascent-override: 102.1%; descent-override: 30.3%; line-gap-override: 0%; }
  @font-face { font-family: "Geist Fallback"; src: local("Arial Bold"), local("Arial-BoldMT"), local("Helvetica Bold"); font-weight: 550 799; size-adjust: 97%; ascent-override: 104.1%; descent-override: 30.9%; line-gap-override: 0%; }
  *, *::before, *::after { box-sizing: border-box; }
  html { background: var(--color-1); -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-behavior: smooth; }
  @media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
  }
  body { margin: 0; background: var(--color-1); color: var(--color-3); -webkit-font-smoothing: antialiased; overflow-x: clip; font-variant-numeric: tabular-nums; }
  img, svg { display: block; max-width: 100%; }
  img { height: auto; }
  a { color: inherit; }
  h1, h2, h3, h4, p, ul, ol, figure, blockquote, dl, dd { margin: 0; }
  ul, ol { padding: 0; list-style: none; }
  button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
  :focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
  .visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  main { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-1); max-width: var(--container-max); margin-inline: auto; padding: var(--space-1) var(--page-gutter); }
}

@layer atoms {
  .m-text { font-family: var(--font-2); font-size: 15px; font-weight: 400; line-height: 1.6; letter-spacing: normal; text-transform: none; font-style: normal; }
  .m-text-2 { --m-wd: 112; font-family: var(--font-1); font-size: clamp(20px, 2.3vw, 34px); font-weight: 600; font-stretch: calc(var(--m-wd) * 1%); line-height: 1.04; letter-spacing: -.015em; text-transform: uppercase; font-style: normal; }
  .m-text-3 { font-family: var(--font-1); font-size: clamp(17px, 1.3vw, 21px); font-weight: 600; font-stretch: 108%; line-height: 1.2; letter-spacing: -.01em; text-transform: none; font-style: normal; }
  .m-text-4 { font-family: var(--font-2); font-size: 12px; font-weight: 500; line-height: 1.4; letter-spacing: .05em; text-transform: uppercase; font-style: normal; }
  .m-text-5 { font-family: var(--font-2); font-size: clamp(16px, 1.15vw, 18px); font-weight: 400; line-height: 1.58; letter-spacing: -.005em; text-transform: none; font-style: normal; }

  .m-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 44px; padding: 0 22px; border-radius: var(--radius-2); background: var(--color-1); color: var(--color-3); text-decoration: none; white-space: nowrap; }
  .m-btn__label { font-family: var(--font-1); font-size: 13px; font-weight: 600; font-stretch: 105%; line-height: 1; letter-spacing: .04em; text-transform: uppercase; transition: font-stretch .35s cubic-bezier(.3, .7, .2, 1); }
  .m-btn-2 { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 46px; padding: 0 24px; border-radius: var(--radius-2); background: var(--color-5); color: var(--color-1); text-decoration: none; white-space: nowrap; }
  .m-btn-3 { position: relative; isolation: isolate; display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 0 22px 0 calc(var(--m-notch-run, 28px) + 18px); color: var(--color-1); text-decoration: none; white-space: nowrap; }
  .m-btn-3::before { content: ""; position: absolute; z-index: -1; top: 0; left: 0; bottom: 0; right: -2px; border-radius: 8px 0 0 var(--radius-3); background: var(--color-5); transform-origin: 0 100%; transform: skewX(calc(-1 * var(--m-notch-skew, 0deg))); }
  .m-btn-3 .m-btn__label { font-size: clamp(13px, 1vw, 15px); }
  .m-btn-3__icon { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 2; transition: rotate .4s cubic-bezier(.3, .7, .2, 1); }
  .m-btn:focus-visible, .m-btn-2:focus-visible, .m-btn-3:focus-visible, .m-icon-btn:focus-visible { outline-offset: -6px; }
  @media (hover: hover) {
    .m-btn:hover .m-btn__label, .m-btn-2:hover .m-btn__label, .m-btn-3:hover .m-btn__label { font-stretch: 122%; }
    .m-btn-3:hover .m-btn-3__icon { rotate: 45deg; }
  }
  .m-link { display: inline-flex; align-items: center; gap: 8px; font-family: var(--font-2); font-size: 14px; font-weight: 500; line-height: 1.3; letter-spacing: normal; text-transform: none; text-decoration: none; }
  .m-link__label { background: linear-gradient(currentColor, currentColor) 0 100% / 100% 1.5px no-repeat; padding-bottom: 3px; transition: background-size .45s cubic-bezier(.3, .7, .2, 1), background-position 0s .45s; }
  @media (hover: hover) {
    .m-link:hover .m-link__label { background-size: 0 1.5px; background-position: 100% 100%; transition: background-size .45s cubic-bezier(.3, .7, .2, 1); }
  }
  .m-icon-btn { position: relative; display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; border: 1.5px solid currentColor; color: inherit; text-decoration: none; overflow: hidden; isolation: isolate; }
  .m-icon-btn::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: 50%; background: var(--color-5); scale: 0; transition: scale .4s cubic-bezier(.3, .7, .2, 1); }
  .m-icon-btn svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; transition: rotate .4s cubic-bezier(.3, .7, .2, 1), color .3s; }
  @media (hover: hover) {
    .m-icon-btn:hover { color: var(--color-1); border-color: var(--color-1); }
    .m-icon-btn:hover::before { scale: 1; }
    .m-icon-btn:hover svg { rotate: 90deg; }
  }
  .m-badge { display: inline-flex; align-items: center; min-height: 32px; padding: 0 14px; border: 1.5px solid currentColor; border-radius: var(--radius-2); font-family: var(--font-1); font-size: 12px; font-weight: 600; font-stretch: 105%; line-height: 1; letter-spacing: .04em; text-transform: uppercase; font-style: normal; white-space: nowrap; }
  .m-badge-2 { display: inline-flex; align-items: center; min-height: 32px; padding: 0 14px; border: 1.5px solid var(--color-1); border-radius: var(--radius-2); background: var(--color-1); color: var(--color-3); font-family: var(--font-1); font-size: 12px; font-weight: 600; font-stretch: 105%; line-height: 1; letter-spacing: .04em; text-transform: uppercase; font-style: normal; white-space: nowrap; }
  .m-badge-3 { display: inline-flex; align-items: center; min-height: 28px; padding: 0 12px; border-radius: var(--radius-2); background: var(--color-5); color: var(--color-1); font-family: var(--font-1); font-size: 12px; font-weight: 600; font-stretch: 105%; line-height: 1; letter-spacing: .02em; text-transform: none; font-style: normal; white-space: nowrap; }

  .m-surface { position: relative; border-radius: var(--radius-1); background: var(--color-2); color: var(--color-1); }
  .m-surface-2 { position: relative; border-radius: var(--radius-1); background: var(--color-3); color: var(--color-1); }
  .m-surface-3 { position: relative; border-radius: var(--radius-1); background: var(--color-4); color: var(--color-1); }
  .m-surface-4 { position: relative; border-radius: var(--radius-1); background: var(--color-6); color: var(--color-3); }
  .m-surface-5 { position: relative; border-radius: var(--radius-1); background: var(--color-5); color: var(--color-1); }
  .m-notch { --m-notch-run: 28px; position: relative; isolation: isolate; display: inline-flex; align-items: center; min-height: 54px; padding: 12px 18px 14px var(--space-2); color: var(--color-3); }
  .m-notch::before { content: ""; position: absolute; z-index: -1; top: -2px; left: -2px; bottom: 0; right: calc(-1 * var(--m-notch-run)); background: var(--color-1); clip-path: polygon(0 0, 100% 0, calc(100% - var(--m-notch-run)) 100%, 0 100%); }
  .m-notch .m-text-2 { background-color: var(--color-1); }
  .m-notch::after { content: ""; position: absolute; z-index: -1; top: calc(100% - 2px); left: -2px; width: calc(var(--radius-1) + 2px); height: calc(var(--radius-1) + 2px); background: var(--color-1); -webkit-mask: radial-gradient(circle at 100% 100%, transparent var(--radius-1), var(--color-1) calc(var(--radius-1) + .5px)); mask: radial-gradient(circle at 100% 100%, transparent var(--radius-1), var(--color-1) calc(var(--radius-1) + .5px)); }
  .m-notch-2 { --m-notch-h: 64px; --m-notch-run: 28px; --m-notch-skew: atan2(var(--m-notch-run), var(--m-notch-h)); position: absolute; right: 0; bottom: 0; isolation: isolate; display: flex; height: var(--m-notch-h); padding: 8px 0 0 8px; }
  .m-notch-2::before { content: ""; position: absolute; z-index: -1; top: 0; left: calc(-1 * var(--m-notch-run)); right: -2px; bottom: -2px; border-top-left-radius: var(--radius-3); background: var(--color-1); transform-origin: 0 calc(100% - 2px); transform: skewX(calc(-1 * var(--m-notch-skew))); }
  .m-notch-2::after { content: ""; position: absolute; z-index: -1; right: -2px; bottom: calc(100% - 2px); width: calc(var(--radius-1) + 2px); height: calc(var(--radius-1) + 2px); background: var(--color-1); -webkit-mask: radial-gradient(circle at 0 0, transparent var(--radius-1), var(--color-1) calc(var(--radius-1) + .5px)); mask: radial-gradient(circle at 0 0, transparent var(--radius-1), var(--color-1) calc(var(--radius-1) + .5px)); }
  .m-notch-2 > .m-btn-3 { flex: 1; margin-left: calc(-1 * var(--m-notch-run)); }
  .m-avatar { width: 44px; height: 44px; border-radius: 50%; object-fit: contain; background: var(--color-1); padding: 4px; border: 2.5px solid currentColor; }
}

@layer layout {
  .l-panel { padding: 0 var(--space-2) clamp(32px, 4.5vw, 60px); scroll-margin-top: var(--space-1); }
  .l-panel:has(> .m-notch) { border-top-left-radius: 0; }
  .l-panel > .m-notch { margin-left: calc(-1 * var(--space-2)); max-width: calc(100% + var(--space-2) - 40px); }
  .l-panel__body { margin-top: clamp(24px, 3.6vw, 48px); }
}

@layer sections {
  #nav { position: fixed; z-index: 50; top: var(--space-1); left: var(--page-gutter); right: var(--page-gutter); max-width: calc(var(--container-max) - 2 * var(--page-gutter)); margin-inline: auto; display: flex; align-items: flex-start; justify-content: space-between; pointer-events: none; transition: translate .5s cubic-bezier(.3, .7, .2, 1); }
  #nav > * { pointer-events: auto; }
  #nav.is-hidden { translate: 0 calc(-100% - 2 * var(--space-1)); }
  #nav .nav-logo { gap: 10px; text-decoration: none; min-height: 58px; padding-right: 22px; }
  #nav .nav-logo::before { border-top-left-radius: calc(var(--radius-1) + 2px); }
  #nav .nav-dot { width: 24px; height: 24px; object-fit: contain; flex: none; }
  #nav .nav-word { font-family: var(--font-1); font-size: 19px; font-weight: 600; font-stretch: 112%; letter-spacing: .02em; text-transform: uppercase; line-height: 1; }
  #nav .nav-links { position: absolute; left: 50%; top: 9px; translate: -50% 0; display: flex; gap: 4px; padding: 4px; border-radius: var(--radius-2); color: var(--color-1); background: transparent; transition: background-color .35s, color .35s; }
  #nav.is-solid .nav-links { background: var(--color-1); color: var(--color-3); }
  #nav .nav-links a { display: inline-flex; align-items: center; min-height: 38px; padding: 0 15px; border-radius: var(--radius-2); text-decoration: none; }
  #nav .nav-links a:focus-visible { outline-offset: -4px; background-color: var(--color-5); color: var(--color-1); }
  #nav .nav-links a::after { content: ""; display: block; width: 5px; height: 5px; margin-left: 7px; border-radius: 50%; background: currentColor; scale: 0; transition: scale .3s; }
  #nav .nav-cta { margin-top: 9px; margin-right: 12px; }
  #nav.is-solid .nav-cta { background: var(--color-5); color: var(--color-1); }
  #nav .nav-menu { display: none; margin-top: 9px; margin-right: 12px; background: var(--color-1); color: var(--color-3); border-color: var(--color-1); }
  @media (hover: hover) { #nav .nav-links a:hover::after { scale: 1; } }
  @media (max-width: 900px) {
    #nav .nav-links, #nav .nav-cta { display: none; }
    #nav .nav-menu { display: inline-grid; }
    #nav .nav-logo { min-height: 54px; }
  }
  #nav .menu { pointer-events: auto; position: fixed; inset: 0; z-index: 60; display: grid; align-content: space-between; gap: 28px; padding: calc(var(--space-1) + 20px); background: var(--color-1); color: var(--color-3); }
  #nav .menu[hidden] { display: none; }
  #nav .menu__top { display: flex; justify-content: space-between; align-items: center; }
  #nav .menu__brand { font-family: var(--font-1); font-size: 20px; font-weight: 600; font-stretch: 112%; text-transform: uppercase; display: inline-flex; align-items: center; gap: 10px; }
  #nav .menu__links { display: grid; gap: 8px; }
  #nav .menu__links a { font-size: clamp(26px, 7vw, 44px); text-decoration: none; }

  #curve { padding-top: calc(64px + var(--space-2)); }
  #curve .cv-title { font-size: clamp(28px, 3.6vw, 50px); line-height: 1.02; }
  #curve .cv-grid { display: grid; grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr); gap: clamp(28px, 4.2vw, 64px); align-items: end; }
  #curve .cv-copy { display: grid; gap: 22px; align-content: start; justify-items: start; }
  #curve .cv-cues { display: grid; gap: 12px; width: 100%; }
  #curve .cv-cues li { display: grid; grid-template-columns: 120px 1fr; gap: 14px; align-items: center; padding-top: 12px; border-top: 1.5px solid var(--color-1); }
  #curve .cv-cues .m-badge { justify-self: start; }
  #curve .cv-chart { position: relative; }
  #curve .cv-days { position: relative; display: grid; grid-template-columns: repeat(7, 1fr); gap: clamp(8px, 1vw, 14px); }
  #curve .cv-days li { display: grid; grid-template-rows: clamp(210px, 32svh, 290px) auto auto; gap: 8px; }
  #curve .cv-track { position: relative; border-radius: var(--radius-2); background: linear-gradient(to top, var(--color-2), transparent 70%); }
  #curve .cv-bar { position: absolute; left: 0; right: 0; bottom: 0; height: calc(var(--cv-h) * 100%); min-height: 14px; border-radius: var(--radius-2); background: var(--color-4); transform-origin: 50% 100%; }
  #curve .is-easy .cv-bar { background: var(--color-7); }
  #curve .is-rest .cv-bar { background: transparent; border: 1.5px dashed var(--color-9); }
  #curve .is-today .cv-bar { background: var(--color-5); }
  #curve .cv-day { color: var(--color-9); font-size: 11px; }
  #curve .is-today .cv-day { color: var(--color-1); }
  #curve .cv-name { font-size: 12.5px; line-height: 1.35; }
  #curve .cv-name b { display: block; font-weight: 500; }
  #curve .cv-line { position: absolute; left: 0; right: 0; top: 0; height: clamp(210px, 32svh, 290px); width: 100%; overflow: visible; pointer-events: none; }
  #curve .cv-line polyline { fill: none; stroke: var(--color-1); stroke-width: 2.2; stroke-linejoin: round; stroke-linecap: round; vector-effect: non-scaling-stroke; }
  #curve .cv-caption { margin-top: 16px; color: var(--color-9); font-size: 11.5px; }
  @media (max-width: 900px) {
    #curve { padding-top: calc(56px + var(--space-2)); }
    #curve .cv-grid { grid-template-columns: 1fr; }
  }
  @media (max-width: 767.98px) {
    #curve .cv-days { grid-template-columns: 1fr; gap: 10px; }
    #curve .cv-days li { grid-template-rows: auto auto; grid-template-columns: 44px 1fr; column-gap: 12px; row-gap: 4px; }
    #curve .cv-track { grid-column: 2; grid-row: 2; height: 16px; background: linear-gradient(to right, var(--color-2), transparent 80%); }
    #curve .cv-bar { top: 0; height: auto; width: calc(var(--cv-h) * 100%); min-width: 16px; right: auto; transform-origin: 0 50%; }
    #curve .cv-day { grid-column: 1; grid-row: 1 / span 2; align-self: center; }
    #curve .cv-name { grid-column: 2; grid-row: 1; }
    #curve .cv-name b { display: inline; margin-right: 6px; }
    #curve .cv-line { display: none; }
    #curve .cv-cues li { grid-template-columns: 1fr; gap: 8px; }
  }

  #coaches { overflow: visible; }
  #coaches .co-lead { max-width: 68ch; color: var(--color-8); }
  #coaches .co-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(20px, 2.4vw, 36px); margin-top: clamp(28px, 4vw, 48px); }
  #coaches .co-item { position: relative; display: grid; gap: 12px; align-content: start; }
  #coaches .co-item:hover { z-index: 35; }
  #coaches .co-photo { position: relative; width: 100%; max-width: 210px; aspect-ratio: 1; border-radius: 50%; overflow: hidden; border: 4px solid var(--color-6); background: var(--color-1); cursor: zoom-in; transform-origin: 50% 50%; transition: scale .42s cubic-bezier(.22, 1, .36, 1), border-radius .42s cubic-bezier(.22, 1, .36, 1), border-color .3s, box-shadow .42s cubic-bezier(.22, 1, .36, 1); }
  #coaches .co-item:nth-child(2) .co-photo { margin-left: 0; }
  #coaches .co-item:nth-child(3) .co-photo { margin-left: 0; }
  #coaches .co-item:nth-child(4) .co-photo { margin-left: 0; }
  #coaches .co-item:nth-child(1) .co-photo { z-index: 4; }
  #coaches .co-item:nth-child(2) .co-photo { z-index: 3; }
  #coaches .co-item:nth-child(3) .co-photo { z-index: 2; }
  #coaches .co-photo img { width: 100%; height: 100%; object-fit: cover; transition: scale .45s cubic-bezier(.22, 1, .36, 1); }
  #coaches .co-item:first-child .co-photo { cursor: default; }
  #coaches .co-item:first-child .co-photo img { object-fit: contain; padding: 12px; }
  #coaches .co-item .m-badge { justify-self: start; }
  #coaches .co-item p { color: var(--color-8); max-width: 34ch; }
  #coaches .co-foot { display: flex; flex-wrap: wrap; gap: 16px 28px; align-items: center; justify-content: space-between; margin-top: clamp(28px, 3.6vw, 44px); padding-top: 20px; border-top: 1.5px solid var(--color-1); }
  @media (hover: hover) {
    #coaches .co-item:not(:first-child) .co-photo:hover { scale: 1.42; border-radius: 24px; z-index: 45; border-color: var(--color-5); box-shadow: 0 28px 64px rgba(0, 0, 0, .65); }
    #coaches .co-item:not(:first-child) .co-photo:hover img { scale: 1.02; }
  }
  @media (max-width: 900px) {
    #coaches .co-list { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 32px; }
    #coaches .co-photo { max-width: 170px; }
  }

  #disciplines { overflow: visible; }
  #disciplines .ds-lead { max-width: 68ch; }
  #disciplines .ds-rows { display: grid; gap: 16px; margin-top: clamp(24px, 3.5vw, 44px); }
  #disciplines .ds-row { position: relative; display: grid; grid-template-columns: minmax(0, .88fr) minmax(0, 1.22fr) clamp(236px, 23vw, 324px); align-items: center; gap: clamp(16px, 2.2vw, 36px); min-height: clamp(132px, 11.5vw, 168px); padding: 12px 14px 12px clamp(24px, 2.8vw, 40px); border-radius: 999px 28px 28px 999px; clip-path: inset(0% 0% 0% 0% round 999px 28px 28px 999px); }
  #disciplines .ds-row:hover, #disciplines .ds-row:focus-within { clip-path: none !important; z-index: 35; }
  #disciplines .ds-name { font-size: clamp(22px, 2.4vw, 34px); }
  #disciplines .ds-info { display: grid; gap: 8px; justify-items: start; }
  #disciplines .ds-row.m-surface-4 .ds-info p { color: var(--color-8); }
  #disciplines .ds-photo { position: relative; z-index: 2; width: 100%; aspect-ratio: 16 / 9; border-radius: 18px; overflow: hidden; background: #F8F9FA; border: 2px solid rgba(26, 27, 30, .14); min-height: 128px; cursor: zoom-in; transform-origin: 84% 50%; transition: scale .42s cubic-bezier(.22, 1, .36, 1), border-radius .42s cubic-bezier(.22, 1, .36, 1), border-color .3s, box-shadow .42s cubic-bezier(.22, 1, .36, 1); }
  #disciplines .ds-photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: fill; padding: 0; background: #F8F9FA; transition: scale .45s cubic-bezier(.22, 1, .36, 1); }
  @media (hover: hover) {
    #disciplines .ds-photo:hover { scale: 1.52; border-radius: 18px; z-index: 50; border-color: var(--color-5); box-shadow: 0 28px 64px rgba(0, 0, 0, .55); }
    #disciplines .ds-photo:hover img { scale: 1.01; }
  }
  @media (min-width: 768px) { #disciplines .ds-photo img { object-position: 50% var(--ds-y, 50%); } }
  @media (max-width: 767.98px) {
    #disciplines .ds-row { grid-template-columns: minmax(0, 1fr) 96px; grid-template-areas: "name name" "info photo"; gap: 12px; padding: 20px 18px 18px 22px; border-radius: 36px; clip-path: inset(0% 0% 0% 0% round 36px); }
    #disciplines .ds-name { grid-area: name; font-size: clamp(20px, 6vw, 28px); }
    #disciplines .ds-info { grid-area: info; }
    #disciplines .ds-photo { grid-area: photo; align-self: center; width: 96px; height: 72px; min-height: 0; border-radius: 14px; }
  }

  #app .ap-grid { display: grid; grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr); gap: clamp(28px, 4.5vw, 64px); }
  #app .ap-stage { align-self: start; display: grid; justify-items: center; }
  #app .ap-phone { position: relative; width: min(318px, 82vw); padding: 11px; border-radius: 42px; background: var(--color-1); box-shadow: 0 26px 60px rgba(26, 27, 30, .28); }
  #app .ap-screen { position: relative; border-radius: 32px; overflow: hidden; background: var(--color-3); }
  #app .ap-view { display: flex; flex-direction: column; gap: 8px; aspect-ratio: 300 / 620; padding: 22px 14px 14px; background: var(--color-3); clip-path: inset(0% 0% 0% 0%); }
  #app .ap-view + .ap-view { border-top: 12px solid var(--color-1); }
  #app .ap-view header { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding-bottom: 4px; border-bottom: 1px solid rgba(26, 27, 30, .1); }
  #app .ap-view .m-text-3 { font-size: 17px; }
  #app .ap-card { display: grid; gap: 4px; padding: 11px 13px; border-radius: 14px; background: var(--color-4); color: var(--color-1); }
  #app .ap-card--dark { background: var(--color-1); color: var(--color-3); }
  #app .ap-card__top { display: flex; justify-content: space-between; align-items: center; gap: 6px; font-size: 10.5px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; opacity: .9; }
  #app .ap-card__meta { font-size: 11.5px; line-height: 1.3; opacity: .92; }
  #app .ap-kpis { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
  #app .ap-kpi { display: grid; gap: 2px; padding: 7px 9px; border-radius: 10px; background: var(--color-1); color: var(--color-3); font-size: 11px; line-height: 1.25; }
  #app .ap-kpi small { font-size: 9.5px; text-transform: uppercase; letter-spacing: .04em; color: var(--color-8); }
  #app .ap-kpi b { font-family: var(--font-1); font-size: 12px; font-weight: 600; color: var(--color-5); }
  #app .ap-steps { display: grid; gap: 5px; }
  #app .ap-steps li { display: flex; justify-content: space-between; align-items: center; gap: 6px; padding: 7px 10px; border-radius: 9px; background: var(--color-2); font-size: 11.5px; line-height: 1.25; font-weight: 500; }
  #app .ap-steps li b { font-family: var(--font-1); font-weight: 600; }
  #app .ap-start { margin-top: auto; width: 100%; min-height: 34px; padding: 6px 10px; white-space: normal; text-align: center; }
  #app .ap-start .m-btn__label { font-size: 9.5px; font-stretch: 100%; letter-spacing: .02em; line-height: 1.2; }
  #app .ap-start:hover .m-btn__label { font-stretch: 100%; }
  #app .ap-ring-wrap { display: grid; grid-template-columns: 104px 1fr; gap: 10px; align-items: center; padding: 8px 10px; border-radius: 14px; background: var(--color-2); }
  #app .ap-ring { position: relative; font-stretch: 100%; width: 104px; aspect-ratio: 1; margin: 0; }
  #app .ap-ring svg { width: 100%; height: 100%; rotate: -90deg; }
  #app .ap-ring circle { fill: none; stroke-width: 12; }
  #app .ap-ring .ap-ring__track { stroke: rgba(26, 27, 30, .14); }
  #app .ap-ring .ap-ring__value { stroke: var(--color-4); stroke-linecap: round; }
  #app .ap-ring strong { position: absolute; inset: 0; display: grid; place-content: center; text-align: center; font-family: var(--font-1); font-size: 23px; font-weight: 600; font-stretch: 110%; line-height: 1; }
  #app .ap-ring strong small { font-stretch: 100%; font-family: var(--font-2); font-size: 9px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; margin-top: 3px; }
  #app .ap-ring-meta { display: grid; gap: 4px; font-size: 11px; line-height: 1.3; }
  #app .ap-ring-meta b { font-family: var(--font-1); font-size: 13px; color: var(--color-1); }
  #app .ap-ring-meta span { color: var(--color-9); font-size: 10.5px; }
  #app .ap-facts { display: grid; gap: 5px; }
  #app .ap-facts li { display: flex; justify-content: space-between; align-items: center; padding: 7px 10px; border-radius: 9px; background: var(--color-2); font-size: 11.5px; line-height: 1.25; }
  #app .ap-facts li b { font-family: var(--font-1); font-weight: 600; }
  #app .ap-bubble { max-width: 94%; padding: 8px 11px; border-radius: 13px 13px 13px 4px; background: var(--color-2); font-size: 11.3px; line-height: 1.38; }
  #app .ap-bubble--me { align-self: flex-end; border-radius: 13px 13px 4px 13px; background: var(--color-4); font-weight: 500; }
  #app .ap-stock-box { display: grid; gap: 4px; padding: 8px 10px; border-radius: 11px; background: var(--color-1); color: var(--color-3); font-size: 10.8px; }
  #app .ap-stock-box__head { display: flex; justify-content: space-between; font-size: 9.5px; text-transform: uppercase; letter-spacing: .05em; color: var(--color-5); font-weight: 600; }
  #app .ap-stock-box__row { display: flex; justify-content: space-between; gap: 6px; color: var(--color-3); font-weight: 500; }
  #app .ap-who { display: flex; align-items: center; gap: 8px; }
  #app .ap-who .m-avatar { width: 30px; height: 30px; border-width: 0; padding: 2px; }
  #app .ap-notes { display: grid; gap: 0; }
  #app .ap-note { display: grid; gap: 12px; align-content: center; min-height: 52svh; padding-left: 26px; border-left: 1.5px solid var(--color-1); position: relative; }
  #app .ap-note::before { content: ""; position: absolute; left: -8px; top: calc(50% - 8px); width: 14px; height: 14px; border-radius: 50%; background: var(--color-2); border: 1.5px solid var(--color-1); transition: background-color .3s, scale .3s; }
  #app .ap-note.is-on::before { background: var(--color-5); scale: 1.3; }
  #app .ap-note p { max-width: 48ch; }
  #app .ap-note > * { background-color: var(--color-2); }
  #app .ap-lead { max-width: 52ch; }
  @media (max-width: 767.98px) {
    #app .ap-grid { grid-template-columns: 1fr; }
    #app .ap-phone { width: min(260px, 72vw); }
    #app .ap-note { min-height: 0; padding: 16px 0 16px 22px; }
  }

  #stories .st-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-1); margin-top: clamp(24px, 3.5vw, 44px); }
  #stories .st-card { display: grid; grid-template-rows: auto 1fr auto; gap: 20px; padding: clamp(22px, 2.4vw, 32px); border-radius: var(--radius-1); background: var(--color-2); }
  #stories .st-spark { position: relative; }
  #stories .st-spark svg { width: 100%; height: 96px; overflow: visible; }
  #stories .st-spark path { fill: none; stroke: var(--color-4); stroke-width: 2.8; stroke-linecap: round; }
  #stories .st-spark circle { fill: var(--color-5); stroke: var(--color-1); stroke-width: 3; }
  #stories .st-spark .m-badge-3 { position: absolute; right: 0; top: -4px; }
  #stories blockquote { font-family: var(--font-2); font-size: clamp(15px, 1.1vw, 17px); line-height: 1.55; }
  #stories .st-who { display: flex; align-items: center; gap: 12px; color: var(--color-1); }
  #stories .st-who span { display: grid; color: var(--color-1); }
  #stories .st-who b { font-weight: 500; font-size: 15px; }
  #stories .st-who small { color: var(--color-9); font-size: 13px; }
  @media (max-width: 900px) { #stories .st-list { grid-template-columns: 1fr; } }

  #challenge .ch-grid { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, .85fr); gap: clamp(24px, 3.8vw, 56px); align-items: stretch; }
  #challenge .ch-lead { max-width: 58ch; color: var(--color-8); }
  #challenge .ch-map { position: relative; margin-top: clamp(24px, 3.5vw, 42px); aspect-ratio: 700 / 340; }
  #challenge .ch-map svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
  #challenge .ch-route { fill: none; stroke: var(--color-4); stroke-width: 3.5; stroke-linecap: round; }
  #challenge .ch-ghost { fill: none; stroke: var(--color-8); stroke-opacity: .3; stroke-width: 2; stroke-dasharray: 2 8; stroke-linecap: round; }
  #challenge .ch-dot { position: absolute; left: 97.14%; top: 19.44%; width: 22px; height: 22px; margin: -11px 0 0 -11px; border-radius: 50%; background: var(--color-5); border: 3.5px solid var(--color-6); }
  #challenge .ch-points li { display: grid; gap: 4px; }
  #challenge .ch-points b { color: var(--color-3); transition: color .3s; font-family: var(--font-1); font-weight: 600; font-stretch: 108%; font-size: 15px; line-height: 1.15; }
  #challenge .ch-points li.is-dim b { color: var(--color-8); }
  #challenge .ch-points span { color: var(--color-8); font-size: 13px; line-height: 1.35; }
  #challenge .ch-side { display: grid; grid-template-rows: 1fr auto; gap: 18px; }
  #challenge .ch-photo { border-radius: 180px 180px var(--radius-1) var(--radius-1); overflow: hidden; min-height: 290px; background: var(--color-1); display: grid; place-items: center; padding: 8px; }
  #challenge .ch-photo img { width: 100%; height: 100%; max-height: 360px; object-fit: contain; object-position: 50% 50%; }
  #challenge .ch-side .m-btn-2 { justify-self: center; }
  @media (max-width: 767.98px) {
    #challenge .ch-grid { grid-template-columns: 1fr; }
    #challenge .ch-map { aspect-ratio: auto; display: grid; grid-template-columns: 64px 1fr; }
    #challenge .ch-map svg.ch-svg--wide { display: none; }
    #challenge .ch-map svg.ch-svg--tall { position: relative; inset: auto; grid-column: 1; grid-row: 1; height: 100%; }
    #challenge .ch-points { grid-column: 2; grid-row: 1; display: grid; gap: 20px; padding: 6px 0; }
    #challenge .ch-dot { left: 32px; top: 98.333%; }
    #challenge .ch-photo { min-height: 0; aspect-ratio: 4 / 3; border-radius: 140px 140px var(--radius-1) var(--radius-1); }
  }
  @media (min-width: 768px) {
    #challenge .ch-svg--tall { display: none; }
    #challenge .ch-points li { position: absolute; left: var(--ch-x); top: var(--ch-y); width: max-content; max-width: 180px; padding: 6px 10px; border-radius: 10px; background: var(--color-6); translate: -50% 16px; text-align: center; }
    #challenge .ch-points li > * { background-color: var(--color-6); }
    #challenge .ch-points li.is-up { translate: -50% calc(-100% - 16px); }
    #challenge .ch-points li.is-end { max-width: 165px; translate: calc(-100% + 14px) calc(-100% - 16px); text-align: right; }
    #challenge .ch-points li::before { content: ""; position: absolute; left: 50%; top: -23px; width: 12px; height: 12px; margin-left: -6px; border-radius: 50%; background: var(--color-5); border: 2.5px solid var(--color-6); transition: background-color .3s; }
    #challenge .ch-points li.is-up::before { top: auto; bottom: -23px; }
    #challenge .ch-points li.is-end::before { display: none; }
    #challenge .ch-points li.is-dim::before { background: var(--color-6); border-color: var(--color-8); }
  }

  #clubs .cl-grid { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: clamp(24px, 3.8vw, 56px); }
  #clubs .cl-photo { border-radius: var(--radius-1); overflow: hidden; min-height: 320px; background: var(--color-1); }
  #clubs .cl-photo img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; }
  #clubs .cl-lead { max-width: 54ch; }
  #clubs .cl-list { margin-top: 20px; }
  #clubs .cl-list li { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.4fr) auto; gap: 16px; align-items: center; padding: 14px 0; border-top: 1.5px solid var(--color-1); }
  #clubs .cl-list li:last-child { border-bottom: 1.5px solid var(--color-1); }
  #clubs .cl-list p { color: var(--color-9); }
  @media (max-width: 900px) { #clubs .cl-grid { grid-template-columns: 1fr; } #clubs .cl-photo { min-height: 0; aspect-ratio: 16 / 10; } }
  @media (max-width: 767.98px) {
    #clubs .cl-list li { grid-template-columns: 1fr auto; row-gap: 4px; }
    #clubs .cl-list p { grid-column: 1; grid-row: 2; }
    #clubs .cl-list .m-badge { grid-column: 2; grid-row: 1 / span 2; }
  }

  #pricing { overflow: clip; }
  #pricing .pr-lead { max-width: 56ch; }
  #pricing .pr-plans { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-1); margin-top: clamp(24px, 3.5vw, 44px); }
  #pricing .pr-plan { position: relative; display: flex; flex-direction: column; gap: 16px; padding: clamp(24px, 2.6vw, 34px); border-radius: var(--radius-1); background: var(--color-2); transform-origin: 50% 120%; }
  #pricing .pr-plan--pick { z-index: 1; background: var(--color-5); }
  #pricing .pr-plan--dark { background: var(--color-6); color: var(--color-3); }
  #pricing .pr-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; min-height: 36px; }
  #pricing .pr-price { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
  #pricing .pr-price strong { font-family: var(--font-1); font-size: clamp(26px, 2.6vw, 38px); font-weight: 600; font-stretch: 112%; line-height: 1.05; letter-spacing: -.02em; }
  #pricing .pr-feats { display: grid; gap: 10px; }
  #pricing .pr-feats li { display: flex; gap: 10px; align-items: baseline; padding-top: 10px; border-top: 1.5px solid currentColor; }
  #pricing .pr-feats li.is-off { opacity: .55; text-decoration: line-through; }
  #pricing .pr-plan .m-btn, #pricing .pr-plan .m-btn-2 { margin-top: auto; align-self: flex-start; }
  #pricing .pr-note { margin-top: 18px; color: var(--color-9); }
  @media (max-width: 900px) { #pricing .pr-plans { grid-template-columns: 1fr; } }

  #faq { overflow: visible; }
  #faq .fq-grid { display: grid; grid-template-columns: minmax(0, .75fr) minmax(0, 1.25fr); gap: clamp(24px, 4vw, 56px); }
  #faq .fq-side p { color: var(--color-8); max-width: 38ch; }
  #faq .fq-side .m-link { margin-top: 18px; }
  #faq .fq-list { position: relative; }
  #faq details { position: relative; border-top: 1.5px solid var(--color-8); }
  #faq details:last-child { border-bottom: 1.5px solid var(--color-8); }
  #faq details[open] { z-index: 40; }
  #faq summary { display: flex; justify-content: space-between; align-items: center; gap: 18px; padding: 18px 0; cursor: pointer; list-style: none; font-size: clamp(16px, 1.2vw, 19px); }
  #faq summary::-webkit-details-marker { display: none; }
  #faq summary::after { content: ""; flex: none; width: 32px; height: 32px; border-radius: 50%; border: 1.5px solid currentColor; background: linear-gradient(currentColor, currentColor) center / 11px 1.5px no-repeat, linear-gradient(currentColor, currentColor) center / 1.5px 11px no-repeat; transition: rotate .35s, background-color .3s; }
  #faq details[open] summary::after { rotate: 45deg; background-color: var(--color-5); color: var(--color-1); border-color: var(--color-5); }
  #faq details p { position: absolute; left: 0; right: 0; top: calc(100% - 4px); z-index: 45; padding: 20px 24px; background: var(--color-1); color: var(--color-3); border: 1.5px solid var(--color-5); border-radius: 18px; box-shadow: 0 24px 56px rgba(0, 0, 0, .68); max-width: none; }
  @media (hover: hover) { #faq summary:hover::after { background-color: var(--color-5); color: var(--color-1); border-color: var(--color-5); } }
  @media (max-width: 767.98px) { #faq .fq-grid { grid-template-columns: 1fr; } #faq details p { padding: 16px 18px; } }

  #contact { overflow: hidden; }
  #contact .ct-shade { position: absolute; inset: -2px; background: var(--color-6); clip-path: inset(0% 100% 100% 0% round 24px); }
  #contact > .m-notch, #contact .ct-body { position: relative; z-index: 1; }
  #contact .ct-body { display: grid; grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr); gap: clamp(28px, 4vw, 56px); align-items: start; padding-bottom: clamp(32px, 4.5vw, 56px); }
  #contact .ct-info { display: grid; gap: 22px; align-content: start; }
  #contact .ct-lead { max-width: 48ch; color: var(--color-1); }
  #contact .ct-cards { display: grid; gap: 12px; }
  #contact .ct-card { display: flex; align-items: center; gap: 16px; padding: 14px 18px; border-radius: 18px; background: rgba(26, 27, 30, .08); border: 1.5px solid rgba(26, 27, 30, .14); text-decoration: none; transition: background-color .25s, transform .25s, border-color .25s; }
  #contact .ct-card:hover { background: var(--color-1); color: var(--color-3); border-color: var(--color-1); transform: translateY(-2px); }
  #contact .ct-card__icon { width: 46px; height: 46px; border-radius: 14px; background: var(--color-1); color: var(--color-5); display: grid; place-items: center; flex: none; transition: background-color .25s, color .25s; }
  #contact .ct-card:hover .ct-card__icon { background: var(--color-5); color: var(--color-1); }
  #contact .ct-card__icon svg { width: 22px; height: 22px; fill: currentColor; }
  #contact .ct-card__meta { display: grid; gap: 2px; }
  #contact .ct-card__meta small { font-size: 12px; font-weight: 500; opacity: .78; text-transform: uppercase; letter-spacing: .04em; }
  #contact .ct-card__meta strong { font-family: var(--font-1); font-size: clamp(16px, 1.3vw, 19px); font-weight: 600; font-stretch: 108%; }
  #contact .ct-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 4px; }
  #contact .ct-form-wrap { background: var(--color-1); color: var(--color-3); padding: clamp(24px, 3vw, 38px); border-radius: var(--radius-1); box-shadow: 0 24px 56px rgba(26, 27, 30, .24); }
  #contact .ct-form { display: grid; gap: 16px; }
  #contact .ct-form-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
  #contact .ct-field { display: grid; gap: 6px; }
  #contact .ct-field label { font-size: 12.5px; font-weight: 500; color: var(--color-8); letter-spacing: .03em; text-transform: uppercase; }
  #contact .ct-req { color: var(--color-4); font-weight: 700; margin-left: 3px; }
  #contact .ct-field input, #contact .ct-field textarea { width: 100%; padding: 12px 15px; border-radius: 12px; border: 1.5px solid #373A40; background: var(--color-6); color: var(--color-3); font-family: var(--font-2); font-size: 14.5px; line-height: 1.4; transition: border-color .25s, box-shadow .25s; }
  #contact .ct-field input::placeholder, #contact .ct-field textarea::placeholder { color: #7C808B; }
  #contact .ct-field input:focus, #contact .ct-field textarea:focus { outline: none; border-color: var(--color-5); box-shadow: 0 0 0 3px rgba(242, 204, 143, .18); }
  #contact .ct-submit { width: 100%; min-height: 48px; border-radius: 14px; background: var(--color-4); color: var(--color-1); font-family: var(--font-1); font-size: 14px; font-weight: 600; font-stretch: 110%; letter-spacing: .04em; text-transform: uppercase; cursor: pointer; transition: background-color .25s, transform .2s; }
  #contact .ct-submit:hover { background: var(--color-5); transform: translateY(-1px); }
  #contact .ct-submit:disabled { opacity: .65; cursor: wait; }
  #contact .ct-alert { padding: 12px 16px; border-radius: 12px; font-size: 13.5px; font-weight: 500; }
  #contact .ct-alert[hidden] { display: none; }
  #contact .ct-alert--ok { background: rgba(129, 178, 154, .18); border: 1.5px solid var(--color-7); color: #B8E2CE; }
  #contact .ct-alert--err { background: rgba(224, 122, 95, .18); border: 1.5px solid var(--color-4); color: #F7B5A3; }
  #contact .ct-legal-note { font-size: 12px; color: var(--color-8); text-align: center; line-height: 1.45; }
  #contact .ct-legal-note a { color: var(--color-5); text-decoration: underline; }
  @media (max-width: 900px) {
    #contact .ct-body { grid-template-columns: 1fr; }
  }
  @media (max-width: 600px) {
    #contact .ct-form-row { grid-template-columns: 1fr; }
  }

  .wa-float { position: fixed; bottom: 24px; right: 24px; z-index: 55; display: inline-flex; flex-direction: row-reverse; align-items: center; gap: 12px; text-decoration: none; }
  .wa-float__btn { width: 58px; height: 58px; border-radius: 50%; background: #25D366; color: #FFFFFF; display: grid; place-items: center; box-shadow: none; transition: scale .28s cubic-bezier(.22, 1, .36, 1), background-color .25s; }
  .wa-float__btn svg { width: 34px; height: 34px; fill: currentColor; }
  .wa-float__tip { padding: 8px 14px; border-radius: 12px; background: var(--color-1); color: var(--color-3); border: 1px solid rgba(255,255,255,.12); font-family: var(--font-2); font-size: 13px; font-weight: 500; white-space: nowrap; opacity: 0; translate: 8px 0; pointer-events: none; transition: opacity .25s, translate .25s; }
  @media (hover: hover) {
    .wa-float:hover .wa-float__btn { scale: 1.08; background: #20BA5A; }
    .wa-float:hover .wa-float__tip { opacity: 1; translate: 0 0; }
  }

  #footer { max-width: var(--container-max); margin-inline: auto; padding: clamp(28px, 3.5vw, 48px) calc(var(--page-gutter) + var(--space-2)) 28px; color: var(--color-3); }
  #footer .ft-top { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 24px; }
  #footer .ft-word { font-size: clamp(44px, 8.5vw, 108px); line-height: .88; letter-spacing: .02em; }
  #footer .ft-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 24px; margin-top: 24px; padding-top: 20px; border-top: 1.5px solid var(--color-6); color: var(--color-8); }
  #footer .ft-row span:last-child { margin-left: auto; text-align: right; }
  #footer nav { display: flex; flex-wrap: wrap; gap: 8px 24px; color: var(--color-8); }
  #footer nav a { text-decoration: none; padding-bottom: 2px; background: linear-gradient(currentColor, currentColor) 0 100% / 100% 1px no-repeat; transition: background-size .45s cubic-bezier(.3, .7, .2, 1), background-position 0s .45s; }
  @media (hover: hover) { #footer nav a:hover { background-size: 0 1px; background-position: 100% 100%; transition: background-size .45s cubic-bezier(.3, .7, .2, 1); } }
}

@layer scenes {
  [data-8b-live] { --ease-power3-out: linear(0, 0.0963, 0.1855, 0.2679, 0.3439, 0.4138, 0.478, 0.5367, 0.5904, 0.6392, 0.6836, 0.7237, 0.7599, 0.7924, 0.8215, 0.8474, 0.8704, 0.8907, 0.9085, 0.924, 0.9375, 0.9491, 0.959, 0.9674, 0.9744, 0.9802, 0.985, 0.9888, 0.9919, 0.9943, 0.9961, 0.9974, 0.9984, 0.9991, 0.9995, 0.9998, 0.9999, 1, 1, 1, 1); --ease-c6cd5f: linear(0, 0.0012, 0.0047, 0.0106, 0.0189, 0.0295, 0.0425, 0.0579, 0.0756, 0.0957, 0.1182, 0.143, 0.1702, 0.1997, 0.2316, 0.2659, 0.3025, 0.3415, 0.3829, 0.4266, 0.4727, 0.5211, 0.5719, 0.6251, 0.6806, 0.7385, 0.7988, 0.8614, 0.9264, 0.9938, 0.9697, 0.9387, 0.91, 0.8837, 0.8597, 0.8381, 0.8189, 0.802, 0.7875, 0.7754, 0.7656, 0.7582, 0.7532, 0.7505, 0.7502, 0.7522, 0.7566, 0.7634, 0.7725, 0.784, 0.7979, 0.8141, 0.8327, 0.8536, 0.8769, 0.9026, 0.9306, 0.961, 0.9938, 0.9867, 0.9727, 0.9609, 0.9516, 0.9446, 0.94, 0.9377, 0.9379, 0.9403, 0.9452, 0.9524, 0.9619, 0.9738, 0.9881, 0.9977, 0.991, 0.9866, 0.9845, 0.9849, 0.9875, 0.9926, 1); --ease-power2-inout: linear(0, 0.0001, 0.0005, 0.0017, 0.004, 0.0078, 0.0135, 0.0214, 0.032, 0.0456, 0.0625, 0.0832, 0.108, 0.1373, 0.1715, 0.2109, 0.256, 0.3071, 0.3645, 0.4287, 0.5, 0.5713, 0.6355, 0.6929, 0.744, 0.7891, 0.8285, 0.8627, 0.892, 0.9168, 0.9375, 0.9544, 0.968, 0.9786, 0.9865, 0.9922, 0.996, 0.9983, 0.9995, 0.9999, 1); }
  [data-8b-live] [data-8b-motion~="stretch"] { animation-name: motion-stretch---m-wd; animation-duration: 1.1s; animation-delay: 0s; animation-timing-function: var(--ease-power3-out); animation-fill-mode: both; animation-play-state: paused; }
  [data-8b-live] [data-8b-motion~="stretch"].is-in { animation-play-state: running; }
  [data-8b-live] [data-8b-motion~="drop"] { animation-name: motion-drop-translate, motion-drop-rotate, motion-drop-opacity; animation-duration: 0.9s; animation-delay: 0s; animation-timing-function: var(--ease-c6cd5f); animation-fill-mode: both; animation-play-state: paused; transform: none; }
  [data-8b-live] [data-8b-motion~="drop"].is-in { animation-play-state: running; }
  [data-8b-live] [data-8b-motion~="draw"] { animation-name: motion-draw-strokedashoffset, motion-draw-strokedasharray; animation-duration: 1.3s; animation-delay: 0s; animation-timing-function: cubic-bezier(0.65, 0, 0.35, 1), linear; animation-fill-mode: both; animation-play-state: paused; }
  [data-8b-live] [data-8b-motion~="draw"].is-in { animation-play-state: running; }
  @keyframes motion-stretch---m-wd { 0% { --m-wd: 88; } 100% { --m-wd: 112; } }
  @keyframes motion-drop-translate { 0% { translate: 0px -70px; } 100% { translate: 0px 0px; } }
  @keyframes motion-drop-rotate { 0% { rotate: var(--drop-rotate-from, 28deg); } 100% { rotate: 0deg; } }
  @keyframes motion-drop-opacity { 0% { opacity: 0; } 100% { opacity: 1; } }
  @keyframes motion-draw-strokedashoffset { 0% { stroke-dashoffset: 100px; } 100% { stroke-dashoffset: 0px; } }
  @keyframes motion-draw-strokedasharray { 0% { stroke-dasharray: 100px; animation-timing-function: cubic-bezier(0.65, 0, 0.35, 1); } 100% { stroke-dasharray: 100px; } }

  [data-8b-live] #curve .cv-bar { animation-duration: .9167s; animation-delay: calc(.3833s + var(--i, 0) * .0833s); animation-timing-function: cubic-bezier(0.65, 0, 0.35, 1); animation-fill-mode: backwards; will-change: scale; --curve-flat: min(4, calc(.5 / max(var(--cv-h), .06))); }
  [data-8b-live] #curve .cv-line polyline { stroke-dasharray: 100px; animation-name: curve-line; animation-duration: .75s; animation-delay: 1.1333s; animation-timing-function: linear; animation-fill-mode: backwards; }
  @keyframes curve-bar-y { 0% { scale: 1 var(--curve-flat); background-color: var(--color-8); } }
  @keyframes curve-bar-x { 0% { scale: var(--curve-flat) 1; background-color: var(--color-8); } }
  @keyframes curve-line { 0% { stroke-dashoffset: 100px; } 100% { stroke-dashoffset: 0px; } }
  @media (min-width: 768px) {
    [data-8b-live] #curve .cv-bar { animation-name: curve-bar-y; }
  }
  @media (max-width: 767.98px) {
    [data-8b-live] #curve .cv-bar { animation-name: curve-bar-x; }
  }

  [data-8b-live] #disciplines .m-notch > .m-text-2 { --m-wd: 112; }
  [data-8b-live] #disciplines .ds-rows { view-timeline: --disciplines-t1 block; view-timeline-inset: 0; }
  [data-8b-live] #disciplines .ds-rows > li { animation-timeline: --disciplines-t1; animation-range: cover calc(5vh + 8.5882vh * var(--i)) cover calc(52.2353vh + 8.5882vh * var(--i)); animation-timing-function: var(--ease-power2-inout); animation-fill-mode: both; transform: none; }
  @keyframes disciplines-li-ds-row-rotate-d { 0% { rotate: var(--disciplines-li-ds-row-rotate-from, -9deg); } 100% { rotate: 0deg; } }
  @keyframes disciplines-li-ds-row-rotate-m { 0% { rotate: var(--disciplines-li-ds-row-rotate-from-m, -5deg); } 100% { rotate: 0deg; } }
  @keyframes disciplines-li-ds-row-translate-d { 0% { translate: var(--disciplines-li-ds-row-translate-from, 22%) var(--disciplines-li-ds-row-translate-from-2, 50px); } 100% { translate: 0px 0px; } }
  @keyframes disciplines-li-ds-row-translate-m { 0% { translate: var(--disciplines-li-ds-row-translate-from-m, 5%) var(--disciplines-li-ds-row-translate-from-2-m, 24px); } 100% { translate: 0px 0px; } }
  @keyframes disciplines-li-ds-row-clippath-d { 0% { clip-path: inset(0% 60% 0% 0% round 999px 28px 28px 999px); } 100% { clip-path: inset(0% round 999px 28px 28px 999px); } }
  @keyframes disciplines-li-ds-row-clippath-m { 0% { clip-path: inset(0% 34% 0% 0% round 44px); } 100% { clip-path: inset(0% round 44px); } }
  @media (min-width: 768px) {
    [data-8b-live] #disciplines .ds-rows > li { animation-name: disciplines-li-ds-row-rotate-d, disciplines-li-ds-row-translate-d, disciplines-li-ds-row-clippath-d; }
  }
  @media (max-width: 767.98px) {
    [data-8b-live] #disciplines .ds-rows > li { animation-name: disciplines-li-ds-row-rotate-m, disciplines-li-ds-row-translate-m, disciplines-li-ds-row-clippath-m; }
  }

  [data-8b-live] #app .m-text-2 { --m-wd: 112; }
  [data-8b-live] #app .ap-phone { aspect-ratio: 300 / 620; }
  [data-8b-live] #app .ap-screen { height: 100%; }
  [data-8b-live] #app .ap-strip { position: relative; height: 100%; }
  [data-8b-live] #app .ap-view { position: absolute; inset: 0; aspect-ratio: auto; }
  [data-8b-live] #app .ap-view + .ap-view { border-top: 0; animation-name: app-wipe; }
  [data-8b-live] #app .ap-view + .ap-view > * { animation-name: app-rise; }
  [data-8b-live] #app .ap-grid { timeline-scope: --app-run; }
  [data-8b-live] #app .ap-view + .ap-view, [data-8b-live] #app .ap-view + .ap-view > * { animation-timeline: --app-run; animation-range: cover calc(var(--app-from) + var(--app-at) * (var(--app-to) - var(--app-from))) cover calc(var(--app-from) + (var(--app-at) + var(--app-for)) * (var(--app-to) - var(--app-from))); animation-timing-function: var(--ease-power2-inout); animation-fill-mode: both; }
  @keyframes app-wipe { 0% { clip-path: inset(100% 0% 0%); } 100% { clip-path: inset(0%); } }
  @keyframes app-rise { 0% { translate: 0px 40px; } 100% { translate: 0px 0px; } }
  @media (min-width: 768px) {
    [data-8b-live] #app { --app-from: calc(var(--app-first) + 50vh); --app-to: calc(var(--app-last) + 50vh); }
    [data-8b-live] #app .ap-stage { position: sticky; top: calc(50svh - 330px); }
    [data-8b-live] #app .ap-notes { view-timeline: --app-run block; }
  }
  @media (max-width: 767.98px) {
    [data-8b-live] #app { --app-from: 84vh; --app-to: calc(100% - 85vh); }
    [data-8b-live] #app .ap-stage { display: block; height: 190svh; view-timeline: --app-run block; }
    [data-8b-live] #app .ap-phone { position: sticky; top: max(72px, calc(50svh - 280px)); margin: 0 auto; }
  }

  [data-8b-live] #challenge .ch-map { view-timeline: --challenge-map block; }
  [data-8b-live] #challenge .ch-route { stroke-dasharray: 100px; animation-name: challenge-route; animation-timeline: --challenge-map; animation-timing-function: linear; animation-fill-mode: both; }
  @keyframes challenge-route { 0% { stroke-dashoffset: 100px; } 100% { stroke-dashoffset: 0px; } }
  @media (min-width: 768px) {
    [data-8b-live] #challenge .ch-route { animation-range: cover 22vh cover calc(100% - 48vh); }
  }
  @media (max-width: 767.98px) {
    [data-8b-live] #challenge .ch-route { animation-range: cover 22vh cover calc(100% - 58vh); }
  }

  [data-8b-live] #pricing .m-text-2 { --m-wd: 112; }
  [data-8b-live] #pricing .pr-plans { view-timeline: --pricing-list block; }
  [data-8b-live] #pricing .pr-plan { --pricing-off: calc((var(--n) - 1) / 2 - var(--i)); animation-timeline: --pricing-list; animation-timing-function: cubic-bezier(0.3333, 1, 0.6667, 1); animation-fill-mode: both; }
  @keyframes pricing-fan { 0% { translate: calc(var(--pricing-off) * (100% + 12px)) calc(max(var(--pricing-off), -1 * var(--pricing-off)) * 40px); rotate: calc(var(--pricing-off) * -9deg); } 100% { translate: 0px 0px; rotate: 0deg; } }
  @keyframes pricing-stack { 0% { translate: 0px calc(var(--i) * (100% + 12px) * -.85); rotate: calc(min(1, var(--i)) * (2 * mod(var(--i), 2) - 1) * 4deg); } 100% { translate: 0px 0px; rotate: 0deg; } }
  @media (min-width: 901px) {
    [data-8b-live] #pricing .pr-plan { animation-name: pricing-fan; animation-range: cover 8vh cover 68vh; }
  }
  @media (max-width: 900.98px) {
    [data-8b-live] #pricing .pr-plan { animation-name: pricing-stack; animation-range: cover 8vh cover calc(100% - 85vh); }
  }

  [data-8b-live] #contact .m-text-2 { --m-wd: 112; }
  [data-8b-live] #contact { view-timeline: --contact-t1 block; view-timeline-inset: 0; }
  [data-8b-live] #contact .ct-shade { animation-name: contact-div-ct-shade-clippath; animation-timeline: --contact-t1; animation-range: cover 4vh cover 42vh; animation-timing-function: cubic-bezier(0.65, 0, 0.35, 1); animation-fill-mode: both; }
  @keyframes contact-div-ct-shade-clippath { 0% { clip-path: inset(0% 28% 18% 0% round 26px); } 100% { clip-path: inset(0% 100% 100% 0% round 26px); } }
}
