:root {
    --color-bg: #fffaf5;
    --color-surface: #ffffff;
    --color-hero: #e6e8ef;
    --color-primary: #001965;
    --color-primary-soft: #243978;
    --button-primary-hover: #001965;
    --button-primary-hover-ring: #d9e6f8;
    --button-primary-pressed: #66769f;
    --button-primary-disabled: #a4aec7;
    --button-outline-hover: #d9e6f8;
    --button-outline-pressed: #a8b6d2;
    --button-outline-disabled: #98a5bf;
    --color-border: rgba(0, 25, 101, 0.14);
    --shadow-header: 8px 4px 22.5px rgba(235, 232, 229, 0.92);
    --font-body: Apis, Arial, Helvetica, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --page-container-max: 1600px;
    --page-container-gutter: clamp(16px, 8.333vw, 160px);
    --page-container-width: min(var(--page-container-max), calc(100% - var(--page-container-gutter) - var(--page-container-gutter)));
    --page-container-side: max(var(--page-container-gutter), calc((100vw - var(--page-container-max)) / 2));
    --anchor-offset: 132px;
}

* {
    box-sizing: border-box;
}

[hidden] {
    display: none !important;
}

body {
    margin: 0;
    background: var(--color-bg);
    color: var(--color-primary);
    font-family: var(--font-body);
    line-height: 1.4;
}

html {
    scroll-behavior: smooth;
}

section[id] {
    scroll-margin-top: var(--anchor-offset);
}

#quiz,
#problem,
#signals,
#stages,
#solution,
#find {
    scroll-margin-top: var(--anchor-offset);
}

a {
    color: var(--color-primary);
    text-decoration: none;
}

.site-main {
    overflow: hidden;
}

.site-header {
    position: sticky;
    z-index: 20;
    top: 0;
    width: 100%;
    height: 120px;
    background: var(--color-surface);
    box-shadow: var(--shadow-header);
}

.site-header__inner {
    display: grid;
    grid-template-columns: 70px minmax(0, 1fr) 218px;
    align-items: center;
    gap: clamp(32px, 3.75vw, 72px);
    height: 100%;
    padding: 0 clamp(24px, 3.333vw, 64px) 0 clamp(24px, 8.333vw, 160px);
}

.site-brand {
    display: block;
    width: 70px;
    height: 50px;
}

.site-brand img {
    display: block;
    width: 70px;
    height: 50px;
}

.site-nav {
    display: flex;
    align-items: center;
    gap: clamp(24px, 2.5vw, 48px);
    min-width: 0;
}

.site-nav__link {
    position: relative;
    display: inline-flex;
    align-items: center;
    min-height: 50px;
    color: var(--color-primary);
    font-size: 18px;
    font-weight: 700;
    line-height: 1.25;
    white-space: nowrap;
}

.site-nav__link::after {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 1px;
    background: currentColor;
    content: "";
    opacity: 0;
}

.site-nav__link:hover::after,
.site-nav__link:focus-visible::after,
.site-nav__link.is-active::after {
    opacity: 1;
}

.site-header__cta,
.hero__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--color-primary);
    border-radius: 12px;
    background: var(--color-primary);
    color: #ffffff;
    font-weight: 700;
    text-align: center;
    transition: background 160ms ease, border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.site-header__cta:hover,
.site-header__cta:focus-visible,
.hero__button:hover,
.hero__button:focus-visible {
    border-color: var(--button-primary-hover);
    background: var(--button-primary-hover);
    box-shadow: 0 0 0 6px var(--button-primary-hover-ring);
    transform: translateY(-1px);
}

.site-header__cta:active,
.hero__button:active {
    border-color: var(--button-primary-pressed);
    background: var(--button-primary-pressed);
    box-shadow: none;
}

.site-header__cta {
    width: 218px;
    height: 70px;
    font-size: 18px;
    line-height: 1.2;
}

.site-nav-toggle {
    display: none;
}

.site-nav__mobile-cta {
    display: none;
}

.hero {
    position: relative;
    --hero-wave-top: clamp(868px, calc(25vw + 508px), 988px);
    --hero-wave-height: 135px;
    --hero-bg-split: calc(var(--hero-wave-top) + var(--hero-wave-height));
    min-height: clamp(1289px, calc(25vw + 929px), 1409px);
    background: linear-gradient(
        var(--color-hero) 0 var(--hero-bg-split),
        var(--color-bg) var(--hero-bg-split)
    );
    overflow: hidden;
}

.hero::after {
    position: absolute;
    z-index: 3;
    top: calc(var(--hero-bg-split) - 1px);
    right: 0;
    bottom: 0;
    left: 0;
    background: var(--color-bg);
    content: "";
    pointer-events: none;
}

.hero__content {
    position: relative;
    z-index: 5;
    width: min(880px, calc(100% - 48px));
    padding-top: clamp(64px, calc(26.25vw - 314px), 190px);
    margin-left: clamp(24px, 8.49vw, 163px);
}

.hero__title {
    width: min(920px, 100%);
    margin: 0;
    color: var(--color-primary);
    font-size: 64px;
    font-weight: 800;
    line-height: 1.3;
    letter-spacing: 0;
}

.hero__title em {
    font-style: italic;
    font-weight: 400;
}

.hero__title-line {
    display: block;
}

.hero__lead {
    width: min(660px, 100%);
    margin: 28px 0 0;
    color: var(--color-primary);
    font-size: 36px;
    font-weight: 400;
    line-height: 1.22;
}

.hero__button {
    gap: 35px;
    width: 370px;
    height: 70px;
    margin-top: clamp(38px, calc(134px - 5vw), 62px);
    padding: 0 46px;
    font-size: 16px;
    line-height: 1.2;
}

.hero__button img {
    display: block;
    flex: 0 0 14px;
    width: 14px;
    height: 11px;
}

.hero__disclaimer {
    width: min(690px, 100%);
    margin: clamp(60px, calc(132px - 3.75vw), 78px) 0 0;
    color: var(--color-primary);
    font-size: 12px;
    font-weight: 500;
    line-height: 1.33;
}

.hero__decorations,
.hero__people,
.hero__wave {
    position: absolute;
    display: block;
    pointer-events: none;
    user-select: none;
}

.hero__decorations {
    z-index: 1;
    top: 80px;
    right: 48px;
    width: 922px;
    height: 883px;
}

.hero__people {
    z-index: 2;
    top: clamp(-53px, calc(25vw - 413px), 67px);
    right: -127px;
    width: 1097px;
    height: auto;
    transform: scaleX(-1);
    transform-origin: center;
}

.hero__wave {
    z-index: 4;
    top: var(--hero-wave-top);
    left: 0;
    width: 100%;
    height: var(--hero-wave-height);
    transform: scaleY(-1);
    transform-origin: center;
}

.next-block-placeholder {
    min-height: 120px;
    background: var(--color-bg);
}

.quiz {
    position: relative;
    z-index: 5;
    scroll-margin-top: 120px;
    margin-top: -271px;
    min-height: 866px;
    background: var(--color-bg);
}

.quiz__inner {
    display: grid;
    grid-template-columns: 683px 628px;
    gap: 152px;
    width: min(1600px, calc(100% - 80px));
    min-height: 866px;
    padding: 72px 0 39px;
    margin-inline: auto;
}

.quiz__intro {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 683px;
    min-height: 684px;
    padding-top: 148px;
}

.quiz__intro-main {
    display: grid;
    gap: 30px;
}

.quiz__pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: fit-content;
    height: 44px;
    padding: 10px 24px;
    border-radius: 20px;
    background: var(--color-primary);
    color: #ffffff;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.5;
}

.quiz__pill img {
    width: 24px;
    height: 24px;
}

.quiz__title {
    width: 683px;
    margin: 0;
    color: var(--color-primary);
    font-size: 36px;
    font-weight: 700;
    line-height: 1.22;
    letter-spacing: 0;
}

.quiz__lead {
    width: 635px;
    margin: 0;
    color: var(--color-primary);
    font-size: 24px;
    font-weight: 400;
    line-height: 1.33;
}

.quiz__footnote {
    width: 683px;
    margin: 0;
    color: var(--color-primary);
    font-size: 12px;
    font-weight: 400;
    line-height: 1.33;
}

.quiz__card {
    position: relative;
    width: 628px;
    min-height: 788px;
    padding: 56px 70px;
    overflow: hidden;
    border-radius: 36px;
    background: #ffffff;
    box-shadow: 8px 4px 45px #ebe8e5;
}

.quiz__steps {
    min-height: 592px;
}

.quiz__step {
    position: relative;
    min-width: 0;
    min-height: 592px;
    margin: 0;
    padding: 0;
    border: 0;
    isolation: isolate;
}

.quiz__question {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: 475px;
    margin: 0 0 22px;
    color: var(--color-primary);
    font-size: 24px;
    font-weight: 700;
    line-height: 1.33;
}

.quiz__options {
    display: grid;
    position: relative;
    z-index: 2;
    gap: 12px;
}

.quiz__option {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    min-height: 76px;
    padding: 16px 20px;
    border: 1px solid #99a3c1;
    border-radius: 10px;
    background: #ffffff;
    color: var(--color-primary);
    cursor: pointer;
    font-size: 18px;
    font-weight: 400;
    line-height: 1.38;
    transition: border-color 160ms ease, background 160ms ease, box-shadow 160ms ease;
}

.quiz__option:hover,
.quiz__option:focus-within {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 2px rgba(0, 25, 101, 0.08);
}

.quiz__option.is-selected {
    border-color: var(--color-primary);
    background: #d9e6f8;
}

.quiz__option input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.quiz__box {
    position: relative;
    display: grid;
    place-items: center;
    flex: 0 0 16px;
    width: 16px;
    height: 16px;
    border: 1px solid var(--color-primary);
    border-radius: 1px;
}

.quiz__option input:checked + .quiz__box::after {
    display: block;
    width: 4px;
    height: 8px;
    border-right: 2px solid var(--color-primary);
    border-bottom: 2px solid var(--color-primary);
    content: "";
    transform: translateY(-1px) rotate(45deg);
}

.quiz__fields {
    display: grid;
    position: relative;
    z-index: 2;
    gap: 16px;
    width: min(220px, 100%);
}

.quiz__field {
    display: grid;
    gap: 8px;
    width: 100%;
    color: var(--color-primary);
    font-size: 15px;
    line-height: 1.4;
}

.quiz__field input {
    width: 100%;
    height: 64px;
    padding: 0 20px;
    border: 1px solid #99a3c1;
    border-radius: 10px;
    color: var(--color-primary);
    font: inherit;
    font-size: 16px;
}

.quiz__field input:focus {
    border-color: var(--color-primary);
    outline: 0;
    box-shadow: 0 0 0 2px rgba(0, 25, 101, 0.08);
}

.quiz__bmi {
    position: relative;
    z-index: 2;
    max-width: 300px;
    margin: -8px 0 18px;
    color: var(--color-primary);
    font-size: 16px;
    line-height: 1.5;
}

.quiz__step-illustration {
    position: absolute;
    z-index: 1;
    display: block;
    max-width: 100%;
    height: auto;
    pointer-events: none;
    user-select: none;
}

.quiz__step-illustration--bike {
    right: -18px;
    top: 250px;
    width: 305px;
}

.quiz__step-illustration--people {
    right: -40px;
    top: 290px;
    width: 440px;
}

.quiz__step-illustration--wave {
    right: -86px;
    top: 300px;
    width: 541px;
}

.quiz__step-illustration--dna {
    right: -30px;
    top: 340px;
    width: 60px;
}

.quiz__step-illustration--condition {
    width: 570px;
}

.quiz__step--4 .quiz__step-illustration--condition {
    position: static;
    width: min(570px, calc(100% + 140px));
    max-width: none;
    margin: 42px -88px 0 -62px;
}

.quiz__error {
    min-height: 22px;
    margin: 20px 0 0;
    color: #b3261e;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.35;
}

.quiz__error:empty {
    display: none;
}

.quiz__controls {
    position: relative;
    z-index: 3;
    display: flex;
    align-items: center;
    gap: 24px;
    width: 100%;
    margin-top: 16px;
}

.quiz__progress {
    display: flex;
    flex: 1 1 auto;
    align-items: center;
    gap: 12px;
    color: var(--color-primary);
    font-size: 16px;
    font-weight: 500;
    line-height: 1.5;
    white-space: nowrap;
}

.quiz__progress-track {
    position: relative;
    display: block;
    flex: 0 0 250px;
    height: 8px;
    overflow: hidden;
    border-radius: 24px;
    background: #ccd1e0;
}

.quiz__progress-bar {
    display: block;
    width: 20.4%;
    height: 100%;
    border-radius: inherit;
    background: var(--color-primary);
    transition: width 180ms ease;
}

.quiz__next,
.quiz__result-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    height: 44px;
    border: 1px solid var(--color-primary);
    border-radius: 12px;
    background: var(--color-primary);
    color: #ffffff;
    cursor: pointer;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.35;
    transition: background 160ms ease, border-color 160ms ease, box-shadow 160ms ease, color 160ms ease;
}

.quiz__next:hover,
.quiz__next:focus-visible,
.quiz__result-cta:hover,
.quiz__result-cta:focus-visible {
    border-color: var(--button-primary-hover);
    background: var(--button-primary-hover);
    box-shadow: 0 0 0 6px var(--button-primary-hover-ring);
    color: #ffffff;
}

.quiz__next:active,
.quiz__result-cta:active {
    border-color: var(--button-primary-pressed);
    background: var(--button-primary-pressed);
    box-shadow: none;
}

.quiz__next {
    width: 166px;
}

.quiz__next img {
    display: block;
    flex: 0 0 auto;
    width: 14px;
    height: 11px;
}

.quiz__next:disabled {
    border-color: var(--button-primary-disabled);
    background: var(--button-primary-disabled);
    box-shadow: none;
    color: #d9e0ee;
    cursor: not-allowed;
    opacity: 1;
}

.quiz__result {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 374px;
    grid-template-rows: minmax(0, 1fr) auto;
    column-gap: 88px;
    min-height: 704px;
    color: var(--color-primary);
}

.quiz__result-copy {
    grid-column: 1 / 2;
    max-width: 1050px;
    padding-top: 8px;
}

.quiz__result-eyebrow {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

.quiz__result-title {
    margin: 0;
    max-width: 980px;
    color: var(--color-primary);
    font-size: clamp(54px, 5vw, 84px);
    font-weight: 800;
    line-height: 1.13;
    letter-spacing: 0;
}

.quiz__result-body {
    max-width: 1100px;
    margin: 42px 0 0;
    color: var(--color-primary);
    font-size: 28px;
    font-weight: 400;
    line-height: 1.45;
}

.quiz__result-bmi-card {
    grid-column: 2 / 3;
    align-self: start;
    display: grid;
    justify-items: center;
    gap: 28px;
    min-height: 278px;
    padding: 58px 32px 50px;
    border-radius: 30px;
    background: #ffffff;
    box-shadow: 8px 24px 58px rgba(0, 25, 101, 0.08);
}

.quiz__result-bmi-icon {
    display: block;
    width: 96px;
    height: 96px;
    background: url("../images/figma/quiz-result-bmi.png") center / contain no-repeat;
}

.quiz__result-bmi {
    margin: 0;
    color: var(--color-primary);
    font-size: 27px;
    font-weight: 800;
    line-height: 1.25;
    text-align: center;
}

.quiz__result-bmi span,
.quiz__result-bmi strong {
    color: #0266ff;
}

.quiz__result-cta {
    grid-column: 2 / 3;
    grid-row: 2 / 3;
    align-self: end;
    width: 520px;
    max-width: 100%;
    height: 102px;
    margin: 0;
    border-radius: 15px;
    font-size: 28px;
    font-weight: 600;
}

.quiz__result-cta::after {
    content: "→";
    font-size: 34px;
    font-weight: 300;
    line-height: 1;
}

.quiz__result-note {
    grid-column: 1 / 2;
    grid-row: 2 / 3;
    align-self: end;
    max-width: 960px;
    margin: 0;
    color: var(--color-primary);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.34;
}

.quiz__result-decor {
    position: absolute;
    width: 21px;
    height: 21px;
    pointer-events: none;
    user-select: none;
}

.quiz__result-decor--circle-one {
    top: 392px;
    right: 318px;
}

.quiz__result-decor--circle-two {
    top: 518px;
    right: 586px;
}

.quiz__result-decor--plus-one {
    top: 106px;
    right: 534px;
}

.quiz__result-decor--plus-two {
    top: 382px;
    right: 668px;
}

.quiz__result-decor--plus-three {
    right: 498px;
    bottom: 150px;
}

body.is-result-modal-open {
    overflow: hidden;
}

.quiz-result-modal {
    position: fixed;
    inset: 0;
    z-index: 80;
    display: grid;
    align-items: center;
    justify-items: center;
    padding: clamp(14px, 2.5vw, 48px);
    overflow-y: auto;
    overflow-x: hidden;
    background: rgba(255, 250, 245, 0.94);
    color: var(--color-primary);
    font-family: var(--font-body);
}

.quiz-result-modal__dialog {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 839px) minmax(240px, 280px);
    grid-template-rows: auto auto minmax(36px, 1fr);
    column-gap: clamp(48px, 6vw, 137px);
    row-gap: 24px;
    width: min(1366px, calc(100vw - 28px));
    min-height: min(666px, calc(100vh - 56px));
    max-height: calc(100vh - 56px);
    overflow-y: auto;
    overflow-x: hidden;
    padding: clamp(48px, 4.4vw, 72px) clamp(48px, 4.7vw, 64px);
    border-radius: 24px;
    background:
        url("../images/figma/quiz-plus.svg") 67% 21% / 21px 21px no-repeat,
        url("../images/figma/quiz-plus.svg") 2% 67% / 21px 21px no-repeat,
        url("../images/figma/quiz-plus.svg") 68% 76% / 21px 21px no-repeat,
        url("../images/figma/quiz-plus.svg") 98% 16% / 21px 21px no-repeat,
        url("../images/figma/quiz-circle.svg") 63% 71% / 21px 21px no-repeat,
        url("../images/figma/quiz-circle.svg") 78% 56% / 21px 21px no-repeat,
        url("../images/figma/quiz-circle.svg") 98% 58% / 21px 21px no-repeat,
        #ffffff;
    box-shadow: 8px 24px 58px rgba(0, 25, 101, 0.1);
}

.quiz-result-modal__close {
    position: absolute;
    top: 22px;
    right: 22px;
    width: 42px;
    height: 42px;
    border: 1px solid rgba(0, 25, 101, 0.2);
    border-radius: 50%;
    background: #ffffff;
    color: var(--color-primary);
    cursor: pointer;
    font-family: var(--font-body);
}

.quiz-result-modal__close::before,
.quiz-result-modal__close::after {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 18px;
    height: 2px;
    border-radius: 2px;
    background: currentColor;
    content: "";
}

.quiz-result-modal__close::before {
    transform: translate(-50%, -50%) rotate(45deg);
}

.quiz-result-modal__close::after {
    transform: translate(-50%, -50%) rotate(-45deg);
}

.quiz-result-modal__close:hover,
.quiz-result-modal__close:focus-visible {
    outline: 2px solid rgba(0, 25, 101, 0.28);
    outline-offset: 3px;
}

.quiz-result-modal__eyebrow {
    display: none;
}

.quiz-result-modal__title {
    grid-column: 1 / 2;
    grid-row: 1 / 2;
    max-width: 820px;
    margin: 0;
    color: var(--color-primary);
    font-size: 36px;
    font-weight: 700;
    line-height: 44px;
    letter-spacing: 0;
}

.quiz-result-modal__body {
    grid-column: 1 / 2;
    grid-row: 2 / 3;
    max-width: 800px;
    margin: 0;
    color: var(--color-primary);
    font-size: 18px;
    font-weight: 400;
    line-height: 28px;
}

.quiz-result-modal__bmi-card {
    grid-column: 2 / 3;
    grid-row: 1 / 4;
    align-self: start;
    display: grid;
    justify-items: center;
    gap: 12px;
    width: 280px;
    min-height: 224px;
    padding: 36px 24px;
    border-radius: 24px;
    background: #ffffff;
    box-shadow: 8px 4px 45px rgba(235, 232, 229, 0.96);
}

.quiz-result-modal__bmi-icon {
    width: 80px;
    height: 80px;
    background: url("../images/figma/quiz-result-bmi.png") center / contain no-repeat;
}

.quiz-result-modal__bmi {
    margin: 0;
    color: var(--color-primary);
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    text-align: center;
}

.quiz-result-modal__bmi span,
.quiz-result-modal__bmi strong {
    font-size: 24px;
    font-weight: 700;
    line-height: 32px;
}

.quiz-result-modal__bmi span {
    color: #005ad2;
}

.quiz-result-modal__bmi strong {
    display: block;
    margin-top: 8px;
    color: var(--color-primary);
    font-size: 18px;
    line-height: 24px;
}

