/* Homepage shortcuts: coordinated blue two-tone vector icons. */
.hero-section.hero-section .hero-feature{display:grid;grid-template-columns:44px minmax(0,1fr);grid-template-rows:auto auto;column-gap:18px;row-gap:6px;align-content:center;align-items:center;transition:background-color .18s ease}
.hero-section.hero-section .hero-feature::before{content:"";grid-column:1;grid-row:1/3;display:block;width:44px;height:44px;background:center/contain no-repeat;pointer-events:none}
.hero-section.hero-section .hero-feature__kicker{grid-column:2;grid-row:1;line-height:1.5;align-self:end}
.hero-section.hero-section .hero-feature__title{grid-column:2;grid-row:2;margin:0;line-height:1.5;align-self:start}
.hero-section.hero-section .hero-feature:nth-child(1)::before{background-image:url("/branding/hero/features/cloud.svg")}
.hero-section.hero-section .hero-feature:nth-child(2)::before{background-image:url("/branding/hero/features/globe.svg")}
.hero-section.hero-section .hero-feature:nth-child(3)::before{background-image:url("/branding/hero/features/server.svg")}
.hero-section.hero-section .hero-feature:nth-child(4)::before{background-image:url("/branding/hero/features/billing.svg")}
.hero-section.hero-section .hero-feature:nth-child(5)::before{background-image:url("/branding/hero/features/support.svg")}
@media(hover:hover){.hero-section.hero-section .hero-feature:hover{background-color:#f4f8ff}.hero-section.hero-section .hero-feature:hover .hero-feature__title{color:#0052d9}}
@media(min-width:961px) and (max-width:1280px){.hero-section.hero-section .hero-feature{grid-template-columns:36px minmax(0,1fr);column-gap:12px;padding-inline:16px}.hero-section.hero-section .hero-feature::before{width:36px;height:36px}.hero-section.hero-section .hero-feature__title{font-size:15px}}
@media(max-width:960px){.hero-section.hero-section .hero-feature{grid-template-columns:34px minmax(0,1fr);column-gap:12px;row-gap:4px;min-height:82px;box-sizing:border-box}.hero-section.hero-section .hero-feature::before{width:34px;height:34px}.hero-section.hero-section .hero-feature__title{margin:0;font-size:14px;line-height:1.5}}
@media(max-width:380px){.hero-section.hero-section .hero-feature{grid-template-columns:30px minmax(0,1fr);column-gap:9px;padding-inline:12px}.hero-section.hero-section .hero-feature::before{width:30px;height:30px}.hero-section.hero-section .hero-feature__title{font-size:13px}}
@media(prefers-reduced-motion:reduce){.hero-section.hero-section .hero-feature{transition:none}}
