/* Brand marks (see brandmarks.js): the Human-ISM and Human-EYE logos as vector
   drawings. Everything is sized in em from the mark's own font-size: the icon is
   1em tall, and the lettering keeps the proportions of the original lockup
   (icon 50px, name 27px, line beneath 9.5px). */
.mk{display:inline-block; position:relative; line-height:0; font-size:50px; vertical-align:middle;}
.mk .mk-ic{display:block; width:1em; height:1em; flex:none;}
.mk .mk-ic.mk-wide{width:1.933em;}               /* the eye on its own: cropped to the eye, 58:30 */
/* the eye's dashes stream slowly round it */
.mk .mk-dsh{stroke-dasharray:7 2.4; stroke-linecap:round; animation:mk-dash 30s linear infinite;}
@keyframes mk-dash{to{stroke-dashoffset:-112;}}

/* a logo: icon + two lines of lettering */
.mk .mk-b{display:flex; align-items:center; gap:.16em;}
.mk .mk-w{display:flex; flex-direction:column; align-items:flex-start; text-align:left; line-height:1;}
.mk .mk-w1{font-family:'Times New Roman',Times,serif; font-size:.54em; color:#eec46f; letter-spacing:.015em; white-space:nowrap;}
.mk .mk-w1 sup{font-size:.2em; vertical-align:baseline;}
.mk .mk-llc{font-size:.3em; letter-spacing:.06em; margin-left:.25em;}
.mk .mk-w2{font-family:'Times New Roman',Times,serif; font-style:italic; font-size:.19em; color:#fff;
      margin-top:.1em; letter-spacing:.02em; white-space:nowrap;}
.mk .mk-w2 sup{font-size:.42em; vertical-align:super;}

/* the lockup: the second logo lies over the first and is wiped in and out by the script */
.mk.mk-lockup .mk-b2{position:absolute; inset:0; clip-path:circle(0px at .5em 50%);}

@media (prefers-reduced-motion:reduce){ .mk .mk-dsh{animation:none;} }