.quiz-result-modal__cta {
    grid-column: 2 / 3;
    grid-row: 3 / 4;
    align-self: end;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 280px;
    min-height: 70px;
    padding: 0 48px;
    border: 1px solid var(--color-primary);
    border-radius: 12px;
    background: var(--color-primary);
    color: #ffffff;
    font-size: 16px;
    font-weight: 500;
    line-height: 22px;
    text-decoration: none;
    white-space: nowrap;
    transition: background 160ms ease, border-color 160ms ease, box-shadow 160ms ease, color 160ms ease;
}

.quiz-result-modal__cta:hover,
.quiz-result-modal__cta:focus-visible {
    border-color: var(--button-primary-hover);
    background: var(--button-primary-hover);
    box-shadow: 0 0 0 6px var(--button-primary-hover-ring);
    color: #ffffff;
}

.quiz-result-modal__cta:active {
    border-color: var(--button-primary-pressed);
    background: var(--button-primary-pressed);
    box-shadow: none;
}

.quiz-result-modal__cta::after {
    content: "→";
    margin-top: -3px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    font-weight: 300;
    line-height: 1;
}

.quiz-result-modal__details {
    grid-column: 1 / 2;
    grid-row: 3 / 4;
    align-self: end;
    display: grid;
    gap: 16px;
    max-width: 800px;
    color: var(--color-primary);
}

.quiz-result-modal__promo {
    margin: 0;
    padding: 0;
}

.quiz-result-modal__promo[hidden] {
    display: none;
}

.quiz-result-modal__promo h4 {
    margin: 0 0 6px;
    color: var(--color-primary);
    font-size: 24px;
    font-weight: 700;
    line-height: 32px;
}

.quiz-result-modal__promo p {
    margin: 0;
    color: var(--color-primary);
    font-size: 18px;
    font-weight: 400;
    line-height: 28px;
}

.quiz-result-modal__note {
    max-width: 769px;
    margin: 0;
    color: var(--color-primary);
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
}

.quiz-result-modal__promo-code {
    display: block;
    margin: 0;
    color: var(--color-primary);
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
}

.quiz-result-modal[data-result-type="education_18"] .quiz-result-modal__dialog,
.quiz-result-modal[data-result-type="under_18"] .quiz-result-modal__dialog {
    min-height: min(614px, calc(100vh - 28px));
}

.quiz-result-modal[data-result-type="education_18"] .quiz-result-modal__title,
.quiz-result-modal[data-result-type="under_18"] .quiz-result-modal__title {
    max-width: 760px;
    font-size: clamp(46px, 4.7vw, 64px);
    font-weight: 800;
    line-height: 1.12;
}

@media (max-width: 767px) {
    .quiz-result-modal {
        display: block;
        align-items: start;
        min-height: 100vh;
        min-height: 100dvh;
        height: auto;
        overflow-y: auto;
        padding: 20px 20px 0;
        scroll-padding: 20px;
    }

    .quiz-result-modal__dialog {
        grid-template-columns: 1fr;
        grid-template-rows: auto;
        gap: 24px;
        width: calc(100vw - 40px);
        max-width: 100%;
        min-height: 0;
        max-height: none;
        padding: 24px 18px;
        margin: 0 auto 20px;
        border-radius: 24px;
        background: #ffffff;
    }

    .quiz-result-modal__close {
        top: 16px;
        right: 16px;
        width: 36px;
        height: 36px;
    }

    .quiz-result-modal__eyebrow {
        padding-right: 46px;
        font-size: 12px;
        line-height: 16px;
    }

    .quiz-result-modal__title {
        grid-column: 1 / -1;
        grid-row: auto;
        padding-right: 34px;
        font-size: 20px;
        font-weight: 700;
        line-height: 28px;
    }

    .quiz-result-modal__body {
        grid-column: 1 / -1;
        grid-row: auto;
        font-size: 18px;
        line-height: 24px;
    }

    .quiz-result-modal__bmi-card {
        grid-column: 1 / -1;
        grid-row: auto;
        gap: 12px;
        justify-items: center;
        width: 100%;
        min-height: 204px;
        padding: 36px 24px;
        border-radius: 24px;
        box-shadow: 8px 4px 45px rgba(235, 232, 229, 0.96);
    }

    .quiz-result-modal__bmi-icon {
        width: 80px;
        height: 80px;
    }

    .quiz-result-modal__bmi {
        font-size: 16px;
        font-weight: 500;
        line-height: 24px;
        text-align: center;
    }

    .quiz-result-modal__bmi strong {
        font-size: 18px;
        line-height: 24px;
    }

    .quiz-result-modal__cta {
        grid-column: 1 / -1;
        grid-row: auto;
        width: 100%;
        min-height: 60px;
        font-size: 16px;
        font-weight: 500;
        line-height: 22px;
        white-space: nowrap;
    }

    .quiz-result-modal__cta::after {
        display: none;
    }

    .quiz-result-modal__details {
        grid-column: 1 / -1;
        grid-row: auto;
        align-self: auto;
    }

    .quiz-result-modal__promo {
        grid-column: 1 / -1;
        grid-row: auto;
        margin-top: 0;
    }

    .quiz-result-modal__promo h4 {
        font-size: 18px;
        line-height: 24px;
    }

    .quiz-result-modal__promo p {
        font-size: 16px;
        line-height: 24px;
    }

    .quiz-result-modal__note {
        grid-column: 1 / -1;
        grid-row: auto;
        font-size: 11px;
        line-height: 14px;
    }

    .quiz-result-modal__promo-code {
        grid-column: 1 / -1;
        grid-row: auto;
        font-size: 12px;
        line-height: 16px;
    }

    .quiz-result-modal[data-result-type="education_18"] .quiz-result-modal__dialog,
    .quiz-result-modal[data-result-type="under_18"] .quiz-result-modal__dialog {
        min-height: 0;
    }

    .quiz-result-modal[data-result-type="education_18"] .quiz-result-modal__title,
    .quiz-result-modal[data-result-type="under_18"] .quiz-result-modal__title {
        max-width: none;
        font-size: 20px;
        line-height: 28px;
    }
}

.quiz__decor {
    position: absolute;
    width: 21px;
    height: 21px;
    pointer-events: none;
    user-select: none;
}

.quiz__decor--circle-one {
    top: 278px;
    right: 42px;
}

.quiz__decor--circle-two {
    top: 476px;
    right: 42px;
}

.quiz__decor--plus-one {
    top: 128px;
    right: 31px;
}

.quiz__decor--plus-two {
    bottom: 272px;
    left: 27px;
}

.systems {
    position: relative;
    z-index: 6;
    scroll-margin-top: 120px;
    min-height: 1349px;
    overflow: hidden;
    background: #fcf2f5;
}

.systems::before,
.systems::after {
    position: absolute;
    right: 0;
    left: 0;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%;
    content: "";
}

.systems::before {
    z-index: 1;
    top: -1px;
    height: 160px;
    background-image: url("../images/figma/systems-wave-top.svg");
}

.systems::after {
    z-index: 2;
    bottom: -1px;
    height: 520px;
    background-image: url("../images/figma/systems-wave-bottom.svg");
}

.systems__inner {
    position: relative;
    width: min(1600px, calc(100% - 80px));
    min-height: 1349px;
    padding: 218px 0 90px;
    margin-inline: auto;
}

.systems__title,
.signals__title,
.stages__title {
    margin: 0;
    color: var(--color-primary);
    font-size: 56px;
    font-weight: 700;
    line-height: 1.14;
    letter-spacing: 0;
    text-align: center;
}

.systems__title {
    position: relative;
    z-index: 4;
}

.systems__title span,
.systems__title em {
    display: block;
}

.systems__title em {
    font-style: italic;
    font-weight: 400;
}

.systems__title-mobile-break {
    display: inline;
}

.systems__grid {
    position: relative;
    display: grid;
    grid-template-columns: minmax(620px, 1fr) 683px;
    align-items: start;
    gap: 60px;
    margin-top: 82px;
}

.systems__visual {
    position: relative;
    z-index: 1;
    min-height: 890px;
    margin-left: -150px;
}

.systems__art {
    display: block;
    width: min(975px, 67vw);
    height: auto;
    pointer-events: none;
    user-select: none;
}

.systems__badges {
    display: none;
    margin: 0;
    padding: 0;
    list-style: none;
}

.systems__badge {
    position: absolute;
    z-index: 3;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    margin: 0;
    pointer-events: none;
}

.systems__badge-icon {
    display: block;
    height: auto;
    mix-blend-mode: screen;
}

.systems__badge--heart .systems__badge-icon {
    width: 58px;
}

.systems__badge--metabolism .systems__badge-icon {
    width: 72px;
}

.systems__badge--kidneys .systems__badge-icon {
    width: 56px;
}

.systems__badge-label {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    max-width: min(220px, 58vw);
    margin-top: -6px;
    padding: 10px 24px;
    border-radius: 999px;
    background: #fff;
    box-shadow: 8px 4px 45px rgba(235, 232, 229, 0.95);
    color: #005AD2;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.25;
    text-align: center;
}

.systems__badge--heart .systems__badge-label {
    margin-left: 30px;
    left: 20px;
    top: 10px;
}

.systems__badge-label::before {
    position: absolute;
    top: -7px;
    left: 50%;
    width: 14px;
    height: 10px;
    background: #fff;
    clip-path: polygon(50% 0, 100% 100%, 0 100%);
    content: "";
    transform: translateX(-50%);
}

@media (min-width: 1181px) {
    .systems__art {
        transform: translateY(84px);
    }
}

.systems__content {
    position: relative;
    z-index: 3;
    display: grid;
    gap: 54px;
    padding-top: 188px;
}

.systems__heading {
    width: 100%;
    margin: 0;
    color: var(--color-primary);
    font-size: 36px;
    font-weight: 700;
    line-height: 1.22;
    letter-spacing: 0;
}

.systems__heading sup,
.systems__note sup,
.signals__lead sup {
    font-size: 0.64em;
    line-height: 0;
}

.systems__list {
    display: grid;
    gap: 34px;
}

.systems__item h4 {
    margin: 0 0 12px;
    color: var(--color-primary);
    font-size: 24px;
    font-weight: 700;
    line-height: 1.33;
}

.systems__item p {
    margin: 0;
    color: var(--color-primary);
    font-size: 18px;
    font-weight: 400;
    line-height: 1.55;
}

.systems__note {
    display: flex;
    align-items: center;
    gap: 24px;
    min-height: 104px;
    margin: 0;
    padding: 24px;
    border-radius: 24px;
    background: #f8dce5;
    color: var(--color-primary);
}

.systems__note img {
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
}

.systems__note p {
    width: min(432px, 100%);
    margin: 0;
    font-size: 18px;
    line-height: 1.55;
}

.signals {
    scroll-margin-top: 120px;
    padding: 0px 0 100px;
    background: var(--color-bg);
}

.signals__inner {
    position: relative;
    --signals-desktop-card-height: 780px;
    width: min(1600px, calc(100% - 80px));
    margin-inline: auto;
}

.signals__intro {
    display: grid;
    gap: 30px;
    justify-items: center;
    margin-bottom: 56px;
    text-align: center;
}

.signals__lead {
    width: min(1289px, 100%);
    margin: 0;
    color: var(--color-primary);
    font-size: 24px;
    font-weight: 400;
    line-height: 1.33;
}

.signals__lead strong {
    font-weight: 700;
}

.signals__tabs {
    position: absolute;
    right: 0;
    bottom: 0;
    z-index: 4;
    display: flex;
    gap: 25px;
    height: var(--signals-desktop-card-height);
}

.signals__panels {
    min-height: var(--signals-desktop-card-height);
}

.signals__tab {
    position: relative;
    display: grid;
    place-items: center;
    width: 97px;
    height: 100%;
    border: 0;
    border-radius: 60px;
    color: var(--color-primary);
    cursor: pointer;
    font-family: var(--font-body);
    transition: box-shadow 160ms ease, transform 160ms ease;
}

.signals__tab:hover,
.signals__tab:focus-visible {
    box-shadow: 8px 4px 45px rgba(235, 232, 229, 0.85);
    outline: 0;
    transform: translateY(-2px);
}

