.audience-page {
    background: linear-gradient(180deg, #effbf9 0, #fff 620px);
    color: #203957;
    font-family: "Poppins", "Public Sans", sans-serif;
}

.audience-page .container { max-width: 1320px; }

.audience-hero { padding: 42px 0 56px; }

.audience-hero__grid {
    align-items: center;
    background: linear-gradient(135deg, #fff 0%, #f3fcfa 58%, #fff8ed 100%);
    border: 1px solid #c9efeb;
    border-radius: 18px;
    box-shadow: 0 24px 60px rgba(26, 56, 72, .1);
    display: grid;
    gap: 54px;
    grid-template-columns: minmax(0, 1fr) minmax(400px, .78fr);
    overflow: hidden;
    padding: 52px;
    position: relative;
}

.audience-hero__grid::before {
    background: linear-gradient(90deg, #25a39a 0 62%, #fb920d 62%);
    content: "";
    height: 5px;
    inset: 0 0 auto;
    position: absolute;
}

.audience-eyebrow,
.audience-section-label,
.audience-heading > span,
.audience-cta > div > span {
    color: #15958d;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .5px;
    text-transform: uppercase;
}

.audience-eyebrow {
    align-items: center;
    display: inline-flex;
    gap: 8px;
    margin-bottom: 14px;
}

.audience-eyebrow i { color: #fb920d; font-size: 19px; }

.audience-hero h1 {
    color: #14263a;
    font-size: clamp(38px, 4.2vw, 58px);
    font-weight: 900;
    letter-spacing: -1.6px;
    line-height: 1.08;
    margin: 0 0 18px;
}

.audience-hero__content > p {
    color: #576b7e;
    font-size: 17px;
    line-height: 1.75;
    margin: 0;
}

.audience-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 27px;
}

.audience-button {
    align-items: center;
    border: 1px solid transparent;
    border-radius: 9px;
    display: inline-flex;
    font-size: 14px;
    font-weight: 800;
    gap: 8px;
    justify-content: center;
    min-height: 46px;
    padding: 12px 20px;
    transition: transform .2s ease, box-shadow .2s ease;
}

.audience-button:hover { transform: translateY(-2px); }
.audience-button--orange { background: #fb920d; box-shadow: 0 12px 24px rgba(251, 146, 13, .23); color: #fff; }
.audience-button--teal { background: #25a39a; box-shadow: 0 12px 24px rgba(37, 163, 154, .23); color: #fff; }
.audience-button--orange:hover,
.audience-button--teal:hover { color: #fff; }
.audience-button--outline { background: #fff; border-color: #c5e9e5; color: #203957; }

.sponsor-public-visual,
.guest-public-visual { padding: 24px 8px; position: relative; }

.sponsor-public-visual__image,
.guest-public-visual__primary {
    background: #fff;
    border: 1px solid #d8ece9;
    border-radius: 16px;
    box-shadow: 0 24px 50px rgba(30, 59, 77, .15);
    overflow: hidden;
}

.sponsor-public-visual__image img,
.guest-public-visual__primary img {
    display: block;
    height: 330px;
    object-fit: contain;
    width: 100%;
}

.sponsor-public-badge {
    align-items: center;
    background: #fff;
    border: 1px solid #d9efec;
    border-radius: 10px;
    box-shadow: 0 14px 30px rgba(32, 57, 87, .15);
    display: flex;
    font-size: 11px;
    font-weight: 800;
    gap: 8px;
    padding: 10px 13px;
    position: absolute;
}

.sponsor-public-badge i { color: #25a39a; font-size: 19px; }
.sponsor-public-badge--match { left: -16px; top: 4px; }
.sponsor-public-badge--impact { bottom: 2px; right: -12px; }

.sponsor-public-intro { padding: 8px 0 58px; }

.sponsor-public-intro__grid {
    align-items: start;
    display: grid;
    gap: 70px;
    grid-template-columns: minmax(280px, .75fr) minmax(0, 1.25fr);
}

.sponsor-public-intro h2,
.guest-public-experience h2 {
    color: #14263a;
    font-size: clamp(28px, 3vw, 39px);
    font-weight: 900;
    line-height: 1.25;
    margin: 8px 0 0;
}

.sponsor-public-intro__copy {
    border-left: 3px solid #25a39a;
    padding-left: 28px;
}

.sponsor-public-intro__copy p,
.guest-public-experience__content > p {
    color: #617386;
    font-size: 15px;
    line-height: 1.78;
}

.audience-features,
.guest-public-journey { background: #f6fafb; padding: 56px 0; }

.audience-heading { margin: 0 auto 28px; max-width: 820px; text-align: center; }
.audience-heading h2 { color: #14263a; font-size: clamp(28px, 3vw, 39px); font-weight: 900; margin: 8px 0; }
.audience-heading p { color: #637487; font-size: 16px; line-height: 1.65; margin: 0; }

.audience-feature-grid {
    display: grid;
    gap: 18px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.audience-feature-card {
    background: #fff;
    border: 1px solid #deecea;
    border-radius: 13px;
    box-shadow: 0 14px 34px rgba(24, 54, 72, .06);
    padding: 25px;
}

.audience-feature-card__icon {
    align-items: center;
    background: linear-gradient(135deg, #25a39a, #48c9bf);
    border-radius: 9px;
    color: #fff;
    display: flex;
    font-size: 22px;
    height: 43px;
    justify-content: center;
    margin-bottom: 17px;
    width: 43px;
}

.audience-feature-card:nth-child(even) .audience-feature-card__icon { background: linear-gradient(135deg, #fb920d, #f5b84e); }
.audience-feature-card h3 { color: #203957; font-size: 18px; font-weight: 900; margin-bottom: 8px; }
.audience-feature-card p { color: #657689; font-size: 14px; line-height: 1.7; margin-bottom: 14px; }
.audience-feature-card strong { color: #15958d; font-size: 12px; line-height: 1.5; }

.audience-cta-wrap { padding: 34px 0 58px; }

.audience-cta {
    align-items: center;
    background: linear-gradient(120deg, #203957, #28536a);
    border-radius: 16px;
    box-shadow: 0 22px 48px rgba(32, 57, 87, .2);
    display: flex;
    gap: 30px;
    justify-content: space-between;
    padding: 32px 38px;
}

.audience-cta > div > span { color: #62d9cf; }
.audience-cta h2 { color: #fff; font-size: 26px; font-weight: 900; margin: 5px 0; }
.audience-cta p { color: #d9e5ef; line-height: 1.65; margin: 0; max-width: 760px; }
.audience-cta .audience-actions { flex: 0 0 auto; margin: 0; }
.audience-button--light { background: #fff; color: #203957; }

.guest-public-visual__primary img { object-fit: cover; }

.guest-public-ticket {
    align-items: center;
    background: #fff;
    border: 1px solid #d9efec;
    border-radius: 11px;
    bottom: 0;
    box-shadow: 0 16px 34px rgba(32, 57, 87, .16);
    display: grid;
    gap: 10px;
    grid-template-columns: auto 1fr auto;
    left: -20px;
    padding: 11px 14px;
    position: absolute;
    width: min(280px, 82%);
}

.guest-public-ticket > span {
    align-items: center;
    background: #fb920d;
    border-radius: 8px;
    color: #fff;
    display: flex;
    font-size: 19px;
    height: 38px;
    justify-content: center;
    width: 38px;
}

.guest-public-ticket small,
.guest-public-ticket strong { display: block; }
.guest-public-ticket small { color: #78899a; font-size: 10px; }
.guest-public-ticket strong { color: #203957; font-size: 12px; }
.guest-public-ticket > i { color: #25a39a; font-size: 22px; }

.guest-public-steps {
    display: grid;
    gap: 18px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.guest-public-steps article {
    background: #fff;
    border: 1px solid #deecea;
    border-radius: 13px;
    min-height: 100%;
    padding: 24px;
    position: relative;
}

.guest-public-step__number { color: #dfebe9; font-size: 28px; font-weight: 900; position: absolute; right: 19px; top: 15px; }
.guest-public-step__icon { align-items: center; background: #e7f8f5; border-radius: 9px; color: #15958d; display: flex; font-size: 22px; height: 42px; justify-content: center; margin-bottom: 17px; width: 42px; }
.guest-public-steps article:nth-child(even) .guest-public-step__icon { background: #fff2df; color: #e17e00; }
.guest-public-steps h3 { color: #203957; font-size: 18px; font-weight: 900; margin-bottom: 8px; }
.guest-public-steps p { color: #657689; font-size: 14px; line-height: 1.7; margin: 0; }

.guest-public-experience { padding: 58px 0 24px; }

.guest-public-experience__grid {
    align-items: center;
    display: grid;
    gap: 60px;
    grid-template-columns: minmax(360px, .8fr) minmax(0, 1.2fr);
}

.guest-public-experience__image {
    background: #eef9f7;
    border-radius: 16px;
    box-shadow: 0 20px 44px rgba(24, 54, 72, .1);
    overflow: hidden;
}

.guest-public-experience__image img { display: block; height: 390px; object-fit: contain; width: 100%; }

.guest-public-experience__content ul {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    list-style: none;
    margin: 22px 0 0;
    padding: 0;
}

.guest-public-experience__content li { align-items: center; color: #40566c; display: flex; font-size: 13px; font-weight: 700; gap: 8px; }
.guest-public-experience__content li i { color: #25a39a; font-size: 19px; }

@media (max-width: 991px) {
    .audience-hero__grid,
    .sponsor-public-intro__grid,
    .guest-public-experience__grid { grid-template-columns: 1fr; }
    .audience-hero__grid { padding: 38px; }
    .sponsor-public-visual,
    .guest-public-visual { margin: auto; max-width: 600px; width: 100%; }
    .audience-feature-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .guest-public-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 767px) {
    .audience-hero { padding: 24px 0 38px; }
    .audience-hero__grid { gap: 28px; padding: 28px 20px; }
    .audience-hero h1 { font-size: 35px; letter-spacing: -.6px; }
    .audience-actions,
    .audience-button { width: 100%; }
    .sponsor-public-badge--match { left: -7px; }
    .sponsor-public-badge--impact { right: -5px; }
    .sponsor-public-intro__grid { gap: 24px; }
    .sponsor-public-intro__copy { padding-left: 18px; }
    .audience-feature-grid,
    .guest-public-steps,
    .guest-public-experience__content ul { grid-template-columns: 1fr; }
    .audience-cta { align-items: stretch; flex-direction: column; padding: 26px 22px; }
    .audience-cta .audience-actions { width: 100%; }
    .guest-public-ticket { left: -5px; }
    .guest-public-experience__image img { height: 300px; }
}

@media (max-width: 575px) {
    .audience-hero__grid,
    .audience-cta,
    .guest-public-experience__image {
        border-radius: 12px;
    }

    .sponsor-public-visual__image img,
    .guest-public-visual__primary img { height: 250px; }
    .sponsor-public-badge { font-size: 9px; padding: 8px 10px; }
    .guest-public-ticket { width: 92%; }
    .audience-heading h2,
    .sponsor-public-intro h2,
    .guest-public-experience h2 { font-size: 27px; }
}
