/* Farid in every page headline (hero-me.js): a cobalt egg set inline in the h1, his head popping out
   over the top. Two copies of the same cutout: one clipped by the egg, one showing only what rises above it.
   Sizes are in em, so it scales with each page's headline. Static: no hover effect (Farid's call). */
.hm-keep{white-space:nowrap}
.hb-top .hm-hide{opacity:0!important;visibility:hidden}
.hm{--w:1.32em;--e:.86em;--b:-.42em;--pop:.7em;position:relative;display:inline-block;width:var(--w);height:var(--e);margin:0 .14em 0 .1em;vertical-align:-.04em;text-decoration:none}
.hm-egg{position:absolute;inset:0;border-radius:50%;overflow:hidden;background:radial-gradient(90% 75% at 50% 100%,rgba(140,152,255,.95) 0%,rgba(140,152,255,.3) 45%,transparent 72%),var(--cobalt,#2335E6);box-shadow:0 .08em .3em -.1em rgba(35,53,230,.55)}
.hm-top{position:absolute;left:0;right:0;top:calc(-1 * var(--pop));bottom:calc(var(--e) / 2);overflow:hidden;pointer-events:none}
.hm img{position:absolute;left:0;width:100%;height:auto;max-width:none;display:block}
.hm-egg img{bottom:var(--b)}
.hm-top img{bottom:calc(var(--b) - var(--e) / 2)}
.hm:focus-visible{outline:3px solid var(--cobalt,#2335E6);outline-offset:.1em;border-radius:40%}
@media (prefers-reduced-motion:no-preference){.hm{animation:hmIn .9s var(--ease,cubic-bezier(.2,.7,.2,1)) .35s both}@keyframes hmIn{from{opacity:0;transform:translateY(.25em) scale(.85)}}}