@media (min-width: 1181px) {
    .signals__tab.is-active {
        display: none;
    }

    .signals__media::before {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        z-index: 3;
        width: 128px;
        content: "";
        pointer-events: none;
    }

    .signals__panel--green .signals__media::before {
        background: linear-gradient(90deg, #dfefee 0%, rgba(223, 239, 238, 0.78) 46%, rgba(223, 239, 238, 0) 100%);
    }

    .signals__panel--blue .signals__media::before {
        background: linear-gradient(90deg, #e7effc 0%, rgba(231, 239, 252, 0.78) 46%, rgba(231, 239, 252, 0) 100%);
    }

    .signals__panel--rose .signals__media::before {
        background: linear-gradient(90deg, #fcf2f5 0%, rgba(252, 242, 245, 0.78) 46%, rgba(252, 242, 245, 0) 100%);
    }
}

.signals__tab span {
    position: absolute;
    bottom: 0;
    left: 50%;
    display: block;
    width: 320px;
    font-size: 36px;
    font-weight: 700;
    line-height: 1.22;
    pointer-events: none;
    text-align: left;
    transform: translate(-50%, -450%) rotate(-90deg);
    transform-origin: center;
}

.signals__tab--green,
.signals__panel--green {
    background: #dfefee;
}

.signals__tab--blue,
.signals__panel--blue {
    background: #e7effc;
}

.signals__tab--rose,
.signals__panel--rose {
    background: #fcf2f5;
}

.signals__panel {
    position: relative;
    display: grid;
    grid-template-columns: minmax(430px, 520px) minmax(480px, 1fr);
    gap: 48px;
    width: calc(100% - 244px);
    min-height: var(--signals-desktop-card-height);
    overflow: hidden;
    border-radius: 60px;
    color: var(--color-primary);
}

.signals__copy {
    position: relative;
    z-index: 2;
    padding: 80px 0 72px 86px;
}

@media (min-width: 1181px) {
    .signals__copy {
        align-self: end;
        padding-top: 0;
    }
}

.signals__copy h3 {
    margin: 0 0 24px;
    font-size: 56px;
    font-weight: 700;
    line-height: 1.14;
}

.signals__symptoms,
.signals__checks ul {
    display: grid;
    gap: 16px;
    margin: 0;
    padding-left: 28px;
    color: var(--color-primary);
    font-size: 24px;
    line-height: 1.33;
}

.signals__checks {
    margin-top: 48px;
}

.signals__checks h4 {
    margin: 0 0 18px;
    font-size: 24px;
    font-weight: 700;
    line-height: 1.33;
}

.signals__media {
    position: relative;
    min-height: var(--signals-desktop-card-height);
    overflow: hidden;
}

.signals__mobile-media {
    display: none;
}

.signals__person,
.signals__glow {
    position: absolute;
    pointer-events: none;
    user-select: none;
}

.signals__person {
    right: 40px;
    bottom: 0px;
    z-index: 2;
    width: auto;
    height: 100%;
    max-height: 100%;
    object-fit: contain;
}

.signals__glow {
    right: 12px;
    bottom: 118px;
    z-index: 1;
    width: 598px;
    height: auto;
}

.stages {
    scroll-margin-top: 120px;
    position: relative;
    overflow: hidden;
    padding: 0;
    background: #ffffff;
}

.stages::before,
.stages::after {
    position: absolute;
    right: 0;
    left: 0;
    z-index: 0;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%;
    content: "";
}

.stages::before {
    top: -1px;
    height: 240px;
    background-image: url("../images/figma/stages-wave-top.svg");
}

.stages::after {
    z-index: 2;
    bottom: -1px;
    height: 260px;
    background-image: url("../images/figma/stages-wave-bottom.svg");
    pointer-events: none;
}

.stages__inner {
    position: relative;
    z-index: 1;
    width: min(1400px, calc(100% - 80px));
    min-height: 820px;
    padding: 126px 0 104px;
    margin-inline: auto;
}

.stages .stages__title {
    font-size: 40px;
    line-height: 1.1;
}

.stages__intro {
    display: grid;
    gap: 18px;
    justify-items: center;
    margin-bottom: 24px;
    text-align: center;
}

.stages__lead {
    width: min(760px, 100%);
    margin: 0;
    color: var(--color-primary);
    font-size: 16px;
    line-height: 1.25;
}

.stages__lead strong {
    font-weight: 700;
}

.stages__lead sup {
    font-size: 0.64em;
    line-height: 0;
}

.stages__canvas {
    position: relative;
    width: min(1100px, 100%);
    height: auto;
    margin: 0 auto;
}

.site-footer {
    width: min(1120px, calc(100% - 48px));
    margin-inline: auto;
    padding-block: 32px;
    color: var(--color-primary);
}

@media (max-width: 1440px) {
    .site-header__inner {
        grid-template-columns: 70px minmax(0, 1fr) 200px;
        gap: 28px;
        padding-left: 64px;
    }

    .site-nav {
        gap: 24px;
    }

    .site-nav__link {
        font-size: 16px;
    }

    .site-header__cta {
        width: 200px;
    }

    .hero__people {
        right: -360px;
        width: 980px;
    }

    .quiz__inner {
        grid-template-columns: minmax(480px, 1fr) minmax(520px, 628px);
        gap: 56px;
        width: min(1312px, calc(100% - 64px));
    }

    .quiz__intro,
    .quiz__title,
    .quiz__footnote {
        width: 100%;
    }

    .quiz__lead {
        width: min(635px, 100%);
    }

    .quiz__card {
        width: 100%;
        padding-inline: 56px;
    }

    .quiz__progress-track {
        flex-basis: 180px;
    }

    .systems__inner,
    .signals__inner,
    .stages__inner {
        width: min(1312px, calc(100% - 64px));
    }

    .systems__grid {
        grid-template-columns: minmax(560px, 1fr) minmax(470px, 560px);
        gap: 36px;
    }

    .systems__visual {
        margin-left: -80px;
    }

    .systems__art {
        width: 790px;
        margin-left: -90px;
    }

    .systems__content {
        position: relative;
        z-index: 3;
        padding-top: 118px;
    }

    .signals__panel {
        width: calc(100% - 212px);
        grid-template-columns: minmax(360px, 440px) minmax(360px, 1fr);
    }

    .signals__copy {
        padding-left: 58px;
    }

    .signals__tabs {
        gap: 18px;
    }

    .signals__tab {
        width: 88px;
    }

    .signals__person {
        right: 0;
    }

    .signals__glow {
        right: -80px;
    }
}

@media (max-width: 1180px) {
    .site-header {
        height: 96px;
    }

    .site-header__inner {
        grid-template-columns: 70px 1fr auto;
        padding-inline: 32px;
    }

    .site-nav-toggle {
        position: relative;
        z-index: 23;
        grid-column: 3;
        grid-row: 1;
        display: inline-grid;
        width: 48px;
        height: 48px;
        place-items: center;
        border: 0;
        border-radius: 8px;
        background: #ffffff;
        cursor: pointer;
    }

    .site-nav-toggle:focus {
        outline: 0;
    }

    .site-nav-toggle__bar {
        display: block;
        width: 22px;
        height: 2px;
        margin: 2px 0;
        background: var(--color-primary);
        transition: opacity 160ms ease, transform 160ms ease;
    }

    .site-nav {
        position: fixed;
        z-index: 22;
        top: 96px;
        right: 24px;
        left: auto;
        display: grid;
        width: min(364px, calc(100% - 48px));
        gap: 36px;
        padding: 72px 48px 48px;
        background: #ffffff;
        border-radius: 36px;
        box-shadow: 8px 14px 34px rgba(0, 25, 101, 0.12);
        opacity: 0;
        pointer-events: none;
        transform: translateY(-10px);
        transition: opacity 180ms ease, transform 180ms ease;
    }

    .is-nav-open .site-nav {
        opacity: 1;
        pointer-events: auto;
        transform: translateY(0);
    }

    .site-nav__link {
        min-height: 22px;
        border-bottom: 0;
        font-size: 18px;
        font-weight: 500;
        line-height: 1.22;
    }

    .site-nav__link::after {
        display: none;
    }

    .site-nav__mobile-cta {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 194px;
        height: 56px;
        margin-top: -4px;
        border-radius: 12px;
        background: var(--color-primary);
        color: #ffffff;
        font-size: 16px;
        font-weight: 700;
        line-height: 1.2;
    }

    .is-nav-open .site-nav-toggle {
        position: fixed;
        top: 132px;
        right: 60px;
        border-radius: 0;
    }

    .is-nav-open .site-nav-toggle__bar {
        grid-area: 1 / 1;
        margin: 0;
    }

    .is-nav-open .site-nav-toggle__bar:nth-child(1) {
        transform: rotate(45deg);
    }

    .is-nav-open .site-nav-toggle__bar:nth-child(2) {
        opacity: 0;
    }

    .is-nav-open .site-nav-toggle__bar:nth-child(3) {
        transform: rotate(-45deg);
    }

    .site-header__cta {
        grid-column: 2;
        grid-row: 1;
        justify-self: end;
        width: 190px;
        height: 56px;
        font-size: 16px;
    }

    .hero {
        --hero-wave-top: 760px;
        --hero-wave-height: 135px;
        --hero-bg-split: calc(var(--hero-wave-top) + var(--hero-wave-height));
        min-height: 1080px;
        background: linear-gradient(var(--color-hero) 0 var(--hero-bg-split), var(--color-bg) var(--hero-bg-split));
    }

    .hero__content {
        padding-top: 54px;
        margin-left: 40px;
    }

    .hero__title {
        width: min(720px, 100%);
        font-size: 50px;
    }

    .hero__lead {
        width: min(610px, 100%);
        font-size: 28px;
    }

    .hero__people {
        top: 160px;
        right: -360px;
        width: 880px;
    }

    .hero__decorations {
        top: 68px;
        right: -90px;
        width: 720px;
        height: auto;
    }

    .hero__wave {
        top: var(--hero-wave-top);
        transform: none;
    }

    .quiz {
        scroll-margin-top: 96px;
        margin-top: 0;
        min-height: 1292px;
    }

    .quiz__inner {
        display: flex;
        flex-direction: column;
        gap: 36px;
        width: min(702px, calc(100% - 68px));
        min-height: 1292px;
        padding: 40px 0 36px;
    }

    .quiz__intro {
        display: contents;
        width: 100%;
        min-height: 0;
        padding-top: 0;
    }

    .quiz__intro-main {
        order: 0;
        gap: 24px;
        width: 100%;
    }

    .quiz__title {
        font-size: 28px;
        line-height: 1.28;
    }

    .quiz__lead {
        font-size: 20px;
        line-height: 1.4;
    }

    .quiz__footnote {
        order: 2;
        width: 100%;
        font-size: 11px;
        line-height: 1.27;
    }

    .quiz__card {
        order: 1;
        width: min(628px, 100%);
        min-height: 788px;
        padding: 56px 70px;
    }

    .quiz__progress-track {
        flex-basis: 250px;
    }

    .systems {
        scroll-margin-top: 96px;
        min-height: 1291px;
    }

    .systems__inner {
        width: min(702px, calc(100% - 68px));
        min-height: 1291px;
        padding: 86px 0 70px;
    }

    .systems__title,
    .signals__title,
    .stages__title {
        font-size: 44px;
        line-height: 1.18;
    }

    .stages .stages__title {
        font-size: 36px;
    }

    .systems__grid {
        display: flex;
        flex-direction: column;
        gap: 24px;
        margin-top: 0px;
    }

    .systems__visual {
        order: 2;
        width: 100%;
        min-height: 620px;
        margin: 0;
    }

    .systems__art {
        width: 620px;
        max-width: none;
        margin-left: -78px;
    }

    .systems__content {
        order: 1;
        gap: 32px;
        padding-top: 0;
    }

    .systems__heading {
        font-size: 28px;
        line-height: 1.28;
    }

    .systems__list {
        gap: 24px;
    }

    .systems__item h4 {
        font-size: 22px;
    }

    .systems__note {
        min-height: 0px;
        border-radius: 20px;
    }

    .signals {
        scroll-margin-top: 96px;
        padding: 42px 0 72px;
    }

    .signals__inner,
    .stages__inner {
        width: min(702px, calc(100% - 68px));
    }

    .signals__lead,
    .stages__lead {
        font-size: 20px;
        line-height: 1.4;
    }

    .signals__tabs {
        position: static;
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 10px;
        height: auto;
        margin-bottom: 18px;
    }

    .signals__tab {
        width: auto;
        height: 64px;
        border-radius: 18px;
    }

    .signals__tab span {
        position: static;
        width: auto;
        font-size: 18px;
        line-height: 1.2;
        text-align: center;
        transform: none;
    }

    .signals__panel {
        grid-template-columns: 1fr;
        gap: 0;
        width: 100%;
        min-height: 840px;
        border-radius: 36px;
    }

    .signals__panels {
        min-height: 840px;
    }

    .signals__copy {
        padding: 48px 48px 0;
    }

    .signals__copy h3 {
        font-size: 44px;
    }

    .signals__symptoms,
    .signals__checks ul {
        font-size: 20px;
        line-height: 1.4;
    }

    .signals__media {
        min-height: 420px;
    }

    .signals__person {
        right: 60px;
        bottom: -310px;
        width: 430px;
        height: auto;
        max-height: none;
    }

    .signals__glow {
        right: 12px;
        bottom: -18px;
        width: 440px;
    }

    .stages {
        scroll-margin-top: 96px;
    }

    .stages__inner {
        min-height: 890px;
        padding: 92px 0 86px;
    }

    .stages__canvas {
        height: 640px;
    }

}

@media (max-width: 767px) {
    .site-header {
        height: 84px;
    }

    .site-header__inner {
        grid-template-columns: 60px 1fr 44px;
        gap: 14px;
        padding-inline: 20px;
    }

    .site-brand,
    .site-brand img {
        width: 60px;
        height: auto;
    }

    .site-nav-toggle {
        width: 44px;
        height: 44px;
    }

    .hero {
        --hero-wave-top: 865px;
        --hero-wave-height: 105px;
        --hero-bg-split: calc(var(--hero-wave-top) + var(--hero-wave-height));
        min-height: 1140px;
        background: linear-gradient(var(--color-hero) 0 var(--hero-bg-split), var(--color-bg) var(--hero-bg-split));
    }

    .hero__content {
        position: static;
        width: calc(100% - 40px);
        padding-top: 36px;
        margin-left: 20px;
    }

    .hero__title,
    .hero__lead,
    .hero__button {
        position: relative;
        z-index: 4;
    }

    .hero__title {
        font-size: 35px;
        line-height: 1.18;
    }

    .hero__lead {
        margin-top: 20px;
        font-size: 22px;
        line-height: 1.24;
    }

    .hero__button {
        width: min(100%, 335px);
        height: 62px;
        gap: 18px;
        margin-top: 30px;
        padding-inline: 24px;
        font-size: 14px;
    }

    .hero__disclaimer {
        position: absolute;
        top: 672px;
        left: 20px;
        z-index: 5;
        width: calc(100% - 40px);
        margin: 0;
        font-size: 11px;
        font-weight: 400;
        line-height: 1.27;
    }

    .hero__people {
        top: 760px;
        right: -72px;
        width: 510px;
    }

    .hero__decorations {
        top: 392px;
        right: -174px;
        width: 560px;
    }

    .hero__wave {
        top: var(--hero-wave-top);
        width: 150%;
        max-width: none;
        height: var(--hero-wave-height);
    }

    .site-header__cta {
        display: none;
    }

    .site-nav {
        top: 100px;
        right: 16px;
        width: min(328px, calc(100% - 32px));
        gap: 28px;
        min-height: 0;
        padding: 32px 48px;
        border-radius: 24px;
    }

    .site-nav__link {
        min-height: 22px;
        font-size: 18px;
        line-height: 22px;
    }

    .is-nav-open .site-nav-toggle {
        top: 120px;
        right: 48px;
    }

    .next-block-placeholder {
        min-height: 80px;
    }

    .quiz {
        scroll-margin-top: 84px;
        min-height: 1120px;
    }

    .quiz__inner {
        width: calc(100% - 32px);
        min-height: 1120px;
        padding: 32px 0;
    }

    .quiz__pill {
        height: 40px;
        padding: 8px 18px;
        font-size: 14px;
    }

    .quiz__title {
        font-size: 28px;
        line-height: 1.28;
    }

    .quiz__lead {
        width: 100%;
        font-size: 18px;
        line-height: 1.42;
    }

    .quiz__card {
        min-height: 0;
        padding: 36px 24px;
        border-radius: 24px;
    }

    .quiz__steps {
        min-height: 0;
    }

    .quiz__step {
        min-height: 0;
    }

    .quiz__question {
        font-size: 22px;
        line-height: 1.28;
    }

    .quiz__option {
        min-height: 60px;
        padding: 16px 18px;
        font-size: 16px;
        line-height: 1.35;
    }

    .quiz__field input {
        height: 62px;
    }

    .quiz__controls {
        flex-direction: column;
        align-items: stretch;
        gap: 18px;
    }

    .quiz__progress {
        width: 100%;
    }

    .quiz__progress-track {
        flex: 1 1 auto;
    }

    .quiz__next,
    .quiz__result-cta {
        width: 100%;
        height: 56px;
    }

    .quiz__decor {
        display: none;
    }

    .quiz__step-illustration {
        position: static;
        margin: 28px auto 0;
        opacity: 0.96;
    }

    .quiz__step-illustration--bike {
        width: min(305px, 80%);
    }

    .quiz__step-illustration--people {
        width: min(420px, 100%);
    }

    .quiz__step-illustration--wave {
        width: 100%;
    }

    .quiz__step-illustration--dna {
        display: none;
    }

    .quiz__result-title {
        font-size: 28px;
    }

    .systems {
        scroll-margin-top: 84px;
        min-height: 0;
    }

    .systems::before {
        top: -8px;
        height: 50px;
    }

    .systems::after {
        bottom: -10px;
        height: 100px;
    }

    .systems__inner {
        width: calc(100% - 32px);
        min-height: 0;
        padding: 62px 0 54px;
    }

    .systems__title,
    .signals__title,
    .stages__title {
        font-size: 34px;
        line-height: 1.18;
    }

    .stages .stages__title {
        font-size: 34px;
    }

    .systems__grid {
        margin-top: 34px;
    }

    .systems__visual {
        min-height: 420px;
        overflow: visible;
    }

    .systems__art {
        width: 430px;
        margin-left: -35px;
    }

    .systems__badges {
        display: block;
        position: absolute;
        inset: 0;
        z-index: 3;
    }

    /* Systems animation timings (override AOS 3000ms CSS limit) */
    .systems__visual[data-aos] {
        transition-duration: 2.2s !important;
    }

    .systems__badge[data-aos] {
        transition-duration: 1s !important;
    }

    .systems__badge--heart {
        top: 100px;
        left: 50%;
        right: auto;
        margin-left: -84px;
        width: min(200px, 58%);
        align-items: flex-end;
    }

    .systems__badge--metabolism {
        top: 190px;
        left: 50%;
        right: auto;
        margin-left: -160px;
        width: min(150px, 44%);
        align-items: flex-start;
    }

    .systems__badge--kidneys {
        top: 259px;
        left: 50%;
        right: auto;
        margin-left: -20px;
        width: min(140px, 42%);
        align-items: flex-end;
    }

    .systems__badge--heart .systems__badge-label::before {
        left: 72%;
    }

    .systems__heading {
        font-size: 24px;
    }

    .systems__item h4 {
        font-size: 20px;
        line-height: 1.35;
    }

    .systems__item p,
    .systems__note p {
        font-size: 16px;
        line-height: 1.45;
    }

    .systems__note {
        align-items: flex-start;
        gap: 16px;
        padding: 20px;
        border-radius: 18px;
    }

    .systems__note img {
        flex-basis: 32px;
        width: 32px;
        height: 32px;
    }

    .signals {
        scroll-margin-top: 84px;
        padding: 34px 0 58px;
    }

    .signals__inner,
    .stages__inner {
        width: calc(100% - 32px);
    }

    .signals__intro,
    .stages__intro {
        gap: 18px;
        margin-bottom: 32px;
    }

    .signals__lead,
    .stages__lead {
        font-size: 18px;
        line-height: 1.42;
    }

    .signals__tabs {
        grid-template-columns: 1fr;
    }

    .signals__tab {
        height: 56px;
        border-radius: 16px;
    }

    .signals__panel {
        min-height: 710px;
        border-radius: 24px;
    }

    .signals__panels {
        min-height: 710px;
    }

    .signals__copy {
        padding: 34px 26px 0;
    }

    .signals__copy h3 {
        margin-bottom: 18px;
        font-size: 34px;
    }

    .signals__symptoms,
    .signals__checks ul {
        gap: 10px;
        padding-left: 22px;
        font-size: 17px;
        line-height: 1.42;
    }

    .signals__checks {
        margin-top: 30px;
    }

    .signals__checks h4 {
        font-size: 19px;
    }

    .signals__media {
        min-height: 318px;
    }

    .signals__person {
        right: 8px;
        bottom: -220px;
        width: 318px;
    }

    .signals__glow {
        right: -50px;
        bottom: -42px;
        width: 360px;
    }

    .stages {
        scroll-margin-top: 84px;
    }

    .stages::before {
        top: -50px;
        height: 150px;
    }

    .stages::after {
        bottom: -87px;
        height: 170px;
    }

    .stages__inner {
        min-height: 1020px;
        padding: 64px 0 70px;
    }

    .stages__canvas {
        width: 100%;
        height: 760px;
        margin-top: 16px;
    }

}

.stages__inner {
    min-height: auto;
    padding-bottom: 86px;
}

.stages__canvas {
    width: min(1040px, 100%);
    height: auto;
    margin-top: 34px;
}

.stages__diagram {
    display: block;
    width: 100%;
    height: auto;
    pointer-events: none;
    user-select: none;
}

.stages__backdrop,
.stages__picture {
    display: block;
    width: 100%;
}

.stages__steps {
    display: none;
    margin: 0;
    padding: 0;
    list-style: none;
}

.stages__step {
    position: absolute;
    z-index: 3;
    margin: 0;
    pointer-events: none;
}

.stages__step-image {
    display: block;
    width: 100%;
    height: auto;
}

.stages__step-number {
    position: absolute;
    left: 10%;
    bottom: 4%;
    z-index: 2;
    display: grid;
    place-items: center;
    width: clamp(28px, 8vw, 40px);
    height: clamp(28px, 8vw, 40px);
    border-radius: 50%;
    color: #fff;
    font-size: clamp(14px, 4vw, 20px);
    font-weight: 400;
    line-height: 1;
    box-shadow: 0 4px 16px rgba(26, 58, 110, 0.18);
}

@media (max-width: 1180px) {
    .stages__inner {
        min-height: auto;
        padding-bottom: 76px;
    }

    .stages__canvas {
        height: auto;
        margin-top: 28px;
    }
}

@media (max-width: 767px) {
    /* Allow numbered badges near the bottom edge (section clips otherwise) */
    .stages {
        overflow: visible;
    }

    .stages__inner {
        min-height: auto;
        padding-bottom: 58px;
    }

    .stages__canvas {
        position: relative;
        width: 100%;
        max-width: 360px;
        margin: 24px auto 0;
        transform: none;
        overflow: visible;
        padding-bottom: 0;
    }

    .stages__diagram {
        display: block;
        width: 100%;
        max-width: none;
        height: auto;
        margin: 0;
    }

    .stages__steps {
        display: block;
        position: absolute;
        inset: 0;
        z-index: 3;
        overflow: visible;
    }

    /* Stages animation timings (override AOS 3000ms CSS limit) */
    .stages__backdrop[data-aos] {
        transition-duration: 1.2s !important;
    }

    .stages__backdrop {
        position: relative;
        padding-top: 110px;
        padding-bottom: 150px;
        z-index: 1;
    }

    .stages__backdrop .stages__diagram {
        opacity: 0.9;
        /* Soft fade at the hard waist cut of the central figure */
        -webkit-mask-image: linear-gradient(
            to bottom,
            #000 0%,
            #000 58%,
            rgba(0, 0, 0, 0.55) 78%,
            transparent 100%
        );
        mask-image: linear-gradient(
            to bottom,
            #000 0%,
            #000 58%,
            rgba(0, 0, 0, 0.55) 78%,
            transparent 100%
        );
    }

    .stages__step[data-aos] {
        transition-duration: 1s !important;
    }

    .stages__step-image {
        mix-blend-mode: screen;
    }

    .stages__step-number {
        left: 6%;
        bottom: 2%;
        width: 60px;
        height: 60px;
        font-size: 18px;
        border: 5px #D9E6F8 solid;
    }

    /* Figma mobile: 1 top-left, 2 mid-right, 3 mid-left, 4 bottom-center */
    .stages__step--1 {
        top: 1%;
        left: 45px;
        z-index: 4;
        width: 41%;
        width: 140px;
    }

    .stages__step--1 .stages__step-number {
        left: 5px;
        bottom: -25px;
        border-color: #DFEFEE;
        background: #2A918B;
    }

    .stages__step--2 {
        top: 122px;
        right: 10px;
        left: auto;
        z-index: 5;
        width: 124px;
    }

    .stages__step--2 .stages__step-number {
        left: auto;
        right: 20px;
        bottom: -40px;
        border-color: #D9E6F8;
        background: #005AD2;
    }

    .stages__step--3 {
        width: 132px;
        top: 280px;
        left: 15px;
        z-index: 6;
    }

    .stages__step--3 .stages__step-number {
        left: 10px;
        bottom: -20px;
        border-color: #FCF2D9;
        background: #EAAB00;
    }

    .stages__step--4 {
        top: 440px;
        left: 29%;
        right: auto;
        z-index: 7;
        width: 170px;
    }

    .stages__step--4 .stages__step-number {
        right: -15px;
        left: auto;
        bottom: -5px;
        border-color: #FCEBE8;
        background: #E6553F;
    }
}

.section-kicker {
    margin: 0 0 14px;
    color: #2a918b;
    font-size: 16px;
    font-weight: 800;
    line-height: 1.2;
}

.solution {
    position: relative;
    background: #ffffff;
    z-index: 9;
}

.solution__inner {
    width: min(1280px, calc(100% - 48px));
    margin: 0 auto;
    padding: 92px 0 104px;
}

.solution__copy {
    width: min(760px, 100%);
    margin: 0 auto;
    text-align: center;
}

.solution__title,
.doctor-cta__title,
.clinic-finder__title {
    margin: 0;
    color: var(--color-primary);
    font-size: 46px;
    font-weight: 800;
    line-height: 1.14;
    letter-spacing: 0;
}

.solution__lead,
.doctor-cta__lead,
.clinic-finder__lead {
    margin: 18px 0 0;
    color: var(--color-primary);
    font-size: 18px;
    font-weight: 500;
    line-height: 1.45;
}

.solution__steps {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    align-self: center;
}

.solution__step {
    position: relative;
    min-height: 228px;
    padding: 74px 24px 28px;
    border: 1px solid rgba(0, 25, 101, 0.12);
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 8px 4px 34px rgba(235, 232, 229, 0.76);
}

.solution__step::after {
    position: absolute;
    top: 38px;
    right: -24px;
    width: 32px;
    height: 2px;
    background: #f2b600;
    content: "";
}

.solution__step:last-child::after {
    display: none;
}

.solution__step h3,
.solution__support h3,
.solution__support-item h4,
.clinic-card h3,
.clinic-finder__empty h3 {
    margin: 0;
    color: var(--color-primary);
    letter-spacing: 0;
}

.solution__step h3 {
    font-size: 22px;
    font-weight: 800;
    line-height: 1.2;
}

.solution__step p,
.solution__support-item p {
    margin: 12px 0 0;
    color: #21336f;
    font-size: 15px;
    font-weight: 500;
    line-height: 1.45;
}

.solution__support {
    margin-top: 30px;
    padding: 30px;
    border-radius: 12px;
    background: #fff8eb;
}

.solution__support h3 {
    font-size: 28px;
    font-weight: 800;
    line-height: 1.2;
}

.solution__support-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    margin-top: 20px;
}

.solution__support-item {
    min-height: 132px;
    padding: 24px;
    border-radius: 12px;
    background: #ffffff;
}

.solution__support-item h4 {
    font-size: 20px;
    font-weight: 800;
    line-height: 1.2;
}

.doctor-cta {
    background: #eaf5f3;
}

.doctor-cta__inner {
    display: grid;
    grid-template-columns: minmax(0, 560px) minmax(300px, 1fr);
    align-items: center;
    gap: clamp(28px, 6vw, 88px);
    width: min(1280px, calc(100% - 48px));
    min-height: 520px;
    margin: 0 auto;
    padding: 74px 0 0;
}

.doctor-cta__content {
    padding-bottom: 76px;
}

.doctor-cta__button,
.clinic-card__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--color-primary);
    border-radius: 12px;
    background: var(--color-primary);
    color: #ffffff;
    font-size: 18px;
    font-weight: 800;
    line-height: 1.2;
    text-align: center;
    transition: background 160ms ease, border-color 160ms ease, box-shadow 160ms ease, color 160ms ease, transform 160ms ease;
}

.doctor-cta__button {
    gap: 12px;
    min-width: 286px;
    height: 68px;
    margin-top: 30px;
    padding: 0 28px;
}

.doctor-cta__button:hover,
.doctor-cta__button:focus-visible,
.clinic-card__button:hover,
.clinic-card__button:focus-visible {
    border-color: var(--button-primary-hover);
    background: var(--button-primary-hover);
    box-shadow: 0 0 0 6px var(--button-primary-hover-ring);
    color: #ffffff;
    transform: translateY(-1px);
}

