/* TESTER · The card: a plain sheet. The mark at the top, a small ID photo in the middle, the bio set tight at the bottom */
.idc{position:relative;min-height:100vh;min-height:100svh;box-sizing:border-box;background:#efece6;color:#111;overflow:hidden;
  display:grid;grid-template-rows:auto 1fr auto;justify-items:center;padding:calc(var(--hh,53px) + clamp(28px,6vh,64px)) 20px clamp(28px,5vh,52px)}
.idc::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.12;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E")}
.idc-mark{position:relative;display:block;width:clamp(78px,11vw,124px);height:auto}
.idc-ph{position:relative;align-self:center;width:clamp(104px,15vw,170px);aspect-ratio:747/959;margin-block:clamp(24px,5vh,48px)}
.idc-ph img{display:block;width:100%;height:100%;object-fit:cover}
.idc-bio{position:relative;margin:0;max-width:64ch;text-align:center;font-family:"Arimo","Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:700;
  font-size:clamp(11.5px,1.25vw,15px);line-height:1.18;letter-spacing:-.012em;font-stretch:100%;text-wrap:balance}
/* arriving: the mark, then the photo, then the words */
.idc .idc-mark,.idc .idc-ph,.idc .idc-bio{opacity:0;transform:translateY(10px);transition:opacity .9s ease,transform .9s cubic-bezier(.2,.8,.2,1)}
.idc .idc-ph{transition-delay:.18s}.idc .idc-bio{transition-delay:.36s}
.idc.in .idc-mark,.idc.in .idc-ph,.idc.in .idc-bio{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.idc .idc-mark,.idc .idc-ph,.idc .idc-bio{opacity:1;transform:none;transition:none}}