, and the global p rule in css/elements/_typography.css sets font-size directly on that
at the same breakpoints — an element's own direct rule always wins over an inherited value regardless of specificity, so without !important these sizes get silently overridden (same reason p.xl needs !important for its own breakpoint override, see _typography.css). */.hero-new__description p{font-size:.875rem!important}@media (min-width:415px){.hero-new__description p{font-size:1rem!important}}@media (min-width:1440px){.hero-new__description p{font-size:1.125rem!important}}@media (min-width:1920px){.hero-new__description p{font-size:1.5rem!important}}.hero-new--no-media .hero-new__description,.hero-new--stacked .hero-new__description{margin-inline:auto}.hero-new__cta-row{align-items:center;display:flex;flex-wrap:wrap;gap:1rem}.hero-new--no-media .hero-new__cta-row,.hero-new--stacked .hero-new__cta-row{justify-content:center}.hero-new__below-buttons{color:var(--hero-new-text-muted);font-size:.875rem}.hero-new__ratings{align-items:center;display:flex;flex-wrap:wrap;gap:.5rem;margin-top:2rem}.hero-new--no-media .hero-new__ratings,.hero-new--stacked .hero-new__ratings{justify-content:center}.hero-new__rating-badge{align-items:center;color:#6b757e;display:inline-flex;font-size:var(--font-size-sm,.875rem);font-weight:700;gap:.375rem;letter-spacing:.1em;text-transform:uppercase}.hero-new__rating-badge .fa-star{bottom:1px;color:#6b757e;font-size:inherit;position:relative}.hero-new__media-col{align-items:center;backdrop-filter:blur(2px);display:flex;justify-content:center}.hero-new__media-container{border-radius:2rem;overflow:hidden;position:relative;width:100%}.hero-new__media-img{display:block;height:auto;object-fit:contain;width:100%}.hero-new__webm-fallback{display:none}.hero-new__webm-fallback.is-visible{display:block} /* !important on every property here, not just the :not() exclusion added to the global rule in css/elements/_buttons.css — same belt-and-suspenders approach .progressive-form__modal-close already uses against this same rule (see css/main.css). Guarantees this wins regardless of stylesheet load order or CDN/browser caching lag on the other file. */.hero-new__video-trigger{align-items:normal!important;background:none!important;background-color:transparent!important;border:none!important;border-radius:0!important;box-shadow:none!important;color:inherit!important;cursor:pointer!important;display:block!important;gap:0!important;height:100%!important;justify-content:normal!important;margin:0!important;overflow:visible!important;padding:0!important;position:relative!important;text-align:left!important;text-decoration:none!important;transform:none!important;transition:none!important;white-space:normal!important;width:100%!important}.hero-new__video-trigger:after{content:url(https://shipperhq.com/hubfs/ShipperHQ%20Theme/default/play.png);height:4rem;left:50%;opacity:80%;position:absolute;top:50%;transform:translate(-50%,-50%);transition:opacity .4s ease;width:4rem}.hero-new__video-trigger:focus-visible:after{opacity:100%}@media (hover:hover) and (pointer:fine){.hero-new__video-trigger:hover:after{opacity:100%}}.hero-new__video-modal{align-items:center;background-color:rgba(15,14,12,.85);display:flex;inset:0;justify-content:center;opacity:0;padding:var(--space-6);position:fixed;transition:opacity var(--transition-default),visibility 0s linear var(--duration-base);visibility:hidden;z-index:var(--z-modal)}.hero-new__video-modal.is-open{opacity:1;transition:opacity var(--transition-default),visibility 0s linear;visibility:visible}.hero-new__video-modal-panel{aspect-ratio:16/9;max-width:75rem;position:relative;transform:translateY(1rem) scale(.98);transition:transform var(--transition-default);width:100%}.hero-new__video-modal.is-open .hero-new__video-modal-panel{transform:translateY(0) scale(1)}.hero-new__video-modal-panel:focus{outline:none}.hero-new__video-modal-frame{height:100%;width:100%}.hero-new__video-modal-frame iframe{border:none;display:block;height:100%;width:100%}.hero-new__video-modal-close{align-items:center;background:none!important;background-color:transparent!important;border:none!important;border-radius:var(--radius-full)!important;box-shadow:none!important;color:var(--primitive-vapor-white,#fff)!important;cursor:pointer;display:flex!important;gap:0!important;height:2rem;justify-content:center;min-width:0;overflow:visible!important;padding:0!important;position:absolute;right:0;top:-2.75rem;transform:none!important;transition:background-color var(--transition-fast),color var(--transition-fast)!important;width:2rem}.hero-new__video-modal-close:before{content:none!important;display:none!important}.hero-new__video-modal-close:focus-visible{background-color:hsla(0,0%,100%,.12)!important;box-shadow:none!important;color:var(--primitive-vapor-white,#fff)!important;transform:none!important}@media (hover:hover) and (pointer:fine){.hero-new__video-modal-close:hover{background-color:hsla(0,0%,100%,.12)!important;box-shadow:none!important;color:var(--primitive-vapor-white,#fff)!important;transform:none!important}}.hero-new__video-modal-close:focus-visible{outline:2px solid var(--color-focus);outline-offset:2px}.hero-new__video-modal-close svg{height:1.125rem;width:1.125rem}.hero-new__breadcrumbs{margin-bottom:1rem;width:100%}.hero-new__breadcrumbs .breadcrumb-list{align-items:center;color:var(--hero-new-text-muted);display:flex;font-size:.875rem;gap:.5rem;list-style:none;margin:0;padding:0}.hero-new__breadcrumbs .breadcrumb-link{color:var(--hero-new-text-muted);text-decoration:none}.hero-new__breadcrumbs .breadcrumb-item.current{color:var(--hero-new-text)}