/* ============================================================
RESPONSIVE — mk-red landing
1024px = планшет  |  768px = мобилка  |  480px = маленький
============================================================ */

@media (max-width: 1450px) {
    .cta-final__heading {
        font-size: 6.7vw;
    }
}

@media (max-width: 1350px) {
    .hero__heading {
        font-size: 8.1vw;
        line-height: 90%;
    }
}

@media (max-width: 1120px) {
    .hero__cta {
        grid-row: 2;
        grid-column: 3/5;
        width: 100%;
    }

    .hero__photo {
        grid-column: 2/5;
    }

    .who__grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* ─── ПЛАНШЕТ 1024px ──────────────────────────────────────── */
@media (max-width: 1024px) {
    .global-grid {
        display: flex;
    }

    .hero__inner-wrapper {
        display: grid;
    }

    /* page */
    .page { width: 100%; }

    /* hero */
    .hero {
        width: 100vw;
        margin-left: 0;
        height: auto;
        min-height: 600px;
        padding-bottom: 20px;
    }
    .hero__inner {
        width: 100%;
        padding: 0 40px;
    }
    .hero__heading {
        letter-spacing: -2px;
        top: 140px;
        left: 0;
    }

    /* who */
    .who { padding: 80px 40px; }
    .who__title-wrap { padding-left: 0; }
    .who__subtitle-wrap { padding-left: 0; }
    .who__title { font-size: 54px; line-height: 60px; }
    .who__grid { flex-wrap: wrap; gap: 24px; }
    .who__item { flex: 1 1 calc(50% - 12px); min-width: 200px; }

    /* speaker */
    .speaker { padding: 60px 40px; }
    .speaker__bio { padding-left: 0; }
    .speaker__stats { padding-left: 0; height: auto; }
    .speaker__stat--br,
    .speaker__stat--b,
    .speaker__stat--r,
    .speaker__stat--n { padding: 20px 30px 20px 0; }
    .speaker__stat--b,
    .speaker__stat--n { padding-left: 30px; }

    /* program */
    .program { padding: 60px 40px; }
    .program__grid-wrap { padding-left: 0; }
    .program__row--bottom .program__item:nth-child(1) { width: auto; flex: 1; }
    .program__row--bottom .program__item:nth-child(2) { width: auto; flex: 1; }

    /* results */
    .results { padding: 60px 40px 0; }
    .results__head { padding-left: 0; }
    .results__subtitle-wrap { padding-left: 0; }
    .results__grid { width: 100%; height: auto; }
    .results__item { padding: 32px 32px 36px; }
    .results__center-logo { width: 220px; height: 80px; }

    /* bonus */
    .bonus { width: 100%; padding: 80px 40px; }

    /* cta */
    .cta-final__top {
        grid-template-columns: 1fr;
        padding: 60px 40px 40px;
        min-height: 0;
        gap: 24px;
    }
    .cta-final__date { text-align: left; }
    .cta-final__date-block { align-items: flex-start; }
    .cta-final__date-meta { text-align: left; }
    .cta-final__bottom { grid-template-columns: 1fr; height: auto; }
    .cta-final__col--border-r { border-right: none; border-bottom: 1px solid var(--border); }
    .cta-final__col-text { white-space: normal; }
    .cta-final__col-inner { padding: 30px 40px; }
    .cta-final__free { padding: 30px 40px; }
    .cta-final__btn-wrap { padding: 30px 40px; }

    /* footer */
    .footer { padding: 28px 40px; }

    .cta-final__heading {
        font-size: 9.1vw;
    }
}

/* ─── МОБИЛКА 768px ───────────────────────────────────────── */
@media (max-width: 768px) {
    .results__item,
    .program__grid {
        width: calc(100% + 40px);
        position: relative;
        left: -20px;
    }

    .hero__heading.desktop {
        display: none;
    }

    .hero__heading.mobile {
        display: block;
    }

    .hero__inner-wrapper {
        display: flex;
        flex-direction: column;
        margin-top: 0;
        gap: 0;
    }


    /* page */
    .page { width: 100%; }

    /* ── HERO ── */
    .hero {
        height: auto;
        width: 100%;
        min-height: 0;
        overflow: visible;
        background: none;
        padding-top: 56px;
        padding-bottom: 0;
    }

    /* стрип → чёрная полоса full-width со списком */
    .hero__strip {
        position: relative;
        width: 100%;
        height: auto;
        padding: 26px 20px;
        z-index: 1;
        grid-row: 1;
    }

    /* список внутри стрипа */
    .hero__list {
        position: relative;
        left: auto; top: auto; transform: none;
        color: var(--white);
        font-size: 18px;
    }

    /* серая зона с градиентом */
    .hero__inner {
        position: relative;
        display: flex;
        flex-direction: column;
        padding: 40px 20px;
        padding-top: 0;
        box-sizing: border-box;
        gap: 20px;
    }

    .hero__strip::before {
        right: -20px;
    }

    /* фото */
    .hero__photo {
        margin-top: 40px;
        position: relative;
        left: auto; top: auto;
        width: 100%;
        height: 162px;
        background: #f2f1ef;
    }

    /* заголовок */
    .hero__heading {
        position: relative;
        left: auto; top: auto; transform: none;
        font-size: 38px;
        line-height: 34px;
        letter-spacing: -1px;
        white-space: normal;
    }

    /* CTA-блок */
    .hero__cta {
        position: relative;
        bottom: auto; right: auto;
        width: 100%;
        gap: 12px;
    }

    .hero__cta-text {
        font-size: 15px;
        line-height: 24.75px;
        color: var(--black);
    }

    .hero__cta-btn {
        width: 100%;
    }

    /* ── WHO ── */
    .who { padding: 40px 20px; gap: 24px; }
    .who__head { gap: 12px; }
    .who__title { font-size: 40px; line-height: 46px; letter-spacing: -1px; text-align: left;}
    .who__subtitle { font-size: 16px; }
    .who__grid { 
        display: flex;
        flex-direction: column; 
        gap: 0; 
    }
    .who__item {
        flex: none;
        width: 100%;
        border-top: 1px solid var(--border);
        border-bottom: none;
        padding: 20px 0;
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }
    .who__item:first-child { border-top: 6px solid var(--red); }
    .who__item:last-child { border-bottom: 1px solid var(--border); }
    .who__num { font-size: 36px; line-height: 36px; }
    .who__role { font-size: 14px; }

    /* ── SPEAKER ── */
    .speaker { padding: 40px 20px; }
    .speaker__heading { font-size: 32px; line-height: 30px; }

    /* фото между заголовком и именем */
    .speaker__body {
        flex-direction: column;
        gap: 0;
        padding-bottom: 0px;
    }
    .speaker__photo {
        width: 100%;
        height: 320px;
        order: -1;
        margin-bottom: 28px;
    }
    .speaker__info { gap: 24px; }
    .speaker__bio { padding-bottom: 4px; }

    /* статы: 4 пункта вертикально */
    .speaker__stats {
        display: flex;
        flex-direction: column;
        height: auto;
        padding-left: 0;
    }
    .speaker__stat {
        border: none !important;
        border-top: 1px solid var(--border) !important;
        padding: 20px 0 !important;
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }
    .speaker__stat:last-child {
        border-bottom: 1px solid var(--border) !important;
    }
    .speaker__stat-val { font-size: 36px; line-height: 36px; min-width: 80px; }
    .speaker__stat-lbl { font-size: 11px; }

    /* ── PROGRAM ── */
    .program { padding: 48px 20px; }
    .program__title { font-size: 32px; line-height: 30px; }
    .program__row { flex-direction: column; }
    .program__row--bottom .program__item:nth-child(1),
    .program__row--bottom .program__item:nth-child(2),
    .program__row--bottom .program__item:nth-child(3) {
        width: 100%;
        flex: none;
        padding: 24px 20px;
        border-left: none;
        border-right: none;
    }
    .program__item { padding: 24px 20px; }
    .program__item--border-l { border-left: none; border-top: 1px solid var(--border); }

    /* ── RESULTS ── */
    .results { padding: 10px 20px 0; }
    .results__title { font-size: 32px; line-height: 30px; }
    .results__subtitle { font-size: 18px; }
    .results__grid {
        grid-template-columns: 1fr;
        grid-template-rows: repeat(4, auto);
        height: auto;
        border: none;
    }
    .results__vline,
    .results__hline { display: none; }
    .results__item { padding: 28px 20px; border-bottom: 1px solid var(--border); }
    .results__item--right { align-items: flex-start; text-align: left; }
    .results__center-logo { display: none; }

    /* ── BONUS ── */
    .bonus { padding: 60px 20px; width: 100%; }
    .bonus__inner { flex-direction: column; min-height: 0; }
    .bonus__left {
        border-right: none;
        border-bottom: 1px solid rgba(255,255,255,0.08);
        padding: 40px 24px;
        gap: 24px;
    }
    .bonus__title { font-size: 36px; line-height: 42px; }
    .bonus__right { padding: 40px 24px; }
    .bonus__deco { display: none; }
    .bonus__stats { gap: 24px; }
    .bonus__stat-val { font-size: 32px; }

    /* ── CTA FINAL ── */
    .cta-final__heading { font-size: 38px; line-height: 36px; }

    .cta-final__top {
        grid-template-columns: 1fr;
        padding: 40px 20px 32px;
        min-height: 0;
        gap: 24px;
    }
    .cta-final__date-block { align-items: flex-start; }
    .cta-final__date { font-size: 40px; line-height: 40px; text-align: left; }
    .cta-final__date-meta { text-align: left; }
    .cta-final__bottom {
        grid-template-columns: 1fr;
        height: auto;
    }
    .cta-final__col--border-r {
        border-right: none;
        border-bottom: 1px solid var(--border);
    }
    .cta-final__col-text { white-space: normal; font-size: 14px; }
    .cta-final__col-inner { padding: 24px 20px; }
    .cta-final__free { padding: 24px 20px; }
    .cta-final__btn-wrap { padding: 24px 20px; justify-content: flex-start; }
    .cta-final__btn { width: 100%; justify-content: center; }

    /* ── FOOTER ── */
    .footer {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
        padding: 24px 20px;
    }
    .footer__copy { white-space: normal; }
    .bonus__outer {
        padding: 40px 0;
    }
    .bonus {
        padding: 20px 0;
    }
}

/* ─── МАЛЕНЬКИЙ ЭКРАН 480px ───────────────────────────────── */
@media (max-width: 480px) {

    .hero__heading { font-size: 8vw; line-height: 29px; letter-spacing: -0.8px; }

    .who__title { font-size: 32px; line-height: 38px; }

    .bonus__title { font-size: 28px; line-height: 34px; }
    .bonus__pills { flex-wrap: wrap; }

    .cta-final__heading {
        font-size: 32px;
        line-height: 95%;
    }
    .cta-final__date { font-size: 32px; line-height: 32px; }

    .results__item-title { font-size: 16px; }
}
