.lead-magnet-grid {
    align-items: stretch;
}

.lead-magnet-card {
    appearance: none;
    width: 100%;
    min-height: 230px;
    border: 0;
    padding: 34px;
    cursor: pointer;
    text-align: center;
    font: inherit;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 24px;
    transition: transform .2s ease, box-shadow .2s ease;
}

.lead-magnet-card:hover,
.lead-magnet-card:focus-visible {
    transform: translateY(-5px);
}

.resource-title {
    display: block;
    max-width: 340px;
    font-size: clamp(1.25rem, 2vw, 1.7rem);
    font-weight: 700;
    line-height: 1.3;
}

.resource-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 11px 22px;
    border-radius: 999px;
    background: #ce2c4e;
    color: #fff;
    font-size: .9rem;
    font-weight: 700;
    line-height: 1;
    box-shadow: 0 10px 24px rgba(206, 44, 78, .2);
}

.lead-modal[hidden] { display: none; }
.lead-modal { position: fixed; inset: 0; z-index: 9999; display: grid; place-items: center; padding: 20px; }
.lead-modal-backdrop { position: absolute; inset: 0; background: rgba(22,22,25,.62); backdrop-filter: blur(5px); }
.lead-modal-dialog { position: relative; z-index: 1; width: min(100%,520px); max-height: calc(100vh - 40px); overflow: auto; padding: 34px; border-radius: 24px; background: #fff; box-shadow: 0 25px 80px rgba(0,0,0,.24); }
.lead-modal-close { position: absolute; top: 14px; right: 16px; border: 0; background: transparent; font-size: 2rem; line-height: 1; cursor: pointer; }
.modal-eyebrow { display: inline-block; margin-bottom: 10px; font-size: .78rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.lead-modal-dialog h2 { margin: 0 40px 10px 0; }
.lead-modal-dialog p { line-height: 1.6; }
.lead-modal-dialog form { display: grid; gap: 10px; margin-top: 22px; }
.lead-modal-dialog label { font-weight: 700; font-size: .92rem; }
.lead-modal-dialog input[type=text], .lead-modal-dialog input[type=email] { width: 100%; box-sizing: border-box; border: 1px solid #d8d2ce; border-radius: 12px; padding: 13px 14px; font: inherit; }
.lead-modal-dialog input:focus { outline: 3px solid rgba(206,44,78,.17); border-color: #ce2c4e; }
.consent-row { display: flex; gap: 10px; align-items: flex-start; margin: 7px 0; font-weight: 400!important; }
.consent-row input { margin-top: 4px; }
.consent-row span { font-size: .82rem; line-height: 1.45; }
.lead-submit { border: 0; border-radius: 999px; padding: 14px 20px; background: #ce2c4e; color: #fff; font: inherit; font-weight: 700; cursor: pointer; }
.lead-submit:disabled { opacity: .65; cursor: wait; }
.form-message { min-height: 1.4em; margin: 2px 0!important; font-size: .88rem; }
.form-message.error { color: #a3132f; }
.form-message.success { color: #166534; }
body.modal-open { overflow: hidden; }

@media (max-width: 700px) {
    .lead-magnet-card { min-height: 190px; padding: 26px 20px; }
    .lead-modal-dialog { padding: 28px 20px; border-radius: 20px; }
}

/* ==================================================
   LEARNING POD PDF COVERS
================================================== */

.lead-magnet-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 32px;
    align-items: start;
}

.pdf-cover-card {
    position: relative;
    display: block;
    width: 100%;
    aspect-ratio: 3 / 4;
    min-height: 0;
    padding: 0;
    overflow: hidden;
    border: 0;
    border-radius: 24px;
    background: #f4e8e1;
    color: #2f292b;
    font-family: inherit;
    text-align: left;
    cursor: pointer;
    isolation: isolate;
    box-shadow:
        0 20px 50px rgba(72, 49, 56, 0.15),
        inset 0 0 0 1px rgba(255, 255, 255, 0.65);
    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease;
}

.pdf-cover-card:hover {
    transform: translateY(-8px);
    box-shadow:
        0 30px 65px rgba(72, 49, 56, 0.22),
        inset 0 0 0 1px rgba(255, 255, 255, 0.75);
}

.pdf-cover-card:focus-visible {
    outline: 4px solid rgba(212, 79, 108, 0.35);
    outline-offset: 5px;
}

.cover-brand {
    position: absolute;
    top: 7%;
    left: 8%;
    z-index: 4;
    color: #a04f61;
    font-size: clamp(0.55rem, 0.8vw, 0.72rem);
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

.cover-decoration {
    position: absolute;
    display: block;
    pointer-events: none;
}

.cover-circle {
    top: -4%;
    right: -7%;
    width: 38%;
    aspect-ratio: 1;
    border-radius: 50%;
    background: rgba(225, 156, 170, 0.35);
}

.cover-shape {
    bottom: -10%;
    left: -12%;
    width: 55%;
    aspect-ratio: 1;
    border-radius: 50%;
    background: rgba(195, 194, 162, 0.35);
}

.cover-main {
    position: absolute;
    top: 31%;
    left: 8%;
    right: 8%;
    z-index: 4;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.cover-small-title {
    color: #332c2e;
    font-size: clamp(1rem, 1.5vw, 1.4rem);
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;
}

.cover-large-title {
    margin-top: 2px;
    color: #d54161;
    font-size: clamp(1.8rem, 3vw, 3.1rem);
    font-weight: 700;
    line-height: 0.95;
    letter-spacing: -0.04em;
    text-transform: uppercase;
    overflow-wrap: anywhere;
}

.cover-line {
    width: 70px;
    height: 3px;
    margin-top: 18px;
    background: #332c2e;
}

.cover-description {
    max-width: 82%;
    margin-top: 16px;
    color: #71666a;
    font-size: clamp(0.72rem, 1vw, 0.95rem);
    font-weight: 500;
    line-height: 1.5;
}

.cover-footer {
    position: absolute;
    right: 8%;
    bottom: 6%;
    left: 8%;
    z-index: 4;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    color: #665b5f;
    font-size: clamp(0.52rem, 0.75vw, 0.68rem);
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.cover-action {
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    padding: 10px 14px;
    border-radius: 999px;
    background: #d54161;
    color: #fff;
    font-size: 0.67rem;
    letter-spacing: 0.03em;
    box-shadow: 0 10px 22px rgba(213, 65, 97, 0.25);
}


/* INDIVIDUAL COVER VARIATIONS */

.cover-speech {
    background:
        linear-gradient(
            145deg,
            #f9efea 0%,
            #f1dfd7 100%
        );
}

.cover-speech .cover-circle {
    background: rgba(218, 127, 148, 0.3);
}

.cover-speech .cover-shape {
    background: rgba(202, 195, 166, 0.35);
}


.cover-pronunciation {
    background:
        linear-gradient(
            145deg,
            #f8e9ed 0%,
            #f2dce3 100%
        );
}

.cover-pronunciation .cover-circle {
    background: rgba(232, 169, 180, 0.4);
}

.cover-pronunciation .cover-shape {
    background: rgba(185, 194, 166, 0.32);
}


.cover-writing {
    background:
        linear-gradient(
            145deg,
            #f3ebe5 0%,
            #eaded6 100%
        );
}

.cover-writing .cover-circle {
    background: rgba(222, 153, 166, 0.35);
}

.cover-writing .cover-shape {
    background: rgba(191, 193, 163, 0.38);
}


/* MOBILE */

@media (max-width: 900px) {
    .lead-magnet-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 600px) {
    .lead-magnet-grid {
        grid-template-columns: 1fr;
        gap: 26px;
    }

    .pdf-cover-card {
        width: min(100%, 360px);
        margin-inline: auto;
        border-radius: 22px;
    }

    .cover-brand {
        font-size: 0.6rem;
    }

    .cover-small-title {
        font-size: 1.15rem;
    }

    .cover-large-title {
        font-size: 2.3rem;
    }

    .cover-description {
        font-size: 0.82rem;
    }

    .cover-footer {
        font-size: 0.57rem;
    }

    .cover-action {
        padding: 9px 12px;
        font-size: 0.62rem;
    }
}