@property --plan-border-angle{syntax:'<angle>';initial-value:0deg;inherits:false}
#planos{position:relative;isolation:isolate}#planos:before{content:'';position:absolute;z-index:-1;inset:0 -18px 0;pointer-events:none;background:radial-gradient(ellipse at 35% 28%,#0082c51a,transparent 55%)}
#pricing-grid{padding-top:12px;gap:20px}
#pricing-grid .detailed-plan{isolation:isolate;border:1px solid rgba(var(--plan-rgb),.48);background:radial-gradient(ellipse at 100% 0%,rgba(var(--plan-rgb),.17),transparent 40%),linear-gradient(155deg,#0c2235,#06121f 70%);box-shadow:0 20px 45px #0005,inset 0 1px rgba(var(--plan-rgb),.15),0 0 24px rgba(var(--plan-rgb),.055);transition:transform .28s ease,border-color .28s,box-shadow .28s}
#pricing-grid .detailed-plan:before{content:'';position:absolute;inset:-1px;width:auto;height:auto;border-radius:inherit;padding:1px;background:conic-gradient(from var(--plan-border-angle),transparent 0deg,rgba(var(--plan-rgb),.15) 65deg,var(--plan-accent) 95deg,rgba(var(--plan-rgb),.15) 125deg,transparent 180deg,transparent 260deg,rgba(var(--plan-rgb),.75) 290deg,transparent 325deg);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;pointer-events:none;opacity:.5;z-index:0;animation:plan-border-orbit 10s linear infinite;animation-play-state:paused}
#pricing-grid .detailed-plan:after{content:'';position:absolute;inset:0;border-radius:inherit;background:radial-gradient(350px circle at var(--spot-x,50%) var(--spot-y,5%),rgba(var(--plan-rgb),.15),transparent 75%);pointer-events:none;opacity:0;transition:opacity .3s;z-index:0}
#pricing-grid .detailed-plan>:not(.recommended-label){position:relative;z-index:1}
#pricing-grid .plan-essential{border-color:#37d7f0;background:radial-gradient(ellipse at 50% 0%,#0bbfe32b,transparent 44%),linear-gradient(160deg,#0d2e42,#071927 70%);box-shadow:0 0 0 3px #10cce70b,0 0 35px #09c9ef26,0 24px 45px #0005}
#pricing-grid .plan-essential:before{opacity:1}
#planos.plans-in-view .detailed-plan:before{animation-play-state:running}
#pricing-grid .detailed-plan:focus-within{border-color:var(--plan-accent);box-shadow:0 0 0 2px rgba(var(--plan-rgb),.25),0 0 34px rgba(var(--plan-rgb),.18),0 20px 45px #0006}
#pricing-grid .detailed-plan:focus-within:after{opacity:1}
#pricing-grid .detailed-plan-symbol{width:66px;height:66px;border-radius:19px;background:radial-gradient(ellipse at 25% 5%,rgba(var(--plan-rgb),.35),transparent 70%),linear-gradient(145deg,rgba(var(--plan-rgb),.14),#071927);box-shadow:inset 0 1px rgba(var(--plan-rgb),.38),0 8px 24px #0005,0 0 22px rgba(var(--plan-rgb),.12);transition:transform .28s,box-shadow .28s}
#pricing-grid .detailed-plan-symbol svg{width:36px;height:36px;filter:drop-shadow(0 0 6px rgba(var(--plan-rgb),.3))}
#pricing-grid .detailed-plan h3{text-shadow:0 2px 14px rgba(var(--plan-rgb),.12)}
#pricing-grid .detailed-plan .price strong{color:#fff;text-shadow:0 0 22px rgba(var(--plan-rgb),.19)}
#pricing-grid .detailed-plan .recommended-label{border-color:#8cf0ff;background:linear-gradient(110deg,#59eafa,#14bbec);box-shadow:0 3px 20px #00c8ed4d;font-weight:700;letter-spacing:.4px;padding:5px 13px;z-index:3}
#pricing-grid .detailed-plan .button{overflow:hidden;transition:background .25s,box-shadow .25s,border-color .25s;transform:none}
#pricing-grid .detailed-plan .button:before{content:'';position:absolute;inset:0;background:linear-gradient(110deg,transparent 20%,#ffffff30 48%,transparent 70%);transform:translateX(-140%);pointer-events:none}
#pricing-grid .plan-premium .button.outline{background:linear-gradient(120deg,#e7cc9220,#e7cc9208);border-color:#c8a868}
#pricing-grid .detailed-plan .button:focus-visible{outline:2px solid var(--plan-accent);outline-offset:4px}
@keyframes plan-border-orbit{to{--plan-border-angle:360deg}}
@keyframes plan-button-shine{to{transform:translateX(140%)}}
@media(hover:hover) and (pointer:fine){#pricing-grid .detailed-plan:hover{transform:translateY(-7px);border-color:var(--plan-accent);box-shadow:0 0 0 1px rgba(var(--plan-rgb),.2),0 0 38px rgba(var(--plan-rgb),.22),0 26px 50px #0007}#pricing-grid .detailed-plan:hover:after{opacity:1}#pricing-grid .detailed-plan:hover:before{opacity:1}#pricing-grid .detailed-plan:hover .detailed-plan-symbol{transform:translateY(-3px) rotate(-3deg);box-shadow:inset 0 1px rgba(var(--plan-rgb),.45),0 8px 26px #0005,0 0 30px rgba(var(--plan-rgb),.25)}#pricing-grid .detailed-plan:hover .button:before{animation:plan-button-shine .9s ease both}#pricing-grid .detailed-plan .button:hover{box-shadow:0 0 26px rgba(var(--plan-rgb),.28);border-color:var(--plan-accent)}}
@media(max-width:1050px){#pricing-grid{gap:30px 22px}}@media(max-width:760px){#pricing-grid{gap:32px;padding-top:13px}#pricing-grid .detailed-plan:hover{transform:none}#pricing-grid .detailed-plan:before{opacity:.7}#pricing-grid .plan-essential:before{opacity:1}#pricing-grid .detailed-plan .recommended-label{font-size:9px}}
@media(prefers-reduced-motion:reduce){#pricing-grid .detailed-plan,#pricing-grid .detailed-plan-symbol,#pricing-grid .detailed-plan:after,#pricing-grid .detailed-plan .button{transition:none}#pricing-grid .detailed-plan:before,#pricing-grid .detailed-plan .button:before{animation:none!important}#pricing-grid .detailed-plan:hover,#pricing-grid .detailed-plan:hover .detailed-plan-symbol{transform:none}}