.case-study-showcase-variant-f{
  padding:clamp(72px,8vw,112px) 0;
  border-top:1px solid var(--rule);
  background:var(--paper);
  color:var(--black);
}
.case-study-showcase-variant-f--gold-tint{
  background:var(--gold-10);
}
.case-study-showcase-variant-f__in{
  width:var(--shell);
  margin:0 auto;
}
.case-study-showcase-variant-f__head{
  display:flex;
  flex-wrap:wrap;
  align-items:flex-end;
  justify-content:space-between;
  gap:30px;
  padding:0;
  margin-bottom:clamp(48px,4vw,56px);
}
.case-study-showcase-variant-f__copy{
  display:flex;
  flex-direction:column;
  gap:14px;
  flex:0 1 75%;
  max-width:75%;
}
.case-study-showcase-variant-f__eyebrow{
  font-family:var(--mono);
  font-size:12px;
  line-height:var(--lh-tight);
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--deep);
}
.case-study-showcase-variant-f__title{
  font-family:var(--display);
  font-weight:400;
  font-size:32px;
  line-height:var(--lh-tight);
  letter-spacing:0;
  color:var(--deep);
  text-wrap:pretty;
}
.case-study-showcase-variant-f__all{
  display:inline-flex;
  align-items:center;
  gap:9px;
  padding-bottom:5px;
  border-bottom:1px solid var(--gold);
  font-family:var(--display);
  font-size:14px;
  line-height:var(--lh-copy);
  color:var(--deep);
  transition:gap .2s var(--ease);
}
.case-study-showcase-variant-f__all:hover,
.case-study-showcase-variant-f__all:focus-visible{
  gap:14px;
}
.case-study-showcase-variant-f__grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px;
}
.case-study-showcase-variant-f__tile{
  position:relative;
  display:grid;
  grid-template-rows:auto minmax(116px,1fr) auto;
  row-gap:14px;
  aspect-ratio:1 / 1.35;
  min-width:0;
  overflow:hidden;
  padding:22px 22px 20px;
  color:var(--paper);
  transition:transform .45s var(--ease),box-shadow .45s var(--ease);
}
.case-study-showcase-variant-f__tile:hover,
.case-study-showcase-variant-f__tile:focus-visible{
  transform:translateY(-10px);
  box-shadow:0 16px 30px rgba(24,24,24,.22);
}
.case-study-showcase-variant-f__tile:focus-visible{
  outline:0;
  box-shadow:0 16px 30px rgba(24,24,24,.22), inset 0 0 0 3px var(--gold);
}
.case-study-showcase-variant-f__tile--friction{background:#6E1E2E}
.case-study-showcase-variant-f__tile--vulnerability{background:#3B2440}
.case-study-showcase-variant-f__tile--hr{background:#2B4A64}
.case-study-showcase-variant-f__tile--nlp{background:#8A4726}
.case-study-showcase-variant-f__tile--green{background:#1F4D3A}
.case-study-showcase-variant-f__tile--slate{background:#2E3A55}
.case-study-showcase-variant-f__tile--plum{background:#5E2438}
.case-study-showcase-variant-f__tile--ochre{background:#55432A}
.case-study-showcase-variant-f__meta{
  font-family:var(--mono);
  font-size:12px;
  line-height:var(--lh-tight);
  letter-spacing:.15em;
  text-transform:uppercase;
  color:rgba(255,255,255,.7);
}
.case-study-showcase-variant-f__art{
  align-self:center;
  justify-self:center;
  width:100%;
  max-width:170px;
  height:auto;
  max-height:105px;
  margin:0;
  object-fit:contain;
  filter:invert(1);
  mix-blend-mode:screen;
  opacity:.5;
}
.case-study-showcase-variant-f__body{
  display:grid;
  grid-template-rows:auto minmax(4.2em,auto) auto;
  gap:8px;
}
.case-study-showcase-variant-f__figure{
  font-family:var(--display);
  font-weight:400;
  font-size:24px;
  line-height:var(--lh-copy);
  letter-spacing:0;
  color:var(--gold);
}
.case-study-showcase-variant-f__figure--large{
  font-size:32px;
}
.case-study-showcase-variant-f__summary{
  font-size:var(--fs-body);
  line-height:var(--lh-copy);
  color:var(--paper);
}
.case-study-showcase-variant-f__cta{
  padding-top:11px;
  border-top:1px solid rgba(255,255,255,.22);
  font-family:var(--display);
  font-size:14px;
  line-height:var(--lh-tight);
  letter-spacing:.05em;
  color:var(--gold);
}
@media (max-width:1080px){
  .case-study-showcase-variant-f__grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media (max-width:760px){
  .case-study-showcase-variant-f__head{
    margin-bottom:48px;
  }
  .case-study-showcase-variant-f__copy{
    flex-basis:100%;
    max-width:100%;
  }
}
@media (max-width:520px){
  .case-study-showcase-variant-f__title{
    font-size:32px;
  }
  .case-study-showcase-variant-f__grid{
    grid-template-columns:1fr;
  }
  .case-study-showcase-variant-f__tile{
    aspect-ratio:auto;
    min-height:390px;
  }
}
@media (prefers-reduced-motion:reduce){
  .case-study-showcase-variant-f__all,
  .case-study-showcase-variant-f__tile{
    transition:none;
  }
  .case-study-showcase-variant-f__tile:hover,
  .case-study-showcase-variant-f__tile:focus-visible{
    transform:none;
  }
}

/* Template title standard: section H2 */
[data-section="case-study-showcase-variant-f"][data-section="case-study-showcase-variant-f"] h2,
.case-study-showcase-variant-f.case-study-showcase-variant-f h2,
.case-study-showcase-variant-f__root.case-study-showcase-variant-f__root h2{
  font-size:50px !important;
  font-weight:500 !important;
  line-height:var(--lh-tight) !important;
  overflow-wrap:anywhere;
}

/* Section padding standard 2026-09-21: reusable section roots keep 80px between their border and content. */
.case-study-showcase-variant-f{
  padding-block:clamp(72px,7vw,120px);
}