@media (min-width: 1051px) {
    html,
    body {
        height: 100%;
        overflow: hidden;
    }

    .registration-header {
        height: 72px;
        min-height: 72px;
        padding-block: 7px;
    }

    .registration-header .registration-brand img {
        width: 50px;
        height: 50px;
    }

    .registration-page {
        height: calc(100vh - 72px);
        min-height: 0;
        overflow: hidden;
    }

    .registration-intro {
        height: 100%;
        min-height: 0;
        padding: clamp(34px, 5vh, 58px) clamp(42px, 5vw, 76px);
    }

    .intro-content {
        width: 100%;
        max-width: 570px;
    }

    .intro-kicker {
        margin-bottom: clamp(10px, 1.5vh, 16px);
        font-size: .7rem;
    }

    .intro-content h1 {
        max-width: 560px;
        margin-bottom: clamp(15px, 2.2vh, 23px);
        font-size: clamp(3.25rem, 4.25vw, 4.65rem);
        line-height: .98;
    }

    .intro-content > p:not(.intro-kicker) {
        max-width: 540px;
        margin-bottom: 0;
        font-size: clamp(.92rem, 1vw, 1.06rem);
        line-height: 1.55;
    }

    .benefit-list {
        margin-top: clamp(22px, 3.5vh, 36px);
        gap: clamp(7px, 1.2vh, 11px);
    }

    .benefit-list > div {
        min-height: 0;
        padding: clamp(10px, 1.5vh, 14px) 16px;
        border-radius: 10px;
    }

    .benefit-list p {
        line-height: 1.15;
    }

    .benefit-list strong {
        font-size: .84rem;
    }

    .benefit-list small {
        margin-top: 3px;
        font-size: .72rem;
    }

    .form-panel {
        height: 100%;
        padding: clamp(34px, 5vh, 60px) clamp(44px, 6vw, 92px);
        overflow-y: auto;
        scrollbar-width: thin;
        scrollbar-color: #c5ccd8 transparent;
    }

    .form-heading h2 {
        font-size: clamp(2.25rem, 3vw, 3.25rem);
    }

    .stepper {
        margin: clamp(28px, 4vh, 40px) 0 clamp(30px, 4.5vh, 44px);
    }

    .step-title {
        margin-bottom: clamp(20px, 3vh, 28px);
    }

    .form-actions {
        margin-top: clamp(10px, 2vh, 20px);
    }
}

@media (min-width: 1051px) and (max-height: 760px) {
    .registration-header {
        height: 64px;
        min-height: 64px;
    }

    .registration-page {
        height: calc(100vh - 64px);
    }

    .registration-intro {
        padding-block: 26px;
    }

    .intro-content h1 {
        font-size: clamp(2.8rem, 4vw, 3.75rem);
    }

    .benefit-list {
        margin-top: 18px;
        gap: 6px;
    }

    .benefit-list > div {
        padding-block: 9px;
    }

    .form-panel {
        padding-block: 28px;
    }
}