/* ============================================================
   Proof Showcase — merged case studies + testimonials (v2c only)
   NewLayoutC. Loaded in head.html for that variant.
   Replaces customer_stories.html + social_proof.html: an editorial
   featured story (with a paired quote), a 3-up of other cases, then
   a lighter "in their words" quote strip of studios NOT shown above.
   Direction V2 from design-dev/proof-merged.html.
   ============================================================ */
.v2-showcase{
  --sc-cyan:#74FFE2;
  --sc-ink:#f4f7ff; --sc-muted:rgba(210,223,250,.85); --sc-faint:#7e91ad;
  --sc-card:rgba(12,21,36,.75);
  --sc-line:rgba(108,148,220,.2); --sc-line-soft:rgba(108,148,220,.12);
  --sc-ease:cubic-bezier(.22,.61,.36,1);
  padding:84px 0;
}

/* ── header ── */
.v2-showcase .sc-head{text-align:center;max-width:760px;margin:0 auto 44px}
.v2-showcase .sc-head h2{
  display:block;                                  /* beat theme h2{display:inline-block} */
  font-size:clamp(1.75rem,3vw,2.4rem);font-weight:700;color:var(--sc-ink);
  margin:0 0 14px;letter-spacing:-.01em;
}
.v2-showcase .sc-sub{color:var(--sc-muted);font-size:1.05rem;line-height:1.6;margin:0}

/* ── shared badge ── */
.v2-showcase .sc-badge{
  position:absolute;top:18px;left:18px;background:rgba(8,16,30,.7);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  border:1px solid var(--sc-line);border-radius:999px;padding:6px 13px;font-size:.78rem;font-weight:650;color:#eaf2ff;
}
.v2-showcase .sc-badge b{color:var(--sc-cyan)}

