.icon-tile{--it-pad:clamp(1.1rem, .85rem + 1vw, 1.75rem);--it-radius:18px;--it-gap:2rem;--it-ico:clamp(64px, 52px + 2vw, 88px);--it-ico-radius:16px;--it-label-size:clamp(1.35rem, 1rem + 1.3vw, 2.1rem);align-content:space-between;gap:var(--it-gap);min-block-size:clamp(9.5rem,7.5rem + 6vw,13.5rem);padding:var(--it-pad);border-radius:var(--it-radius);color:var(--fg);text-align:start;-webkit-tap-highlight-color:transparent;background:linear-gradient(162deg,#0a2c5eeb 0%,#031733f0 100%);border:1px solid #eaf2ff29;text-decoration:none;display:grid;position:relative;overflow:hidden;box-shadow:inset 0 1px #eaf2ff0f,0 34px 50px -38px #000616f2}.icon-tile:after{content:"";background:linear-gradient(90deg, var(--color-blue), var(--color-ui));block-size:3px;transform:scaleX(var(--it-bar,1));transform-origin:0;transition:transform 1.1s var(--ease-ui);transition-delay:calc(var(--reveal-delay,0s) + .38s);position:absolute;inset-block-end:0;inset-inline:0}[dir=rtl] .icon-tile:after{transform-origin:100%;background:linear-gradient(270deg, var(--color-blue), var(--color-ui))}html.js .reveal:not(.is-in) .icon-tile:after,html.js .icon-tile.reveal:not(.is-in):after{transform:scaleX(0)}@media (prefers-reduced-motion:reduce){html.js .reveal:not(.is-in) .icon-tile:after,html.js .icon-tile.reveal:not(.is-in):after{transform:scaleX(var(--it-bar,1))}}html[data-motion=paused] .icon-tile:after{transform:scaleX(var(--it-bar,1))!important}.icon-tile__icon{inline-size:var(--it-ico);block-size:var(--it-ico);border-radius:var(--it-ico-radius);color:var(--color-hi);transition:background .32s var(--ease-ui), border-color .32s var(--ease-ui), box-shadow .32s var(--ease-ui);background:linear-gradient(160deg,#4390ff33 0%,#175ec514 100%);border:1px solid #4390ff80;place-items:center;display:grid}.icon-tile__icon>svg{block-size:64%;inline-size:64%;display:block;overflow:visible}.icon-tile__text{gap:.3rem;min-inline-size:0;display:grid}.icon-tile__label{font-family:var(--font-display);font-weight:var(--display-weight);font-size:var(--it-label-size);letter-spacing:var(--h2-track);color:var(--fg);line-height:1.05}.icon-tile__line{font-family:var(--font-body);letter-spacing:0;color:var(--fg-2);font-size:.9375rem;font-weight:400;line-height:1.4}.it-ico path{stroke-dasharray:1 2;stroke-dashoffset:0;transition:stroke-dashoffset 1.1s var(--ease-ui);transition-delay:calc(var(--reveal-delay,0s) + .26s)}html.js .reveal:not(.is-in) .it-ico path{stroke-dashoffset:1px}@media (prefers-reduced-motion:reduce){html.js .reveal:not(.is-in) .it-ico path{stroke-dashoffset:0}}html[data-motion=paused] .it-ico path{transition:none;stroke-dashoffset:0!important}a.icon-tile,button.icon-tile{cursor:pointer;transition:transform .28s var(--ease-burst), border-color .22s var(--ease-ui), background .32s var(--ease-ui), box-shadow .28s var(--ease-burst)}@media (hover:hover){a.icon-tile:hover,button.icon-tile:hover{border-color:#4390ff9e;transform:translateY(-3px);box-shadow:inset 0 1px #eaf2ff14,0 40px 56px -36px #000616}a.icon-tile:hover .icon-tile__icon,button.icon-tile:hover .icon-tile__icon{background:linear-gradient(160deg,#4390ff5c 0%,#175ec529 100%);border-color:#4390ffd9}}a.icon-tile:active,button.icon-tile:active{transform:translateY(-1px)}.icon-tile:focus-visible{outline:2px solid var(--color-ui);outline-offset:3px;border-radius:var(--it-radius)}.icon-tile[data-active]{background:linear-gradient(162deg,#175ec59e 0%,#082d61f0 62%,#031733f5 100%);border-color:#4390ffb8;box-shadow:inset 0 1px #eaf2ff1f,0 0 0 1px #4390ff38,0 30px 54px -30px #175ec5bf}.icon-tile[data-active] .icon-tile__icon{background:linear-gradient(160deg, var(--color-ui) 0%, var(--color-blue) 100%);color:var(--color-white);border-color:#8dbcffe6;box-shadow:0 10px 22px -10px #4390ffe6}.icon-tile--md{--it-pad:.85rem 1rem;--it-radius:14px;--it-gap:.85rem;--it-ico:46px;--it-ico-radius:12px;--it-label-size:1.15rem;grid-template-columns:auto minmax(0,1fr);align-content:center;align-items:center;min-block-size:0}.icon-tile--md .icon-tile__label{line-height:1.15}.icon-tile--sm{--it-pad:.65rem .8rem;--it-radius:12px;--it-gap:.7rem;--it-ico:38px;--it-ico-radius:10px;--it-label-size:1rem;grid-template-columns:auto minmax(0,1fr);align-content:center;align-items:center;min-block-size:0}.icon-tile--sm .icon-tile__label{line-height:1.2}.icon-tile--sm .icon-tile__line{font-size:.875rem}:is(.icon-tile--md,.icon-tile--sm) .icon-tile__icon>svg{block-size:58%;inline-size:58%}:is(.icon-tile--md,.icon-tile--sm):after{block-size:2px}:is(.icon-tile[data-tone],.tone-cycle>.icon-tile,.tone-cycle>*>.icon-tile):after{background:linear-gradient(90deg, var(--tone-2), var(--tone))}[dir=rtl] :is(.icon-tile[data-tone],.tone-cycle>.icon-tile,.tone-cycle>*>.icon-tile):after{background:linear-gradient(270deg, var(--tone-2), var(--tone))}:is(.icon-tile[data-tone],.tone-cycle>.icon-tile,.tone-cycle>*>.icon-tile) .icon-tile__icon{border-color:color-mix(in srgb, var(--tone) 55%, transparent);background:linear-gradient(160deg, color-mix(in srgb, var(--tone) 26%, transparent) 0%, color-mix(in srgb, var(--tone-2) 10%, transparent) 100%);color:var(--tone-text)}@media (hover:hover){:is(a,button):is(.icon-tile[data-tone],.tone-cycle>.icon-tile,.tone-cycle>*>.icon-tile):hover{border-color:color-mix(in srgb, var(--tone) 62%, transparent)}:is(a,button):is(.icon-tile[data-tone],.tone-cycle>.icon-tile,.tone-cycle>*>.icon-tile):hover .icon-tile__icon{border-color:color-mix(in srgb, var(--tone) 85%, transparent);background:linear-gradient(160deg, color-mix(in srgb, var(--tone) 38%, transparent) 0%, color-mix(in srgb, var(--tone-2) 16%, transparent) 100%)}}:is(.icon-tile[data-tone],.tone-cycle>.icon-tile,.tone-cycle>*>.icon-tile)[data-active]{border-color:color-mix(in srgb, var(--tone) 72%, transparent);background:linear-gradient(162deg, color-mix(in srgb, var(--tone-2) 46%, #082d61e6) 0%, #082d61f0 62%, #031733f5 100%);box-shadow:inset 0 1px 0 #eaf2ff1f, 0 0 0 1px color-mix(in srgb, var(--tone) 22%, transparent), 0 30px 54px -30px color-mix(in srgb, var(--tone-2) 75%, transparent)}:is(.icon-tile[data-tone],.tone-cycle>.icon-tile,.tone-cycle>*>.icon-tile)[data-active] .icon-tile__icon{border-color:color-mix(in srgb, var(--tone) 90%, white 10%);background:linear-gradient(160deg, var(--tone) 0%, var(--tone-2) 100%);box-shadow:0 10px 22px -10px color-mix(in srgb, var(--tone) 90%, transparent);color:var(--color-white)}
