/* team: one section per crew member - job, his name big in his own font, his story, and his name tag */
.cards{border-top:2px solid var(--ink)}
.card{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,400px);grid-template-areas:"top tag" "name tag" "line tag";column-gap:clamp(28px,5vw,72px);row-gap:10px;align-items:start;padding:clamp(32px,4vw,56px) 0;border-bottom:1px solid var(--line-2)}
.card:last-child{border-bottom:0}
.card-top{grid-area:top;display:flex;align-items:center;gap:12px;font-size:15px;color:var(--muted)}
.card-top .job{display:inline-flex;align-items:center;gap:8px;color:var(--ink);font-weight:900}
.card-top .job::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--red)}
.card-top .new{border:1px solid var(--red);color:var(--red);font-weight:700;padding:3px 8px;border-radius:var(--pill);font-size:13px}
.card .sample{grid-area:name;font-size:clamp(84px,11vw,180px);line-height:1.08;white-space:nowrap;overflow:hidden;margin:0 0 4px;text-decoration:none;color:var(--ink)}
.card .line{grid-area:line;margin:0;max-width:52ch;font-size:clamp(17px,1.4vw,20px);line-height:1.65;color:var(--muted)}
/* the name tag: his alphabet, how strong, the price and two ways onward */
.card-tag{grid-area:tag;align-self:center;display:grid;gap:14px;padding:0 20px 20px;border:2px solid var(--line-2);border-radius:var(--radius);background:var(--bg)}
.tag-head{display:flex;justify-content:space-between;margin:0 -20px;padding:7px 20px 6px;background:var(--line-2);color:var(--ink);font:900 15px/1.2 var(--ui);border-radius:3px 3px 0 0}
.tag-head{background:var(--card-2)}
.tag-head > :first-child::before{content:"";display:inline-block;width:7px;height:7px;margin-inline-end:8px;border-radius:50%;background:var(--red);vertical-align:.12em}
.tag-abc{display:flex;flex-wrap:wrap;gap:0 .26em;font-size:clamp(28px,2.4vw,34px);line-height:1.3}
.tag-lat{direction:ltr;text-align:right;font-size:22px;line-height:1.2;color:var(--muted);padding-bottom:14px;border-bottom:1px dashed var(--line-2);white-space:nowrap;overflow:hidden}
.strength{display:flex;align-items:center;gap:12px;font-size:14px;color:var(--muted);cursor:pointer}
.strength input{flex:1;width:auto}
.strength b{min-width:76px;color:var(--ink);font-weight:700;direction:ltr;text-align:right}
.card-btns{display:flex;gap:18px 22px;flex-wrap:wrap;padding:6px}
.card-btns .cta{flex:1;font-size:15px;padding:10px 16px;white-space:nowrap}
@media (max-width:900px){.card{grid-template-columns:minmax(0,1fr);grid-template-areas:"top" "name" "line" "tag";row-gap:14px}.card-tag{align-self:stretch;margin-top:8px}}
