.hero-banner{--section-padding-inline: var(--padding-inline-section-mobile, var(--section-padding-inline-mobile))}@media screen and (min-width: 750px){.hero-banner{--section-padding-inline: var(--padding-inline-section-desktop, var(--section-padding-inline-desktop))}}.hero-banner{padding-top:var(--padding-top-section-mobile, 0);padding-bottom:var(--padding-bottom-section-mobile, 0)}@media screen and (min-width: 750px){.hero-banner{padding-top:var(--padding-top-section-desktop, 0);padding-bottom:var(--padding-bottom-section-desktop, 0)}}.hero-banner__box{position:relative;overflow:hidden;background-color:rgb(var(--color-surface));border-radius:var(--hero-banner-border-radius-top, 32px) var(--hero-banner-border-radius-top, 32px) var(--hero-banner-border-radius-bottom, 32px) var(--hero-banner-border-radius-bottom, 32px)}.hero-banner__media{display:block;width:100%}@media screen and (min-width: 750px){.hero-banner__media{position:absolute;inset:0}}.hero-banner__image{display:block;width:100%;height:var(--hero-banner-image-height-mobile, 256px);-o-object-fit:cover;object-fit:cover;-o-object-position:var(--hero-banner-image-position-mobile, center);object-position:var(--hero-banner-image-position-mobile, center)}@media screen and (min-width: 750px){.hero-banner__image{height:100%;-o-object-position:center;object-position:center}}.hero-banner__box--gradient .hero-banner__media::after{content:"";display:none}@media screen and (min-width: 750px){.hero-banner__box--gradient .hero-banner__media::after{display:block;position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(90deg, rgba(var(--hero-banner-gradient-color, var(--color-surface)), 0.98) var(--hero-banner-gradient-start, 36%), rgba(var(--hero-banner-gradient-color, var(--color-surface)), 0.1) var(--hero-banner-gradient-end, 99%))}}.hero-banner__inner{position:relative}.hero-banner__content{display:flex;flex-direction:column;gap:40px;width:100%;max-width:var(--hero-banner-content-max-width, 520px);padding-block:var(--hero-banner-content-padding-block-mobile, 24px);padding-top:var(--hero-banner-content-padding-top-mobile, 16px);padding-bottom:var(--hero-banner-content-padding-bottom-mobile, 24px)}@media screen and (min-width: 750px){.hero-banner__content{gap:48px;padding-top:var(--hero-banner-content-padding-top-desktop, 64px);padding-bottom:var(--hero-banner-content-padding-bottom-desktop, 64px)}}.hero-banner__text{display:flex;flex-direction:column;align-items:flex-start;gap:16px}@media screen and (min-width: 750px){.hero-banner__text{gap:24px}}.hero-banner__title{font-size:var(--font-size-h2, 2.8rem);font-weight:700;line-height:1.2;letter-spacing:var(--letter-spacing-heading, 0.024rem)}@media screen and (min-width: 750px){.hero-banner__title{font-size:var(--font-size-h2, 3.2rem)}}.hero-banner__title{font-size:4rem;color:rgb(var(--color-primary));line-height:1;text-transform:capitalize;overflow-wrap:break-word}@media screen and (min-width: 750px){.hero-banner__title{font-size:4.8rem}}.hero-banner__title-highlight--accent{color:rgb(var(--color-accent))}.hero-banner__title-highlight--primary{color:rgb(var(--color-primary))}.hero-banner__title-highlight--critical{color:rgb(var(--color-critical))}.hero-banner__title-highlight--secondary{color:rgb(var(--color-secondary))}.hero-banner__title-highlight--new-line{display:block}.hero-banner__description{font-size:1.4rem;line-height:1.6;color:rgba(var(--color-secondary), 0.88)}@media screen and (min-width: 750px){.hero-banner__description{font-size:1.6rem}}.hero-banner__description>*+*{margin-top:12px}.hero-banner__features{display:flex;flex-wrap:wrap;gap:8px 32px;list-style:none}.hero-banner__body{display:flex;flex-direction:column;align-items:flex-start;gap:16px;width:100%}.hero-banner__feature{display:flex;align-items:center;gap:8px}.hero-banner__feature-icon{display:inline-flex;flex-shrink:0;width:16px;height:16px;color:rgb(var(--color-secondary))}.hero-banner__feature-icon svg{display:block;width:100%;height:100%}.hero-banner__feature-text{font-size:1.4rem;line-height:1.6;color:rgba(var(--color-secondary), 0.88)}@media screen and (min-width: 750px){.hero-banner__feature-text{font-size:1.6rem}}.hero-banner__buttons{display:flex;flex-direction:column;gap:12px;width:100%}.hero-banner__buttons .btn{width:100%}@media screen and (min-width: 750px){.hero-banner__buttons{flex-direction:row;flex-wrap:wrap;gap:16px}.hero-banner__buttons .btn{width:auto}}