/* ===========================================================
   case-study-single.css
   =========================================================== */

.case-hero { padding-top: 160px; padding-bottom: 48px; }
.case-hero__title { font-size: clamp(2.5rem, 6vw + 1rem, 6rem); margin: var(--vc-s-2) 0 var(--vc-s-8); max-width: 22ch; }
.case-hero__meta { display: grid; grid-template-columns: 1fr; gap: var(--vc-s-4); margin: 0; padding: var(--vc-s-5) 0; border-top: 1px solid var(--vc-line); border-bottom: 1px solid var(--vc-line); }
@media (min-width: 768px) { .case-hero__meta { grid-template-columns: repeat(3, 1fr); } }
.case-hero__meta dt { display: block; color: var(--vc-muted); font-size: var(--vc-text-xs); letter-spacing: .12em; text-transform: uppercase; margin-bottom: var(--vc-s-1); }
.case-hero__meta dd { margin: 0; color: var(--vc-fg); font-family: var(--vc-font-display); font-size: var(--vc-text-md); }

.case-cover { margin: 0; }
.case-cover img { width: 100%; height: auto; aspect-ratio: 16/9; object-fit: cover; }

.case-block { background: var(--vc-bg); }
.case-block--challenge { background: var(--vc-bg-alt); }
.case-block__inner { max-width: 760px; }

.case-results { background: var(--vc-bg); }
.metrics { display: grid; gap: var(--vc-s-6); grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); margin-top: var(--vc-s-8); }
.metric { padding: var(--vc-s-6) 0; border-top: 1px solid var(--vc-line); }
.metric__value { display: block; font-family: var(--vc-font-display); font-size: clamp(3rem, 6vw, 5.5rem); letter-spacing: -.03em; line-height: 1; color: var(--vc-fg); }
.metric__suffix { color: var(--vc-accent); }
.metric__label { display: block; margin-top: var(--vc-s-3); font-size: var(--vc-text-sm); color: var(--vc-muted); letter-spacing: .04em; text-transform: uppercase; }

.case-gallery { padding: clamp(60px, 6vw, 100px) 0; }
.case-gallery__swiper { padding-bottom: 56px; }
.case-gallery__swiper img { width: 100%; aspect-ratio: 16/10; object-fit: cover; border-radius: var(--vc-radius-lg); }
.case-gallery .swiper-button-prev, .case-gallery .swiper-button-next { color: var(--vc-fg); }

.case-quote { background: var(--vc-bg-alt); }
.quote { margin: 0; }
.quote p { font-size: clamp(1.5rem, 3vw + .5rem, 2.5rem); font-family: var(--vc-font-display); line-height: 1.3; color: var(--vc-fg); margin: 0 0 var(--vc-s-6); }
.quote cite { font-style: normal; display: flex; flex-direction: column; }
.quote cite strong { font-family: var(--vc-font-display); color: var(--vc-fg); }
.quote cite span { color: var(--vc-muted); font-size: var(--vc-text-sm); }

.case-next { background: var(--vc-bg); padding: clamp(80px, 10vw, 160px) 0; }
.case-next__link { display: block; text-align: center; }
.case-next__title { display: block; font-family: var(--vc-font-display); font-size: clamp(2rem, 4vw + 1rem, 4rem); margin-top: var(--vc-s-3); transition: color var(--vc-dur) var(--vc-ease); }
.case-next__link:hover .case-next__title { color: var(--vc-accent); }