.doctor-cta__button:active,
.clinic-card__button:active {
    border-color: var(--button-primary-pressed);
    background: var(--button-primary-pressed);
    box-shadow: none;
}

.doctor-cta__button img {
    filter: brightness(0) invert(1);
}

.doctor-cta__media {
    align-self: end;
    height: 500px;
}

.doctor-cta__media img {
    display: block;
    width: min(620px, 118%);
    max-width: none;
    height: auto;
    margin: 0 auto;
}

.clinic-finder {
    background: #ffffff;
}

.clinic-finder__inner {
    width: min(1280px, calc(100% - 48px));
    margin: 0 auto;
    padding: 92px 0 104px;
}

.clinic-finder__intro {
    width: min(740px, 100%);
}

.clinic-finder__controls {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 228px;
    gap: 18px;
    margin-top: 34px;
}

.clinic-finder__cities,
.clinic-finder__formats {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.clinic-finder__city,
.clinic-finder__format {
    min-height: 48px;
    padding: 0 20px;
    border: 1px solid rgba(0, 25, 101, 0.16);
    border-radius: 12px;
    background: #ffffff;
    color: var(--color-primary);
    font-family: inherit;
    font-size: 16px;
    font-weight: 800;
    cursor: pointer;
    transition: background 160ms ease, border-color 160ms ease, box-shadow 160ms ease, color 160ms ease;
}

.clinic-finder__city:hover,
.clinic-finder__city:focus-visible,
.clinic-finder__format:hover,
.clinic-finder__format:focus-visible {
    border-color: var(--color-primary);
    background: var(--button-outline-hover);
    color: var(--color-primary);
}

.clinic-finder__city:active,
.clinic-finder__format:active {
    border-color: var(--color-primary);
    background: var(--button-outline-pressed);
    color: var(--color-primary);
}

.clinic-finder__city.is-active,
.clinic-finder__format.is-active {
    border-color: var(--color-primary);
    background: var(--color-primary);
    color: #ffffff;
}

.clinic-finder__city.is-active:hover,
.clinic-finder__city.is-active:focus-visible,
.clinic-finder__format.is-active:hover,
.clinic-finder__format.is-active:focus-visible {
    border-color: var(--button-primary-hover);
    background: var(--button-primary-hover);
    box-shadow: 0 0 0 6px var(--button-primary-hover-ring);
    color: #ffffff;
}

.clinic-finder__city.is-active:active,
.clinic-finder__format.is-active:active {
    border-color: var(--button-primary-pressed);
    background: var(--button-primary-pressed);
    box-shadow: none;
}

.clinic-finder__other {
    display: grid;
    gap: 8px;
    color: var(--color-primary);
    font-size: 13px;
    font-weight: 800;
}

.clinic-finder__other select {
    width: 100%;
    min-height: 48px;
    padding: 0 14px;
    border: 1px solid rgba(0, 25, 101, 0.16);
    border-radius: 12px;
    background: #ffffff;
    color: var(--color-primary);
    font-family: inherit;
    font-size: 15px;
    font-weight: 700;
}

.clinic-finder__formats {
    grid-column: 1 / -1;
    padding-top: 4px;
}

.clinic-finder__status {
    margin-top: 26px;
    color: #21336f;
    font-size: 16px;
    font-weight: 700;
}

.clinic-finder__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    margin-top: 28px;
}

.clinic-card {
    min-height: 310px;
    padding: 24px;
    border: 1px solid rgba(0, 25, 101, 0.12);
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 8px 4px 34px rgba(235, 232, 229, 0.76);
}

.clinic-card__top {
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr);
    gap: 14px;
    align-items: center;
}

.clinic-card__logo {
    display: grid;
    place-items: center;
    width: 56px;
    height: 56px;
    overflow: hidden;
    border-radius: 12px;
    background: #eaf5f3;
    color: #2a918b;
    font-size: 24px;
    font-weight: 800;
}

.clinic-card__logo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.clinic-card h3 {
    font-size: 21px;
    font-weight: 800;
    line-height: 1.18;
}

.clinic-card__meta,
.clinic-card__address,
.clinic-card__description {
    color: #21336f;
    font-size: 15px;
    font-weight: 500;
    line-height: 1.45;
}

.clinic-card__meta {
    margin: 6px 0 0;
    font-weight: 800;
}

.clinic-card__badge {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    margin-top: 18px;
    padding: 0 12px;
    border-radius: 999px;
    background: #e5f0ff;
    color: #7b5700;
    font-size: 13px;
    font-weight: 800;
}

.clinic-card__address {
    margin: 18px 0 0;
}

.clinic-card__description {
    margin: 10px 0 0;
}

.clinic-card__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px;
    margin-top: 22px;
}

.clinic-card__button {
    min-width: 148px;
    min-height: 50px;
    padding: 0 20px;
    font-size: 16px;
}

.clinic-card__map {
    color: var(--color-primary);
    font-size: 15px;
    font-weight: 800;
    text-decoration: underline;
    text-underline-offset: 4px;
}

.clinic-finder__empty {
    margin-top: 28px;
    padding: 28px;
    border-radius: 18px;
    background: #ffffff;
    text-align: center;
}

.clinic-finder__empty h3 {
    max-width: 760px;
    margin: 0;
    color: #001965;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.4;
}

.clinic-finder__empty p {
    max-width: 760px;
    margin: 0;
    color: #001965;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.4;
}

.clinic-finder__info span {
    margin: 10px 0 0;
    color: #21336f;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.45;
}

.clinic-finder__info {
    display: flex;
    gap: 16px;
    align-items: center;
    margin-top: 28px;
    padding: 22px 24px;
    border-radius: 12px;
    background: #eaf5f3;
}

.clinic-finder__info strong {
    flex: 0 0 auto;
    color: var(--color-primary);
    font-size: 18px;
    font-weight: 800;
}

.clinic-finder__info span {
    margin: 0;
}

.checkup-popover {
    position: fixed;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    z-index: 35;
    bottom: 34px;
    left: 34px;
    width: min(484px, calc(100vw - 68px));
    height: 266px;
    padding: 52px 24px 24px;
    border-radius: 22px;
    background: var(--color-primary);
    color: #ffffff;
    box-shadow: 8px 24px 58px rgba(0, 25, 101, 0.18);
}

.checkup-popover__close {
    position: absolute;
    top: 24px;
    right: 24px;
    width: 18px;
    height: 18px;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.checkup-popover__close::before,
.checkup-popover__close::after {
    position: absolute;
    top: 8px;
    left: 3px;
    width: 12px;
    height: 1px;
    border-radius: 2px;
    background: #ffffff;
    content: "";
}

.checkup-popover__close::before {
    transform: rotate(45deg);
}

.checkup-popover__close::after {
    transform: rotate(-45deg);
}

.checkup-popover h2 {
    max-width: 350px;
    margin: 0;
    color: #ffffff;
    font-size: 24px;
    font-weight: 600;
    line-height: 32px;
}

.checkup-popover p {
    max-width: 420px;
    margin: 10px 0 0;
    color: #ffffff;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
}

.checkup-popover a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    width: 194px;
    min-height: 44px;
    margin-top: 22px;
    border: 1px solid #ffffff;
    border-radius: 6px;
    background: transparent;
    color: #ffffff;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    text-decoration: none;
    white-space: nowrap;
}

.checkup-popover a::after {
    content: "→";
    font-size: 16px;
    font-weight: 300;
    line-height: 1;
}

.cookie-consent {
    position: fixed;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    z-index: 40;
    right: 34px;
    bottom: 34px;
    width: min(484px, calc(100vw - 68px));
    height: 202px;
    padding: 18px 24px 36px;
    border-radius: 12px;
    background: #ffffff;
    color: var(--color-primary);
    box-shadow: 8px 24px 58px rgba(0, 25, 101, 0.12);
}

.cookie-consent__close {
    position: absolute;
    top: 14px;
    right: 16px;
    width: 18px;
    height: 18px;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.cookie-consent__close::before,
.cookie-consent__close::after {
    position: absolute;
    top: 8px;
    left: 3px;
    width: 12px;
    height: 1px;
    border-radius: 2px;
    background: var(--color-primary);
    content: "";
}

.cookie-consent__close::before {
    transform: rotate(45deg);
}

.cookie-consent__close::after {
    transform: rotate(-45deg);
}

.cookie-consent h2 {
    margin: 0;
    color: var(--color-primary);
    font-size: 24px;
    font-weight: 600;
    line-height: 32px;
    letter-spacing: 0;
}

.cookie-consent p {
    margin: 9px 0 0;
    color: var(--color-primary);
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    white-space: nowrap;
}

.cookie-consent__actions {
    display: grid;
    grid-template-columns: repeat(2, 148px);
    gap: 12px;
    margin-top: auto;
}

.cookie-consent__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    padding: 0 18px;
    border: 1px solid var(--color-primary);
    border-radius: 6px;
    background: #ffffff;
    color: var(--color-primary);
    font-family: inherit;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    cursor: pointer;
    transition: background 160ms ease, border-color 160ms ease, box-shadow 160ms ease, color 160ms ease, transform 160ms ease;
}

.cookie-consent__button--accept {
    border-color: var(--color-primary);
    background: var(--color-primary);
    color: #ffffff;
}

.cookie-consent__button--accept:hover,
.cookie-consent__button--accept:focus-visible {
    border-color: var(--button-primary-hover);
    background: var(--button-primary-hover);
    box-shadow: 0 0 0 6px var(--button-primary-hover-ring);
    color: #ffffff;
}

.cookie-consent__button--accept:active {
    border-color: var(--button-primary-pressed);
    background: var(--button-primary-pressed);
    box-shadow: none;
}

.cookie-consent__button--reject:hover,
.cookie-consent__button--reject:focus-visible {
    border-color: var(--color-primary);
    background: var(--button-outline-hover);
    color: var(--color-primary);
}

.cookie-consent__button--reject:active {
    border-color: var(--color-primary);
    background: var(--button-outline-pressed);
    color: var(--color-primary);
}

.cookie-consent__button:hover,
.cookie-consent__button:focus-visible,
.checkup-popover a:hover,
.checkup-popover a:focus-visible {
    transform: translateY(-1px);
}

.checkup-popover a:hover,
.checkup-popover a:focus-visible {
    border-color: #ffffff;
    background: #ffffff;
    color: var(--color-primary);
}

.checkup-popover a:active {
    border-color: var(--button-outline-hover);
    background: var(--button-outline-hover);
    color: var(--color-primary);
}

.site-footer {
    background: var(--color-primary);
    color: #ffffff;
}

.site-footer__inner {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) minmax(280px, 1.4fr);
    gap: 28px;
    width: min(1280px, calc(100% - 48px));
    margin: 0 auto;
    padding: 42px 0;
}

.site-footer__brand strong {
    display: block;
    font-size: 18px;
    font-weight: 800;
    line-height: 1.2;
}

.site-footer__brand p,
.site-footer__copy {
    margin: 10px 0 0;
    color: rgba(255, 255, 255, 0.78);
    font-size: 14px;
    font-weight: 500;
    line-height: 1.45;
}

.site-footer__links {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 12px 22px;
}

.site-footer__links a {
    color: #ffffff;
    font-size: 14px;
    font-weight: 800;
    text-decoration: underline;
    text-underline-offset: 4px;
}

.site-footer__copy {
    grid-column: 1 / -1;
}

@media (max-width: 1024px) {
    .doctor-cta__inner,
    .clinic-finder__controls {
        grid-template-columns: 1fr;
    }

    .solution__steps,
    .clinic-finder__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .doctor-cta__inner {
        min-height: 0;
        padding-top: 64px;
    }

    .doctor-cta__content {
        padding-bottom: 0;
    }

    .doctor-cta__media {
        height: 390px;
    }

    .doctor-cta__media img {
        width: min(520px, 120%);
    }

    .clinic-finder__formats {
        grid-column: auto;
    }
}

@media (max-width: 767px) {
    section[id] {
        scroll-margin-top: 92px;
    }

    .section-kicker {
        margin-bottom: 10px;
        font-size: 14px;
    }

    .solution__inner,
    .clinic-finder__inner {
        width: min(100% - 32px, 560px);
        padding: 58px 0 66px;
    }

    .solution__copy {
        text-align: left;
    }

    .solution__title,
    .doctor-cta__title,
    .clinic-finder__title {
        font-size: 32px;
        line-height: 1.16;
    }

    .solution__lead,
    .doctor-cta__lead,
    .clinic-finder__lead {
        font-size: 16px;
    }

    .solution__steps,
    .solution__support-list,
    .clinic-finder__grid {
        grid-template-columns: 1fr;
    }

    .solution__step {
        min-height: auto;
        padding: 68px 20px 22px;
    }

    .solution__step::after {
        top: auto;
        right: auto;
        bottom: -18px;
        left: 36px;
        width: 2px;
        height: 26px;
    }

    .solution__support {
        padding: 22px;
    }

    .doctor-cta__inner {
        width: min(100% - 32px, 560px);
        padding-top: 58px;
    }

    .doctor-cta__button {
        width: 100%;
        min-width: 0;
        height: 62px;
        padding: 0 18px;
        font-size: 16px;
    }

    .doctor-cta__media {
        height: 300px;
    }

    .doctor-cta__media img {
        width: 440px;
        transform: translateX(-26px);
    }

    .clinic-finder__controls {
        margin-top: 28px;
    }

    .clinic-finder__cities,
    .clinic-finder__formats {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .clinic-finder__city,
    .clinic-finder__format {
        width: 100%;
        min-height: 46px;
        padding: 0 12px;
        font-size: 14px;
    }

    .clinic-finder__info {
        display: block;
        padding: 20px;
    }

    .clinic-finder__info span {
        display: block;
        margin-top: 8px;
    }

    .site-footer__inner {
        grid-template-columns: 1fr;
        width: min(100% - 32px, 560px);
        padding: 34px 0;
    }

    .site-footer__links {
        justify-content: flex-start;
    }
}

/* Figma-aligned lower landing sections */
.solution {
    background: #fffaf5;
}

.solution__inner {
    width: min(1120px, calc(100% - 48px));
    padding: 84px 0 72px;
}

.solution__copy {
    width: min(820px, 100%);
    text-align: left;
}

.solution__steps {
    position: relative;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
    overflow: hidden;
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 8px 4px 34px rgba(235, 232, 229, 0.72);
}

.solution__step {
    min-height: 188px;
    padding: 68px 34px 30px;
    border: 0;
    border-right: 1px solid rgba(0, 25, 101, 0.1);
    border-radius: 0;
    box-shadow: none;
}

.solution__step:last-child {
    border-right: 0;
}

.solution__step::after {
    top: 31px;
    right: -16px;
    z-index: 2;
    width: 32px;
    height: 32px;
    border-top: 2px solid #c8d8f4;
    border-right: 2px solid #c8d8f4;
    background: transparent;
    transform: rotate(45deg);
}

.solution__step:last-child::after {
    display: none;
}

.solution__step h3 {
    font-size: 20px;
}

.solution__step p {
    font-size: 14px;
}

.solution__support {
    display: grid;
    grid-template-columns: 245px minmax(0, 1fr);
    gap: 22px;
    align-items: stretch;
    margin-top: 34px;
    padding: 0;
    border-radius: 0;
    background: transparent;
}

.solution__support h3 {
    display: flex;
    align-items: center;
    min-height: 104px;
    padding: 24px 26px;
    border-radius: 8px;
    background: #dfeeff;
    font-size: 25px;
}

.solution__support-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0;
    margin: 0;
    overflow: hidden;
    border-radius: 8px;
}

.solution__support-item {
    position: relative;
    min-height: 104px;
    padding: 24px 28px 24px 72px;
    border-right: 1px solid rgba(0, 25, 101, 0.09);
    border-radius: 0;
    background: #e9f6f3;
}

.solution__support-item:last-child {
    border-right: 0;
    background: #fff5dc;
}

.doctor-cta {
    overflow: hidden;
    background: #fff1f4;
}

.doctor-cta__inner {
    grid-template-columns: minmax(0, 600px) minmax(300px, 1fr);
    width: min(1120px, calc(100% - 48px));
    min-height: 494px;
    padding-top: 58px;
}

.doctor-cta__content {
    position: relative;
    z-index: 2;
    padding-bottom: 58px;
}

.doctor-cta__title {
    font-size: 44px;
    line-height: 1.12;
}

.doctor-cta__button {
    min-width: 278px;
    height: 62px;
    margin-top: 26px;
    border-radius: 8px;
}

.doctor-cta__media {
    position: relative;
    height: 494px;
}

.doctor-cta__media::before {
    position: absolute;
    right: 5%;
    bottom: 0;
    width: 360px;
    height: 360px;
    border-radius: 50%;
    background: #ffffff;
    content: "";
}

.doctor-cta__media img {
    position: relative;
    z-index: 1;
    width: 620px;
    margin-right: -70px;
}

.clinic-finder {
    background: #fffaf5;
}

.clinic-finder__inner {
    width: min(1120px, calc(100% - 48px));
    padding: 82px 0 92px;
}

.clinic-finder__intro {
    width: min(760px, 100%);
}

.clinic-finder__panel {
    margin-top: 32px;
    padding: 28px;
    border-radius: 8px;
    background: #eaf3ff;
}

.clinic-finder__controls {
    grid-template-columns: minmax(0, 1fr) 230px;
    margin-top: 0;
    padding: 0;
}

.clinic-finder__city,
.clinic-finder__format,
.clinic-finder__other select {
    min-height: 44px;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.72);
}

.clinic-finder__city.is-active,
.clinic-finder__format.is-active {
    background: #005ad2;
}

.clinic-finder__list {
    min-width: 0;
}

.clinic-finder__status {
    margin: 0 0 14px;
}

.clinic-finder__grid {
    grid-template-columns: 1fr;
    gap: 12px;
    margin-top: 0;
}

.clinic-card {
    min-height: 0;
    padding: 20px;
    border: 0;
    border-radius: 8px;
    box-shadow: none;
}

.clinic-card__top {
    grid-template-columns: 48px minmax(0, 1fr);
}

.clinic-card__logo {
    width: 48px;
    height: 48px;
    border-radius: 8px;
}

.clinic-card h3 {
    font-size: 19px;
}

.clinic-card__address,
.clinic-card__description {
    margin-top: 12px;
}

.clinic-card__actions {
    margin-top: 16px;
}

.clinic-card__button {
    min-height: 46px;
    border-radius: 8px;
}

.clinic-finder__empty {
    margin-top: 0;
    border-radius: 8px;
    background: #ffffff;
}

.clinic-finder__info {
    margin-top: 22px;
    border-radius: 8px;
    background: #ffffff;
}

.site-footer {
    background: #e7edf7;
    color: var(--color-primary);
}

.site-footer__brand p,
.site-footer__copy {
    color: rgba(0, 25, 101, 0.68);
}

.site-footer__links a {
    color: var(--color-primary);
}

@media (max-width: 1024px) {
    .solution__steps,
    .solution__support {
        grid-template-columns: 1fr;
    }

    .solution__step,
    .solution__step:last-child {
        border-right: 0;
        border-bottom: 1px solid rgba(0, 25, 101, 0.1);
    }

    .solution__step:last-child {
        border-bottom: 0;
    }

    .solution__step::after {
        top: auto;
        right: auto;
        bottom: -17px;
        left: 34px;
        transform: rotate(135deg);
    }

    .doctor-cta__media img {
        margin-right: auto;
    }
}

@media (max-width: 767px) {
    .solution__inner,
    .doctor-cta__inner,
    .clinic-finder__inner {
        width: min(100% - 32px, 560px);
    }

    .solution__inner {
        padding: 58px 0 54px;
    }

    .solution__title,
    .doctor-cta__title,
    .clinic-finder__title {
        font-size: 31px;
    }

    .solution__step {
        padding: 64px 22px 24px;
    }

    .solution__support {
        gap: 14px;
        margin-top: 26px;
    }

    .solution__support h3 {
        min-height: 0;
        padding: 20px;
        font-size: 23px;
    }

    .solution__support-list {
        grid-template-columns: 1fr;
    }

    .solution__support-item {
        padding: 22px 20px 22px 64px;
    }

    .solution__support-item,
    .solution__support-item:last-child {
        border-right: 0;
    }

    .doctor-cta__inner {
        padding-top: 52px;
    }

    .doctor-cta__media {
        height: 295px;
    }

    .doctor-cta__media::before {
        right: 50%;
        width: 260px;
        height: 260px;
        transform: translateX(50%);
    }

    .doctor-cta__media img {
        width: 410px;
        margin: 0 auto;
        transform: translateX(-24px);
    }

    .clinic-finder__inner {
        padding: 56px 0 64px;
    }

    .clinic-finder__panel {
        padding: 18px;
    }

    .clinic-finder__controls,
    .clinic-finder__cities,
    .clinic-finder__formats {
        grid-template-columns: 1fr;
    }

    .clinic-card {
        padding: 18px;
    }
}

