.hf{border:1px solid var(--on-dark-line);grid-template-columns:repeat(3,minmax(0,1fr));margin:0;padding:0;list-style:none;display:grid}.hf-cell{position:relative}.hf-cell:before,.hf-cell:after{background:var(--on-dark-line);content:"";z-index:2;position:absolute}.hf-cell:before{height:1px;bottom:-1px;left:0;right:0}.hf-cell:after{width:1px;top:0;bottom:0;right:-1px}.hf-cell button{-webkit-appearance:none;appearance:none;color:#fff;cursor:pointer;font:inherit;text-align:left;height:100%;min-height:clamp(188px,15vw,218px);transition:color .24s var(--ease);background:0 0;border:0;flex-direction:column;width:100%;padding:24px clamp(18px,1.8vw,28px) 86px;display:flex;position:relative}.hf-cell button:before{content:"";transform-origin:bottom;transition:transform .3s var(--ease);background:#fff;position:absolute;inset:0;transform:scaleY(0)}.hf-open button{color:var(--blue)}.hf-open button:before{transform:scaleY(1)}.hf-cell button>*{z-index:1;position:relative}.hf-icon{width:58px;height:58px;transition:transform .3s cubic-bezier(.34,1.56,.64,1);display:block}.hf-open .hf-icon{transform:scale(1.1)translateY(-2px)}.hf-label{margin-top:auto;font-size:clamp(1.05rem,1.3vw,1.22rem);font-weight:600;line-height:1.3}.hf-cell .hf-desc{opacity:0;transition:opacity .24s var(--ease), transform .24s var(--ease);font-size:.95rem;font-weight:500;line-height:1.45;position:absolute;bottom:24px;left:clamp(18px,1.8vw,28px);right:clamp(18px,1.8vw,28px);transform:translateY(8px)}.hf-open .hf-desc{opacity:1;transition-delay:90ms;transform:none}.hf-armed{border-color:#0000}.hf-armed .hf-cell:before{transform-origin:0;transform:scaleX(0)}.hf-armed .hf-cell:after{transform-origin:top;transform:scaleY(0)}.hf-armed .hf-icon,.hf-armed .hf-label{opacity:0;transform:translateY(10px)}.hf-armed .hf-icon :is(path,circle,rect){stroke-dasharray:var(--stroke-length);stroke-dashoffset:var(--stroke-length)}.hf-in{border-color:var(--on-dark-line);transition:border-color .7s var(--ease)}.hf-in .hf-cell:before{transition:transform .52s var(--ease) calc(var(--i) * 60ms);transform:scaleX(1)}.hf-in .hf-cell:after{transition:transform .52s var(--ease) calc(60ms + var(--i) * 60ms);transform:scaleY(1)}.hf-in .hf-icon,.hf-in .hf-label{opacity:1;transition:opacity .46s var(--ease) calc(.12s + var(--i) * 60ms), transform .46s var(--ease) calc(.12s + var(--i) * 60ms);transform:none}.hf-in .hf-icon :is(path,circle,rect){stroke-dashoffset:0;transition:stroke-dashoffset .7s var(--ease) calc(.22s + var(--i) * 70ms)}@media (max-width:1080px) and (min-width:641px){.hf{grid-template-columns:repeat(2,minmax(0,1fr))}.hf-cell:last-child{grid-column:1/-1}.hf-cell button{min-height:188px;padding-bottom:84px}}@media (max-width:640px){.hf{display:block}.hf-cell:after{display:none}.hf-cell button{grid-template-columns:40px minmax(0,1fr);column-gap:16px;min-height:0;padding:18px 16px;display:grid}.hf-icon{grid-row:1;align-self:center;width:34px;height:34px}.hf-label{align-self:center;margin-top:0;font-size:1.02rem}.hf-cell .hf-desc{opacity:1;transition:grid-template-rows .32s var(--ease);grid-column:2;grid-template-rows:0fr;display:grid;position:static;bottom:auto;left:auto;right:auto;transform:none}.hf-desc-inner{min-height:0;overflow:hidden}.hf-desc-inner:before{content:"";height:8px;display:block}.hf-cell.hf-open .hf-desc{grid-template-rows:1fr}}@media (prefers-reduced-motion:reduce){.hf-cell button,.hf-cell button:before,.hf-icon,.hf-desc{transition:none}}
