/* Interview card component.
   Shared between /interviews listing and the OTHER INTERVIEWS block
   on each interview detail page. Depends on --ease / --teal-mist /
   --latin / --ink which are defined in each page's :root. */

.i-grid{display:grid;grid-template-columns:repeat(3,1fr);column-gap:26px;row-gap:56px;}
@media(max-width:980px){.i-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:640px){.i-grid{grid-template-columns:1fr;max-width:400px;margin:0 auto;}}
.i-card{background:transparent;border:0;border-radius:0;padding:0;display:flex;flex-direction:column;transition:transform .4s var(--ease);}
.i-card:hover{transform:translateY(-4px);}
.i-thumb{aspect-ratio:16/9;overflow:hidden;background:var(--teal-mist);border-radius:0;}
.i-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease);}
.i-card:hover .i-thumb img{transform:scale(1.03);}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
.i-meta{display:flex;align-items:center;gap:10px;margin-top:14px;}
.i-cat{font-family:var(--latin);font-size:10px;letter-spacing:.14em;line-height:1.4;text-transform:uppercase;color:#28312F;background:transparent;border:1px solid #28312F;border-radius:999px;padding:5px 12px;font-weight:400;}
.i-cat.i-cat--independence,.i-cat.i-cat--career,.i-cat.i-cat--freedom,.i-cat.i-cat--worklife,.i-cat.i-cat--dualwork{background:transparent;color:#28312F;border-color:#28312F;font-weight:400;}
.i-name{margin-top:10px;font-size:15px;font-weight:500;line-height:2;letter-spacing:.06em;color:var(--ink);}