/* Client story placement preview. Keep contributor wording in static HTML. */
.client-experiences {
    padding: 32px 0 50px;
    scroll-margin-top: 100px;
    color: #fff;
}
.client-experience-panel,
.client-story-panel {
    border: 1px solid rgba(201,169,97,.45);
    border-radius: 0;
    background: linear-gradient(135deg, rgba(21,43,48,.65), rgba(21,43,48,.94)),
        url('../assets/images/marble-desktop-2.webp') center / cover no-repeat;
}
.client-experience-panel {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr);
    gap: clamp(32px, 5vw, 72px);
    padding: clamp(28px, 4vw, 56px);
    align-items: start;
}
.client-experience-heading .section-title { color: #fff; font-size: clamp(1.75rem, 2.8vw, 2.75rem); margin: 0; }
.client-experience-content { min-width: 0; }
#client-experiences .client-experience-quote blockquote p { text-align: left; }
.client-experience-quote { margin: 0; min-width: 0; }
.client-experience-quote blockquote { font-family: 'Montserrat', Arial, sans-serif; font-size: clamp(1.5rem, 2.1vw, 2rem); font-style: normal; line-height: 1.55; color: #fff; }
.client-experience-quote figcaption,
.client-story-account figcaption { font-family: 'Montserrat', Arial, sans-serif; font-size: 1.0625rem; font-weight: 600; color: #fff; margin: 24px 0; }
.story-link { display: inline-flex; align-items: center; min-height: 48px; padding: 11px 20px; border: 1px solid rgba(201,169,97,.7); border-radius: 0; background: rgba(21,43,48,.55); color: #fff; font-family: 'Montserrat', Arial, sans-serif; font-size: 1rem; font-weight: 600; line-height: 1.5; text-align: center; }
.story-link:hover, .story-link:focus-visible, .story-link:active { background: var(--gold-gradient-strong); color: #152b30; }
.story-link:focus-visible, .story-back:focus-visible { outline: 2px solid #fff; outline-offset: 5px; }
.page-client-story { color: #fff; background: #152b30; }
.page-client-story .marble-bg-layer { display: block; position: fixed; inset: 0; width: 100%; height: 100vh; z-index: -1; pointer-events: none; background: linear-gradient(135deg,rgba(21,43,48,.10),rgba(21,43,48,.92)),url('../assets/images/marble-desktop-2.webp') center / cover no-repeat; }
.client-story-main { padding: 132px 0 64px; }
.client-story-panel { max-width: 920px; margin: 0 auto; padding: clamp(24px, 5vw, 64px); }
.client-story-panel { background: rgba(21,43,48,.86); }
.client-story-heading { margin-bottom: 32px; }
.story-back { display: table; min-height: 44px; color: rgba(255,255,255,.85); text-decoration: underline; text-underline-offset: 4px; font-size: 1rem; margin-bottom: 24px; }
.client-story-heading .section-label { display: block; margin-bottom: 12px; }
.client-story-heading h1 { color: #fff; font-size: clamp(2rem, 4vw, 3rem); line-height: 1.2; }
.client-story-account { margin: 0; }
.client-story-account blockquote { font-style: normal; color: rgba(255,255,255,.92); font-size: 1.125rem; line-height: 1.85; text-align: left; }
.client-story-account blockquote p + p { margin-top: 24px; }
.client-story-account figcaption { margin-bottom: 0; }
.client-story-return { margin-top: 36px; padding-top: 28px; border-top: 1px solid rgba(201,169,97,.3); }
@media (max-width: 767px) {
    .client-experience-panel { grid-template-columns: 1fr; gap: 28px; }
    .client-experiences { padding-top: 16px; padding-bottom: 32px; }
    .client-experience-heading .section-label { font-size: .875rem; letter-spacing: 2px; }
    .client-story-main { padding-top: 96px; padding-bottom: 40px; }
    .client-story-panel { padding: 28px 24px; }
    .client-story-main > .container { padding: 0 16px; }
    .client-story-account blockquote { font-size: 1.0625rem; line-height: 1.85; }
}
@media (max-width: 1024px) {
    .page-client-story { background: transparent; }
    .page-client-story .marble-bg-layer { background: linear-gradient(135deg,rgba(21,43,48,.10) 0%,rgba(21,43,48,.55) 25%,rgba(21,43,48,.92) 60%,rgba(21,43,48,.95) 100%),url('../assets/images/marble-texture-gold-veined.webp') 0 0 / 100vw 100vh no-repeat; }
    .client-experience-panel, .client-story-panel { background: rgba(21,43,48,.42); }
}
