@media(max-width:900px) {
    .links {
        display: none
    }

    .hero-grid,
    .speaker,
    .ticket-grid,
    .study-panel {
        grid-template-columns: 1fr
    }

    .hero {
        padding: 48px 0 62px
    }

    .section {
        padding: 64px 0
    }

    .ticket-grid {
        gap: 25px
    }

    .extras-grid {
        grid-template-columns: 170px 1fr
    }

    .ebook {
        width: 170px
    }
}

@media(max-width:600px) {
    .wrap {
        width: calc(100% - 28px)
    }

    .hero h1 {
        font-size: 43px
    }

    .section {
        padding: 58px 0
    }

    .methods {
        grid-template-columns: 1fr
    }

    .method {
        padding: 22px
    }

    .study-panel {
        padding: 21px
    }

    .ticket-card {
        padding: 24px
    }

    .extras-grid {
        grid-template-columns: 1fr
    }

    .ebook {
        width: 180px
    }

    .bottom-cta {
        display: block;
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        padding: 11px 16px max(11px, env(safe-area-inset-bottom));
        background: #fff;
        z-index: 24;
        box-shadow: 0 -8px 35px #0c1a4226
    }

    .bottom-cta .button {
        width: 100%
    }

    footer {
        padding-bottom: 100px
    }

    footer .wrap {
        align-items: start;
        flex-direction: column
    }

    .overlay {
        padding: 0;
        align-items: end
    }

    .modal {
        border-radius: 24px 24px 0 0;
        max-height: 92vh;
        width: 100%
    }

    .process-arrow {
        font-size: 15px
    }

    .process-node {
        padding: 13px 6px
    }

    .process-node strong {
        font-size: 12px
    }

    .process-node small {
        font-size: 10px
    }
}

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

    *,
    *::after,
    *::before {
        transition: none !important;
        animation: none !important
    }
}