/* Figma export alignment: lower landing sections. */
.solution,
.clinic-finder,
.references-info {
    background: #fffaf5;
}

.solution__inner,
.doctor-cta__inner,
.clinic-finder__inner,
.references-info__inner,
.site-footer__inner {
    width: var(--page-container-width);
}

.solution__inner {
    padding: 0px 0 78px;
}

.solution__top {
    display: grid;
    grid-template-columns: minmax(0, 690px) minmax(520px, 1fr);
    gap: 128px;
    align-items: start;
}

.solution__copy {
    max-width: none;
}

.solution__title {
    margin: 0;
    color: #001965;
    font-size: 56px;
    font-weight: 900;
    line-height: 1.05;
}

.solution__title em {
    font-style: italic;
    font-weight: 400;
}

.solution__lead {
    max-width: 660px;
    margin: 42px 0 0;
    color: #001965;
    font-size: 24px;
    font-weight: 400;
    line-height: 1.28;
}

.solution__lead strong {
    font-weight: 600;
}

.solution__bullets {
    display: grid;
    gap: 30px;
    margin: 56px 0 0;
    padding: 0 0 0 24px;
    color: #001965;
    font-size: 19px;
    font-weight: 600;
    line-height: 1.35;
}

.solution__bullets li::marker {
    color: #005ad2;
}

.solution__steps {
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
    margin: 0;
    overflow: visible;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.solution__step {
    display: grid;
    grid-template-columns: 112px minmax(0, 1fr);
    gap: 26px;
    align-items: center;
    min-height: 144px;
    padding: 28px 44px;
    border: 0;
    border-radius: 20px;
    background: #ffffff;
    box-shadow: none;
}

.solution__step::after {
    display: none;
}

.solution__step h3 {
    margin: 0;
    color: #001965;
    font-size: 24px;
    font-weight: 600;
    line-height: 1.16;
}

.solution__step p {
    margin: 8px 0 0;
    color: #001965;
    font-size: 18px;
}

.solution__step-icon {
    display: block;
    width: 95px;
    height: 95px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.solution__step-icon::before,
.solution__step-icon::after {
    display: none;
}

.solution__step-icon--exam {
    background-image: url("../images/figma/solution-health-status.png");
}

.solution__step-icon--target {
    background-image: url("../images/figma/solution-target.png");
}

.solution__step-icon--therapy {
    background-image: url("../images/figma/solution-correction.png");
}

.solution__divider {
    position: relative;
    height: 72px;
    margin-top: 58px;
}

.solution__divider::before,
.solution__divider::after {
    position: absolute;
    bottom: 0;
    height: 2px;
    background: #001965;
    content: "";
}

.solution__divider::before {
    right: calc(50% + 52px);
    left: 0;
}

.solution__divider::after {
    right: 0;
    left: calc(50% + 52px);
}

.solution__divider span {
    position: absolute;
    bottom: -6px;
    left: 50%;
    width: 16px;
    height: 16px;
    border-right: 3px solid #001965;
    border-bottom: 3px solid #001965;
    transform: translateX(-50%) rotate(45deg);
}

.solution__divider span::before,
.solution__divider span::after {
    display: none;
}

.solution__support {
    display: block;
    margin-top: 72px;
}

.solution__support h3 {
    display: block;
    min-height: 0;
    margin: 0 0 58px;
    padding: 0;
    border-radius: 0;
    background: transparent;
    color: #001965;
    font-size: 36px;
    font-weight: 600;
    line-height: 1.1;
}

.solution__support-list {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
    overflow: visible;
    border-radius: 0;
}

.solution__support-item,
.solution__support-item:last-child {
    display: grid;
    grid-template-columns: 116px 270px minmax(0, 1fr);
    gap: 34px;
    align-items: center;
    min-height: 128px;
    padding: 30px 58px;
    border: 0;
    border-radius: 18px;
    background: #dcecff;
}

.solution__support-item--pills,
.solution__support-item--pills:last-child {
    background: #e1f3f0;
}

.solution__support-icon {
    display: block;
    width: 80px;
    height: 80px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.solution__support-icon::before,
.solution__support-icon::after {
    display: none;
}

.solution__support-item--apple .solution__support-icon {
    background-image: url("../images/figma/solution-apple.png");
}

.solution__support-item--pills .solution__support-icon {
    background-image: url("../images/figma/solution-pills.png");
}

.solution__support-item h4 {
    margin: 0;
    color: #001965;
    font-size: 24px;
    font-weight: 600;
    line-height: 1.24;
}

.solution__support-item p {
    margin: 0;
    color: #001965;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.45;
}

.solution__note {
    margin: 46px 0 0;
    color: #001965;
    font-size: 17px;
    font-weight: 500;
}

.doctor-cta {
    position: relative;
    overflow: hidden;
    background: #fff1f6;
}

.doctor-cta::before,
.doctor-cta::after {
    position: absolute;
    right: 0;
    left: 0;
    z-index: 0;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%;
    content: "";
    pointer-events: none;
}

.doctor-cta::before {
    top: -1px;
    height: 180px;
    background-image: url("../images/figma/doctor-cta-wave-top.svg");
}

.doctor-cta::after {
    z-index: 2;
    bottom: -155px;
    height: 240px;
    background-image: url("../images/figma/doctor-cta-wave-bottom.svg");
}

.doctor-cta__inner {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, 820px) minmax(500px, 1fr);
    gap: 42px;
    min-height: 830px;
    padding: 250px 0 0;
}

.doctor-cta__content {
    position: relative;
    z-index: 3;
    padding-bottom: 140px;
}

.doctor-cta__title {
    margin: 0;
    color: #001965;
    font-size: 56px;
    font-weight: 900;
    line-height: 1.08;
}

.doctor-cta__title em {
    font-style: italic;
    font-weight: 400;
}

.doctor-cta__lead {
    max-width: 770px;
    margin: 38px 0 0;
    color: #001965;
    font-size: 24px;
    line-height: 1.28;
}

.doctor-cta__steps-title {
    max-width: 520px;
    margin: 82px 0 36px;
    color: #001965;
    font-size: 36px;
    font-weight: 900;
    line-height: 1.15;
}

.doctor-cta__cards {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 28px;
    max-width: 820px;
}

.doctor-cta__card {
    min-height: 220px;
    padding: 34px 26px 26px;
    border-radius: 20px;
    background: #ffffff;
}

.doctor-cta__card-icon {
    display: block;
    width: 48px;
    height: 48px;
    margin-bottom: 42px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.doctor-cta__card-icon::before,
.doctor-cta__card-icon::after {
    display: none;
}

.doctor-cta__card-icon--calendar {
    background-image: url("../images/figma/doctor-appointment.png");
}

.doctor-cta__card-icon--diagnostics {
    background-image: url("../images/figma/doctor-diagnostics.png");
}

.doctor-cta__card-icon--plan {
    background-image: url("../images/figma/doctor-treatment-plan.png");
}

.doctor-cta__card p {
    margin: 0;
    color: #001965;
    font-size: 18px;
    line-height: 1.45;
}

.doctor-cta__button {
    width: 380px;
    height: 68px;
    margin-top: 62px;
    border-radius: 10px;
    font-size: 17px;
    font-weight: 600;
}

.doctor-cta__media {
    position: relative;
    z-index: 1;
    align-self: end;
    height: 760px;
}

.doctor-cta__media::before {
    display: none;
}

.doctor-cta__media img {
    display: block;
    width: 1110px;
    max-width: none;
    margin: -28px 0 0 -168px;
}

.clinic-finder__inner {
    padding: 82px 0 78px;
}

.clinic-finder__hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 430px;
    gap: 40px;
    align-items: center;
    min-height: 300px;
    padding: 56px 64px;
    border-radius: 20px;
    background: #e5f0ff;
}

.clinic-finder__intro {
    width: auto;
}

.clinic-finder__title {
    margin: 0;
    color: #001965;
    font-size: 36px;
    font-weight: 900;
    line-height: 1.1;
}

.clinic-finder__lead {
    margin: 28px 0 0;
    color: #001965;
    font-size: 24px;
    line-height: 1.25;
}

.clinic-finder__invite {
    position: relative;
    margin: 92px 0 0;
    padding-left: 38px;
    color: #001965;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.35;
}

.clinic-finder__invite::before {
    position: absolute;
    top: 0;
    left: 0;
    display: grid;
    place-items: center;
    width: 20px;
    height: 20px;
    border: 2px solid #0066e8;
    border-radius: 50%;
    color: #0066e8;
    font-size: 13px;
    font-weight: 900;
    content: "i";
}

.clinic-finder__hero-illustration {
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.clinic-finder__hero-illustration img {
    display: block;
    width: min(506px, 100%);
    height: auto;
    pointer-events: none;
    user-select: none;
}

.clinic-finder__panel {
    margin-top: 48px;
    padding: 0;
    border-radius: 0;
    background: transparent;
}

.clinic-finder__controls {
    display: flex;
    flex-wrap: wrap;
    gap: 18px;
    align-items: center;
    margin: 0;
    padding: 0;
}

.clinic-finder__cities {
    display: flex;
    flex-wrap: wrap;
    gap: 18px;
}

.clinic-finder__city,
.clinic-finder__other-trigger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 112px;
    min-height: 56px;
    padding: 0 24px;
    border: 1px solid #a7b9da;
    border-radius: 8px;
    background: #ffffff;
    color: #001965;
    font-size: 16px;
    font-weight: 400;
    box-shadow: 0 4px 12px rgba(0, 25, 101, 0.08);
}

.clinic-finder__city.is-active {
    border-color: #001965;
    background: #001965;
    color: #ffffff;
}

.clinic-finder__city:disabled,
.clinic-finder__other-trigger:disabled,
.clinic-finder__city-option:disabled {
    opacity: 0.45;
    cursor: default;
}

.clinic-finder__city:disabled:hover,
.clinic-finder__city:disabled:focus-visible,
.clinic-finder__other-trigger:disabled:hover,
.clinic-finder__other-trigger:disabled:focus-visible {
    border-color: #a7b9da;
    background: #ffffff;
    box-shadow: 0 4px 12px rgba(0, 25, 101, 0.08);
    color: #001965;
}

.clinic-finder__city-pin {
    width: 14px;
    height: 14px;
    margin-right: 10px;
    border: 2px solid currentColor;
    border-radius: 50% 50% 50% 0;
    transform: rotate(-45deg);
}

.clinic-finder__other {
    position: relative;
    z-index: 8;
}

.clinic-finder__other-trigger {
    gap: 18px;
    min-width: 167px;
    padding: 0 26px;
    cursor: pointer;
}

.clinic-finder__other-trigger::after {
    width: 8px;
    height: 8px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    content: "";
    transform: rotate(45deg) translateY(-3px);
}

.clinic-finder__other.is-open .clinic-finder__other-trigger::after {
    transform: rotate(225deg) translate(-2px, -1px);
}

.clinic-finder__native-select {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
}

.clinic-finder__city-popover {
    position: absolute;
    top: calc(100% + 26px);
    right: -10px;
    z-index: 30;
    width: 292px;
    padding: 74px 36px 54px;
    border-radius: 24px;
    background: #ffffff;
    box-shadow: 0 18px 60px rgba(0, 25, 101, 0.1);
}

.clinic-finder__city-popover-close {
    position: absolute;
    top: 34px;
    right: 34px;
    width: 20px;
    height: 20px;
    border: 0;
    background: transparent;
    color: #001965;
    cursor: pointer;
}

.clinic-finder__city-popover-close::before,
.clinic-finder__city-popover-close::after {
    position: absolute;
    top: 9px;
    left: 1px;
    width: 18px;
    height: 2px;
    background: currentColor;
    content: "";
}

.clinic-finder__city-popover-close::before {
    transform: rotate(45deg);
}

.clinic-finder__city-popover-close::after {
    transform: rotate(-45deg);
}

.clinic-finder__city-options {
    display: grid;
    gap: 20px;
    max-height: 296px;
    padding-right: 22px;
    overflow-y: auto;
    scrollbar-color: #001965 #d9dfeb;
    scrollbar-width: thin;
}

.clinic-finder__city-options::-webkit-scrollbar {
    width: 4px;
}

.clinic-finder__city-options::-webkit-scrollbar-track {
    background: #d9dfeb;
    border-radius: 999px;
}

.clinic-finder__city-options::-webkit-scrollbar-thumb {
    background: #001965;
    border-radius: 999px;
}

.clinic-finder__city-option {
    width: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    color: #001965;
    font-size: 20px;
    font-weight: 400;
    line-height: 1.25;
    text-align: left;
    cursor: pointer;
}

.clinic-finder__city-option.is-active,
.clinic-finder__city-option:hover,
.clinic-finder__city-option:focus-visible {
    text-decoration: underline;
}

.clinic-finder__city-popover-note {
    margin-top: 48px;
    color: #001965;
}

.clinic-finder__city-popover-note h4 {
    margin: 0 0 10px;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.2;
}

.clinic-finder__city-popover-note p {
    margin: 0;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.22;
}

.clinic-finder__results-head {
    display: flex;
    justify-content: space-between;
    gap: 24px;
    align-items: center;
    margin: 58px 0 28px;
}

.clinic-finder__results-head h3 {
    margin: 0;
    color: #001965;
    font-size: 28px;
    font-weight: 900;
}

.clinic-finder__formats {
    display: inline-flex;
    gap: 12px;
    margin-left: auto;
}

.clinic-finder__format {
    min-width: 108px;
    min-height: 48px;
    padding: 0 22px;
    border: 1px solid #001965;
    border-radius: 8px;
    background: #ffffff;
    color: #001965;
    font-size: 15px;
    font-weight: 400;
}

.clinic-finder__format.is-active {
    background: #001965;
    color: #ffffff;
}

.clinic-finder__list {
    min-width: 0;
}

.clinic-finder__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 22px;
}

.clinic-card {
    display: grid;
    grid-template-columns: 88px minmax(0, 1fr) 260px;
    gap: 28px;
    align-items: start;
    min-height: 210px;
    padding: 38px 36px;
    border: 0;
    border-radius: 18px;
    background: #ffffff;
    box-shadow: none;
}

.clinic-card__icon,
.clinic-card__logo {
    position: relative;
    display: grid;
    place-items: center;
    width: 76px;
    height: 76px;
    border-radius: 50%;
    background: #e5f0ff;
}

.clinic-card__icon::before,
.clinic-card__icon::after {
    display: none;
}

.clinic-card__icon img {
    position: relative;
    z-index: 1;
    max-width: 56px;
    max-height: 56px;
}

.clinic-card h3 {
    margin: 0 0 16px;
    color: #001965;
    font-size: 18px;
    font-weight: 900;
}

.clinic-card__address,
.clinic-card__website,
.clinic-card__description {
    color: #001965;
    font-size: 16px;
    line-height: 1.4;
}

.clinic-card__address {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    margin: 0 0 8px;
    font-weight: 400;
}

.clinic-card__address span,
.clinic-card__website span {
    flex: 0 0 auto;
    width: 16px;
    height: 16px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.clinic-card__address span {
    margin-top: 1px;
    background-image: url("../images/figma/clinic-location.png");
}

.clinic-card__website {
    display: inline-flex;
    gap: 10px;
    align-items: center;
    margin: 0 0 22px;
    color: #0066e8;
    font-weight: 400;
    text-decoration: none;
}

a.clinic-card__address:hover,
a.clinic-card__address:focus-visible,
.clinic-card__website:hover,
.clinic-card__website:focus-visible {
    text-decoration: underline;
    text-underline-offset: 3px;
}

.clinic-card__website span {
    margin-top: 1px;
    background-image: url("../images/figma/clinic-website.png");
}

.clinic-card__description {
    max-width: 1120px;
    margin: 0;
    font-size: 18px;
}

.clinic-card__badge {
    display: inline-flex;
    gap: 8px;
    align-items: center;
    min-height: 38px;
    margin-top: 22px;
    padding: 0 24px;
    border: 1px dashed #0066e8;
    border-radius: 8px;
    color: #0066e8;
    font-size: 15px;
    font-weight: 400;
}

.clinic-card__badge::before {
    flex: 0 0 auto;
    width: 16px;
    height: 16px;
    background: url("../images/figma/special-conditions-tag.png") center / contain no-repeat;
    content: "";
}

.clinic-card__actions {
    display: flex;
    justify-content: flex-end;
    margin: 0;
}

.clinic-card__button {
    display: inline-flex;
    gap: 14px;
    align-items: center;
    justify-content: center;
    width: 250px;
    min-height: 56px;
    padding: 0 22px;
    border: 1px solid #001965;
    border-radius: 8px;
    background: #ffffff;
    color: #001965;
    font-size: 16px;
    font-weight: 400;
    text-decoration: none;
    transition: background 160ms ease, border-color 160ms ease, color 160ms ease;
}

.clinic-card__button:hover,
.clinic-card__button:focus-visible {
    border-color: #001965;
    background: var(--button-outline-hover);
    box-shadow: none;
    color: #001965;
}

.clinic-card__button:active {
    border-color: #001965;
    background: var(--button-outline-pressed);
    box-shadow: none;
    color: #001965;
}

.clinic-finder__pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 13px;
    margin-top: 32px;
}

.clinic-finder__page {
    min-width: 0;
    height: auto;
    padding: 0;
    border: 0;
    background: transparent;
    color: #001965;
    font-family: inherit;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
    transition: color 160ms ease, opacity 160ms ease;
}

.clinic-finder__page.is-active,
.clinic-finder__page:hover,
.clinic-finder__page:focus-visible {
    color: #001965;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.clinic-finder__page:focus-visible {
    outline: 2px solid #001965;
    outline-offset: 4px;
}

.clinic-finder__page--arrow {
    font-size: 18px;
    font-weight: 400;
}

.clinic-finder__page:disabled {
    opacity: 0.45;
    cursor: default;
}

.clinic-finder__page:disabled:hover {
    text-decoration: none;
}

.clinic-finder__page-ellipsis {
    color: #001965;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
}

.clinic-finder__status {
    margin: 0 0 18px;
    color: #001965;
}

.clinic-finder__empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-height: 216px;
    padding: 24px 32px 26px;
    border-radius: 18px;
    background: #ffffff;
    color: #001965;
    text-align: center;
}

.clinic-finder__empty-icon {
    display: block;
    width: 88px;
    height: 88px;
    margin: 0 auto 26px;
}

.clinic-finder__info {
    margin-top: 78px;
    padding: 34px 48px;
    border-radius: 18px;
    background: #e5f0ff;
    color: #001965;
    font-size: 16px;
    font-weight: 800;
    line-height: 1.45;
}

.references-info__inner {
    padding: 0 0 66px;
    color: #001965;
    font-size: 11px;
    font-weight: 400;
    line-height: 1.35;
}

.references-info p,
.references-info ol {
    margin: 0 0 20px;
}

.references-info ol {
    padding-left: 20px;
}

.references-info__warning {
    margin-top: 38px;
    text-transform: uppercase;
}

.site-footer {
    position: relative;
    width: 100%;
    overflow: hidden;
    margin-inline: 0;
    padding-block: 0;
    background: #e8edf7;
    color: #001965;
}

.site-footer::before {
    position: absolute;
    top: -1px;
    right: 0;
    left: 0;
    width: 100%;
    height: 180px;
    background-image: url("../images/figma/footer-wave-top.svg");
    background-repeat: no-repeat;
    background-position: center top;
    background-size: 100% 100%;
    content: "";
    pointer-events: none;
}

.site-footer__inner {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 310px 360px 330px;
    gap: 120px;
    min-height: 604px;
    padding: 250px 0 74px;
}

.site-footer__brand strong,
.site-footer__links a,
.site-footer__links span {
    color: #001965;
    font-size: 19px;
    font-weight: 600;
    line-height: 1.3;
}

.site-footer__brand p {
    margin-top: 36px;
    color: #001965;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.45;
}

.site-footer__brand p a {
    color: inherit;
    text-decoration: none;
}

.site-footer__brand p a:hover,
.site-footer__brand p a:focus-visible {
    text-decoration: underline;
    text-underline-offset: 4px;
}

.site-footer__brand p + p {
    margin-top: 0;
}

.site-footer__links {
    display: grid;
    align-content: start;
    gap: 22px;
}

.site-footer__links a {
    text-decoration: none;
}

.site-footer__links a:hover,
.site-footer__links a:focus-visible {
    text-decoration: underline;
    text-underline-offset: 4px;
}

.site-footer__copy {
    grid-column: 1 / 2;
    align-self: end;
    margin: 0;
    color: #001965;
    font-size: 15px;
    font-weight: 600;
}

.checkup-popover[hidden],
.cookie-consent[hidden] {
    display: none !important;
}