/* ── editorial hero ── */
.v2-showcase .sc-hero{
  display:grid;grid-template-columns:1.25fr 1fr;gap:0;border-radius:18px;overflow:hidden;
  border:1px solid var(--sc-line);background:var(--sc-card);text-decoration:none;color:inherit;
  transition:transform .3s var(--sc-ease),box-shadow .3s var(--sc-ease),border-color .3s var(--sc-ease);
}
.v2-showcase .sc-hero:hover{transform:translateY(-3px);box-shadow:0 30px 60px rgba(6,16,32,.55);border-color:rgba(140,205,255,.4)}
.v2-showcase .sc-hero__media{position:relative;min-height:300px;overflow:hidden}
.v2-showcase .sc-hero__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.v2-showcase .sc-hero:hover .sc-hero__media img{transform:scale(1.03)}
.v2-showcase .sc-hero__side{padding:32px 32px 30px;display:flex;flex-direction:column;justify-content:center}
.v2-showcase .sc-hero__eyebrow{font-size:.74rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--sc-cyan);margin:0 0 12px}
.v2-showcase .sc-hero__title{font-size:1.45rem;line-height:1.25;font-weight:700;color:#fff;margin:0 0 18px}
.v2-showcase .sc-hero__quote{font-size:1rem;line-height:1.6;color:#dfe9fb;margin:0 0 18px;padding-left:16px;border-left:2px solid rgba(116,255,226,.5)}
.v2-showcase .sc-hero__quote b{color:#fff;font-weight:600}
.v2-showcase .sc-hero__by{display:flex;align-items:center;gap:10px;margin-bottom:20px}
.v2-showcase .sc-hero__by img{width:34px;height:34px;border-radius:50%;object-fit:cover;border:1px solid var(--sc-line)}
.v2-showcase .sc-hero__by .n{font-size:.84rem;font-weight:650;color:var(--sc-ink);line-height:1.2}
.v2-showcase .sc-hero__by .r{font-size:.74rem;color:var(--sc-faint);line-height:1.3;margin-top:2px}
.v2-showcase .sc-hero__cta{display:inline-flex;align-items:center;gap:6px;font-size:.9rem;color:var(--sc-cyan);font-weight:600;text-decoration:none}
.v2-showcase .sc-hero__cta .t{background-image:linear-gradient(90deg,var(--sc-cyan),var(--sc-cyan));background-size:0 1.5px;background-position:0 100%;background-repeat:no-repeat;padding-bottom:2px;transition:background-size .32s cubic-bezier(.22,.8,.2,1)}
.v2-showcase .sc-hero__cta svg{width:15px;height:15px;transition:transform .25s}
.v2-showcase .sc-hero:hover .sc-hero__cta .t{background-size:100% 1.5px}
.v2-showcase .sc-hero:hover .sc-hero__cta svg{transform:translateX(4px)}

/* ── 3-up other cases ── */
.v2-showcase .sc-row{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:20px}
.v2-showcase .sc-case{
  background:var(--sc-card);border:1px solid var(--sc-line);border-radius:14px;overflow:hidden;
  text-decoration:none;color:inherit;display:flex;flex-direction:column;
  transition:transform .3s var(--sc-ease),box-shadow .3s var(--sc-ease),border-color .3s var(--sc-ease);
}
.v2-showcase .sc-case:hover{transform:translateY(-4px);box-shadow:0 24px 50px rgba(6,16,32,.55);border-color:rgba(140,205,255,.45)}
.v2-showcase .sc-case__cover{position:relative;width:100%;padding-top:56.25%;overflow:hidden;background:rgba(6,16,32,.6)}
.v2-showcase .sc-case__cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
.v2-showcase .sc-case:hover .sc-case__cover img{transform:scale(1.04)}
.v2-showcase .sc-case__body{padding:16px 18px 18px;display:flex;flex-direction:column;flex:1;gap:12px}
.v2-showcase .sc-case__title{font-size:.95rem;line-height:1.4;color:var(--sc-ink);margin:0;font-weight:600;flex:1}
.v2-showcase .sc-case__cta{display:inline-flex;align-items:center;gap:6px;font-size:.82rem;color:var(--sc-cyan);font-weight:600;margin-top:auto}
.v2-showcase .sc-case__cta .t{background-image:linear-gradient(90deg,var(--sc-cyan),var(--sc-cyan));background-size:0 1.5px;background-position:0 100%;background-repeat:no-repeat;padding-bottom:2px;transition:background-size .32s cubic-bezier(.22,.8,.2,1)}
.v2-showcase .sc-case__cta svg{width:14px;height:14px;transition:transform .25s}
.v2-showcase .sc-case:hover .sc-case__cta .t{background-size:100% 1.5px}
.v2-showcase .sc-case:hover .sc-case__cta svg{transform:translateX(4px)}

/* ── shift divider ── */
.v2-showcase .sc-shift{display:flex;align-items:center;gap:18px;margin:48px 0 26px}
.v2-showcase .sc-shift::before,.v2-showcase .sc-shift::after{content:"";height:1px;flex:1;background:linear-gradient(90deg,transparent,var(--sc-line-soft),transparent)}
.v2-showcase .sc-shift span{font-size:.76rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--sc-faint)}

/* ── quote strip ── */
.v2-showcase .sc-quotes{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.v2-showcase .sc-quote{
  position:relative;padding:24px 20px 20px;border-radius:14px;
  background:linear-gradient(180deg,rgba(16,30,52,.4),rgba(12,21,36,.25));
  border:1px solid var(--sc-line-soft);display:flex;flex-direction:column;
  transition:transform .26s var(--sc-ease),border-color .26s var(--sc-ease),box-shadow .26s var(--sc-ease);
}
.v2-showcase .sc-quote:hover{transform:translateY(-3px);border-color:rgba(116,255,226,.28);box-shadow:0 16px 36px rgba(6,16,32,.4)}
.v2-showcase .sc-quote__mark{font:700 40px/0.6 Georgia,serif;color:var(--sc-cyan);opacity:.45;height:20px;transition:opacity .26s var(--sc-ease)}
.v2-showcase .sc-quote:hover .sc-quote__mark{opacity:.75}
.v2-showcase .sc-quote__text{font-size:.92rem;line-height:1.55;color:#dfe9fb;margin:0 0 16px;flex:1}
.v2-showcase .sc-quote__text b{color:#fff;font-weight:600}
.v2-showcase .sc-quote__author{display:flex;align-items:center;gap:10px;margin-top:auto}
.v2-showcase .sc-quote__avatar{width:36px;height:36px;border-radius:50%;object-fit:cover;border:1px solid var(--sc-line)}
.v2-showcase .sc-quote__name{font-size:.85rem;font-weight:650;color:var(--sc-ink);line-height:1.2}
.v2-showcase .sc-quote__role{font-size:.74rem;color:var(--sc-faint);line-height:1.3;margin-top:2px}

/* ── footer CTA (reuses global .v2-link-cta) ── */
.v2-showcase .sc-foot{text-align:center;margin-top:38px}

/* ── motion ── */
.v2-showcase .sc-reveal{opacity:0;transform:translateY(20px);transition:opacity .55s var(--sc-ease),transform .55s var(--sc-ease)}
.v2-showcase .sc-reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion: reduce){
  .v2-showcase .sc-reveal{opacity:1!important;transform:none!important;transition:none!important}
}

/* ── responsive ── */
@media(max-width:880px){
  .v2-showcase .sc-hero{grid-template-columns:1fr}
  .v2-showcase .sc-hero__media{min-height:220px}
  .v2-showcase .sc-row{grid-template-columns:1fr}
  .v2-showcase .sc-quotes{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:560px){
  .v2-showcase{padding:60px 0}
  .v2-showcase .sc-quotes{grid-template-columns:1fr}
}