.hero-features{container-type:inline-size}.hero-features ul{grid-template-columns:repeat(2,minmax(0,1fr));gap:.875rem .75rem;display:grid}.hero-feature{align-items:center;gap:.625rem;display:flex}.hero-feature-icon{border:1px solid color-mix(in srgb, var(--brass) 55%, transparent);background:color-mix(in srgb, var(--brass) 12%, transparent);width:2.5rem;height:2.5rem;color:var(--brass);transition:background-color var(--dur-ui) var(--ease-out), color var(--dur-ui) var(--ease-out), box-shadow var(--dur-ui) var(--ease-out);animation:.7s cubic-bezier(.34,1.56,.64,1) both hero-feature-pop;animation-delay:calc(.43s + var(--i,0) * .11s);border-radius:9999px;flex-shrink:0;place-items:center;display:grid;position:relative}.hero-feature-icon:after{content:"";border:1px solid var(--brass);border-radius:inherit;opacity:0;pointer-events:none;animation:hero-feature-ring 7s var(--ease-out) infinite;animation-delay:calc(2.4s + var(--i,0) * .35s);position:absolute;inset:-1px}.hero-feature:hover .hero-feature-icon{background-color:var(--brass);color:var(--color-blue-night);box-shadow:0 0 22px -4px color-mix(in srgb, var(--brass) 70%, transparent)}.hero-feature-label{color:var(--color-white);animation:fade-up .6s var(--ease-out) both;animation-delay:calc(.51s + var(--i,0) * .11s);font-size:.875rem;font-weight:600;line-height:1.25}@container (min-width:32rem){.hero-features ul{grid-template-columns:repeat(4,minmax(0,1fr));gap:0}.hero-feature{text-align:center;flex-direction:column;gap:.625rem;padding-inline:.5rem}.hero-feature+.hero-feature{border-left:1px solid #ffffff1f}.hero-feature-icon{width:2.75rem;height:2.75rem}.hero-feature-label{font-size:.9375rem}}html[data-intro=playing] .hero-features,html[data-intro=playing] .hero-feature-icon,html[data-intro=playing] .hero-feature-icon:after,html[data-intro=playing] .hero-feature-label{animation-play-state:paused}@keyframes hero-feature-pop{0%{opacity:0;scale:.5}to{opacity:1;scale:1}}@keyframes hero-feature-ring{0%{opacity:.7;scale:1}16%,to{opacity:0;scale:1.65}}
