.hww-steps{row-gap:1rem;display:grid;position:relative}.hww-step{grid-template-columns:3rem minmax(0,1fr);align-items:center;column-gap:1rem;display:grid;position:relative}.hww-step:not(:last-child):before{content:"";background-color:var(--color-royal);width:2px;height:calc(100% + 1rem);position:absolute;top:50%;left:calc(1.5rem - 1px)}@media not (min-width:64rem){@container hww (min-width:40rem){.hww-steps{grid-template-rows:repeat(4,auto);grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-flow:column;column-gap:2rem}.hww-step:nth-child(4):before{display:none}}}@container hww not (min-width:16rem){.hww-step{grid-template-columns:minmax(0,1fr);row-gap:.75rem}.hww-step:not(:last-child):before{display:none}}@media not (min-width:64rem){.hww-list-card>p{grid-column:2}@container steps not (min-width:40rem){.hww-list-step{position:relative}.hww-list-step:not(:last-child):before{content:"";background-color:var(--color-royal);width:2px;height:calc(100% + 1rem);position:absolute;top:1.5rem;left:calc(1.5rem - 1px)}.hww-list-card{background-color:#0000;border-color:#0000;outline:0;grid-template-columns:3rem minmax(0,1fr);align-items:start;gap:.25rem 1rem;padding:0}.hww-list-card>.hww-dot{grid-row:span 2}.hww-list-card>h3{padding-top:max(0px,1.5rem - .5lh)}}@container steps not (min-width:16rem){.hww-list-step:not(:last-child):before{display:none}.hww-list-card{grid-template-columns:minmax(0,1fr);row-gap:.75rem}.hww-list-card>:is(.hww-dot,h3,p){grid-area:auto/1}.hww-list-card>h3{padding-top:0}}}.hww-dot{z-index:1;background-color:var(--color-royal);width:3rem;height:3rem;color:var(--color-white);font-variant-numeric:tabular-nums;border-radius:9999px;place-items:center;font-size:.875rem;font-weight:600;line-height:1;display:grid;position:relative}@container hww (min-width:72rem){.hww-steps{--hww-gap:1rem;--hww-inset:calc((100% - 7 * var(--hww-gap)) / 16);column-gap:var(--hww-gap);grid-template-columns:repeat(8,minmax(0,1fr))}.hww-step{grid-template-rows:auto 1fr;grid-template-columns:minmax(0,1fr);place-items:stretch center;row-gap:1rem}.hww-step:not(:last-child):before{display:none}.hww-steps:before,.hww-steps:after{content:"";top:calc(1.5rem - 1px);left:var(--hww-inset);right:var(--hww-inset);border-radius:9999px;height:2px;position:absolute}.hww-steps:before{background-color:#0755b52e}.hww-steps:after{background-color:var(--color-royal);transform-origin:0}}@media (prefers-reduced-motion:no-preference){@supports (animation-timeline:view()){@container hww (min-width:72rem){.hww-steps{view-timeline:--hww block;view-timeline-inset:0% 5%}.hww-steps:after{animation:linear both hww-fill;animation-timeline:--hww;animation-range:entry-crossing entry-crossing 92%}.hww-dot{animation:linear both hww-dot-fill;animation-timeline:--hww;animation-range:entry-crossing calc(var(--step) * 13.143%) entry-crossing calc(var(--step) * 13.143% + 8%)}}}@supports not (animation-timeline:view()){@container hww (min-width:72rem){[data-reveal=pending]>.hww-steps:after{scale:0 1}[data-reveal=shown]>.hww-steps:after{transition:scale .9s var(--ease-in-out)}[data-reveal=pending]>.hww-steps .hww-dot{background-color:var(--color-white);color:var(--color-royal);box-shadow:inset 0 0 0 2px #0755b540}[data-reveal=shown]>.hww-steps .hww-dot{animation:hww-pop .4s var(--ease-out) both;animation-delay:calc(var(--step) * .12s);transition:background-color .2s var(--ease-out), color .2s var(--ease-out), box-shadow .2s var(--ease-out);transition-delay:calc(var(--step) * .12s)}}}}@keyframes hww-fill{0%{scale:0 1}}@keyframes hww-dot-fill{0%{background-color:var(--color-white);color:var(--color-royal);scale:1;box-shadow:inset 0 0 0 2px #0755b540}10%{background-color:var(--color-royal);color:var(--color-white);box-shadow:inset 0 0 0 2px var(--color-royal)}45%{scale:1.08}to{background-color:var(--color-royal);color:var(--color-white);box-shadow:inset 0 0 0 2px var(--color-royal);scale:1}}@keyframes hww-pop{50%{scale:1.08}}
@media not (min-width:64rem){.why-grid--full .why-card{flex-flow:wrap;align-items:center;gap:.75rem 1rem;padding:20px;display:flex}.why-grid--full .why-card>h3{flex:10rem;min-width:0;margin-top:0}.why-grid--full .why-card>p{flex-basis:100%;margin-top:0}@container why not (min-width:40rem){.why-grid{grid-template-columns:minmax(0,1fr);gap:.75rem}.why-grid--full{gap:1rem}.why-grid--compact .why-card{text-align:left;flex-flow:wrap;align-items:center;gap:.75rem 1rem;padding:16px;display:flex}.why-grid--compact .why-card>h3{flex:10rem;min-width:0;margin-top:0}}@container why (min-width:40rem){.why-grid--compact{grid-template-columns:repeat(8,minmax(0,1fr))}.why-grid--compact>*{grid-column:span 2}.why-grid--compact>:nth-child(5){grid-column:2/span 2}.why-grid--full{grid-template-columns:repeat(2,minmax(0,1fr))}.why-grid--full>:last-child{grid-column:1/-1}}}
