/* A clear portfolio index: photographs and case information are never stacked on top of each other. */
.listing{
  width:min(100%,1440px);
  max-width:1440px;
  margin-inline:auto;
  padding:clamp(68px,8vw,112px) clamp(24px,4vw,56px) clamp(76px,9vw,128px);
}
.listing>.index{margin-bottom:18px;color:var(--primary)}
.listing>h1{max-width:16ch;margin:0;font-size:clamp(2.7rem,5.2vw,5.35rem);line-height:1.04}
.cases-directory__lead{max-width:42rem;margin-top:clamp(24px,3vw,36px);color:var(--muted);font-size:clamp(1rem,1.28vw,1.16rem);line-height:1.6;text-wrap:pretty}

.case-grid.full{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(18px,2.1vw,28px) 14px;
  margin-top:clamp(44px,5vw,70px);
}
.case-grid.full .case-card{
  display:flex;
  min-width:0;
  min-height:0;
  aspect-ratio:auto;
  flex-direction:column;
  overflow:visible;
  background:transparent;
}
.case-grid.full .case-card::after{display:none}
.case-grid.full .case-card img{
  position:relative;
  inset:auto;
  width:100%;
  height:auto;
  aspect-ratio:4 / 3;
  object-fit:contain;
  background:var(--surface);
  transition:opacity .2s;
}
.case-grid.full .case-card:hover img{transform:none;opacity:.82}
.case-grid.full .case-card>div{
  position:relative;
  right:auto;
  bottom:auto;
  left:auto;
  padding:15px 0 0;
}
.case-grid.full .case-card span{color:var(--primary);font-size:.64rem;line-height:1.25}
.case-grid.full .case-card h3{margin-top:9px;font-family:Unbounded,sans-serif;font-size:clamp(1rem,1.4vw,1.35rem);font-weight:400;letter-spacing:-.03em;line-height:1.2}
.case-grid.full .case-card p{display:block;max-width:40ch;margin-top:10px;color:var(--muted);font-size:.86rem;line-height:1.5;text-wrap:pretty}
.case-grid.full .case-card:focus-visible{outline:2px solid var(--primary);outline-offset:5px}

.listing>.callback{width:auto;max-width:none;margin-top:clamp(76px,10vw,130px)}
.listing>.channel-cta{width:auto;max-width:none}

@media(max-width:920px){.case-grid.full{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){
  .listing{padding:54px 18px 72px}.listing>h1{font-size:clamp(2.35rem,10vw,3.45rem)}.cases-directory__lead{margin-top:22px;font-size:1rem}
  .case-grid.full{grid-template-columns:1fr;gap:24px;margin-top:38px}.case-grid.full .case-card,.case-grid.full .case-card:nth-child(n + 2){display:flex;aspect-ratio:auto}.case-grid.full .case-card img{aspect-ratio:4 / 3}.case-grid.full .case-card>div{padding-top:12px}.case-grid.full .case-card h3{font-family:Manrope,Arial,sans-serif;font-size:1.12rem;font-weight:700;letter-spacing:-.02em}.case-grid.full .case-card p{font-size:.92rem}
}
@media(prefers-reduced-motion:reduce){.case-grid.full .case-card img{transition:none}}
