docs: show banner on mobile again and reduce padding on small screens

site/assets/scss/_masthead.scss

 .bd-masthead {
   --bd-pink-rgb: #{to-rgb($pink)};
-  padding: 3rem 0;
   // stylelint-disable
   background-image: linear-gradient(180deg, rgba(var(--bs-body-bg-rgb), .01), rgba(var(--bs-body-bg-rgb), 1) 85%),
                     radial-gradient(ellipse at top left, rgba(var(--bs-primary-rgb), .5), transparent 50%),

site/layouts/partials/home/masthead.html

-<div class="bd-masthead mb-3" id="content">
+<div class="bd-masthead mb-3 py-4 py-lg-5" id="content">
   <div class="container-xxl bd-gutter">
     <div class="col-md-8 mx-auto text-center">
       <a class="d-flex flex-column flex-lg-row justify-content-center align-items-center mb-4 text-dark lh-sm text-decoration-none" href="https://blog.getbootstrap.com/">
         <strong class="d-sm-inline-block p-2 me-2 mb-2 mb-lg-0 rounded-3 masthead-notice">New in v5.3</strong>
         <span class="text-body-secondary">Color mode support, expanded color palette, and more!</span>
       </a>
-      <img class="d-none d-sm-block mx-auto mb-3"
+      <img class="mx-auto mb-3"
            srcset="/docs/{{ .Site.Params.docs_version }}/assets/brand/bootstrap-logo-shadow.png,
                    /docs/{{ .Site.Params.docs_version }}/assets/brand/bootstrap-logo-shadow@2x.png 2x"
            src="/docs/{{ .Site.Params.docs_version }}/assets/brand/bootstrap-logo-shadow.png"