/* =========================================================
   AJUSTES EXCLUSIVOS PARA index2.html
   No afecta index.html
========================================================= */

/* El hero ya usa grid en index2 */
@media (min-width: 640px) {
    .proposal-hero {
        grid-template-areas:
            "copy form"
            "aside aside";
        row-gap: 0;
    }

    .proposal-hero__aside {
        position: relative;
        left: auto;
        right: auto;
        bottom: auto;

        grid-area: aside;
        z-index: 2;

        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 14px;

        width: 100%;
        max-width: 940px;
        margin: clamp(28px, 4vw, 48px) auto 0;

        text-align: center;
    }
}


/* Mobile: queda debajo del formulario y antes de terminar el hero */
@media (max-width: 639px) {
    .proposal-hero {
        display: flex;
        flex-direction: column;
        padding-left: 12px;
        padding-right: 12px;
    }

    .proposal-hero__copy {
        width: calc(100vw - 24px);
    }

    .proposal-hero__form {
        width: calc(100vw - 24px);
        max-width: none;
        margin-left: auto;
        margin-right: auto;
        padding: clamp(22px, 6vw, 30px);
    }

    .proposal-hero__aside {
        position: relative;
        left: auto;
        right: auto;
        bottom: auto;

        z-index: 2;

        display: grid;
        grid-template-columns: 1fr;
        gap: 12px;

        width: 100%;
        max-width: 940px;
        margin: 26px auto 0;

        text-align: center;
    }
}


/* Ajuste visual exclusivo index2.html */
@media (min-width: 640px) {
    .proposal-hero {
        grid-template-columns: minmax(360px, 500px) minmax(430px, 560px);
        column-gap: clamp(24px, 3vw, 44px);
    }

    .proposal-hero__copy h1 {
        font-size: clamp(2.1rem, 3.2vw, 3.45rem);
        line-height: 1.04;
        max-width: 520px;
    }

    .proposal-hero__text {
        max-width: 470px;
        font-size: clamp(0.98rem, 1.15vw, 1.1rem);
        line-height: 1.55;
    }

    .proposal-hero__form {
        width: 100%;
        max-width: 560px;
        padding: clamp(26px, 3vw, 42px);
    }

    .proposal-hero__form h2 {
        font-size: clamp(1.7rem, 2.2vw, 2.35rem);
    }

    .proposal-hero__form .form-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 18px 16px;
    }

    .proposal-hero__form .field--full {
        grid-column: 1 / -1;
    }

    .proposal-hero__form textarea {
        min-height: 118px;
    }
}

@media (min-width: 1100px) {
    .proposal-hero {
        grid-template-columns: minmax(390px, 520px) minmax(500px, 620px);
    }

    .proposal-hero__form {
        max-width: 620px;
    }
}
