/* REBRANDED PODCAST — lavender section, person photo as full-bleed bg, text on right
   Reusable: set --podcast-bg on the section element to change the photo */

.podcast {
    --podcast-bg: url('../assets/images/OYC_Rebrand_Photography397b Large.jpeg');
    position: relative;
    padding: var(--section-py-lg) 0;
    background-color: var(--clr-lavender);
    background-image: var(--podcast-bg);
    background-repeat: no-repeat;
    background-size: auto 128%;
    background-position: -110px calc(7% + 24px);
    color: #fff;
    overflow: hidden;
    min-height: 720px;
    display: flex;
    align-items: center;
}

.podcast-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
    width: 100%;
}

.podcast-image-col {
    /* spacer column — Kathy lives in the section background */
}

.podcast-content {
    max-width: 560px;
    color: #fff;
}

.podcast-headline {
    margin: 0 0 5px;
    line-height: 1;
}

.podcast-script-img {
    display: block;
    width: clamp(280px, 36vw, 492px);
    height: auto;
    margin: 0 0 8px -122px;
    transform: rotate(-2deg);
    transform-origin: left center;
}

.podcast-subline {
    display: block;
    font-family: var(--font-display);
    font-weight: 300;
    font-size: clamp(1.7rem, 2.6vw, 2.4rem);
    line-height: 1.18;
    color: #fff;
    margin-top: 6px;
    letter-spacing: -0.005em;
}

/* "Clarity First." — bold + coral hand-drawn underline */
.podcast-subline .fx-clarity {
    position: relative;
    display: inline-block;
    font-weight: 500;
    color: #fff;
}
.podcast-subline .fx-clarity::before {
    content: "";
    position: absolute;
    left: -2%;
    right: -2%;
    bottom: -0.18em;
    height: 0.32em;
    background-image: url('../assets/images/clarity-first.png');
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-position: center;
    pointer-events: none;
    z-index: 0;
}

.podcast-content p {
    font-size: 1rem;
    line-height: 1.6;
    color: #fff;
    margin-bottom: 14px;
    max-width: 520px;
    letter-spacing: 1.2px;
    font-weight: 200;
}

.podcast-content p:last-of-type {
    margin-bottom: 26px;
}

/* Listen Now uses the global .btn-blue-soft variant.
   Section-scoped tweaks only — keep the periwinkle treatment defined globally. */
.podcast .btn-blue-soft { font-size: 0.92rem; }

@media (max-width: 1024px) {
    .podcast {
        background-position: 38% top;
        background-size: 200% auto;
        padding: 80vw 24px 56px;
        min-height: 0;
    }
    .podcast-grid { grid-template-columns: 1fr; gap: 22px; padding: 0; }
    .podcast-image-col { display: none; }
    .podcast-content { max-width: 100%; }
    .podcast-heading { font-size: clamp(1.9rem, 7vw, 2.6rem); }
    /* Hide the "Rebranded" script overlay on mobile — its desktop position
       leaks off the left edge once the section narrows */
    .podcast-script-img { display: none; }
}

@media (max-width: 480px) {
    .podcast {
        padding: 95vw 20px 44px;
        background-size: 240% auto;
        background-position: 36% top;
    }
    .podcast-heading { font-size: clamp(1.7rem, 8vw, 2.2rem); }
    .podcast-body { font-size: 0.95rem; }
}