@media (max-width: 1320px) {
    .checkup-popover,
    .cookie-consent {
        width: min(480px, calc(50vw - 48px));
        height: auto;
        min-height: 0;
        border-radius: 24px;
    }

    .checkup-popover h2 {
        font-size: 24px;
        line-height: 32px;
    }

    .checkup-popover p,
    .cookie-consent p {
        font-size: 16px;
        line-height: 24px;
        white-space: normal;
    }

    .checkup-popover a,
    .cookie-consent__button {
        font-size: 16px;
        line-height: 24px;
    }
}

@media (max-width: 1024px) {
    .checkup-popover,
    .cookie-consent {
        right: 16px;
        left: 16px;
        width: auto;
    }

    .checkup-popover,
    .cookie-consent {
        bottom: 16px;
    }

    .is-cookie-consent-visible .checkup-popover {
        bottom: calc(24px + var(--cookie-consent-height, 0px));
    }

    .cookie-consent__actions {
        margin-top: 16px;
    }

    .checkup-popover h2,
    .checkup-popover p,
    .cookie-consent h2,
    .cookie-consent p {
        max-width: none;
    }
}

@media (min-width: 768px) and (max-width: 1024px) {
    .checkup-popover,
    .cookie-consent {
        width: min(384px, calc(50vw - 36px));
        min-height: 0;
    }

    .checkup-popover {
        right: auto;
        left: 24px;
        bottom: 24px;
        padding: 34px 24px 24px;
    }

    .cookie-consent {
        right: 24px;
        left: auto;
        bottom: 24px;
        padding: 24px 24px 30px;
    }

    .is-cookie-consent-visible .checkup-popover {
        bottom: 24px;
    }

    .checkup-popover h2 {
        font-size: 14px;
        line-height: 18px;
    }

    .checkup-popover p {
        margin-top: 8px;
        font-size: 11px;
        line-height: 15px;
    }

    .cookie-consent h2 {
        font-size: 16px;
        line-height: 24px;
    }

    .cookie-consent p {
        margin-top: 8px;
        font-size: 16px;
        line-height: 24px;
    }

    .checkup-popover a {
        width: 100%;
        min-height: 40px;
        margin-top: 18px;
    }

    .cookie-consent__actions {
        grid-template-columns: 1fr;
        width: 100%;
        gap: 10px;
        margin-top: 18px;
    }

    .cookie-consent__button {
        min-height: 40px;
    }
}

@media (max-width: 1500px) {
    .solution__inner,
    .doctor-cta__inner,
    .clinic-finder__inner,
    .references-info__inner,
    .site-footer__inner {
        width: min(1180px, calc(100% - 96px));
    }

    .solution__top,
    .doctor-cta__inner {
        gap: 58px;
    }

    .doctor-cta__inner {
        grid-template-columns: minmax(0, 650px) minmax(420px, 1fr);
    }

    .doctor-cta__media img {
        width: 920px;
    }
}

@media (max-width: 1100px) {
    .solution__top,
    .doctor-cta__inner,
    .clinic-finder__hero,
    .clinic-card {
        grid-template-columns: 1fr;
    }

    .doctor-cta__media {
        height: auto;
    }

    .doctor-cta__media img {
        width: min(720px, 100%);
        margin: 0 auto;
    }

    .clinic-card__actions {
        justify-content: flex-start;
    }

    .site-footer__inner {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 48px;
    }
}

@media (max-width: 767px) {
    .solution__inner,
    .doctor-cta__inner,
    .clinic-finder__inner,
    .references-info__inner,
    .site-footer__inner {
        width: min(100% - 32px, 560px);
    }

    .solution__inner,
    .clinic-finder__inner {
        padding: 58px 0;
    }

    .solution__title,
    .doctor-cta__title {
        font-size: 36px;
    }

    .solution__lead,
    .clinic-finder__lead,
    .doctor-cta__lead {
        font-size: 19px;
    }

    .solution__bullets {
        gap: 18px;
        margin-top: 32px;
        font-size: 16px;
    }

    .solution__step {
        grid-template-columns: 72px minmax(0, 1fr);
        min-height: 108px;
        padding: 22px;
    }

    .solution__step-icon {
        width: 60px;
        height: 60px;
    }

    .solution__step h3,
    .solution__support-item h4 {
        font-size: 20px;
    }

    .solution__support h3 {
        margin-bottom: 28px;
        font-size: 30px;
    }

    .solution__support-item,
    .solution__support-item:last-child {
        grid-template-columns: 58px minmax(0, 1fr);
        gap: 18px;
        padding: 24px;
    }

    .solution__support-item p {
        grid-column: 1 / -1;
        font-size: 16px;
    }

    .doctor-cta__inner {
        padding-top: 92px;
    }

    .doctor-cta__cards {
        grid-template-columns: 1fr;
    }

    .doctor-cta__button {
        width: 100%;
    }

    .clinic-finder__hero {
        padding: 28px 22px;
    }

    .clinic-finder__title {
        font-size: 32px;
    }

    .clinic-finder__invite {
        margin-top: 36px;
    }

    .clinic-finder__hero-illustration {
        justify-content: flex-start;
    }

    .clinic-finder__results-head {
        align-items: flex-start;
        flex-direction: column;
    }

    .clinic-finder__formats,
    .clinic-finder__format,
    .clinic-finder__city,
    .clinic-finder__other {
        width: 100%;
    }

    .clinic-card {
        gap: 18px;
        min-height: 0;
        padding: 24px;
    }

    .clinic-card__button {
        width: 100%;
    }

    .site-footer__inner {
        grid-template-columns: 1fr;
        min-height: 0;
        padding-top: 120px;
    }

    .site-footer::before {
        height: 140px;
    }

    .site-footer__copy {
        grid-column: auto;
    }
}

@media (max-width: 767px) {
    .checkup-popover {
        padding: 28px 20px 22px;
        border-radius: 22px;
    }

    .checkup-popover__close {
        top: 15px;
        right: 15px;
    }

    .checkup-popover h2 {
        max-width: calc(100% - 38px);
        font-size: 14px;
        line-height: 18px;
    }

    .checkup-popover p {
        margin: 12px 0 20px;
        font-size: 11px;
        line-height: 15px;
    }

    .checkup-popover a {
        width: 100%;
        min-height: 50px;
        border-radius: 12px;
        font-size: 16px;
        line-height: 24px;
    }

    .cookie-consent {
        min-height: 0;
        padding: 46px 20px 22px;
        border-radius: 22px;
    }

    .cookie-consent h2 {
        max-width: calc(100% - 34px);
        font-size: 16px;
        line-height: 24px;
    }

    .cookie-consent p {
        margin: 12px 0 20px;
        font-size: 16px;
        line-height: 24px;
    }

    .cookie-consent__actions {
        grid-template-columns: 1fr;
        gap: 10px;
        width: 100%;
    }

    .cookie-consent__button {
        min-height: 50px;
        border-radius: 12px;
        font-size: 16px;
        line-height: 24px;
    }

    .is-cookie-consent-visible .checkup-popover {
        bottom: calc(24px + var(--cookie-consent-height, 0px));
    }
}

/* Figma export alignment: upper landing sections. */
.site-header {
    height: 72px;
}

.site-header__inner {
    grid-template-columns: 70px minmax(0, 1fr) 184px;
    gap: clamp(32px, 3vw, 58px);
    padding-left: clamp(32px, 8.333vw, 160px);
    padding-right: clamp(32px, 3.333vw, 64px);
}

.site-nav__link {
    min-height: 44px;
    font-size: 16px;
}

.site-header__cta {
    width: 184px;
    height: 48px;
    border-radius: 8px;
    font-size: 14px;
}

.hero {
    scroll-margin-top: 72px;
}

@media (min-width: 1181px) {
    .systems {
        height: 1349px;
        min-height: 1349px;
    }

    .systems__inner {
        height: 1349px;
        min-height: 1349px;
        padding-top: 226px;
        padding-bottom: 0;
    }

    .systems__grid {
        grid-template-columns: minmax(620px, 1fr) 683px;
        gap: 60px;
        margin-top: -6px;
    }

    .systems__visual {
        min-height: 960px;
        margin-left: -118px;
        margin-top: -165px;
    }

    .systems__art {
        width: 800px;
    }

    .systems__content {
        gap: 38px;
        padding-top: 142px;
    }

    .systems__note {
        width: min(682px, 100%);
        margin-top: 8px;
    }
}

@media (min-width: 1181px) and (max-width: 1536px) {
    .systems__grid {
        grid-template-columns: minmax(560px, 1fr) minmax(470px, 560px);
        gap: 36px;
    }

    .systems__visual {
        margin-left: -80px;
    }

    .systems__art {
        width: 790px;
        margin-left: -90px;
    }

    .systems__content {
        padding-top: 118px;
    }
}

.stages__inner {
    width: 100%;
    min-height: 1251px;
    padding: 198px 0 0;
}

.stages {
    height: 1251px;
}

.stages .stages__title {
    font-size: 56px;
}

.stages__intro {
    gap: 24px;
    margin-bottom: 38px;
}

.stages__lead {
    width: min(1200px, calc(100% - 80px));
    font-size: 25px;
    line-height: 1.2;
}

.stages__canvas {
    width: min(1626px, calc(100% - 220px));
    height: auto;
    margin-top: 0;
}

@media (max-width: 1180px) {
    .site-header {
        height: 76px;
    }

    .site-header__inner {
        grid-template-columns: 70px minmax(0, 1fr);
    }

    .systems {
        height: auto;
        min-height: 0;
    }

    .systems__inner {
        height: auto;
        min-height: 0;
    }

    .stages__inner {
        min-height: 0;
        padding-top: 110px;
        padding-bottom: 92px;
    }

    .stages {
        height: auto;
    }

    .stages__canvas {
        width: min(1040px, calc(100% - 80px));
    }

    .stages .stages__title {
        font-size: 42px;
    }

    .stages__lead {
        font-size: 18px;
    }

}

@media (max-width: 767px) {
    .site-header {
        height: 72px;
    }

    .site-header__inner {
        padding-inline: 16px;
    }

    .stages__inner {
        padding-top: 72px;
    }

    .stages__canvas {
        width: 100%;
    }
}

/* Unified content container: backgrounds may bleed, content stays aligned. */
.site-header__inner,
.hero__content,
.quiz__inner,
.systems__inner,
.signals__inner,
.stages__inner,
.solution__inner,
.doctor-cta__inner,
.clinic-finder__inner,
.references-info__inner,
.site-footer__inner {
    width: var(--page-container-width);
    margin-right: auto;
    margin-left: auto;
}

.site-header__inner {
    padding-right: 0;
    padding-left: 0;
}

.hero__content {
    width: min(880px, var(--page-container-width));
    max-width: none;
    margin-left: var(--page-container-side);
    margin-right: auto;
}

.hero__people {
    right: clamp(-167px, calc(var(--page-container-side) - 287px), -127px);
}

.systems__visual {
    margin-left: 0;
}

.stages__inner {
    width: var(--page-container-width);
}

.stages__lead,
.stages__canvas {
    width: min(100%, 1626px);
}

@media (min-width: 1181px) and (max-width: 1279px) {
    .hero__content {
        width: min(600px, var(--page-container-width));
    }

    .hero__title {
        width: 100%;
        font-size: 48px;
        line-height: 1.18;
    }

    .hero__title br {
        display: initial;
    }

    .hero__title-line {
        display: block;
    }

    .hero__lead {
        width: min(100%, 520px);
        font-size: 28px;
        line-height: 1.24;
    }

    .site-footer__inner {
        grid-template-columns: minmax(240px, 300px) minmax(300px, 340px) minmax(220px, 1fr);
        gap: clamp(32px, 4vw, 52px);
    }
}

@media (min-width: 1181px) {
    .stages__canvas::after {
        position: absolute;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 2;
        height: 92px;
        background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.72) 58%, #ffffff 100%);
        content: "";
        pointer-events: none;
    }
}

@media (min-width: 1280px) {
    .site-header {
        height: clamp(96px, 6.25vw, 120px);
    }

    .site-header__inner {
        grid-template-columns: 70px minmax(0, 1fr) clamp(184px, 11.354vw, 218px);
        gap: clamp(28px, 3.75vw, 72px);
    }

    .site-header__cta {
        width: clamp(184px, 11.354vw, 218px);
        height: clamp(62px, 3.646vw, 70px);
        font-size: clamp(16px, 0.938vw, 18px);
    }

    .site-nav {
        gap: clamp(24px, 2.5vw, 48px);
    }

    .site-nav__link {
        font-size: clamp(16px, 0.938vw, 18px);
    }

    .hero__content {
        width: min(clamp(600px, calc(43.75vw + 40px), 880px), var(--page-container-width));
        padding-top: clamp(72px, calc(19.7vw - 188px), 190px);
    }

    .hero__title {
        width: min(100%, 920px);
        font-size: clamp(48px, calc(2.5vw + 16px), 64px);
    }

    .hero__lead {
        width: min(100%, clamp(520px, 34.375vw, 660px));
        font-size: clamp(28px, 1.875vw, 36px);
    }

    .hero__button {
        width: clamp(320px, 19.271vw, 370px);
        height: clamp(64px, 3.646vw, 70px);
        margin-top: clamp(38px, calc(134px - 5vw), 62px);
        padding-inline: clamp(32px, 2.396vw, 46px);
    }

    .hero__people {
        width: clamp(940px, 57.135vw, 1097px);
    }

    .systems__title,
    .signals__title,
    .stages__title {
        font-size: clamp(44px, 2.917vw, 56px);
    }

    .systems__inner {
        padding-top: clamp(144px, 11.354vw, 218px);
    }

    .systems__grid {
        grid-template-columns: minmax(0, 1fr) minmax(470px, clamp(560px, 35.573vw, 683px));
        gap: clamp(36px, 3.125vw, 60px);
    }

    .systems__heading {
        font-size: clamp(28px, 1.875vw, 36px);
    }

    .solution__top {
        grid-template-columns: minmax(0, 690px) minmax(460px, 1fr);
        gap: clamp(64px, 6.667vw, 128px);
    }

    .solution__title {
        font-size: 56px;
    }

    .doctor-cta__title {
        font-size: 56px;
    }

    .solution__lead {
        font-size: 24px;
    }

    .solution__step {
        grid-template-columns: clamp(88px, 5.833vw, 112px) minmax(0, 1fr);
        gap: clamp(18px, 1.354vw, 26px);
        padding: clamp(24px, 1.458vw, 28px) clamp(28px, 2.292vw, 44px);
    }

    .solution__support-item,
    .solution__support-item:last-child {
        grid-template-columns: clamp(88px, 6.042vw, 116px) minmax(210px, 270px) minmax(0, 1fr);
        gap: clamp(22px, 1.771vw, 34px);
        padding: clamp(24px, 1.563vw, 30px) clamp(34px, 3.021vw, 58px);
    }

    .doctor-cta__inner {
        grid-template-columns: minmax(0, 820px) minmax(420px, 1fr);
        gap: clamp(32px, 2.188vw, 42px);
        min-height: clamp(720px, 43.229vw, 830px);
        padding-top: clamp(190px, 13.021vw, 250px);
    }

    .doctor-cta__media {
        height: clamp(620px, 39.583vw, 760px);
    }

    .doctor-cta__media img {
        width: clamp(860px, 57.813vw, 1110px);
        margin-top: clamp(-28px, -1.458vw, -18px);
        margin-left: clamp(-168px, -8.75vw, -92px);
    }

    .clinic-finder__title {
        font-size: 36px;
    }

    .clinic-finder__lead {
        font-size: 24px;
    }

    .site-footer__inner {
        grid-template-columns:
            minmax(230px, 310px)
            minmax(260px, 360px)
            minmax(240px, 330px);
        gap: clamp(28px, 6.25vw, 120px);
    }
}

