/* House of Pools — shared header utility link.
   Login is placed consistently at upper-right on all public headers. */
header:has(>.hop-login-link){position:relative}
.hop-login-link{
 position:absolute;top:12px;right:max(18px,calc((100vw - 1180px)/2));
 z-index:20;display:inline-flex;align-items:center;justify-content:center;
 min-width:74px;min-height:34px;padding:7px 14px;
 border:1px solid #e7d7b5;border-radius:8px;
 background:#0d2b3e;color:#fff!important;
 font:700 13px/1.3 system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
 text-decoration:none;white-space:nowrap;
}
.hop-login-link:hover,.hop-login-link:focus-visible{background:#176075;outline-offset:3px}
.site-header:has(>.hop-login-link) .wrap{padding-top:40px}
header:has(>.hop-login-link):not(.site-header){padding-top:max(54px,3.3rem)!important}
@media(max-width:600px){.hop-login-link{top:10px;right:16px;min-width:70px;padding:7px 10px}.site-header:has(>.hop-login-link) .wrap{padding-top:40px}}

/* The homepage uses a full-bleed illustrated hero and deliberately hides .site-header.
   Display the same login action on the hero itself, without restoring/changing the header. */
.landing-hero-frame > .hop-home-login-link{
  position:absolute;
  z-index:10;
  top:clamp(10px,1.7vw,24px);
  right:max(16px,calc((100vw - 1180px)/2));
}
@media(max-width:600px){
  .landing-hero-frame > .hop-home-login-link{top:10px;right:12px}
}