/* Stylized replacement for legacy 2025-Lifeline-Filler.jpg */

.sll-filler {
    background: #fffcde;
    border: 1px solid #f1e9b3;
    border-radius: 8px;
    padding: 2.5rem clamp(1rem, 4vw, 3rem);
    margin: 1.5rem auto;
    max-width: 880px;
    color: #1a1a1a;
    font-family: "Georgia", "Times New Roman", serif;
    box-shadow: 0 6px 24px rgba(0, 0, 0, 0.07);
}

.sll-filler__inner {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.sll-filler__header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: center;
}

.sll-filler__eyebrow {
    margin: 0 0 0.5rem;
    font-size: clamp(1.1rem, 2vw, 1.4rem);
    line-height: 1.3;
}

.sll-filler__title {
    margin: 0;
    font-family: "Georgia", "Times New Roman", serif;
    font-weight: 700;
    font-size: clamp(1.4rem, 2.6vw, 1.95rem);
    line-height: 1.25;
    color: #111;
}

.sll-filler__tagline {
    margin: 0.75rem 0 0;
    font-size: clamp(1rem, 1.8vw, 1.2rem);
    color: #2c2c2c;
}

.sll-filler__badge img {
    width: clamp(140px, 22vw, 220px);
    height: auto;
    display: block;
}

.sll-filler__body p {
    margin: 0 0 0.85rem;
    font-size: clamp(1rem, 1.6vw, 1.1rem);
    line-height: 1.55;
}

.sll-filler__cta-line a {
    color: #1a73e8;
    text-decoration: underline;
    word-break: break-word;
}

.sll-filler__images {
    display: grid;
    grid-template-columns: 1.16fr 1fr;
    gap: 0.9rem;
    align-items: stretch;
}

.sll-filler__image {
    position: relative;
    border-radius: 4px;
    overflow: hidden;
    line-height: 0;
}

.sll-filler__image img {
    display: block;
    width: 100%;
    height: auto;
}

/* Position new QR exactly over the old baked-in QR (top 4.7%, right 2.8%, width 40%) */
.sll-filler__qr {
    position: absolute;
    top: 4.7%;
    right: 2.8%;
    width: 40%;
    aspect-ratio: 1 / 1;
    background: #fff;
    padding: 6px;
    border-radius: 2px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.18);
    display: block;
    box-sizing: border-box;
}

.sll-filler__qr img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.sll-filler__cta {
    text-align: center;
    margin-top: 0.5rem;
}

.sll-filler__button {
    display: inline-block;
    background: #c0392b;
    color: #fff !important;
    text-decoration: none;
    font-family: "Helvetica Neue", Arial, sans-serif;
    font-weight: 700;
    font-size: clamp(1rem, 1.6vw, 1.15rem);
    letter-spacing: 0.02em;
    padding: 0.85rem 1.6rem;
    border-radius: 6px;
    box-shadow: 0 3px 10px rgba(192, 57, 43, 0.35);
    transition: background 0.15s ease, transform 0.15s ease;
}

.sll-filler__button:hover,
.sll-filler__button:focus {
    background: #a93222;
    transform: translateY(-1px);
}

@media (max-width: 640px) {
    .sll-filler {
        padding: 1.5rem 1.1rem;
    }

    .sll-filler__header {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .sll-filler__badge {
        margin: 0 auto;
    }

    .sll-filler__badge img {
        width: 170px;
    }

    .sll-filler__images {
        grid-template-columns: 1fr;
    }
}
