/* Case studies: shared layout for the success story pages (loaded for SS_CASE_STUDIES slugs).
   Each story also has its own page-<slug>.css for anything unique. Prefix cs-. */

.cs-tag{display:inline-block;margin:0 0 14px;color:var(--ss-ac-l);font-size:15px;font-weight:600;letter-spacing:.02em}
.cs-sub{max-width:720px;font-size:clamp(17px,1.5vw,20px);color:rgba(255,255,255,.86)}

.cs-meta{margin-top:-48px;position:relative;z-index:2;box-shadow:var(--ss-sh)}
.cs-meta strong{font-size:clamp(17px,1.5vw,20px)}
.cs-meta span{display:block;margin-bottom:4px;font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ss-tx)}

.cs-stats{display:grid;grid-template-columns:repeat(var(--n,3),1fr);gap:16px;margin:0;padding:0;list-style:none}
.cs-stats li{padding:26px 24px;border-radius:var(--ss-r);background:var(--ss-soft);text-align:center}
.cs-stats strong{display:block;color:var(--ss-ac);font-family:var(--ss-h);font-size:clamp(34px,4vw,48px);font-weight:800;line-height:1.05}
.cs-stats span{display:block;margin-top:8px;color:var(--ss-ink);font-weight:600}
.cs-stats--4{--n:4}

.cs-callout{margin:24px 0 0;padding:22px 26px;border-left:4px solid #d33;border-radius:0 12px 12px 0;background:#fff4f4;color:var(--ss-ink)}
.cs-callout strong{display:block;margin-bottom:6px;font-family:var(--ss-h);font-size:19px}
.cs-callout p{margin:0}

.cs-cols{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,48px);align-items:start}
.cs-cols h3{font-size:21px}

.cs-timeline{margin:0;padding:0;list-style:none;border-left:2px solid var(--ss-ac-l)}
.cs-timeline li{position:relative;margin:0 0 18px;padding-left:24px}
.cs-timeline li::before{content:"";position:absolute;left:-7px;top:6px;width:12px;height:12px;border-radius:50%;background:var(--ss-ac)}
.cs-timeline time{display:block;color:var(--ss-ac);font-family:var(--ss-h);font-weight:700}
.cs-sec-dark .cs-timeline time{color:var(--ss-ac-l)}
.cs-outcome{margin:18px 0 0;padding:18px 22px;border-radius:12px;background:rgba(255,255,255,.06);color:#fff}

.cs-quote{margin:0;padding:clamp(28px,4vw,44px);border-radius:var(--ss-r);background:linear-gradient(120deg,#2A0A73 0%,var(--ss-ac) 100%);color:#fff}
.cs-quote p{font-family:var(--ss-h);font-size:clamp(19px,1.9vw,24px);font-weight:600;line-height:1.45}
.cs-quote footer{margin-top:16px;color:rgba(255,255,255,.85);font-size:16px}
.cs-quote cite{font-style:normal;font-weight:700;color:#fff}

.cs-nav{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
.cs-nav a{flex:1 1 280px;padding:18px 22px;border:1px solid var(--ss-line);border-radius:12px;color:var(--ss-ink);font-weight:600}
.cs-nav a:hover{border-color:var(--ss-ac-l);color:var(--ss-ac)}
.cs-nav small{display:block;color:var(--ss-tx);font-weight:500}
.cs-nav a:last-child{text-align:right}

/* Success stories index cards */
.cs-card{display:flex;flex-direction:column;gap:12px}
.cs-card .cs-tag{margin:0;color:var(--ss-ac)}
.cs-card ul{margin:0;padding:0;list-style:none;display:grid;gap:6px;font-size:15.5px}
.cs-card ul li::before{content:"";display:inline-block;width:8px;height:8px;margin-right:8px;border-radius:50%;background:var(--ss-ac-l)}

@media (max-width:860px){
  .cs-cols{grid-template-columns:1fr}
  .cs-stats,.cs-stats--4{--n:2}
}
@media (max-width:640px){
  .cs-meta{margin-top:-32px}
  .cs-stats,.cs-stats--4{--n:1}
  .cs-nav a:last-child{text-align:left}
}
