/* Two reflective edges around a solid blue face. The ring stays sharp as the face shimmers. */
@property --claim-edge-angle{syntax:"<angle>";initial-value:125deg;inherits:false}
.hero .claim-button{
  position:relative!important;isolation:isolate;overflow:hidden!important;
  min-height:52px;min-width:168px;padding:0 26px;border:2px solid transparent;
  border-radius:18px;cursor:pointer;
  background:linear-gradient(120deg,#075ac5 0%,#087de5 44%,#0969ce 75%,#0752b0 100%) padding-box,
    conic-gradient(from var(--claim-edge-angle),#769de0 0deg,#e7faff 45deg,#81b9ee 85deg,#c1b7f7 130deg,#486da8 175deg,#e4f8ff 220deg,#89cbff 265deg,#6a83c0 310deg,#c6ddff 360deg) border-box!important;
  background-size:100% 100%!important;
  color:#fff;box-shadow:0 0 0 1px #2055a04d,0 2px 3px #153b6820,0 9px 22px #0868c72b,inset 0 1px 0 #ffffff4d,inset 0 -1px 0 #003c8c80!important;
  animation:claim-edge-orbit 8s linear infinite!important;transition:transform .22s ease,box-shadow .22s ease;
}
.hero .claim-button::before{
  content:"";position:absolute;inset:2px;border:1px solid transparent;border-radius:14px;
  background:linear-gradient(145deg,#ffffff94,#b5eaff12 32%,#ffffff08 66%,#b7dcff66) border-box;
  -webkit-mask:linear-gradient(#fff 0 0) padding-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
  z-index:2;pointer-events:none;
}
.hero .claim-button::after{
  content:"";position:absolute;inset:-30% -40%;width:auto;height:auto;
  background:linear-gradient(112deg,transparent 40%,#d2efff38 48%,#ffffff70 50%,#d2efff20 53%,transparent 61%);
  opacity:.5;transform:translateX(-80%);animation:claim-face-reflection 6s ease-in-out infinite!important;
  z-index:1;pointer-events:none;
}
.hero .claim-button>span{
  position:relative;z-index:3!important;font-size:15px;font-weight:700;line-height:1.2;letter-spacing:.01em;
  color:#fff;background:linear-gradient(110deg,#fff 10%,#cdeeff 46%,#fff 60%,#fff 100%);
  background-size:220% 100%;background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;
  animation:claim-label-reflection 6s ease-in-out infinite!important;
}
.hero .claim-button:hover{transform:translateY(-1px);box-shadow:0 0 0 1px #1b5dafa6,0 3px 5px #153b681a,0 12px 26px #0868c73d,inset 0 1px 0 #ffffff73,inset 0 -1px 0 #003c8c80!important}
.hero .claim-button:active{transform:translateY(1px);box-shadow:0 0 0 1px #2055a066,0 3px 8px #0868c72b,inset 0 1px 3px #002d7059!important}
.hero .claim-button:focus-visible{outline:3px solid #1559b6;outline-offset:5px}
@keyframes claim-face-reflection{0%,20%{transform:translateX(-80%)}65%,100%{transform:translateX(80%)}}
@keyframes claim-label-reflection{0%,20%{background-position:0% 50%}65%,100%{background-position:100% 50%}}
@keyframes claim-edge-orbit{from{--claim-edge-angle:125deg}to{--claim-edge-angle:485deg}}
@media(prefers-reduced-motion:reduce){.hero .claim-button,.hero .claim-button::after,.hero .claim-button>span{animation:none!important}.hero .claim-button::after{transform:translateX(15%);opacity:.2}.hero .claim-button{transition:none}}
@media(forced-colors:active){.hero .claim-button{border-color:ButtonText;background:ButtonFace!important}.hero .claim-button>span{background:none;-webkit-text-fill-color:ButtonText}.hero .claim-button::before,.hero .claim-button::after{display:none}}
