/* FloorRank #1 Top Pick medal. One component, two placements, and each placement moves differently.
   The medal states what the linked floorrank.com page publishes ("Ranked #1 in Texas ... a top pick"),
   never a score: New Era is FloorRank's pinned #1, disclosed on floorrank.com/methodology.
   Transform and opacity only, no filter:blur, nothing opacity-gated above the fold, and every glow
   can only ADD light (screen blend, ramp runs to transparent at 100%). Source: build-top-pick.py in
   ~/floorrankings/brand-assets/top-pick. */
.fr-medal{--fr-size:clamp(96px,10vw,140px);position:relative;display:inline-flex;flex-direction:column;align-items:center;gap:10px;text-decoration:none;color:inherit;-webkit-tap-highlight-color:transparent}
.fr-medal:focus-visible{outline:none}
.fr-medal:focus-visible .fr-body{box-shadow:0 0 0 3px #0a0908,0 0 0 5px #FEC84B}
.fr-disc{position:relative;display:block;width:var(--fr-size);height:var(--fr-size);flex:none}
.fr-body{position:absolute;inset:0;z-index:1;display:block;border-radius:50%;overflow:hidden;box-shadow:0 14px 34px rgba(0,0,0,.55);transition:scale .22s cubic-bezier(.2,.8,.2,1)}
.fr-body img{display:block;width:100%;height:100%}
.fr-sheen{position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 38%,rgba(255,236,190,.5) 50%,transparent 62%);mix-blend-mode:screen;transform:translateX(-130%)}
.fr-halo{position:absolute;inset:-42%;z-index:0;border-radius:50%;pointer-events:none;background:radial-gradient(closest-side,rgba(254,200,75,.55),rgba(241,176,58,.2) 45%,rgba(241,176,58,0) 100%);mix-blend-mode:screen;opacity:.34}
.fr-ring{position:absolute;inset:0;z-index:2;border-radius:50%;pointer-events:none;border:2px solid rgba(254,200,75,.85);opacity:0}
.fr-rim{position:absolute;inset:-1px;z-index:2;border-radius:50%;pointer-events:none;background:conic-gradient(from 0deg,rgba(254,200,75,0) 0 76%,rgba(255,226,150,.95) 88%,rgba(254,200,75,0) 97%);-webkit-mask:radial-gradient(closest-side,transparent calc(100% - 5px),#000 calc(100% - 4px));mask:radial-gradient(closest-side,transparent calc(100% - 5px),#000 calc(100% - 4px));mix-blend-mode:screen}
.fr-cap{display:flex;flex-direction:column;align-items:center;gap:3px;font-family:'Space Mono',ui-monospace,Menlo,monospace;font-size:.66rem;line-height:1.25;letter-spacing:.14em;text-transform:uppercase;color:#c8c0b2;white-space:nowrap;text-align:center}
.fr-cap b{color:#FEC84B;font-weight:700}
.fr-medal:hover .fr-body{scale:1.05}
.fr-medal:hover .fr-cap{color:#f3eee4}
.fr-row{flex-direction:row;gap:14px}
.fr-row .fr-cap{align-items:flex-start;text-align:left}

/* HERO: struck-medal arrival with a shockwave ring and a one-shot halo bloom, then a slow float and a
   sheen crossing the face. The medal is visible in every frame: it arrives, it never fades in. */
.fr-hero .fr-disc{animation:frFloat 8s ease-in-out 2.2s infinite}
.fr-hero .fr-body{animation:frStrike 1.05s cubic-bezier(.22,.9,.24,1) .3s both}
.fr-hero .fr-ring{animation:frShock 1s cubic-bezier(.2,.7,.3,1) .86s forwards}
.fr-hero .fr-halo{animation:frBloom 1.5s cubic-bezier(.2,.8,.2,1) .8s both,frBreathe 6s ease-in-out 2.3s infinite}
.fr-hero .fr-sheen{animation:frSheen 7s cubic-bezier(.45,.05,.3,1) 1.6s infinite}
@keyframes frStrike{0%{transform:translateY(-34px) scale(1.24) rotate(-12deg)}55%{transform:translateY(0) scale(.93) rotate(2deg)}74%{transform:scale(1.035) rotate(-.6deg)}100%{transform:none}}
@keyframes frShock{0%{opacity:.9;transform:scale(.92)}100%{opacity:0;transform:scale(1.65)}}
@keyframes frBloom{0%{opacity:0;transform:scale(.35)}45%{opacity:1;transform:scale(1.12)}100%{opacity:.34;transform:scale(1)}}
@keyframes frBreathe{0%,100%{opacity:.3}50%{opacity:.5}}
@keyframes frFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
@keyframes frSheen{0%{transform:translateX(-130%)}22%,100%{transform:translateX(130%)}}

/* neweraepoxy.com: the brand coin and the award sit together as one seal pair above the stats. */
.hero-seals{display:flex;align-items:center;justify-content:center;gap:6px}
@media(max-width:920px){.hero-seals{justify-content:flex-start;gap:12px}.hero-seals .fr-medal{--fr-size:88px;flex-direction:row;gap:12px}.hero-seals .fr-cap{align-items:flex-start;text-align:left}}

/* City homepages: a centred award lockup above the eyebrow. */
.cty-hero-in>.fr-medal{--fr-size:clamp(84px,7.4vw,108px);display:flex;width:max-content;margin:0 auto 18px}
.fr-hero .fr-cap{text-shadow:0 1px 12px rgba(0,0,0,.95),0 0 3px rgba(0,0,0,.9)}

/* FOOTER: no entrance at all, one quiet point of gold light travelling the rim on a long cycle. */
.fr-foot-row{display:flex;justify-content:center;padding:30px 0 10px}
.fr-foot{--fr-size:72px}
.fr-foot .fr-body{box-shadow:0 8px 22px rgba(0,0,0,.5)}
.fr-foot .fr-rim{animation:frRim 12s linear infinite}
@keyframes frRim{to{transform:rotate(1turn)}}

@media(prefers-reduced-motion:reduce){.fr-medal *{animation:none!important}.fr-ring,.fr-rim{display:none}.fr-medal:hover .fr-body{scale:1}}