@media (min-width: 1280px) and (max-width: 1837px) {
    .systems__visual::after {
        position: absolute;
        right: -24px;
        bottom: 0;
        left: -24px;
        z-index: 2;
        height: 220px;
        background: linear-gradient(180deg, rgba(252, 242, 245, 0) 0%, rgba(252, 242, 245, 0.76) 58%, #fcf2f5 100%);
        content: "";
        pointer-events: none;
    }

    .systems__art {
        position: relative;
        z-index: 1;
    }
}

@media (min-width: 1181px) and (max-width: 1439px) {
    .doctor-cta__inner {
        grid-template-columns: minmax(0, 820px);
        gap: 0;
        min-height: 760px;
        padding-top: 150px;
    }

    .doctor-cta__content {
        position: relative;
        z-index: 4;
        max-width: 820px;
    }

    .doctor-cta__lead {
        max-width: 620px;
    }

    .doctor-cta__steps-title {
        max-width: 560px;
        margin-top: 56px;
    }

    .doctor-cta__cards {
        max-width: 720px;
        gap: 20px;
    }

    .doctor-cta__media {
        position: absolute;
        right: -40px;
        bottom: -22px;
        z-index: 1;
        width: 430px;
        height: 600px;
        pointer-events: none;
    }

    .doctor-cta__media img {
        width: 820px;
        max-width: none;
        margin: 0 0 0 -240px;
    }
}

@media (min-width: 1280px) and (max-width: 1439px) {
    .systems::after {
        z-index: 4;
        height: 520px;
    }

    .systems__inner {
        padding-bottom: 0;
    }

    .systems__grid {
        grid-template-columns: minmax(0, 560px) minmax(0, 472px);
        gap: 36px;
    }

    .systems__visual {
        z-index: 1;
        min-height: 840px;
        margin-top: 0;
        margin-left: 0;
        overflow: hidden;
    }

    .systems__art {
        width: 700px;
        max-width: none;
        margin-top: 0;
        margin-left: -54px;
    }

    .systems__content {
        z-index: 5;
        gap: 26px;
        padding-top: 84px;
    }

    .systems__note {
        position: relative;
        z-index: 5;
    }
}

@media (min-width: 1441px) and (max-width: 1919px) {
    .quiz__inner {
        grid-template-columns: minmax(0, 1fr) minmax(0, 628px);
        gap: clamp(56px, calc(20vw - 232px), 152px);
    }

    .quiz__intro,
    .quiz__title,
    .quiz__footnote {
        width: 100%;
        max-width: 683px;
    }

    .quiz__lead {
        width: 100%;
        max-width: 635px;
    }

    .quiz__card {
        width: 100%;
        justify-self: end;
        padding-inline: clamp(56px, 3.646vw, 70px);
    }
}

@media (max-width: 1500px) {
    .solution__inner,
    .doctor-cta__inner,
    .clinic-finder__inner,
    .references-info__inner,
    .site-footer__inner {
        width: var(--page-container-width);
    }
}

@media (max-width: 1536px) {
    .clinic-finder__controls {
        position: relative;
        z-index: 10;
    }

    .clinic-finder__other {
        position: static;
    }

    .clinic-finder__city-popover {
        top: calc(100% + 20px);
        right: auto;
        left: 0;
        width: min(100%, 420px);
        max-height: calc(100vh - 160px);
        overflow: hidden;
    }
}

@media (max-width: 767px) {
    :root {
        --page-container-gutter: 16px;
        --anchor-offset: 84px;
    }

    .site-header__inner,
    .hero__content,
    .quiz__inner,
    .systems__inner,
    .signals__inner,
    .stages__inner,
    .solution__inner,
    .doctor-cta__inner,
    .clinic-finder__inner,
    .references-info__inner,
    .site-footer__inner {
        width: var(--page-container-width);
    }

    .hero__decorations,
    .hero__people {
        right: var(--page-container-side);
    }
}

@media (min-width: 1025px) {
    .quiz.is-result-mode {
        display: flex;
        align-items: center;
        scroll-margin-top: 72px;
        min-height: 100vh;
        margin-top: 0;
        padding: 32px 0;
    }

    .quiz.is-result-mode .quiz__inner {
        display: block;
        width: min(1820px, calc(100% - 96px));
        min-height: 0;
        padding: 0;
    }

    .quiz.is-result-mode .quiz__intro {
        display: none;
    }

    .quiz__card.is-result {
        width: 100%;
        min-height: min(850px, calc(100vh - 112px));
        padding: 66px 90px 54px;
        border-radius: 30px;
    }

    .quiz__card.is-result .quiz__error {
        display: none;
    }

    .quiz__card.is-result .quiz__result {
        grid-template-columns: minmax(0, 1fr) minmax(320px, 374px);
        min-height: min(730px, calc(100vh - 232px));
    }

    .quiz__card.is-result .quiz__result-title {
        max-width: 1030px;
        font-size: clamp(52px, 4.65vw, 84px);
        line-height: 1.13;
    }

    .quiz__card.is-result .quiz__result-body {
        max-width: 1080px;
        margin-top: 42px;
        font-size: clamp(23px, 1.45vw, 28px);
        line-height: 1.45;
    }

    .quiz__card.is-result .quiz__result-bmi-card {
        width: 374px;
        max-width: 100%;
        min-height: 278px;
    }

    .quiz__card.is-result .quiz__result-cta {
        width: 520px;
        justify-self: end;
    }
}

@media (max-width: 1320px) and (min-width: 1025px) {
    .quiz__card.is-result {
        padding: 54px 58px 46px;
    }

    .quiz__card.is-result .quiz__result {
        column-gap: 46px;
    }

    .quiz__card.is-result .quiz__result-title {
        font-size: clamp(46px, 4.4vw, 62px);
    }

    .quiz__card.is-result .quiz__result-cta {
        height: 82px;
        font-size: 23px;
    }
}

@media (max-width: 1024px) {
    .quiz.is-result-mode .quiz__intro {
        display: none;
    }

    .quiz__card.is-result {
        padding: 34px 24px;
    }

    .quiz__result {
        display: grid;
        grid-template-columns: 1fr;
        gap: 24px;
        min-height: 0;
    }

    .quiz__result-copy,
    .quiz__result-bmi-card,
    .quiz__result-note,
    .quiz__result-cta {
        grid-column: 1 / -1;
        grid-row: auto;
    }

    .quiz__result-title {
        font-size: 36px;
        line-height: 1.18;
    }

    .quiz__result-body {
        margin-top: 22px;
        font-size: 18px;
        line-height: 1.45;
    }

    .quiz__result-bmi-card {
        min-height: 0;
        padding: 28px 22px;
    }

    .quiz__result-bmi {
        font-size: 22px;
    }

    .quiz__result-cta {
        width: 100%;
        height: 58px;
        font-size: 18px;
    }

    .quiz__result-note {
        font-size: 12px;
    }

    .quiz__result-decor {
        display: none;
    }
}

@media (min-width: 768px) and (max-width: 1180px) {
    :root {
        --page-container-gutter: 32px;
        --anchor-offset: 96px;
    }

    section[id] {
        scroll-margin-top: 120px;
    }

    .site-header {
        height: 120px;
    }

    .site-header__inner {
        grid-template-columns: 70px minmax(0, 1fr) 218px 54px;
        gap: 20px;
        width: var(--page-container-width);
        padding-inline: 0;
    }

    .site-header__cta {
        grid-column: 3;
        width: 218px;
        height: 56px;
        border-radius: 12px;
        font-size: 16px;
        line-height: 22px;
    }

    .site-nav-toggle {
        grid-column: 4;
        width: 54px;
        height: 54px;
        border-radius: 0;
    }

    .site-nav-toggle__bar {
        width: 24px;
        height: 2px;
        margin: 3px 0;
    }

    .site-nav {
        top: 111px;
        right: 32px;
        width: 364px;
        gap: 36px;
        padding: 72px 36px 48px 48px;
        border-radius: 36px;
        box-shadow: none;
    }

    .is-nav-open .site-nav-toggle {
        position: relative;
        top: auto;
        right: auto;
        width: 54px;
        height: 54px;
        background: #ffffff;
    }

    .site-nav__link {
        min-height: 22px;
        font-size: 18px;
        font-weight: 500;
        line-height: 22px;
    }

    .site-nav__mobile-cta {
        display: none;
    }

    .hero {
        --hero-wave-top: 594px;
        --hero-wave-height: 53px;
        --hero-bg-split: calc(var(--hero-wave-top) + var(--hero-wave-height));
        min-height: 647px;
        scroll-margin-top: 120px;
        background: linear-gradient(var(--color-hero) 0 var(--hero-bg-split), var(--color-bg) var(--hero-bg-split));
    }

    .hero::after {
        top: var(--hero-bg-split);
    }

    .hero__content {
        z-index: 5;
        width: var(--page-container-width);
        padding-top: 60px;
        margin-left: var(--page-container-side);
    }

    .hero__title {
        width: 704px;
        max-width: 100%;
        font-size: 36px;
        font-weight: 700;
        line-height: 44px;
    }

    .hero__title br {
        display: none;
    }

    .hero__title-line {
        display: inline;
    }

    .hero__lead {
        width: 395px;
        margin-top: 24px;
        font-size: 18px;
        line-height: 24px;
    }

    .hero__button {
        gap: 10px;
        width: 346px;
        min-width: 0;
        height: 56px;
        margin-top: 66px;
        padding: 0 36px;
        border-radius: 12px;
        font-size: 16px;
        line-height: 22px;
    }

    .hero__button img {
        width: 14px;
        height: 11px;
    }

    .hero__disclaimer {
        width: 406px;
        margin-top: 79px;
        font-size: 11px;
        font-weight: 400;
        line-height: 14px;
    }

    .hero__decorations {
        top: 86px;
        right: -190px;
        width: 598px;
        height: auto;
    }

    .hero__people {
        top: 140px;
        right: clamp(-141px, calc(32vw - 387px), -16px);
        left: auto;
        width: clamp(567px, 52vw, 620px);
        height: 507px;
        object-fit: cover;
        object-position: center top;
        transform: none;
    }

    .hero__wave {
        top: var(--hero-wave-top);
        height: var(--hero-wave-height);
        transform: scale(-1);
        transform-origin: center;
    }

    .quiz {
        scroll-margin-top: 120px;
        margin-top: 0;
        min-height: 1292px;
    }

    .quiz__inner {
        width: min(702px, calc(100% - 66px));
        min-height: 1292px;
        padding: 40px 0 56px;
    }

    .quiz__intro-main {
        gap: 24px;
    }

    .quiz__title {
        width: 100%;
        font-size: 28px;
        line-height: 36px;
    }

    .quiz__lead {
        width: 635px;
        max-width: 100%;
        font-size: 20px;
        line-height: 28px;
    }

    .quiz__card {
        width: 628px;
        max-width: 100%;
        min-height: 788px;
        padding: 56px 70px;
        border-radius: 36px;
    }

    .quiz__footnote {
        width: 100%;
        font-size: 11px;
        line-height: 14px;
    }

    .systems {
        min-height: 0;
        scroll-margin-top: 120px;
    }

    .systems__inner {
        width: var(--page-container-width);
        min-height: 0;
        padding: 86px 0 132px;
    }

    .systems__title,
    .signals__title,
    .stages__title,
    .stages .stages__title {
        font-size: 36px;
        line-height: 44px;
    }

    .systems__grid {
        display: grid;
        grid-template-columns: 1fr;
        gap: 24px;
        margin-top: 0px;
    }

    .systems__visual {
        display: flex;
        order: 1;
        justify-content: center;
        min-height: 0;
        overflow: visible;
    }

    .systems::after {
        height: 123px;
    }

    .stages::before {
        top: -90px;
    }

    .systems__art {
        width: min(620px, 100%);
        margin: 0 auto;
        margin-top: -85px;
        margin-bottom: 48px;
    }

    .systems__content {
        position: relative;
        z-index: 4;
        isolation: isolate;
        order: 2;
        width: calc(100% + (2 * var(--page-container-gutter)));
        margin: -224px calc(-1 * var(--page-container-gutter)) 0;
        padding: 24px var(--page-container-gutter) 0;
        background: linear-gradient(
            180deg,
            rgba(252, 242, 245, 0) 0,
            rgba(252, 242, 245, 0.92) 32px,
            #fcf2f5 76px,
            #fcf2f5 100%
        );
        box-sizing: border-box;
        gap: 28px;
    }

    .systems__content::after {
        position: absolute;
        z-index: 0;
        right: 0;
        top: calc(100% + 32px);
        left: 0;
        height: 520px;
        background-image: url("../images/figma/systems-wave-bottom.svg");
        background-repeat: no-repeat;
        background-position: center bottom;
        background-size: 100% 100%;
        content: "";
        pointer-events: none;
    }

    .systems__heading,
    .systems__list,
    .systems__note {
        position: relative;
        z-index: 1;
    }

    .systems__heading {
        font-size: 28px;
        line-height: 36px;
    }

    .systems__item h4 {
        font-size: 20px;
        line-height: 28px;
    }

    .systems__item p,
    .systems__note p {
        font-size: 16px;
        line-height: 28px;
    }

    .signals {
        min-height: 1051px;
        padding: 18px 0 72px;
        scroll-margin-top: 120px;
    }

    .signals__inner {
        display: grid;
        gap: 16px;
        width: var(--page-container-width);
    }

    .signals__intro {
        order: 1;
        margin-bottom: 16px;
    }

    .signals__lead {
        font-size: 20px;
        line-height: 28px;
    }

    .signals__tabs {
        position: static;
        order: 3;
        display: grid;
        grid-template-columns: 1fr;
        gap: 12px;
        height: auto;
        margin: 0;
    }

    .signals__tab,
    .signals__tab.is-active {
        display: grid;
    }

    .signals__tab.is-active {
        display: none;
    }

    .signals__tab {
        place-items: center start;
        width: 100%;
        height: 64px;
        padding: 0 56px 0 32px;
        border-radius: 32px;
        box-shadow: none;
        text-align: left;
        transform: none;
    }

    .signals__tab::after {
        position: absolute;
        top: 50%;
        right: 32px;
        width: 8px;
        height: 8px;
        border-right: 1px solid currentColor;
        border-bottom: 1px solid currentColor;
        content: "";
        transform: translateY(-65%) rotate(45deg);
    }

    .signals__tab span {
        position: static;
        width: auto;
        font-size: 28px;
        line-height: 36px;
        text-align: left;
        transform: none;
    }

    .signals__panels {
        order: 2;
        min-height: 0;
    }

    .signals__panel {
        grid-template-columns: minmax(0, 328px) minmax(0, 1fr);
        gap: 16px;
        width: 100%;
        min-height: 552px;
        border-radius: 36px;
    }

    .signals__copy {
        padding: 48px 0 40px 48px;
    }

    .signals__copy h3 {
        margin-bottom: 22px;
        font-size: 28px;
        line-height: 36px;
    }

    .signals__symptoms,
    .signals__checks ul {
        gap: 12px;
        padding-left: 22px;
        font-size: 18px;
        line-height: 26px;
    }

    .signals__checks {
        margin-top: 26px;
    }

    .signals__checks h4 {
        margin-bottom: 12px;
        font-size: 18px;
        line-height: 26px;
    }

    .signals__media {
        min-height: 552px;
    }

    .signals__media::before {
        position: absolute;
        z-index: 3;
        top: 0;
        bottom: 0;
        left: 0;
        width: 92px;
        content: "";
        pointer-events: none;
    }

    .signals__panel--green .signals__media::before {
        background: linear-gradient(90deg, #dfefee 0%, rgba(223, 239, 238, 0.72) 44%, rgba(223, 239, 238, 0) 100%);
    }

    .signals__panel--blue .signals__media::before {
        background: linear-gradient(90deg, #e7effc 0%, rgba(231, 239, 252, 0.72) 44%, rgba(231, 239, 252, 0) 100%);
    }

    .signals__panel--rose .signals__media::before {
        background: linear-gradient(90deg, #fcf2f5 0%, rgba(252, 242, 245, 0.72) 44%, rgba(252, 242, 245, 0) 100%);
    }

    .signals__person {
        right: -28px;
        bottom: 0;
        width: auto;
        height: 100%;
        max-height: 100%;
    }

    .signals__glow {
        right: -80px;
        bottom: 52px;
        width: 360px;
    }

    .stages {
        min-height: 890px;
        height: auto;
        scroll-margin-top: 120px;
    }

    .stages__inner {
        z-index: 3;
        width: var(--page-container-width);
        min-height: 890px;
        padding: 92px 0 0px;
        margin-bottom: -29px;
    }

    .stages__lead {
        width: 100%;
        font-size: 20px;
        line-height: 28px;
    }

    .stages__canvas {
        width: 100%;
        height: auto;
    }

    .solution__inner {
        width: var(--page-container-width);
        padding: 64px 0 0px;
    }

    .solution__top {
        grid-template-columns: 1fr;
        gap: 40px;
        width: 100%;
    }

    .stages::after {
        height: 90px;
    }

    .solution__copy {
        justify-self: stretch;
        width: 100%;
    }

    .solution__title,
    .doctor-cta__title {
        font-size: 36px;
        line-height: 44px;
    }

    .solution__lead,
    .doctor-cta__lead {
        max-width: 704px;
        margin-top: 24px;
        font-size: 20px;
        line-height: 28px;
    }

    .solution__title,
    .solution__lead,
    .solution__bullets {
        width: 100%;
        max-width: none;
    }

    .solution__bullets {
        gap: 20px;
        margin-top: 32px;
        font-size: 18px;
        line-height: 28px;
    }

    .solution__steps {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .solution__step {
        grid-template-columns: 80px minmax(0, 1fr);
        min-height: 113px;
        padding: 24px 36px;
        border-radius: 18px;
    }

    .solution__step-icon {
        width: 56px;
        height: 56px;
    }

    .solution__step h3 {
        font-size: 20px;
        line-height: 28px;
    }

    .solution__step p {
        font-size: 16px;
        line-height: 24px;
    }

    .solution__divider {
        height: 48px;
        margin-top: 30px;
    }

    .solution__support {
        margin-top: 48px;
    }

    .solution__support h3 {
        margin-bottom: 30px;
        font-size: 28px;
        line-height: 36px;
    }

    .solution__support-item,
    .solution__support-item:last-child {
        grid-template-columns: 80px minmax(190px, 240px) minmax(0, 1fr);
        gap: 24px;
        min-height: 182px;
        padding: 24px 36px;
        border-radius: 18px;
    }

    .solution__support-icon {
        width: 56px;
        height: 56px;
    }

    .solution__support-item h4 {
        font-size: 20px;
        line-height: 28px;
    }

    .solution__support-item p {
        font-size: 16px;
        line-height: 24px;
    }

    .solution__note {
        margin-top: 34px;
        font-size: 16px;
        line-height: 24px;
    }

    .doctor-cta__inner {
        grid-template-columns: 1fr;
        width: var(--page-container-width);
        min-height: 994px;
        padding: 90px 0 0;
        z-index: auto;
    }

    .doctor-cta__content {
        z-index: 4;
        padding-bottom: 0;
    }

    .doctor-cta__steps-title {
        margin: 40px 0 24px;
        font-size: 28px;
        line-height: 36px;
    }

    .doctor-cta__cards {
        grid-template-columns: 1fr;
        gap: 16px;
        max-width: 480px;
    }

    .doctor-cta__card {
        display: grid;
        grid-template-columns: 64px minmax(0, 1fr);
        gap: 18px;
        align-items: center;
        min-height: 92px;
        padding: 18px;
        border-radius: 16px;
    }

    .doctor-cta__card-icon {
        width: 36px;
        height: 36px;
        margin-bottom: 0;
    }

    .doctor-cta__card p {
        font-size: 18px;
        line-height: 28px;
    }

    .doctor-cta__button {
        position: relative;
        z-index: 5;
        width: 328px;
        height: 56px;
        margin-top: 32px;
        font-size: 16px;
        line-height: 22px;
    }

    .doctor-cta__media {
        position: absolute;
        right: -116px;
        bottom: -58px;
        z-index: 1;
        width: 520px;
        height: 500px;
    }

    .doctor-cta__media img {
        width: 690px;
        max-width: none;
        margin: -20px 0 0 -86px;
    }

    .clinic-finder__inner {
        width: var(--page-container-width);
        padding: 36px 0 60px;
    }

    .clinic-finder__hero {
        grid-template-columns: 1fr;
        min-height: 292px;
        padding: 28px 48px 36px;
        border-radius: 24px;
    }

    .clinic-finder__hero-illustration {
        display: none;
    }

    .clinic-finder__title {
        font-size: 36px;
        line-height: 44px;
    }

    .clinic-finder__lead {
        max-width: 640px;
        margin-top: 18px;
        font-size: 20px;
        line-height: 28px;
    }

    .clinic-finder__invite {
        margin-top: 32px;
        font-size: 16px;
        line-height: 24px;
    }

    .clinic-finder__panel {
        margin-top: 48px;
    }

    .clinic-finder__controls,
    .clinic-finder__cities {
        gap: 12px;
    }

    .clinic-finder__city,
    .clinic-finder__other-trigger,
    .clinic-finder__format {
        min-height: 48px;
        padding-inline: 16px;
        border-radius: 8px;
        font-size: 16px;
        line-height: 20px;
    }

    .clinic-finder__controls {
        position: relative;
        z-index: 10;
    }

    .clinic-finder__other {
        position: static;
    }

    .clinic-finder__city-popover {
        top: calc(100% + 20px);
        right: auto;
        left: 0;
        width: min(100%, 364px);
        max-height: calc(100vh - 160px);
        overflow: hidden;
    }

    .clinic-finder__city-options {
        max-height: min(296px, calc(100vh - 390px));
    }

    .clinic-finder__results-head {
        display: flex;
        align-items: center;
        flex-direction: row;
        justify-content: space-between;
        gap: 24px;
        margin: 48px 0 24px;
    }

    .clinic-finder__results-head h3 {
        min-width: 0;
        font-size: 24px;
        line-height: 36px;
    }

    .clinic-finder__formats {
        flex: 0 0 auto;
        justify-self: end;
        width: auto;
        margin-left: auto;
    }

    .clinic-card {
        grid-template-columns: 88px minmax(0, 1fr);
        gap: 24px;
        align-items: start;
        min-height: 0;
        padding: 24px 36px;
        border-radius: 24px;
    }

    .clinic-card__description {
        font-size: 16px;
        line-height: 24px;
    }

    .clinic-card__badge {
        min-height: 44px;
        padding-inline: 24px;
        font-size: 16px;
    }

    .clinic-card__actions {
        grid-column: 2;
        justify-content: flex-start;
    }

    .clinic-card__button {
        width: 250px;
        min-height: 56px;
    }

    .clinic-finder__info {
        margin-top: 58px;
        padding: 36px 48px;
        border-radius: 24px;
        font-size: 16px;
        line-height: 24px;
    }

    .references-info__inner {
        width: var(--page-container-width);
        padding: 0 0 40px;
        font-size: 12px;
        line-height: 16px;
    }

    .site-footer {
        min-height: 521px;
    }

    .site-footer::before {
        height: 31px;
    }

    .site-footer__inner {
        grid-template-areas:
            "brand legal"
            "brand contact"
            "copy .";
        grid-template-columns: minmax(0, 290px) minmax(0, 315px);
        grid-template-rows: auto auto 1fr;
        column-gap: 45px;
        row-gap: 32px;
        align-items: start;
        width: min(650px, var(--page-container-width));
        min-height: 521px;
        padding: 107px 0 56px;
    }

    .site-footer__brand {
        grid-area: brand;
    }

    .site-footer__links:not(.site-footer__links--contact) {
        grid-area: legal;
    }

    .site-footer__links,
    .site-footer__links--contact {
        gap: 16px;
        grid-template-columns: max-content;
        justify-content: start;
        justify-items: start;
    }

    .site-footer__links a,
    .site-footer__links span {
        justify-self: start;
    }

    .site-footer__links--contact {
        grid-area: contact;
    }

    .site-footer__copy {
        grid-area: copy;
        align-self: end;
    }
}

@media (max-width: 767px) {
    :root {
        --page-container-gutter: 16px;
    }

    body {
        min-width: 320px;
    }

    section[id] {
        scroll-margin-top: 84px;
    }

    .site-main {
        overflow: hidden;
    }

    .site-header {
        height: 84px;
    }

    .site-header__inner {
        grid-template-columns: 70px minmax(0, 1fr) 44px;
        gap: 12px;
        width: var(--page-container-width);
        margin: 0 auto;
        padding-inline: 0;
    }

    .site-brand,
    .site-brand img {
        width: 70px;
        height: 50px;
    }

    .site-nav-toggle {
        width: 44px;
        height: 30px;
    }

    .site-nav {
        top: 100px;
        right: 16px;
        width: min(328px, calc(100% - 32px));
        gap: 28px;
        min-height: 0;
        padding: 32px;
        border-radius: 24px;
    }

    .site-nav__link {
        min-height: 22px;
        font-size: 18px;
        line-height: 22px;
    }

    .is-nav-open .site-nav-toggle {
        position: relative;
        top: auto;
        right: auto;
        width: 44px;
        height: 30px;
        background: #ffffff;
    }

    .hero {
        --hero-wave-top: clamp(676px, calc(969px - 38.13vw), 826px);
        --hero-wave-height: 56px;
        --hero-bg-split: calc(var(--hero-wave-top) + var(--hero-wave-height));
        min-height: var(--hero-bg-split);
        scroll-margin-top: 84px;
        background: linear-gradient(var(--color-hero) 0 var(--hero-bg-split), var(--color-bg) var(--hero-bg-split));
    }

    .hero::after {
        top: var(--hero-bg-split);
    }

    .hero__content {
        position: relative;
        z-index: 5;
        width: calc(100vw - 32px);
        padding-top: 38px;
        margin: 0 auto;
    }

    .hero__title {
        width: calc(100vw - 32px);
        max-width: 100%;
        font-size: 20px;
        font-weight: 800;
        line-height: 25px;
    }

    .hero__title br {
        display: none;
    }

    .hero__lead {
        width: calc(100vw - 32px);
        max-width: 100%;
        margin-top: 14px;
        font-size: 12px;
        line-height: 16px;
    }

    .hero__button {
        width: calc(100vw - 32px);
        height: 56px;
        margin-top: 14px;
        padding-inline: 24px;
        border-radius: 8px;
        font-size: 14px;
        line-height: 18px;
    }

    .hero__disclaimer {
        position: relative;
        top: auto;
        left: auto;
        z-index: 6;
        width: calc(100vw - 32px);
        margin: 16px 0 0;
        font-size: 9px;
        line-height: 12px;
    }

    .hero__decorations {
        top: clamp(254px, calc(547px - 38.13vw), 404px);
        right: auto;
        left: 50%;
        width: 340px;
        transform: translateX(-50%);
    }

    .hero__people {
        top: clamp(294px, calc(587px - 38.13vw), 444px);
        right: auto;
        left: 50%;
        width: min(418px, calc(100vw + 43px));
        height: auto;
        object-fit: contain;
        transform: translateX(-50%);
    }

    .hero__wave {
        top: var(--hero-wave-top);
        width: 142%;
        transform: scaleY(-1);
        max-width: none;
        height: var(--hero-wave-height);
    }

    .quiz {
        min-height: 0;
        padding: 0;
    }

    .quiz__inner {
        width: var(--page-container-width);
        min-height: 0;
        padding: 36px 0 52px;
    }

    .quiz__intro-main {
        gap: 18px;
    }

    .quiz__pill {
        height: 36px;
        padding: 7px 14px;
        border-radius: 999px;
        font-size: 12px;
        line-height: 18px;
    }

    .quiz__title {
        font-size: 18px;
        line-height: 24px;
    }

    .quiz__lead {
        width: 100%;
        font-size: 16px;
        line-height: 24px;
    }

    .quiz__footnote {
        margin-top: 24px;
        font-size: 9px;
        line-height: 12px;
    }

    .quiz__card {
        margin-top: 28px;
        min-height: 0;
        padding: 28px 18px;
        border-radius: 18px;
    }

    .quiz__step-illustration {
        display: none;
    }

    .quiz__question {
        font-size: 18px;
        line-height: 24px;
    }

    .quiz__options {
        gap: 10px;
    }

    .quiz__option {
        min-height: 52px;
        padding: 12px 14px;
        border-radius: 8px;
        font-size: 14px;
        line-height: 18px;
    }

    .quiz__controls {
        gap: 16px;
        margin-top: 28px;
    }

    .quiz__next,
    .quiz__result-cta {
        width: 100%;
        height: 44px;
        border-radius: 8px;
        font-size: 14px;
    }

    .systems {
        min-height: 0;
    }

    .systems__inner {
        width: var(--page-container-width);
        min-height: 0;
        padding: 56px 0 82px;
    }

    .systems__title,
    .signals__title,
    .stages__title,
    .solution__title,
    .doctor-cta__title,
    .clinic-finder__title {
        font-size: 18px;
        line-height: 24px;
    }

    .systems__title-mobile-break {
        display: block;
    }

    .systems__grid {
        display: grid;
        grid-template-columns: 1fr;
        gap: 24px;
        margin-top: 0px;
    }

    .systems__visual {
        order: 1;
        display: flex;
        justify-content: center;
        min-height: 300px;
    }

    .systems__visual::after {
        position: absolute;
        right: -16px;
        bottom: -24px;
        left: -16px;
        z-index: 2;
        height: 86px;
        background: linear-gradient(180deg, rgba(252, 242, 245, 0) 0%, rgba(252, 242, 245, 0.78) 45%, #fcf2f5 100%);
        content: "";
        pointer-events: none;
    }

    .systems__art {
        width: 328px;
        max-width: none;
        margin: -8px auto 0;
    }

    .systems__content {
        order: 2;
        width: 100%;
        margin: 0;
        padding: 0;
        background: transparent;
    }

    .systems__heading {
        font-size: 18px;
        line-height: 24px;
    }

    .systems__list {
        gap: 16px;
    }

    .systems__item h4 {
        font-size: 14px;
        line-height: 18px;
    }

    .systems__item p,
    .systems__note p {
        font-size: 12px;
        line-height: 16px;
    }

    .systems__note {
        gap: 12px;
        margin-top: 20px;
        padding: 16px;
        border-radius: 8px;
    }

    .systems__note img {
        flex: 0 0 24px;
        width: 24px;
        height: 24px;
    }

    .signals {
        min-height: 0;
        padding: 48px 0 58px;
    }

    .signals__inner,
    .stages__inner,
    .solution__inner,
    .doctor-cta__inner,
    .clinic-finder__inner,
    .references-info__inner,
    .site-footer__inner {
        width: var(--page-container-width);
    }

    .signals__inner {
        display: grid;
        grid-template-areas:
            "intro"
            "image"
            "panels"
            "tabs";
    }

    .signals__intro,
    .stages__intro {
        gap: 16px;
        margin-bottom: 24px;
    }

    .signals__intro {
        grid-area: intro;
    }

    .signals__lead,
    .stages__lead,
    .solution__lead,
    .doctor-cta__lead,
    .clinic-finder__lead {
        width: 100%;
        max-width: none;
        font-size: 14px;
        line-height: 20px;
    }

    .signals__mobile-media {
        position: relative;
        grid-area: image;
        display: flex;
        justify-content: center;
        min-height: 318px;
        margin: 0 0 -8px;
        overflow: hidden;
    }

    .signals__mobile-media img {
        display: block;
        width: 250px;
        max-width: none;
        height: auto;
        margin-top: 4px;
    }

    .signals__tabs {
        grid-area: tabs;
        position: static;
        order: 3;
        display: grid;
        grid-template-columns: 1fr;
        gap: 8px;
        height: auto;
        margin-top: 12px;
    }

    .signals__tab,
    .signals__tab.is-active {
        display: grid;
    }

    .signals__tab.is-active {
        display: none;
    }

    .signals__tab {
        width: 100%;
        height: 48px;
        place-items: center start;
        padding: 0 44px 0 20px;
        border-radius: 24px;
        text-align: left;
        transform: none;
    }

    .signals__tab::after {
        position: absolute;
        top: 50%;
        right: 20px;
        width: 8px;
        height: 8px;
        border-right: 2px solid currentColor;
        border-bottom: 2px solid currentColor;
        content: "";
        transform: translateY(-65%) rotate(45deg);
    }

    .signals__tab span {
        position: static;
        width: auto;
        font-size: 14px;
        line-height: 18px;
        transform: none;
    }

    .signals__panels {
        grid-area: panels;
        order: 2;
        min-height: 0;
    }

    .signals__panel {
        position: relative;
        display: block;
        width: 100%;
        min-height: 0;
        border-radius: 24px;
    }

    .signals__panel.is-active::after {
        position: absolute;
        top: 24px;
        right: 24px;
        width: 10px;
        height: 10px;
        border-top: 2px solid currentColor;
        border-left: 2px solid currentColor;
        content: "";
        transform: rotate(45deg);
    }

    .signals__copy {
        order: 2;
        padding: 24px 20px;
    }

    .signals__copy h3 {
        margin-bottom: 16px;
        font-size: 16px;
        line-height: 22px;
    }

    .signals__symptoms,
    .signals__checks ul {
        gap: 8px;
        padding-left: 18px;
        font-size: 12px;
        line-height: 16px;
    }

    .signals__checks {
        margin-top: 18px;
    }

    .signals__checks h4 {
        margin-bottom: 8px;
        font-size: 12px;
        line-height: 16px;
    }

    .signals__media {
        display: none;
    }

    .signals__media::before {
        top: auto;
        right: 0;
        bottom: 0;
        left: 0;
        width: auto;
        height: 70px;
        background: linear-gradient(180deg, rgba(223, 239, 238, 0) 0%, rgba(223, 239, 238, 0.78) 58%, #dfefee 100%);
    }

    .signals__panel--green .signals__media::before {
        background: linear-gradient(180deg, rgba(223, 239, 238, 0) 0%, rgba(223, 239, 238, 0.78) 58%, #dfefee 100%);
    }

    .signals__panel--blue .signals__media::before {
        background: linear-gradient(180deg, rgba(231, 239, 252, 0) 0%, rgba(231, 239, 252, 0.78) 58%, #e7effc 100%);
    }

    .signals__panel--rose .signals__media::before {
        background: linear-gradient(180deg, rgba(252, 242, 245, 0) 0%, rgba(252, 242, 245, 0.78) 58%, #fcf2f5 100%);
    }

    .signals__person {
        right: 50%;
        bottom: 0;
        width: auto;
        height: 100%;
        max-height: 100%;
        transform: translateX(50%);
    }

    .signals__glow {
        right: 50%;
        bottom: 18px;
        width: 250px;
        transform: translateX(50%);
    }

    .stages {
        min-height: 0;
        height: auto;
        overflow: visible;
    }

    .stages__inner {
        min-height: 0;
        padding: 58px 0 64px;
        margin-bottom: 0;
    }

    .stages__canvas {
        width: 100%;
        max-width: 360px;
        margin: 26px auto 0;
    }

    .stages__diagram {
        display: block;
        width: 100%;
        max-width: none;
        height: auto;
        margin: 0;
    }

    .solution {
        background: #fffaf5;
    }

    .solution__inner {
        padding: 56px 0 58px;
    }

    .solution__top {
        display: grid;
        grid-template-columns: 1fr;
        gap: 28px;
    }

    .solution__copy {
        width: 100%;
        text-align: left;
    }

    .solution__lead {
        margin-top: 18px;
        font-weight: 600;
    }

    .solution__bullets {
        gap: 12px;
        margin-top: 20px;
        padding-left: 18px;
        font-size: 13px;
        line-height: 18px;
    }

    .solution__steps {
        gap: 10px;
    }

    .solution__step {
        grid-template-columns: 56px minmax(0, 1fr);
        gap: 16px;
        min-height: 92px;
        padding: 18px;
        border-radius: 8px;
    }

    .solution__step-icon {
        width: 56px;
        height: 56px;
    }

    .solution__step h3 {
        font-size: 14px;
        line-height: 18px;
    }

    .solution__step p {
        margin-top: 4px;
        font-size: 12px;
        line-height: 16px;
    }

    .solution__divider {
        height: 38px;
        margin-top: 28px;
    }

    .solution__support {
        margin-top: 36px;
    }

    .solution__support h3 {
        margin-bottom: 24px;
        font-size: 20px;
        line-height: 26px;
    }

    .solution__support-list {
        gap: 20px;
    }

    .solution__support-item,
    .solution__support-item:last-child {
        grid-template-columns: 56px minmax(0, 1fr);
        gap: 18px;
        min-height: 0;
        padding: 24px;
        border-radius: 8px;
    }

    .solution__support-icon {
        width: 56px;
        height: 56px;
    }

    .solution__support-item h4 {
        font-size: 16px;
        line-height: 22px;
    }

    .solution__support-item p {
        grid-column: 1 / -1;
        font-size: 12px;
        line-height: 17px;
    }

    .solution__note {
        margin-top: 24px;
        font-size: 12px;
        line-height: 18px;
    }

    .doctor-cta {
        min-height: unset;
    }

    .doctor-cta::before {
        height: 31px;
    }

    .doctor-cta::after {
        bottom: -1px;
        height: 64px;
    }

    .doctor-cta__inner {
        display: block;
        min-height: unset;
        padding: 66px 0 86px;
        z-index: 1;
    }

    .doctor-cta__content {
        padding-bottom: 0;
    }

    .doctor-cta__lead {
        margin-top: 18px;
    }

    .doctor-cta__steps-title {
        margin: 34px 0 20px;
        font-size: 18px;
        line-height: 24px;
    }

    .doctor-cta__cards {
        grid-template-columns: 1fr;
        gap: 16px;
        max-width: none;
    }

    .doctor-cta__card {
        display: grid;
        grid-template-columns: 36px minmax(0, 1fr);
        gap: 18px;
        align-items: center;
        min-height: 72px;
        padding: 12px 18px;
        border-radius: 8px;
    }

    .doctor-cta__card-icon {
        align-self: center;
        justify-self: center;
        width: 36px;
        height: 36px;
        margin: 0;
    }

    .doctor-cta__card p {
        margin: 0;
        font-size: 14px;
        line-height: 20px;
    }

    .doctor-cta__button {
        width: 328px;
        height: 56px;
        margin-top: 32px;
        border-radius: 8px;
        font-size: 14px;
        line-height: 18px;
    }

    .doctor-cta__media {
        display: none;
    }

    .clinic-finder {
        background: #fffaf5;
    }

    .clinic-finder__inner {
        padding: 0 0 40px;
    }

    .clinic-finder__hero {
        display: block;
        min-height: unset;
        padding: 36px 24px;
        border-radius: 24px;
    }

    .clinic-finder__hero-illustration {
        display: none;
    }

    .clinic-finder__lead {
        margin-top: 18px;
    }

    .clinic-finder__invite {
        display: grid;
        grid-template-columns: 24px minmax(0, 1fr);
        gap: 12px;
        align-items: start;
        margin-top: 28px;
        padding-left: 0;
        font-size: 12px;
        font-weight: 500;
        line-height: 18px;
    }

    .clinic-finder__invite::before {
        position: static;
        grid-column: 1;
        width: 24px;
        height: 24px;
    }

    .clinic-finder__panel {
        margin-top: 24px;
        padding: 0;
        border-radius: 0;
        background: transparent;
    }

    .clinic-finder__controls,
    .clinic-finder__cities {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
    }

    .clinic-finder__controls {
        position: relative;
        z-index: 10;
    }

    .clinic-finder__other {
        position: static;
        width: auto;
    }

    .clinic-finder__city,
    .clinic-finder__other-trigger {
        width: auto;
        min-height: 48px;
        padding: 0 16px;
        border-radius: 8px;
        font-size: 12px;
        line-height: 18px;
    }

    .clinic-finder__other-trigger {
        gap: 8px;
        min-width: 112px;
    }

    .clinic-finder__city-popover {
        top: calc(100% + 16px);
        right: auto;
        left: 0;
        width: min(100%, 326px);
        max-height: calc(100vh - 120px);
        padding: 70px 32px 40px;
        overflow: hidden;
    }

    .clinic-finder__city-popover-close {
        top: 30px;
        right: 30px;
    }

    .clinic-finder__city-options {
        max-height: min(296px, calc(100vh - 350px));
    }

    .clinic-finder__city-option,
    .clinic-finder__city-popover-note {
        min-width: 0;
    }

    .clinic-finder__results-head {
        display: block;
        margin: 24px 0 24px;
    }

    .clinic-finder__results-head h3 {
        width: 100%;
        font-size: 18px;
        line-height: 28px;
        white-space: nowrap;
    }

    .clinic-finder__formats {
        display: flex;
        gap: 12px;
        width: 100%;
        margin: 20px 0 0;
    }

    .clinic-finder__format {
        width: auto;
        min-width: 111px;
        min-height: 44px;
        padding: 0 24px;
        border-radius: 8px;
        font-size: 14px;
        line-height: 20px;
    }

    .clinic-card {
        display: block;
        min-height: unset;
        padding: 24px;
        border-radius: 8px;
    }

    .clinic-card__icon {
        display: none;
    }

    .clinic-card h3 {
        margin-bottom: 16px;
        font-size: 18px;
        line-height: 28px;
    }

    .clinic-card__address {
        align-items: flex-start;
        margin-bottom: 6px;
        font-size: 14px;
        line-height: 24px;
    }

    .clinic-card__website {
        margin-bottom: 16px;
        font-size: 14px;
        line-height: 22px;
    }

    .clinic-card__description {
        margin: 0;
        font-size: 14px;
        line-height: 24px;
    }

    .clinic-card__badge {
        display: inline-flex;
        align-items: flex-start;
        min-height: unset;
        margin-top: 16px;
        padding: 10px 24px;
        border-radius: 8px;
        font-size: 14px;
        line-height: 24px;
    }

    .clinic-card__badge::before {
        margin-top: 3px;
    }

    .clinic-card__actions {
        display: block;
        margin-top: 24px;
    }

    .clinic-card__button {
        width: 267px;
        min-height: 56px;
        border-radius: 8px;
        font-size: 14px;
    }

    .clinic-finder__empty {
        min-height: 196px;
        padding: 24px 20px;
        border-radius: 18px;
    }

    .clinic-finder__empty-icon {
        width: 64px;
        height: 64px;
        margin-bottom: 18px;
    }

    .clinic-finder__empty h3,
    .clinic-finder__empty p {
        font-size: 14px;
        line-height: 20px;
    }

    .clinic-finder__pagination {
        margin-top: 24px;
    }

    .clinic-finder__info {
        display: block;
        margin-top: 24px;
        padding: 36px 24px;
        border-radius: 8px;
        font-size: 12px;
        line-height: 20px;
    }

    .clinic-finder__info span {
        display: block;
        margin-top: 0;
    }

    .references-info__inner {
        min-height: unset;
        padding: 0 0 36px;
        font-size: 9px;
        line-height: 12px;
    }

    .references-info p,
    .references-info ol {
        margin-bottom: 12px;
    }

    .references-info ol {
        padding-left: 14px;
    }

    .references-info__warning {
        margin-top: 24px;
    }

    .site-footer {
        min-height: 642px;
        background: #e6e8ef;
    }

    .site-footer::before {
        height: 31px;
    }

    .site-footer__inner {
        display: grid;
        grid-template-areas:
            "brand"
            "legal"
            "contact"
            "copy";
        grid-template-columns: 1fr;
        gap: 0;
        min-height: 642px;
        padding: 89px 0 37px;
    }

    .site-footer__brand {
        grid-area: brand;
    }

    .site-footer__brand strong {
        display: block;
        font-size: 18px;
        font-weight: 600;
        line-height: 22px;
    }

    .site-footer__brand p {
        margin-top: 34px;
        font-size: 16px;
        font-weight: 600;
        line-height: 24px;
    }

    .site-footer__links {
        gap: 16px;
        justify-content: start;
        justify-items: start;
        margin-top: 48px;
    }

    .site-footer__links:not(.site-footer__links--contact) {
        grid-area: legal;
    }

    .site-footer__links--contact {
        grid-area: contact;
        margin-top: 32px;
    }

    .site-footer__links a,
    .site-footer__links span {
        font-size: 18px;
        font-weight: 600;
        line-height: 22px;
        white-space: nowrap;
    }

    .site-footer__copy {
        grid-area: copy;
        align-self: end;
        font-size: 16px;
        font-weight: 600;
        line-height: 24px;
    }

    .hero__title {
        font-size: 28px;
        line-height: 36px;
    }

    .systems__title,
    .signals__title,
    .stages__title,
    .stages .stages__title,
    .solution__support h3,
    .solution__title,
    .doctor-cta__title {
        font-size: 28px;
        line-height: 36px;
    }

    .quiz__title {
        font-size: 18px;
        line-height: 24px;
    }

    .quiz__question,
    .systems__heading,
    .stages__lead,
    .clinic-finder__title,
    .clinic-finder__results-head h3 {
        font-size: 20px;
        line-height: 28px;
    }

    .signals__lead,
    .solution__lead,
    .doctor-cta__lead,
    .clinic-finder__lead {
        font-size: 16px;
        line-height: 24px;
    }

    .signals__copy h3 {
        font-size: 28px;
        line-height: 36px;
    }

    .hero__lead,
    .quiz__lead,
    .quiz__option,
    .systems__item p,
    .systems__note p,
    .signals__symptoms,
    .signals__checks ul,
    .solution__bullets,
    .doctor-cta__card p,
    .clinic-finder__invite,
    .clinic-card__address,
    .clinic-card__website,
    .clinic-card__description,
    .clinic-card__badge,
    .clinic-finder__info,
    .site-footer__brand p,
    .site-footer__copy {
        font-size: 16px;
        line-height: 24px;
    }

    .solution__step p,
    .solution__support-item p,
    .solution__note {
        font-size: 14px;
        line-height: 20px;
    }


    .signals__tab span,
    .solution__support-item h4 {
        font-size: 20px;
        line-height: 28px;
    }

    .systems__item h4,
    .signals__checks h4,
    .clinic-card h3,
    .site-footer__brand strong,
    .site-footer__links a,
    .doctor-cta__steps-title,
    .site-footer__links span {
        font-size: 18px;
        line-height: 24px;
    }

    .hero__button,
    .quiz__next,
    .quiz__result-cta,
    .doctor-cta__button,
    .clinic-finder__format,
    .clinic-card__button,
     .solution__step h3,
    .clinic-finder__page {
        font-size: 16px;
        line-height: 24px;
    }

    .quiz__pill,
    .clinic-finder__city,
    .clinic-finder__other-trigger {
        font-size: 14px;
        line-height: 20px;
    }

    .hero__disclaimer,
    .quiz__footnote,
    .references-info__inner {
        font-size: 11px;
        line-height: 14px;
    }

    .quiz__next,
    .quiz__result-cta {
        align-self: flex-end;
        width: 166px;
    }
}