/* Shared layout for the Solutions index and the four audience pages.
   Namespaced under .audpage so nothing leaks into the legacy theme. */

.audpage .audwrap { padding-top: 44px; padding-bottom: 30px; }

.audpage .aud {
    padding: 44px 0;
    border-bottom: 1px solid #ededed;
    scroll-margin-top: 95px;
}

.audpage .aud:last-child { border-bottom: 0; }

.audpage .productDesc { max-width: none; }
.audpage .productDesc h2 { margin-top: 0; }
.audpage .aud-lead { max-width: 900px; }

/* the pressure the audience is actually under */
.audpage .aud-pain {
    max-width: 900px;
    margin: 24px 0 0;
    padding-left: 18px;
    border-left: 3px solid #f26522;
    font-size: 17px;
    line-height: 1.7;
    color: #444;
}

/* ---- audience chooser on the index ---- */
.audpage .aud-pick {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
    margin-top: 30px;
}

.audpage .aud-card {
    /* 四张卡 —— 380 会挤成 3+1，用 420 强制 2×2 */
    flex: 1 1 420px;
    min-width: 0;
    display: block;
    padding: 26px 26px 22px;
    background: #fff;
    border: 1px solid #e6e6e6;
    border-top: 3px solid #f26522;
    border-radius: 5px;
    text-decoration: none;
    transition: box-shadow .2s ease, transform .2s ease;
}

.audpage .aud-card:hover,
.audpage .aud-card:focus {
    text-decoration: none;
    box-shadow: 0 6px 20px rgba(0, 0, 0, .08);
    transform: translateY(-2px);
}

.audpage .aud-card b {
    display: block;
    margin-bottom: 9px;
    font-size: 21px;
    line-height: 1.35;
    color: #333;
}

.audpage .aud-card p {
    margin-bottom: 14px;
    font-size: 15px;
    line-height: 1.65;
    color: #666;
}

.audpage .aud-card .aud-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 14px;
}

.audpage .aud-card .aud-tags span {
    padding: 3px 10px;
    border: 1px solid #e6e6e6;
    border-radius: 20px;
    background: #fafafa;
    font-size: 12px;
    color: #777;
}

.audpage .aud-card em {
    font-style: normal;
    font-size: 14px;
    font-weight: 600;
    color: #f26522;
}

/* ---- curated solution tiles on an audience page ---- */
.audpage .aud-sols {
    display: flex;
    flex-wrap: wrap;
    gap: 22px;
    margin-top: 28px;
}

.audpage .aud-sol {
    flex: 1 1 420px;
    min-width: 0;
    display: block;
    padding: 22px 24px 20px;
    border: 1px solid #ececec;
    border-radius: 5px;
    text-decoration: none;
    transition: border-color .2s ease, box-shadow .2s ease;
}

.audpage .aud-sol:hover,
.audpage .aud-sol:focus {
    text-decoration: none;
    border-color: #f26522;
    box-shadow: 0 4px 14px rgba(0, 0, 0, .06);
}

.audpage .aud-sol b {
    display: block;
    margin-bottom: 4px;
    font-size: 19px;
    color: #333;
}

.audpage .aud-sol em {
    display: block;
    margin-bottom: 9px;
    font-style: normal;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: #f26522;
}

.audpage .aud-sol span {
    display: block;
    font-size: 15px;
    line-height: 1.6;
    color: #666;
}

/* ---- supporting resources / products ---- */
.audpage .aud-links {
    display: flex;
    flex-wrap: wrap;
    gap: 26px;
    margin-top: 26px;
}

.audpage .aud-links > div { flex: 1 1 320px; min-width: 0; }

.audpage .aud-links h5 {
    margin: 0 0 12px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .07em;
    text-transform: uppercase;
    color: #9aa1a5;
}

.audpage .aud-links ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.audpage .aud-links li {
    padding: 5px 0;
    font-size: 15px;
    line-height: 1.55;
}

.audpage .aud-links a { color: #f26522; }
.audpage .aud-links li span { color: #949da2; font-size: 13px; }

/* ---- proof strip ---- */
.audpage .aud-proof {
    display: flex;
    flex-wrap: wrap;
    gap: 26px;
    margin-top: 30px;
    padding: 24px 26px;
    background: #fafafa;
    border: 1px solid #ececec;
    border-radius: 6px;
}

.audpage .aud-proof > div { flex: 1 1 200px; min-width: 0; }

.audpage .aud-proof b {
    display: block;
    font-size: 27px;
    line-height: 1.2;
    color: #f26522;
}

.audpage .aud-proof span {
    display: block;
    margin-top: 5px;
    font-size: 14px;
    line-height: 1.55;
    color: #666;
}

/* ---- full index list ---- */
.audpage .aud-all {
    display: flex;
    flex-wrap: wrap;
    gap: 16px 26px;
    margin-top: 24px;
}

.audpage .aud-all > a {
    flex: 1 1 250px;
    min-width: 0;
    padding: 12px 0 12px 16px;
    border-left: 2px solid #ececec;
    text-decoration: none;
}

.audpage .aud-all > a:hover { border-left-color: #f26522; text-decoration: none; }
.audpage .aud-all b { display: block; font-size: 16px; color: #333; }
.audpage .aud-all span { display: block; font-size: 14px; line-height: 1.5; color: #777; }

/* ---- closing ask ---- */
.audpage .aud-ask {
    text-align: center;
    padding: 34px 20px 50px;
    max-width: 720px;
    margin: 0 auto;
}

.audpage .aud-ask h3 { margin-top: 0; }
.audpage .aud-ask p { color: #666; margin-bottom: 22px; }

@media (max-width: 767px) {
    .audpage .aud-pick,
    .audpage .aud-sols,
    .audpage .aud-links,
    .audpage .aud-proof,
    .audpage .aud-all { flex-direction: column; gap: 20px; }

    /* column 方向上 flex-basis 作用于高度，会把卡片撑到 400px+ 高 —— 必须重置 */
    .audpage .aud-pick > *,
    .audpage .aud-sols > *,
    .audpage .aud-links > *,
    .audpage .aud-proof > *,
    .audpage .aud-all > * { flex: 0 1 auto !important; }
}