/* Goudplevier v2, shared: header nav, pressed buttons, founder link. Page styles: home.css, packages.css. */
/* ===== shared: header nav ===== */

header.top{gap:18px}
.navl{display:flex;gap:2px;margin-left:auto;margin-right:8px}
.navl a{padding:10px 14px;border-radius:12px;font-weight:600;font-size:.95rem;color:var(--ink);text-decoration:none;transition:background 150ms ease}
@media (hover:hover) and (pointer:fine){.navl a:hover{background:rgba(0,0,0,.05)}}
.navl a[aria-current="page"]{background:rgba(0,0,0,.07)}
@media (max-width:820px){.navl{display:none}}
@media (max-width:560px){header.top .actions .btn.black{display:none}}
@media (hover:hover) and (pointer:fine){header.top .btn.black:hover{background:#FFD24D;border-color:#FFD24D;color:var(--ink)}}
.hs-founder.back::before{content:"← ";color:var(--gold);font-weight:700}
.hs-founder{color:inherit;font-weight:700;text-decoration:underline;text-decoration-color:var(--gold);text-decoration-thickness:2px;text-underline-offset:4px}
.btn:active{transform:scale(.97)}
/* founder link, used in the FAQs */
.hs-founder{color:inherit;font-weight:700;text-decoration:underline;text-decoration-color:var(--gold);text-decoration-thickness:2px;text-underline-offset:4px;transition:color 150ms ease}
.hs-founder[data-arrow]::after{content:" " attr(data-arrow);color:var(--gold);font-weight:700}

/* plovers: wings */
.bird .wing{transform-box:fill-box;transform-origin:10% 20%}
@keyframes plover-wave{from{transform:rotate(0)}to{transform:rotate(-34deg)}}
.wtile.play .bird .wing,.flock .perch:hover .bird .wing{animation:plover-wave 360ms ease-in-out 4 alternate}
@media (hover:hover) and (pointer:fine){#who .byline:hover .bird .wing{animation:plover-wave 360ms ease-in-out 4 alternate}}
@media (prefers-reduced-motion:reduce){.bird .wing{animation:none!important}}

/* footer flock scales with the column, so no plover is cut off on phones */
.foot .flock{width:min(480px,100%);height:auto;aspect-ratio:480/150;max-width:100%;transform:none}
.foot .flock .perch .bird{width:100%;height:auto}
@media (max-width:640px){.foot .flock{width:100%;height:auto;transform:none;max-width:100%}}